@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); /* font-family: 'Nanum Gothic', serif; */
@import url(//cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css); /* font-family: 'Nanum Square', sans-serif; */

::selection {background-color:#1e94ec; color:#fff;}

/* 초기화 */
html {overflow-y:scroll;}
body {margin:0;padding:0;font-size:0.75em;font-family: 'Nanum Gothic', serif;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family: 'Nanum Gothic', serif;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul {padding:0px; margin:0px;}
li {list-style:none}

#hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-family: 'Nanum Gothic', serif;font-size:1em}
button {cursor:pointer}

textarea, select {font-family: 'Nanum Gothic', serif;font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:#000;text-decoration:none}
a:hover, a:focus, a:active {color:#000;text-decoration:none}


/* Head */
#head {}
#head ul {display:inline-block; width:100%; border-bottom:1px solid #e5e5e5;}
#head li {width:100%; margin:0 auto;}
#head li.menu {width:100%;}
#head li.menu span.logo { display:inline-block; width:100%; text-align:center; padding:25px 0;}
#head li.menu span.logo img {width:150px;}
#head li.menu a.menu { padding:25px; position:absolute;}
#head li.menu a.menu img {width:30px;}

/* Location */
#head ul.location { display:inline-block; width:100%;}
#head ul.location li {width:1200px; margin:0 auto; padding:8px 0 10px 0;}
#head ul.location li span { color:#666;}
#head ul.location li span.icon { display:inline-block; padding:0 7px;}
#head ul.location li span.here { color:#000; font-weight:bold;}


/* Dropdown Menu */
#wrap{position:relative;clear:both;width:100%;}

#gnb {position:absolute; top:80px;width:100%; z-index:999;}
#gnb:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap{width:100%; margin:0 auto; }
#gnb .gnb_wrap:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul{width:1200px; margin:0 auto; text-align:right; padding-left:195px; box-sizing:border-box;}
#gnb .gnb_wrap>ul:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul>li{text-align:center; float:left;}
#gnb .gnb_wrap>ul>li a.dep01{color:#000; font-size:15px; margin-left:35px; letter-spacing:-0.5px;}
#gnb .gnb_wrap>ul>li.slc a.dep01 {color:#febd17;}
#gnb .gnb_wrap>ul>li.ov a.dep01 {color:#000;}
#gnb .gnb_wrap>ul>li.on a.dep01 {color:#1ea4dd; font-weight:bold; border-bottom:3px solid #1ea4dd; padding-bottom:17px;}

#gnb .gnb_wrap>ul>li div.dep02 {background:#fff; width:100%; position: absolute; top: 45px; left: 0; z-index: 9900; color:#000; line-height:1.5; text-align:left;display:none;}
#gnb .gnb_wrap>ul>li div.dep02 a {color:#000;}
#gnb .gnb_wrap>ul>li div.dep02 a:hover {color:#1ea4dd;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav {max-height:330px;width:1200px;margin:auto;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav:after{display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav {float:left; width:1200px; padding-left:230px;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav:after{display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav {float:left;padding:20px 0;min-height:315px;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li {margin:6px 0 10px 0;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li:first-child {margin-top:0px;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li>a{display:block; font-size:13px; line-height:130%;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li.dep02_nav_btn{margin:0 0 0 20px;min-height:30px;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li.dep02_nav_btn>a{display:block;padding:0;height:30px;line-height:30px;font-size:14px;font-weight:bold;background:none;}

#gnb .gnb_wrap>ul>li div.dep02 .dep03{width:208px;margin-left:40px;margin-top:4px;}
#gnb .gnb_wrap>ul>li div.dep02 .dep03:after{display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul>li div.dep02 .dep03>li{	}
#gnb .gnb_wrap>ul>li div.dep02 .dep03>li a{;color:#e1e1e1;display:block;font-size:12px;font-weight:normal;height:18px;line-height:18px;color:#e1e1e1;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li ul.dep03>li:first-child a{margin-left:0;}


/* Sub Page */
#contents {}
#contents ul {}
#contents li {}
#contents ul.section1 {display:block;}
#contents ul.section1 li {}
#contents ul.section1 li span { display:inline-block; width:100%;}
#contents ul.section1 span.text_st1 { font-size:2.5em; color:#fff; margin:90px 0 20px 0; font-family: 'Nanum Square', sans-serif;}
#contents ul.section1 span.text_st2 { font-size:1.5em; color:#fff; font-family: 'Nanum Square', sans-serif;}

#contents ul.section2 {display:block;}
#contents ul.section2 li { padding:50px 20px;}
#contents ul.section2 li span {}
#contents ul.section2 li span.text_st1 { display:inline-block; width:100%; text-align:center; font-size:1.5em; line-height:160%;}
#contents ul.section2 li span.text_st1 span.point { font-weight:bold; color:#1ea4dd;}
#contents ul.section2 li span.text_st2 { display:inline-block; width:100%; text-align:center; font-size:1.3em; line-height:160%; color:#555; margin:40px 0 70px 0;}

.icon_box {}
.icon_box ul { display:inline-block; width:100%;}
.icon_box li {width:100%; margin:0 auto; padding:0px !important;}
.icon_box li span.icon_view { width:33.33%; float:left; text-align:center;}
.icon_box li span.icon_view img {width:70px; margin-bottom:25px;}
.icon_box li span.icon_view span { display:inline-block; width:100%;}
.icon_box li span.icon_view span.title {font-size:1.2em; font-weight:bold; letter-spacing:-1px;}
.icon_box li span.icon_view span.line {width:30px; height:4px; background:#1ea4dd; border-radius:3px; margin:20px 0 0 0;}

#contents ul.section3 {display:block;}
#contents ul.section3 li {}
#contents ul.section3 li span { display:inline-block; width:100%;}
#contents ul.section3 span.text_st1 { font-size:1.7em; margin:50px 0 0 0; font-family: 'Nanum Square', sans-serif;}
#contents ul.section3 span.text_st2 { font-size:2em; line-height:130%; font-family: 'Nanum Square', sans-serif;}
#contents ul.section3 span.text_st3 { font-size:1.2em; line-height:160%; padding:30px 0 0 0;} 

#contents ul.section4 {display:block;}
#contents ul.section4 li {}

#contents ul.section5 {display:block;}
#contents ul.section5 li {display:inline-block; width:100%;} /*사파리 마진값*/

#contents ul.section6 {display:block;}
#contents ul.section6 li {display:inline-block; width:100%; padding:50px 20px 30px 20px; box-sizing:border-box; background:#fafafa;}
#contents ul.section6 li img {width:100%;}

#contents ul.section7 {display:block;}
#contents ul.section7 li {display:inline-block; width:100%; padding:50px 0 10px 0;}
#contents ul.section7 span.btn_area { display:inline-block; width:100%; text-align:center; margin:120px 0 0 0;}
#contents ul.section7 a.btn_list { display:inline-block; padding:15px 50px; font-size:20px; background:#333; color:#fff;}


#solution {width:100%; margin:0 auto;}
#solution ul {}
#solution li {}
#solution li.roll {width:100% !important; float:left; padding:0 !important;}
#solution li.info {width:100% !important; float:left; padding:50px 0 50px 0;} /*사파리 마진값*/

#solution span { display:inline-block; width:100%; box-sizing:border-box;}
#solution span.item_box_in {}
#solution span.explain { display:block; font-size:1.3em; padding:0 30px 0 30px; box-sizing:border-box; text-align:center; line-height:160%; color:#555;}  /*사파리 마진값*/
#solution span.explain2 { font-size:1.3em; padding:0 0px 30px 0; box-sizing:border-box; text-align:left; line-height:160%; color:#555}

#solution li.photo {width:100% !important; padding:20px 0 0 0 !important;}
#solution li.photo span.ph_box {width:47.5% !important; margin-right:5%; float:left;}
#solution li.photo span.ph_box:nth-child(2n) {margin-right:0px;}
#solution li.photo span.ph_box:last-child {margin-right:0px;}
#solution li.photo span.ph_box span.text { padding:10px 0 20px 0; font-size:1.3em;}
#solution li.photo span.ph_box span.num { width:100%; padding-bottom:5px; font-weight:800; color:#1ea4dd;}

span.item_box { display:inline-block; width:100% !important; height:450px; padding:0 0px; text-align:center; box-sizing:border-box; margin-top:-270px; border:0px solid #ddd;}

span.category { display:inline-block; width:100%; color:#fff; text-align:center; font-size:1.5em;}
span.category2 { display:inline-block; width:100%; color:#000; text-align:center; font-size:1.5em;}
#solution span.title {display:inline-block; width:100%; color:#fff; text-align:center; font-size:2em; padding:20px 0 22px 0; letter-spacing:-1px;}
#solution span.title2 {display:inline-block; width:100%; color:#000; text-align:center; font-size:2em; padding:20px 0 22px 0; letter-spacing:-1px;}

iframe.solution_roll { width:100%; max-width:420px; height:100%; max-height:400px; border:0; }

#business_effect {}
#business_effect ul { display:inline-block; width:100%;}
#business_effect li {width:100% !important; padding:0 !important;}
#business_effect li span.text_box { display:inline-block; width:100%; }
#business_effect li.roll { padding:20px 0 !important; box-sizing:border-box;}
#business_effect span { display:inline-block; width:100%;}
#business_effect span.category {font-size:20px;}
#business_effect span.title { font-size:2em; text-align:center; padding:20px 0 32px 0; letter-spacing:-1px;}
#business_effect span.explain { font-size:1.3em; padding:0 20px 20px 20px; box-sizing:border-box; text-align:center; line-height:160%; color:#555}

/* Tail */
#tail {}
#tail ul { display:inline-block; width:100%; border-top:1px solid #eee; padding:35px 0; background:#fafafa;}
#tail li {width:100%; margin:0 auto; padding:0 20px; box-sizing:border-box;}

#tail li span.info { display:inline-block; width:100%; line-height:160%; font-size:1.2em; color:#666;}
#tail li span.info span.line { display:inline-block; padding:0 12px; color:#ccc;}
#tail li span.info span.copyright { display:inline-block; width:100%; padding:20px 0 0 0;}
#tail li span.info span.select_box { float:right;}
#tail li span.info span.select_box select.select_st { padding:8px; border:1px solid #ccc;}