@charset "utf-8";
/* 공통 */
#wrap,
#wrap .layout,
#header,
#header h1,
#header h1 a,
#header .js_menu,
#header .js_menu ul li,
#header .js_menu ul li a,
#header #global,
#header #global [class*="btn_"],
#header #top_util,
#header .totalsearch a.button,
#totalsearch_input,
#totalsearch_input .box,
#footer,
#footer .layout,
#footer .menu,
#footer .menu .layout,
#footer .menu ul,
#footer .menu ul li,
#footer .menu ul li a,
#footer .relate_site,
#footer .relate_site div,
#footer address,
#footer .copy,
#sub #visual,
#sub #container,
#sub #container #content_box,
#sub #container #remote,
#txt,
#txt h3,
#path .path_etc ul li .sns_box ul li a[class*="btn_"],
#path .path_etc ul li .sns_box .btn_close img
{
	transition : all 0.5s ease;
    -webkit-transition : all 0.5s ease;
}



/***** Common *****/
.js_mobile_check {display:none;}
body {overflow-x:none;  position:relative; height:auto;}
.layout {width:100%; max-width:1200px; margin:0 auto; position:relative;}



/***** Header *****/
#header {position:absolute; left:0; top:0; z-index:51; width:100%; min-height:115px; height:115px; overflow:hidden;}
#header #top_util {width:100%; height:auto; background:#2d3039;}
#header #top_util .layout {height:35px;}
#header #top_util h1 {position:absolute; left:0px; top:58px; z-index:11;}
#header #top_util h1 a {overflow:hidden; display:block; width:auto; height:33px; font-size:25px; line-height:32px; font-weight:normal; color:#333; text-decoration:none;}
#header #top_util h1 a span {display:inline-block; vertical-align:top; background:url(/img/kh/common/logo.png) no-repeat left top; width:158px; height:34px; text-indent:-9999px; margin:0 10px 0 0;}
#header #top_util #global {position:absolute; right:0; top:0; z-index:12; border-right:1px solid #464b58; border-left:1px solid #1a1b20;}
#header #top_util #global:after {content:""; display:block; clear:both;}
#header #top_util #global a {display:inline-block; vertical-align:top; float:left; height:35px; line-height:35px; color:#dedfdf; text-align:center; font-size:15px; width:100px;
border-left:1px solid #464b58; border-right:1px solid #1a1b20;
transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}
#header #top_util #global a:hover, #header #top_util #global a:active {background:#000;}
#header #nav {width:100%; height:80px; position:relative;}	
#header #nav #blind {width:100%; height:100%; background:#23252b; position:absolute; left:0; top:80px; z-index:1;
-moz-opacity:0.98; -ms-opacity:0.98; -o-opacity:0.98; -webkit-opacity:0.98; opacity:0.98; filter:alpha(opacity=98);}
#header #nav .layout {z-index:10;}
#header #nav .layout .js_menu {width:auto; height:auto; padding:0 180px 0 300px; position:relative; z-index:10;}
#header #nav .layout .js_menu:after {content:""; display:block; clear:both;}
#header #nav .layout .js_menu ul {width:auto; height:auto; float:right;}
#header #nav .layout .js_menu ul:after {content:""; display:block; clear:both;}
#header #nav .layout .js_menu ul li {float:left; margin-left:40px;}
#header #nav .layout .js_menu ul li:first-child {margin-left:0;}
#header #nav .layout .js_menu ul li a {display:block; height:80px; font-size:20px; line-height:80px; text-align:center; text-decoration:none; color:#333;}
#header #nav .layout .js_menu ul li a.on, #header #nav .layout .js_menu ul li a:hover, #header #nav .layout .js_menu ul li a:active {color:#3766c8;}
#header #nav .layout .js_menu ul li .tmenu_ti {color:#4477e0; display:block; font-size:18px; line-height:24px; font-weight:normal; position:absolute; top:110px; padding:0 25px; display:none;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);}
#header #nav .layout .js_menu ul li ul {display:none; position:absolute; width:20%; left:0; padding:70px 0 30px 0; border-left:1px solid #393b41;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);}
#header #nav .layout .js_menu ul li:first-child ul {border-left:0;}
#header #nav .layout .js_menu ul li.num7 {display:none;}
#header #nav .layout .js_menu ul li.num1 .tmenu_ti {left:0;} 
#header #nav .layout .js_menu ul li.num2 .tmenu_ti {left:16%;}
#header #nav .layout .js_menu ul li.num3 .tmenu_ti {left:35%;}
#header #nav .layout .js_menu ul li.num4 .tmenu_ti {left:50%;}
#header #nav .layout .js_menu ul li.num5 .tmenu_ti {left:67%;}
#header #nav .layout .js_menu ul li.num6 .tmenu_ti {left:84%;}
#header #nav .layout .js_menu ul li.num1 ul {left:0;}
#header #nav .layout .js_menu ul li.num2 ul {left:16%;}
#header #nav .layout .js_menu ul li.num3 ul {left:35%;}
#header #nav .layout .js_menu ul li.num4 ul {left:50%;}
#header #nav .layout .js_menu ul li.num5 ul {left:67%;}
#header #nav .layout .js_menu ul li.num6 ul {left:84%;}
#header #nav .layout .js_menu ul li ul li {float:none; width:auto; padding:0 20px; margin:5px 0 0 0;}
#header #nav .layout .js_menu ul li ul li a {display:inline-block; vertical-align:top; height:auto; font-size:15px; line-height:22px; text-align:left; color:#fff; padding:3px 8px;}
#header #nav .layout .js_menu ul li ul li a.on, #header #nav .layout .js_menu ul li ul li a:hover, #header #nav .layout .js_menu ul li ul li a:active {background:#3c5b9a; color:#fff;}
#header .totalsearch {position:absolute; right:50%; top:35px; margin-right:-600px; z-index:10;}
#header .totalsearch a.button {display:block; width:70px; height:80px; background:url(/img/kh/common/totalsearch_btn.png) no-repeat center top; margin-right:70px;}
#header .totalsearch a.button.on {background:#cfcfcf url(/img/kh/common/totalsearch_btn.png) no-repeat center -80px;
-moz-opacity:0.98; -ms-opacity:0.98; -o-opacity:0.98; -webkit-opacity:0.98; opacity:0.98; filter:alpha(opacity=98);}
#header .totalsearch a.button span {position:absolute; left:0; top:0; width:1px; height:1px; line-height:1px; visibility:hidden;}
#header .mob_btn {position:absolute; right:50%; top:35px; margin-right:-600px; z-index:10;}
#header .mob_btn a {display:block; width:70px; height:80px; background:url(/img/kh/common/all_btn.png) no-repeat center 50%;}
#header .mob_btn a span {position:absolute; left:0; top:0; width:1px; height:1px; line-height:1px; visibility:hidden;}
#header span.bg {display:block; position:absolute; left:0; top:35px; width:100%; height:80px; background:#fff; z-index:1;
-moz-opacity:0.85; -ms-opacity:0.85; -o-opacity:0.85; -webkit-opacity:0.85; opacity:0.85; filter:alpha(opacity=85);}
#totalsearch_input {position:absolute; left:50%; top:115px; z-index:15; background:#cfcfcf; width:100%; padding:45px 0; max-width:1200px; margin-left:-600px; display:none;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);}
#totalsearch_input .box {border:3px solid #828282; width:100%; max-width:610px; margin:0 auto; padding:5px 80px 5px 20px; position:relative;}
#totalsearch_input input[type="text"] {background:none; border:0; padding:0; width:100%; height:44px; line-height:44px; font-size:17px; color:#828282;}
#totalsearch_input input[type="submit"] {background:#828282 url(/img/kh/common/totalsearch_btn_go.png) no-repeat center 50%; border:0; display:block; width:60px; height:54px; text-indent:-9999px; position:absolute; right:0; top:0;}


