﻿@charset "utf-8";
/* *******************************************************
 * filename : layout.css
 * description : 전체 공통 레이아웃 CSS
 * date : 2020-06-25
******************************************************** */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
/* ****************** LAYOUT ********************** */
* {margin: 0;padding: 0}
body, table, th, td, button, select, input, textarea { font-family: 'Noto Sans KR', sans-serif; font-size: 13px;color: #666;-webkit-text-size-adjust: none;word-break: keep-all;}
body { background-color: #fff;overflow-x: hidden;}
#wrap {overflow: hidden;width: 100%;min-width: 320px; position: relative;}
.area {max-width: 1200px;margin: 0px auto;position: relative;box-sizing: border-box;}
.area-box {max-width: 1300px;margin: 0px auto;position: relative;box-sizing: border-box;}
.justify-content-between { -ms-flex-pack: justify !important;justify-content: space-between !important;}
.fp-section {position: relative;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.fp-section.fp-table, .fp-slide.fp-table {display: table;table-layout: fixed;width: 100%;}
.table {display: table;width: 100%;height: 100%;}
.table-cell {display: table-cell;width: 100%;height: 100%;vertical-align: middle;}
.m_only {display: none;}
.pc_only {display: block;}
.pcbr {display: block;}
.tbbr,.mbbr{display: none;}
button {margin: 0px;padding: 0px;cursor: pointer;border: 0px;background: none;}
/* For Screen Reader */
legend, blind {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
/* For Screen Reader */
caption {display:none;visibility:hidden;}
fieldset{ border:0}
/* ****************** 공통 button ********************** */
.more-btns a{overflow: hidden; position: relative;display: inline-block; width: 146px; height: 40px;border: 2px solid #0f529d; font-size: 18px;letter-spacing: -0.5px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;-ms-transition: all 0.3s; transition: all 0.3s;font-size: 15px;font-weight: 600;letter-spacing: 0;box-sizing: border-box; color: #0f529d;}
.more-btns a strong{position:relative; z-index:1; left:10px; line-height:34px; color: #0f529d; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.more-btns a .arrow{position:absolute; top:50%; right:10px; height:12px; margin-top:-8px; font-size: 17px;}
.more-btns a:before{display:block; position:absolute; left:-130%; bottom:0; content:""; width:120%; height:150%; background:#0f529d;transform:skew(-20deg);-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s}
.more-btns a:hover strong{color:#fff; left:20px;}
.more-btns a:hover, .more-btns a:hover strong{ color:#fff}
.more-btns a:hover:before{left:-10%; opacity:1.0;filter:Alpha(opacity=100);}
/*white*/
.more-btns a.white:before{ background:#fff;}
.more-btns a.white:hover .arrow, .more-btns a.white:hover strong{ color:#0f529d!important}
/*탭공통*/
.cm-tab-list ul{ position:relative}
/* ****************** quick_menu ********************** */



#quick_menu{position: fixed;right: -161px;/*top: 313px;*/top:457px; width:160px;z-index:999999999;transition-duration: 0.35s;}
#wrap.scrollHeader #quick_menu{top:150px;}
#quick_menu .quick_con{ position:relative; background:#fff}
#quick_menu .quick_con:before{ background:url(../../img/mascot.png) no-repeat center; width:100%; position:absolute; top:0; content:""; display:block; height:185px; margin-top:-89px; z-index:1}
#wrap.layerPopYes #quick_menu {top: 457px;}
/* quick_menu */
#quick_menu .btn_close{position:absolute;top:0;right:160px;width:36px;height:42px;background:url("../../img/icon_quickMenu_close.png") left top no-repeat; border:0} 
#quick_menu .btn_close .todayGurye{display:none;}
#quick_menu .btn_close a{display:block;width:100%;height:100%;font-size:0;}
#quick_menu .btn_open{position:absolute;top:0;right:160px;width:31px;height:231px;} 
#quick_menu .btn_open a{display:block;font-size:0;}
#quick_menu .btn_open .openMenu{width:100%;height:145px;background:url("../../img/icon_quickMenu_open.png") left top no-repeat;}
#quick_menu .btn_open .quick_top{width:100%;height:42px; background:url("../../img/icon_quickMenu_closetop.png") no-repeat left top}
#quick_menu #quick_menu_wrap{width:160px;}
#quick_menu .quick_con .tit{position:relative;height:42px;background-color:#ef860d;}
#quick_menu .quick_con .tit h2{padding:12px 0 0 22px;font-size:16px;font-weight:500;color:#fff;}
#quick_menu .quick_con .tit a{position:absolute;right:5px;top:4px;width:35px;height:38px;font-size:0;}
#quick_menu .quick_con .list{border-left:1px solid #e4e4e4;position:relative; z-index:3}
#quick_menu .quick_con .list li{padding: 15px 12px 15px 35px;border-bottom: 1px dashed #ddd; position:relative;}
#quick_menu .quick_con .list li:before{ content:""; display:block; width:32px; height:38px; position:absolute; left:10px; top:50%;background-image:url("../../img/list_quickCon.png"); background-position: left 7px; background-repeat:no-repeat; margin-top:-19px}
#quick_menu .quick_con .list li:nth-child(2):before{background-position: -34px 7px;}
#quick_menu .quick_con .list li:nth-child(3):before{background-position: -65px 7px;}
#quick_menu .quick_con .list a{display:block;line-height:1.3;padding:0 0 0 13px;color:#555;}
#quick_menu .quick_con .list li:first-child{}
#quick_menu .quick_con .list li:first-child{}
#quick_menu .quick_con .list li:first-child{}
#quick_menu .quick_con .list a:hover,
#quick_menu .quick_con .list a:focus{font-weight:500;color:#ef860d;}
#quick_menu .quick_con .etc_link a{position:relative;display:block;font-weight:500;}
#quick_menu .quick_con .eduApply{background-color:#edefef;}
#quick_menu .quick_con .eduApply a{padding:16px 0 14px 45px;font-size:13px;color:#494a4f;background:url("../../img/icon_eduApply.png") 12px 18px no-repeat;}
#quick_menu .quick_con .quick_top{width:100%;background-color:#6eb92b;border-radius:0 0 0 5px;overflow:hidden;margin-top:-1px; text-align:center;padding: 2px 0 9px;}
#quick_menu .quick_con .quick_top a{display:block; width:100%; box-sizing:border-box;}
#quick_menu .quick_con .quick_top a p, #quick_menu .quick_con .quick_top a span{color:#fff; font-size:14px}
/*카테고리 탭*/
#bo_cate {width:100%; position:relative;}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {zoom:1}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {display:inline-block;margin-left: -2px;width: 16.6666%;}
#bo_cate a { display: table;width: 100%; height: 59px;border: 1px solid #d5d5d5;background: #f9f9f9; font-weight: 500;font-size: 16px;letter-spacing: -0.5px; line-height:59px; text-align:center; box-sizing:border-box;}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {background: #ff6c18;border: 1px solid #ff6c18; color:#fff}
#bo_cate #bo_cate_on {background: #ff6c18;border: 1px solid #ff6c18; color:#fff}
/* mask */
/* ****************** HEADER ********************** */
.gnb-overlay-bg{display:none}
#header {width: 100%; position:relative; z-index:99999; background:#fff;}
#header.fixed{ position:fixed;}
#gnbBg{display:none; position:absolute; left:0; top:90px; width:100%; height:250px; border-bottom:2px solid #f6821c; border-top:1px solid #ddd; z-index:1; background:#fff}	/* gnb 2depth BG */
#gnbBg > div{ height:100%; background:url(../../img/gnb_bg.png) no-repeat 3% center;}
#header.over .head_inner{background-color:#fff;}
#header .head_inner {position: relative; width: 100%; border-bottom: 1px solid #e3e3e3;}
/* -------- Header :: top BOX -------- */
.head_inner .toparea_wrap {overflow: hidden;width: 100%;border-bottom: 1px solid #e3e3e3}
.head_inner .toparea_wrap .toparea { overflow: hidden;max-width: 1300px; height: 36px; line-height: 36px;margin: 0 auto}
.head_inner .toparea_wrap .toparea .clear {float: right}
.head_inner .toparea_wrap .toparea .topmenu {overflow: hidden;float:right; border-left: 1px solid #e3e3e3;padding: 0 7px}
.head_inner .toparea_wrap .toparea .topmenu li {float: left;margin: 0 7px}
.head_inner .toparea_wrap .toparea .topmenu li a {color: #999;font-size: 11px}
.head_inner .toparea_wrap .toparea .language {overflow: hidden;float:right;padding: 0 7px;border-left: 1px solid #e3e3e3;border-right: 1px solid #e3e3e3}

.head_inner .toparea_wrap .toparea .language li {float: left; margin: 0 7px}
.head_inner .toparea_wrap .toparea .language li a { color: #999; font-size: 11px}
.head_inner .toparea_wrap .toparea .language li.on a {border-bottom: 1px solid #666;color: #666}
.head_inner .toparea_wrap .toparea .webtoon {overflow: hidden;float:right; padding: 0 60px 0 40px;border-right: 1px solid #e3e3e3; background:url(../../img/webtoon_img.jpg) no-repeat 12px center}
.head_inner .toparea_wrap .toparea .vr_map {float: right; padding: 0 17px; border-left: 1px solid #e3e3e3; background: #ef860e}
.head_inner .toparea_wrap .toparea .vr_map a {color: #fff;}
/* -------- Header :: GNB(PC) -------- */
.head_inner .menuarea{margin:0 auto;height:92px;width:100%; position:relative;}
.head_inner .menuarea h1{display:block;float:left;line-height:85px; padding-left:1.5%}
.head_inner .menuarea h1 a{ display:inline-block;}
.head_inner .menuarea .menu{float:right; position:relative; z-index:10}
.head_inner .menuarea .menu>li{float:left;position:relative;/*margin-left:100px;*/margin-left: 55px}
.head_inner .menuarea .menu>li>a{display:block;font-size:18px;font-weight:500;color:#666;line-height:92px}
.head_inner .menuarea .menu>li:hover{-webkit-box-shadow:0 -3px 0 #f6821c inset;box-shadow:0 -3px 0 #f6821c inset}
.head_inner .menuarea .menu>li.on{-webkit-box-shadow:0 -3px 0 #f6821c inset;box-shadow:0 -3px 0 #f6821c inset}
.head_inner .menuarea .menu>li:hover>a{color:#f6821c}
.head_inner .menuarea .menu>li.on>a{color:#f6821c}
.head_inner .menuarea .menu>li>ul{display:none;position:absolute;left:50%;top:100%;z-index:100;margin-left:-91px;width:183px; padding-top:30px; padding-bottom:150%}
.head_inner .menuarea .menu>li>ul>li{}
.head_inner .menuarea .menu>li>ul>li>a{display:block;width:100%;height:35px;text-align:center;line-height:35px;font-size:15px;color:#838383}
.head_inner .menuarea .menu>li>ul>li>a > span{display: inline-block; line-height: 1.3; vertical-align: middle;  padding-top: 7px;}
.head_inner .menuarea .menu>li>ul>li:hover>a{color:#f6821c}
.head_inner .menuarea .menu>li.gnb1 ul:after{width: 1px;height: 180px;content: "";display: block;background: #ccc;position: absolute; left: 0;top: 0;margin-top: 38px;}
/* -------- Header :: GNB(mobile) -------- */
.head_inner .nav-open-btn, #GnbM_container{ display:none}


/* ****************** FOOTER ********************** */
#footer{background-color:#fff; margin-top:5%}
.footer-left-con{float:left; }
.footer-right-con{float:right; }
/* -------- ### FooterTop :: 상단 ###  -------- */
#footerTop{border-top:1px solid #ddd; padding:17px 0 22px}
/* Footer :: 푸터로고 */
.foot-logo{float:left; padding-right:40px;}
.foot-logo img{width: 140px;padding-top: 7px;}
/* Footer :: 푸터메뉴 */
.foot-menu{float:left; overflow:hidden; }
.foot-menu li{float:left; line-height:50px;}
.foot-menu li:before{display:inline-block; content:""; vertical-align:middle; margin:-3px 15px 0 15px; width:1px; height:20px; background-color:#ccc}
.foot-menu li:first-child:before{display:none} 
.foot-menu li a{color:#191919; font-size:16px; letter-spacing:-0.5px;}
/* --------  상단 오른쪽 -------- */
.partner-list-con{padding-top:20px;}
.partner-list-con span{display:inline-block; vertical-align:middle; margin-left:13px}
/* -------- ### footerMiddle :: 정보 및 사이트맵 ###  -------- */
#footerMiddle{background-color:#f1f3f2; padding:55px 0}
/* Footer :: 왼쪽정보 */
.footer-company-name{display:block; color:#1d1b1c; font-size:18px; letter-spacing:-0.5px; font-weight:500; margin-bottom:25px}
.family-address p{color:#1d1b1c; font-size:14.5px; line-height:28px; opacity:0.5;filter:Alpha(opacity=50);}
.family-address p br{display:none;}
.family-address span:before{content:"/"; margin:0 10px;}
.family-address span:first-child:before{display:none}
.family-address a{color:inherit}
.family-address .footer-caution-txt{color:#fffefe; font-size:13px; font-weight:300; padding-top:30px; opacity:1.0;filter:Alpha(opacity=100);}
.family-address .footer-caution-txt p{display:inline-block; opacity:0.4;filter:Alpha(opacity=40);}
.family-address .footer-caution-txt i{margin-right:10px; margin-top:-2px; font-size:30px; opacity:0.7;filter:Alpha(opacity=70);color: #1d1b1c; vertical-align:top}
.family-address .copyright{font-size:13px;}
.family-address .footer-caution-txt p br{ display:block}
/* Footer :: 사이트맵  */
.footer-sitemap-con > li{float:left; min-height:155px;  padding:0 40px 0 10px}
.footer-sitemap-con > li dt{margin-bottom:30px; font-size:16px; color:#1d1b1c; letter-spacing:-0.5px;}
.footer-sitemap-con > li  .sitemap-2dep-con li a{display:block; color:#1d1b1c; font-size:14.5px; letter-spacing:-0.5px; font-weight:300; padding:8px 0; opacity:0.8;filter:Alpha(opacity=80); -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
.footer-sitemap-con > li  .sitemap-2dep-con li a:hover{opacity:1.0;filter:Alpha(opacity=100);}
/* -------- ### footerBottom :: 하단 ###  -------- */
#footerBottom{position:relative; border-top:1px solid #c4c9c7; background-color:#fff; }
/* Footer :: COPYRIGHT */
.copyright, .remote-control-txt{line-height:74px;}
.copyright{font-size:15px; color:#1d1b1c; opacity:0.6;filter:Alpha(opacity=60); font-weight:300; margin-right:35px;}
.remote-control-txt{color:#fff; font-size:14px; font-weight:500;}
.remote-control-txt i{color:#007ecc; font-size:30px; margin-right:10px;}
/* Footer ::  개인정보처리방침, 패밀리사이트 */
.footer-agreement-btn,.family-site-box{float:left; position:relative; text-align:left;}
.footer-agreement-btn,
.family-site-box .family-site-open-btn{display:block; position:relative; width:250px; height:74px; line-height:74px; text-indent:20px; font-size:14.5px; color:#eb6107!important; font-weight:300;}
.footer-agreement-btn:after,
.family-site-box .family-site-open-btn:after{position:absolute; bottom:0px; left:0px; width:100%; content:""; height:3px; background-color:#eb6107;}
.footer-agreement-btn .arrow,
.family-site-box .family-site-open-btn .arrow{position:absolute; right:20px; top:0px;}
.family-site-box{margin-left:10px;}
.family-site-list{position:absolute; bottom:74px; left:0px; width:100%;  padding:10px 0; max-height:150px; overflow:auto; background-color:#fff; border:1px solid #c4c9c7; border-bottom:0;  z-index:11; display:none; box-sizing:border-box;}
.family-site-list a{display:block; padding:10px; color:#1d1b1c; font-size:13px;}
.family-site-list a:hover{color:#eb6107; text-decoration:underline;}

/* Footer :: TOP버튼 */
.to-top-btn{
	position:absolute; bottom:0; right:0; display:block; width:74px; height:74px; background-color:#ef860d; text-align:center; line-height:74px; color:#fff; z-index:99;
	-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-o-transition:all 0.6s;-ms-transition:all 0.6s;transition:all 0.6s
}
.to-top-btn.fixed{}

@media all and (max-width:1400px) {
/* ****************** HEADER ********************** */

}
@media all and (max-width:1350px) {
.area-box, .area {padding: 0 15px;max-width:100%}	
/*header*/
.head_inner .menuarea .menu{ padding-right:1.5%}
/* ****************** footer ********************** */
.footer-left-con{float:none; }
.footer-right-con{float:none; }
/* -------- ### FooterTop :: 상단 ###  -------- */
#footerTop .footer-left-con{float:left;}
#footerTop .footer-right-con{float:right;}
.foot-logo{padding-right:20px;}
.foot-menu li:before{height:15px; margin:-2px 8px 0 8px}
.foot-menu li a{font-size:13px; }
.partner-list-con{padding-top:15px;}
.partner-list-con span{margin-left:3px;}
.partner-list-con span img{height:25px;}
/* -------- ### footerMiddle :: 정보 및 사이트맵 ###  -------- */
#footerMiddle .footer-right-con{display:none;}
}

@media all and (max-width:1280px){
#gnbBg > div{ background-size:30%;}	
}
@media all and (max-width:1200px){
/* ****************** HEADER ********************** */	

}
@media all and (max-width:1120px){
/* ****************** 공통 button ********************** */
.more-btns a strong{left:5px;}
.more-btns a .arrow{position:absolute; top:50%; right:10px; height:12px; margin-top:-8px; font-size: 17px;}
.more-btns a:before{display:block; position:absolute; left:-130%; bottom:0; content:""; width:120%; height:150%; background:#0f529d;transform:skew(-20deg);-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s}
.more-btns a:hover strong{color:#fff; left:20px;}
.more-btns a:hover, .more-btns a:hover strong{ color:#fff}
.more-btns a:hover:before{left:-10%; opacity:1.0;filter:Alpha(opacity=100);}
/*header*/
.head_inner .menuarea h1 a img{ width: 135px}
.head_inner .menuarea .menu>li>a{ font-size:15px}
.head_inner .menuarea .menu>li>ul{ padding-top:15px}
.head_inner .menuarea .menu>li>ul>li>a{ font-size:14px}
}
@media all and (max-width:1080px) {
/* ****************** HEADER ********************** */
.head_inner .menuarea .menu>li.gnb1 ul:after{ display:none}
/* -------- ### FooterTop :: 상단 ###  -------- */
#footerTop .footer-left-con,
#footerTop .footer-right-con{float:none; text-align:center;}
.foot-logo{float:none; text-align:center; padding-right:0;}
.foot-menu{display:none;}
/* -------- ### footerMiddle :: 정보 및 사이트맵 ###  -------- */
#footerMiddle{text-align:center; padding:24px 0}
#footerBottom{text-align:center;}
}
@media all and (max-width:990px) {
#quick_menu{ display:none}	
.head_inner .menuarea .menu>li{ margin-left:40px}
}
@media all and (max-width:900px) {
/* ****************** HEADER ********************** */	
.gnb-overlay-bg{display: none;position: fixed;top:67px;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);z-index:999;}
#GnbM_container{ display:block;}
.toparea_wrap, #gnb, #gnbBg{display:none}
.head_inner .nav-open-btn{position:absolute;right:0;top:0;width:1.65em;height:1.65em;border-left:1px solid #ddd;width:26px;height:46px;line-height:66px;padding:10px 20px;cursor:pointer; display:block; z-index:100}
.head_inner .nav-open-btn>div{width:100%;height:2px;margin:0 0 .43em;background:#7d7d7d;-webkit-transition:all .3s;transition:all .3s;vertical-align:baseline}
.head_inner .nav-open-btn>div:nth-child(1){margin-top:15px}
.head_inner .nav-open-btn.active>div:nth-child(1){-webkit-transform:translateY(7px) rotate(45deg);transform:translateY(7px) rotate(45deg)}
.head_inner .nav-open-btn.active>div:nth-child(2){opacity:0}
.head_inner .nav-open-btn.active>div:nth-child(3){-webkit-transform:translateY(-8px) rotate(-45deg);transform:translateY(-8px) rotate(-45deg)}	
#header .head_inner{position:relative;width:100%;height:66px;border-bottom:1px solid #e3e3e3}
#header .head_inner .logo{text-align:center; line-height:66px; float:none; padding-right:8%}
#header .head_inner .logo img{ width:120px;position: relative;top: -5px}
.head_inner .menuarea, .head_inner .nav{ height:100%;}

#gnbM_inner{display:block;position:fixed;right: -82%;top:67px;z-index:1000;width:77%;height:100%;background:#fff;transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
-webkit-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);-oz-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);-ms-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); visibility: hidden;}
#gnbM_inner.open {right: 0px;visibility: visible; overflow-y:scroll}
#gnbM_inner .M_toparea{overflow:hidden;border-bottom:1px solid #ddd;}
#gnbM_inner .M_toparea .topmenu li{float:left;width:50%;-webkit-box-shadow:-1px 0 0 #ddd inset;box-shadow:-1px 0 0 #ddd inset}
#gnbM_inner .M_toparea .topmenu li:first-child{display:none}
#gnbM_inner .M_toparea .topmenu li a{display:block;height:40px;line-height:40px;font-size:12px;text-align:center}
#gnbM_inner .M_toparea .language{overflow:hidden;width:100%; padding:20px;background:#eee; box-sizing:border-box;}
#gnbM_inner .M_toparea .language li{float:left;width:33.333%}
#gnbM_inner .M_toparea .language li a{display:block;height:40px;line-height:40px;text-align:center; border:1px solid #ddd; border-right:0;}
#gnbM_inner .M_toparea .language li:last-child a{ border-right:1px solid #ddd}
#gnbM_inner .M_toparea .language li.on a{ background:#f6821c; color:#fff}
#gnbM_inner .M_toparea .webtoon{overflow: hidden; line-height: initial;padding: 10px 0; text-align:center; background: url(../../img/webtoon_img.jpg) no-repeat 52% center;}
#gnbM_inner .M_toparea .vr_map {width: 100%; height: 50px; line-height: 50px; text-align: center; border-bottom: 1px solid #ef860e;}
#gnbM_inner .M_toparea .vr_map a {display: block; color: #000;}

#gnbM_inner .m_navList>li{-webkit-box-shadow:0 -1px 0 #ddd inset;box-shadow:0 -1px 0 #ddd inset; position:relative;}
#gnbM_inner .m_navList>li>a{display:block;font-size:15px;font-weight:500;height:50px;line-height:50px;padding:0 15px;position:relative;}
#gnbM_inner .m_navList>li>ul{display:none;overflow:hidden;border-top:1px solid #ddd;background:#f6f6f6;-webkit-box-shadow:0 -1px 0 #ddd inset;box-shadow:0 -1px 0 #ddd inset}
#gnbM_inner .m_navList>li>ul>li{float:left;width:50%;-webkit-box-shadow:0 -1px 0 #ddd inset;box-shadow:0 -1px 0 #ddd inset}
#gnbM_inner .m_navList>li>ul>li:nth-child(odd){-webkit-box-shadow:-1px -1px 0 #ddd inset;box-shadow:-1px -1px 0 #ddd inset}
#gnbM_inner .m_navList>li>ul>li>a{display:block;height:40px;line-height:40px;text-align:center;font-size:13px;font-weight:500;}
#gnbM_inner .m_navList>li a .gnb-icon {position: absolute;top: 50%;right: 15px;margin-top: -13px;line-height: initial;color: #999;}
#gnbM_inner .m_navList>li a .gnb-icon i { font-size: 20px;}
#gnbM_inner .m_navList>li.active > a,#gnbM_inner .m_navList>li.active > a .gnb-icon{color:#f6821c;}

}
@media all and (max-width:800px) {
.m_only{display:block;}
.pc_only{ display:none;}	
/*카테고리 탭*/
#bo_cate a{ font-size:13px; height:45px; line-height:45px}
/* -------- Header :: GNB(mobile) -------- */
/*footer*/
/* -------- ### FooterTop :: 상단 ###  -------- */
#footerBottom .area-box{position: initial;}
.partner-list-con span img{height:16px;}
.foot-logo img{ width:105px}
/* -------- ### footerMiddle :: 정보 및 사이트맵 ###  -------- */
.footer-company-name{font-size:15px; margin-bottom:15px;}
.family-address .footer-caution-txt{display:none;}
.family-address p{font-size:12px; line-height:20px;}
.family-address p br{display:block;}
.family-address p br + span:before{display:none;}
/* -------- ### footerBottom :: 하단 ###  -------- */
#footerBottom{position:relative; border-top:0;}
#footerBottom .copyright{position: absolute;bottom: 0px; left: 15px; line-height: 55px; margin-right: 0; font-size: 11px;font-weight: 400; letter-spacing: -0.2px;}
.copyright, .remote-control-txt{line-height:30px; font-size:12px;}
.remote-control-txt i{font-size:20px; margin-right:5px; margin-top:-2px;}
#footerBottom .footer-right-con{margin:0 -15px; border-top:1px solid #c4c9c7;padding-bottom:55px}
.footer-agreement-btn, .family-site-box .family-site-open-btn{ border-bottom:1px solid #c4c9c7; }
/* Footer ::  개인정보처리방침, 패밀리사이트 */
.footer-agreement-btn,.family-site-box{width:50%; margin:0;}
.family-site-box .family-site-open-btn{width:100%;}
.footer-agreement-btn,
.family-site-box .family-site-open-btn{height:40px; line-height:40px; text-indent:5%; font-size:11px;}
.footer-agreement-btn:after,
.family-site-box .family-site-open-btn:after{display:none;}
.footer-agreement-btn .arrow i,
.family-site-box .family-site-open-btn .arrow i{font-size:16px;}
.family-site-list{bottom:40px;}
/* Footer :: TOP버튼 */
.to-top-btn{width:55px; height:55px; line-height:55px;}
}
@media all and (max-width:768px) {
/*카테고리 탭*/
#bo_cate li{ width:20%}	
}
@media all and (max-width:576px) {
/* ****************** HEADER ********************** */
#header .head_inner .logo img{ width:110px}
/*카테고리 탭*/
bo_cate_ul{ margin-left:3px}
#bo_cate li{width: 33.7%;}	
}
@media all and ( max-width: 480px ) {
#footerTop{padding: 10px 0 15px}
.main_visual .pcbr {display: none;}
.main_visual .tbbr, .main_visual .mbbr{display: block;}
}
@media all and ( max-width: 359px ) {
	

}
/* ****************** MODAL LAYERPOPUP ********************** */
/* modal layer */
.modal-fixed-pop-wrapper{display:none; overflow-y:scroll; overflow-x:hidden;  position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:9999999; background:#000; background:rgba(0,0,0,0.8);}
.modal-fixed-pop-inner{position:absolute; display:table; width:100%; height:100%; text-align:center;}
.modal-inner-box{ position:relative; display:table-cell; vertical-align:middle;}
.modal-loading{position:absolute; top:50%; left:50%; margin:-25px 0 0 -25px; z-index:10000;}
.modal-inner-content{text-align:left;}
.loading {
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 8px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}



/* modal layer content */
.footer-modal-content{position:relative; width:96%; max-width:1000px; margin:20px auto; background-color:#fff; }
.footer-modal-content h1{height:60px; line-height:60px; font-size:24px; font-weight:600; letter-spacing:-0.5px; text-align:center; padding:0; background-color:#f0612a; color:#fff;}
.modal-close-btn{position:absolute; top:11px; right:10px; color:#fff; }
.modal-close-btn i{font-size:38px;}
.modal-close-btn i:hover {color:#fff}
.footer-inner-box{padding:30px; }
.footer-inner{height:400px; box-sizing:border-box;}
.footer-inner textarea{ display: block;width: 100%;height: 100%;border: 1px solid #ddd;padding: 20px;box-sizing: border-box; word-break:break-word;word-break:keep-all;}
/* ****************** MODAL LAYERPOPUP ********************** */
@media all and ( max-width: 800px ){
/* modal layer content */
.footer-modal-content h1{height:46px; line-height:46px; font-size:18px; text-align:left; padding:0 15px}
.modal-close-btn i{font-size:24px}
.footer-inner-box{padding:15px}
.footer-inner{padding:10px; height:250px;}
}
/* ******************  Fade In 효과 ********************* */
/******** Animation *********/
@media all and (min-width:801px){
/* 서브 공통 :: 스크롤효과 */
.fade-in{opacity:0;filter:Alpha(opacity=0); }
.fade-in-left{opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateX(-10%); -moz-transform: translateX(-10%); -ms-transform: translateX(-10%); -o-transform: translateX(-10%); transform: translateX(-10%);}
.fade-in-right{opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateX(10%); -moz-transform: translateX(10%); -ms-transform: translateX(10%); -o-transform: translateX(10%); transform: translateX(10%);}
.fade-in-down{opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(10%); -moz-transform: translateY(10%); -ms-transform: translateY(10%); -o-transform: translateY(10%); transform: translateY(20%);}
.fade-in-up{opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(10%); -moz-transform: translateY(10%); -ms-transform: translateY(10%); -o-transform: translateY(10%); transform: translateY(-20%);}
.fade-in-up20{opacity:0;filter:Alpha(opacity=0); -webkit-transform: translateY(20%); -moz-transform: translateY(20%); -ms-transform: translateY(20%); -o-transform: translateY(20%); transform: translateY(20%);}
.scroll-active-animate .fade-in{opacity:1.0;filter:Alpha(opacity=100);-webkit-transition: all 1.0s ease;transition: opacity 1.0s ease;}
.scroll-active-animate .fade-in-left{opacity:1.0;filter:Alpha(opacity=100);-webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px);-webkit-transition: all 1.0s ease;transition: opacity 1.0s ease, transform 1.0s ease;}
.scroll-active-animate .fade-in-right{opacity:1.0;filter:Alpha(opacity=100);-webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px);-webkit-transition: all 1.0s ease;transition: opacity 1.0s ease, transform 1.0s ease;}
.scroll-active-animate .fade-in-down{opacity:1.0;filter:Alpha(opacity=100);-webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px);-webkit-transition: all 1.0s ease;transition: opacity 1.0s ease, transform 1.0s ease;}
.scroll-active-animate .fade-in-up{opacity:1.0;filter:Alpha(opacity=100);-webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px);-webkit-transition: all 1.0s ease;transition: opacity 1.0s ease, transform 1.0s ease;}
.scroll-active-animate .fade-in-up20{opacity:1.0;filter:Alpha(opacity=100);-webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px);-webkit-transition: all 1.0s ease;transition: opacity 1.0s ease, transform 1.0s ease;}
.fade-in-02{-webkit-transition-delay:0.2s !important; transition-delay:0.2s !important }
.fade-in-03{-webkit-transition-delay:0.3s !important; transition-delay:0.3s !important }
.fade-in-04{-webkit-transition-delay:0.4s !important; transition-delay:0.4s !important }
.fade-in-05{-webkit-transition-delay:0.5s !important; transition-delay:0.5s !important }
.fade-in-06{-webkit-transition-delay:0.6s !important; transition-delay:0.6s !important }
.fade-in-07{-webkit-transition-delay:0.7s !important; transition-delay:0.7s !important }
.fade-in-08{-webkit-transition-delay:0.8s !important; transition-delay:0.8s !important }
.fade-in-09{-webkit-transition-delay:0.9s !important; transition-delay:0.9s !important }
.fade-in-10{-webkit-transition-delay:1s !important; transition-delay:1s !important }
/* (공지사항부분) */
.scale-large .notice-con-inner{transform-origin: left top;transition: transform .8s, opacity .6s;transition-timing-function: ease-in-out;transform: scale(0);}
.scroll-active-animate .scale-large .notice-con-inner{transform: scale(1);}
.scale-large:after {transform: scaleX(0);transform-origin: right 100%;transition: transform .6s ease-in-out;transition-delay: .5s;}
.scroll-active-animate .scale-large:after  {transform: scaleX(1);}


}
