@import url(common.css);

@charset "utf-8";
/* CSS Document */
html{}

#wrap{width:100%; font-family:Noto Sans KR; padding-top: 50px; color: #333;}

/*top CSS*/
#header{position: fixed; top: 0; left: 0; width: 100%; height: 50px; overflow: hidden; background: #0b1f2d; z-index:100}
#header > h1 { position:absolute; width:100px; left:50%; margin-left:-50px}
#header > h1 div {position:relative; width:inherit; height:inherit}
#header > h1 a img {width:65px; margin-left: 10px; margin-top: 8px; }
#header > h1 .branch { position:absolute; top:5px; right:5px; color:#addb22; z-index:100}
#header .menuBtn{position: absolute; left:10px; top: 17.5px; cursor: pointer; }
#header .menuBtn > ul > li{width: 23px; height: 2px; border:none; border-radius:2px; margin-bottom:4px; background: #fff; }
#header .menuBtn > ul > li:last-child{margin-bottom: 0px; }
#header .cart { position:absolute; top:10px; right:40px; width:35px; height:30px; background:url(/m/images/cart.png) no-repeat left top; background-size:25px; z-index:100}
#header .cart ul {position:relative; width:inherit; height:inherit}
#header .cart ul li {position:absolute; top:3px; right:0; width:18px; height:18px; border:none; border-radius:50%; text-align:center; line-height:20px; color:#fff; font-size:12px; background:#8db61a}
#header .my {position:absolute; top:10px; right:5px; width:30px; height:30px;}
#header .my ul {display:inline-block; width:100%; height:100%; background:url(/m/images/my.png) no-repeat left top; background-size:25px;}
#header .my ul>li {width:100%; height:100%;}
#header .my ul>li>a{width:100%; height:100%; display: inline-block;}
.myMenu {display: none; position: fixed; top: 0; right: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0,0,0,0.6); font-size: 0.5em; z-index:200;}
.myMenu dl {width: calc(100%*4/6); position: absolute; top: 0; right:0;  bottom:0; background: #ccc; padding-bottom: 80%;}
.myMenu dl dt {width:100%; height:50px; line-height:50px; background:#0b1f2d; z-index: 50;}
.myMenu dl dt p { font-size:16px; padding-left:32px; color:#fff; background: url(/m/images/my.png) no-repeat 5px 12px; background-size:25px}
.myMenu dl dt .closeMy {position: absolute; right:5px; top:10px; width:30px; height:30px; background:url(/m/images/close_btn02.png) no-repeat center; background-size:18px;}
.myMenu dl dd {background: #fff}
.myMenu dl dd > a {position: relative; display: inline-block; width: 100%; padding:10px 15px; font-size:14px; color:#2f2f2f}
.cartView {display: none; position: fixed; top: 0; right: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0,0,0,0.6); font-size: 0.5em; z-index:200;}
.cartView dl {width: calc(100%*4/6); position: absolute; top: 0; right:0;  bottom:0; background: #ccc; padding-bottom: 80%;}
.cartView dl dt {width:100%; height:50px; line-height:50px; background:#0b1f2d; z-index: 50;}
.cartView dl dt p { font-size:16px; padding-left:32px; color:#fff; background: url(/m/images/my.png) no-repeat 5px 12px; background-size:25px}
.cartView dl dt .closeMy {position: absolute; right:5px; top:10px; width:30px; height:30px; background:url(/m/images/close_btn02.png) no-repeat center; background-size:18px;}
.cartView dl dd { min-height:150px; padding:10px 0; background: #fff}
.cartView dl dd p {position:relative; font-size:14px; line-height:30px; padding-left:15px; }
.cartView dl dd p span { display:block; position:absolute; top:-5px; right:10px; width:30px; height:30px; font-size:20px;}
.cartView dl div {text-align:center; padding-bottom:10px; background: #fff}
.cartView dl div > a {display:inline-block; width:45%; height:40px; margin:1%; line-height:40px; text-align:center; font-size:16px; color:#fff; font-weight:600;}
.cartView dl div > a.talk{background:#0e9eb9;}
.cartView dl div > a.counsel{background:#91b821;}
.menuCover{display: none; position: fixed; top: 0; right: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0,0,0,0.6); font-size: 0.5em; z-index:500;}
.menuCover>.closeCover{position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.menuCover>.menuWrap{width: calc(100%*5/6); position: absolute; top: 0; left: 0; background: #fff; padding-bottom:50px;}
.menuCover>.menuWrap>.btnWrap{position: fixed; top: 0; left: 0; width:calc(100%*5/6); height:50px; line-height:50px; background:#0b1f2d; z-index: 50;}
.menuCover>.menuWrap>.btnWrap>a{display: inline-block; position: absolute; left:15px; top: 12px; }
.menuCover>.menuWrap>.btnWrap>a>img{width:18px; }
.menuCover>.menuWrap>.menu{display: inline-block; width: 100%;  padding-top:55px;}
.menuCover>.menuWrap>.menu>li{display: inline-block; width: 100%; float: left;}
.menuCover>.menuWrap>.menu>li>a{position: relative; float: left; display: inline-block; width: 100%; padding:10px 15px; font-size:14px; color:#2f2f2f; background: url(/m/images/icon_plus.png) no-repeat center right 15px; background-size:20px}
.menuCover>.menuWrap>.menu>li>ul{display: inline-block; width: 100%; height: 0; background:#e0e8ed; float: left; overflow: hidden; transition: height 0.5s; }
.menuCover>.menuWrap>.menu>li>ul>li{display: inline-block; width: 100%; float: left; border-bottom:1px solid #cdd9e0;}
.menuCover>.menuWrap>.menu>li>ul>li:last-child{border-bottom:0;}
.menuCover>.menuWrap>.menu>li>ul>li>a{display:block; width:100%; height: auto; padding-left:20px; margin:10px 0; font-size:14px; font-weight:600}
.menuCover>.menuWrap>.menu>li.on>a{background: url(/m/images/icon_minus.png) no-repeat center right 15px; background-size: 20px;}
.menuCover>.menuWrap>.menu>li.on>ul{height: auto; }
.menuCover>.menuWrap>.menuQuick {padding:4px 0; margin-top:10px; background:#ccc}
.menuCover>.menuWrap>.menuQuick ul {height:40px}
.menuCover>.menuWrap>.menuQuick ul:first-child {border-bottom:1px solid #ccc}
.menuCover>.menuWrap>.menuQuick ul li {float:left; width:50%; height:39px; font-size:14px; border-right:1px solid #ccc; background-color:#fff}
.menuCover>.menuWrap>.menuQuick ul li a { display:inline-block; width:100%; padding-left:20px; margin:10px 0; line-height:20px; background-image:url(../images/icon_menu_arrow.png); background-repeat:no-repeat; background-size:20px; background-position:top right 10px}
.menuCover>.menuWrap>.snsWrap{padding-top:30px; padding-bottom: 20px; }
.menuCover>.menuWrap>.snsWrap>ul{display: inline-block; width:100%; text-align:center }
.menuCover>.menuWrap>.snsWrap>ul>li{display: inline-block; width:45px; margin:0 15px}
.menuCover>.menuWrap>.snsWrap>ul>li>a{display: inline-block; width: 100%; }
.menuCover>.menuWrap>.snsWrap>ul>li>a>img{width: 100%; max-width: 150px; }
.menuCover>.menuWrap>.langWrap>span{display: inline-block; width: 100%; padding-bottom: 20px;  font-weight: 500; text-align: center; }
.menuCover>.menuWrap>.langWrap>ul{display: inline-block; width: 100%; padding: 0 10px; }
.menuCover>.menuWrap>.langWrap>ul>li{display: inline-block; width: calc(100%/4); float: left; padding: 0 5px; text-align: center; }
.menuCover>.menuWrap>.langWrap>ul>li>a{display: inline-block; width: 100%; }
.menuCover>.menuWrap>.langWrap>ul>li>a>img{width: 100%; max-width: 150px; }
.menuCover>.menuWrap>.menu .cateMenu{display: none;}
/*top CSS end*/

/*footer CSS*/
#footer{text-align: center; font-size: 0.7em; border-top:1px solid #ccc; margin-bottom:60px; background:#fff}
#footer>.footerBtn{overflow: hidden}
#footer>.footerBtn>ul{width: 100%;}
#footer>.footerBtn>ul>li{display: inline-block;  vertical-align: middle;}
#footer>.footerBtn>ul>li>a{display: inline-block; float: left; padding: 10px 10px 7px 10px; color: #6e6e6e}
#footer>.footerBtn>ul>li>span{display: inline-block; height: 10px; border-left: 1px solid #999; position: relative; top: 2px;}
#footer>.footerInfo {border-top:1px solid #ccc; padding:15px 10px 20px 10px;}
#footer>.footerInfo li {margin-bottom:10px}
#footer>.footerInfo p {text-align: center; font-size:12px; color:#6e6e6e;}
#footer>.footerInfo p > span{font-weight: 700; }
/*footer CSS end*/

/*sub Common Css*/
.subTitle{padding:20px 0; text-align: center;}
.subTitle>h2{font-size: 1em; color: #333; }
.subTitle>h2>span{color: #91b821;}
.subTitle>p{font-size: 0.5em; color: #333; }

.sub_conTit span{font-size:1em; font-weight:600;}
.sub_conTit span em{color:#90b73e; font-weight:600;}
.sub_conTit p{color:#999; font-size:0.5em;}

.subCont{border-top:7px solid #dee0e4;}

.btnDefault{display: inline-block; border: none; box-shadow: none; border-radius: 3px; padding: 15px 20px; font-size: 0.8em; background: #7a7a7a; font-weight: 500; text-align: center; color: #fff; }
.btnDefault.green{background: #90b83e; color: #fff;}
.btnDefault.middle{padding: 15px 50px;}
.btnDefault.full{padding: 15px 0; width: 100%;}

/* board Common Css */
.board_btnMore button{display:inline-block; width:100%; height:2em; line-height:2em; border:1px solid #fff; vertical-align:top; background:url("../images/boardList_btnMore.gif") no-repeat center #eee; background-size:66px;}

/* bottom Css */
.bottom .toolBtn {display:none; background:#ccc}
.bottom .toolBtn ul { padding:15px 5px; text-align:center}
.bottom .toolBtn ul li {display:inline-block; width:75px; height:30px; line-height:30px; margin:0 1%; font-size:0.8em; text-align:center; background:#fff}
.bottom .nationWrap {display:none; padding:15px 0; text-align:center}
.bottom .nationWrap ul li {display:inline-block; width:43px; margin:0 1%;}
.bottom .nationWrap ul li img {width:100%}

.privacy, .foot_email {display:none; z-index:2000; position:fixed; top:0; left:0; padding:30px 0; width:100%; height:100%; background:#fff;}
.privacy .close, .foot_email .close {z-index:1;position:fixed; top:15px; right:15px; width:20px;}
.privacy .close img, .foot_email .close img {width:20px}
.privacy > ul, .foot_email > ul {position:relative; margin-top:32px; height:100%; margin:0 15px; overflow:auto;}
.privacy > ul h2, .foot_email > ul h2 {font-size:1.5em; margin-bottom:20px}

@media all and (max-width:360px){
	.bottom .toolBtn ul li{width:65px;}
}


.quick { position:fixed; bottom:0; left:0; width:100%; height:60px; box-shadow:0 -2px 3px rgba(0, 0, 0, 0.1); background:#fff; z-index:100}
.quick ul { margin:0 1%}
.quick ul li {float:left; width:calc(100% / 5); background-image:url(../images/quick_bg.png); background-size:5px auto; background-repeat:no-repeat; background-position:right center }
.quick ul li:last-child {background:none}
.quick ul li a {display:block; width:100; text-align:center; padding-top:38px; font-size:0.8em; background-repeat:no-repeat; background-position:center 4px; background-size:30px}

#blowUpImg{position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; padding: 50px 10px; z-index: 99999; background: #fff;}
#blowUpImg>img{width: 100%; border-radius: 10px;}