.banner {
    margin-bottom: 0;
}
.diy-all {
    margin-bottom: 100px;
    position: relative;
}
.diy-title {
    display: inline-block;
    top: -32px;
    position: relative;
    margin-bottom: 10px;
}
.diy-title a {
    color: #fff;
    display: block;
}
.diy-title > ul {
    font-size: 0;
}
.diy-title > ul > li {
    display: inline-block;
    background-color: #7f7f7f;
    font-size: 22px;
    width: 212px;
    height: 65px;
    line-height: 65px;
    text-align: center;
    transition: all .4s linear;
}
.diy-title > ul > li:hover,
.diy-title > ul > li.active {
    background-color: #cd0e18;
}
.diy-fac-title h1 {
    font-weight: normal;
    font-size: 28px;
    color: #191919;
}
.diy-fac-title p {
    color: #6d6d6d;
    font-size: 14px;
}
.div_left{width: 48%;display: inline-block;}
.diy-carousel {
	width:100%;
   
}
#imgId-img {
    width: 240px;
    height: 450px;
    margin: 0 auto;
}
.owl-theme .owl-dots .owl-dot span {
    width: 22px;
    height: 3px;
    margin: 5px 4px;
    background: #959595;
}
.owl-theme .owl-dots .owl-dot.active span {
    background: #cd0e18;
}
.owl-carousel .owl-item img {
    height: 400px;
}
.diy-price {
	position:relative;
    display: inline-block;
    background-color: #ebebeb;
    width: 100%;
    padding: 20px 20px 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /*Firefox3.5+*/
    -webkit-box-sizing: border-box; /*Safari3.2+*/
    -o-box-sizing: border-box; /*Opera9.6*/
    -ms-box-sizing: border-box; /*IE8*/
   padding-bottom:65px;
}
.service-btn{
	position:absolute;
	right:10px;
	bottom:10px;
}
.service-btn>div{
	width:130px;
	height:40px;
	line-height:40px;
	text-align:center;
	font-size:18px;
	color:#fff;
	display:inline-block;
	background:#e62129;
	border-radius:4px;
	cursor:pointer;
	transition: all .4s;
	-webkit-transition: all .4s;
}
.service-btn>div a{color:#fff;}
.service-btn>div img{margin-right:5px;}
.service-btn>div:hover{
	opacity:0.9;
	filter:alpha(opacity=90);
}
.diy-priceL {
    width: 100%;
    float:left;
    color: #797979;
    border-top: 1px solid #f2f2f2;
    padding-top: 10px;
}
.diy-priceL > ul > li {
    min-width: 100%;
    vertical-align: top;
    line-height: 1.6;
}
.diy-priceL > ul > li:nth-child(odd) {
    /*margin-right: 2%;*/
}
.diy-priceR {
    float: right;
    min-width: 39%;
}
.diy-price-title {
    color: #393838;
    font-size: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #dbdbdb;
}



#valBase,
#facAdded,
#valAll,
#baseParam {
    display: inline-block;
}
#valAll {
    color: #cd0e18;
    font-size: 24px;
}
#valAll span {
    font-size: 16px;
}


.priceW {
  
    display: inline-block;
}
.valAll-div .priceW {
   /*  letter-spacing: .8em; */
    /*overflow: hidden;*/
}
.diy-list-all {
    float: right;
    display: inline-block;
    width: 47%;
}
.row-title {
    color: #3e3e3e;
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dashed #a9a8a8;
}
.diy-list-row > ul {
    margin-bottom: 30px;
}

.diy-list-size-row > ul {
    /*margin-bottom: 37px;*/
    margin-bottom: 74px;
}
.diy-list-size-row > ul > li {
    min-width: 100%;
    display: inline-block;
}
.diy-list-row > ul > li {
    display: inline-block;
    cursor: pointer;
    vertical-align: top;
    margin-top: 4px;
    margin-bottom: 4px;
    transition: all .05s linear;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /*Firefox3.5+*/
    -webkit-box-sizing: border-box; /*Safari3.2+*/
    -o-box-sizing: border-box; /*Opera9.6*/
    -ms-box-sizing: border-box; /*IE8*/
}

.diy-list-row > ul > li.on {
    color: #cd0e18;
}
.option-desc > ul > li {
/*.option-desc > ul > li {*/
    display: none;
}
.diy-list-size-row {
    position: relative;
    padding-bottom: 20px;
}
.diy-list-size-row > ul > li .option-desc {
    display: none;
}
.diy-list-size-row > ul > li .fac-type {
    font-size: 16px;
    color: #363535;
    line-height: 1;
    margin-bottom: 10px;
}
.diy-list-size-row  > ul > li select {
    border: 1px solid #b2b2b2;
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    color: #494949;
    cursor: pointer;
}
.diy-list-size-row  > ul > li.on select {
    color: #333;
}
.option-desc {
    position: absolute;
    left: 0;
    top: 60%;
    color: #6a6a6a;
    font-size: 14px;
    line-height: 22px;
    width: 100%;
    cursor: auto;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /*Firefox3.5+*/
    -webkit-box-sizing: border-box; /*Safari3.2+*/
    -o-box-sizing: border-box; /*Opera9.6*/
    -ms-box-sizing: border-box; /*IE8*/
}
.option-desc ul li{
    padding: 8px 15px;
    border: 1px solid #c2c2c2;
}
.fac-type-en {
    display: none;
}

