@charset "utf-8";

/************************************************************************
* FONTS *
************************************************************************/
@import url(https://fonts.googleapis.com/icon?family=Material+Icons);

@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 100; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 300; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 400; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 500; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 700; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); 
} 
@font-face { 
  font-family: 'Noto Sans KR'; 
  font-style: normal; 
  font-weight: 900; 
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), 
       url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); 
}



@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: local('NanumGothic'), url(http://fonts.gstatic.com/s/nanumgothic/v8/PN_3Rfi-oW3hYwmKDpxS7F_D-djY.woff) format('woff');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: local('NanumGothic Bold'), local('NanumGothic-Bold'), url(http://fonts.gstatic.com/s/nanumgothic/v8/PN_oRfi-oW3hYwmKDpxS7F_LQv3LyVsg.woff) format('woff');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: local('NanumGothic ExtraBold'), local('NanumGothic-ExtraBold'), url(http://fonts.gstatic.com/s/nanumgothic/v8/PN_oRfi-oW3hYwmKDpxS7F_LXv7LyVsg.woff) format('woff');
}



@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 400;
  src: local('NanumMyeongjo'), url(http://fonts.gstatic.com/s/nanummyeongjo/v7/9Btx3DZF0dXLMZlywRbVRNhxy2LscnM.woff) format('woff');
}
@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 700;
  src: local('NanumMyeongjo Bold'), local('NanumMyeongjoBold'), url(http://fonts.gstatic.com/s/nanummyeongjo/v7/9Bty3DZF0dXLMZlywRbVRNhxy2pXV2Azr_c.woff) format('woff');
}
@font-face {
  font-family: 'Nanum Myeongjo';
  font-style: normal;
  font-weight: 800;
  src: local('NanumMyeongjo ExtraBold'), local('NanumMyeongjoExtraBold'), url(http://fonts.gstatic.com/s/nanummyeongjo/v7/9Bty3DZF0dXLMZlywRbVRNhxy2pLVGAzr_c.woff) format('woff');
}



@font-face {
font-family: 'NanumSquareB';
font-weight: bold;
font-style: normal;
src: url('/m/fonts/NanumSquareB.eot');
src: url('/m/fonts/NanumSquareB.eot?#iefix') format('embedded-opentype'),
	 url('/m/fonts/NanumSquareB.woff') format('woff'),
	 url('/m/fonts/NanumSquareB.svg#NanumBarunGothic') format('svg'),
	 url('/m/fonts/NanumSquareB.ttf') format('truetype');
}
@font-face {
font-family: 'NanumSquareEB';
font-weight: bolder;
font-style: normal;
src: url('/m/fonts/NanumSquareEB.eot');
src: url('/m/fonts/NanumSquareEB.eot?#iefix') format('embedded-opentype'),
	 url('/m/fonts/NanumSquareEB.woff') format('woff'),
	 url('/m/fonts/NanumSquareEB.svg#NanumBarunGothicBold') format('svg'),
	 url('/m/fonts/NanumSquareEB.ttf') format('truetype');
}
@font-face {
font-family: 'NanumSquareL';
font-weight: lighter;
font-style: normal;
src: url('/m/fonts/NanumSquareL.eot');
src: url('/m/fonts/NanumSquareL.eot?#iefix') format('embedded-opentype'),
	 url('/m/fonts/NanumSquareL.woff') format('woff'),
	 url('/m/fonts/NanumSquareL.svg#NanumBarunGothicBold') format('svg'),
	 url('/m/fonts/NanumSquareL.ttf') format('truetype');
}
@font-face {
font-family: 'NanumSquare';
font-weight: normal;
font-style: normal;
src: url('/m/fonts/NanumSquare.eot');
src: url('/m/fonts/NanumSquare.eot?#iefix') format('embedded-opentype'),
	 url('/m/fonts/NanumSquare.woff') format('woff'),
	 url('/m/fonts/NanumSquare.svg#NanumBarunGothicBold') format('svg'),
	 url('/m/fonts/NanumSquare.ttf') format('truetype');
}
@font-face {
font-family: 'NanumSquareR';
font-weight: normal;
font-style: normal;
src: url('/m/fonts/NanumSquareR.eot');
src: url('/m/fonts/NanumSquareR.eot?#iefix') format('embedded-opentype'),
	 url('/m/fonts/NanumSquareR.woff') format('woff'),
	 url('/m/fonts/NanumSquareR.svg#NanumBarunGothicBold') format('svg'),
	 url('/m/fonts/NanumSquareR.ttf') format('truetype');
}



*{font-family:'Noto Sans KR',Nanum Gothic,나눔고딕,sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;}

.fNS,.fNS b,.fNS u,.fNS i,.fNS span,.fNS font{font-family:'NanumSquare',나눔스퀘어 !important;font-weight:700 !important;}
@media all and (max-width:767px){
.fNS{font-weight:500 !important;}
}



/************************************************************************
* HTML_RESET *
************************************************************************/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,a,button,address,em,img,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,hr,figure{margin:0;padding:0;}
body{width:100%;font-size:14px;font-weight:lighter;color:#000000;position:relative;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
ol,ul,li{list-style:none;}
table{max-width:100%;border-collapse:collapse;border-spacing:0;}
form,fieldset,iframe{display:block;border:0;}
img,button{border:0 none;vertical-align:middle;}
i,em,address{font-style:normal;}
label,button{cursor:pointer;}
caption,legend{display:none;} 
input,textarea,select{margin:0;padding:0;vertical-align:middle;outline:none;}
textarea{border:1px solid #666;resize:none;}
button{overflow:visible;margin:0;padding:0;border:0 none;background:none;font-size:0;vertical-align:top;cursor:pointer;}
button::-moz-focus-inner{border:0;padding:0;}
a,img{outline:none;temp:expression(this.hideFocus=true);}
hr{height:1px;margin:40px 0;border:none;color:#a8a8a8;background:#a8a8a8;}

a{color:#000;text-decoration:none;word-break:break-all;}
a:link,a:visited,a:hover,a:active,a:focus{text-decoration:none;}


*::-moz-selection{background-color:#000000;color:#ffffff;}
*::selection{background-color:#d0d6dd;color:#000000;}



/************************************************************************
* COMMON *
************************************************************************/
.CLEAR{zoom:1;}
.CLEAR:after{content:"";clear:both;display:block;}
.FL{float:left;}
.FR{float:right;}

.LEFT{zoom:1;}
.LEFT:after{content:"";clear:both;display:block;}
.LEFT>li{float:left;}

.TC{text-align:center !important;}

.fcol_w,.fcol_w a{color:#fff !important;}
.fcol_g,.fcol_g a{color:#707070 !important;}
.fcol_b,.fcol_b a{color:#5365b4 !important;}
.fcol_r,.fcol_r a{color:#ed3044 !important;}

.w30{width:30%;}
.w35{width:35%;}
.w40{width:40%;}
.w45{width:45%;}
.w50{width:50%;}
.w55{width:55%;}
.w57{width:57%;}
.w60{width:60%;}
.w65{width:65%;}
.w70{width:70%;}
.w75{width:75%;}
.w80{width:80%;}
.w85{width:85%;}
.w90{width:90%;}
.w95{width:95%;}
.w100{width:100%;}

.uli2 li{width:50%;}
.uli3 li{width:33.33%;}
.uli4 li{width:25%;}
.uli5 li{width:20%;}
.uli6 li{width:16.6666%;}
.uli7 li{width:14.2857%;}

.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}
.mt60{margin-top:60px !important;}
.mt70{margin-top:70px !important;}
.mt80{margin-top:80px !important;}
.mt90{margin-top:90px !important;}
.mt100{margin-top:100px !important;}
.mt110{margin-top:110px !important;}
.mt120{margin-top:120px !important;}


@media screen and (min-width:641px) {
.PH{display:none !important};
}

@media screen and (max-width:640px) {
.MH{display:none !important;}
}



/************************************************************************
* HEADER *
************************************************************************/
.totBox{width:100%;background:#f6f6f6;clear:both;overflow:hidden;}
.totBox ul{width:56%;float:right;}
.totBox li{font-size:10px;line-height:32px;font-weight:400;text-align:center;position:relative;}
.totBox li:after{width:2px;height:2px;margin-top:-1px;background:#555;position:absolute;top:50%;left:0;display:block;content:"";border-radius:50%;}
.totBox li:first-child:after{width:0;}


.header{width:100%;height:60px;overflow:hidden;}
.header ul{width:100%;height:60px;clear:both;overflow:hidden;}
.header ul li{height:60px;display:table;float:right;}
.header ul li img,.header ul li font{display:table;vertical-align:middle;}
.header ul li.logo{width:40%;margin-left:3%;float:left;}
.header ul li.logo img{width:100%;max-width:257px;margin-top:18px;}

.header ul li.cms{width:20%;margin:16px 1% 0 0;text-align:left;}
.header ul li.cms img{width:32%;max-width:34px;padding-right:4%;display:inline-block;}
.header ul li.cms font{width:60%;font-size:14px;font-weight:400;line-height:14px;display:inline-block;}

.header ul li.card{width:20%;margin:17px 1% 0 0;text-align:left;}
.header ul li.card img{width:32%;max-width:34px;padding-right:4%;display:inline-block;}
.header ul li.card font{width:60%;font-size:14px;font-weight:400;line-height:14px;display:inline-block;}

.header ul li.btnAllMenu{width:8%;margin:16px 3% 0 0;text-align:right;}
.header ul li.btnAllMenu img{width:100%;max-width:38px;}

.gnb-open-btn{transition:right .2s ease;visibility:visible;opacity:1;filter:Alpha(opacity=100);transform:translateX(0);-moz-transform:translateX(0);display:block;}
.close-box{height:60px;padding-right:8%;cursor:pointer;display:block;line-height:60px;border-bottom:1px solid #e3e3e3;text-align:right;}
.close-box img{width:20px;}

#gnbM.open{right:0;}
#gnbM{width:240px;max-width:550px;height:100%;position:fixed;top:0px;right:-100%;background-color:#f7f7f7;z-index:99999;overflow-y:auto;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s;}
#gnbNavigation > ul{width:100%;overflow:hidden;}
#gnbNavigation > ul > li{width:100%;position:relative;border-bottom:1px solid #e3e3e3;}
#gnbM.open  #gnbNavigation> ul > li{animation:inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);}
#gnbNavigation > ul > li > a{padding:0 7%;position:relative;display:block;font-size:16px;font-weight:400;line-height:56px;color:#000;text-transform:uppercase;}
#gnbNavigation > ul > li > a span{position:absolute;top:-1px;right:20px;}
#gnbNavigation > ul > li > a span img{width:13px;}
#gnbNavigation > ul > li .gnb-2dep{padding:10px 0;display:none;background:#ebebeb;}
#gnbNavigation > ul > li .gnb-2dep li{}
#gnbNavigation > ul > li .gnb-2dep li a{padding:0 7%;display:block;color:#000;font-size:16px;line-height:40px;}
#gnbMenuBg{width:100%;height:100%;display:none;position:fixed;top:0px;left:0px;cursor:pointer;background-color:#000;background-color:rgba(0,0,0,0.83);z-index:99998;}

@media screen and (max-width:640px){
.header ul li.cms font{font-size:12px;line-height:12px;}
.header ul li.card font{font-size:12px;line-height:12px;}
}
@media screen and (max-width:440px){
.header ul li.cms font{font-size:10px;line-height:10px;}
.header ul li.card font{font-size:10px;line-height:10px;}
}




/************************************************************************
* MENU *
************************************************************************/
.sTop{width:100%;height:48px;background:#546de0;z-index:200;}
.sTop .home{width:7%;height:48px;display:none;}
.sTop .home img{padding-top:15px;}
.topGnb{width:100%;padding:0 20px;overflow:hidden;position:relative;z-index:10;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;}
.topGnb ul{width:100%;font-size:0;overflow-y:hidden;overflow-x:auto;position:relative;vertical-align:top;white-space:nowrap;-webkit-overflow-scrolling:touch;}
.topGnb ul::-webkit-scrollbar{display:none;}
.topGnb ul::-o-scrollbar{display:none;}
.topGnb ul::-ms-scrollbar{display:none;}
.topGnb ul li{display:inline-block;}
.topGnb ul li a{padding:0 14px;text-align:center;font-size:14px;line-height:48px;color:#fff;font-weight:300;display:block;position:relative;}
.topGnb ul li img{width:16px;}
.topGnb ul li:first-child a{padding-right:0;line-height:40px;}
.topGnb ul li:first-child:hover a:after{width:0;}
.topGnb ul li a:after{width:0;height:1px;background:#fff;content:'';position:absolute;left:50%;bottom:6px;opacity:1;display:block;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;-moz-transition:all 0.2s ease;}
.topGnb ul li.active a{font-weight:400;color:#fff;}
.topGnb ul li:hover a:after,.topGnb ul li.active a:after{width:90%;margin-left:-45%;-webkit-transition:all 0.2s ease;transition:all 0.2s ease;-moz-transition:all 0.2s ease;}


@media screen and (max-width:740px) {
.topGnb:after{width:8px;height:18px;background:url(/m/img/arr_pr.png) no-repeat 0 0;position:absolute;top:16px;left:1%;display:block;content:"";}
.topGnb:before{width:8px;height:18px;background:url(/m/img/arr_ne.png) no-repeat 0 0;position:absolute;top:16px;right:1%;display:block;content:"";}
}




/************************************************************************
* MAIN_VISUAL *
************************************************************************/
#vissual{width:100%;clear:both;overflow:hidden;position:relative;z-index:1;}
.main{position:relative;}
.title-zone{text-align:center;position:relative;}
.main .title-zone{width:100%;height:360px;}
.main .title-zone .visual{width:100%;height:360px;display:table;background-size:cover}
.main .title-zone .visual .inner{padding-bottom:40px;display:table-cell;vertical-align:bottom;}
.main .bg-img{display:none;}
.main .bg-img img{width:90%;margin:0 auto;}


@media screen and (min-width:641px) {
.main .title-zone{height:460px;}
.main .title-zone .visual{height:460px;}
}

.visual-section{width:100%;position:absolute;top:0;left:0;}
.visual h1.tit{font-size:26px;color:#fff;letter-spacing:-0.06em;font-weight:bold;text-align:center;display:none;-webkit-animation:move 0.8s ease;-moz-animation:move 0.8s ease;-o-animation:move 0.8s ease;-ms-animation:move 0.8s ease;animation:move 0.8s ease;display:block;font-family:NanumSquare,Noto Sans KR;text-shadow:1px 1px 4px rgba(0,0,0,.75);}
.visual div.txt{padding-top:8px;margin-bottom:20px;font-size:14px;color:#fff;font-weight:normal;text-align:center;display:none;-webkit-animation:move 1s ease;-moz-animation:move 1s ease;-o-animation:move 1s ease;-ms-animation:move 1s ease;animation:move 1s ease;display:block;font-family:NanumSquare,Noto Sans KR;text-shadow:1px 1px 4px rgba(0,0,0,.75);}


@-webkit-keyframes move {
	0% {transform:translateY(100px);opacity:0;}
	100% {transform:translateY(0);opacity:1;}
}
@-moz-keyframes move { 
	0% {transform:translateY(100px);opacity:0;}
	100% {transform:translateY(0);opacity:1;}
}
@-o-keyframes move {
	0% {transform:translateY(100px);opacity:0;}
	100% {transform:translateY(0);opacity:1;}
}
@-ms-keyframes move {
	0% {transform:translateY(100px);opacity:0;}
	100% {transform:translateY(0);opacity:1;}
}
@keyframes move {
	0% {transform:translateY(100px);opacity:0;}
	100% {transform:translateY(0);opacity:1;}
}

.indicator{width:100%;position:absolute;bottom:10px;left:0;display:inline-block;text-align:center;z-index:10;}

.btngroup{display:inline-block;vertical-align:top;font-size:0;margin-left:8px;}
.btngroup li{display:none;font-size:0;}
.btngroup li.on{display:block;}
.btngroup .btn button{background:url(/m/img/vis_bt.png) no-repeat 0 0;}
.btngroup .play button{width:7px;height:14px;background-position:-63px 0;font-size:0px;text-indent:-9999px;}
.btngroup input[type='button']{font-size:0px;}
.btngroup .stop button{width:12px;height:14px;background-position:-44px 0;font-size:0px;text-indent:-9999px;}
.btngroup-num{display:inline-block;vertical-align:top;font-size:0;}
.btngroup-num:after{display:block;clear:both;content:"";}
.btngroup-num li{margin-left:8px;font-size:0;float:left;}
.btngroup-num li a{width:14px;height:14px;display:block;background:url(/m/img/vis_bt.png) no-repeat 0 0;background-position:-22px 0;text-indent:-999em;}
.btngroup-num li.on a{background-position:0 0;}



/************************************************************************
* SUB_LNB_MENU *
************************************************************************/
#lnb{width:100%;position:relative;border-bottom:solid 1px #eaeaea;z-index:1;}
.lnbClone{height:46px;display:none;}
#lnb .lnbIn{max-width:740px;margin:0 auto;position:relative;*zoom:1;}
#lnb .lnbIn:after{content:"";display:block;clear:both;}
#lnb .lnbIn .nav{float:left;}
#lnb .lnbIn .nav>li{position:relative;float:left;background:url(/m/img/lnb_arr.gif) no-repeat right center;}
#lnb .lnbIn .nav>li.current{background-color:#2f347e;}
#lnb .lnbIn .nav>li>a{min-width:220px;max-width:220px;padding:0 20px 0 16px;font-size:14px;font-weight:300;line-height:46px;color:#7e7e7e;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
#lnb .lnbIn .nav>li:last-child>a{font-weight:400;color:#000;}
#lnb .lnbIn .nav a{color:#fff;}
#lnb .lnbIn .nav ul{width:100%;display:none;position:absolute;top:100%;left:0;background-color:#37342f;}
#lnb .lnbIn .nav li.current ul{background-color:#37342f;}
#lnb .lnbIn .nav ul a{padding:10px 14px;position:relative;display:block;border-bottom:solid 1px #47443e;line-height:20px;}
#lnb .lnbIn .nav ul a:after{width:4px;height:7px;margin-top:-3px;display:none;content:"";position:absolute;top:50%;right:20px;background:url(/m/img/ico.png) no-repeat 0 -7px;}
#lnb .lnbIn .nav ul a:hover:after,#lnb .lnbIn .nav ul a:focus:after{display:block;}
#lnb .lnbIn .nav li>.menu_icon:after{width:6px;height:7px;margin-top:-4px;position:absolute;top:50%;right:20px;display:inline-block;background-image:url(/m/img/ico.png);background-repeat:no-repeat;content:"";background-position:0 0;}
#lnb .lnbIn .nav li.active>.menu_icon:after{height:2px;margin-top:-1px;}

@media screen and (max-width:640px){
#lnb .lnbIn{max-width:640px;}
#lnb .lnbIn .nav>li>a{min-width:150px;max-width:150px;}
}





/************************************************************************
* QUICK *
************************************************************************/
.quickBox{max-width:740px;margin:0 auto;}
.quickBox ul li{text-align:center;}
.quickBox ul li a{width:90%;margin:0 auto 20px auto;padding:24px 0;border:solid 1px #e0e0e0;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;}
.quickBox ul li img{width:50%;margin:0 auto;display:block;}
.quickBox ul li font{font-size:16px;font-weight:400;display:block;}

@media screen and (max-width:640px){
.quickBox{max-width:640px;}
.quickBox ul li a{width:94%;margin-bottom:8px;}
}




/************************************************************************
* FOTTER *
************************************************************************/
.btmBt{width:100%;background:#dcdcdc;}
.btmBt li{position:relative;}
.btmBt li:after{width:1px;height:8px;margin-top:-4px;background:#b0b0b0;position:absolute;top:50%;left:0;display:block;content:"";}
.btmBt li:first-child:after{width:0;}
.btmBt li a{width:100%;padding:14px 0;text-align:center;font-size:14px;font-weight:400;display:block;}

footer{width:100%;padding:20px 0;text-align:center;font-size:12px;line-height:20px;font-weight:300;letter-spacing:-0.04em;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;}

@media screen and (max-width:640px){
.btmBt li a{padding:12px 0;font-size:12px;}
}