@CHARSET "UTF-8";

html,
body {position:relative; height:100%;}
.contBody {padding:0 15px; margin:auto;} 
.contBody:after {content:""; display:block; clear:both;}

#wrapper {position:relative; min-width:320px; max-width:768px; overflow:hidden;}
#header {position:fixed; left:0; top:0; width:100%; height:50px; background:#fff; z-index:10000;} 
#header:after {content:""; display:block; clear:both;}
#header h1 {display:none; position:absolute; z-index:50; left:15px; top:65px;}
#header h1 img {width:150px;}
.main #header {height:130px;}
.main #header h1 {display:block;}
.main #header.on {height:50px; overflow:hidden;} 
.main #header.on h1 {display:none;}
#header #btnFindCenter {position:absolute; left:15px; top:10px; z-index:50;}
#header .util {position:relative; float:right; height:50px; z-index:50;} 
#header .util a {float:left; margin:13px 6px 0 10px;}
#header #btnGnbOpen {position:relative; width:55px; height:50px; margin:0; z-index:55;} 
#header #btnGnbOpen span {display:block; position:absolute; left:50%; top:50%; width:26px; height:4px; margin-top:-10px; margin-left:-13px; border-radius:2px; background:#333; text-align:left; text-indent:-3000em;}
#header #btnGnbOpen span:before,
#header #btnGnbOpen span:after {content:""; position:absolute; right:0; bottom:-8px; display:block; width:21px; height:4px; border-radius:2px; background:#333; font-size:0; line-height:0;}
#header #btnGnbOpen span:before {}
#header #btnGnbOpen span:after {bottom:-16px; top:auto; width:15px;}

#header #btnGnbOpen.on span {margin-left:-13px; margin-top:-2px; background:none; transform:rotate(45deg)} 
#header #btnGnbOpen.on span:before,
#header #btnGnbOpen.on span:after {content:""; position:absolute; right:0; bottom:0; display:block; width:26px; height:4px; border-radius:2px; background:#333; font-size:0; line-height:0;}
#header #btnGnbOpen.on span:before {}
#header #btnGnbOpen.on span:after {bottom:-11px; right:50%; top:auto; height:26px; width:4px; margin-right:-2px;}

#header #gnbArea {display:none; position:absolute; width:100%; height:100%; right:0; top:0; padding-top:50px; padding-left:15px;}
#header #gnbArea.gnbOpen {display:block;}
#header #gnbArea .gnbAreaBody {width:100%; height:100%; padding:0 20px 80px 30px; background:#fff; overflow:auto;} 
#header #gnbArea #gnbList {position:relative; padding:10px 0 0 0;}
#header #gnbArea #gnbList:after {content:""; display:block; clear:both;} 
#header #gnbArea #gnbList > li {}
/* #header #gnbArea #gnbList > li.hasSub {background:url(/mobile/images/blt/arrow_down.png) no-repeat 100% 17px; background-size:16px auto;}
#header #gnbArea #gnbList > li.icoPen {background:url(/mobile/images/icon/pen.png) no-repeat 100% 13px; background-size:21px 20px;} */
#header #gnbArea #gnbList > li > a {position:relative; display:block; padding:10px 0; font-weight:400; font-size:23px; line-height:26px; color:#333; transition:all 0.2s ease-in-out;}
#header #gnbArea .subGnb {position:relative; left:0; top:0; width:100%; height:0; padding-left:0; background:#fff; overflow:hidden; transition:height 0.2s ease-in-out;}
#header #gnbArea .subGnb:after {content:""; display:block; clear:both;}
#header #gnbArea .subGnb strong {display:none;} 
#header #gnbArea .subGnb strong:after {display:none; }
#header #gnbArea .subGnb > ul:after {content:""; display:block; clear:both;} 
#header #gnbArea .subGnb li {position:relative; margin:15px 0; padding-left:10px; line-height:22px;}
#header #gnbArea .subGnb li:before {content:""; position:absolute; left:10px; top:-3px; display:block; width:27px; height:2px; background:#e72410; font-size:0; line-height:0;}
#header #gnbArea .subGnb li a { display:inline-block; padding:0; font-size:17px; line-height:22px; color:#333;}
/* #header #gnbArea #gnbList > li.hasSub.on {background:url(/mobile/images/blt/arrow_up.png) no-repeat 100% 17px;  background-size:16px auto;} */
#header #gnbArea #gnbList > li.hasSub.on .subGnb {height:auto;}

 
#header #gnbFMenu {padding-top:15px;}
#header #gnbFMenu li {position:relative; marign:0 0; padding:5px 0 5px 10px; }
#header #gnbFMenu li:before {content:""; position:absolute; left:0; top:50%; display:block; width:2px; height:13px; margin-top:-6px; background:#939393; font-size:0; line-height:0;}
#header #gnbFMenu li a {display:inline-block; font-size:13px; line-height:20px; text-transform:uppercase;}
#header #gnbFMenu li a b {color:#000; font-weight:700;}
 
