/* 全局样式 */ body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{padding:0;border:0; margin:0 auto;} body{background:#000000;color:#333;font-size:12px; } ul,ol{list-style-type:none;} select,input,select{vertical-align:middle;} a{ color:#94856E; text-decoration:none;} .clearit{clear:both; width:100%; height:0; line-height:0; overflow:hidden; font-size:0} ul:after { content:""; display:block; height:0px; visibility:hidden; clear:both; } .clearfix:after { content:""; display:block; height:0px; visibility:hidden; clear:both; } /* 头部 */ .top:after { content:""; display:block; height:0px; visibility:hidden; clear:both; } .top{ margin:0 auto;min-width: 1200px; border-bottom: 1px solid rgba(148,133,110,.3);} .top .logo{isplay: block;float: left;} .top .logo img{ height: 100px; } .top .box{ width: 90%; display: flex; margin: 0 auto; } /* 导航*/ .nav{ flex: 1; background:#000000; z-index:1; float: left;height: 100px; margin-left: 2.5%;margin-right: 2.5%; border-left: 1px solid rgba(148,133,110,.2);} .nav ul li{text-align:center; flex: 1;position:relative; line-height: 100px; height: 100px; border-right: 1px solid rgba(148,133,110,.2); font-size: 16px;letter-spacing: 2px; position: relative;} .nav ul li span{ display:block;color:#FF0000; font-weight:normal;} .nav ul li a{text-decoration:none; display: block; } .nav ul li a:link{color:#91856f;} .nav ul li a:visited{color:#91856f;} .nav ul li a:hover{color:#f4ca7c; text-decoration:none;} .nav ul li a:active{color:#91856f; text-decoration:underline;} .nav ul li p{ display: flex; align-items: center; justify-content: center; } .nav ul li p img{ height: 100%; width: 15px; margin: 0; margin-left: 5px; } #sddm{ display: flex; margin:0 auto; text-align:center; } .nav ul li div.sub { position: absolute; background:#000000; left:0; top: 120px; width: 100%; border-top: 2px solid #91856f; border-radius: 0px 0px 5px 5px; padding-bottom: 10px; opacity: 0; visibility: hidden; z-index: 999; -webkit-transition:all .3s ease-in-out 0s;transition:all .3s ease-in-out 0s; } .nav ul li:hover div.sub{ top: 100px; opacity: 1; visibility: initial; } .yuyu_but{ float: right; width: 150px; margin-top: 23px; } .yuyu_but span{ display: block; font-size: 20px; color: #91856f; font-family: arial; text-align: center; font-weight: bold; } .yuyu_but a{ display: block; height: 30px; line-height: 30px; width: 110px; text-align: center; background: #91856f; border-radius: 25px; color: #fff; font-size: 12px; margin: 0 auto; margin-top: 5px; } .yuyu_but a:hover{ background: #daaf60; } .dh1{ position:relative;} .dh1 #m3{ position:absolute; left:0;} .dh2{ position:relative;} .dh2 #m5{ left:0;} #sddm div a{position: relative; display: block; color: #91856f; font: 12px; text-align: center; line-height: 40px; height: 40px; font-size: 16px;} #sddm div a:hover { text-decoration:none; color: #91856f;z-index:1;} /* 中间 */ .banner{ margin:0 auto; min-width:1200px;padding-top:10px;_padding-top:24px;} .banner img{width: 100%;height:600px; } .ban{ width:100%; } .ban img{ max-width: 100%; margin: 0 auto; display: block;} .minder{ width:100%; margin:0 auto;} .minder .left_n{ float:left; width:305px; height:202px; padding-right:20px; background:url(../images/ind_r4_c5_s1.jpg) no-repeat right 30px;} .minder .tit_n{ text-align:right; height:36px; line-height:36px; padding-top:15px; border-bottom:1px solid #1A160B;} .minder .left_n .tit_n{ width:305px; background:url(../images/ind_r3_c1_s1.jpg) no-repeat 0 12px;} .minder .tit_n a{ color:#666; font-size:12px;} .minder .left_n ul{ width:305px; padding-top:10px;} .minder .left_n ul li{ line-height:29px; padding-left:13px; background:url(../images/ind_r6_c2_s1.jpg) no-repeat 0 0px;} .minder .yingyuan{ width:100%; padding:0 10px; background:url(../images/ind_r4_c5_s1.jpg) no-repeat right 30px; box-sizing: border-box;} .minder .yingyuan .tit_n{ background:url(../images/ind_r3_c7_s1.jpg) no-repeat 0 12px;} .minder .yingyuan ul{ width:100%} .minder .yingyuan li{ width: 49%; position: relative; overflow: hidden; float: left; margin: 0 .5%;} .minder .yingyuan3 li{ width: 32.3333%;} .minder .yingyuan li img{ transition: all 0.5s; width: 100%; height: auto;} .minder .yingyuan li a{ display:block; color:#95856E;} .minder .yingyuan li:hover img{ transform: scale(1.05); } .minder .yingyuan li .z{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; background:linear-gradient(rgba(0,0,0,1),rgba(0,0,0,0)); text-align: center; color: #fff; box-sizing: border-box; padding-top: 50px;} .minder .yingyuan li .z span{ display: block; font-size: 24px; text-align: center; } .minder .yingyuan li .z p{ display: block; font-size: 14px; text-align: center; margin-top: 15px; } .minder .yinyue{ background:none;} .minder .yinyue .tit_n{ background:url(../images/ind_r3_c11_s1.jpg) no-repeat 0 12px;} .conent{ width:1200px; margin:0 auto;overflow: hidden; position: relative; } .conent .left{width:206px; padding-top:12px; position: absolute; right: 0; } .conent .left p{float:left;height:25px;width:205px;font-size:14px;line-height:25px;text-indent:15px} .conent .left p a{color:#CCC ;} .conent .right{ background: url(../images/bg.jpg) no-repeat; width: 99%; margin-top: 12px; color: #94856E; border: 1px solid rgba(148,133,110,.3); } /* easy clearing */ .conent:after { content: ''; display: block; height: 0; clear: both; visibility: hidden; } .conent { display: inline-block; } /*\*/ .conent { display: block; } /* end easy clearing */ /*\*/ @media all and (min-width: 0px) { .conent .left:before, .conent .right:before { display: block; background: inherit; height: 0; } } /**/ .conent .jt{ width: 1200px; height: 50px; line-height: 50px; /* background: url(../images/lian.jpg) bottom no-repeat; */ margin-top: 15px; font-size: 15px; } .conent .jt .sy{ background: url(../images/ico1.jpg) no-repeat left center; height: 50px; line-height: 50px; padding-left: 25px; margin-left: 10px;} .conent .left .title{ background:url(../images/title.jpg) no-repeat; width:206px; height:40px; float:left;} .conent .left .title1{ background:url(../images/sjyy.jpg) no-repeat; width:206px; height:40px; float:left;} .conent .left .title1 img{ float:right; padding-top: 15px; padding-right: 25px;} .conent .left .title2{ background:url(../images/sjyyt.jpg) no-repeat; width:206px; height:40px; float:left;} .conent .left .title2 img{ float:right; padding-top: 15px; padding-right: 25px;} .conent .left .title3{ background:url(../images/lxwm.jpg) no-repeat; width:206px; height:40px; float:left;} .conent .left .title3 img{ float:right; padding-top: 15px; padding-right: 25px;} .conent .left .title4{ background:url(../images/gudg.jpg) no-repeat; width:206px; height:40px; float:left;} .conent .left .title4 img{ float:right; padding-top: 15px; padding-right: 25px;} .conent .left .title5{ background:url(../images/xwdt.jpg) no-repeat; width:206px; height:40px; float:left;} .conent .left .title5 img{ float:right; padding-top: 15px; padding-right: 25px;} .qy{ width: 1200px; margin: 0 auto; margin-top: -50px; position: relative; z-index: 99; /* background: #000; */ text-align: center; display: flex; justify-content: center;} .qy:after { content:""; display:block; height:0px; visibility:hidden; clear:both; } .qy a{height: 50px; line-height: 50px; text-align: center; background: rgba(148,133,110,1); display: block; margin: 0px 5px; color: #fff; border-radius: 5px 5px 0px 0px; font-size: 16px; display: inline-block; flex: 1;} .qy a:hover{ color:yellow;} .qy a.on{ color:yellow;} .conent .left .title img{ float:right; padding-top: 15px; padding-right: 25px;} .conent .left .dian img{ float:left;} .conent .right .ri{ } .conent .right .ri .wen{ width: 96%; line-height: 24px; padding-left: 10px; margin-top: 30px;font-size: 16px; padding-top: 20px;} .conent .right h1{ color:#94856E; font-size:24px; width:775px; text-align:center;} .conent .right .ri .wen img{display:block;margin:0 auto} .conent .right .wen h6{ font-size:14px;} .conent .right .td1{ border:1px solid #333333; width:180px; height:117px;} .conent .right .xww{ width:747px; height:44px; color:#94856E; text-align:center; margin-top:60px; float:left; text-align:center;} .conent .right .wen *{line-height:200%} .conent .right .h3{ color:#94856E; font-size:14px; font-weight:bold; padding-left:48px;} .conent .right .xw{ width:96%; padding-top: 30px; } .conent .right .xw li { width: 100%; margin-bottom: 35px; -webkit-transition: all ease 300ms; -moz-transition: all ease 300ms; -ms-transition: all ease 300ms; -o-transition: all ease 300ms; transition: all ease 300ms; border-bottom: 1px solid rgba(148,133,110,.3); padding-bottom: 35px; } .conent .right .xw li a { width: 100%; display: block; } .conent .right .xw li img { width: 224px; height: 168px; display: block; margin-right: 30px; } .conent .right .xw li h3 { font-size: 18px; font-weight: normal; margin-bottom: 15px; -webkit-transition: all ease 300ms; -moz-transition: all ease 300ms; -ms-transition: all ease 300ms; -o-transition: all ease 300ms; transition: all ease 300ms; } .conent .right .xw li .txt { color: #999999; line-height: 24px; height: 48px; padding-right: 40px; overflow: hidden; font-size: 14px; } .conent .right .xw li .time { width: 100px; font-family: arial; font-size: 20px; color: #999; float: right; border-left: 1px solid rgba(148,133,110,.3); padding-left: 20px; height: 89px; } .conent .right .xw li .time .day { font-size: 35px; line-height: 45px; display: block; margin-bottom: 10px; } .conent .right .xw li:hover { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); } .conent .right .xw li:hover h3 { text-indent: 5px; } .conent .right .xw li:hover .time .day span { background: #6d6d6d; } .conent .right .xw li:hover .time .day strong { background: #ff0000; color: #fff; } .conent .right .em{ height:700px; margin-top:20px;} .em ul{width:280px;float:left; margin-left:13px;_margin-left:10px; margin-bottom: 15px;} .em ul .no{ display:block; width: 278px; height: 170px; background: rgba(255,255,255,.1);text-align:center; vertical-align:middle; *font-size:100px;} .em ul .no a{display: flex;width: 278px;height: 170px; justify-content: center;align-items: center; } .em ul .no img{max-width: 278px;max-height: 170px;} .em ul .no_1 a{ display:block; font-size: 14px; overflow: hidden; text-align:center; height:40px; line-height:40px;} /* 底部 */ .dibu{ width:1010px; line-height:200%; margin:0 auto; margin-top:20px;} .dibu_h{ margin-top:0;} .dibu span{ color:#94856E;} .dibu a{ color:#94856E; text-decoration:none; padding-right:5px; padding-left:5px;} .dibu .dibu1{ width:1010px; text-align:center; padding:40px 0;} /* 引导页 */ .ydy{ background:#000; width:100%; margin:0 auto} #TT{line-height:200%} h1{font-size:14px;} #TT *{line-height:200%} .product_attr_box{font-size:18px;padding:0 0 0px 0; width: 1200px;margin:0 0 68px 0; } .product_attr_box:after { content:""; display:block; height:0px; visibility:hidden; clear:both; } .product_attr_box .fl{ float: left; } .product_attr_box .product_attr{ padding:0 0 16px 0; margin:16px 0 0 0; position:relative;} .product_attr_box .product_attr .name{ width:107px; font-weight:bold; font-size:18px;color: #91856f;} .product_attr_box .product_attr .into{ width:1015px;} .product_attr_box .product_attr .into.cat_info a{ margin:0 40px 0px 0; color:#383838} .product_attr_box .product_attr .into a.cur{ color:#8e1677 !important;} .product_attr_box .product_attr_brand .into li{width: 140px; height: 78px; float: left; margin: 0 3px 3px 0; position: relative; border-radius: 2px; overflow: hidden;} .product_attr_box .product_attr_brand .into li.hover{ border-color:#000;} .product_attr_box .product_attr_brand .into li .info{position:absolute; background:rgba(0,0,0,0.2); top:0; left:0; width:100%; height:100%; text-align:center; color:#fff; font-size:16px;} .product_attr_box .product_attr_brand .into li .info p{display:none; margin:30px 0 2px 0 ;} .product_attr_box .product_attr_brand .into li:hover .info{ display:block;background:rgba(0,0,0,0.7);} .product_attr_box .product_attr_brand .into li:hover .info p{ display: block;} .product_attr_box .product_attr_brand .into li.on .info p{ display:block;} .product_attr_box .product_attr_brand .into li.on .info{ display:block;background:rgba(0,0,0,0.7);} .product_attr_box .product_attr_brand .into li img{width: 140px; height: 78px; margin: 0 auto; display: block} .product_attr_box .product_attr_brand .brand_search_box{border:1px solid #ececec; width:158px; height:24px; margin:0 0 16px 0; display:none;} .product_attr_box .product_attr_brand .brand_search_box input{ font-size:16px; text-indent:22px; display:block; width:158px; height:24px; line-height:24px;} .product_attr_box .product_attr_brand .get_more{ position:absolute; right:0; top:0;} .product_attr_box .product_attr_brand .get_more i{ display:inline-block; margin:0 0 0 8px; width:14px; height:14px;} .product_attr_box .product_attr_brand .into ul{ height:159px; overflow:hidden;} .product_attr_box .product_attr_brand .into.show ul{ height:auto; padding:0 0 1px 0;} .product_attr_box .product_attr_brand .into.show .brand_search_box{ display:block;} .product_list{ margin:18px 0 88px 0;} .product_list li{ float:left; width:260px; height:482px; padding:14px; background:rgba(255,255,255,.1); margin-bottom: 15px; margin-right: 15px; position:relative;} .product_list li:nth-child(4n+4){ margin-right: 0;} .product_list li .images{ height:275px; margin:0 auto; margin-bottom: 25px; position:relative;} .product_list li .images .goods_url{ display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.1);} .product_list li .images .goods_url img{ max-width: 100%; max-height: 100%; transition: all 0.5s; } .product_list li:hover img{ transform: scale(1.1); } .product_list li .images img{ max-width:100%; max-height:100%; margin:0 auto; display:block} .product_list li .images .collect{ position:absolute; bottom:0px; height:40px; line-height:40px; background:#94856E; text-align:center; width:100%; color:#fff; display:none; z-index:111;} .product_list li .images .collect a{ color:#fff; font-size:18px;} .product_list li .images .collect a:hover{ color:#fff !important;} .product_list li .into{ margin:10px 0 0px 0; font-size:18px; padding:0 10px;} .product_list li .into .brand{ color: #fff; line-height: 21px; background: #94856E; display: inline-block; height: 30px; line-height: 30px; font-size: 14px; padding: 0 15px;} .product_list li .into .title{ margin:10px 0 17px 0; height:68px; line-height:34px; font-size:18px; overflow:hidden; color: #eee;} .product_list li .into .price{color:#94856E; font-size:20px; font-weight:600;} .product_list li.hover .collect{ display:block} .product_list li:hover .collect{display:block} .product_info_box { margin-top: 20px;} .product_info_box .images{ width:320px; float:left;height:388px;} .product_info_box .images .view{ width:320px; height:320px; margin:0 0 10px 0;} .product_info_box .images .view .images{ width:320px; height:320px;} .product_info_box .images .preview {width: 100%;margin-top: 10px; position: relative;} .product_info_box .images .preview .arrow-left{ position:absolute; left:0; background:url(../images/pre.png) no-repeat; width:19px; height:40px; cursor:pointer;z-index:11;} .product_info_box .images .preview .arrow-right{ position:absolute; right:0;background:url(../images/next.png) no-repeat; width:19px; height:40px; cursor:pointer; z-index:11;} .product_info_box .images .preview .swiper-container{margin:0 auto; position:relative; padding:0 28px;} .product_info_box .images .preview .swiper-container .swiper-slide{ width:40px; height:40px; margin:0 4px 0 0;cursor:pointer;} .product_info_box .images .preview .swiper-container .swiper-slide .images{ width:40px; height:40px;} .product_info_box .info{ width:810px; float:right;} .product_info_box .info .brand_name{ font-size:20px; height:30px; line-height:30px; color:#000; margin:0 0 6px 0;} .product_info_box .info .product_name{font-size:30px;margin: 0 0 15px 0;line-height:30px; color: #fff;} .product_info_box .info .type{font-size: 18px; margin-bottom: 20px; color: #999;} .product_info_box .info .type span{padding-right: 33px;font-size: 16px;} .product_info_box .info .type a{font-size: 18px; color: #999} .product_info_box .info .price{ margin:0 0 22px 0;} .product_info_box .info .price span{color: #999; float:left; font-size:16px; margin:0 36px 0 0;} .product_info_box .info .price font{ float:left; font-size:16px; position:relative; color:#f0bd6e;} .product_info_box .info .price font i{ font-size:26px; /*position:absolute;top:-4px;*/ font-style:normal;} .product_info_box .info .product_other{ height:42px;} .product_info_box .info .product_other span{ height:42px; line-height:42px; float:left; font-size:16px; margin:0 36px 0 0;} .product_info_box .info .product_other ul{ float:left;} .product_info_box .info .product_other ul li{ float:left; height:40px; border:1px solid #f4f4f4; width:40px; margin:0 6px 0 0;} .product_info_box .info .product_other ul li.cur{ border:1px solid #91197B;} .product_info_box .info .product_other ul li .iamges{ width:40px; height:40px;} .product_info_box .info .add_my_favorite{ margin:54px 0 0 0; } .product_info_box .info .add_my_favorite a{ background:#91856f; color:#fff; display:block;width:240px; height:50px; font-size:20px; line-height:50px; text-align:center} .pglist { padding-bottom: 30px; width: 100%; text-align: center; clear: both; } .pglist a { color: #666; padding: 0 13px; margin:2px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); box-sizing: border-box; } .pglist * { display: inline-block; _zoom: 1; _display: inline; vertical-align: middle; line-height: 34px; padding-bottom: 1px; } .pglist a:hover { display: inline-block; color: #fff; border: 1px solid #91856f; background: #91856f; } .pglist b { display: inline-block; color: #fff; padding: 0 13px; margin:2px; border: 1px solid #91856f; background: #91856f; } .yuyue img.pic{ width: 600px; float: left; margin-top: 25px; border-radius: 5px; height: 500px; } .yuyue form{ float: right; width: 590px; margin-left: auto; } .yuyue form select{ width: 60%; height: 35px; border: 1px solid #e4e4e4; padding-left: 12px; font-size: 14px; border-radius: 2px; } .yuyue form p{ display: flex; margin-bottom: 15px; } .yuyue form p span{ width: 100px; text-align: right; padding-right: 10px; height: 35px; line-height: 35px; box-sizing: border-box; } .yuyue form input[type="text"]{ display:block; width: 60%; height: 35px; border: 1px solid #e4e4e4; padding-left: 15px; box-sizing: border-box; font-size: 14px;border-radius: 2px; } .yuyue form input[type="submit"]{ display:block; width: 130px; margin-left: 100px; height: 35px; background-color: rgba(148,133,110,1); border: 1px solid rgba(148,133,110,1); color: #fff; cursor: pointer; box-sizing: border-box; font-size: 14px;border-radius: 2px; } .yuyue form textarea{ display:block; flex: 1; height: 153px; border: 1px solid #e4e4e4; padding-left: 15px; padding-top: 10px;border-radius: 2px; box-sizing: border-box; font-size: 14px; } .yuyue form p{ font-size: 12px; color: #666666; margin-top: 15px; } .yuyue form p i{ color: red; display: inline-block; margin-right: 5px; } @media(max-width:1400px){ .top .box{ width:96%} .top .logo img{ height:80px} .top .logo{display: flex;align-items: center;} .nav ul li{ font-size:15px} .yuyu_but span{ font-size:18px} .nav ul li div.sub{ width:140px} .yuyu_but a{ width:100px; height:25px; line-height:25px;} .yuyu_but{ margin-top:28px} }