init
This commit is contained in:
1261
public/frontend/web/css/animate.css
vendored
Executable file
1261
public/frontend/web/css/animate.css
vendored
Executable file
File diff suppressed because it is too large
Load Diff
753
public/frontend/web/css/booNavigation.css
Executable file
753
public/frontend/web/css/booNavigation.css
Executable file
@@ -0,0 +1,753 @@
|
||||
/**
|
||||
* Name: booNavigation.css
|
||||
* Date:Sun 16 Feb 2014
|
||||
* Author: Noemi Losada Estrella <info@noemilosada.com>
|
||||
* Creative Commons License <http://creativecommons.org/licenses/by-sa/3.0/>
|
||||
*/
|
||||
|
||||
/** General
|
||||
================================================== */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
/*font-family: "Microsoft YaHei" , sans-serif; */
|
||||
body {font-size: 1.2em; font-weight: 400; color: #333; background-color: #f2f2f2; }
|
||||
|
||||
.wrapper {
|
||||
/*margin: 50px auto;*/
|
||||
/*width: 960px;*/
|
||||
}
|
||||
|
||||
ul li {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.wrapper a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/** Navigation theme
|
||||
.search_content {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
background-color: #FFF;
|
||||
border-radius: 8px;
|
||||
display: block;
|
||||
}
|
||||
/*.tabs-vertical{*/
|
||||
/* font: bold 13px sans-serif;*/
|
||||
/* background-color: #f7f7f7;*/
|
||||
/* box-shadow: 0 0 22px #E2E2E2 inset, 2px 2px 3px #E8E8E8;*/
|
||||
/* border: 1px solid #CECECE;*/
|
||||
/* margin: 30px auto 30px;*/
|
||||
/* max-width: 580px;*/
|
||||
/* text-align: center;*/
|
||||
/* border-radius: 2px;*/
|
||||
/*}*/
|
||||
|
||||
/* The tabs */
|
||||
|
||||
.tabs-vertical ul{
|
||||
float: left;
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
width: 20%;
|
||||
margin: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
/*.tabs-vertical ul li{*/
|
||||
/* margin-right: -1px;*/
|
||||
/*}*/
|
||||
|
||||
.tabs-vertical ul li a{
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
color: #656a6d;
|
||||
|
||||
border: 1px solid transparent;
|
||||
border-right: 0;
|
||||
border-left: 0;
|
||||
|
||||
padding: 16px 40px 16px 20px;
|
||||
}
|
||||
|
||||
.tabs-vertical ul li a.tab-active {
|
||||
border-color: #dddddd;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0px 2px 0px #EFEFEF;
|
||||
}
|
||||
|
||||
.tabs-vertical ul li:first-child a{
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
/* The content */
|
||||
|
||||
.tabs-vertical .tabs-content-placeholder{
|
||||
min-height: 460px;
|
||||
max-height: 660px;
|
||||
overflow: scroll;
|
||||
border-left: 1px solid #dddddd;
|
||||
font-weight: normal;
|
||||
background-color: #fff;
|
||||
/*padding: 20px 40px 45px;*/
|
||||
margin: 0 auto;
|
||||
box-shadow: -3px 0 0px #F3F3F3;
|
||||
text-align: left;
|
||||
}
|
||||
.tabs-vertical .tabs-content-placeholder dd a{
|
||||
/*margin-left: 1.5%;*/
|
||||
}
|
||||
|
||||
.tabs-vertical .tabs-content-placeholder div{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.tabs-vertical .tabs-content-placeholder div.tab-content-active{
|
||||
display: block;
|
||||
}
|
||||
|
||||
.tabs-vertical .tabs-content-placeholder div p{
|
||||
color: #565a5c;
|
||||
line-height: 1.5;
|
||||
text-align: left;
|
||||
|
||||
margin: 5px 0 20px;
|
||||
}
|
||||
|
||||
.tabs-vertical .tabs-content-placeholder div img{
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
|
||||
.tabs-vertical ul{
|
||||
float: none;
|
||||
}
|
||||
|
||||
.tabs-vertical ul li{
|
||||
display: inline-block;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.tabs-vertical ul li a{
|
||||
border: 1px solid transparent;
|
||||
border-bottom: 0;
|
||||
border-top: 0;
|
||||
padding: 12px 15px;
|
||||
}
|
||||
|
||||
.tabs-vertical ul li a.tab-active {
|
||||
border-color: #dddddd;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 2px 0px 0px #EFEFEF;
|
||||
}
|
||||
|
||||
.tabs-vertical ul li:first-child a{
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
.tabs-vertical .tabs-content-placeholder{
|
||||
padding: 15px 30px 30px;
|
||||
border-left: 0;
|
||||
border-top: 1px solid #dddddd;
|
||||
box-shadow: 0px -3px 0px #F3F3F3;
|
||||
}
|
||||
|
||||
}
|
||||
/*================================================== */
|
||||
.booNavigation {
|
||||
position: relative;
|
||||
font-family: Montserrat !important;
|
||||
}
|
||||
.booNavigation li.navItem {
|
||||
width: 12.5%;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
text-align: center;
|
||||
color: #000000;
|
||||
float: left;
|
||||
|
||||
font-size: 1rem;
|
||||
text-decoration: none;
|
||||
transition: all .3s ease;
|
||||
-webkit-transition: all .5s ease;
|
||||
-moz-transition: all .5s ease;
|
||||
-ms-transition: all .5s ease;
|
||||
-o-transition: all .5s ease;
|
||||
}
|
||||
|
||||
.booNavigation li.navItem:hover {
|
||||
/*background-color: #444;*/
|
||||
/*border-color: #000;*/
|
||||
cursor: pointer;
|
||||
/*color: #45c9fc !important;*/
|
||||
}
|
||||
|
||||
.booNavigation li.navItem > a {
|
||||
color: #fff;
|
||||
padding-right:5px;
|
||||
}
|
||||
.booNavigation li.navItem > a:hover {
|
||||
/*color: #45c9fc !important;*/
|
||||
}
|
||||
|
||||
|
||||
.a1{
|
||||
width: 100% !important;
|
||||
position: relative;
|
||||
}
|
||||
.a1 div:first-child{
|
||||
background-color: white;
|
||||
border-right:1px solid grey;
|
||||
width: 30% !important;
|
||||
float: left;
|
||||
}
|
||||
.jspop{
|
||||
margin: 0 !important;
|
||||
position: fixed;
|
||||
height: auto;
|
||||
/*padding: 0 0 100px 0 !important;*/
|
||||
background-color: #f2f2f2 !important;
|
||||
max-height: 660px;
|
||||
/*box-shadow: 3px 3px 40px 3px #88909A*/
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
.booNavigation li.navItem .navContent {
|
||||
/*padding: 0 !important;*/
|
||||
background-color: #fff;
|
||||
color: black;
|
||||
left: 0;
|
||||
top: 60px;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
}
|
||||
.booNavigation li.navItem .navContent1 {
|
||||
background-color: #fff;
|
||||
color: black;
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
z-index: 9999;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 1px 0 #88909A
|
||||
}
|
||||
.booNavigation li.navItem .navContent2 {
|
||||
background-color: #fff;
|
||||
color: black;
|
||||
left: 49%;
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
z-index: 9999;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 1px 0 #88909A
|
||||
/*box-shadow: 5px 5px 10px 2px #88909A*/
|
||||
/*min-height: 220px;*/
|
||||
}
|
||||
.navContent2 li,.navContent1 li,.navContent3 li{
|
||||
width: 100%;
|
||||
padding: 0 10px;
|
||||
|
||||
}
|
||||
.booNavigation li.navItem .navContent3 {
|
||||
background-color: #fff;
|
||||
color: black;
|
||||
left: 59%;
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
width: auto !important;
|
||||
height: auto !important;
|
||||
z-index: 9999;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 1px 0 #88909A
|
||||
|
||||
}
|
||||
|
||||
.downimg{height:12px;}
|
||||
|
||||
.booNavigation .navContent > li {
|
||||
color: #fff;
|
||||
float: left;
|
||||
text-align: left;
|
||||
line-height: 1.5rem;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
.booNavigation .jspop > li {
|
||||
color: #fff;
|
||||
float: left;
|
||||
/*padding: 10px;*/
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.booNavigation .navContent ul li a {
|
||||
/*color: #fff;*/
|
||||
display: block;
|
||||
padding: 0 !important;
|
||||
line-height: 2.75rem !important;
|
||||
transition: all .3s ease;
|
||||
-webkit-transition: all .3s ease;
|
||||
-moz-transition: all .3s ease;
|
||||
-ms-transition: all .3s ease;
|
||||
-o-transition: all .3s ease;
|
||||
}
|
||||
|
||||
.booNavigation .navContent ul li a:hover {
|
||||
/*background-color: #555;*/
|
||||
/*padding-left: 2px;*/
|
||||
color: #004BFA !important;
|
||||
}
|
||||
|
||||
/** Navigation examples
|
||||
================================================== */
|
||||
.nav-example {
|
||||
clear: left;
|
||||
}
|
||||
.navItem{
|
||||
position:relative;
|
||||
|
||||
display: grid;
|
||||
grid-template-columns: auto auto; /* 设置两列 */
|
||||
align-items: center; /* 垂直居中对齐 */
|
||||
/* 可选:如果需要水平居中对齐图片和文字 */
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
#allbtntop{
|
||||
position: relative;
|
||||
}
|
||||
/*.navItem a{*/
|
||||
/* position: absolute;*/
|
||||
/* left: 35%;*/
|
||||
/*}*/
|
||||
/*.navItem .downimg{*/
|
||||
/* position: absolute;*/
|
||||
/* left: 120px;*/
|
||||
/* top: 22px;*/
|
||||
/*}*/
|
||||
/*.downimg1{*/
|
||||
/* margin-left: 130px;*/
|
||||
/* margin-top: -37px;*/
|
||||
/*}*/
|
||||
.hc_lnav .allbtn ul{z-index:99999;position:absolute;background-color:#60a411;width:190px;display:none;height:top:36px;left:0px}
|
||||
body.hc_home .hc_lnav .allbtn ul{display:block}
|
||||
body.hc_list .hc_lnav .allbtn ul{display:block}
|
||||
.allbtn ul li{zoom:1;clear:both;cursor:default; cursor: pointer;}
|
||||
.allbtn ul li .tx{line-height:35px;padding-left:10px;background-repeat:no-repeat;background-position:right center;height:35px;_background-image:none}
|
||||
.allbtn ul li .tx a{font-family:微软雅黑, 黑体;color:#ffffff;font-size:14px;-webkit-transition:color 0.1s ease-out 0s;-moz-transition:color 0.1s ease-out 0s;-ms-transition:color 0.1s ease-out 0s;-o-transition:color 0.1s ease-out 0s;transition:color 0.1s ease-out 0s}
|
||||
.allbtn ul li .tx a i{line-height:25px;margin-top:5px;width:25px;background-position:0px 0px;float:left;height:25px;margin-right:10px;text-decoration:none}
|
||||
|
||||
.allbtn ul li dl{zoom:1;color:#ffffff;clear:both;overflow:auto;padding-top:4px}
|
||||
.allbtn ul li dl a{line-height:22px;white-space:nowrap;float:left;color:#d9e7ce;margin-left:6px;margin-right:6px;-webkit-transition:color 0.1s ease-out 0s;-moz-transition:color 0.1s ease-out 0s;-ms-transition:color 0.1s ease-out 0s;-o-transition:color 0.1s ease-out 0s;transition:color 0.1s ease-out 0s}
|
||||
.allbtn ul li dt{padding-left:10px;width:30px;float:left;padding-top:1px}
|
||||
.allbtn ul li dd{line-height:22px;width:150px;float:left;padding-top:2px}
|
||||
/*二级导航隐藏*/
|
||||
.allbtn ul li .pop{position:absolute;border-left:medium none;padding-bottom:10px;background-color:#ffffff;display:none;border-top:medium none;top:0px;padding-top:10px;width:70%;padding-left:20px }
|
||||
.allbtn ul li .pop1{position:absolute;border-left:medium none;padding-bottom:10px;background-color:#ffffff;display:block ;border-top:medium none;top:0px;padding-top:10px;width:70%;padding-left:20px ;left:30%}
|
||||
.allbtn ul li .pop h3{display:none;font-size:14px}
|
||||
.allbtn ul li .pop dl{padding-bottom:6px;color:#666666;padding-top:6px}
|
||||
/*.allbtn ul li .pop dl:hover{background-color:#f3f3f3}*/
|
||||
.allbtn ul li .pop dl a{color:#666666;margin-left:12px;margin-right:12px}
|
||||
.allbtn ul li .pop dl a.un{color:#a5a5a5}
|
||||
.allbtn ul li .pop dt{padding-left:0px;width:72px;}
|
||||
.allbtn ul li .pop dd{width:100%;margin-left:-12px;}
|
||||
.allbtn ul li .pop .act{width:100%;height:80px;overflow:hidden;padding-top:10px}
|
||||
|
||||
.allbtn:hover ul{display:block}/*控制一级菜单显示隐藏*/
|
||||
/*.allbtn ul li:hover{background-color:#fcfcfc}*/
|
||||
.allbtn ul li:hover .tx{background-color:#f5f5f5}
|
||||
.allbtn ul li:hover .tx a{color:#333333}
|
||||
.allbtn ul li:hover .tx a i{background-position:0px -25px}
|
||||
/*控制二级菜单显示隐藏*/
|
||||
.allbtn ul li:hover .pop{display:block;top:0px;left:30%}
|
||||
.allbtn ul li:hover .pop dl a.un{color:#a5a5a5;text-decoration:none}
|
||||
.allbtn ul li:hover dl{color:#6e6e6e}
|
||||
.allbtn ul li:hover a{color:#666666}
|
||||
.allbtn ul li:hover a:hover{color:#004BFA}
|
||||
|
||||
|
||||
.modal-fade-enter-active {
|
||||
animation: dialog-fade-in .3s;
|
||||
}
|
||||
|
||||
.modal-fade-leave-active {
|
||||
animation: dialog-fade-out .3s;
|
||||
}
|
||||
|
||||
@keyframes dialog-fade-in {
|
||||
0% {
|
||||
transform: translate3d(0, -20px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dialog-fade-out {
|
||||
0% {
|
||||
transform: translate3d(0, 0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translate3d(0, -20px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.m-modal__wrapper {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
margin: 0;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
}
|
||||
|
||||
.m-modal__container {
|
||||
width: 25%;
|
||||
position: relative;
|
||||
margin: 0 auto 50px;
|
||||
background: #fff;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
|
||||
box-sizing: border-box;
|
||||
margin-top: 15vh;
|
||||
animation: dialog-fade-in .3s;
|
||||
}
|
||||
|
||||
.m-modal__header {
|
||||
padding: 20px 20px 10px;
|
||||
}
|
||||
|
||||
.m-modal__title {
|
||||
line-height: 24px;
|
||||
font-size: 18px;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
button {
|
||||
-webkit-appearance: button;
|
||||
-webkit-writing-mode: horizontal-tb !important;
|
||||
text-rendering: auto;
|
||||
letter-spacing: normal;
|
||||
word-spacing: normal;
|
||||
text-transform: none;
|
||||
text-indent: 0px;
|
||||
text-shadow: none;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
align-items: flex-start;
|
||||
cursor: default;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.m-modal__headerbtn {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
padding: 0;
|
||||
background: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.m-modal__close {
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.m-modal__headerbtn:hover .m-modal__close {
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
.m-modal__body {
|
||||
padding: 30px 20px;
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.m-modal__footer {
|
||||
padding: 10px 20px 20px;
|
||||
text-align: right;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.m-modal__footer button:first-child {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.m-modal-button {
|
||||
display: none;
|
||||
line-height: 1;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
background: #fff;
|
||||
border: 1px solid #dcdfe6;
|
||||
color: #606266;
|
||||
-webkit-appearance: none;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
margin: 0;
|
||||
transition: .1s;
|
||||
font-weight: 500;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
padding: 12px 20px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
|
||||
.head-nav{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
/* height: 60px; */
|
||||
/*background: rgba(255,255,255,0.2);*/
|
||||
display: flex;
|
||||
z-index: 99999;
|
||||
max-width:1920px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
@media screen and (min-width:1930px){
|
||||
.head-nav{
|
||||
left: 50%;
|
||||
display: flex;
|
||||
z-index: 99999;
|
||||
max-width:1980px;
|
||||
margin: 0 auto;
|
||||
margin-left: -990px;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-1{
|
||||
position: relative;
|
||||
width: 20%;
|
||||
background-color: transparent;
|
||||
}
|
||||
.nav-1 img{
|
||||
margin-left: 50%;
|
||||
/*height: 60px;*/
|
||||
width:45%;
|
||||
margin-top:10px;
|
||||
}
|
||||
@media screen and (max-width:1459px){
|
||||
.nav-1 img{
|
||||
margin-top:15px;
|
||||
}
|
||||
}
|
||||
.nav-2{
|
||||
width: 60%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.nav-3{
|
||||
position: relative;
|
||||
width: 20%;
|
||||
background-color: transparent;
|
||||
display: flex;
|
||||
|
||||
}
|
||||
.nav-3 div{
|
||||
width: 10%;
|
||||
position: relative;
|
||||
margin-left:15%;
|
||||
}
|
||||
.nav-3 .searchimg{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 5%;
|
||||
}
|
||||
.nav-3 .checkimg{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 20%;
|
||||
margin-top: -10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.nav-3 .checkimg:hover .top-country{
|
||||
display: block;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
#top-country{
|
||||
width: 330px;
|
||||
/*height: 100px;*/
|
||||
background-color: white;
|
||||
position: fixed;
|
||||
right: 5%;
|
||||
top: 60px;
|
||||
border-radius: 15px;
|
||||
box-shadow: 2px 2px 10px 1px #88909A;
|
||||
}
|
||||
#top-country li{
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
/*background-color: red;*/
|
||||
text-align: center;
|
||||
}
|
||||
.desktopli{
|
||||
display: flex;
|
||||
/*border: 1px solid red;*/
|
||||
}
|
||||
.desktopli1{
|
||||
height: 30px !important;
|
||||
}
|
||||
|
||||
.desktopli .desktop-2{
|
||||
width: 22%;
|
||||
margin-left: 0;
|
||||
}
|
||||
.desktopli .desktop-2 img{
|
||||
margin-left: 20px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.desktopli .desktop-10{
|
||||
font-family: Montserrat !important;
|
||||
font-size: 1rem;
|
||||
width: 70%;
|
||||
text-align: left;
|
||||
|
||||
margin-left: 10px;
|
||||
}
|
||||
.openModalBtn{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.modal_1 {
|
||||
font-family: Montserrat !important;
|
||||
margin-top: 5%;
|
||||
margin-left: 10%;
|
||||
width: 80%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.modal_2 {
|
||||
font-family: Montserrat !important;
|
||||
margin-top: 5%;
|
||||
margin-left: 10%;
|
||||
width: 80%;
|
||||
display: flex;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
}
|
||||
.modal_1 div{
|
||||
margin-top: 10%;
|
||||
margin-left: 1%;
|
||||
|
||||
}
|
||||
.modal_2 div{
|
||||
text-align: center;
|
||||
margin-top: 10%;
|
||||
margin-left: 1%;
|
||||
|
||||
}
|
||||
.modal_2 .title{
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
/*height: 45px;*/
|
||||
overflow: hidden; /* 隐藏溢出部分的文字 */
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1; /* 显示两行 */
|
||||
-webkit-box-orient: vertical; /* 文本在垂直方向排列 */
|
||||
}
|
||||
|
||||
.modal_2 .title p{
|
||||
margin:0;
|
||||
padding: 0;
|
||||
}
|
||||
.modal_2 .title :hover{
|
||||
overflow: visible;
|
||||
}
|
||||
.modal_2 .subtitle{
|
||||
margin-top: 0;
|
||||
font-size: 10px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.tit1{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 1%;
|
||||
font-size: 16px;
|
||||
color: #989898;
|
||||
}
|
||||
|
||||
|
||||
/* 背景模态框样式 */
|
||||
.modal {
|
||||
/*display: none;*/
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
/* 弹出框内容样式 */
|
||||
.modal-content {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
||||
position: fixed !important;
|
||||
right: 2%;
|
||||
width: 35%;
|
||||
top: 60px;
|
||||
height: 80%;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
/* 关闭按钮样式 */
|
||||
.close-btn {
|
||||
color: #aaa;
|
||||
float: right;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.close-btn1 {
|
||||
color: #aaa;
|
||||
float: right;
|
||||
margin-top: -5px;
|
||||
cursor: pointer;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
margin-right: 10px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.close-btn:hover {
|
||||
color: #000;
|
||||
}
|
||||
.picture21{
|
||||
width: 33%;
|
||||
/*border: 1px solid red;*/
|
||||
}
|
||||
.picture21-img{
|
||||
width: 7.1875rem;
|
||||
height: 7.1875rem;
|
||||
margin-left: 13%;
|
||||
}
|
||||
63
public/frontend/web/css/bottom-product.css
Executable file
63
public/frontend/web/css/bottom-product.css
Executable file
@@ -0,0 +1,63 @@
|
||||
/*底部*/
|
||||
.footer_all{width:100%; background-color:#2e2e2e; }
|
||||
.footer_all a{text-decoration:none; color:#999999;}
|
||||
.footer_all a:hover{text-decoration:none; color:#00c9ee;}
|
||||
.footer{margin-left:auto; margin-right:auto; }
|
||||
.footer .footl{float: left;}
|
||||
.footer .footr{float: right; text-align: right;}
|
||||
|
||||
.footer dl{width:18%; margin-left:2%; float:left; margin-bottom: 40px; }
|
||||
.footer dl:first-child{margin-left:0px;}
|
||||
.footer dl dt{color:#ffffff; font-size:0.9em; font-weight: 100; width:100%;}
|
||||
.footer dl dd{color:#8a8a8a; padding-top:10px; padding-left:17px; font-size:0.85em; width:100%;}
|
||||
.footer_bottom{background-color:#252525; text-align: center; color:#fefefe; font-size:0.8em; line-height: 30px; padding-top:15px; padding-bottom: 15px;}
|
||||
.bottom_cn_box {background-color: #ffffff; border: 1px solid #bdbaba; display: none; height: 140px; margin-left: -250px; margin-top: -70px; overflow: hidden;
|
||||
position: absolute; width: 240px;}
|
||||
.bottom_cn_box ul li{float:left; padding-left:10px; padding-top:0px;}
|
||||
.bottom_cn_icon_box {float: left; margin-top: 10px;}
|
||||
.bottom_cn_icon_box div {position: relative;}
|
||||
.bottom_cn_icon_text {display: block; font-size: 12px; text-align: center; color:#333;}
|
||||
@media screen and (max-width:767px){
|
||||
.bottom_cn_box {background-color: #ffffff; border: 1px solid #bdbaba; display: none; height: 140px; margin-left: -250px; margin-top: -70px; overflow: hidden; position: absolute; width: 240px; left:320px;}
|
||||
}
|
||||
.footr-icon{width:2em; height: 2em; background-color:#575757; border-radius: 1em; text-align: center; line-height: 2em; color:#FFF; font-size: 1.125em; float: right; margin-left: 0.5em; margin-bottom: 10px; }
|
||||
.footer .footr .rha{margin-bottom: 10px;}
|
||||
.footer .footr p{color:#FFF; font-size: 0.85em;}
|
||||
@media screen and (min-width:1200px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:1200px; padding-top:60px;}
|
||||
.footer .footl{width:940px;}
|
||||
.footer .footr{width:260px;}
|
||||
}
|
||||
@media screen and (min-width:769px) and (max-width:1199px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:96%; padding-top:40px;}
|
||||
.footer .footl{width:100%;}
|
||||
.footer .footr{display: none;}
|
||||
.footer dl{width:18.4%;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.footer{width:100%; padding-top:20px;}
|
||||
.footer .footl{width:100%;}
|
||||
.footer dl{width:100%; border-bottom:1px solid rgba(0,0,0,0.5); margin-bottom: 0px; padding-left:20px; line-height: 3em; margin-left:0;}
|
||||
.footer dl dt{width:100%;}
|
||||
.footer dl dd{display: none; padding-top:0;}
|
||||
.footer .footr{display: none;}
|
||||
}
|
||||
.wx_fl li {float: right; margin-right:5%;}
|
||||
.footer dl dt p{display: inline-block; position: relative; margin-right:3px;}
|
||||
.footer dl dt span{display: inline-block; position: absolute; right:10px;}
|
||||
.footer dl dt .arrow{
|
||||
transform: rotate(180deg);
|
||||
-ms-transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
-webkit-transform: rotate(180deg);
|
||||
-o-transform: rotate(180deg);
|
||||
}
|
||||
.footer dl dt .arrow-r{
|
||||
transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-webkit-transform: rotate(360deg);
|
||||
-o-transform: rotate(360deg);
|
||||
}
|
||||
88
public/frontend/web/css/bottom.css
Executable file
88
public/frontend/web/css/bottom.css
Executable file
@@ -0,0 +1,88 @@
|
||||
/*底部*/
|
||||
.footer_all{width:100%; background-color:#2e2e2e; }
|
||||
.footer_all a{text-decoration:none; color:#999999;}
|
||||
.footer_all a:hover{text-decoration:none; color:#00c9ee;}
|
||||
.footer{margin-left:auto; margin-right:auto; }
|
||||
.footer .footl{float: left;}
|
||||
.footer .footr{text-align: right;width:300px; float: right;}
|
||||
|
||||
.footer dl{width:18%; margin-left:2%; float:left; margin-bottom: 40px; }
|
||||
.footer dl:first-child{margin-left:0px;}
|
||||
.footer dl dt{color:#ffffff; font-size:0.9em; font-weight: 100; width:100%;}
|
||||
.footer dl dd{color:#8a8a8a; padding-top:10px; padding-left:17px; font-size:0.85em; width:100%;}
|
||||
|
||||
|
||||
.footer_bottom{background-color:#252525; text-align: center; color:#fefefe; font-size:0.75em; line-height: 30px; padding-top:15px; padding-bottom: 15px;}
|
||||
.bottom_cn_box {background-color: #ffffff; border: 1px solid #bdbaba; display: none; height: 140px; margin-left: -250px; margin-top: -70px; overflow: hidden;
|
||||
position: absolute; width: 240px;}
|
||||
.bottom_cn_box ul li{float:left; padding-left:10px; padding-top:0px;}
|
||||
.bottom_cn_icon_box {float: left; margin-top: 10px;}
|
||||
.bottom_cn_icon_box div {position: relative;}
|
||||
.bottom_cn_icon_text {display: block; font-size: 12px; text-align: center; color:#333;}
|
||||
@media screen and (max-width:767px){
|
||||
.bottom_cn_box {background-color: #ffffff; border: 1px solid #bdbaba; display: none; height: 140px; margin-left: -250px; margin-top: -70px; overflow: hidden; position: absolute; width: 240px; left:320px;}
|
||||
}
|
||||
.footr-icon{width:1.8em; height: 1.8em; background-color:#575757; border-radius: 1em; text-align: center; line-height: 1.8em; color:#FFF; font-size: 1.5em; float: left; margin-left: 0.6vw; margin-bottom: 10px; }
|
||||
.footer .footr .rha{margin-bottom: 10px; position: relative;}
|
||||
.footer .footr p{color:#FFF; font-size: 0.85em;}
|
||||
@media screen and (min-width:1480px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:1400px; padding-top:60px;}
|
||||
.footer .footl{width:1100px;}
|
||||
.footer .footr{ text-align: center;}
|
||||
}
|
||||
@media screen and (min-width:1200px) and (max-width:1479px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:96%; padding-top:40px;}
|
||||
.footer .footl{width:80%%;}
|
||||
.footer .footr{width:20%;}
|
||||
.footer dl{width:18.4%;}
|
||||
}
|
||||
@media screen and (min-width:769px) and (max-width:1199px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:96%; padding-top:40px;}
|
||||
.footer .footl{width:100%;}
|
||||
.footer .footr{display: none;}
|
||||
.footer dl{width:18.4%;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:768px){
|
||||
.footer{width:100%; padding-top:20px;}
|
||||
.footer .footl{width:100%;}
|
||||
.footer dl{width:100%; border-bottom:1px solid rgba(0,0,0,0.5); margin-bottom: 0px; padding-left:20px; line-height: 3em; margin-left:0;}
|
||||
.footer dl dt{width:100%;}
|
||||
.footer dl dd{display: none; padding-top:0;}
|
||||
.footer .footr{display: none;}
|
||||
}
|
||||
|
||||
.wx_fl {}
|
||||
.wx_fl li {float: right; margin-right:5%;}
|
||||
.footer dl dt p{display: inline-block; position: relative; margin-right:3px;}
|
||||
.footer dl dt span{display: inline-block; position: absolute; right:10px;}
|
||||
.footer dl dt .arrow{
|
||||
transform: rotate(180deg);
|
||||
-ms-transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
-webkit-transform: rotate(180deg);
|
||||
-o-transform: rotate(180deg);
|
||||
}
|
||||
.footer dl dt .arrow-r{
|
||||
transform: rotate(360deg);
|
||||
-ms-transform: rotate(360deg);
|
||||
-moz-transform: rotate(360deg);
|
||||
-webkit-transform: rotate(360deg);
|
||||
-o-transform: rotate(360deg);
|
||||
}
|
||||
|
||||
/*底部图标弹出*/
|
||||
.footr .rha a{display: inline-block;}
|
||||
.weixin_href{position: relative;}
|
||||
.weixin-show{position: absolute; display: none; bottom:4em; left:-40px;width:126px; height: 126px;}
|
||||
.weixin_href:hover .weixin-show{display: block;}
|
||||
|
||||
|
||||
.weixin_clearfix{_zoom:1;}
|
||||
|
||||
.weixin_clearfix:after{content: '';display:block; clear:both; height: 0; visibility:visible;}
|
||||
|
||||
.weixin_clearfix{*zoom:1;}
|
||||
8452
public/frontend/web/css/css_whir.css
Executable file
8452
public/frontend/web/css/css_whir.css
Executable file
File diff suppressed because it is too large
Load Diff
2336
public/frontend/web/css/css_whir20191030.css
Executable file
2336
public/frontend/web/css/css_whir20191030.css
Executable file
File diff suppressed because it is too large
Load Diff
2360
public/frontend/web/css/css_whir20191119.css
Executable file
2360
public/frontend/web/css/css_whir20191119.css
Executable file
File diff suppressed because it is too large
Load Diff
42
public/frontend/web/css/examples.css
Executable file
42
public/frontend/web/css/examples.css
Executable file
@@ -0,0 +1,42 @@
|
||||
|
||||
/* Example 5 */
|
||||
|
||||
#example5 .sp-thumbnail-image-container {
|
||||
width:80px;
|
||||
height: 100px;
|
||||
overflow: hidden;
|
||||
float:none;
|
||||
}
|
||||
|
||||
#example5 .sp-thumbnail-image {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
#example5 .sp-thumbnail-description {
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
#example5 .sp-thumbnail {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#example5 .sp-thumbnail-image-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#example5 .sp-thumbnail-text {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
#example5 .sp-thumbnail-title {
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#example5 .sp-thumbnail-description {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
BIN
public/frontend/web/css/fonts-20190124/icomoon.eot
Executable file
BIN
public/frontend/web/css/fonts-20190124/icomoon.eot
Executable file
Binary file not shown.
15
public/frontend/web/css/fonts-20190124/icomoon.svg
Executable file
15
public/frontend/web/css/fonts-20190124/icomoon.svg
Executable file
@@ -0,0 +1,15 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Generated by IcoMoon</metadata>
|
||||
<defs>
|
||||
<font id="icomoon" horiz-adv-x="1024">
|
||||
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||
<missing-glyph horiz-adv-x="1024" />
|
||||
<glyph unicode=" " horiz-adv-x="512" d="" />
|
||||
<glyph unicode="" glyph-name="Forum" d="M791.5 129h-542.5l0.1 358.3h-156.3l425.6 376.1 413.4-376.1h-140.4l0.1-358.3zM299 179h442.4l-0.1 358.3h61.1l-284.6 259-293-259h74.2v-358.3zM519.3 233.1c-4.4 0-8.9 1.2-12.8 3.6-1.6 0.9-38.9 23.4-76.7 56-54.4 46.8-82 90.5-82 129.9 0 64.1 52.1 116.2 116.2 116.2 19.6 0 38.5-4.8 55.4-14 16.9 9.2 35.7 14 55.4 14 64.1 0 116.2-52.1 116.2-116.2 0-39.9-27.6-83.8-82-130.4-37.9-32.4-75.3-54.6-76.8-55.6-4.1-2.3-8.5-3.5-12.9-3.5zM463.9 488.7c-36.5 0-66.2-29.7-66.2-66.2 0-23.4 22.8-55.9 64.1-91.6 21.9-18.9 44.1-34.4 57.6-43.3 13.4 8.8 35.6 24.1 57.5 42.9 41.3 35.5 64 68.1 64 92 0 36.5-29.7 66.2-66.2 66.2-14.7 0-28.6-4.7-40.2-13.6-9-6.9-21.4-6.9-30.4 0-11.6 8.9-25.5 13.6-40.2 13.6z" />
|
||||
<glyph unicode="" glyph-name="sina" horiz-adv-x="1063" d="M921.995 408.309c-27.375 65.622-95.313 74.127-114.373 77.251-19.25 3.246-35.876 13.122-16.314 32.748 13.813 13.876 19.002 54.627 15.064 68.375-3.939 13.751-9.624 64.623-105.874 67.124-69.879 2.002-152.752-45.874-161.627-37.373-12.565 11.624 16.877 37.373 12.751 78.622-4.003 41.001-18.875 49.627-38.501 62.751-19.626 13.249-73.75 23.375-168.376-23.377-101.063-50.126-207.253-181.623-244.503-229.249-35.498-45.378-155.252-256.376 84.251-382.754 239.627-126.376 544.128-39.376 638.253 47.375 91.252 84.128 125.501 175.755 99.249 238.505zM488.306 143.183c-166.814-22.749-314 46.999-328.688 155.752-14.875 108.5 108.373 215.124 275.251 237.751 166.812 22.622 314-47.129 328.815-155.751 14.686-108.628-108.564-215.128-275.378-237.752zM597.744 346.561c-15.060 75.372-99.5 122.122-188.624 104.122-89.188-17.752-149.251-93.249-134.188-168.624 14.936-75.251 99.5-122.001 188.561-104.249 89.251 18 149.25 93.375 134.251 168.751zM395.869 243.433c-31.376-7.377-61.876 7.999-68.062 34.25-6.127 26.25 14.437 53.5 45.937 60.874 31.499 7.372 61.998-8.001 68.125-34.126 6.127-26.249-14.377-53.624-46-60.998zM474.742 323.809c-12.997-2.877-25.496 3.496-27.812 14.247-2.312 10.75 6.438 21.627 19.562 24.502 13.126 2.751 25.562-3.626 27.812-14.251 2.314-10.872-6.435-21.749-19.562-24.498zM899.246 700.185c-29.749 40.749-94.811 50.75-119.374 44.999-24.625-5.747-37.125-17.25-37.125-36.999 0-19.625 12.876-30.753 42.314-29.251 31.44 1.501 46.685-11.499 61.064-29.499 14.248-18.002 10.622-44.877 8.372-63.128-2.247-18.377 11.75-38.871 30.752-38.871 18.936 0 31.375 8.247 34.251 22.746 19.247 63.503-0.251 105.753-20.252 130.003zM961.371 823.936c-96.689 76.749-200.375 58.125-216.251 55.124-15.937-2.876-37.626-18.873-37.626-40.376 0-22.622 18.251-40.75 40.812-40.75 4.941 0 68.501 28.376 163.939-34.873 95.379-63.376 61.377-212.504 61.377-215.626 0-22.627 18.186-40.877 40.749-40.877 22.501 0 35.25 19.001 40.689 41.625 24.003 111.251-7.75 207.375-93.689 275.753z" />
|
||||
<glyph unicode="" glyph-name="toutiao" d="M891 832h-760c-37.555 0-68-30.445-68-68v-632c0-37.556 30.445-68 68-68h760c37.556 0 68 30.444 68 68v632c0 37.555-30.444 68-68 68zM895 142c0-8.284-6.207-15-14.48-15h-738.040c-8.273 0-15.48 6.716-15.48 15v610c0 8.284 7.207 15 15.48 15h738.040c8.273 0 14.48-6.716 14.48-15v-610zM237.652 383h164.745c25.214 0 45.603 21.175 45.603 46.679v228.642c0 25.504-20.389 45.679-45.603 45.679h-164.745c-25.213 0-45.652-20.175-45.652-45.679v-228.643c0-25.503 20.439-46.678 45.652-46.678zM257 639h126v-191h-126v191zM543.601 640h255.799c17.729 0 32.101 14.327 32.101 32s-14.372 32-32.101 32h-255.799c-17.729 0-32.101-14.327-32.101-32s14.372-32 32.101-32zM543.601 512h255.799c17.729 0 32.101 14.327 32.101 32s-14.372 32-32.101 32h-255.799c-17.729 0-32.101-14.327-32.101-32s14.372-32 32.101-32zM543.601 384h255.799c17.729 0 32.101 14.326 32.101 32s-14.372 32-32.101 32h-255.799c-17.729 0-32.101-14.326-32.101-32s14.372-32 32.101-32zM608.040 256h-384.080c-17.651 0-31.96-14.309-31.96-31.959v-0.082c0-17.65 14.309-31.959 31.96-31.959h384.080c17.651 0 31.96 14.309 31.96 31.959v0.082c0 17.65-14.309 31.959-31.96 31.959zM800.095 256h-64.189c-17.622 0-31.906-14.285-31.906-31.906v-0.188c0-17.621 14.284-31.906 31.905-31.906h64.189c17.622 0 31.906 14.285 31.906 31.906v0.188c0 17.621-14.284 31.906-31.905 31.906z" />
|
||||
<glyph unicode="" glyph-name="weixin" d="M836.992 126.908c-2.963 8.818-5.536 16.463-5.536 31.334 0 11.195 3.232 13.549 11.708 19.688 5.113 3.705 12.445 9.029 22.549 19.5 28.636 29.645 45.994 49.755 56.094 72.748 10.072 22.94 13.084 49.157 13.084 91.108 0 47.781-29.726 95.191-74.967 130.644-45.22 35.419-105.861 58.844-167.939 58.844-65.433 0-118.502-20.123-157.831-51.443-33.288-26.519-56.788-61.087-69.638-98.267-12.844-37.164-15.077-76.929-5.881-113.873 9.648-38.764 31.927-74.482 67.743-100.862 31.786-23.42 69.3-40.893 109.139-49.869 37.347-8.423 76.778-9.384 115.485-0.794 48.493 10.756 53.097 6.294 62.281-2.658 4.596-4.475 10.544-10.268 26.669-15.482-0.981 3.492-1.991 6.508-2.96 9.382zM199.972 299.082c-2.583-7.112-5.18-14.244-6.497-24.561 11.114 3.436 20.963 9.233 30.715 14.969 19.239 11.33 38.19 22.477 66.625 16.781 22.712-4.556 39.454-7.719 57.193-9.734 16.541-1.881 34.031-2.768 58.17-2.874-6.163 15.779-8.378 34.656-7.948 53.867 0.574 25.79 5.923 52.332 12.801 72.813 18.38 54.622 41.42 75.901 76.153 107.972l1.917 1.773c4.285 3.951 6.784 6.238 9.451 8.392l-0.004 0.006c2.557 2.074 5.341 4.065 10.236 7.489 24.122 16.864 49.403 29.932 77.065 38.776 26.51 8.476 55.21 13.088 87.143 13.463-4.534 18.525-11.121 35.914-19.442 52.080-30.634 59.564-84.974 102.816-148.25 127.434-63.414 24.66-135.779 30.628-202.337 15.58-24.678-5.577-48.553-14.055-70.854-25.525-47.982-24.68-84.285-56.546-108.927-92.254-23.632-34.237-36.58-72.062-38.872-110.5-2.288-38.448 6.062-77.581 25.010-114.421 20.239-39.358 52.595-76.143 96.96-106.761l1.482-1.025v-1.822c0.002-20.456-3.894-31.179-7.79-41.918zM71.684 416.997c-23.233 42.377-38.019 91.377-38.019 137.208 0 37.262 11.725 77.678 30.396 114.663 19.749 39.12 47.337 74.513 77.080 98.369 68.154 54.687 146.687 82.913 226.089 85.362 80.43 2.487 161.75-21.46 234.078-71.083 31.082-21.308 54.918-44.518 73.767-70.967 18.815-26.417 32.641-56.055 43.71-90.275 6.818-21.019 8.939-21.249 21.616-22.592 4.625-0.49 10.483-1.117 18.104-2.629 25.884-5.144 51.909-13.807 76.083-25.558 23.139-11.246 44.626-25.35 62.721-41.952 12.706-11.659 24.552-23.214 35.279-35.871 10.764-12.711 20.326-26.457 28.366-42.393 20.433-40.508 30.012-77.904 28.57-115.023-1.441-37.111-13.915-73.831-37.543-112.957-7.759-12.84-20.733-28.925-34.685-43.82-13.413-14.334-27.788-27.634-39.342-35.95 4.43-19.004 9.323-32.368 13.202-42.957 7.82-21.377 11.762-32.136 0.749-53.599l-1.029-2.007-2.183 0.188c-18.389 1.579-29.877 8.984-42.545 17.139l-4.193 2.687v-0.008c-4.587 3.009-10.752 6.721-17.032 10.255l-1.841 0.952c-5.977 3.322-12.335 6.673-19.297 10.332-17.021 8.948-17.521 8.818-31.867 4.849-3.139-0.867-6.904-1.913-12.16-3.22-31.957-7.967-44.279-7.841-69.983-7.568-4.633 0.049-9.783 0.103-17.497 0.103-51.612 0-110.596 22.585-158.919 55.796-46.877 32.214-83.886 74.556-94.68 116.157-20.878-4.629-42.163-5.671-63.2-4.519-22.016 1.196-43.779 4.819-64.525 9.229-32.779 6.978-58.976-10.133-83.982-26.47-16.251-10.616-32.048-20.933-49.212-24.657-14.853-3.225-21.944 1.828-24.128 11.907-3.273 15.063 6.589 42.143 15.858 67.591 4.669 12.815 9.196 25.235 11.718 35.222-34.147 19.431-66.147 55.435-89.524 98.058v0.008zM444.804 608.862c-7.582 8.671-12.687 20.77-12.687 35.727 0 8.626 6.31 17.854 15.071 24.878 8.761 7.018 20.123 11.999 30.027 11.999 23.384 0 37.988-11.018 44.371-25.248 2.536-5.64 3.758-11.81 3.709-18v-0.013c-0.054-6.557-1.486-12.766-4.020-18.369l0.116 0.286c-6.651-14.975-21.639-26.81-44.176-26.81-11.423 0-23.604 5.464-32.411 15.55zM230.392 608.855c-7.576 8.678-12.687 20.771-12.687 35.733 0 8.626 6.31 17.854 15.077 24.878 8.754 7.018 20.117 11.999 30.027 11.999 23.099 0 37.486-10.987 43.779-25.205 2.498-5.646 3.703-11.818 3.654-17.994-0.055-6.548-1.466-12.753-3.966-18.366l0.117 0.293c-6.569-15.003-21.381-26.881-43.584-26.881-11.423 0-23.609 5.458-32.417 15.543zM636.29 358.868c-5.252-11.199-16.943-19.781-35.409-19.781-18.768 0-30.040 8.59-34.934 19.81l2.866 1.331-2.866-1.319c-2.015 4.625-2.923 9.705-2.809 14.799 0.114 5.063 1.258 10.165 3.302 14.83 5.406 12.318 17.184 22.028 33.797 21.755 18.441-0.293 30.638-9.933 36.053-21.999 1.998-4.346 3.169-9.427 3.184-14.781v-0.005c0.011-5.041-1.043-10.072-3.184-14.64zM753.611 341.611c-11.773 4.742-20.697 15.774-20.697 34.358 0 16.532 8.822 26.209 20.514 30.337 4.702 1.653 9.893 2.386 15.14 2.275 5.543-0.126 10.815-1.111 15.745-2.828l-0.36 0.109c13.878-4.719 25.154-15.336 25.154-29.894 0-16.654-11.041-28.59-24.703-33.927-4.921-1.918-10.234-2.988-15.485-3.099-5.289-0.107-10.545 0.751-15.308 2.669z" />
|
||||
<glyph unicode="" glyph-name="douyin" d="M899.871 646.376c-0.27 11.331-0.058 22.662-0.12 34-14.861 0.386-29.738 1.576-44.282 4.798-24.783 5.188-48.431 15.194-69.881 28.589-1.403 1.55-2.742 3.2-4.523 4.315-29.232 17.692-52.109 44.711-67.773 74.863-9.959 19.52-17.887 40.259-22.055 61.83-0.202 0.012-0.625 0.023-0.822 0.034-2.133 12.861-3.724 25.87-3.38 38.932-51.090 0.035-102.175-0.045-153.261 0.047-0.235-74.152 0.294-148.331-0.344-222.469 0.011-129.442-0.012-258.894 0.021-388.337-0.057-42.995-23.76-84.792-60.226-107.399-37.604-24.117-88.465-26.468-127.523-4.513-14.324 8.726-27.779 19.091-38.661 31.928-16.137 18.436-26.409 41.828-29.209 66.153-2.483 25.019 1.449 50.97 13.118 73.39 6.747 13.263 16.269 25.055 27.658 34.61 18.583 15.7 41.413 25.792 64.998 31.267 19.749 4.756 41.074 4.907 60.371-1.881 0.051 25.515 0.015 51.017 0.027 76.529-0.234 14.937 0.467 29.904-0.367 44.816-0.494 11.964-0.079 23.957-0.2 35.939-63.866 9.252-130.688-4.919-185.48-38.944-37.885-23.278-70.060-55.71-93.207-93.663-25.388-41.483-39.706-89.672-40.97-138.303-1.729-52.86 11.911-106.164 38.953-151.634 20.164-33.945 47.298-63.94 79.696-86.557 0.523-0.438 1.547-1.321 2.063-1.77 30.365-21.45 65.124-36.407 101.469-44.132 25.762-5.596 52.287-7.167 78.588-6.337 51.924 1.351 103.387 18.577 145.208 49.471 32.364 23.578 59.154 54.455 79.254 89.015 23.11 39.995 37.835 85.092 40.976 131.259 0.919 12.577 0.34 25.185 0.316 37.774-0.776 94.574-0.941 189.153-0.919 283.737 60.975-43.356 135.798-67.105 210.621-66.433-0.057 39.694 0.236 79.389-0.137 119.074z" />
|
||||
</font></defs></svg>
|
||||
|
After Width: | Height: | Size: 10 KiB |
BIN
public/frontend/web/css/fonts-20190124/icomoon.ttf
Executable file
BIN
public/frontend/web/css/fonts-20190124/icomoon.ttf
Executable file
Binary file not shown.
BIN
public/frontend/web/css/fonts-20190124/icomoon.woff
Executable file
BIN
public/frontend/web/css/fonts-20190124/icomoon.woff
Executable file
Binary file not shown.
BIN
public/frontend/web/css/fonts-20220322/icomoon.eot
Executable file
BIN
public/frontend/web/css/fonts-20220322/icomoon.eot
Executable file
Binary file not shown.
12
public/frontend/web/css/fonts-20220322/icomoon.svg
Executable file
12
public/frontend/web/css/fonts-20220322/icomoon.svg
Executable file
@@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Generated by IcoMoon</metadata>
|
||||
<defs>
|
||||
<font id="icomoon" horiz-adv-x="1024">
|
||||
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||
<missing-glyph horiz-adv-x="1024" />
|
||||
<glyph unicode=" " horiz-adv-x="512" d="" />
|
||||
<glyph unicode="" glyph-name="caret-down" d="M840.4 660h-656.8c-19.7 0-30.7-20.8-18.5-35l328.4-380.8c9.4-10.9 27.5-10.9 37 0l328.4 380.8c12.2 14.2 1.2 35-18.5 35z" />
|
||||
<glyph unicode="" glyph-name="caret-up" d="M858.9 271l-328.4 380.8c-9.4 10.9-27.5 10.9-37 0l-328.4-380.8c-12.2-14.2-1.2-35 18.5-35h656.8c19.7 0 30.7 20.8 18.5 35z" />
|
||||
</font></defs></svg>
|
||||
|
After Width: | Height: | Size: 785 B |
BIN
public/frontend/web/css/fonts-20220322/icomoon.ttf
Executable file
BIN
public/frontend/web/css/fonts-20220322/icomoon.ttf
Executable file
Binary file not shown.
BIN
public/frontend/web/css/fonts-20220322/icomoon.woff
Executable file
BIN
public/frontend/web/css/fonts-20220322/icomoon.woff
Executable file
Binary file not shown.
220
public/frontend/web/css/fonts.css
Executable file
220
public/frontend/web/css/fonts.css
Executable file
@@ -0,0 +1,220 @@
|
||||
@font-face {
|
||||
font-family: 'icomoon';
|
||||
src: url('fonts/icomoon/icomoon.eot?ujw7hy');
|
||||
src: url('fonts/icomoon/icomoon.eot?ujw7hy#iefix') format('embedded-opentype'), url('fonts/icomoon/icomoon.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/icomoon/icomoon.woff?ujw7hy') format('woff'), url('fonts/icomoon/icomoon.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
[class^='icon-'],
|
||||
[class*=' icon-'] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon';
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-Collection:before {
|
||||
content: '\e900';
|
||||
}
|
||||
.icon-culture-P:before {
|
||||
content: '\e901';
|
||||
}
|
||||
.icon-facebook:before {
|
||||
content: '\e902';
|
||||
}
|
||||
.icon-in:before {
|
||||
content: '\e903';
|
||||
}
|
||||
.icon-twitter:before {
|
||||
content: '\e904';
|
||||
}
|
||||
.icon-youtobe:before {
|
||||
content: '\e905';
|
||||
}
|
||||
.icon-country:before {
|
||||
content: '\e90a';
|
||||
}
|
||||
.icon-menu:before {
|
||||
content: '\e906';
|
||||
}
|
||||
.icon-arrow:before {
|
||||
content: '\e907';
|
||||
}
|
||||
.icon-r-arrow:before {
|
||||
content: '\e907';
|
||||
}
|
||||
.icon-close:before {
|
||||
content: '\e909';
|
||||
}
|
||||
.icon-search:before {
|
||||
content: '\e908';
|
||||
}
|
||||
.icon-B-arrow:before {
|
||||
content: '\e90b';
|
||||
}
|
||||
|
||||
.icon-qq1:before {
|
||||
content: '\e90c';
|
||||
}
|
||||
.icon-wx1:before {
|
||||
content: '\e90d';
|
||||
}
|
||||
.icon-ys1:before {
|
||||
content: '\e90e';
|
||||
}
|
||||
.icon-kf1:before {
|
||||
content: '\e90f';
|
||||
}
|
||||
.icon-top1:before {
|
||||
content: '\e910';
|
||||
}
|
||||
.icon-QQ:before {
|
||||
content: '\e911';
|
||||
color: rgba(0, 0, 0, 0.3);
|
||||
margin-right: 10px;
|
||||
}
|
||||
.icon-xl:before {
|
||||
content: '\e919';
|
||||
}
|
||||
|
||||
.icon-QQ1:before {
|
||||
content: '\e91c';
|
||||
}
|
||||
.icon-PYQ:before {
|
||||
content: '\e91d';
|
||||
}
|
||||
.icon-Under-line:before {
|
||||
content: '\e91e';
|
||||
}
|
||||
.icon-On-line:before {
|
||||
content: '\e91f';
|
||||
}
|
||||
.icon-contect:before {
|
||||
content: '\e920';
|
||||
}
|
||||
.icon-support:before {
|
||||
content: '\e921';
|
||||
}
|
||||
.icon-media:before {
|
||||
content: '\e922';
|
||||
}
|
||||
.icon-join:before {
|
||||
content: '\e923';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'icomoon01';
|
||||
src: url('fonts-20190124/icomoon.eot?ll2528');
|
||||
src: url('fonts-20190124/icomoon.eot?ll2528#iefix') format('embedded-opentype'),
|
||||
url('fonts-20190124/icomoon.ttf?ll2528') format('truetype'), url('fonts-20190124/icomoon.woff?ll2528') format('woff'),
|
||||
url('fonts-20190124/icomoon.svg?ll2528#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
[class^='icons-'],
|
||||
[class*=' icons-'] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon01' !important;
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icons-weixin:before {
|
||||
content: '\e903';
|
||||
color: #fff;
|
||||
}
|
||||
.icons-Forum:before {
|
||||
content: '\e900';
|
||||
color: #fff;
|
||||
}
|
||||
.icons-sina:before {
|
||||
content: '\e901';
|
||||
color: #fff;
|
||||
}
|
||||
.icons-toutiao:before {
|
||||
content: '\e902';
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icons-douyin:before {
|
||||
content: '\e904';
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'icomoon02';
|
||||
src: url('fonts/other/icomoon.eot?ujw7hy');
|
||||
src: url('fonts/other/icomoon.eot?ujw7hy#iefix') format('embedded-opentype'), url('fonts/other/icomoon.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/other/icomoon.woff?ujw7hy') format('woff'), url('fonts/other/icomoon.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
[class^='icona-'],
|
||||
[class*=' icona-'] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon02' !important;
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
.icona-zhihu:before {
|
||||
content: '\e904';
|
||||
color: #fff;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'icomoon05';
|
||||
src: url('fonts-20220322/icomoon.eot?cdcz43');
|
||||
src: url('fonts-20220322/icomoon.eot?cdcz43#iefix') format('embedded-opentype'),
|
||||
url('fonts-20220322/icomoon.ttf?cdcz43') format('truetype'), url('fonts-20220322/icomoon.woff?cdcz43') format('woff'),
|
||||
url('fonts-20220322/icomoon.svg?cdcz43#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: block;
|
||||
}
|
||||
|
||||
[class^='iconb-'],
|
||||
[class*='iconb-'] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon05' !important;
|
||||
speak: never;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.iconb-caret-down:before {
|
||||
content: '\e900';
|
||||
}
|
||||
.iconb-caret-up:before {
|
||||
content: '\e901';
|
||||
}
|
||||
BIN
public/frontend/web/css/fonts/icomoon/icomoon.eot
Executable file
BIN
public/frontend/web/css/fonts/icomoon/icomoon.eot
Executable file
Binary file not shown.
46
public/frontend/web/css/fonts/icomoon/icomoon.svg
Executable file
46
public/frontend/web/css/fonts/icomoon/icomoon.svg
Executable file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 40 KiB |
BIN
public/frontend/web/css/fonts/icomoon/icomoon.ttf
Executable file
BIN
public/frontend/web/css/fonts/icomoon/icomoon.ttf
Executable file
Binary file not shown.
BIN
public/frontend/web/css/fonts/icomoon/icomoon.woff
Executable file
BIN
public/frontend/web/css/fonts/icomoon/icomoon.woff
Executable file
Binary file not shown.
BIN
public/frontend/web/css/fonts/other/icomoon.eot
Executable file
BIN
public/frontend/web/css/fonts/other/icomoon.eot
Executable file
Binary file not shown.
11
public/frontend/web/css/fonts/other/icomoon.svg
Executable file
11
public/frontend/web/css/fonts/other/icomoon.svg
Executable file
@@ -0,0 +1,11 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Generated by IcoMoon</metadata>
|
||||
<defs>
|
||||
<font id="icomoon" horiz-adv-x="1024">
|
||||
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||
<missing-glyph horiz-adv-x="1024" />
|
||||
<glyph unicode=" " horiz-adv-x="512" d="" />
|
||||
<glyph unicode="" glyph-name="uniE904" d="M353.1 396h192.6c0 46-21.3 72.9-21.3 72.9h-167.2c4 83.3 7.5 190.2 8.8 229.9h159s-0.9 68.3-18.5 68.3h-279.5s16.8 89.3 39.2 128.8c0 0-83.5 4.6-112-108.4s-71.1-181.3-75.6-193.8 24.5-5.9 36.8 0c12.3 5.9 68 26.3 84.2 105.1h86.4c1.2-49.9 4.6-203.1 3.5-229.9h-178c-25.2-18.3-33.5-72.9-33.5-72.9h203.4c-8.5-57-23.4-130.5-44.2-169.5-33-61.8-50.5-118.3-169.5-215.5 0 0-19.4-14.4 40.8-9.2 60.2 5.3 117.1 21 156.6 101.2 23.2 47.8 42.6 97.4 58.3 148.1v-0.2l167.6-195.9s22 52.5 5.8 110.3l-124.4 141.4-42.1-31.6v-0.2c11.7 41.6 20 82.7 22.7 118.4l0.1 2.7zM585.9 781.6v-677.9h70.2l28.7-81.6 121.7 81.6h153.4v677.9h-374zM887.6 176.7h-79.7l-99.4-66.7-23.5 66.7h-24.8v529.3h227.4v-529.3z" />
|
||||
</font></defs></svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
BIN
public/frontend/web/css/fonts/other/icomoon.ttf
Executable file
BIN
public/frontend/web/css/fonts/other/icomoon.ttf
Executable file
Binary file not shown.
BIN
public/frontend/web/css/fonts/other/icomoon.woff
Executable file
BIN
public/frontend/web/css/fonts/other/icomoon.woff
Executable file
Binary file not shown.
230
public/frontend/web/css/fonts01.css
Executable file
230
public/frontend/web/css/fonts01.css
Executable file
@@ -0,0 +1,230 @@
|
||||
@font-face {
|
||||
font-family: 'icomoon';
|
||||
src: url('fonts/icomoon/icomoon.eot?ujw7hy');
|
||||
src: url('fonts/icomoon/icomoon.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/icomoon/icomoon.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/icomoon/icomoon.woff?ujw7hy') format('woff'),
|
||||
url('fonts/icomoon/icomoon.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
[class^="icon-"], [class*=" icon-"] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon';
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-Collection:before {
|
||||
content: "\e900";
|
||||
}
|
||||
.icon-culture-P:before {
|
||||
content: "\e901";
|
||||
}
|
||||
.icon-facebook:before {
|
||||
content: "\e902";
|
||||
}
|
||||
.icon-in:before {
|
||||
content: "\e903";
|
||||
}
|
||||
.icon-twitter:before {
|
||||
content: "\e904";
|
||||
}
|
||||
.icon-youtobe:before {
|
||||
content: "\e905";
|
||||
}
|
||||
.icon-country:before {
|
||||
content: "\e90a";
|
||||
}
|
||||
.icon-menu:before {
|
||||
content: "\e906";
|
||||
}
|
||||
.icon-arrow:before {
|
||||
content: "\e907";
|
||||
}
|
||||
.icon-close:before {
|
||||
content: "\e909";
|
||||
}
|
||||
.icon-search:before {
|
||||
content: "\e908";
|
||||
}
|
||||
.icon-B-arrow:before {
|
||||
content: "\e90b";
|
||||
}
|
||||
|
||||
.icon-qq1:before {
|
||||
content: "\e90c";
|
||||
}
|
||||
.icon-wx1:before {
|
||||
content: "\e90d";
|
||||
}
|
||||
.icon-ys1:before {
|
||||
content: "\e90e";
|
||||
}
|
||||
.icon-kf1:before {
|
||||
content: "\e90f";
|
||||
}
|
||||
.icon-top1:before {
|
||||
content: "\e910";
|
||||
}
|
||||
.icon-QQ:before {
|
||||
content: "\e911";
|
||||
color:rgba(0,0,0,0.3);
|
||||
margin-right: 10px;
|
||||
}
|
||||
.icon-xl:before {
|
||||
content: "\e919";
|
||||
}
|
||||
|
||||
|
||||
.icon-QQ1:before {
|
||||
content: "\e91c";
|
||||
}
|
||||
.icon-PYQ:before {
|
||||
content: "\e91d";
|
||||
}
|
||||
.icon-Under-line:before {
|
||||
content: "\e91e";
|
||||
}
|
||||
.icon-On-line:before {
|
||||
content: "\e91f";
|
||||
}
|
||||
.icon-contect:before {
|
||||
content: "\e920";
|
||||
}
|
||||
.icon-support:before {
|
||||
content: "\e921";
|
||||
}
|
||||
.icon-media:before {
|
||||
content: "\e922";
|
||||
}
|
||||
.icon-join:before {
|
||||
content: "\e923";
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'icomoon01';
|
||||
src: url('fonts-20190124/icomoon.eot?ll2528');
|
||||
src: url('fonts-20190124/icomoon.eot?ll2528#iefix') format('embedded-opentype'),
|
||||
url('fonts-20190124/icomoon.ttf?ll2528') format('truetype'),
|
||||
url('fonts-20190124/icomoon.woff?ll2528') format('woff'),
|
||||
url('fonts-20190124/icomoon.svg?ll2528#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
[class^="icons-"], [class*=" icons-"] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon01' !important;
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icons-weixin:before {
|
||||
content: "\e903";
|
||||
color: #fff;
|
||||
}
|
||||
.icons-Forum:before {
|
||||
content: "\e900";
|
||||
color: #fff;
|
||||
}
|
||||
.icons-sina:before {
|
||||
content: "\e901";
|
||||
color: #fff;
|
||||
}
|
||||
.icons-toutiao:before {
|
||||
content: "\e902";
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icons-douyin:before {
|
||||
content: "\e904";
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'SourceHanSansCN-Bold';
|
||||
src: url('fonts/SourceHanSansCN-Bold/SourceHanSansCN-Bold.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSansCN-Bold/SourceHanSansCN-Bold.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSansCN-Bold/SourceHanSansCN-Bold.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSansCN-Bold/SourceHanSansCN-Bold.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSansCN-Bold/SourceHanSansCN-Bold.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'SourceHanSansCN-Medium';
|
||||
src: url('fonts/SourceHanSansCN-Medium/SourceHanSansCN-Medium.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSansCN-Medium/SourceHanSansCN-Medium.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSansCN-Medium/SourceHanSansCN-Medium.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSansCN-Medium/SourceHanSansCN-Medium.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSansCN-Medium/SourceHanSansCN-Medium.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'SourceHanSansCN-Normal';
|
||||
src: url('fonts/SourceHanSansCN-Normal/SourceHanSansCN-Normal.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSansCN-Normal/SourceHanSansCN-Normal.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSansCN-Normal/SourceHanSansCN-Normal.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSansCN-Normal/SourceHanSansCN-Normal.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSansCN-Normal/SourceHanSansCN-Normal.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'SourceHanSansCN-Regular';
|
||||
src: url('fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSansCN-Regular/SourceHanSansCN-Regular.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'SourceHanSans-ExtraLight';
|
||||
src: url('fonts/SourceHanSans-ExtraLight/SourceHanSans-ExtraLight.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSans-ExtraLight/SourceHanSans-ExtraLight.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSans-ExtraLight/SourceHanSans-ExtraLight.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSans-ExtraLight/SourceHanSans-ExtraLight.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSans-ExtraLight/SourceHanSans-ExtraLight.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'SourceHanSans-Light';
|
||||
src: url('fonts/SourceHanSans-Light/SourceHanSans-Light.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSans-Light/SourceHanSans-Light.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSans-Light/SourceHanSans-Light.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSans-Light/SourceHanSans-Light.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSans-Light/SourceHanSans-Light.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'SourceHanSans-Heavy';
|
||||
src: url('fonts/SourceHanSans-Heavy/SourceHanSans-Heavy.eot?ujw7hy');
|
||||
src: url('fonts/SourceHanSans-Heavy/SourceHanSans-Heavy.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/SourceHanSans-Heavy/SourceHanSans-Heavy.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/SourceHanSans-Heavy/SourceHanSans-Heavy.woff?ujw7hy') format('woff'),
|
||||
url('fonts/SourceHanSans-Heavy/SourceHanSans-Heavy.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
159
public/frontend/web/css/fonts20191012.css
Executable file
159
public/frontend/web/css/fonts20191012.css
Executable file
@@ -0,0 +1,159 @@
|
||||
@font-face {
|
||||
font-family: 'icomoon';
|
||||
src: url('fonts/icomoon/icomoon.eot?ujw7hy');
|
||||
src: url('fonts/icomoon/icomoon.eot?ujw7hy#iefix') format('embedded-opentype'),
|
||||
url('fonts/icomoon/icomoon.ttf?ujw7hy') format('truetype'),
|
||||
url('fonts/icomoon/icomoon.woff?ujw7hy') format('woff'),
|
||||
url('fonts/icomoon/icomoon.svg?ujw7hy#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
[class^="icon-"], [class*=" icon-"] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon';
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-Collection:before {
|
||||
content: "\e900";
|
||||
}
|
||||
.icon-culture-P:before {
|
||||
content: "\e901";
|
||||
}
|
||||
.icon-facebook:before {
|
||||
content: "\e902";
|
||||
}
|
||||
.icon-in:before {
|
||||
content: "\e903";
|
||||
}
|
||||
.icon-twitter:before {
|
||||
content: "\e904";
|
||||
}
|
||||
.icon-youtobe:before {
|
||||
content: "\e905";
|
||||
}
|
||||
.icon-country:before {
|
||||
content: "\e90a";
|
||||
}
|
||||
.icon-menu:before {
|
||||
content: "\e906";
|
||||
}
|
||||
.icon-arrow:before {
|
||||
content: "\e907";
|
||||
}
|
||||
.icon-close:before {
|
||||
content: "\e909";
|
||||
}
|
||||
.icon-search:before {
|
||||
content: "\e908";
|
||||
}
|
||||
.icon-B-arrow:before {
|
||||
content: "\e90b";
|
||||
}
|
||||
|
||||
.icon-qq1:before {
|
||||
content: "\e90c";
|
||||
}
|
||||
.icon-wx1:before {
|
||||
content: "\e90d";
|
||||
}
|
||||
.icon-ys1:before {
|
||||
content: "\e90e";
|
||||
}
|
||||
.icon-kf1:before {
|
||||
content: "\e90f";
|
||||
}
|
||||
.icon-top1:before {
|
||||
content: "\e910";
|
||||
}
|
||||
.icon-QQ:before {
|
||||
content: "\e911";
|
||||
color:rgba(0,0,0,0.3);
|
||||
margin-right: 10px;
|
||||
}
|
||||
.icon-xl:before {
|
||||
content: "\e919";
|
||||
}
|
||||
|
||||
|
||||
.icon-QQ1:before {
|
||||
content: "\e91c";
|
||||
}
|
||||
.icon-PYQ:before {
|
||||
content: "\e91d";
|
||||
}
|
||||
.icon-Under-line:before {
|
||||
content: "\e91e";
|
||||
}
|
||||
.icon-On-line:before {
|
||||
content: "\e91f";
|
||||
}
|
||||
.icon-contect:before {
|
||||
content: "\e920";
|
||||
}
|
||||
.icon-support:before {
|
||||
content: "\e921";
|
||||
}
|
||||
.icon-media:before {
|
||||
content: "\e922";
|
||||
}
|
||||
.icon-join:before {
|
||||
content: "\e923";
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'icomoon01';
|
||||
src: url('fonts-20190124/icomoon.eot?ll2528');
|
||||
src: url('fonts-20190124/icomoon.eot?ll2528#iefix') format('embedded-opentype'),
|
||||
url('fonts-20190124/icomoon.ttf?ll2528') format('truetype'),
|
||||
url('fonts-20190124/icomoon.woff?ll2528') format('woff'),
|
||||
url('fonts-20190124/icomoon.svg?ll2528#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
[class^="icons-"], [class*=" icons-"] {
|
||||
/* use !important to prevent issues with browser extensions that change fonts */
|
||||
font-family: 'icomoon01' !important;
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icons-weixin:before {
|
||||
content: "\e903";
|
||||
color: #fff;
|
||||
}
|
||||
.icons-Forum:before {
|
||||
content: "\e900";
|
||||
color: #fff;
|
||||
}
|
||||
.icons-sina:before {
|
||||
content: "\e901";
|
||||
color: #fff;
|
||||
}
|
||||
.icons-toutiao:before {
|
||||
content: "\e902";
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icons-douyin:before {
|
||||
content: "\e904";
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
343
public/frontend/web/css/header-other.css
Executable file
343
public/frontend/web/css/header-other.css
Executable file
@@ -0,0 +1,343 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/* CSS Document */
|
||||
@media screen and (min-width:960px){
|
||||
.header-PC{display: block}
|
||||
.header-M{display: none;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.header-PC{display: none}
|
||||
.header-M{display: block; height: 50px;}
|
||||
}
|
||||
.icon-country:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
.icon-menu:before {
|
||||
font-size: 2em
|
||||
}
|
||||
.icon-close:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
/*搜索框字体颜色*/
|
||||
-webkit-input-placeholder { /* WebKit browsers */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
color: #999;
|
||||
}
|
||||
-ms-input-placeholder { /* Internet Explorer 10+ */
|
||||
color: #999;
|
||||
}
|
||||
/*PC端*/
|
||||
.header-PC .top{height: 28px; background-color:#002855; color:#FFF;}
|
||||
.header-PC .top-L{width:50%; text-align:left; font-size: 0.75em; line-height: 28px; float: left; position: relative;}
|
||||
.header-PC .top-L .icon-arrow{
|
||||
display: inline-block;
|
||||
vertical-align: bottom; line-height:28px; font-size: 14px; margin-left:5px;transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
cursor: pointer;
|
||||
}
|
||||
.header-PC .top-L .arrow{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
vertical-align: bottom; line-height:28px; font-size: 14px; margin-left:5px;
|
||||
}
|
||||
.header-PC .top-R{width:50%; text-align: right; float: left; font-size: 1em;}
|
||||
|
||||
.header-PC .logo{width:16%; float: left; position:relative; height: 60px; left:0px; vertical-align:middle; line-height: 60px;}
|
||||
.header-PC .logo img{vertical-align: middle;}
|
||||
.header-PC .top-country{background-color:#002855; overflow: hidden; display: block; color:#FFF; padding:3% 0; border-top: 1px solid rgba(255,255,255,0.6);}
|
||||
.header-PC .top-country li{width:15%; float: left; margin-right:6%;}
|
||||
.header-PC .top-country li:last-child{margin-right:0px;}
|
||||
.header-PC .top-country dt{font-size: 1.3em; line-height: 2em;}
|
||||
.header-PC .top-country dd{width:100%; overflow: hidden;}
|
||||
.header-PC .top-country .Left{font-size: 0.875em; line-height: 2em; float: left; text-align: left;}
|
||||
.header-PC .top-country .Right{font-size: 0.875em; text-align: right; float: right}
|
||||
.header-PC .top-country .Right a{color:#009fdf; border-bottom: 1px solid #009fdf; display: inline-block; line-height: 1.5em;}
|
||||
.header-PC .nav .navfl{float:right; width:84%; text-align: right;}
|
||||
.header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);}
|
||||
.top-country a{color:#333}
|
||||
.top-country a:hover{color:#333}
|
||||
/*原样式*/
|
||||
.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:28px;left:0px;z-index:999;display:none;}
|
||||
.w1440{max-width:1440px;min-width:320px;margin:0 auto;}
|
||||
.nav{width:100%;height:60px;background-color: transparent;position:absolute; z-index: 99;}
|
||||
.nav .top{position:absolute;left:24px;}
|
||||
.nav .top .zg{font-size:16px;color:#002855;line-height:60px;}
|
||||
.nav .top .zg i{display:inline-block;width:23px;height:22px;background:url(../images/china.png);vertical-align:middle;margin-right:6px; ;}
|
||||
.navcon{width:990px;margin:0 auto}
|
||||
|
||||
/*.nav .logo{position:absolute;left:50%;top:19px;transform:translate(-34%,0%);z-index:999;}删除*/
|
||||
.nav .navfl{float:left;}
|
||||
.nav .navfl .navul{float:left; width:100%; }
|
||||
.nav .navfl .navul li{display:inline-block;line-height:60px;}
|
||||
@media screen and (min-width:1280px){
|
||||
.nav .navfl .navul li{padding-left:50px;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.nav .navfl .navul li:first-child{padding-left:0px;}
|
||||
.nav .navfl .navul li{padding-left:30px;}
|
||||
}
|
||||
.nav .navfl .navul li:first-child{margin-left:0px;}
|
||||
.nav .navfl .navul li a{font-size:1em;}
|
||||
.nav .navfl .navul .products a{font-size:1em;color:#444;}
|
||||
.nav .navfl .navul li span{display: inline-block; }
|
||||
.nav .navfl .navul li .arrow{
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .navfl .navul li .arrow-down{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;
|
||||
}
|
||||
.nav .navfl .navul li a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .menu_a{color:#444;}
|
||||
.nav .navfl .navul li .menu_a:hover{color:#009fdf;}
|
||||
.nav .navrh .rhlist li.lispan{margin-right:50px;}
|
||||
.nav .navfl .navul li.ahover a,.nav .navrh .rhlist li.ahover a{color:#009fdf}
|
||||
.nav .navfl .navul li .navlist{width:100%;position:absolute;left:0;right:0;display:none;z-index:9;}
|
||||
.nav .navfl .navul li .navlist .listfl{width:55%;height:331px;background:#efefef;float:left;}
|
||||
.nav .navfl .navul li .navlist .listfl .navicon{float:right;width:540px;margin-top:69px;}
|
||||
.nav .navfl .navul li .navlist .listfl a{display:inline-block;margin-right:75px;text-align:center;line-height:40px; float: left;}
|
||||
.nav .navfl .navul li .navlist .listfl a img{display:inline-block;}
|
||||
.nav .navfl .navul li .navlist .listfl a p{font-size:14px;color:#444;text-align:center; margin-bottom: 12px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh{width:45%;height:331px;background:#e3e3e3;float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg{margin:30px 24px 0;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg{float:left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg img{width:281px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit{height:118px;float:left;margin-left:20px; text-align: left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit p{line-height:normal;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .ntit{font-size:14px;color:#444;margin-top:20px; margin-bottom: 16px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .nline{width:23px;height:2px;background:#26a6e1;margin:10px 0 50px 0;}
|
||||
|
||||
/*头部新增 s*/
|
||||
.nav .navfl .navul li .navlist1{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist1 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddrh{float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist2{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist2 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddrh{float:right;}
|
||||
|
||||
/*头部新增 e*/
|
||||
|
||||
|
||||
.nav .navrh{float:right;}
|
||||
|
||||
.nav .navrh .rhlist{float:left;}
|
||||
|
||||
.nav .navrh .rhlist li{display:inline-block;line-height:60px;margin-right:50px;}
|
||||
|
||||
.nav .navrh .rhlist li:last-child{margin-right:0px;}
|
||||
|
||||
.nav .navrh .rhlist li a{font-size:16px;color:#002855;}
|
||||
|
||||
.nav .navrh .rhlist li span{display:inline-block;width:1px;height:24px;background:#002855;line-height:40px;vertical-align:middle;}
|
||||
|
||||
.nav .navrh .rhlist li:hover a{color:#009fdf;}
|
||||
|
||||
|
||||
|
||||
.header-PC .Searchbox{position:absolute;right:56px;top:20px; height: 60px; background-color: #FFF;}
|
||||
|
||||
.header-PC .Searchbox .icon{cursor:pointer;}
|
||||
|
||||
.header-PC .Searchbox .icon img{vertical-align:middle;margin:-3px 10px 0 0;}
|
||||
|
||||
.header-PC .search{display:none;background:#fff;width:100%; height:60px; position:absolute;right:0px;top:28px;z-index:888;}
|
||||
|
||||
.header-PC .search .ipt{width:80%;height:30px;line-height:30px;text-indent:1em;}
|
||||
|
||||
.header-PC .search .searchbtn{color:#fff; cursor:pointer; width:70px; height:30px; border-radius:13px; background:#002855; position:absolute; right:0px; top:0px;}
|
||||
|
||||
#wap-search-in {height: 30px; line-height: 30px; margin-top:15px; border: none; width: 40%; margin-left:30%; }
|
||||
#wap-search-btn{}
|
||||
.header-PC .search button{color:#444; background-color: transparent; font-size: 24px; line-height: 60px;}
|
||||
/*.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:90px;left:0px;z-index:999;display:none;}删除*/
|
||||
|
||||
.topul li{width:20%;float:left;margin-right:6.6%;}
|
||||
|
||||
.topul li:nth-child(4n){margin-right:0px;}
|
||||
|
||||
.topul li p{font-size:24px;color:#fff;}
|
||||
|
||||
.topul li dl{margin-top:48px;}
|
||||
|
||||
.topul li dl dd{margin-bottom:22px;}
|
||||
|
||||
.topul li dl a{float:left;font-size:18px;color:#fff;}
|
||||
|
||||
.topul li dl a:nth-child(2n){float:right;font-size:18px;color:#009fdf;padding-bottom:8px;border-bottom:1px solid #008eca;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*手机端*/
|
||||
.header-M .header-fixed{height: 50px; line-height: 50px; position: fixed; top:0px; width:100%; background-color:#FFF; z-index: 9; margin-bottom: 50px;}
|
||||
.header-M .logo{width:130px; margin:auto; height: 50px; line-height: 50px;}
|
||||
.header-M .logo img{vertical-align: middle; display: inline-block;}
|
||||
.header-M .Country{border-radius: 1.5em; position: absolute; top:0px; left:8%; z-index: 1; line-height: 50px; text-align: center; color:#333; margin-left:-3px;}
|
||||
.m-Country{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 2; line-height: 30px;}
|
||||
.m-Menu{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 4;}
|
||||
.header-M .Menu{position: absolute; top:0px; right:8%; color:#333; margin-right:-3px;}
|
||||
.Country img{margin-right:5px;}
|
||||
.m-Menu li{border-bottom:1px solid #204f7e; position: relative; opacity: 0}
|
||||
.m-Menu li li{line-height: 38px; opacity: 1}
|
||||
.m-Menu li li a{margin-top:-1px; padding-left:0px; line-height: 36px; display: inline-block}
|
||||
.m-Menu li a{padding-left:8%; color: #FFF; text-decoration: none; line-height: 45px; font-size: 1em; margin-top:-6px;}
|
||||
.m-Menu li .arrow, .m-Menu li .arrow-r{ color:#FFF; position: absolute; right:8%; font-size: 1.4em; line-height: 30px;}
|
||||
.m-Menu li .arrow{top:7px;}
|
||||
.m-Menu li .arrow-r{top:9px;}
|
||||
.nav .arrow, .m-Menu li .arrow{
|
||||
transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .arrow, .m-Menu li .arrow-r{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
}
|
||||
.m-Menu li, .SingIn-button, .search{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode:forwards ;
|
||||
-webkit-animation-fill-mode:forwards ;
|
||||
}
|
||||
.m-Menu li:nth-child(1){
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu li:nth-child(2){
|
||||
animation-delay:0.1s;
|
||||
-webkit-animation-delay: 0.1s;
|
||||
}
|
||||
.m-Menu li:nth-child(3){
|
||||
animation-delay:0.2s;
|
||||
-webkit-animation-delay: 0.2s;
|
||||
|
||||
}
|
||||
.m-Menu li:nth-child(4){
|
||||
animation-delay:0.3s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(5){
|
||||
animation-delay:0.4s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(6){
|
||||
animation-delay:0.5s;
|
||||
-webkit-animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.S-Menu{width:100%; background-color:#2e6297; overflow: hidden;}
|
||||
.S-Menu li{border-bottom: 1px solid #285887; padding-left:10%; padding-top:0; color:#FFF; font-size: 0.9em;}
|
||||
.S-Menu li:last-child{border-bottom: none;}
|
||||
.S-Menu li{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 0s;
|
||||
animation-duration: 0s;
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu .Close{position: absolute; top:5%; right:8%; color:#333; font-size: 20px; border:2px solid #999; width:42px; height: 42px; border-radius: 21px; text-align: center; box-shadow: 0px 0px 2px #999;}
|
||||
.m-Menu .SingIn-button a{display: inline-block; width:70px; height: 30px; border:1px solid #FFF; color:#FFF; border-radius: 1.6em; margin-left:5px; margin-right:5px; text-align: center; text-decoration: none; margin-top:30px; line-height: 28px; font-size: 1em}
|
||||
.m-Menu .SingIn-button a:hover{border:1px solid #FFF; background-color:#FFF; color: #333;}
|
||||
.m-Menu .search{width:84%; margin:30px auto 0; position: relative; opacity: 0;}
|
||||
|
||||
.m-Menu .search .form-control{width:90%; height: 32px; line-height: 32px; border:1px solid rgba(220,221,221,0.7); vertical-align: middle; border-radius:1.8em; padding-left:5%; padding-right:5%; font-size: 0.9em; background-color:#FFF;}
|
||||
.m-Menu .search .updown_search_btn{line-height: 35px; background:none; border:none; position: absolute; right:2%; top:0px; font-size: 1.8em; vertical-align: middle; color:#333;}
|
||||
|
||||
.m-Menu .SingIn-button{opacity: 0}
|
||||
.m-Menu .SingIn-button{
|
||||
animation-delay:0.53s;
|
||||
-webkit-animation-delay: 0.53s;
|
||||
}
|
||||
.m-Menu .search{
|
||||
animation-delay:0.55s;
|
||||
-webkit-animation-delay: 0.55s;
|
||||
}
|
||||
|
||||
.m-Country{padding-top:5%;}
|
||||
.m-Country dl{width:90%; margin:auto; overflow: hidden; margin-bottom:8%;}
|
||||
.m-Country dt{font-size:14px; color:#FFF; margin-bottom: 2%;}
|
||||
.m-Country dd{padding-left:0; margin-left:0; float:left; padding:0px 40px 0 0; line-height: 2em; color:rgba(255,255,255,0.7); font-size: 12px;}
|
||||
|
||||
@-webkit-keyframes fadeInUp {
|
||||
0% {
|
||||
top:1000px;
|
||||
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity:0;
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
|
||||
/*头部导航栏变色*/
|
||||
.theme-white .navfl .navul li a{color:#FFF;}
|
||||
.theme-white .logo-white{display: block}
|
||||
.theme-white .logo-black{display: none; }
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-black .logo-white{display: none}
|
||||
.theme-black .logo-black{display: block; }
|
||||
|
||||
/*公共样式*/
|
||||
.search input {height: 30px; line-height: 30px; border:none; width:40%;}
|
||||
462
public/frontend/web/css/header-product.css
Executable file
462
public/frontend/web/css/header-product.css
Executable file
@@ -0,0 +1,462 @@
|
||||
@charset "utf-8";
|
||||
@media screen and (min-width:1280px){
|
||||
.swt-Container{width:1200px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.swt-Container{width:96%; margin:auto;}
|
||||
}
|
||||
/* CSS Document */
|
||||
@media screen and (min-width:960px){
|
||||
.header-PC{display: block}
|
||||
.header-M{display: none;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.header-PC{display: none}
|
||||
.header-M{display: block; height: 50px;}
|
||||
}
|
||||
.icon-country:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
.icon-menu:before {
|
||||
font-size: 2em
|
||||
}
|
||||
.icon-close:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
/*搜索框字体颜色*/
|
||||
-webkit-input-placeholder { /* WebKit browsers */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
color: #999;
|
||||
}
|
||||
-ms-input-placeholder { /* Internet Explorer 10+ */
|
||||
color: #999;
|
||||
}
|
||||
/*PC端*/
|
||||
.header-PC .top{height: 40px; background-color:#252525; color:#FFF;}
|
||||
.header-Product .top{position: fixed; top:0px; width:100%; z-index: 9999;}
|
||||
.header-PC .top-L{width:50%; text-align:left; font-size: 0.875em; line-height: 40px; float: left; position: relative;}
|
||||
.header-PC .top-L img{margin-top: 13px; width:24px; height: 16px;}
|
||||
.header-PC .top-L img:hover, .header-PC .top-L span:hover{cursor: pointer;}
|
||||
.header-PC .top-L a{color:#FFF;}
|
||||
.header-PC .top-L a:hover{color:rgba(255,255,255,0.8);}
|
||||
/*.header-PC .top-L{display:inline-block; margin-left:5px; line-height: 28px;}*/
|
||||
.top-old{display: inline-block; margin-left:5px; margin-right: 4px; width:1px; height:9px; background-color:rgba(255,255,255,0.8);}
|
||||
|
||||
|
||||
.header-PC .top-R{width:50%; text-align: right; float: left; font-size: 1em; line-height: 38px;}
|
||||
.header-PC .top-R a{color:#FFF; display: inline-block}
|
||||
.header-PC .top-R a:first-child{margin-right: 0.26vw;}
|
||||
.header-PC .top-R a:last-child{margin-left: 0.26vw;}
|
||||
.header-PC .top-R a:hover{color:#009fdf}
|
||||
.header-PC .top-R .icon-search{display: inline-block; line-height: 33px;}
|
||||
.header-PC .logo{width:16%; float: left; height: 60px; left:0px; vertical-align:middle; line-height: 60px;}
|
||||
.header-PC .logo img{vertical-align: middle; max-width: 100%;}
|
||||
.header-PC .top-country{background-color:#f1f1f1; display: block; color:#333333; padding:15px 0 0; border-top: 1px solid rgba(255,255,255,0.6); font-size: 0.875em; top:40px; box-shadow: 5px 5px 10px rgba(0,0,0,0.2);width:250px; position: absolute;; font-weight: 600;}
|
||||
.header-PC .top-country li a {color: #333;}
|
||||
.header-PC .top-country li a:hover {color: #009fdf;}
|
||||
.header-PC .top-country li{width:220px; margin-left: 1%; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px; height: 19px;}
|
||||
.header-PC .top-country li:nth-child(5n){margin-right:0px;}
|
||||
.header-PC .top-country li:last-child{border-bottom: none;}
|
||||
.header-PC .top-country li p{display: inline-block;}
|
||||
.header-PC .top-country li p:last-child{margin-left:10%; vertical-align:top}
|
||||
.header-PC .top-country ul:after{width:10px; height: 5px; content: ""; background:url(../images/countries/arrow.png); position: absolute; top:-20px; left:7px; z-index: 99999}
|
||||
/*国家*/
|
||||
.top-country .countries{display:inline-block; width:28px; height: 19px; background:url("../images/countries/countries.png") no-repeat; }
|
||||
.top-country .AE{background-position: 0px 0px;}
|
||||
.top-country .AR{background-position: -29px 0px;}
|
||||
.top-country .AT{background-position: -58px 0px;}
|
||||
.top-country .AU{background-position: -87px 0px;}
|
||||
.top-country .AZ{background-position: -116px 0px;}
|
||||
.top-country .BD{background-position: -145px 0px;}
|
||||
.top-country .BE{background-position: -174px 0px;}
|
||||
.top-country .BG{background-position: -203px 0px;}
|
||||
.top-country .BL{background-position: -232px 0px;}
|
||||
.top-country .BO{background-position: -261px 0px;}
|
||||
.top-country .BR{background-position: -290px 0px;}
|
||||
.top-country .CA{background-position: -319px 0px;}
|
||||
.top-country .CH{background-position: -348px 0px;}
|
||||
.top-country .CL{background-position: -377px 0px;}
|
||||
.top-country .ZH{background-position: -406px 0px;}
|
||||
.top-country .CO{background-position: -435px 0px;}
|
||||
.top-country .CS{background-position: -464px 0px;}
|
||||
.top-country .CY{background-position: -493px 0px;}
|
||||
.top-country .DB{background-position: -522px 0px;}
|
||||
.top-country .DE{background-position: -551px 0px;}
|
||||
|
||||
.top-country .KR{background-position: 0px -20px;}
|
||||
.top-country .KH{background-position: -29px -20px;}
|
||||
.top-country .JP{background-position: -58px -20px;}
|
||||
.top-country .JQ{background-position: -87px -20px;}
|
||||
.top-country .IT{background-position: -116px -20px;}
|
||||
.top-country .IR{background-position: -145px -20px;}
|
||||
.top-country .IQ{background-position: -174px -20px;}
|
||||
.top-country .IN{background-position: -203px -20px;}
|
||||
.top-country .IL{background-position: -232px -20px;}
|
||||
.top-country .IE{background-position: -261px -20px;}
|
||||
.top-country .ID{background-position: -290px -20px;}
|
||||
.top-country .HU{background-position: -319px -20px;}
|
||||
.top-country .HK{background-position: -348px -20px;}
|
||||
.top-country .GR{background-position: -377px -20px;}
|
||||
.top-country .GH{background-position: -406px -20px;}
|
||||
.top-country .FR{background-position: -435px -20px;}
|
||||
.top-country .ES{background-position: -464px -20px;}
|
||||
.top-country .EG{background-position: -493px -20px;}
|
||||
.top-country .EE{background-position: -522px -20px;}
|
||||
.top-country .DK{background-position: -551px -20px;}
|
||||
|
||||
.top-country .KSA{background-position: 0px -40px;}
|
||||
.top-country .KW{background-position: -29px -40px;}
|
||||
.top-country .KZ{background-position: -58px -40px;}
|
||||
.top-country .LA{background-position: -87px -40px;}
|
||||
.top-country .LB{background-position: -116px -40px;}
|
||||
.top-country .LK{background-position: -145px -40px;}
|
||||
.top-country .LT{background-position: -174px -40px;}
|
||||
.top-country .MA{background-position: -203px -40px;}
|
||||
.top-country .MDV{background-position: -232px -40px;}
|
||||
.top-country .MM{background-position: -261px -40px;}
|
||||
.top-country .MX{background-position: -290px -40px;}
|
||||
.top-country .MY{background-position: -319px -40px;}
|
||||
.top-country .NG{background-position: -348px -40px;}
|
||||
.top-country .NL{background-position: -377px -40px;}
|
||||
.top-country .NO{background-position: -406px -40px;}
|
||||
.top-country .NP{background-position: -435px -40px;}
|
||||
.top-country .NZ{background-position: -464px -40px;}
|
||||
.top-country .PE{background-position: -493px -40px;}
|
||||
.top-country .PG{background-position: -522px -40px;}
|
||||
.top-country .PH{background-position: -551px -40px;}
|
||||
|
||||
.top-country .ZA{background-position: 0px -60px;}
|
||||
.top-country .VN{background-position: -29px -60px;}
|
||||
.top-country .UY{background-position: -58px -60px;}
|
||||
.top-country .US{background-position: -87px -60px;}
|
||||
.top-country .UK{background-position: -116px -60px;}
|
||||
.top-country .UA{background-position: -145px -60px;}
|
||||
.top-country .TW{background-position: -174px -60px;}
|
||||
.top-country .TR{background-position: -203px -60px;}
|
||||
.top-country .TN{background-position: -232px -60px;}
|
||||
.top-country .TH{background-position: -261px -60px;}
|
||||
.top-country .SYR{background-position: -290px -60px;}
|
||||
.top-country .SK{background-position: -319px -60px;}
|
||||
.top-country .SGL{background-position: -348px -60px;}
|
||||
.top-country .SG{background-position: -377px -60px;}
|
||||
.top-country .SE{background-position: -406px -60px;}
|
||||
.top-country .RU{background-position: -435px -60px;}
|
||||
.top-country .RO{background-position: -464px -60px;}
|
||||
.top-country .PT{background-position: -493px -60px;}
|
||||
.top-country .PL{background-position: -522px -60px;}
|
||||
.top-country .PK{background-position: -551px -60px;}
|
||||
|
||||
.top-country .ZM{background-position: 0px -80px;}
|
||||
|
||||
.header-PC .nav .navfl{float:right; width:84%; text-align: right;}
|
||||
.header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);}
|
||||
.header-PC .top-country .close{width:100%; overflow: hidden; text-align: center;}
|
||||
.header-PC .top-country .icon-close{width:3em; height: 3em; border-radius: 1.5em; display: inline-block; background-color:#333; color:#FFF; line-height: 3em; font-size: 10px; margin-top:20px;}
|
||||
.header-PC .top-country .icon-close:hover{cursor: pointer; color: #333;}
|
||||
/*原样式*/
|
||||
.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:28px;left:0px;z-index:9999;display:none;}
|
||||
@media screen and (min-width:1480px){
|
||||
.w1440{width:1440px; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.w1440{width:98%; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.header-Index .nav{width:100%;height:60px;background-color: transparent;position:absolute; z-index: 99;}
|
||||
.header-Product .nav{width:100%;height:60px;background-color: #FFF;position:fixed; z-index: 99; top:40px; box-shadow: 0px 0px 15px #999;}
|
||||
.nav .top{position:absolute;left:24px;}
|
||||
.nav .top .zg{font-size:16px;color:#002855;line-height:60px;}
|
||||
.nav .top .zg i{display:inline-block;width:23px;height:22px;background:url(../images/china.png);vertical-align:middle;margin-right:6px; ;}
|
||||
.navcon{width:990px;margin:0 auto}
|
||||
|
||||
/*.nav .logo{position:absolute;left:50%;top:19px;transform:translate(-34%,0%);z-index:999;}删除*/
|
||||
.nav .navfl{float:left;}
|
||||
.nav .navfl .navul{float:left; width:100%; }
|
||||
.nav .navfl .navul li{display:inline-block;line-height:60px;}
|
||||
@media screen and (min-width:1280px){
|
||||
.nav .navfl .navul li{padding-left:50px;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.nav .navfl .navul li:first-child{padding-left:0px;}
|
||||
.nav .navfl .navul li{padding-left:30px;}
|
||||
}
|
||||
.nav .navfl .navul li:first-child{margin-left:0px;}
|
||||
.nav .navfl .navul li a{font-size:1em;}
|
||||
.nav .navfl .navul .products a{font-size:1em;}
|
||||
.nav .navfl .navul li span{display: inline-block; }
|
||||
.nav .navfl .navul li .arrow{
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .navfl .navul li .arrow-down{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;
|
||||
}
|
||||
.nav .navfl .navul li a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .menu_a{color:#444;}
|
||||
.nav .navfl .navul li .menu_a:hover{color:#009fdf;}
|
||||
.nav .navrh .rhlist li.lispan{margin-right:50px;}
|
||||
.nav .navfl .navul li.ahover a,.nav .navrh .rhlist li.ahover a{color:#009fdf}
|
||||
.nav .navfl .navul li .navlist{width:100%;position:absolute;left:0;right:0;display:none;z-index:999999;}
|
||||
.nav .navfl .navul li .navlist .listfl{width:55%;height:331px;background:#efefef;float:left;}
|
||||
.nav .navfl .navul li .navlist .listfl .navicon{float:right;width:540px;margin-top:69px;}
|
||||
.nav .navfl .navul li .navlist .listfl a{display:inline-block;margin-right:75px;text-align:center;line-height:40px; float: left; margin-bottom: 20px;}
|
||||
.nav .navfl .navul li .navlist .listfl a img{display:inline-block; width:42px;}
|
||||
.nav .navfl .navul li .navlist .listfl a p{font-size:14px;color:#444;text-align:center; margin-bottom: 12px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh{width:45%;height:331px;background:#e3e3e3;float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg{margin:30px 24px 0;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg{float:left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg img{width:281px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit{height:118px;float:left;margin-left:20px; text-align: left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit p{line-height:normal;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .ntit{font-size:14px;color:#444;margin-top:20px; margin-bottom: 16px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .nline{width:23px;height:2px;background:#26a6e1;margin:10px 0 50px 0;}
|
||||
|
||||
/*头部新增 s*/
|
||||
.nav .navfl .navul li .navlist1{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist1 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddrh{float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist2{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist2 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddrh{float:right;}
|
||||
|
||||
/*头部新增 e*/
|
||||
|
||||
|
||||
.nav .navrh{float:right;}
|
||||
|
||||
.nav .navrh .rhlist{float:left;}
|
||||
|
||||
.nav .navrh .rhlist li{display:inline-block;line-height:60px;margin-right:50px;}
|
||||
|
||||
.nav .navrh .rhlist li:last-child{margin-right:0px;}
|
||||
|
||||
.nav .navrh .rhlist li a{font-size:16px;color:#002855;}
|
||||
|
||||
.nav .navrh .rhlist li span{display:inline-block;width:1px;height:24px;background:#002855;line-height:40px;vertical-align:middle;}
|
||||
|
||||
.nav .navrh .rhlist li:hover a{color:#009fdf;}
|
||||
|
||||
|
||||
|
||||
.header-PC .Searchbox{position:absolute;right:56px;top:20px; height: 60px; background-color: #FFF;}
|
||||
|
||||
.header-PC .Searchbox .icon{cursor:pointer;}
|
||||
|
||||
.header-PC .Searchbox .icon img{vertical-align:middle;margin:-3px 10px 0 0;}
|
||||
|
||||
.header-PC .search{display:none;background:#fff;width:100%; height:60px; position:absolute;right:0px;top:28px;z-index:888;}
|
||||
|
||||
.header-PC .search .ipt{width:80%;height:30px;line-height:30px;text-indent:1em;}
|
||||
|
||||
.header-PC .search .searchbtn{color:#fff; cursor:pointer; width:70px; height:30px; border-radius:13px; background:#002855; position:absolute; right:0px; top:0px;}
|
||||
|
||||
#wap-search-in {height: 30px; line-height: 30px; margin-top:15px; border: none; width: 40%; margin-left:30%; }
|
||||
#wap-search-btn{}
|
||||
.header-PC .search button{color:#444; background-color: transparent; font-size: 24px; line-height: 60px;}
|
||||
/*.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:90px;left:0px;z-index:999;display:none;}删除*/
|
||||
|
||||
.topul li{width:20%;float:left;margin-right:6.6%;}
|
||||
|
||||
.topul li:nth-child(4n){margin-right:0px;}
|
||||
|
||||
.topul li p{font-size:24px;color:#fff;}
|
||||
|
||||
.topul li dl{margin-top:48px;}
|
||||
|
||||
.topul li dl dd{margin-bottom:22px;}
|
||||
|
||||
.topul li dl a{float:left;font-size:18px;color:#fff;}
|
||||
|
||||
.topul li dl a:nth-child(2n){float:right;font-size:18px;color:#009fdf;padding-bottom:8px;border-bottom:1px solid #008eca;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*手机端*/
|
||||
.header-M .header-fixed{height: 50px; line-height: 50px; position: fixed; top:0px; width:100%; background-color:#FFF; z-index: 9; margin-bottom: 50px;}
|
||||
.header-M .logo{width:130px; margin:auto; height: 50px; line-height: 50px;}
|
||||
.header-M .logo img{vertical-align: middle; display: inline-block;}
|
||||
.header-M .Country{border-radius: 1.5em; position: absolute; top:50%; left:8%; z-index: 1; line-height: 20px; text-align: center; color:#333; margin-left:-3px; margin-top:-10px;cursor: pointer;}
|
||||
.m-Country{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#FFFFFF; z-index: 2; line-height: 30px;}
|
||||
.m-Menu{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 999999;}
|
||||
.header-M .Menu{position: absolute; top:0px; right:8%; color:#333; margin-right:-3px;}
|
||||
.Country img{margin-right:5px;}
|
||||
.m-Menu li{border-bottom:1px solid #204f7e; position: relative; opacity: 0}
|
||||
.m-Menu li li{line-height: 38px; opacity: 1}
|
||||
.m-Menu li li a{margin-top:-1px; padding-left:0px; line-height: 36px; display: inline-block}
|
||||
.m-Menu li a{padding-left:8%; color: #FFF; text-decoration: none; line-height: 45px; font-size: 1em; display: block;}
|
||||
.m-Menu li .arrow, .m-Menu li .arrow-r{ color:#FFF; position: absolute; right:8%; font-size: 1.4em; line-height: 30px;}
|
||||
.m-Menu li .arrow{top:7px;}
|
||||
.m-Menu li .arrow-r{top:9px;}
|
||||
.nav .arrow, .m-Menu li .arrow{
|
||||
transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .arrow, .m-Menu li .arrow-r{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
}
|
||||
.m-Menu li, .SingIn-button, .search{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode:forwards ;
|
||||
-webkit-animation-fill-mode:forwards ;
|
||||
}
|
||||
.m-Menu li:nth-child(1){
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu li:nth-child(2){
|
||||
animation-delay:0.1s;
|
||||
-webkit-animation-delay: 0.1s;
|
||||
}
|
||||
.m-Menu li:nth-child(3){
|
||||
animation-delay:0.2s;
|
||||
-webkit-animation-delay: 0.2s;
|
||||
|
||||
}
|
||||
.m-Menu li:nth-child(4){
|
||||
animation-delay:0.3s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(5){
|
||||
animation-delay:0.4s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(6){
|
||||
animation-delay:0.5s;
|
||||
-webkit-animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.S-Menu{width:100%; background-color:#2e6297; overflow: hidden;}
|
||||
.S-Menu li{border-bottom: 1px solid #285887; padding-left:10%; padding-top:0; color:#FFF; font-size: 0.9em;}
|
||||
.S-Menu li:last-child{border-bottom: none;}
|
||||
.S-Menu li{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 0s;
|
||||
animation-duration: 0s;
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu .Close{position: absolute; top:5%; right:8%; color:#333; font-size: 20px; border:2px solid #999; width:42px; height: 42px; border-radius: 21px; text-align: center; box-shadow: 0px 0px 2px #999;}
|
||||
.m-Menu .SingIn-button a{display: inline-block; width:70px; height: 30px; border:1px solid #FFF; color:#FFF; margin-left:5px; margin-right:5px; text-align: center; text-decoration: none; margin-top:30px; line-height: 28px; font-size: 1em}
|
||||
.m-Menu .SingIn-button a:hover{border:1px solid #FFF; background-color:#FFF; color: #333;}
|
||||
.m-Menu .search{width:84%; margin:30px auto 0; position: relative; opacity: 0;}
|
||||
|
||||
.m-Menu .search .form-control{width:90%; height: 32px; line-height: 32px; border:1px solid rgba(220,221,221,0.7); vertical-align: middle; padding-left:5%; padding-right:5%; font-size: 0.9em; background-color:#FFF;}
|
||||
.m-Menu .search .updown_search_btn{line-height: 35px; background:none; border:none; position: absolute; right:2%; top:0px; font-size: 1.5em; vertical-align: middle; color:#333;}
|
||||
|
||||
.m-Menu .SingIn-button{opacity: 0}
|
||||
.m-Menu .SingIn-button{
|
||||
animation-delay:0.53s;
|
||||
-webkit-animation-delay: 0.53s;
|
||||
}
|
||||
.m-Menu .search{
|
||||
animation-delay:0.55s;
|
||||
-webkit-animation-delay: 0.55s;
|
||||
}
|
||||
|
||||
.m-Country{padding-top:2%;}
|
||||
|
||||
.m-Country ul{width:90%; margin:auto;}
|
||||
.m-Country li{width:18%; float: left; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;}
|
||||
|
||||
.m-Country li p{display: inline-block;}
|
||||
|
||||
@media screen and (min-width:641px){
|
||||
.m-Country li:nth-child(5n){margin-right:0px;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.m-Country li{width:23%; margin-right:2%;}
|
||||
.m-Country li:nth-child(4n){margin-right:0px;}
|
||||
}
|
||||
|
||||
|
||||
@-webkit-keyframes fadeInUp {
|
||||
0% {
|
||||
top:1000px;
|
||||
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity:0;
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
|
||||
/*头部导航栏变色*/
|
||||
.theme-white .navfl .navul li a{color:#FFF;}
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-white .logo-white{display: block}
|
||||
.theme-white .logo-black{display: none; }
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-black .logo-white{display: none}
|
||||
.theme-black .logo-black{display: block; }
|
||||
.all-logo, .all-logo-black{position: relative;}
|
||||
@media screen and (min-width:960px){
|
||||
.logo{position: absolute; left:0; top:0;}
|
||||
}
|
||||
/*公共样式*/
|
||||
.search input {height: 30px; line-height: 30px; border:none; width:40%;}
|
||||
.banner-other{margin-top:60px; width:100%;}
|
||||
@media screen and (max-width:959px){
|
||||
.banner-other{margin-top:0px; width:100%;}
|
||||
}
|
||||
454
public/frontend/web/css/header-search.css
Executable file
454
public/frontend/web/css/header-search.css
Executable file
@@ -0,0 +1,454 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/* CSS Document */
|
||||
@media screen and (min-width:960px){
|
||||
.header-PC{display: block}
|
||||
.header-M{display: none;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.header-PC{display: none}
|
||||
.header-M{display: block; height: 50px;}
|
||||
}
|
||||
.icon-country:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
.icon-menu:before {
|
||||
font-size: 2em
|
||||
}
|
||||
.icon-close:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
/*搜索框字体颜色*/
|
||||
-webkit-input-placeholder { /* WebKit browsers */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
color: #999;
|
||||
}
|
||||
-ms-input-placeholder { /* Internet Explorer 10+ */
|
||||
color: #999;.header-PC .top-country
|
||||
}
|
||||
/*PC端*/
|
||||
.header-PC .top{height: 40px; background-color:#252525; color:#FFF;}
|
||||
.header-Product .top{position: fixed; top:0px; width:100%; z-index: 9999;}
|
||||
.header-PC .top-L{width:50%; text-align:left; font-size: 0.875em; line-height: 40px; float: left;}
|
||||
.header-PC .top-L img{margin-top: 13px; width:24px; height: 16px;}
|
||||
.header-PC .top-L img:hover, .header-PC .top-L span:hover{cursor: pointer;}
|
||||
.header-PC .top-L a{color:#FFF;}
|
||||
.header-PC .top-L a:hover{color:rgba(255,255,255,0.8);}
|
||||
/*.header-PC .top-L{display:inline-block; margin-left:5px; line-height: 28px;}*/
|
||||
.top-old{display: inline-block; margin-left:5px; margin-right: 4px; width:1px; height:9px; background-color:rgba(255,255,255,0.8);}
|
||||
|
||||
|
||||
.header-PC .top-R{width:50%; text-align: right; float: left; font-size: 1em; line-height: 38px;}
|
||||
.header-PC .top-R a{color:#FFF; display: inline-block}
|
||||
.header-PC .top-R a:first-child{margin-right: 0.26vw;}
|
||||
.header-PC .top-R a:last-child{margin-left: 0.26vw;}
|
||||
.header-PC .top-R a:hover{color:#009fdf}
|
||||
.header-PC .top-R .icon-search{display: inline-block; line-height: 33px;}
|
||||
.header-PC .logo{width:16%; float: left; height: 60px; left:0px; vertical-align:middle; line-height: 60px;}
|
||||
.header-PC .logo img{vertical-align: middle; max-width: 100%;}
|
||||
.header-PC .top-country{background-color:#f1f1f1; display: block; color:#333333; padding:15px 0 35px; border-top: 1px solid rgba(255,255,255,0.6); font-size: 0.875em; position: fixed; top:40px; box-shadow: 5px 5px 10px rgba(0,0,0,0.2);width:150px; left:18.5%;}
|
||||
.header-PC .top-country li{width:120px; margin-left: 1%; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px; height: 19px;}
|
||||
.header-PC .top-country li:nth-child(5n){margin-right:0px;}
|
||||
.header-PC .top-country li p{display: inline-block;}
|
||||
.header-PC .top-country li p:last-child{margin-left:10%; vertical-align:top}
|
||||
.header-PC .top-country ul:after{width:10px; height: 5px; content: ""; background:url(../images/countries/arrow.png); position: absolute; top:-20px; left:7px; z-index: 99999}
|
||||
/*国家*/
|
||||
.top-country .countries{display:inline-block; width:28px; height: 19px; background:url("../images/countries/countries.png") no-repeat; }
|
||||
.top-country .AE{background-position: 0px 0px;}
|
||||
.top-country .AR{background-position: -29px 0px;}
|
||||
.top-country .AT{background-position: -58px 0px;}
|
||||
.top-country .AU{background-position: -87px 0px;}
|
||||
.top-country .AZ{background-position: -116px 0px;}
|
||||
.top-country .BD{background-position: -145px 0px;}
|
||||
.top-country .BE{background-position: -174px 0px;}
|
||||
.top-country .BG{background-position: -203px 0px;}
|
||||
.top-country .BL{background-position: -232px 0px;}
|
||||
.top-country .BO{background-position: -261px 0px;}
|
||||
.top-country .BR{background-position: -290px 0px;}
|
||||
.top-country .CA{background-position: -319px 0px;}
|
||||
.top-country .CH{background-position: -348px 0px;}
|
||||
.top-country .CL{background-position: -377px 0px;}
|
||||
.top-country .CN{background-position: -406px 0px;}
|
||||
.top-country .CO{background-position: -435px 0px;}
|
||||
.top-country .CS{background-position: -464px 0px;}
|
||||
.top-country .CY{background-position: -493px 0px;}
|
||||
.top-country .DB{background-position: -522px 0px;}
|
||||
.top-country .DE{background-position: -551px 0px;}
|
||||
|
||||
.top-country .KR{background-position: 0px -20px;}
|
||||
.top-country .KH{background-position: -29px -20px;}
|
||||
.top-country .JP{background-position: -58px -20px;}
|
||||
.top-country .JQ{background-position: -87px -20px;}
|
||||
.top-country .IT{background-position: -116px -20px;}
|
||||
.top-country .IR{background-position: -145px -20px;}
|
||||
.top-country .IQ{background-position: -174px -20px;}
|
||||
.top-country .IN{background-position: -203px -20px;}
|
||||
.top-country .IL{background-position: -232px -20px;}
|
||||
.top-country .IE{background-position: -261px -20px;}
|
||||
.top-country .ID{background-position: -290px -20px;}
|
||||
.top-country .HU{background-position: -319px -20px;}
|
||||
.top-country .HK{background-position: -348px -20px;}
|
||||
.top-country .GR{background-position: -377px -20px;}
|
||||
.top-country .GH{background-position: -406px -20px;}
|
||||
.top-country .FR{background-position: -435px -20px;}
|
||||
.top-country .ES{background-position: -464px -20px;}
|
||||
.top-country .EG{background-position: -493px -20px;}
|
||||
.top-country .EE{background-position: -522px -20px;}
|
||||
.top-country .DK{background-position: -551px -20px;}
|
||||
|
||||
.top-country .KSA{background-position: 0px -40px;}
|
||||
.top-country .KW{background-position: -29px -40px;}
|
||||
.top-country .KZ{background-position: -58px -40px;}
|
||||
.top-country .LA{background-position: -87px -40px;}
|
||||
.top-country .LB{background-position: -116px -40px;}
|
||||
.top-country .LK{background-position: -145px -40px;}
|
||||
.top-country .LT{background-position: -174px -40px;}
|
||||
.top-country .MA{background-position: -203px -40px;}
|
||||
.top-country .MDV{background-position: -232px -40px;}
|
||||
.top-country .MM{background-position: -261px -40px;}
|
||||
.top-country .MX{background-position: -290px -40px;}
|
||||
.top-country .MY{background-position: -319px -40px;}
|
||||
.top-country .NG{background-position: -348px -40px;}
|
||||
.top-country .NL{background-position: -377px -40px;}
|
||||
.top-country .NO{background-position: -406px -40px;}
|
||||
.top-country .NP{background-position: -435px -40px;}
|
||||
.top-country .NZ{background-position: -464px -40px;}
|
||||
.top-country .PE{background-position: -493px -40px;}
|
||||
.top-country .PG{background-position: -522px -40px;}
|
||||
.top-country .PH{background-position: -551px -40px;}
|
||||
|
||||
.top-country .ZA{background-position: 0px -60px;}
|
||||
.top-country .VN{background-position: -29px -60px;}
|
||||
.top-country .UY{background-position: -58px -60px;}
|
||||
.top-country .US{background-position: -87px -60px;}
|
||||
.top-country .UK{background-position: -116px -60px;}
|
||||
.top-country .UA{background-position: -145px -60px;}
|
||||
.top-country .TW{background-position: -174px -60px;}
|
||||
.top-country .TR{background-position: -203px -60px;}
|
||||
.top-country .TN{background-position: -232px -60px;}
|
||||
.top-country .TH{background-position: -261px -60px;}
|
||||
.top-country .SYR{background-position: -290px -60px;}
|
||||
.top-country .SK{background-position: -319px -60px;}
|
||||
.top-country .SGL{background-position: -348px -60px;}
|
||||
.top-country .SG{background-position: -377px -60px;}
|
||||
.top-country .SE{background-position: -406px -60px;}
|
||||
.top-country .RU{background-position: -435px -60px;}
|
||||
.top-country .RO{background-position: -464px -60px;}
|
||||
.top-country .PT{background-position: -493px -60px;}
|
||||
.top-country .PL{background-position: -522px -60px;}
|
||||
.top-country .PK{background-position: -551px -60px;}
|
||||
|
||||
.top-country .ZM{background-position: 0px -80px;}
|
||||
|
||||
.header-PC .nav .navfl{float:right; width:84%; text-align: right;}
|
||||
.header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);}
|
||||
.header-PC .top-country .close{width:100%; overflow: hidden; text-align: center;}
|
||||
.header-PC .top-country .icon-close{width:3em; height: 3em; border-radius: 1.5em; display: inline-block; background-color:#333; color:#FFF; line-height: 3em; font-size: 10px; margin-top:20px;}
|
||||
.header-PC .top-country .icon-close:hover{cursor: pointer;}
|
||||
/*原样式*/
|
||||
.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:28px;left:0px;z-index:9999;display:none;}
|
||||
@media screen and (min-width:1480px){
|
||||
.w1440{width:1440px; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.w1440{width:98%; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.header-Index .nav{width:100%;height:60px;background-color: transparent;position:absolute; z-index: 9999;}
|
||||
.header-Product .nav{width:100%;height:60px;background-color: #FFF;position:fixed; z-index: 9999; top:40px; box-shadow: 0px 0px 15px #999;}
|
||||
.nav .top{position:absolute;left:24px;}
|
||||
.nav .top .zg{font-size:16px;color:#002855;line-height:60px;}
|
||||
.nav .top .zg i{display:inline-block;width:23px;height:22px;background:url(../images/china.png);vertical-align:middle;margin-right:6px; ;}
|
||||
.navcon{width:990px;margin:0 auto}
|
||||
|
||||
/*.nav .logo{position:absolute;left:50%;top:19px;transform:translate(-34%,0%);z-index:999;}删除*/
|
||||
.nav .navfl{float:left;}
|
||||
.nav .navfl .navul{float:left; width:100%; }
|
||||
.nav .navfl .navul li{display:inline-block;line-height:60px;}
|
||||
@media screen and (min-width:1280px){
|
||||
.nav .navfl .navul li{padding-left:50px;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.nav .navfl .navul li:first-child{padding-left:0px;}
|
||||
.nav .navfl .navul li{padding-left:30px;}
|
||||
}
|
||||
.nav .navfl .navul li:first-child{margin-left:0px;}
|
||||
.nav .navfl .navul li a{font-size:1em;}
|
||||
.nav .navfl .navul .products a{font-size:1em;}
|
||||
.nav .navfl .navul li span{display: inline-block; }
|
||||
.nav .navfl .navul li .arrow{
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .navfl .navul li .arrow-down{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;
|
||||
}
|
||||
.nav .navfl .navul li a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .menu_a{color:#444;}
|
||||
.nav .navfl .navul li .menu_a:hover{color:#009fdf;}
|
||||
.nav .navrh .rhlist li.lispan{margin-right:50px;}
|
||||
.nav .navfl .navul li.ahover a,.nav .navrh .rhlist li.ahover a{color:#009fdf}
|
||||
.nav .navfl .navul li .navlist{width:100%;position:absolute;left:0;right:0;display:none;z-index:999999;}
|
||||
.nav .navfl .navul li .navlist .listfl{width:55%;height:331px;background:#efefef;float:left;}
|
||||
.nav .navfl .navul li .navlist .listfl .navicon{float:right;width:540px;margin-top:69px;}
|
||||
.nav .navfl .navul li .navlist .listfl a{display:inline-block;margin-right:75px;text-align:center;line-height:40px; float: left; margin-bottom: 20px;}
|
||||
.nav .navfl .navul li .navlist .listfl a img{display:inline-block; width:42px;}
|
||||
.nav .navfl .navul li .navlist .listfl a p{font-size:14px;color:#444;text-align:center; margin-bottom: 12px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh{width:45%;height:331px;background:#e3e3e3;float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg{margin:30px 24px 0;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg{float:left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg img{width:281px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit{height:118px;float:left;margin-left:20px; text-align: left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit p{line-height:normal;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .ntit{font-size:14px;color:#444;margin-top:20px; margin-bottom: 16px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .nline{width:23px;height:2px;background:#26a6e1;margin:10px 0 50px 0;}
|
||||
|
||||
/*头部新增 s*/
|
||||
.nav .navfl .navul li .navlist1{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist1 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddrh{float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist2{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist2 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddrh{float:right;}
|
||||
|
||||
/*头部新增 e*/
|
||||
|
||||
|
||||
.nav .navrh{float:right;}
|
||||
|
||||
.nav .navrh .rhlist{float:left;}
|
||||
|
||||
.nav .navrh .rhlist li{display:inline-block;line-height:60px;margin-right:50px;}
|
||||
|
||||
.nav .navrh .rhlist li:last-child{margin-right:0px;}
|
||||
|
||||
.nav .navrh .rhlist li a{font-size:16px;color:#002855;}
|
||||
|
||||
.nav .navrh .rhlist li span{display:inline-block;width:1px;height:24px;background:#002855;line-height:40px;vertical-align:middle;}
|
||||
|
||||
.nav .navrh .rhlist li:hover a{color:#009fdf;}
|
||||
|
||||
|
||||
|
||||
.header-PC .Searchbox{position:absolute;right:56px;top:20px; height: 60px; background-color: #FFF;}
|
||||
|
||||
.header-PC .Searchbox .icon{cursor:pointer;}
|
||||
|
||||
.header-PC .Searchbox .icon img{vertical-align:middle;margin:-3px 10px 0 0;}
|
||||
|
||||
.header-PC .search{display:none;background:#fff;width:100%; height:60px; position:absolute;right:0px;top:28px;z-index:888;}
|
||||
|
||||
.header-PC .search .ipt{width:80%;height:30px;line-height:30px;text-indent:1em;}
|
||||
|
||||
.header-PC .search .searchbtn{color:#fff; cursor:pointer; width:70px; height:30px; border-radius:13px; background:#002855; position:absolute; right:0px; top:0px;}
|
||||
|
||||
#wap-search-in {height: 30px; line-height: 30px; margin-top:15px; border: none; width: 40%; margin-left:30%; }
|
||||
#wap-search-btn{}
|
||||
.header-PC .search button{color:#444; background-color: transparent; font-size: 24px; line-height: 60px;}
|
||||
/*.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:90px;left:0px;z-index:999;display:none;}删除*/
|
||||
|
||||
.topul li{width:20%;float:left;margin-right:6.6%;}
|
||||
|
||||
.topul li:nth-child(4n){margin-right:0px;}
|
||||
|
||||
.topul li p{font-size:24px;color:#fff;}
|
||||
|
||||
.topul li dl{margin-top:48px;}
|
||||
|
||||
.topul li dl dd{margin-bottom:22px;}
|
||||
|
||||
.topul li dl a{float:left;font-size:18px;color:#fff;}
|
||||
|
||||
.topul li dl a:nth-child(2n){float:right;font-size:18px;color:#009fdf;padding-bottom:8px;border-bottom:1px solid #008eca;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*手机端*/
|
||||
.header-M .header-fixed{height: 50px; line-height: 50px; position: fixed; top:0px; width:100%; background-color:#FFF; z-index: 9; margin-bottom: 50px;}
|
||||
.header-M .logo{width:130px; margin:auto; height: 50px; line-height: 50px;}
|
||||
.header-M .logo img{vertical-align: middle; display: inline-block;}
|
||||
.header-M .Country{border-radius: 1.5em; position: absolute; top:50%; left:8%; z-index: 1; line-height: 20px; text-align: center; color:#333; margin-left:-3px; margin-top:-10px;cursor: pointer;}
|
||||
.m-Country{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#FFFFFF; z-index: 2; line-height: 30px;}
|
||||
.m-Menu{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 999999;}
|
||||
.header-M .Menu{position: absolute; top:0px; right:8%; color:#333; margin-right:-3px;}
|
||||
.Country img{margin-right:5px;}
|
||||
.m-Menu li{border-bottom:1px solid #204f7e; position: relative; opacity: 0}
|
||||
.m-Menu li li{line-height: 38px; opacity: 1}
|
||||
.m-Menu li li a{margin-top:-1px; padding-left:0px; line-height: 36px; display: inline-block}
|
||||
.m-Menu li a{padding-left:8%; color: #FFF; text-decoration: none; line-height: 45px; font-size: 1em; display: block;}
|
||||
.m-Menu li .arrow, .m-Menu li .arrow-r{ color:#FFF; position: absolute; right:8%; font-size: 1.4em; line-height: 30px;}
|
||||
.m-Menu li .arrow{top:7px;}
|
||||
.m-Menu li .arrow-r{top:9px;}
|
||||
.nav .arrow, .m-Menu li .arrow{
|
||||
transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .arrow, .m-Menu li .arrow-r{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
}
|
||||
.m-Menu li, .SingIn-button, .search{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode:forwards ;
|
||||
-webkit-animation-fill-mode:forwards ;
|
||||
}
|
||||
.m-Menu li:nth-child(1){
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu li:nth-child(2){
|
||||
animation-delay:0.1s;
|
||||
-webkit-animation-delay: 0.1s;
|
||||
}
|
||||
.m-Menu li:nth-child(3){
|
||||
animation-delay:0.2s;
|
||||
-webkit-animation-delay: 0.2s;
|
||||
|
||||
}
|
||||
.m-Menu li:nth-child(4){
|
||||
animation-delay:0.3s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(5){
|
||||
animation-delay:0.4s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(6){
|
||||
animation-delay:0.5s;
|
||||
-webkit-animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.S-Menu{width:100%; background-color:#2e6297; overflow: hidden;}
|
||||
.S-Menu li{border-bottom: 1px solid #285887; padding-left:10%; padding-top:0; color:#FFF; font-size: 0.9em;}
|
||||
.S-Menu li:last-child{border-bottom: none;}
|
||||
.S-Menu li{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 0s;
|
||||
animation-duration: 0s;
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu .Close{position: absolute; top:5%; right:8%; color:#333; font-size: 20px; border:2px solid #999; width:42px; height: 42px; border-radius: 21px; text-align: center; box-shadow: 0px 0px 2px #999;}
|
||||
.m-Menu .SingIn-button a{display: inline-block; width:70px; height: 30px; border:1px solid #FFF; color:#FFF; margin-left:5px; margin-right:5px; text-align: center; text-decoration: none; margin-top:30px; line-height: 28px; font-size: 1em}
|
||||
.m-Menu .SingIn-button a:hover{border:1px solid #FFF; background-color:#FFF; color: #333;}
|
||||
.m-Menu .search{width:84%; margin:30px auto 0; position: relative; opacity: 0;}
|
||||
|
||||
.m-Menu .search .form-control{width:90%; height: 32px; line-height: 32px; border:1px solid rgba(220,221,221,0.7); vertical-align: middle; padding-left:5%; padding-right:5%; font-size: 0.9em; background-color:#FFF;}
|
||||
.m-Menu .search .updown_search_btn{line-height: 35px; background:none; border:none; position: absolute; right:2%; top:0px; font-size: 1.5em; vertical-align: middle; color:#333;}
|
||||
|
||||
.m-Menu .SingIn-button{opacity: 0}
|
||||
.m-Menu .SingIn-button{
|
||||
animation-delay:0.53s;
|
||||
-webkit-animation-delay: 0.53s;
|
||||
}
|
||||
.m-Menu .search{
|
||||
animation-delay:0.55s;
|
||||
-webkit-animation-delay: 0.55s;
|
||||
}
|
||||
|
||||
.m-Country{padding-top:2%;}
|
||||
|
||||
.m-Country ul{width:90%; margin:auto;}
|
||||
.m-Country li{width:18%; float: left; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;}
|
||||
|
||||
.m-Country li p{display: inline-block;}
|
||||
|
||||
@media screen and (min-width:641px){
|
||||
.m-Country li:nth-child(5n){margin-right:0px;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.m-Country li{width:23%; margin-right:2%;}
|
||||
.m-Country li:nth-child(4n){margin-right:0px;}
|
||||
}
|
||||
|
||||
|
||||
@-webkit-keyframes fadeInUp {
|
||||
0% {
|
||||
top:1000px;
|
||||
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity:0;
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
|
||||
/*头部导航栏变色*/
|
||||
.theme-white .navfl .navul li a{color:#FFF;}
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-white .logo-white{display: block}
|
||||
.theme-white .logo-black{display: none; }
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-black .logo-white{display: none}
|
||||
.theme-black .logo-black{display: block; }
|
||||
.all-logo, .all-logo-black{position: relative;}
|
||||
@media screen and (min-width:960px){
|
||||
.logo{position: absolute; left:0; top:0;}
|
||||
}
|
||||
/*公共样式*/
|
||||
.search input {height: 30px; line-height: 30px; border:none; width:40%;}
|
||||
.banner-other{margin-top:60px; width:100%;}
|
||||
@media screen and (max-width:959px){
|
||||
.banner-other{margin-top:0px; width:100%;}
|
||||
}
|
||||
466
public/frontend/web/css/header.css
Executable file
466
public/frontend/web/css/header.css
Executable file
@@ -0,0 +1,466 @@
|
||||
@charset "utf-8";
|
||||
@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;}
|
||||
}
|
||||
|
||||
/* CSS Document */
|
||||
@media screen and (min-width:960px){
|
||||
.header-PC{display: block}
|
||||
.header-M{display: none;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.header-PC{display: none}
|
||||
.header-M{display: block; height: 50px;}
|
||||
}
|
||||
.icon-country:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
.icon-menu:before {
|
||||
font-size: 2em
|
||||
}
|
||||
.icon-close:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
/*搜索框字体颜色*/
|
||||
-webkit-input-placeholder { /* WebKit browsers */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
color: #999;
|
||||
}
|
||||
-ms-input-placeholder { /* Internet Explorer 10+ */
|
||||
color: #999;
|
||||
}
|
||||
/*PC端*/
|
||||
.header-PC .top{height: 40px; background-color:#252525; color:#FFF;}
|
||||
.header-Product .top{position: fixed; top:0px; width:100%; z-index: 9999;}
|
||||
.header-PC .top-L{width:50%; text-align:left; font-size: 0.875em; line-height: 40px; float: left; position: relative;}
|
||||
.header-PC .top-L img{margin-top: 13px; width:24px; height: 16px;}
|
||||
.header-PC .top-L img:hover, .header-PC .top-L span:hover{cursor: pointer;}
|
||||
.header-PC .top-L a{color:#FFF;}
|
||||
.header-PC .top-L a:hover{color:rgba(255,255,255,0.8);}
|
||||
/*.header-PC .top-L{display:inline-block; margin-left:5px; line-height: 28px;}*/
|
||||
.top-old{display: inline-block; margin-left:5px; margin-right: 4px; width:1px; height:9px; background-color:rgba(255,255,255,0.8);}
|
||||
|
||||
|
||||
.header-PC .top-R{width:50%; text-align: right; float: left; font-size: 1em; line-height: 38px;}
|
||||
.header-PC .top-R a{color:#FFF; display: inline-block}
|
||||
.header-PC .top-R a:first-child{margin-right: 0.26vw;}
|
||||
.header-PC .top-R a:last-child{margin-left: 0.26vw;}
|
||||
.header-PC .top-R a:hover{color:#009fdf}
|
||||
.header-PC .top-R .icon-search{display: inline-block; line-height: 33px;}
|
||||
.header-PC .logo{width:16%; float: left; height: 60px; left:0px; vertical-align:middle; line-height: 60px;}
|
||||
.header-PC .logo img{vertical-align: middle; max-width: 100%;}
|
||||
.header-PC .top-country{background-color:#f1f1f1; display: block; color:#333333; padding:15px 0 0; border-top: 1px solid rgba(255,255,255,0.6); font-size: 0.875em; top:40px; box-shadow: 5px 5px 10px rgba(0,0,0,0.2);width:250px; position: absolute;; font-weight: 600;}
|
||||
.header-PC .top-country li a {color: #333;}
|
||||
.header-PC .top-country li a:hover {color: #009fdf;}
|
||||
.header-PC .top-country li{width:220px; margin-left: 1%; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px; height: 19px;}
|
||||
.header-PC .top-country li:nth-child(5n){margin-right:0px;}
|
||||
.header-PC .top-country li:last-child{border-bottom: none;}
|
||||
.header-PC .top-country li p{display: inline-block;}
|
||||
.header-PC .top-country li p:last-child{margin-left:10%; vertical-align:top}
|
||||
.header-PC .top-country ul:after{width:10px; height: 5px; content: ""; background:url(../images/countries/arrow.png); position: absolute; top:-20px; left:7px; z-index: 99999}
|
||||
/*国家*/
|
||||
.top-country .countries{display:inline-block; width:28px; height: 19px; background:url("../images/countries/countries.png") no-repeat; }
|
||||
.top-country .AE{background-position: 0px 0px;}
|
||||
.top-country .AR{background-position: -29px 0px;}
|
||||
.top-country .AT{background-position: -58px 0px;}
|
||||
.top-country .AU{background-position: -87px 0px;}
|
||||
.top-country .AZ{background-position: -116px 0px;}
|
||||
.top-country .BD{background-position: -145px 0px;}
|
||||
.top-country .BE{background-position: -174px 0px;}
|
||||
.top-country .BG{background-position: -203px 0px;}
|
||||
.top-country .BL{background-position: -232px 0px;}
|
||||
.top-country .BO{background-position: -261px 0px;}
|
||||
.top-country .BR{background-position: -290px 0px;}
|
||||
.top-country .CA{background-position: -319px 0px;}
|
||||
.top-country .CH{background-position: -348px 0px;}
|
||||
.top-country .CL{background-position: -377px 0px;}
|
||||
.top-country .ZH{background-position: -406px 0px;}
|
||||
.top-country .CO{background-position: -435px 0px;}
|
||||
.top-country .CS{background-position: -464px 0px;}
|
||||
.top-country .CY{background-position: -493px 0px;}
|
||||
.top-country .DB{background-position: -522px 0px;}
|
||||
.top-country .DE{background-position: -551px 0px;}
|
||||
|
||||
.top-country .KR{background-position: 0px -20px;}
|
||||
.top-country .KH{background-position: -29px -20px;}
|
||||
.top-country .JP{background-position: -58px -20px;}
|
||||
.top-country .JQ{background-position: -87px -20px;}
|
||||
.top-country .IT{background-position: -116px -20px;}
|
||||
.top-country .IR{background-position: -145px -20px;}
|
||||
.top-country .IQ{background-position: -174px -20px;}
|
||||
.top-country .IN{background-position: -203px -20px;}
|
||||
.top-country .IL{background-position: -232px -20px;}
|
||||
.top-country .IE{background-position: -261px -20px;}
|
||||
.top-country .ID{background-position: -290px -20px;}
|
||||
.top-country .HU{background-position: -319px -20px;}
|
||||
.top-country .HK{background-position: -348px -20px;}
|
||||
.top-country .GR{background-position: -377px -20px;}
|
||||
.top-country .GH{background-position: -406px -20px;}
|
||||
.top-country .FR{background-position: -435px -20px;}
|
||||
.top-country .ES{background-position: -464px -20px;}
|
||||
.top-country .EG{background-position: -493px -20px;}
|
||||
.top-country .EE{background-position: -522px -20px;}
|
||||
.top-country .DK{background-position: -551px -20px;}
|
||||
|
||||
.top-country .KSA{background-position: 0px -40px;}
|
||||
.top-country .KW{background-position: -29px -40px;}
|
||||
.top-country .KZ{background-position: -58px -40px;}
|
||||
.top-country .LA{background-position: -87px -40px;}
|
||||
.top-country .LB{background-position: -116px -40px;}
|
||||
.top-country .LK{background-position: -145px -40px;}
|
||||
.top-country .LT{background-position: -174px -40px;}
|
||||
.top-country .MA{background-position: -203px -40px;}
|
||||
.top-country .MDV{background-position: -232px -40px;}
|
||||
.top-country .MM{background-position: -261px -40px;}
|
||||
.top-country .MX{background-position: -290px -40px;}
|
||||
.top-country .MY{background-position: -319px -40px;}
|
||||
.top-country .NG{background-position: -348px -40px;}
|
||||
.top-country .NL{background-position: -377px -40px;}
|
||||
.top-country .NO{background-position: -406px -40px;}
|
||||
.top-country .NP{background-position: -435px -40px;}
|
||||
.top-country .NZ{background-position: -464px -40px;}
|
||||
.top-country .PE{background-position: -493px -40px;}
|
||||
.top-country .PG{background-position: -522px -40px;}
|
||||
.top-country .PH{background-position: -551px -40px;}
|
||||
|
||||
.top-country .ZA{background-position: 0px -60px;}
|
||||
.top-country .VN{background-position: -29px -60px;}
|
||||
.top-country .UY{background-position: -58px -60px;}
|
||||
.top-country .US{background-position: -87px -60px;}
|
||||
.top-country .UK{background-position: -116px -60px;}
|
||||
.top-country .UA{background-position: -145px -60px;}
|
||||
.top-country .TW{background-position: -174px -60px;}
|
||||
.top-country .TR{background-position: -203px -60px;}
|
||||
.top-country .TN{background-position: -232px -60px;}
|
||||
.top-country .TH{background-position: -261px -60px;}
|
||||
.top-country .SYR{background-position: -290px -60px;}
|
||||
.top-country .SK{background-position: -319px -60px;}
|
||||
.top-country .SGL{background-position: -348px -60px;}
|
||||
.top-country .SG{background-position: -377px -60px;}
|
||||
.top-country .SE{background-position: -406px -60px;}
|
||||
.top-country .RU{background-position: -435px -60px;}
|
||||
.top-country .RO{background-position: -464px -60px;}
|
||||
.top-country .PT{background-position: -493px -60px;}
|
||||
.top-country .PL{background-position: -522px -60px;}
|
||||
.top-country .PK{background-position: -551px -60px;}
|
||||
|
||||
.top-country .ZM{background-position: 0px -80px;}
|
||||
|
||||
.header-PC .nav .navfl{float:right; width:84%; text-align: right;}
|
||||
.header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);}
|
||||
.header-PC .top-country .close{width:100%; overflow: hidden; text-align: center;}
|
||||
.header-PC .top-country .icon-close{width:3em; height: 3em; border-radius: 1.5em; display: inline-block; background-color:#333; color:#FFF; line-height: 3em; font-size: 10px; margin-top:20px;}
|
||||
.header-PC .top-country .icon-close:hover{cursor: pointer; color: #333;}
|
||||
/*原样式*/
|
||||
.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:28px;left:0px;z-index:9999;display:none;}
|
||||
@media screen and (min-width:1480px){
|
||||
.w1440{width:1440px; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.w1440{width:98%; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.header-Index .nav{width:100%;height:60px;background-color: transparent;position:absolute; z-index: 99;}
|
||||
.header-Product .nav{width:100%;height:60px;background-color: #FFF;position:fixed; z-index: 99; top:40px; box-shadow: 0px 0px 15px #999;}
|
||||
.nav .top{position:absolute;left:24px;}
|
||||
.nav .top .zg{font-size:16px;color:#002855;line-height:60px;}
|
||||
.nav .top .zg i{display:inline-block;width:23px;height:22px;background:url(../images/china.png);vertical-align:middle;margin-right:6px; ;}
|
||||
.navcon{width:990px;margin:0 auto}
|
||||
|
||||
/*.nav .logo{position:absolute;left:50%;top:19px;transform:translate(-34%,0%);z-index:999;}删除*/
|
||||
.nav .navfl{float:left;}
|
||||
.nav .navfl .navul{float:left; width:100%; }
|
||||
.nav .navfl .navul li{display:inline-block;line-height:60px;}
|
||||
@media screen and (min-width:1280px){
|
||||
.nav .navfl .navul li{padding-left:50px;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.nav .navfl .navul li:first-child{padding-left:0px;}
|
||||
.nav .navfl .navul li{padding-left:30px;}
|
||||
}
|
||||
.nav .navfl .navul li:first-child{margin-left:0px;}
|
||||
.nav .navfl .navul li a{font-size:1em;}
|
||||
.nav .navfl .navul .products a{font-size:1em;}
|
||||
.nav .navfl .navul li span{display: inline-block; }
|
||||
.nav .navfl .navul li .arrow{
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .navfl .navul li .arrow-down{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;
|
||||
}
|
||||
.nav .navfl .navul li a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .menu_a{color:#444;}
|
||||
.nav .navfl .navul li .menu_a:hover{color:#009fdf;}
|
||||
.nav .navrh .rhlist li.lispan{margin-right:50px;}
|
||||
.nav .navfl .navul li.ahover a,.nav .navrh .rhlist li.ahover a{color:#009fdf}
|
||||
.nav .navfl .navul li .navlist{width:100%;position:absolute;left:0;right:0;display:none;z-index:999999;}
|
||||
.nav .navfl .navul li .navlist .listfl{width:55%;height:331px;background:#efefef;float:left;}
|
||||
.nav .navfl .navul li .navlist .listfl .navicon{float:right;width:540px;margin-top:69px;}
|
||||
.nav .navfl .navul li .navlist .listfl a{display:inline-block;margin-right:75px;text-align:center;line-height:40px; float: left; margin-bottom: 20px;}
|
||||
.nav .navfl .navul li .navlist .listfl a img{display:inline-block; width:42px;}
|
||||
.nav .navfl .navul li .navlist .listfl a p{font-size:14px;color:#444;text-align:center; margin-bottom: 12px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh{width:45%;height:331px;background:#e3e3e3;float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg{margin:30px 24px 0;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg{float:left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg img{width:281px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit{height:118px;float:left;margin-left:20px; text-align: left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit p{line-height:normal;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .ntit{font-size:14px;color:#444;margin-top:20px; margin-bottom: 16px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .nline{width:23px;height:2px;background:#26a6e1;margin:10px 0 50px 0;}
|
||||
|
||||
/*头部新增 s*/
|
||||
.nav .navfl .navul li .navlist1{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist1 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddrh{float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist2{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist2 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddrh{float:right;}
|
||||
|
||||
/*头部新增 e*/
|
||||
|
||||
|
||||
.nav .navrh{float:right;}
|
||||
|
||||
.nav .navrh .rhlist{float:left;}
|
||||
|
||||
.nav .navrh .rhlist li{display:inline-block;line-height:60px;margin-right:50px;}
|
||||
|
||||
.nav .navrh .rhlist li:last-child{margin-right:0px;}
|
||||
|
||||
.nav .navrh .rhlist li a{font-size:16px;color:#002855;}
|
||||
|
||||
.nav .navrh .rhlist li span{display:inline-block;width:1px;height:24px;background:#002855;line-height:40px;vertical-align:middle;}
|
||||
|
||||
.nav .navrh .rhlist li:hover a{color:#009fdf;}
|
||||
|
||||
|
||||
|
||||
.header-PC .Searchbox{position:absolute;right:56px;top:20px; height: 60px; background-color: #FFF;}
|
||||
|
||||
.header-PC .Searchbox .icon{cursor:pointer;}
|
||||
|
||||
.header-PC .Searchbox .icon img{vertical-align:middle;margin:-3px 10px 0 0;}
|
||||
|
||||
.header-PC .search{display:none;background:#fff;width:100%; height:60px; position:absolute;right:0px;top:28px;z-index:888;}
|
||||
|
||||
.header-PC .search .ipt{width:80%;height:30px;line-height:30px;text-indent:1em;}
|
||||
|
||||
.header-PC .search .searchbtn{color:#fff; cursor:pointer; width:70px; height:30px; border-radius:13px; background:#002855; position:absolute; right:0px; top:0px;}
|
||||
|
||||
#wap-search-in {height: 30px; line-height: 30px; margin-top:15px; border: none; width: 40%; margin-left:30%; }
|
||||
#wap-search-btn{}
|
||||
.header-PC .search button{color:#444; background-color: transparent; font-size: 24px; line-height: 60px;}
|
||||
/*.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:90px;left:0px;z-index:999;display:none;}删除*/
|
||||
|
||||
.topul li{width:20%;float:left;margin-right:6.6%;}
|
||||
|
||||
.topul li:nth-child(4n){margin-right:0px;}
|
||||
|
||||
.topul li p{font-size:24px;color:#fff;}
|
||||
|
||||
.topul li dl{margin-top:48px;}
|
||||
|
||||
.topul li dl dd{margin-bottom:22px;}
|
||||
|
||||
.topul li dl a{float:left;font-size:18px;color:#fff;}
|
||||
|
||||
.topul li dl a:nth-child(2n){float:right;font-size:18px;color:#009fdf;padding-bottom:8px;border-bottom:1px solid #008eca;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*手机端*/
|
||||
.header-M .header-fixed{height: 50px; line-height: 50px; position: fixed; top:0px; width:100%; background-color:#FFF; z-index: 9; margin-bottom: 50px;}
|
||||
.header-M .logo{width:130px; margin:auto; height: 50px; line-height: 50px;}
|
||||
.header-M .logo img{vertical-align: middle; display: inline-block;}
|
||||
.header-M .Country{border-radius: 1.5em; position: absolute; top:50%; left:8%; z-index: 1; line-height: 20px; text-align: center; color:#333; margin-left:-3px; margin-top:-10px;cursor: pointer;}
|
||||
.m-Country{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#FFFFFF; z-index: 2; line-height: 30px;}
|
||||
.m-Menu{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 999999;}
|
||||
.header-M .Menu{position: absolute; top:0px; right:8%; color:#333; margin-right:-3px;}
|
||||
.Country img{margin-right:5px;}
|
||||
.m-Menu li{border-bottom:1px solid #204f7e; position: relative; opacity: 0}
|
||||
.m-Menu li li{line-height: 38px; opacity: 1}
|
||||
.m-Menu li li a{margin-top:-1px; padding-left:0px; line-height: 36px; display: inline-block}
|
||||
.m-Menu li a{padding-left:8%; color: #FFF; text-decoration: none; line-height: 45px; font-size: 1em; display: block;}
|
||||
.m-Menu li .arrow, .m-Menu li .arrow-r{ color:#FFF; position: absolute; right:8%; font-size: 1.4em; line-height: 30px;}
|
||||
.m-Menu li .arrow{top:7px;}
|
||||
.m-Menu li .arrow-r{top:9px;}
|
||||
.nav .arrow, .m-Menu li .arrow{
|
||||
transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .arrow, .m-Menu li .arrow-r{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
}
|
||||
.m-Menu li, .SingIn-button, .search{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode:forwards ;
|
||||
-webkit-animation-fill-mode:forwards ;
|
||||
}
|
||||
.m-Menu li:nth-child(1){
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu li:nth-child(2){
|
||||
animation-delay:0.1s;
|
||||
-webkit-animation-delay: 0.1s;
|
||||
}
|
||||
.m-Menu li:nth-child(3){
|
||||
animation-delay:0.2s;
|
||||
-webkit-animation-delay: 0.2s;
|
||||
|
||||
}
|
||||
.m-Menu li:nth-child(4){
|
||||
animation-delay:0.3s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(5){
|
||||
animation-delay:0.4s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(6){
|
||||
animation-delay:0.5s;
|
||||
-webkit-animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.S-Menu{width:100%; background-color:#2e6297; overflow: hidden;}
|
||||
.S-Menu li{border-bottom: 1px solid #285887; padding-left:10%; padding-top:0; color:#FFF; font-size: 0.9em;}
|
||||
.S-Menu li:last-child{border-bottom: none;}
|
||||
.S-Menu li{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 0s;
|
||||
animation-duration: 0s;
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu .Close{position: absolute; top:5%; right:8%; color:#333; font-size: 20px; border:2px solid #999; width:42px; height: 42px; border-radius: 21px; text-align: center; box-shadow: 0px 0px 2px #999;}
|
||||
.m-Menu .SingIn-button a{display: inline-block; width:70px; height: 30px; border:1px solid #FFF; color:#FFF; margin-left:5px; margin-right:5px; text-align: center; text-decoration: none; margin-top:30px; line-height: 28px; font-size: 1em}
|
||||
.m-Menu .SingIn-button a:hover{border:1px solid #FFF; background-color:#FFF; color: #333;}
|
||||
.m-Menu .search{width:84%; margin:30px auto 0; position: relative; opacity: 0;}
|
||||
|
||||
.m-Menu .search .form-control{width:90%; height: 32px; line-height: 32px; border:1px solid rgba(220,221,221,0.7); vertical-align: middle; padding-left:5%; padding-right:5%; font-size: 0.9em; background-color:#FFF;}
|
||||
.m-Menu .search .updown_search_btn{line-height: 35px; background:none; border:none; position: absolute; right:2%; top:0px; font-size: 1.5em; vertical-align: middle; color:#333;}
|
||||
|
||||
.m-Menu .SingIn-button{opacity: 0}
|
||||
.m-Menu .SingIn-button{
|
||||
animation-delay:0.53s;
|
||||
-webkit-animation-delay: 0.53s;
|
||||
}
|
||||
.m-Menu .search{
|
||||
animation-delay:0.55s;
|
||||
-webkit-animation-delay: 0.55s;
|
||||
}
|
||||
|
||||
.m-Country{padding-top:2%;}
|
||||
|
||||
.m-Country ul{width:90%; margin:auto;}
|
||||
.m-Country li{width:18%; float: left; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;}
|
||||
|
||||
.m-Country li p{display: inline-block;}
|
||||
|
||||
@media screen and (min-width:641px){
|
||||
.m-Country li:nth-child(5n){margin-right:0px;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.m-Country li{width:23%; margin-right:2%;}
|
||||
.m-Country li:nth-child(4n){margin-right:0px;}
|
||||
}
|
||||
|
||||
|
||||
@-webkit-keyframes fadeInUp {
|
||||
0% {
|
||||
top:1000px;
|
||||
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity:0;
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
|
||||
/*头部导航栏变色*/
|
||||
.theme-white .navfl .navul li a{color:#FFF;}
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-white .logo-white{display: block}
|
||||
.theme-white .logo-black{display: none; }
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-black .logo-white{display: none}
|
||||
.theme-black .logo-black{display: block; }
|
||||
.all-logo, .all-logo-black{position: relative;}
|
||||
@media screen and (min-width:960px){
|
||||
.logo{position: absolute; left:0; top:0;}
|
||||
}
|
||||
/*公共样式*/
|
||||
.search input {height: 30px; line-height: 30px; border:none; width:40%;}
|
||||
.banner-other{margin-top:60px; width:100%;}
|
||||
@media screen and (max-width:959px){
|
||||
.banner-other{margin-top:0px; width:100%;}
|
||||
}
|
||||
362
public/frontend/web/css/header20190304.css
Executable file
362
public/frontend/web/css/header20190304.css
Executable file
@@ -0,0 +1,362 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/* CSS Document */
|
||||
@media screen and (min-width:960px){
|
||||
.header-PC{display: block}
|
||||
.header-M{display: none;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.header-PC{display: none}
|
||||
.header-M{display: block; height: 50px;}
|
||||
}
|
||||
.icon-country:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
.icon-menu:before {
|
||||
font-size: 2em
|
||||
}
|
||||
.icon-close:before {
|
||||
font-size: 1.8em;
|
||||
}
|
||||
|
||||
/*搜索框字体颜色*/
|
||||
-webkit-input-placeholder { /* WebKit browsers */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 4 to 18 */
|
||||
color: #999;
|
||||
}
|
||||
-moz-placeholder { /* Mozilla Firefox 19+ */
|
||||
color: #999;
|
||||
}
|
||||
-ms-input-placeholder { /* Internet Explorer 10+ */
|
||||
color: #999;
|
||||
}
|
||||
/*PC端*/
|
||||
.header-PC .top{height: 28px; background-color:#252525; color:#FFF;}
|
||||
.header-Product .top{position: fixed; top:0px; width:100%; z-index: 9999;}
|
||||
.header-PC .top-L{width:50%; text-align:left; font-size: 0.75em; line-height: 28px; float: left;}
|
||||
.header-PC .top-L img{margin-top: 7px; width:24px; height: 16px;}
|
||||
.header-PC .top-L img:hover, .header-PC .top-L span:hover{cursor: pointer;}
|
||||
.header-PC .top-L a{color:#FFF;}
|
||||
.header-PC .top-L a:hover{color:rgba(255,255,255,0.8);}
|
||||
/*.header-PC .top-L{display:inline-block; margin-left:5px; line-height: 28px;}*/
|
||||
.header-PC .top-L .old{display: inline-block; margin-left:5px; margin-right: 4px; width:1px; height:9px; background-color:rgba(255,255,255,0.8);}
|
||||
|
||||
.header-PC .top-R{width:50%; text-align: right; float: left; font-size: 1em; line-height: 27px;}
|
||||
.header-PC .top-R a{color:#FFF;}
|
||||
.header-PC .top-R a:hover{color:#009fdf}
|
||||
.header-PC .logo{width:16%; float: left; height: 60px; left:0px; vertical-align:middle; line-height: 60px;}
|
||||
.header-PC .logo img{vertical-align: middle; max-width: 100%;}
|
||||
.header-PC .top-country{background-color:#f1f1f1; display: block; color:#333333; padding:15px 0 35px; border-top: 1px solid rgba(255,255,255,0.6); font-size: 0.875em; position: fixed; top:28px; box-shadow: 5px 5px 10px rgba(0,0,0,0.2);}
|
||||
.header-PC .top-country li{width:18%; float: left; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;}
|
||||
.header-PC .top-country li:nth-child(5n){margin-right:0px;}
|
||||
.header-PC .top-country li p{display: inline-block;}
|
||||
.header-PC .top-country li p:last-child{margin-left:10%;}
|
||||
.header-PC .top-country ul:after{width:10px; height: 5px; content: ""; background:url(../images/countries/arrow.png); position: absolute; top:-20px; left:7px; z-index: 99999}
|
||||
.header-PC .nav .navfl{float:right; width:84%; text-align: right;}
|
||||
.header-PC .nav-bg{background-color:#efefef; border-bottom: 1px solid rgba(0,0,0,0.5);}
|
||||
.header-PC .top-country .close{width:100%; overflow: hidden; text-align: center;}
|
||||
.header-PC .top-country .icon-close{width:3em; height: 3em; border-radius: 1.5em; display: inline-block; background-color:#333; color:#FFF; line-height: 3em; font-size: 10px; margin-top:20px;}
|
||||
.header-PC .top-country .icon-close:hover{cursor: pointer;}
|
||||
/*原样式*/
|
||||
.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:28px;left:0px;z-index:9999;display:none;}
|
||||
@media screen and (min-width:1480px){
|
||||
.w1440{width:1440px; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.w1440{width:98%; margin-left: auto; margin-right: auto;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.header-Index .nav{width:100%;height:60px;background-color: transparent;position:absolute; z-index: 9999;}
|
||||
.header-Product .nav{width:100%;height:60px;background-color: #FFF;position:fixed; z-index: 9999; top:28px; box-shadow: 0px 0px 15px #999;}
|
||||
.nav .top{position:absolute;left:24px;}
|
||||
.nav .top .zg{font-size:16px;color:#002855;line-height:60px;}
|
||||
.nav .top .zg i{display:inline-block;width:23px;height:22px;background:url(../images/china.png);vertical-align:middle;margin-right:6px; ;}
|
||||
.navcon{width:990px;margin:0 auto}
|
||||
|
||||
/*.nav .logo{position:absolute;left:50%;top:19px;transform:translate(-34%,0%);z-index:999;}删除*/
|
||||
.nav .navfl{float:left;}
|
||||
.nav .navfl .navul{float:left; width:100%; }
|
||||
.nav .navfl .navul li{display:inline-block;line-height:60px;}
|
||||
@media screen and (min-width:1280px){
|
||||
.nav .navfl .navul li{padding-left:50px;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.nav .navfl .navul li:first-child{padding-left:0px;}
|
||||
.nav .navfl .navul li{padding-left:30px;}
|
||||
}
|
||||
.nav .navfl .navul li:first-child{margin-left:0px;}
|
||||
.nav .navfl .navul li a{font-size:1em;}
|
||||
.nav .navfl .navul .products a{font-size:1em;}
|
||||
.nav .navfl .navul li span{display: inline-block; }
|
||||
.nav .navfl .navul li .arrow{
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .navfl .navul li .arrow-down{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
vertical-align: bottom; line-height:55px; font-size: 16px; margin-left:5px;
|
||||
}
|
||||
.nav .navfl .navul li a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .menu_a{color:#444;}
|
||||
.nav .navfl .navul li .menu_a:hover{color:#009fdf;}
|
||||
.nav .navrh .rhlist li.lispan{margin-right:50px;}
|
||||
.nav .navfl .navul li.ahover a,.nav .navrh .rhlist li.ahover a{color:#009fdf}
|
||||
.nav .navfl .navul li .navlist{width:100%;position:absolute;left:0;right:0;display:none;z-index:999999;}
|
||||
.nav .navfl .navul li .navlist .listfl{width:55%;height:331px;background:#efefef;float:left;}
|
||||
.nav .navfl .navul li .navlist .listfl .navicon{float:right;width:540px;margin-top:69px;}
|
||||
.nav .navfl .navul li .navlist .listfl a{display:inline-block;margin-right:75px;text-align:center;line-height:40px; float: left; margin-bottom: 20px;}
|
||||
.nav .navfl .navul li .navlist .listfl a img{display:inline-block; width:42px;}
|
||||
.nav .navfl .navul li .navlist .listfl a p{font-size:14px;color:#444;text-align:center; margin-bottom: 12px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh{width:45%;height:331px;background:#e3e3e3;float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg{margin:30px 24px 0;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg{float:left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navimg .liimg img{width:281px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit{height:118px;float:left;margin-left:20px; text-align: left;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit p{line-height:normal;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .ntit{font-size:14px;color:#444;margin-top:20px; margin-bottom: 16px;}
|
||||
|
||||
.nav .navfl .navul li .navlist .listrh .navtit .nline{width:23px;height:2px;background:#26a6e1;margin:10px 0 50px 0;}
|
||||
|
||||
/*头部新增 s*/
|
||||
.nav .navfl .navul li .navlist1{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist1 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist1 dd .ddrh{float:right;}
|
||||
|
||||
.nav .navfl .navul li .navlist2{background:#efefef;padding:59px 0 56px 0;}
|
||||
.nav .navfl .navul li .navlist2 dd{width:520px;margin:0 auto;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl{float:left;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a{display:block;font-size:14px;color:#444;line-height:normal;margin-bottom:18px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:hover{color:#009fdf;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:first-child{margin-top:15px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddfl a:last-child{margin-bottom:0px;}
|
||||
.nav .navfl .navul li .navlist2 dd .ddrh{float:right;}
|
||||
|
||||
/*头部新增 e*/
|
||||
|
||||
|
||||
.nav .navrh{float:right;}
|
||||
|
||||
.nav .navrh .rhlist{float:left;}
|
||||
|
||||
.nav .navrh .rhlist li{display:inline-block;line-height:60px;margin-right:50px;}
|
||||
|
||||
.nav .navrh .rhlist li:last-child{margin-right:0px;}
|
||||
|
||||
.nav .navrh .rhlist li a{font-size:16px;color:#002855;}
|
||||
|
||||
.nav .navrh .rhlist li span{display:inline-block;width:1px;height:24px;background:#002855;line-height:40px;vertical-align:middle;}
|
||||
|
||||
.nav .navrh .rhlist li:hover a{color:#009fdf;}
|
||||
|
||||
|
||||
|
||||
.header-PC .Searchbox{position:absolute;right:56px;top:20px; height: 60px; background-color: #FFF;}
|
||||
|
||||
.header-PC .Searchbox .icon{cursor:pointer;}
|
||||
|
||||
.header-PC .Searchbox .icon img{vertical-align:middle;margin:-3px 10px 0 0;}
|
||||
|
||||
.header-PC .search{display:none;background:#fff;width:100%; height:60px; position:absolute;right:0px;top:28px;z-index:888;}
|
||||
|
||||
.header-PC .search .ipt{width:80%;height:30px;line-height:30px;text-indent:1em;}
|
||||
|
||||
.header-PC .search .searchbtn{color:#fff; cursor:pointer; width:70px; height:30px; border-radius:13px; background:#002855; position:absolute; right:0px; top:0px;}
|
||||
|
||||
#wap-search-in {height: 30px; line-height: 30px; margin-top:15px; border: none; width: 40%; margin-left:30%; }
|
||||
#wap-search-btn{}
|
||||
.header-PC .search button{color:#444; background-color: transparent; font-size: 24px; line-height: 60px;}
|
||||
/*.topnav{width:100%;padding:90px 0 104px 0;background:#002855;position:absolute;top:90px;left:0px;z-index:999;display:none;}删除*/
|
||||
|
||||
.topul li{width:20%;float:left;margin-right:6.6%;}
|
||||
|
||||
.topul li:nth-child(4n){margin-right:0px;}
|
||||
|
||||
.topul li p{font-size:24px;color:#fff;}
|
||||
|
||||
.topul li dl{margin-top:48px;}
|
||||
|
||||
.topul li dl dd{margin-bottom:22px;}
|
||||
|
||||
.topul li dl a{float:left;font-size:18px;color:#fff;}
|
||||
|
||||
.topul li dl a:nth-child(2n){float:right;font-size:18px;color:#009fdf;padding-bottom:8px;border-bottom:1px solid #008eca;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*手机端*/
|
||||
.header-M .header-fixed{height: 50px; line-height: 50px; position: fixed; top:0px; width:100%; background-color:#FFF; z-index: 9; margin-bottom: 50px;}
|
||||
.header-M .logo{width:130px; margin:auto; height: 50px; line-height: 50px;}
|
||||
.header-M .logo img{vertical-align: middle; display: inline-block;}
|
||||
.header-M .Country{border-radius: 1.5em; position: absolute; top:50%; left:8%; z-index: 1; line-height: 20px; text-align: center; color:#333; margin-left:-3px; margin-top:-10px;cursor: pointer;}
|
||||
.m-Country{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#FFFFFF; z-index: 2; line-height: 30px;}
|
||||
.m-Menu{width:100%; height: 100%; position: fixed; top:50px; left:0; background-color:#2c5c8f; z-index: 999999;}
|
||||
.header-M .Menu{position: absolute; top:0px; right:8%; color:#333; margin-right:-3px;}
|
||||
.Country img{margin-right:5px;}
|
||||
.m-Menu li{border-bottom:1px solid #204f7e; position: relative; opacity: 0}
|
||||
.m-Menu li li{line-height: 38px; opacity: 1}
|
||||
.m-Menu li li a{margin-top:-1px; padding-left:0px; line-height: 36px; display: inline-block}
|
||||
.m-Menu li a{padding-left:8%; color: #FFF; text-decoration: none; line-height: 45px; font-size: 1em; display: block;}
|
||||
.m-Menu li .arrow, .m-Menu li .arrow-r{ color:#FFF; position: absolute; right:8%; font-size: 1.4em; line-height: 30px;}
|
||||
.m-Menu li .arrow{top:7px;}
|
||||
.m-Menu li .arrow-r{top:9px;}
|
||||
.nav .arrow, .m-Menu li .arrow{
|
||||
transform:rotate(180deg);
|
||||
-ms-transform:rotate(180deg); /* IE 9 */
|
||||
-moz-transform:rotate(180deg); /* Firefox */
|
||||
-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(180deg);
|
||||
}
|
||||
.nav .arrow, .m-Menu li .arrow-r{
|
||||
transform:rotate(360deg);
|
||||
-ms-transform:rotate(360deg); /* IE 9 */
|
||||
-moz-transform:rotate(360deg); /* Firefox */
|
||||
-webkit-transform:rotate(360deg); /* Safari 和 Chrome */
|
||||
-o-transform:rotate(360deg);
|
||||
}
|
||||
.m-Menu li, .SingIn-button, .search{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode:forwards ;
|
||||
-webkit-animation-fill-mode:forwards ;
|
||||
}
|
||||
.m-Menu li:nth-child(1){
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu li:nth-child(2){
|
||||
animation-delay:0.1s;
|
||||
-webkit-animation-delay: 0.1s;
|
||||
}
|
||||
.m-Menu li:nth-child(3){
|
||||
animation-delay:0.2s;
|
||||
-webkit-animation-delay: 0.2s;
|
||||
|
||||
}
|
||||
.m-Menu li:nth-child(4){
|
||||
animation-delay:0.3s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(5){
|
||||
animation-delay:0.4s;
|
||||
-webkit-animation-delay: 0.4s;
|
||||
}
|
||||
.m-Menu li:nth-child(6){
|
||||
animation-delay:0.5s;
|
||||
-webkit-animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.S-Menu{width:100%; background-color:#2e6297; overflow: hidden;}
|
||||
.S-Menu li{border-bottom: 1px solid #285887; padding-left:10%; padding-top:0; color:#FFF; font-size: 0.9em;}
|
||||
.S-Menu li:last-child{border-bottom: none;}
|
||||
.S-Menu li{
|
||||
-webkit-animation-name: fadeInUp;
|
||||
animation-name: fadeInUp;
|
||||
-webkit-animation-duration: 0s;
|
||||
animation-duration: 0s;
|
||||
animation-delay:0s;
|
||||
-webkit-animation-delay: 0s;
|
||||
}
|
||||
.m-Menu .Close{position: absolute; top:5%; right:8%; color:#333; font-size: 20px; border:2px solid #999; width:42px; height: 42px; border-radius: 21px; text-align: center; box-shadow: 0px 0px 2px #999;}
|
||||
.m-Menu .SingIn-button a{display: inline-block; width:70px; height: 30px; border:1px solid #FFF; color:#FFF; margin-left:5px; margin-right:5px; text-align: center; text-decoration: none; margin-top:30px; line-height: 28px; font-size: 1em}
|
||||
.m-Menu .SingIn-button a:hover{border:1px solid #FFF; background-color:#FFF; color: #333;}
|
||||
.m-Menu .search{width:84%; margin:30px auto 0; position: relative; opacity: 0;}
|
||||
|
||||
.m-Menu .search .form-control{width:90%; height: 32px; line-height: 32px; border:1px solid rgba(220,221,221,0.7); vertical-align: middle; padding-left:5%; padding-right:5%; font-size: 0.9em; background-color:#FFF;}
|
||||
.m-Menu .search .updown_search_btn{line-height: 35px; background:none; border:none; position: absolute; right:2%; top:0px; font-size: 1.5em; vertical-align: middle; color:#333;}
|
||||
|
||||
.m-Menu .SingIn-button{opacity: 0}
|
||||
.m-Menu .SingIn-button{
|
||||
animation-delay:0.53s;
|
||||
-webkit-animation-delay: 0.53s;
|
||||
}
|
||||
.m-Menu .search{
|
||||
animation-delay:0.55s;
|
||||
-webkit-animation-delay: 0.55s;
|
||||
}
|
||||
|
||||
.m-Country{padding-top:2%;}
|
||||
|
||||
.m-Country ul{width:90%; margin:auto;}
|
||||
.m-Country li{width:18%; float: left; margin-right:2.25%; border-bottom: 1px solid rgba(0,0,0,0.1); padding-top:0.8vw; padding-bottom: 0.8vw; line-height: 19px;}
|
||||
|
||||
.m-Country li p{display: inline-block;}
|
||||
|
||||
@media screen and (min-width:641px){
|
||||
.m-Country li:nth-child(5n){margin-right:0px;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.m-Country li{width:23%; margin-right:2%;}
|
||||
.m-Country li:nth-child(4n){margin-right:0px;}
|
||||
}
|
||||
|
||||
|
||||
@-webkit-keyframes fadeInUp {
|
||||
0% {
|
||||
top:1000px;
|
||||
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity:0;
|
||||
-webkit-transform:translate3d(0, 100%, 0);
|
||||
transform:translate3d(0, 100%, 0)
|
||||
}
|
||||
100% {
|
||||
opacity:1;
|
||||
-webkit-transform:none;
|
||||
transform:none
|
||||
}
|
||||
}
|
||||
|
||||
/*头部导航栏变色*/
|
||||
.theme-white .navfl .navul li a{color:#FFF;}
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-white .logo-white{display: block}
|
||||
.theme-white .logo-black{display: none; }
|
||||
.theme-black .navfl .navul li a{color:#000;}
|
||||
.theme-black .logo-white{display: none}
|
||||
.theme-black .logo-black{display: block; }
|
||||
.all-logo, .all-logo-black{position: relative;}
|
||||
@media screen and (min-width:960px){
|
||||
.logo{position: absolute; left:0; top:0;}
|
||||
}
|
||||
/*公共样式*/
|
||||
.search input {height: 30px; line-height: 30px; border:none; width:40%;}
|
||||
.banner-other{margin-top:60px; width:100%;}
|
||||
@media screen and (max-width:959px){
|
||||
.banner-other{margin-top:0px; width:100%;}
|
||||
}
|
||||
BIN
public/frontend/web/css/icon/Montserrat-Regular.ttf
Executable file
BIN
public/frontend/web/css/icon/Montserrat-Regular.ttf
Executable file
Binary file not shown.
BIN
public/frontend/web/css/icon/Montserrat-SemiBold.ttf
Executable file
BIN
public/frontend/web/css/icon/Montserrat-SemiBold.ttf
Executable file
Binary file not shown.
1518
public/frontend/web/css/indexcss-nars.css
Executable file
1518
public/frontend/web/css/indexcss-nars.css
Executable file
File diff suppressed because it is too large
Load Diff
1518
public/frontend/web/css/indexcss.css
Normal file
1518
public/frontend/web/css/indexcss.css
Normal file
File diff suppressed because it is too large
Load Diff
172
public/frontend/web/css/jquery.bxslider.css
Executable file
172
public/frontend/web/css/jquery.bxslider.css
Executable file
@@ -0,0 +1,172 @@
|
||||
|
||||
.bx-wrapper {
|
||||
position: relative;
|
||||
margin: 0 auto 15px;
|
||||
padding: 0;
|
||||
*zoom: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bx-wrapper img {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/** THEME
|
||||
===================================*/
|
||||
|
||||
.bx-wrapper .bx-viewport {
|
||||
/*fix other elements on the page moving (on Chrome)*/
|
||||
-webkit-transform: translatez(0);
|
||||
-moz-transform: translatez(0);
|
||||
-ms-transform: translatez(0);
|
||||
-o-transform: translatez(0);
|
||||
transform: translatez(0);
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager,
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* LOADER */
|
||||
|
||||
.bx-wrapper .bx-loading {
|
||||
min-height: 50px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
/* PAGER */
|
||||
|
||||
.bx-wrapper .bx-pager {
|
||||
text-align: center;
|
||||
font-size: .85em;
|
||||
font-family: Arial;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager .bx-pager-item,
|
||||
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
|
||||
display: inline-block;
|
||||
*zoom: 1;
|
||||
*display: inline;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a {
|
||||
text-indent: -9999px;
|
||||
display: block;
|
||||
width: 60px;
|
||||
height: 4px;
|
||||
margin: 0 5px;
|
||||
outline: 0;
|
||||
background: #ccc;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a:hover,
|
||||
.bx-wrapper .bx-pager.bx-default-pager a.active {
|
||||
background: #009fdf;
|
||||
}
|
||||
|
||||
/* DIRECTION CONTROLS (NEXT / PREV) */
|
||||
|
||||
.bx-wrapper .bx-prev {
|
||||
left: 10px;
|
||||
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next {
|
||||
right: 10px;
|
||||
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-prev:hover {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
|
||||
.bx-wrapper .bx-controls-direction a {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
margin-top: -16px;
|
||||
outline: 0;
|
||||
text-indent: -9999px;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-direction a.disabled {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* AUTO CONTROLS (START / STOP) */
|
||||
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 10px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(../images/controls.png) -86px -11px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-start.active {
|
||||
background-position: -86px 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 9px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(../images/controls.png) -86px -44px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-stop.active {
|
||||
background-position: -86px -33px;
|
||||
}
|
||||
|
||||
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
|
||||
text-align: left;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
|
||||
right: 0;
|
||||
width: 35px;
|
||||
}
|
||||
|
||||
/* IMAGE CAPTIONS */
|
||||
|
||||
.bx-wrapper .bx-caption {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #666\9;
|
||||
background: rgba(80, 80, 80, 0.75);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-caption span {
|
||||
color: #fff;
|
||||
font-family: Arial;
|
||||
display: block;
|
||||
font-size: .85em;
|
||||
padding: 10px;
|
||||
}
|
||||
563
public/frontend/web/css/nas.css
Executable file
563
public/frontend/web/css/nas.css
Executable file
@@ -0,0 +1,563 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul,
|
||||
a {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
background-color: white;
|
||||
color: black;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--bs-blue);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.logico {
|
||||
width: 12.375rem;
|
||||
height: 3.875rem;
|
||||
}
|
||||
|
||||
.narsbanner-img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.goico-img {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ainasimg {
|
||||
width: 15.875rem;
|
||||
height: 4.5625rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.jjfabgimg {
|
||||
width: 20.1875rem;
|
||||
height: 37.6875rem;
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
|
||||
.narsPage-head {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.narsPage-head .headcenter {
|
||||
height: 3.75rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 75rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.narsPage-head .headcenter .navitem {
|
||||
position: relative;
|
||||
margin-left: 4.375rem;
|
||||
color: #000;
|
||||
font-size: 1.0rem;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
}
|
||||
.narsPage-head .headcenter .downimg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 15px;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.narsPage-head .headcenter .children {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 2.5rem;
|
||||
list-style: none;
|
||||
font-size: 1rem;
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 1px 0 #88909A;
|
||||
z-index: 9999;
|
||||
}
|
||||
.narsPage-head .headcenter .children li {
|
||||
padding: 0.5rem 1rem;
|
||||
}
|
||||
|
||||
.narsPage-head .headcenter .navitem.hover,
|
||||
.narsPage-head .headcenter .navitem:hover {
|
||||
color: #004bfa;
|
||||
}
|
||||
|
||||
.narsIndex-banner {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-slide {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-slide .strct {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 3.375rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-slide .strct .sw-title {
|
||||
font-size: 3.125rem;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-slide .strct .btmore {
|
||||
cursor: pointer;
|
||||
width: 17.625rem;
|
||||
height: 3.25rem;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
line-height: 3.25rem;
|
||||
position: relative;
|
||||
background: #004bfa;
|
||||
border-radius: 1.625rem;
|
||||
font-size: 1.875rem;
|
||||
color: #fff;
|
||||
margin-top: 1.25rem;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-slide .strct .btmore .btst {
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-slide .strct .btmore .goico-img {
|
||||
position: absolute;
|
||||
top: 1.0625rem;
|
||||
right: 1.6875rem;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-button-next {
|
||||
position: absolute !important;
|
||||
color: white;
|
||||
margin-right: 170px;
|
||||
margin-left: 0;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-button-prev {
|
||||
position: absolute !important;
|
||||
color: white;
|
||||
margin-left: 170px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-pagination {
|
||||
bottom: 5% !important;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-pagination .swiper-pagination-bullet {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.narsIndex-banner .mySwiper .swiper-pagination-bullet-active {
|
||||
width: 24px !important;
|
||||
height: 24px;
|
||||
border-radius: 10px;
|
||||
color: #ffffff !important;
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.narsIndex-banner .my-pagination-clickable {
|
||||
width: 1200px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.nars-cate {
|
||||
padding-top: 5rem;
|
||||
padding-bottom: 5.5rem;
|
||||
background: #fff;
|
||||
margin: 0 auto;
|
||||
max-width:1920px;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter {
|
||||
overflow-x: hidden;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
height: auto;
|
||||
min-width: 1024px;
|
||||
overflow: hidden;
|
||||
margin: 0 7.5rem;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column {
|
||||
width: 33%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: auto;
|
||||
color: #000;
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
width: 100%;
|
||||
height: 10.25rem;
|
||||
|
||||
border-radius: 1rem;
|
||||
background: #fff;
|
||||
margin-bottom: 1rem;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
/*height:12.05rem;*/
|
||||
height: 15.05rem
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 5.45rem;
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:750px) and (max-width:1280px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
width: 100%;
|
||||
height: 10.25rem;
|
||||
border-radius: 1rem;
|
||||
background: #fff;
|
||||
margin-bottom: 1rem;
|
||||
display: flex;
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 15.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 5.45rem;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width:1281px) and (max-width:1360px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
height: 12.25rem;
|
||||
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 17.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 7.45rem;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width:1361px) and (max-width:1460px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
height: 13.25rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 18.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 8.45rem;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width:1461px) and (max-width:1660px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
height: 15.25rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 24.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 6.45rem;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width:1661px) and (max-width:1760px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
height: 15.25rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 23.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 7.45rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1761px) and (max-width:1960px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
height: 16.25rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 24.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 8.45rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1980px){
|
||||
.nars-cate .narscatecenter .cate-column .cateit {
|
||||
height: 18.25rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .bigcateit {
|
||||
height: 26.05rem;
|
||||
|
||||
}
|
||||
.nars-cate .narscatecenter .cate-column .smallcateit {
|
||||
height: 10.45rem;
|
||||
}
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column .cateit .pp1 {
|
||||
margin-top: 2.625rem;
|
||||
margin-left: 2.125rem;
|
||||
color: #020612;
|
||||
font-size: 1.875rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column .cateit .pp1 span:last-child {
|
||||
color: #91A5C4;
|
||||
font-size: 1.375rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column .cateit .pp1 .zjtitle{
|
||||
margin: 0 auto;
|
||||
font-size: 3.4375rem;
|
||||
font-weight: bold;
|
||||
color: #020612;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column .cateit .pp1 .zjtitle-sm{
|
||||
color: #020612;
|
||||
font-size: 1.375rem;
|
||||
}
|
||||
|
||||
.nars-cate .narscatecenter .cate-column2 {
|
||||
width: 24.1875rem;
|
||||
}
|
||||
|
||||
.narsVideo {
|
||||
width: 100%;
|
||||
padding-top: 3.25rem;
|
||||
padding-bottom: 4.5rem;
|
||||
|
||||
}
|
||||
|
||||
.narsVideo .videoview {
|
||||
margin: 0 7.5rem;
|
||||
/*height: 47.5rem;*/
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.narsVideo .videoview .video {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
object-fit: fill;
|
||||
}
|
||||
|
||||
.nars-jjfa {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-x: hidden;
|
||||
padding-bottom: 3.8125rem;
|
||||
max-width: 1920px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfa-title {
|
||||
font-size: 3.75rem;
|
||||
font-weight: bold;
|
||||
padding-bottom: 3.75rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper {
|
||||
margin: 0 7.5rem;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide {
|
||||
position: relative;
|
||||
width: 20.1875rem;
|
||||
height: 37.6875rem;
|
||||
position: relative;
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide .jjfa-ct {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
text-align: center;
|
||||
width: 100$;
|
||||
width: 100%;
|
||||
height: 5.125rem;
|
||||
background: #3231FF;
|
||||
line-height: 5.125rem;
|
||||
color: #fff;
|
||||
border-top-right-radius:0.375rem;
|
||||
border-top-left-radius:0.375rem;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide .jjfa-ct .st {
|
||||
font-size: 1.875rem;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide .jjfa-info {
|
||||
background: #ecf2fe;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 37.6875rem;
|
||||
padding: 0 2.875rem;
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
/*justify-content: center;*/
|
||||
cursor: pointer;
|
||||
border-radius: 0.375rem;
|
||||
line-height: 2.375rem;
|
||||
font-size: 1.45rem;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide .jjfa-info .jjfatt {
|
||||
width: 100%;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
margin-bottom: 1.6875rem;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide .jjfa-info .jjfa-txt {
|
||||
font-size: 1.5rem;
|
||||
margin-bottom: 1.25rem;
|
||||
line-height: 2.1875rem;
|
||||
text-indent: 2em;
|
||||
}
|
||||
|
||||
.nars-jjfa .jjfaSwiper .swiper-wrapper .swiper-slide:hover .jjfa-info {
|
||||
display: flex;
|
||||
background: linear-gradient(90deg, #CDD9F1 0%, #ECF2FE 100%);
|
||||
font-size: 1.125rem;
|
||||
}
|
||||
|
||||
.nars-wlj {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-x: hidden;
|
||||
padding-bottom: 7.1875rem;
|
||||
max-width: 1920px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nars-wlj .wlj-title {
|
||||
font-size: 3.75rem;
|
||||
font-weight: bold;
|
||||
padding-bottom: 2.8125rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem {
|
||||
margin: 0 7.5rem;
|
||||
min-width: 1024px;
|
||||
background: #000;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 1.375rem;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcp {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: inherit;
|
||||
width:50%;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcp .tt {
|
||||
font-size: 3.125rem;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
width: 35.5rem;
|
||||
text-align: center;
|
||||
margin-left: 35%;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcp .wljimg {
|
||||
width: 100%;
|
||||
/*height: 27.125rem;
|
||||
margin-left: 11.5rem;*/
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcpinfo {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
flex: 1;
|
||||
padding: 0 3rem;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcpinfo .if-title {
|
||||
font-weight: bold;
|
||||
font-size: 2.25rem;
|
||||
padding-bottom: 0.6rem;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcpinfo .if-info {
|
||||
font-size: 1.25rem;
|
||||
line-height: 2.15rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.nars-wlj .wltitem .wljcpinfo .wlj-xzbt {
|
||||
/*width: 21.75rem;
|
||||
height: 6.5rem;
|
||||
line-height: 6.5rem;*/
|
||||
padding:0.75rem 6rem;
|
||||
border-radius: 3.25rem;
|
||||
border: 1px solid #FFFFFF;
|
||||
font-size: 2.5rem;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
14
public/frontend/web/css/owl.carousel.css
Executable file
14
public/frontend/web/css/owl.carousel.css
Executable file
@@ -0,0 +1,14 @@
|
||||
/**
|
||||
* Owl Carousel v2.2.1
|
||||
* Copyright 2013-2017 David Deutsch
|
||||
* Licensed under ()
|
||||
*/
|
||||
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}
|
||||
.owl-carousel{display:none;width:100%;z-index:1}
|
||||
.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}
|
||||
.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
|
||||
.owl-carousel .owl-stage-outer{position:relative;-webkit-transform:translate3d(0,0,0); overflow: hidden;}
|
||||
.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}
|
||||
.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}
|
||||
.owl-carousel .owl-item img{/*display:block;width:100%*/}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}
|
||||
.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
|
||||
4246
public/frontend/web/css/public.css
Executable file
4246
public/frontend/web/css/public.css
Executable file
File diff suppressed because it is too large
Load Diff
49
public/frontend/web/css/public_1200.css
Executable file
49
public/frontend/web/css/public_1200.css
Executable file
@@ -0,0 +1,49 @@
|
||||
/*头部*/
|
||||
@media screen and (min-width: 1280px) {
|
||||
.swt-Container {
|
||||
width: 1200px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1279px) {
|
||||
.swt-Container {
|
||||
width: 96%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
.footl,
|
||||
.footr {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/*底部1440*/
|
||||
@media screen and (min-width: 1200px) {
|
||||
.footer dl dt .arrow {
|
||||
display: none;
|
||||
}
|
||||
.footer {
|
||||
padding-top: 60px;
|
||||
padding-bottom: 35px;
|
||||
}
|
||||
.footer .footl {
|
||||
width: 900px;
|
||||
}
|
||||
.footer .footr {
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 769px) and (max-width: 1199px) {
|
||||
.footer .footl {
|
||||
width: 70%;
|
||||
}
|
||||
.footer .footr {
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
30
public/frontend/web/css/public_1440.css
Executable file
30
public/frontend/web/css/public_1440.css
Executable file
@@ -0,0 +1,30 @@
|
||||
/*头部*/
|
||||
@media screen and (min-width:1460px){
|
||||
.swt-Container{width:1440px; margin-left:auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:1459px){
|
||||
.swt-Container{width:90%; margin-left:auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:990px){
|
||||
.swt-Container{width:96%; margin-left:auto; margin-right: auto;}
|
||||
}
|
||||
|
||||
.footer{position: relative; z-index: 2;}
|
||||
/*底部1440*/
|
||||
@media screen and (min-width:1480px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:1440px; padding-top:70px; padding-bottom: 40px;}
|
||||
.footer .footl{width:950px;}
|
||||
.footer .footr{ text-align: left;}
|
||||
}
|
||||
@media screen and (min-width:1200px) and (max-width:1479px){
|
||||
.footer dl dt .arrow{display: none;}
|
||||
.footer{width:96%; padding-top:40px;}
|
||||
.footer .footl{width:80%;}
|
||||
.footer .footr{width:20%;}
|
||||
.footer dl{width:18.4%;}
|
||||
}
|
||||
@media screen and (min-width:769px) and (max-width:1199px){
|
||||
.footer .footl{width:70%;}
|
||||
.footer .footr{width:30%;}
|
||||
}
|
||||
638
public/frontend/web/css/slider-pro.min.css
vendored
Executable file
638
public/frontend/web/css/slider-pro.min.css
vendored
Executable file
@@ -0,0 +1,638 @@
|
||||
/*!
|
||||
* - v1.0.2
|
||||
* Homepage: http://sucaijiayuan.com
|
||||
*/.slider-pro
|
||||
{
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
padding-right:124px!important;
|
||||
}
|
||||
|
||||
.sp-slides-container
|
||||
{
|
||||
position: relative
|
||||
}
|
||||
|
||||
.sp-mask
|
||||
{
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-left:92px;
|
||||
}
|
||||
|
||||
.sp-slides
|
||||
{
|
||||
position: relative;
|
||||
-webkit-backface-visibility: hidden;
|
||||
-webkit-perspective: 1000
|
||||
}
|
||||
|
||||
.sp-slide
|
||||
{
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.sp-image-container
|
||||
{
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.sp-image
|
||||
{
|
||||
position: relative;
|
||||
display: block;
|
||||
border: none;
|
||||
margin-top:0px!important;
|
||||
}
|
||||
|
||||
.sp-thumbnails-container
|
||||
{
|
||||
position: relative;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails,.sp-top-thumbnails
|
||||
{
|
||||
left: 0;
|
||||
margin: 0 auto
|
||||
}
|
||||
|
||||
.sp-left-thumbnails,.sp-right-thumbnails,.sp-top-thumbnails
|
||||
{
|
||||
position: absolute;
|
||||
top: 0
|
||||
}
|
||||
|
||||
.sp-right-thumbnails
|
||||
{
|
||||
left: 0
|
||||
}
|
||||
|
||||
.sp-left-thumbnails
|
||||
{
|
||||
right: 0
|
||||
}
|
||||
|
||||
.sp-thumbnails
|
||||
{
|
||||
position: relative
|
||||
}
|
||||
|
||||
.sp-thumbnail
|
||||
{
|
||||
border: none
|
||||
}
|
||||
|
||||
.sp-thumbnail-container
|
||||
{
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails .sp-thumbnail-container,.sp-top-thumbnails .sp-thumbnail-container
|
||||
{
|
||||
margin-left: 2px;
|
||||
margin-right: 2px
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails .sp-thumbnail-container:first-child,.sp-top-thumbnails .sp-thumbnail-container:first-child
|
||||
{
|
||||
margin-left: 0
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails .sp-thumbnail-container:last-child,.sp-top-thumbnails .sp-thumbnail-container:last-child
|
||||
{
|
||||
margin-right: 0
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-thumbnail-container,.sp-right-thumbnails .sp-thumbnail-container
|
||||
{
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-thumbnail-container:first-child,.sp-right-thumbnails .sp-thumbnail-container:first-child
|
||||
{
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-thumbnail-container:last-child,.sp-right-thumbnails .sp-thumbnail-container:last-child
|
||||
{
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
.sp-right-thumbnails.sp-has-pointer
|
||||
{
|
||||
margin-left:0px
|
||||
}
|
||||
|
||||
.sp-right-thumbnails.sp-has-pointer .sp-thumbnail
|
||||
{
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
margin-left: 0!important
|
||||
}
|
||||
|
||||
/*.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:before
|
||||
{
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
border-left: 5px solid red;
|
||||
left: 0;
|
||||
top: 0;
|
||||
margin-left: 13px
|
||||
}
|
||||
*/
|
||||
/*.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after
|
||||
{
|
||||
content: '\25c0';
|
||||
position: absolute;
|
||||
font-family: Arial;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
color: red;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
margin-top: -6px
|
||||
}
|
||||
*/
|
||||
/*.ie10 .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,.ie11 .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,.ie9 .sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after
|
||||
{
|
||||
content: '\25bc';
|
||||
-ms-transform: rotate(90deg);
|
||||
transform: rotate(90deg)
|
||||
}*/
|
||||
|
||||
/*.sp-left-thumbnails.sp-has-pointer
|
||||
{
|
||||
margin-right: -13px
|
||||
}*/
|
||||
|
||||
.sp-left-thumbnails.sp-has-pointer .sp-thumbnail
|
||||
{
|
||||
position: absolute;
|
||||
right: 18px
|
||||
}
|
||||
/*.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:before{content:'';position:absolute;height:100%;border-left:5px solid red;right:0;top:0;margin-right:13px}*//*.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after{content:'\25ba';position:absolute;font-family:Arial;font-size:16px;line-height:1;color:red;right:0;top:50%;margin-top:-6px}*/
|
||||
/*.ie10 .sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,.ie11 .sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after,.ie9 .sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after
|
||||
{
|
||||
content: '\25b2';
|
||||
-ms-transform: rotate(90deg);
|
||||
transform: rotate(90deg)
|
||||
}*/
|
||||
|
||||
.sp-bottom-thumbnails.sp-has-pointer
|
||||
{
|
||||
margin-top: -13px
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail
|
||||
{
|
||||
position: absolute;
|
||||
top: 18px;
|
||||
margin-top: 0!important
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:before
|
||||
{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
border-bottom: 5px solid red;
|
||||
top: 0;
|
||||
margin-top: 13px
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:after
|
||||
{
|
||||
content: '\25b2';
|
||||
position: absolute;
|
||||
font-family: Arial;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
color: red;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
margin-left: -9px
|
||||
}
|
||||
|
||||
.sp-top-thumbnails.sp-has-pointer
|
||||
{
|
||||
margin-bottom: -13px
|
||||
}
|
||||
|
||||
.sp-top-thumbnails.sp-has-pointer .sp-thumbnail
|
||||
{
|
||||
position: absolute;
|
||||
bottom: 18px
|
||||
}
|
||||
|
||||
.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:before
|
||||
{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
border-bottom: 5px solid red;
|
||||
bottom: 0;
|
||||
margin-bottom: 13px
|
||||
}
|
||||
|
||||
.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:after
|
||||
{
|
||||
content: '\25bc';
|
||||
position: absolute;
|
||||
font-family: Arial;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
color: red;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
margin-left: -9px
|
||||
}
|
||||
|
||||
.sp-layer
|
||||
{
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-webkit-backface-visibility: hidden
|
||||
}
|
||||
|
||||
.sp-black
|
||||
{
|
||||
color: #FFF;
|
||||
background: #000;
|
||||
background: rgba(0,0,0,.7)
|
||||
}
|
||||
|
||||
.sp-white
|
||||
{
|
||||
color: #000;
|
||||
background: #fff;
|
||||
background: rgba(255,255,255,.7)
|
||||
}
|
||||
|
||||
.sp-rounded
|
||||
{
|
||||
border-radius: 10px
|
||||
}
|
||||
|
||||
.sp-padding
|
||||
{
|
||||
padding: 10px
|
||||
}
|
||||
|
||||
/*.sp-grab
|
||||
{
|
||||
cursor: url(images/openhand.cur),move
|
||||
}
|
||||
|
||||
.sp-grabbing
|
||||
{
|
||||
cursor: url(images/closedhand.cur),move
|
||||
}*/
|
||||
|
||||
.sp-selectable
|
||||
{
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.sp-caption-container
|
||||
{
|
||||
text-align: center;
|
||||
margin-top: 10px
|
||||
}
|
||||
|
||||
.sp-full-screen
|
||||
{
|
||||
margin: 0!important;
|
||||
background-color: #000
|
||||
}
|
||||
|
||||
.sp-full-screen-button
|
||||
{
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 10px;
|
||||
font-size: 30px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
-webkit-transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg)
|
||||
}
|
||||
|
||||
.sp-full-screen-button:before
|
||||
{
|
||||
content: '\2195'
|
||||
}
|
||||
|
||||
.sp-fade-full-screen
|
||||
{
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity .5s;
|
||||
transition: opacity .5s
|
||||
}
|
||||
|
||||
.slider-pro:hover .sp-fade-full-screen
|
||||
{
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.sp-buttons
|
||||
{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding-top: 10px
|
||||
}
|
||||
|
||||
.sp-button
|
||||
{
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border: 2px solid #000;
|
||||
border-radius: 50%;
|
||||
margin: 4px;
|
||||
display: inline-block;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.sp-selected-button
|
||||
{
|
||||
background-color: #000
|
||||
}
|
||||
|
||||
@media only screen and (min-width:768px) and (max-width:1024px)
|
||||
{
|
||||
.sp-button
|
||||
{
|
||||
width: 14px;
|
||||
height: 14px
|
||||
}
|
||||
|
||||
.sp-has-buttons
|
||||
{
|
||||
margin-bottom: 36px
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width:568px) and (max-width:768px)
|
||||
{
|
||||
.sp-button
|
||||
{
|
||||
width: 16px;
|
||||
height: 16px
|
||||
}
|
||||
|
||||
.sp-has-buttons
|
||||
{
|
||||
margin-bottom: 38px
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width:320px) and (max-width:568px)
|
||||
{
|
||||
.sp-button
|
||||
{
|
||||
width: 18px;
|
||||
height: 18px
|
||||
}
|
||||
|
||||
.sp-has-buttons
|
||||
{
|
||||
margin-bottom: 40px
|
||||
}
|
||||
}
|
||||
|
||||
.sp-fade-arrows
|
||||
{
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity .5s;
|
||||
transition: opacity .5s
|
||||
}
|
||||
|
||||
.sp-slides-container:hover .sp-fade-arrows
|
||||
{
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.sp-arrow
|
||||
{
|
||||
position: absolute;
|
||||
font-size: 40px;
|
||||
color: #FFF;
|
||||
text-shadow: 1px 1px 1px #666;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.sp-vertical .sp-arrow
|
||||
{
|
||||
-webkit-transform: rotate(90deg);
|
||||
-ms-transform: rotate(90deg);
|
||||
transform: rotate(90deg)
|
||||
}
|
||||
|
||||
.sp-horizontal .sp-arrow
|
||||
{
|
||||
top: 65%;
|
||||
margin-top: -20px
|
||||
}
|
||||
|
||||
.sp-vertical .sp-arrow
|
||||
{
|
||||
left: 65%;
|
||||
margin-left: -10px
|
||||
}
|
||||
|
||||
.sp-previous-arrow:before
|
||||
{
|
||||
content: '\276e'
|
||||
}
|
||||
|
||||
.ie7 .sp-previous-arrow:before,.ie8 .sp-previous-arrow:before,.ie9 .sp-previous-arrow:before,.ios .sp-previous-arrow:before
|
||||
{
|
||||
content: '\25c0'
|
||||
}
|
||||
|
||||
.ie7.sp-vertical .sp-previous-arrow:before,.ie8.sp-vertical .sp-previous-arrow:before
|
||||
{
|
||||
content: '\25b2'
|
||||
}
|
||||
|
||||
.sp-next-arrow:before
|
||||
{
|
||||
content: '\276f'
|
||||
}
|
||||
|
||||
.ie7 .sp-next-arrow:before,.ie8 .sp-next-arrow:before,.ie9 .sp-next-arrow:before,.ios .sp-next-arrow:before
|
||||
{
|
||||
content: '\25b6'
|
||||
}
|
||||
|
||||
.ie7.sp-vertical .sp-next-arrow:before,.ie8.sp-vertical .sp-next-arrow:before
|
||||
{
|
||||
content: '\25bc'
|
||||
}
|
||||
|
||||
.sp-horizontal .sp-previous-arrow
|
||||
{
|
||||
left: 20px
|
||||
}
|
||||
|
||||
.sp-horizontal .sp-next-arrow
|
||||
{
|
||||
right: 20px
|
||||
}
|
||||
|
||||
.sp-vertical .sp-previous-arrow
|
||||
{
|
||||
top: 20px
|
||||
}
|
||||
|
||||
.sp-vertical .sp-next-arrow
|
||||
{
|
||||
bottom: 20px
|
||||
}
|
||||
|
||||
.sp-thumbnail-arrows
|
||||
{
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.sp-fade-thumbnail-arrows
|
||||
{
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity .5s;
|
||||
transition: opacity .5s
|
||||
}
|
||||
|
||||
.sp-thumbnails-container:hover .sp-fade-thumbnail-arrows
|
||||
{
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails .sp-thumbnail-arrows,.sp-top-thumbnails .sp-thumbnail-arrows
|
||||
{
|
||||
width: 100%;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
margin-top: -10px
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-thumbnail-arrows,.sp-right-thumbnails .sp-thumbnail-arrows
|
||||
{
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
margin-left: -5px
|
||||
}
|
||||
|
||||
.sp-thumbnail-arrow
|
||||
{
|
||||
position: absolute;
|
||||
font-size: 20px;
|
||||
color: #FFF;
|
||||
text-shadow: 1px 1px 1px #666;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow,.sp-right-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow
|
||||
{
|
||||
-ms-transform: rotate(90deg);
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg)
|
||||
}
|
||||
|
||||
.sp-previous-thumbnail-arrow:before
|
||||
{
|
||||
content: '\276e'
|
||||
}
|
||||
|
||||
.ie7 .sp-previous-thumbnail-arrow:before,.ie8 .sp-previous-thumbnail-arrow:before,.ie9 .sp-previous-thumbnail-arrow:before,.ios .sp-previous-thumbnail-arrow:before
|
||||
{
|
||||
content: '\25c0'
|
||||
}
|
||||
|
||||
.ie7.sp-vertical .sp-previous-thumbnail-arrow:before,.ie8.sp-vertical .sp-previous-thumbnail-arrow:before
|
||||
{
|
||||
content: '\25b2'
|
||||
}
|
||||
|
||||
.sp-next-thumbnail-arrow:before
|
||||
{
|
||||
content: '\276f'
|
||||
}
|
||||
|
||||
.ie7 .sp-next-thumbnail-arrow:before,.ie8 .sp-next-thumbnail-arrow:before,.ie9 .sp-next-thumbnail-arrow:before,.ios .sp-next-thumbnail-arrow:before
|
||||
{
|
||||
content: '\25b6'
|
||||
}
|
||||
|
||||
.ie7.sp-vertical .sp-next-thumbnail-arrow:before,.ie8.sp-vertical .sp-next-thumbnail-arrow:before
|
||||
{
|
||||
content: '\25bc'
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails .sp-previous-thumbnail-arrow,.sp-top-thumbnails .sp-previous-thumbnail-arrow
|
||||
{
|
||||
left: 0
|
||||
}
|
||||
|
||||
.sp-bottom-thumbnails .sp-next-thumbnail-arrow,.sp-top-thumbnails .sp-next-thumbnail-arrow
|
||||
{
|
||||
right: 0
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-previous-thumbnail-arrow,.sp-right-thumbnails .sp-previous-thumbnail-arrow
|
||||
{
|
||||
top: 0
|
||||
}
|
||||
|
||||
.sp-left-thumbnails .sp-next-thumbnail-arrow,.sp-right-thumbnails .sp-next-thumbnail-arrow
|
||||
{
|
||||
bottom: 0
|
||||
}
|
||||
|
||||
a.sp-video
|
||||
{
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
a.sp-video img
|
||||
{
|
||||
-webkit-backface-visibility: hidden;
|
||||
border: none
|
||||
}
|
||||
|
||||
a.sp-video:after
|
||||
{
|
||||
content: '\25B6';
|
||||
position: absolute;
|
||||
width: 45px;
|
||||
padding-left: 5px;
|
||||
height: 50px;
|
||||
border: 2px solid #FFF;
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
border-radius: 30px;
|
||||
top: 0;
|
||||
color: #FFF;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(0,0,0,.2);
|
||||
margin: auto;
|
||||
line-height: 52px
|
||||
}
|
||||
44
public/frontend/web/css/specil_new.css
Executable file
44
public/frontend/web/css/specil_new.css
Executable file
@@ -0,0 +1,44 @@
|
||||
.banner-title{width:54.7%; margin-left:auto; margin-right: auto; margin-top:6vw; margin-bottom: 1.1vw;}
|
||||
.special_01{background-color:#c0c0c0; overflow: hidden;}
|
||||
.special_01 .content{background-color:#d4d4d4; margin-top:0.5vw; margin-bottom: 0.5vw; overflow: hidden; padding-top:2vw; padding-bottom: 2vw;}
|
||||
.special_01 .content p:nth-child(1){margin-bottom: 1.2vw; position: relative;}
|
||||
.special_01 .content p:nth-child(1) img{width:103px;}
|
||||
.special_01 .content p:nth-child(1) span{position: relative; width:103px; display: block; margin-left:auto; margin-right: auto;}
|
||||
.special_01 .content p:nth-child(1):before, .special_01 .content p:nth-child(1):after{content: ''; width:50px; height: 1px; background-color:#bfbfbf; position: absolute; top:50%; margin-top:-0.5px;}
|
||||
.special_01 .content p:nth-child(1):before{left:50%; margin-left:-125px;}
|
||||
.special_01 .content p:nth-child(1):after{right:50%; margin-right: -125px;}
|
||||
.special_01 .content p:nth-child(2){width:50%; margin:auto; line-height: 1.5em;}
|
||||
@media screen and (max-width:1439px){
|
||||
.special_01 .content p:nth-child(1) img, .special_01 .content p:nth-child(1) span{width:7.15vw;}
|
||||
.special_01 .content p:nth-child(2){width:70%; margin:auto; line-height: 1.5em;}
|
||||
}
|
||||
|
||||
.special_small_title{font-size:1.5em; }
|
||||
.special_title{font-size:3.75em; color:#009fe0; margin-top:2vw;}
|
||||
.special_text{font-size:1.125em; margin-top:2.8vw; line-height: 1.8em;}
|
||||
.special_button{font-size:1.5em; background-color:#009fe0; display: inline-block; padding:0.6vw 2.5vw; margin-top:3vw;}
|
||||
|
||||
.special_02{max-width:500px; margin-top:9.5vw;}
|
||||
.special_03{max-width:500px; margin-top:8.5vw; float: right; margin-right:-2.8vw;}
|
||||
.special_04{max-width:500px; margin-top:9.4vw;}
|
||||
.special_05{max-width:500px; margin-top:8vw; float: right; margin-right:-2.8vw;}
|
||||
.special_06{max-width:430px; margin-top:10.5vw;}
|
||||
|
||||
.special_num{width:12.1vw; background-color:rgba(255,255,255,0.1); overflow: hidden; text-align: center; line-height: 2em; font-size: 1.875em; color:#FFF; position: absolute; bottom: 0;}
|
||||
.special_num_l{left:0}
|
||||
.special_num_r{right: 0;}
|
||||
@media screen and (max-width:1439px){
|
||||
.special_small_title{font-size:1.125em; }
|
||||
.special_title{font-size:3em;}
|
||||
.special_text{font-size:1em;}
|
||||
.special_button{font-size:1.125em;}
|
||||
.special_num{font-size: 1.25em}
|
||||
.special_03, .special_05{margin-right:0vw;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.special_02{max-width:390px; margin-top:6.5vw;}
|
||||
.special_03{max-width:390px; margin-top:7.5vw;}
|
||||
.special_04{max-width:390px; margin-top:6vw;}
|
||||
.special_05{max-width:390px; margin-top:4vw}
|
||||
.special_06{max-width:320px; margin-top:5.5vw;}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
491
public/frontend/web/css/style.css
Executable file
491
public/frontend/web/css/style.css
Executable file
@@ -0,0 +1,491 @@
|
||||
body{margin:0; padding:0;}
|
||||
|
||||
|
||||
@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:1400px){
|
||||
body, html{font-size:100%;}
|
||||
}
|
||||
@media screen and (min-width:1200px) and (max-width:1399px){
|
||||
body, html{font-size:98%;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1199px){
|
||||
body, html{font-size:96%;}
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
body, html{font-size:94%;}
|
||||
}
|
||||
@media only screen and (min-width: 480px) and (max-width:639px){
|
||||
body, html{font-size:92%;}
|
||||
}
|
||||
@media only screen and (min-width: 384px) and (max-width:479px){
|
||||
body, html{font-size:90%;}
|
||||
}
|
||||
@media only screen and (min-width: 320px) and (max-width:383px){
|
||||
body, html{font-size:88%;}
|
||||
}
|
||||
@media only screen and (max-width:319px){
|
||||
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: 16px; border: 1px solid #d6d6d6;}
|
||||
.on .cricle{border: 1px solid #737373;}
|
||||
.S-Cricle-Bg{width:10px; height: 10px; border-radius: 10px; 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;bottom:5%;right:0px;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:5px 2px;}
|
||||
.suspension .a i{font-size: 1.25em;}
|
||||
}
|
||||
|
||||
|
||||
/*.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:175px;background:#fff;position:absolute;right:100%;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:150px;line-height:22px;font-size:15px;margin-left:5px;}
|
||||
.suspension .d-service-item .text .number{font-family:Arial,"Microsoft Yahei","HanHei SC",PingHei,"PingFang SC","Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;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,.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:#333;}
|
||||
.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;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;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;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 #009fdf;line-height:36px;font-size:16px;color:#009fdf;text-align:center;margin-right:15px;}
|
||||
.show .smask .sarea .feed a.feda:hover{background:#009fdf;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: 1em;}
|
||||
.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%; }
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.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; padding:4% 0 2.8%; }
|
||||
.o_detail_small {font-size:1.5em; color: #333; padding-bottom: 1.8%;}
|
||||
.o_detail_text {font-size:1.125em;color: #737373; padding: 0 0 1.8%; line-height: 1.875em;width:80%; margin: auto;}
|
||||
.o_detail_img {}
|
||||
|
||||
.star{position: absolute; top:0; width:40%; height: 15px; background-image:url(../images/star_orange.png); background-position: 0 0;}
|
||||
/*专题页字体样式*/
|
||||
.subject_title{font-size: 3em;}
|
||||
.subject_subtitle{font-size: 1.75em;}
|
||||
.subject_des{font-size: 1em;}
|
||||
|
||||
.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:2.5vw; }
|
||||
.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:960px){
|
||||
.subject_02 .subject_text{display: none;}
|
||||
}
|
||||
|
||||
/*底部图标弹出*/
|
||||
.footr .rha a{display: inline-block;}
|
||||
.weixin_href{position: relative;}
|
||||
.weixin-show{position: absolute; display: none; bottom:4em; left:-40px;width:126px; height: 126px;}
|
||||
.weixin_href:hover .weixin-show{display: block;}
|
||||
.weixin_clearfix{_zoom:1;}
|
||||
.weixin_clearfix:after{content: '';display:block; clear:both; height: 0; visibility:visible;}
|
||||
.weixin_clearfix{*zoom:1;}
|
||||
|
||||
/*手机端图片*/
|
||||
@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:before{position: absolute;height: 1px; background-color:#101010; width:2.6vw; content: "";right:55vw; top:50%;}
|
||||
.comit:after{position: absolute;height: 1px; background-color:#101010; width:2.6vw; content: ""; left:55vw; top:50%;}
|
||||
|
||||
@media screen and (max-width:1640px){
|
||||
.comit:before{right:58vw; }
|
||||
.comit:after{left:58vw; }
|
||||
}
|
||||
@media screen and (max-width:990px){
|
||||
.comit:before{right:60vw; }
|
||||
.comit:after{left:60vw; }
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.comit:before, .comit:after{height: 0; }
|
||||
}
|
||||
|
||||
.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: 30px; 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:2.3vw; 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:1.5vw;}
|
||||
.home_new .hot .workshop_all a .title{font-size: 1.625em; text-align: left; line-height: 2em;}
|
||||
.home_new .hot .workshop_all a .subtitle{font-size: 1.25em; 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:1.625em; font-weight: 600; margin-top:28%;}
|
||||
.home_new .value_new li .text .subtitle{font-size: 1.5em; margin-top:1.3vw;}
|
||||
.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 .title{font-size: 1.5em;}
|
||||
.home_new .hot .workshop_all a .subtitle{font-size: 1em;}
|
||||
.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}
|
||||
.ltfl .ltcon .lt1 p span{font-size: 1.25em; margin-top:1.3vw;}
|
||||
}
|
||||
@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:0vw;}
|
||||
.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;}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*新闻评测*/
|
||||
.news-vertu{ width:70%; margin:100px auto; font-family:'微软雅黑';}
|
||||
.news-vertu .tab{ overflow:hidden; text-align: center;}
|
||||
.news-vertu .tab a{ padding:10px 20px; font-size:1.5em; text-decoration:none; color:#333;}
|
||||
.news-vertu .tab a:hover{ color:#333; text-decoration:none;}
|
||||
.news-vertu .tab a.on{ color:#009fdf; text-decoration:none;}
|
||||
.news-vertu .content{ position:relative;}
|
||||
.news-vertu .content ul{ position:absolute; left:0; top:0;overflow: hidden;}
|
||||
.news-vertu .content li{ float:left;}
|
||||
.news-vertu .content li p{ padding:10px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
8249
public/frontend/web/css/stylesheet.css
Executable file
8249
public/frontend/web/css/stylesheet.css
Executable file
File diff suppressed because it is too large
Load Diff
25
public/frontend/web/css/subject/95_series.css
Executable file
25
public/frontend/web/css/subject/95_series.css
Executable file
@@ -0,0 +1,25 @@
|
||||
.banner{top:6vw; width:100%; left:0;}
|
||||
.font-48{line-height: 1.35em;}
|
||||
.font-18{line-height: 1.75em;}
|
||||
.series_95_left{width:40%; float: left;}
|
||||
.series_95_right{width:30%; float: right;}
|
||||
.series_95_mt{margin-top:13vw;}
|
||||
.series_95_left .des{width:74%;}
|
||||
.series_95_05_text{width:52%; margin-left:auto; margin-right: auto;}
|
||||
.series_95_05{width:100%;}
|
||||
.series_95_05 .left{width:32.9861%; float: left;}
|
||||
.series_95_05 .right{width:67.0139%; float: left;}
|
||||
.series_95_05 .right li{width:49.2228%; margin-left:0.7254%; float: left; margin-bottom: 0.3646vw;}
|
||||
.series_95_05 .text{position: absolute; top:50%; width:100%;}
|
||||
.series_95_05 .title{margin-top:-1em; height: 2.2em; line-height: 2.2em;}
|
||||
.series_95_05 .line{width:1.5625vw; height: 1px; background-color:#FFF; margin-left:auto; margin-right: auto;}
|
||||
/*第三屏*/
|
||||
.series_95_three_all{width:100%; background:url("../../images/95_series/95_series_05.jpg"); padding-bottom: 3.75vw;}
|
||||
.series_95_three{border:1px solid rgba(255,255,255,0.34); padding-top:3.75vw; padding-bottom: 3.5vw;}
|
||||
.series_95_three .two_list{width:72%; margin:auto; overflow: hidden;}
|
||||
.series_95_three .two_list li{width:41.7%; float: left; margin-right: 16.6%;}
|
||||
.series_95_three .two_list li:last-child{margin-right: 0;}
|
||||
.series_95_three .three_list{width:100%; overflow: hidden; margin-top:5vw;}
|
||||
.series_95_three .three_list li{width:23.3%; margin-left:5%; margin-right: 5%; float: left;}
|
||||
.series_95_three .line{width:1.875vw; height: 1px; background-color:#FFF; margin-left:auto; margin-right: auto;}
|
||||
.series_95_three .two_list img, .series_95_three .three_list img{margin-right: 0.4688vw;}
|
||||
35
public/frontend/web/css/subject/Anti-Fake.css
Executable file
35
public/frontend/web/css/subject/Anti-Fake.css
Executable file
@@ -0,0 +1,35 @@
|
||||
.fw_01{width:100%; margin:4vw auto; overflow: hidden;}
|
||||
.fw_01 li{width:43.52%; padding-left:11%; float: left; position: relative;}
|
||||
.fw_01 li:last-child{ width:30%; padding-left:11%; float: left; border-left:1px solid #e5e5e5;}
|
||||
.fw_form input{border:1px solid #dfdfdf; height: 3em; line-height: 3em; padding-left:2%;}
|
||||
.fw_form .w-65{width:65%;}
|
||||
.fw_form .w-25{width:25%;}
|
||||
.fw_form .margin-l-1{margin-left:1vw;}
|
||||
.fw_form button{background-color: transparent;}
|
||||
.fw_button{background-color:#009fdf; padding:0.5vw 2.5vw; display: inline-block; color:#FFF;}
|
||||
|
||||
.fw_result_title{line-height: 2em; margin-bottom: 0.6vw; padding-top:0.8vw; padding-bottom: 0.8vw;}
|
||||
.fw_result{width:1120px; margin:3.5vw auto; overflow: hidden;}
|
||||
@media screen and (max-width:1240px){
|
||||
.fw_result{width:96%;}
|
||||
}
|
||||
.fw_result li{width:50%; margin-right: 15%; float: left;}
|
||||
.fw_result li:last-child{margin-right: 0%; width:35%}
|
||||
.fw_result p{font-size: 0.875em; line-height: 2em;}
|
||||
.fw_result .left{width:29%; float: left; margin-right: 6%;}
|
||||
.fw_result .right{width:60%; float: left;}
|
||||
@media screen and (max-width:1080px){
|
||||
.fw_result .right{width:65%;}
|
||||
.fw_result li{width:55%; margin-right: 12%;}
|
||||
}
|
||||
.fw_fw_title{width:33.3%; float: left; background-color:#FFF; overflow: hidden; padding-top:0.8vw; padding-bottom:0.6vw; margin-right:10px;}
|
||||
.fw_sn_title{width:33.3%; float: left; background-color:#FFF; padding-top:0.8vw; padding-bottom:0.6vw; margin-right:10px;}
|
||||
.fw_on{padding-top:0.8vw; padding-bottom: 1.2vw;}
|
||||
.bg_blue{background-color:#009fdf!important;}
|
||||
.fw_l{margin-left:1vw;}
|
||||
.fw_search{position: absolute; right:84%; top:5px; width:7%}
|
||||
/*弹窗*/
|
||||
.Popup_all{width:100%; height: 100%; background-color:rgba(0,0,0,0.3); position:fixed; top:0; left:0; z-index: 99;}
|
||||
.Popup{width:413px; height: 262px; position: absolute; top:50%; margin-top:-131px; background-color:#FFF; left:50%; margin-left:-206px; z-index: 100;}
|
||||
.Popup_content{width:82%; margin:36px auto;}
|
||||
.close{float: right;width:12px; height: 12px; margin-top:8px; margin-right: 9px;}
|
||||
351
public/frontend/web/css/subject/RDCenter.css
Executable file
351
public/frontend/web/css/subject/RDCenter.css
Executable file
@@ -0,0 +1,351 @@
|
||||
.rd_img { text-align: center;}
|
||||
.rd_img img {max-width:100%;}
|
||||
.rd_title{font-size: 2em; color:#333; padding:0 0 2vw; text-align: center; font-weight: 600;}
|
||||
.rd_title-White{font-size: 1.875em; color:#FFFFFF; padding:0 0 3%; text-align: center; font-weight: 600;}
|
||||
.lj_rd_text {left: 12.5%;width:1440px; top:35%;}
|
||||
.lj_rd_text h3 { font-size: 3.75em; font-weight: 100; }
|
||||
.lj_rd_text .small {font-size:1.125em; width:45%; padding-top:1.8%; line-height: 2em; }
|
||||
.lj_rd_text h3::after {width:4%;height: 5px;}
|
||||
|
||||
@media screen and (min-width:960px) and (max-width:1365px){
|
||||
.lj_rd_text .small {padding-top:1%;}
|
||||
.lj_rd_text h3 {font-size: 3em}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:959px){
|
||||
.lj_rd_text {top:25%;}
|
||||
.lj_rd_text .small {padding-top:1%;}
|
||||
.lj_rd_text h3 {font-size: 2.5em}
|
||||
}
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:767px){
|
||||
.lj_rd_text {left:6.5%;width:100%; top:15%;}
|
||||
.lj_rd_text h3 {font-size: 3em;}
|
||||
.lj_rd_text .small {width:80%;padding-top:1%;}
|
||||
.lj_rd_text h3 {font-size: 2em}
|
||||
}
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_rd_text {left:4.5%;width:100%; top:10%;}
|
||||
.lj_rd_text h3 {font-size: 2em; }
|
||||
.lj_rd_text .small {width:90%; }
|
||||
.lj_rd_text h3::after {width:10%;height: 2px;}
|
||||
.lj_rd_text h3 {font-size: 2em}
|
||||
}
|
||||
|
||||
|
||||
.lj_rd_banner{position: relative; height: 600px; background-image: url(../../images/RDCenter/group_rd_02.jpg);}
|
||||
@media screen and (max-width:1440px){
|
||||
.lj_rd_banner{height: 31vw;}
|
||||
}
|
||||
@media screen and (max-width:1080px){
|
||||
.lj_rd_banner{height: 40vw;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.lj_rd_banner{height: 50vw;}
|
||||
}
|
||||
@media screen and (max-width:540px){
|
||||
.lj_rd_banner{height: 60vw;}
|
||||
}
|
||||
@media screen and (max-width:479px){
|
||||
.lj_rd_banner{height: 70vw;}
|
||||
}
|
||||
@media screen and (max-width:380px){
|
||||
.lj_rd_banner{height:80vw;}
|
||||
}
|
||||
.lj_rd_text {margin: auto; color: #fff;text-align: left; padding-top:10vw;}
|
||||
.lj_rd_text h3 { padding-bottom: 2.3%; text-align: left;}
|
||||
|
||||
|
||||
@media screen and (min-width:769px){
|
||||
.lj-Table{display: table;}
|
||||
.lj-Table .Table-Row{display: table-row;}
|
||||
.lj-Table .Table-Row .Table-Cell{display: table-cell;}
|
||||
.lj_w { width:88%;}
|
||||
}
|
||||
|
||||
/*研发团队*/
|
||||
.rd_team_bg { background:#f5f5f5; padding: 3% 0;}
|
||||
.rd_team_w { margin: auto;background: #fff; padding: 3%; line-height:1.875em;}
|
||||
@media screen and (min-width:1400px){
|
||||
.rd_team_w {width:69%;}
|
||||
}
|
||||
@media screen and (max-width:1399px){
|
||||
.rd_team_w {width:90%;}
|
||||
}
|
||||
|
||||
.rd_team_title {font-size: 2em; text-align: center; color: #333; font-weight: 600;}
|
||||
@media screen and (min-width:800px){
|
||||
.rd_team_sm { width:60%;}
|
||||
}
|
||||
@media screen and (max-width:799px){
|
||||
.rd_team_sm { width:96%; line-height: 1.5em;}
|
||||
}
|
||||
.rd_team_sm { text-align: center; color: #737373; margin: auto; padding: 3% 0; }
|
||||
|
||||
.rd_team_icon li { width:25%; float: left; padding: 2% 0;}
|
||||
.rd_team_big {color: #333; padding: 2% 0; font-weight: 600; }
|
||||
.rd_team_small{font-size: 0.875em; line-height: 1.875em; margin-top:0.2vw;}
|
||||
|
||||
@media screen and (min-width:1048px){
|
||||
.rd_f {float:left;}
|
||||
.rd_team_t {width:54%; padding-left: 6%;}
|
||||
.rd_team_icon li { width:25%;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1047px){
|
||||
.rd_f { margin: auto; text-align: center; width:100%;}
|
||||
.rd_f img {max-width:80%;}
|
||||
.rd_team_icon li { width:25%;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.rd_f { margin: auto; text-align: center; width:100%;}
|
||||
.rd_team_sm,.rd_team_big,.rd_team_t {font-size:1.2em; line-height: 1.5em;}
|
||||
.rd_f img {max-width:50%;}
|
||||
.rd_team_icon li { width:49.5%;}
|
||||
}
|
||||
|
||||
/*211快速交付*/
|
||||
.rd_two_pay { background:#f5f5f5; padding: 3% 0;}
|
||||
.rd_two_img { text-align: center; font-size: 2em; color: #333; padding-bottom: 3%; font-weight: 600;}
|
||||
.rd_img_b {margin: auto; position: relative; padding:0.8% 0;}
|
||||
.rd_pay_text {position: absolute;}
|
||||
.rd_font_i {color: #fff; }
|
||||
.rd_pay_r {float: left;width:40%; }
|
||||
|
||||
@media screen and (min-width:1400px){
|
||||
.rd_pay_text { left: 10%;top:22%;}
|
||||
.rd_pay_r img {width:100%;}
|
||||
.rd_font_i { padding:4% 0 0 4%; width:30%; }
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1399px){
|
||||
.rd_pay_text { left: 5%;top:22%;}
|
||||
.rd_font_i { padding:2% 0 0 0; width:30%; }
|
||||
}
|
||||
@media screen and (min-width:480px) and (max-width:767px){
|
||||
.rd_pay_text { left: 5%;top:8%;}
|
||||
.rd_font_i { padding:2% 0 0 0; width:50%;line-height: 1.5em; }
|
||||
}
|
||||
@media screen and (max-width:479px){
|
||||
.rd_pay_text { left: 5%;top:8%;}
|
||||
.rd_font_i { padding:1% 0 0 0 ; width:60%; line-height: 1.2em; }
|
||||
}
|
||||
@media screen and (max-width:1399px){
|
||||
.rd_pay_r img {width:90%;}
|
||||
}
|
||||
/*研发流程*/
|
||||
.n_rd_process{padding:3.2% 0;}
|
||||
@media screen and (min-width:1366px){
|
||||
.n_pro_img02, .n_pro_img03 {display: none;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:1365px){
|
||||
.n_pro_img01, .n_pro_img03 {display: none;}
|
||||
.n_pro_img02 { width:100%; margin: auto;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.n_process_w {width:96%; margin: auto;}
|
||||
.n_pro_img01, .n_pro_img02 {display: none;}
|
||||
.n_pro_img03 { width:100%; margin: auto;}
|
||||
}
|
||||
@media screen and (min-width:768px){
|
||||
.n_process_w {width:73%; margin: auto;}
|
||||
}
|
||||
/*211快速交付*/
|
||||
.n_rd_bg {background: url( ../../images/RDCenter/n_rd_bg_16.jpg) no-repeat;width:100%;height:100%; padding:4% 0;}
|
||||
.n_rd_text01 {padding: 5% 0 0 10%;}
|
||||
.n_rd_text {padding: 20% 0 4.8% 20%;}
|
||||
.n_rd_fast{margin:auto;}
|
||||
@media screen and (min-width:769px){
|
||||
.n_rd_tl2{font-size:30px;}
|
||||
.n_rd_tl2 i {width:37px;height:33px;top:-20px;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.n_rd_tl2{font-size:18px;}
|
||||
.n_rd_tl2 i {width:20px;height:17px;top:-5px;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px){
|
||||
.n_rd_fast {width:63.5%; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:999px){
|
||||
.n_rd_fast {width:96%;}
|
||||
.n_rd_f_s01,.n_rd_f_s{line-height:22px;}
|
||||
}
|
||||
@media screen and (max-width:639px){
|
||||
.n_rd_fast {width:96%;}
|
||||
.n_rd_f_s01,.n_rd_f_s {display: none;}
|
||||
.n_rd_text {padding:5% 0 26.9% 10%;}
|
||||
|
||||
}
|
||||
|
||||
.n_rd_tl2 {color: #fff;font-weight:bold;text-align:center;position:relative; }
|
||||
.n_rd_tl2 i{display:inline-block;position:absolute;margin-left:17px;}
|
||||
|
||||
.n_rd_fast img {width:100%; display: block;}
|
||||
.n_rd_l {background: #fff; float: left; width:35%;}
|
||||
.n_rd_l img {width:100%; display: block;}
|
||||
.n_rd_text h4 {font-size:1.5em; color:#012853; padding-bottom:4%; }
|
||||
.n_rd_text01 h4 {font-size:1.5em; color:#012853; padding-bottom: 5%; }
|
||||
.n_rd_line {width:40px; background: #27aeee; height: 3px;}
|
||||
.n_rd_f_s {font-size: 1em; color: #404040; margin: 4% 0 20%;}
|
||||
.n_rd_c {background: #fff; float: left; width:30%;}
|
||||
.n_rd_f_s01 {font-size: 1em; color: #404040; margin: 8% 0 12.8%; }
|
||||
/*技术与应用*/
|
||||
.n_rd_tech {background: #fff; padding: 3% 0 0;}
|
||||
@media screen and (min-width:1310px){
|
||||
.n_rd_tech_w,.n_rd_usb,.n_type_c,.n_rd_safe{width:73%;}
|
||||
.n_tech_l {width:34%; float: left;padding: 5% 3% 0;}
|
||||
.n_tech_r {width:60%; float: right; text-align: right;}
|
||||
.n_tech_line{margin:3% 0 5%;}
|
||||
.n_type_c_text{width:50%;}
|
||||
.n_type_c_title{ padding-left: 3.5%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:880px) and (max-width:1309px){
|
||||
.n_rd_tech_w,.n_rd_usb,.n_type_c,.n_rd_safe{width:98%;}
|
||||
.n_tech_l {width:34%; float: left;padding: 3% 3% 0;}
|
||||
.n_tech_r {width:60%; float: right; text-align: right;}
|
||||
.n_tech_line{margin:3% 0 5%;}
|
||||
.n_type_c_text{width:50%;}
|
||||
.n_type_c_title{ padding-left: 3.5%;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:879px){
|
||||
.n_rd_tech_w,.n_rd_usb,.n_type_c,.n_rd_safe{width:98%;}
|
||||
.n_tech_l {width:96%; margin: auto; padding: 5% 3% 0;}
|
||||
.n_tech_r {width:96%; margin:3% auto; }
|
||||
.n_tech_line{margin:1% 0 2%;}
|
||||
.n_usb_text {width:80%; margin: auto; line-height: 1.5em;}
|
||||
.n_type_c_text{width:96%;}
|
||||
.n_rd_safe_text {line-height: 18px;}
|
||||
.n_type_c_text {line-height: 18px;}
|
||||
}
|
||||
|
||||
.n_rd_tech_w { margin: auto;background:#f7f7f7; }
|
||||
.n_tech_title {font-size:1.25em; color:#333; font-weight: bold; }
|
||||
.n_tech_line {width:30px; background: #27aeee; height: 3px; }
|
||||
.n_tech_text {color: #737373; font-size: 1em; line-height:1.875em;}
|
||||
|
||||
/*数据传输技术*/
|
||||
.n_rd_usb { background: #292929; padding: 3% 0; margin: auto;}
|
||||
.n_usb_title { text-align: center; color: #fff; font-size: 1.25em;}
|
||||
.n_usb_m { padding:0.5% 0; }
|
||||
.n_usb_text {text-align: center; color: #fff; padding: 2% 0; font-size: 1em;}
|
||||
.n_usb_img { margin: auto; width:94%; padding-top: 2%;}
|
||||
.n_usb_img li {width:19%; margin-right: 1%; float: left; text-align: center;}
|
||||
/*USB弱电运用技术*/
|
||||
.n_type_c { padding: 3% 0 0; margin: auto;}
|
||||
.n_type_c_title { color: #333; font-size: 1.25em; padding-left: 3.5%; }
|
||||
.n_type_c_line {width:30px; background: #27aeee; height: 3px; margin:1% 0 0 3.5%;}
|
||||
.n_type_c_text { color: #737373; padding: 1% 0 0 3.5%; font-size: 1em; line-height: 1.875em;}
|
||||
.n_type_c_img { margin: auto; }
|
||||
.n_type_c_img li {width:22%; margin-right: 1%; float: left; padding: 3% 0 0;}
|
||||
.n_type_c_img li:last-child {margin-right: 0; padding-left: 1.3%;}
|
||||
.n_type_c_img li:nth-child(1) {padding-left: 3.5%;}
|
||||
.n_type_c_img li:nth-child(2), .n_type_c_img li:nth-child(3){padding-left: 1.3%;}
|
||||
|
||||
/*安全家用强电技术*/
|
||||
.n_rd_safe { padding: 3% 0; margin: auto;}
|
||||
.n_rd_left {width:47%; float: left; padding-left:3.5%; }
|
||||
.n_rd_right {width:47%; float: right;}
|
||||
.n_rd_safe_title {color: #333; font-size: 1.25em;}
|
||||
.n_rd_safe_line {width:30px; background: #27aeee; height: 3px; margin:2% 0 1% 0;}
|
||||
.n_rd_safe_text {color: #737373; padding: 1% 0 0 0; font-size: 1em; line-height: 1.875em;}
|
||||
.n_rd_safe_img {margin: auto; }
|
||||
.n_rd_safe_img li {width:49%; margin-right: 1%; float: left; padding: 3% 0 0;}
|
||||
|
||||
/*资源利用*/
|
||||
.lj_make_bg {background: #f1f1f1; padding: 4.2% 0;}
|
||||
.lj_make_text { margin: auto; color: #737373; text-align: center; font-size: 1em; line-height: 1.875em;}
|
||||
|
||||
@media screen and (min-width:900px){
|
||||
.lj_make_text {width:80%;}
|
||||
}
|
||||
@media screen and (max-width:899px){
|
||||
.lj_make_text {width:90%;}
|
||||
}
|
||||
|
||||
.lj_make_con { padding: 2% 0;}
|
||||
.lj_make_con li{float: left; width: 49.3%; margin: 1.3% 1.2% 0 0; list-style: none;}
|
||||
.lj_make_con li:nth-child(2n) {margin:1.3% 0 0 0;}
|
||||
.text-desc{position: absolute; left: 0; top: 0; height: 100%; opacity: 0; width: 100%;background:#009fdf;}
|
||||
.lj_con_all{position: absolute; width:100%; text-align: center; }
|
||||
.lj_con_title{text-align: center; color: #fff; font-size: 1.5em; padding-bottom: 1vw; }
|
||||
.lj_con_text{font-size: 1em; line-height: 1.875em; width:90%; margin: auto; color: #fff;}
|
||||
@media screen and (min-width:1024px){
|
||||
.lj_con_all {top:34%; }
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:1023px){
|
||||
.lj_con_all {top:20%;}
|
||||
}
|
||||
@media screen and (max-width:639px){
|
||||
.lj_con_all {top:10%;}
|
||||
.lj_con_title {padding-bottom: 3%;}
|
||||
}
|
||||
|
||||
/* effect-1 css */
|
||||
.port-1{float: left; width: 100%; position: relative; overflow: hidden; text-align: center; }
|
||||
.port-1 .text-desc{opacity: 0.9; top: -120%; transition: 0.5s; color: #000; }
|
||||
.port-1 img{transition: 0.5s;}
|
||||
.port-1:hover img{transform: scale(1.1);}
|
||||
.port-1.effect-1:hover .text-desc{top: 0;}
|
||||
.port-1.effect-2 .text-desc{top: auto; bottom: -100%;}
|
||||
.port-1.effect-2:hover .text-desc{bottom: 0;}
|
||||
.port-1.effect-3 .text-desc{top: 50%; left: 50%; width: 0; height: 0; overflow: hidden; padding: 0;}
|
||||
.port-1.effect-3:hover .text-desc{width: 100%; top: 0; left: 0; height: 100%;}
|
||||
|
||||
/* effect-2 css */
|
||||
.port-2, .port-3{float: left; width: 100%; position: relative; overflow: hidden; text-align: center; border: 4px solid rgba(255, 255, 255, 0.9);}
|
||||
.port-2{perspective: 800px;}
|
||||
.port-2 .text-desc{z-index: -1; transition: 0.6s; opacity: 1;}
|
||||
.port-2 .image-box{transition: 0.4s;}
|
||||
.port-2:hover .image-box{transform: rotateX(80deg); transform-origin: center bottom 0; transition: 0.4s;}
|
||||
.port-2.effect-2 .text-desc{top: -100%;}
|
||||
.port-2.effect-2:hover .text-desc{top: 0;}
|
||||
.port-2.effect-3 .text-desc{top: auto; bottom: -100%;}
|
||||
.port-2.effect-3:hover .text-desc{bottom: 0;}
|
||||
|
||||
/* effect-3 css */
|
||||
.port-3{perspective: 500px;}
|
||||
.port-3 img{transition: 0.5s;}
|
||||
.port-3 .text-desc{z-index: -1; transition: 0.5s; transform: rotateX(80deg); padding: 45px 20px 20px;}
|
||||
.port-3.effect-1 .text-desc{transform-origin: center top 0;opacity: 1;}
|
||||
.port-3.effect-1:hover .text-desc, .port-3.effect-2 .text-desc{transform: none; opacity: 0}
|
||||
.port-3.effect-1:hover img{opacity: 0; transform: scale(1.2)}
|
||||
.port-3.effect-2 .text-desc{transform-origin: center bottom 0; top: auto; bottom: 0; }
|
||||
.port-3.effect-3 .text-desc{transform-origin: center top 0;}
|
||||
.port-3.effect-3:hover .text-desc{transform: none; opacity: 1;}
|
||||
.port-3.effect-2:hover img, .port-3.effect-3:hover img{transform: translateY(100%)}
|
||||
/* effect-3 css end */
|
||||
|
||||
.lj_make_al {background:#fff; width:32.5%;}
|
||||
.lj_make_l { width:28%; font-weight: 600; color: #444; font-size: 1em;}
|
||||
.lj_make_r {width:70%; text-align: right; font-size: 0.875em; line-height: 1.75em;}
|
||||
@media screen and (max-width:768px){
|
||||
.lj_make_al {width:32.63%; float: left; margin-right: 1%;}
|
||||
.lj_make_r{display: none;}
|
||||
.lj_make_al:last-child {margin-right: 0;}
|
||||
.lj_make_l { width:90%; text-align: center;}
|
||||
}
|
||||
|
||||
.lj_m_all {padding: 3%;}
|
||||
|
||||
/*品质保障体系*/
|
||||
.lj_quality_bg { padding: 4.2% 0;}
|
||||
.lj_qua_icon {margin:2% auto; text-align: center;}
|
||||
.lj_qua_icon li {width:20%; float: left; margin-right: 17%; text-align: center;}
|
||||
.lj_qua_icon li:last-child {margin-right: 0;}
|
||||
.lj_qua_text {border-bottom: 1px solid #e5e9ee; padding-bottom: 20px; margin-top:15%;}
|
||||
@media screen and (min-width:480px) and (max-width:768px){
|
||||
.lj_qua_icon li {width:22%; line-height: 20px;}
|
||||
}
|
||||
@media screen and (max-width:479px){
|
||||
.lj_qua_icon li {width:31.33%; margin:0 1%; line-height:1.875em; }
|
||||
.lj_qua_text {padding-bottom:10px; margin-top:15%;}
|
||||
}
|
||||
@media screen and (max-width:1440px){
|
||||
.lj_qua_icon .rd_img img {width:60%;}
|
||||
}
|
||||
|
||||
|
||||
260
public/frontend/web/css/subject/backuper.css
Executable file
260
public/frontend/web/css/subject/backuper.css
Executable file
@@ -0,0 +1,260 @@
|
||||
.banner{position: absolute; top:10.4vw; right:10vw; color:#FFF}
|
||||
.title{font-size: 4em; text-transform: Uppercase; font-weight: 600; line-height: 1.35em; letter-spacing: -2px;}
|
||||
.text{font-size: 1.125em;}
|
||||
.banner .sub_title{font-size: 2.25em; margin-top:1.8vw;text-align: center;}
|
||||
.banner .button{
|
||||
font-size: 1.5em;
|
||||
margin-top:5.8vw;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.banner .button span{
|
||||
background: linear-gradient(right,#6d36f5,#3c65ff);
|
||||
background: -ms-linear-gradient(right,#6d36f5,#3c65ff);
|
||||
background: -webkit-linear-gradient(right,#6d36f5,#3c65ff);
|
||||
background: -o-linear-gradient(right,#6d36f5,#3c65ff);
|
||||
background: -moz-linear-gradient(right,#6d36f5,#3c65ff);
|
||||
padding:2.5% 8%;
|
||||
border-radius: 2em;
|
||||
color:#FFF;
|
||||
}
|
||||
@media screen and (max-width:1366px){
|
||||
.banner{position: absolute; top:10.4vw; right:6vw; color:#FFF}
|
||||
.banner .sub_title{font-size: 1.8em;}
|
||||
.title{font-size: 3em;}
|
||||
.text{font-size: 1em;}
|
||||
.banner .button{font-size: 1em; }
|
||||
}
|
||||
.backuper{position: absolute; background-color:#1f97ff; color:#FFF; }
|
||||
.backuper .text{font-size: 1.5em; line-height: 1.5em;}
|
||||
.video{margin-top:5.2vw; margin-bottom: 5.2vw; color: #333; overflow: hidden;}
|
||||
.video .left{width:68%; float: left;}
|
||||
.video .right{width:27%; float: left; margin-left:5%;}
|
||||
.video .text{line-height: 1.7em; font-size: 1.125em;}
|
||||
.backuper_03 {width:16.25%; left:7%; top:3.5vw; padding:3vw 8vw;}
|
||||
.backuper_03 .title {text-align: center;}
|
||||
.backuper-b { padding-top: 1.9vw;}
|
||||
.backuper-80 {padding:0.8em 0;}
|
||||
.backuper-btn {background: #fff;border-radius:40px; padding:10px 0;color:#1f97ff; font-size: 1.6em;text-align: center;width:70%;margin:1.6vw auto 0;}
|
||||
.backuper_03 .icon-text{ margin:4vw auto;width:100%; text-align: center;}
|
||||
.backuper_03 .icon-text li {width:48%; display: inline-block; margin-bottom: 2vw;font-size: 1.25em;}
|
||||
.backuper_04{}
|
||||
.backuper_04 li {display: block;float: left;width:25%;position: relative;}
|
||||
.back-abso {width:100%; text-align: center;position: absolute;bottom:3vw; color: #fff;}
|
||||
.font-big {font-size: 2em;}
|
||||
.font-small {font-size: 1.25em;padding-top:1vw;}
|
||||
.backuper-100 {padding-top:2.7em;color: #666;}
|
||||
.font-12 {color:#1f97ff;font-size: 1em;}
|
||||
|
||||
.backuper_05{color:#1d1d1d; position: absolute; top:10vw; left:15%; width:35%;}
|
||||
.backuper_05 .text{width:75%; line-height: 1.5em; margin-top:3.5vw;}
|
||||
.backuper_06{width:34%; right:10%; top:7.5vw; position: absolute; color:#FFF; text-align: center;}
|
||||
.backuper_06 .title{line-height: 1.125em;}
|
||||
.backuper_06 .sub_title{font-size: 1.5em; text-align: center; margin-top:1.5vw; line-height: 1.5em;}
|
||||
.backuper_06 ul{width:100%; margin-top:3vw;}
|
||||
.backuper_06 ul li{background-color:#002755; float: left; width:48%; margin-right: 2%; margin-bottom: 1vw; padding-top:3vw; padding-bottom: 3vw;}
|
||||
.backuper_06 ul li:nth-child(2n){margin-right: 0;}
|
||||
.backuper_06 .number{color:#1f97ff; font-size: 3em;}
|
||||
.backuper_06 .number_text{font-size: 1.5em; color:#FFF; margin-top:1.5vw;}
|
||||
.backuper_07{width:24%; right:5%; padding:7vw 2vw; top:9vw;}
|
||||
.backuper_07 .title{line-height: 1.125em;padding-left: 1.5em;}
|
||||
.backuper_07 .text{width:85%; margin-top:2.5vw;padding-left: 4em;}
|
||||
.backuper_08{width:22%; left:35%; padding:5vw 2vw; top:9vw;}
|
||||
.backuper_08 .title{line-height: 1.125em;padding-left: 1.5em; }
|
||||
.backuper_08 .text{width:85%; margin-top:2.5vw;padding-left: 4em;}
|
||||
.backuper_09{width:38%; right:4%; top:4vw; padding:5.5vw 5vw;}
|
||||
.backuper_09 .title{line-height: 1.125em;}
|
||||
.backuper_09 .text{width:60%; margin-top:4vw;}
|
||||
.backuper_09 .button{background-color:#FFF; padding:1vw 3vw; color:#1f97ff; font-size: 1.875em; display: inline-block; margin-top: 3vw;}
|
||||
|
||||
@media screen and (max-width:1830px) {
|
||||
.backuper_09{width:42%}
|
||||
}
|
||||
@media screen and (max-width:1680px){
|
||||
.backuper_03 {width:24%; left:7%; top:7.5vw; padding:5vw 5vw;}
|
||||
.backuper_05 {left:7%; top:7vw; width:40%}
|
||||
.backuper_06{width:38%; right:7%;}
|
||||
.backuper_06 .number{font-size: 2em;}
|
||||
.backuper_06 .number_text{font-size: 1.125em;}
|
||||
.backuper_06 ul li{padding-top:2vw; padding-bottom: 2vw;}
|
||||
.backuper_07{width:28%; right:7%;}
|
||||
.backuper_08{ width:28%;top:10vw;}
|
||||
.backuper_09{padding:4vw 3vw; width:50%;}
|
||||
.backuper_09 .text{margin-top:2vw}
|
||||
.backuper_04 .contentAll .sub_title{font-size: 2.5em; margin-top: 3.2vw;}
|
||||
.backuper_04 .contentAll .text{font-size: 1.25em; margin-top:1.3vw; }
|
||||
.backuper_04 .button{font-size: 3em;}
|
||||
}
|
||||
@media screen and (max-width:1200px){
|
||||
.backuper_03 {width:28%; left:7%; top:0; padding:4vw 4vw;}
|
||||
.backuper .text{font-size: 1.25em;}
|
||||
.backuper_06 .sub_title{font-size: 1.25em;}
|
||||
.backuper_07{top:6vw;}
|
||||
.backuper_08{top:10vw;width:24%;}
|
||||
.backuper_08 .text{width:95%;}
|
||||
.backuper_09 .text{width:70%;}
|
||||
.backuper_09 .button{font-size: 1.25em;}
|
||||
.backuper_04 .contentAll .sub_title{font-size: 2em; margin-top: 3.2vw;}
|
||||
.backuper_04 .contentAll .text{font-size: 1.125em; margin-top:1.3vw; }
|
||||
.backuper_04 .button{font-size: 2.53em;}
|
||||
.contentAll li:nth-child(3){width:32%; margin-right: 2%;}
|
||||
.contentAll li:nth-child(4){width:25%; margin-right: 2%;}
|
||||
.contentAll li:nth-child(5){width:34%; margin-right: 0;}
|
||||
.backuper_04 .all_content{width:90%;}
|
||||
.font-big {font-size: 1.5em;}
|
||||
.font-small {font-size: 1em;padding-top:1vw;}
|
||||
.backuper-80 {padding:0.6em 0;}
|
||||
}
|
||||
@media screen and (max-width:900px){
|
||||
.backuper_03 {width:34%; left:7%; top:3vw; padding:4vw 4vw;}
|
||||
.backuper .text{font-size: 1em;}
|
||||
.backuper_05 {left:7%; top:7vw; width:60%}
|
||||
.backuper_06 {width:45%; top:5vw}
|
||||
.backuper_06 .number{font-size: 1.5em;}
|
||||
.backuper_06 .number_text{font-size: 1em;}
|
||||
.backuper_06 .sub_title{font-size: 1.25em;}
|
||||
.backuper_07{width:35%;}
|
||||
.backuper_08{width:28%;}
|
||||
.backuper_09 .button{font-size: 1em;}
|
||||
.backuper_09 .text{width:100%;}
|
||||
.backuper_04 .button{font-size: 2em;}
|
||||
.backuper_04 .contentAll .sub_title{font-size: 1.5em; margin-top: 3.2vw;}
|
||||
.backuper_04 .contentAll .text{font-size: 1em; margin-top:1.3vw; }
|
||||
.font-big {font-size: 1.2em;}
|
||||
.font-small {font-size: 0.9em;}
|
||||
.back-abso {width:100%; text-align: center;position: absolute;bottom:1.5vw; color: #fff;}
|
||||
.backuper_03 .icon-text li {width:48%; display: inline-block; margin-bottom: 0;font-size: 1em;line-height: 1.2em;}
|
||||
.backuper_03 .icon-text li img {width: 30%;}
|
||||
.backuper-btn {background: #fff;border-radius:40px; color:#1f97ff; font-size: 1.2em;text-align: center;width:40%;margin:1vw auto 0;padding:0;}
|
||||
.backuper_03 .icon-text{ margin:1vw auto;width:100%; text-align: center;}
|
||||
.video .text{line-height: 1.5em; font-size: 1em;}
|
||||
.backuper-80 {padding:0.4em 0;}
|
||||
|
||||
}
|
||||
video{width:100%; display: block; color:}
|
||||
/*轮播*/
|
||||
.container{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.preview-backer {
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
position: absolute;
|
||||
width:100%;
|
||||
bottom: 20px;
|
||||
}
|
||||
.preview-backer a {
|
||||
display: inline-block;
|
||||
margin: 5px;
|
||||
width: 290px;
|
||||
height: 110px;
|
||||
}
|
||||
.preview-backer img {
|
||||
display: block;
|
||||
width: 290px;
|
||||
height: 110px;
|
||||
border-top: 3px solid #fff;
|
||||
border-left: 3px solid #fff;
|
||||
border-right: 3px solid #fff;
|
||||
}
|
||||
.active {
|
||||
|
||||
}
|
||||
.pre-backer-text {background: #ecf6ff; width: 290px;height:30px;color: #333;font-size: 1.2em;padding:10px 0; border-bottom: 3px solid #fff; border-left: 3px solid #fff;border-right: 3px solid #fff;}
|
||||
|
||||
.slider-container {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
background-color: #444;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.slider {
|
||||
position: relative;
|
||||
width: 9999px;
|
||||
}
|
||||
.slider:before,
|
||||
.slider:after {
|
||||
display: table;
|
||||
content: ' ';
|
||||
}
|
||||
.slider:after {
|
||||
clear: both;
|
||||
}
|
||||
.slider__item {
|
||||
position: relative;
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.slider__item img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.slider__switch span {
|
||||
color: #fff;
|
||||
display: block;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
/* Arrows */
|
||||
.slider__switch {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -20px;
|
||||
padding: 10px 5px;
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
border-radius: 1px;
|
||||
background: #000;
|
||||
opacity: .3;
|
||||
transition: opacity .15s ease;
|
||||
fill: #fff;
|
||||
}
|
||||
.slider__switch--prev {
|
||||
left: 10px;
|
||||
}
|
||||
.slider__switch--next {
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.slider__switch:hover {
|
||||
opacity: .85;
|
||||
}
|
||||
.slider__switch[disabled] {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.slider.has-touch {
|
||||
cursor: move;
|
||||
cursor: -webkit-grabbing;
|
||||
cursor: -moz-grabbing;
|
||||
}
|
||||
@media (max-width: 580px) {
|
||||
.slider__switch {
|
||||
display: none;
|
||||
}
|
||||
.slider__caption {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
199
public/frontend/web/css/subject/brand-20181112.css
Executable file
199
public/frontend/web/css/subject/brand-20181112.css
Executable file
@@ -0,0 +1,199 @@
|
||||
/*品牌发展*/
|
||||
.rd_img {}
|
||||
.rd_img img {max-width:100%; display: block;}
|
||||
.lj_brand_banner {}
|
||||
.lj_brand_bg {background: #e8eef0; padding:3.5% 0;}
|
||||
|
||||
.lj_brand_text { margin: auto; text-align: center; padding: 30px 0 0; color: #002855; line-height: 28px;}
|
||||
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_brand_all { width:75%; margin: auto;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1400px){
|
||||
.lj_brand_all { width:90%; margin: auto;}
|
||||
}
|
||||
|
||||
|
||||
.lj_brand_t{position: relative;width:100%; margin: auto;}
|
||||
.lj_brand_l { background:rgba(93,191,230,0.8); }
|
||||
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_b_big {font-size: 1.8em; color: #fff; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:1em; color: #fff; line-height:32px; width:85%;}
|
||||
.lj_brand_l{position: absolute;left: 0;top:7%;width:50%; padding:5%;}
|
||||
.lj_brand_l_02{position: absolute;right: 0;top:7%;padding:7% 5%;width:50%;background:rgba(93,191,230,0.8); }
|
||||
.lj_brand_l_03 {position: absolute;left: 0;top:7%; width:50%;padding:9.5% 5%;}
|
||||
.pad_l {padding-left: 18%;}
|
||||
.lj_brand_img_02 { float: left;}
|
||||
}
|
||||
@media screen and (min-width:1300px) and (max-width:1399px){
|
||||
.lj_b_big {font-size: 1.8em; color: #fff; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:1em; color: #fff; line-height:28px; width:96%; }
|
||||
.lj_brand_l{position: absolute;left: 0;top:7%;width:40%; padding:3%;}
|
||||
.lj_brand_l_02{ position: absolute;right: 0;top:7%;padding:8% 5%;width:36%;background:rgba(93,191,230,0.8); }
|
||||
.lj_brand_l_03 {position: absolute;left: 0;top:7%; width:36%;padding:10% 5%;}
|
||||
.pad_l {padding-left: 10%;}
|
||||
.lj_brand_img_02 { float: left;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:1100px) and (max-width:1299px){
|
||||
.lj_b_big {font-size: 1.8em; color: #fff; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:1em; color: #fff; line-height:28px; width:96%; }
|
||||
.lj_brand_l{position: absolute;left: 0;top:7%;width:40%; padding:5% 3%;}
|
||||
.lj_brand_l_02{position: absolute;right: 0;top:7%; padding:8% 5%;width:36%;background:rgba(93,191,230,0.8); }
|
||||
.lj_brand_l_03 {position: absolute;left: 0;top:7%; width:32%;padding:11% 5%;}
|
||||
.pad_l {padding-left: 8%;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:1099px){
|
||||
.lj_b_big {font-size: 1.3em; color: #fff; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:0.9em; color: #fff; line-height:24px; width:96%; }
|
||||
.lj_brand_l{position: absolute;left: 0;top:0;width:40%; padding:5% 3%;}
|
||||
.lj_brand_l_02{position: absolute;right: 0;top:0; padding:8% 5%;width:36%;background:rgba(93,191,230,0.8); }
|
||||
.lj_brand_l_03 {position: absolute;left: 0;top:0; width:32%;padding:11% 5%;}
|
||||
.pad_l {padding-left: 8%;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.lj_brand_text {width:56%;}
|
||||
.lj_cur_01 {display: block;}
|
||||
.lj_cur_02 {display: none;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.lj_brand_text {width:90%;}
|
||||
.lj_cur_01 {display: none;}
|
||||
.lj_cur_02 {display: block;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.lj_b_big {font-size: 1.3em; color: #fff; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:1em; color: #fff; line-height:24px; width:96%; }
|
||||
.lj_brand_l{width:94%; padding:5% 3%;}
|
||||
.lj_brand_l_02{ width:94%;padding:5% 3%;background:rgba(93,191,230,0.8); float: left;}
|
||||
.lj_brand_l_03 { width:94%;padding:5% 3%;}
|
||||
.lj_brand_img_02 { float: right;}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.lj_brand_img { float: right;}
|
||||
.lj_brand_img img {width: 100%;}
|
||||
|
||||
.lj_brand_img_02 { float: left;}
|
||||
.lj_brand_l_03 { background:rgba(93,191,230,0.8); }
|
||||
.lj_brand_img_03 { float: right;}
|
||||
|
||||
/*品牌大记事*/
|
||||
.dis_bril_bg { background: #f1f1f1; padding: 4% 0;}
|
||||
.dis_event_list { width:100%;float:right;margin:10px 0 20px 0; }
|
||||
.dis_event_list li { clear: both;}
|
||||
.dis_event_list li span { width:30%;text-align:left;display:block;float:left;margin-top:10px; color: #444; font-size: 1.125em;}
|
||||
|
||||
@media screen and (min-width:1400px){
|
||||
.dis_event_list {background:url('../../../../frontend/web/images/brand/dian3.png') 169px 0 repeat-y;}
|
||||
.dis_box { width:60%;margin:48px auto 0 auto; }
|
||||
.dis_event_list h3 { width:127px;text-align:right;display:block;float:left;margin-top:13px; color: #444; font-size:1.125em; font-weight: 600; }
|
||||
.dis_event_list li p { width:70%;background:url('../../../../frontend/web/images/brand/jian.png') 0 20px no-repeat; margin-left:37px;display:inline-block;padding-left:6%;line-height:36px;_float:left; }
|
||||
.dis_big_l { font-size: 3em; text-align: center; color: #fff; padding: 5% 0;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1200px) and (max-width:1399px){
|
||||
|
||||
.dis_event_list {background:url('../../../../frontend/web/images/brand/dian3.png') 169px 0 repeat-y;}
|
||||
.dis_box { width:70%;margin:18px auto 0 auto; }
|
||||
.dis_event_list h3 { width:127px;text-align:right;display:block;float:left;margin-top:10px; color: #444; font-size:1.125em; font-weight: 600; }
|
||||
.dis_event_list li p { width:70%;background:url('../../../../frontend/web/images/brand/jian.png') 0 20px no-repeat; margin-left:37px;display:inline-block;padding-left:6%;line-height:36px;_float:left; }
|
||||
.dis_big_l { font-size: 3em; text-align: center; color: #fff; padding: 5% 0;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:900px) and (max-width:1199px){
|
||||
.dis_event_list {background:url('../../../../frontend/web/images/brand/dian3.png') 167px 0 repeat-y;}
|
||||
.dis_box { width:80%;margin:18px auto 0 auto; }
|
||||
.dis_event_list h3 { width:127px;text-align:right;display:block;float:left;margin-top:20px; color: #444; font-size:1.125em; font-weight: 600; }
|
||||
.dis_event_list li p { width:70%;background:url('../../../../frontend/web/images/brand/jian.png') 35px 20px no-repeat; display:inline-block;padding-left:6%;line-height:36px;_float:left; }
|
||||
.dis_big_l { font-size:2.5em; text-align: center; color: #fff; padding: 5% 0;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:899px){
|
||||
.dis_event_list {background:url('../../../../frontend/web/images/brand/dian3.png') 167px 0 repeat-y;}
|
||||
.dis_box { width:80%;margin:18px auto 0 auto; }
|
||||
.dis_event_list h3 { width:127px;text-align:right;display:block;float:left;margin-top:25px; color: #444; font-size:1.125em; font-weight: 600; }
|
||||
.dis_event_list li p { width:70%;background:url('../../../../frontend/web/images/brand/jian.png') 35px 20px no-repeat; display:inline-block;padding-left:8%;line-height:36px;_float:left; }
|
||||
.dis_big_l { font-size:2em; text-align: center; color: #fff; padding: 5% 0;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.dis_event_list {background:url('../../../../frontend/web/images/brand/dian3.png') 100px 0 repeat-y;}
|
||||
.dis_box { width:100%;margin:18px auto 0 auto; }
|
||||
.dis_event_list h3 { width:60px;text-align:right;display:block;float:left;margin-top:15px; color: #444; font-size:1.1em; font-weight: 600; }
|
||||
.dis_event_list li p { width:50%;background:url('../../../../frontend/web/images/brand/jian.png') 35px 20px no-repeat; display:inline-block;padding-left:8%;line-height:32px;_float:left; }
|
||||
.dis_big_l { font-size:1.6em; text-align: center; color: #fff; padding: 5% 0;}
|
||||
}
|
||||
.dis_event_list li p span { width:100%;text-align:left;padding:10px 15px 10px 50px; color: #444; margin:0; }
|
||||
|
||||
/*技术发展*/
|
||||
.lj_l{float: left;}
|
||||
.lj_r {float: right;}
|
||||
|
||||
@media screen and (min-width:1600px){
|
||||
.lj_tech_all { width: 75%; margin:auto ;}
|
||||
}
|
||||
@media screen and (max-width:1599px){
|
||||
.lj_tech_all { width: 90%; margin:auto ;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:1600px){
|
||||
.lj_tech_l {width:50%;}
|
||||
.lj_tech_r { width:48%; padding-left: 2%;}
|
||||
.text_r{text-align: right;}
|
||||
.lj_tech_r h3 {padding:12% 0 5%; font-size: 1.875em; }
|
||||
.lj_small_t {line-height: 36px;font-size: 1em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1599px){
|
||||
.lj_tech_l {width:50%;}
|
||||
.lj_tech_r { width:48%; padding-left: 2%;}
|
||||
.text_r{text-align: right;}
|
||||
.lj_tech_r h3 {padding:6% 0 5%; font-size: 1.6em; }
|
||||
.lj_small_t {line-height: 36px;font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:1000px) and (max-width:1279px){
|
||||
.lj_tech_l {width:50%;}
|
||||
.lj_tech_r { width:48%; padding-left: 2%;}
|
||||
.text_r{text-align: right;}
|
||||
.lj_tech_r h3 {padding:6% 0 5%; font-size: 1.4em; }
|
||||
.lj_small_t {line-height: 30px;font-size: 0.9em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_tech_l {width:50%;}
|
||||
.lj_tech_r { width:48%; padding-left: 2%;}
|
||||
.text_r{text-align: right;}
|
||||
.lj_tech_r h3 {padding:6% 0 3%; font-size: 1.2em; }
|
||||
.lj_small_t {line-height:20px;font-size: 0.9em; }
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.lj_tech_l {width:100%; }
|
||||
.lj_tech_r { width:100%;margin: 3% 0; }
|
||||
.text_r{text-align: left;}
|
||||
.lj_tech_r h3 {padding:6% 0 3%; font-size: 1.4em;}
|
||||
.lj_small_t {line-height:26px;font-size: 0.9em; }
|
||||
}
|
||||
|
||||
|
||||
.lj_tech_r h3{color: #444;font-weight: 100;}
|
||||
.text_r { margin-right:4%;}
|
||||
.lj_small_t {color: #444;}
|
||||
.pad_b {padding-bottom: 40px;}
|
||||
83
public/frontend/web/css/subject/brand.css
Executable file
83
public/frontend/web/css/subject/brand.css
Executable file
@@ -0,0 +1,83 @@
|
||||
.lj_brand_bg {background: #e8eef0; padding:4.3% 0;}
|
||||
.vtext{margin-bottom:4%;}
|
||||
.vtext .tl1, .vtext_01{font-size:2.25em;color:#333;font-weight:bold;text-align:center;}
|
||||
.vtext_01{margin-bottom:3.4%;}
|
||||
.lj_brand_text {width:83%; margin:auto; text-align: center; font-size: 1.125em; color:#101010; line-height: 2em; margin-top:2.4%;}
|
||||
.rd_img img{width:100%; display: block;}
|
||||
@media screen and (min-width:768px){
|
||||
.lj_cur_01 {display: block;}
|
||||
.lj_cur_02 {display: none;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.lj_cur_01 {display: none;}
|
||||
.lj_cur_02 {display: block;}
|
||||
}
|
||||
.lj_brand_t{position: relative;width:100%; margin: auto;}
|
||||
.lj_brand_l, .lj_brand_l_02, .lj_brand_l_03{ position: absolute; top: 8%; width: 45%; }
|
||||
.lj_brand_l {left: 0; padding: 4.6%;}
|
||||
.lj_brand_l_02 {right: 0; padding: 7% 0 8.9%;}
|
||||
.lj_brand_l_03 {left: 0; padding:9.5% 5% 10.5%;}
|
||||
.lj_b_big {font-size: 1.875em; color: #333; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:1em; color: #333; line-height:32px; width:85%;}
|
||||
.lj_brand_img_02{width:50%; float: left;}
|
||||
.lj_brand_img, .lj_brand_img_03{width:50%; float: right;}
|
||||
|
||||
@media screen and (max-width:1280px){
|
||||
.lj_brand_l, .lj_brand_l_02, .lj_brand_l_03{top:0;}
|
||||
.lj_b_small{width:100%; line-height:1.4em;}
|
||||
.lj_brand_l_02{text-align: right;}
|
||||
}
|
||||
@media screen and (max-width:990px){
|
||||
.lj_brand_l, .lj_brand_l_02, .lj_brand_l_03{width:45%;}
|
||||
.lj_brand_l {left: 0; padding: 3%;}
|
||||
.lj_brand_l_02 {right: 0; padding: 7% 3%;}
|
||||
.lj_brand_l_03 {left: 0; padding:9.5% 3%;}
|
||||
.lj_b_big{font-size: 1.5em; padding-bottom: 10px}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.lj_b_big {font-size: 1.3em; padding-bottom: 20px;}
|
||||
.lj_b_small {font-size:1em; line-height:24px; width:96%; }
|
||||
.lj_brand_l, .lj_brand_l_02, .lj_brand_l_03{position: relative; width:100%;}
|
||||
.lj_brand_l, .lj_brand_l_02, .lj_brand_l_03{width:94%; padding:5% 3%;}
|
||||
.lj_brand_l_02{float: left; text-align: left;}
|
||||
.lj_brand_img, .lj_brand_img_02, .lj_brand_img_03 {width:100%;}
|
||||
}
|
||||
/*品牌大记事*/
|
||||
.dis_bril_bg {background: #f1f1f1; padding: 4.2% 0; overflow: hidden;}
|
||||
.dis_box{margin:auto}
|
||||
@media screen and (min-width:1080px){
|
||||
.dis_box{width:1060px;}
|
||||
}
|
||||
@media screen and (max-width:1079px){
|
||||
.dis_box{width:96%;}
|
||||
}
|
||||
.dis_box .culture-l{width:14%; float: left; text-align: center; line-height: 2em; padding-top:1em;color:#333;}
|
||||
.dis_box .culture-l span{display: block; position: absolute; width: 10px; height: 10px; border-radius: 5px; background-color: #009fdf;right: -5px; top: 1.5em;}
|
||||
.dis_box .culture-r{border-left:1px solid #b0bbc7; width:76%; float: left; padding-left:7%; line-height: 2em; padding-top:1em;}
|
||||
|
||||
/*技术发展*/
|
||||
.lj_l h3, .lj_r h3 {color: #333; margin-bottom:5.5%; font-size: 1.875em; }
|
||||
.lj_small_t {color: #737373; line-height: 2em; font-size: 1em;}
|
||||
@media screen and (max-width:1080px){
|
||||
.lj_l h3, .lj_r h3 {font-size: 1.5em;}
|
||||
.lj_small_t { line-height: 1.8em;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.Brand-swt-Table{display: table; width:100%;}
|
||||
.Brand-swt-Table .Table-Row{display: table-row;}
|
||||
.Brand-swt-Table .Table-Row .Table-Cell{display: table-cell; margin:0; padding:0; width:50%; vertical-align: middle;}
|
||||
}
|
||||
.lj_l{margin-left:2.5%; text-align: left;}
|
||||
.lj_r{margin-right:5%; text-align: right;}
|
||||
.B-D-Block{display:block}
|
||||
.B-D-None{display:none}
|
||||
@media screen and (max-width:767px){
|
||||
.dis_box .culture-l span{width: 6px; height: 6px; border-radius: 3px; right:-3px;}
|
||||
.Brand-swt-Table{width:90%; margin:auto;}
|
||||
.lj_l, .lj_r{margin-left:0%; margin-right:0; text-align: left; width:100%;}
|
||||
.B-D-Block{display: none}
|
||||
.B-D-None{display:block; margin-bottom: 5%;}
|
||||
.Table-Cell{margin-bottom: 5%;}
|
||||
.vtext{margin-bottom:15px;}
|
||||
}
|
||||
228
public/frontend/web/css/subject/charger.css
Executable file
228
public/frontend/web/css/subject/charger.css
Executable file
@@ -0,0 +1,228 @@
|
||||
/*公共样式*/
|
||||
.charger_title{font-size: 3em;}
|
||||
.charger_subtitle{font-size: 1.75em; }
|
||||
.charger_text{font-size: 1em;}
|
||||
.charger_buy .charger_buy_button{position: relative; top:50%; margin-top:-1.5em; width:100%; text-align: center;}
|
||||
.charger_buy a{padding-left:5%; padding-right:5%; height: 2em; margin-left:2%; margin-right:2%; border:1px solid #5c5c5c; display: inline-block; line-height: 2em; color:#333; font-size: 1.125em; }
|
||||
.charger_buy a:hover{background-color:#2dccd2; color:#FFF; border:1px solid #2dccd2; }
|
||||
@media screen and (max-width:1280px){
|
||||
.charger_title{font-size: 2.5em;}
|
||||
}
|
||||
@media screen and (max-width:769px){
|
||||
.charger_title{font-size: 2em;}
|
||||
.charger_subtitle{font-size: 1.5em; }
|
||||
.charger_text{font-size: 1.125em;}
|
||||
.charger_buy a{font-size: 1em;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.charger_title{font-size: 1.5em;}
|
||||
.charger_subtitle{font-size: 1.125em; }
|
||||
.charger_text{font-size: 1em;}
|
||||
}
|
||||
/*第一屏*/
|
||||
.charger_01{position: absolute; width:100%; color:#FFFFFF; top:23%; font-size: 2em}
|
||||
.charger_01 .title{font-size: 2.125em; line-height: 2.3em; width:60%; margin-left:0%;}
|
||||
.charger_01 .text{font-size: 1em; width:60%; margin-left:0%;}
|
||||
@media screen and (max-width:1440px){
|
||||
.charger_01{font-size: 1.5em}
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.charger_01{top:12%;}
|
||||
.charger_01 .title, .charger_01 .text{width:70%; margin-left:0%;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.charger_01{font-size: 1em; top:30%; left:5%;}
|
||||
.charger_01 .title{line-height: 1.2em;}
|
||||
}
|
||||
/*视频*/
|
||||
.charger_02_bg{width:100%; padding-top:5%; padding-bottom: 5%; overflow: hidden; background-color:#f2f2f2; }
|
||||
.charger_02{width:100%; color:#333;}
|
||||
.charger_02 .left{width:29%; float: left;}
|
||||
.charger_02 .right{width:69%; float: right; position: relative}
|
||||
.charger_02 .right img{opacity: 0;}
|
||||
@media screen and (max-width:769px){
|
||||
.charger_02 .left{width:100%; text-align: center; margin-bottom: 3%;}
|
||||
.charger_02 .right{width:100%; float: left; }
|
||||
}
|
||||
.charger_02 video{position: absolute; top:0; left:0; width:100%; }
|
||||
.charger_02 .charger_title{line-height: 1.1em;}
|
||||
.charger_02 .charger_subtitle{line-height: 1.7em; margin-top:1.4vw;}
|
||||
.charger_02 .charger_text{line-height: 1.7em; margin-top:2.3vw; }
|
||||
@media screen and (max-width:960px){
|
||||
.charger_02 .charger_text{display: none;}
|
||||
}
|
||||
/*产品一*/
|
||||
.charger_03{width:100%; background-color:#f2f2f2; overflow: hidden; padding-bottom: 5%;}
|
||||
.charger_03 li{width:23.95%; margin-right:1.4%; float: left; position: relative; overflow: hidden; border-top:5px solid #2dccd2;}
|
||||
.charger_03 li:last-child{margin-right:0;}
|
||||
.charger_03 .title{font-size: 1.75em; text-align: center; color:#333; position: absolute; top:13%; width:100%; left:0;}
|
||||
@media screen and (min-width:769px){
|
||||
.charger_03 .charger_buy{position: absolute; bottom:-30%; width:100%;}
|
||||
.charger_03 li:hover .charger_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:768px){
|
||||
.charger_03 li{width:49%; margin-right:2%; background-color:#FFF; margin-bottom: 2vw; text-align: center;}
|
||||
.charger_03 li:nth-child(2n){margin-right:0;}
|
||||
.charger_03 .title{font-size: 1.5em}
|
||||
.charger_03 .charger_buy{position: relative; margin-bottom: 3vw;}
|
||||
.charger_03 li:hover .charger_buy{position: relative;}
|
||||
}
|
||||
|
||||
/*第四屏*/
|
||||
.charger_04{position: relative;}
|
||||
.charger_04 .text{position: absolute; right:0; width:100%; top:10vw; color:#FFFFFF; }
|
||||
.charger_04 .charger_04_word{width:35%; float: right;}
|
||||
.charger_04 .charger_title{line-height: 1.2em;}
|
||||
.charger_04 .charger_subtitle{ margin-top:1.8vw; line-height: 1.2em;}
|
||||
.charger_04 .charger_text{ line-height: 1.6em; margin-top:2.7vw;}
|
||||
|
||||
.charger_04 li{width:19.16%; margin-right:1.05%; float: left; position: relative; overflow: hidden; border-top:5px solid #2dccd2;}
|
||||
.charger_04 li:last-child{margin-right:0;}
|
||||
|
||||
.charger_04 .title{font-size: 1.5em; text-align: center; color:#333; position: absolute; top:13%; width:100%; left:0;}
|
||||
.charger_04 .charger_buy{position: absolute; bottom:-30%; width:100%;}
|
||||
.charger_04 li:hover .charger_buy{background-color:rgba(255,255,255,0.5); overflow: hidden; position: absolute; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
.charger_04 .charger_buy a{font-size: 1em;}
|
||||
.charger_04 .all_text{position: absolute; bottom:4.5vw; left:0; width:100%;}
|
||||
|
||||
@media screen and (min-width:961px){
|
||||
.charger_04_PC{display: block}
|
||||
.charger_04_M{display: none;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1280px){
|
||||
.charger_04 .text{top:6vw;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:960px){
|
||||
.charger_04_PC{display: none}
|
||||
.charger_04_M{display: block;}
|
||||
.charger_buy a{margin-left:1%; margin-right:1%; height: 24%;}
|
||||
.charger_04 li{width:24.25%; margin-right:1%; margin-bottom: 1vw; border-top:5px solid #2dccd2;}
|
||||
.charger_04 .all_text{background:url(../../images/charger/charger-04-bg.jpg) repeat; position: relative; top:0; overflow: hidden; padding-top:0vw; padding-bottom: 4vw;}
|
||||
}
|
||||
@media screen and (min-width:769px) and (max-width:960px){
|
||||
.charger_04 li:nth-child(4n){margin-right:0;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.charger_04 li{width:32.3%; margin-right:1%; margin-bottom: 1vw; overflow: hidden; background-color:#FFF;}
|
||||
.charger_04 .charger_text{display: none;}
|
||||
.charger_04 li:nth-child(3n){margin-right:0;}
|
||||
.charger_04 .charger_buy{position: relative; margin-bottom: 3vw; bottom: 0;}
|
||||
.charger_04 li:hover .charger_buy{overflow:visible; position: relative; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
.charger_04 .text{top:15vw;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.charger_04 li:first-child{display: none;}
|
||||
.charger_04 li{width:49%; margin-right:2%; background-color:#FFF; margin-bottom: 2vw; margin-left:0;}
|
||||
}
|
||||
/*第五屏*/
|
||||
.charger_05{position: relative;}
|
||||
.charger_05 .all_text{position: absolute; width:100%; bottom:6vw; color:#FFF;}
|
||||
.charger_05 .title{font-size: 3em; line-height: 1.2em;}
|
||||
.charger_05 .sub_title{font-size: 1.875em; line-height: 1.5em; margin-top:1.4vw;}
|
||||
.charger_05 .des{font-size:1.125em; line-height: 1.6em; margin-top:2.5vw; width:45%;}
|
||||
@media screen and (max-width:1280px){
|
||||
.charger_05 .title{font-size: 2.5em;}
|
||||
.charger_05 .des{width:70%;}
|
||||
}
|
||||
@media screen and (max-width:769px){
|
||||
.charger_05 .all_text{bottom:6vw;}
|
||||
.charger_05 .title{font-size: 2em;}
|
||||
.charger_05 .sub_title{font-size: 1.5em;}
|
||||
.charger_05 .des{width:100%; display: none;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.charger_05 .all_text{bottom:3vw;}
|
||||
.charger_05 .title{font-size: 1.5em;}
|
||||
.charger_05 .sub_title{font-size: 1.125em;}
|
||||
.charger_05 .des{width:100%; display: none;}
|
||||
}
|
||||
|
||||
/*第六屏*/
|
||||
.charger_06{background-color:#020204; overflow: hidden; position: relative;}
|
||||
.charger_06_bg{background:url(../../images/charger/charger-06.jpg) no-repeat; overflow: hidden;background-position:0% 100%; background-size:100%; }
|
||||
.charger_06 .all{width:100%; margin-top:5%; margin-bottom:5.5%; overflow: hidden;}
|
||||
.charger_06 .all_text{width:40%; position: relative; right:0; color:#FFF; vertical-align: middle;}
|
||||
.charger_06 .main_title{font-size: 3em; line-height: 1.2em;}
|
||||
.charger_06 .sub_title{font-size: 1.875em; line-height: 1.5em; margin-top:1.4vw;}
|
||||
.charger_06 .des{font-size: 1.125em; line-height: 1.6em; margin-top:2.5vw;}
|
||||
.charger_06 .all_text .all_img{margin-top:3vw; margin-bottom: 3vw;}
|
||||
.charger_06 .all_text li{width:48%; float: left; margin-right:4%; position: relative; overflow: hidden;}
|
||||
.charger_06 .all_text li:last-child{margin-right:0;}
|
||||
.charger_06 .charger_buy{position: absolute; bottom:-22%; width:100%;}
|
||||
.charger_06 li:hover .charger_buy{background-color:rgba(255,255,255,0.5); position: absolute; bottom:0px; width:100%; height: 29%; transition: 0.5s;}
|
||||
.charger_06 .charger_buy a{font-size: 1em;}
|
||||
.charger_06 .title{font-size: 1.5em; text-align: center; color:#333; position: absolute; top:12%; width:100%; left:0;}
|
||||
.charger_06 .charger_buy .charger_buy_button{top:50%;}
|
||||
|
||||
@media screen and (min-width:1281px){
|
||||
.charger_06 .center_M{display: none;}
|
||||
.charger_06 .center{display: block;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.charger_06 .center_M{display: block; color:#FFF; text-align: center; margin-top:5vw; margin-bottom: 5vw;}
|
||||
.charger_06 .center_M .des{width:80%; margin:auto;}
|
||||
.charger_06 .center{display: none;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.charger_06 .main_title{font-size: 2.5em;}
|
||||
}
|
||||
@media screen and (max-width:769px){
|
||||
.charger_06 .main_title{font-size: 2em;}
|
||||
.charger_06 .sub_title{font-size: 1.5em; }
|
||||
.charger_06 .des{font-size: 1.125em;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.charger_06 .main_title{font-size: 1.5em;}
|
||||
.charger_06 .sub_title{font-size: 1.125em; }
|
||||
.charger_06 .des{font-size: 1em;}
|
||||
}
|
||||
@media screen and (min-width:961px){
|
||||
.charger_06_img_M{display: none;}
|
||||
.charger_06 .all_text{float: right; }
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.charger_06_img_M{display: block;}
|
||||
.charger_06_bg{background:none;}
|
||||
.charger_06 .all_text{width:540px; margin:auto;}
|
||||
.charger_06 .all{margin-top:0;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.charger_06 .des{display: none;}
|
||||
}
|
||||
@media screen and (max-width:540px){
|
||||
.charger_06 .all_text{width:100%;}
|
||||
}
|
||||
@media screen and (min-width:769px){
|
||||
.charger_06 .charger_buy{position: absolute; bottom:-30%; width:100%;}
|
||||
.charger_06 li:hover .charger_buy{background-color:rgba(255,255,255,0.5);overflow:visible; position: absolute; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.charger_06 li{width:49%; margin-right:2%; background-color:#FFF; margin-bottom: 2vw; text-align: center;}
|
||||
.charger_06 li:nth-child(2n){margin-right:0;}
|
||||
.charger_06 .title{font-size: 1.5em; top:8%;}
|
||||
.charger_06 .charger_buy{position: relative; margin-bottom: 3vw; bottom:0;}
|
||||
.charger_06 li:hover .charger_buy{position: relative;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
282
public/frontend/web/css/subject/contact.css
Executable file
282
public/frontend/web/css/subject/contact.css
Executable file
@@ -0,0 +1,282 @@
|
||||
.C-title {
|
||||
margin-top: 4%;
|
||||
margin-bottom: 2%;
|
||||
font-size: 1.875em;
|
||||
}
|
||||
.C-line {
|
||||
width: 4.25%;
|
||||
height: 5px;
|
||||
background-color: #002855;
|
||||
overflow: hidden;
|
||||
margin: 0 auto 2%;
|
||||
}
|
||||
.C-All {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
margin: 1.8% 0;
|
||||
}
|
||||
.C-bg {
|
||||
background: #f1f1f1;
|
||||
padding: 2% 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
/*公司地址*/
|
||||
.c_bg_c {
|
||||
background: #f1f1f1;
|
||||
padding: 4% 0 0;
|
||||
}
|
||||
.contact_address_t li {
|
||||
overflow: hidden;
|
||||
padding-bottom: 2%;
|
||||
}
|
||||
.contact_address_t li .left_img {
|
||||
width: 30%;
|
||||
float: left;
|
||||
padding: 0 0 0 5.5%;
|
||||
}
|
||||
.contact_address_t li .right_text {
|
||||
width: 55%;
|
||||
float: left;
|
||||
}
|
||||
.contact_address_t li .left_img {
|
||||
margin-right: 1.6%;
|
||||
}
|
||||
.contact_address_t li .left_img img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.c_title_h3 {
|
||||
font-size: 1.125em;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
color: #333;
|
||||
line-height: 2.8em;
|
||||
}
|
||||
.c_title_h3 img {
|
||||
padding-right: 1em;
|
||||
}
|
||||
.c_text_p {
|
||||
line-height: 1em;
|
||||
color: #737373;
|
||||
padding: 2% 0;
|
||||
font-size: 0.875em;
|
||||
padding-left: 1.8em;
|
||||
}
|
||||
.c_text_p p {
|
||||
margin-bottom: 0.5vw;
|
||||
}
|
||||
/*联系方式 */
|
||||
.contact_tel {
|
||||
padding-bottom: 2%;
|
||||
}
|
||||
@media screen and (min-width: 1360px) {
|
||||
.contact_tel li {
|
||||
width: 22.5%;
|
||||
float: left;
|
||||
margin: 0 1%;
|
||||
}
|
||||
.contact_tel li:nth-child(1) {
|
||||
margin-left: 2%;
|
||||
}
|
||||
.contact_tel li:last-child {
|
||||
margin-right: 2%;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 640px) and (max-width: 1359px) {
|
||||
.contact_tel li {
|
||||
width: 46%;
|
||||
float: left;
|
||||
margin: 0 2% 3% 2%;
|
||||
}
|
||||
.contact_tel li:nth-child(2n) {
|
||||
margin-left: 1%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 639px) {
|
||||
.contact_tel li {
|
||||
width: 96%;
|
||||
margin: 4% auto;
|
||||
}
|
||||
}
|
||||
.contact_tel li {
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
padding: 3% 0;
|
||||
}
|
||||
.contact_tel_text {
|
||||
text-align: left;
|
||||
padding: 4% 8%;
|
||||
line-height: 2em;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
.contact_tel li img {
|
||||
vertical-align: middle;
|
||||
max-width: 80%;
|
||||
}
|
||||
.con_bl {
|
||||
color: #009fdf;
|
||||
}
|
||||
.con_black {
|
||||
color: #333;
|
||||
margin: 5% 0 1%;
|
||||
font-size: 1.125em;
|
||||
}
|
||||
/*icon*/
|
||||
.li_icon_p {
|
||||
padding: 0 0 5%;
|
||||
}
|
||||
.lj_icon li {
|
||||
width: 33.333%;
|
||||
font-size: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
.li_icon_p img {
|
||||
width: 14.6%;
|
||||
margin: auto;
|
||||
}
|
||||
.lj_icon li {
|
||||
float: left;
|
||||
}
|
||||
/*工厂联系方式*/
|
||||
.factory {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
.factory li {
|
||||
width: 48.6%;
|
||||
margin-right: 2.8%;
|
||||
float: left;
|
||||
margin-top: 1.5vw;
|
||||
}
|
||||
.factory li:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
.factory li .left {
|
||||
width: 49.7%;
|
||||
float: left;
|
||||
margin-right: 2.3%;
|
||||
}
|
||||
.factory li .content {
|
||||
width: 48%;
|
||||
float: left;
|
||||
}
|
||||
.factory .content {
|
||||
width: 90%;
|
||||
margin: 0vw auto 0;
|
||||
}
|
||||
.factory .c_title {
|
||||
font-size: 1.125em;
|
||||
color: #101010;
|
||||
margin-bottom: 0.8vw;
|
||||
}
|
||||
.factory .content .left {
|
||||
width: 16%;
|
||||
float: left;
|
||||
line-height: 1.5em;
|
||||
margin-right: 0;
|
||||
}
|
||||
.factory .content .right {
|
||||
width: 78%;
|
||||
float: left;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.factory .contact {
|
||||
overflow: hidden;
|
||||
margin-left: 20px;
|
||||
font-size: 1em;
|
||||
color: #737373;
|
||||
line-height: 1em;
|
||||
font-weight: 100;
|
||||
}
|
||||
.factory .c_title img {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.factory img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.factory .title {
|
||||
font-size: 2em;
|
||||
color: #101010;
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
line-height: 1.25em;
|
||||
margin-bottom: 2.5vw;
|
||||
}
|
||||
.factory .contact p {
|
||||
margin-top: 0.5vw;
|
||||
display: block;
|
||||
}
|
||||
@media screen and (max-width: 1459px) {
|
||||
.factory li {
|
||||
width: 49%;
|
||||
margin-right: 2%;
|
||||
}
|
||||
.factory .content .left {
|
||||
width: 18%;
|
||||
}
|
||||
.factory .content .right {
|
||||
width: 78%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1439px) {
|
||||
.factory .c_title {
|
||||
font-size: 1em;
|
||||
}
|
||||
.factory li .left img {
|
||||
width: 100%;
|
||||
}
|
||||
.factory .contact {
|
||||
font-size: 0.875em;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1280px) {
|
||||
.factory .content .left {
|
||||
width: 18%;
|
||||
}
|
||||
.factory .content .right {
|
||||
width: 82%;
|
||||
}
|
||||
.factory .c_title img {
|
||||
margin-right: 2px;
|
||||
}
|
||||
.factory .contact {
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 641px) and (max-width: 960px) {
|
||||
.factory li {
|
||||
width: 49%;
|
||||
margin-right: 2%;
|
||||
}
|
||||
.factory li:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 640px) {
|
||||
.factory li {
|
||||
width: 98%;
|
||||
margin-right: 1%;
|
||||
}
|
||||
}
|
||||
|
||||
.contact-fact-l {
|
||||
float: left;
|
||||
padding-left: 20px;
|
||||
width: 75%;
|
||||
}
|
||||
.contact-fact-l img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.contact-text-r {
|
||||
width: 22%;
|
||||
float: right;
|
||||
}
|
||||
.contact-text-r h3 {
|
||||
font-size: 24px;
|
||||
padding: 45px 0 40px;
|
||||
color: #010101;
|
||||
}
|
||||
|
||||
.contact-text-r p {
|
||||
line-height: 28px;
|
||||
color: #737373;
|
||||
}
|
||||
26
public/frontend/web/css/subject/culture-原.css
Executable file
26
public/frontend/web/css/subject/culture-原.css
Executable file
@@ -0,0 +1,26 @@
|
||||
.culture-Menu{background-color:#f1f1f1; overflow: hidden;}
|
||||
.culture{background-color:#e8eef0; overflow: hidden}
|
||||
.culture .title{color:#002855; font-weight: 600; padding:5% 0 3%;}
|
||||
.culture .punctuation{color:#ff9800; margin-left:8px; font-size: 1.25em;}
|
||||
@media screen and (min-width:1280px){
|
||||
.culture-Menu img{margin:auto;}
|
||||
.culture .Container{width:1200px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1279px){
|
||||
.culture-Menu img{margin:auto; width:27%;}
|
||||
.culture .Container{width:96%; margin:auto;}
|
||||
}
|
||||
.culture .des{width:90%; margin: 0 auto 2%; color:#002855; line-height: 2em}
|
||||
.culture .line{width:4.25%; height: 5px; background-color:#002855; overflow: hidden; margin:0 auto 2%;}
|
||||
.culture-l{width:12%; float: left; text-align: right; padding-right:2%; line-height: 2em; padding-top:2em; font-family: "SourceHanSans-Light"; font-weight: bold;color:#002855;}
|
||||
.culture-l span{display: block; position: absolute; width: 10px; height: 10px; border-radius: 5px; background-color: #002855;right: -5px; top: 2.5em;}
|
||||
.culture-r{border-left:1px solid #b0bbc7; width:72%; float: left; padding-left:7%; line-height: 2em; padding-top:2em; font-family: "SourceHanSans-Light"}
|
||||
.culture-Menu .Menu{margin-bottom:3%; overflow: hidden}
|
||||
.culture-Menu a{display:inline-block;border-radius:2em; margin-left:1%; color: #009fdf; text-decoration: none; cursor: pointer;}
|
||||
.culture-Menu .active{background-color:#002855; border:2px solid #002855; color:#FFF;}
|
||||
@media screen and (min-width:480px){
|
||||
.culture-Menu a{ padding:0.5% 2%; margin-right:1%; border:2px solid #009fdf;}
|
||||
}
|
||||
@media screen and (max-width:479px){
|
||||
.culture-Menu a{ padding:0.5% 1.5%; margin-right:0.5%; border:1px solid #009fdf;}
|
||||
}
|
||||
866
public/frontend/web/css/subject/culture.css
Executable file
866
public/frontend/web/css/subject/culture.css
Executable file
@@ -0,0 +1,866 @@
|
||||
.culture-Menu {
|
||||
background-color: #f1f1f1;
|
||||
overflow: hidden;
|
||||
}
|
||||
.culture {
|
||||
background-color: #e8eef0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.culture .title {
|
||||
color: #002855;
|
||||
font-weight: 600;
|
||||
padding: 5% 0 3%;
|
||||
}
|
||||
.culture .punctuation {
|
||||
color: #ff9800;
|
||||
margin-left: 8px;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
@media screen and (min-width: 1440px) {
|
||||
.culture-Menu img {
|
||||
margin: auto;
|
||||
}
|
||||
.culture .Container {
|
||||
width: 1440px;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1339px) {
|
||||
.culture-Menu img {
|
||||
margin: auto;
|
||||
width: 27%;
|
||||
}
|
||||
.culture .Container {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
.culture .des {
|
||||
width: 90%;
|
||||
margin: 0 auto 2%;
|
||||
color: #002855;
|
||||
line-height: 2em;
|
||||
}
|
||||
.culture .line {
|
||||
width: 4.25%;
|
||||
height: 5px;
|
||||
background-color: #002855;
|
||||
overflow: hidden;
|
||||
margin: 0 auto 2%;
|
||||
}
|
||||
.culture-l {
|
||||
width: 12%;
|
||||
float: left;
|
||||
text-align: right;
|
||||
padding-right: 2%;
|
||||
line-height: 2em;
|
||||
padding-top: 2em;
|
||||
font-family: 'SourceHanSans-Light';
|
||||
font-weight: bold;
|
||||
color: #002855;
|
||||
}
|
||||
.culture-l span {
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
background-color: #002855;
|
||||
right: -5px;
|
||||
top: 2.5em;
|
||||
}
|
||||
.culture-r {
|
||||
border-left: 1px solid #b0bbc7;
|
||||
width: 72%;
|
||||
float: left;
|
||||
padding-left: 7%;
|
||||
line-height: 2em;
|
||||
padding-top: 2em;
|
||||
font-family: 'SourceHanSans-Light';
|
||||
}
|
||||
.culture-Menu .Menu {
|
||||
margin-bottom: 3%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.culture-Menu a {
|
||||
display: inline-block;
|
||||
border-radius: 2em;
|
||||
margin-left: 1%;
|
||||
color: #009fdf;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.culture-Menu .active {
|
||||
background-color: #002855;
|
||||
border: 2px solid #002855;
|
||||
color: #fff;
|
||||
}
|
||||
@media screen and (min-width: 480px) {
|
||||
.culture-Menu a {
|
||||
padding: 0.5% 2%;
|
||||
margin-right: 1%;
|
||||
border: 2px solid #009fdf;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 479px) {
|
||||
.culture-Menu a {
|
||||
padding: 0.5% 1.5%;
|
||||
margin-right: 0.5%;
|
||||
border: 1px solid #009fdf;
|
||||
}
|
||||
}
|
||||
|
||||
/*愿景与使命*/
|
||||
.culture_vision {
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
}
|
||||
.culture_vision .title {
|
||||
font-size: 2.25em;
|
||||
font-weight: 600;
|
||||
color: #101010;
|
||||
text-align: center;
|
||||
padding-top: 4%;
|
||||
padding-bottom: 2%;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.culture_vision .left {
|
||||
width: 46.7%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.culture_vision .center {
|
||||
width: 6.6%;
|
||||
}
|
||||
.culture_vision .right {
|
||||
width: 46.7%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.culture_vision .subtitle {
|
||||
font-size: 1.5em;
|
||||
color: #101010;
|
||||
line-height: 1.8em;
|
||||
margin-bottom: 2.8%;
|
||||
}
|
||||
.culture_vision .left p {
|
||||
display: inline-block;
|
||||
width: 90%;
|
||||
margin-left: 10%;
|
||||
text-align: left;
|
||||
}
|
||||
.culture_vision .right p {
|
||||
display: inline-block;
|
||||
width: 90%;
|
||||
margin-right: 10%;
|
||||
text-align: left;
|
||||
}
|
||||
.culture_vision .des {
|
||||
font-size: 1em;
|
||||
color: #737373;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.culture_vision .swt-Table {
|
||||
margin-bottom: 4%;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.culture_vision .left,
|
||||
.culture_vision .right {
|
||||
width: 100%;
|
||||
}
|
||||
.culture_vision p {
|
||||
width: 90%;
|
||||
margin-left: 5%;
|
||||
margin-right: 5%;
|
||||
}
|
||||
.culture_vision .subtitle {
|
||||
margin-top: 5%;
|
||||
}
|
||||
.culture_vision_02 {
|
||||
display: none;
|
||||
}
|
||||
.culture_vision_view {
|
||||
display: block;
|
||||
}
|
||||
.culture_vision .left p {
|
||||
margin-left: 5%;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 769px) {
|
||||
.culture_vision_02 {
|
||||
display: block;
|
||||
}
|
||||
.culture_vision_view {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
/*文化与价值观*/
|
||||
.culture_new_banner {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
color: #fff;
|
||||
bottom: 32vw;
|
||||
text-align: center;
|
||||
}
|
||||
.culture_new_banner .title {
|
||||
font-size: 3em;
|
||||
line-height: 2.6em;
|
||||
}
|
||||
.culture_new_banner .des {
|
||||
font-size: 1.125em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
@media screen and (max-width: 1440px) {
|
||||
.culture_new_banner .title {
|
||||
font-size: 2em;
|
||||
line-height: 2em;
|
||||
}
|
||||
.culture_new_banner .des {
|
||||
font-size: 1em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.culture_new_banner .des {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
.culture_new_banner {
|
||||
bottom: 30vw;
|
||||
}
|
||||
.culture_new_banner .title {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
}
|
||||
.culture_new {
|
||||
width: 100%;
|
||||
}
|
||||
.culture_new .title {
|
||||
font-size: 2.25em;
|
||||
color: #333;
|
||||
padding: 4.5% 0 1%;
|
||||
font-weight: 600;
|
||||
line-height: 2em;
|
||||
}
|
||||
.culture_new .des {
|
||||
font-size: 1.125em;
|
||||
color: #737373;
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.culture_new ul {
|
||||
margin-top: 3%;
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
.culture_new li {
|
||||
width: 29.4%;
|
||||
padding: 1.5%;
|
||||
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.1);
|
||||
margin-bottom: 4%;
|
||||
}
|
||||
.culture_new li .list-title {
|
||||
color: #333333;
|
||||
font-size: 1.125em;
|
||||
text-align: center;
|
||||
padding-top: 5%;
|
||||
padding-bottom: 2%;
|
||||
}
|
||||
.culture_new li .list-des {
|
||||
color: #737373;
|
||||
text-align: left;
|
||||
font-size: 0.875em;
|
||||
width: 92%;
|
||||
line-height: 1.8em;
|
||||
margin-bottom: 3%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.culture_new .R-margin {
|
||||
width: 1.4%;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
}
|
||||
.culture_new_gray {
|
||||
width: 100%;
|
||||
background-color: #f5f5f5;
|
||||
padding: 2.8% 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
.culture_new_gray .center_bg {
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
}
|
||||
.culture_new_gray .left {
|
||||
width: 50.3%;
|
||||
float: left;
|
||||
}
|
||||
.culture_new_gray .right {
|
||||
width: 49.7%;
|
||||
float: right;
|
||||
}
|
||||
.culture_new_gray .content {
|
||||
width: 95%;
|
||||
margin: 3% 2% 3% 3%;
|
||||
}
|
||||
.culture_new_gray p {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
}
|
||||
.culture_new_gray p span {
|
||||
border-bottom: 2px solid #333;
|
||||
display: inline-block;
|
||||
}
|
||||
.culture_new_gray .title {
|
||||
font-size: 1.5em;
|
||||
color: #101010;
|
||||
line-height: 2em;
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
.culture_new_gray .subtitle {
|
||||
font-size: 1em;
|
||||
color: #737373;
|
||||
margin-bottom: 2.7%;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
.culture_new_gray .des {
|
||||
font-size: 0.875em;
|
||||
color: 737373;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 540px) {
|
||||
.culture_new .swt-Table {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin-top: 3.4%;
|
||||
margin-bottom: 4.5%;
|
||||
}
|
||||
.culture_new .swt-Table .Table-Row {
|
||||
display: table-row;
|
||||
}
|
||||
.culture_new .swt-Table .Table-Row .Table-Cell {
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
padding-top: 1.3%;
|
||||
padding-bottom: 1.3%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 539px) {
|
||||
.culture_new li {
|
||||
width: 92%;
|
||||
text-align: center;
|
||||
padding-top: 5%;
|
||||
padding-bottom: 5%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.culture_new .title {
|
||||
padding: 3% 0 2% 0;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.culture_new_gray .right {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 2%;
|
||||
}
|
||||
.culture_new_gray .left {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 742px) {
|
||||
.culture_new_gray .right {
|
||||
margin-top: 0;
|
||||
}
|
||||
.culture_new_gray .right img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/*我们会*/
|
||||
@media screen and (min-width: 1440px) {
|
||||
.culture_weweill {
|
||||
width: 1440px;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1339px) {
|
||||
.culture_weweill {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
.c_wewill_p {
|
||||
padding: 3% 0;
|
||||
}
|
||||
.culture_left {
|
||||
width: 31%;
|
||||
float: left;
|
||||
}
|
||||
.culture_left img {
|
||||
width: 100%;
|
||||
}
|
||||
.culture_r {
|
||||
position: relative;
|
||||
width: 65%;
|
||||
float: right;
|
||||
}
|
||||
.cu_img_t {
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
.font_color {
|
||||
color: #0e0e0e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.cul_line {
|
||||
width: 40px;
|
||||
height: 3px;
|
||||
background: #0e0e0e;
|
||||
margin: 2% 0;
|
||||
}
|
||||
.cul_text {
|
||||
color: #868686;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1280px) {
|
||||
.culture_all {
|
||||
padding-top: 6%;
|
||||
position: absolute;
|
||||
}
|
||||
.cul_text {
|
||||
line-height: 2em;
|
||||
}
|
||||
.cul_text_p {
|
||||
padding-top: 3.5%;
|
||||
}
|
||||
.cul_font_01 {
|
||||
font-size: 2em;
|
||||
}
|
||||
.cul_text {
|
||||
font-size: 1.125em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 900px) and (max-width: 1279px) {
|
||||
.culture_all {
|
||||
padding-top: 4%;
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
}
|
||||
.cul_text {
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.cul_text_p {
|
||||
padding-top: 4%;
|
||||
}
|
||||
.cul_font_01 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.cul_text {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 899px) {
|
||||
.culture_all {
|
||||
padding-top: 5%;
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
}
|
||||
.cul_text {
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.cul_text_p {
|
||||
padding-top: 3%;
|
||||
}
|
||||
.cul_font_01 {
|
||||
font-size: 2em;
|
||||
}
|
||||
.cul_text {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.culture_left {
|
||||
width: 99.5%;
|
||||
margin: 0 auto 2%;
|
||||
text-align: center;
|
||||
}
|
||||
.culture_all {
|
||||
}
|
||||
.cul_text {
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.cul_text_p {
|
||||
padding-top: 3%;
|
||||
}
|
||||
.cul_font_01 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.cul_text {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
.culture_r {
|
||||
width: 99.5%;
|
||||
margin: auto;
|
||||
}
|
||||
.cu_img_t {
|
||||
display: none;
|
||||
}
|
||||
.cul_line {
|
||||
margin: 2% 0;
|
||||
}
|
||||
}
|
||||
|
||||
/*新技术专研实力*/
|
||||
.wewill_bg {
|
||||
background: #f1f1f1;
|
||||
}
|
||||
@media screen and (min-width: 1440px) {
|
||||
.weweill_w {
|
||||
width: 1440px;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1399px) {
|
||||
.weweill_w {
|
||||
width: 98%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
.we_tech_img {
|
||||
padding: 3% 0;
|
||||
}
|
||||
.we_white {
|
||||
background: #fff;
|
||||
}
|
||||
.we_title {
|
||||
text-align: center;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
padding-bottom: 3.5%;
|
||||
}
|
||||
@media screen and (min-width: 768px) {
|
||||
.we_tech_img {
|
||||
width: 32.53%;
|
||||
}
|
||||
.we_title,
|
||||
.we_change {
|
||||
font-size: 2em;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 767px) {
|
||||
.we_tech_img {
|
||||
width: 98%;
|
||||
margin: 0 auto 2%;
|
||||
}
|
||||
.we_img_s {
|
||||
text-align: center;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
.we_title,
|
||||
.we_change {
|
||||
font-size: 1.5em;
|
||||
padding: 2% 0 5%;
|
||||
}
|
||||
}
|
||||
|
||||
.we_tech_img:last-child {
|
||||
margin-right: none;
|
||||
}
|
||||
.we_img_s {
|
||||
text-align: center;
|
||||
}
|
||||
.we_img_s img {
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.we_tech_title {
|
||||
font-size: 1.125em;
|
||||
text-align: center;
|
||||
padding: 3% 0;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
.we_tech_text {
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
width: 88%;
|
||||
margin: auto;
|
||||
color: #737373;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
|
||||
.we_tech_height {
|
||||
width: 1%;
|
||||
}
|
||||
.we_change_height {
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.lj-tech-Table {
|
||||
display: table;
|
||||
}
|
||||
.lj-tech-Table .Table-Row {
|
||||
display: table-row;
|
||||
}
|
||||
.lj-tech-Table .Table-Row .Table-Cell {
|
||||
display: table-cell;
|
||||
}
|
||||
}
|
||||
.we_change {
|
||||
text-align: center;
|
||||
color: #101010;
|
||||
font-weight: 600;
|
||||
padding-bottom: 2.5%;
|
||||
}
|
||||
.we_change_small {
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
font-size: 1em;
|
||||
color: #737373;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.wewill_change_img {
|
||||
padding: 2% 0 0;
|
||||
}
|
||||
.wewill_change_img li img {
|
||||
width: 100%;
|
||||
}
|
||||
.wewill_change_img li {
|
||||
margin-right: 4%;
|
||||
text-align: center;
|
||||
}
|
||||
.wewill_change_img li h4 {
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.wewill_change_img li h4 {
|
||||
font-size: 1.125em;
|
||||
padding: 6% 0 0;
|
||||
}
|
||||
.we_change_small {
|
||||
width: 60%;
|
||||
}
|
||||
.wewill_change_img li {
|
||||
width: 30.33%;
|
||||
float: left;
|
||||
}
|
||||
.wewill_change_img li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 767px) {
|
||||
.wewill_change_img li h4 {
|
||||
font-size: 1.2em;
|
||||
padding: 6% 0;
|
||||
}
|
||||
.we_change_small {
|
||||
width: 90%;
|
||||
}
|
||||
.wewill_change_img li {
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.wewill_blame {
|
||||
padding-bottom: 3%;
|
||||
}
|
||||
.we_blame_text {
|
||||
font-size: 0.9em;
|
||||
text-align: left;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
/*我们是*/
|
||||
.weare_bg {
|
||||
background: #fff;
|
||||
}
|
||||
@media screen and (min-width: 1100px) {
|
||||
.weare_idea {
|
||||
width: 50%;
|
||||
padding: 2% 4%;
|
||||
float: left;
|
||||
}
|
||||
.weare_img_r {
|
||||
width: 38%;
|
||||
float: right;
|
||||
}
|
||||
.weare_text {
|
||||
font-size: 1em;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
}
|
||||
.weare_c_all {
|
||||
line-height: 0.1em;
|
||||
padding: 3% 4.5% 5%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.weare_c_b {
|
||||
color: #101010;
|
||||
font-size: 2em;
|
||||
font-weight: 600;
|
||||
}
|
||||
.weare_c_a {
|
||||
color: #737373;
|
||||
font-size: 2em;
|
||||
}
|
||||
.weare_p {
|
||||
margin: 0 2%;
|
||||
}
|
||||
|
||||
.weare_text p {
|
||||
padding: 1% 0;
|
||||
}
|
||||
@media (min-width: 900px) and (max-width: 1099px) {
|
||||
.weare_idea {
|
||||
width: 46%;
|
||||
padding: 2%;
|
||||
float: left;
|
||||
}
|
||||
.weare_idea h5 img {
|
||||
max-width: 70%;
|
||||
}
|
||||
.weare_img_r {
|
||||
width: 50%;
|
||||
float: right;
|
||||
}
|
||||
.weare_text {
|
||||
font-size: 1em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 899px) {
|
||||
.weare_idea {
|
||||
width: 46%;
|
||||
padding: 2%;
|
||||
float: left;
|
||||
}
|
||||
.weare_idea h5 img {
|
||||
max-width: 60%;
|
||||
}
|
||||
.weare_img_r {
|
||||
width: 50%;
|
||||
float: right;
|
||||
}
|
||||
.weare_img_r img {
|
||||
width: 100%;
|
||||
}
|
||||
.weare_text {
|
||||
font-size: 0.8em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.weare_idea {
|
||||
width: 96%;
|
||||
padding: 3% 2%;
|
||||
margin: auto;
|
||||
}
|
||||
.weare_idea h5 img {
|
||||
max-width: 50%;
|
||||
}
|
||||
.weare_img_r {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
.weare_img_r img {
|
||||
width: 100%;
|
||||
margin-bottom: 5%;
|
||||
}
|
||||
.weare_text {
|
||||
font-size: 1em;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
}
|
||||
|
||||
.weare_h {
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
.weare_text {
|
||||
text-indent: 2em;
|
||||
}
|
||||
.weare_office {
|
||||
font-size: 1.5em;
|
||||
text-align: center;
|
||||
padding-bottom: 2%;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.weare_office_img {
|
||||
padding: 2% 0 0;
|
||||
}
|
||||
.weare_office_img li h4 {
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.weare_office_img li h4 {
|
||||
font-size: 1.1em;
|
||||
padding: 6% 0 0;
|
||||
}
|
||||
.weare_office_img li {
|
||||
margin-right: 1.5%;
|
||||
text-align: center;
|
||||
}
|
||||
.we_change_small {
|
||||
width: 60%;
|
||||
}
|
||||
.weare_office_img li {
|
||||
width: 32.33%;
|
||||
float: left;
|
||||
}
|
||||
.weare_office_img li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.weare_office_img li img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 767px) {
|
||||
.weare_office_img li h4 {
|
||||
font-size: 1.2em;
|
||||
padding: 6% 0;
|
||||
}
|
||||
.we_change_small {
|
||||
width: 96%;
|
||||
}
|
||||
.weare_office_img li {
|
||||
margin: 2% auto;
|
||||
width: 96%;
|
||||
}
|
||||
.weare_office_img li img {
|
||||
margin-bottom: 2%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.weare_p {
|
||||
padding-top: 3%;
|
||||
}
|
||||
.weare_icon_title {
|
||||
font-size: 1.5em;
|
||||
text-align: center;
|
||||
padding: 5% 0;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
177
public/frontend/web/css/subject/culture111.css
Executable file
177
public/frontend/web/css/subject/culture111.css
Executable file
@@ -0,0 +1,177 @@
|
||||
.culture-Menu{background-color:#f1f1f1; overflow: hidden;}
|
||||
.culture{background-color:#e8eef0; overflow: hidden}
|
||||
.culture .title{color:#002855; font-weight: 600; padding:5% 0 3%;}
|
||||
.culture .punctuation{color:#ff9800; margin-left:8px; font-size: 1.25em;}
|
||||
@media screen and (min-width:1440px){
|
||||
.culture-Menu img{margin:auto;}
|
||||
.culture .Container{width:1440px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1339px){
|
||||
.culture-Menu img{margin:auto; width:27%;}
|
||||
.culture .Container{width:96%; margin:auto;}
|
||||
}
|
||||
.culture .des{width:90%; margin: 0 auto 2%; color:#002855; line-height: 2em}
|
||||
.culture .line{width:4.25%; height: 5px; background-color:#002855; overflow: hidden; margin:0 auto 2%;}
|
||||
.culture-l{width:12%; float: left; text-align: right; padding-right:2%; line-height: 2em; padding-top:2em; font-family: "SourceHanSans-Light"; font-weight: bold;color:#002855;}
|
||||
.culture-l span{display: block; position: absolute; width: 10px; height: 10px; border-radius: 5px; background-color: #002855;right: -5px; top: 2.5em;}
|
||||
.culture-r{border-left:1px solid #b0bbc7; width:72%; float: left; padding-left:7%; line-height: 2em; padding-top:2em; font-family: "SourceHanSans-Light"}
|
||||
.culture-Menu .Menu{margin-bottom:3%; overflow: hidden}
|
||||
.culture-Menu a{display:inline-block;border-radius:2em; margin-left:1%; color: #009fdf; text-decoration: none; cursor: pointer;}
|
||||
.culture-Menu .active{background-color:#002855; border:2px solid #002855; color:#FFF;}
|
||||
@media screen and (min-width:480px){
|
||||
.culture-Menu a{ padding:0.5% 2%; margin-right:1%; border:2px solid #009fdf;}
|
||||
}
|
||||
@media screen and (max-width:479px){
|
||||
.culture-Menu a{ padding:0.5% 1.5%; margin-right:0.5%; border:1px solid #009fdf;}
|
||||
}
|
||||
|
||||
|
||||
/*文化与价值观*/
|
||||
.culture_new{width:100%; }
|
||||
.culture_new .title{font-size: 2.25em; color:#101010; padding:4% 0 1%; font-weight: 600; line-height: 1.8em;}
|
||||
.culture_new .des{font-size: 1.125em; color:#737373; width:70%; margin:auto; line-height: 2em; }
|
||||
.culture_new ul{margin-top:3%; margin-bottom: 3%; }
|
||||
.culture_new li{width:29.4%; padding:1.5%; box-shadow: 5px 5px 15px rgba(0,0,0,0.1);margin-bottom: 4%;}
|
||||
.culture_new li .list-title{color: #333333; font-size: 1.125em; text-align: center; padding-top:5%; padding-bottom: 2%;}
|
||||
.culture_new li .list-des{color: #737373; text-align: center; font-size: 0.875em; width:96%; line-height: 1.8em; margin-bottom: 3%; nargub-left:auto; margin-right: auto;}
|
||||
.culture_new .R-margin{width:1.4%; box-shadow: none; padding:0;}
|
||||
.culture_new_gray{width:100%; background-color:#f5f5f5; padding:2.8% 0; overflow: hidden;}
|
||||
.culture_new_gray .center_bg{background-color:#FFF; overflow: hidden;}
|
||||
.culture_new_gray .left{width:50.3%; float: left;}
|
||||
.culture_new_gray .right{width:49.7%; float: right;}
|
||||
.culture_new_gray .content{width:95%; margin:3% 2% 3% 3%;}
|
||||
.culture_new_gray p{display: inline-block; width:100%; margin:auto; }
|
||||
.culture_new_gray p span{border-bottom:2px solid #101010; display: inline-block;}
|
||||
.culture_new_gray .title{font-size: 1.375em; color:#101010; line-height: 2em; margin-bottom: 2%;}
|
||||
.culture_new_gray .subtitle{font-size: 1em; color:#737373; margin-bottom: 2%; line-height: 1.8em;}
|
||||
.culture_new_gray .des{font-size: 0.875em; color:737373; line-height: 1.8em;}
|
||||
|
||||
@media screen and (min-width:540px){
|
||||
.culture_new .swt-Table{display: table; width:100%; margin-top:4%; margin-bottom: 4.5%;}
|
||||
.culture_new .swt-Table .Table-Row{display: table-row;}
|
||||
.culture_new .swt-Table .Table-Row .Table-Cell{display: table-cell; text-align: center; padding-top:1.3%; padding-bottom: 1.3%;}
|
||||
}
|
||||
@media screen and (max-width:539px){
|
||||
.culture_new li{width:92%; text-align: center; padding-top:5%; padding-bottom: 5%; margin-left:auto; margin-right: auto;}
|
||||
.culture_new .title{padding:3% 0 2% 0;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.culture_new_gray .right{width:100%; text-align: center; margin-top:2%;}
|
||||
.culture_new_gray .left{width:96%; margin:auto;}
|
||||
|
||||
}
|
||||
@media screen and (max-width:742px){
|
||||
.culture_new_gray .right{margin-top:0;}
|
||||
.culture_new_gray .right img{width:100%;}
|
||||
}
|
||||
/*我们会*/
|
||||
@media screen and (min-width:1516px){
|
||||
.culture_weweill {width:1516px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1515px){
|
||||
.culture_weweill {width:96%; margin:auto;}
|
||||
}
|
||||
.c_wewill_p {padding: 3% 0;}
|
||||
.culture_left {width:31%; float: left;}
|
||||
.culture_left img {width:100%;}
|
||||
.culture_r {position: relative;width:65%; float: right;}
|
||||
.cu_img_t {text-align:right; position: absolute;right: 0;top:0;}
|
||||
.font_color {color:#0e0e0e;}
|
||||
.cul_line {width:40px; height: 3px; background: #0e0e0e; margin: 2% 0;}
|
||||
.cul_text {color: #868686; width:90%;}
|
||||
|
||||
|
||||
@media screen and (min-width:1280px){
|
||||
.culture_all {padding-top:6%;position: absolute;}
|
||||
.cul_text {line-height:2em;}
|
||||
.cul_text_p {padding-top:7%;}
|
||||
.cul_font_01 { font-size: 2.25em;}
|
||||
.cul_text {font-size: 1.1em;}
|
||||
}
|
||||
|
||||
@media (min-width:900px) and (max-width:1279px){
|
||||
.culture_all {padding-top:4%;position: absolute; left:2%;}
|
||||
.cul_text {line-height:1.5em;}
|
||||
.cul_text_p {padding-top:4%;}
|
||||
.cul_font_01 { font-size: 1.5em;}
|
||||
.cul_text {font-size: 1.1em;}
|
||||
}
|
||||
|
||||
@media (min-width:768px) and (max-width:899px){
|
||||
.culture_all {padding-top:5%;position: absolute; left:2%;}
|
||||
.cul_text {line-height:1.5em;}
|
||||
.cul_text_p {padding-top:3%;}
|
||||
.cul_font_01 { font-size: 1.5em;}
|
||||
.cul_text {font-size: 0.9em;}
|
||||
}
|
||||
|
||||
@media (max-width:767px){
|
||||
.culture_left {width:99.5%; margin:0 auto 2%; text-align: center;}
|
||||
.culture_all {}
|
||||
.cul_text {line-height:1.8em;}
|
||||
.cul_text_p {padding-top:3%;}
|
||||
.cul_font_01 { font-size: 1.2em;}
|
||||
.cul_text {font-size: 0.9em;}
|
||||
.culture_r { width:99.5%; margin: auto;}
|
||||
.cu_img_t {display: none;}
|
||||
.cul_line{margin: 1% 0;}
|
||||
}
|
||||
|
||||
/*新技术专研实力*/
|
||||
.wewill_bg {background: #f1f1f1;}
|
||||
@media screen and (min-width:1440px){
|
||||
.weweill_w {width:1440px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1399px){
|
||||
.weweill_w {width:98%; margin:auto;}
|
||||
}
|
||||
.we_tech_img {padding: 3% 0; }
|
||||
.we_white {background: #fff;}
|
||||
.we_title { text-align: center; color: #101010; font-weight: 600; padding-bottom: 5%;}
|
||||
@media screen and (min-width:768px){
|
||||
.we_tech_img {width:32.53%; }
|
||||
.we_title,.we_change {font-size:2.25em;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.we_tech_img {width:98%; margin:0 auto 2%;}
|
||||
.we_img_s { text-align: center; width:90%; margin:auto; }
|
||||
.we_title,.we_change {font-size:1.5em; padding: 2% 0 5%;}
|
||||
}
|
||||
|
||||
.we_tech_img:last-child{margin-right: none;}
|
||||
.we_img_s { text-align: center; }
|
||||
.we_img_s img {max-width:100%; text-align: center;}
|
||||
.we_tech_title{ font-size: 1.125em; text-align: center; padding: 3% 0 2%; font-weight: 600;color: #333;}
|
||||
.we_tech_text {font-size: 0.9em; text-align: center; width:88%; margin: auto;}
|
||||
|
||||
.we_tech_height {width:1%;}
|
||||
.we_change_height {width:15%;}
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.lj-tech-Table{display: table;}
|
||||
.lj-tech-Table .Table-Row{display: table-row;}
|
||||
.lj-tech-Table .Table-Row .Table-Cell{display: table-cell;}
|
||||
}
|
||||
.we_change { text-align: center; color: #101010; font-weight: 600; padding-bottom: 2%;}
|
||||
.we_change_small { margin: auto; text-align: center; font-size: 1.1em;color: #737373; line-height: 1.8em;}
|
||||
.wewill_change_img { padding: 2% 0 0;}
|
||||
.wewill_change_img li img {width:100%;}
|
||||
.wewill_change_img li{ margin-right:4%;text-align: center;}
|
||||
.wewill_change_img li h4 { text-align: center;color: #333; }
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.wewill_change_img li h4{font-size:1.1em;padding: 6% 0 0;}
|
||||
.we_change_small {width:60%;}
|
||||
.wewill_change_img li{width:30.33%; float: left; }
|
||||
.wewill_change_img li:last-child {margin-right: 0;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.wewill_change_img li h4{font-size:1.2em;padding: 6% 0;}
|
||||
.we_change_small {width:90%;}
|
||||
.wewill_change_img li{width:90%; margin: auto; text-align: center;}
|
||||
|
||||
}
|
||||
|
||||
.wewill_blame {padding-bottom: 3%;}
|
||||
.we_blame_text {font-size: 0.9em; text-align: center; width:80%; margin: auto;}
|
||||
|
||||
140
public/frontend/web/css/subject/culture原.css
Executable file
140
public/frontend/web/css/subject/culture原.css
Executable file
@@ -0,0 +1,140 @@
|
||||
.culture-Menu{background-color:#f1f1f1; overflow: hidden;}
|
||||
.culture{background-color:#e8eef0; overflow: hidden}
|
||||
.culture .title{color:#002855; font-weight: 600; padding:5% 0 3%;}
|
||||
.culture .punctuation{color:#ff9800; margin-left:8px; font-size: 1.25em;}
|
||||
@media screen and (min-width:1440px){
|
||||
.culture-Menu img{margin:auto;}
|
||||
.culture .Container{width:1440px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1339px){
|
||||
.culture-Menu img{margin:auto; width:27%;}
|
||||
.culture .Container{width:96%; margin:auto;}
|
||||
}
|
||||
.culture .des{width:90%; margin: 0 auto 2%; color:#002855; line-height: 2em}
|
||||
.culture .line{width:4.25%; height: 5px; background-color:#002855; overflow: hidden; margin:0 auto 2%;}
|
||||
.culture-l{width:12%; float: left; text-align: right; padding-right:2%; line-height: 2em; padding-top:2em; font-family: "SourceHanSans-Light"; font-weight: bold;color:#002855;}
|
||||
.culture-l span{display: block; position: absolute; width: 10px; height: 10px; border-radius: 5px; background-color: #002855;right: -5px; top: 2.5em;}
|
||||
.culture-r{border-left:1px solid #b0bbc7; width:72%; float: left; padding-left:7%; line-height: 2em; padding-top:2em; font-family: "SourceHanSans-Light"}
|
||||
.culture-Menu .Menu{margin-bottom:3%; overflow: hidden}
|
||||
.culture-Menu a{display:inline-block;border-radius:2em; margin-left:1%; color: #009fdf; text-decoration: none; cursor: pointer;}
|
||||
.culture-Menu .active{background-color:#002855; border:2px solid #002855; color:#FFF;}
|
||||
@media screen and (min-width:480px){
|
||||
.culture-Menu a{ padding:0.5% 2%; margin-right:1%; border:2px solid #009fdf;}
|
||||
}
|
||||
@media screen and (max-width:479px){
|
||||
.culture-Menu a{ padding:0.5% 1.5%; margin-right:0.5%; border:1px solid #009fdf;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*我们会*/
|
||||
@media screen and (min-width:1516px){
|
||||
.culture_weweill {width:1516px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1515px){
|
||||
.culture_weweill {width:96%; margin:auto;}
|
||||
}
|
||||
.c_wewill_p {padding: 3% 0;}
|
||||
.culture_left {width:31%; float: left;}
|
||||
.culture_left img {width:100%;}
|
||||
.culture_r {position: relative;width:65%; float: right;}
|
||||
.cu_img_t {text-align:right; position: absolute;right: 0;top:0;}
|
||||
.font_color {color:#0e0e0e;}
|
||||
.cul_line {width:40px; height: 3px; background: #0e0e0e; margin: 2% 0;}
|
||||
.cul_text {color: #868686; width:90%;}
|
||||
|
||||
|
||||
@media screen and (min-width:1280px){
|
||||
.culture_all {padding-top:6%;position: absolute;}
|
||||
.cul_text {line-height:2em;}
|
||||
.cul_text_p {padding-top:7%;}
|
||||
.cul_font_01 { font-size: 2.25em;}
|
||||
.cul_text {font-size: 1.1em;}
|
||||
}
|
||||
|
||||
@media (min-width:900px) and (max-width:1279px){
|
||||
.culture_all {padding-top:4%;position: absolute; left:2%;}
|
||||
.cul_text {line-height:1.5em;}
|
||||
.cul_text_p {padding-top:4%;}
|
||||
.cul_font_01 { font-size: 1.5em;}
|
||||
.cul_text {font-size: 1.1em;}
|
||||
}
|
||||
|
||||
@media (min-width:768px) and (max-width:899px){
|
||||
.culture_all {padding-top:5%;position: absolute; left:2%;}
|
||||
.cul_text {line-height:1.5em;}
|
||||
.cul_text_p {padding-top:3%;}
|
||||
.cul_font_01 { font-size: 1.5em;}
|
||||
.cul_text {font-size: 0.9em;}
|
||||
}
|
||||
|
||||
@media (max-width:767px){
|
||||
.culture_left {width:99.5%; margin:0 auto 2%; text-align: center;}
|
||||
.culture_all {}
|
||||
.cul_text {line-height:1.8em;}
|
||||
.cul_text_p {padding-top:3%;}
|
||||
.cul_font_01 { font-size: 1.2em;}
|
||||
.cul_text {font-size: 0.9em;}
|
||||
.culture_r { width:99.5%; margin: auto;}
|
||||
.cu_img_t {display: none;}
|
||||
.cul_line{margin: 1% 0;}
|
||||
}
|
||||
|
||||
/*新技术专研实力*/
|
||||
.wewill_bg {background: #f1f1f1;}
|
||||
@media screen and (min-width:1440px){
|
||||
.weweill_w {width:1440px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1399px){
|
||||
.weweill_w {width:98%; margin:auto;}
|
||||
}
|
||||
.we_tech_img {padding: 3% 0; }
|
||||
.we_white {background: #fff;}
|
||||
.we_title { text-align: center; color: #101010; font-weight: 600; padding-bottom: 5%;}
|
||||
@media screen and (min-width:768px){
|
||||
.we_tech_img {width:32.53%; }
|
||||
.we_title,.we_change {font-size:2.25em;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.we_tech_img {width:98%; margin:0 auto 2%;}
|
||||
.we_img_s { text-align: center; width:90%; margin:auto; }
|
||||
.we_title,.we_change {font-size:1.5em; padding: 2% 0 5%;}
|
||||
}
|
||||
|
||||
.we_tech_img:last-child{margin-right: none;}
|
||||
.we_img_s { text-align: center; }
|
||||
.we_img_s img {max-width:100%; text-align: center;}
|
||||
.we_tech_title{ font-size: 1.125em; text-align: center; padding: 3% 0 2%; font-weight: 600;color: #333;}
|
||||
.we_tech_text {font-size: 0.9em; text-align: center; width:88%; margin: auto;}
|
||||
|
||||
.we_tech_height {width:1%;}
|
||||
.we_change_height {width:15%;}
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.lj-tech-Table{display: table;}
|
||||
.lj-tech-Table .Table-Row{display: table-row;}
|
||||
.lj-tech-Table .Table-Row .Table-Cell{display: table-cell;}
|
||||
}
|
||||
.we_change { text-align: center; color: #101010; font-weight: 600; padding-bottom: 2%;}
|
||||
.we_change_small { margin: auto; text-align: center; font-size: 1.1em;color: #737373; line-height: 1.8em;}
|
||||
.wewill_change_img { padding: 2% 0 0;}
|
||||
.wewill_change_img li img {width:100%;}
|
||||
.wewill_change_img li{ margin-right:4%;text-align: center;}
|
||||
.wewill_change_img li h4 { text-align: center;color: #333; }
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.wewill_change_img li h4{font-size:1.1em;padding: 6% 0 0;}
|
||||
.we_change_small {width:60%;}
|
||||
.wewill_change_img li{width:30.33%; float: left; }
|
||||
.wewill_change_img li:last-child {margin-right: 0;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.wewill_change_img li h4{font-size:1.2em;padding: 6% 0;}
|
||||
.we_change_small {width:90%;}
|
||||
.wewill_change_img li{width:90%; margin: auto; text-align: center;}
|
||||
|
||||
}
|
||||
|
||||
.wewill_blame {padding-bottom: 3%;}
|
||||
.we_blame_text {font-size: 0.9em; text-align: center; width:80%; margin: auto;}
|
||||
|
||||
23
public/frontend/web/css/subject/decennial.css
Executable file
23
public/frontend/web/css/subject/decennial.css
Executable file
@@ -0,0 +1,23 @@
|
||||
.ten_title{font-size: 3.125em; padding-top:4.8vw; padding-bottom: 3.5vw;}
|
||||
.ten_subtitle{font-size: 2.375em; padding-bottom: 1.2vw;}
|
||||
.ten_des{width:54%; margin:auto; font-size: 1.125em; line-height: 1.5em;}
|
||||
@media screen and (max-width:1440px){
|
||||
.ten_title{font-size: 2.5em; line-height: 1.25em;}
|
||||
.ten_subtitle{font-size:1.875em; line-height: 1em;}
|
||||
.ten_des{width:64%;}
|
||||
}
|
||||
@media screen and (max-width:1080px){
|
||||
.ten_des{width:84%;}
|
||||
}
|
||||
.ten_02_bg{overflow: hidden; background:#f7fbfe url("../../images/decennial/ten_02_bg.jpg") 100% 100% no-repeat;}
|
||||
.ten_02{width:100%; }
|
||||
|
||||
.ten_three{padding-top:3.5vw; padding-bottom: 3vw; width:100%; background:url("../../images/decennial/ten03_bg.jpg") 100% 100% no-repeat;}
|
||||
.ten_four{width:98%; left:1%; right:1%; top:1.8vw; overflow: hidden;}
|
||||
.ten_four li{width:14.2857142857143%; float:left; font-size: 1.25em;}
|
||||
.ten_six{width:100%; margin-top:1.5vw;}
|
||||
.ten_six li{width:32.84%; margin-right: 0.74%; float: left;}
|
||||
.ten_six li:last-child{margin-right: 0;}
|
||||
.ten_four_line{widht:100%; background-color:#e5e5e5; height: 1px; margin-top:1vw; }
|
||||
|
||||
.ten_video{width:42%; margin:1.5vw auto 0; max-width:799px;}
|
||||
237
public/frontend/web/css/subject/distributor.css
Executable file
237
public/frontend/web/css/subject/distributor.css
Executable file
@@ -0,0 +1,237 @@
|
||||
.distributor_bg_black{background-color:#1e1e1e; overflow: hidden; width:100%; padding-top:6vw; padding-bottom: 6vw;}
|
||||
.distributor_bg_gray{background-color:#f1f1f1; overflow: hidden; width:100%; padding-top:4vw; padding-bottom: 4.2vw;}
|
||||
.distributor_bg_white{background-color:#FFFFFF; overflow: hidden; width:100%; padding-top:0vw; padding-bottom: 0vw;}
|
||||
.distributor_bg_black02{background-color:#1e1e1e; overflow: hidden; width:100%; padding-top:3.2vw; padding-bottom: 2.5vw;}
|
||||
.distributor_title{font-size: 2.25em; font-weight: 600; line-height: 2em;}
|
||||
@media screen and (max-width:768px){
|
||||
.distributor_title{font-size: 1.8em;}
|
||||
}
|
||||
.distributor_subtitle{font-size: 1.5em;}
|
||||
.distributor_des{font-size: 1.125em; }
|
||||
.distributor_text_white{color:#ffffff;}
|
||||
.distributor_text_black{color:#333;}
|
||||
.distributor_text_gray{color:#737373;}
|
||||
|
||||
/*第二屏*/
|
||||
.distributor_two {background-color:#009fdf; overflow: hidden; padding-top:5vw; padding-bottom: 5vw;}
|
||||
.distributor_two .title{font-size: 1.5em;}
|
||||
.distributor_two .des{font-size: 1.125em; margin-top:2vw; line-height: 1.5em;}
|
||||
.distributor_two .left{width:12.3%; float: left; margin-left:16%; margin-right: 8%}
|
||||
.distributor_two .right{width:58%; float: left;}
|
||||
.distributor_two span{border-bottom: 4px solid #fefeff; padding-bottom:0.8vw; }
|
||||
@media screen and (min-width:641px){
|
||||
.distributor_two .swt-Table{width:86%; margin:auto; display: table; }
|
||||
.distributor_two .Table-Row{display: table-row;}
|
||||
.distributor_two .swt-Table-border-b{border-top: 1px solid #fefeff; }
|
||||
.distributor_two .swt-Table-border-r{border-right:1px solid #fefeff;}
|
||||
.distributor_two .swt-Table .Table-Row .Table-Cell{display: table-cell; width:49%; color:#fefeff; vertical-align: top;}
|
||||
}
|
||||
.distributor_two .m-top{margin-top:6%;}
|
||||
.distributor_two .m-bottom{margin-bottom:6%;}
|
||||
@media screen and (max-width:1480px){
|
||||
.distributor_two .swt-Table{width:90%; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1366px){
|
||||
.distributor_two .left{margin-left:12%; margin-right: 6%}
|
||||
.distributor_two .right{width:64%;}
|
||||
}
|
||||
@media screen and (max-width:1240px){
|
||||
.distributor_two .left{margin-left:8%; margin-right: 4%}
|
||||
.distributor_two .right{width:70%;}
|
||||
}
|
||||
@media screen and (max-width:1079px){
|
||||
.distributor_two .swt-Table{width:96%; margin:auto;}
|
||||
.distributor_two .left{margin-left:4%; margin-right: 2%}
|
||||
.distributor_two .right{width:80%;}
|
||||
}
|
||||
@media screen and (max-width:840px){
|
||||
.distributor_two .title{font-size: 1.2em;}
|
||||
.distributor_two .des{font-size: 1em;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.distributor_two .swt-Table{width:100%; overflow: hidden;}
|
||||
.distributor_two .swt-Table .Table-Cell{width:100%; overflow: hidden;}
|
||||
.distributor_two .swt-Table{color:#FFF;}
|
||||
.distributor_two .left{width:5%;margin-left:4%; margin-right: 2%}
|
||||
.distributor_two .right{width:80%;}
|
||||
.distributor_two .m-top{margin-top:0; margin-bottom: 6%;}
|
||||
.distributor_two {padding-bottom: 0;}
|
||||
}
|
||||
/*售后*/
|
||||
.distributor_faq, .distributor_odm{background-color: #1e1e1e; overflow: hidden;}
|
||||
.distributor_faq .one{position: absolute; bottom:0; width:100%}
|
||||
.distributor_faq .one .bg_black{background-color:#1e1e1e; overflow: hidden; }
|
||||
.distributor_faq .one .content{margin:5% 7% 2.5%; position: relative;}
|
||||
.distributor_faq .one .content .line{width:73%; height: 1px; background-color:rgba(255,255,255,0.24); position: absolute; top:0px; right:0px; margin-top:4px;}
|
||||
.distributor_faq .one .margin-t{margin-top:1vw;}
|
||||
.distributor_faq .one .contents{background-color:#1e1e1e; overflow: hidden;}
|
||||
.distributor_faq .one li{width:36%; float: left; padding:4% 7%;}
|
||||
@media screen and (max-width:640px){
|
||||
.distributor_faq .one{position: relative; top:0; width:100%;}
|
||||
.distributor_faq .one .content .line{display: none;}
|
||||
.distributor_faq .one li{width:92%; float: left; padding:4% 6%;}
|
||||
}
|
||||
/*odm定制流程*/
|
||||
.distributor_odm{padding-top:5%; padding-bottom: 3%;}
|
||||
.distributor_odm .line{width:100%; height: 1px; background-color:rgba(255,255,255,0.24); position: relative; }
|
||||
.distributor_odm .title{top:50%; margin-top:-1em; line-height: 2em; height: 2em; display: inline-block; padding-left:3%; padding-right: 3%; background-color:#1e1e1e;}
|
||||
|
||||
.distributor_odm .content { width:88%; margin: 2% auto 0; padding: 3% 0 2%; overflow: hidden;}
|
||||
.distributor_odm .content li {float: left; width:13.3%;}
|
||||
.distributor_odm .content li:nth-child(2n){width:14.6%; text-align: center; }
|
||||
.distributor_odm p{margin-bottom: 0.7vw;}
|
||||
.distributor_odm .contents{width:100%;}
|
||||
.distributor_odm .contents li{width:16%; margin-left:3%; margin-right: 6%; float: left; text-align: center; line-height: 1.8em;}
|
||||
@media screen and (max-width:768px){
|
||||
.distributor_odm .contents li{width:20%; margin-left:1%; margin-right: 4%;}
|
||||
.distributor_odm .line{background-color:transparent;}
|
||||
.distributor_odm{border-top:1px solid rgba(255,255,255,0.1);}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.distributor_odm .content{display: none;}
|
||||
.distributor_odm .title{position: relative; background-color:transparent; overflow: hidden;}
|
||||
.distributor_odm .contents {margin-top:5%;}
|
||||
.distributor_odm .contents {width:90%; margin:5% auto;}
|
||||
.distributor_odm .contents li{width:90%; text-align: left; margin:auto; overflow: hidden;}
|
||||
.distributor_odm p{display: inline-block;}
|
||||
.distributor_odm{padding-top:10%; padding-bottom: 3%;}
|
||||
}
|
||||
/*合作客户*/
|
||||
.distributor_Cooperation{background-color:#fafafa; overflow: hidden; width:100%; padding-top:3%; padding-bottom: 3.5%;}
|
||||
.distributor_Cooperation li {width:24.1%; float: left; margin-bottom: 1%; margin-right: 1.2%; }
|
||||
.distributor_Cooperation li img{box-shadow: 0px 1px 5px rgba(0,0,0,0.1); max-width:100%;}
|
||||
.distributor_Cooperation li:nth-child(4n){margin-right: 0;}
|
||||
@media screen and (max-width:640px){
|
||||
.distributor_Cooperation li {width:49%; float: left; margin-bottom: 1%; margin-right: 2%; }
|
||||
.distributor_Cooperation li:nth-child(2n){margin-right: 0;}
|
||||
}
|
||||
.distributor_Cooperation ul{margin-top:2.5%;}
|
||||
/*八大生产线*/
|
||||
.distributor_Beltline{background-color:#f1f1f1; overflow: hidden; width:100%; padding-top:3%; padding-bottom: 1%;}
|
||||
.distributor_Beltline li{width:32%; margin-right:1.5%; float: left; margin-bottom: 1.5%;}
|
||||
@media screen and (min-width:768px){
|
||||
.distributor_Beltline li:nth-child(3n){margin-right: 0;}
|
||||
}
|
||||
.distributor_Beltline img{box-shadow: 5px 5px 10px rgba(0,0,0,0.2); margin-bottom: 5%;}
|
||||
@media screen and (max-width:1480px){
|
||||
.distributor_Beltline img{width:100%;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.distributor_Beltline li{width:49%; margin-right: 2%;}
|
||||
.distributor_Beltline li:nth-child(2n){margin-right: 0;}
|
||||
}
|
||||
.distributor_Beltline p{text-align: center; margin-top:2%;}
|
||||
.distributor_Beltline li p:last-child{margin-bottom:5%;}
|
||||
.distributor_Beltline ul{margin-top:3%;}
|
||||
/*大数据时代*/
|
||||
.distributor_Big_Data{background-color:#f1f1f1; overflow: hidden; width:100%; }
|
||||
.distributor_Big_Data .content{margin-top:3%; margin-bottom: 4%;}
|
||||
.distributor_Big_Data .swt-Table {margin-top:1%;}
|
||||
.distributor_Big_Data .swt-Table .left{width:49.5%;}
|
||||
.distributor_Big_Data .swt-Table .center{width:1%;}
|
||||
.distributor_Big_Data .bg_black{background-color:#1e1e1e; overflow: hidden; color:#FFF; padding:4% 4% 2% 7%; }
|
||||
.distributor_Big_Data p{margin-bottom: 2.3%;}
|
||||
@media screen and (max-width:768px){
|
||||
.distributor_Big_Data .swt-Table .left{width:98%; margin-left:auto; margin-right: auto; }
|
||||
.distributor_Big_Data .swt-Table .center{display: none;}
|
||||
.distributor_Big_Data .swt-Table {margin-top:0;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.distributor_Big_Data .swt-Table .left{width:100%;}
|
||||
.distributor_Big_Data .swt-Table {margin-top:0;}
|
||||
}
|
||||
.distributor_Big_Data .distributor_des{margin-bottom:3%;}
|
||||
/*大记事*/
|
||||
.distributor_Chronicle{width:100%; background-color: #222222; overflow: hidden; padding-top:3%; padding-bottom: 4%;}
|
||||
.distributor_Chronicle .Chronicle{margin-top:3%;}
|
||||
.distributor_Chronicle .Chronicle-l{width:12%; float: left; text-align: center; padding-right:2%; line-height: 3em; height: 3em; font-weight: bold;color:#FFFFFF; font-size: 1.5em;}
|
||||
.distributor_Chronicle .Chronicle-l span{display: block; position: absolute; width: 10px; height: 10px; border-radius: 5px; background-color: #FFFFFF;right: -5px; top: 50%; margin-top:-5px;}
|
||||
.distributor_Chronicle .Chronicle-r{border-left:1px solid #484848; width:72%; float: left; padding-left:7%; height: 3em; padding-top:1.2em; color: #FFFFFF; font-size: 1.125em; line-height: 1.8em;}
|
||||
.Chronicle-2015{padding-bottom: 2%;}
|
||||
@media screen and (max-width:1080px){
|
||||
.distributor_Chronicle .Chronicle-r{height: 4em;}
|
||||
.Chronicle-2015{padding-bottom: 4%;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.distributor_Chronicle .Chronicle-r{height: 6em;}
|
||||
.Chronicle-2015{padding-bottom: 6%;}
|
||||
}
|
||||
@media screen and (max-width:383px){
|
||||
.distributor_Chronicle .Chronicle-l{width:16%;}
|
||||
.Chronicle-2015{padding-bottom: 18%;}
|
||||
}
|
||||
/*招商*/
|
||||
.distributor_Attract{width:100%; background-color:#1d1d1d; overflow: hidden; padding-top:3%; padding-bottom: 4%;}
|
||||
|
||||
.distributor_Attract .list{width:100%; margin-top:2.2%; margin-bottom: 0; overflow: hidden;}
|
||||
.distributor_Attract .list li{width:22%; float: left; margin-right:4%; background-color:#FFF; border-radius: 5px; padding-top:4%; padding-bottom: 4%; text-align: center; }
|
||||
.distributor_Attract .list li:last-child{margin:0px;}
|
||||
.distributor_Attract .des_text{color:#1e1e1e; font-size: 1.875em; text-align: center; width:90%; margin:9% auto 0; line-height: 1.3em; height: 3.9em;}
|
||||
@media screen and (max-width:1280px){
|
||||
.distributor_Attract .list img{width:60%; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.distributor_Attract .list li{width:48%; margin-right: 4%; margin-bottom: 4%;}
|
||||
.distributor_Attract .list li:nth-child(2n){margin-right: 0;}
|
||||
}
|
||||
/*投资*/
|
||||
.distributor_Investment{margin-bottom: 1vw;}
|
||||
.distributor_Investment .bg_white, .distributor_Investment .bg_white_01{background-color:#FFF; width:49.5%; padding: 1.8vw 2.7vw 2.4vw; color:#333;}
|
||||
.distributor_Investment .bg_black, .distributor_Investment .bg_black_01{background-color:#1e1e1e; width:49.5%; padding: 1.8vw 2.7vw 2.4vw; color:#FFFFFF;}
|
||||
|
||||
.distributor_Investment .distributor_title{margin-bottom: 2%;}
|
||||
.distributor_Investment .distributor_subtitle{margin-bottom: 2%;}
|
||||
.distributor_Investment .center{width:1%;}
|
||||
|
||||
.distributor_Investment .distributor_subtitle{line-height: 2em;}
|
||||
.distributor_Investment .distributor_des {line-height: 1.5em;}
|
||||
@media screen and (min-width:768px){
|
||||
.distributor_Investment .Swt-Table{display: table; width:100%; margin-top:1vw;}
|
||||
.distributor_Investment .Swt-Table .Table-Row{display: table-row;}
|
||||
.distributor_Investment .Swt-Table .Table-Row .Table-Cell{display: table-cell; margin:0; }
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.distributor_Investment .bg_white_01{background-color:#1e1e1e; color:#FFFFFF; padding: 4%; }
|
||||
.distributor_Investment .bg_black_01{background-color:#FFF; color:#333; padding: 4%; }
|
||||
.distributor_Investment .bg_white, .distributor_Investment .bg_white_01, .distributor_Investment .bg_black, .distributor_Investment .bg_black_01{width:90%; margin:auto;}
|
||||
}
|
||||
/*加盟*/
|
||||
.distributor_join{overflow: hidden;}
|
||||
.distributor_join ul{width:100%;}
|
||||
.distributor_join li{width:32%; margin-right: 2%; float: left; margin-bottom: 2%; position: relative; margin-top:2%}
|
||||
@media screen and (min-width:768px){
|
||||
.distributor_join li:nth-child(3n){margin-right: 0;}
|
||||
}
|
||||
.distributor_join .left{width:24%; float: left; text-align: center;}
|
||||
.distributor_join .right{width:76%; float: left;}
|
||||
.distributor_join .title{font-size: 1.5em; color:#FFF; font-weight: 100; display: block; margin-top:42%; }
|
||||
.distributor_join .subtitle{font-size: 1.125em; color:rgba(255,255,255,0.6); display: block; margin-top:5%;}
|
||||
@media screen and (max-width:1344px){
|
||||
.distributor_join .title{font-size: 1.2em; line-height:1.8em}
|
||||
|
||||
}
|
||||
@media screen and (max-width:990px){
|
||||
.distributor_join .left{position: absolute; top:0; width:40%; margin-top:-1.9em;}
|
||||
.distributor_join .title{line-height:1.8em}
|
||||
.distributor_join .subtitle{line-height: 1.6em;}
|
||||
.distributor_join .right{width:100%;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.distributor_join li{width:49%; margin-right: 2%;}
|
||||
.distributor_join li:nth-child(2n){margin-right: 0;}
|
||||
}
|
||||
/*联系方式*/
|
||||
.distributor_contact .banner img{width:100%;}
|
||||
|
||||
.distributor_contact ul{width:100%;overflow: hidden;}
|
||||
.distributor_contact .service{width:90%; margin:2% auto 3%; overflow: hidden;}
|
||||
.distributor_contact .title{font-size: 2.25em; font-weight: 600; color:#333; text-align: left; line-height: 2em;}
|
||||
.distributor_contact .subtitle{font-size:1.5em ;color:#333333; line-height: 2em; margin-top:0.3vw; }
|
||||
.distributor_contact .des{font-size:1em; color:#737373; line-height: 1em; margin-top:0.8vw;}
|
||||
.distributor_contact ul li{width:49%; float: left; margin-bottom: 2%; margin-right: 2%;}
|
||||
.distributor_contact ul li:nth-child(2n){margin-right: 0;}
|
||||
.distributor_contact span{display: block; margin-bottom: 0.8vw; line-height: 1.5em}
|
||||
.distributor_contact span:last-child{margin-bottom: 0;}
|
||||
@media screen and (max-width:640px){
|
||||
.distributor_contact ul li{width:100%; clear: both;}
|
||||
}
|
||||
109
public/frontend/web/css/subject/fan.css
Executable file
109
public/frontend/web/css/subject/fan.css
Executable file
@@ -0,0 +1,109 @@
|
||||
.subject_title{line-height:1.2em; }
|
||||
.subject_subtitle{line-height: 1.6em;}
|
||||
.subject_des{line-height: 1.6em;}
|
||||
|
||||
.Fan_03_buy{width:100%; text-align: center;}
|
||||
/*第一屏*/
|
||||
.fan_01{position: absolute; width:100%; color:#000000; top:23%; font-size: 2em}
|
||||
.fan_01 .title{font-size: 2.125em; line-height: 2.2em; width:60%; margin-left:15%;}
|
||||
.fan_01 .text{font-size: 1em; width:60%; margin-left:15%;}
|
||||
@media screen and (max-width:1440px){
|
||||
.fan_01{font-size: 1.5em}
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.fan_01{top:12%;}
|
||||
.fan_01 .title{width:70%; margin-left:0%;}
|
||||
.fan_01 .text{width:70%; margin-left:0%;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.fan_01{font-size: 1em; top:30%; left:5%;}
|
||||
.fan_01 .title{line-height: 1.2em;}
|
||||
}
|
||||
|
||||
/*第二屏*/
|
||||
.Fan_02{color:#333;}
|
||||
|
||||
/*第三屏*/
|
||||
.Fan_03{position: relative; background-color:#f2f2f2; overflow: hidden; padding-bottom: 1vw;}
|
||||
.Fan_03 .all_content{position: absolute; left:0; width:100%; color:#333; top:11vw;}
|
||||
.Fan_03 .all_text{width:40%; margin-left:60%;}
|
||||
.Fan_03 .subject_title{line-height:1.2em; }
|
||||
.Fan_03 .subject_subtitle{margin-top:1vw;}
|
||||
.Fan_03 .subject_des{margin-top:2.5vw;}
|
||||
.Fan_03 .all_product{position: relative; left:0; width:100%; top:-4.5vw;}
|
||||
.Fan_03 li{width:49%; margin-right:2%; float: left; border-top:5px solid #c2d600; position: relative;}
|
||||
.Fan_03 li:last-child{margin-right:0;}
|
||||
.Fan_03 .product{position: absolute; width:50%; left:9%; bottom:36%; color:#333;}
|
||||
.Fan_03 .product .title{font-size: 1.75em; line-height: 1.2em; }
|
||||
.Fan_03 .Fan_buy{margin-top:1.7vw;}
|
||||
|
||||
.Fan_buy .Fan_buy_button{position: relative;}
|
||||
.Fan_buy a{padding-left:5%; padding-right:5%; height: 2em; margin-left:0%; margin-right:4%;display: inline-block; line-height: 2em; color:#333; font-size: 1em; border:1px solid #5c5c5c; }
|
||||
.Fan_buy a:hover{background-color:#c2d600; color:#FFF; border:1px solid #c2d600; }
|
||||
.subject_span{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:1440px){
|
||||
.Fan_03 .all_content{top:8vw;}
|
||||
.Fan_03 .all_text{width:50%; margin-left:50%; }
|
||||
.Fan_03 .product .title{font-size: 2em;}
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.Fan_03 .all_content{top:4vw;}
|
||||
.Fan_03 .all_product{margin-top:4.5vw; margin-bottom:1.5vw; top:0; overflow: hidden;}
|
||||
.Fan_buy a{font-size: 1em;}
|
||||
.Fan_03 .product .title{font-size: 1.875em;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.Fan_03 .all_content{top:15vw;}
|
||||
.Fan_03 .product .title{font-size: 1.5em;}
|
||||
.Fan_03 .subject_des{display: none;}
|
||||
}
|
||||
@media screen and (max-width:720px){
|
||||
.Fan_03 li{width:100%; margin-bottom: 2vw;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.Fan_03 .product .title{font-size: 1.5em;}
|
||||
}
|
||||
/*第四屏*/
|
||||
.Fan_04{position: relative; background-color:#f2f2f2; overflow: hidden;}
|
||||
.Fan_04 .all_content{position: absolute; left:0; width:100%; color:#333; top:9vw;}
|
||||
.Fan_04 .all_text{width:40%;}
|
||||
.Fan_04 .subject_title{line-height:1.2em; }
|
||||
.Fan_04 .subject_subtitle{margin-top:1vw;}
|
||||
.Fan_04 .subject_des{margin-top:2.5vw;}
|
||||
.Fan_04 .all_product{position: relative; left:0; width:100%; top:-4.5vw;}
|
||||
.Fan_04 li{width:24.1%; margin-right:1.2%; float: left; border-top:5px solid #c2d600; position: relative; margin-bottom:1vw; overflow: hidden;}
|
||||
.Fan_04 li:nth-child(4n){margin-right:0;}
|
||||
.Fan_04 .product{position: absolute; width:100%; text-align: center; bottom:2vw; color:#333; }
|
||||
.Fan_04 .title{font-size: 1.25em; line-height: 1.2em; position: absolute; top:2vw; text-align: center; width:96%; left:2%; color:#333}
|
||||
.Fan_04 li .Fan_buy{position: absolute; bottom:-30%; width:100%;}
|
||||
.Fan_04 li:hover .Fan_buy{display: block; background-color:rgba(255,255,255,0.5); overflow: hidden; position: absolute; bottom:0vw; width:100%; height: 20%; transition: 0.5s; z-index: 9999; cursor: pointer; text-align: center; padding-top:10%;}
|
||||
|
||||
@media screen and (max-width:1440px){
|
||||
.Fan_04 .all_content{top:6vw;}
|
||||
.Fan_04 .all_text{width:50%;}
|
||||
.Fan_04 .title{font-size: 1.875em;}
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.Fan_04 .all_content{top:4vw;}
|
||||
.Fan_04 .all_product{margin-top:4.5vw; margin-bottom:4.5vw; top:0; overflow: hidden;}
|
||||
.Fan_04 a{font-size: 1em;}
|
||||
.Fan_04 .title{font-size: 1.5em;}
|
||||
.Fan_04 .all_text{width:60%;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.Fan_04 .all_content{top:15vw;}
|
||||
.Fan_04 .title{font-size: 1.25em;}
|
||||
.Fan_04 .subject_des{display: none;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.Fan_04 li{width:49%; margin-bottom: 2vw; margin-right:2%;}
|
||||
.Fan_04 li:nth-child(2n){margin-right: 0;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:383px){
|
||||
.Fan_04 li{width:100%;}
|
||||
.Fan_04 .title{top:6vw;}
|
||||
.Fan_04 .product{bottom:6vw;}
|
||||
}
|
||||
.subject_travel_text{padding:0 0 5% 0}
|
||||
|
||||
11
public/frontend/web/css/subject/faq.css
Executable file
11
public/frontend/web/css/subject/faq.css
Executable file
@@ -0,0 +1,11 @@
|
||||
.faq{padding:2.3% 0 0;}
|
||||
.faq-all{width:100%; }
|
||||
.faq-all li{float: left; width:49.5%; margin-right: 1%;}
|
||||
@media screen and (max-width:768px){
|
||||
.faq-all{width:96%; margin:auto;}
|
||||
.faq-all li{float: left; width:100%;}
|
||||
}
|
||||
.faq-all li:nth-child(2n){margin-right: 0;}
|
||||
.faq-all-text{padding:5% 0;}
|
||||
.faq-title{font-size: 1.5em; color:#101010; margin-bottom: 2%;}
|
||||
.faq-des{font-size: 1em; color:#737373;line-height: 1.8em;}
|
||||
190
public/frontend/web/css/subject/h_speed.css
Executable file
190
public/frontend/web/css/subject/h_speed.css
Executable file
@@ -0,0 +1,190 @@
|
||||
/*10Gbps高速存储*/
|
||||
/*banner*/
|
||||
.banner_button{position: absolute; bottom:39.6vw; width:100%; text-align: center;}
|
||||
.banner_button span{background-color:#009fe0; padding:0.3vw 1.2vw 0.45vw; font-size: 1.75em;}
|
||||
.banner_button_title{font-size: 4.25em; text-align: center; width:100%; position:absolute; top:9.8vw;}
|
||||
.banner_button_subtitle{font-size: 2.25em; text-align: center; width:100%;position:absolute; top:15vw; }
|
||||
@media screen and (min-width:1024px) and (max-width:1399px){
|
||||
.banner_button span{font-size: 1.5em;}
|
||||
.banner_button_title{font-size: 3.5em; }
|
||||
.banner_button_subtitle{font-size: 1.875em;}
|
||||
}
|
||||
@media screen and (min-width:480px) and (max-width:1023px){
|
||||
.banner_button span{font-size: 1.25em;}
|
||||
.banner_button_title{font-size: 2.5em; }
|
||||
.banner_button_subtitle{font-size: 1.5em;}
|
||||
}
|
||||
@media screen and (max-width:640px){
|
||||
.banner_button span{font-size: 1.125em;}
|
||||
.banner_button_title{font-size: 2em; }
|
||||
.banner_button_subtitle{font-size: 1.25em;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.banner_button span{font-size: 1em;}
|
||||
.banner_button_title{font-size: 1.87em; }
|
||||
.banner_button_subtitle{font-size: 1.125em; top:17vw;}
|
||||
}
|
||||
/*中间内容*/
|
||||
.h_speed a, h_speed a:hover{color:#FFF;}
|
||||
.h_speed_title{font-size: 3.75em; line-height: 1.125em;}
|
||||
.h_speed_subtitle{font-size: 1.875em; margin-top:1.25em; margin-bottom: 1.25em;}
|
||||
.h_speed_des{font-size: 1.125em; line-height: 1.75em;}
|
||||
.h_speed_text span{display: inline-block; background-color:#009fe0; padding:1vw 2vw; font-size: 1.5em; margin-top:2.5vw;}
|
||||
.h_speed_text{width:40%; text-align: center;}
|
||||
.h_speed{width:100vw; height: 24.9vw; overflow: hidden;/*background-size:100% 100%;*/ background-repeat:no-repeat;}
|
||||
.h_speed_text_white{color:#FFF;}
|
||||
.h_speed_text_black{color:#333;}
|
||||
.h_speed_text_gray{color:#666;}
|
||||
.h_speed_02{background-image: url(../../images/h_speed/h_speed_01.jpg);}
|
||||
.h_speed_03{background-image: url(../../images/h_speed/h_speed_02.jpg);}
|
||||
.h_speed_04{background-image: url(../../images/h_speed/h_speed_03.jpg);}
|
||||
.h_speed_05{background-image: url(../../images/h_speed/h_speed_04.jpg);}
|
||||
.h_speed_06{background-image: url(../../images/h_speed/h_speed_05.jpg);}
|
||||
.h_speed_07{background-image: url(../../images/h_speed/h_speed_06.jpg);}
|
||||
.h_speed_08{background-image: url(../../images/h_speed/h_speed_07.jpg);}
|
||||
@media screen and (min-width:1400px){
|
||||
.h_speed{width:100vw; height: 800px; background-position: center;}
|
||||
.h_speed_text{margin:160px 0;}
|
||||
.h_speed_09 .h_speed_text{margin:94px 0}
|
||||
}
|
||||
@media screen and (max-width:1399px){
|
||||
.h_speed{width:100vw; height: 57vw; background-size:137.24% 100%; background-position: center;}
|
||||
.h_speed_text{margin:11vw 0;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width:1280px){
|
||||
.h_speed_title{font-size: 2.255em;}
|
||||
.h_speed_subtitle{font-size: 1.5em;}
|
||||
.h_speed_des{font-size: 1em;}
|
||||
.h_speed_text span{font-size: 1.125em;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.h_speed_text{width:50%; }
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.h_speed_des{display: none;}
|
||||
.h_speed_title{font-size: 1.875em; line-height: 1.125em;}
|
||||
.h_speed_subtitle{font-size: 1.25em; margin-top:1em; margin-bottom: 1em;}
|
||||
.h_speed_text span{font-size: 1em; margin-top:1.5vw;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.h_speed_text{margin:8vw 0;}
|
||||
.h_speed_title{font-size: 1.5em; line-height: 1.125em;}
|
||||
.h_speed_subtitle{font-size: 1.125em; margin-top:0.5em; margin-bottom: 0.5em; line-height: 1.25em;}
|
||||
.h_speed_text span{font-size: 1em; margin-top:1.5vw;}
|
||||
}
|
||||
/*第九屏*/
|
||||
.h_speed_09{background-image: url(../../images/h_speed/h_speed_08.jpg);}
|
||||
.h_speed_09 .h_speed_text{width:100%;}
|
||||
@media screen and (min-width:1000px){
|
||||
.h_speed_09{width:100vw; height: 800px; background-position: center; overflow: hidden;}
|
||||
.h_speed_09 .h_speed_text{margin:94px 0}
|
||||
}
|
||||
@media screen and (max-width:1024px){
|
||||
.h_speed_09{width:100vw; height: 75vw; background-size:178.2% 100%; background-position: center;}
|
||||
.h_speed_09 .h_speed_text{padding:10vw 0; margin:0;}
|
||||
|
||||
}
|
||||
/*第十屏*/
|
||||
.h_speed_10_title{position: absolute; width: 96%; text-align: center; top: 11%; left: 2%; font-size: 1.5em;}
|
||||
.h_speed_10_subtitle{position: absolute; width: 96%; text-align: center; top: 21%; left: 2%; font-size: 1.25em;}
|
||||
@media screen and (max-width:1400px){
|
||||
.h_speed_10_title{top: 8%;}
|
||||
.h_speed_10_subtitle{top: 18%;}
|
||||
.h_speed_10 .title{font-size: 1.25em;}
|
||||
.h_speed_10 .subtitle{font-size: 1.125em;}
|
||||
}
|
||||
@media screen and (max-width:1027px){
|
||||
.h_speed_10 .title{font-size: 1.125em;}
|
||||
.h_speed_10 .subtitle{font-size: 1em;}}
|
||||
|
||||
|
||||
.h_speed_10{background-color:#f6f6f6; overflow: hidden; padding-top:4.5vw;}
|
||||
.h_speed_10 .title{font-size: 1.5em;}
|
||||
.h_speed_10 ul{padding-top:4.5vw;}
|
||||
.h_speed_10_four, .h_speed_10_two{width:100%;}
|
||||
.h_speed_10_four li{width:24.1%; margin-right:1.2%; float: left; position: relative; overflow: hidden;}
|
||||
@media screen and (max-width:990px){
|
||||
.h_speed_10_four li{margin-bottom: 3.5%;}
|
||||
.h_speed_10_four li:nth-child(3), .h_speed_10_four li:nth-child(4){margin-bottom: 0;}
|
||||
}
|
||||
.h_speed_10_four li:hover{box-shadow: 0px 5px 15px rgba(0,0,0,0.2)}
|
||||
.h_speed_10_four .text{position: absolute; width:96%; text-align: center; top:14%; left:2%}
|
||||
@media screen and (min-width:461px){
|
||||
.h_speed_10_four li .transparent_buy{position: absolute; bottom:-30%;}
|
||||
.h_speed_10_four li:hover .transparent_buy{display: none; background-color:rgba(255,255,255,0.5); overflow: hidden; position: absolute; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
|
||||
}
|
||||
.transparent_buy .transparent_buy_button{position: relative; top:50%; margin-top:-1.5em; width:100%; text-align: center;}
|
||||
.transparent_buy a{padding-left:5%; padding-right:5%; height: 2em; margin-left:2%; margin-right:2%; border:1px solid #5c5c5c; display: inline-block; line-height: 2em; color:#333; font-size: 1em; }
|
||||
.transparent_buy a:hover{background-color:#009fe0; color:#FFF; border:1px solid transparent; }
|
||||
.h_speed_10_four li:hover .transparent_buy{display: block;}
|
||||
|
||||
.h_speed_10_two li{width:49.3%; margin-right:1.2%; float: left; position: relative; margin-bottom: 2%}
|
||||
.h_speed_10_two li:last-child{margin-right: 0;}
|
||||
.h_speed_10_two .all_text{position: absolute; top:27%; left:5%; width:50%;}
|
||||
.h_speed_10_two .title, .h_speed_10_one .title{margin-bottom: 5%;}
|
||||
.h_speed_10_two .subtitle, .h_speed_10_one .subtitle{font-size: 1.25em; color:#333333; margin-bottom: 10%;}
|
||||
.h_speed_10_two .transparent_buy a, .h_speed_10_one .transparent_buy a{margin-left:0;}
|
||||
|
||||
.h_speed_10_one{width:100%; position: relative; overflow: hidden; background-color:#FFF; margin-bottom: 2.5%;}
|
||||
.h_speed_10_one .all_text{position: absolute; top:26%; left:10%; width:30%;}
|
||||
@media screen and (min-width:991px){
|
||||
.h_speed_10_four li:nth-child(4n){margin-right:0;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1400px){
|
||||
.h_speed_10_text{font-size: 1.2em}
|
||||
.transparent_buy a{font-size: 1em;}
|
||||
.h_speed_10_two .subtitle, .h_speed_10_one .subtitle{font-size: 1em;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:990px){
|
||||
.h_speed_10_four li{width:32%; margin-right:2%}
|
||||
.h_speed_10_four li:nth-child(3n){margin-right:0px;}
|
||||
.h_speed_10_two li:last-child{margin-right: 0;}
|
||||
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:960px){
|
||||
.h_speed_10_two .subtitle, .h_speed_10_one .subtitle{display: none;}
|
||||
.h_speed_10_two .transparent_buy, .h_speed_10_one .transparent_buy{margin-top:15%;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.h_speed_10_four li{width:46%; margin-left:2%; margin-right:2%;}
|
||||
.h_speed_10_four li:nth-child(2n){margin-right:0}
|
||||
.h_speed_10_two li{width:96%; margin-left:2%; margin-right:2%;}
|
||||
.h_speed_10_one{width:96%; margin-left:auto; margin-right: auto;}
|
||||
.h_speed_10_one .all_text{left:5%; width:50%; top:20%;}
|
||||
.h_speed_10_two .title, .h_speed_10_one .title{margin-bottom: 5%;}
|
||||
.h_speed_10_one .subtitle{margin-bottom: 5%; display: none;}
|
||||
|
||||
.h_speed_10_four li{background-color:#FFF; overflow: visible;}
|
||||
|
||||
}
|
||||
@media screen and (max-width:460px){
|
||||
.transparent_buy a{margin-left:1.5%; margin-right:1.5%; padding-left:3%; padding-right: 3%;}
|
||||
.h_speed_10_four .text{top:8%;}
|
||||
.h_speed_10_one .all_text{top:12%;}
|
||||
.h_speed_10_four li .transparent_buy{bottom: 0; height: 20%; margin-bottom:1em}
|
||||
.h_speed_10_two .subtitle{display: none;}
|
||||
.h_speed_10_four li:hover .transparent_buy{height: 20%; margin-bottom:1em}
|
||||
|
||||
}
|
||||
@media screen and (min-width:461px) and (max-width:768px){
|
||||
.h_speed_10_four li .transparent_buy{overflow: hidden; position: absolute; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
.h_speed_10_four li .transparent_buy{height: 16%;}
|
||||
.h_speed_10_four li:hover .transparent_buy{height: 16%;}
|
||||
.h_speed_10 li:hover .transparent_buy, .h_speed_10 li .transparent_buy{top: 88%; height: 20%; background-color:#FFF;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
815
public/frontend/web/css/subject/headset.css
Executable file
815
public/frontend/web/css/subject/headset.css
Executable file
@@ -0,0 +1,815 @@
|
||||
body {padding: 0; margin: 0;background: #f2f2f2;font-family: "思源黑体 CN Light","微软雅黑" ;}
|
||||
ul {list-style-type: none; padding: 0; margin: 0;}
|
||||
|
||||
|
||||
|
||||
|
||||
/*透明系列*/
|
||||
.lj_trans_series { position: relative;}
|
||||
.lj_trans_series img {display: block; width:100%;}
|
||||
.lj_all_text {position: absolute; color: #fff; top:18%;}
|
||||
.lj_tran_a {line-height: 1.5em; padding-bottom: 5%;}
|
||||
.lj_tran_b {line-height: 1.5em;}
|
||||
.lj_tran_c {line-height: 1.6em;padding-top: 5%;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_all_text { left: 20%; }
|
||||
.lj_tran_a {font-size:3.875em; }
|
||||
.lj_tran_b {font-size: 1.5em;; }
|
||||
.lj_tran_c {font-size: 1.1em; color: #009fdf; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_all_text { left: 14%;}
|
||||
.lj_tran_a {font-size:3.5em; }
|
||||
.lj_tran_b {font-size: 1.5em;}
|
||||
.lj_tran_c {font-size: 1.1em; color: #009fdf; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px) and (max-width:1279px){
|
||||
.lj_all_text { left: 15%; }
|
||||
.lj_tran_a {font-size:2.5em; }
|
||||
.lj_tran_b {font-size: 1.1em; }
|
||||
.lj_tran_c {font-size: 1em; color: #009fdf; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_all_text { left: 15%; top:20%;}
|
||||
.lj_tran_a {font-size:2.5em; }
|
||||
.lj_tran_b {font-size: 1.1em; }
|
||||
.lj_tran_c {display: none;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_all_text { left: 5%; top:24%;}
|
||||
.lj_tran_a {font-size:1.5em; }
|
||||
.lj_tran_b {font-size: 1.1em; }
|
||||
.lj_tran_c {display: none; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_all_text { left: 10%; top:25%;}
|
||||
.lj_tran_a {font-size:1.8em; }
|
||||
.lj_tran_b {font-size: 1em;}
|
||||
.lj_tran_c {display: none; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_all_text { left: 5%; top:20%;}
|
||||
.lj_tran_a {font-size:1.5em; }
|
||||
.lj_tran_b {font-size: 1em;}
|
||||
.lj_tran_c {display: none; }
|
||||
}
|
||||
|
||||
|
||||
.lj_trans_img_all { left: 0; width:100%;}
|
||||
|
||||
|
||||
|
||||
.lj_trans_img01 img {display: block;width:100%;}
|
||||
@media screen and (min-width:1440px){
|
||||
.lj_tran_product,.lj_trans_img,.lj_dis_product,.lj_voice_product,.lj_layout_product,.lj_usb_product,.lj_set_product,.lj_set01_product { width:1440px; margin: auto;}
|
||||
.lj_trans_img img {display: block; width:1440px;}
|
||||
}
|
||||
@media screen and (max-width:1439px){
|
||||
.lj_tran_product,.lj_trans_img,.lj_dis_product,.lj_voice_product,.lj_layout_product,.lj_usb_product,.lj_set_product,.lj_set01_product { width:100%; margin: auto;}
|
||||
.lj_trans_img img {display: block; width:100vw;}
|
||||
}
|
||||
@media screen and (min-width:617px){
|
||||
.lj_trans_img_all{display: block}
|
||||
.lj_trans_img_all_m{display: none}
|
||||
}
|
||||
@media screen and (max-width:616px){
|
||||
.lj_trans_img_all{display: none}
|
||||
.lj_trans_img_all_m{display: block}
|
||||
}
|
||||
.lj_trans_img01:last-child {margin-right: 0;}
|
||||
.lj_trans_title { position: absolute;bottom:10%; text-align: center; width:100%;}
|
||||
@media screen and (min-width:1000px){
|
||||
.trans_font_big {font-size: 1.25em; color: #333; line-height: 1.5em;}
|
||||
.trans_font_small {font-size: 1em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_trans_img01 { width:19.6%; margin-right: 0.5%;position: relative; float: left;top:-70px;}
|
||||
.lj_trans_img_all {position: relative; top:-87px;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.trans_font_big {font-size: 1em; color: #333;line-height: 1.5em;}
|
||||
.trans_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_trans_img01 { width:19.6%; margin-right: 0.5%; margin-top: 1%; position: relative; float: left;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.trans_font_big {font-size: 1em; color: #333; line-height: 1em;}
|
||||
.trans_font_small {font-size: 0.9em; color: #9a9a9a; }
|
||||
}
|
||||
|
||||
/*硬盘数据线*/
|
||||
.lj_disk { position: relative;}
|
||||
.lj_disk img {display: block; width:100%;}
|
||||
.lj_disk_text {position: absolute; color: #333;}
|
||||
.lj_disk_a{line-height: 1.5em; padding-bottom: 5%;}
|
||||
.lj_disk_b{line-height: 1.5em; color: #555;}
|
||||
.lj_disk_c{line-height: 1.6em;padding-top: 5%;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_disk_text {left: 20%; top:12%;}
|
||||
.lj_disk_a {font-size:3.5em; }
|
||||
.lj_disk_b {font-size: 1.5em; }
|
||||
.lj_disk_c {font-size: 1.1em; color: #009fdf; }
|
||||
}
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_disk_text {left: 14%; top:10%;}
|
||||
.lj_disk_a {font-size:3.5em; }
|
||||
.lj_disk_b {font-size: 1.5em; }
|
||||
.lj_disk_c {font-size: 1.1em; color: #009fdf; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px) and (max-width:1279px){
|
||||
.lj_disk_text { left: 15%; top:12%;}
|
||||
.lj_disk_a {font-size:2.5em; }
|
||||
.lj_disk_b {font-size: 1.1em;}
|
||||
.lj_disk_c {font-size: 1em; color: #009fdf; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_disk_text { left: 15%; top:10%;}
|
||||
.lj_disk_a {font-size:2.5em; }
|
||||
.lj_disk_b {font-size: 1.1em; }
|
||||
.lj_disk_c {display: none;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_disk_text { left: 5%; top:10%;}
|
||||
.lj_disk_a {font-size:1.5em; }
|
||||
.lj_disk_b {font-size: 1.1em; color: #555; }
|
||||
.lj_disk_c {display: none; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_disk_text { left: 10%; top:5%;}
|
||||
.lj_disk_a {font-size:1.8em; }
|
||||
.lj_disk_b {font-size: 1em; color: #555; }
|
||||
.lj_disk_c {display: none; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_disk_text { left: 5%; top:4%;}
|
||||
.lj_disk_a {font-size:1.5em; }
|
||||
.lj_disk_b {font-size: 1em; color: #555;}
|
||||
.lj_disk_c {display: none; }
|
||||
}
|
||||
|
||||
/*产品*/
|
||||
.lj_dis_img01 img {display: block; width: 100%;}
|
||||
.lj_dis_img01:last-child {margin-right: 0;}
|
||||
.lj_dis_title { position: absolute;top:10%; text-align: center; width:100%;}
|
||||
.dis_font_small { color: #9a9a9a;}
|
||||
@media screen and (min-width:1000px){
|
||||
.dis_font_big {font-size: 2.25em; color: #333;}
|
||||
.dis_font_small {font-size: 1em; padding: 6% 0; }
|
||||
.lj_dis_img01 { width:23.87%; margin-right: 1.5%;position: relative; float: left; top:-80px;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.dis_font_big {font-size: 1em; color: #333;}
|
||||
.dis_font_small {font-size: 0.9em; }
|
||||
.lj_dis_img01 { width:23.87%; margin-right: 1.5%;position: relative; float: left; top:-80px;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.dis_font_big {font-size:1em; color: #333; line-height: 1em;}
|
||||
.dis_font_small {font-size: 0.8em; }
|
||||
.lj_dis_img01 { width:23.87%; margin-right: 1.5%; }
|
||||
}
|
||||
|
||||
/*耳机音箱专区*/
|
||||
.lj_voice{ position: relative;}
|
||||
.lj_voice img {display: block; width:100%;}
|
||||
.lj_voice_text {position: absolute; color: #fff;}
|
||||
.lj_voice_a {line-height: 1.5em; padding-bottom: 5%;}
|
||||
.lj_voice_b {line-height: 1.5em;padding-top: 5%;color: #b7b7b7;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_voice_text { left: 20%; top:15%;}
|
||||
.lj_voice_a {font-size:3.5em; }
|
||||
.lj_voice_b {font-size: 1.5em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_voice_text { left:14%; top:15%;}
|
||||
.lj_voice_a {font-size:3.5em; }
|
||||
.lj_voice_b {font-size: 1.5em; }
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1279px){
|
||||
.lj_voice_text { left: 15%; top:12%;}
|
||||
.lj_voice_a {font-size:2.5em; }
|
||||
.lj_voice_b {font-size: 1.1em; }
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_voice_text { left: 8%; top:10%;}
|
||||
.lj_voice_a {font-size:2em; }
|
||||
.lj_voice_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_voice_text { left:10%; top:8%;}
|
||||
.lj_voice_a {font-size:1.8em; }
|
||||
.lj_voice_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_voice_text { left: 10%; top:7%;}
|
||||
.lj_voice_a {font-size:1.5em; }
|
||||
.lj_voice_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
/*产品*/
|
||||
.lj_voice_img01 img {display: block; width:100%;}
|
||||
.lj_voice_img01:last-child {margin-right: 0;}
|
||||
.lj_voice_title { position: absolute;top:10%; text-align: center; width:100%; }
|
||||
@media screen and (min-width:1000px){
|
||||
.voice_font_big {font-size: 2.25em; color: #b7b7b7;}
|
||||
.lj_voice_img01 {position: relative;width:32.33%; margin-right: 1.5%; float: left; top:-87px;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.voice_font_big {font-size: 1.1em; color: #b7b7b7;}
|
||||
.lj_voice_img01 {position: relative;width:32.33%; margin-right: 1.5%; float: left; top:-87px;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.voice_font_big {font-size:1em; color: #b7b7b7;}
|
||||
.lj_voice_img01 {width:32.33%; margin-right: 1.5%; float: left;}
|
||||
}
|
||||
|
||||
|
||||
/*收纳专区*/
|
||||
.lj_usb_fan img {display: block;width:100%;}
|
||||
.lj_usb_fan{ position: relative;}
|
||||
.lj_usb_text {position: absolute;color: #333; width:70%; }
|
||||
.lj_usb_a {line-height: 1.2em; padding-bottom: 2%; letter-spacing: 0.1em;}
|
||||
.lj_usb_b {line-height: 1.75em;color: #555;}
|
||||
.lj_usb_b span {padding: 0 2%;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_usb_text { left: 20%; top:12%;}
|
||||
.lj_usb_a {font-size:3.5em; }
|
||||
.lj_usb_b {font-size: 1.5em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_usb_text { left:14%; top:15%;}
|
||||
.lj_usb_a {font-size:3.5em; }
|
||||
.lj_usb_b {font-size: 1.5em; }
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1279px){
|
||||
.lj_usb_text { left: 10%; top:20%;}
|
||||
.lj_usb_a {font-size:2.5em; }
|
||||
.lj_usb_b {font-size: 1.1em; }
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_usb_text { left: 5%; top:25%;}
|
||||
.lj_usb_a {font-size:2em; }
|
||||
.lj_usb_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_usb_text { left: 8%; top:12%;}
|
||||
.lj_usb_a {font-size:1.8em; }
|
||||
.lj_usb_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_usb_text { left: 8%; top:10%;}
|
||||
.lj_usb_a {font-size:1.5em; }
|
||||
.lj_usb_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
/*产品*/
|
||||
.lj_usb_img01 {position: relative;}
|
||||
.lj_usb_img01 img {display: block;width:100%;}
|
||||
.lj_usb_img01:last-child {margin-right: 0;}
|
||||
.lj_usb_title { position: absolute;top:10%; text-align: center; width:100%;}
|
||||
@media screen and (min-width:1200px){
|
||||
.usb_font_big {font-size: 2.25em; color: #333;}
|
||||
.usb_font_small {font-size: 1em; color: #9a9a9a; padding: 3% 0;}
|
||||
.lj_usb_img01 { width:49.25%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
@media screen and (min-width:1000px) and (max-width:1199px){
|
||||
.usb_font_big {font-size:2em; color: #333;}
|
||||
.usb_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_usb_img01 { width:49.25%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.usb_font_big {font-size:1.5em; color: #333;}
|
||||
.usb_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_usb_img01 { width:49.25%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.usb_font_big {font-size:1em; color: #333; line-height: 1em;}
|
||||
.usb_font_small {font-size: 0.8em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_usb_img01 { width:100%; margin-right: 1.5%; }
|
||||
}
|
||||
|
||||
/*排插专区*/
|
||||
.lj_layout { position: relative;}
|
||||
.lj_layout img { display: block;width:100%;}
|
||||
.lj_layout_text {position: absolute; color: #fff;}
|
||||
.lj_layout_a {line-height: 1.2em; padding-bottom: 5%;}
|
||||
.lj_layout_b {line-height: 1.2em; color: #555;}
|
||||
.lj_layout_c {line-height: 1.5em;padding-top: 3.5%;}
|
||||
.lj_layout_c span {padding-left:40px;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_layout_text { left: 20%; top:12%;}
|
||||
.lj_layout_a {font-size:3.5em; }
|
||||
.lj_layout_c {font-size: 1.125em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_layout_text { left: 14%; top:12%;}
|
||||
.lj_layout_a {font-size:3.5em; }
|
||||
.lj_layout_c {font-size: 1.125em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:1279px){
|
||||
.lj_layout_text { left: 10%; top:12%;}
|
||||
.lj_layout_a {font-size:2.5em; }
|
||||
.lj_layout_c {font-size: 1em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_layout_text { left: 5%; top:15%;}
|
||||
.lj_layout_a {font-size:1.5em; }
|
||||
.lj_layout_c {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_layout_text { left: 8%; top:10%;}
|
||||
.lj_layout_a {font-size:1.8em; }
|
||||
.lj_layout_c {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_layout_text { left: 8%; top:8%;}
|
||||
.lj_layout_a {font-size:1.5em;}
|
||||
.lj_layout_c {font-size: 1em; }
|
||||
}
|
||||
|
||||
/*产品*/
|
||||
.lj_layout_img01 {position: relative;}
|
||||
.lj_layout_img01 img {display: block;width:100%;}
|
||||
.lj_layout_img01:last-child {margin-right: 0;}
|
||||
.lj_layout_title { position: absolute;top:10%; text-align: center; width:100%;}
|
||||
@media screen and (min-width:1200px){
|
||||
.layout_font_big {font-size: 2.25em; color: #333;}
|
||||
.layout_font_small {font-size: 1em; color: #9a9a9a; padding: 6% 0;}
|
||||
.lj_layout_img01 { width:23.87%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
@media screen and (min-width:1000px) and (max-width:1199px){
|
||||
.layout_font_big {font-size:2em; color: #333;}
|
||||
.layout_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_layout_img01 { width:23.87%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.layout_font_big {font-size:1.5em; color: #333;}
|
||||
.layout_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_layout_img01 { width:23.87%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.layout_font_big {font-size:1em; color: #333; line-height: 1em;}
|
||||
.layout_font_small {font-size: 0.8em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_layout_img01 { width:23.87%; margin-right: 1.5%; }
|
||||
}
|
||||
|
||||
/*图片01*/
|
||||
.lj_skin_fan{ position: relative; margin-bottom: 40px;}
|
||||
.lj_skin_fan img {display: block; width:100%;}
|
||||
.lj_skin_text {position: absolute;color: #333; width:80%; }
|
||||
.lj_skin_a {line-height: 1.6em; padding-bottom: 1.5%;}
|
||||
.lj_skin_b {line-height: 1.5em; color: #555}
|
||||
.lj_skin_b span {padding: 0 2%;}
|
||||
@media screen and (min-width:1280px){
|
||||
.lj_skin_text { left: 20%; top:22%;}
|
||||
.lj_skin_a {font-size:3.5em; }
|
||||
.lj_skin_b {font-size: 1.5em; }
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1279px){
|
||||
.lj_skin_text { left: 15%; top:30%;}
|
||||
.lj_skin_a {font-size:2.5em; }
|
||||
.lj_skin_b {font-size: 1.1em; }
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_skin_text { left: 5%; top:30%;}
|
||||
.lj_skin_a {font-size:2em; }
|
||||
.lj_skin_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_skin_text { left: 8%; top:25%;}
|
||||
.lj_skin_a {font-size:1.8em; }
|
||||
.lj_skin_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_skin_text { left: 8%; top:25%;}
|
||||
.lj_skin_a {font-size:1.5em; }
|
||||
.lj_skin_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
/*图片02*/
|
||||
.lj_skin02_fan img {display: block;width:100%;}
|
||||
.lj_skin02_fan{ position: relative;}
|
||||
.lj_skin02_text {position: absolute;color: #333; width:70%; }
|
||||
.lj_skin02_a {line-height: 1.5em; padding-bottom: 1.8%; letter-spacing: 0.1em;}
|
||||
.lj_skin02_b {line-height: 1.75em;color: #555;}
|
||||
.lj_skin02_b span {padding: 0 2%;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_skin02_text { left: 20%; top:12%;}
|
||||
.lj_skin02_a {font-size:3.5em; }
|
||||
.lj_skin02_b {font-size: 1.5em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_skin02_text { left:14%; top:15%;}
|
||||
.lj_skin02_a {font-size:3.5em; }
|
||||
.lj_skin02_b {font-size: 1.5em; }
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1279px){
|
||||
.lj_skin02_text { left: 10%; top:20%;}
|
||||
.lj_skin02_a {font-size:2.5em; }
|
||||
.lj_skin02_b {font-size: 1.1em; }
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_skin02_text { left: 5%; top:15%;}
|
||||
.lj_skin02_a {font-size:2em; }
|
||||
.lj_skin02_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_skin02_text { left: 8%; top:8%;}
|
||||
.lj_skin02_a {font-size:1.8em; }
|
||||
.lj_skin02_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_skin02_text { left: 5%; top:5%;}
|
||||
.lj_skin02_a {font-size:1.5em; }
|
||||
.lj_skin02_b {font-size: 1em; }
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*耳机专题*/
|
||||
.lj_headset_banner{ position: relative;}
|
||||
.lj_headset_banner img {display: block; width:100%;}
|
||||
.lj_all_set {position: absolute; color: #fff; top:35%;}
|
||||
.lj_set_a {line-height: 1.5em; padding-bottom: 3.5%;}
|
||||
.lj_set_b {line-height: 1.75em;}
|
||||
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_all_set { left: 17%; }
|
||||
.lj_set_a {font-size:3em; }
|
||||
.lj_set_b {font-size: 2em;; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_all_set { left: 14%;}
|
||||
.lj_set_a {font-size:3em; }
|
||||
.lj_set_b {font-size: 1.5em;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px) and (max-width:1279px){
|
||||
.lj_all_set { left: 15%; }
|
||||
.lj_set_a {font-size:2.5em; }
|
||||
.lj_set_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_all_set { left: 15%; top:20%;}
|
||||
.lj_set_a {font-size:2.5em; }
|
||||
.lj_set_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_all_set { left: 5%; top:24%;}
|
||||
.lj_set_a {font-size:1.5em; }
|
||||
.lj_set_b {font-size: 1.1em; }
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_all_set { left: 10%; top:25%;}
|
||||
.lj_set_a {font-size:1.8em; }
|
||||
.lj_set_b {font-size: 1em;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_all_set { left: 5%; top:20%;}
|
||||
.lj_set_a {font-size:1.5em; }
|
||||
.lj_set_b {font-size: 1em;}
|
||||
}
|
||||
|
||||
|
||||
/*视频*/
|
||||
.lj_headset_video {background: #f2f2f2; padding: 4% 0;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_set_v_all {width:1440px;margin: auto;}
|
||||
}
|
||||
@media screen and (max-width:1399px){
|
||||
.lj_set_v_all {width:96%;margin: auto;}
|
||||
}
|
||||
@media screen and (min-width:1200px){
|
||||
.set_h3 {font-size:3em; color: #333;}
|
||||
.lj_set_v_left {width:30%; float: left; padding: 5% 0;}
|
||||
.set_small { padding: 8.8% 0 13%;}
|
||||
.lj_set_v_right { width:68%; float: right;}
|
||||
}
|
||||
@media screen and (max-width:1199px){
|
||||
.set_h3 {font-size:3em; color: #333;}
|
||||
.lj_set_v_left {width:96%; text-align: center;}
|
||||
.set_small { padding: 3.4% 0 5.4%;}
|
||||
.lj_set_v_right { width:96%; margin: auto; padding: 2% 0;}
|
||||
}
|
||||
|
||||
.set_h3 p {line-height:1.2em;}
|
||||
.set_small {font-size:1.75em; color: #333; }
|
||||
.se_s_a {font-size: 1em; line-height: 1.2em;}
|
||||
|
||||
|
||||
.lj_set_img02{ position: relative;}
|
||||
.lj_set_img02 img {display: block; width:100%;}
|
||||
.lj_set_c { font-size: 1em;}
|
||||
@media screen and (min-width:1000px){
|
||||
.lj_set_text {width:32%;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_set_text {width:40%;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.lj_set_text {width:50%;}
|
||||
}
|
||||
|
||||
|
||||
.lj_set_text {position: absolute; color: #fff; }
|
||||
.lj_set_head {line-height: 1.5em; padding-bottom: 5%;}
|
||||
.lj_set01_b {padding:0 0 8%;}
|
||||
@media screen and (min-width:1400px){
|
||||
.lj_set_text { right: 12%; top:15%;}
|
||||
.lj_set_head {font-size: 4.25em;}
|
||||
.lj_set01_b {font-size:1.75em; line-height: 1.5em;}
|
||||
.lj_set_c { line-height: 1.5em;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width:1280px) and (max-width:1399px){
|
||||
.lj_set_text { right:10%; top:15%;}
|
||||
.lj_set_head {font-size: 4.em;}
|
||||
.lj_set01_b {font-size:1.125em;}
|
||||
.lj_set_c { line-height: 1.5em;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:1279px){
|
||||
.lj_set_text { right: 15%; top:6%;}
|
||||
.lj_set_head {font-size: 3.75em;}
|
||||
.lj_set01_b {font-size:1em;}
|
||||
.lj_set_c { line-height: 1.2em;}
|
||||
}
|
||||
@media screen and (min-width:640px) and (max-width:767px){
|
||||
.lj_set_text { right: 8%; top:10%;}
|
||||
.lj_set_head {font-size: 3em;}
|
||||
.lj_set01_b {font-size:1em;}
|
||||
.lj_set_c { line-height: 1.2em;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:639px){
|
||||
.lj_set_text { right:10%; top:8%;}
|
||||
.lj_set_head {font-size: 2.5em;}
|
||||
.lj_set01_b {font-size:1em;}
|
||||
.lj_set_c { display: none;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_set_text { right: 10%; top:7%;}
|
||||
.lj_set_head {font-size: 2em;}
|
||||
.lj_set01_b {font-size:1em;}
|
||||
.lj_set_c {display: none;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.set_btn_jd {border:1px solid #5c5c5c; padding: 1%; color: #333; text-align: center;}
|
||||
.set_btn_jd:hover { background: #ff6900; padding:1%; border: 1px solid #ff6900;color: #fff; text-align: center;}
|
||||
|
||||
.lj_set_goden { position: relative;}
|
||||
.lj_set_goden img { display: block;width:100%;}
|
||||
.lj_goden_text {position: absolute; }
|
||||
.goden_w {color: #fff;}
|
||||
.voice_font {color: #333;}
|
||||
.voice_gray{clor:#6d6d70;}
|
||||
.lj_goden_a {line-height: 1.5em;}
|
||||
@media screen and (min-width:1600px){
|
||||
.lj_goden_text { left: 12%; top:25%;width:25%;}
|
||||
.lj_goden_a {font-size:3em; }
|
||||
.lj_goden_b {font-size: 1.75em; line-height: 1.5em; padding: 4.5% 0 9.5%; }
|
||||
.lj_goden_c { line-height: 1.8em;font-size: 1.125em;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width:1200px) and (max-width:1599px){
|
||||
.lj_goden_text { left: 6%; top:18%;width:35%;}
|
||||
.lj_goden_a {font-size:3em; }
|
||||
.lj_goden_b {font-size: 1.875em; line-height: 1.5em; padding: 2% 0 7%; }
|
||||
.lj_goden_c { line-height: 1.8em;font-size: 1.125em;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:900px) and (max-width:1199px){
|
||||
.lj_goden_text { left: 6%; top:12%;width:35%;}
|
||||
.lj_goden_a {font-size:3em; }
|
||||
.lj_goden_b {font-size: 1.5em; line-height: 1.5em; padding: 2% 0 7%; }
|
||||
.lj_goden_c { line-height: 1.5em;font-size: 1em;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:899px){
|
||||
.lj_goden_text { left: 6%; top:8%;width:35%;}
|
||||
.lj_goden_a {font-size:2em; }
|
||||
.lj_goden_b {font-size: 1.2em; line-height: 1.5em; padding: 2% 0 7%; }
|
||||
.lj_goden_c { line-height: 1.2em;font-size: 1em;}
|
||||
}
|
||||
@media screen and (max-width:639px){
|
||||
.lj_goden_text { left: 6%; top:10%;width:80%;}
|
||||
.lj_goden_a {font-size:1.5em; }
|
||||
.lj_goden_b {font-size: 1em; line-height: 1.5em; padding: 2% 0 7%; }
|
||||
.lj_goden_c { display: none;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (min-width:768px){
|
||||
.goden_font_big {font-size:1.5em; color: #333;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.goden_font_big {font-size:1em; color: #333; line-height: 1em;}
|
||||
}
|
||||
|
||||
|
||||
.lj_last_text {position: absolute; }
|
||||
@media screen and (min-width:1600px){
|
||||
.lj_last_text { left: 12%; top:17%;width:25%;}
|
||||
.lj_last_a {font-size:3em; }
|
||||
.lj_last_b {font-size: 1.75em; line-height: 1.5em; padding:9% 0; }
|
||||
.lj_last_c { line-height: 1.8em;font-size: 1em;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width:1200px) and (max-width:1599px){
|
||||
.lj_last_text { left: 6%; top:18%;width:35%;}
|
||||
.lj_last_a {font-size:3em; }
|
||||
.lj_last_b {font-size: 1.75em; line-height: 1.5em; padding: 8% 0 7%; }
|
||||
.lj_last_c { line-height: 1.8em;font-size: 1em;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:900px) and (max-width:1199px){
|
||||
.lj_last_text { left: 6%; top:12%;width:38%;}
|
||||
.lj_last_a {font-size:3em; }
|
||||
.lj_last_b {font-size: 1.5em; line-height: 1.5em; padding: 6% 0 5%; }
|
||||
.lj_last_c { line-height: 1.5em;font-size: 1em;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (min-width:640px) and (max-width:899px){
|
||||
.lj_last_text { left: 6%; top:10%;width:45%;}
|
||||
.lj_last_a {font-size:2em; }
|
||||
.lj_last_b {font-size: 1.2em; line-height: 1.5em; padding: 6% 0 5%; }
|
||||
.lj_last_c { line-height: 1.2em;font-size: 1em;}
|
||||
}
|
||||
@media screen and (max-width:639px){
|
||||
.lj_last_text { left: 6%; top:20%;width:50%;}
|
||||
.lj_last_a {font-size:1.5em; }
|
||||
.lj_last_b {font-size: 1em; line-height: 1.5em; padding:6% 0 5%; }
|
||||
.lj_last_c { display: none;}
|
||||
}
|
||||
@media screen and (min-width:1000px){
|
||||
.lj_travel_text {font-size: 3.75em;padding: 5% 0;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_travel_text {font-size: 3em;padding: 7% 0;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:767px){
|
||||
.lj_travel_text {font-size: 2.5em;padding: 10% 0;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.lj_travel_text {font-size: 2em;padding: 10% 0;}
|
||||
}
|
||||
|
||||
.lj_travel_text {background: #f2f2f2;text-align: center; color: #333;}
|
||||
|
||||
/*3*/
|
||||
|
||||
/*耳机产品4*/
|
||||
.lj_set01_img {position: relative;}
|
||||
.lj_set01_img img {display: block;width:100%;}
|
||||
.lj_set01_img:last-child {margin-right: 0;}
|
||||
.lj_set_title { position: absolute;top:10%; text-align: center; width:100%;}
|
||||
@media screen and (min-width:1000px){
|
||||
.lj_set01_img {width:32.33%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.lj_set01_img {position: relative;width:32.33%; margin-right: 1.5%; float: left; top:-87px;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.lj_set01_img {width:32.33%; margin-right: 1.5%; float: left; background: #fff;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*耳机产品4*/
|
||||
.lj_set_img01 {position: relative;}
|
||||
.lj_set_img01 img {display: block;width:100%;}
|
||||
.lj_set_img01:last-child {margin-right: 0;}
|
||||
@media screen and (min-width:1200px){
|
||||
.set_font_big {font-size: 2.2em; color: #333;}
|
||||
.set_font_small {font-size: 1.1em; color: #9a9a9a; padding: 5% 0;}
|
||||
.lj_set_img01 { width:23.87%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
@media screen and (min-width:1000px) and (max-width:1199px){
|
||||
.set_font_big {font-size:2em; color: #333;}
|
||||
.set_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_set_img01 { width:23.87%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.set_font_big {font-size:1.5em; color: #333;}
|
||||
.set_font_small {font-size: 0.9em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_set_img01 { width:23.87%; margin-right: 1.5%;top:-80px; float: left; }
|
||||
}
|
||||
|
||||
@media screen and (max-width:767px){
|
||||
.set_font_big {font-size:1em; color: #333; line-height: 1em;}
|
||||
.set_font_small {font-size: 0.8em; color: #9a9a9a; padding: 2% 0;}
|
||||
.lj_set_img01 { width:23.87%; margin-right: 1.5%; background: #fff;}
|
||||
}
|
||||
/*按扭*/
|
||||
@media screen and (min-width:768px){
|
||||
.lj_set01_img .set_btn_all{position: absolute; bottom:-100%;}
|
||||
.lj_set_img01 .set_btn_all{position: absolute; bottom:-100%;}
|
||||
.lj_set_img01:hover .set_btn_all{display: none; background-color:rgba(255,255,255,0.5); overflow: hidden; position: absolute; bottom:0px; width:100%; height: 10%; padding: 10% 0; transition: 0.5s;}
|
||||
.lj_set01_img:hover .set_btn_all{display: none; background-color:rgba(255,255,255,0.5); overflow: hidden; position: absolute; bottom:0px; width:100%; height: 10%; padding: 10% 0; transition: 0.5s;}
|
||||
.set_btn_all a{ margin: 0 2%;}
|
||||
.transparent_buy_button { margin-top:-1.5em; position: relative; top:50%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:461px) and (max-width:767px){
|
||||
.set_btn_all a{ margin: 0 2%;}
|
||||
.set_btn_all{ width:100%; height: 16%;}
|
||||
.transparent_buy_button { position: absolute; bottom:5%;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:460px){
|
||||
.set_btn_all a{ margin: 0 2%;}
|
||||
.set_btn_all{height: 20%;bottom:10px; position: relative;}
|
||||
.lj_set_img01 .set_btn_all{margin-bottom:1em}
|
||||
.lj_set_img01:hover .set_btn_all{margin-bottom:1em}
|
||||
.lj_set01_img .set_btn_all{margin-bottom:1em}
|
||||
.lj_set01_img:hover .set_btn_all{margin-bottom:1em}
|
||||
.set_btn_jd { display: inline-block; }
|
||||
.transparent_buy_button { margin-top:-3.5em;}
|
||||
|
||||
}
|
||||
|
||||
.headset_text {font-size: 1em; line-height: 1.8em;}
|
||||
|
||||
|
||||
.transparent_buy_button{ width:100%; text-align: center;}
|
||||
.set_btn_all a{ border:1px solid #5c5c5c; display: inline-block; color:#333; font-size: 1em; padding: 1% 4%; }
|
||||
.set_btn_all a:hover{background-color:#ff6900; border:1px solid #ff6900; color:#FFF; padding: 1% 4%; }
|
||||
.lj_set_img01:hover .set_btn_all{display: block;}
|
||||
.lj_set01_img:hover .set_btn_all{display: block;}
|
||||
|
||||
video {width: 100%;height: 100%;}
|
||||
|
||||
45
public/frontend/web/css/subject/honor.css
Executable file
45
public/frontend/web/css/subject/honor.css
Executable file
@@ -0,0 +1,45 @@
|
||||
.honner_title{font-size: 2em; text-align: center; line-height: 2em; font-weight: 600;}
|
||||
.honner_des{font-size: 1.125em; text-align: center; line-height: 1.875em; margin-top:0.8vw;}
|
||||
@media screen and (max-width:960px){
|
||||
.honner_title{font-size: 1.875em;}
|
||||
.honner_des{font-size: 1.125em; width:90%; margin:auto;}
|
||||
}
|
||||
/*第一屏*/
|
||||
.honner_01{background-image:url(../../images/honor/honner_bg_01.jpg); background-position:center; padding-top:8.8vw; padding-bottom: 8.8vw;}
|
||||
.honner_01 .swt-Container{background-color:rgba(4,149,208,0.83); overflow: hidden;}
|
||||
.honner_01_all{color:#FFF; padding:6% 11% 7%; width:78%;}
|
||||
.honner_01_text{width:94%; padding-left: 6%;}
|
||||
.honner_01 p{font-size: 1.125em; line-height: 2em;}
|
||||
.honner_01_list{width:100%; margin-top:2.8%; overflow: hidden;}
|
||||
.honner_01_list li{width:33.3%; text-align: center; float: left;}
|
||||
.honner_01_list .big_text{font-size: 2.25em; line-height: 2em;}
|
||||
.honner_01_list .small_text{font-size: 1.125em; line-height: 1.5em;}
|
||||
@media screen and (max-width:960px){
|
||||
.honner_01_all{color:#FFF; padding:4% 5% 5%; width:90%;}
|
||||
.honner_01_list .big_text{font-size: 1.875em; line-height: 2em;}
|
||||
.honner_01_list{margin-top:1%;}
|
||||
.honner_01 p{font-size: 1.125em;}
|
||||
.honner_01_list .small_text{font-size: 1.125em;}
|
||||
}
|
||||
@media screen and (max-width:480px){
|
||||
.honner_01_list li{width:100%; margin-top:1%; margin-bottom: 1%; overflow: hidden;}
|
||||
}
|
||||
/*第二、三、四屏*/
|
||||
.honner_02{background-image:url(../../images/honor/honner_bg_02.jpg); background-position:center; padding-top:2.5vw; color:#FFF;}
|
||||
|
||||
.honner_03{background-image:url(../../images/honor/honner_bg_03.jpg); background-position:center; padding-top:2.5vw; }
|
||||
.honner_04{background-image:url(../../images/honor/honner_bg_04.jpg); background-position:center; padding-top:2.5vw; color:#FFF;}
|
||||
|
||||
@media screen and (min-width:1480px){
|
||||
.honner_02 img, .honner_03 img, .honner_04 img, .honner_05 img{width:1440px;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.honner_02 img, .honner_03 img, .honner_04 img, .honner_05 img{width:96vw;}
|
||||
}
|
||||
.honner_03 .honner_title, .honner_05 .honner_title{color:#333;}
|
||||
.honner_03 .honner_des, .honner_05 .honner_des{color:#737373}
|
||||
.honner_02 .swt-Container{margin-top:0.8vw;}
|
||||
.honner_03 .swt-Container{margin-top:0.6vw;}
|
||||
/*第五屏*/
|
||||
.honner_05{background-color:#f1f1f1; overflow: hidden; padding-top:2.5vw; padding-bottom: 0vw;}
|
||||
|
||||
106
public/frontend/web/css/subject/industry.css
Executable file
106
public/frontend/web/css/subject/industry.css
Executable file
@@ -0,0 +1,106 @@
|
||||
.Industry_title{font-size:2em; line-height: 2em; font-weight: 600;}
|
||||
.Industry_subtitle{font-size: 1.5em; line-height: 1.875em;}
|
||||
.Industry_des{font-size:1.125em; line-height: 1.875em;}
|
||||
.Industry_Gray_bg{background-color:#f5f5f5; overflow: hidden;}
|
||||
.Industry_white_bg{background-color:#FFF; overflow: hidden;}
|
||||
/*Banner*/
|
||||
.Industry_Banner{position: relative;height: 600px; background-image: url(../../images/industry/industry_Banner.jpg);}
|
||||
.Industry_Banner img{height:600px;}
|
||||
.Industry_Banner .all{position: absolute; left:0; top:0; width:100%;}
|
||||
.Industry_Banner .all_text{margin-top:10vw; margin-bottom: 8vw; overflow:hidden; color:#FFF; width:46%;}
|
||||
.Industry_Banner .title{font-size: 3em; line-height: 2em;}
|
||||
.Industry_Banner .des{font-size: 1.125em; margin-top:1%; line-height: 1.875em;}
|
||||
@media screen and (max-width:1479px){
|
||||
.Industry_Banner .all_text{width:80%; margin-left:auto; margin-right: auto; margin-top:15%;}
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.Industry_Banner .all{height: 200px; top:50%; margin-top:-100px;}
|
||||
.Industry_Banner .all_text{width:90%; margin:auto; }
|
||||
.Industry_Banner .title, .Industry_Banner .des{text-align: center;}
|
||||
}
|
||||
@media screen and (max-width:540px){
|
||||
.Industry_Banner .all{height: 300px; top:50%; margin-top:-150px;}
|
||||
.Industry_Banner .title{line-height: 1.2em; margin-bottom: 5%;}
|
||||
}
|
||||
/*第一屏*/
|
||||
.Industry_02{padding-top:2vw; padding-bottom: 2vw;}
|
||||
.Industry_02 .left, .Industry_02 .right{float: left;}
|
||||
.Industry_02 .right img{width:15.63vw;}
|
||||
.Industry_02 .des{line-height: 1.875em;}
|
||||
@media screen and (min-width:1480px){
|
||||
.Industry_02 .left{width:977px; margin-right:54px;}
|
||||
.Industry_02 .right{width:300px;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.Industry_02 .left{width:68%; margin-right:5%;}
|
||||
.Industry_02 .left img{width:100%;}
|
||||
.Industry_02 .right{width:22%;}
|
||||
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.Industry_02 .left{margin-right:3%;}
|
||||
.Industry_02 .right{width:27%;}
|
||||
}
|
||||
.Industry_02 .Industry_title{color:#333;}
|
||||
@media screen and (max-width:900px){
|
||||
.Industry_02 .left, .Industry_02 .left img{width:100%;}
|
||||
.Industry_02 .right{width:90%; padding:1% 5% 3%;}
|
||||
.Industry_02 .img-responsive{display: none;}
|
||||
}
|
||||
/*第三屏*/
|
||||
.Industry_03{padding-top:3vw; padding-bottom: 4.2vw;}
|
||||
.Industry_03 li{float: left; position: relative; width:49%;}
|
||||
.Industry_03 li:last-child{float: right;}
|
||||
.Industry_03 .text{color:#FFF; position: absolute; left:9%; width:42%; top:10%; font-size: 1.125em; line-height: 2em;}
|
||||
.Industry_03 .Industry_title{color:#333; text-align: center; margin-bottom: 2.2vw;}
|
||||
@media screen and (max-width:768px){
|
||||
.Industry_03 li{width:100%; margin-bottom: 2vw;}
|
||||
.Industry_03 li:last-child{margin-bottom: 0;}
|
||||
}
|
||||
/*第四屏*/
|
||||
.Industry_04{background-image: url(../../images/industry/industry_04.jpg); padding-top:3.9vw; padding-bottom: 3.9vw;}
|
||||
.Industry_bg{background: #049bd8; overflow: hidden; color:#FFF; padding:4.5% 6.5%;}
|
||||
.Industry_04 .left{width:47%; float: left;}
|
||||
.Industry_04 .Industry_title{width:100%; margin-top:3%;}
|
||||
.Industry_04 img{width:50.95%; margin-top:1.5%; margin-bottom: 1%;}
|
||||
.Industry_04 .right{width:53%; float: left;}
|
||||
.Industry_04 .Industry_des{width:100%; margin:auto;}
|
||||
.Industry_04 .Industry_des p{margin-top:1.5vw; font-size: 1em;}
|
||||
@media screen and (max-width:1080px){
|
||||
.Industry_04 .left{width:60%;}
|
||||
.Industry_04 .right{width:40%;}
|
||||
.Industry_04 .Industry_des{width:96%;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.Industry_04 .left{width:100%;}
|
||||
.Industry_04 .right{width:100%; margin-bottom: 3%;}
|
||||
.Industry_04 img{display: none;}
|
||||
.Industry_04 .Industry_title{margin-top:0%;}
|
||||
.Industry_04 .Industry_des p{margin-top:4%;}
|
||||
|
||||
}
|
||||
/*第五屏*/
|
||||
.Industry_05 {padding-top:3vw; padding-bottom: 3vw;}
|
||||
.Industry_05 .Industry_title{color:#333; text-align: center; margin-bottom: 2vw;}
|
||||
.Industry_05 .Industry_subtitle{color:#333333;}
|
||||
.Industry_05 .Industry_des{color:#737373; font-size: 1em;}
|
||||
.Industry_05 ul{width:100%;}
|
||||
.Industry_05 li{width:24%; margin-right:1%; background-color:#FFF; overflow: hidden;}
|
||||
.Industry_05 li:nth-child(2n){width:1%; background-color:#f5f5f5;}
|
||||
.Industry_05 .all_text{width:80%; margin:10% auto; position: relative; top:0px;}
|
||||
.Industry_05 .Industry_subtitle{margin-bottom:0.2vw;}
|
||||
.Industry_05 .img-responsive {position: relative; bottom:0px;}
|
||||
@media screen and (max-width:1480px){
|
||||
.Industry_05 .all_text{height: 150px;}
|
||||
}
|
||||
@media screen and (max-width:1079px){
|
||||
.Industry_05 .all_text{height: 200px; line-height: 1.5em;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.Industry_05 li{width:47%; margin-right: 1.5%; margin-left:1.5%; float: left;}
|
||||
.Industry_05 li:nth-child(2n){display: none;}
|
||||
.Industry_05 .all_text{height: 150px;}
|
||||
}
|
||||
@media screen and (max-width:360px){
|
||||
.Industry_05 .all_text{height: 160px;}
|
||||
}
|
||||
369
public/frontend/web/css/subject/job.css
Executable file
369
public/frontend/web/css/subject/job.css
Executable file
@@ -0,0 +1,369 @@
|
||||
.job-title {
|
||||
font-size: 2em;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
padding: 2.6% 0 1.7%;
|
||||
}
|
||||
.job-des {
|
||||
color: #666;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
font-size: 1em;
|
||||
line-height: 1.875em;
|
||||
margin-bottom: 1.8%;
|
||||
width: 80%;
|
||||
}
|
||||
.job-thead {
|
||||
background-color: #252525;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
line-height: 3.3em;
|
||||
font-size: 1em;
|
||||
}
|
||||
.job-line {
|
||||
border-top: 1px solid #cecece;
|
||||
border-bottom: 1px solid #cecece;
|
||||
margin-top: 5px;
|
||||
text-align: center;
|
||||
padding-top: 5%;
|
||||
height: 3.3em;
|
||||
font-size: 0.875em;
|
||||
vertical-align: middle;
|
||||
overflow: hidden;
|
||||
color: #444444;
|
||||
border-spacing: 5px;
|
||||
line-height: 2em;
|
||||
}
|
||||
.job-line-L {
|
||||
border-left: 1px solid #cecece;
|
||||
}
|
||||
.job-line-R {
|
||||
border-right: 1px solid #cecece;
|
||||
}
|
||||
.job-Margin {
|
||||
height: 7px;
|
||||
width: 100%;
|
||||
}
|
||||
/*加入我们*/
|
||||
.join_img_l {
|
||||
padding-top: 4%;
|
||||
}
|
||||
.join_img_l img {
|
||||
max-width: 100vw;
|
||||
}
|
||||
.join_staff_t {
|
||||
text-align: center;
|
||||
padding: 2% 0;
|
||||
font-size: 1.125em;
|
||||
color: #737373;
|
||||
line-height: 2em;
|
||||
}
|
||||
.bx-wrapper .bx-controls-direction a {
|
||||
width: 66px;
|
||||
height: 66px;
|
||||
}
|
||||
.bx-wrapper .bx-prev {
|
||||
left: 10px;
|
||||
background: url(../../images/job/join_us_controls_l.png) no-repeat;
|
||||
}
|
||||
.bx-wrapper .bx-next {
|
||||
right: 10px;
|
||||
background: url(../../images/job/join_us_controls_r.png) no-repeat;
|
||||
}
|
||||
@media screen and (min-width: 1440px) {
|
||||
.bx-wrapper .bx-controls-direction a {
|
||||
width: 66px;
|
||||
height: 66px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1439px) {
|
||||
.bx-wrapper .bx-prev {
|
||||
display: none;
|
||||
}
|
||||
.bx-wrapper .bx-next {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
/*你将获得*/
|
||||
.join_icon li {
|
||||
font-size: 1em;
|
||||
float: left;
|
||||
line-height: 3.5em;
|
||||
}
|
||||
.join_icon {
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
padding: 2.2% 0 0 0;
|
||||
}
|
||||
@media screen and (min-width: 1080px) {
|
||||
.join_w_icon {
|
||||
width: 1080px;
|
||||
margin: auto;
|
||||
}
|
||||
.join_icon li {
|
||||
width: 20%;
|
||||
}
|
||||
.join_icon li:nth-child(1),
|
||||
.join_icon li:nth-child(4) {
|
||||
padding-left: 10%;
|
||||
}
|
||||
.join_icon li:nth-child(5),
|
||||
.join_icon li:nth-child(6),
|
||||
.join_icon li:nth-child(7),
|
||||
.join_icon li:nth-child(8),
|
||||
.join_icon li:nth-child(9) {
|
||||
width: 20%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 1079px) {
|
||||
.join_w_icon {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
.join_icon li {
|
||||
width: 32.3%;
|
||||
padding: 1% 0;
|
||||
}
|
||||
.join_icon li img {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 479px) {
|
||||
.join_icon li {
|
||||
float: left;
|
||||
line-height: 2em;
|
||||
height: 150px;
|
||||
padding: 3% 0;
|
||||
font-size: 1em;
|
||||
}
|
||||
.join_icon li p {
|
||||
width: 70%;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
/*video*/
|
||||
.join_t_big {
|
||||
margin: 1.7% 0 0;
|
||||
}
|
||||
/*联系方式*/
|
||||
.job-Contact {
|
||||
width: 96%;
|
||||
margin: 3% auto;
|
||||
overflow: hidden;
|
||||
color: #444;
|
||||
font-size: 1em;
|
||||
}
|
||||
.job-Contact-title {
|
||||
margin: 3% 0;
|
||||
}
|
||||
.job-Contact .job-title {
|
||||
margin-top: 10%;
|
||||
}
|
||||
.job-Contact li {
|
||||
width: 24.6%;
|
||||
float: left;
|
||||
margin-right: 5%;
|
||||
}
|
||||
.job-Contact li:nth-child(2) {
|
||||
width: 21%;
|
||||
}
|
||||
.job-Contact li:last-child {
|
||||
width: 44%;
|
||||
margin-right: 0px;
|
||||
}
|
||||
.job_office_i img {
|
||||
max-width: 100%;
|
||||
}
|
||||
@media screen and (min-width: 1000px) {
|
||||
.job-Contact li p {
|
||||
padding: 15px 0;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 999px) {
|
||||
.job_office_i {
|
||||
display: none;
|
||||
}
|
||||
.job-Contact li p {
|
||||
padding: 10px 0;
|
||||
}
|
||||
}
|
||||
.job-Table a,
|
||||
.job-Contact li a {
|
||||
color: #009fdf;
|
||||
line-height: 1.75em;
|
||||
text-decoration: none;
|
||||
}
|
||||
@media screen and (min-width: 980px) and (max-width: 1439px) {
|
||||
.job-Contact li {
|
||||
width: 100%;
|
||||
margin-right: 3.5%;
|
||||
text-align: center;
|
||||
}
|
||||
.job-Contact li:nth-child(2) {
|
||||
width: 33%;
|
||||
text-align: left;
|
||||
float: left;
|
||||
}
|
||||
.job-Contact li:last-child {
|
||||
width: 63%;
|
||||
margin-right: 0px;
|
||||
text-align: left;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 979px) {
|
||||
.job-Contact {
|
||||
width: 90%;
|
||||
margin: 6% auto;
|
||||
}
|
||||
.job-Contact li {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.job-Contact li:nth-child(2) {
|
||||
text-align: left;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.job-Contact li:last-child {
|
||||
text-align: left;
|
||||
}
|
||||
.job-des {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
/*I WANT YOU*/
|
||||
.job-Table {
|
||||
display: table;
|
||||
width: 100%;
|
||||
margin-top: 3%;
|
||||
margin-bottom: 3%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.job-Table .Table-Row {
|
||||
display: table-row;
|
||||
}
|
||||
.job-Table .Table-Row .Table-Cell {
|
||||
display: table-cell;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.job-Table .Table-Row li:nth-child(5) {
|
||||
display: none;
|
||||
}
|
||||
.job-title {
|
||||
margin-bottom: 1.4%;
|
||||
margin-top: 1%;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.job-Join .job-title-01 {
|
||||
margin-top: 4%;
|
||||
margin-bottom: 3.5%;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.job-Contact-title {
|
||||
margin: 4% 0 3.5%;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.job-Table a,
|
||||
.job-Contact li a {
|
||||
line-height: 1.5em;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 640px) {
|
||||
.job-Table .Table-Row li:nth-child(1) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
.job-Table .Table-Row li:nth-child(6) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/*简历详情弹出*/
|
||||
.reveal-modal-bg {
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: #000;
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
z-index: 10000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
display: none;
|
||||
}
|
||||
.reveal-modal {
|
||||
top: 8%;
|
||||
left: 12.5%;
|
||||
width: 58%;
|
||||
padding: 5% 7%;
|
||||
background: #f5f5f5;
|
||||
position: absolute;
|
||||
z-index: 10001;
|
||||
display: block;
|
||||
}
|
||||
.reveal-modal .close-reveal-modal {
|
||||
font-size: 2.3em;
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 11px;
|
||||
color: #aaa;
|
||||
text-shadow: 0 -1px 1px rbga(0, 0, 0, 0.6);
|
||||
cursor: pointer;
|
||||
}
|
||||
.job-title-ly {
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding-bottom: 1%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.job-title-h1 {
|
||||
float: left;
|
||||
font-size: 1.625em;
|
||||
color: #333;
|
||||
}
|
||||
.job-r-text {
|
||||
float: right;
|
||||
width: 35%;
|
||||
}
|
||||
.job-blue {
|
||||
color: #009fdf;
|
||||
font-size: 1.375em;
|
||||
padding-right: 8%;
|
||||
font-weight: 100;
|
||||
}
|
||||
.job-imess {
|
||||
overflow: hidden;
|
||||
padding: 3% 0;
|
||||
}
|
||||
.job-imess li {
|
||||
display: inline-block;
|
||||
padding-right: 5%;
|
||||
font-size: 1.125em;
|
||||
color: #101010;
|
||||
}
|
||||
.job-descript p {
|
||||
line-height: 2em;
|
||||
}
|
||||
.icon-c-p {
|
||||
position: absolute;
|
||||
top: 2%;
|
||||
right: 2%;
|
||||
}
|
||||
.job-btn-deliver {
|
||||
width: 24%;
|
||||
margin: auto;
|
||||
background: #009fdf;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 10px;
|
||||
padding: 1% 0;
|
||||
}
|
||||
.job-btn-deliver a:hover {
|
||||
background: #000;
|
||||
}
|
||||
185
public/frontend/web/css/subject/jquery.bxslider.css
Executable file
185
public/frontend/web/css/subject/jquery.bxslider.css
Executable file
@@ -0,0 +1,185 @@
|
||||
|
||||
.bx-wrapper {
|
||||
position: relative;
|
||||
margin: 15px auto;
|
||||
padding: 0;
|
||||
*zoom: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bx-wrapper img {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/** THEME
|
||||
===================================*/
|
||||
|
||||
.bx-wrapper .bx-viewport {
|
||||
/*fix other elements on the page moving (on Chrome)*/
|
||||
-webkit-transform: translatez(0);
|
||||
-moz-transform: translatez(0);
|
||||
-ms-transform: translatez(0);
|
||||
-o-transform: translatez(0);
|
||||
transform: translatez(0);
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager,
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
position: absolute;
|
||||
bottom: 15px;
|
||||
width: 100%;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* LOADER */
|
||||
|
||||
.bx-wrapper .bx-loading {
|
||||
min-height: 50px;
|
||||
background: url(../images/bx_loader.gif) center center no-repeat #fff;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
/* PAGER */
|
||||
|
||||
.bx-wrapper .bx-pager {
|
||||
text-align: center;
|
||||
font-size: .85em;
|
||||
font-family: Arial;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager .bx-pager-item,
|
||||
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
|
||||
display: inline-block;
|
||||
*zoom: 1;
|
||||
*display: inline;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a {
|
||||
background:transprent;
|
||||
border: 1px solid #7e7c7c;
|
||||
text-indent: -9999px;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin: 0 5px;
|
||||
outline: 0;
|
||||
-moz-border-radius: 6px;
|
||||
-webkit-border-radius: 6px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a:hover,
|
||||
.bx-wrapper .bx-pager.bx-default-pager a.active {
|
||||
background: #5c5b5a;
|
||||
}
|
||||
|
||||
/* DIRECTION CONTROLS (NEXT / PREV) */
|
||||
|
||||
.bx-wrapper .bx-prev {
|
||||
left: 10px;
|
||||
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next {
|
||||
right: 10px;
|
||||
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-prev:hover {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next:hover {
|
||||
background-position: -43px 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-direction a {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -16px;
|
||||
outline: 0;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
text-indent: -9999px;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-direction a.disabled {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* AUTO CONTROLS (START / STOP) */
|
||||
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 10px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(../images/controls.png) -86px -11px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-start.active {
|
||||
background-position: -86px 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 9px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(../images/controls.png) -86px -44px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-stop.active {
|
||||
background-position: -86px -33px;
|
||||
}
|
||||
|
||||
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
|
||||
text-align: left;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
|
||||
right: 0;
|
||||
width: 35px;
|
||||
}
|
||||
|
||||
/* IMAGE CAPTIONS */
|
||||
|
||||
.bx-wrapper .bx-caption {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #666\9;
|
||||
background: rgba(80, 80, 80, 0.75);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-caption span {
|
||||
color: #fff;
|
||||
font-family: Arial;
|
||||
display: block;
|
||||
font-size: .85em;
|
||||
padding: 10px;
|
||||
}
|
||||
946
public/frontend/web/css/subject/odm.css
Executable file
946
public/frontend/web/css/subject/odm.css
Executable file
@@ -0,0 +1,946 @@
|
||||
/*新增*/
|
||||
.odm_banner_p {
|
||||
position: relative;
|
||||
}
|
||||
.odm_b_title {
|
||||
position: absolute;
|
||||
}
|
||||
@media screen and (min-width: 900px) {
|
||||
.odm_b_title {
|
||||
top: 36%;
|
||||
left: 18.5%;
|
||||
}
|
||||
.odm_b_title h3 {
|
||||
font-size: 3.75em;
|
||||
}
|
||||
.odn_t_small {
|
||||
width: 40%;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
}
|
||||
@media (min-width: 480px) and (max-width: 899px) {
|
||||
.odm_b_title {
|
||||
top: 26%;
|
||||
left: 10%;
|
||||
}
|
||||
.odm_b_title h3 {
|
||||
font-size: 3em;
|
||||
}
|
||||
.odn_t_small {
|
||||
width: 80%;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
}
|
||||
@media (max-width: 479px) {
|
||||
.odm_b_title {
|
||||
top: 6%;
|
||||
left: 10%;
|
||||
}
|
||||
.odm_b_title h3 {
|
||||
font-size: 2em;
|
||||
}
|
||||
.odn_t_small {
|
||||
width: 90%;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
}
|
||||
.odm_b_title h3 {
|
||||
color: #fff;
|
||||
padding-bottom: 4%;
|
||||
font-weight: 100;
|
||||
}
|
||||
.odn_t_small {
|
||||
color: #fff;
|
||||
font-size: 1em;
|
||||
padding-top: 1vw;
|
||||
}
|
||||
.odm_usb_tex {
|
||||
margin: auto;
|
||||
padding: 4.2% 0 2.8%;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 700px) {
|
||||
.odm_usb_t {
|
||||
font-size: 2em;
|
||||
}
|
||||
.odm_usb_sm {
|
||||
font-size: 1.125em;
|
||||
width: 60%;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.odm_research {
|
||||
font-size: 2em;
|
||||
}
|
||||
.odm_re_text {
|
||||
font-size: 1.125em;
|
||||
}
|
||||
}
|
||||
@media (min-width: 481px) and (max-width: 699px) {
|
||||
.odm_usb_t {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.odm_usb_sm {
|
||||
font-size: 1.125em;
|
||||
width: 80%;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.odm_research {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
.odm_re_text {
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.odm_usb_t {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.odm_usb_sm {
|
||||
font-size: 1.125em;
|
||||
width: 96%;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.odm_research {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
.odm_research {
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
.odm_research01 {
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
padding: 3.5% 0 2.3%;
|
||||
text-align: center;
|
||||
font-size: 1.625em;
|
||||
}
|
||||
|
||||
.odm_usb_t {
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
padding-bottom: 2.5%;
|
||||
}
|
||||
.odm_usb_sm {
|
||||
color: #737373;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
.odm_usb_sm01 {
|
||||
font-size: 1.125em;
|
||||
color: #737373;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
|
||||
/*解决方案*/
|
||||
.odm_f1 {
|
||||
background: #f1f1f1;
|
||||
padding-bottom: 3.2%;
|
||||
}
|
||||
.odm_one {
|
||||
background: url(../../images/odm/odm1.3_05.jpg) no-repeat;
|
||||
margin: auto;
|
||||
padding: 3% 4.2%;
|
||||
}
|
||||
.odm_ont_bg {
|
||||
background: rgba(61, 166, 227, 0.9);
|
||||
margin: auto;
|
||||
padding: 3.9% 4.2%;
|
||||
}
|
||||
.odm_ont_bor {
|
||||
padding: 6% 5% 4% 10%;
|
||||
margin: auto;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
@media screen and (min-width: 850px) {
|
||||
.odm_two_num {
|
||||
float: left;
|
||||
}
|
||||
.odm_line_l {
|
||||
float: left;
|
||||
padding: 1% 8% 1% 6%;
|
||||
}
|
||||
.odm_two_order {
|
||||
float: left;
|
||||
color: #fff;
|
||||
}
|
||||
.font_one {
|
||||
font-size: 1.5em;
|
||||
padding: 0 2%;
|
||||
}
|
||||
.font_two {
|
||||
font-size: 2em;
|
||||
padding: 5% 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 850px) {
|
||||
.odm_two_num {
|
||||
padding-bottom: 5%;
|
||||
text-align: center;
|
||||
}
|
||||
.odm_two_num img {
|
||||
width: 40%;
|
||||
}
|
||||
.odm_line_l {
|
||||
display: none;
|
||||
}
|
||||
.odm_two_order {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
.font_one {
|
||||
font-size: 1.2em;
|
||||
padding: 0 2%;
|
||||
}
|
||||
.font_two {
|
||||
font-size: 1.5em;
|
||||
padding: 5% 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1440px) {
|
||||
.odm_ont_bg {
|
||||
width: 81%;
|
||||
}
|
||||
.odm_one {
|
||||
width: 66.6%;
|
||||
}
|
||||
.odm_ont_bor {
|
||||
width: 70%;
|
||||
}
|
||||
.odm_re_all {
|
||||
width: 1440px;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1439px) {
|
||||
.odm_re_all {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.odm_research {
|
||||
text-align: center;
|
||||
padding: 5.5% 0 3%;
|
||||
}
|
||||
@media screen and (min-width: 481px) {
|
||||
.odm_re_img li {
|
||||
width: 32.53%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
@media (max-width: 480px) {
|
||||
.odm_re_img li {
|
||||
width: 96%;
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.odm_re_img li {
|
||||
margin-right: 1%;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
}
|
||||
.odm_re_img li img {
|
||||
width: 100%;
|
||||
}
|
||||
.odm_re_img li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.odm_re_text {
|
||||
color: #737373;
|
||||
text-align: center;
|
||||
padding: 5% 0;
|
||||
}
|
||||
/*oder*/
|
||||
@media screen and (min-width: 481px) {
|
||||
.odm_re_img01 li {
|
||||
width: 32.53%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
@media (max-width: 480px) {
|
||||
.odm_re_img01 li {
|
||||
width: 96%;
|
||||
margin: 2% auto;
|
||||
}
|
||||
}
|
||||
|
||||
.odm_re_img01 li {
|
||||
margin-right: 1%;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
}
|
||||
.odm_re_img01 li img {
|
||||
width: 100%;
|
||||
}
|
||||
.odm_re_img01 li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.odm_order_t {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
top: 40%;
|
||||
left: 0;
|
||||
color: #fff;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/*ODM项目*/
|
||||
.odm_service {
|
||||
font-size: 2.25em;
|
||||
padding: 5.8% 0 3.2%;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
.odm_se_img {
|
||||
padding-bottom: 5.2%;
|
||||
}
|
||||
.odm_se_img img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.odm_patent {
|
||||
}
|
||||
/*新增*/
|
||||
.ODM-Gray {
|
||||
background-color: #f1f1f1;
|
||||
overflow: hidden;
|
||||
}
|
||||
.ODM-White {
|
||||
background-color: #ffffff;
|
||||
overflow: hidden;
|
||||
}
|
||||
.ODM-Blue {
|
||||
background-color: #002855;
|
||||
overflow: hidden;
|
||||
}
|
||||
.ODM-Brand {
|
||||
padding-top: 4.5%;
|
||||
padding-bottom: 4.5%;
|
||||
}
|
||||
.ODM-Brand .ODM-Brand-L {
|
||||
width: 43%;
|
||||
float: left;
|
||||
margin-right: 3%;
|
||||
text-align: center;
|
||||
}
|
||||
.ODM-Title {
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
margin-bottom: 4.5%;
|
||||
padding-top: 5.3%;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
.ODM-Des {
|
||||
color: #444444;
|
||||
line-height: 2em;
|
||||
margin-bottom: 3%;
|
||||
font-size: 1.125em;
|
||||
}
|
||||
.ODM-Brand .ODM-Brand-L .Image {
|
||||
width: 10%;
|
||||
margin-right: 0px;
|
||||
margin: 18% auto 0;
|
||||
text-align: center;
|
||||
}
|
||||
.ODM-Brand .ODM-Brand-R {
|
||||
width: 54%;
|
||||
float: left;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.ODM-Brand .ODM-Brand-L,
|
||||
.ODM-Brand .ODM-Brand-R {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 960px) {
|
||||
.ODM-Brand .ODM-Brand-L .Image {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ODM-punctuation {
|
||||
margin-left: 8px;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
.ODM-Menu {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
display: table;
|
||||
position: relative;
|
||||
}
|
||||
.ODM-Menu ul {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.ODM-Menu li {
|
||||
width: 14.28%;
|
||||
color: #fff;
|
||||
font-size: 1.125em;
|
||||
position: relative;
|
||||
float: left;
|
||||
height: 100%;
|
||||
}
|
||||
.ODM-Menu li a {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -20px;
|
||||
line-height: 40px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
width: 80%;
|
||||
left: 10%;
|
||||
}
|
||||
@media screen and (min-width: 541px) {
|
||||
.ODM-Menu .M-02 {
|
||||
display: none;
|
||||
}
|
||||
.ODM-Menu .P-01 {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 47%;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 381px) and (max-width: 540px) {
|
||||
.ODM-Menu li a {
|
||||
line-height: 20px;
|
||||
}
|
||||
.ODM-Menu .M-02 {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 23%;
|
||||
}
|
||||
.ODM-Menu .P-01 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 380px) {
|
||||
.ODM-Menu li a {
|
||||
line-height: 16px;
|
||||
}
|
||||
.ODM-Menu .M-02 {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
line-height: 20px;
|
||||
}
|
||||
.ODM-Menu .P-01 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.ODM-Menu li:nth-child(1) {
|
||||
background-color: #00a1ff;
|
||||
}
|
||||
.ODM-Menu li:nth-child(2) {
|
||||
background-color: #2dccd3;
|
||||
}
|
||||
.ODM-Menu li:nth-child(3) {
|
||||
background-color: #00bb31;
|
||||
}
|
||||
.ODM-Menu li:nth-child(4) {
|
||||
background-color: #ff6900;
|
||||
}
|
||||
.ODM-Menu li:nth-child(5) {
|
||||
background-color: #963cbd;
|
||||
}
|
||||
.ODM-Menu li:nth-child(6) {
|
||||
background-color: #c4d600;
|
||||
}
|
||||
.ODM-Menu li:nth-child(7) {
|
||||
width: 14.26%;
|
||||
background-color: #000000;
|
||||
color: #fff;
|
||||
}
|
||||
.ODM-Solution {
|
||||
padding-top: 3%;
|
||||
padding-bottom: 3%;
|
||||
}
|
||||
.ODM-Solution .ODM-Title {
|
||||
margin-bottom: 2%;
|
||||
}
|
||||
.ODM-Solution .ODM-Subtitle {
|
||||
font-size: 1.125em;
|
||||
color: #444;
|
||||
text-align: center;
|
||||
margin-bottom: 2.5%;
|
||||
}
|
||||
.ODM-Solution .ODM-Des {
|
||||
position: absolute;
|
||||
top: 16%;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
@media screen and (min-width: 769px) {
|
||||
.Table {
|
||||
display: table;
|
||||
width: 100%;
|
||||
}
|
||||
.Table .Table-Row {
|
||||
display: table-row;
|
||||
}
|
||||
.Table .Table-Row .Table-Cell {
|
||||
display: table-cell;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ODM-Solution-L .Image {
|
||||
position: absolute;
|
||||
bottom: 13%;
|
||||
width: 100%;
|
||||
}
|
||||
.ODM-Solution-L {
|
||||
width: 46.8%;
|
||||
border: 1px solid #d4d4d4;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
}
|
||||
.ODM-Solution-C {
|
||||
width: 1.8%;
|
||||
}
|
||||
.ODM-Solution-R {
|
||||
width: 51.3%;
|
||||
}
|
||||
.ODM-Solution-L .title {
|
||||
color: #444444;
|
||||
font-size: 1.5em;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
top: 10%;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
.ODM-Solution-L .title span {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
background-color: #f1f1f1;
|
||||
display: inline-block;
|
||||
}
|
||||
.ODM-Solution-L .line {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
height: 1px;
|
||||
background-color: #c9c9ca;
|
||||
margin-bottom: 3%;
|
||||
position: absolute;
|
||||
top: 13%;
|
||||
left: 10%;
|
||||
}
|
||||
.ODM-Solution-R .all-center {
|
||||
border: 1px solid #d4d4d4;
|
||||
overflow: hidden;
|
||||
clear: both;
|
||||
}
|
||||
.ODM-Solution-R .all-center .title {
|
||||
color: #444;
|
||||
font-size: 1.5em;
|
||||
text-align: center;
|
||||
padding: 4.5% 0 3.5%;
|
||||
}
|
||||
.ODM-Solution-R .all-center ul {
|
||||
width: 92%;
|
||||
margin: auto;
|
||||
}
|
||||
.ODM-Select {
|
||||
padding-bottom: 1.8%;
|
||||
}
|
||||
.ODM-Select .ODM-Title {
|
||||
margin-bottom: 2%;
|
||||
}
|
||||
.ODM-Select .des {
|
||||
width: 60%;
|
||||
margin: auto;
|
||||
color: #444;
|
||||
line-height: 2em;
|
||||
}
|
||||
.ODM-Solution-R .all-center li p {
|
||||
text-align: center;
|
||||
font-size: 0.875em;
|
||||
color: #444444;
|
||||
padding: 5% 0 10%;
|
||||
margin: 0px;
|
||||
}
|
||||
.ODM-Solution-R .all-center li:last-child {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 481px) {
|
||||
.ODM-Solution-R .all-center li {
|
||||
width: 32.3%;
|
||||
margin-right: 1.5%;
|
||||
float: left;
|
||||
}
|
||||
.ODM-Solution-R .all-center li p {
|
||||
font-size: 0.875em;
|
||||
padding: 5.5% 0 14%;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width: 480px) {
|
||||
.ODM-Solution-R .all-center li {
|
||||
width: 100%;
|
||||
clear: both;
|
||||
text-align: center;
|
||||
}
|
||||
.ODM-Solution-R .all-center li img {
|
||||
display: block;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
.ODM-Solution-R .all-center li p {
|
||||
font-size: 1.125em;
|
||||
padding: 5% 0 10%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.Table {
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
.ODM-Solution-L {
|
||||
width: 100%;
|
||||
float: left;
|
||||
}
|
||||
.ODM-Solution-C {
|
||||
display: none;
|
||||
}
|
||||
.ODM-Solution-R {
|
||||
width: 100%;
|
||||
float: left;
|
||||
margin-top: 2%;
|
||||
}
|
||||
.ODM-Solution-L .title {
|
||||
position: relative;
|
||||
margin-top: 12%;
|
||||
}
|
||||
.ODM-Solution .ODM-Des {
|
||||
position: relative;
|
||||
margin-top: 5%;
|
||||
}
|
||||
.ODM-Solution-L .Image {
|
||||
position: relative;
|
||||
margin-bottom: 10%;
|
||||
width: 100%;
|
||||
margin-top: 10%;
|
||||
}
|
||||
}
|
||||
|
||||
.ODM-Select .des {
|
||||
width: 60%;
|
||||
margin: auto;
|
||||
color: #444;
|
||||
}
|
||||
@media screen and (max-width: 768px) {
|
||||
.ODM-Select .des {
|
||||
width: 80%;
|
||||
font-size: 1.125em;
|
||||
line-height: 1.5em;
|
||||
padding: 2% 0;
|
||||
}
|
||||
}
|
||||
.ODM-Select .table01 {
|
||||
margin-top: 1%;
|
||||
width: 50%;
|
||||
float: left;
|
||||
}
|
||||
.ODM-Select .table01 li {
|
||||
width: 47.4%;
|
||||
float: left;
|
||||
margin-right: 2.5%;
|
||||
margin-bottom: 3%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ODM-Select .table02 {
|
||||
margin-top: 1%;
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
.ODM-Select .table02 li {
|
||||
width: 1%;
|
||||
width: 49%;
|
||||
float: left;
|
||||
margin-right: 2%;
|
||||
margin-bottom: 3%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.ODM-Select .table02 li:nth-child(2) {
|
||||
width: 49%;
|
||||
margin-right: 0;
|
||||
}
|
||||
.ODM-Select .table02 li:last-child {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.ODM-Select .table01 li {
|
||||
width: 48%;
|
||||
margin-right: 4%;
|
||||
}
|
||||
.ODM-Select .table01 li:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
.ODM-Select .table01,
|
||||
.ODM-Select .table02 {
|
||||
margin-top: 1%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.ODM-Select .table01 li img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.ODM-Select .Patent {
|
||||
}
|
||||
.ODM-Select .Patent img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/**/
|
||||
.lj_odm_bg {
|
||||
background: #fff;
|
||||
}
|
||||
.lj_odm_w {
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
}
|
||||
.lj_title {
|
||||
color: #002855;
|
||||
text-align: center;
|
||||
font-size: 1.875em;
|
||||
font-weight: 600;
|
||||
position: relative;
|
||||
}
|
||||
.lj_title .dot {
|
||||
display: inline-block;
|
||||
width: 3%;
|
||||
height: 33px;
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.lj_title .dot img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.lj_odm_process li {
|
||||
float: left;
|
||||
position: relative;
|
||||
}
|
||||
.lj_odm_process li:nth-child(1):before,
|
||||
.lj_odm_process li:nth-child(10):after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
background: url(../images/odm_icon_03.png) no-repeat;
|
||||
width: 11px;
|
||||
height: 14px;
|
||||
top: 37px;
|
||||
}
|
||||
.lj_odm_process li:nth-child(1):before {
|
||||
left: -20px;
|
||||
}
|
||||
.lj_odm_process li:nth-child(10):after {
|
||||
right: -20px;
|
||||
}
|
||||
.lj_odm_process li .text01 {
|
||||
text-align: center;
|
||||
padding-bottom: 20px;
|
||||
color: #002855;
|
||||
font-size: 1em;
|
||||
}
|
||||
.process_img {
|
||||
position: relative;
|
||||
border-top: 1px solid #dadada;
|
||||
}
|
||||
@media screen and (min-width: 1025px) {
|
||||
.lj_title {
|
||||
padding: 3em 0;
|
||||
}
|
||||
.lj_odm_process li {
|
||||
width: 20%;
|
||||
}
|
||||
.process_img {
|
||||
padding: 20px 0 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 481px) and (max-width: 1024px) {
|
||||
.lj_title {
|
||||
padding: 2em 0;
|
||||
}
|
||||
.lj_odm_process li {
|
||||
width: 33.3%;
|
||||
}
|
||||
.lj_odm_process li .text01 {
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.process_img {
|
||||
padding: 25px 0 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 320px) and (max-width: 480px) {
|
||||
.lj_title {
|
||||
padding: 1.5em 0;
|
||||
}
|
||||
.lj_odm_process li {
|
||||
width: 50%;
|
||||
}
|
||||
.lj_odm_process li .text01 {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.process_img {
|
||||
padding: 10px 0 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.lj_odm_process li .process_img:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 5px;
|
||||
background: #002855;
|
||||
margin-left: -2.5px;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
margin-top: -2.5px;
|
||||
}
|
||||
|
||||
.process_img {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
.process_img img {
|
||||
max-width: 53%;
|
||||
}
|
||||
.odm_n_z {
|
||||
padding-top: 3.8%;
|
||||
}
|
||||
|
||||
/*菜单动画*/
|
||||
.hz li {
|
||||
margin-right: 25px;
|
||||
}
|
||||
.hz li:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.MH-Before {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
width: 100%;
|
||||
}
|
||||
.MH-after {
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
-webkit-animation-name: fadeIn;
|
||||
animation-name: fadeIn;
|
||||
-webkit-animation-duration: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode: forwards;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
}
|
||||
.indexbox2 .ODM-Title {
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
@-webkit-keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/*新改五大产品线*/
|
||||
.odm-img {
|
||||
clear: both;
|
||||
}
|
||||
.product {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
width: 20%;
|
||||
float: left;
|
||||
}
|
||||
.product img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.product .thumb {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.product .thumb .image {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
.product:hover .add-to-cart {
|
||||
visibility: visible;
|
||||
-webkit-transform: translateY(20px);
|
||||
transform: translateY(20px);
|
||||
opacity: 1;
|
||||
}
|
||||
.product .add-to-cart {
|
||||
display: block;
|
||||
width: 100%;
|
||||
background: #00a0e9;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
font-size: 14px;
|
||||
padding: 15px 0 35px;
|
||||
z-index: 11;
|
||||
margin: auto;
|
||||
font-weight: 400;
|
||||
visibility: hidden;
|
||||
-webkit-transition: all 0.3s ease 0s;
|
||||
transition: all 0.3s ease 0s;
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0);
|
||||
color: #fff;
|
||||
opacity: 0;
|
||||
text-transform: uppercase;
|
||||
overflow: hidden;
|
||||
}
|
||||
.product .add-to-cart:hover {
|
||||
color: #fff;
|
||||
-webkit-box-shadow: 0 5px 15px 0 rgb(0 0 0 / 20%);
|
||||
box-shadow: 0 5px 15px 0 rgb(0 0 0 / 20%);
|
||||
}
|
||||
69
public/frontend/web/css/subject/policy.css
Executable file
69
public/frontend/web/css/subject/policy.css
Executable file
@@ -0,0 +1,69 @@
|
||||
.lj_sale_policy { font-size:2.25em; text-align: center; padding: 4.3% 0 1%; color: #333; font-weight: 600;}
|
||||
.lj_sale_t {text-align: center; font-size:1.125em; color: #737373; padding: 0.7% 2% 0.6%;}
|
||||
.lj_icon_l {padding: 2%;}
|
||||
.lj_icon_l li { padding: 1.25% 0; width:50%; float: left;}
|
||||
.lj_text_right {width:70%; float: left;padding-left: 10px;}
|
||||
.lj_icon_left{float: left; padding-right: 5%;}
|
||||
@media (min-width:1280px){
|
||||
.lj_icon_left{width:110px;}
|
||||
}
|
||||
@media (max-width:1279px){
|
||||
.lj_icon_left {width:18%;}
|
||||
.lj_icon_left img {width:100%;}
|
||||
}
|
||||
@media (max-width:979px){
|
||||
.lj_icon_l li {width:98%;}
|
||||
.lj_text_right {width:77%;}
|
||||
}
|
||||
.lj_h3 {font-size: 1em;font-weight: 600; padding-bottom: 0.5vw; color: #333;}
|
||||
.lj_des{font-size: 0.875em; line-height: 1.875em;}
|
||||
.lj_bg_i {background: #f1f1f1; padding: 2.4% 2%;}
|
||||
@media (min-width:1280px){
|
||||
.lj_img_l {width:26%; float: left;}
|
||||
.lj_text_r {width:72%;}
|
||||
}
|
||||
|
||||
@media (min-width:980px) and (max-width:1279px){
|
||||
.lj_img_l {width:313px; float: left; padding-right: 5%;}
|
||||
.lj_text_r {width:60%;}
|
||||
}
|
||||
.iotbpage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
}
|
||||
@media (min-width:480px) and (max-width:1279px){
|
||||
.lj_img_l {display: none;}
|
||||
.lj_text_r {width:90%; }
|
||||
}
|
||||
@media (max-width:479px){
|
||||
.lj_img_l {width:98%; padding: 2% 0; margin: auto;}
|
||||
.lj_img_l img {max-width:100%;}
|
||||
.lj_text_r {width:90%; }
|
||||
}
|
||||
.lj_three_policy { font-size: 1.375em; text-align: center;color: #333; padding: 5.5% 0 1%;}
|
||||
.lj_t_small {color: #737373; text-align: center; }
|
||||
.lj_policy_icon { padding:2% 2% 5%;}
|
||||
@media (min-width:800px){
|
||||
.lj_policy_icon li{width:27%;}
|
||||
.lj_policy_four li {width:20%;}
|
||||
.lj_icon05 {width:44.7%;}
|
||||
}
|
||||
@media (max-width:799px){
|
||||
.lj_policy_icon li{width:90%; margin: auto;}
|
||||
.lj_policy_four li {width:45%; }
|
||||
.lj_icon05 {width:21.2%;}
|
||||
}
|
||||
.lj_policy_four {padding: 1.5% 2% 5%;}
|
||||
.lj_policy_four li {margin-right: 5%; float: left;}
|
||||
.lj_policy_four li:last-child{margin-right: 0;}
|
||||
.lj_policy_icon li { margin-right: 8%; float: left;}
|
||||
.lj_policy_icon li:last-child {margin-right: 0;}
|
||||
.lj_icon05 {text-align:center; padding:8% 0; margin: auto;}
|
||||
.lj_icon05 img {max-width:100%;}
|
||||
.lj_icon05_text {text-align: center; color: #737373; font-size: 0.875em; line-height: 1.875em;}
|
||||
.lj_mar_5 {margin-bottom:4.2%;}
|
||||
52
public/frontend/web/css/subject/pssd.css
Executable file
52
public/frontend/web/css/subject/pssd.css
Executable file
@@ -0,0 +1,52 @@
|
||||
.video_subject{width:100%; overflow: hidden; padding:7vw 0;}
|
||||
.video_subject .left{width:29%; float: left; margin-right: 3%;}
|
||||
.video_subject .right{width:68%; float: left;}
|
||||
.subject_three_list .subject_new_buy{position: absolute; bottom: -2.4vw; width:100%;}
|
||||
.subject_three_list:hover .subject_new_buy{position: absolute; bottom: 2.4vw; width:100%;}
|
||||
.banner{top:5vw; text-align: center; width:100%}
|
||||
/*第一屏*/
|
||||
@media screen and (min-width:1441px) {
|
||||
.pssd01{width:1440px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1440px){
|
||||
.pssd01{width:100%;}
|
||||
}
|
||||
.pssd01L{width:49.5%; float: left; height: 100%;}
|
||||
.pssd01C p{left:47.5%; position: absolute; width:5%; color:#009fdf;}
|
||||
.pssd01C p:nth-child(1){top:30%;}
|
||||
.pssd01C p:nth-child(2){top:49%;}
|
||||
.pssd01C p:nth-child(3){top:68%;}
|
||||
.pssd01C p:nth-child(4){top:87%;}
|
||||
.pssd01R{width:49.5%; float: right; height: 100%;}
|
||||
.pssd01 .m-t-12{margin-top:12%;}
|
||||
@media screen and (min-width:1280px) {
|
||||
.font-60{font-size: 3em; line-height: 1.25em;}
|
||||
}
|
||||
@media screen and (min-width:991px) and (max-width:1279px) {
|
||||
.font-60{font-size: 2.5em; line-height: 1.25em;}
|
||||
}
|
||||
@media screen and (max-width:990px) {
|
||||
.font-60{font-size: 2em; line-height: 1.25em;}
|
||||
}
|
||||
|
||||
.pssd01L .pssdTitle, .pssd01R .pssdTitle{top:0; width:100%;}
|
||||
.pssd01L .pssdContent{width:90%; padding-right:10%; height: 100%;}
|
||||
.pssd01L .pssdContent p{width:90%; padding-right: 10%;}
|
||||
.pssd01R .pssdContent p{width:90%; padding-left: 10%;}
|
||||
.pssdContent p:nth-child(1){top:28%; position: absolute;}
|
||||
.pssdContent p:nth-child(2){top:47%; position: absolute;}
|
||||
.pssdContent p:nth-child(3){top:68%; position: absolute;}
|
||||
.pssdContent p:nth-child(4){top:85%; position: absolute;}
|
||||
.font-30{line-height: 1.2em;}
|
||||
.pssd_p_BT{top:88%;}
|
||||
/*diy pssd*/
|
||||
.pssdDiy{width:96.56vw; margin:auto;}
|
||||
.pssdDiy .content{width:100%;}
|
||||
.pssdDiyL{width:78.5vw; margin-right: 1.5vw; float: left;}
|
||||
.pssdDiyR{width:16.47vw; float: left;}
|
||||
.pssdDiyR .list{width:100%;}
|
||||
.pssdDiyR .list p{position: absolute; bottom:0.83vw; width:100%;}
|
||||
.pssdDiyAdd img{width:3.33vw;display: inline-block; padding-top:0.625vw; padding-bottom: 0.625vw;}
|
||||
.pssdDiyL .text{position: absolute; right:2.5vw; bottom:8.59vw;}
|
||||
.pssdDiyL .text .button{background-color:#009fdf; display: inline-block; padding:0.625vw 1.7vw; color:#FFF }
|
||||
.font-18{line-height: 1.875em; letter-spacing: 1px;}
|
||||
24
public/frontend/web/css/subject/question.css
Executable file
24
public/frontend/web/css/subject/question.css
Executable file
@@ -0,0 +1,24 @@
|
||||
.fq_left{width:10.5%; margin-right: 1.5%; padding:1.8vw 2.9% 2.5vw;}
|
||||
.fq_right{width:75%; padding:2vw 3.5%;}
|
||||
.fq_left, .fq_right{float: left; border-radius: 5px;}
|
||||
.fq_left dd{margin-top:2vw;}
|
||||
.fq_hover{color:#666; position: relative;}
|
||||
.fq_hover:before{background-color:#9fc3fa; content: ""; width:5px; height: 5px; border-radius: 2.5px; position: absolute; top:50%; margin-top:-2.5px; left:-15px;}
|
||||
.fq_right .fq_top{padding-bottom: 15px; width:100%; border-bottom:1px solid #dbdbdb; position: relative; }
|
||||
.fq_right span{position: relative; left:0; top:0; padding-bottom: 12px; border-bottom:2px solid #9fc3fa;}
|
||||
.fq_list{width:100%;}
|
||||
.fq_list li{border-bottom:1px solid #dbdbdb; padding-bottom: 1.5vw; padding-top: 1.5vw; overflow: hidden;}
|
||||
.fq_list .left{width:20.5%; float: left; margin-right: 2%;}
|
||||
.fq_list .right{width:77.5%; float: left;}
|
||||
.fq_list .right dd{line-height: 1.7em;}
|
||||
.fq_list dt:before{background-color:#9fc3fa; content: ""; width:5px; height: 5px; border-radius: 2.5px; position: absolute; top:50%; margin-top:-2.5px; left:-10px;}
|
||||
.fq_list dt{margin-left:10px;}
|
||||
.fq_search{width:30%; float: right; display: inline-block; line-height: 40px; background-color:#f5f5f5; border-radius: 20px; position: absolute; right:0; top:-10px; padding-left:15px;}
|
||||
.fq_search input{width:85%; line-height: 40px;}
|
||||
@media screen and (max-width:1280px){
|
||||
.fq_search input{width:75%; line-height: 30px;}
|
||||
.fq_search{line-height: 30px; top:-0px;}
|
||||
}
|
||||
#search-btn{background-color:#f5f5f5;}
|
||||
.Pages{margin-top:2vw;}
|
||||
.Pages span{border-bottom: 0px solid #FFF;}
|
||||
11
public/frontend/web/css/subject/report.css
Executable file
11
public/frontend/web/css/subject/report.css
Executable file
@@ -0,0 +1,11 @@
|
||||
.product_address{margin-bottom: 1%;}
|
||||
.report_w{width:75%;}
|
||||
.report_input{width:100%;}
|
||||
.report_input li{width:40%; margin-right: 18%; float: left; }
|
||||
.report_input li:nth-child(2n){margin-right: 0;}
|
||||
.report_input li:last-child{width:100%;}
|
||||
.report_w form{overflow: hidden; }
|
||||
.report_input input{width:98%; border:1px solid #e6e5e1; background-color: transparent; margin-top:0.5vw; padding:2%; }
|
||||
.report_input textarea{width:96%; border:1px solid #e6e5e1; background-color: transparent; margin-top:0.5vw; padding:2%;}
|
||||
.report_input button{background-color:#009fdf; display: inline-block; color:#FFF; padding:0.5vw 2vw; margin-left:58%; margin-top:1.8vw; margin-bottom: 2vw;}
|
||||
.report_input span{color:red;}
|
||||
47
public/frontend/web/css/subject/search.css
Executable file
47
public/frontend/web/css/subject/search.css
Executable file
@@ -0,0 +1,47 @@
|
||||
.S-search-bg{background-color:#f1f1f1; overflow: hidden; width:100%;padding-bottom: 1.5%;}
|
||||
.S-search-content{background-color:#FFF; overflow:hidden; padding-top:2%; padding-bottom: 10%;}
|
||||
.S-Searchbox{width:89%; margin:auto; position: relative;}
|
||||
.S-Searchbox .Search{width:100%;}
|
||||
.S-Searchbox .ipt{width:94%; border:1px solid #e3e8ec; background-color:#f1f1f1; height: 52px; line-height: 52px; padding-left:3%; padding-right: 3%; font-size: 1.25em;}
|
||||
.S-Searchbox .icon{position: absolute; z-index: 6; width:100%; text-align: right;}
|
||||
.S-Searchbox .searchbtn{width:52px; height: 52px; position: absolute; top:0; margin-bottom: -26px; right:2%; background-color: transparent; font-size: 1.5em; color:#bdbdbd}
|
||||
@media screen and (max-width:767px){
|
||||
.S-Searchbox .ipt{line-height: 40px; height: 40px}
|
||||
.S-Searchbox .searchbtn{font-size: 1.5em}
|
||||
.S-Searchbox{margin-top:20px;}
|
||||
}
|
||||
|
||||
/*模糊搜索*/
|
||||
.search_content {
|
||||
width:100%;
|
||||
margin:0 auto;
|
||||
background-color:#FFF;
|
||||
border-radius:8px;
|
||||
display: none;
|
||||
}
|
||||
.search_content ul {
|
||||
padding-left:0;
|
||||
border-top:none;
|
||||
height:200px;
|
||||
overflow-y: scroll;
|
||||
border:1px solid #e3e8ec;
|
||||
}
|
||||
.search_content li {
|
||||
width:100%;
|
||||
height:40px;
|
||||
line-height:40px;
|
||||
box-sizing:border-box;
|
||||
list-style:none;
|
||||
padding-left:3%;
|
||||
}
|
||||
.search_content li:last-child {
|
||||
border-bottom:0;
|
||||
}
|
||||
.search_content li a {
|
||||
color:#8c8282;
|
||||
}
|
||||
|
||||
/*#search li:hover{background-color:rgba(168,168,168,0.2); cursor: pointer;}*/
|
||||
.ul_search{background-color:rgba(168,168,168,0.2); cursor: pointer;}
|
||||
/*.ul_add{max-height: 200px; overflow-y: scroll; border:1px solid #e3e8ec;}*/
|
||||
|
||||
72
public/frontend/web/css/subject/series35.css
Executable file
72
public/frontend/web/css/subject/series35.css
Executable file
@@ -0,0 +1,72 @@
|
||||
.banner{top:6vw; width:100%; left:0;}
|
||||
.font-48{line-height: 1.35em;}
|
||||
.font-18{line-height: 1.75em;}
|
||||
.video_subject{width:100%; overflow: hidden; padding:7vw 0;}
|
||||
.video_subject .left{width:29%; float: left; margin-right: 3%;}
|
||||
.video_subject .right{width:68%; float: left;}
|
||||
|
||||
/*第三屏*/
|
||||
.series05_three{background-color:#333435; overflow: hidden; padding-bottom: 0.6%}
|
||||
.series05_three li{margin-top:0.6%; margin-right: 0.6%; float: left; width:49.4%; position: relative;}
|
||||
.series05_three li:nth-child(2n){margin-right: 0;}
|
||||
.series05_three .title{position: absolute; background-color:rgba(0,0,0,0.5); bottom: 0; height: 80px; width:100%; z-index: 2; line-height:80px;}
|
||||
|
||||
.series35_left{width:23%; float: left;}
|
||||
.series35_right{width:38%; float: right;}
|
||||
.series35_mt{margin-top:13vw;}
|
||||
.series35_left .des{width:74%;}
|
||||
.series35_two_right{width:28%; float: right;}
|
||||
.series35_four_left{width:52.6%; float: left; margin-left:5%; margin-top:8.5vw; text-align: center;}
|
||||
.series35_four_right{width:34%; float: right; margin-top:13vw;}
|
||||
.series35_border{border:1px solid rgba(255,255,255,0.2); overflow: hidden; padding-top:4vw; margin-top:2.3vw;}
|
||||
|
||||
.series35_border ul{width:88%; margin:auto;}
|
||||
.series35_border ul li{float: left;}
|
||||
.series35_border li:nth-child(1){width:36%; margin-right: 12%; margin-left:8%; margin-bottom: 3vw;}
|
||||
.series35_border li:nth-child(2){width:36%; margin-right:8%; margin-bottom: 3vw;}
|
||||
.series35_border li div:nth-child(1) img{height: 100%; margin-top:-2px; margin-right: 10px;}
|
||||
.series35_border li:nth-child(3), .series35_border li:nth-child(4), .series35_border li:nth-child(5){width:30%;margin-right: 5%; margin-bottom: 3vw;}
|
||||
.series35_border li:nth-child(5){margin-right: 0;}
|
||||
.line_height{height: 1px; width:35px; background-color:rgba(252,252,252,0.6); margin:0.5vw auto;}
|
||||
|
||||
/*第七屏*/
|
||||
.series35_07{background: #0e0e17 url(../../images/series35/series35_07.jpg) no-repeat center; padding-top:5vw; padding-bottom: 5vw;}
|
||||
/*产品列表*/
|
||||
.series35_list{ margin-left:auto; margin-right: auto; margin-top:3%; margin-bottom: 2%;}
|
||||
@media screen and (min-width:1200px){
|
||||
.series35_list{width:1080px;}
|
||||
}
|
||||
@media screen and (max-width:1199px){
|
||||
.series35_list{width:96%;}
|
||||
}
|
||||
|
||||
/*自适应*/
|
||||
@media screen and (max-width:1460px){
|
||||
.font-60{font-size: 2.5em}
|
||||
.font-32{font-size: 1.25em;}
|
||||
.series35_left{width:34%;}
|
||||
.series35_four_left{margin-top:5vw;}
|
||||
.series35_four_right{width:38%; margin-top:6vw;}
|
||||
.series05_three .title{height: 40px; line-height: 40px;}
|
||||
.series35_border img{width:2.4vw;}
|
||||
.series35_border li div:nth-child(1) img{margin-top:0;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.series35_border li:nth-child(1){width:38%; margin-right: 10%; margin-left:7%; margin-bottom: 3vw;}
|
||||
.series35_border li:nth-child(2){width:38%; margin-right:7%; margin-bottom: 3vw;}
|
||||
}
|
||||
@media screen and (max-width:960px){
|
||||
.font-60{font-size: 2em}
|
||||
.font-32{font-size: 1em;}
|
||||
.series35_two_right{width:40%;}
|
||||
.series35_right{width:45%;}
|
||||
.series35_left{width:38%;}
|
||||
.padding-t-60{padding-top:0;}
|
||||
.light_height_48{line-height: 30px;}
|
||||
.series35_border img{width:2.8vw;}
|
||||
.series35_border li div:nth-child(1) img{margin-top:0;}
|
||||
.series35_border ul{width:96%;}
|
||||
.series35_border li:nth-child(1){width:42%; margin-right: 8%; margin-left:4%; margin-bottom: 3vw;}
|
||||
.series35_border li:nth-child(2){width:42%; margin-right:4%; margin-bottom: 3vw;}
|
||||
|
||||
}
|
||||
19
public/frontend/web/css/subject/sitemap.css
Executable file
19
public/frontend/web/css/subject/sitemap.css
Executable file
@@ -0,0 +1,19 @@
|
||||
|
||||
@media screen and (min-width:1440px){
|
||||
.sitemap_w{width:1440px; margin:auto;}
|
||||
}
|
||||
@media screen and (max-width:1439px){
|
||||
.sitemap_w{width:96%; margin:auto;}
|
||||
}
|
||||
|
||||
.sitemap_w h3 {text-align: center; color: #333; padding-bottom: 2%;}
|
||||
.s-nav {border-bottom: 1px solid #e5e5e5; padding:2% 0 1%; font-size: 1.5em; color: #333;}
|
||||
.s-nav-list { overflow: hidden;}
|
||||
.s-nav-list li { width:15%; float: left; font-size: 1em; padding: 1% 0 0.5%;}
|
||||
.s-product-n { overflow: hidden;}
|
||||
.s-product-l {float:left; width:15%;padding: 1% 0 0.5%; color: #4d93d9;}
|
||||
.s-blue {color:#4d93d9;}
|
||||
.s-blue a {color:#4d93d9;}
|
||||
.s-product-r {float: left; width:85%;}
|
||||
.s-product-r li {width:17.8%; float: left;}
|
||||
.s-site-b {margin-bottom: 3%;}
|
||||
59
public/frontend/web/css/subject/socket.css
Executable file
59
public/frontend/web/css/subject/socket.css
Executable file
@@ -0,0 +1,59 @@
|
||||
.socket_banner_title{position: relative; top:16.04vw; width:28.959%;}
|
||||
.socket_banner .link{position: absolute; width:100%; bottom: 0;}
|
||||
.socket_banner .link span{background-color:#00ba31; width:10.4%; margin-right:2.15%; padding-top:0.3vw; padding-bottom: 0.3vw; display: inline-block}
|
||||
.socket_banner .link a:nth-child(4) span{margin-right: 0;}
|
||||
.socket_banner .link a{color:#FFF;}
|
||||
.socket_banner .link a:hover span{background-color:#009527;}
|
||||
|
||||
|
||||
.socket_one{width:100%; margin-top:6vw; margin-bottom: 6vw; overflow: hidden;}
|
||||
.socket_one .left{width:26%; float: left; margin-right: 4.9027%; padding-top:5vw;}
|
||||
.socket_one .left p:last-child{line-height: 2rem;}
|
||||
.socket_one .right{width:69.0973%; float: left;}
|
||||
.font-18{line-height: 2rem;}
|
||||
.socket_left{line-height: 2rem; margin-top:16vw;}
|
||||
.three{width:26%;}
|
||||
.five{width:39.5%;}
|
||||
.seven{width:30%;}
|
||||
.nine{width:38%;}
|
||||
.nine p:last-child{width:90%;}
|
||||
|
||||
|
||||
/*两列列表*/
|
||||
.socket_two_list{width:100%; overflow: hidden;}
|
||||
.socket_two_list .left, .socket_two_list .right{width:50%; float: left; position: relative;}
|
||||
.socket_two_list .right .line, .socket_two_list .left .line{height: 1px; background-color:#00ba31; position: absolute; top:15.5%; width:7%;}
|
||||
.socket_two_list .right .line{left: 4%;}
|
||||
.socket_two_list .left .line{right: 4%;}
|
||||
.socket_two_list .right .title, .socket_two_list .left .title{position: absolute; top:12%;}
|
||||
.socket_two_list .right .title{left: 13.5%;}
|
||||
.socket_two_list .left .title{right: 13.5%;}
|
||||
.socket_two_list .buy{position: absolute; bottom: 11%; text-align: center; width:100%;}
|
||||
.socket_two_list .buy a{padding:0 5%; border:1px solid #5c5c5c; display: inline-block; margin-left:30px; margin-right: 30px; color:#333; height: 2em; line-height: 2em}
|
||||
.socket_two_list .buy a:hover{border: 1px solid #00ba31; background-color:#00ba31; color:#FFF;}
|
||||
.socket_two_list span{padding:0 5%; border:1px solid #939393; color:#939393; height: 2em; line-height: 2em}
|
||||
/*第十一屏*/
|
||||
.socket_eleven{width:100%; margin-top:2.6vw; margin-bottom: 4.5vw; overflow: hidden;}
|
||||
.socket_eleven li{width:49.3%; margin-right: 1.4%; float: left; position: relative;}
|
||||
.socket_eleven li:nth-child(2n){margin-right: 0;}
|
||||
.socket_eleven_right{position: absolute; top:3.5vw; left:56%; text-align: left; width:40%;}
|
||||
/*第十三屏*/
|
||||
.socket_thirteen{width:100%; margin-top:3vw; margin-bottom: 4.5vw; overflow: hidden;}
|
||||
.socket_thirteen li{width:24.32%; float: left; margin-right: 0.9%; background-color:#f5f5f5;}
|
||||
.socket_thirteen li:last-child{margin-right: 0;}
|
||||
|
||||
@media screen and (max-width:1400px){
|
||||
.font-60{font-size: 3em;}
|
||||
.font-32{font-size: 1.75em;}
|
||||
.font-38{font-size: 1.875em;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.socket_two_list .right .line, .socket_two_list .left .line{top:16.5%;}
|
||||
}
|
||||
@media screen and (max-width:1200px){
|
||||
.three{width:35%;}
|
||||
.five{width:46%;}
|
||||
.seven{width:40%;}
|
||||
.nine{width:45%;}
|
||||
.socket_one .left{width:30%; margin-right: 0.9027%;}
|
||||
}
|
||||
149
public/frontend/web/css/subject/special-11-26.css
Executable file
149
public/frontend/web/css/subject/special-11-26.css
Executable file
@@ -0,0 +1,149 @@
|
||||
body {font: 14px "Lato", Arial, sans-serif; min-width: 100%; min-height: 100%; color: #666;}
|
||||
p {padding: 0; margin: 0;}
|
||||
ul { padding: 0; margin: 0; list-style-type: none;}
|
||||
.image-box {}
|
||||
.image-box img { width:100%; display: block;}
|
||||
|
||||
/*tab*/
|
||||
.li_special_a img {width:100%;display: block;}
|
||||
|
||||
.lj_special_t {width:100%;background:#ddd; padding: 3% 0;}
|
||||
|
||||
@media screen and (min-width:1366px){
|
||||
.lj_table,.lj_special_p{width:73%;margin: auto;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:1365px){
|
||||
.lj_table,.lj_special_p{width:90%;margin: auto;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px){
|
||||
.t-one {width: 24.25%; margin: 1% 1% 0 0;}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (min-width:550px) and (max-width:999px){
|
||||
.t-one {width:49%;margin: 1% 1% 0 0;}
|
||||
.lj_special_p {display: none;}
|
||||
.t-one:nth-child(2n) {margin: 1% 0 1% 1%;}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width:549px){
|
||||
.t-one {width:100%;margin:2% 0;}
|
||||
.lj_special_p {display: none;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width:1200px){
|
||||
.t-up img{margin-top: 35%;}
|
||||
}
|
||||
@media only screen and (min-width:1000px) and (max-width:1199px){
|
||||
.t-up img{margin-top: 45%;}
|
||||
}
|
||||
@media only screen and (min-width:769px) and (max-width:999px){
|
||||
.t-up img{margin-top: 26%;}
|
||||
}
|
||||
|
||||
@media only screen and (min-width:640px) and (max-width:768px){
|
||||
.t-up img{margin-top: 30%;}
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (min-width:550px) and (max-width:639px){
|
||||
.t-up img{margin-top: 30%;}
|
||||
}
|
||||
@media only screen and (min-width:400px) and (max-width:549px){
|
||||
.t-up img{margin-top: 24%;}
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width:399px){
|
||||
.t-up img{margin-top: 28%;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.t-one{float: left;background-color: #fff;position: relative;border-radius: 5%; padding: 2% 0;}
|
||||
.t-one:last-child{margin-right: 0;}
|
||||
.t-one p {text-align: center; line-height: 32px;}
|
||||
.t-up{width:100%;background: #51BDE9;opacity:0.85;text-align: center;position: absolute;top: 0;display:none;border-radius: 5%;}
|
||||
.sjx{width:0;height:0;border-left: 15px solid transparent;border-right: 15px solid transparent;border-top: 15px solid #51BDE9;position: absolute;bottom:-3%;left:50%;opacity:0.85; margin-left: -15px;}
|
||||
.lj_special_p li {width:24.25%; margin-right:1%; text-align: center; padding: 4% 0 2%; float: left;}
|
||||
.lj_special_p li:last-child{margin-right:0;}
|
||||
.lj_special_line { width:50px; margin:6% auto; border-bottom: 1px solid #828282; }
|
||||
.special_font { color: #002855;}
|
||||
|
||||
/*special*/
|
||||
.text-desc{position: absolute; left: 0; top: 0; background-color: #4467a1; height: 100%; opacity: 0; width: 100%;}
|
||||
.li_special_b { padding:0 0 3% 0;}
|
||||
.li_special_b img {width:100%; display: block;}
|
||||
.spe_m {padding-top: 3%;}
|
||||
.lj_special { margin: auto;}
|
||||
.lj_special img {width:100%; display: block;}
|
||||
.lj_com-gray::before { content: "";left: 10%; right: 10%; border-bottom: 1px solid #dedede; position: absolute;top: 50%;z-index: 1;}
|
||||
.lj_special_com {text-align: center; position: relative; margin-bottom:3%;}
|
||||
.lj_special_com .comtit {font-size: 1.56em;color: #404040;}
|
||||
.special_eng{ letter-spacing: 0.1em; opacity: 0.5;}
|
||||
|
||||
.lj_special_com p {position: relative;display: inline-block;font-size: 1.33rem;z-index: 1;padding: 0 2rem;background-color: #fff;}
|
||||
.lj_special_img {width:100%;}
|
||||
.lj_special_img li{float: left; width:49%; margin:0.5% 1% 0.5% 0; list-style: none;}
|
||||
.lj_special_img li:nth-child(2n) {margin: 0.5% 0 0.5%;}
|
||||
|
||||
.lj_special_img01 {}
|
||||
.lj_special_img01 li{float: left; width:32%; margin:1%; list-style: none;}
|
||||
.lj_special_img01 li:nth-child(2n) {margin: 1% 0;}
|
||||
@media screen and (min-width:1366px){
|
||||
.special_title {top:40%;font-size: 1.8em; }
|
||||
.special_title01 {top:40%;font-size: 1.375em; }
|
||||
.lj_special { width:73%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px) and (max-width:1365px){
|
||||
.special_title {top:40%;font-size: 1.5em; }
|
||||
.special_title01 {top:36%;font-size: 1.2em; }
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.special_title {top:38%;font-size: 1.3em; }
|
||||
.special_title01 {top:32%;font-size: 1.1em; }
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:767px){
|
||||
.special_title {top:34%;font-size: 1.2em; }
|
||||
.special_title01 {top:36%;font-size:1em; }
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.special_title {top:40%;font-size:0.9em; }
|
||||
.special_title01 {top:30%;font-size: 0.9em; }
|
||||
.special_line {display: none;}
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
.special_title,.special_title01 {position: absolute; text-align: center;width:100%;}
|
||||
.special_line {border-bottom:1px solid #fff; width:50px; text-align: center; margin: auto; padding-top:4%; }
|
||||
|
||||
/* effect-1 css */
|
||||
.port-1{float: left; width: 100%; position: relative; overflow: hidden; text-align: center; border: 4px solid rgba(255, 255, 255, 0.9);}
|
||||
.port-1 .text-desc{opacity: 0.9; top: 100%; transition: 0.5s; color: #fff; }
|
||||
|
||||
.port-1 img{transition: 0.5s;}
|
||||
.port-1:hover img{transform: scale(1.2);}
|
||||
|
||||
.port-1.effect-1:hover .text-desc{top: 0;}
|
||||
|
||||
.port-1.effect-2 .text-desc{top: auto; bottom: -100%;}
|
||||
.port-1.effect-2:hover .text-desc{bottom: 0;}
|
||||
|
||||
.port-1.effect-3 .text-desc{top: 50%; left: 50%; width: 0; height: 0; overflow: hidden; padding: 0;}
|
||||
.port-1.effect-3:hover .text-desc{width: 100%; top: 0; left: 0; height: 100%;}
|
||||
/* effect-1 css end */
|
||||
|
||||
|
||||
|
||||
143
public/frontend/web/css/subject/special.css
Executable file
143
public/frontend/web/css/subject/special.css
Executable file
@@ -0,0 +1,143 @@
|
||||
/*tab*/
|
||||
.li_special_a img {width:100%;display: block;}
|
||||
|
||||
.lj_special_t {width:100%;background:#ddd; padding: 3% 0;}
|
||||
|
||||
@media screen and (min-width:1366px){
|
||||
.lj_table,.lj_special_p{width:73%;margin: auto;}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width:1365px){
|
||||
.lj_table,.lj_special_p{width:90%;margin: auto;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px){
|
||||
.t-one {width: 24.25%; margin: 1% 1% 0 0;}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (min-width:550px) and (max-width:999px){
|
||||
.t-one {width:49%;margin: 1% 1% 0 0;}
|
||||
.lj_special_p {display: none;}
|
||||
.t-one:nth-child(2n) {margin: 1% 0 1% 1%;}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width:549px){
|
||||
.t-one {width:100%;margin:2% 0;}
|
||||
.lj_special_p {display: none;}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width:1200px){
|
||||
.t-up img{margin-top: 35%;}
|
||||
}
|
||||
@media only screen and (min-width:1000px) and (max-width:1199px){
|
||||
.t-up img{margin-top: 45%;}
|
||||
}
|
||||
@media only screen and (min-width:769px) and (max-width:999px){
|
||||
.t-up img{margin-top: 26%;}
|
||||
}
|
||||
|
||||
@media only screen and (min-width:640px) and (max-width:768px){
|
||||
.t-up img{margin-top: 30%;}
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (min-width:550px) and (max-width:639px){
|
||||
.t-up img{margin-top: 30%;}
|
||||
}
|
||||
@media only screen and (min-width:400px) and (max-width:549px){
|
||||
.t-up img{margin-top: 24%;}
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width:399px){
|
||||
.t-up img{margin-top: 28%;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.t-one{float: left;background-color: #fff;position: relative;border-radius: 5%; padding: 2% 0;}
|
||||
.t-one:last-child{margin-right: 0;}
|
||||
.t-one p {text-align: center; line-height: 32px;}
|
||||
.t-up{width:100%;background: #51BDE9;opacity:0.85;text-align: center;position: absolute;top: 0;display:none;border-radius: 5%;}
|
||||
.sjx{width:0;height:0;border-left: 15px solid transparent;border-right: 15px solid transparent;border-top: 15px solid #51BDE9;position: absolute;bottom:-3%;left:50%;opacity:0.85; margin-left: -15px;}
|
||||
.lj_special_p li {width:24.25%; margin-right:1%; text-align: center; padding: 4% 0 2%; float: left;}
|
||||
.lj_special_p li:last-child{margin-right:0;}
|
||||
.lj_special_line { width:50px; margin:6% auto; border-bottom: 1px solid #828282; }
|
||||
.special_font { color: #002855;}
|
||||
|
||||
/*special*/
|
||||
.text-desc{position: absolute; left: 0; top: 0; background-color: #4467a1; height: 100%; opacity: 0; width: 100%;}
|
||||
.li_special_b { padding:0 0 3% 0;}
|
||||
.li_special_b img {width:100%; display: block;}
|
||||
.spe_m {padding-top: 3%;}
|
||||
.lj_special { margin: auto;}
|
||||
.lj_special img {width:100%; display: block;}
|
||||
.lj_com-gray::before { content: "";left: 10%; right: 10%; border-bottom: 1px solid #dedede; position: absolute;top: 50%;z-index: 1;}
|
||||
.lj_special_com {text-align: center; position: relative; margin-bottom:3%;}
|
||||
.lj_special_com .comtit {font-size: 1.56em;color: #404040;}
|
||||
.special_eng{ letter-spacing: 0.1em; opacity: 0.5;}
|
||||
|
||||
.lj_special_com p {position: relative;display: inline-block;font-size: 1.33rem;z-index: 1;padding: 0 2rem;background-color: #fff;}
|
||||
.lj_special_img {width:100%;}
|
||||
.lj_special_img li{float: left; width:49%; margin:0.5% 1% 0.5% 0; list-style: none;}
|
||||
.lj_special_img li:nth-child(2n) {margin: 0.5% 0 0.5%;}
|
||||
|
||||
.lj_special_img01 {}
|
||||
.lj_special_img01 li{float: left; width:32%; margin:1%; list-style: none;}
|
||||
.lj_special_img01 li:nth-child(2n) {margin: 1% 0;}
|
||||
@media screen and (min-width:1366px){
|
||||
.special_title {top:40%;font-size: 1.8em; }
|
||||
.special_title01 {top:40%;font-size: 1.375em; }
|
||||
.lj_special { width:73%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:1000px) and (max-width:1365px){
|
||||
.special_title {top:40%;font-size: 1.5em; }
|
||||
.special_title01 {top:36%;font-size: 1.2em; }
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:768px) and (max-width:999px){
|
||||
.special_title {top:38%;font-size: 1.3em; }
|
||||
.special_title01 {top:32%;font-size: 1.1em; }
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
|
||||
@media screen and (min-width:480px) and (max-width:767px){
|
||||
.special_title {top:34%;font-size: 1.2em; }
|
||||
.special_title01 {top:36%;font-size:1em; }
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:479px){
|
||||
.special_title {top:40%;font-size:0.9em; }
|
||||
.special_title01 {top:30%;font-size: 0.9em; }
|
||||
.special_line {display: none;}
|
||||
.lj_special { width:90%;}
|
||||
}
|
||||
.special_title,.special_title01 {position: absolute; text-align: center;width:100%;}
|
||||
.special_line {border-bottom:1px solid #fff; width:50px; text-align: center; margin: auto; padding-top:4%; }
|
||||
|
||||
/* effect-1 css */
|
||||
.port-1{float: left; width: 100%; position: relative; overflow: hidden; text-align: center; border: 4px solid rgba(255, 255, 255, 0.9);}
|
||||
.port-1 .text-desc{opacity: 0.9; top: 100%; transition: 0.5s; color: #fff; }
|
||||
|
||||
.port-1 img{transition: 0.5s;}
|
||||
.port-1:hover img{transform: scale(1.2);}
|
||||
|
||||
.port-1.effect-1:hover .text-desc{top: 0;}
|
||||
|
||||
.port-1.effect-2 .text-desc{top: auto; bottom: -100%;}
|
||||
.port-1.effect-2:hover .text-desc{bottom: 0;}
|
||||
|
||||
.port-1.effect-3 .text-desc{top: 50%; left: 50%; width: 0; height: 0; overflow: hidden; padding: 0;}
|
||||
.port-1.effect-3:hover .text-desc{width: 100%; top: 0; left: 0; height: 100%;}
|
||||
/* effect-1 css end */
|
||||
|
||||
|
||||
|
||||
44
public/frontend/web/css/subject/specil_new.css
Executable file
44
public/frontend/web/css/subject/specil_new.css
Executable file
@@ -0,0 +1,44 @@
|
||||
.banner-title{width:54.7%; margin-left:auto; margin-right: auto; margin-top:6vw; margin-bottom: 1.1vw;}
|
||||
.special_01{background-color:rgba(173,173,173,0.2); overflow: hidden;}
|
||||
.special_01 .content{background-color:#e3e3e3; margin-top:0.5vw; margin-bottom: 0.5vw; overflow: hidden; padding-top:2vw; padding-bottom: 2vw;}
|
||||
.special_01 .content p:nth-child(1){margin-bottom: 1.2vw; position: relative;}
|
||||
.special_01 .content p:nth-child(1) img{width:103px;}
|
||||
.special_01 .content p:nth-child(1) span{position: relative; width:103px; display: block; margin-left:auto; margin-right: auto;}
|
||||
.special_01 .content p:nth-child(1):before, .special_01 .content p:nth-child(1):after{content: ''; width:50px; height: 1px; background-color:#bfbfbf; position: absolute; top:50%; margin-top:-0.5px;}
|
||||
.special_01 .content p:nth-child(1):before{left:50%; margin-left:-125px;}
|
||||
.special_01 .content p:nth-child(1):after{right:50%; margin-right: -125px;}
|
||||
.special_01 .content p:nth-child(2){width:50%; margin:auto; line-height: 1.5em;}
|
||||
@media screen and (max-width:1439px){
|
||||
.special_01 .content p:nth-child(1) img, .special_01 .content p:nth-child(1) span{width:7.15vw;}
|
||||
.special_01 .content p:nth-child(2){width:70%; margin:auto; line-height: 1.5em;}
|
||||
}
|
||||
|
||||
.special_small_title{font-size:1.5em; }
|
||||
.special_title{font-size:3.75em; color:#009fe0; margin-top:2vw;}
|
||||
.special_text{font-size:1.125em; margin-top:2.8vw; line-height: 1.8em;}
|
||||
.special_button{font-size:1.5em; background-color:#009fe0; display: inline-block; padding:0.6vw 2.5vw; margin-top:3vw;}
|
||||
|
||||
.special_02{max-width:500px; margin-top:9.5vw;}
|
||||
.special_03{max-width:500px; margin-top:8.5vw; float: right; margin-right:-2.8vw;}
|
||||
.special_04{max-width:500px; margin-top:9.4vw;}
|
||||
.special_05{max-width:500px; margin-top:8vw; float: right; margin-right:-2.8vw;}
|
||||
.special_06{max-width:430px; margin-top:10.5vw;}
|
||||
|
||||
.special_num{width:12.1vw; background-color:rgba(255,255,255,0.1); overflow: hidden; text-align: center; line-height: 2em; font-size: 1.875em; color:#FFF; position: absolute; bottom: 0;}
|
||||
.special_num_l{left:0}
|
||||
.special_num_r{right: 0;}
|
||||
@media screen and (max-width:1439px){
|
||||
.special_small_title{font-size:1.125em; }
|
||||
.special_title{font-size:3em;}
|
||||
.special_text{font-size:1em;}
|
||||
.special_button{font-size:1.125em;}
|
||||
.special_num{font-size: 1.25em}
|
||||
.special_03, .special_05{margin-right:0vw;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.special_02{max-width:390px; margin-top:6.5vw;}
|
||||
.special_03{max-width:390px; margin-top:7.5vw;}
|
||||
.special_04{max-width:390px; margin-top:6vw;}
|
||||
.special_05{max-width:390px; margin-top:4vw}
|
||||
.special_06{max-width:320px; margin-top:5.5vw;}
|
||||
}
|
||||
81
public/frontend/web/css/subject/ssd.css
Executable file
81
public/frontend/web/css/subject/ssd.css
Executable file
@@ -0,0 +1,81 @@
|
||||
.ssd_banner{top:8vw; width:100%; left:0;}
|
||||
.ssd_02{width:60%; margin:auto; }
|
||||
.ssd_02 video{width:52.04vw; max-width:996px; margin-left:auto; margin-right: auto; }
|
||||
@media screen and (min-width:1481px){
|
||||
.ssd_02_des{width:60%; margin-left:auto; margin-right: auto;}
|
||||
}
|
||||
.ssd_left{width:36%; float: left;}
|
||||
.ssd_right{width:36%; float: right;}
|
||||
.ssd_button{background-color: #fff; display: inline-block; padding:0.2vw 2vw;}
|
||||
.ssd_02 span{border-bottom:1px solid #333; display: inline-block; padding-bottom: 0.5vw; }
|
||||
.ssd_p ul{width:102%; overflow: hidden;}
|
||||
.ssd_p ul li{width:24.25%; float: left; margin-right: 1%; max-width:348px; }
|
||||
.ssd_p ul li img{width:100%;}
|
||||
.ssd_p ul li:last-child{margin-right: 0;}
|
||||
.ssd_p .title{width:96%; top:6%;left:2%;}
|
||||
.ssd_p .capacity{text-align: center; top:82%; width:100%}
|
||||
@media screen and (min-width:1480px){
|
||||
.ssd_p .capacity .c_span{display: inline-block; margin-left:1%; margin-right: 1%; border:1px solid #d6d6d6; width:15%; font-size: 0.875em;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.ssd_p .capacity .c_span{display: inline-block; margin-left:1%; margin-right: 1%; border:1px solid #d6d6d6; padding-left:1%; padding-right: 1%; font-size: 0.875em;}
|
||||
}
|
||||
.ssd_buy_button{width:100%; margin-top:1.2vw;}
|
||||
.ssd_buy_button a{padding-left: 5%;padding-right: 5%;height: 2em;margin-left: 2%;margin-right: 4%;border: 1px solid #5c5c5c;display: inline-block;line-height: 2em;color: #333;font-size: 1em;}
|
||||
.ssd_buy_button a:hover{background-color:#009fe0; color:#FFF; border:1px solid transparent; }
|
||||
.ssd_08{background:url("../../images/ssd/ssd_08.jpg") 100% 100%;}
|
||||
.ssd_08 i{border-bottom: 2px solid #333; padding-bottom: 0.2vw; }
|
||||
.font-48{line-height: 1.35em;}
|
||||
.font-18{line-height: 1.75em;}
|
||||
|
||||
/*SSD外置产品列表*/
|
||||
.ssd_p_three ul{width:102%; overflow: hidden;}
|
||||
.ssd_p_three ul li{width:31.875%; float: left; margin-right: 2.1875%; max-width:460px; margin-bottom: 2.1875%;}
|
||||
.ssd_p_three ul li img{width:100%;}
|
||||
.ssd_p_three ul li:nth-child(3n){margin-right: 0;}
|
||||
.ssd_p_three .font-30{line-height: 1.2em;}
|
||||
.ssd_p_three .title{width:96%; top:3.3vw;left:2%;}
|
||||
.ssd_p_three .capacity{text-align: center; top:72%; width:100%}
|
||||
.ssd_p_three .capacity .c_span{display: inline-block; margin-left:1%; margin-right: 1%; border:1px solid #d6d6d6; width:15%; font-size: 0.875em;}
|
||||
@media screen and (max-width:1480px){
|
||||
.ssd_02{width:80%;}
|
||||
.ssd_02_des{width:80%; margin-left:auto; margin-right: auto;}
|
||||
}
|
||||
@media screen and (max-width:1280px){
|
||||
.padding-t-80{padding-top:3vw;}
|
||||
.margin-t-50{margin-top:2vw;}
|
||||
.ssd_left{width:50%; float: left;}
|
||||
.ssd_right{width:40%; float: right;}
|
||||
.margin-t-66{margin-top:1.5vw;}
|
||||
}
|
||||
.ssd_p ul li:hover, .ssd_p_three ul li:hover{box-shadow: 5px 5px 10px rgba(0,0,0,0.2)}
|
||||
|
||||
/*外置SSD视频*/
|
||||
.ssd_video{position: absolute; left:0; width:100%;}
|
||||
.ssd_video .left{width:29%; float: left; margin-right:3%; }
|
||||
.ssd_video .right{width:68%; float: right;}
|
||||
@media screen and (min-width:1460px){
|
||||
.ssd_video{position: absolute; top:50%; left:0; width:100%;}
|
||||
.ssd_video .swt-Container{margin-top:-275px;}
|
||||
}
|
||||
@media screen and (max-width:1459px){
|
||||
.ssd_video{position: absolute; top:4vw; left:0; width:100%;}
|
||||
}
|
||||
@media screen and (max-width:990px){
|
||||
.ssd_video{position: absolute; top:2.5vw; left:0; width:100%;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
15
public/frontend/web/css/subject/stripe.css
Executable file
15
public/frontend/web/css/subject/stripe.css
Executable file
@@ -0,0 +1,15 @@
|
||||
.banner{top:8.8vw; width:100%;}
|
||||
.banner_subtitle{background-color:#344558; display: inline-block; padding:0.3vw 0.8vw 0.4vw;}
|
||||
.banner_text{margin-left:2.5vw;}
|
||||
|
||||
.stripe_left{width:36%; float: left;}
|
||||
.stripe_right{width:38%; float: right;}
|
||||
.font-18{line-height: 1.75em;}
|
||||
.stripe_button{background-color: #344558; display: inline-block; padding:0.3vw 2.2vw 0.4vw; color:#FFF;}
|
||||
/*产品列表背景*/
|
||||
.stripe_product_bg{background: url("../../images/ssd/ssd_08.jpg") 100% 100%; overflow: hidden; padding-bottom: 5.5vw; padding-top:5vw;}
|
||||
.stripe_subtitle{border-bottom: 2px solid #333; padding-bottom: 0.2vw;}
|
||||
@media screen and (max-width:1200px){
|
||||
.stripe_left{width:42%; float: left;}
|
||||
.stripe_right{width:42%; float: right;}
|
||||
}
|
||||
32
public/frontend/web/css/subject/thunderbolt_3.css
Executable file
32
public/frontend/web/css/subject/thunderbolt_3.css
Executable file
@@ -0,0 +1,32 @@
|
||||
.thunderbolt_3_banner{position: absolute; top:0; width:100%;}
|
||||
.thunderbolt_3_banner .content{margin-top:12vw; width:73.9vw; margin-left:auto; margin-right: auto;}
|
||||
.thunderbolt_3_banner .content .title{font-style: italic;}
|
||||
.thunderbolt_3_one{width:100%; margin-top:7vw;}
|
||||
.thunderbolt_3_one .left{width:26%; float: left; margin-right: 4.9027%;}
|
||||
.thunderbolt_3_one .right{width:69.0973%; float: left;}
|
||||
.thunderbolt_3_two{margin-top:15.8vw; width:40%;}
|
||||
.thunderbolt_3_three{padding-top:3.5vw; padding-bottom: 4vw;}
|
||||
.thunderbolt_3_three ul{margin-top:4vw;}
|
||||
.subject_three_list .subject_new_buy{position: absolute; bottom: 2.4vw; width:100%;}
|
||||
.thunderbolt_3_four{margin-top:12vw; width:40%;}
|
||||
.solid_blue{border-top:5px solid #009fe0; background-color:#FFF; position: relative;}
|
||||
.thunderbolt_3_five{position: absolute; left:9.5vw; top:4.8958vw; }
|
||||
.thunderbolt_3_six{width:40%; margin:6.5vw auto;}
|
||||
@media screen and (max-width:1400px){
|
||||
.thunderbolt_3_one{margin-top:4.5vw;}
|
||||
.thunderbolt_3_six{width:60%;}
|
||||
}
|
||||
.font-18{line-height: 1.8em;}
|
||||
.thunderbolt_3_seven{background-color:#f2f2f2; overflow: hidden;}
|
||||
.intel{position: absolute; top:10px; width:100%;}
|
||||
@media screen and (min-width:1480px){
|
||||
.intel_left{margin-left:200px;}
|
||||
}
|
||||
@media screen and (max-width:1479px){
|
||||
.intel{top:5px}
|
||||
.intel_left{margin-left:16vw; width:5.6757%}
|
||||
.intel_left img{width:100%; margin-top:15%;}
|
||||
}
|
||||
@media screen and (max-width:959px){
|
||||
.intel{display: none;}
|
||||
}
|
||||
149
public/frontend/web/css/subject/transparent.css
Executable file
149
public/frontend/web/css/subject/transparent.css
Executable file
@@ -0,0 +1,149 @@
|
||||
/*公共样式*/
|
||||
.transparent_title{font-size: 3em; line-height: 1.5em;}
|
||||
.transparent_subtitle{font-size: 1.75em; margin-top:5%; line-height: 1.5em;}
|
||||
.transparent_text{font-size: 1em; margin-top:1.8%; padding-top: 2em; line-height: 1.8em;}
|
||||
@media screen and (max-width:1440px){
|
||||
.transparent_title{font-size: 2.125em; line-height: 1.3em;}
|
||||
.transparent_subtitle{font-size: 1.5em; margin-top:2%; line-height: 1.5em;}
|
||||
.transparent_text{font-size: 1em; margin-top:2%; line-height: 1.8em;}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.transparent_title{font-size: 2em; line-height: 1.3em;}
|
||||
.transparent_subtitle{font-size: 1.125em; margin-top:2%; line-height: 1.5em;}
|
||||
.transparent_text{font-size: 0.9em; margin-top:2%; line-height: 1.8em;}
|
||||
}
|
||||
@media screen and (max-width:1024px){
|
||||
.transparent_text{display: none;}
|
||||
}
|
||||
/*第一屏*/
|
||||
.transparent_01{position: absolute; width:100%; color:#FFF; top:17%; font-size: 2em}
|
||||
.transparent_01 .title{font-size: 2.125em; line-height: 2.5em;}
|
||||
.transparent_01 .text{font-size: 1em;}
|
||||
@media screen and (max-width:1440px){
|
||||
.transparent_01{font-size: 1.5em}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.transparent_01{font-size: 1em; top:10%; left:5%;}
|
||||
.transparent_01 .title{line-height: 1.875em;}
|
||||
}
|
||||
/*第二屏*/
|
||||
.transparent_02_bg{width:100%; background:url(../../images/transparent/transparent_02.jpg) no-repeat; padding-top:5%; padding-bottom: 5%; overflow: hidden;}
|
||||
.transparent_02{width:100%;}
|
||||
.transparent_02 .left{width:29%; float: left;}
|
||||
.transparent_02 .right{width:69%; float: right; position: relative}
|
||||
.transparent_02 .right img{opacity: 0;}
|
||||
@media screen and (max-width:768px){
|
||||
.transparent_02 .left{width:100%; text-align: center; margin-bottom: 3%;}
|
||||
.transparent_02 .right{width:100%; float: left; }
|
||||
}
|
||||
.transparent_02 video{position: absolute; top:0; left:0; width:100%; }
|
||||
/*第三屏*/
|
||||
.transparent_03{position: absolute; top:11.5%; width:100%;}
|
||||
.transparent_03_alltext{width:46%;}
|
||||
@media screen and (max-width:768px){
|
||||
.transparent_03_alltext{width:90%;}
|
||||
|
||||
}
|
||||
.transparent_03 .transparent_subtitle{margin-top:3.5%}
|
||||
/*第四屏*/
|
||||
.transparent_04{position: absolute; top:30%; width:100%;}
|
||||
.transparent_04_alltext{width:34%;}
|
||||
|
||||
/*第五屏*/
|
||||
.transparent_05{position: absolute; top:12%; width:100%;}
|
||||
.transparent_05_alltext{width:27%; float:right; text-right:right; margin-right:10%;}
|
||||
|
||||
/*第六屏*/
|
||||
.transparent_06_text{font-size: 1.25em; color:#333333;}
|
||||
.transparent_06{background-color:#f2f2f2; overflow: hidden; padding-top:3.5%; padding-bottom: 3.5%;}
|
||||
.transparent_06_four{width:100%; margin-top:3%;}
|
||||
.transparent_06_two{width:100%;}
|
||||
.transparent_06_four li{width:24.1%; margin-right:1.2%; float: left; position: relative; overflow: hidden; margin-bottom: 3.5%;}
|
||||
.transparent_06_four li:hover{box-shadow: 0px 5px 15px rgba(0,0,0,0.2)}
|
||||
.transparent_06_four .text{position: absolute; width:96%; text-align: center; top:14%; left:2%}
|
||||
@media screen and (min-width:461px){
|
||||
.transparent_06_four li .transparent_buy{position: absolute; bottom:-30%;}
|
||||
.transparent_06_four li:hover .transparent_buy{display: none; background-color:rgba(255,255,255,0.5); overflow: hidden; position: absolute; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
|
||||
}
|
||||
.transparent_buy .transparent_buy_button{position: relative; top:50%; margin-top:-1.5em; width:100%; text-align: center;}
|
||||
.transparent_buy a{padding-left:5%; padding-right:5%; height: 2em; margin-left:2%; margin-right:2%; border:1px solid #5c5c5c; display: inline-block; line-height: 2em; color:#333; font-size: 1em; }
|
||||
.transparent_buy a:hover{background-color:#009fe0; color:#FFF; border:1px solid transparent; }
|
||||
.transparent_06_four li:hover .transparent_buy{display: block;}
|
||||
|
||||
.transparent_06_two li{width:49.3%; margin-right:1.2%; float: left; position: relative; margin-bottom: 2%}
|
||||
.transparent_06_two li:last-child{margin-right: 0;}
|
||||
.transparent_06_two .all_text{position: absolute; top:27%; left:5%; width:50%;}
|
||||
.transparent_06_two .title, .transparent_06_one .title{margin-bottom: 5%;}
|
||||
.transparent_06_two .subtitle, .transparent_06_one .subtitle{font-size: 1.25em; color:#333333; margin-bottom: 10%;}
|
||||
.transparent_06_two .transparent_buy a, .transparent_06_one .transparent_buy a{margin-left:0;}
|
||||
|
||||
.transparent_06_one{width:100%; position: relative; overflow: hidden; background-color:#FFF; margin-bottom: 2.5%;}
|
||||
.transparent_06_one .all_text{position: absolute; top:26%; left:10%; width:30%;}
|
||||
@media screen and (min-width:991px){
|
||||
.transparent_06_four li:nth-child(4n){margin-right:0;}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1400px){
|
||||
.transparent_06_text{font-size: 1.2em}
|
||||
.transparent_buy a{font-size: 1em;}
|
||||
.transparent_06_two .subtitle, .transparent_06_one .subtitle{font-size: 1em;}
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:990px){
|
||||
.transparent_06_four li{width:32%; margin-right:2%}
|
||||
.transparent_06_four li:nth-child(3n){margin-right:0px;}
|
||||
.transparent_06_two li:last-child{margin-right: 0;}
|
||||
|
||||
}
|
||||
@media screen and (min-width:768px) and (max-width:960px){
|
||||
.transparent_06_two .subtitle, .transparent_06_one .subtitle{display: none;}
|
||||
.transparent_06_two .transparent_buy, .transparent_06_one .transparent_buy{margin-top:15%;}
|
||||
}
|
||||
@media screen and (max-width:767px){
|
||||
.transparent_06_four li{width:46%; margin-left:2%; margin-right:2%;}
|
||||
.transparent_06_four li:nth-child(2n){margin-right:0}
|
||||
.transparent_06_two li{width:96%; margin-left:2%; margin-right:2%;}
|
||||
.transparent_06_one{width:96%; margin-left:auto; margin-right: auto;}
|
||||
.transparent_06_one .all_text{left:5%; width:50%; top:20%;}
|
||||
.transparent_06_two .title, .transparent_06_one .title{margin-bottom: 5%;}
|
||||
.transparent_06_one .subtitle{margin-bottom: 5%; display: none;}
|
||||
|
||||
.transparent_06_four li{background-color:#FFF; overflow: visible;}
|
||||
|
||||
}
|
||||
@media screen and (max-width:460px){
|
||||
.transparent_buy a{margin-left:1.5%; margin-right:1.5%; padding-left:3%; padding-right: 3%;}
|
||||
.transparent_06_four .text{top:8%;}
|
||||
.transparent_06_one .all_text{top:12%;}
|
||||
.transparent_06_four li .transparent_buy{bottom: 0;}
|
||||
.transparent_06_two .subtitle{display: none;}
|
||||
.transparent_06_four li .transparent_buy{height: 20%;}
|
||||
.transparent_06_four li:hover .transparent_buy{height: 20%;}
|
||||
.transparent_06_four li .transparent_buy{margin-bottom:1em}
|
||||
.transparent_06_four li:hover .transparent_buy{margin-bottom:1em}
|
||||
|
||||
}
|
||||
@media screen and (min-width:461px) and (max-width:768px){
|
||||
.transparent_06_four li .transparent_buy{overflow: hidden; position: absolute; bottom:0px; width:100%; height: 30%; transition: 0.5s;}
|
||||
.transparent_06_four li .transparent_buy{height: 16%;}
|
||||
.transparent_06_four li:hover .transparent_buy{height: 16%;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
15
public/frontend/web/css/swiper-3.4.2.min.css
vendored
Executable file
15
public/frontend/web/css/swiper-3.4.2.min.css
vendored
Executable file
File diff suppressed because one or more lines are too long
12
public/frontend/web/css/swiper.min.css
vendored
Executable file
12
public/frontend/web/css/swiper.min.css
vendored
Executable file
File diff suppressed because one or more lines are too long
48
public/frontend/web/css/tipso.min.css
vendored
Executable file
48
public/frontend/web/css/tipso.min.css
vendored
Executable file
@@ -0,0 +1,48 @@
|
||||
.tipso_bubble,
|
||||
.tipso_bubble > .tipso_arrow {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.tipso_bubble {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
z-index: 9999;
|
||||
padding: 10px;
|
||||
}
|
||||
.tipso_style {
|
||||
cursor: help;
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
.tipso_bubble > .tipso_arrow {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 8px solid;
|
||||
pointer-events: none;
|
||||
}
|
||||
.tipso_bubble.top > .tipso_arrow {
|
||||
border-color: #000 transparent transparent;
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
margin-left: -8px;
|
||||
}
|
||||
.tipso_bubble.bottom > .tipso_arrow {
|
||||
border-color: transparent transparent #000;
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
margin-left: -8px;
|
||||
}
|
||||
.tipso_bubble.left > .tipso_arrow {
|
||||
border-color: transparent transparent transparent #000;
|
||||
top: 50%;
|
||||
left: 100%;
|
||||
margin-top: -8px;
|
||||
}
|
||||
.tipso_bubble.right > .tipso_arrow {
|
||||
border-color: transparent #000 transparent transparent;
|
||||
top: 50%;
|
||||
right: 100%;
|
||||
margin-top: -8px;
|
||||
}
|
||||
BIN
public/frontend/web/images/Thumbs.db
Executable file
BIN
public/frontend/web/images/Thumbs.db
Executable file
Binary file not shown.
BIN
public/frontend/web/images/UFO/UFO-02.gif
Executable file
BIN
public/frontend/web/images/UFO/UFO-02.gif
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
public/frontend/web/images/UFO/mobile/UFO-02.gif
Executable file
BIN
public/frontend/web/images/UFO/mobile/UFO-02.gif
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 MiB |
BIN
public/frontend/web/images/headset/set_RP1.webm
Executable file
BIN
public/frontend/web/images/headset/set_RP1.webm
Executable file
Binary file not shown.
BIN
public/frontend/web/images/home/home-video.webm
Executable file
BIN
public/frontend/web/images/home/home-video.webm
Executable file
Binary file not shown.
578
public/frontend/web/index - 10-11.shtml
Executable file
578
public/frontend/web/index - 10-11.shtml
Executable file
@@ -0,0 +1,578 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!--#include file="include/head.html" -->
|
||||
<script type="text/javascript">
|
||||
var navID = "1";
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<!--top-->
|
||||
<!--#include file="include/top.html" -->
|
||||
<!--top End-->
|
||||
|
||||
<!-- 在线客服 s -->
|
||||
<div class="suspension">
|
||||
<div class="suspension-box">
|
||||
<a href="#" class="a a-service">
|
||||
<i class="l1"></i><p>QQ联系</p>
|
||||
</a>
|
||||
<a href="javascript:;" class="a a-qrcode">
|
||||
<i class="l2"></i><p>微信联系</p>
|
||||
</a>
|
||||
<a href="javascript:;" class="a a-acart">
|
||||
<i class="l3"></i><p>公司邮箱</p>
|
||||
</a>
|
||||
<a href="javascript:;" class="a a-service-phone" style="border-bottom:1px solid #f1f1f1;">
|
||||
<i class="l4"></i><p>联系客服</p>
|
||||
</a>
|
||||
<a href="javascript:;" class="a a-top" style="border-bottom:1px solid #f1f1f1;margin-top:10px;">
|
||||
<i class="l5"></i><p>返回顶部</p>
|
||||
</a>
|
||||
<div class="d d-service-phone">
|
||||
<i class="arrow"></i>
|
||||
<div class="inner-box">
|
||||
<div class="d-service-item clearfix">
|
||||
<span class="circle"><i class="i-tel"></i></span>
|
||||
<div class="text">
|
||||
<p>免费服务热线</p>
|
||||
<p class="number">400-0031-581</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-service-intro clearfix">
|
||||
<p>客服电话:13549637410</p>
|
||||
<p>客服电话:15616423106</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d d-qrcode">
|
||||
<i class="arrow"></i>
|
||||
<div class="inner-box">
|
||||
<div class="qrcode-img"><img src="images/wx.png" alt="元创二维码"></div>
|
||||
<p>更多惊喜请加微信</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="show">
|
||||
<div class="w1440 smask">
|
||||
<div class="w1200 sarea">
|
||||
<div class="stop1">
|
||||
<span>反馈信息</span>
|
||||
<a href="javascript:;" class="cha"><img src="images/images/cha.png"></a>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div class="feed">
|
||||
<div class="finput">
|
||||
<label>反馈类型:</label>
|
||||
<select>
|
||||
<option>ss</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="finput">
|
||||
<label>您的称呼:</label>
|
||||
<input type="text" name="" value="">
|
||||
</div>
|
||||
<div class="finput">
|
||||
<label>反馈主题:</label>
|
||||
<input type="text" name="" value="" class="them">
|
||||
</div>
|
||||
<div class="finput">
|
||||
<label class="fla">反馈内容:</label>
|
||||
<textarea></textarea>
|
||||
</div>
|
||||
<div class="finput">
|
||||
<label class="fla">联系方式:</label>
|
||||
<select class="emal">
|
||||
<option>E-mail</option>
|
||||
</select>
|
||||
<input type="text" name="" value="wangbin@163.com" class="them1">
|
||||
</div>
|
||||
<div class="finput">
|
||||
<label>验证码:</label>
|
||||
<input type="text" name="" value="">
|
||||
<a href="javascript:;" class="yzm"><img src="images/images/yzm.png"></a>
|
||||
</div>
|
||||
<a href="javascript:;" class="feda">发送</a>
|
||||
<a href="javascript:;" class="feda">重置</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function(){
|
||||
/* ----- 侧边悬浮 ---- */
|
||||
$(document).on("mouseenter", ".suspension .a", function(){
|
||||
var _this = $(this);
|
||||
var s = $(".suspension");
|
||||
var isService = _this.hasClass("a-service");
|
||||
var isServicePhone = _this.hasClass("a-service-phone");
|
||||
var isQrcode = _this.hasClass("a-qrcode");
|
||||
if(isService){ s.find(".d-service").show().siblings(".d").hide();}
|
||||
if(isServicePhone){ s.find(".d-service-phone").show().siblings(".d").hide();}
|
||||
if(isQrcode){ s.find(".d-qrcode").show().siblings(".d").hide();}
|
||||
});
|
||||
$(document).on("mouseleave", ".suspension, .suspension .a-top", function(){
|
||||
$(".suspension").find(".d").hide();
|
||||
});
|
||||
$(document).on("mouseenter", ".suspension .a-top", function(){
|
||||
$(".suspension").find(".d").hide();
|
||||
});
|
||||
$(document).on("click", ".suspension .a-top", function(){
|
||||
$("html,body").animate({scrollTop: 0});
|
||||
});
|
||||
$(window).scroll(function(){
|
||||
var st = $(document).scrollTop();
|
||||
var $top = $(".suspension .a-top");
|
||||
if(st > 400){
|
||||
$top.css({display:'block'});
|
||||
}else{
|
||||
if ($top.is(":visible")) {
|
||||
$top.show();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$(".a-acart").click(function(){
|
||||
$(".show").show();
|
||||
})
|
||||
|
||||
$(".cha").click(function(){
|
||||
$(".show").hide();
|
||||
})
|
||||
|
||||
});
|
||||
</script>
|
||||
<!-- 在线客服 e -->
|
||||
|
||||
<!-- 轮播 s -->
|
||||
<div class="homeban">
|
||||
<div class="hd">
|
||||
<ul><li>1</li><li>2</li><li>3</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><a href=""><img src="uploadfiles/image/ban1.jpg"/></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/ban1.jpg"/></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/ban1.jpg"/></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
jQuery(".homeban").slide({mainCell:".bd ul",autoPlay:true,delayTime:3000});
|
||||
</script>
|
||||
|
||||
<!-- phone s-->
|
||||
<div class="swiper-container deimg">
|
||||
<div class="swiper-wrapper">
|
||||
<div class="swiper-slide"><a href=""><img src="uploadfiles/image/ban1.jpg"></a></div>
|
||||
<div class="swiper-slide"><a href=""><img src="uploadfiles/image/ban1.jpg"></a></div>
|
||||
<div class="swiper-slide"><a href=""><img src="uploadfiles/image/ban1.jpg"></a></div>
|
||||
</div>
|
||||
<!-- Add Pagination -->
|
||||
<div class="swiper-pagination bandot"></div>
|
||||
</div>
|
||||
<script>
|
||||
var swiper = new Swiper('.deimg', {
|
||||
loop: true,
|
||||
autoplay:true,
|
||||
pagination:{
|
||||
el: '.bandot',
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<!-- phone e -->
|
||||
<!-- 轮播 e -->
|
||||
|
||||
<!-- 品类探索 s -->
|
||||
<div class="indexbox1 home1">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.3s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">品类探索</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="pinpai">
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><a href="一级列表.shtml"><i class="p1"></i>电脑周边</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p2"></i>手机周边</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p3"></i>电子电工</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p4"></i>影音娱乐</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p5"></i>个人护理</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p6"></i>生活周边</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p7"></i>合金桌面</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
jQuery(".pinpai").slide({});
|
||||
</script>
|
||||
|
||||
<!-- 品牌探索手机端 s -->
|
||||
<div class="History">
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><a href="一级列表.shtml">电脑周边</a></li>
|
||||
<li><a href="一级列表.shtml">手机周边</a></li>
|
||||
<li><a href="一级列表.shtml">电子电工</a></li>
|
||||
<li><a href="一级列表.shtml">影音娱乐</a></li>
|
||||
<li><a href="一级列表.shtml">个人护理</a></li>
|
||||
<li><a href="一级列表.shtml">生活周边</a></li>
|
||||
<li><a href="一级列表.shtml">合金桌面</a></li>
|
||||
</ul>
|
||||
<a class="prev"><img src="images/bfl.png"></a>
|
||||
<a class="next"><img src="images/brh.png"></a>
|
||||
</div>
|
||||
<!-- Add Arrows -->
|
||||
<script>
|
||||
jQuery(".History .hd").slide({ mainCell:"ul",autoPlay:false,effect:"left", vis:6, scroll:1, autoPage:false ,prevCell:".prev",nextCell:".next"});
|
||||
$(".History").slide({defaultIndex:0,});
|
||||
</script>
|
||||
</div>
|
||||
<!-- 品牌探索手机端 e -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- 品类探索 e -->
|
||||
|
||||
<!-- 元创动力产业园 s -->
|
||||
<div class="indexbox2 home2">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.5s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">元创动力产业园</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="cy">
|
||||
<p class="cytit">元创动力是ORICO搭建的互联网+创新产业园区</p>
|
||||
<div class="cytext">拥有专研USB技术应用的技术研发中心,同时拥有7大全供应链生产工厂支撑整个集团的自主研发与生产。同时为实现资源利用最大化,组建起帮助更多中小型企业实现技术生产的OEM/ODM全案部门,对外承接相关业务,并提供特色“211”服务,以响应瞬息万变的市场需求</div>
|
||||
</div>
|
||||
<ul class="cyul">
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="cycon">
|
||||
<div class="cyimg"><img src="uploadfiles/image/cy1.jpg"></div>
|
||||
<div class="cytitle">
|
||||
<p class="cy1">品牌ODM服务</p>
|
||||
<p class="cy2">两周研发一周生产的211服务速度</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="cycon">
|
||||
<div class="cyimg"><img src="uploadfiles/image/cy2.jpg"></div>
|
||||
<div class="cytitle">
|
||||
<p class="cy1">集团技术研发中心</p>
|
||||
<p class="cy2">新技术追踪钻研的力量</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="cycon">
|
||||
<div class="cyimg"><img src="uploadfiles/image/cy2.jpg"></div>
|
||||
<div class="cytitle">
|
||||
<p class="cy1">集团产业链</p>
|
||||
<p class="cy2">研发、设计、生产的全产业链实力</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<div class="clear"></div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 元创动力产业园 e -->
|
||||
|
||||
<!-- 价值与使命 s -->
|
||||
<div class="indexbox1">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.7s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">价值与使命</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<ul class="value">
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v1.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">我们的使命</p>
|
||||
<p class="va2">ORICO誓成为一个不断探索USB技术,从而赋能人们的美好生活的有价值的伟大品牌。</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v2.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">文化与价值观</p>
|
||||
<p class="va2">在ORICO,推崇着求真务实不冒进,开拓思维不拘束,积跬步以致千里,聚小变以成大新的理念……</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v3.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">历史与发展</p>
|
||||
<p class="va2">ORICO创立于2009年,创始人徐业友先生在设立之初,主要希望通过……</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v4.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">社会责任与公共关系</p>
|
||||
<p class="va2">ORICO携多款创新科技产品,再度亮相台北电脑展。据悉……</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<div class="clear"></div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 价值与使命 e -->
|
||||
|
||||
<!-- 聆听 s -->
|
||||
<div class="indexbox3">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.9s">
|
||||
<div class="ltfl">
|
||||
<div class="ltbg"><img src="images/lt.png"></div>
|
||||
<div class="ltcon">
|
||||
<div class="lt1"><p><span>聆听</span>用户心声,见证改变力量</p></div>
|
||||
<div class="lttext">元创至今已沐风栉雨闯过9年,9年来,元创从零开始,到如今产业全线铺开,发展之势一片蓬勃,都离不开用户的支持、伙伴们的协助。长久以来,用户的心声对于我们的前行,起着至关重要的作用,成为了我们改变突破的动力,也是我们掌舵航行的灯塔。</div>
|
||||
<div class="ljt"><a href=""><img src="images/ljt.png"></a></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ltrh">
|
||||
<a href="#"><img src="uploadfiles/image/ltban.jpg"></a>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 聆听 e -->
|
||||
|
||||
<!-- 新闻资讯 s -->
|
||||
<div class="indexbox1">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.9s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">新闻资讯</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="newBox">
|
||||
<div class="owl-carousel">
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new1.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携星际云存储正式入军区块链, IPFS系统加持轰响第一...</p>
|
||||
<p class="new2">2018.06.17</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new2.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">可能是台北电脑展最全的充电外设展示</p>
|
||||
<p class="new2">2018.06.06</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new3.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携多款新型科技产品再次亮相 环球资源消费电子展</p>
|
||||
<p class="new2">2018.04.23</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new3.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携星际云存储正式入军区块链, IPFS系统加持轰响第一...</p>
|
||||
<p class="new2">2018.06.17</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new2.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">可能是台北电脑展最全的充电外设展示</p>
|
||||
<p class="new2">2018.06.06</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new1.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携多款新型科技产品再次亮相 环球资源消费电子展</p>
|
||||
<p class="new2">2018.04.23</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var owl = $(".newBox .owl-carousel");
|
||||
owl.owlCarousel({
|
||||
autoplay:true,
|
||||
navigationText: ["",""],
|
||||
responsive:{
|
||||
0:{
|
||||
items:1,
|
||||
margin:0
|
||||
},
|
||||
640:{
|
||||
items:2,
|
||||
margin:0,
|
||||
smartSpeed:80,
|
||||
dots:false
|
||||
},
|
||||
998:{
|
||||
items:3,
|
||||
margin:0,
|
||||
smartSpeed:80,
|
||||
dots:false
|
||||
},
|
||||
|
||||
},
|
||||
})
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 新闻资讯 e -->
|
||||
|
||||
<!-- 合作伙伴 s -->
|
||||
<div class="indexbox2">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.9s"">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">他们选择了ORICO</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="hz">
|
||||
<ul>
|
||||
<li><a href=""><img src="uploadfiles/image/h1.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h2.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h3.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h4.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h5.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h6.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h7.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h8.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h9.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h10.jpg"></a></li>
|
||||
<div class="clear"></div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 合作伙伴 e -->
|
||||
|
||||
<!-- bottom s -->
|
||||
<!--#include file="include/bottom.html" -->
|
||||
<!-- bottom e -->
|
||||
</body>
|
||||
</html>
|
||||
422
public/frontend/web/index.shtml
Executable file
422
public/frontend/web/index.shtml
Executable file
@@ -0,0 +1,422 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!--#include file="include/head.html" -->
|
||||
<script type="text/javascript">
|
||||
var navID = "1";
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<!--top-->
|
||||
<!--#include file="include/top.html" -->
|
||||
<!--top End-->
|
||||
<!-- 轮播 s -->
|
||||
<div class="homeban">
|
||||
<div class="hd">
|
||||
<ul><li>1</li><li>2</li><li>3</li></ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li><a href=""><img src="uploadfiles/image/ban1.jpg"/></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/ban1.jpg"/></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/ban1.jpg"/></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
jQuery(".homeban").slide({mainCell:".bd ul",autoPlay:true,delayTime:3000});
|
||||
</script>
|
||||
<!-- 轮播 e -->
|
||||
|
||||
<!-- 品类探索 s -->
|
||||
<div class="indexbox1 home1">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.3s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">品类探索</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="pinpai">
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><a href="一级列表.shtml"><i class="p1"></i>电脑周边</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p2"></i>手机周边</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p3"></i>电子电工</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p4"></i>影音娱乐</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p5"></i>个人护理</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p6"></i>生活周边</a></li>
|
||||
<li><a href="一级列表.shtml"><i class="p7"></i>合金桌面</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
jQuery(".pinpai").slide({});
|
||||
</script>
|
||||
|
||||
<!-- 品牌探索手机端 s -->
|
||||
<div class="History">
|
||||
<div class="bd">
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>
|
||||
<img src="uploadfiles/image/p1.jpg" class="pban">
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div class="hd">
|
||||
<ul>
|
||||
<li><a href="一级列表.shtml">电脑周边</a></li>
|
||||
<li><a href="一级列表.shtml">手机周边</a></li>
|
||||
<li><a href="一级列表.shtml">电子电工</a></li>
|
||||
<li><a href="一级列表.shtml">影音娱乐</a></li>
|
||||
<li><a href="一级列表.shtml">个人护理</a></li>
|
||||
<li><a href="一级列表.shtml">生活周边</a></li>
|
||||
<li><a href="一级列表.shtml">合金桌面</a></li>
|
||||
</ul>
|
||||
<a class="prev"><img src="images/bfl.png"></a>
|
||||
<a class="next"><img src="images/brh.png"></a>
|
||||
</div>
|
||||
<!-- Add Arrows -->
|
||||
<script>
|
||||
jQuery(".History .hd").slide({ mainCell:"ul",autoPlay:false,effect:"left", vis:6, scroll:1, autoPage:false ,prevCell:".prev",nextCell:".next"});
|
||||
$(".History").slide({defaultIndex:0,});
|
||||
</script>
|
||||
</div>
|
||||
<!-- 品牌探索手机端 e -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- 品类探索 e -->
|
||||
|
||||
<!-- 元创动力产业园 s -->
|
||||
<div class="indexbox2 home2">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.5s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">元创动力产业园</p>
|
||||
<p class="comline"><img src="images/wline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="cy">
|
||||
<p class="cytit">元创动力是ORICO搭建的互联网+创新产业园区</p>
|
||||
<div class="cytext">拥有专研USB技术应用的技术研发中心,同时拥有7大全供应链生产工厂支撑整个集团的自主研发与生产。同时为实现资源利用最大化,组建起帮助更多中小型企业实现技术生产的OEM/ODM全案部门,对外承接相关业务,并提供特色“211”服务,以响应瞬息万变的市场需求</div>
|
||||
</div>
|
||||
<ul class="cyul">
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="cycon">
|
||||
<div class="cyimg"><img src="uploadfiles/image/cy1.jpg"></div>
|
||||
<div class="cytitle">
|
||||
<p class="cy1">品牌ODM服务</p>
|
||||
<p class="cy2">两周研发一周生产的211服务速度</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="cycon">
|
||||
<div class="cyimg"><img src="uploadfiles/image/cy2.jpg"></div>
|
||||
<div class="cytitle">
|
||||
<p class="cy1">集团技术研发中心</p>
|
||||
<p class="cy2">新技术追踪钻研的力量</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="cycon">
|
||||
<div class="cyimg"><img src="uploadfiles/image/cy2.jpg"></div>
|
||||
<div class="cytitle">
|
||||
<p class="cy1">集团产业链</p>
|
||||
<p class="cy2">研发、设计、生产的全产业链实力</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<div class="clear"></div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 元创动力产业园 e -->
|
||||
|
||||
<!-- 价值与使命 s -->
|
||||
<div class="indexbox1">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.7s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">价值与使命</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<ul class="value">
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v1.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">我们的使命</p>
|
||||
<p class="va2">ORICO誓成为一个不断探索USB技术,从而赋能人们的美好生活的有价值的伟大品牌。</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v2.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">文化与价值观</p>
|
||||
<p class="va2">在ORICO,推崇着求真务实不冒进,开拓思维不拘束,积跬步以致千里,聚小变以成大新的理念……</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v3.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">历史与发展</p>
|
||||
<p class="va2">ORICO创立于2009年,创始人徐业友先生在设立之初,主要希望通过……</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">
|
||||
<div class="vacon">
|
||||
<div class="vaimg"><img src="uploadfiles/image/v4.jpg"></div>
|
||||
<div class="vatext">
|
||||
<p class="va1">社会责任与公共关系</p>
|
||||
<p class="va2">ORICO携多款创新科技产品,再度亮相台北电脑展。据悉……</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<div class="clear"></div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 价值与使命 e -->
|
||||
|
||||
<!-- 聆听 s -->
|
||||
<div class="indexbox3">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.9s">
|
||||
<div class="ltfl">
|
||||
<div class="ltbg"><img src="images/lt.png"></div>
|
||||
<div class="ltcon">
|
||||
<div class="lt1"><p><span>聆听</span>用户心声,见证改变力量</p></div>
|
||||
<div class="lttext">元创至今已沐风栉雨闯过9年,9年来,元创从零开始,到如今产业全线铺开,发展之势一片蓬勃,都离不开用户的支持、伙伴们的协助。长久以来,用户的心声对于我们的前行,起着至关重要的作用,成为了我们改变突破的动力,也是我们掌舵航行的灯塔。</div>
|
||||
<div class="ljt"><a href=""><img src="images/ljt.png"></a></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ltrh">
|
||||
<a href="#"><img src="uploadfiles/image/ltban.jpg"></a>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 聆听 e -->
|
||||
|
||||
<!-- 新闻资讯 s -->
|
||||
<div class="indexbox1">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.9s">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">新闻资讯</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="newBox">
|
||||
<div class="owl-carousel">
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new1.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携星际云存储正式入军区块链, IPFS系统加持轰响第一...</p>
|
||||
<p class="new2">2018.06.17</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new2.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">可能是台北电脑展最全的充电外设展示</p>
|
||||
<p class="new2">2018.06.06</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new3.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携多款新型科技产品再次亮相 环球资源消费电子展</p>
|
||||
<p class="new2">2018.04.23</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new3.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携星际云存储正式入军区块链, IPFS系统加持轰响第一...</p>
|
||||
<p class="new2">2018.06.17</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new2.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">可能是台北电脑展最全的充电外设展示</p>
|
||||
<p class="new2">2018.06.06</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="item wow">
|
||||
<a href="#">
|
||||
<div class="newimg"><img src="uploadfiles/image/new1.jpg"></div>
|
||||
<div class="newtit">
|
||||
<p class="new1">ORICO携多款新型科技产品再次亮相 环球资源消费电子展</p>
|
||||
<p class="new2">2018.04.23</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var owl = $(".newBox .owl-carousel");
|
||||
owl.owlCarousel({
|
||||
autoplay:true,
|
||||
navigationText: ["",""],
|
||||
responsive:{
|
||||
0:{
|
||||
items:1,
|
||||
margin:0
|
||||
},
|
||||
640:{
|
||||
items:2,
|
||||
margin:0,
|
||||
smartSpeed:80,
|
||||
dots:false
|
||||
},
|
||||
998:{
|
||||
items:3,
|
||||
margin:0,
|
||||
smartSpeed:80,
|
||||
dots:false
|
||||
},
|
||||
|
||||
},
|
||||
})
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 新闻资讯 e -->
|
||||
|
||||
<!-- 合作伙伴 s -->
|
||||
<div class="indexbox2">
|
||||
<div class="w1440 wow fadeInUp" data-wow-delay="0.9s"">
|
||||
<!-- 公共标题 s -->
|
||||
<div class="com">
|
||||
<p class="comtit">他们选择了ORICO</p>
|
||||
<p class="comline"><img src="images/hline.png"></p>
|
||||
</div>
|
||||
<!-- 公共标题 e -->
|
||||
<div class="hz">
|
||||
<ul>
|
||||
<li><a href=""><img src="uploadfiles/image/h1.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h2.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h3.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h4.jpg"></a></li>
|
||||
<li><a href=""><img src="uploadfiles/image/h5.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h6.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h7.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h8.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h9.jpg"></a></li>
|
||||
<li class="l1"><a href=""><img src="uploadfiles/image/h10.jpg"></a></li>
|
||||
<div class="clear"></div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 合作伙伴 e -->
|
||||
|
||||
<!-- bottom s -->
|
||||
<!--#include file="include/bottom.html" -->
|
||||
<!-- bottom e -->
|
||||
</body>
|
||||
</html>
|
||||
213
public/frontend/web/scripts/bxslider/jquery.bxslider-list.css
Executable file
213
public/frontend/web/scripts/bxslider/jquery.bxslider-list.css
Executable file
@@ -0,0 +1,213 @@
|
||||
/**
|
||||
* BxSlider v4.0 - Fully loaded, responsive content slider
|
||||
* http://bxslider.com
|
||||
*
|
||||
* Written by: Steven Wanderski, 2012
|
||||
* http://stevenwanderski.com
|
||||
* (while drinking Belgian ales and listening to jazz)
|
||||
*
|
||||
* CEO and founder of bxCreative, LTD
|
||||
* http://bxcreative.com
|
||||
*/
|
||||
|
||||
|
||||
/** RESET AND LAYOUT
|
||||
===================================*/
|
||||
|
||||
.bx-wrapper {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
*zoom: 1;
|
||||
}
|
||||
@media screen and (min-width:1480px){
|
||||
.bx-wrapper{width:1440px;}
|
||||
}
|
||||
.bx-wrapper img {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/** THEME
|
||||
===================================*/
|
||||
|
||||
.bx-wrapper .bx-viewport {
|
||||
background-color:transparent;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager,
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
position: relative;
|
||||
bottom: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* LOADER */
|
||||
|
||||
.bx-wrapper .bx-loading {
|
||||
min-height: 50px;
|
||||
background: url(images/bx_loader.gif) center center no-repeat #fff;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
/* PAGER */
|
||||
|
||||
.bx-wrapper .bx-pager {
|
||||
text-align: center;
|
||||
font-size: .85em;
|
||||
font-family: Arial;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager .bx-pager-item,
|
||||
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
|
||||
display: inline-block;
|
||||
*zoom: 1;
|
||||
*display: inline;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a {
|
||||
background: #999;
|
||||
text-indent: -9999px;
|
||||
display: block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin: 0 5px;
|
||||
outline: 0;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a:hover,
|
||||
.bx-wrapper .bx-pager.bx-default-pager a.active {
|
||||
background: #00a0e9;
|
||||
}
|
||||
|
||||
/* DIRECTION CONTROLS (NEXT / PREV) */
|
||||
|
||||
.bx-wrapper .bx-prev {
|
||||
right: 101%; background: url(/uploads/category/list-left.png) no-repeat; width:2.5vw; height: 10.26vw; background-size:100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next {
|
||||
left: 101%; background: url(/uploads/category/list-right.png) no-repeat; width:2.5vw; height: 10.26vw; background-size:100%;
|
||||
}
|
||||
|
||||
|
||||
.bx-wrapper .bx-prev:hover {
|
||||
right: 101%; background: url(/uploads/category/list-one-left.png) no-repeat; width:2.5vw; height: 10.26vw; background-size:100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next:hover {
|
||||
left: 101%; background: url(/uploads/category/list-one-right.png) no-repeat; width:2.5vw; height: 10.26vw; background-size:100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-direction a, .bx-wrapper .bx-controls-direction a:hover {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
outline: 0;
|
||||
text-indent: -9999px;
|
||||
z-index: 99;
|
||||
width:3.02vw;
|
||||
height: 6.66vw;
|
||||
margin-top:-3.33vw;
|
||||
}
|
||||
|
||||
@media screen and (max-width:640px){
|
||||
.bx-wrapper .bx-prev {
|
||||
right: 100%; background: url(/uploads/category/list-one-left.png) no-repeat; width:5.625vw; height: 12.4vw; background-size:100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next {
|
||||
left: 100%; background: url(/uploads/category/list-one-right.png) no-repeat; width:5.625vw; height: 12.4vw; background-size:100%;
|
||||
}
|
||||
.bx-wrapper .bx-controls-direction a {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
outline: 0;
|
||||
text-indent: -9999px;
|
||||
z-index: 9999;
|
||||
width:5.625vw;
|
||||
height: 12.4vw;
|
||||
margin-top:-6.2vw;
|
||||
}
|
||||
}
|
||||
.bx-wrapper .bx-controls-direction a.disabled {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* AUTO CONTROLS (START / STOP) */
|
||||
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 10px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(images/controls.png) -86px -11px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-start.active {
|
||||
background-position: -86px 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 9px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(images/controls.png) -86px -44px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-stop.active {
|
||||
background-position: -86px -33px;
|
||||
}
|
||||
|
||||
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
|
||||
text-align: left;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
|
||||
right: 0;
|
||||
width: 35px;
|
||||
}
|
||||
|
||||
/* IMAGE CAPTIONS */
|
||||
|
||||
.bx-wrapper .bx-caption {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #666\9;
|
||||
background: rgba(80, 80, 80, 0.75);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-caption span {
|
||||
color: #fff;
|
||||
font-family: Arial;
|
||||
display: block;
|
||||
font-size: .85em;
|
||||
padding: 10px;
|
||||
}
|
||||
257
public/frontend/web/scripts/bxslider/jquery.bxslider.css
Executable file
257
public/frontend/web/scripts/bxslider/jquery.bxslider.css
Executable file
@@ -0,0 +1,257 @@
|
||||
/**
|
||||
* BxSlider v4.0 - Fully loaded, responsive content slider
|
||||
* http://bxslider.com
|
||||
*
|
||||
* Written by: Steven Wanderski, 2012
|
||||
* http://stevenwanderski.com
|
||||
* (while drinking Belgian ales and listening to jazz)
|
||||
*
|
||||
* CEO and founder of bxCreative, LTD
|
||||
* http://bxcreative.com
|
||||
*/
|
||||
|
||||
|
||||
/** RESET AND LAYOUT
|
||||
===================================*/
|
||||
|
||||
.bx-wrapper {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.bx-wrapper img {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/** THEME
|
||||
===================================*/
|
||||
|
||||
.bx-wrapper .bx-viewport {
|
||||
background-color:transparent;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager,
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
position: relative;
|
||||
bottom: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* LOADER */
|
||||
|
||||
|
||||
.bx-wrapper .bx-loading {
|
||||
min-height: 50px;
|
||||
/*background: url(images/bx_loader.gif) center center no-repeat #fff;*/
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
/* PAGER */
|
||||
|
||||
.bx-wrapper .bx-pager {
|
||||
text-align: center;
|
||||
font-size: .85em;
|
||||
font-family: Arial;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager .bx-pager-item,
|
||||
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
|
||||
display: inline-block;
|
||||
*zoom: 1;
|
||||
*display: inline;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a {
|
||||
background: #999;
|
||||
text-indent: -9999px;
|
||||
display: block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin: 0 5px;
|
||||
outline: 0;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a:hover,
|
||||
.bx-wrapper .bx-pager.bx-default-pager a.active {
|
||||
background: #00a0e9;
|
||||
}
|
||||
|
||||
/* DIRECTION CONTROLS (NEXT / PREV) */
|
||||
|
||||
.bx-wrapper .bx-prev {
|
||||
left: 10px;
|
||||
background: url(images/controls.png) no-repeat 0 -32px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next {
|
||||
right: 10px;
|
||||
background: url(images/controls.png) no-repeat -43px -32px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-prev:hover {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-next:hover {
|
||||
background-position: -43px 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-direction a {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -16px;
|
||||
outline: 0;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
text-indent: -9999px;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-direction a.disabled {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* AUTO CONTROLS (START / STOP) */
|
||||
|
||||
.bx-wrapper .bx-controls-auto {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 10px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(images/controls.png) -86px -11px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-start:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-start.active {
|
||||
background-position: -86px 0;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop {
|
||||
display: block;
|
||||
text-indent: -9999px;
|
||||
width: 9px;
|
||||
height: 11px;
|
||||
outline: 0;
|
||||
background: url(images/controls.png) -86px -44px no-repeat;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls-auto .bx-stop:hover,
|
||||
.bx-wrapper .bx-controls-auto .bx-stop.active {
|
||||
background-position: -86px -33px;
|
||||
}
|
||||
|
||||
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
|
||||
text-align: left;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
|
||||
right: 0;
|
||||
width: 35px;
|
||||
}
|
||||
|
||||
/* IMAGE CAPTIONS */
|
||||
|
||||
.bx-wrapper .bx-caption {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #666\9;
|
||||
background: rgba(80, 80, 80, 0.75);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.bx-wrapper .bx-caption span {
|
||||
color: #fff;
|
||||
font-family: Arial;
|
||||
display: block;
|
||||
font-size: .85em;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
/*首页品类探索*/
|
||||
.lj_index_img_01 .bx-wrapper .bx-prev {left:auto; right: 101%; background: url(/uploads/category/list-one-left.png) no-repeat; width:2.5vw; height: 10.26vw; background-size:100%;}
|
||||
.lj_index_img_01 .bx-wrapper .bx-next {right:auto; left: 101%; background: url(/uploads/category/list-one-right.png) no-repeat; width:2.5vw; height: 10.26vw; background-size:100%;}
|
||||
.lj_index_img_01 .bx-wrapper .bx-controls-direction a {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
outline: 0;
|
||||
text-indent: -9999px;
|
||||
z-index: 9999;
|
||||
width:3.02vw;
|
||||
height: 6.66vw;
|
||||
margin-top:-3.33vw;
|
||||
}
|
||||
|
||||
@media screen and (max-width:640px){
|
||||
.lj_index_img_01 .bx-wrapper .bx-prev {
|
||||
left:auto; right: 100%; background: url(/uploads/category/list-one-left.png) no-repeat; width:5.625vw; height: 12.4vw; background-size:100%;
|
||||
}
|
||||
|
||||
.lj_index_img_01 .bx-wrapper .bx-next {
|
||||
right:auto; left: 100%; background: url(/uploads/category/list-one-right.png) no-repeat; width:5.625vw; height: 12.4vw; background-size:100%;
|
||||
}
|
||||
.lj_index_img_01 .bx-wrapper .bx-controls-direction a {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
outline: 0;
|
||||
text-indent: -9999px;
|
||||
z-index: 1;
|
||||
width:5.625vw;
|
||||
height: 12.4vw;
|
||||
margin-top:-6.2vw;
|
||||
}
|
||||
}
|
||||
.lj_index_img_01 .bx-wrapper {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
padding: 0;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
/*首页新闻*/
|
||||
.index_news .bx-wrapper .bx-prev {
|
||||
left:-6.8vw; right: 100%; background: url(../../images/home/new_l.jpg) no-repeat; width:3.34vw; height: 6.67vw; background-size:100%;
|
||||
}
|
||||
|
||||
.index_news .bx-wrapper .bx-next {
|
||||
right:-6.8vw; background: url(../../images/home/new_r.jpg) no-repeat; width:3.34vw; height: 6.67vw; background-size:100%;
|
||||
}
|
||||
|
||||
|
||||
.index_news .bx-wrapper .bx-prev:hover {
|
||||
left:-6.8vw; right: 100%; background: url(../../images/home/new_l_hover.jpg) no-repeat; width:3.34vw; height: 6.67vw; background-size:100%;
|
||||
}
|
||||
|
||||
.index_news .bx-wrapper .bx-next:hover {
|
||||
right:-6.8vw; background: url(../../images/home/new_r_hover.jpg) no-repeat; width:3.34vw; height: 6.67vw; background-size:100%;
|
||||
}
|
||||
.index_news .bx-wrapper .bx-controls-direction a{top: 50%; margin-top: -3.335vw;}
|
||||
|
||||
.home_new .bx-wrapper .bx-pager{margin-top:-20px; padding-top:0}
|
||||
|
||||
|
||||
10
public/frontend/web/scripts/bxslider/jquery.bxslider.min.js
vendored
Executable file
10
public/frontend/web/scripts/bxslider/jquery.bxslider.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
151
public/frontend/web/scripts/comment.js
Executable file
151
public/frontend/web/scripts/comment.js
Executable file
@@ -0,0 +1,151 @@
|
||||
/*
|
||||
parentcontent //父容器
|
||||
boxcontent // 评论区图片展示区域
|
||||
*/
|
||||
function commentMove(parentcontent, boxcontent) {
|
||||
this.obj = {
|
||||
activeClass: 'tm-current',
|
||||
nextButton: '.tm-m-photo-viewer-navright',
|
||||
prevButton: '.tm-m-photo-viewer-navleft',
|
||||
}
|
||||
this.parentcontent = parentcontent;
|
||||
this.boxcontent = boxcontent;
|
||||
|
||||
}
|
||||
commentMove.prototype = {
|
||||
init: function() {
|
||||
var that = this;
|
||||
that.start();
|
||||
this.lefthover();
|
||||
this.righthover();
|
||||
this.leftclick();
|
||||
this.rightclick();
|
||||
},
|
||||
start: function() {
|
||||
var that = this;
|
||||
var src;
|
||||
$(that.parentcontent + ' li').click(function() {
|
||||
var haha = this;
|
||||
|
||||
$(this).toggleClass(that.obj.activeClass).siblings().removeClass(that.obj.activeClass);
|
||||
|
||||
console.log($(this).attr('class'));
|
||||
if ($(this).attr("class") == "tm-current") {
|
||||
src = $(haha).children(img)[0].src;
|
||||
|
||||
console.log("111111111");
|
||||
console.log(src);
|
||||
} else{
|
||||
console.log("22222222")
|
||||
src = "aaa";
|
||||
|
||||
console.log(src);
|
||||
}
|
||||
|
||||
// var src = $('.' + that.obj.activeClass).attr('data-src');
|
||||
|
||||
|
||||
var img = new Image();
|
||||
img.src = src;
|
||||
img.onload = function() {
|
||||
var imageWidth = img.width;
|
||||
var imageHeight = img.height;
|
||||
$(haha).parent().parent().children('.tm-m-photo-viewer').css({
|
||||
"width": imageWidth,
|
||||
"height": imageHeight
|
||||
})
|
||||
$(that.obj.prevButton).css({
|
||||
"width": imageWidth / 3,
|
||||
"height": imageHeight
|
||||
})
|
||||
$(that.obj.prevButton).children().css({
|
||||
"top": imageHeight / 2 - 10 + 'px'
|
||||
})
|
||||
$(that.obj.nextButton).children().css({
|
||||
"top": imageHeight / 2 - 10 + 'px'
|
||||
})
|
||||
|
||||
}
|
||||
if(src == "aaa") {
|
||||
|
||||
console.log(src);
|
||||
$(that.boxcontent).css({
|
||||
"width": 0,
|
||||
"height": 0
|
||||
});
|
||||
} else {
|
||||
console.log(src);
|
||||
$(haha).parent().parent().children('.tm-m-photo-viewer').children(img).attr('src', src);
|
||||
}
|
||||
})
|
||||
},
|
||||
lefthover: function() {
|
||||
var that = this;
|
||||
$(that.obj.prevButton).hover(function() {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
if(index < 1) {
|
||||
$(this).children().css("display", "none");
|
||||
} else {
|
||||
$(this).children().css({
|
||||
"display": "inline"
|
||||
});
|
||||
}
|
||||
}, function() {
|
||||
$(this).children().css({
|
||||
"display": "none"
|
||||
});
|
||||
})
|
||||
},
|
||||
righthover: function() {
|
||||
var that = this;
|
||||
|
||||
$(that.obj.nextButton).hover(function() {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
if(index >= $(that.parentcontent + ' li').length - 1) {
|
||||
$(this).children().css("display", "none");
|
||||
} else {
|
||||
$(this).children().css({
|
||||
"display": "inline"
|
||||
});
|
||||
}
|
||||
}, function() {
|
||||
$(this).children().css({
|
||||
"display": "none"
|
||||
});
|
||||
})
|
||||
},
|
||||
leftclick: function() {
|
||||
var that = this;
|
||||
$(that.obj.prevButton).click(function() {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
|
||||
index--;
|
||||
if(index >= 0) {
|
||||
$(that.parentcontent + ' li').eq(index).toggleClass(that.obj.activeClass).siblings().removeClass(that.obj.activeClass)
|
||||
$(that.boxcontent + " img").attr("src", $(that.parentcontent + ' li').eq(index).attr('data-src'))
|
||||
}
|
||||
if(index < 1) {
|
||||
index = 0;
|
||||
$(this).children().css({
|
||||
"display": "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
})
|
||||
},
|
||||
rightclick: function() {
|
||||
var that = this;
|
||||
$(that.obj.nextButton).click(function() {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
index++;
|
||||
$(that.boxcontent + " img").attr("src", $(that.parentcontent + ' li').eq(index).attr('data-src'))
|
||||
|
||||
$(that.parentcontent + ' li').eq(index).toggleClass(that.obj.activeClass).siblings().removeClass(that.obj.activeClass);
|
||||
if(index >= $(that.parentcontent + ' li').length - 1) {
|
||||
$(this).children().css({
|
||||
"display": "none"
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
111
public/frontend/web/scripts/comment1.js
Executable file
111
public/frontend/web/scripts/comment1.js
Executable file
@@ -0,0 +1,111 @@
|
||||
|
||||
/*
|
||||
parentcontent //父容器
|
||||
boxcontent // 评论区图片展示区域
|
||||
*/
|
||||
function commentMove(parentcontent, boxcontent) {
|
||||
this.obj = {
|
||||
activeClass: 'tm-current',
|
||||
nextButton: '.tm-m-photo-viewer-navright',
|
||||
prevButton: '.tm-m-photo-viewer-navleft',
|
||||
}
|
||||
this.parentcontent = parentcontent;
|
||||
this.boxcontent = boxcontent;
|
||||
|
||||
}
|
||||
commentMove.prototype = {
|
||||
init: function () {
|
||||
var that = this;
|
||||
that.start();
|
||||
this.lefthover();
|
||||
this.righthover();
|
||||
this.leftclick();
|
||||
this.rightclick();
|
||||
},
|
||||
start: function () {
|
||||
var that = this;
|
||||
$(that.parentcontent + ' li').click(function () {
|
||||
console.log('点击了enlarge-img');
|
||||
$(this).toggleClass(that.obj.activeClass).siblings().removeClass(that.obj.activeClass);
|
||||
var src = $('.' + that.obj.activeClass).attr('data-src');
|
||||
|
||||
var img = new Image();
|
||||
img.src = src;
|
||||
img.onload = function () {
|
||||
var imageWidth = img.width;
|
||||
var imageHeight = img.height;
|
||||
$(that.boxcontent).css({ "width": imageWidth, "height": imageHeight })
|
||||
$(that.obj.prevButton).css({ "width": imageWidth / 3, "height": imageHeight })
|
||||
$(that.obj.prevButton).children().css({ "top": imageHeight / 2 - 10 + 'px' })
|
||||
$(that.obj.nextButton).children().css({ "top": imageHeight / 2 - 10 + 'px' })
|
||||
|
||||
}
|
||||
if (!src) {
|
||||
$(that.boxcontent).css({ "width": 0, "height": 0 });
|
||||
} else {
|
||||
$(that.boxcontent + " img").attr('src', src);
|
||||
}
|
||||
})
|
||||
},
|
||||
lefthover: function () {
|
||||
var that = this;
|
||||
$(that.obj.prevButton).hover(function () {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
if (index < 1) {
|
||||
$(this).children().css("display", "none");
|
||||
} else {
|
||||
$(this).children().css({ "display": "inline" });
|
||||
}
|
||||
}, function () {
|
||||
$(this).children().css({ "display": "none" });
|
||||
})
|
||||
},
|
||||
righthover: function () {
|
||||
var that = this;
|
||||
|
||||
$(that.obj.nextButton).hover(function () {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
if (index >= $(that.parentcontent + ' li').length - 1) {
|
||||
$(this).children().css("display", "none");
|
||||
} else {
|
||||
$(this).children().css({ "display": "inline" });
|
||||
}
|
||||
}, function () {
|
||||
$(this).children().css({ "display": "none" });
|
||||
})
|
||||
},
|
||||
leftclick: function () {
|
||||
var that = this;
|
||||
$(that.obj.prevButton).click(function () {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
|
||||
index--;
|
||||
if (index >= 0) {
|
||||
$(that.parentcontent + ' li').eq(index).toggleClass(that.obj.activeClass).siblings().removeClass(that.obj.activeClass)
|
||||
$(that.boxcontent + " img").attr("src", $(that.parentcontent + ' li').eq(index).attr('data-src'))
|
||||
}
|
||||
if (index < 1) {
|
||||
index = 0;
|
||||
$(this).children().css({ "display": "none" });
|
||||
return;
|
||||
}
|
||||
})
|
||||
},
|
||||
rightclick: function () {
|
||||
var that = this;
|
||||
$(that.obj.nextButton).click(function () {
|
||||
var index = $(that.parentcontent + ' li').index($(that.parentcontent + ' li.' + that.obj.activeClass));
|
||||
index++;
|
||||
$(that.boxcontent + " img").attr("src", $(that.parentcontent + ' li').eq(index).attr('data-src'))
|
||||
|
||||
$(that.parentcontent + ' li').eq(index).toggleClass(that.obj.activeClass).siblings().removeClass(that.obj.activeClass);
|
||||
if (index >= $(that.parentcontent + ' li').length - 1) {
|
||||
$(this).children().css({ "display": "none" });
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user