/* BASIC css start */
#container{background: #3e3e3e;}
#container #header{position: fixed;}
#gnb .hdBtm .swiper-container{ margin-bottom: 3px;}
#footer{margin-top:0 !important}
.list_shopping2x{ background: #3e3e3e;}
.more{ background: #3e3e3e;}
 
/*********************************
  메인 비쥬얼배너
*********************************/
#mainSpot {
  width:100%;
  position: relative;
}
#mainSpot .bx-wrapper {
  position: relative;
}
#mainSpot .bx-wrapper .bx-controls.bx-has-pager.bx-has-controls-direction.bx-has-controls-auto {
  text-align: center;
  width: 100%;
  height: 40px;
  bottom: 0px;
  position: absolute;
}
#mainSpot .bx-wrapper .bx-has-pager.bx-has-controls-direction {
    position: absolute;
    bottom: -24px;
    width: 94%;
    text-align: left;
    padding: 0 3%;
}
#mainSpot .bx-pager {
  height:7px;
  text-align:center;
  display: inline-block;
  vertical-align:middle;
}
#mainSpot .bx-pager .bx-pager-item {
  display:inline-block;
  margin:0 3px;
}
*:first-child+html #mainSpot .bx-pager .bx-pager-item {
  display:inline
} /* IE7 Hack */
#mainSpot .bx-pager .bx-pager-item a {
  display:block;
  width:7px;
  height:7px;
  text-indent:-9999em;
  background:#fff;
  border-radius:10px;
}
#mainSpot .bx-pager .bx-pager-item a.active {
  background:#ff7200;
}
#mainSpot .bx-controls-direction {
  display: none;
  /*display: inline-block;*/
  background: url('/design/idasoni/renewal/img/main_top_slide_arrow_bg.png');
  width: 62px;
  height: 24px;
  vertical-align:middle;
  margin-left:10px;
}
#mainSpot .bx-controls-direction a {
  text-indent:9999px;
}
#mainSpot .bx-controls-direction a.bx-prev {
  background: url('/design/idasoni/renewal/img/main_top_slide_arrow_prev.png');
  width: 31px;
  height: 24px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center;
}
#mainSpot .bx-controls-direction a.bx-next {
  background: url('/design/idasoni/renewal/img/main_top_slide_arrow_next.png');
  width: 31px;
  height: 24px;
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center;
}
#mainSpot .bx-controls-auto {
  display: inline-block;
  vertical-align: middle;
  background: url('/design/idasoni/renewal/img/main_top_slide_play_bg.png');
  width: 31px;
  height: 24px;
  margin-left: 10px;
}
#mainSpot .bx-controls-auto a.bx-start {
  text-indent: 999px;
  background: url(/design/idasoni/renewal/img/play.png);
  width: 31px;
  height: 24px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
}
#mainSpot .bx-controls-auto a.bx-stop {
  text-indent: 999px;
  background: url('/design/idasoni/renewal/img/pause.png');
  width: 31px;
  height: 24px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
}
#mainSpot .bx-controls-auto a.active {
  display:none;
}
#mainSpot .w100 {
  width:100%;
}





.main h3 {
    color:#fff;
    font-size: 24px;
    display: block;
    text-align: left;
    width: 93%;
    margin: 60px auto 20px;
    font-weight: 100;
}

.main h3 .bold {font-weight:500;}
.main h3 .subtitle {font-weight:100; color:#ddd; font-size:11px; margin-left:10px;}

.main .topBanner {margin-top:60px;}
.main .topBanner .topBannerc {
    width: 93%;
    margin: 0 auto 5px;
    position: relative;
}
.main .topBanner img {width:100%; vertical-align:top;}
.main .topBanner .topBannerTitle {width:100%; font-size:1.083em; font-weight:bold; padding:2px 0; background-color:rgba(0,0,0,0.4);; text-align:center; color:#fff; position:absolute; bottom:0; left:0;}

/* 동영상영역 */
.VideoArea{ width: 100%; margin: 50px auto ; background: url(http://codlab06.img15.kr/backspace/img/vedioback_m.jpg) no-repeat; background-size: 100%; }
.VideoArea .VideoBox{position: relative; padding: 65px 20px 0; }
.VideoArea .VideoBox .VideoTit{color: #454545; margin: 0 0 4px; font-size: .6rem;}
.VideoArea .VideoBox .VideoBox_in{position : relative; width : 100%; height : 0; padding-bottom : 56.25%; }
.VideoArea .VideoBox .VideoBox_in iframe{position : absolute; top : 0; left : 0; width : 100%; height : 100%;}

/* 브랜드테마관 */
.brand_wrap{}
.brand_wrap .brandBox{ width: 93%; margin: 0 auto;}
.brand_wrap .brandBox li{ margin: 0 0 5px;}
.brand_wrap .brandBox li a img{ width: 100%;}
.brand_wrap .brandBox .slick-dots{ position: absolute; top: -21px; right: 7px;}
.brand_wrap .brandBox .slick-dots li{ float: left; margin: 0 3px 0;}
.brand_wrap .brandBox .slick-dots li button { width: 7px; height: 7px; border: 0; border-radius: 50%; font-size: 0; background: #676767; outline: 0;}
.brand_wrap .brandBox .slick-dots li.slick-active button { background: #ff7102;}
/* BASIC css end */