/* BASIC css start */
@media screen and (min-width:768px) {
    #header #menu {width:85px;}
    #header .headerTop {padding-right:85px;}
    #header .search {padding-right:85px;}
    #header .search .searchBox input {width:95%;}
    #header .search .btn_search {width:85px;}
}


/* 사이드 바 (적립금/쿠폰) */
@font-face { font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: normal; font-style: normal; }


.aside_home > .home_ment ul li {
    position: relative;	
    height: 40px;
    line-height: 40px;
    border: 1px solid #ddd;
    overflow: hidden;
   font-family: 'GmarketSansBold',"Noto Sans KR",Malgun Gothic,NanumGothic,Dotum,Gulim,sans-serif;
}
.aside_home > .home_ment ul li:before {
    content: "";
    position: absolute;
    top: 12px;
    left: 95px;
    display: inline-block;
    width: 1px;
    height: 17px;
    background: #DDD;
}
.aside_home > .home_ment ul li .reserve_txt {
    float: left;
    padding-left: 40px;
    background: url(/design/bodymax/renewal/2018/etc/ico/ico_mymileage.png)no-repeat 10% 50%;
    background-size: 27px;
    font-family: "Noto Sans KR",Malgun Gothic,NanumGothic,Dotum,Gulim,sans-serif;
}
.aside_home > .home_ment ul li .coupon_txt{

    float: left;
    padding-left: 40px;
    background: url(/design/bodymax/renewal/2018/etc/ico/ico_mycoupon.png)no-repeat 20% 50%;
    background-size: 25px;    
    font-family: "Noto Sans KR",Malgun Gothic,NanumGothic,Dotum,Gulim,sans-serif;
}
.aside_home > .home_ment ul li .reserve_count,
.aside_home > .home_ment ul li .coupon_count{

    float: right;
    font-size: 15px;
    margin-right: 20px;
    font-weight: bold;

}
   
/* 사이드 바 CSS 모션 */


@keyframes 
sideShow { from {
 left: -300px;
}

to { left: 0; }
}
 @-webkit-keyframes 
sideShow { from {
 left: -300px;
}

to { left:0; }
}
 @-moz-keyframes 
sideShow { from {
 left: -300px;
}

to { left:0; }
}
 @-o-keyframes 
sideShow { from {
 left: -300px;
}

to { left: 0; }
}

.sideShow {
  -webkit-animation: sideShow .1s ease forwards;
  -moz-animation: sideShow .1s ease forwards;
  -o-animation: sideShow .1s ease forwards;
  animation: sideShow .1s ease forwards;
}





@keyframes 
sideHide{ from {
 left: 0;
}

to { left: -300px; }
}
 @-webkit-keyframes 
sideHide{ from {
 left: 0;
}

to { left:-300px; }
}
 @-moz-keyframes 
sideHide{ from {
 left: 0;
}

to { right:-300px; }
}
 @-o-keyframes 
sideHide{ from {
 left: 0;
}

to { left: -300px; }
}

.sideHide{

  -webkit-animation: sideHide .3s ease forwards;
  -moz-animation: sideHide 0.5s ease forwards;
  -o-animation: sideHide 0.5s ease forwards;
  animation: sideHide .3s ease forwards;
}


.hidden { display: none; }


/* 사이드 바 CSS 모션 끝 */


.aside_home { padding:50px 15px 30px 15px; text-align:center;}

/* 사이드 멘트 */
.aside_home > .home_ment p { line-height:18px;}
.aside_home .home_ment h2 img { width:50%; margin-bottom: 20px;}