@media (min-width: 116em) {
   

}
@media (min-width: 100em) {

}
@media (max-width: 90em) {
    .diy-list-size-row {
        margin-bottom: 27px;
    }
    .diy-list-size-row > ul {
        /*margin-bottom: 36px;*/
    }  
}
@media (max-width: 74.9em) {

}
@media (max-width: 61.9em) {
    .diy-title {
        top: -26px;
    }

    .diy-title > ul > li {
        width: 180px;
        height: 50px;
        line-height: 50px;
        font-size: 18px;
    }
	.service-btn>div{
		width:120px;
		height:35px;
		line-height:35px;
		font-size:16px;
	}
	.service-btn>div img{
		height:18px;
		width:auto;
	}
}
@media (max-width: 47.9em) {
    .diy-carousel {
        width: 100%;
    }
    .diy-price {
        position: relative;
        width: 100%;
        top: auto;
    }
    .diy-list-all {
        display: inline-block;
        width: 100%;
        margin-bottom: 20px;
    }
    .diy-title > ul > li {
        width: 150px;
        height: 50px;
        line-height: 50px;
        font-size: 16px;
    }
    .diy-carousel {
        margin-top: 46px;
    }
    .row-title {
        font-size: 16px;
    }
    .div_left {
        margin-bottom: 26px;
        width: 100%;
    }
    #imgId-img {
        margin-bottom: 18px;
        height: auto;
    }
    .diy-all {
        margin-bottom: 36px;
    }
    .diy-list-size-row > ul {
        /*margin-bottom: 41px;*/
    }
    .diy-price-title {
        font-size: 17px;
    }
    .diy-priceL > ul > li ,
    .valAll-div .priceW {
        font-size: 15px;
    }
    #valAll {
        font-size: 22px;
    }
	.service-btn>div{
		width:120px;
		height:35px;
		line-height:35px;
		font-size:16px;
	}
}
@media (max-width: 33.9em) {
    .diy-list-size-row {
    }
    .diy-fac-title h1 {
        font-size: 22px;
    }
    .row-title {
        text-indent: .5em;
    }
    .diy-title {
        top: 0;
        margin-bottom: 20px;
    }
    .diy-title > ul > li {
        width: 100px;
        height: 30px;
        line-height: 30px;
        font-size: 14px;
    }
    .diy-fac-title {
        padding-left: .5em;
    }
    .diy-carousel {
        margin-top: 36px;
    }
    .diy-all {
        margin-bottom: 20px;
    }
	.service-btn>div{
		width:120px;
		height:35px;
		line-height:35px;
		font-size:14px;
		
	}
}

.diy-type-list-all {
    position: relative;
    opacity: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}
.diy-type-list {
    margin-top: -16px;
    margin-bottom: 40px;
    background: #ececec
}
.diy-type-list .swiper-container {
    width: 100%;
    height: 100%;
}
.diy-type-list .swiper-slide {
    text-align: center;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
    height: 53px;
}
.diy-type-list .active, .diy-type-list .swiper-slide:hover{
    background: #cd0e18
}
.diy-type-list .active a, .diy-type-list .swiper-slide:hover a {
    color: #fff;
}
.diy-img{
    width:46px;
    height: 46px;

    margin-right:10px;
    vertical-align:middle;
}
.diy-list-row > ul{
    font-size: 0;
}
.diy-list-row > ul > li{
    width:33.3333%;
    font-size: 0;
    vertical-align:middle;
	padding-right:20px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.extra-list-row > ul > li>div{
    display: inline-block;
    font-size: 14px;
    vertical-align:middle;
}
.diy-name{
    width: calc(100% - 65px);
    width: -moz-calc(100% - 65px);
    width: -webkit-calc(100% - 65px);
    vertical-align:middle;
}
.material-list-row > ul > li>div{
	font-size:14px;

}
.material-list-row .fac-type{
	margin-top:15px;
}
.material-list-row > ul > li{
	margin-bottom:20px;
}
.material-list-row > ul > li .diy-img{
	width:100%;
	margin-right:0
}
.material-list-row > ul > li .diy-name{
	width:100%;
}
.swiper-btn-prev,
.swiper-btn-next {
    position: absolute;
    display: none;
    z-index: 999;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-family: 'arrow';
    font-size: 16px;
    color: #fff;
    background-color: #9d9d9d;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    opacity: .7;
}
.swiper-btn-prev {
    left: -38px;
}
.swiper-btn-next {
    right: -38px;
}
.swiper-btn-prev:hover,
.swiper-btn-next:hover {
    opacity: 1;
}
@media (max-width: 74.9em){
	.swiper-btn-prev,
    .swiper-btn-next {
        opacity: .4;
    }
    .swiper-btn-prev {
        left: 3px;
    }
    .swiper-btn-next {
        right: 3px;
    }
    .swiper-btn-prev:hover,
    .swiper-btn-next:hover {
        opacity: .8;
    }

}

@media (max-width: 33.9em){
	.diy-type-list {
		margin-top: -6px;
		margin-bottom: 16px;
		background: #ececec;
	}
	.diy-type-list .swiper-slide {
        height: 40px;
    }
    .diy-type-list a {
        font-size: 14px;
    }
	.diy-fac-title {
		padding-left: 0em;
	}
	.diy-list-row > ul > li{
		width:50%;
	}
	.extra-list-row > ul > li>div{
		width:100%;
		margin-bottom:10px
	}
	
}