/* BASIC css start */
#content { padding-top:0px;}

/* 메인페이지에서 좌우측 퀵바 고정
#blk_scroll_wings {position:absolute !important; top:221px !important;} */

#mpro table td {vertical-align:top;} 
#mpro .line{border-right:1px solid #dedede;}

/* 측면 배너 안보이기 */
#sub_ban {display:none;}
#quick_area{margin-top:0px;}
/* #quick_area{display:none;} */

/* 커뮤니티 리스트 안보이기 */
#left_bbs {display:none;}
/* 메인에서 측면 백그라운드 보이기 */
.main_bg {display:inline !important;}

#contentWrap{width:100%;}
#content {width:100%; margin:0 auto;}


/* 메인상품 타이틀 스타일 */
.product_title {clear:both;  margin:0 auto; width:1198px; margin-top:40px; margin-bottom:20px; }
.prd-list {width:1198px; margin:0 auto;}
.prd-list .add {  display:none; }

.new_prd_list_outer, .best_prd_list_outer, .sale_prd_list_outer { width:1198px; position:relative; margin:0 auto; }
.prd-list.new_prd_list { overflow: hidden;position: relative;text-align: center;}
.new_prd_list.prd-list .swiper-slide { font-size:0; }
.new_prd_list.prd-list .swiper-slide>div { display:inline-block; width:calc(100% / 4)!important; vertical-align:top; }
.new_prd_list.prd-list li { font-size: 12px;
    line-height: 1.25;
    color: #555;
    font-family: Dotum, AppleGothic, Helvetica, sans-serif; }

.new_prd_list .info { padding:5px 0 15px 0; }

.prd_arrow { top:50%; transform:translateY(-50%) }
.prd_left {background:url('http://gi.esmplus.com/clickmalll/image/right_box.jpg'); width:42px; height:42px; position:absolute; cursor:pointer;text-indent:-10000px; left:-50px; margin-top:-22px; opacity:1;}
.prd_right {background:url('http://gi.esmplus.com/clickmalll/image/left_box.jpg'); width:42px; height:42px; position:absolute; cursor:pointer;text-indent:-10000px; right:-50px; margin-top:-22px; opacity:1;}


.banner_prd_list_outer .prd-list.new_prd_list {
    width: auto;
}

.banner_prd_list_outer .new_prd_list.prd-list .swiper-slide>div {
    width: calc(100% / 3)!important;
}

.banner_prd_list_outer .new_prd_list.prd-list .swiper-slide>div .tb-center { padding:0; } 

.banner_prd_list_outer {
    position:relative;
    margin: 0 30px;
}

.banner_prd_list {

    padding-left: 375px;
    position: relative;
    width: 1198px;
    margin: 0 auto;
    box-sizing: border-box;
}

.left_banner {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 350px;
}
.left_banner img { width:100%; }


