@charset "utf-8";

/* Animation */
.user #slide_map .inner .binds #global .drop_btn span:after,
.user #slide_map .inner .binds #global ul li a,
.user #slide_map .inner .binds ul li a:after,
.user #header,
.user #header h1,
.user #header #global,
.user #header #global .drop_btn:after,
.user #header #global ul li a,
.user #header #gnb ul li,
.user #header #gnb ul li a,
.user #header #gnb ul li a:after,
.user #header #gnb ul li ul li a span,
.user #header .totalsearch,
.user #footer .top_btn a
{transition : all 0.3s ease; 
-webkit-transition : all 0.3s ease;}


/* layout */
body {position:relative; width:100%;}
body.fixed {position:fixed; width:100%;}
.js_mobile_check {display:none;}
.user #wrap {position:relative; overflow:hidden;}
.user .layout {position:relative; max-width:1200px; margin:0 auto;}
.user .layout:after {content:""; display:block; clear:both;}

a:hover,
a:link,
a:visited,
a:active{text-decoration:none;}


/* Header */
.user #slide_map {display:none;}
.user #header {width:100%; height:125px; padding-top:35px; box-sizing:border-box; position:relative; z-index:201;}
.user #header:after {content:""; display:block; width:100%; height:35px; background:#272727; position:absolute; left:0; top:0; z-index:1;}
.user #header h1 {position:absolute; top:58px; left:50%; width:98px; height:45px; margin-left:-600px; z-index:990;}
.user #header h1 a {display: block; width:100%;}
.user #header h1 a img {display:block;}
.user #header .home_btn {display:none;}
.user #header #global {position:absolute; top:0; right:50%; margin-right:-600px; width:auto; height:35px; z-index:51;}
.user #header #global .drop_btn {display:none; width:125px; height:45px; box-sizing:border-box; padding:12px 20px; position:relative;}
.user #header #global .drop_btn span {color:#e2e1e1;}
.user #header #global .drop_btn:after {content:""; display:block; position:absolute; right:17px; top:50%; margin-top:-2px; width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid #bebdbd;}
.user #header #global .drop_btn.on:after {transform:rotate(180deg); -webkit-transform:rotate(180deg);}
.user #header #global ul {/*position:absolute; width:100%; left:0; top:45px; background:#515151; display:block;*/ height:100%;}

/*Contact us*/
.user #header #global ul li:first-child a{opacity:0.7;}
.user #header #global ul li:first-child a:hover{opacity:1; background:none;}
.user #header #global ul li:first-child a span{opacity:1; width:auto; font-size:15px; vertical-align:middle;}
.user #header #global ul li:first-child a:hover span{padding:0;}
.user #header #global ul li:first-child a img{width:auto; height:auto; padding-right:5px; vertical-align:middle;}

