﻿/******************** layout ********************/
html{overflow-y:scroll; width:100%;}
#allwrap {width:100%; min-width:320px;}
#allwrap:after {content:""; display:block; clear:both;}
#wrap {position:relative; width:100%;}
#wrap:after {content:""; display:block; clear:both;}

/******************** 하위브라우저 체크 ********************/
#ieUser {width:100%; height:83px; background:#083457; overflow:hidden;}
#ieUser .iewrap {position:relative; max-width:1200px; margin:28px auto 0;}
#ieUser .iewrap p.img {float:left; padding:0 10px 0 0;}
#ieUser .iewrap p.txt {float:left; color:#fff; padding:8px 0 0 0;}
#ieUser .iewrap p.btn {position:absolute; right:0; top:0; cursor:pointer;}
#ieUser .iewrap ul {float:left; margin:0 0 0 20px;}
#ieUser .iewrap ul li {float:left; padding:0 12px 0 0;}


/******************** header ********************/
#headerWrap {width:100%; height:106px; background:url('../images/bg/bg_header_wrap.gif') left top repeat-x;}
#headerWrap #snb {max-width:980px; height:36px; margin:0 auto; overflow:hidden;}
#headerWrap #snb ul {position:relative; /* float:right; */}
#headerWrap #snb ul li {float:left;  padding:6px 10px 0; background:url('../images/bg/bg_snb_li.gif') right 12px no-repeat;}
#headerWrap #snb ul li a {color:#fff; line-height:1.1; font-weight:400;font-size:11px;}
#headerWrap #snb ul li.f a { font-size:11px; line-height: 1.4;}
#headerWrap #snb ul li.lang {padding:0 0 0 7px; background:url(none.html);}
#headerWrap #snb ul li.lang .langChange {position:relative; left:0; top:0;}
#headerWrap #snb ul li.lang .langChange:after {content:""; display:block; clear:both;}
#headerWrap #snb ul li.lang .langChange a {font-size:11px; color:#468299;}
#headerWrap #snb ul li.lang a {display:block; color:#63c2e5; height:36px; line-height:36px;}
#headerWrap #snb ul li.langBtn {position:absolute; right:0; top:11px; background:url(none.html); padding:0; cursor:pointer;}
#headerWrap #snb #float_r {float:right;}
#headerWrap #snb #float_l {float:left;}



#header {position:relative; max-width:1000px; margin:0 auto; z-index:99;}
#header:after {content:""; display:block; clear:both;}
#header h1 {float:left; margin:15px 0 0 10px;}

#header ul#top {float:right;}
#header ul#top:after {content:""; display:block; clear:both;}
#header ul#top li {float:left;}
#header ul#top li a {display:block; font-size:16px; font-weight:600; color:#1e1e1e; padding:28px 10px 27px 20px; z-index:99;}
/* #header ul#top li a#topNavi4 {padding:28px 10px 27px 45px;} */
#header ul#top li a span {font-size:16px;}
#header ul#top li a:hover {color:#486577;}
#header ul#top li a.hover {color:#486577;}

#header ul#top li ul {display:inline-block; position:absolute; left:0; top:70px; height:0; border-left:1px #ddd solid; z-index:99; overflow:hidden;}
#header ul#top li ul:after {content:""; display:block; clear:both;}
#header ul#top li ul li {float:none; padding:0 0 10px 29px;}
#header ul#top li ul li a {font-size:15px; color:#333; border:0; padding:0; line-height:1.2; z-index:99;}
#header ul#top li ul li a span.f {display:block; font-size:15px;}
#header ul#top li ul li a:hover {color:#486577; padding:0; font-weight:600;}
#header ul#top li ul li a.hover {color:#486577; padding:0; font-weight:600;}
#header ul#top li ul li.tit {font-size:16px; color:#42798e; font-weight:600; padding:25px 0 30px 29px;}

#header ul#top li ul li ul {display:inline-block; position:relative; left:0; top:14px; height:auto; padding:0 0 17px 0; border:0;}
#header ul#top li ul li ul li {padding:0 0 7px 0;}
#header ul#top li ul li ul li a {display:block; font-size:13px; color:#666; font-weight:normal;}
#header ul#top li ul li ul li a:hover {color:#666; font-weight:normal;}
#header ul#top li ul li ul li a span.dep {font-size:13px;}

#header ul#top li ul#topSubm1 {left:0; border:0; width:340px;}
#header ul#top li ul#topSubm2 {left:275px; width:340px;}
#header ul#top li ul#topSubm3 {left:567px;}
#header ul#top li ul#topSubm4 {left:740px;}
#header ul#top li ul#topSubm5 {left:870px;}


#header ul#top li ul li.st1 {position:absolute; left:0px; top:74px; width:188px;}
#header ul#top li ul li.st2 {position:absolute; left:0px; top:165px; width:188px;}
#header ul#top li ul li.st2_2 {position:absolute; left:0px; top:250px; width:188px;}/*170413 수정(수전전 : top:230px)*/
#header ul#top li ul li.st3 {position:absolute; left:110px; top:74px; width:188px;}
#header ul#top li ul li.st3_2 {position:relative; left:0px;}
#header ul#top li ul li.st4 {position:absolute; left:110px; top:225px; width:188px;}
#header ul#top li ul li.st5 {position:absolute; left:162px; top:204px; width:188px;}
#header ul#top li ul li.st6 {position:absolute; left:162px; top:333px; width:188px;}


#mnaviHead {display:none;}
#navibg {position:absolute; left:0; top:106px; width:100%; height:0; background:#fff; z-index:60; border-top:1px #ddd solid; overflow:visible !important;}
#mnavi {display:none;}








/* download */

.text-group { margin:0 0 60px;}
.t1 li{ width:33.3%; float:left; text-align: left;}
.t2 li{ width:25%; float:left; text-align:left;}

.text-group li div{ margin:0px 5% 15px 5%; padding:30px 0; height:137px; text-align:left; }
.text-group li div img { max-width:100%;}
.text-group:after {content:""; display:block; clear:both}
.text-group div em, .product-detail .text-group div strong {width: 0; height:0; font-size:0; overflow:hidden; margin:0 0 0 10px}
.text-group p {font-size:15px; margin:0 15%; word-break: normal;}

