@charset "utf-8";


.productstj .title {
    text-align: left;border-bottom:1px solid #f5f5f5; width:100%;position:relative; padding-top:0
}
.productstj .title h9{ font-size:24px; font-weight: 100; padding-bottom: .5rem;  height:32px; line-height:32px;  }
.productstj .title .width50new span{border-bottom:1px solid #986749; width:100px; clear:both; position:absolute; bottom:0; left:0;}


ul li{
	list-style-type: none;
}
.designcon{ padding-bottom:3rem;}
.designcon img { width:100%}
#owl-pagectrl .owl-controls{ position:relative;}

#owl-pagectrl .owl-controls .owl-buttons .owl-prev{ position:absolute; left:-50px; top:-320px; background:url('/villis/static/img/prev_arr.png') no-repeat center center; width:40px; height:40px;font-size:0;  }
#owl-pagectrl .owl-controls .owl-buttons .owl-next{ position:absolute; right:-50px; top:-320px; background:url('/villis/static/img/next_arr.png') no-repeat center center;width:40px; height:40px; font-size:0;}

#owl-pagectrl .owl-controls .owl-buttons .owl-prev a{ width:40px; height:40px;font-size:0; display:block  }

#owl-pagectrl .owl-controls .owl-buttons .owl-next a{ width:40px; height:40px; font-size:0; display:block}

#owl-pagectrl .owl-controls .owl-buttons div{  border-radius: none;
    -moz-border-radius: none;
    border-radius:none }

#owl-demo4 .owl-controls{ position:relative;}

#owl-demo4 .owl-controls .owl-buttons .owl-prev{ position:absolute; left:-50px; top:-320px; background:url('/villis/static/img/prev_arr.png') no-repeat center center; width:40px; height:40px;font-size:0;  }
#owl-demo4 .owl-controls .owl-buttons .owl-next{ position:absolute; right:-50px; top:-320px; background:url('/villis/static/img/next_arr.png') no-repeat center center;width:40px; height:40px; font-size:0;}

.owl-theme .owl-controls .owl-buttons div{  border-radius: none;
    -moz-border-radius: none;
    border-radius:none }
.related{ clear:both; margin-top:20px;}
.related li{/* width:calc(100%/4 - 16px);*/ margin-right:5px; background:#f5f5f5; float:left; display:inline-table; text-align:justify;
 text-align-last:justify;
/* min-width:310px; min-height:310px;
*/}
.related li img{ width:100%}
.buy { color: #fff;background: #a6845f;
    font-size:16px;
    border-radius: 100px;
    /* padding: 2px 10px; */
	text-align:center;
    height: 35px;
    line-height: 35px;
    margin-top: 3px;display: inline-block;
    width: 35px; overflow:hidden; margin-left:4px; }
.buy:hover{color: #fff; background: #b9966f;
    
    border-radius: 100px;
    /* padding: 2px 10px; */
    height: 35px;
    line-height: 35px;
    margin-top: 3px;display: inline-block;
    min-width: 75px;	text-align:center;padding:0 8px;

    width: auto;}

.products-box{}
.products{ min-height:500px; padding:3rem 0;}
.profile-list{min-height:600px;}
.mt-tabpage {
	width: 500px;
	background-color: #FFFFFF;
	float:right;
}
.mt-tabpage-title {
	height: 44px;
	background-color: #fff;
	width: 100%;
	margin: auto;
	background: #fff;
	border-bottom: 1px solid #f1f1f1;
}
.mt-tabpage-title .mt-tabpage-item {
	display: inline-block;
min-width: 75px;
width:auto; margin-right:8px; height: 44px;
	line-height: 44px;
	text-align: center;
	color: #666;
	font-size: 12px;
}
.mt-tabpage-title .mt-tabpage-item:hover{
	/*color: #a6845f;*/
}
.mt-tabpage-title .mt-tabpage-item-cur {
	color: #a6845f;
	font-size: 14px;
	border-bottom: 1px solid #a6845f;
}
.mt-tabpage-count {
	position: relative;
	width: 500px;
	height: 500px;
     overflow-x:hidden;
}

.mt-tabpage-counttext{	position: relative;
	width: 500px;
	height: 500px;
     max-height: 500px;
    min-height: 500px;
 overflow-y:auto;
     overflow-x: hidden;

}
.mt-tabpage-counttext::-webkit-scrollbar {/*滚动条整体样式*/
width: 6px;     /*高宽分别对应横竖滚动条的尺寸*/
}
.mt-tabpage-counttext::-webkit-scrollbar-track {/*滚动条里面轨道*/
        background: #f5f5f5;
    }