.aside_home > .home_ment ul {margin-top:40px;}
.aside_home > .home_ment ul li:first-child{border-bottom:0;}
/* 사이드 버튼 */
.home_btn ul.info { overflow: hidden; margin:30px 0 0; }
.home_btn ul.info li{ float:left;  margin-left: 5px;}
.home_btn ul.info li.btn_logout a{width: 270px; background: #d50c0c; color: #fff; border:0;}
.home_btn ul.info li:first-child {margin:0;}
.home_btn ul.info li a{ border:1px solid #ddd; letter-spacing: .8px; font-weight: bold; display: block; width: 130px; height: 35px; line-height: 35px; }
.home_btn ul.members {overflow: hidden; margin:20px 0;}
.home_btn ul.members li{float:left; width:24.4%; border:1px solid #ddd;  margin-left: -1px; }
.home_btn ul.members li:first-child {margin:0;}
.home_btn ul.members li a{ display: block;  height: 70px; line-height: 105px; font-size: 0.8em; letter-spacing: .5px; background-size: 35% !important;}
.home_btn ul.members li a.cart {background:url(/design/bodymax/M/ico/ico_side_cart.png) no-repeat 50% 35%;}
.home_btn ul.members li a.order {background:url(/design/bodymax/M/ico/ico_side_order.png) no-repeat 50% 35%;}
.home_btn ul.members li a.mypage {background:url(/design/bodymax/M/ico/ico_side_mypage.png) no-repeat 50% 35%;}
.home_btn ul.members li a.favorite {background:url(/design/bodymax/M/ico/ico_side_favorite.png) no-repeat 50% 35%;}

.home_search {position: relative; overflow: hidden;}
.home_search form #keyword { width: 80%; height: 40px; float: left; display: inline-block; position: relative; background: #f9f9f9; border: 1px solid #ddd; border-right: 0;}
.btn_search { display: block; width: 19%; height: 38px; float: left; border: 1px solid #ddd; border-left: 0; background:#f9f9f9 url(/design/bodymax/M/btn_search.png) no-repeat 50% 50%; background-size: 40%; text-indent: -999em;}

/* 사이드 퀵메뉴 */
.aside_quick ul {overflow:hidden; border-bottom:1px solid #ddd;}
.aside_quick ul li:first-child {border:0;}
.aside_quick ul li{ float: left; text-align: center; text-transform: uppercase; border-left:1px solid #ddd;}
.aside_quick ul li a{ display: inline-block; font-size: 0.9em; font-weight: bold; line-height: 15px; width:93px;  height: 80px; display: table-cell; vertical-align: middle;}
.aside_quick ul li a > b {color:#d50c0c;}



/* 사이드 (대)버튼 */

.aside_cate { width:100%; border-top:2px solid #333; margin: 0 0 40px 0;}
.aside_catebtn {    position: relative;  overflow: hidden;}
.aside_catebtn p {height:50px; line-height:50px; padding: 0 25px; background:#fefefe; border-bottom:1px solid #ddd;text-transform: uppercase; font-weight:bold;}
.aside_catebtn p > b {color:#d50c0c;}
.aside_catebtn span {
    font-size: 10px;
    padding:3px 5px;
    background: #d50c0c;
    border-radius: 3px;
    margin-left: 96px;
    color: #fff;
}

/* 사이드 (소)버튼 */
.side_menu { position: relative; margin: 20px; border: 1px solid #eee; }
.side_menu .side_menu_btn > a.select { font-weight:bold; background:#fff; border-bottom: 1px solid #fff; }
.side_menu .side_menu_btn > a.select:before {
    content: "";
    display: block;
    width: 98.7%;
    border: 1px solid #333;
    height: 39px;
    position: absolute;
    top: 0px;
    left: 0;
    z-index: 999;
    border-bottom: 2px solid #fff;
}

.board_cnt {display:none;}
.side_menu ul li {border-bottom: 1px solid #eee; margin: 0 20px;}
.side_menu ul li .btn_down { width: 33px; text-align: center; height: 35px; line-height: 35px; display: inline-block;}
.side_menu ul li .category_sub {display:none;}
.side_menu ul li:last-child {border:0;}
.side_menu ul li > a { display: inline-block; width: 165px; height: 35px; line-height: 35px; padding: 0 0 0 20px;}
.side_menu .side_menu_btn {overflow: hidden;}
.side_menu .side_menu_btn > a { position: relative; float: left; width:50%; height: 40px; line-height: 40px; text-align: center; background:#f9f9f9; border-bottom: 1px solid #333;}
.side_menu .side_menu_btn > a.select{}


/* 고객센터 & 은행정보 */

.side_cs {margin:20px 0 50px 30px;}
.side_bk {margin:20px 0 50px 30px;}
.side_cs > a { font-size: 1.7em; display: inline-block; margin: 0 0 10px 0;}
.side_cs > a img { width: 15px;  margin-right: 10px;}
.side_cs h2, .side_bk h2 { font-size:1em;text-transform: uppercase; font-weight:bold; margin-bottom:10px;}
.side_cs li, .side_bk li {color:#777;}


/* SNS 정보 */

.side_sns ul{ overflow: hidden;margin: 20px 0 50px 15px;}
.side_sns ul li{ position: relative; width:13%; float:left;}
.side_sns ul li a {display:block; margin-left:15px; transition: none; }
.side_sns ul li a img {width:100%; height:100%;}


#mask {width:100%; height:100%; position: fixed; top:0; left:200px; right:0; bottom:0; background:url(https://www.bodymax.kr/design/bodymax/M/mask_bg.png); z-index:1000; display:none;}

/* BASIC css end */