@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:white;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: white;}
header{font-family: ArialMT;align-items: center;display: flex;padding: 0 70px;box-sizing: border-box;
    height: 50px;line-height: 50px;background: black;position: relative;font-size: 22px;}
.logo a{color:black;background-color: #fdc401;font-family: Algerian;width: 130px;display: inline-block;
    font-size: 40px;height: 50px;line-height: 50px;text-align: center;position: absolute;top:18px;left:45%;}
.nav{width: 70%;font-size: 22px;}
.nav li{width: 30%;text-align: center;}
.fav a{margin-top:10px;height:25px;line-height:25px;color: #fdc401;
    border: 6px solid #fdc401;border-left: none;border-right:none;}
.fav{margin-right:60px;}
.banner{width: 100%;}
.logo{display: none;}
.banner img{width: 100%;vertical-align: middle;}
.Kon{margin-left: 124px;}
.W_title{font-size: 30px;font-family: Impact;display: flex;justify-content: space-between;}
.WHY{padding: 0 0 30px 20px;box-sizing: border-box;}
.W_wrap{display: flex;justify-content: space-between;}
.W_title p{margin: 20px 0 30px 0;}
.W_wrap li{font-size:18px;display: flex;width: 18%;height: 70px;padding: 10px;
    box-sizing: border-box;align-items: center;text-align: center;}
.W_wrap li:nth-child(even){background-color: #fdc401;border: solid 1px #060606;}
.W_wrap li:nth-child(odd){background-color: #060606;border: solid 1px #fdc401;color: white;}
.product,.Versand,.FAQ,.other{margin-bottom:40px;padding: 50px 20px;box-sizing: border-box;background: black;position: relative;}
.p_wrap,.F_wrap{display: flex;background: url("../images/product_bg.png") no-repeat;background-size:100% 100%;
    padding: 100px 20px;box-sizing: border-box;}
.p_left{width: 60%;display: flex;justify-content: space-between;padding: 12px;box-sizing: border-box;}
.p_big{width: 80%;height: 403px;overflow: hidden;}
.p_big img,.p_sm img{width: 100%;border: solid 4px #fdc401;box-sizing: border-box;}
.p_sm{height:403px;overflow-y: scroll;width: 19%;display: flex;flex-direction: column;}
.p_sm a{margin-bottom: 3px;}
.p_right{width: 40%;padding: 0 0 0 15px;box-sizing: border-box;color: white;}
.p_right ul{margin-top: 20px;}
.p_right li{font-size:13px;display: flex;height: 49px;width: 100%;margin-bottom: 18px;align-items: center;}
.p_right li i{display: block;}
.p_right li span{font-weight: 600;display: block;font-size: 20px;color: #ffb901;}
.p_right li p{padding-left:10px;box-sizing: border-box;font-size: 14px;}
.p_title{font-family: Impact;	font-size: 22px;color: #ffb901;}
.buyNow div{color: black;width: 80%;font-family: Impact;font-size:24px;height: 44px;line-height: 44px;text-align: center;margin: auto;background-color: #fdc401;}
.title{box-sizing:border-box;font-size: 24px;font-family: Arial-BoldMT;color: #fdc401;background-color: #060606;
    position: absolute;left:40%;top:40px;
    border: solid 1px rgba(255, 255, 255, 0.5);width: 20%;text-align: center;height: 40px;line-height: 40px;}
.d_title,.G_title,.B_title{font-size: 24px;font-family: Arial-BoldMT;color: #fdc401;background-color: #060606;
    border: solid 1px rgba(255, 255, 255, 0.5);margin: auto;width: 22%;line-height: 40px;height: 40px;text-align: center;}
.d_wrap,.G_wrap{display: flex;margin-top: 40px;}
.d_left{display: none;}
.d_left,.G_right{width: 34%;}
.d_left img,.G_right img{width: 100%;    vertical-align: bottom;}
.d_right,.G_left{width: 66%;padding: 10px;box-sizing: border-box;
    background: #fff;margin-left: -1px;border: 20px solid #fdc401;}
.d_right{width: 100%;}
.Versand{margin-top: 40px;}
.V_wrap,.F_wrap{padding:75px 45px;box-sizing:border-box;display:block;background: url("../images/V_bg.png") no-repeat;background-size: 100% 100%;}
.V_wrap p{color: #fdc401;font-size: 14px;line-height: 27px;font-family: ArialMT;}
.V_wrap span{color: white;font-size: 16px;margin: 40px 0;display: inline-block;}
.V_wrap h4{font-size: 20px;font-weight: 600;color: #fdc401;}
.G_left{padding: 60px 20px;box-sizing: border-box;line-height: 27px;font-size: 14px;}
.F_wrap{color: #fdc401;background: url("../images/F_bg.png") no-repeat;background-size: 100% 100%;}
.F_wrap li{width: 100%;border-bottom: 1px dashed #fdc401;padding-bottom: 10px;box-sizing: border-box;}
.F_wrap p{font-size: 14px;font-family: ArialMT;}
.FAQ{margin-top: 50px;}
.F_wrap ul li p:first-child{display: flex;align-items: center;margin:10px 0 15px 0;}
.F_wrap ul li p span{margin-left: 10px;font-size: 22px;color: #fdc401;}
.B_wrap{background: black;padding: 10px;margin-top: 40px;}
.B_wrap img{width: 100%;border: 1px solid #fdc401;box-sizing: border-box;}
.o_wrap {margin-top: 40px;padding: 100px 30px;box-sizing: border-box;
    background: url("../images/o_bg.png") no-repeat;background-size: 100% 100%; min-height: 500px;}
.o_wrap li {width: 23%;margin: 5px 0 10px 13px;}
.o_wrap li img{width: 100%;margin-bottom: 10px;}
.o_wrap li span {padding: 5px 10px;box-sizing: border-box;background-color: #fdc401;display: block;
    border: solid 1px #060606;color: #060606;line-height: 15px;font-size: 12px;
    height: 80px;
    overflow: hidden;display: -webkit-box;text-overflow: ellipsis;
    -webkit-box-orient: vertical;-webkit-line-clamp:3;}
.other{margin-top: 60px;}
.o_title{width: 72%;left:15%;top: 76px;}
.o_wrap li:hover span{background-color: #060606;color: #fdc401;}
.description li{float: none;}
@media only screen and (max-width: 768px) {
    .container{width: 100%;}
    .W_wrap li img{width: 40%;}
    .W_wrap li p{font-size: 14px;}
    .W_wrap li{padding: 5px;}
    .p_big{height: 312px;}
    .p_sm{height: 312px;}
    .p_right{padding: 0;}
    .p_title{font-size: 14px;}
    .p_right ul{margin-top: 8px;}
    .o_title{width: 52%;left: 25%;}
    .d_title, .G_title, .B_title{width: 30%;}
    .G_left{    padding: 24px 20px;line-height: 22px;}
    .W_wrap li{margin-right: 10px;}
}
@media only screen and (max-width: 481px){
    .container{width: 100%;}
    header{padding: 0 10px;}
    .nav{font-size: 16px;display: flex;justify-content: space-between;}
    .W_title img,.G_right img{display: none;}
    .Kon{margin-left: 30px;}
    .fav{margin-right: 27px;}
    .WHY{    padding: 0 0 30px 10px;}
    .W_title{font-size: 20px;}
    .W_wrap li{display: block;}
    .W_wrap li p{font-size: 12px;}
    .p_wrap{display: block;}
    .p_left,.p_right,.G_left{width: 100%;}
    .p_big,.p_sm{height: 217px;}
    .V_wrap, .F_wrap,.o_wrap{background: none;}
    .p_right li span{font-size: 16px;}
    .d_title, .G_title, .B_title{width: 45%;font-size: 20px;}
    .d_wrap, .G_wrap{font-size: 12px;}
    .title{font-size: 20px;width: 33%;left: 33%;}
    .p_wrap, .F_wrap{padding: 67px 17px;}
    .V_wrap p{font-size: 12px;line-height: 20px;}
    .V_wrap, .F_wrap,.o_wrap{    padding: 0;}
    .G_left{font-size: 12px;}
    .title{top:24px;}
    .product, .Versand, .FAQ{padding: 88px 20px 10px 20px;}
    .V_wrap span{margin: 12px 0;}
    .F_wrap ul li p span{font-size: 16px;}
    .F_wrap p{font-size: 12px;}
    .o_title{font-size: 18px;width: 80%;left:10%;}
    .o_wrap li{width: 46%;    margin: 5px 0 10px 8px;}
    .other{padding: 50px 10px 0 10px;}
}