.mt-tabpage-cont__wrap {
	position: absolute;
}
.mt-tabpage-count .mt-tabpage-item {
	width: 500px;
	height: 500px;
	line-height: 22px;
	text-align: left;

}
.protextbox{ padding-left:7rem; padding-top:4rem;}
.protitle h1{ font-family:ITCAvantGardeStd; font-weight:100; font-size:110px;    display: inline-block; }
.protitle span{font-family: "Noto Sans SC"; font-weight:100; font-size:40px;}
.subtitle{font-family: "Noto Sans SC"; font-weight:100; font-size:36px; padding:2rem 0;}
.procotext{ color:#848484; font-size:18px; line-height:26px;}

.probtn{ padding-top:1rem;}
.mbuy {
    color: #fff;
    font-weight: 100;
    text-decoration: none;
    width: 45px;
    height: 46px;
    text-align: center;
    line-height: 46px;
    background: #a6845f;
    border-radius: 100px;
    display: inline-block;
    float: left;
    margin-right: 10px;
	margin-bottom:10px;
}
.mbuy:hover { color:#fff; font-weight:bold; text-decoration:none; width:145px;  text-align:center; line-height:46px; height:46px; background:#b9966f; border-radius:100px; display:inline-block;}
.prodetail{ color:#a6845f; font-weight:100; text-decoration:none; border:2px solid #a6845f; background:#ffffff; text-align:center; width:145px; height:46px;line-height:46px; border-radius:100px; display:inline-block;}
.prodetail:hover { color:#fff; font-weight:bold; text-decoration:none; background:#a6845f;  text-align:center; width:145px; height:46px; line-height:46px;border-radius:100px; display:inline-block; cursor:pointer; }

.design-box .title {
    text-align: left;
    border-bottom: 1px solid #f5f5f5;
    width: 100%;
    position: relative;
    padding-top: 0;
}
.title h9 {
    font-size: 24px;
    font-weight: 400;
    padding-bottom: .5rem;
    height: 32px;
    line-height: 32px;
}

.design-box .title .width50new span {
    border-bottom: 1px solid #986749;
    width: 100px;
    clear: both;
    position: absolute;
    bottom: 0;
    left: 0;
}
.layui-tab {
    margin: 10px 0;
    text-align: left!important;
    max-width: 520px;
    float: right;
}




.layui-tab-content::-webkit-scrollbar {/*滚动条整体样式*/
width: 6px;     /*高宽分别对应横竖滚动条的尺寸*/
}
.layui-tab-content::-webkit-scrollbar-track {/*滚动条里面轨道*/
        background: #f5f5f5;
    }





/** iPad **/
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.protextbox {
    padding-left: 1rem;
    padding-top: 0rem;
}
.protitle h1 {
    font-family: ITCAvantGardeStd;
    font-weight: 100;
    font-size: 90px;
    display: inline-block;
}
.protitle span {
    font-family: "Noto Sans SC";
    font-weight: 100;
    font-size: 30px;
}
.subtitle {
    font-family: "Noto Sans SC";
    font-weight: 100;
    font-size: 26px;
    padding: .5rem 0;
}

.profile-list {
    min-height: 360px;
}
.mt-tabpage-count {
    position: relative;
    width: 300px;
    height: 300px;
    overflow-x: hidden;
}
.mt-tabpage-count .mt-tabpage-item {
    width: 300px;
    height: 300px; 
    line-height: 22px;
    text-align: left;
}
.mt-tabpage-counttext {
    position: relative;
    width: 300px;
    height: 300px;
    max-height: 300px;
    min-height: 300px;
    overflow-y: auto;
}
..mt-tabpage-counttext img{ width:100%}

#owl-demo4 .owl-controls .owl-buttons .owl-prev {
    top: -160px;
	    left: -10px;
	}
	

#owl-demo4 .owl-controls .owl-buttons .owl-next{
    top: -160px;
	    right: -10px;
	}	
	
#owl-pagectrl .owl-controls .owl-buttons .owl-prev{  top: -160px;
	    left: -10px;  }
#owl-pagectrl .owl-controls .owl-buttons .owl-next{ top: -160px;
	    right: -10px;}
	
	
.mt-tabpage {
    width: 100%;
    background-color: #FFFFFF;
    float: right;
}
.related li {
    width: calc(100%/2 - 0.5rem);
    margin-right:0.5rem ;
       margin-bottom: 0.5rem;
}
}


/** iPhone **/
@media only screen and (min-width: 320px) and (max-width: 767px) {


.profile-list .prodcutsbox .layui-tab .layui-tab-content {
    padding: 10px;
    min-height: 400px;
    max-height: 400px;
    overflow-y: auto;
}

.mt-tabpage-counttext {
    width: 355px;
  
}

.profile-list {
    padding-bottom: 1rem;
}
.designcon{ padding-bottom:1rem;}

.protextbox {
    padding-left:1.8rem;/*20200112 new modify*/
    padding-top: 0;
}

.prodcutsbox li img { width:100%}

.protitle h1 {
    font-family: ITCAvantGardeStd;
    font-weight: 100;
    font-size: 60px;
    display: inline-block;
}.protitle span {
    font-family: "Noto Sans SC";
    font-weight: 100;
    font-size: 22px;
}
.subtitle {
    font-family: "Noto Sans SC";
    font-weight: 100;
    font-size: 22px;
    padding: 0.5rem 0;
}
.procotext {
    color: #848484;
    font-size: 14px;
    line-height: 20px;
}
#owl-pagectrl .owl-controls .owl-buttons .owl-prev{ left:0px; top:-675px;  }
#owl-pagectrl .owl-controls .owl-buttons .owl-next{  right:0px; top:-675px;}

#owl-demo4 .owl-controls .owl-buttons .owl-prev{ left:0px; top:-480px;  }
#owl-demo4 .owl-controls .owl-buttons .owl-next{  right:0px; top:-480px;}

.products-box{}
.productstj {
    min-height: 400px;
    padding: 0;
}
.profile-list .prodcutsbox li {
    width: 100%;
}
.profile-list .prodcutsbox li ul li {
    width: auto;
}


.related li {
    width: calc(100%);
    margin-right: ;
       margin-bottom: 0.5rem;
}
#owl-demo4 .owl-controls .owl-buttons .owl-prev{  left:0px; }
#owl-demo4 .owl-controls .owl-buttons .owl-next{  right:0px; }
.mt-tabpage {
    width: 100%;
    float: right;
	clear:both;
}
}