/***** Main *****/
#main #container {width:100%; height:auto; font-size: 10px; line-height:1.5; font-family: 'Pretendard'; background: linear-gradient(180deg, #FFF 15.8%, #F5F0EA 87.87%)}
#main #container *{box-sizing: border-box;}
#main #container .in{display: block; width: 100%; max-width: calc(1200px + 40px); margin: 0 auto; padding: 0 20px;}
#main #container #sec01{position: relative; z-index: 1;  padding-top: 115px;}
#main #container #sec01 .js_slide{height: auto; padding: 81px 0 85px;}
#main #container #sec01 .js_slide .in{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 20px; position: relative; z-index: 1;}
#main #container #sec01 .js_slide .in .l{display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: flex-end; align-items: flex-start; flex: 1;}
#main #container #sec01 .js_slide .in .l strong{opacity: 0; display: block; color: #FFF; text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.20); font-family: "Buri"; font-size: 60px; font-weight: 700; line-height: 1.2; animation: sec01_ani2 0.7s linear 0.4s alternate forwards;}
#main #container #sec01 .js_slide .in .l p{opacity: 0; display: block; margin: 14px 0 0; font-size: 22px; font-weight: 400; line-height: 1.4; letter-spacing: -0.22px; color: #fff; animation: sec01_ani2 0.7s linear 0.65s alternate forwards;}
#main #container #sec01 .js_slide .in .l .control{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 6px; position: relative; left: auto; right: auto; bottom: auto; top: auto; width: auto; height: auto; margin-top: 40px; margin-bottom: 25px;}
#main #container #sec01 .js_slide .in .l .control ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 6px; position: relative; left: auto; right: auto; bottom: auto; top: auto; width: auto; height: auto;}
#main #container #sec01 .js_slide .in .l .control ul li{display: block; margin: 0;}
#main #container #sec01 .js_slide .in .l .control ul li a{display: block; width: 14px; height: 4px; border-radius: 0; box-shadow: none; background-color: #fff;}
#main #container #sec01 .js_slide .in .l .control ul li a{opacity: 0.5; display: block; width: 14px; height: 4px; border-radius: 0; box-shadow: none; background-color: #fff; transition: all 0.2s linear;}
#main #container #sec01 .js_slide .in .l .control ul li a.on{opacity: 1; width: 41px;}
#main #container #sec01 .js_slide .in .l .control a.btn_play,
#main #container #sec01 .js_slide .in .l .control a.btn_stop{position: relative; left: auto; right: auto; bottom: auto; top: auto; width: 20px; height: 20px; border: 0; background: url(/img/kh/main/sec01_img05.svg) no-repeat center center / 100% auto;}
#main #container #sec01 .js_slide .in .l .control a.btn_stop{background-image: url(/img/kh/main/sec01_img04.svg);}
#main #container #sec01 .js_slide .in .r{display: flex; flex-wrap: wrap; flex-direction: column; align-content: flex-start; justify-content: flex-start; align-items: stretch; gap: 22px; width: 452px;}
#main #container #sec01 .js_slide .in .r .item{display: block; padding: 20px 24px; background-color: rgba(0, 0, 0, 0.50); border: 1px solid rgba(255, 255, 255, 0.10); backdrop-filter: blur(10px); border-radius: 2px;}
#main #container #sec01 .js_slide .in .r .item:first-child{background-color: rgba(150, 0, 2, 0.60);}
#main #container #sec01 .js_slide .in .r .item .t{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px;}
#main #container #sec01 .js_slide .in .r .item .t strong{display: block; color: #FFF; font-size: 18px; line-height: 1; letter-spacing: -0.18px; font-weight: 600;}
#main #container #sec01 .js_slide .in .r .item .t a{display: block; position: relative; width: 24px; height: 24px; font-size: 0; text-indent: -9999px; transform: rotate(0); transition: all 0.2s linear;}
#main #container #sec01 .js_slide .in .r .item .t a:hover{transform: rotate(180deg);}
#main #container #sec01 .js_slide .in .r .item .t a:before,
#main #container #sec01 .js_slide .in .r .item .t a:after{content: ""; display: block; position: absolute; top: 50%; left: 50%; width: 60%; height: 2px; background-color: #fff; transform: translate(-50%,-50%);}
#main #container #sec01 .js_slide .in .r .item .t a:after{transform: translate(-50%,-50%) rotate(90deg);}
#main #container #sec01 .js_slide .in .r .item ul{margin-top: 17px; border-top: 1px solid #FFF;}
#main #container #sec01 .js_slide .in .r .item ul li:not(:last-child){border-bottom: 1px solid rgba(255, 255, 255, 0.20);}
#main #container #sec01 .js_slide .in .r .item ul li a, .sche{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 20px; padding: 14px 10px; text-decoration: none;}
#main #container #sec01 .js_slide .in .r .item ul li:nth-child(2) a{padding-bottom: 0;}
#main #container #sec01 .js_slide .in .r .item ul li em{display: block; width: 50px; text-align: center; font-size: 12px; font-weight: 200; line-height: 1; color: rgba(255, 255, 255, 0.8); font-style: normal;}
#main #container #sec01 .js_slide .in .r .item ul li em b{display: block; margin-bottom: 6px; color: #FFF; font-size: 24px; font-weight: 500; line-height: 1;}
#main #container #sec01 .js_slide .in .r .item ul li .sc-list{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0; flex: 1; }
#main #container #sec01 .js_slide .in .r .item ul li .sc-list strong{overflow: hidden; display: inline-block; display: -webkit-box;  word-break: break-word; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis; color: #fff; font-weight: 400; line-height: 1.4; letter-spacing: -0.16px; font-size: 16px;}
#main #container #sec01 .js_slide .in .r .item ul li .sc-list strong span{display: inline-block; width: 18px; height: 18px; font-size: 0; vertical-align: middle; margin-left: 6px;}
#main #container #sec01 .js_slide .in .r .item ul li .sc-list strong span:before{content: "N"; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; height: 100%; background-color: #fff; border-radius: 1px; color: #000000; font-size: 14px; font-weight: 600; line-height: 1;}
#main #container #sec01 .js_slide .in .r .item:first-child ul li div strong span:before{color: #960002;}
#main #container #sec01 .js_slide .in .r .item ul li a:hover strong{text-decoration: underline; text-underline-position: under;}
#main #container #sec01 .js_slide .move{width: 100%;/*width: calc(100% - 57px - 57px);*/ left: 50%; transform: translateX(-50%); animation: sec01_ani 0.5s linear alternate forwards; }
#main #container #sec01 .js_slide .move ul{}
#main #container #sec01 .js_slide .move ul li{background-repeat: no-repeat; background-position: center center; background-size: cover;}
#main #container #sec01 .js_slide .move ul li.bg1{background-image: url(/img/kh/main/sec01_img01.jpg);}
#main #container #sec01 .js_slide .move ul li.bg2{background-image: url(/img/kh/main/sec01_img02.jpg);}
#main #container #sec01 .js_slide .move ul li.bg3{background-image: url(/img/kh/main/sec01_img03.jpg);}

