@charset "utf-8";

/*======== visualWrap ========*/
.visualWrap {
    width:100%;
    color:#2b2b2b;
    border-bottom:1px solid #dfdfdf;
    overflow:hidden;
    background:#f9f6f4;
    position:relative;
}


/*----- slide area -----*/
.slideArea {
    width:100%;
    height:500px;
}
.slideArea .box_slide a {
    max-width:1350px;
    width:100%;
    height:500px;
    text-align:center;
}
.slideArea .box_slide a img {
    width:100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.slideArea .slick-arrow {
    width:30px;
    height:70px;
    text-indent:-9999px;
    overflow:hidden;
    border:none;
    background:transparent url(../images/btn/btn_slide.png) center center no-repeat;
    background-size:contain;
    position:absolute;
    top:50%;
    margin-top:-50px;
    z-index:5;
}
.slideArea .slick-arrow.slick-prev  {
    left:30px;
    transform:rotate(180deg);
}
.slideArea .slick-arrow.slick-next  {
    right:30px;
}
.slick-dots {
    display:flex;
    max-width:1200px;
    width:100%;
    height:50px;
    background:#fff;
    position:absolute;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
}
.slick-dots li{
    width:25%;
    font-size:15px;
    font-weight:300;
    text-align:center;
    line-height:50px;
    cursor:pointer;
}
.slick-dots li.slick-active a {
    color:#fb503c;
    background:#f0f0f0;
}
.slick-dots li:hover a {
    color:#fb503c;
}



/*----- media -----*/
@media (max-width: 1200px) {
    .slick-dots {
        max-width:1200px;
        width:100%;
    }
}
@media (max-width: 1024px) {
    .slideArea {
        height:290px;
    }
    .slideArea .box_slide a {
        height:290px;
        background-size:cover;
    }
    .slideArea .box_slide p {
        font-size:30px;
        left:10%;
    }
}
@media (max-width: 768px) {
    .slideArea .box_slide a {
        background-position:center right;
        background-size:contain;
    }
    .slideArea .box_slide p {
        width:50%;
        font-size:25px;
        transform: translateY(-40%);
    }
    .slick-dots li {
        width:50%;
        font-size:13px;
    }
}
@media (max-width: 480px) {
    .slideArea {
        height:220px;
    }
    .slideArea .box_slide a {
        height:220px;
    }
    .slideArea .box_slide p {
        width:40%;
        font-size:18px;
        transform: translateY(-40%);
    }
    .slick-dots li {
        height:auto;
        line-height:2;
    }
    .slick-dots li a {
        width:100%;
        height:100%;
        word-wrap: break-word;
    }
    .slideArea .slick-arrow {
        width:20px;
        height:40px;
    }
    .slideArea .slick-arrow.slick-prev  {
        left:10px;
    }
    .slideArea .slick-arrow.slick-next  {
        right:10px;
    }
}


/*======== content common ========*/
#content > div {
    color:#2b2b2b;
    padding-top:70px;
}
#content > div h2 {
    width:1200px;
    height:58px;
    font-size:28px;
    font-weight:300;
    text-align:center;
    background:url(../images/bg/bg_title.png) bottom repeat-x;
    margin:0 auto 5px;
}
#content > div h2 span {
    font-weight:600;
}


/*----- media -----*/
@media (max-width: 768px) {
    #content > div h2 {
        font-size:22px;
    }
}


/*======== productWrap ========*/
.productWrap {
    width:1200px;
    margin:auto;
}
.list_product li {
    width:20%;
    color:#2c2c2c;
    font-size:15px;
    text-align:center;
    padding-top:25px;
}
.list_product strong {
    display:block;
    padding:10px 0;
    margin:0 5px;
    border-bottom:1px solid #dfdfdf;
}


/*----- media -----*/
@media (max-width: 1200px) {
    .productWrap,
    #content > div h2{
        max-width:1200px;
        width:100%;
        padding:0 10px;
    }
    .list_product li img {
        width:90%;
    }
}
@media (max-width: 1024px) {
    .list_product li {
        width:33.3333%;
    }
    .list_product li img {
        width:95%;
    }
}
@media (max-width: 768px) {
    #content > div {
        padding-top:40px;
    }

}
@media (max-width: 480px) {
    .list_product li {
        width:50%;
        font-size:13px;
    }

}


/*======== hotWrap ========*/
/*----- hot nav area -----*/
.hotNavArea {
    width:1200px;
    color:#f4e9ef;
    font-size:15px;
    font-weight:500;
    text-align:right;
    margin:30px auto;

}
.hotNavArea li {
    display:inline-block;
    border-left:1px solid #e5e5e5;
    padding:0 20px;
    cursor:pointer;
}
.hotNavArea li.select {
    color:#fb503c;
}
.hotNavArea li:first-of-type {
    border-left:none;
}
.hotNavArea li:last-of-type {
    padding:0 0 0 20px;
}


