@charset "utf-8";
/* CSS Document */
#main{clear:both;margin:auto;padding:0; margin-top:0px;width:95%;height:auto!important;min-height:50px;max-height:none;overflow:hidden;display: flex;}
#main_center{flex:1; margin:0;padding:0;height:auto;overflow:hidden;}
#center_title{margin:10px 0px 10px 0px;padding: 15px; display:flex;justify-content: center;align-items: center;}
#center_title li:first-child{flex:1;}
#center_title li:last-child{font-weight: bolder;cursor:pointer; margin-left: 10px;}
#center_title li:last-child span{font-size: 16px;}
#center_titles{padding: 15px;background: #f3f4f8;font-weight: bolder;}
#center_content{margin-top:20px;width:100%;clear:both;height:auto;overflow:hidden;display: flex;}

#product_pic{flex:1.5; margin:0; padding:0;height:auto;overflow:hidden;}
.show_pic{margin:0;padding:0;width:100%;height:auto;text-align:center;cursor:pointer;overflow:hidden; display: none;}
.show_pic img{border:0;width:100%;}
.pic_list{ height: auto; display: flex; justify-content: left; align-items: center;flex-wrap: wrap;}
/* .pic_list img{ display:inline-block;width:50px; height: 50px; margin-right:20px;margin-top:10px; border:#ededed 1px solid;} 
.pic_list img:hover{border:#ff0000 1px solid;}*/
/* .pic_list img{border:0;width:100%;margin-bottom: 20px;} */
.pic_list .pic_list_show{ width: 50%; height:auto;overflow: hidden;text-align: center;margin-bottom: 20px;}
.pic_list .pic_list_show img{width:90%;border-radius: 5px;}
.pic_list .pic_list_show img:hover{ transform:scale(1.1);transition: .8s ease;}
.pic_list .pic_list_hide{ width: 50%; height:auto; overflow: hidden;text-align: center;margin-bottom: 20px;display: none;}
.pic_list .pic_list_hide img{width:90%;border-radius: 5px;}
.pic_list .pic_list_hide img:hover{ transform:scale(1.1);transition: .8s ease;}
.pic_hide_more{visibility: hidden;}

