/* BASIC css start */
.content_box {clear:both; overflow: hidden;}
.content_box img {width:100%;}
.content_box a {display:block;}

.content_box.col2_box {padding:0 28px 40px; overflow:hidden;}

.col2{float:left; width:100%;}
.col2 a{display:block; margin:0 16px;}
.col2 p, .col2 h3{min-height:64px; padding:8px 0; font-size:14px;}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin:0 !important;}
.detail-pagination{padding-top:6px;}
.swiper-container img {width:100%;}
.swiper-pagination {width:100%;}
.swiper-pagination .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: none !important;
    outline:none;
    opacity:1;
    transition: width 0.3s;
}
.swiper-pagination .swiper-pagination-bullet:after {
    content: "";
    width: 6px;
    height: 6px;
    margin: 3px;
    display: block;
    border-radius: 10px;
    background-color: rgb(255 255 255);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
    border: #ccc solid 1px;
    box-sizing: border-box;
transition: width 0.3s;
}
.swiper-pagination .swiper-pagination-bullet-active {
    width: 27px;
    height: 12px;
    background: none !important;
    outline:none;
    opacity:1;
    transition: width 0.3s;
}
.swiper-pagination .swiper-pagination-bullet-active:after {
    content: "";
    width: 20px;
    height: 6px;
    margin: 3px;
    display: block;
    border-radius: 10px;
    background-color: rgb(255 255 255);
    box-shadow: 0px 1px 2px rgba(0,0,0,0.1);
    border: #ccc solid 1px;
    box-sizing: border-box;   
}
.btn_slider_next {
    position: absolute;
    top: 50%;
    width: 20px;
    height: 32px;
    padding:4px 10px;
    margin-top: -20px;
    z-index: 10;
    cursor: pointer;
    right: 0;
    left: auto;
    text-align:center;
    outline:none;
}
.btn_slider_prev {
    position: absolute;
    top: 50%;
    width: 20px;
    height: 32px;
    padding:4px 10px;
    margin-top: -20px;
    z-index: 10;
    cursor: pointer;
    left: 0;
    right: auto;
    outline:none;
}
.btn_slider_prev img, .btn_slider_next img {width:100%;}
.multi-slider-pagination {padding-top:6px;}

.collection_title {
    margin: 0px auto 10px;
    background: #FFF;
    position: relative;
    text-align: center;
    border-top: 1px #eee solid;
    border-bottom: 0px #eee solid;
    padding-top: 20px;    
    text-align:left;
}

.collection_title h1{
    display: inline-block;
    margin: 16px 0 4px 16px;
    font-size: 18px;
    font-weight: bold;
}
.collection_subtitle{    
    overflow: hidden;
    margin: 0 16px 20px 16px;
}

.collection_subtitle p{
    display: inline-block;
    overflow: hidden;
    height: 20px;
    margin: 0 10px 0 0;
    line-height: 20px;
    color: #666;
    font-size: 12px;
    font-weight: normal;
}
.collection_subtitle p.on{
    color: #000;
    font-weight: bold;
    border-bottom: 1px solid #000;
}

@media screen and (min-width: 768px) {
  .content_box {padding:0 11px;}
  .col2{width:50%;}
  .col2 a{margin:0 5px;}
}
@media screen and (min-width: 960px) {
  .content_box {padding:0 11px;}
  .col2{width:33.3333%;}
  .col2 a{margin:0 5px;}
}
@media screen and (min-width: 1200px) {
  .content_box {padding:0 11px;}
  .col2{width:25%;}
  .col2 a{margin:0 5px;}
}
/* BASIC css end */

