@charset "UTF-8";
.banner > .main > .h3, .menu-content > .inner, .menu-content > .inner > .item > .list {
*zoom: 1;
}
.banner > .main > .h3:before, .menu-content > .inner:before, .menu-content > .inner > .item > .list:before, .banner > .main > .h3:after, .menu-content > .inner:after, .menu-content > .inner > .item > .list:after {
content: "";
display: table;
}
.banner > .main > .h3:after, .menu-content > .inner:after, .menu-content > .inner > .item > .list:after {
clear: both;
}
.iconfont {
-moz-user-select: none;
/*火狐*/
-webkit-user-select: none;
/*webkit浏览器*/
-ms-user-select: none;
/*IE10*/
-khtml-user-select: none;
/*早期浏览器*/
user-select: none;
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
html,
body {
background-color: #fff;
}
.banner {
position: relative;
max-width: 100%;
height: auto;
background-color: #f7fbff;
}
.banner > .main {
z-index: 1;
position: relative;
margin: 0 auto;
width: 1200px;
height: 626px;
text-align: left;
}
.banner > .main > h1 {
box-sizing: border-box;
padding-top: 60px;
font-weight: 700;
display: block;
color: #1971e9;
margin-bottom: 15px;
}
.banner > .main > h2 {
font-weight: 700;
display: block;
color: #000;
font-size: 41px;
}
.banner > .main > .h3 {
margin-top: 30px;
width: 520px;
height: auto;
}
.banner > .main > .h3 > span {
box-sizing: border-box;
padding-left: 55px;
margin-bottom: 30px;
display: block;
float: left;
width: 50%;
color: #27364e;
font-weight: 700;
position: relative;
}
.banner > .main > .h3 > span:before {
content: "";
position: absolute;
left: 0;
top: -5px;
width: 45px;
height: 45px;
background: url("../images/ico1.png") no-repeat;
}
.banner > .main > .h3 > span.n1:before {
background-position: -2px -4px;
}
.banner > .main > .h3 > span.n2:before {
background-position: -2px -65px;
}
.banner > .main > .h3 > span.n3:before {
background-position: -4px -123px;
}
.banner > .main > .h3 > span.n4:before {
background-position: -5px -188px;
}
.banner > .png-right {
display: block;
position: absolute;
display: block;
top: 0;
right: 0;
width: 950px;
height: 518px;
background: url("../images/right.png") no-repeat center right;
}
.banner > .png-right > .go-left {
display: block;
position: absolute;
left: 0;
top: 50px;
width: 866px;
height: 552px;
background: url("../images/go-left.png") no-repeat center;
}
.menu-content {
position: relative;
z-index: 1;
width: 100%;
height: auto;
background-color: #fff;
}
.menu-content > .inner {
position: relative;
margin: 0 auto;
width: 1200px;
}
.menu-content > .inner > .item {
position: relative;
box-sizing: border-box;
float: left;
width: 280px;
height: 430px;
box-shadow: 0 0 30px 0px rgba(133, 161, 196, 0.2);
background-color: #fff;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
margin-right: 20px;
border: 1px solid transparent;
margin-bottom:10px
}
.menu-content > .inner > .item .pro {
position: absolute;
right: 0;
top: 0;
width: 35px;
height: 123px;
line-height: 17px;
font-size: 12px;
color: #fff;
background: #f04e4e;
box-sizing: border-box;
padding: 4px 9px;
}
.menu-content > .inner > .item .pro:after {
display: block;
position: absolute;
content: "";
bottom: 0;
width: 0;
right: 0px;
height: 0;
border-left: 18px solid transparent;
border-right: 17px solid transparent;
border-bottom: 14px solid #fff;
}
.menu-content > .inner > .item .pro2 {
position: absolute;
right: -2px;
top: -3px;
width: 38px;
height: 44px;
line-height: 37px;
font-size: 12px;
color: #fff;
background: url(../images/t.png) no-repeat center;
}
.menu-content > .inner > .item:nth-child(2):before {
content: "";
display: block;
width: 44px;
height: 59px;
background: url("../images/hot.png") no-repeat;
position: absolute;
top: 15px;
left: 195px;
}
.menu-content > .inner > .item:nth-child(4) {
margin-right: 0;
}
.menu-content > .inner > .item:hover {
border-color: #1971e9;
-webkit-transform: translateY(-5px);
-ms-transform: translateY(-5px);
-moz-transform: translateY(-5px);
transform: translateY(-5px);
}
.menu-content > .inner > .item > h1,.menu-content > .inner > .item > .ch1 {
padding-top: 30px;
font-weight: 700;
font-size: 24px;
color: #27364e;
}
.menu-content > .inner > .item > h2,.menu-content > .inner > .item > .ch2 {
color: #1971e9;
font-size: 66px;
line-height: 90px;
font-weight: 700;
}
.menu-content > .inner > .item > h2:before {
position: relative;
top: -29px;
left: -5px;
content: "￥";
font-size: 22px;
color: #a3afba;
}
.menu-content > .inner > .item > h3 {
text-decoration: line-through;
font-size: 14px;
color: #ff3b3b;
font-weight: 700;
margin-top: -16px;
}
.menu-content > .inner > .item > .list {
margin: 15px auto 20px auto;
width: 220px;
}
.menu-content > .inner > .item > .list > span {
margin-bottom: 15px;
float: left;
}
.menu-content > .inner > .item > .buy {
cursor: pointer;
box-sizing: border-box;
width: 150px;
height: 45px;
line-height: 43px;
color: #1971e9;
font-size: 16px;
border: 1px solid #1971e9;
margin: 0 auto;
border-radius: 5px;
display: block;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.menu-content > .inner > .item > .buy.active, .menu-content > .inner > .item > .buy:hover {
color: #fff;
background-color: #1971e9;
}
@media screen and (max-width: 1700px) {
.go-left {
left: 80px !important;
}
}
/*# sourceMappingURL=buy.css.map*/