.text-group strong {padding:0 0 0 10px;}






/******************** client ********************/

.wrap_side iframe{padding: 0 0 20px 0}




/******************** main section ********************/
#mainSection {width:100%;}

/* eSearch */
#eSearch {position:relative;width:50%; height:80px; margin: 30px auto;}


#eSearch ul {margin:0 10px 0 0px;}
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:20%; }

/* #eSearch .margin_l_10 {margin-left:-50px;} */





/* #eSearch .sch {position:absolute; right:0; top:0; width:120px; height:40px; } 
#eSearch .sch .btn {display:block; width:116px; height:36px; line-height:36px; color:#304450; font-size:12px; font-weight:600; font-family:'Verdana'; text-align:center; border:2px #486577 solid;}

 */



 
/*  #eSearch {position:relative;width:1000px; height:40px; margin:31px auto; overflow:hidden;}
#eSearch h2 {position:absolute; left:0; top:0; width:334px;}
#eSearch h2 span {display:inline-block; font-size:20px; color:#202c36; font-weight:600; font-family:'Verdana'; padding:10px 0 8px 0; border-bottom:2px #6c8492 solid;}
#eSearch h2 p {position:absolute; left:124px; top:15px;}

#eSearch ul {margin:0 126px 0 200px; }
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:30%; margin:0 1% 0 0;} */

#eSearchMobile {display:none;}

#mobilenewsWrap {display:none;}




/* mainsection */
/* #mainsection {width:100%; overflow:hidden;}
#mainsection ul {width:979px; margin:0 auto; overflow:hidden;padding-right:30px;}
#mainsection ul li a {display:block; font-size:16px; color:#fff; font-weight:600; line-height:45px; text-align:center; }



#mainsection .section_cont02{margin: 30px 20px 30px 0;}
#mainsection .section_cont02>ul{margin-top:0;}
#mainsection .section_cont02>ul li{float:left;width:20%;text-align:center;}


#mainsection .section_cont02>ul>li dt a{color:#303030;}
#mainsection .section_cont02>ul>li dd{line-height:20px;}
#mainsection .section_cont02>ul>li dd img{margin-bottom:15px;}
#mainsection .section_cont02>ul>li dd span{display:block;}
#mainsection .section_cont02 li ul{width:178px;margin:0 auto;}
#mainsection .section_cont02 li li{width:50%;margin-top:14px;}
#mainsection .section_cont02 li dd .snsBtn{text-align:center;}
#mainsection .section_cont02 li dd .snsBtn img{width:100%;max-width:232px;margin-bottom:0;}


#mainsection .section_cont02 li dd .snsBtn{text-align:center;}
#mainsection .section_cont02 li dd .snsBtn img{width:100%;max-width:232px;margin-bottom:0;}

 */



/* Main Banner */
#mainBanner {width:100%; overflow:hidden;}
#mainBanner #bannerTabs {width:100%; background:#3e4b5c; overflow:hidden;}
#mainBanner #bannerTabs ul {width:979px; margin:0 auto; overflow:hidden; border-left:1px #525d6e solid;}
#mainBanner #bannerTabs ul li {float:left; width:33.33%;}
#mainBanner #bannerTabs ul li a {display:block; font-size:16px; color:#fff; font-weight:600; line-height:45px; text-align:center; border-right:1px #525d6e solid;}
#mainBanner #bannerTabs ul li a.on {background:#bcc3c9;}

#mainBanner #bannerDetail {width:100%; height:197px; background:#bcc4ca; overflow:hidden;}
#mainBanner #bannerDetail .mtvn {display:block; width:980px; margin:0 auto; padding:0 0 0 0; overflow:hidden;}
#mainBanner #bannerDetail .mtvn .img {float:left; width:48%;}
#mainBanner #bannerDetail .mtvn .info {float:left; width:50%; margin:5px 0 0 2%;}
#mainBanner #bannerDetail .mtvn .info .tit {font-size:30px; color:#fff; font-weight:600; padding:25px 0 10px 0;}
#mainBanner #bannerDetail .mtvn .info .txt {position:relative; width:100%;l overflow:hidden;}
#mainBanner #bannerDetail .mtvn .info .txt span {display:block; font-size:13px; color:#fff; font-weight:600; line-height:1.3; padding:0 0 0 5px; background:url('../images/bg/bg_bannerdetail_span.gif') left 7px no-repeat;}
#mainBanner #bannerDetail .mtvn .info .txt span.ty01 {position:absolute; left:267px; top:0;}
#mainBanner #bannerDetail .mtvn .info .txt span.ty02 {position:absolute; left:267px; top:17px;}
#mainBanner #bannerDetail .mtvn .info .btn {margin:12px 0 0 0;}
#mainBanner #bannerDetail .mtvn .info .btn a {display:block; width:168px; height:38px; border:1px #e4e7ea solid; background:url('../images/bg/bg_mtvn_arrow.png') 148px 12px no-repeat;}
#mainBanner #bannerDetail .mtvn .info .btn a span {font-size:14px; color:#fff; font-weight:600; padding:0 0 0 15px; line-height:38px;}

#mainBannerMobile {display:none;}






/* Main Contents */

/*media section*/
#mainContentWrap_bg_02 {width:100%; background:#f9fafc; overflow:hidden;}
/*//media section*/


#mainContentWrap {width:100%; background:#f5f5f5; overflow:hidden;}


#mainContent {width:1020px; margin:0 auto; overflow:hidden;}
#mainContent h3 {position:relative; font-size:20px; color:#324652; font-weight:600; padding:0 0 22px 0;}
#mainContent h3 span {position:absolute; right:0; top:-4px; display:block;}
#mainContent .img {padding:0 0 16px 0;}
#mainContent .img img {width:100%;}
#mainContent .txt {font-size:13px; color:#666; font-weight:600; line-height:1.4; word-break:keep-all;}
#mainContent .txt a {color:#666;}
#mainContent .txt a:hover {color:#666;}

