/* BASIC css start */
/* ·Îµù ¾Ö´Ï¸ÞÀÌ¼Ç */
.loading { position:fixed; width:100%; height:100%; background:#fff; z-index:99999; }
.loading .loads_wrap { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }

.loading span { display:inline-block; width:13px; height:13px; margin:0 2.5px; background:gray; border-radius:50%; animation: loading 1s 0s linear infinite; }

.loading span:first-child { animation-delay: 0s; background:red; }
.loading span:nth-child(2) { animation-delay: 0.2s; background:orange; }
.loading span:nth-child(3) { animation-delay: 0.4s; background:yellowgreen; }

@keyframes loading {
    0%,
    100% { opacity:0; transform:scale(0.5); }
    50% { opacity:1; transform:scale(1.2); }
}



/* top ¹öÆ° */
#topButton { z-index:10; position:fixed; bottom:80px; right:10px; }
#topButton li { width:40px; margin:4px 0; cursor:pointer; }
#topButton li img { width:100%; height:auto; display:block; filter:drop-shadow(3px 5px 5px rgba(0,0,0,0.2)); -webkit-filter:drop-shadow(3px 5px 5px rgba(0,0,0,0.2)); transition:all 0.5s; -webkit-transition:all 0.5s; }
#topButton li:hover img { filter:drop-shadow(3px 5px 7px rgba(0,0,0,0.4)); -webkit-filter:drop-shadow(3px 5px 7px rgba(0,0,0,0.4)); opacity:0.7; }



/* fixed_top menu_bar */
.fixed_top { position:fixed; height:30px; top:10px; left:0; right:0; z-index:97; transition:all 0.65s; }
.fixed_top .logo { height:30px; position:absolute; top:0; left:50%; transform:translateX(-50%); }
.fixed_top .logo img { height:100%; }

.fixed_top .right_menu { position:absolute; top:0; right:10px; display:flex; }
.fixed_top .right_menu .btn_search { width:30px; height:30px; line-height:30px; color:#282828; font-size:23px; text-align:center; display:block; margin-right:7px; }
.fixed_top .right_menu .cart { height:30px; display:block; position:relative; }
.fixed_top .right_menu .cart img { height:100%; }
.fixed_top .right_menu .cart .user_basket_quantity { position:absolute; top:-8px; right:-8px; background:#e94a57; width:12px; height:12px; line-height:12px; border-radius:50%; text-align:center; font-size:10px; color:#fff; }


/* °Ë»ö */
.search { width:100%; height:100vh; position:fixed; top:0; left:0; background-color:rgb(255,255,255,0.9); display:none; z-index:1000; }
.search .searchBox { width:75%; padding:5px 0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-bottom:1px solid; }
.search .searchBox input { width:90%; height:30px; border:0px none; padding: 0 5px; font-size:20px; }
.search .close_button { height:25px; position:absolute; top:10px; right:10px; }
.search .close_button img { height:100%; }
.search .search_info { position:absolute; top:56%; font-size:14px; color:#888; width:100%; text-align:center; }

/* ¸Þ´º¹Ù */
.btn_wrap { position:fixed; top:10px; left:10px; width:25px; height:30px; z-index:999; transition:all 0.65s; }
.btn_wrap .bars { width:100%; height:2px; background:#007f53; margin:6px 0; transition:all 0.65s; }
.btn_wrap .on.bar1 { width:95%; }
.btn_wrap .on.bar2 { width:65%; }
.btn_wrap .on.bar3 { width:30%; }


/* ½ºÅ©·Ñ½Ã Çì´õ ¼û±è class */
.nav-up {
    top: -40px; /* Çì´õ ³ôÀÌ¿Í °°°Ô */
}


/* mo_menu_wrap */
.mo_menu_wrap { position:fixed; background:#fff; top:0; left:-100%; z-index:99; width:75%; height:100vh; max-width:600px; padding:60px 10px 10px; transition:all 0.65s; }
.mo_menu_wrap.on { left:0; }

.mo_menu_wrap .log_icon ul { display:flex; }
.mo_menu_wrap .log_icon ul li a { margin-right:15px; font-size:14px; color:#888; }

.mo_menu_wrap .menu_cover { margin-top:25px; }
.mo_menu_wrap .menu_cover > li { margin-bottom:15px; }
.mo_menu_wrap .menu_cover > li > a { font-size:28px; font-weight:700; position:relative; }

.mo_menu_wrap .menu_cover > li > a.sub-title:before { display:block; content:""; position:absolute; width:8px; height:2px; background:#007f53; transition:all 0.6s; top:30%; right:-20px; margin:0 0 0 -3px; }
.mo_menu_wrap .menu_cover > li > a.sub-title:after { display:block; content:""; position:absolute; width:2px; height:8px; background-color:#007f53; transition:all 0.6s; top:30%; right:-20px; margin:-3px 3px 0 0; }
.mo_menu_wrap .menu_cover > li > a.sub-title.on:before { opacity:0; transform:rotate(270deg); }
.mo_menu_wrap .menu_cover > li > a.sub-title.on:after { transform:rotate(270deg); }

.mo_menu_wrap .menu_cover > li .sub_menu_wrap { margin-top:10px; margin-left:15px; display:none; }
.mo_menu_wrap .menu_cover > li .sub_menu_wrap.dis-block { display:block; }
.mo_menu_wrap .menu_cover > li .sub_menu_wrap li { margin-bottom:10px; }
.mo_menu_wrap .menu_cover > li .sub_menu_wrap li a { font-size:18px; display:block; }
.mo_menu_wrap .menu_cover > li .sub_menu_wrap ul.sub2 li a {font-size:15px; text-indent:10px;}

.mo_menu_wrap .m_notice { position:absolute; bottom:15px; }
.mo_menu_wrap .m_notice .notice_call { margin-bottom:20px; }
.mo_menu_wrap .m_notice .notice_call h3 { font-size:16px; font-weight:500; }
.mo_menu_wrap .m_notice .notice_call h3 i { padding:0 3px 0 5px; }
.mo_menu_wrap .m_notice .notice_call p { font-size:12px; color:#888; padding-top:3px; word-break:keep-all; }

.mo_menu_wrap .m_notice .sns_icon { display:flex; align-items:center; }
.mo_menu_wrap .m_notice .sns_icon li { font-size:20px; margin-right:8px; }

.overlay { position:fixed; width:100%; height:100%; background:rgba(0,0,0,0.55); opacity:0; z-index:-1; transition:all 0.4s; }
.overlay.on { opacity:1; z-index:98; }

/* BASIC css end */