/*----- hot slide area -----*/
.hotSlideArea {
    width:100%;
    height:600px;
    background:#e5d8df;
    position:relative;
}
.hotSlideArea > li {
    width:100%;
    opacity:0;
    position:absolute;
    top:0;
    left:0;
}
.hotSlideArea > li.select {
    opacity:1;
}

.list_hot .product {
    width:33%;
    position:relative;
}
.list_hot .product a {
    padding:170px 0 50px;
}
.list_hot .product .img_desc {
    display:block;
    width:80%;
    margin:auto;
}
.list_hot .product .img_desc img {
    width:400px;

}
.list_hot .text_desc {
    color:#1b1b1b;
    position:absolute;
    top:55px;
    margin-left:50px;
}
.list_hot .text_desc::before {
    content:'';
    display:block;
    width:43px;
    height:3px;
    background:#fb503c;
    margin-bottom:4px;
}
.list_hot .text_desc strong {
    display:block;
    font-size:30px;
    font-weight:500;
}
.list_hot .text_desc span {
    font-size:18px;
    font-weight:300;
}


/*----- media -----*/
@media (max-width: 1920px) {
    .hotSlideArea {
        max-width:1920px;
        width:100%;
    }
}
@media (max-width: 1200px) {
    .hotNavArea,
    .hotSlideArea {
        max-width:1200px;
        width:100%;
    }
    .list_hot .text_desc {
        top:55px;
        left:50px;
    }
    .list_hot .text_desc strong {
        font-size:20px;
    }
    .list_hot .text_desc span {
        font-size:14px;
    }
}
@media (max-width: 1024px) {
    .hotNavArea {
        padding:0 10px;
    }
}
@media (max-width: 768px) {
    .hotSlideArea {
        padding:50px 0;
    }
    .hotNavArea {
        font-size:12px;
    }
    .hotNavArea .product {
        padding:0 10px;
    }
    .hotNavArea .product:last-of-type {
        padding:0 0 0 10px;
    }
    .list_hot .product a {
        padding:50px 0 30px;
    }
    .list_hot .text_desc {
        margin-left:-20px;
        top:25px;
    }
    .hotSlideArea {
        height:300px;
    }
    .list_hot .product .img_desc img {
        width:100%;
        padding-top:50px;
    }


}
@media (max-width: 480px) {
    .hotNavArea li {
        padding:0 5px;
    }
    .hotNavArea li:last-of-type {
        padding:0 0 0 5px;
    }
    .list_hot  {
        display:block;
    }
    .list_hot div a {
        padding:100px 0 30px;
    }
    .list_hot div {
        width:100%;
    }
    .list_hot div .img_desc {
        width:50%;
    }
    .list_hot .product .img_desc img {
        width:90%;
    }
    .hotSlideArea {
        height:400px;
    }
}



/*======== newWrap ========*/
#content .newWrap {
    width:100%;
    height:100%;
    background:#B8A4AF url(../images/bg/bg_video2.jpg) center center repeat;
    padding-top:50px;
    margin-top:70px;
}
#content .newWrap h2 {
    height:30px;
	Color:#ffffff;
    font-size:24px;
    text-align:left;
    background:none;
}


/*----- video area -----*/
.videoArea {
    width:1200px;
    margin:auto;
}
.videoArea > div {
    width:50%;
    padding:15px 35px;
}
.box_video {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0;
    margin: 0 auto;
    padding-bottom: 56.25%
}
.box_video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/*----- media -----*/
@media (max-width: 1200px) {
    .videoArea {
        max-width:1200px;
        width:100%;
        padding:0 10px;
    }
}
@media (max-width:1024px) {
    #content .newWrap {
        height:400px;
    }
        .videoArea > div {
        padding:40px 20px;
    }
    }
@media (max-width:768px) {
    #content .newWrap h2 {
        font-size:18px;
    }
    .videoArea > div {
        width:100%;
        padding:20px;
    }
    #content .newWrap {
        height:auto;
    }
}



/*======== bestWrap ========*/
.bestWrap {
    width:1200px;
    margin:auto;
}
.list_best li {
    width:25%;
    font-weight:500;
    text-align:center;
    padding-top:30px;
}
.list_best li strong {
    display:block;
    color:#3d3d3d;
    font-size:14px;
    border-bottom:1px solid #ededed;
    padding:20px 0;

}
.list_best .num_price {
    display:block;
    color:#5d5d5d;
    font-size:14px;
    text-decoration: line-through;
    padding:10px 0 5px;
}
.list_best .num_discount {
    color:#fb503c;
    font-size:18px;
}




/*----- media -----*/
@media (max-width: 1200px) {
    .bestWrap {
        max-width:1200px;
        width:100%;
        padding:0 10px;
    }
    .list_best li img {
        width:90%;
    }
}
@media (max-width: 1024px) {
    .list_best li {
        width:33.33333%;
    }
    .list_best li img {
        width:95%;
    }

}
@media (max-width: 768px) {


}
@media (max-width: 480px) {
    .list_best li {
        width:50%;
        font-size:13px;
    }
    .list_best li strong {
        font-size:13px;
    }

}



