/* BASIC css start */


#content-mainbn { margin-bottom: 50px; }
#content-mainbn > div {
    position: relative;
    overflow: hidden;
}

#content-mainbn > div:first-child::after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

#particles-js {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*
    background-color: #232741;
    background-image: url("http://upload.wikimedia.org/wikipedia/commons/thumb/e/e5/NASA_logo.svg/1237px-NASA_logo.svg.png");
    */
    background-repeat: no-repeat;
    background-size: 20%;
    background-position: 50% 50%;
} 

#thunderstorm {
  position: absolute;
  top: -50%;
  left: 0;
  width: 100%;
  height: 150%;
}

.raindrop {
  position: absolute;
  background-image: linear-gradient(to bottom, #fecd7f4a, #FEBE55);
  width: 2px;
  height: 120px;
  opacity: 0;
  
}


.choco_slide {
    position: absolute;
    top: 19%;
    left: 0;
    width: 100%;
    padding: 0 10%;
    box-sizing: border-box;
}

.choco_slide .swiper-wrapper {
    transition-timing-function: linear;
}

.choco_slide img { width: 100%; }

.model_slide {
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 95%;
    box-sizing: border-box;
}

.model_slide .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.model_slide .swiper-slide img { 
    width: auto; 
    height: 95%; 
    transition: .5s;
}

.model_slide .swiper-slide-active img { height: 100%; }

#content-mainbn .back {
    display: block;
    width: 100%;
    height: 53%;
    background: linear-gradient(0deg, #00000091, transparent);
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}

#content-mainbn .tit {
    position: absolute;
    bottom: 7.5%;
    left: 50%;
    transform: translateX(-50%);
    width: 38%;
    z-index: 1;
}

#content-mainbn > div .prd_btn {
    position: absolute;
    top: 5%;
    left: 18%;
    display: inline-block;
    width: 29%;
    height: 87%;
}

#content-mainbn > div .prd_btn:last-child {
    right: 18%;
    left: auto;
}


#content-pro { width: 100%; }

#prd-w100 { width:100%;  padding:20px 0 10px; }
#prd-section01 { width:1350px; margin:0 auto;   }
#prd-section02  { width:1350px; padding:10px 0 15px 0}

#content-mainbn > div > img { width: 100%; }

/* ====== 분류페이지 추천상품3열코드 ====== */

.prd-item-list3 { zoom: 1; overflow: hidden; clear: both; }
.prd-item-list3:after { content: ""; clear: both; display: block; }
.prd-item-list3 .item { float: left; width: 433px; /* text-align: center; */ padding-bottom: 20px ;}
.prd-item-list3 .item .item_box { width: 410px; margin: 0 auto;  background-color: #fff; border:10px solid #fff;  box-shadow: 0px 15px 35px rgba(50,50,90,0.1), 0px 5px 15px rgba(0,0,0,0.07); box-sizing: border-box; position: relative; }
.prd-item-list3 .item .item_box .thumb { margin: 0 auto; width:390px; height: auto;   position: relative;  }
.prd-item-list3 .item .item_box .thumb img { width:390px; height: auto; }
.prd-item-list3 .item .item_box .info { width: 100%; margin:0 auto; text-align:left; }
.prd-item-list3 .item .item_box .info li { padding:5px 0; }
.prd-item-list3 .item .item_box .info .name {padding-bottom: 5px; text-align:left; font-size:12px; color: #555;  font-weight:bold; border-bottom:1px solid #F0F0F0; }
.prd-item-list3 .item .item_box .info .subname { color: #c30000; font-size:12px; }
.prd-item-list3 .item .item_box .info .color { padding-top: 10px; }
.prd-item-list3 .item .item_box .info .icon { margin-top: 10px; }
.prd-item-list3 .item .item_box .info .price01 { font-weight:none; color:#999; padding-right:10px; text-decoration:line-through; }
.prd-item-list3 .item .item_box .info .price02 { font-weight:none; color:#555; }
.prd-item-list3 .item .item_box .besttit { position:absolute; top:0px; left:0px;  opacity: 0.7; filter: alpha(opacity=70); /* For IE8 and earlier */  z-index:2; }
.prd-item-list3 .item .item_box .besttit .box { padding:5px; background-color:#999; color:#F4F4F4; line-height:38px; border:1px solid #dedede; font-size:12px; letter-spacing:-0.5px; font-weight:bold; }
.prd-item-list3 .item .item_box:hover .besttit .box {background-color:#000; border:1px solid #000; color:#fff; }


/* ====== 분류페이지 추천상품4열코드 ====== */

.prd-item-list4 { zoom: 1; overflow: hidden; clear: both; }
.prd-item-list4:after { content: ""; clear: both; display: block; }
.prd-item-list4 .item { float: left; width: 325px; /* text-align: center; */ padding-bottom: 20px ;}
.prd-item-list4 .item .item_box { width: 310px; margin: 0 auto;  background-color: #fff; border:10px solid #fff;  box-shadow: 0px 15px 35px rgba(50,50,90,0.1), 0px 5px 15px rgba(0,0,0,0.07); box-sizing: border-box; position: relative; }
.prd-item-list4 .item .item_box .thumb { margin: 0 auto; width:300px; height: auto;   position: relative;  }
.prd-item-list4 .item .item_box .thumb img { width:290px; height: auto; }
.prd-item-list4 .item .item_box .info { width: 100%; margin:0 auto; text-align:left; }
.prd-item-list4 .item .item_box .info li { padding:5px 0; }
.prd-item-list4 .item .item_box .info .name {padding-bottom: 5px; text-align:left; font-size:12px; color: #555;  font-weight:bold; border-bottom:1px solid #F0F0F0; }
.prd-item-list4 .item .item_box .info .subname { color: #c30000; font-size:12px; }
.prd-item-list4 .item .item_box .info .color { padding-top: 10px; }
.prd-item-list4 .item .item_box .info .icon { margin-top: 10px; }
.prd-item-list4 .item .item_box .info .price01 { font-weight:none; color:#999; padding-right:10px; text-decoration:line-through; }
.prd-item-list4 .item .item_box .info .price02 { font-weight:none; color:#555; }

.item .item_box .besttit { position:absolute; top:0px; left:0px;  opacity: 1; filter: alpha(opacity=100); /* For IE8 and earlier */  z-index:1; }
.item .item_box .besttit .box { padding:5px 10px; background-color:#000; color:#F4F4F4;  font-size:11px; letter-spacing:-0.5px; font-weight:bold; }
.item .item_box:hover .besttit .box {background-color:#000; border:0px solid #000; color:#fff; }


#prdBrand { position: relative; width:1350px;  margin:0 auto;  }


/* BASIC css end */