#contatiner {padding-top:50px;}
.main #contatiner {padding-top:130px;}
  
/* ��Ű&������ ���� */
#footer {position:relative; padding:35px 30px 20px; background:#f4f4f4; z-index:50;} 
#footer strong {}  
#footer .snsArea {position:absolute; top:30px; right:30px;} 
#footer .snsArea:after {content:""; display:block; clear:both;} 
#footer .snsArea li {float:left; margin-left:10px;}  
#footer .nav {margin:25px 15px 30px;}
#footer .nav li { margin-bottom: 0.5em; text-align: center; font-weight: 400;}
#footer .nav li a {font-weight:400; color:#333; font-size:11px; text-transform:uppercase;}
#footer .copyright {text-align:center; font-size:11px; color:#555; line-height:16px;}
/* ��Ű&������ �� */

.snsArea li.calling {position:relative;} 
.snsArea li.calling a { background-position:-120px 0;}
.snsArea li.calling ul {display:none; position:absolute; right:-15px; bottom:45px; width:180px; border:1px solid #bcbcbc; background:#fff;}
.snsArea li.calling ul:before {content:""; position:absolute; right:27px; bottom:-5px; display:block; width:9px; height:5px; margin-left:-11px; background:url(https://m.myeyelevel.com/mobile/images/blt/arrow_layer_down.png) no-repeat 0 0; background-size:9px 5px;}
.snsArea li.calling ul:after {content:""; display:block; clear:both;} 
.snsArea li.calling ul li {float:left; width:50% !important; margin:0 !important; padding:1px 0 !important; text-align:center;}
.snsArea li.calling ul li a {display:block; color:#333; padding:10px; font-size:12px;}  
.snsArea li.calling ul li p {font-size:9px; color:#333;} 
 
.snsArea li.wechat {position:relative;} 
.snsArea li.wechat a { background-position:-120px 0;}
.snsArea li.wechat ul {display:none; position:absolute; right:-15px; bottom:45px; min-height:100px; width:160px; border:1px solid #bcbcbc; background:#fff;}
.snsArea li.wechat ul:before {content:""; position:absolute; right:30px; bottom:-5px; display:block; width:9px; height:5px; margin-left:-11px; background:url(https://m.myeyelevel.com/mobile/images/blt/arrow_layer_down.png) no-repeat 0 0; background-size:9px 5px;}
.snsArea li.wechat ul:after {content:""; display:block; clear:both;} 
.snsArea li.wechat ul li {float:left; width:50% !important; margin:0 !important; padding:1px 0 !important; text-align:center;} 
.snsArea li.wechat ul li p {font-size:9px; color:#333;} 

/*
.footDeco {border-top:30px solid #f4f4f4;}
.footDeco:before {content:""; display:block; position:absolute; top:-30px; width:50%; height:30px; background:#f4f4f4 !important}
*/
 
.footDecoNum_3_1_0:before {left:0; background:#e72410;}
.olympiadLayout .footDeco:before {left:0; background:#e72410;}
 
.footDecoNum_5_1_0:before {left:0; background:#fabe00;}
.footDecoNum_5_2_0:before {right:0; background:#e72410;} 

.footDecoNum_4_1_0:before, 
.footDecoNum_4_2_0:before, 
.footDecoNum_4_3_0:before, 
.footDecoNum_4_4_0:before, 
.footDecoNum_6_2_0:before, 
.footDecoNum_6_3_0:before, 
.footDecoNum_6_4_0:before, 
.footDecoNum_6_6_0:before {right:0; background:#6fba2c;}

.layoutTypeA {}
.layoutTypeA .contHeaderTypeA {padding-left:20px; padding-right:20px;}
.layoutTypeA #contatiner {padding-right:15px;}
.layoutTypeA .contBody {padding:0 20px;}


#rotateInfoWrap {position:fixed; left:0; top:0; width:100%; height:100%; background:#000; text-align:center; z-index:10000000000000;}
#rotateInfoWrap .rotateInfoBody {display:table; width:100%; height:100%;}
#rotateInfoWrap .rotateInfoBody .cont {display:table-cell; vertical-align:middle; text-align:center;}
#rotateInfoWrap .rotateInfoBody .cont img {height:50%;}
#rotateInfoWrap p {padding-top:20px; font-size:17px; line-height:22px; color:#a1a1a1;}

#footer .snsArea li.facebook {margin-left: 5px;}/* 2023-08-23 */

/* 2023 remuwal */
/* Header */
.main #header {height: 50px;}
#header #gnbArea {padding-left: 0;}
div#header h1 {display: block; top: 12.5px; left: 20px; z-index: 50}
div#header h1 img {width: auto; height: 25px; z-index: 0}
#header .util {padding: 13px 17px 0 0;}
#header #btnGnbOpen {width: 24px; height: 24px; background: url(/mobile/images/btn/btn_gnb_open.svg) no-repeat center; background-size: cover;}
#header #btnGnbOpen.on {background-image: url(/mobile/images/btn/btn_gnb_close.svg);}
#header #btnGnbOpen span {display: none;}
#header #btnFindCenter {position: static; margin: 1px 10px 0 0; padding: 0 15px; color: #fff; font-size: 12px; font-weight: 500; line-height: 24px; background: #F00; border-radius: 100px;}
#header #btnFindCenter:before {content:''; display: inline-block; vertical-align: top; width: 10px; height: 11px; margin-top: 6px; margin-left: 0; margin-right: 5px; background: url(/mobile/images/common/location_new.svg) no-repeat center; background-size: 10px auto;;}
#header #gnbArea .gnbAreaBody {padding: 20px 20px 110px;}
#header #gnbArea #gnbList {padding: 0;}
#header #gnbArea #gnbList > li > a {position: relative; color: rgba(51, 51, 51, 0.80); font-size: 19px; font-weight: 300; line-height: 1.1em; letter-spacing: -0.5px; transition: none;}
#header #gnbArea #gnbList > li > a:after {content: ''; position: absolute; top: 50%; right: 15px; width: 22px; height: 22px; background: url(/mobile/images/btn/arrow_menu.svg) no-repeat center; background-size: 15px auto; transform: translateY(-50%);}
#header #gnbArea #gnbList > li.icoPen > a:after {background-image: url(/mobile/images/icon/pen.svg); background-size: 21.5px auto;}
#header #gnbArea #gnbList > li:not(.hasSub):not(.icoPen) > a:after {content: none;}
#header #gnbArea #gnbList > li.on > a {color: #333; font-weight: 600;}
#header #gnbArea #gnbList > li.hasSub.on > a:after {transform: translateY(-50%) rotate(-180deg);}
#header #gnbArea #gnbList > li.hasSub.on .subGnb {padding-bottom: 10px;}
#header #gnbArea .subGnb li {margin: 0;}
#header #gnbArea .subGnb li:before {display: none; left: 0; top: 50%; width: 2.5px; height: 14px; transform: translateY(-50%);}
#header #gnbArea .subGnb li a {display: block; padding: 10px 0; font-size: 14px; font-weight: 300; line-height: 1.1em; letter-spacing: -0.5px;}
#header #gnbArea .subGnb li.on:before {display: block;}
#header #gnbArea .subGnb li.on a {font-weight: 500;}
#header #gnbFMenu {padding-top: 14px;}
#header #gnbFMenu li {padding: 10px;}
#header #gnbFMenu li:before {width: 2.5px; height: 14px; margin-top: 0; background: #333; transform: translateY(-50%);}
#header #gnbFMenu li a {color: #333; font-size: 14px; font-weight: 300; line-height: 1.1em; letter-spacing: -0.5px;}
#header .gnbAreaFooter {position: fixed; left: 0; bottom: 0; width: 100%; height: 50px; padding: 15px 20px 15px 23px; background: #FFF; box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.10);}
#header .gnbAreaFooter span {display: inline-block; vertical-align: top; margin-left: 10px; color: #999; font-size: 14px; font-weight: 500; line-height: 20px;}
/* Footer */
#footer {padding: 15px 0; background-color: #333;}
#footer strong {display: inline-block; vertical-align: top; margin-left: 20px;}
#footer .snsArea {top: 15px; right: 20px}
#footer .nav {margin: 15px 0; padding: 15px 0; border-top: 1px solid #4D4D4D; border-bottom: 1px solid #4D4D4D;}
#footer .nav li {margin-bottom: 8px;}
#footer .nav li:last-child {margin-bottom: 0;}
#footer .nav li a {color: #B2B2B2; font-size: 12px; font-weight: 300; line-height: 1.5em;}
#footer .copyright {color: #B2B2B2; font-size: 12px; font-weight: 300; line-height: 1.5em;}

/* 탑 띠배너 */
.banner-line {position: fixed;top: 0;left: 0;right: 0; min-height: 40px;z-index: 101; } 
.banner-line.blue-skin {background-color: #0971CE; } 
.banner-line.red-skin {background-color: #E2211C; } 
.banner-line.yellow-skin {background-color: #F5A706; } 
.banner-line > .__inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;position: relative; height: 100%; padding: 10px 35px; } 
.banner-line .__banner-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; font-size: 14px; font-weight: 400; } 
.banner-line.yellow-skin .__banner-link {color: #000;}
.banner-line .__banner-link .__editor-content {text-align: center; word-break: keep-all; } 
.banner-line .__banner-link .__editor-content,
.banner-line .__banner-link .__editor-content p {display: inline-block; margin:0; color: inherit; font-size: inherit; font-weight: inherit;}
.banner-line .__banner-link .__editor-content p span {display:inline-block;}
.banner-line .banner-close { position: absolute; top: 50%; right: 10px; width: 20px; height: 20px; padding: 0; border: 0; background: url(/mobile/images/icon/close_btn.png) no-repeat center; font-size: 0; color: transparent; cursor: pointer; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); filter: brightness(10);}