@charset "utf-8";

@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url('../fonts/notokr/notokr-light.eot');
	src: url('../font/notokr-light.eot?#iefix') format('embedded-opentype'),
		 url('../font/notokr-light.woff2') format('woff2'),
		 url('../font/notokr-light.woff') format('woff');
}

@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/notokr/notokr-regular.eot');
	src: url('../font/notokr-regular.eot?#iefix') format('embedded-opentype'),
		 url('../font/notokr-regular.woff2') format('woff2'),
		 url('../font/notokr-regular.woff') format('woff');
}

@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url('../fonts/notokr/notokr-medium.eot');
	src: url('../font/notokr-medium.eot?#iefix') format('embedded-opentype'),
		 url('../font/notokr-medium.woff2') format('woff2'),
		 url('../font/notokr-medium.woff') format('woff');
}

@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 700;
	src: url('../fonts/notokr/notokr-bold.eot');
	src: url('../font/notokr-bold.eot?#iefix') format('embedded-opentype'),
		 url('../font/notokr-bold.woff2') format('woff2'),
		 url('../font/notokr-bold.woff') format('woff');
}


/*Reset*/
html{font-size:10px; position:relative;}
legend,caption,.blind{display: none;}
body{margin: 0; padding: 0; }
div,p,h1,h2,h3,h4,h5,h6,ol,li,dl,dt,dd,ul,pre,form,fieldset,legend,input,textarea,button,select,table,th,td{margin:0;padding: 0;border:0;}
ul,ol,li,dl{list-style: none;}
img{border:0;vertical-align: top;}
address,caption,cite,code,dfn,em,var{font-style: normal;}
blockquote,q{quotes: none;}
blockquote:before,blockquote:after,q:after{content:""; content: none;}
form,fieldset{border:0;}
input,select,textarea,button{font-size:100%;vertical-align: middle;}
button{border:0;background-color: transparent;cursor:pointer;}
a{color:#222; text-decoration:none; }
a:hover,a:active,a:focus{text-decoration:none; }
table{width:100%; *border-collapse:collapse; border-spacing:0; table-layout:fixed;}

strong{font-weight:500;}
h1,h2,h3,h4,h5,h6{font-weight:400;}
/* common */
body,th,td,input,select,textarea,button{color:#222; font-size:10px; line-height:1.3; letter-spacing:-0.025em; font-family:'Noto Sans KR', sans-serif; font-weight:400; word-break:keep-all;}

@-moz-document url-prefix(){
 body,th,td,input,select,textarea,button{font-weight:400} /* 모질라전용핵 */
}   

article,aside,canvas,details,figcaption,figure, footer,header,hgroup,menu,nav,section,summary,main {display:block;}

.blind{display:none;}
.inner{max-width:1240px; margin:0 auto; position:relative;}
.inner_1100{max-width:1100px; margin:0 auto;}
.inner_1140{max-width:1140px; margin:0 auto; position:relative;}
.inner_1000{max-width:1000px; margin:0 auto;}

.eng_play{font-family:'Play','sans-serif'; font-weight:400;}

#load {width: 100%; height: 100%; top: 0; left: 0; position: fixed; display: block; opacity: 1;	background: white; z-index: 99; text-align: center; color:#fff;}
#load > img {position: absolute; top: 50%; left: 50%; z-index: 100;}

/* skiptoContent */
#skiptoContent{position:fixed;top:0;left:0;width:100%;z-index:999}
#skiptoContent a{display:block;position:absolute;top:0;left:-9999px;width:100%;height:26px;background:#0a94b2;color:#fff;font-size:12px;line-height:26px;text-align:center}
#skiptoContent a:focus, #skiptoContent a:active{left:0; text-decoration:none}
#skiptoContent a:hover{text-decoration:underline}


body {-webkit-text-size-adjust: 100%;}



/* header */
header{height:100px; position:absolute; top:0; left:0; z-index:55; width:100%; /*border-bottom:1px solid rgba(255,255,255,0.3);*/}
header h1{position:absolute; top:0; z-index:66; left:0;  height:100px;}
header h1 a{width:133px; height:100%; background:url(../../images/common/logo-white.png) no-repeat; background-position:50% 50%; background-size:133px 45px;font-size:0px; display:block;}
#headerWrap{overflow:hidden; height:100px; width:100%; position:absolute;background:none;
  -webkit-transition-property: background, height; /* Safari */
  -webkit-transition-duration: 0.2s; /* Safari */
  -webkit-transition-delay: 0s;
  transition-property: background, height;
  transition-duration: 0.2s;
  transition-delay: 0s;
}

.gnb{text-align:right; max-width:1920px; margin:0 auto;  box-sizing:border-box;}
.gnb > li{display:inline-block; vertical-align:top; position:relative;  margin-right:-3px;text-align:right;}
.gnb:after{clear:both; content:"."; visibility:hidden; display:block; height:0;}
.gnb li h2{height:100px; font-size:1.8rem; font-weight:600;}
.gnb li h2 a{display:block; padding:0 40px; line-height:100px; color:#fff; text-align:center; letter-spacing:0.01em;}
.gnb li:first-child ul{border-left-width:0;}
.gnb li ul li{display:block; padding:10px 0;}
.gnb li ul li a{color:#565654; font-size:1.7rem; line-height:1.5em; word-break: keep-all; display:block; padding:0 5px; font-weight:500;}

/*hearder-fixed, hover 공통*/
#headerWrap.on{background:rgba(255,255,255,0.98); border-bottom:1px solid rgba(0,0,0,0.15);}
#headerWrap.on{height:410px;}
#headerWrap.on h1 a{background-image:url(../../images/common/logo-color.png);}
#headerWrap.on .gnb li h2 a{color:#222;}
#headerWrap.on .gnb{text-align:right;  position:relative;}
#headerWrap.on .gnb > li{text-align:center; }
#headerWrap.on .gnb li ul{margin-top:0; padding-top:1rem;}


#headerWrap .gnb li h2.current a{position:relative; line-height:100px;}
#headerWrap .gnb li ul{position:absolute; width:100%;  text-align:center; padding-bottom:40px; margin-top:40px;}
#headerWrap.on .gnb > li h2 a:after{content:""; display:block; width:60px; height:3px; background: #ae6ab4; background: -moz-linear-gradient(left,  #ae6ab4 0%, #4868da 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #ae6ab4 0%,#4868da 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #ae6ab4 0%,#4868da 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 position:absolute; bottom:1rem; left:50%; transform:translateX(-50%); opacity:0; }
#headerWrap.on .gnb > li:hover h2 a:after{opacity:1; }

#headerWrap .gnb > li ul li a{position:relative; display:inline-block;}
#headerWrap .gnb > li ul li a:after{content:""; display:none; width:90%; height:2px; background:#0b9f92; position:absolute; bottom:-4px; left:50%; transform:translateX(-50%);}
#headerWrap .gnb > li ul li a:hover{color:#46bcbb;}

#m-menu{display:none;}

.bg_gray{background:#f4f5f6;}
.main_tit{font-family:'Play', sans-serif; font-weight:700; font-size:3.5rem; margin-bottom:4rem;}
.main_tit.center{text-align:center;}

/*quickmenu*/
.quickmenu {position:absolute;top:35rem; right:0; width:10rem; background:#f5f5f5; z-index:99;  box-sizing:border-box; text-align:center;}
.quickmenu .title_box{background:#2175c2; color:#fff; font-size:1.8rem; font-weight:700; text-align:center; padding:1rem; }
.quickmenu ul li a {display:block; padding:3rem 0 2rem; margin:0 1rem; border-bottom:1px solid #d1d1d1; font-size:1.4rem; font-weight:700; color:#555555;}
.quickmenu ul li a .icon_box img{width:38px;}
.quickmenu ul li a .txt_box{margin-top:1rem;}
.quickmenu ul li:hover {background:#e6ebf1;}
.quickmenu ul li:hover a{color:#2175c2;}
.quickmenu .top_box{position: relative; z-index: 1;}
.quickmenu .top_box a{display:block; padding:1rem 1rem 1.3rem; font-size:1.4rem; font-weight:700; color:#3b3b3b; line-height:1em;}
.quickmenu .top_box a i{font-size:1.6rem; color:#4f91ce; display:block; }



/* footer */
#footer .logo_wrap{padding:4rem 0; border-top:1px solid #d3d3d3;}
#footer .logo_wrap ul{font-size:0;}
#footer .logo_wrap li{display:inline-block; width:25%; text-align:center; margin-top:2.5rem;}
#footer .logo_wrap li:nth-child(-n+4){margin-top:0rem;}
#footer .logo_wrap li img{height:4.5rem;}
#footer .info_wrap{padding:3rem 0; background:#13161b;}
#footer .info_wrap .inner{position:relative;}
#footer .info_wrap .cont_box ul{font-size:0; margin-bottom:2.5rem; padding-bottom:2.5rem; border-bottom:1px dashed #505050;}
#footer .info_wrap .cont_box ul li{display:inline-block; margin-left:3.5rem;}
#footer .info_wrap .cont_box ul li:first-child{margin-left:0;}
#footer .info_wrap .cont_box li a{font-size:1.6rem; font-weight:500; color:#fff;}
#footer .info_wrap .cont_box p{font-size:1.5rem; color:rgba(255,255,255,0.8); line-height:1.5em;}
#footer .info_wrap .cont_box p.copy{margin-top:1rem; color:#888;}
#footer .info_wrap .cont_box p em{display:inline-block; margin:0 6px;}

@media (hover: hover) and (pointer: fine) {

#footer .info_wrap .cont_box li a:hover{text-decoration:underline;}

}

/*----------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


@media (max-width:1300px) {
.inner{max-width:100%; padding:0 15px; box-sizing:border-box;}
}

@media (max-width:1220px) {

.inner_1140, .inner_1100, .inner_1000{max-width:100%; padding:0 15px; box-sizing:border-box;}

.quickmenu{display:none;}

/*header*/
header{background:#fff; height:135px; position:static; top:auto; left:auto;}
#headerWrap{min-width:100%; width:100%; left:auto; margin-left:0; height:139px;}
#headerWrap h1{position:relative; top:auto; left:auto; transform:inherit; z-index:99; height:70px; text-align:center; border-bottom:1px solid #ccc;}
#headerWrap h1 a{background-image:url(../../images/common/logo-color.png); background-size:120px auto; display:inline-block; vertical-align: top;}
#headerWrap .gnb{text-align:center; position:relative; z-index:996; padding-right:0;}
#headerWrap .gnb li h2 a{color:#222;}
.gnb > li{ text-align:center;}
.gnb > li:first-child{margin-left:0;}
.gnb li h2{height:65px; font-size:2rem;}
.gnb li h2 a{line-height:65px;}
#headerWrap.on .gnb{text-align:center;}
#headerWrap .gnb li h2.current a{line-height:65px; }
#headerWrap.on .gnb li h2.current a{line-height:65px;}
#headerWrap .gnb li h2.current a:before{bottom:16px;}
#headerWrap.on{height:430px;}
}


@media (max-width:1024px) {
header{height:70px; border-bottom:1px solid #d5d5d5;}
header h1{height:70px; left:0px; margin-left:0;}
header h1 a{width:140px; background-image:url(../../images/common/logo-color.png); background-size:110px auto;}
#headerWrap{display:none;}
#m-menu{display:block;}
.m-menu-list h1{display:none;}
.m-menu-btn{position:absolute; cursor:pointer; z-index:999; display:block;}
.m-menu-btn button{display:block; text-align:center; font-size:0;}
.m-menu-btn.m-menu-btn-open{right:10px; top:13px;}
.m-menu-btn.m-menu-btn-open button{color:#fff; background:#0b9f92; height:45px; width:45px; line-height:45px;}
.m-menu-btn.m-menu-btn-open button i{margin-left:2px;}
.m-menu-btn.m-menu-btn-close{position:fixed; top:0px; right:260px;}
.m-menu-btn.m-menu-btn-close button{background:#00786e; width:50px; height:50px; line-height:50px;color:#fff;}
.m-menu-btn button i{font-size:25px; vertical-align:middle;}
.mobile-menu-box{display:none; position:fixed; width:100%; height:100%; top:0; left:0; z-index:9999; overflow:hidden;overflow-y:auto;background:rgba(0,0,0,0.5);}
header .m-menu-list{position:absolute; width:220px; height:auto; min-height:100%;  z-index:99;  right:0%;background:#0b9f92;padding:0 20px 20px;}
header .m-menu-list a{color:#fff;}
header .m-menu-list .gnb{margin-left:0;}
header .m-menu-list .gnb{padding-top:10px; padding-top:0; height:auto;}
header .m-menu-list .gnb li{display:block; width:100%; text-align:left; padding:5px 0;} 
header .m-menu-list .gnb li h2{border-bottom:1px rgba(255,255,255,0.2) solid; padding:20px 0 10px; padding-left:0; border-bottom-width:0; margin:0; line-height:45px; height:auto;}
header .m-menu-list .gnb li h2 a{height:auto; padding:0; text-align:left;}
header .m-menu-list .gnb li ul{position:relative; top:0; padding-bottom:0; margin-left:0; padding-top:0; border-left-width:0;}
header .m-menu-list .gnb li ul li a{ color:rgba(255,255,255,0.9);}
header .m-menu-list .gnb{text-align:left; padding-right:0;}
header .m-menu-list .gnb li:first-child ul{margin-left:0px;}
header .m-menu-list .gnb li:first-child h2{padding-left:0px;}
header .m-menu-list .gnb li h2 a{border-bottom:2px #fff solid; padding-bottom:1px; line-height:35px;}
header .m-menu-list .gnb li:hover h2 a, header .m-menu-list .gnb ul li ul li a:hover{color:#fff;}
header .m-menu-list .gnb li:hover h2{height:auto;}
header.fixed .gnb li h2 a,
#headerWrap.on .gnb li h2 a{color:#fff;}

.gnb li:hover ul,
.gnb ul li.current ul{margin-top:0; border-top:0;}

/*footer*/
#footer .logo_wrap li img{height:40px;}

}


@media (max-width:767px) {
html{font-size:9px;}
body, th, td, input, select, textarea, button{font-size:9px;}

.main_tit{font-size:3rem;}
.main_tit.center{margin-bottom:2.5rem; font-size:3rem;}

/*footer*/
#footer .logo_wrap{padding:2rem 0;}
#footer .logo_wrap li{width:50%; margin-top:1.5rem;}
#footer .logo_wrap li:nth-child(3), #footer .logo_wrap li:nth-child(4){margin-top:1.5rem;}
#footer .logo_wrap li img{height:30px;}

#footer .info_wrap{padding:2rem 0;}
#footer .info_wrap .inner{padding:0;}
#footer .info_wrap .logo_box{display:none;}
#footer .info_wrap .logo_box img{width:120px;}
#footer .info_wrap .cont_box{margin-left:0; text-align:center;}
#footer .info_wrap .cont_box ul{padding-bottom:2rem; border-bottom:1px dashed #b5b5b5; text-align:center;}
#footer .info_wrap .cont_box ul li{ width:auto; margin-left:1rem; padding-left:1rem; border-left:1px solid #b5b5b5; }
#footer .info_wrap .cont_box ul li:first-child{margin-left:0; padding-left:0; border-left-width:0;}
#footer .info_wrap .cont_box li a{display:block; font-size:1.5rem;}
#footer .info_wrap .cont_box p em{display:block; font-size:0; line-height:0;}
}