@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600;700&display=swap');

#mo_wrapper{position:relative;max-width:768px;margin:0 auto;padding-top:136px}

/* ----------------- head 시작 [s] */
#mo_hd{position:fixed;left:0;top:0;z-index:20;width:100%;font-size:15px;font-weight:500;color:#777;letter-spacing:-.3px;line-height:1.8;background-color:#fff;box-shadow:3px 3px 6px rgba(0,0,0,.1);font-family:'AppleSDGothicNeo'}
#mo_hd_wrapper{margin-top:70px;position:relative;height:65px;padding:15px 15px 15px 65px}

/* 팝업 */
#hd_pop{width:100%}
.hd_pops{width:calc(75% - 20px)}
.hd_pops_con{width:100%!important;height:auto!important}
.hd_pops img{width:100%}
.hd_pops_footer button{font-size:12px;letter-spacing:-1px}

/* 로고 */
#mo_logo{position:relative}
#mo_logo a{display:inline-block}
#mo_logo img{width:147px}

#cst_btn{display:block;position:absolute;right:10px;top:15px;width:120px;height:36px;border-radius:30px;font-size:13px;color:#fff;line-height:37px;text-align:center}
#cst_btn svg{vertical-align:-3px;width:15px;height:15px}
@media (max-width:360px){
#mo_hd_wrapper{padding-left:55px}
#cst_btn{width:95px}
}

#slide_area{background-color: #9834ee;width:100%;height:60px;position:absolute;top:-70px;left:50%;transform:translateX(-50%);text-align:center;padding-top:10px;}

/* 상단 버튼 및 오픈메뉴 */
#navBtn{position:absolute;top:18px;left:15px;z-index:5;width:24px;height:30px}
#navBtn span{display:block;position:relative;top:50%;transform:translateY(-50%);width:100%;height:2px;background-color:#222}
#navBtn span:before, #navBtn span:after{display:block;content:"";position:absolute;top:-8px;width:24px;height:2px;background-color:#222;-webkit-transition:all .1s;transition:all .1s}
#navBtn span:after{top:8px;background-color:#222}
#navBtn.on{position:fixed}
#navBtn.on span{background-color:transparent}
#navBtn.on span:before{top:0;left:0;transform:rotate(45deg);background-color:#fff}
#navBtn.on span:after{top:0;left:0;transform:rotate(-45deg);background-color:#fff}

.nav_wrap_bg{display:none;position:fixed;left:0;top:0;z-index:4;width:100%;height:100%;background-color:rgba(0,0,0,.7)}
#navWrap{display:none;position:fixed;left:0;top:0;z-index:4;width:100%;height:100%}
#navWrap .inner{overflow-y:scroll;opacity:0;position:fixed;left:-100%;top:0;z-index:6;min-width:300px;width:90%;height:100%;padding-top:230px;background-color:#fff;transition:all .1s}
#navWrap .user_tip{position:absolute;top:0;width:100%;height:65px;padding-right:15px;font-size:14px;text-align:right;color:#fff;background-color:#111}
#navWrap .user_tip svg{width:17px;height:17px;margin-right:8px;vertical-align:sub}
#navWrap .user_tip a{color:#fff;line-height:65px}
#navWrap .user_tip a.log{text-decoration:underline}
#navWrap .hd_tabs{position:absolute;top:65px;display:flex;justify-content:space-evenly;align-items:center;width:100%;height:55px;text-align:center;background-color:#9b4ddf}
#navWrap .hd_tabs svg{width:17px;height:17px;margin-right:2px;vertical-align:sub}
#navWrap .hd_tabs li a{font-size:14px;font-weight:600;color:#fff}
#navWrap .event{overflow:hidden;position:absolute;top:120px;width:100%;height:110px;background-color:#111}
#navWrap .event .img01{position:absolute;left:0;top:0;bottom:0;height:110px}
#navWrap .event .img02{position:absolute;right:6%;top:50%;transform:translateY(-50%);width:220px}
#navWrap.on .inner{opacity:1;left:0;transition:all .2s}
@media (max-width:380px){
#navWrap .event .img01{left:0}
#navWrap .event .img02{right:3%;width:200px}
}

/* 대분류 */
#mo_hd .lnb_wrap{position:relative;width:100%;height:100%;overflow-y:scroll}
#mo_hd .lnb .bmenu{padding:10px 0 8px 15px;font-size:15px;font-weight:500;color:#111}
#mo_hd .lnb .mn_empty{line-height:100px;text-align:center}
#mo_hd .lnb li:last-child .smenu{border-bottom:none}

/* 소분류 */
#mo_hd .smenu{overflow:hidden;padding:10px 0 10px 15px;border-top:1px solid #e1e1e1;border-bottom:1px solid #555;font-size:14px;background-color:#f5f5f5}
#mo_hd .smenu li{float:left;width:50%}
#mo_hd .smenu li a{color:#777;letter-spacing:-1px}
/* ----------------- head 끝 [e] */

/* ----------------- index 시작 [s] */
#mo_container{position:relative}
#mo_section{position:relative;font-size:14px;color:#111;word-break:keep-all;letter-spacing:-.3px;line-height:1.8;font-family:'AppleSDGothicNeo'}
/* ----------------- index 끝 [e] */

/* ----------------- content 시작 [s] */
#mo_cont_tit{padding:12px 0;border-top:1px solid #d1d1d1;border-bottom:1px solid #eee;font-size:16px;letter-spacing:-.3px;color:#222;text-align:center;font-family:'AppleSDGothicNeo'}
#mo_content{min-height:200px}
/* ----------------- content 끝 [e] */

/* ----------------- tail 시작 [s] */
#mo_ft{padding-bottom:65px;font-size:13px;color:#777;word-break:keep-all;letter-spacing:-.3px;line-height:1.8;text-align:center;font-family:'AppleSDGothicNeo'}
#mo_ft .ft_mn{display:flex;justify-content:space-evenly;border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1}
#mo_ft .ft_mn li{line-height:50px}
#mo_ft .info{padding:30px 0;background-color:#f5f5f5}
#mo_ft .info .ft_logo{width:145px}
#mo_ft .info .sns{margin:22px 0 20px;text-align:center}
#mo_ft .info .sns li{display:inline-block}
#mo_ft .info .sns li+li{margin-left:3px}
#mo_ft .pc_ver{display:block;width:50px;margin:0 auto;border-radius:3px;font-size:11px;color:#fff;letter-spacing:0;background-color:#bbb}
/* ----------------- tail 끝 [e] */