@keyframes sec01_ani {
	0%{width: 100%;}
	100%{width: calc(100% - 57px - 57px);}
}
@keyframes sec01_ani2 {
	0%{opacity: 0; transform: translateY(20px);}
	20%{opacity: 0;}
	100%{opacity: 1; transform: translateY(0);}
}

#main #container #sec02{position: relative; margin-top: 47px; padding-bottom: 75px;}
#main #container #sec02:before{content: ""; display: block; position: absolute; top: -137px; left: -30px; width: 222px; height: 255px;  background: url(/img/kh/main/sec02_img08.svg) no-repeat center center / 100% auto;}
#main #container #sec02 .in{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 40px;}
#main #container #sec02 .in .l{overflow: hidden; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 10px; position: relative; width: calc((100% - 40px) * 0.465); padding: 22px; background: url(/img/kh/main/sec02_img01.jpg) no-repeat center center / cover; border-radius: 2px; text-decoration: none; border-radius: 2px;}
#main #container #sec02 .in .l:before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 43.94%, rgba(0, 0, 0, 0.40) 91.35%);}
#main #container #sec02 .in .l div{flex: 1;  position: relative; z-index: 1;}
#main #container #sec02 .in .l div strong{display: block; font-size: 20px; color: #fff; font-weight: 600; line-height: 1.4;}
#main #container #sec02 .in .l div p{margin: 8px 0 0; font-size: 15px; font-weight: 400; line-height: 1.4; letter-spacing: -0.15px; color: #fff;}
#main #container #sec02 .in .l span{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 4px; position: relative; z-index: 1; padding: 8px 10px; color: #FFF; font-size: 15px; font-weight: 500; line-height: 1; letter-spacing: -0.15px; background-color: #960002; border: 1px solid #960002; border-radius: 4px; transition: all 0.2s linear;}
#main #container #sec02 .in .l:hover span{background-color: #fff; color: #960002;}
#main #container #sec02 .in .l span:after{content: ""; display: block; width: 20px; height: 20px; background: url(/img/kh/main/sec02_img02.svg) no-repeat center center / 100% auto; transition: all 0.2s linear;}
#main #container #sec02 .in .l:hover span:after{background-image: url(/img/kh/main/sec02_img03.svg);}
#main #container #sec02 .in .r{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 20px; flex: 1;}
#main #container #sec02 .in .r li{width: 100%;}
#main #container #sec02 .in .r li a{overflow: hidden; display: block; width: 100%; height: 238px; position: relative; background: url(/img/kh/main/sec02_img05.jpg) no-repeat center center / cover; border-radius: 2px; text-decoration: none;}
#main #container #sec02 .in .r li a:before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);}
#main #container #sec02 .in .r li:nth-child(2) a{background-image: url(/img/kh/main/sec02_img06.jpg);}
#main #container #sec02 .in .r li:nth-child(3) a{background-image: url(/img/kh/main/sec02_img07.jpg);}
#main #container #sec02 .in .r li a .show{opacity: 1; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end; width: 100%; height: 100%; position: relative; padding: 20px; transition: all 0.2s linear;}
#main #container #sec02 .in .r li a:hover .show{opacity: 0;}
#main #container #sec02 .in .r li a .show strong{display: block; width: 100%; color: #fff; font-size: 18px; font-weight: 500; line-height: 1.4; text-align: center;}
#main #container #sec02 .in .r li a .hover{opacity: 0; display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 20px; background: rgba(150, 0, 2, 0.80); transition: all 0.2s linear;}
#main #container #sec02 .in .r li a:hover .hover{opacity: 1;}
#main #container #sec02 .in .r li a .hover:before,
#main #container #sec02 .in .r li a .hover:after{content: ""; display: block; position: absolute; top: 10px; left: 10px; width: calc(100% - 20px); height: 23px; background: url(/img/kh/main/sec02_img04.svg) no-repeat center center / 100% auto;}
#main #container #sec02 .in .r li a .hover:after{top: auto; bottom: 10px; transform: rotate(180deg);}
#main #container #sec02 .in .r li a .hover strong{display: block; width: 100%; text-align: center; color: #FFF; font-size: 20px; font-weight: 600; line-height: 1.4;}
#main #container #sec02 .in .r li a .hover p{display: block; width: 100%; margin: 0; margin-top: 10px; text-align: center; color: #FFF; font-weight: 400; font-size: 15px; line-height: 1.4; letter-spacing: -0.15px;}
#main #container #sec02 .in .r li a .hover span{display: block; width: 24px; height: 24px; margin-top: 16px; background: url(/img/kh/main/sec02_img02.svg) no-repeat center center / 100% auto; text-indent: -9999px;}