.user #header #global ul li {/*border-top:1px solid #6f6f6f;*/ float:left; margin-top:6px; margin-left:8px;}
.user #header #global ul li a {display:block; overflow:hidden; color:#e2e1e1; position:relative; height:24px; min-width:24px; box-sizing:border-box; padding:3px; text-align:center; border-radius:13px; -webkit-border-radius:13px;}
.user #header #global ul li a img {display:inline-block; vertical-align:top; width:19px; height:18px;}
.user #header #global ul li a span {opacity:0; width:0; display:inline-block; margin-left:0; overflow:hidden; font-size:13px; line-height:18px;}
.user #header #global ul li a:hover,
.user #header #global ul li a:active {background:#515151;}
.user #header #global ul li a:hover span {opacity:1; width:auto; padding:0 5px;}
.user #header #gnb {width:100%; height:90px;}
.user #header #gnb #blind {width:100%; height:100%; overflow:hidden; background:#fff; position:absolute; left:0; top:124px; z-index:1; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; display:none;}	
.user #header #gnb .layout {box-sizing:border-box; padding:0 52px 0 0; z-index:10;}
.user #header #gnb ul {width:auto; float:right;}
.user #header #gnb ul li {float:left; margin-right:80px;}
.user #header #gnb ul li a {display:block; font-size:23px; height:90px; line-height:90px; position:relative; text-decoration:none;}
.user #header #gnb ul li a span {color:#444;}
.user #header #gnb ul li a:after {content:""; display:block; width:0; height:2px; background:#00579d; left:50%; bottom:0px; position:absolute;}
.user #header #gnb ul li a span:hover,
.user #header #gnb ul li a span:active,
.user #header #gnb ul li a.on span,
.user #header #gnb ul li a.active span {color:#00579d;}
.user #header #gnb ul li a:hover:after,
.user #header #gnb ul li a:active:after,
.user #header #gnb ul li a.on:after,
.user #header #gnb ul li a.active:after {width:100%; left:0;}
.user #header #gnb ul li ul {position:absolute; float:none; left:0; top:90px; z-index:10; width:100%; box-sizing:border-box; padding:10px 0 35px 0; display:none; opacity:0; -webkit-opacity:0;}
.user #header #gnb ul li ul li {width:23.5%; margin-right:2%; margin-top:25px;}
.user #header #gnb ul li ul li:nth-child(4n) {margin-right:0;}
.user #header #gnb ul li ul li a {height:56px; line-height:20px; box-sizing:border-box; background:#eaeaea; text-align:center; display:table; width:100%;}
.user #header #gnb ul li ul li a span {display:table-cell; vertical-align:middle; color:#727272; font-size:18px; line-height:20px; padding:0 5%;}
.user #header #gnb ul li ul li a:after {display:none;}
.user #header #gnb ul li ul li a span:hover,
.user #header #gnb ul li ul li a span:active,
.user #header #gnb ul li ul li a.on span,
.user #header #gnb ul li ul li a.active span {background:#858890; color:#fff;}
.user #header #gnb ul li ul li ul {position:relative; left:auto; top:auto; width:auto; display:block; opacity:1; -webkit-opacity:1; padding:15px 0 0 0;}
.user #header #gnb ul li ul li ul li {float:none; width:auto; margin:0 !important;}
.user #header #gnb ul li ul li ul li a {display:inline-block; width:auto; background:none !important; height:auto; text-align:left;}
.user #header #gnb ul li ul li ul li a span {display:inline-block; vertical-align:top; padding:5px 0 5px 20px; font-size:16px; line-height:19px; color:#929292; background:none !important;}
.user #header #gnb ul li ul li ul li a span:after {content:""; display:block; width:8px; height:3px; background:#898989; position:absolute; left:2px; top:14px;}
.user #header #gnb ul li ul li ul li a:hover span,
.user #header #gnb ul li ul li ul li a:active span,
.user #header #gnb ul li ul li ul li a.on span,
.user #header #gnb ul li ul li ul li a.active span {color:#3f454d; text-decoration:underline;}
.user #header .totalsearch {display:none; position:absolute; top:54px; right:50%; margin-right:-600px; z-index:10; overflow:hidden;}
.user #header .totalsearch .btns {display:block; float:right; width:51px; height:51px; border:1px solid #777; overflow:hidden; text-indent:-9999px; background:url(../../images/chn/layout/find_btn.png) no-repeat center 50%;}
.user #header .totalsearch .find_box {position:absolute; display:none; right:-500px; top:0; background:#31384b; width:500px;}
.user #header .totalsearch .find_box input[type="text"] {border:0; font-size:16px; height:53px; padding:0 15px; line-height:53px; background:none; color:#e6e6e6; float:left; width:404px; box-sizing:border-box;}
.user #header .totalsearch .find_box input[type="text"]::-webkit-input-placeholder {color:#e6e6e6;}
.user #header .totalsearch .find_box input[type="text"]:-moz-placeholder {color:#e6e6e6;}
.user #header .totalsearch .find_box input[type="text"]::-moz-placeholder {color:#e6e6e6;}
.user #header .totalsearch .find_box input[type="text"]:-ms-input-placeholder {color:#e6e6e6;}
.user #header .totalsearch .find_box input[type="submit"] {border:0; width:43px; height:53px; background:url(../../images/chn/layout/find_btn_ov.png) no-repeat center 50%; overflow:hidden; text-indent:-9999px; float:left;}
.user #header .totalsearch .find_box .close_btn {border:0; width:53px; height:53px; background:url(../../images/chn/layout/find_close.png) no-repeat center 50%; overflow:hidden; text-indent:-9999px; float:left;}
.user #header .mob_menu {display:none;}


