@import url("common.css");

#wrap {position:relative; width:100%; _height:100%;}

#visual{position:relative;/* top:88px; */overflow:hidden;width:100%;height:300px;text-align:center;}
#visual2{position:relative; overflow:hidden; width:100%; text-align:center; height:310px;}
.subtop{background:url('/img/sub8.jpg') center 0 no-repeat;}
/*
.subtop1{background:url('/img/sub7.jpg') center 0 no-repeat;}
.subtop2{background:url('/img/sub7.jpg') center 0 no-repeat;}
.subtop3{background:url('/img/sub7.jpg') center 0 no-repeat;}
.subtop4{background:url('/img/sub7.jpg') center 0 no-repeat;}
.subtop5{background:url('/img/sub7.jpg') center 0 no-repeat;}
.subtop6{background:url('/img/sub7.jpg') center 0 no-repeat;}
.subtop7{background:url('/img/sub7.jpg') center 0 no-repeat;}
*/

.subtop_txt {overflow:hidden; position:relative; margin-top:70px}
.subtop_txt h2 {font-family:'Cafe24Ssurround';font-size:42px;line-height:1.6em;color:#333;}
.subtop_txt p {font-family:'Cafe24Ssurround';font-size:24px;line-height:1.2em;letter-spacing:-0.5px;color:#333;}

/* ¹Ù·Î°¡±â ¹öÆ° */
.direct_btn2 {float:left;width:100%;}
.direct_btn2 li {float:left;width:100%;}
.direct_btn2 li a {float:left;width:100%;height:70px;font-size:14px;font-weight:400;color:#fff;text-align:center;}
.direct_btn2 li a span {display:block;padding-top:45px;}
.direct_btn2 li:nth-child(1) {background:#f37119 url(/img/direct_btn1.png) no-repeat 50% 30%;background-size:20px;}
.direct_btn2 li:nth-child(2) {background:#666 url(/img/direct_btn2.png) no-repeat 50% 30%;background-size:23px;}
.direct_btn2 li:nth-child(3) {line-height:65px;border:1px solid #ddd;background:#fff;}

#contents{position:relative;}

#cont_wrap {position:relative;margin:0 auto;max-width:1270px;}

.lnb_mobile{display:none;}

.lnb {float:left;margin:0 auto 50px auto;width:300px}
.lnb .lnb_tit {position:relative;padding:50px 0 50px 0;width:100%;font-family: 'NanumSquare', sans-serif;font-size:24px;color:#fff;font-weight:800;_letter-spacing:-0.05em;line-height:1.2;text-align:center;background:#e85b0e;}
.lnb ul{position:relative; overflow:hidden; max-width:1270px; margin:0 auto; background:#fff;}
.lnb li a {position:relative;float:left;padding:20px 10px;width:100%;font-family: 'NanumSquare', sans-serif;color:#555;font-size:17px;font-weight:500; letter-spacing:-0.05em; display:block; line-height:1.2;text-decoration: none;border:1px solid #ddd;border-top:0;}.lnb li:last-child a {border-right:1px solid #ddd;}
.lnb li a:hover{_color:#e85b0e;}
.lnb li a.on{color:#fff !important;font-weight:600;border-color:#00a6c8;background:#00a6c8}
/*
.lnb li a:before {position:absolute;top:23px;right:10px;width:0px;height:0px;content:"";border-style:solid;border-width:5px 0 5px 7px;border-color: transparent transparent transparent #ddd;}
.lnb li a.on:before {border-color: transparent transparent transparent #00a6c8;}
*/
/*
.lnb ul.one li a {width:100%;}
.lnb ul.two li a {width:50%;}
.lnb ul.three li a {width:33.3%;}
.lnb ul.four li a {width:25%;}
.lnb ul.five li a {width:20%;}
.lnb ul.six li a {width:16.66666666666667%;}
.lnb ul.seven li a {width:14.285714%;}
.lnb ul.eight li a {width:12.5%;}
.lnb ul.nine li a {width:20%;}
.lnb ul.ten li a {width:20%;}
*/
.lnb ul.ten li:nth-child(n+5) a {border-top:0;}
.lnb ul.ten li:nth-child(5) a {border-right:1px solid #ddd;}

.contentArea{float:right;margin:50px auto;position:relative;width:calc(100% - 350px);_width:950px;}
.contentArea2{max-width:1270px;position:relative;overflow:hidden;margin:60px auto 60px auto;}

#contents .tit_area{width:100%;padding:0 0 50px 0;overflow:hidden;}
#contents .tit_area h3.title {float:left;color:#333;font-size:36px;text-align:left;}
#contents .tit_area p {float:right;margin-top:20px;padding-left:15px;font-size:16px;color:#333;letter-spacing:-0.05em;background:url('/img/i_home.png') no-repeat 0 5px;}
#contents .tit_area p span {padding:0 10px;background:url('/img/i_arrow.png') no-repeat center 8px;}
#contents h4.consub_tit {color:#333; font-size:30px; letter-spacing:-1.8pt; text-align:center; margin-bottom:50px; line-height:135%}

/***  css ***/
.point_txt{font-weight:bold; color:#333; letter-spacing:-0.5pt;}

.tpad_10{padding-top:10px}
.tpad_20{padding-top:20px}
.tpad_35{padding-top:35px}
.bpad_5{padding-bottom:5px}
.bpad_10{padding-bottom:10px}
.bpad_20{padding-bottom:20px}
.bpad_25{padding-bottom:25px}
.bpad_30{padding-bottom:30px}
.bpad_40{padding-bottom:40px}
.bpad_50{padding-bottom:50px}
.bmar_90{margin-bottom:90px}
.bmar_30{margin-bottom:30px}
.bmar_35{margin-bottom:35px}
.bmar_20{margin-bottom:20px}
.bmar_10{margin-bottom:10px}
.con_tit{font-family:NotoKR-Bold;  font-size:20px; line-height:24px; letter-spacing:-1.5pt; color:#444; padding:0 0 15px 0;}
.con_tit span.thin{line-height:24px; letter-spacing:-1.5pt; color:#444; font-family:NotoKR-DemiLight; }


.table_style1{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #2d3133; border-left:1px solid #ddd;}
.table_style1 th{color:#2d3133; font-family:NotoKR-Regular;  font-size:15px; text-align:center; padding:15px; border-bottom:1px solid #ddd; letter-spacing:-0.5pt;}
.table_style1 td{color:#666; border-bottom:1px solid #ddd; padding:15px; text-align:center; font-size:15px;  letter-spacing:-0.5pt;}
.table_style1 th sup{font-size:11px}
.table_style1 .bor{border-right:1px solid #ddd;}

.table_style6{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #2d3133; border-left:1px solid #ddd;}
.table_style6 th{color:#2d3133; font-family:NotoKR-Regular;  font-size:15px; text-align:center; padding:10px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; letter-spacing:-0.5pt;}
.table_style6 td{color:#666; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:10px; text-align:right; font-size:14px;  letter-spacing:-0.5pt;}
.table_style6 th sup{font-size:11px}

.table_style7{width:100%; border-collapse:separate; border-spacing:0px; border-top:1px solid #2d3133; border-left:1px solid #ddd;}
.table_style7 th{background:#d5dde2; color:#2d3133; font-family:NotoKR-Regular;  font-size:14px; text-align:center; padding:8px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; letter-spacing:-0.5pt;}
.table_style7 th.borc{border-right:1px solid #bacdd8}
.table_style7 td{background:#fff; color:#666; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding:8px; text-align:right; font-size:13px;  letter-spacing:-0.3pt;}
.table_style7 th sup{font-size:11px}
.table_style7 td.cen{text-align:center; color:#2d3133; }

.moutit{display:none;}

caption{line-height:0px; font-size:0px; color:#fff;}
.hide {display:none;line-height:0px; font-size:0px;}

h4.sub_title{font-size:26px; line-height:1.5; letter-spacing:-1.5pt; color:#333; font-family:NotoKR-Bold; }
h4.sub_title span.engt{ font-family:NotoKR-Bold;  line-height:1.5; letter-spacing:0; }
h4.engtitle{font-size:35px; font-family: 'Montserrat', sans-serif; font-weight:700; line-height:1.5}
h4.engtitle span{font-family: 'Montserrat', sans-serif;}
p.stitle1{font-size:20px; color:#2d3133; line-height:24px; letter-spacing:-0.8pt; margin-bottom:10px;}
p.stitle_sub{font-size:15px; line-height:24px;letter-spacing:-0.5pt; }
p.stitle_sub span{color:#333; line-height:24px;letter-spacing:-0.5pt; }

h5.sub_stitle{font-size:16px; line-height:22px; letter-spacing:-0.7pt; color:#888; }


/*******************************************************************************
	@media 1200px~
*******************************************************************************/
@media all and (max-width:1200px){

.lnb {width:230px}
.contentArea{width:calc(100% - 280px);}

}


/*******************************************************************************
	@media 981px~1200px
*******************************************************************************/
@media all and (max-width:999px){

#wrap { min-width:auto; }

#visual{/* top:80px; */height:300px;background-size:auto 300px;}
#visual2{height:300px}
#visual2 .subtop_txt{margin-top:155px;}
.subtop_txt{margin-top:70px;}
.subtop_txt h2{font-size:30px}
.subtop_txt p{font-size:18px; margin-top:15px;}

.lnb_pc{display:none;}
.lnb_mobile{display:block; background:rgba(0,0,0,0.7); position:relative;  border-top: 1px solid rgba(255,255,255,0.2); top:-62px;}

.lnbMenu{ box-sizing: border-box;}
/** 2018.12.17 - dropdownlist **/
.dropLst { display:inline-block; /* position:relative; */ vertical-align:middle; color:#666; }
.dropLst .txt { position:relative; display:block; text-align:left; text-decoration:none; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; height:40px; padding:0 40px 0 10px; box-sizing:border-box; color:#333; }
.dropLst .hidradio { opacity:0; filter:alpha(opacity=0); position:absolute; z-index:-1; top:5px; left:5px; }
.dropLst .dlst { display:none; position:absolute; z-index:9; } /* box-shadow:1px 1px 1px rgba(0,0,0,.2); -webkit-box-shadow:1px 1px 1px rgba(0,0,0,.2);  min-width:100%; */
.dropLst.bottom .dlst { top:auto; bottom:100%; }
.dropLst .dlst.aright { right:0; }
.dropLst ul { background-color:#fff; max-height:500px; padding:0; overflow-x:hidden; overflow-y:auto; box-sizing:border-box; -webkit-box-sizing:border-box; }
.dropLst ul > li { position:relative; }
.dropLst ul > li > label { display:block; position:relative; cursor:pointer; }
.dropLst ul > li > label > span { display:block; }
.dropLst ul > li > a:hover, .dropLst ul > li > label:hover > span, .dropLst ul > li > label.hover > span { /* background-color:#f3f3f3; */ }
.dropLst .txt, .dropLst ul { border:1px solid #d7d7d7; }
.dropLst .txt, .dropLst li span, .dropLst li a { line-height:38px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dropLst li span, .dropLst li a { padding:0 10px; }
.dropLst li a.selected, .dropLst li a.on, .dropLst li label.on span {/*font-weight:bold;*/}
.dropLst li span, .dropLst li a { display:block; }

/** 2018.12.17  **/
.mobile_snb {display: block; max-width:1270px; margin:0 auto; height:60px;z-index:999999999999999999999999999999999;}
.mobile_snb h2 {float:left; background:#fff; border-left:1px solid #ddd}
.mobile_snb h2 a {display:block; width:62px; height:60px; border-right:1px solid #ddd;}
.mobile_snb .box {width:50%; float:left; height: 60px; box-sizing:border-box; border-right: 1px solid rgba(255,255,255,0.2);} /* background-color: #fff;  */
.mobile_snb .box.dep1 {/*background-color: #003591;*/}
.mobile_snb .dropLst .txt, 
.mobile_snb .dropLst li span, 
.mobile_snb .dropLst > a {padding-left:20px; width:100%; height:60px; line-height: 60px; font-size:15px; border:none; z-index: 99; box-sizing:border-box; /* letter-spacing:-0.5pt; */}
.mobile_snb .box .dropLst .txt {padding-right:40px; color: rgba(255,255,255,1);}
.mobile_snb .box .dropLst .txt:before {content: ""; position: absolute; top:50%; right:20px; display: block; width: 11px; height: 8px; margin-top:-4px; background: url("/img/icons.png") no-repeat left bottom; background-size:26px auto; -webkit-transition:all 0.2s cubic-bezier(0, 0, 0.25, 1); transition:all 0.2s cubic-bezier(0, 0, 0.25, 1);}
.mobile_snb .box .dropLst .txt.on:before {-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);}
.mobile_snb .box .dropLst ul {padding:0;}
.mobile_snb .box.dep1 .dropLst ul,
.mobile_snb .box.dep1 .dropLst ul li {background-color:#f0f1f5;} /* background-color: #003591; */
.mobile_snb .box.dep1 .dropLst ul li:first-child {}
.mobile_snb .box.dep1 .dropLst ul li:last-child {border-bottom:0;}
.mobile_snb .box.dep1 .dropLst li .value {padding-left:20px; width:100%; height: 50px; line-height: 50px; font-size:15px; border:none; z-index: 99; box-sizing:border-box; /* letter-spacing:-0.5pt; */ color:#555;}
.mobile_snb .box.dep1 .dropLst li .value.on {color:#fff;  background:#354860;}
.mobile_snb .box.dep1 .dropLst .txt {color: rgba(255,255,255,1);} /* color:#fff; */
.mobile_snb .box.dep1 .dropLst .txt:before {background-position:bottom left;}
.mobile_snb .box.dep2 .dropLst ul,
.mobile_snb .box.dep2 .dropLst ul li  {background-color:#f0f1f5;} /*background-color: #fff;*/
.mobile_snb .box.dep2 .dropLst li .value {padding-left:20px; width:100%; height: 50px; line-height: 50px; font-size:15px; border:none; z-index: 99; box-sizing:border-box; letter-spacing:-0.5pt; color:#555;} /*color:#003591;*/
.mobile_snb .box.dep2 .dropLst li .value.on {color:#fff;  background:#354860;} /*color:#00aeef;*/
.mobile_snb .dropLst {width:100%; box-sizing: border-box;}
.mobile_snb .dropLst .dlst{width:50%;}
.mobile_snb .dropLst .dlst1 {left:0}
.mobile_snb .dropLst .dlst2 {right:0}
.mobile_snb .dropLst .dlst ul {border:1px solid #ddd; border-top:none;}

/*drop : 3*/
.mobile_snb .box.dep3 .dropLst ul,
.mobile_snb .box.dep3 .dropLst ul li  {background-color: #f9f9f9; border-bottom:1px solid #ddd;}
.mobile_snb .box.dep3 .dropLst li .value {padding-left:20px; width:100%; height: 50px; line-height: 50px; font-size:15px; border:none; z-index: 99; box-sizing:border-box; letter-spacing:-0.5pt; color:#555;} 
.mobile_snb .box.dep3 .dropLst li .value.on {color:#fff;  background:#666;}
/* ---- */

#contents .tit_area{padding:0 0 2rem 0;}
#contents h3.title{font-size:30px;text-align:center;}

.contentArea{/* top:100px; */margin:0 auto;padding:0 10px;width:100%;}
.contentArea2{margin-top:0;width:100%;}
.contents_in {width:100%; box-sizing:border-box; overflow:hidden; margin:0 auto; padding:20px 0 0 0; }


h4.sub_title{font-size:24px}
h4.sub_title span.engt{font-size:24px}
h4.engtitle{font-size:30px}
.contentArea{margin:0 auto 60px auto}

.table_style7 th{font-size:13px; padding:5px}
.table_style7 td{font-size:13px; padding:5px}

}


/*******************************************************************************
	@media 681~980px
*******************************************************************************/
@media all and (max-width:980px){

.table_style1 th{font-size:14px; padding:10px;}
.table_style1 td{font-size:14px; padding:10px;}

.table_style6 th{font-size:14px; padding:8px;}
.table_style6 td{font-size:14px; padding:8px;}

.bmar_90{margin-bottom:60px}

#contents h4.consub_tit {font-size:25px; margin-bottom:30px}
h4.sub_title{font-size:22px;}
h4.sub_title span.engt{font-size:22px;}
h4.sub_title .none{display:none;}
h4.engtitle{font-size:28px}
p.stitle_sub{font-size:14px;}
p.stitle_sub .none{display:none;}
p.stitle1{font-size:18px}

}


/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

#visual{height:200px;background-size:auto 200px;}
#visual2{height:280px}
#visual2 .subtop_txt{margin-top:120px;}

.subtop_txt h2{font-size:24px;}
.subtop_txt p{font-size:15px}
.subtop_txt{margin-top:60px}

.contentArea2{width:94%;padding:0 8px;}

#contents h3.title{font-size:26px}
#contents .tit_area{padding:0 0 2rem 0}

.lnb_mobile{top:-41px}
.mobile_snb{height:40px}
.mobile_snb h2{display:none;}
.mobile_snb .box{width:50%; height:40px}
.mobile_snb .dropLst .dlst ul{border:none;border-bottom:1px solid #ddd;}
.mobile_snb .dropLst .txt, .mobile_snb .dropLst li span, .mobile_snb .dropLst > a{font-size:13px; height:40px; line-height:40px}
.mobile_snb .box.dep1 .dropLst li .value{font-size:14px; line-height:46px; height:46px}
.mobile_snb .box.dep2 .dropLst li .value{font-size:14px; line-height:46px; height:46px}


#contents h4.consub_tit {font-size:22px; margin-bottom:20px}
h4.sub_title{font-size:20px}
h4.sub_title span.engt{font-size:20px}
h4.engtitle{font-size:24px}
p.stitle_sub{font-size:13px; line-height:20px;}
p.stitle1{font-size:16px; margin-bottom:5px}

}


/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:480px){

#visual{height:150px;background-size:auto 150px;}
#visual2{height:150px}
#visual2 .subtop_txt{margin-top:110px;}
.subtop_txt h2{font-size:23px;}
.subtop_txt p{font-size:14px;display:none;}
.subtop_txt{margin-top:40px}


#contents h3.title{font-size:22px}
#contents .tit_area{padding:0 0 1.5rem 0}

#contents h4.consub_tit {font-size:20px;}
h4.sub_title{font-size:18px; letter-spacing:-1pt;}
h4.sub_title span.engt{font-size:18px;}
h4.engtitle{font-size:22px}
p.stitle1{font-size:15px}

}

/*******************************************************************************
	@media ~400px
*******************************************************************************/
@media all and (max-width:400px){

h4.sub_title{font-size:17px;}
h4.sub_title span.engt{font-size:17px;}
h4.engtitle{font-size:18px}

}


/*******************************************************************************
	@media ~320px
*******************************************************************************/
@media all and (max-width:330px){


}