.show_pic_m{ height:auto;display:none;}
.slider_list{ z-index:9; }
.sw_pic{padding-bottom:100%;height:0px;overflow:hidden;background:#f1f3f2 no-repeat center center;background-size:contain;position:relative;} /*640:640*/
.pagination{position: unset; margin-top: 5px;}
.pagination span{margin: 0px 1px 0px 10px;}

#product_info{flex:1;height:auto;overflow:hidden; background: #fff;}
#product_info #pro_name{font-size:18px; font-weight:bolder;}
#product_info #pro_id{margin-top: 10px;}
#product_info #pro_title{height:25px; background:#B6B7B9;line-height:25px; font-weight:bolder;}
#product_info #pro_price_title{margin-top: 20px;font-weight: bolder;}
#product_info #pro_price{margin-top: 10px;display: flex;align-items: center;flex-wrap: wrap;}
#product_info #pro_price li{padding: 10px 0px 10px 0px; width: calc(25% - 1px); margin-right: 1px;margin-top: 1px;background: #F1F3F5;text-align: center;font-size: 14px;}
#product_info #pro_price .on{background: #000;color: #fff;}
#product_info #pro_price li span{display: block;font-size: 12px;}
#product_info #pro_price li p{ padding-top: 10px; font-size: 18px;}

#product_info #pro_size_title{margin-top:20px; display: flex;justify-content: center;align-items: center;}
#product_info #pro_size_title d{flex:1; font-weight: bold;}
#product_info #pro_size_title p{cursor: pointer;}
#product_info #pro_size_title span{font-size:20px;}

#product_info #pro_size{margin-top: 10px;}
#product_info #pro_size ul{display: flex; justify-content: center;align-items: center; padding: 5px 0px 5px 0px;}
#product_info #pro_size .size{flex:1;}
#product_info #pro_size .qty{ display: flex; justify-content: center;align-items: center;border:#CCC 1px solid;}
#product_info #pro_size .qdel,.qadd{cursor:pointer; font-size:18px;height:30px; width:30px; line-height:30px; text-align:center;}
#product_info #pro_size .m_i{width:28px; height:28px;border:#fff 0px solid; text-align:center; margin: 0px 5px 0px 5px;}
#product_info #pro_size .select{height: auto;}
#product_info #pro_size .select span{padding: 8px 10px 8px 10px;background:#F1F3F5; cursor: pointer;}

#product_info #pro_sizes .sselect{display: inline-flex; padding: 10px 10px 10px 10px;border:#ccc 1px solid; color: #ccc; margin: 5px 10px 5px 0px;cursor: pointer;}
#product_info #pro_sizes .sselect:hover{border:#000 1px solid; color: #000;}

#product_info #pro_list_list{height: auto;padding:0px;}
#product_info #pro_list_list .list_li{ padding: 10px 0px 10px 0px; display: flex;justify-content: center;align-items: center;border-bottom:#ededed 1px solid;}
#product_info #pro_list_list .list_li:last-child{border: none;}
#product_info #pro_list_list .list_li li:nth-child(1){flex:1;text-align: left;}
#product_info #pro_list_list .list_li li:nth-child(1) p{display: flex;justify-content: left;align-items: center;}
#product_info #pro_list_list .list_li li:nth-child(1) span{color: #999; margin-left: 10px;}
#product_info #pro_list_list .list_li li:nth-child(1) img{width:50px; margin-right: 10px;}
#product_info #pro_list_list .list_li li:nth-child(2){width: 80px;text-align: center;}
#product_info #pro_list_list .list_li li:nth-child(2) span{cursor: pointer;font-size: 20px;}

#product_info #pro_total_show{margin: 10px 0 10px 0;font-weight: bolder;cursor: pointer;display: none;}

#product_info #pro_button{margin-top: 30px;display: flex;justify-content: center;align-items: center;}
#product_info #pro_button #order_submit{flex:1;cursor:pointer; background:#000; height:50px; text-align:center; width:auto; line-height:50px; border: #000 1px solid;display: flex;justify-content: center;align-items: center;}
#product_info #pro_button #order_submit span:first-child{flex: 1; background:#fff;height:50px;color: #000;}
#product_info #pro_button #order_submit span:last-child{padding: 0px 30px 0px 30px;color:#FFF;}
#product_info #pro_button #favorite{ margin-left: 10px; padding: 0px 20px 0px 20px; cursor:pointer; background:#fff; height:50px; text-align:center; width:auto; line-height:50px; color:#000; font-size:16px;border: #000 1px solid;}
#product_info #pro_button #favorite span{font-size:24px;}



.prroll{margin:auto;width:100%;height:auto;overflow:hidden;}
.prroll ul{display:block;float:left;margin-top:50px;width: calc(96% - 2px);padding:2%;height:auto;border: #fff 1px solid; overflow:hidden;}
.prroll ul:hover{border:#000 1px solid;}
.prroll .p_pic{padding-bottom:50%;padding-top:50%;height:0; overflow: hidden; display: flex; justify-content: center; align-items: center;text-align: center;  background:#fff;}
.prroll .p_pic img{width:90%;border-radius: 5px;}
.prroll .p_pic img:hover{ transform:scale(1.1);transition: .8s ease;}
.prroll .p_info{margin-top:10px;height:40px;overflow:hidden; text-align:center;}
.prroll .p_infos {margin-top:10px; height:auto;overflow:hidden; text-align:center;font-weight: bolder;}
.prroll .p_infos span{color:#000; font-size:14px;}
.prroll .p_infos s{color:#999;}
.prroll .p_save{ margin-top:5px;color:#999; font-size:10px; text-align:center;}
.prroll .p_cart{ position: absolute; width: calc(96% - 2px); margin-top:-40%; text-align:center;z-index: 1;display: none; }
.prroll .p_cart a{ margin: auto;padding: 10px 15px 10px 15px;background:rgba(0, 0, 0, 0.6); color:#fff; border-radius: 5px;}
.prroll ul:hover .p_cart{display: block;}
.prroll .p_favorite{ position:absolute; margin: auto; width: calc(96% - 0px);text-align:right;z-index: 1;display:none; }
.prroll .p_favorite span{font-size: 26px;cursor: pointer;}
.prroll ul:hover .p_cart{display: block;}
.prroll ul:hover .p_favorite{display: block;}

.product_list{margin:auto;width:100%;height:auto;overflow:hidden;}
.product_list ul{display:block;float:left; margin-top:20px;margin-bottom:20px;width:24%;padding:0.5%;height:auto;overflow:hidden;}
.product_list .p_pic{padding-bottom:50%;padding-top:50%;height:0; overflow: hidden; display: flex; justify-content: center; align-items: center;text-align: center; background:#fff;border:#CCC 0.01rem solid;border-radius: 5px;}
.product_list .p_pic img{width:95%;border-radius: 5px;}
.product_list .p_pic img:hover{ transform:scale(1.1);transition: .8s ease;}
.product_list .p_info{margin-top:10px; height: 80px; overflow:hidden;text-align: center;}
.product_list .p_info .p_name{height: 60px; overflow:hidden;}
.product_list .p_info .p_price{margin-top:0px; color:#000;font-weight: bolder;}
.product_list .p_infos {height:auto;overflow:hidden; text-align:center;}
.product_list .p_infos span{color:#ff0000; font-size:16px;}
.product_list .p_infos s{color:#999;}
.product_list .p_infos .p_id{margin-top:0px; color:#000;font-weight: bolder;}
.product_list .p_save{ margin-top:5px;color:#999; font-size:10px; text-align:center;}

#center_titles{margin:auto;margin-top:50px;width:100%;height:auto;overflow:hidden;}
#center_titles li{margin-top:20px;height:1px; background:#ededed;}
#center_titles span{display:inline-block;font-size:24px; background:#FFF; padding:0px 10px 0px 10px;margin-top:-15px; position:absolute; z-index:2;}

#center_titless{margin:auto;margin-top:50px; padding: 20px 10px 20px 10px;height:auto;overflow:hidden;display: flex;justify-content: center;align-items: center;border-top:#ededed 1px solid;cursor: pointer;}
#center_titless p{flex:1;font-weight: bolder;}
#center_titless span{color: #666;font-size: 20px;}

#center_contents{margin-top:20px;clear:both;height:auto; line-height:30px;overflow:hidden;padding:10px;display: none;}
#center_button{ margin: auto;width: 200px; padding: 15px 20px 15px 20px; border: #000 1px solid;display: flex;justify-content: center;align-items: center;}
#center_button p{flex:1;font-weight: bolder;font-size: 16px; text-align: center; cursor: pointer;}

#center_contents table{ margin-top: 5px; width:100%;border-left:#ccc solid 1px;border-top:#ccc solid 1px;border-collapse:collapse; text-align: center;}
#center_contents table th{ padding:10px;line-height:20px;border-right:#ccc solid 1px;border-bottom:#ccc solid 1px;}
#center_contents table td{ padding:10px;line-height:20px;border-right:#ccc solid 1px;border-bottom:#ccc solid 1px;}
#center_contents table td:nth-child(odd) {background-color: #fff;font-weight: bolder;text-align: right;}
#center_contents table td:nth-child(even) {background-color: #fff;text-align: left;color:#ff0000;}

#main_left{margin:0; margin-top:0px;padding:0; padding-left: 10px; width:250px;height:auto;overflow:hidden;order: -1;}
#left_title{ margin-top: 10px; padding: 15px;background: #091140; color: #fff; text-align: center; font-weight: bolder;}
#left_title a{color: #fff; }
#left_list{margin:auto;border: #091140 1px solid;}
#left_list .c{padding:10px 15px 10px 15px;background:#f3f4f8;border-bottom: #ccc 1px solid;}
#left_list .c a{display:block;color: #003399;font-weight: bolder;}
#left_list .c a::before{content:"";display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin-top:0px; margin-right: 10px; vertical-align: middle;background:#ccc; border: #ccc 1px solid; background-size: cover;}
#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{padding:5px;padding-left:20px;border-bottom: #ccc 1px solid;}
#left_list .c_s a{display:block;}
#left_list .c_s_on{padding:5px;padding-left:20px;border-bottom: #ccc 1px solid;}
#left_list .c_s_on a{display:block;color: #ff0000;}
#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; float:left; 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_content{ margin-top: 20px; height: auto;}
#left_content  img{max-width: 100%;}


.float_size_bg{position:fixed;z-index:99999;width:100%;height:100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.6); display:flex; justify-content: center;align-items: center;flex-direction: column; visibility:hidden;}
.float_size{width: 80%; height: 80vh;background: #fff; padding: 20px;border-radius: 10px;}
.float_size_close{ text-align: right;padding-bottom: 20px;}
.float_size_close span{ font-size:30px;cursor:pointer; }
.float_size_content{height:calc(80vh - 60px); overflow-y: auto;position: relative;}
.float_size_content::-webkit-scrollbar {width: 5px;}
.float_size_content::-webkit-scrollbar-track{background:#fff;}
.float_size_content::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, 0.2);border-radius: 10px;}
.float_size_content::-webkit-scrollbar-thumb:hover {background: #555;}

.float_list_bg{position:fixed;z-index:99999;width:100%;height:100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.6); display:flex; justify-content: center;align-items: center;flex-direction: column; visibility:hidden;}
.float_list{width: 80%; height: 80vh;background: #fff; padding: 20px;border-radius: 10px;}
.float_list_close{ text-align: right;padding-bottom: 20px;}
.float_list_close span{ font-size:30px;cursor:pointer; }
.float_list_content{height:calc(80vh - 60px); overflow-y: auto;position: relative;}
.float_list_content::-webkit-scrollbar {width: 5px;}
.float_list_content::-webkit-scrollbar-track{background:#fff;}
.float_list_content::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, 0.2);border-radius: 10px;}
.float_list_content::-webkit-scrollbar-thumb:hover {background: #555;}

.list_title{ padding-bottom: 10px; font-weight: bolder;font-size: 20px;text-transform: uppercase; border-bottom:#ddd 1px solid;}
.list_show{ padding: 20px 0px 50px 0px;}
.list_size{font-weight: bolder;}
.list_qty{ margin-top: 20px; display: flex; justify-content: center;align-items: center;border:#CCC 1px solid; width: 150px;}
.list_qty .qdels{cursor:pointer; font-size:18px;height:40px; width:40px; line-height:40px; text-align:center;}
.list_qty .qadds{cursor:pointer; font-size:18px;height:40px; width:40px; line-height:40px; text-align:center;}
.list_qty .m_i{width:38px; height:38px;border:#fff 0px solid; text-align:center; margin: 0px 5px 0px 5px;}
.list_button{ margin-top: 20px; cursor:pointer; background:#000; height:50px; text-align:center; width:200px; line-height:50px; color:#FFF; font-size:16px;border: #000 1px solid;}

.list_titles{margin: 10px 0px 10px 0px; padding: 10px 0px 10px 0px;font-weight: bold;}
.list_patch{display: inline-flex;flex-wrap:wrap;}
.list_patch li{display: flex;justify-content: center;align-items: center; padding: 5px 10px 5px 10px;color: #999;border:#999 1px solid; margin: 5px 10px 5px 0px;cursor: pointer;}
.list_patch li img{height: 40px;}
.list_patch li p{margin: 0px 10px 0px 10px;}
.list_patch li span{color: #999;font-size: 13px;}
.list_patch .on{border: #000 1px solid; color: #000;}

.list_customer{display: flex;justify-content: left;align-items: center;}
.list_customer input{width: calc(50% - 10px); height: 40px;border: #000 1px solid;}
.list_customer input:last-child{margin-left: 10px;}
.list_customer input::placeholder{color:#ccc;}

.list_squad{display: inline-flex;flex-wrap:wrap;}
.list_squad li{display: flex;justify-content: center;align-items: center; padding: 5px 10px 5px 10px;color: #999; border:#999 1px solid; margin: 5px 10px 5px 0px;cursor: pointer;}
.list_squad li p{margin: 5px 5px 5px 5px;}
.list_squad li span{color: #999;font-size: 13px;}
.list_squad .on{border: #000 1px solid; color: #000;}

.list_list{height: auto;padding: 20px 0px 20px 0px;}
.list_list .list_tr{display: flex;justify-content: center;align-items: center;font-weight: bolder;}
.list_list .list_tr li:nth-child(1){flex:0.8;}
.list_list .list_tr li:nth-child(2){flex:0.5;text-align: center;}
.list_list .list_tr li:nth-child(3){flex:1;}
.list_list .list_tr li:nth-child(4){flex:1;}
.list_list .list_tr li:nth-child(5){width: 80px; text-align: center;}
.list_list .list_li{ margin-top: 20px; padding: 10px 0px 10px 0px; display: flex;justify-content: center;align-items: center;border-top:#ededed 1px solid;}
.list_list .list_li li:nth-child(1){flex:0.8;}
.list_list .list_li li:nth-child(2){flex:0.5;text-align: center;}
.list_list .list_li li:nth-child(3){flex:1;display: flex;justify-content:center;align-items: center;}
.list_list .list_li li:nth-child(3) img{width: 60px; margin-right: 10px;}
.list_list .list_li li:nth-child(3) p{flex:1;}
.list_list .list_li li:nth-child(4){flex:1;}
.list_list .list_li li:nth-child(5){width: 80px;text-align: center;}
.list_list .list_li li:nth-child(5) span{cursor: pointer;font-size: 20px;}

@media screen and (min-width: 1400px) {
#main{width:80%;}
}

@media screen and (max-width: 750px) {
#main{width:100%; margin-top: 0px; }
#center_title{ margin: 0px; padding-top: 10px;}
#center_titles{margin-top:30px;}
#center_titles span{ display: none;}

#main_center{ width:100%;}

#center_content{margin-top:30px;display: block;}
.show_pic{display:none;}
.pic_list{display:none;}
.show_pic_m{ display:block;}

#product_pic{float:none;margin:auto;width:100%;padding:0;}
#product_info{position:relative;left: 0;padding: 20px;}

#product_info .pro_buttons{ position: fixed; margin-top: 0px;bottom: 56px;left: 0; right: 0; width: calc(100% - 5px); padding: 10px 0px 10px 0px; display: flex;justify-content: center;align-items: center;z-index: 99999; background: #fff;}
#product_info .pro_buttons #favorite{order: -1;  margin-left: 0px; margin-right: 5px;}
#product_info #pro_button #order_submit span:last-child{padding: 0px 15px 0px 15px;}
#product_info #pro_button #favorite{padding: 0px 5px 0px 5px;}

.pic_button{display: none;}

.prroll{width: 100%;}
.prroll ul{ border: none;}
.prroll ul:hover{ border: none;}
.prroll .p_pic img{width:100%;}
.prroll .p_pic img:hover{ transform:scale(1);transition: .8s ease;}
.prroll .p_infos span{color: #000;}
.prroll .p_save{display: inline-block; width: 50%; margin-top:0px;color:#999; font-size:10px; text-align:right;}
.prroll ul:hover .p_cart{display: none;}
.prroll .p_favorite{display: block;}
.prroll ul:hover .p_cart{display: none;}

.product_list{width: 100%;}
.product_list ul{width:48%; padding:1%;margin-top:20px;}
.product_list .p_info{height: 55px;}


#center_contents img{width:100%; height:auto;}

#main_left{ display:none;}

.float_size{width: 90%; padding: 5px;}
}