/* Footer */
.user #footer {width:100%; height:auto; padding:35px 0; background-color:#1f1f1f; box-sizing:border-box;}
.user #footer .info {width:100%; height:auto; padding-right:300px; box-sizing:border-box;}
.user #footer address {font-style:normal;}
.user #footer address span:before {content:"ㅣ"; display:inline-block; padding:0 2px;}
.user #footer address span:first-child:before {display:none;}
.user #footer address,
.user #footer address a,
.user #footer address span,
.user #footer .copy{
	line-height:23px; font-size:15px; color:#777777;
	transition:font-size 0.3s ease;
	-webkit-transition:font-size 0.3s ease;
}
.user #footer .sns,
.user #footer .top_btn {position:fixed; right:20px; bottom:20px;}
.user #footer .sns {
	top:10px; right:100px;
	transition:right 0.4s ease;
	-webkit-transition:right 0.4s ease;
}
.user #footer .sns ul {overflow: hidden;}
.user #footer .sns ul li {float:left; padding-left:20px;}
.user #footer .sns ul li:first-child {padding-left:0;}
.user #footer .sns ul li a{
	overflow: hidden; display: block; width:34px; height:34px; background-repeat:no-repeat; background-position:center center; text-indent:-2000px;
	transition:background-image 0.3s ease;
	-webkit-transition:background-image 0.3s ease;
}
.user #footer .sns ul li a.facebook{background-image: url(../../images/chn/layout/sns_01.png);}
.user #footer .sns ul li a.instagram{background-image: url(../../images/chn/layout/sns_02.png);}
.user #footer .sns ul li a.twitter{background-image: url(../../images/chn/layout/sns_03.png);}
.user #footer .sns ul li a.youtube{background-image: url(../../images/chn/layout/sns_04.png);}
.user #footer .sns ul li a.facebook:hover{background-image: url(../../images/chn/layout/sns_01_ov.png);}
.user #footer .sns ul li a.instagram:hover{background-image: url(../../images/chn/layout/sns_02_ov.png);}
.user #footer .sns ul li a.twitter:hover{background-image: url(../../images/chn/layout/sns_03_ov.png);}
.user #footer .sns ul li a.youtube:hover{background-image: url(../../images/chn/layout/sns_04_ov.png);}

.user #footer .top_btn {
	width:53px; height:53px; z-index:51;
	opacity:0.7;
	transition:right 0.4s ease;
	-webkit-transition:right 0.4s ease;
}
.user #footer .top_btn a{overflow:hidden; display: block; padding:16px 0px; background-color:#999999; background-image:url(../../images/chn/layout/top_arrow.gif); background-repeat:no-repeat; background-position:center center; text-indent:-2000px; box-sizing:border-box;}
.user #footer .top_btn a:hover,
.user #footer .top_btn a:active {background-color:#6a7986; color:#fff;}


/* Visual */
#sub .visual{width:100%; height:auto;}
#sub .visual ul li{
	width:100%; height:250px; background-repeat:no-repeat; background-position:center center; background-size:cover;
	transition:height 0.3s ease;
	-webkit-transition:height 0.3s ease;
}
#sub .visual.step01 ul li{background-image: url(../../images/chn/layout/sub_bg01.jpg);}
#sub .visual.step02 ul li{background-image: url(../../images/chn/layout/sub_bg02.jpg);}
#sub .visual.step03 ul li{background-image: url(../../images/chn/layout/sub_bg03.jpg);}
#sub .visual.step04 ul li{background-image: url(../../images/chn/layout/sub_bg04.jpg);}
#sub .visual ul li .txts{display:table; width:100%; height:100%;}
#sub .visual ul li .txts .cell{display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle;}
#sub .visual ul li .txts h2{
	margin-top:-60px; font-size:45px; font-weight:500; color:#fff;
	transition:font-size 0.3s ease;
	-webkit-transition:font-size 0.3s ease;
}


/* Container */
#sub #container{}
#sub #container #txt{padding:50px 0 120px;}
#txt h3{
	position:relative; line-height:55px; margin-bottom:50px; font-size:48px; font-weight:500; text-align:center;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
#txt h3:before{content:""; display:block; width:45px; height:3px; background-color:#444; margin:0 auto 12px auto;}
#sub #container div[id*="cont_"]{min-height:195px;}

#sub #container #remote{position:relative; width:auto; max-width:1200px; margin:-55px auto 0 auto; z-index:21;}
#sub #container #remote .layout{overflow:visible;}
#sub #container #remote .js_menu.select{position:relative; z-index:100; width:100%; margin:0; background-color:#00957c; border:none; z-index:1;}

