/* BASIC css start */
#container{background:#fff !important;}
#footer{margin-top:0px !important;}
img {max-width:100%;}


/********** 메인 배너 (관리자연동) **********/

.mainBannerText {  position: absolute;height: 82px;left: 0;top: calc(50% - 41px);display: inline-block;text-align: center;width: 100%;vertical-align: middle;z-index:99; display:none;}
.mainBannerText h2{ display: block;font-size: 24px;font-weight: 200;letter-spacing: 0.3px;padding: 0 0 7px;color: rgb(255,255,255);font-family: Nunito;height: 30px;/* text-shadow: 0px 0px 2px rgba(80,80,80,0.62); */    }
.mainBannerText span{ display: block;font-size: 11px;font-weight: 300;line-height: 22px;letter-spacing: 0;color: rgba(255, 255, 255, 0.84);text-shadow: 0px 0px 2px rgba(97, 97, 97, 0.58);}


/* 롤링배너 */
#event{position:relative;}
#event .MS_img-wrap { position: relative; width: 100%; overflow: hidden; }
#event .event-imgs { position: relative; }
#event .MS_img-area { float: left; }
#event .MS_img-area:not(:first-child) { display: none; }
#event .MS_img-area img { width: 100%; }
#event .pagination { position: absolute; left: 0; bottom:0; text-align: center; width: 100%; padding:10px 0;}
#event .pagination .swiper-pagination-switch { display: inline-block; margin: 0 4px; text-indent: -9999px; width: 8px; height: 8px; border-radius:8px; background:rgba(255,255,255,0.5);}
#event .pagination .swiper-active-switch { background:rgba(255,255,255,0.8); }

/* //롤링배너 */




/********** 공지사항 **********/

