1401 lines
24 KiB
CSS
Executable File
1401 lines
24 KiB
CSS
Executable File
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
@media screen and (min-width: 1460px) {
|
|
.swt-Container {
|
|
width: 1440px;
|
|
margin: auto;
|
|
}
|
|
}
|
|
@media screen and (max-width: 1459px) {
|
|
.swt-Container {
|
|
width: 90%;
|
|
margin: auto;
|
|
}
|
|
}
|
|
@media screen and (max-width: 990px) {
|
|
.swt-Container {
|
|
width: 96%;
|
|
margin: auto;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1280px) {
|
|
.swt-Container-1200 {
|
|
width: 1200px;
|
|
margin: auto;
|
|
}
|
|
}
|
|
@media screen and (max-width: 1279px) {
|
|
.swt-Container-1200 {
|
|
width: 96%;
|
|
margin: auto;
|
|
}
|
|
}
|
|
|
|
/* CSS Document */
|
|
/*@media screen and (min-width:1400px){
|
|
body, html{font-size:16px;}
|
|
}
|
|
@media screen and (min-width:768px) and (max-width:1399px){
|
|
body, html{font-size:15px;}
|
|
}
|
|
@media screen and (min-width:384px) and (max-widt.S-Cricle-Bgh:767px){
|
|
body, html{font-size:13px;}
|
|
}
|
|
@media screen and (max-width:383px){
|
|
body, html{font-size:12px;}
|
|
}*/
|
|
|
|
@media screen and (min-width: 1441px) {
|
|
body,
|
|
html {
|
|
font-size: 100%;
|
|
}
|
|
}
|
|
@media screen and (min-width: 1201px) and (max-width: 1440px) {
|
|
body,
|
|
html {
|
|
font-size: 98%;
|
|
}
|
|
}
|
|
@media screen and (min-width: 767px) and (max-width: 1200px) {
|
|
body,
|
|
html {
|
|
font-size: 96%;
|
|
}
|
|
}
|
|
@media screen and (min-width: 641px) and (max-width: 768px) {
|
|
body,
|
|
html {
|
|
font-size: 94%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 481px) and (max-width: 640px) {
|
|
body,
|
|
html {
|
|
font-size: 92%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 383px) and (max-width: 480px) {
|
|
body,
|
|
html {
|
|
font-size: 90%;
|
|
}
|
|
}
|
|
@media only screen and (min-width: 321px) and (max-width: 384px) {
|
|
body,
|
|
html {
|
|
font-size: 88%;
|
|
}
|
|
}
|
|
@media only screen and (max-width: 320px) {
|
|
body,
|
|
html {
|
|
font-size: 86%;
|
|
}
|
|
}
|
|
|
|
ul,
|
|
li {
|
|
list-style: none;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.Ts-Orage {
|
|
color: #ff9800;
|
|
}
|
|
.Ts-White {
|
|
color: #ffffff;
|
|
}
|
|
.transparent_black {
|
|
color: #333333;
|
|
}
|
|
.swt-punctuation {
|
|
margin-left: 8px;
|
|
font-size: 1.25em;
|
|
}
|
|
.float-f {
|
|
float: left;
|
|
}
|
|
.float-r {
|
|
float: right;
|
|
}
|
|
.text-r {
|
|
text-align: right;
|
|
}
|
|
.text-l {
|
|
text-align: left;
|
|
}
|
|
.text-c {
|
|
text-align: center;
|
|
}
|
|
.font-75 {
|
|
font-size: 0.75em;
|
|
}
|
|
.font-11 {
|
|
font-size: 1.125em;
|
|
}
|
|
.font-18 {
|
|
font-size: 1.875em;
|
|
}
|
|
.font-9 {
|
|
font-size: 0.9em;
|
|
}
|
|
.font-color-gray {
|
|
color: #444;
|
|
}
|
|
.letter-S-2 {
|
|
letter-spacing: 2px;
|
|
}
|
|
.img-responsive img {
|
|
height: auto;
|
|
max-width: 100%;
|
|
}
|
|
.img-responsives img {
|
|
display: block;
|
|
height: auto;
|
|
width: 100%;
|
|
}
|
|
.overflow-f {
|
|
overflow: hidden;
|
|
}
|
|
.c-fix {
|
|
clear: both;
|
|
}
|
|
.margin-t-5 {
|
|
margin-top: 5%;
|
|
}
|
|
.margin-t-1 {
|
|
margin-top: 1%;
|
|
}
|
|
.margin-t-3 {
|
|
margin-top: 3%;
|
|
}
|
|
.margin-b-3 {
|
|
margin-bottom: 3%;
|
|
}
|
|
.margin-b-5 {
|
|
margin-bottom: 5%;
|
|
}
|
|
.padding-t-3 {
|
|
padding-top: 3%;
|
|
}
|
|
.padding-b-3 {
|
|
padding-bottom: 3%;
|
|
}
|
|
.padding-b-3 {
|
|
padding-bottom: 3%;
|
|
}
|
|
.padding-t-4 {
|
|
padding-top: 4%;
|
|
}
|
|
@media screen and (max-width: 767px) {
|
|
.margin-b-3 {
|
|
margin-bottom: 5%;
|
|
}
|
|
}
|
|
.bg-gray {
|
|
background-color: #f1f1f1;
|
|
}
|
|
.bg-white {
|
|
background-color: #fff;
|
|
}
|
|
.font-red {
|
|
color: red;
|
|
}
|
|
.width-100 {
|
|
width: 100%;
|
|
}
|
|
.width-92 {
|
|
width: 92%;
|
|
margin: auto;
|
|
}
|
|
.f-weight-b {
|
|
font-weight: bold;
|
|
}
|
|
.position-r {
|
|
position: relative;
|
|
}
|
|
.swt-Title {
|
|
font-size: 1.875em;
|
|
color: #002855;
|
|
text-align: center;
|
|
font-weight: 600;
|
|
}
|
|
@media screen and (min-width: 769px) {
|
|
.swt-Table {
|
|
display: table;
|
|
width: 100%;
|
|
}
|
|
.swt-Table .Table-Row {
|
|
display: table-row;
|
|
}
|
|
.swt-Table .Table-Row .Table-Cell {
|
|
display: table-cell;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
}
|
|
.Swt-Gray {
|
|
background-color: #f1f1f1;
|
|
overflow: hidden;
|
|
}
|
|
.Swt-Blue-line {
|
|
width: 4.25%;
|
|
height: 5px;
|
|
background-color: #002855;
|
|
overflow: hidden;
|
|
margin: 0 auto 2%;
|
|
}
|
|
.Swt-Banner {
|
|
width: 100%;
|
|
}
|
|
.Swt-Banner img {
|
|
width: 100vw;
|
|
}
|
|
.swt-punctuation {
|
|
margin-left: 8px;
|
|
font-size: 1.25em;
|
|
position: absolute;
|
|
display: inline-block;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.Swt-title {
|
|
color: #002855;
|
|
font-weight: 600;
|
|
padding: 5% 0 3%;
|
|
font-size: 1.875em;
|
|
text-align: center;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.Swt-title {
|
|
font-size: 1.5em;
|
|
}
|
|
}
|
|
|
|
/*一级列表滚动条样式*/
|
|
.scrollbar {
|
|
width: 3px;
|
|
height: 562px;
|
|
}
|
|
|
|
/*详情放大样式*/
|
|
.enlarge-img {
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
z-index: 99999;
|
|
top: 0;
|
|
left: 0;
|
|
text-align: center;
|
|
}
|
|
.enlarge-img img {
|
|
height: 100vh;
|
|
max-width: 100%;
|
|
}
|
|
.enlarge-img .close {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 28px;
|
|
background-color: rgba(0, 0, 0, 0.8);
|
|
z-index: 9;
|
|
top: 0px;
|
|
color: #fff;
|
|
font-size: 0.875em;
|
|
cursor: pointer;
|
|
text-align: right;
|
|
}
|
|
.enlarge-img .close span {
|
|
display: inline-block;
|
|
margin-right: 5%;
|
|
}
|
|
|
|
/*一级列表页*/
|
|
.S-list-top {
|
|
position: relative;
|
|
}
|
|
.S-list-top-text {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
opacity: 0;
|
|
text-align: center;
|
|
}
|
|
@media screen and (min-width: 768px) {
|
|
.S-list-top:hover .S-list-top-text {
|
|
top: 0px;
|
|
opacity: 1;
|
|
transition: 0.5s;
|
|
box-shadow: 3px 5px 15px rgba(0, 0, 0, 0.2);
|
|
}
|
|
}
|
|
|
|
.S-list-top {
|
|
position: relative;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.S-list-top-text {
|
|
opacity: 1;
|
|
position: relative;
|
|
}
|
|
.dcp li .ptit1 {
|
|
margin-top: 0;
|
|
color: #333;
|
|
padding-top: 8%;
|
|
}
|
|
.dcp li .ptit2 {
|
|
color: #333;
|
|
}
|
|
.S-list-p-text {
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
|
|
.cricle {
|
|
display: block;
|
|
width: 16px;
|
|
height: 16px;
|
|
border-radius: 8px;
|
|
border: 1px solid #d6d6d6;
|
|
}
|
|
.on .cricle {
|
|
border: 1px solid #737373;
|
|
}
|
|
.S-Cricle-Bg {
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 5px;
|
|
margin: 3px;
|
|
}
|
|
@media screen and (max-width: 767px) {
|
|
.cricle {
|
|
width: 16px;
|
|
height: 16px;
|
|
border-radius: 8px;
|
|
}
|
|
.ejul dd .ejtext .hd ul li.on {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.ejul dd .ejtext .hd ul li {
|
|
float: right;
|
|
width: 16px;
|
|
height: 16px;
|
|
cursor: pointer;
|
|
margin-right: 5px;
|
|
margin-bottom: 5px;
|
|
}
|
|
.S-Cricle-Bg {
|
|
width: 12px;
|
|
height: 12px;
|
|
border-radius: 6px;
|
|
margin: 2px;
|
|
}
|
|
}
|
|
/*手机端文件隐藏*/
|
|
@media screen and (min-width: 1025px) {
|
|
.Swt-Phone {
|
|
display: block;
|
|
}
|
|
}
|
|
@media screen and (max-width: 1024px) {
|
|
.Swt-Phone {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/*在线客服*/
|
|
.suspension {
|
|
position: fixed;
|
|
top: 50%;
|
|
right: 0px;
|
|
transform: translate(0%, -50%);
|
|
z-index: 100;
|
|
}
|
|
.suspension-box {
|
|
position: relative;
|
|
float: right;
|
|
}
|
|
.suspension .a {
|
|
display: block;
|
|
text-align: center;
|
|
border-top: 1px solid #f1f1f1;
|
|
border-left: 1px solid #f1f1f1;
|
|
background: #fff;
|
|
padding: 8px 8px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.suspension .a-top {
|
|
border-bottom: 1px solid #f1f1f1;
|
|
margin-top: 10px;
|
|
}
|
|
.suspension .a i {
|
|
display: inline-block;
|
|
transition: all 2s;
|
|
font-size: 20px;
|
|
color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
.suspension .a i:hover {
|
|
color: rgba(0, 0, 0, 0.8);
|
|
}
|
|
@media screen and (min-width: 769px) and (max-width: 1440px) {
|
|
.suspension .a {
|
|
padding: 15px;
|
|
}
|
|
.suspension .a i {
|
|
font-size: 1.5em;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.suspension .a {
|
|
padding: 10px;
|
|
}
|
|
.suspension .a i {
|
|
font-size: 1.5em;
|
|
}
|
|
}
|
|
@media screen and (max-width: 480px) {
|
|
.suspension .a {
|
|
padding: 5px;
|
|
}
|
|
}
|
|
/*.suspension .a i.l1{width:38px;height:42px;background:url(../images/images/qq1.png);margin-top:12px;}
|
|
.suspension .a i.l2{width:42px;height:33px;background:url(../images/images/wx1.png);margin:12px 0 12px 0;}
|
|
.suspension .a i.l3{width:42px;height:30px;background:url(../images/images/ys1.png);margin:12px 0 12px 0;}
|
|
.suspension .a i.l4{width:42px;height:37px;background:url(../images/images/kf1.png);margin-top:12px;}
|
|
.suspension .a i.l5{width:34px;height:42px;background:url(../images/images/top1.png);margin-top:12px;}
|
|
.suspension .a:hover i.l1{background:url(../images/images/qq1-1.png);}
|
|
.suspension .a:hover i.l2{background:url(../images/images/wx1-1.png);}
|
|
.suspension .a:hover i.l3{background:url(../images/images/ys1-1.png);}
|
|
.suspension .a:hover i.l5{background:url(../images/images/top1-1.png);}
|
|
*/
|
|
.suspension .a p {
|
|
text-align: center;
|
|
color: #666;
|
|
font-size: 12px;
|
|
}
|
|
.suspension .d {
|
|
display: none;
|
|
width: 190px;
|
|
background: #fff;
|
|
position: absolute;
|
|
right: 100%;
|
|
min-height: 90px;
|
|
border: 1px solid #e0e1e5;
|
|
border-radius: 3px;
|
|
box-shadow: 0px 2px 5px 0px rgba(161, 163, 175, 0.11);
|
|
}
|
|
.suspension .d .arrow {
|
|
position: absolute;
|
|
width: 8px;
|
|
height: 12px;
|
|
background: url(../images/side_bg_arrow.png) no-repeat;
|
|
right: -8px;
|
|
top: 31px;
|
|
}
|
|
.d-servcie {
|
|
top: 0;
|
|
}
|
|
.d-servcie ul {
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
.d-servcie li {
|
|
white-space: nowrap;
|
|
margin-left: 10px;
|
|
margin-right: 10px;
|
|
padding-left: 5px;
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
text-align: left;
|
|
border-bottom: 1px solid rgba(197, 197, 197, 0.2);
|
|
font-size: 12px;
|
|
}
|
|
.d-servcie li a {
|
|
padding: 0;
|
|
}
|
|
|
|
.suspension .d-service-phone {
|
|
top: 0px;
|
|
}
|
|
.suspension .d-qrcode {
|
|
top: 96px;
|
|
}
|
|
.suspension .d .inner-box {
|
|
padding: 8px 10px 10px;
|
|
}
|
|
.suspension .d-service-item {
|
|
padding: 5px 0;
|
|
}
|
|
.suspension .d-service .d-service-item {
|
|
border-bottom: none;
|
|
}
|
|
.suspension .d-service-item .circle {
|
|
width: 36px;
|
|
height: 36px;
|
|
border-radius: 50%;
|
|
overflow: hidden;
|
|
background: #f1f1f3;
|
|
display: block;
|
|
float: left;
|
|
}
|
|
.suspension .d-service-item .i-tel {
|
|
width: 44px;
|
|
height: 44px;
|
|
background: url(../images/side_con_icon02.png) no-repeat center center;
|
|
display: block;
|
|
}
|
|
.suspension .d-service-item .text {
|
|
float: left;
|
|
width: 120px;
|
|
line-height: 22px;
|
|
font-size: 15px;
|
|
margin-left: 5px;
|
|
}
|
|
.suspension .d-service-item .text .number {
|
|
color: #e0143f;
|
|
}
|
|
.suspension .d-service-intro {
|
|
padding-top: 10px;
|
|
}
|
|
.suspension .d-service-intro p {
|
|
float: left;
|
|
line-height: 27px;
|
|
font-size: 12px;
|
|
width: 100%;
|
|
color: #888;
|
|
}
|
|
.suspension .d-service-intro i {
|
|
background: url(../images/side_con_icon01.png) no-repeat center center;
|
|
height: 27px;
|
|
width: 14px;
|
|
margin-right: 5px;
|
|
vertical-align: top;
|
|
display: inline-block;
|
|
}
|
|
.suspension .d-qrcode {
|
|
text-align: center;
|
|
}
|
|
.suspension .d-qrcode .inner-box {
|
|
padding: 20px 0;
|
|
}
|
|
.suspension .d-qrcode p {
|
|
font-size: 16px;
|
|
color: #93959c;
|
|
}
|
|
|
|
.show {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.75);
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 10000;
|
|
display: none;
|
|
}
|
|
.show .smask {
|
|
background: #f1f1f1;
|
|
position: absolute;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%);
|
|
height: 600px;
|
|
overflow: auto;
|
|
padding: 0 30px;
|
|
}
|
|
.show .smask .sarea {
|
|
padding: 46px 0px 49px 0;
|
|
}
|
|
.show .smask .sarea .stop1 {
|
|
border-bottom: 1px solid #d8d8d8;
|
|
padding-bottom: 28px;
|
|
}
|
|
.show .smask .sarea .stop1 span {
|
|
font-size: 24px;
|
|
color: #444;
|
|
margin-left: 48px;
|
|
}
|
|
.show .smask .sarea .stop1 a {
|
|
float: right;
|
|
}
|
|
.show .smask .sarea .feed {
|
|
padding: 28px 76px 0 76px;
|
|
}
|
|
.show .smask .sarea .feed .finput {
|
|
margin-bottom: 30px;
|
|
}
|
|
.show .smask .sarea .feed .finput label {
|
|
display: inline-block;
|
|
width: 70px;
|
|
font-size: 14px;
|
|
color: #444;
|
|
}
|
|
.show .smask .sarea .feed .finput label.fla {
|
|
vertical-align: top;
|
|
}
|
|
.show .smask .sarea .feed .finput select {
|
|
font-size: 14px;
|
|
color: #444;
|
|
width: 29%;
|
|
padding-left: 1%;
|
|
height: 36px;
|
|
border: none;
|
|
background: #fff url(../images/images/bott.png) 96% center no-repeat;
|
|
border-radius: 5px;
|
|
margin-left: 10px;
|
|
}
|
|
.show .smask .sarea .feed .finput input {
|
|
font-size: 14px;
|
|
color: #444;
|
|
width: 29%;
|
|
padding-left: 1%;
|
|
height: 36px;
|
|
border: none;
|
|
background: #fff;
|
|
border-radius: 5px;
|
|
margin-left: 10px;
|
|
}
|
|
.show .smask .sarea .feed .finput input.them {
|
|
width: 89%;
|
|
padding-left: 1%;
|
|
}
|
|
.show .smask .sarea .feed .finput textarea {
|
|
font-size: 14px;
|
|
color: #444;
|
|
width: 89%;
|
|
padding: 18px 0 0 1%;
|
|
height: 198px;
|
|
background: #fff;
|
|
border-radius: 5px;
|
|
margin-left: 10px;
|
|
}
|
|
.show .smask .sarea .feed .finput input.them1 {
|
|
width: 59%;
|
|
margin-left: 1%;
|
|
}
|
|
.show .smask .sarea .feed .finput a.yzm {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
margin-left: 1%;
|
|
}
|
|
.show .smask .sarea .feed .finput a.yzm img {
|
|
display: block;
|
|
}
|
|
.show .smask .sarea .feed a.feda {
|
|
display: inline-block;
|
|
width: 100px;
|
|
height: 36px;
|
|
border: 1px solid #002855;
|
|
line-height: 36px;
|
|
font-size: 16px;
|
|
color: #002855;
|
|
text-align: center;
|
|
border-radius: 100px;
|
|
margin-right: 15px;
|
|
}
|
|
.show .smask .sarea .feed a.feda:hover {
|
|
background: #002855;
|
|
color: #fff;
|
|
}
|
|
/*在线客服*/
|
|
|
|
/*品类探索*/
|
|
.home-pinlei {
|
|
width: 100%;
|
|
background-color: rgba(0, 0, 0, 0.6);
|
|
position: absolute;
|
|
bottom: 0px;
|
|
}
|
|
.home-pinlei a {
|
|
color: #fff;
|
|
font-size: 1.125em;
|
|
line-height: 2em;
|
|
display: inline-block;
|
|
margin: 1% 5%;
|
|
}
|
|
|
|
/*专题标题*/
|
|
.subject-title {
|
|
font-size: 2em;
|
|
font-weight: 600;
|
|
color: #101010;
|
|
text-align: center;
|
|
margin-bottom: 5%;
|
|
}
|
|
|
|
/*品类探索李静*/
|
|
.image-box {
|
|
position: relative;
|
|
}
|
|
.groups_a {
|
|
padding: 0;
|
|
margin: 0;
|
|
line-height: 22px;
|
|
position: absolute;
|
|
top: 65%;
|
|
text-align: center;
|
|
width: 100%;
|
|
color: rgba(255, 255, 255, 0.6);
|
|
font-size: 0.875em;
|
|
}
|
|
.text-desc {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
height: 100%;
|
|
opacity: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.lj_index_img,
|
|
.lj_index_img_01 {
|
|
width: 100%;
|
|
background: #252525;
|
|
height: 100%;
|
|
}
|
|
@media screen and (min-width: 1480px) {
|
|
.lj_index_img .lj_its_img {
|
|
width: 1440px;
|
|
}
|
|
.lj_index_img_01 .lj_its_img {
|
|
width: 1440px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 1479px) {
|
|
.lj_its_img {
|
|
width: 90%;
|
|
}
|
|
}
|
|
@media screen and (max-width: 640px) {
|
|
.groups_a {
|
|
line-height: 15px;
|
|
}
|
|
}
|
|
|
|
.lj_its_img {
|
|
margin: auto;
|
|
}
|
|
.lj_its_img img,
|
|
.lj_index_img_01 img {
|
|
width: 100%;
|
|
display: block;
|
|
}
|
|
.lj_index_img_01 .lj_its_img li {
|
|
display: inline-block;
|
|
float: left;
|
|
}
|
|
.lj_index_img .lj_its_img li {
|
|
display: inline-block;
|
|
vertical-align: bottom;
|
|
}
|
|
@media screen and (min-width: 880px) {
|
|
.lj_index_img_01 .lj_its_img li {
|
|
width: 14.28%;
|
|
}
|
|
}
|
|
@media screen and (max-width: 879px) {
|
|
.lj_index_img_01 .lj_its_img li {
|
|
width: 20%;
|
|
}
|
|
}
|
|
@media screen and (max-width: 640px) {
|
|
.lj_index_img_01 .lj_its_img li {
|
|
width: 25%;
|
|
}
|
|
}
|
|
@media screen and (min-width: 769px) {
|
|
.lj_its_img li {
|
|
width: 14.28%;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.lj_its_img li,
|
|
.lj_index_img_01 li {
|
|
width: 25%;
|
|
overflow: hidden;
|
|
}
|
|
/*.lj_its_img {padding-bottom: 2%;}*/
|
|
}
|
|
|
|
.lj_its_img ul {
|
|
text-align: center;
|
|
}
|
|
/* effect-1 css */
|
|
.lj-port-1 {
|
|
float: left;
|
|
width: 100%;
|
|
position: relative;
|
|
overflow: hidden;
|
|
text-align: center;
|
|
}
|
|
.lj-port-1 .text-desc {
|
|
opacity: 1;
|
|
top: -150%;
|
|
transition: 0.5s;
|
|
color: #fff;
|
|
}
|
|
.lj-port-1.effect-1:hover .text-desc {
|
|
top: 0;
|
|
}
|
|
|
|
.lj-port-1.effect-2 .text-desc {
|
|
top: auto;
|
|
bottom: -100%;
|
|
}
|
|
.lj-port-1.effect-2:hover .text-desc {
|
|
bottom: 0;
|
|
}
|
|
|
|
.lj-port-1.effect-3 .text-desc {
|
|
top: 0;
|
|
left: 50%;
|
|
width: 0;
|
|
height: 0;
|
|
overflow: hidden;
|
|
padding: 0;
|
|
}
|
|
.lj-port-1.effect-3:hover .text-desc {
|
|
width: 100%;
|
|
top: 0;
|
|
left: 0;
|
|
height: 100%;
|
|
}
|
|
/* effect-1 css end */
|
|
/*热门产品*/
|
|
.rmBox ul {
|
|
width: 100%;
|
|
margin-top: 2%;
|
|
}
|
|
.rmBox li {
|
|
width: 23.73%;
|
|
margin-right: 1.5%;
|
|
float: left;
|
|
margin-bottom: 3%;
|
|
text-align: center;
|
|
}
|
|
.rmBox li:hover {
|
|
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2);
|
|
transition: 0.5s;
|
|
}
|
|
.rmBox li:nth-child(5n) {
|
|
margin-right: 0;
|
|
}
|
|
@media screen and (max-width: 864px) {
|
|
.rmBox li {
|
|
width: 22.6%;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.rmBox li {
|
|
width: 48.9%;
|
|
}
|
|
.rmBox li:nth-child(2n) {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
@media screen and (max-width: 580px) {
|
|
.rmBox li {
|
|
width: 48.8%;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 460px) {
|
|
.rmBox li {
|
|
width: 47.8%;
|
|
}
|
|
}
|
|
|
|
/*新增google浏览器图片模糊解决*/
|
|
@media screen and (min-width: 1480px) {
|
|
.rmimg img {
|
|
width: 302px;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 767px) {
|
|
}
|
|
|
|
/*一级列表热门产品*/
|
|
/*详情样式*/
|
|
.o_detail_all {
|
|
text-align: center;
|
|
}
|
|
.o_detail_title {
|
|
font-size: 2.25em;
|
|
color: #101010;
|
|
margin-top: 3.125vw;
|
|
font-weight: 600;
|
|
margin-bottom: 1.25vw;
|
|
line-height: 1.2em;
|
|
}
|
|
.o_detail_small {
|
|
font-size: 1.5em;
|
|
color: #333;
|
|
margin-bottom: 0.7vw;
|
|
}
|
|
.o_detail_text {
|
|
font-size: 1em;
|
|
color: #737373;
|
|
line-height: 1.5em;
|
|
width: 80%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-bottom: 0.7vw;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.o_detail_title {
|
|
font-size: 1.875em;
|
|
}
|
|
}
|
|
|
|
/*专题页字体样式*/
|
|
.subject_title {
|
|
font-size: 2.5em;
|
|
}
|
|
.subject_subtitle {
|
|
font-size: 1.25em;
|
|
}
|
|
.subject_des {
|
|
font-size: 0.875em;
|
|
}
|
|
|
|
.subject_buy .subject_buy_button {
|
|
position: relative;
|
|
top: 50%;
|
|
margin-top: -1.5em;
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
.subject_buy a {
|
|
padding-left: 5%;
|
|
padding-right: 5%;
|
|
height: 2em;
|
|
margin-left: 2%;
|
|
margin-right: 2%;
|
|
display: inline-block;
|
|
line-height: 2em;
|
|
color: #333;
|
|
font-size: 1.25em;
|
|
}
|
|
.subject_buy a:hover {
|
|
background-color: #2dccd2;
|
|
color: #fff;
|
|
border: 1px solid #2dccd2;
|
|
}
|
|
.subject_span {
|
|
display: inline-block;
|
|
padding-left: 5%;
|
|
padding-right: 5%;
|
|
height: 2em;
|
|
margin-left: 0%;
|
|
margin-right: 4%;
|
|
display: inline-block;
|
|
line-height: 2em;
|
|
color: #939393;
|
|
font-size: 1em;
|
|
border: 1px solid #939393;
|
|
}
|
|
@media screen and (max-width: 1280px) {
|
|
.subject_title {
|
|
font-size: 2.5em;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.subject_title {
|
|
font-size: 2em;
|
|
}
|
|
.subject_subtitle {
|
|
font-size: 1.5em;
|
|
}
|
|
.subject_des {
|
|
display: none;
|
|
}
|
|
.subject_buy a {
|
|
font-size: 1em;
|
|
}
|
|
.subject .subject_buy {
|
|
position: absolute;
|
|
bottom: -30%;
|
|
width: 100%;
|
|
}
|
|
.subject li:hover .subject_buy {
|
|
background-color: rgba(255, 255, 255, 0.5);
|
|
overflow: hidden;
|
|
position: absolute;
|
|
bottom: 0px;
|
|
width: 100%;
|
|
height: 30%;
|
|
transition: 0.5s;
|
|
}
|
|
}
|
|
@media screen and (max-width: 480px) {
|
|
.subject_title {
|
|
font-size: 1.5em;
|
|
}
|
|
.subject_subtitle {
|
|
font-size: 1.125em;
|
|
}
|
|
.subject_buy .subject_buy {
|
|
position: relative;
|
|
margin-bottom: 3vw;
|
|
}
|
|
.subject li:hover .subject_buy {
|
|
position: relative;
|
|
}
|
|
}
|
|
|
|
.subject_02_bg {
|
|
width: 100%;
|
|
padding-top: 5%;
|
|
padding-bottom: 5%;
|
|
overflow: hidden;
|
|
background-color: #f2f2f2;
|
|
}
|
|
.subject_02 {
|
|
width: 100%;
|
|
color: #333;
|
|
}
|
|
.subject_02 .left {
|
|
width: 29%;
|
|
float: left;
|
|
}
|
|
.subject_02 .right {
|
|
width: 69%;
|
|
float: right;
|
|
position: relative;
|
|
}
|
|
.subject_02 .right img {
|
|
opacity: 0;
|
|
}
|
|
@media screen and (max-width: 769px) {
|
|
.subject_02 .left {
|
|
width: 100%;
|
|
text-align: center;
|
|
margin-bottom: 3%;
|
|
}
|
|
.subject_02 .right {
|
|
width: 100%;
|
|
float: left;
|
|
}
|
|
}
|
|
.subject_02 video {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
}
|
|
.subject_02 .subject_title {
|
|
line-height: 1.1em;
|
|
}
|
|
.subject_02 .subject_subtitle {
|
|
line-height: 1.5em;
|
|
margin-top: 1.4vw;
|
|
}
|
|
.subject_02 .subject_text {
|
|
margin-top: 2vw;
|
|
line-height: 1.75em;
|
|
}
|
|
.subject_span_margin {
|
|
margin-bottom: 1vw;
|
|
display: inline-block;
|
|
}
|
|
.subject_travel_text {
|
|
background: #f2f2f2;
|
|
text-align: center;
|
|
color: #333;
|
|
padding: 5% 0;
|
|
}
|
|
|
|
@media screen and (max-width: 1365px) {
|
|
.subject_02 .subject_text {
|
|
display: none;
|
|
}
|
|
.Fan_04 .subject_des {
|
|
display: none;
|
|
}
|
|
.Fan_03 .subject_des {
|
|
display: none;
|
|
}
|
|
}
|
|
/*手机端图片*/
|
|
@media screen and (min-width: 769px) {
|
|
.homebans_p {
|
|
display: block;
|
|
}
|
|
.homebans_m {
|
|
display: none;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.homebans_p {
|
|
display: none;
|
|
}
|
|
.homebans_m {
|
|
display: block;
|
|
}
|
|
}
|
|
|
|
/*新版首页样式*/
|
|
.comit p {
|
|
display: inline-block;
|
|
position: relative;
|
|
}
|
|
.comit span:before {
|
|
position: absolute;
|
|
height: 1px;
|
|
background-color: #101010;
|
|
width: 2.6vw;
|
|
content: '';
|
|
left: 102%;
|
|
top: 50%;
|
|
}
|
|
.comit span:after {
|
|
position: absolute;
|
|
height: 1px;
|
|
background-color: #101010;
|
|
width: 2.6vw;
|
|
content: '';
|
|
right: 102%;
|
|
top: 50%;
|
|
}
|
|
.comit span {
|
|
display: inline-block;
|
|
background-color: #fff;
|
|
padding: 0px 10px;
|
|
position: relative;
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.comit span:before,
|
|
.comit span:after {
|
|
width: 0px;
|
|
}
|
|
}
|
|
|
|
.home_new {
|
|
width: 100%;
|
|
background-color: #fff;
|
|
padding-top: 1vw;
|
|
padding-bottom: 1vw;
|
|
overflow: hidden;
|
|
}
|
|
.home_new .hot {
|
|
width: 100%;
|
|
}
|
|
.home_new .hot li {
|
|
width: 49.3%;
|
|
margin-right: 1.4%;
|
|
float: left;
|
|
position: relative;
|
|
}
|
|
.home_new .hot li:last-child {
|
|
margin-right: 0;
|
|
}
|
|
.home_new .hot .text {
|
|
position: absolute;
|
|
width: 100%;
|
|
text-align: center;
|
|
top: 50%;
|
|
line-height: 40px;
|
|
height: 30px;
|
|
margin-top: -15px;
|
|
color: #101010;
|
|
font-size: 2.25em;
|
|
font-weight: 600;
|
|
}
|
|
/*.home_new .hot .workshop .workshop_all{display: none;}
|
|
.home_new .hot .workshop:hover .hot_all{display: none;}
|
|
.home_new .hot .workshop:hover .workshop_all{display: block;}*/
|
|
.home_new .hot .workshop_all a {
|
|
display: block;
|
|
width: 100%;
|
|
margin-bottom: 0.74vw;
|
|
overflow: hidden;
|
|
position: relative;
|
|
color: #101010;
|
|
}
|
|
.home_new .hot .workshop_all a:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
.home_new .hot .workshop_all a .content {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
z-index: 2;
|
|
}
|
|
.home_new .hot .workshop_all a .content_text {
|
|
margin-top: 1.8vw;
|
|
width: 80%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
overflow: hidden;
|
|
}
|
|
.home_new .hot .workshop_all a .left {
|
|
width: 80%;
|
|
float: left;
|
|
}
|
|
.home_new .hot .workshop_all a .right {
|
|
width: 20%;
|
|
float: left;
|
|
font-size: 4.375em;
|
|
text-align: center;
|
|
padding-top: 2.2vw;
|
|
}
|
|
.home_new .hot .workshop_all a .title {
|
|
font-size: 1.5em;
|
|
text-align: left;
|
|
line-height: 1.75em;
|
|
margin-top: 0.5vw;
|
|
}
|
|
.home_new .hot .workshop_all a .subtitle {
|
|
font-size: 1.125em;
|
|
text-align: left;
|
|
margin-top: 0.5vw;
|
|
}
|
|
.home_new .hot .workshop_all a:hover .content {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
top: 0;
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
z-index: 2;
|
|
color: #101010;
|
|
}
|
|
|
|
/*首页文化与价值观*/
|
|
.home_new .value_new {
|
|
width: 100%;
|
|
}
|
|
.home_new .value_new li {
|
|
width: 32.3%;
|
|
margin-right: 1.55%;
|
|
float: left;
|
|
position: relative;
|
|
}
|
|
.home_new .value_new li:last-child {
|
|
margin-right: 0;
|
|
}
|
|
.home_new .value_new li .text {
|
|
position: absolute;
|
|
width: 100%;
|
|
text-align: center;
|
|
top: 0;
|
|
height: 100%;
|
|
color: #101010;
|
|
}
|
|
.home_new .value_new li .text .title {
|
|
font-size: 2.25em;
|
|
font-weight: 600;
|
|
margin-top: 26%;
|
|
}
|
|
.home_new .value_new li .text .subtitle {
|
|
font-size: 1.5em;
|
|
margin-top: 2vw;
|
|
}
|
|
.home_new .news {
|
|
margin-top: 2.8vw;
|
|
}
|
|
.hz {
|
|
margin-top: 2vw;
|
|
}
|
|
.lttext p {
|
|
margin-bottom: 1vw;
|
|
}
|
|
.home_new .value_new li:hover {
|
|
box-shadow: 5px 5px 5px rgba(217, 217, 217);
|
|
}
|
|
@media screen and (max-width: 1440px) {
|
|
.home_new .hot .text {
|
|
font-size: 2em;
|
|
}
|
|
.home_new .hot .workshop_all a .subtitle {
|
|
font-size: 1em;
|
|
margin-top: 0vw;
|
|
line-height: 20px;
|
|
}
|
|
.home_new .hot .workshop_all a .right {
|
|
font-size: 3em;
|
|
}
|
|
.home_new .hot .workshop_all a .content_text {
|
|
width: 84%;
|
|
}
|
|
.home_new .value_new li .text .title {
|
|
font-size: 1.875em;
|
|
}
|
|
.home_new .value_new li .text .subtitle {
|
|
font-size: 1.25em;
|
|
margin-top: 1.5vw;
|
|
}
|
|
}
|
|
@media screen and (max-width: 1080px) {
|
|
.home_new .hot .text {
|
|
font-size: 1.5em;
|
|
}
|
|
.home_new .hot .workshop_all a .title {
|
|
font-size: 1.125em;
|
|
line-height: 1.5em;
|
|
}
|
|
.home_new .hot .workshop_all a .subtitle {
|
|
font-size: 0.875em;
|
|
margin-top: 0.8vw;
|
|
line-height: 18px;
|
|
}
|
|
.home_new .hot .workshop_all a .right {
|
|
font-size: 2em;
|
|
width: 12%;
|
|
}
|
|
.home_new .hot .workshop_all a .content_text {
|
|
width: 90%;
|
|
}
|
|
.home_new .hot .workshop_all a .left {
|
|
width: 88%;
|
|
}
|
|
.home_new .value_new li .text .title {
|
|
font-size: 1.5em;
|
|
}
|
|
.home_new .value_new li .text .subtitle {
|
|
font-size: 1em;
|
|
margin-top: 1vw;
|
|
}
|
|
}
|
|
@media screen and (max-width: 768px) {
|
|
.home_new .hot li {
|
|
width: 100%;
|
|
margin-bottom: 2vw;
|
|
}
|
|
.home_new .hot .workshop_all a .content_text {
|
|
margin-top: 5vw;
|
|
}
|
|
.home_new .value_new li {
|
|
width: 100%;
|
|
margin-bottom: 1vw;
|
|
text-align: center;
|
|
}
|
|
}
|
|
@media screen and (max-width: 480px) {
|
|
.home_new .hot .workshop_all a .content_text {
|
|
margin-top: 4vw;
|
|
}
|
|
}
|
|
@media screen and (max-width: 320px) {
|
|
.home_new .hot .workshop_all a .subtitle {
|
|
line-height: 16px;
|
|
margin-top: 0vw;
|
|
}
|
|
.home_new .hot .workshop_all a .content_text {
|
|
margin-top: 3vw;
|
|
}
|
|
}
|
|
|
|
.margin-top-60 {
|
|
margin-top: 60px;
|
|
}
|