/***** Sub *****/
/* Visual */
#sub #visual {position:relative; width:100%; height:265px; z-index:1; background-size:cover !important;}
#sub #visual.bg1 {background:url(/img/kh/common/sub_visual_bg1.jpg) no-repeat center top;}

/* Container */
#sub #container {width:100%; height:auto;}
#sub #container .layout {z-index:10;}	
#sub #container #content_box {width:auto; position:relative; min-height:550px; padding-left:300px; background:url(/img/kh/common/container_bg.png) repeat-y left top;}
#sub #container #remote {position:absolute; left:0; top:-125px; width:250px;}
#sub #container #remote h2 {width:100%; height:80px; font-size:28px; line-height:34px; padding:45px 0 0 0; text-align:center; background:#2d3039 url(/img/kh/common/remote_titlebg.jpg) no-repeat center top; color:#fff; font-weight:normal;}
#sub #container #remote .js_menu {width:100%;}
#sub #container #remote .js_menu ul {width:100%;}
#sub #container #remote .js_menu ul li {border-bottom:1px solid #d6d6d6;}
#sub #container #remote .js_menu ul li a {display:block; font-size:17px; line-height:21px; padding:15px 40px 15px 20px; text-decoration:none; position:relative;
transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}
#sub #container #remote .js_menu ul li a span {display:block; width:7px; height:13px; background:url(/img/kh/common/lnb_depth1_bul.png) no-repeat left top; position:absolute; right:20px; top:50%; margin-top:-6px; transition : all 0.5s ease; -webkit-transition : all 0.5s ease;}
#sub #container #remote .js_menu ul li a:link,
#sub #container #remote .js_menu ul li a:visited,
#sub #container #remote .js_menu ul li a:active {color:#404040;}
#sub #container #remote .js_menu ul li a:hover,
#sub #container #remote .js_menu ul li a.ov:link,
#sub #container #remote .js_menu ul li a.ov:visited,
#sub #container #remote .js_menu ul li a.ov:active,
#sub #container #remote .js_menu ul li a.ov:hover {color:#fff; background:#365492;}
#sub #container #remote .js_menu ul li a.ov span {-webkit-transform: rotate(90deg); transform: rotate(90deg);}
#sub #container #remote .js_menu ul li ul {display:none; margin:15px 0px;}
#sub #container #remote .js_menu ul li ul li {border-bottom:none; margin-top:2px;}
#sub #container #remote .js_menu ul li ul li:first-child {margin-top:0;}
#sub #container #remote .js_menu ul li ul li a {padding:3px 40px 3px 32px; font-size:15px; line-height:19px; background:url(/img/kh/common/lnb_depth2_bul.png) no-repeat 21px 9px;}
#sub #container #remote .js_menu ul li ul li a:link,
#sub #container #remote .js_menu ul li ul li a:visited,
#sub #container #remote .js_menu ul li ul li a:active {color:#555;}
#sub #container #remote .js_menu ul li ul li a:hover,
#sub #container #remote .js_menu ul li ul li a.ov:link,
#sub #container #remote .js_menu ul li ul li a.ov:visited,
#sub #container #remote .js_menu ul li ul li a.ov:active,
#sub #container #remote .js_menu ul li ul li a.ov:hover {text-decoration:underline; color:#365492; background:url(/img/kh/common/lnb_depth2_bul_ov.png) no-repeat 21px 9px;}
#sub #content {width:100%; height:auto; position:relative;}
#sub #content #path {position:absolute; right:0; top:10px; width:auto; height:auto;}
#sub #content #path:after {content:""; display:block; clear:both;}
#sub #content #path .navi {float:left; margin:9px 15px 0 0; color:#999;}
#sub #content #path .navi a {display:inline-block; vertical-align:top; color:#999; padding:2px 0; font-size:13px;}
#sub #content #path .navi a.home {background:url(/img/kh/common/home_ico.png) no-repeat center 50%; width:15px; height:13px; text-indent:-9999px;}
#sub #content #path .navi a:last-child {color:#303030;}
#sub #content #path .path_etc {float:left;}
#sub #content #path .path_etc .gong_u,
#sub #content #path .path_etc .print{
	overflow:hidden; display:block; float:left; width:32px; height:32px; text-indent:-9999px; border:2px solid #a3a3a3; position:relative; z-index:5;
	-moz-border-radius:18px; -ms-border-radius:18px; -o-border-radius:18px; -webkit-border-radius:18px; border-radius:18px;
	transition : all 0.3s ease; -webkit-transition : all 0.3s ease;
}
#sub #content #path .path_etc .gong_u {background:#fff url(/img/kh/common/icon_gong_u.png) no-repeat center top;}
#sub #content #path .path_etc .print {background:#fff url(/img/kh/common/icon_print.png) no-repeat center top; margin-left:5px;}
#sub #content #path .path_etc .gong_u:hover, #sub #content #path .path_etc .gong_u:active {border:2px solid #4d4d4d; background-position:center -32px;}
#sub #content #path .path_etc .print:hover, #sub #content #path .path_etc .print:active {border:2px solid #4d4d4d; background-position:center -32px;}
#sub #content #path .path_etc ul {}
#sub #content #path .path_etc ul:after {content:""; display:block; clear:both;}
#sub #content #path .path_etc ul li {float:left; position:relative;}
#sub #content #path .path_etc ul li .sns_box {display:block; position:absolute; left:0; top:0; width:100%; display:none;}
#sub #content #path .path_etc ul li .sns_box ul {position:relative; z-index:1;}
#sub #content #path .path_etc ul li .sns_box ul li {float:none; position:absolute; left:0; top:0; display:none;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);}
#sub #content #path .path_etc ul li .sns_box ul li.btn_t {z-index:5;}
#sub #content #path .path_etc ul li .sns_box ul li.btn_f {z-index:3;}
#sub #content #path .path_etc ul li .sns_box ul li.btn_b {z-index:1;}
#sub #content #path .path_etc ul li .sns_box ul li a {display:block; width:36px; height:36px; text-indent:-9999px; overflow:hidden;
-moz-border-radius:18px; -ms-border-radius:18px; -o-border-radius:18px; -webkit-border-radius:18px; border-radius:18px;}
#sub #content #path .path_etc ul li .sns_box ul li.btn_t a {background:#4bb3da url(/img/core/sns_share_ico.jpg) no-repeat center top;}
#sub #content #path .path_etc ul li .sns_box ul li.btn_f a {background:#4862a3 url(/img/core/sns_share_ico.jpg) no-repeat center -36px;}
#sub #content #path .path_etc ul li .sns_box ul li.btn_b a {background:#2db400 url(/img/core/sns_share_ico.jpg) no-repeat center -72px;}
#sub #content #path .path_etc ul li .sns_box .btn_close {display:none; position:absolute; background:#a3a3a3 url(/img/core/sns_share_close.png) no-repeat center 50%; z-index:5; left:0; top:0; width:36px; height:36px; text-indent:-9999px; overflow:hidden;
-moz-border-radius:18px; -ms-border-radius:18px; -o-border-radius:18px; -webkit-border-radius:18px; border-radius:18px;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);}
#sub #content #txt {min-height:400px; padding:50px 0; color:#555; font-size:15px; line-height:22px;
font-family:"Nanum Barun Gothic", "Nanum Gothic", "돋움", Dotum, Helvetica, Verdana, Arial, sans-serif;}
#sub #content #txt h3 {font-size:35px; font-weight:600; line-height:40px; margin-bottom:30px; color:#303030;}
#sub #content #txt h4, #sub #content #txt h5, #sub #content #txt h6 {font-family:"Nanum Barun Gothic", "Nanum Gothic", "돋움", Dotum, Helvetica, Verdana, Arial, sans-serif;}