/* 기간할인 음료 텍스트 스타일*/
ul.info .price1{color:#f00; font-weight:bold;}


/* 메인 브랜드 배너 관련 스타일 */
.main_brand_area { width:100%; clear:both;  height:146px; background-color:#f8f8f8; clear:both; margin-top:20px; }
.main_brand_ban01 {width:1198px; height:146px; margin:0 auto; text-align:center; position:relative;}
.main_brand_ban01 .one_bang {position:absolute; top:-40px; left:-90px; z-index:55;}
.main_brand_ban01 ul li {float:left; padding:0px; margin:0px; font-size:0px;}
.main_brand_ban01 img:hover {opacity: 0.5; filter:alpha(opacity=50);}

#main_area { width:100%; height:507px; overflow:hidden; vertical-align:top;position:relative; } 
#main_left {position:absolute;top:0;left:50%;margin-left:-500px;}

/*---------------------------------
 *  메인이미지 8장
 *---------------------------------*/
.contentslider-main {width:100%; height:507px; margin:0px; padding:0px; border-bottom:1px solid #dedede;}

.contentslider-main .sliderkit-nav { width:100%; margin-left:100px; position:relative; }
.contentslider-main .sliderkit-nav-clip { height:30px; margin:0 auto; position:absolute; top:477px; width:1000px; }
.contentslider-main .sliderkit-nav-clip li:first-child {border-left:0px }
.contentslider-main .sliderkit-nav-clip li { display:block; width:124px; height:370x;  margin-right:0px; background-color:#f9f9f9;  border-right:1px solid #e9e9e9; }
.contentslider-main .sliderkit-nav-clip li:last-child { width:124px; margin:0px;  }
.contentslider-main .sliderkit-nav-clip li a  {width:124px; height:370x; line-height:30px;  margin:0px;  font-size:12px; font-family:돋움; font-weight:400; color:#555;  text-decoration:none;  background:transparent; border-top:1px solid #e9e9e9;   }
.contentslider-main .sliderkit-nav-clip li a:hover{ background-color:#005d2b; }
.contentslider-main .sliderkit-nav-clip li.sliderkit-selected a{ background-color:#005d2b; color:#fff; border-top:1px solid #005d2b; border-right:1px solid #005d2b;}

.contentslider-main .sliderkit-panels{width:100%; height:507px; overflow:hidden; padding:0px; margin:0px; }
.contentslider-main .sliderkit-panel{width:100%; height:507px;  overflow:hidden; padding:0px;margin:0px;}
.contentslider-main .sliderkit-panel p {width:1198px;  text-align:right; height:507px; overflow:hidden; padding:0 0 0 0px; margin:0px auto; }

.contentslider-main .sliderkit-btn {width:1000px; margin:0px auto; position:relative;}
.contentslider-main .sliderkit-go-btn{position:absolute; top:200px;}
.contentslider-main .sliderkit-go-prev{left:120px;}
.contentslider-main .sliderkit-go-next{right:-80px;}
.contentslider-main .sliderkit-go-btn a{display:block; width:34px; height:35px; cursor:pointer;   }
.contentslider-main .sliderkit-go-prev a{background-position:0 0;}
.contentslider-main .sliderkit-go-next a{background-position:-34px 0;}
.contentslider-main .sliderkit-go-prev a:hover{background-position:-68px 0;}
.contentslider-main .sliderkit-go-next a:hover{background-position:-102px 0;}
.contentslider-main .sliderkit-go-btn span{display:none;}

/* sale 부분 */
.salemain{clear:both;  margin:0 auto;   width:1198px; height:650px; }

.salemain .sale_left{float:left;}
.salemain .sale_right{float:right; width:600px; }
.salemain .sale_left p, .salemain .sale_right p{color:#555; font-size:12px; font-family:돋움; font-weight:400; margin-top:20px; margin-left:4px;}
.salemain .sale_left p:hover { color: #006633;}
.salemain .sale_right p:hover { color: #006633;}
.salemain .sale_left p em, .salemain .sale_right p em{color:#f00; font-size:2.2em; letter-spacing:-1px; font-family:'NanumSpuare',sans-serif;  line-height:40px;}
.salemain .sale_right .slae2{float:left; height:338px;}
.salemain .sale_right .slae3{float:right; height:338px;}
.salemain .sale_right .slae4{float:left; height:300px;}
.salemain .sale_right .slae5{float:right; height:300px;}


/* 중간광고배너 */
.mainbanner_m{clear:both; height:150px; margin-top:50px; width:100%; background: #ffffff;}
.mainbanner_m a{display:block; width:1198px; margin:0 auto;  }

/* MD_pick */
.recmd-prd-list{ width: 100%; height:696px;  margin-top:20px; text-align:center; background: #ffffff; }

.slide_fade {  margin:0 auto; overflow: hidden;  position: relative;  width: 1198px;  height: 692px; background: #ffffff; }
.slide_fade .box {  overflow: hidden;  position: relative;  width: 1198px;  height: 666px;   z-index: 4; top:52px; }
.slide_fade .box a { color: #fff; } 
.slide_fade .box a:hover { text-decoration: none;   color: #f00;}
.slide_fade .list {  overflow: hidden;  height: 666px; }
.slide_fade .list li {  position: relative;  width: 1198px;  height: 640px;  }
.slide_fade .list img {  width:100%; height: 634px; }

.slide_fade .txt {  position: absolute;  top: 00px;  left: 45px;  font: 14px/24px; }
.slide_fade .txt h3 { font: 40px/80px; }
.slide_fade .btn {  position: absolute;  width: 1198px;  height: 100px; top: 0;  left: 0;  height: 60px;  z-index: 5; margin-left:1px;}

.slide_fade .btn a {  color: #555;  text-decoration: none; font-family:돋움;}
.slide_fade .btn li {  overflow: hidden;  float: left;  width: 19.5%;  height: 42px;  margin-left: 6px;  padding-top: 7px;  color: #333;      }
.slide_fade .btn li:first-child { margin-left: 0; }
.slide_fade .btn li:hover{ color:#555; width: 19.5%;    height: 42px; cursor: default;}
.slide_fade .btn .selected {  position: relative;  top: 0px;  border-bottom: 3px solid #005d2b; }
.slide_fade .btn h3 {  padding: 2px 0 0 0;  font: 12px/20px;  text-indent: 2px; }
.slide_fade .btn p {  color: #555;  font: 12px/20px;  text-indent: 2px; }
.slide_fade .btn p a { color: #555; }
.slide_fade .btn p a:hover { text-decoration: underline; }

p.menu{height:42px; padding-top:14px; text-align: center;  font-size: 14px; border:1px solid #dcdcdc; border-radius: 6px; }


/* 메인 로딩바 */
.fade { transition: all 300ms linear 700ms; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); -o-transform: translate3d(0,0,0); transform: translate3d(0,0,0); opacity: 1; }
.fade.out { opacity: 0; }
#nprogress { pointer-events: none; }
#nprogress .bar { background:#777; position: fixed; z-index: 1031; top: 0; left: 0; width: 100%; height: 2px; }
#nprogress .peg { display: block; position: absolute; right: 0px; width: 100px; height: 100%; box-shadow: 0 0 10px #fff, 0 0 5px #fff; opacity: 1.0;-webkit-transform: rotate(3deg) translate(0px, -4px); -ms-transform: rotate(3deg) translate(0px, -4px); transform: rotate(3deg) translate(0px, -4px); }
.nprogress-custom-parent { overflow: hidden; position: relative; }
.nprogress-custom-parent #nprogress .bar { position: absolute; }


/* 추천 레시피 */

.recipe_box{ width:1198px; overflow: hidden;  margin:0 auto; }
.recipe_box img{margin-bottom:30px;}


.container{ width:1198px; overflow: hidden;  margin:0 auto; }
.g_slide { position: relative; width: 1198px; height: 400px; overflow: hidden; margin:0px 0px 0px-100px auto; }
.g_slide .item { display: none; position: absolute; left: 0; top: 0; }
.switch_main { position: relative; }
.g_slide .switch_nav { width: 100%; position: absolute; right: -530px; bottom: 360px; z-index: 11; text-align: center; }
.g_slide .switch_nav_item { display: inline-block; margin: 0 8px 0 0;  width: 13px;  height: 13px;  line-height: 200px;  overflow: hidden;  font-size: 0;  border-radius: 100%;  background: #b7b7b7;  text-align: center;  font-size: 18px;  color: #fff; }
.g_slide .switch_nav_item:hover { text-decoration: none; background: #006633; }
.g_slide .switch_nav_item_current { background: #006633; }


/* 브랜드 */

#main-roll {width:1198px; margin:0 auto; height:134px;  overflow:hidden; padding-top:10px;  }
#main-roll .prd-list { width:1198px; height:134px; margin-top:10px;}
#main-roll .prd-list li img{ width:224px; height:134px;}

#main-roll .productWrap { position:relative; margin:0 auto; padding-top:0px; z-index:100; width:1198px;}
#main-roll .product ul, div.product ul li {margin:0; padding:0; list-style:none; }
#main-roll .product .toolbar {overflow:hidden;}
#main-roll .product .toolbar a.left {background:url('http://gi.esmplus.com/clickmalll/image/arrow_right.png'); width:10px; height:90px; position:absolute; cursor:pointer;text-indent:-10000px; left:-20px; margin-top:-22px; opacity:0.3;}
#main-roll .product .toolbar a.right {background:url('http://gi.esmplus.com/clickmalll/image/arrow_left.png'); width:10px; height:90px; position:absolute; cursor:pointer;text-indent:-10000px; right:-20px; margin-top:-22px; opacity:0.3;}
#main-roll .product .toolbar a:hover{opacity:1;}
#main-roll .product .toolbar a:hover{opacity:1;}

/* 중간 배너*/
#main-roll {width:1200px; margin:0 auto; height:150px;  overflow:hidden; padding-top:10px;  }
#main-roll .prd-list2 { width:1200px; height:150px; margin-top:10px;}
#main-roll .prd-list2 li img{ width:100%;}


/* notice*/
.eventArea { margin: 40px auto; text-align: center; }
.eventArea ul { margin:0 auto; width:1200px;}
.eventArea ul li {position:relative; float:left;margin:0 30px 0 0; }
.eventArea ul li:last-child { margin: 0;}
.eventArea ul li a:hover img {filter:alpha(opacity=80); opacity:0.8;}


/* 중간 배너*/
.eventArea2 { margin: 70px auto; text-align: center; }
.eventArea2 ul { margin:0 auto; width:1200px;}
.eventArea2 ul li {position:relative; float:left;margin:0 10px 0 0; }
.eventArea2 ul li:last-child { margin: 0;}


.score { color : #FF0000; }
.blue { color : #0000ff; }

/* BASIC css end */