.notiMain { text-align: Center;padding: 26px 0 32px;background: #f5f5f5;}
.notiMain ul li { display: block;height: 22px;line-height:22px;}
.notiMain ul li a { display: block;color: #808080;font-weight: 300;font-size: 11px;font-family: '맑은 고딕';}
.notiMain .more { color: #bdb9b6;display: block;padding-top: 10px;font-size: 0.8em;}





/******** 페이드배너 ********/

.fadeBanner { clear: both;position: relative;margin: 0 auto;margin: 0px 0 25px;background: #fff;box-sizing: border-box;padding:17px;}
.fadeBanner #bx-pager { padding: 10px 0 30px 0;}
.fadeBanner #bx-pager a { display: inline-block;margin-right: 6px;border-radius: 30px;border: 1px solid #d8d8d8;text-align: center;font-size: 11px;line-height: 11px;padding: 8px 14px 6px 14px;color: #989898;}
.fadeBanner #bx-pager a.active { background: #a09f94;border: 1px solid #a09f94;color: #fff;;}
.fadeBanner ul > div { position: relative;background:#fff}
.fadeBanner ul > div > h1 { display: block;font-weight: normal;font-size: 0.8em;color: #a74e4e;padding: 0 0 3px 3px;}
.fadeBanner ul > div > h2 { display: block;font-size: 18px;font-weight: normal;font-family: nunito,'맑은 고딕';padding-bottom: 13px;letter-spacing: 0.3px;color: #211f1d;}
.fadeBanner ul > div > span { display: block;font-size: 11px;line-height: 19px;color: #737373;padding-bottom: 26px;font-weight: 300;}
.fadeBanner ul > div > a { margin: 19px 0 2px;;text-align: center;display: block;border: 1px solid #c7c7c7;padding: 7px;font-size: 11px;font-weight: 300;color: #7d7d7d;}





/********** 미들배너 **********/
.middleBanner { position:relative; background: #b6b2ae;margin-bottom: 25px;}
.middleBanner h2 { display: block;height: 54px;font-size: 15px;color: #fff;font-weight: 100;font-family: Nunito;padding: 20px 0 ;letter-spacing: 5px;text-align: center;box-sizing: border-box;}
.middleBanner h2 a { margin-top: 12px;display: block;background: #a5a19d;color: #ffffff;font-size: 18px;letter-spacing: 2px;font-family: Nunito;font-weight: 300;text-transform: uppercase;position: absolute;right: 11px;top: 0;border-radius: 100%;line-height: 30px;width: 30px;height: 30px;box-sizing: border-box;}
.middleBanner h2 b { font-weight:300}
.middleBanner h2 a i { padding: 5px 0 0 3px;color: rgba(255, 255, 255, 0.64);}




/********** 탭상품 **********/

/* 탭박스 */
#tabBox { margin-top:60px; }
#tabBox:after {content:"";display:block;clear:both;;}
#tabBox .tabMenu { clear:Both;}
#tabBox .tabMenu > ul {     font-size: 0;
    line-height: 0;
    background: #f0f0f0;}
#tabBox .tabMenu > ul:after { content:"";clear:both;display:block;}
#tabBox .tabMenu > ul > li { margin-left: -1px}
#tabBox .tabMenu > ul > li a {cursor: pointer;float: left;width: calc( 100% / 5 );font-size: 11px;line-height: 13px;padding: 12px 0;text-align: center;margin-left: -1px;}
#tabBox .tabMenu > ul > li:last-child a { width:calc(100% / 5 );border-right:0;}
#tabBox .tabMenu > ul > li { }
#tabBox .tabMenu > ul > li a.active {    background: #fff;
    font-weight: bold;
    border: 1px solid #fff;
    border-top: 1px solid #000;
    width: calc(100% / 5 );
    box-shadow: 3px 2px 6px rgba(0,0,0,0.07);}
#tabBox .tabMenu > ul > li:last-child a.active { width:calc(100% / 5 + 3px );}
#tabBox .tabCons_wrap > ul  { width:500%;}
#tabBox .tabCons { float:left;height:auto;width:calc(100% / 5);}
#tabBox .tabCons .items {     background: #fff;
    padding: 6px 4px;
    box-sizing: border-box;
    box-shadow: 5px 3px 4px rgba(0,0,0,0.03);}

/* 상품표시 */

#tabBox .ec-base-product [class*="grid"] > li {       position: relative;
    width: calc(50% - 4px);
    margin: 0 2px 4px;}
#tabBox .ec-base-product .grid2 > li {border-bottom:0;padding-bottom:0;}
#tabBox .tabCons .items .description { opacity:0;visibility:hidden;position: absolute;left: 0px;bottom: 0;z-index: 2;width: 100%;height: 100%;text-align: center;background: #fff9;box-sizing: border-box;}
#tabBox .tabCons .items .description.active {opacity:1;visibility:visible;}
#tabBox .tabCons .items .thumbnail .wish {display:none;}
#tabBox .ec-base-product .thumbnail { margin:0;}
#tabBox .ec-base-product [class*="grid"] { padding:0;}
#tabBox .ec-base-product .description .name {font-weight:normal;font-size:11px;margin-bottom:0;}
#tabBox .ec-base-product .description .price {padding-top: 5px}
#tabBox .ec-base-product .description .price span { font-size: 12px !important;color: #272727 !important;font-family: nunito !important;}

/* 출력안함 */
#tabBox .ec-base-product .cart,
#tabBox .ec-base-product .likeButton,
/*
#tabBox .ec-base-product .mPriceStrike,
*/
#tabBox .ec-base-product .icon,
#tabBox .ec-base-product span span {display:none;}




/********** 배너 **********/
.bnMain { margin-bottom:5px;}
.bnMain .bx-wrapper .bx-pager {right: 0;bottom: 0px;width: 98px;text-align: center;height: 20px;background: rgba(74,71,67,0.34);padding: 6px 0;color: #fff;font-weight: normal;font-size: 11px;line-height: 20px;letter-spacing: 0;}
.bnMain .bx-wrapper .bx-pager:after {content:"전체보기";padding-left:9px;}

/* 이벤트 전체보기 */
.bnMain .hidden { opacity: 0;visibility: hidden;position: fixed;z-index: 999;left: 0;top: 0;background: rgba(53,53,53,0.95);width: 100%;height: 100%;box-sizing: border-box;padding: 6px;}
.bnMain .hidden h2 { display: block;padding: 8px 0 12px;position: relative;color: #fff;font-weight: 300;text-align: center;font-size: 16px;}
.bnMain .hidden h2 i { position: absolute;right: 7px;top: 8px;font-size: 16px;}
.bnMain .hidden.active {opacity:1;visibility:visible;}
.bnMain .hidden > div.bin {position:absolute;left:0;top:0;width:100%;height:100%;background:transparent;z-index:8;}
.bnMain .hidden > ul {overflow-y:auto;height:100%;position:relative;z-index:9;}
.bnMain .hidden > ul a { display: block;margin-bottom: 6px;}
.bnMain .hidden > ul a:last-child{margin-bottom:0;}






/********** WeeklyBest **********/
.weeklyBest.ec-base-product { background: #fff;padding: 0 0 10px;background-size: cover;padding: 14px;margin-bottom: 20px;}
.weeklyBest.ec-base-product .description .name { margin-bottom:3px;}
.weeklyBest.ec-base-product .title {     box-sizing: border-box;
    padding: 18px 0 25px 0;
    text-align: center;}	
.weeklyBest.ec-base-product .title h4 {    padding: 0;font-size: 14px;padding-bottom: 0;text-align: left;padding-left: 0;color: #2d2d2d;font-weight: 400;padding: 14px 0 3px 0;letter-spacing: 0;}

.weeklyBest .carousel-cell { width: 39%;height:230px;margin-right: 8px;background: #fff;counter-increment: carousel-cell;}
.weeklyBest .big { padding:0;margin:0;;}
.weeklyBest .big .description { position:relative;padding:0;}
.weeklyBest .big .color { display:none;}
.weeklyBest .big .description .price { position: absolute;right: 8px;top: 10px;font-size: 13px;color: #333;}
.weeklyBest .big .description .name a { display: block;padding: 12px 0 0;font-size: 15px;font-weight:600;}
.weeklyBest .big .description .summary { display:block;padding-top:3px;color:#999;font-size:11px;line-height:18px;font-weight:400;}
.weeklyBest.ec-base-product .slide { margin-top: 15px;border-top: 1px solid #eaeaea;padding-top: 17px;}
.weeklyBest.ec-base-product .slide .description .name a {font-size: 12px;color: #444;font-weight: 400;}
.weeklyBest.ec-base-product .slide .description .listPrice,
.weeklyBest.ec-base-product .slide .description .price {margin-bottom:2px}
.weeklyBest.ec-base-product .slide .description .price span {color:#444}
.weeklyBest.ec-base-product .slide .description {padding:0 0 0 0px;}
.weeklyBest.ec-base-product .carousel-cell .color{position:relative;left:0;top:0;padding-top:3px;}
.weeklyBest.ec-base-product .carousel-cell .color .chips {width: 6px;height: 6px;margin: 0 3px 0 0px;}
.weeklyBest.ec-base-product .carousel-cell .color .chips:first-child { margin-right:1px;}


/* 기타 메인에서만 적용되는 스타일 */

/************* 메인 상품 *************/
.listSubname,.listTerm {}
 
 
.tabCons_wrap .ec-base-product li.price,
.tabCons_wrap .ec-base-product li.percent,
.tabCons_wrap .listPrice, .listDiscount {display:block;padding-top:5px; }
.tabCons_wrap .listCustomer,
.tabCons_wrap .listDiscount {display:none;}


.mm {margin:11px 0 11px;}

.ec-base-product .title { box-sizing: border-box;padding: 100px 10px 40px 10px;text-align:center;}
.instaWidget .title { box-sizing: border-box;padding:10px;text-align:center;}





.ec-base-product .title {    box-sizing: border-box;
    padding: 25px 0;
    text-align: center;}
.ec-base-product .title h4 {     position: relative;
    border-bottom: 1px solid #888;
    padding-bottom: 4px;
    margin-bottom: 10px;
    font-size: 13px;}

.ec-base-product .title h3 {font-weight:normal;color:#999}

/* BASIC css end */