#sub #container #remote .js_menu.select .home{
	overflow:hidden; float:left; width:55px; height:55px; background-image:url(../../images/chn/layout/remote_home.png); background-repeat:no-repeat; background-position:center center; border-right:1px solid #4db5a4; text-align:center; text-indent:-2000px;
	transition : all 0.3s ease;
	-webkit-transition : all 0.3s ease;
}
#sub #container #remote .js_menu.select .home:hover{background-color:#085c4d;}

#sub #container #remote .js_menu.select .js_menu_select{float:left; width:35%; height:55px; padding:0 30px; border-right:1px solid #4db5a4; box-sizing:border-box;}
#sub #container #remote .js_menu.select .js_menu_select strong a{line-height:55px; font-size:18px; font-weight:300; color:#fff; position:relative;}
#sub #container #remote .js_menu.select .js_menu_select{position:relative;}
#sub #container #remote .js_menu.select .js_menu_select strong{}
#sub #container #remote .js_menu.select .js_menu_select strong a{overflow: hidden; position:relative; display:block; width:100%; padding-right:25px;  text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box;}
#sub #container #remote .js_menu.select .js_menu_select strong a:after{content:""; position:absolute; top:50%; right:0; width:15px; height:8px; margin-top:-4px; background-image:url(../../images/chn/layout/remote_arrow.png); background-repeat:no-repeat; background-position:center center; background-size:100%;
transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}
#sub #container #remote .js_menu.select .js_menu_select strong a.on:after{transform:rotate(180deg); -webkit-transform:rotate(180deg);}

#sub #container #remote .js_menu.select .js_menu_select ul{display:none; position:absolute; left:0; top:55px; width:100%; background:#085c4d;}
#sub #container #remote .js_menu.select .js_menu_select ul li{display:table; width:100%; height:55px; border-top:1px solid #397d71;}
#sub #container #remote .js_menu.select .js_menu_select ul li:first-child{border-top:0;}
#sub #container #remote .js_menu.select .js_menu_select ul li a{position:relative; display:table-cell;  width:100%; height:100%; line-height:20px; padding:0 30px 0 43px; text-decoration:none; font-size:18px; font-weight:300; vertical-align:middle; color:#8abfb4;}
#sub #container #remote .js_menu.select .js_menu_select ul li a:before{content:""; position:absolute; top:29px; left:30px; display:block; width:7px; height:2px; margin-right:7px; background-color:#8abfb4;}
#sub #container #remote .js_menu.select .js_menu_select ul li a:hover{text-decoration:underline; color:#fff;}
#sub #container #remote .js_menu.select .js_menu_select ul li a:hover:before{background-color:#fff;}

#sub #container #remote .gongu_btn,
#sub #container #remote .print_btn{display:block; position:absolute; top:0; z-index:30; width:30px; height:55px;}
#sub #container #remote .gongu_btn{right:60px;}
#sub #container #remote .print_btn{right:20px;}
#sub #container #remote .gongu_btn .gongu,
#sub #container #remote .print_btn .print{overflow:hidden; display:block; width:100%; height:100%; text-indent:-1000px;}
#sub #container #remote .gongu_btn .gongu:before,
#sub #container #remote .print_btn .print:before{
	opacity:0.7; content:""; display:block; position:absolute; left:0; top:0; width:100%; height:100%; background-position:center center; background-repeat:no-repeat;
	transition : all 0.3s ease;
	-webkit-transition : all 0.3s ease;
}
#sub #container #remote .gongu_btn .gongu:before{background-image:url(../../images/chn/content/icon_gongu.png);}
#sub #container #remote .print_btn .print:before{background-image:url(../../images/chn/content/icon_print.png);}
#sub #container #remote .gongu_btn .gongu:hover:before,
#sub #container #remote .print_btn .print:hover:before{opacity:1;}

#sub #container .gongu_btn .sharebox{display:none; position:absolute; right:0; top:65px;}
#sub #container .gongu_btn .sharebox a{overflow:hidden; display:block; width:30px; height:30px; padding:0; text-indent:-1000px; background-position:center center; background-repeat:no-repeat;}
#sub #container .gongu_btn .sharebox a.f{background-image:url(../../images/chn/content/icon_f.png); padding-bottom:10px;}
#sub #container .gongu_btn .sharebox a.t{background-image:url(../../images/chn/content/icon_t.png);}

#sub #container #remote .gongu_btn.share_on .gongu:before{background-image: url(../../images/chn/content/sns_close.png);}
#sub #container #remote .gongu_btn.share_on .sharebox{display:block;}