@charset "utf-8";
/* CSS Document */
@charset "utf-8";
/* 全局 */
body,h1,h2,h3,h4,h5,h6,hr,p,pre,blockquote,dl,dd,ul,ol,th,td,form,fieldset,legend,button,input,textarea,img{margin:0;padding:0; border:none;}
h1,h2,h3,h4,h5,h6,button,input,textarea,select{font-size:100%;}
fieldset,img{border:0;}table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}ul{list-style:none;}
address,cite,code,dfn,var,em,th{font-style:normal;font-weight:normal;}
button,input,textarea{outline:none;font-family:inherit;}:focus{outline:0;}
body{font-family:Arial, Helvetica, sans-serif;}
textarea{overflow-x:hidden;overflow-y:auto;resize:none;}
a{color:black;text-decoration:none;display: block;}a:hover{text-decoration:none;}
i,em{font-style:normal;display: block;}
li{ float:left;}
/* 清浮动*/
.clearfix:after,.clearfix:before{content:"";display:table}
.clearfix:after{clear:both;overflow:hidden}
.clearfix{zoom:1}
.container{width: 960px;margin: 0 auto;background: #f9f4f4;}
header{font-family: ArialMT;align-items: center;display: flex;padding: 0 70px;box-sizing: border-box;
    height: 50px;line-height: 50px;}
.logo{font-size: 38px;display: none;}
.nav{width: 70%;margin-left: 50px;font-size: 22px;}
.nav li{width: 30%;text-align: center;}
.nav li:hover a{color: #d9b69f;}
.search{height: 20px;width: 20%;background: white;position: relative;border-radius: 5px;border: solid 1px #9d0407;}
.search img{position: absolute;right: 5px;top:2px;}
.banner{width: 100%;}
.banner img{width: 100%;vertical-align: middle;}
.nav li:hover{background: #9d0407;border-radius: 5px;color: white;}
.WHY{padding: 0 50px;box-sizing: border-box;}
.main{height:98px;background: #9d0407;color:white;display: flex;align-items: center;padding: 0 10px;box-sizing: border-box;}
.W_wrap li{display: flex;align-items: center;
    box-sizing: border-box;}
.W_title{width: 23%;font-size: 20px;height: 87px;text-align: center;padding-top: 20px;box-sizing: border-box;
    background: white;color: black;margin-top: -11px;}
.W_wrap{width: 73%;font-size: 12px;justify-content: center;}
.fr{margin: 0 14px;}
.W_wrap li{margin-left: 15px;}
.W_wrap li p{margin-left: 3px;text-align: center;}
.title{background: url("../images/title_bg.png") no-repeat center;height: 80px;line-height: 76px;
    text-align: center;color: white;font-size: 28px;margin: 20px 0;}
.product{padding: 16px 50px 20px 50px;box-sizing: border-box;}
.p_wrap{display: flex;background: #9d0407;padding: 17px;box-sizing: border-box;}
.p_left{width: 60%;display: flex;justify-content: space-between;background: #cf0408;padding: 12px;box-sizing: border-box;}
.p_big{width: 80%;height: 378px;overflow: hidden;}
.p_big img{width: 100%;}
.p_sm{height:378px;overflow-y: scroll;width: 19%;display: flex;flex-direction: column;
    justify-content: space-between;}
.p_sm a{margin-bottom: 3px;}
.p_sm img{width: 100%;}
.p_right{width: 40%;padding: 20px 0 0 15px;box-sizing: border-box;color: white;}
.p_right ul{padding: 15px;box-sizing: border-box;}
.p_right li{font-size:13px;display: flex;height: 49px;background: #000;width: 100%;margin-bottom: 10px;}
.p_right li i{display: block;padding:4px 20px;background: #cf0408;box-sizing: border-box;text-align: center;}
.p_right li span{font-weight: 600;display: block;font-size: 15px;}
.p_right li p{padding: 8px 0 0 15px;box-sizing: border-box;}
.p_title{	font-size: 14px;}
.buyNow div{color: white;background-image: linear-gradient(0deg,
#cf0408 0%,
#bc0b0f 52%,
#cf0408 100%),
linear-gradient(
        #69241e,
        #69241e);
    background-blend-mode: normal,
    normal;
    box-shadow: 3px 0px 1px 0px
    rgba(0, 0, 0, 0.17);
    border-radius: 5px;width: 50%;height: 30px;line-height: 30px;text-align: center;margin: auto;}
.description li{float: none;}
.description .d_wrap{    background: #cf0408;padding: 20px;box-sizing: border-box;}
.description .d_wrap .desMain{background: white;padding: 10px;box-sizing: border-box;}
.description,.versand,.Gewa,.FAQ,.Bewertung,.other{padding: 0 50px;}
.v_wrap,.G_wrap{display: flex;font-size: 14px;line-height: 27px;}
.v_left{width: 50%;background: #cf0408;color: white;box-shadow: 2px 0px 4px 0px
rgba(0, 0, 0, 0.39);padding: 20px;box-sizing: border-box; z-index: 2;}
.v_right{width: 50%;background: #9d0407;color: white;box-sizing: border-box;padding: 20px;}
.v_right h1{font-size: 20px;}
.v_left span{margin-top:20px;background: #9d0407;color: white;padding: 10px 15px;height: 34px;line-height: 34px;}
.G_wrap li:first-child{box-sizing:border-box;width: 60%;padding: 20px;line-height: 27px;font-size: 14px;background: #9d0407;color: white;}
.G_wrap li:last-child{width: 40%;margin-top: 16px;}
.G_wrap li:last-child img{width: 100%;}
.F_wrap{background: #9d0407;color: white;padding: 20px 10px;box-sizing: border-box;}
.F_wrap ul{width: 100%;display: flex;flex-wrap: wrap;line-height: 22px;}
.F_wrap ul li{width: 48%;background: #cf0408;padding: 10px;margin:0 0px 10px 10px;box-sizing: border-box;}
.F_wrap span{margin-bottom:20px;text-align: center;font-size: 20px;font-family: Arial-BoldMT;display: block;}
.F_wrap .bottom{padding: 0 11px;box-sizing: border-box;}
.bottom div{background: #cf0408;padding: 10px;box-sizing: border-box;}
.Bewertung img{width: 100%;}
.title1{font-size:20px;background: url("../images/o_tit.png") no-repeat center;background-size: 100% 100%;width: 70%;margin: 20px auto;}
.o_wrap {margin-top: 20px;padding: 20px 10px;box-sizing: border-box;background: #9d0407;}
.o_wrap li {width: 23%;margin: 5px 0 10px 13px;}
.o_wrap li img{width: 100%;vertical-align: middle;border: 1px solid #000;box-sizing: border-box;border-bottom: none;}
.o_wrap li span{    overflow: hidden;display: -webkit-box;text-overflow: ellipsis;
    -webkit-box-orient: vertical;-webkit-line-clamp:3;padding: 5px 10px;box-sizing: border-box;
    background: #7e0306;border:1px solid #000;color: white;height: 67px;
    line-height: 15px;font-size: 12px;}
.other{padding-bottom: 100px;}
@media only screen and (max-width:768px) {
    .container{width: 100%;}
    .p_big,.p_sm{height: 285px;}
    .p_right{padding: 0px 0 0 15px;}
    .p_right ul{padding: 0;}
    .p_right li p{padding: 3px 0 0 6px;}
    .p_right li,.p_right li span{font-size: 12px;}
    .v_left span{padding: 10px 2px; }
    .G_wrap li:last-child{margin-top: 100px;}
    .o_wrap li{width: 31%;    margin: 5px 0 10px 10px;}
    .WHY{padding: 0;}
    .W_wrap li{margin-left: 13px;}
}
@media only screen and (max-width:481px){
    .container{width: 100%;}
    .logo,.G_wrap img{display: none;}
    header{padding: 0 10px;height: 40px;}
    .nav{margin: 0;font-size: 16px;line-height: 20px;width: 80%;}
    .nav li{width: 32%;}
    .main{display: flex;flex-wrap: wrap;height: 120px;}
    .W_title{background: none;text-align: center;width: 100%;color: white;height: 53px;font-size: 16px;}
    .W_wrap{width: 100%;}
    .W_wrap li{display: flex;flex-direction: column;}
    .W_wrap li img{width: 90%;}
    .title{font-size: 18px;}
    .product{padding: 10px;display: block;}
    .p_wrap,.v_wrap{display: block;}
    .p_left,.p_right,.v_left,.v_right{width: 100%;}
    .p_big,.p_sm{height: 238px;}
    .p_title{margin: 10px 0;}
    .p_right ul{padding: 0 20px;}
    .p_right li{width: 95%;}
    .description, .versand, .Gewa, .FAQ, .Bewertung, .other{padding: 0 10px;box-sizing: border-box;}
    .d_wrap,.v_wrap{font-size: 12px;}
    .v_left,.v_right{padding: 10px;line-height: 22px;}
    .v_right h1{font-size: 16px;}
    .G_wrap{width: 100%;}
    .G_wrap li:first-child{width: 100%;padding: 10px;box-sizing: border-box;font-size: 12px;line-height: 22px;}
    .F_wrap ul li,.F_wrap .bottom{width: 100%;font-size: 12px;line-height: 18px;}
    .F_wrap span{font-size: 14px;margin-bottom: 4px;}
    .title1{background-size: 100%;}
    .o_wrap li{width: 46%;    margin: 5px 0 10px 8px;}
    .other{padding-bottom: 40px;}
}