#noticeWrap, #networkWrap, #newsWrap, #serviceWrap {float:left; width:25%;}
#noticeMain, #networkMain, #newsMain, #serviceMain {height:264px; padding:40px 20px 0; border-right:1px #e0e1e1 solid;}
#noticeMain, #networkMain, #newsMain, #serviceMain:after {content:""; display:block; clear:both;}
#newsMain ul li {width:100%; border-bottom:1px #e5e5e5 solid; overflow:hidden;}
#newsMain ul li a {display:block; width:100%; font-size:13px; color:#666; font-weight:600; line-height:43px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
#serviceMain {border-right:0;}
#serviceMain ul li {border:1px #e2e3e3 solid; margin:-1px 0 0 0; background:#fcfdfd;}
#serviceMain ul li:after {content:""; display:block; clear:both;}
#serviceMain ul li .subject {font-size:23px; color:#f58220; font-weight:600; line-height:58px; padding:0 0 0 0px;}
#serviceMain ul li a {display:block; width:100%; height:100%;}







/******************** download / sns ********************/
.sns_area .section_cont01, .sns_area .section_cont02>ul, .sns_area .section_cont03{overflow:hidden;width:100%;min-width:320px;max-width:1000px;margin: 0px auto 0;padding:0 10px;box-sizing:border-box;}
.sns_area .section_cont01 h2{margin-bottom:18px;font-size:20px;color:#303030;}
.sns_area .section_cont01 .newMenu{float:left;width:48.33%;}

.sns_area .section_cont02{margin-top:0px;padding:40px 0;background:#f9f9f9;}
.sns_area .section_cont02>ul{margin-top:0;}
.sns_area .section_cont02>ul li{float:left;width:25%;text-align:center;}
.sns_area .section_cont02>ul>li dt{margin-bottom:18px;padding-top:20px;font:bold 20px NanumGothic;color:#303030;background:url('images/bg_title01.html') no-repeat center top;}
.sns_area .section_cont02>ul>li dt a{color:#303030;}
.sns_area .section_cont02>ul>li dd{line-height:20px;}
.sns_area .section_cont02>ul>li dd img{margin-bottom:15px;}
.sns_area .section_cont02>ul>li dd span{display:block;}
.sns_area .section_cont02 li ul{width:178px;margin:0 auto;}
.sns_area .section_cont02 li li{width:50%;margin-top:14px;}
.sns_area .section_cont02 li dd .snsBtn{text-align:center;}
.sns_area .section_cont02 li dd .snsBtn img{width:100%;max-width:232px;margin-bottom:0;}



	











/******************** footer ********************/
#footerWrap {width:100%; height:130px; background:#080c0f; overflow:hidden;}
#footer {position:relative; width:980px; margin:0 auto; padding:0px 0 0 0;}
#footer:after {content:""; display:block; clear:both;}
#footer #flogo {position:absolute; left:0; top:0px;font-size:9px;}
#footer #famliy {position:absolute; right:0; top:30px;}


#footer address {font-size:12px; color:#a8abae; line-height:1.4; margin:0 0 0 160px;}
#footer address strong {display:block;font-size:13px; color:#c4c4c4;  white-space: nowrap; overflow:hidden; text-overflow:ellipsis; width:100%;}

#footer address .footer-link {display:inline-block;margin: 0 auto;}
#footer address .footer-link:after {display:block; content:""; clear:both;}
#footer address .footer-link > li {float:left; margin-left:15px; padding-left:16px; background:url('../images/ico/bg_footer_link_bar.png') no-repeat 0 top;}
#footer address .footer-link > li:first-child {margin-left:0; padding-left:0; background:none;}
#footer address .footer-link > li > a {display:block; color:#c4c4c4; font-size:14px;}




span.familySelectBox{height:25px; background:url('../images/bg/bg_familyselect.gif') right center #fff no-repeat; box-sizing:border-box;}
span.familySelectBox.changed {}
.familySelectBoxInner{font-size:12px; font-weight:600; color:#aeb0b2; white-space:nowrap; line-height:25px; padding:0 48px 0 0;}





/********** rolling ***********/
/* base */
#mainRoll {position:relative; left:0; top:0; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; -o-backface-visibility:hidden; backface-visibility:hidden; z-index:1; clear:both;}

.swiper-wrapper{position:relative; width:100%; -webkit-transition-property:-webkit-transform, left, top; -webkit-transition-duration:0s; -webkit-transform:translate3d(0px,0,0); -webkit-transition-timing-function:ease;
-moz-transition-property:-moz-transform, left, top; -moz-transition-duration:0s; -moz-transform:translate3d(0px,0,0); -moz-transition-timing-function:ease;
-o-transition-property:-o-transform, left, top; -o-transition-duration:0s; -o-transform:translate3d(0px,0,0); -o-transition-timing-function:ease; -o-transform:translate(0px,0px);
-ms-transition-property:-ms-transform, left, top; -ms-transition-duration:0s; -ms-transform:translate3d(0px,0,0); -ms-transition-timing-function:ease;
transition-property:transform, left, top; transition-duration:0s; transform:translate3d(0px,0,0); transition-timing-function:ease;}
.swiper-free-mode > .swiper-wrapper{-webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -ms-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto;}
.swiper-slide{float: left;}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal{-ms-touch-action: pan-y;}
.swiper-wp8-vertical{-ms-touch-action: pan-x;}



/* re code declaration */
#mainRoll{width:100%; height:580px; overflow:hidden; z-index:54; background:url('../images/bg/bg_mainroll.gif') left top repeat;}
#mainRoll .swiper-slide{position:relative; width:100%; height:580px; overflow:hidden;}
#mainRoll .swiper-slide a{position:relative; display:block; width:100%; height:580px;}
#mainRoll .swiper-slide a img{position:absolute; left:50%; top:0; margin:0 0 0 -950px; z-index:1;}
#mainRoll .swiper-slide a .point {position:relative; max-width:980px; margin:0 auto; overflow:hidden; z-index:2;}
#mainRoll .swiper-slide a .point .tit {font-family:'Verdana'; font-size:55px; color:#fff; line-height:1; padding:80px 0 24px 50px;}
#mainRoll .swiper-slide a .point .txt {font-size:20px; color:#fff; font-weight:600; line-height:1.4; padding: 0px 0 0 50px;}

#mainThum{position:absolute; left:0; bottom:14px; width:100%; z-index:55; text-align:center;}
#mainThum div {display:inline-block; margin:0 7px;}
#mainThum div.play {display:none; width:20px; height:20px; margin:6px 7px 0 0; background:url('../images/btn/btn_main_play.png') left top no-repeat; cursor:pointer; overflow:hidden;}
#mainThum div.pause {display:inline-block; width:20px; height:20px; margin:6px 10px 0 0; background:url('../images/btn/btn_main_pause.png') left top no-repeat; cursor:pointer; overflow:hidden;}
#mainThum img {vertical-align:middle;}
#mainThum .swiper-pagination-switch{width:26px; height:23px; background:url('../images/btn/btn_stay.png') left top no-repeat /* border:2px #fff solid */; vertical-align:top; margin:5px 5px 0 5px; cursor:pointer; overflow:hidden;}
#mainThum .swiper-active-switch{/* background:#fff; */background:url('../images/btn/btn_now.png') left top no-repeat}




/********** select change **********/
span.mainSelectBox{width:100%; height:40px; background:url('../images/bg/bg_mselect.gif') right center #fff no-repeat; border-left:1px #ddd solid; box-sizing:border-box;}
span.mainSelectBox.changed {}
.mainSelectBoxInner{width:95%; font-size:13px; font-weight:600; color:#6e6e6e; white-space:nowrap; line-height:40px; padding:0 0 0 5%;}


/* today layer popup */
div.popup001 {border:3px #26333b solid; background:#fff repeat left top;}
h1.popup { padding:15px 0 0 19px; height:64px; float:none; }
div.popup002 { padding:0px 0px; line-height:130%; }
p.popup-close {position:relative; height:24px;border-top:1px #c6c6c6 solid; background:#ccc repeat left top;}
p.popup-close input, p.popup-close img { vertical-align:middle;}
p.popup-close input {margin:0 0 0 30px;}
p.popup-close label{padding:0 0 0 4px;}
p.popup-close a.today{color:#000;text-decoration:none;line-height:20px;padding:0 10px 0 0;}
p.popup-close .close {position:absolute; right:20px; top:0; color:#000; line-height:20px; cursor:pointer;}









/**************** media query ****************/
/*** media query 1020px ***/
@media all and (max-width:1020px){

#mainContent {width:980px;}
#noticeMain, #networkMain, #newsMain, #serviceMain {height:254px;}

}


/*** media query 1000px ***/
@media all and (max-width:1000px){

/* layout */
#headerWrap #snb {max-width:none; margin:0 25px 0 0;}
#header {max-width:none;}
#header ul#top li a#topNavi4 {padding:28px 25px 27px 45px;}

#header ul#top li ul#topSubm2 {left:265px;}
#header ul#top li ul#topSubm3 {left:540px;}
#header ul#top li ul#topSubm4 {left:700px;}
#header ul#top li ul#topSubm5 {left:820px;}



/* downlad, sns */
.sns_area .section_cont02>ul>li{width:50%;margin-top:36px;}
.sns_area .section_cont02>ul>li:nth-child(1), .sns_area .section_cont02>ul>li:nth-child(2){margin-top:0;}
.sns_area .section_cont02>ul li{font-size:13px;line-height:22px;}
.sns_area .section_cont02>ul>li>dd>a>img{width:37.4%;max-width:112px;}
.sns_area .section_cont02 li ul{width:90%;max-width:163px;}
.sns_area .section_cont02 li li{width:45.4%;text-align:left;margin-top:0;}
.sns_area .section_cont02 li li:nth-child(2n+1){margin-right:15px;text-align:right;}
.sns_area .section_cont02 li li img{width:100%;max-width:74px;}
.sns_area .cont01_r .storeSearch h2 span input{margin:6px 0 0 16px;}


}






/*** media query 980px ***/
@media all and (max-width:980px){
	
.w_type02	{display:none;}
.m_type02	{display:block;}


		.text-group {margin:0 0 30px 0}
    .t2 li{width:40%; margin:20px 5% 0 5%}
    .t2 li div{ margin-left:0; margin-right:0}
	.t1 li p {margin:0 15%; min-height:80px}
	.t2 li p {margin:0; min-height:80px}
	
	

/* layout */
#header h1 {margin:15px 0 0 25px;}
#footer {width:auto; margin:0 15px;}



/* main section */
#eSearch {width:auto; margin:0 auto;}
#eSearch h2 {position:absolute; left:20px; top:0; }
#eSearch h2 span {display:inline-block; font-size:20px; color:#202c36; font-weight:600; font-family:'Verdana'; padding:10px 0 8px 0; border-bottom:2px #6c8492 solid;}
#eSearch h2 p {position:absolute; left:124px; top:15px;}
#eSearch ul {margin:0 0 0 150px;/*  background-color:#ff0000; */}
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:24%; }


#mainBanner #bannerTabs ul {width:auto;}
#mainBanner #bannerDetail .mtvn {width:auto;}
#mainContent {width:auto;}
#serviceMain .ico {display:block; float:left; width:50%;}
#serviceMain .subject {display:block; float:left; width:50%;}
#serviceMain ul li .subject {padding:0;}


#serviceMain ul li .subject {font-size:18px; color:#f58220; font-weight:600; line-height:58px; padding:0 0 0 0px;}








}



/*** media query 960px ***/
@media all and (max-width:960px){


#header ul#top li ul#topSubm2 {left:250px;}
#header ul#top li ul#topSubm3 {left:524px;}
#header ul#top li ul#topSubm4 {left:690px;}



}





/*** media query 940px ***/
@media all and (max-width:940px){



/* layout */
#header ul#top li a {padding:28px 20px 27px;}
#header ul#top li a#topNavi4 {padding:28px 15px 27px 10px;}
#header ul#top li a u {left:30px;}
#header ul#top li ul {left:20px; min-width:110px;}


#header ul#top li ul li.tit {padding:25px 0 30px 10px;}

#header ul#top li ul li.st1 {left:-20px;}
#header ul#top li ul li.st2 {left:-20px;}
#header ul#top li ul li.st2_2 {left:-20px;}
#header ul#top li ul li.st3 {left:100px;}
#header ul#top li ul li.st3_2 {left:-20px;}
#header ul#top li ul li.st4 {left:100px;}
#header ul#top li ul li.st5 {left:130px;}
#header ul#top li ul li.st6 {left:130px;}

#header ul#top li ul#topSubm2 {left:245px;}
#header ul#top li ul#topSubm3 {left:510px;}
#header ul#top li ul#topSubm4 {left:660px;}
#header ul#top li ul#topSubm5 {left:769px;}

#footerWrap {height:auto;}
#footer {padding:20px 0 0 0;}
#footer #flogo {position:relative; left:0; top:0; text-align:center;}
#footer address {margin:18px 0 0 0; text-align:center;}
#footer #famliy {position:relative; left:0; top:0; text-align:center; padding:18px 0 40px 0;}



/* main section */
#noticeWrap, #networkWrap, #newsWrap {width:33.33%;}
#serviceWrap {width:100%;}
#serviceMain {height:auto; padding:0;}
#serviceMain h3 {display:none;}
#serviceMain ul li {float:left; width:33.33%; border:0;}
#serviceMain ul li a {display:block; border:1px #e2e3e3 solid; margin:0 0 0 -1px;}
#serviceMain ul li a:after {content:""; display:block; clear:both;}
#serviceMain ul li .ico {text-align:right;}

#mainBanner #bannerDetail .mtvn .img {width:40%;}
#mainBanner #bannerDetail .mtvn .img img {margin:0 0 0 -20%;}
#mainBanner #bannerDetail .mtvn .info {width:58%;}





#eSearch {width:auto; margin: 0 auto;}
#eSearch h2 {position:absolute; left:20px; top:0;}
#eSearch h2 p {position:absolute; left:124px; top:15px;}
#eSearch ul {margin:0 0 0 1%;/*  background-color:#ff0000; */}
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:24%; margin: 8% 0 2% 0;}






}



/*** media query 870px ***/
@media all and (max-width:870px){

#header ul#top li ul li.tit {padding:25px 0 30px 10px;}
#header ul#top li ul li {padding:0 0 10px 40px;}

#header ul#top li ul#topSubm2 {left:235px;}
#header ul#top li ul#topSubm3 {left:490px;}
#header ul#top li ul#topSubm4 {left:630px;}
#header ul#top li ul#topSubm5 {left:720px;}


#header ul#top li ul li.st1 {left:-30px;}
#header ul#top li ul li.st2 {left:-30px;}
#header ul#top li ul li.st2_2 {left:-30px;}
#header ul#top li ul li.st3 {left:85px;}
#header ul#top li ul li.st3_2 {left:-32px;}




}




/*** media query 840px ***/
@media all and (max-width:840px){

#header ul#top li ul li.tit {padding:25px 0 30px 10px;}
#header ul#top li ul li {padding:0 0 10px 15px;}


#eSearch {width:auto; margin:0 auto;}
#eSearch h2 {position:absolute; left:20px; top:0;}
#eSearch ul {margin:1% 0 0 1%;}
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:22%; margin: 8% 0 2% 0;}


}






/* 1월25일 작업 */
/*** media query 830px ***/
@media all and (max-width:830px){


/* layout */


#header ul#top li a {padding:28px 17px 27px;}
#header ul#top li a#topNavi4 {padding:28px 10px 27px 0px;}

#header ul#top li ul#topSubm2 {left:225px;}
#header ul#top li ul#topSubm3 {left:464px;}
#header ul#top li ul#topSubm4 {left:590px;}
#header ul#top li ul#topSubm5 {left:683px;}

#header ul#top li ul li.st1 {left:-10px;}
#header ul#top li ul li.st2 {left:-10px;}
#header ul#top li ul li.st2_2 {left:-10px;}
#header ul#top li ul li.st3 {left:95px;}
#header ul#top li ul li.st3_2 {left:-10px;}


#eSearch {width:auto; margin:0 auto;}
#eSearch h2 {position:absolute; left:20px; top:0;/* background-color:#ff0000;  */ }

#eSearch ul {margin:1% 0 0 1%;}
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:25%; margin: 8% 0 2% 0;}




}








/*** media query 800px ***/
@media all and (max-width:800px){


/* layout */



#header ul#top li a {padding:28px 10px 27px;}
#header ul#top li a#topNavi4 {padding:28px 5px 27px 5px;}
#header ul#top li ul li.tit {padding:25px 0 30px 5px;}
#header ul#top li ul li {padding:0 0 10px 20px;}
#header ul#top li ul li ul li a span.dep {display:block; padding:2px 0 0 8px;}

#header ul#top li ul#topSubm2 {left:220px;}
#header ul#top li ul#topSubm3 {left:465px;}
#header ul#top li ul#topSubm4 {left:585px;}
#header ul#top li ul#topSubm5 {left:665px;}



#header ul#top li ul li.st3_2 {left:-15px;}


#eSearch {width:auto; margin:0 auto;}
#eSearch h2 {position:absolute; left:20px; top:0;/* background-color:#ff0000;  */ }

#eSearch ul {margin:1% 0 0 1%;}
#eSearch ul:after {content:""; display:block; clear:both;}
#eSearch ul li {float:left; width:25%; margin: 8% 0 2% 0;}

}








/*** client query 768px ***/
@media all and (min-width:768px) {



.wrap_side .container{padding:0 20px 39px 20px;width:auto;background:none;max-width:1036px;z-index:20}

.wrap_side .aside{display:none}
.wrap_side .aside_2{display:block;position:relative;height:55px;padding:18px 10px 0 10px;margin-top:30px;text-align:center;background:#f5f5f5}
.wrap_side .aside_2 h2{display:none}
.wrap_side .aside_2 ul{text-align:center;overflow:hidden;z-index:10;position:relative;height:30px}
.wrap_side .aside_2 li{display:inline;padding:0 20px}
.wrap_side .aside_2 .prev,.wrap_side .aside_2 .next{position:absolute;top:20px;cursor:pointer;z-index:20}
.wrap_side .aside_2 .prev{left:0}
.wrap_side .aside_2 .next{right:0}
.wrap_side .aside_2 .bg{position:absolute;left:-50%;right:-50%;top:0;height:73px;background:#f5f5f5}

.wrap_side .aside .touchslider-viewport{width:auto;height:auto;overflow:hidden;position:relative}
.wrap_side .aside .touchslider-item{width:auto;height:auto}
.wrap_side .aside .touchslider-nav{display:none}

}




/*** media query 785px ***/
@media all and (max-width:785px){

html {overflow-x:hidden;}

/* layout */
#navi{display:none; position:absolute; right:-410px; top:0; width:410px; height:100%; background:#486577; z-index:9999;}
#mnavi {display:block; position:relative; width:100%; height:0; z-index:100;}
#mnavi img {position:absolute; right:0; top:36px; width:78px; cursor:pointer;}

#mnaviHead {position:relative; display:block; height:80px; border-bottom:1px #6d8492 solid;}
#mnaviHead a {position:absolute; right:0; top:0;}

#header {position:static;}
#header ul#top {width:100%; margin:0; padding:0;}
#header ul#top li {float:none; width:100%; border-bottom:1px #6d8492 solid;}
#header ul#top li a {font-size:26px; padding:0 0 0 45px; line-height:69px; color:#fff; background:url('../images/bg/bg_mnavi_arrow_down.gif') right top no-repeat;}
#header ul#top li a.hover {color:#fff;}
#header ul#top li a:hover {color:#fff;}
#header ul#top li a span {font-size:26px;}
#header ul#top li a#topNavi4 {padding:0 0 0 45px;}

#header ul#top li ul {display:none; position:relative; left:0; top:0; width:auto; height:auto; visibility:visible; padding:10px 0 10px 40px; border:0; border-top:1px #6d8492 solid;}
#header ul#top li ul li {width:auto; padding:10px 0; background:url('../images/bg/bg_top_mdepth_dot.gif') left 22px no-repeat; border:0;}
#header ul#top li ul li a {font-size:24px; color:#fff; font-weight:normal; background:url(none.html); padding:0 0 0 14px;}
#header ul#top li ul li a:hover {color:#fff; font-weight:normal; padding:0 0 0 14px;}
#header ul#top li ul li a.hover {color:#fff; font-weight:normal;}
#header ul#top li ul li a span.f {display:inline; font-size:24px;}
#header ul#top li ul li.tit {display:none;}
#header ul#top li ul li.st1 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st2 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st2_2 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st3 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st3_2 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st4 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st5 {position:relative; left:0; top:0; width:auto;}
#header ul#top li ul li.st6 {position:relative; left:0; top:0; width:auto;}


#header ul#top li ul li ul li {background:url(none.html);}
#header ul#top li ul li ul li a {font-size:22px; color:#d4d9dc;}
#header ul#top li ul li ul li a:hover {color:#d4d9dc;}
#header ul#top li ul li ul li a span.dep {display:inline; padding:0; font-size:22px;}

#header ul#top li ul#topSubm1 {width:auto; border-top:1px #6d8492 solid;}
#header ul#top li ul#topSubm2 {width:auto; left:0;}
#header ul#top li ul#topSubm3 {width:auto; left:0;}
#header ul#top li ul#topSubm4 {width:auto; left:0;}
#header ul#top li ul#topSubm5 {width:auto; left:0;}
#header ul#top li ul#topSubm6 {width:auto; left:0;}
#navibg {display:none;}


/* main section */
#mainBanner #bannerDetail .mtvn .img {width:38%;}
#mainBanner #bannerDetail .mtvn .img img {margin:0 0 0 -35%;}



#eSearch {display:none;}

#eSearchMobile {display:block; width:100%; overflow:hidden;} /*모바일위치고정*/
#eSearchMobile {position:relative; height:10%; margin: 0 auto;}

#eSearchMobile h2 {position:absolute; left:20px; top:0; width:100%}
#eSearchMobile h2 span {display:inline-block; font-size:20px; color:#202c36; font-weight:600; font-family:'Verdana'; padding:10px 0 8px 0; border-bottom:2px #6c8492 solid;}

#eSearchMobile ul {margin-top:40px; width:100%}
#eSearchMobile ul:after {content:""; display:block; clear:both;}
#eSearchMobile ul li {float:left; margin: 1% 3% 1% 3%; /* background-color:#ff0000; */}

/*모바일 적용*/ 
.wrap_side iframe{margin: -30px 0 0px 0;height: 100px;}

	#headerWrap #snb ul li.mn {display:none;}

}







/*** media query 700px ***/
@media all and (max-width:700px){

#mainContent h3 {font-size:17px;}
#mainBanner #bannerDetail .mtvn .img img {margin:0 0 0 -40%;}
.text-group { display:none;}
	
}

/*** media query 680px ***/
@media all and (max-width:680px){

#mainBanner #bannerDetail .mtvn .img img {margin:0 0 0 -50%;}
.text-group { display:none;}
	
	
	.wrap_side iframe{margin: 10px 0 0px 0;height: 100px;}

	
	
}






/*** media query 660px ***/
@media all and (max-width:680px){

.wrap_side iframe{margin: 10px 0 0px 0;height: 100px;}

	
	
	
}






/*** media query 640px ***/
@media all and (max-width:640px){
.wrap_side iframe{margin: -20px 0 0px 0;height: 100px;}


.text-group { display:none;}
	
	
/* client area*/
.wrap_side {display:none;}
	
	
/* notice area*/
#newsWrap {display:none;}



/* 온라인접수*/
#networkWrap {display:none;}


#mobilenewsWrap {display:block; width:100%; overflow:hidden;} /*모바일위치고정*/
#mobilenewsWrap {position:relative; margin: 0 auto;}
#mobilenewsWrap iframe {padding:0;}
#mobilenewsWrap {padding:0;}
	
/* main section */
#eSearch {height:auto; margin:30px 25px;}
#eSearch h2 {position:relative; left:0; top:0;}
#eSearch h2 p {display:block;}
#eSearch ul {margin:30px 0 0 0; /* background-color:ff0000; */}
#eSearch ul li {float:none; width:100%; margin:0 0 10px 0;}
#eSearch .sch {position:relative; left:0; top:0; width:100%; height:auto;}
#eSearch .sch .btn {display:block; width:auto; height:45px; line-height:45px;}


#mainBanner {display:none;}

#noticeWrap, #networkWrap {width:100%; border-bottom:1px #e0e1e1 solid; padding:0 0 40px 0;}

#noticeMain, #networkMain, #mobilenewsMain, #serviceMain {height:auto; padding:40px 25px 0 25px; border-right:0;}
#mobilenewsMain {padding:40px 25px 40px 25px;}
#mainContent h3 {font-size:20px;}
#mainContent .img {float:left; width:50%; padding:0;}
#mainContent .txt {float:left; width:50%; padding:0;}
#mainContent .txt a {display:block; padding:16% 0 0 30px; vertical-align:middle;}

#serviceMain  {padding:35px 25px 35px;}
#serviceMain h3 {display:block;}
#serviceMain ul li {margin:0; background:#f9fafb;}
#serviceMain ul li a {border:0; border-left:1px #e2e3e3 solid;}
#serviceMain ul li a.first {border:0;}
#serviceMain .ico, #serviceMain .subject {width:100%; float:none; text-align:center;}
#serviceMain ul li .ico {text-align:center;}

#mainBannerMobile {display:block; width:100%; background:#bcc4ca; overflow:hidden;}
#mainBannerMobile ul {width:100%; overflow:hidden;}
#mainBannerMobile ul li {width:100%; overflow:hidden;}
#mainBannerMobile ul li a.mbTabs {display:block; width:100%; height:50px; overflow:hidden;}
#mainBannerMobile ul li .headTouch {position:relative; width:100%; overflow:hidden;}
#mainBannerMobile ul li .headTouch .title {font-size:16px; color:#fff; font-weight:600; line-height:49px; background:#3e4b5d; padding:0 0 0 25px; border-bottom:1px #d0d6da solid;}
#mainBannerMobile ul li .headTouch .arrow {position:absolute; right:25px; top:16px; font-size:22px; color:#fff; font-weight:600;}
#mainBannerMobile ul li .bodyRead {display:none; position:relative; width:100%; height:280px; background:#bcc4ca; overflow:hidden;}
#mainBannerMobile ul li .bodyRead .img {position:absolute; left:0; top:0; z-index:1;}
#mainBannerMobile ul li .bodyRead .img img {width:301px;}
#mainBannerMobile ul li .bodyRead .info {position:relative; padding:30px 0 0 45%; word-break:keep-all; z-index:2;}
#mainBannerMobile ul li .bodyRead .info .tit {font-size:20px; color:#fff; font-weight:600; line-height:1.2; padding:0 0 10px 0;}
#mainBannerMobile ul li .bodyRead .info .txt {margin:0 20px 0 0;}
#mainBannerMobile ul li .bodyRead .info .txt span {display:block; font-size:14px; color:#fff; font-weight:600; line-height:1.4; padding:0 0 0 5px; background:url('../images/bg/bg_bannerdetail_span.gif') left 7px no-repeat;}
#mainBannerMobile ul li .bodyRead .info .btn {margin:12px 0 0 0;}
#mainBannerMobile ul li .bodyRead .info .btn a {display:block; width:168px; height:38px; border:1px #d7e3eb solid; background:url('../images/bg/bg_mtvn_arrow.png') 148px 12px no-repeat;}
#mainBannerMobile ul li .bodyRead .info .btn a span {font-size:14px; color:#fff; font-weight:600; padding:0 0 0 15px; line-height:38px;}
#mainBannerMobile ul li.hover .headTouch .title {background:#bcc4ca; border-bottom:1px #d0d6da solid;}

#eSearch {display:none;}

#eSearchMobile {display:block; width:100%; overflow:hidden;} /*모바일위치고정*/
#eSearchMobile {position:relative; height:10%; margin: 0 auto;}

#eSearchMobile h2 {position:absolute; left:20px; top:0; width:100%}
#eSearchMobile h2 span {display:inline-block; font-size:20px; color:#202c36; font-weight:600; font-family:'Verdana'; padding:10px 0 8px 0; border-bottom:2px #6c8492 solid;}

#eSearchMobile ul {margin-top:40px; width:100%}
#eSearchMobile ul:after {content:""; display:block; clear:both;}
#eSearchMobile ul li {float:left; margin: 1% 3% 1% 3%; /* background-color:#ff0000; */}




}





/*** media query 540px ***/
@media all and (max-width:540px){

.wrap_side iframe{margin: -30px 0 0px 0;height: 90px;}


/* layout */
#navi{display:none; position:absolute; right:-230px; top:0; width:230px; height:100%; background:#486577; z-index:9999;}
#headerWrap {height:80px; background:url('../images/bg/bg_header_wrap_m.gif') left top repeat-x;}
#headerWrap #snb {height:28px; margin:0 5px 0 0;}
#headerWrap #snb ul li {padding: 2px 10px 0; background:url('../images/bg/bg_snb_li.gif') right 8px no-repeat;}
#headerWrap #snb ul li a {font-size:11px;}
#headerWrap #snb ul li.f a {line-height:1.2;}
#headerWrap #snb ul li.lang .langChange {margin:-5px 0 0 0;}
#headerWrap #snb ul li.langBtn {top:6px;}

#header h1 {margin: 5px 0 5px 10px;}
#header h1 img {width:180px;}
#header ul#top li a {line-height:38px; font-size:15px; padding:0 0 0 22px; background:url('../images/bg/bg_mnavi_arrow_m_down.gif') 181px 1px no-repeat;}
#header ul#top li a span {font-size:15px;}
#header ul#top li a#topNavi4 {padding:0 0 0 22px;}
#header ul#top li ul {padding:10px 0 10px 22px;}
#header ul#top li ul li {padding:2px 0; background:url('../images/bg/bg_top_mdepth_dot_m.gif') left 10px no-repeat;}
#header ul#top li ul li a {font-size:13px; font-weight:600; padding:2px 0 2px 10px;}
#header ul#top li ul li a span.dep {font-size:13px;}
#header ul#top li ul li a span.f {font-size:13px;}
#header ul#top li ul li ul {top:6px;}
#header ul#top li ul li ul li a {font-size:13px; padding:1px 0 1px 10px}
#header ul#top li ul li ul li a span.dep {font-size:13px;}
#header ul#top li ul li ul li a:hover {padding:1px 0 1px 10px;}
#header ul#top li ul li a:hover {padding:2px 0 2px 10px; font-weight:600;}

#mnaviHead {height:40px;}
#mnaviHead a {right:7px;}
#mnaviHead a img {width:42px;}
#mnavi img {width:58px; top:28px;}

#footer #flogo img {width:80px;}
#footer address {font-size:11px;}


#footer address .footer-link {padding : 0 5px;}



#serviceMain ul li .subject {font-size:30px; font-weight:600;}









/* main section */
#mainRoll {height:300px;}
#mainRoll .swiper-slide {height:300px;}
#mainRoll .swiper-slide a img {height:300px; margin:0 0 0 -491px;}
#mainRoll .swiper-slide a .point .tit {font-size:36px; padding:90px 0 24px 15px;}
#mainRoll .swiper-slide a .point .txt {display:none; font-size:11px; padding:0 0 0 15px;}

/* #mainThum {bottom:20px;}
#mainThum .swiper-pagination-switch {width:30px;}
 */
#mainThum{bottom:0px;}
#mainThum .swiper-pagination-switch{width:26px; height:23px; background:url('../images/btn/btn_stay_m.png') left top no-repeat /* border:2px #fff solid */; vertical-align:top; margin:8px 1px 0 1px; cursor:pointer; overflow:hidden;}
#mainThum .swiper-active-switch{/* background:#fff; */background:url('../images/btn/btn_now_m.png') left top no-repeat}








#mainBannerMobile ul li a.mbTabs {height:40px;}
#mainBannerMobile ul li .headTouch .title {line-height:39px; padding:0 0 0 20px; font-size:13px;}
#mainBannerMobile ul li .headTouch .arrow {right:20px; top:14px;}
#mainBannerMobile ul li .headTouch .arrow img {width:10px;}
#mainBannerMobile ul li .bodyRead {height:220px;}
#mainBannerMobile ul li .bodyRead .img img {width:237px; margin:0 0 0 -15px;}
#mainBannerMobile ul li .bodyRead .info {padding:15px 0 0 40%;}
#mainBannerMobile ul li .bodyRead .info .tit {font-size:15px;}
#mainBannerMobile ul li .bodyRead .info .txt span {display:block; font-size:12px;}
#mainBannerMobile ul li .bodyRead .info .btn a {width:120px; height:30px; background:url('../images/bg/bg_mtvn_arrow.png') 94px 8px no-repeat;}
#mainBannerMobile ul li .bodyRead .info .btn a span {line-height:30px; font-size:12px;}

#noticeMain, #networkMain, #mobilenewsMain, #serviceMain {padding:20px 20px 0;}
#noticeWrap, #networkWrap, #mobilenewsWrap {padding:0 0 20px 0;}

#mainContent h3 {font-size:15px; padding:0 0 10px 0;}
#mainContent h3 span img {width:20px;}
#mainContent .txt a {font-size:12px; padding:10px 0 0 10px;}

#mobilenewsMain ul li a {font-size:12px; line-height:36px;}

#serviceMain {padding:20px;}
#serviceMain ul li .subject {font-size:12px; line-height:30px;}




/* select change */
span.mainSelectBox{height:30px; background:url('../images/bg/bg_mselect_m.gif') right center #fff no-repeat;}
.mainSelectBoxInner{font-size:12px; line-height:30px; padding:0 0 0 3%; width:97%;}



}




/*** media query 540px ***/
@media all and (max-width:540px){

.wrap_side iframe{margin: -10px 0 0px 0;height: 100px;}

#serviceMain ul li .subject {font-size:20px; font-weight:600;}

#header h1 {margin:1px 0 0 10px;}


}





/*** media query 500px ***/
@media all and (max-width:500px){
	
.wrap_side iframe{margin: -90px 0 0px 0;height: 150px;}


.text-group { display:none;}
	
	
	
		
#serviceMain ul li .subject {font-size:18px; font-weight:600;}
	
	
	
	
	
	
}
	
	
/*** 480px ***/
@media screen and (max-width:480px) {
	.text-group { display:none;}
	
/* download, sns */	
.sns_area .section_cont02>ul>li{float:none;width:100%;}
.sns_area .section_cont02>ul>li:nth-child(2){margin-top:36px;}

.sns_area .section_cont02 .mn_sns {display:none;}
.sns_area .section_cont02 .sns {margin: -20px 0 0 0;}
}	
	
	
	
	

/*** media query 430px ***/
@media all and (max-width:430px){

#headerWrap #snb ul li {padding:2px 10px 0;}
#headerWrap #snb ul li.mn {display:none;}
#headerWrap #snb ul li.lang {padding:0 0 0 10px;}
.wrap_side iframe{margin: -80px 0 0px 0;height: 130px;}

#headerWrap #snb #float_r .ds {display:none;}

.sns_area .section_cont02 .mn_sns {display:none;}
.sns_area .section_cont02 .sns {margin: -20px 0 0 0;}


}






/*** media query 400px ***/
@media all and (max-width:400px){

.wrap_side iframe{margin: -50px 0 0px 0;height: 130px;}
.sns_area .section_cont02 .mn_sns {display:none;}



.sns_area .section_cont02 .sns {margin: -20px 0 0 0;}


}