/***** Footer *****/
#footer {width:100%; height:auto; position:relative; z-index:21; background:#1a191d; padding:0 0 25px 0;}
#footer .cl_top {width:100%; height:auto; background:#2b2b32;}
#footer .menu {width:auto; padding:20px 0; margin:0 350px 0 0;}
#footer .menu:after {content:""; display:block; clear:both;}
#footer .menu li {float:left; padding:0 10px; background:url(/img/kh/common/footer_m_bul.gif) no-repeat left 50%;}
#footer .menu li:first-child {padding-left:0; background:none;}
#footer .menu li a {display:block; padding:3px; color:#d7d7d8;}
#footer .menu li:first-child a {color:#9f8156; font-weight:600;}
#footer .relate_site {position:absolute; right:0; top:-50px; z-index:10;}
#footer .relate_site:after {content:""; display:block; clear:both;}
#footer .relate_site div {width:210px; height:auto; margin-left:5px; float:left; position:relative;}
#footer .relate_site div a.button {display:block; color:#c7c7c8; text-align:left; border:1px solid #646469; padding:0 10px; height:35px; line-height:35px; position:relative;}
#footer .relate_site div a.button span {position:absolute; right:10px; top:50%; margin-top:-4px; display:block; width:11px; height:6px; background:url(/img/kh/common/relate_bul.gif) no-repeat center 50%;
-webkit-transform: rotate(0deg); transform: rotate(0deg);
-webkit-transition: all .5s ease; transition: all .5s ease;}
#footer .relate_site div a.button.on span {
-webkit-transform: rotate(180deg); transform: rotate(180deg);	
}
#footer .relate_site div ul {width:100%; border:1px solid #646469; box-sizing:border-box; background:#fff; position:absolute; left:0; bottom:36px; z-index:10; display:none;}
#footer .relate_site div ul li {border-top:1px dotted #adadb4;}
#footer .relate_site div ul li:first-child {border-top:0;}
#footer .relate_site div ul li a {display:block; padding:7px 10px; line-height:18px;}
#footer address,
#footer .copy {font-size:14px; line-height:20px; margin:0px; font-style:normal;}
#footer address {color:#a8a8a8; padding:25px 0 5px 0;}
#footer address span {display:inline-block; vertical-align:top; margin-left:15px;}
#footer .copy{color:#7c7c7d;}


#header #nav .layout .js_menu ul li a[target="_blank"]::after {content: ""; display: inline-block; width: 10px; height: 10px; margin-left: 5px;
	background:url(../../../img/core/blank_ico.gif) no-repeat ;}

#sub #container #remote .js_menu ul li a[target="_blank"]::after {content: ""; display: inline-block; width: 10px; height: 10px; margin-left: 5px;
	background:url(../../../img/core/blank_ico.gif) no-repeat ;}