/*======== reviewWrap ========*/
.reviewWrap {
    width:1200px;
    margin:auto;
}
#content .reviewWrap h2 {
    font-size:24px;
    text-align:left;
    background:none;
}
#content .reviewWrap h2 img {
    margin-right:5px;
    vertical-align:middle;
}
.list_review li {
    width:33.33333%;
    padding:0 10px;
}
.list_review li img {
    width:100%;
}
.list_review strong {
    display:block;
    color:#222;
    font-size:16px;
    padding-top:15px;
}
.list_review p {
    width:90%;
    color:#494949;
    font-size:14px;
    line-height:20px;
    margin:5px 0 10px;
}
.list_review .text_name {
    color:#fb503c;
    font-size:14px;
}


/*----- media -----*/
@media (max-width: 1200px) {
    .reviewWrap {
        max-width:1200px;
        width:100%;
        padding:0 10px;
    }
}
@media (max-width: 768px) {
    #content .reviewWrap h2 {
        font-size:18px;
    }
}
@media (max-width: 480px) {
    .list_review li {
        width:100%;
        margin-bottom:20px;
    }
}


/*======== csWrap ========*/
.csWrap {
    width:1200px;
    border-top:1px solid #ededed;
    margin:70px auto 20px;
    padding:65px 0;
}


/*----- common -----*/
.csWrap > div {
    width:45%;
    height:180px;
    border-bottom:1px solid #ededed;
    padding-bottom:30px;

}
.csWrap > div:nth-of-type(2) {
    margin:0 2%;
}
.csWrap > div strong {
    display:block;
    color:#2b2b2b;
    font-size:20px;
    font-weight:600;
    margin-bottom:20px;
}
.csWrap .csArea,
    .csWrap .bankArea {
        width:25%;
        padding-top:20px;
    }

/*----- notice area -----*/
.noticeArea > strong {
    float:left;
}
.noticeArea .btn_more {
    color:#616161;
    font-size:16px;
    font-weight:600;
    float:right;
    border-bottom:2px solid #616161;
}
.noticeArea ul {
    clear:both;
    color:#565656;
    line-height:35px;
    font-weight:300;
}
.noticeArea ul p {
    display:inline-block;
    width:90%;
    font-size:15px;
    text-overflow:ellipsis;
    white-space:nowrap;
    word-wrap:normal;
    overflow:hidden;
}
.noticeArea ul span {
    font-size:13px;
}


/*----- media -----*/
@media (max-width: 1200px) {
    .csWrap {
        max-width:1200px;
        width:100%;
        padding:65px 10px;
    }
}
@media (max-width: 768px) {
    .csWrap {
        padding:35px 10px;
        margin:25px auto 20px
    }
    .csWrap  .noticeArea {
        width:100%;
    }
    .noticeArea ul p {
        width:70%;
    }
    .csWrap .csArea,
    .csWrap .bankArea {
        width:35%;
        padding-top:30px;
    }
}
@media (max-width: 480px) {
    .csWrap .csArea,
    .csWrap .bankArea {
        width: 100%;

    }
}

* {
  margin: 0;
  padding: 0;
}

body {
  margin: 1px;
}

.pop-layer .pop-container {
  padding: 1px 5px;
}

.pop-layer p.ctxt {
  color: #666;
  line-height: 25px;
}

.pop-layer .btn-r {
  width: 100%;
  margin: 10px 0 10px;
  padding-top: 10px;
  border-top: 1px solid #DDD;
  text-align: right;
  font-size: 13px;

}

.pop-layer {
  display: none;
  position: absolute;
  top: 60%;
  left: 50%;
  width: auto;
  height: auto;
  background-color: #fff;
  border: 5px solid #3571B5;
  z-index: 10;
}
@media (max-width: 768px) {

	.pop-layer {
	  display: none;
	  position: absolute;
	  top: 60%;
	  left: 50%;
	  width: 350px;
	  height: auto;
	  background-color: #fff;
	  border: 5px solid #3571B5;
	  z-index: 10;
	}
	.pop-layer img{
		width:90%;
	}
 
}
.dim-layer {
  display: none;
  position: fixed;
  _position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.dim-layer .dimBg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .5;
  filter: alpha(opacity=50);
}

.dim-layer .pop-layer {
  display: block;
}

a.btn-layerClose {
  display: inline-block;
  height: 25px;
  padding: 0 14px 0;
  border: 1px solid #304a8a;
  background-color: #3f5a9d;
  font-size: 13px;
  color: #fff;
  line-height: 25px;
}

a.btn-layerClose:hover {
  border: 1px solid #091940;
  background-color: #1f326a;
  color: #fff;
}