@charset "utf-8";
/* CSS Document */
.index_title{margin:auto; margin-top:50px;width:95%; height:auto; overflow:hidden;}
.tt{padding:10px;font-size:28px;position: relative;text-align: center; font-weight: bold;}
.tt span{color:#000;}
.tl{ margin:auto; width:100px;height:1px;background: #ededed;}
.tc{ margin-top: 15px; text-align: center; color: #666;}

.center_title{margin:auto; margin-top:30px;width:95%; height:auto; overflow:hidden;}

#main{clear:both;margin:auto;padding:0; width:95%;height:auto!important;min-height:100px;max-height:none;overflow:hidden;display: flex;}

#main_center{flex:1; margin:0;padding:0;margin-left: 50px;}

#center_title{margin-top:10px;height:30px;text-transform: uppercase; }

#center_content{margin-top:50px;width:100%;clear:both;height:auto;overflow:hidden;}

#product_pic{float:left;margin:0; padding:0;width:40%;height:auto;overflow:hidden;position: relative;}
.show_pic{margin:0;padding:0;width:100%;height:auto;text-align:center;cursor:pointer;overflow:hidden;}
.show_pic img{border:0;width:100%; border-radius: 3px;}
.pic_list{margin-top:10px;}
.pic_list img{ display:inline-block;width:50px;margin-right:10px; margin-bottom:10px;}

.show_pic_m{ height:auto;display:none;}
.slider_list{ z-index:9; }
.sw_pic{padding-bottom:100%;height:0px;overflow:hidden;background:no-repeat center center;background-size:contain;position:relative;} /*640:640*/
.show_share{ margin-top:10px; background: #f6f6f6; border-radius: 5px;}

.show_video{ position: absolute; z-index:9;width:100%;height:auto;display:none;}
.show_video video{width:100%;background:#000;}
.show_video .close_video{position: absolute;z-index:10; color:#CCC; font-size:20px; margin-top:10px; margin-left:-25px; cursor:pointer;}
.play_video{position: absolute;z-index:8; margin-top:0px; margin-left:30px;}
.play_video i{color:#000;font-size:50px; border:#FFF 2px solid;border-radius:50%;cursor:pointer; background:#fff;}

#product_info{float:left;margin:0; padding:0;width:60%;height:auto;;overflow:hidden;}
#product_info ul{ padding:0px  20px 0px 50px; height:auto;overflow:hidden;}
#product_info ul li{height: auto;}
#product_info li{display:block;margin-top:10px;}
#product_info img{vertical-align:middle;}
#product_info s{display:inline-block;}
#product_info i{font-style:normal;}
#product_info span{font-size:20px;font-weight:bolder;color:#000;}
#product_info #pro_name{font-size:1.2rem; font-weight: bold;}
#product_info #pro_title{height:25px; background:#B6B7B9;font-weight:bolder;}
#product_info #pro_bg{background:#F5F5F5;}
#product_info #pro_price{line-height:30px; color:#999; font-weight:bolder; font-size:13px}
#product_info #pro_order{ height: auto;}
#product_info #pro_order table{ width:100%;}
#product_info #pro_order td{ padding:5px;}
#product_info #pro_order .t{text-align:center; font-weight:bolder;}
#product_info #pro_order .i{width:200px;}
#product_info #pro_order .m_s{width:140px;border:0px;}
#product_info #pro_order .m_i{width:30px; height:30px;border:#CCC 1px solid; text-align:center; vertical-align: bottom;}
#product_info #pro_order .qdel,.qadd{cursor:pointer; font-size:14px;display:inline-block; height:30px; width:30px; line-height:30px; text-align:center; border:#CCC 1px solid;}
#product_info #pro_patch span{font-size:14px;font-weight:bolder;color:#fa0000;}
#product_info #order_submit{ margin-top:30px;cursor:pointer; background:#000; height:40px; text-align:center; width:300px; line-height:40px; color:#FFF; font-size:16px; border-radius:5px;}
#product_info #order_buy{ margin-top:30px;cursor:pointer; background:#e77817; height:40px; text-align:center; width:300px; line-height:40px; color:#FFF; font-size:16px; border-radius:5px;}
#product_info #order_buy img{ height: 25px; margin-right: 10px;}
#product_info .pro_download{ margin-top: 10px; color:#999; cursor: pointer;}
#product_info .pro_download i{color:#000;}

#product_info #pro_h1{ border-bottom:#ededed 1px solid;}
#product_info #pro_h1 h1{font-weight:normal; font-size:12px;}
#product_info #pro_content{ margin-top:20px; line-height:25px;}
#product_info #pro_color img{ border-radius:50%; width:20px;}

#product_info .selectmore{ height: auto;}
#product_info .selectmore span{display:inline-block; margin-top:5px;margin-right:5px; padding:3px 10px 3px 10px; font-size: 13px; font-weight: normal; border-radius: 3px;border:#eee 1px solid; background:#eee; cursor:pointer; }
#product_info .selectmore span:hover{border:#666 1px solid;}
#product_info .selectmore .on{border:#666 1px solid; background:#666; color: #fff; cursor:pointer;}

#product_info .pi{ margin-top:30px;text-transform: uppercase;font-size:12px;}
#product_info .pi i{color:#fa0000; font-size:14px; width:25px;}

.tags_list{ height:auto;overflow:hidden;}
.tags_list dl{display:inline-block; width:auto;padding:5px; background:#ededed; margin-right:10px; margin-top:10px;font-weight:normal;}
.tags_list dl:hover{color:#fff; background:#fa0000;}
.tags_list dl:hover a{color:#fff; background:#fa0000;}

.product_list{margin:auto;width:95%;height:auto;overflow:hidden;}
.product_list ul{display:block;float:left; margin:1%; width:13.6%;padding:0.5%;box-shadow:0 0 20px #fff;background: #fff;height:auto;overflow:hidden;}
.product_list ul:hover{box-shadow:0 0 20px #ccc; border-radius: 10px;}
.product_list .p_pic{padding-bottom:50%;padding-top:50%;height:0; overflow: hidden; display: flex; justify-content: center; align-items: center; background: #f6f6f6; border-radius: 3px;}
.product_list .p_pic img{width:100%;}
.product_list .p_info{margin:10px;height:20px;overflow:hidden; text-align:center;}
.product_list .p_infos {margin-top:0px;height:auto;overflow:hidden; text-align:center;color: #999;}
.product_list .p_infos span{color:#000; font-size:16px;}
.product_list .p_infos s{color:#999;}


#center_titles{ clear:both;margin:auto; margin-top:30px;width:100%;height:30px;overflow:hidden; border-bottom:#f1f1f1 1px solid; text-align:center;}
#center_titles span{position:absolute;display:inline-block;padding:15px 20px 15px 20px;width:160px;margin-left:-100px;background:#FFF; font-size:1.5rem; z-index:9;}

#center_contents{margin-top:20px;clear:both;height:auto;overflow:hidden;padding:10px;}
#center_contents .data-table{width:100%;border-left:#E6E6E6 solid 1px;border-top:#E6E6E6 solid 1px;border-collapse:collapse;}
#center_contents .data-table th,td{padding-top:5px;padding-bottom:5px;padding-left:10px;line-height:20px;border-right:#E6E6E6 solid 1px;border-bottom:#E6E6E6 solid 1px;}
#center_contents .data-table .label{ background:#f5f5f5;}

.stitle{height:40px; border-bottom:#ededed 1px solid; height:auto; overflow:hidden;}
.stitle li{margin-right:10px;display:inline-block; padding:0px 20px 0px 20px; width: auto; height:40px; line-height:40px; background:#ededed; text-align:center;cursor:pointer;}
.stitle .on{background:#883c92; color:#FFF;border-top-left-radius:5px;border-top-right-radius:5px;}
.scontent{clear:both;margin-top:20px;font-size:16px;line-height:30px;height:auto; overflow:hidden; display:none;}

.h1{font-weight:normal;font-size:20px;}
.content{ font-size:14px; line-height:28px;}
.content{font-size:14px; line-height:28px;}
.content a{font-size:14px;}
.content img{ max-width:100%; height:auto;}
.content table{width:100%;border-left:#E6E6E6 solid 1px;border-top:#E6E6E6 solid 1px;border-collapse:collapse;}
.content table th,td{padding-top:5px;padding-bottom:5px;padding-left:10px;line-height:28px;border-right:#E6E6E6 solid 1px;border-bottom:#E6E6E6 solid 1px;}


#main_left{margin:0; margin-top:0px;padding:0; width: 300px; height:auto;overflow:hidden;order: -1; }
#left_title{line-height:40px;color:#000;font-weight:normal;text-transform: capitalize;font-size:20px;}
#left_title a{font-size:16px;color:#000;text-transform: uppercase; }
#left_list{margin:auto; margin-top:30px;width:95%;}
#left_list .c{padding:15px;background: #f5f5f5; margin-bottom: 10px; border-left: #883c92 5px solid; border-top-left-radius: 5px;border-bottom-left-radius: 5px;}
#left_list .c a{display:block; font-size:16px;color:#000;}
#left_list .c:hover{ background:#f1f1f1;}
#left_list .s{position:absolute;margin-left:198px;margin-top:-25px;width:789px;height:auto; overflow:hidden;z-index:99999999999999;background:#FFF;border:#f1f1f1 1px solid;display:none;}
#left_list .c_s{ margin-left:20px;padding:10px;}
#left_list .c_s_s{position:absolute;margin-left:204px;margin-top:-20px;width:788px;height:auto; overflow:hidden;z-index:99999999999999;background:#f1f1f1;border:#f1f1f1 1px solid;display:none;}
#left_list .c_s_n{display:inline-block; margin-left:5px;height:25px;line-height:25px;width:145px; text-align: center; overflow:hidden;}
#left_list .c_s_n a{font-weight:normal;}
#left_list .c_s::before{content:"";display: inline-block; width: 15px; height: 15px; border-radius: 50%; margin-top:0px; margin-right: 10px; vertical-align: middle;background:#fff; border: #ccc 1px solid; background-size: cover;}
#left_list .Grey::before{background:Grey;}
#left_list .Beige::before{background:Beige;}
#left_list .Brown::before{background:#755638;}
#left_list .Black::before{background:Black;}
#left_list .Red::before{background:red;}
#left_list .Mul-color::before{background: linear-gradient(Grey, transparent), linear-gradient(-45deg, #755638, transparent), linear-gradient(45deg, red, transparent);}
#left_list .c_s a:hover{ color: #999;}
#left_list .c_s:hover::before{background:#fcc929;border: #fcc929 1px solid;}

#left_list .c_s_on{ margin-left:20px; padding:10px;}
#left_list .c_s_on::before{content:"";display: inline-block; width: 15px; height: 15px; border-radius: 50%; margin-top:0px; margin-right: 10px; vertical-align: middle;background:#ccc; border: #ccc 1px solid;}
#left_list .c_s_on a:hover{ color: #999;}
#left_list .c_s_on:hover::before{background:#fcc929;border: #fcc929 1px solid; }

.main_bg{background:url(../images/index_about_bg.png) no-repeat; background-size: cover; height:auto; overflow:hidden;}

.center_feedback{margin:auto;padding:0; margin-top:50px; margin-bottom:50px;width:95%;}
.center_feedback .fe_list{clear:both;margin-top:20px;display: flex; justify-content: center;align-items: center;}
.center_feedback .fe_list ul{display:block;float:left;height:auto;overflow:hidden; flex:1;}
.center_feedback .fe_list #ft{font-weight:bolder;}
.center_feedback .fe_list #ft span{ color:#fa0000;}
.center_feedback .fe_list #fi{ margin-top:10px;width:100%;}
.center_feedback .fe_list #fi .i{ width:calc(100% - 10px); height:30px;border:#ccc 1px solid;}
.center_feedback .fe_list #fi .s{ width:calc(100% - 10px); height:33px;border:#ccc 1px solid;}
.center_feedback .fe_list #fe_line{display:block;float:left;width:20px; height:25px;}

.center_feedback .fe_content{ clear:both;margin-top:50px;height:auto; overflow:hidden;}
.center_feedback .fe_content #ft{font-weight:bolder;}
.center_feedback .fe_content #ft span{ color:#fa0000;}
.center_feedback .fe_content #fi{margin-top:10px;}
.center_feedback .fe_content #fi .t{width:calc(100% - 10px); height:80px;border:#ccc 1px solid;}

.center_feedback .fe_button{ margin-top:30px;text-align:center;}
.center_feedback .fe_button .b{padding:5px 15px 5px 15px;border:none; width:150px;height:45px;text-align:center; background:#000;color:#fff;cursor:pointer;border-radius:5px;}


.pr_list{margin:0px 0px 30px 0px;}
.pr_list li{list-style-type:disc; padding:5px 0px 5px 0px;}
.pr_list li a{color:#666;}


.video_list{margin:auto; margin-top:30px;margin-bottom:50px;width:100%; height:auto; overflow:hidden;}
.video_list ul{display:block;float:left; margin:1%; width:22%;padding:0.5%;box-shadow:0 0 20px #fff;background: #fff;height:auto;overflow:hidden;border-radius: 10px;}
.video_list ul:hover{box-shadow:0 0 20px #ccc; border-radius: 10px;}
.video_list .p{padding-bottom:88%;padding-top:88%;height:0; overflow: hidden; background:#ededed no-repeat center center;background-size:contain;display: flex; justify-content: center; align-items: center;  border-radius: 3px;}
.video_list .p i{ font-size: 50px; color: rgb(255, 255, 255,0.5);}
.video_list .n{ margin: 10px; line-height: 25px; height: 25px;}

@media screen and (max-width: 750px) {
.tt{ font-size: 16px;}

.center_title{ display: none;}

#main{width:100%; margin-top:0px;display: block;}
#main_center{width:100%; margin: 0px;}
#main_left{width:100%;}
#left_title{display:none;}
#left_list{ margin-top:30px; margin-bottom:20px;width:100%;width:100%;}
#left_list .c{padding:10px 15px 10px 0px; text-align:center; background:#f1f1f1; border-bottom:#FFF 1px solid;}
#left_list .c a{display:block; font-size:16px;}

#center_content{ margin-top: 0px;}
.show_pic{display:none;}
.pic_list{display:none;}
.show_pic_m{ display:block;}
.show_banner{ display:none;}


#product_pic{float:none;margin:auto;width:100%;}
#product_info ul{ padding:0px  20px 0px 20px;}
#product_info{width:100%;}
#product_info #order_submit{ width:auto;}
#product_info #order_buy{ width:auto;}

.product_list{ width: 100%;}
.product_list ul{width:46%; padding:2%; margin: 0px; border-bottom:#f2f2f2 20px solid;box-shadow:none;}
.product_list ul:hover{box-shadow:none; border-radius: 0px;}
.product_list .p_cart{margin:10px 10px 0px 10px; background:#000; height:35px; line-height:35px;color:#FFF; text-align:center; z-index:9999; display:block;}
.product_list .p_cart a{color:#FFF; font-size:12px;}


#center_contents{padding:0px;}
#center_contents img{width:100%; height:auto;}


.stitle{width:100%; height:auto;overflow:hidden;}
.stitle ul{display: flex;overflow-x: scroll;}
.stitle li{flex-shrink:0;padding:0px 10px 0px 10px; width: auto; height:40px; line-height:40px;cursor:pointer; text-align:center; }
.scontent{ margin:10px;}

.h1{font-size:16px;}
.content{ margin-top:20px;font-size:12px; line-height:20px;}
.content a{font-size:12px;}
.content img{ max-width:640px; height:auto;}

.video_list{ width:auto;}
.video_list ul{width:48%; padding:0.5%; margin: 0px; border-bottom:#f2f2f2 20px solid;box-shadow:none; border-radius: 0px;}
.video_list ul:hover{box-shadow:none; border-radius: 0px;}
.video_list .n{ margin: 10px; line-height: 25px; height: 50px;}
}