@charset "euc-kr";

/* common CSS */
body, input, button, textarea, select, option, a {font-family:'Lato','NotoSans',sans-serif; outline-color:#90c31f;}
.wrap {position:relative; width:100%; min-width:320px;}
.container {position:relative; width:100%; margin:0 auto; padding:0 20px; box-sizing:border-box;}
.container:after {content:''; display:block; clear:both;}
.scrollOff {position:fixed; top:0; left:0; right:0; bottom:0; height:100%; overflow:hidden; touch-action:none;}
select {border:1px solid #ddd; background:#fff url(/images/ico/sel_ico.png) 94% 50% no-repeat; padding:0 32px 0 14px; box-sizing:border-box;}

/* selection */
::selection {background: #90c31f; background:rgba(144,195,31,.7); color:#fff; text-shadow:none;}
::-moz-selection {background:#90c31f; background:rgba(144,195,31,.7); color:#fff; text-shadow:none;}
::-webkit-selection {background:#90c31f; background:rgba(144,195,31,.7); color:#fff; text-shadow:none;}

/* placeholder */
::-webkit-input-placeholder {color:#999;}
::-moz-placeholder {color:#999;}
:-moz-placeholder {color:#999;}
:-ms-input-placeholder {color:#999;}

.header .logo_area {display:flex; justify-content:space-between; align-items:flex-end; height:50px; padding:0 4%;}
.header .logo_area .main_lg {width:50%; max-width:150px; height:40px;}
.header .logo_area .main_lg a {display:block; height:100%; background:url(/images/gk_logo.png) 0 100% no-repeat; background-size:contain; text-indent:-9999px;}
.header .logo_area .lnk {height:30px; text-align:right;}
.header .logo_area .lnk li {position:relative; display:inline-block; margin:0 -1px 0 10px; vertical-align:bottom;}
.header .logo_area .lnk li a {display:inline-block; width:24px; height:24px; background-position:50% 100%; background-size:contain; background-repeat:no-repeat; text-align:left; text-indent:-9999px;}
.header .logo_area .lnk li:first-child a {background-image:url(../images/ico/my_ico.png);}
.header .logo_area .lnk li:nth-child(2) a {width:26px; background-image:url(../images/ico/cart_ico.png);}
.header .logo_area .lnk .count { position:absolute; top:0; right:0; width:16px; height:16px; background:#ff3131; line-height:16px; text-align:center; font-size:11px; font-weight:500; color:#fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; margin:-6px -6px 0 0;}
.header .logo_area .lnk .all_btn {display:inline-block; width:26px; height:24px; background:url(../images/ico/menu_ico.png) 100% 100% no-repeat; background-size:22px auto; text-align:left; text-indent:-9999px; outline:none;}

.header .sch_area {position:relative; height:50px; margin:4px 0; padding:0 4%;}
.header .sch_area input {display:block; width:100%; height:50px; border-width:0 0 1px; border-style:solid; border-color:#888; padding:0 36px 0 6px; font-size:.85rem; font-weight:500; letter-spacing:-0.045rem; color:#888; box-sizing:border-box; outline:none;}
.header .sch_area .sch_btn {position:absolute; top:50%; right:4%; width:36px; height:50px; margin:-25px 0 0; background:url(../images/ico/sch_ico.png) 50% 50% no-repeat; background-size:auto 40%; text-indent:-9999px; outline:none;}

.header .nav_bar {width:100%; height:51px; padding:0 0 0 4%; border-bottom:1px solid #eee; white-space:nowrap; overflow:hidden; overflow-x:auto; box-sizing:border-box;}
.header .nav_bar a {position:relative; display:inline-block; font-size:.95rem; font-weight:500; line-height:50px; letter-spacing:-0.045rem; color:#000; margin:0 1.6rem 0 0;}
.header .nav_bar a.on {color:#94c948;}
.header .nav_bar a.on:after { content:''; position:absolute; bottom:0px; left:50%; width:110%; height:1px; background:#94c948; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); z-index:2;}

.all_bg {display:none; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; background:rgba(0,0,0,.7); z-index:199;}
.all_menu { position:fixed; top:0; right:-200%; width:100%; max-width:450px; height:100%; background:#fff; z-index:200; transition:right 0.35s; -webkit-transition:right 0.35s; -moz-transition:right 0.35s; -ms-transition:right 0.35s; -o-transition:right 0.35s; }
.all_menu .all_head {width:100%; height:170px; background: -moz-linear-gradient(left, #9bc936 0%, #6fbc79 50%, #38a9a5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #9bc936 0%,#6fbc79 50%,#38a9a5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #9bc936 0%,#6fbc79 50%,#38a9a5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ box-sizing:border-box;}
.all_menu .login_area {display:flex; justify-content:space-between; align-items:center; padding:25px 4%; background:rgba(255,255,255,.1);}
.all_menu .login_area .login {width:82%;}
.all_menu .login_area .login .msg {display:inline-block; font-size:.95rem; font-weight:500; line-height:30px; color:#fff; background:url(../images/ico/login_ico.png) 0 50% no-repeat; background-size:auto 23px; padding:0 0 0 26px; vertical-align:middle;}
.all_menu .login_area .login .msg:after {content:''; display:inline-block; width:8px; height:30px; background:url(../images/ico/login_arr.png) 50% 50% no-repeat; background-size:contain; margin:0 0 0 10px; vertical-align:top;}
.all_menu .login_area .login .grade { display:inline-block; width:26px; height:26px; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; background:#fcf952; line-height:26px; text-align:center; font-size:11px; font-weight:500; letter-spacing:-0.025rem; color:#666; margin:0 4px 0 0; vertical-align:middle;}
.all_menu .login_area .login .grade.vip {background:#f79685; color:#fff; letter-spacing:0;}
.all_menu .login_area .login .name {font-size:.95rem; font-weight:500; line-height:30px; letter-spacing:-0.065rem; color:#fff;}
.all_menu .login_area .login a:last-child { float:right; height:30px; border:1px solid #fff; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -ms-border-radius:3px; -o-border-radius:3px; padding:0 8px; font-size:.75rem; line-height:28px; font-weight:500; letter-spacing:-0.065rem; color:#fff; box-sizing:border-box; }
.all_menu .login_area .all_cls {width:24px; height:24px; background:url(../images/ico/cls_menu.png) 100% 50% no-repeat; background-size:contain; text-indent:-99999px; outline:none;}

.all_menu .all_head .lnk {display:flex; height:90px; margin:0 4%;}
.all_menu .all_head .lnk li {position:relative; width:25%;}
.all_menu .all_head .lnk a {display:block; width:100%; height:100%; padding:50px 0 0; background-size:auto 23px; background-position:50% 21px; background-repeat:no-repeat; text-align:center; font-size:.8rem; font-weight:500; line-height:1.5rem; letter-spacing:-0.045rem; color:#fff; box-sizing:border-box;}
.all_menu .all_head .lnk li:first-child a {background-image:url(../images/ico/all_menu1.png);}
.all_menu .all_head .lnk li:nth-child(2) a {background-image:url(../images/ico/all_menu2.png);}
.all_menu .all_head .lnk li:nth-child(3) a {background-image:url(../images/ico/all_menu3.png);}
.all_menu .all_head .lnk li:nth-child(4) a {background-image:url(../images/ico/all_menu4.png);}
.all_menu .all_head .lnk .count {position:absolute; top:15px; left:50%; width:16px; height:16px; background:#ff3131; line-height:16px; text-align:center; font-size:11px; font-weight:500; color:#fff; border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; margin:0 6px 0 0;}

.all_menu .all_cont {position:absolute; top:170px; left:0; width:100%; height:calc(100% - 170px); padding:0 4% 5rem; overflow-y:auto; box-sizing:border-box;}
.all_menu .all_cont .menu {margin:0 auto 2.5rem;}
.all_menu .all_cont .menu span {display:block; width:100%; height:2.875rem; line-height:2.875rem; border-bottom:1px solid #eee; background:url(../images/ico/all_down.png) 94% 50% no-repeat; background-size:auto 23%; font-size:.9rem; font-weight:500; color:#000; padding:0 2.5rem 0 .625rem; box-sizing:border-box;}
.all_menu .all_cont .menu .on span {background-image:url(../images/ico/all_up.png);}
.all_menu .all_cont .menu .depth {display:none; padding:18px 4%; border-bottom:1px solid #eee;}
.all_menu .all_cont .menu .depth a {display:inline-block; font-size:.85rem; font-weight:500; line-height:1.5rem; letter-spacing:-0.045rem; color:#888; margin:0 0 .5rem;}
.all_menu .all_cont .menu .depth li:last-child a {margin:0;}

.all_menu .all_cont .center_area {text-align:center;}
.all_menu .all_cont .center_area img {width:140px; height:auto;}
.all_menu .all_cont .center_area .tel {display:block; font-size:14px; line-height:30px; font-weight:500; letter-spacing:-0.045rem; color:#888; margin:12px 0 25px;}
.all_menu .all_cont .center_area .tel a {display:inline-block; font-size:16px; font-weight:700; margin:0 0 0 6px; letter-spacing:0;}
.all_menu .all_cont .center_area .lnk { display:flex; justify-content:space-between; width:100%; height:45px; border:1px solid #94c948; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px; box-sizing:border-box;}
.all_menu .all_cont .center_area .lnk a {width:50%; height:43px; line-height:43px; text-align:left; padding:0 4%; background:url(/images/ico/grn_arr.png) 91% 50% no-repeat; font-size:.85rem; font-weight:500; letter-spacing:-0.025rem; color:#94c948; box-sizing:border-box;}
.all_menu .all_cont .center_area .lnk a:first-child {border-right:1px solid #94c948;}

/* footer */
.footer {width:100%; background:#000; padding:0 4% 4rem; box-sizing:border-box;}
.footer .lnk {display:flex; align-items:center; height:60px; border-bottom:1px solid rgba(255,255,255,.25); margin:0 0 1.5rem;}
.footer .lnk li {margin:0 1.5rem 0 0;}
.footer .lnk a {display:inline-block; font-size:.85rem; line-height:1.5rem; font-weight:500; letter-spacing:-0.045rem; color:#fff;}

.footer .foot_info {display:flex; flex-wrap:wrap; font-size:.8rem; line-height:1.5rem; letter-spacing:-0.045rem; color:#888;}
.footer .foot_info strong {width:100%; font-weight:700;}
.footer .foot_info span {margin:0 1.5rem 0 0;}
.footer .foot_info .copy {letter-spacing:0; margin:.625rem 0 0;}

.footer .go_top {position:fixed; bottom:0; right:0; width:50px; height:50px; background:rgba(144,195,31,.9) url(/images/ico/go_top.png) 50% 50% no-repeat; background-size:40% auto; text-indent:-9999px; outline:none;}


/* sub */
.sub_title, .mobile_top_wrap form[name="searchFrm"], .mobile_top_wrap, .mobile_gnb {display:none;}

/* popup */
.m_popup {position:fixed !important; left:50% !important; top:50% !important; max-width:92%; max-height:92%; transform:translate(-50%, -50%);}
.m_popup img {max-width:100%; height:auto !important;}