@charset "utf-8";
html,
body {
height: 100%;
}
body {
position: relative;
}
:root {
--main-color: #182B62;
--dark-color: #00559B;
--blue-color: #0D9ED7;
--white-color: #fff;
}
img {
max-width: 100%;
}
/*header*/
.header_wrap {
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index: 999;
}
header {
width: 100%;
position: fixed;
left: 0;
top: 0;
z-index: 99;
}
.white_header {
border-bottom: 1px solid rgba(212, 212, 212, 0.30);
background: #FFF;
}
.header {
padding: 0 48px;
width: 100%;
height: 90px;
border-bottom: 1px solid rgba(255, 255, 255, 0.30);
}
.logo {
position: relative;
z-index: 99;
}
.logo img:nth-child(2) {
display: none;
}
.header_top {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
height: 100%;
}
.header_top .menu {
height: 100%;
}
.header_top .menu>ul>li {
float: left;
padding-right: 70px;
}
.header_top .menu>ul>li>a {
position: relative;
display: inline-block;
color: var(--white-color);
font-size: 18px;
font-weight: 400;
height: 90px;
line-height: 90px;
}
.header_top .menu>ul>li>a:before {
content: "";
position: absolute;
left: 0;
bottom: 0px;
background-color: #fff;
height: 2px;
width: 0;
transition: width .4s
}
.header_top .menu>ul>li.active>a:before {
width: 100%;
}
.header_top .menu>ul>li .sub-menu {
left: 0;
position: absolute;
top: 100%;
display: flex;
transition: all 0.4s ease-out;
width: 100%;
border-top: 1px solid #EEEEEE;
background-color: #fff;
z-index: 9;
transform-origin: top;
opacity: 0;
visibility: hidden;
transform: scaleY(0);
}
.header_top .menu>ul>li .sub-menu .container {
padding-top: 30px;
padding-bottom: 30px;
}
.header_top .menu>ul>li:hover .sub-menu {
opacity: 1;
visibility: visible;
transform: scaleY(1);
}
.header_top .sub_menu_list {
max-width: 1200px;
margin: 0 auto;
}
.header_top .sub_menu_list>ul {
display: flex;
flex-wrap: wrap;
margin-left: -12px;
margin-right: -12px;
}
.header_top .sub_menu_list>ul>li {
padding-left: 12px;
padding-right: 12px;
float: left;
}
.header_top .sub_menu_list a {
display: flex;
position: relative;
justify-content: space-between;
/*width: 213px;*/
padding: 20px 0;
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 28px;
}
.header_top .sub_menu_list a::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;
background-color: var(--blue-color);
transform-origin: bottom right;
transform: scaleX(0);
transition: transform 0.5s ease;
}
.header_top .sub_menu_list a:hover::before {
transform-origin: bottom left;
transform: scaleX(1);
}
.header_top .sub-menu a:last-child {
margin-right: 0;
}
.header_top .sub_menu_list a:hover .sub_icon {
background-image: url(../images/menu_jtl.svg);
}
.sub-menu a span img {
width: 28px;
height: 28px;
margin-right: 8px;
}
.sub-menu a .sub_icon {
width: 24px;
height: 24px;
background-image: url(../images/menu_jth.svg);
background-repeat: no-repeat;
}
.header_top .menubar {
position: relative;
display: block;
width: 21px;
height: 18px;
margin-top: 5px;
margin-left: 16px;
z-index: 99;
cursor: pointer;
}
.header_top .menubar .bar {
position: absolute;
right: 0;
top: 0;
height: 2px;
background: #fff;
transition: all ease .3s;
}
.header_top .menubar .bar.bar01 {
width: 13px;
}
.header_top .menubar .bar.bar02 {
top: 6px;
width: 17px;
}
.header_top .menubar .bar.bar03 {
top: 12px;
width: 21px;
}
/*search*/
.head_search {
position: relative;
width: 30px;
height: 30px;
margin-right: 16px;
}
.head_search i {
font-size: 0;
width: 30px;
height: 30px;
display: inline-block;
position: absolute;
top: 50%;
background-size: 30px 30px;
background-repeat: no-repeat;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
right: 0;
cursor: pointer;
}
.head_search i.sousuoend {
background-image: url(../images/search_w.svg);
}
.head_search i.cuohao {
display: none;
background-image: url(../images/close_blue.png);
}
.cuohao.act {
color: #333;
}
.head_languge img:nth-child(2) {
display: none;
}
.search_eject {
position: fixed;
top: 90px;
left: 0;
width: 100%;
padding: 50px 0;
z-index: 302;
display: none;
background: #FFF;
}
.search_eject .pcsearch {
max-width: 900px;
margin: 0 auto;
}
.sear_title {
color: var(--main-color);
font-size: 24px;
font-weight: 700;
line-height: 1.2;
}
.sear_small {
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.sebox_form {
display: flex;
margin-top: 20px;
align-items: center;
padding: 18px 24px;
border-radius: 16px 0px 16px 16px;
border: 1px solid #E5E5E5;
background: #FFF;
}
.sebox_form .pro_select_box {
border-radius: 0;
margin: 0;
margin-right: 22px;
background: transparent;
padding: 0;
width: 80px;
height: 26px;
}
.sebox_form .pro_select_box .span input {
background: transparent;
border-radius: 0;
width: 80px;
height: 26px;
padding: 0;
color: var(--main-color);
}
.sebox_form .pro_select_box .drop_down_ {
top: 45px;
}
.sebox_form .pro_select_box .span input::-webkit-input-placeholder {
color: var(--main-color);
}
.sebox_form .pro_select_box .span input:-moz-placeholder {
color: var(--main-color);
}
.sebox_form .pro_select_box .span input::-moz-placeholder {
color: var(--main-color);
}
.sebox_form .pro_select_box .span input:-ms-input-placeholder {
color: var(--main-color);
}
.sebox_input {
flex: 1;
position: relative;
padding-left: 22px;
display: flex;
align-items: center;
justify-content: space-between;
}
.sebox_input:before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 1px;
height: 16px;
background-color: #E5E5E5;
transform: translateY(-50%);
}
.sebox_form .m_ser_l {
flex: 1;
padding-right: 20px;
}
.sebox_form .sebox_input input {
line-height: 26px;
}
.sebox_form .sebox_input input::-webkit-input-placeholder {
color: rgba(101, 113, 136, 0.5);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.sebox_form .sebox_input input:-moz-placeholder {
color: rgba(101, 113, 136, 0.5);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.sebox_form .sebox_input input::-moz-placeholder {
color: rgba(101, 113, 136, 0.5);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.sebox_form .sebox_input input:-ms-input-placeholder {
color: rgba(101, 113, 136, 0.5);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.sebox_input .m_submit {
width: 24px;
height: 24px;
background-image: url(../images/new_s_icon.svg);
background-color: transparent;
cursor: pointer;
outline: 0;
}
.sebox_form .pro_select_box .span .icon {
right: 0;
}
.sear_more {
padding-top: 55px;
display: flex;
align-items: flex-start;
}
.sear_more ul {
flex: 1;
margin-left: -6px;
margin-right: -6px;
padding-left: 100px;
max-width: 608px;
}
.sear_more ul li {
float: left;
padding-left: 6px;
padding-right: 6px;
padding-bottom: 12px;
}
.sear_more ul li a {
display: inline-block;
padding: 10px 18px;
border-radius: 72px;
background: #F1F8FD;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.gnb-all {
position: fixed;
top: 0;
right: 0;
width: 100%;
height: 0;
background: var(--dark-color);
z-index: 9;
overflow: hidden;
transition: all ease .6s;
}
.gnb-all .container {
height: 100%;
}
.gnb-all .all_bg {
position: relative;
display: flex;
width: 100%;
height: 100%;
padding: 15% 0 10% 0;
}
.gnb-all .all_bg:before {
content: "";
position: absolute;
right: 0;
top: 0;
width: 60%;
height: 100%;
background-image: url(../images/menu_icon.svg);
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
.header.gnb-open .gnb-all {
height: 100vh;
}
.header.gnb-open .menubar .bar {
background-color: var(--white-color);
}
.header.gnb-open .header_top .menubar .bar.bar01 {
width: 30px;
top: 6px;
transform: rotate(45deg);
}
.header.gnb-open .header_top .menubar .bar.bar02 {
display: none;
}
.header.gnb-open .header_top .menubar .bar.bar03 {
width: 30px;
top: 6px;
transform: rotate(-45deg);
}
.all_bg {
display: flex;
}
.all_bg .all_left {
flex: 1;
float: left;
padding-right: 40px;
transition: all ease 1s;
transition-delay: .2s;
opacity: 0;
margin-left: -10px;
}
.all_bg .ys_navph2_subnav {
height: 100%;
overflow-y: auto;
}
.all_bg .ys_navph2_subnav::-webkit-scrollbar {
width: 2px;
height: 2px
}
.all_bg .ys_navph2_subnav::-webkit-scrollbar-button:vertical {
display: none
}
/*底色*/
.all_bg .ys_navph2_subnav::-webkit-scrollbar-corner,
.all_bg .ys_navph2_subnav::-webkit-scrollbar-track {
background-color: rgba(255, 255, 255, 0.1);
}
.all_bg .ys_navph2_subnav::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: rgba(255, 255, 255, 0.3);
}
.all_right {
float: right;
padding-left: 58px;
min-width: 40%;
border-left: 1px solid rgba(255, 255, 255, 0.5);
display: flex;
align-items: flex-end;
transition: all ease 1s;
transition-delay: .2s;
opacity: 0;
margin-left: -10px;
}
.all_right p {
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
margin-bottom: 16px;
}
.all_right .tel {
display: block;
margin-bottom: 30px;
}
.all_right .tel span {
display: flex;
align-items: center;
}
.all_right .tel span img {
margin-right: 8px;
}
.all_right .tel strong {
display: block;
margin-top: 8px;
color: var(--white-color);
font-family: DIN;
font-size: 36px;
font-weight: 700;
line-height: 1;
}
.all_right .tel strong a {
font-size: inherit;
color: inherit;
}
.all_right .a_r_list {
display: flex;
align-items: center;
}
.all_right .a_r_list span {
display: inline-block;
line-height: 20px;
}
.all_right .a_r_list p {
display: flex;
align-items: center;
}
.all_right .a_r_list img {
width: 20px;
margin-right: 10px;
}
.all_right .a_r_list a {
color: inherit;
font-size: inherit;
}
/*点击展开导航*/
.ys_navph2_subnav .ys_navph2_subnav_li {
padding-bottom: 25px;
}
.ys_navph2_subnav .ys_navph2_subnav_li:last-child {
padding-bottom: 0;
}
.ys_navph2_subnav .ys_navph2_subnav_li:last-child .one_depth {
margin-bottom: 0;
}
.ys_navph2_subnav_li.act {
opacity: 1;
}
.ys_navph2_subnav_li .one_depth {
color: var(--white-color);
font-size: 28px;
font-weight: 400;
line-height: 1.2;
padding-left: 64px;
background-image: url(../images/jia.svg);
background-position: left center;
background-repeat: no-repeat;
background-size: 24px 24px;
}
.ys_navph2_thirnav {
display: none;
}
.ys_navph2_thirnav .ys_navph2_thirnav_a {
display: inline-block;
position: relative;
color: var(--white-color);
font-size: 18px;
font-weight: 700;
line-height: 1.4;
line-height: 64px; white-space: nowrap;
}
.ys_navph2_thirnav .ys_navph2_thirnav_a:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 2px;
background-color: #fff;
transform-origin: bottom right;
transform: scaleX(0);
transition: transform 0.5s ease;
}
.ys_navph2_thirnav .ys_navph2_thirnav_a:hover:before {
transform-origin: bottom left;
transform: scaleX(1);
}
.ys_navph2_thirnav {
padding-top: 22px;
padding-left: 64px;
}
.ys_navph2_thirnav li {
float: left;
padding-right: 32px;
}
.all_menu .gnb>li .one_depth {
display: inline-block;
opacity: 0.5;
margin-bottom: 25px;
}
.all_menu .gnb.initial>li .one_depth {
opacity: 1;
}
.all_menu .gnb>li .one_depth.on {
opacity: 1;
margin-bottom: 0;
}
.all_menu .ys_navph2_subnav_li .one_depth.on {
background-image: url(../images/jian.svg);
}
header.gnb-open .all_bg .all_left {
opacity: 1;
margin-left: 0;
}
header.gnb-open .all_bg .all_right {
opacity: 1;
margin-left: 0;
}
header.gnb-open .header_top .menubar .bar {
background-color: #fff;
}
header.gnb-open .logo img:nth-child(1) {
display: block;
}
header.gnb-open .logo img:nth-child(2) {
display: none;
}
@media (max-width:1580px) {
.header_top .menu>ul>li {
padding-right: 50px;
}
.header_top .menu>ul>li:last-child {
padding-right: 0;
}
}
@media (max-width:1440px) {
.header_top .menu>ul>li {
padding-right: 30px;
}
}
@media (max-width:1280px) {
.ys_navph2_subnav_li .one_depth {
font-size: 30px;
}
}
@media (max-width:1200px) {
.header_top .menu {
display: none !important;
}
}
@media (max-width:1024px) {
.ys_navph2_subnav_li .one_depth {
font-size: 28px;
padding-left: 64px;
background-size: 20px 20px;
}
.ys_navph2_subnav .ys_navph2_subnav_li {
padding-bottom: 15px;
}
.all_menu .gnb>li .one_depth {
margin-bottom: 15px;
}
.ys_navph2_thirnav .ys_navph2_thirnav_a {
line-height: 54px;
}
.all_right .tel strong {
font-size: 32px;
}
}
@media (max-width:991px) {
.header {
padding: 0 30px;
}
.all_right .tel strong {
font-size: 30px;
}
}
@media (max-width:767px) {
.header {
padding: 0 20px;
height: 80px;
}
.gnb-all .all_bg:before {
width: 100%;
background-size: contain;
background-position: top center;
}
.search_eject {
top: 80px;
padding: 30px 0;
}
.head_search {
margin-right: 10px;
}
.header_top .menubar {
padding: 15px 15px;
margin-top: 14px;
margin-left: 10px;
}
.sebox_form {
margin-top: 20px;
padding: 18px 15px;
}
.sebox_form .sebox_input input::-webkit-input-placeholder {
font-size: 12px;
}
.sebox_form .sebox_input input:-moz-placeholder {
font-size: 12px;
}
.sebox_form .sebox_input input::-moz-placeholder {
font-size: 12px;
}
.sebox_form .pro_select_box {
margin-right: 10px;
width: 70px;
}
.sebox_form .m_ser_l {
padding-right: 10px;
}
.sebox_input {
width: calc(100% - 100px);
padding-left: 10px;
}
.sear_more {
display: block;
padding-top: 30px;
}
.sear_more ul {
padding-top: 20px;
margin-left: -6px;
margin-right: -6px;
padding-left: 0;
width: 100%;
max-width: 608px;
}
.sear_more ul li a {
font-size: 14px;
}
.gnb-all .all_bg {
margin-top: 100px;
height: calc(100% - 100px);
padding: 0 15px;
display: block;
overflow-y: auto;
}
.all_bg .all_left {
width: 100%;
padding-right: 0;
}
.all_right {
padding-left: 0;
min-width: 40%;
width: 100%;
margin-top: 20px;
padding-top: 20px;
border-left: none;
border-top: 1px solid rgba(255, 255, 255, 0.3);
}
.all_right .tel strong {
font-size: 26px;
}
.all_bg .ys_navph2_subnav {
max-height: inherit;
}
.ys_navph2_subnav_li .one_depth {
font-size: 18px;
padding-left: 30px;
background-size: 15px 15px;
}
.ys_navph2_thirnav .ys_navph2_thirnav_a {
font-size: 16px;
font-weight: 400;
line-height: 34px;
}
.ys_navph2_thirnav {
padding-top: 15px;
padding-left: 30px;
}
.all_right p {
font-size: 14px;
margin-bottom: 12px;
}
}
/*白底导航*/
.header.headerColor,
.header.headerColor2,
.header.headerColor3 {
background-color: #fff;
border-bottom: 1px solid rgba(212, 212, 212, 0.30);
}
.headerColor .logo img:nth-child(1),
.headerColor2 .logo img:nth-child(1),
.headerColor3 .logo img:nth-child(1) {
display: none;
}
.headerColor .logo img:nth-child(2),
.headerColor2 .logo img:nth-child(2),
.headerColor3 .logo img:nth-child(2) {
display: inline-block;
}
.headerColor .head_search i.sousuoend,
.headerColor2 .head_search i.sousuoend,
.headerColor3 .head_search i.sousuoend {
background-image: url(../images/search_blue.svg);
}
.headerColor .head_languge img:nth-child(1),
.headerColor2 .head_languge img:nth-child(1),
.headerColor3 .head_languge img:nth-child(1) {
display: none;
}
.headerColor .head_languge img:nth-child(2),
.headerColor2 .head_languge img:nth-child(2),
.headerColor3 .head_languge img:nth-child(2) {
display: inline-block;
}
.headerColor .header_top .menubar .bar,
.headerColor2 .header_top .menubar .bar,
.headerColor3 .header_top .menubar .bar {
background: var(--main-color);
}
.headerColor .menu>ul>li>a,
.headerColor2 .menu>ul>li>a,
.headerColor3 .menu>ul>li>a {
color: var(--main-color);
}
.headerColor .menu>ul>li.active>a,
.headerColor2 .menu>ul>li.active>a,
.headerColor3 .menu>ul>li.active>a {
color: var(--blue-color);
}
.headerColor .menu>ul>li.active>a:before,
.headerColor2 .menu>ul>li.active>a:before,
.headerColor3 .menu>ul>li.active>a:before {
background-color: var(--blue-color);
/*bottom: 1px;*/
}
.headerColor .menu>ul>li>a:hover,
.headerColor2 .menu>ul>li>a:hover,
.headerColor3 .menu>ul>li>a:hover {
color: var(--blue-color);
}
.headerColor .menu>ul>li>a:hover:before,
.headerColor2 .menu>ul>li>a:hover:before,
.headerColor3 .menu>ul>li>a:hover:before {
width: 100%;
background-color: var(--blue-color);
}
@media (max-width:1024px) {
.header {
background-color: #fff;
}
.header .logo img:nth-child(1) {
display: none;
}
.header .logo img:nth-child(2) {
display: inline-block;
}
}
/*footer*/
.right_flow {
position: fixed;
right: 5px;
bottom: 10px;
z-index: 99;
}
.right_flow ul li {
position: relative;
overflow: hidden;
margin-bottom: 1px;
}
.right_flow ul li a {
display: block;
padding: 16px;
border-radius: 2px;
border: 1px solid rgba(255, 255, 255, 0.10);
background: var(--dark-color);
}
.right_flow .top-button {
display: none;
}
.right_flow ul li .hide_tel {
position: absolute;
right: calc(100% + 10px);
top: 50%;
transform: translateY(-50%);
width: 180px;
padding: 24px 32px;
background-color: var(--dark-color);
opacity: 0;
justify-content: center;
border-radius: 4px;
-webkit-transition: all 0.4s;
-moz-transition: all 0.4s;
-ms-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
z-index: -1;
box-shadow: 0 4px 10px 0 rgb(0 0 0 / 10%);
}
.right_flow ul li .hide_tel:before {
border: solid transparent;
content: ' ';
height: 0;
position: absolute;
width: 0;
border-width: 10px;
border-left-color: var(--dark-color);
right: -20px;
top: 50%;
transform: translateY(-50%);
}
.right_flow ul li .hide_tel a {
color: #ffffff;
font-size: 16px;
background-color: transparent;
border: none;
padding: 0;
}
.right_flow ul li:hover {
overflow: visible;
}
.right_flow ul li:hover .hide_tel {
opacity: 1;
z-index: 8;
}
footer {
position: relative;
width: 100%;
background-color: var(--dark-color);
overflow: hidden;
z-index: 1;
}
footer:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(279deg, #00559B 23.13%, #017FC3 129.16%);
z-index: -1;
}
.foot_b_logo {
position: absolute;
max-width: 90%;
right: 0;
bottom: 0;
z-index: -1;
}
.foot_top {
padding: 40px 0 35px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.foot_top .text {
position: relative;
display: inline-block;
padding-left: 24px;
margin-left: 24px;
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.foot_top .text:before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 1px;
height: 16px;
background: rgba(255, 255, 255, 0.50);
}
.foot_mid {
padding-top: 40px;
padding-bottom: 55px;
}
.foot_scoll {
padding-right: 25px;
max-height: 216px;
overflow-y: auto;
}
.foot_scoll::-webkit-scrollbar {
width: 2px;
height: 2px
}
.foot_scoll::-webkit-scrollbar-button:vertical {
display: none
}
.foot_scoll::-webkit-scrollbar-corner,
.foot_scoll::-webkit-scrollbar-track {
background-color: rgba(255, 255, 255, 0.2);
}
.foot_scoll::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: rgba(255, 255, 255, 0.5);
}
.swiper-foot {
height: 200px;
}
.swiper-foot .swiper-slide {
height: 34px;
}
.swiper-container-vertical>.foot-scrollbar {
width: 2px;
background-color: rgba(255, 255, 255, 0.2);
}
.foot-scrollbar .swiper-scrollbar-drag {
background-color: rgba(255, 255, 255, 1);
}
.foot_scoll a {
display: block;
margin-bottom: 12px;
color: rgba(255, 255, 255, 0.60);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
white-space: nowrap;
}
.foot_scoll a:last-child {
margin-bottom: 0;
}
.foot_scoll a:hover {
color: rgba(255, 255, 255, 0.9);
}
.footer .big_t {
padding-bottom: 16px;
color: var(--white-color);
font-size: 18px;
font-weight: 700;
line-height: 28px;
}
.footer .big_t a {
font-size: inherit;
color: inherit;
font-style: normal;
}
.foot_mid .foot_menu {
flex: 1;
max-width: 950px;
display: flex;
justify-content: space-between;
}
.foot_mid .foot_menu ul {
display: flex;
justify-content: space-between;
}
.foot_mid .foot_menu ul:nth-child(1) {
flex: 1;
}
.foot_mid .foot_menu ul:nth-child(2) {
width: 115px;
display: block;
}
.foot_mid .foot_menu ul:nth-child(1) li {
padding-right: 15px;
}
.foot_mid .foot_menu ul:nth-child(2) li {
padding-right: 0;
}
.foot_img {
padding-left: 15px;
}
.foot_img p {
padding-top: 8px;
color: var(--white-color);
font-size: 14px;
font-weight: 400;
line-height: 24px;
text-align: center;
}
.foot_img .dis_flex>div {
padding-left: 30px;
}
.foot_img .dis_flex>div img {
border-radius: 8px;
max-width: 100px;
}
.foot_img .dis_flex>div:first-child {
padding-left: 0;
}
.foot_line {
padding-top: 28px;
padding-bottom: 32px;
border-top: 1px solid rgba(255, 255, 255, 0.20);
}
.footdown {
display: flex;
align-items: center;
justify-content: space-between;
color: rgba(255, 255, 255, 0.5);
font-size: 14px;
line-height: 26px;
font-weight: 400;
}
.footdown .fl {
flex-wrap: wrap;
}
.footdown a {
color: rgba(255, 255, 255, 0.5);
font-size: 14px;
line-height: 26px;
font-weight: 400;
}
.footdown a:hover {
color: rgba(255, 255, 255, 1);
}
@media screen and (max-width:1366px) {
.footdown {
display: block;
overflow: hidden;
}
}
@media screen and (max-width:1280px) {
.foot_img .dis_flex>div {
padding-left: 15px;
}
.footdown .fl {
display: block;
}
.footdown .fr {
float: left;
}
}
@media screen and (max-width:1200px) {
.swiper-foot {
height: 170px;
}
.footdown,
.footdown a {
font-size: 14px;
}
}
@media screen and (max-width:991px) {
.footdown {
display: block;
line-height: 26px;
}
.footdown div {
line-height: 26px;
}
}
@media screen and (max-width:767px) {
.pc_show {
display: none !important;
}
.mo_shwo {
display: block !important;
}
.right_flow {
right: 1px;
}
.right_flow ul li a {
padding: 10px;
}
.right_flow>ul>li>a>img {
width: 20px;
}
.foot_top img {
width: 120px;
}
.foot_top .text {
padding-left: 12px;
margin-left: 12px;
font-size: 16px;
line-height: 26px;
}
.foot_mid {
padding-bottom: 15px;
padding-top: 20px;
}
.foot_mid .foot_menu ul {
display: block;
}
.foot_mid .foot_menu ul li {
width: 33.33%;
float: left;
}
.foot_mid .foot_menu ul li:last-child {
width: inherit;
}
.foot_img {
padding-top: 0px;
}
.foot_scoll {
display: none !important;
}
.foot_line {
padding-top: 15px;
padding-bottom: 15px;
}
.footdown,
.footdown a {
font-size: 14px;
}
}
@media screen and (max-width:1100px) {
.foot_top {
padding: 20px 0 15px 0;
}
.foot_mid {
padding-top: 20px;
padding-bottom: 25px;
}
.foot_line {
padding-top: 15px;
padding-bottom: 15px;
}
}
@media screen and (max-width:991px) {
.foot_mid {
display: block;
}
.foot_mid .foot_menu {
width: 100%;
}
.foot_img {
padding-left: 0;
padding-top: 30px;
}
}
@media screen and (max-width:767px) {
.foot_mid .foot_menu {
display: none;
}
.foot_img {
padding-top: 0px;
}
}
/*index new*/
.in_new_bg {
position: relative;
background: #F1F8FD;
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
z-index: 1;
}
.in_new_bg:before {
content: "";
position: absolute;
top: 0;
right: 0;
width: 50%;
height: 100%;
background-image: url(../images/new_icon.svg);
background-size: cover;
background-repeat: no-repeat;
z-index: -1;
}
.in_new_bg .down_icon {
bottom: 48px;
}
.index_title .big_t {
color: var(--main-color);
font-style: normal;
font-weight: 700;
line-height: 1.1;
}
.index_title .new_more {
position: relative;
display: flex;
align-items: center;
color: #666;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.index_title .new_more .new_cicle {
position: relative;
display: flex;
align-items: center;
margin-left: 16px;
width: 66px;
height: 38px;
overflow: hidden;
}
.index_title .new_more span {
position: absolute;
right: 0;
left: 0;
top: 0;
bottom: 0;
display: flex;
align-items: flex-start;
border-radius: 28px;
transition: .6s all;
}
.index_title .new_more .grey {
background: #E9E9E9;
transform: translate(0px, 0px);
opacity: 1;
}
.index_title .new_more .blue {
background: var(--main-color);
opacity: 0;
transform: scale(.7);
}
.index_title .new_more i {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
transition: .6s all;
}
.index_title .new_more i img {
width: 28px;
height: 28px;
}
.index_title .new_more span.grey i {
transform: translate(0px, 0px);
opacity: 1;
}
.index_title .new_more span.blue i {
transform: translate(-50%, 0px);
opacity: 0;
}
.index_title .new_more:hover {
color: var(--main-color);
}
.index_title .new_more:hover .grey {
transform: translate(-50%, 0px);
opacity: 0;
}
.index_title .new_more:hover .blue {
transform: translate(0px, 0px);
opacity: 1;
}
.index_title .new_more:hover .grey i {
transform: translate(50%, 0);
opacity: 0;
}
.index_title .new_more:hover .blue i {
transform: translate(0, 0);
opacity: 1;
}
.new_list {
padding-top: 60px;
}
.new_list ul {
display: flex;
flex-flow: row wrap;
align-items: stretch;
margin-left: -13px;
margin-right: -13px;
}
.new_list ul li {
float: left;
width: 29%;
height: 566px;
padding: 0 13px;
}
.new_list li:first-child {
width: 42%;
}
.new_list .new_one {
display: block;
position: relative;
width: 100%;
height: 100%;
border-radius: 8px;
overflow: hidden;
}
.new_list .thumb {
position: relative;
border-radius: 8px;
overflow: hidden;
}
.new_list .thumb i {
display: block;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
transition: transform cubic-bezier(0.22, 0.61, 0.36, 1) 0.4s;
z-index: 2;
}
.new_list .title_mask {
padding: 32px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
z-index: 3;
}
.new_one .thumb {
width: 100%;
height: 100%;
}
.new_list .new_one .time {
padding-left: 24px;
color: var(--white-color);
background-image: url(../images/time_white.svg);
background-size: 16px 16px;
background-repeat: no-repeat;
background-position: left;
font-size: 16px;
font-family: 'D-DINExp';
font-weight: 400;
line-height: 24px;
opacity: 0.5;
}
.new_list .new_one .title {
margin-top: 10px;
color: var(--white-color);
font-size: 20px;
font-style: normal;
font-weight: 400;
max-height: 60px;
line-height: 30px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.new_list a:hover .thumb i {
transform: scale(1.1);
}
.new_list .new_two {
position: relative;
display: block;
width: 100%;
height: 100%;
}
.new_two .thumb {
width: 100%;
height: 47.8%;
}
.new_list .new_two .new_text {
padding-top: 16px;
}
.new_list .new_text .time {
padding-left: 24px;
color: var(--blue-color);
font-size: 16px;
font-family: 'D-DINExp';
font-weight: 400;
line-height: 24px;
background-image: url(../images/time_blue.svg);
background-size: 16px 16px;
background-repeat: no-repeat;
background-position: left center;
}
.new_list .new_text .title {
margin-top: 16px;
color: var(--main-color);
font-size: 20px;
font-weight: 400;
height: 60px;
line-height: 30px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.new_list .new_text .des {
margin-top: 24px;
color: #657188;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
height: 48px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.new_list .more {
margin-top: 50px;
}
.new_list .more span {
display: flex;
width: 34px;
height: 24px;
padding: 6px;
justify-content: center;
align-items: center;
border-radius: 23px;
background: #fff;
transition: background .4s;
}
.new_list .more span i {
display: block;
width: 8px;
height: 8px;
background-image: url(../images/new_jia.svg);
background-repeat: no-repeat;
}
.new_list a:hover .more span {
background: var(--main-color);
}
.new_list a:hover .more span i {
background-image: url(../images/new_jiaw.svg);
}
.new_list .new_three {
display: block;
position: relative;
width: 100%;
}
.new_list li:last-child .new_three:nth-child(1) {
height: calc(50% - 10px);
}
.new_list li:last-child .new_three:nth-child(2) {
padding-top: 16px;
height: calc(50% + 10px);
}
.new_list .line:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background: #D9D9D9;
}
.new_list .line:before {
content: "";
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 1px;
background: var(--main-color);
transition: width .8s;
}
.new_list .line:hover .title {
color: var(--blue-color);
}
.new_list .line:hover:after {
opacity: 0;
}
.new_list .line:hover:before {
width: 100%;
}
@media screen and (min-width:1025px) {
.in_new_bg .index_title {
opacity: 0;
pointer-events: none;
-webkit-transform: translateY(4vw);
transform: translateY(4vw);
}
.new_list ul li {
opacity: 0;
pointer-events: none;
-webkit-transform: translateY(4vw);
transform: translateY(4vw);
}
/*切屏加载*/
.index_page_current .index_title {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
}
.index_page_current .new_list ul li {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
}
.index_page_current .new_list ul li:first-child {
-webkit-transition-delay: .2s;
transition-delay: .2s;
}
.index_page_current .new_list ul li:nth-child(2) {
-webkit-transition-delay: .4s;
transition-delay: .4s;
}
.index_page_current .new_list ul li:nth-child(3) {
-webkit-transition-delay: .5s;
transition-delay: .5s;
}
}
@media screen and (max-width:1366px) {
.new_list {
padding-top: 30px;
}
.new_list ul li {
height: 430px;
}
.new_list .more {
margin-top: 22px;
}
.new_list .new_text .des {
margin-top: 10px;
}
.new_list .new_text .title {
font-size: 18px;
line-height: 26px;
height: 52px;
}
.in_new_bg .down_icon {
bottom: 34px;
}
}
@media screen and (max-width:1280px) {
.new_list .title_mask {
padding: 32px 20px;
}
}
@media screen and (max-width:1024px) {
.in_new_bg {
padding: 60px 0;
}
}
@media screen and (max-height:700px) {
.new_list {
padding-top: 30px;
}
.new_list ul li {
height: 410px;
}
.new_list .new_text .des {
margin-top: 10px;
}
.new_list .more {
margin-top: 13px;
}
.in_new_bg .down_icon {
bottom: 34px;
}
}
@media screen and (max-height:690px) {
.in_new_bg .container {
padding-top: 40px;
}
.in_new_bg .down_icon {
bottom: 15px;
}
}
@media screen and (max-width:767px) {
.in_new_bg {
padding-bottom: 30px;
}
.in_new_bg .container {
padding-top: 0px;
}
.in_new_bg:before {
display: none;
}
.index_title .new_more .new_cicle {
margin-left: 12px;
width: 40px;
height: 30px;
}
.new_list ul {
display: block;
}
.new_list li:first-child {
width: 100%;
}
.new_list ul li {
height: auto;
width: 100%;
padding-bottom: 20px;
}
.new_two .thumb {
height: auto;
}
.new_list .new_one .title {
font-size: 18px;
line-height: 26px;
max-height: 52px;
}
.new_list .title_mask {
padding: 20px 15px;
}
.new_list .new_two .new_text {
margin-bottom: 20px;
padding-bottom: 20px;
}
.new_list li:last-child .new_three {
height: inherit;
padding-bottom: 20px;
}
.new_list .new_text .des {
font-size: 14px;
}
}
/*banner*/
.banner {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.index_banner {
width: 100%;
height: 100%;
}
.index_banner .index_banner_swp {
width: 100%;
height: 100%;
}
.index_banner .swiper-slide {
position: relative;
width: 100%;
height: 100%;
}
.index_banner .img_pc {
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
/*transform: translateZ(0) scale(1);*/
transition: all 2.5s ease-in-out;
}
/*.index_banner .swiper-slide-active .img_pc {
transform: translateZ(0) scale(1.1);
}*/
.index_banner .img_pc video {
-o-object-fit: cover;
object-fit: cover;
width: 100%;
height: 100%;
}
.index_banner .img_m {
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.index_banner_text {
position: absolute;
left: 0;
width: 100%;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 2;
}
.index_banner .index_banner_text .t1 {
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
overflow: hidden;
transition: all 1.2s .4s;
}
.index_banner .index_banner_text .t2 {
font-weight: 700;
line-height: 1.2;
color: #fff;
margin-top: 16px;
overflow: hidden;
transition: all 1.2s .6s;
}
.index_banner .index_banner_text .t3 {
color: #FFF;
font-size: 22px;
font-weight: 400;
line-height: 26px;
margin-top: 16px;
overflow: hidden;
transition: all 1.2s .8s;
}
.index_banner .index_banner_text .more_n {
overflow: hidden;
transition: all 1.2s 1s;
}
.index_banner_text .more_n {
overflow: hidden;
margin-top: 116px;
}
.more_n a {
display: flex;
position: relative;
align-items: center;
justify-content: center;
width: 158px;
height: 55px;
background-image: url(../images/more_n_bg.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
overflow: hidden;
z-index: 1;
}
.more_n a:before {
content: "";
position: absolute;
background-image: url(../images/more_hover_bg.svg);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
width: 0;
height: 102%;
left: 50%;
top: -1px;
transform: translateX(-50%);
transition: width .6s;
z-index: -1;
}
.more_n a .icon {
margin-left: 23px;
line-height: 10px;
}
.index_banner_text i {
font-style: normal;
line-height: inherit;
display: block;
}
.index_banner_text i {
transform: translateY(200%);
transition: all 1.6s cubic-bezier(.33, 1, .68, 1);
}
.index_banner_text .more_n a {
transform: translateY(200%);
transition: all 1.6s cubic-bezier(.33, 1, .68, 1);
}
.more_n a:hover {
color: var(--dark-color);
}
.more_n a:hover:before {
width: 100%;
}
.more_n a:hover .icon svg path {
stroke: var(--dark-color);
}
.index_banner .swiper-slide.swiper-slide-active i,
.index_banner .swiper-slide.swiper-slide-active .more_n a {
transform: translateY(0);
}
.index_banner_bottom {
position: absolute;
z-index: 3;
bottom: 0;
left: 0;
right: 0;
padding-top: 30px;
padding-bottom: 30px;
}
.white_r_line {
position: absolute;
right: 184px;
bottom: 0;
width: 1px;
height: calc(100% - 90px);
background-color: rgba(255, 255, 255, 0.3);
z-index: 3;
}
.index_banner_bottom .white_b_line {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
background-color: rgba(255, 255, 255, 0.3);
}
.index_jiant{position: absolute;bottom: 70px;right: 196px;width: 140px;height: 60px;}
.index_banner_bottom .swiper-button-next,
.index_banner_bottom .swiper-button-prev {
position: absolute;
top: 50%;
transform: translateY(-50%);
margin-top: 0;
width: 44px;
height: 44px;
background: rgba(0,0,0,0.4);
border-radius: 50%;
z-index: 30;
}
.index_banner_bottom .swiper-button-next {
right: 20px;
}
.index_banner_bottom .swiper-button-prev {
left: 20px;
}
.index_banner_progress {
display: inline-block;
float: right;
}
.index_banner_progress .list_ {
display: flex;
}
.index_banner_progress .list_ .i {
margin-left: 20px;
display: flex;
align-items: center;
}
.index_banner_progress .list_ span {
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
opacity: 0.5;
cursor: pointer;
}
.index_banner_progress .list_ span:hover {
opacity: 1;
}
.index_banner_progress .i.active span {
opacity: 1;
}
.index_banner_progress .progress {
position: relative;
margin-left: 10px;
width: 141px;
height: 2px;
background-color: rgba(255, 255, 255, 0.5);
}
.index_banner_progress .progress .d {
position: absolute;
left: 0;
height: 100%;
background-color: #ffffff;
}
.index_banner_progress .progress {
display: none;
}
.index_banner_progress .i.active .progress {
display: block;
}
.down_click {
cursor: pointer;
}
.icon-scroll {
float: left;
position: relative;
width: 48px;
height: 48px;
}
.icon-scroll span {
display: inline-block;
width: 100%;
height: 100%;
background-image: url(../images/cicle.svg);
background-repeat: no-repeat;
background-position: center;
animation: spin 10s linear infinite;
}
.icon-scroll i {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
animation: wave 1s ease-in-out alternate infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@keyframes wave {
from {
transform: translate(-50%, -60%);
}
to {
transform: translate(-50%, -20%);
}
}
.index_banner_bottom .play {
position: relative;
float: right;
height: 26px;
width: 20px;
margin-left: 10px;
}
.index_banner_bottom i {
cursor: pointer;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 20px;
height: 20px;
}
.index_banner_bottom .suspend {
display: none;
}
@media screen and (max-width:1800px) {
.index_banner_bottom .container {
padding-right: 50px;
}
}
@media screen and (max-width:1680px) {
.index_banner_bottom .container {
padding-right: 150px;
}
}
@media screen and (max-width:1580px) {
.index_banner_bottom .container {
padding-right: 200px;
}
}
@media screen and (max-width:1366px) {
.index_banner_bottom .container {
padding-right: 15%;
}
.index_banner_text .more_n {
margin-top: 66px;
}
}
@media screen and (max-width:1200px) {
.white_r_line {
display: none !important;
}
.index_banner_bottom .container {
padding-right: 8%;
}
}
@media screen and (max-width:991px) {
.index_banner .index_banner_text .t3 {
font-size: 20px;
}
.index_banner_bottom .container {
padding-right: 20px;
}
.index_banner_progress .progress {
width: 120px;
}
}
@media screen and (max-width:767px) {
.index_banner_text {
text-align: left;
}
.index_banner .index_banner_text .t3 {
font-size: 14px;
}
.index_banner_text .more_n {
padding-top: 50px;
}
.index_banner_text .more_n a {
/*margin: 0 auto;*/
}
.index_banner_progress .progress {
margin-left: 6px;
width: 80px;
}
.index_banner_progress .list_ .i {
margin-left: 16px;
}
.index_banner_progress .list_ .i:first-child {
margin-left: 0;
}
.white_b_line {
display: none !important;
}
.icon-scroll {
display: none !important;
}
.index_banner_bottom .dis_flex {
justify-content: flex-start;
}
}
/*index about*/
.in_about {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.about_video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.about_icon {
position: absolute;
top: 0;
right: 0;
width: 50%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
z-index: -1;
}
.about_video video {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.about_video img {
display: none;
}
.in_about .about_mask {
position: relative;
width: 100%;
height: 100%;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.60) 100%);
z-index: 1;
}
.in_about .about_mask .container {
height: 100%;
}
.about_top {
display: flex;
align-items: center;
width: 100%;
height: 100%;
}
.about_top .about_k {
width: 100%;
display: flex;
justify-content: space-between;
}
.about_top .fl {
max-width: 750px;
flex: 1;
}
.in_title .a_small_t {
color: var(--white-color);
font-weight: 400;
line-height: 26px;
}
.in_title .a_small_t span {
position: relative;
font-style: normal;
}
.in_title .a_small_t span:before {
content: "";
position: absolute;
left: calc(100% + 16px);
top: 50%;
transform: translateY(-50%);
width: 46px;
height: 1px;
background: #FFF;
}
.in_title .a_big_t {
color: var(--white-color);
font-weight: 700;
line-height: 1.3;
margin-top: 16px;
}
.about_top .a_text {
margin-top: 40px;
}
.a_text p {
color: var(--white-color);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
}
.about_top .a_more {
padding-top: 55px;
}
.about_top .a_more .more_n {
margin-right: 20px;
}
.about_mid {
padding-top: 26px;
padding-left: 50px;
display: flex;
justify-content: flex-end;
width: 100%;
}
.about_mid .about_num {
position: relative;
max-width: 422px;
}
.about_mid .about_num .w_line {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
background-color: var(--white-color);
}
.about_num .num_small {
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.about_num ul {
display: flex;
flex-flow: row wrap;
align-items: stretch;
}
.about_num .li {
width: 50%;
display: flex;
padding-bottom: 40px;
}
.about_num .num_ber span {
color: var(--white-color);
font-family: D-DINExp;
font-size: 56px;
font-weight: 700;
letter-spacing: 2px;
line-height: 1.1;
}
.about_num .num_ber em {
color: var(--white-color);
font-style: normal;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.about_num .num_ber strong {
color: var(--white-color);
font-family: DIN;
font-size: 58px;
font-style: normal;
font-weight: 700;
line-height: 1.1;
}
.about_link {
width: 100%;
padding-top: 18%;
max-width: 675px;
}
.about_link ul {
margin-left: -6px;
margin-right: -6px;
}
.about_link ul li {
padding-right: 6px;
padding-left: 6px;
padding-bottom: 12px;
width: 33.33%;
float: left;
}
.about_link ul li:last-child {
padding-right: 0;
}
.about_link .border {
display: inline-block;
padding: 24px;
/* width: 214px; */
width: 100%;
border-radius: 16px 8px 16px 2px;
border: 1px solid rgba(255, 255, 255, 0.30);
background: rgba(0, 0, 0, 0.01);
transition: all .4s ease;
}
.about_link .icon img {
width: 38px;
}
.about_link .title {
margin-top: 16px;
display: flex;
justify-content: space-between;
color: var(--white-color);
font-size: 18px;
font-weight: 700;
line-height: 1.2;
}
.about_link .m_icon {
position: relative;
width: 22px;
height: 22px;
opacity: 0.5;
overflow: hidden;
}
.about_link .m_icon i img {
width: 100%;
height: 100%;
position: absolute;
left: 0;
transition: left .4s;
}
.about_link .m_icon i img:nth-child(2) {
left: -100%;
}
.about_link .border:hover {
border: 1px solid var(--white-color);
background: rgba(255, 255, 255, 0.20);
backdrop-filter: blur(3px);
}
.about_link .border:hover .m_icon {
opacity: 1;
}
.about_link .border:hover .m_icon i img:first-child {
left: 100%;
}
.about_link .border:hover .m_icon i img:nth-child(2) {
left: 0;
}
.about_mask .down_icon {
bottom: 48px;
}
.down_icon {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.down_icon span {
position: relative;
display: inline-block;
width: 34px;
height: 34px;
border-radius: 50%;
border: 1px solid white;
}
.down_icon.icon_white span {
border-color: white;
}
.down_icon span i {
position: absolute;
left: 50%;
top: 50%;
width: 16px;
transform: translate(-50%, -50%);
animation: wave 1s ease-in-out alternate infinite;
}
@media screen and (max-height:800px) {
.about_top .a_more {
padding-top: 35px;
}
.about_mask .down_icon {
bottom: 30px;
}
}
@media screen and (max-height:700px) {
.about_k {
padding-top: 30px;
}
.about_link {
padding-top: 25px;
}
.about_top .a_text {
margin-top: 20px;
}
.about_mask .down_icon {
bottom: 20px;
}
}
@media screen and (max-width:1366px) {
.about_num .num_ber span {
font-size: 54px;
}
}
@media screen and (max-width:1280px) {
.about_link {
padding-top: 10%;
}
.about_mid .about_num {
width: 360px;
}
.about_num .num_ber span,
.about_num .num_ber strong {
font-size: 50px;
}
.about_link .border {
padding: 20px;
width: 100%;
}
.about_link .icon img {
width: 30px;
}
}
@media screen and (max-width:1200px) {
.about_link .border {
padding: 20px 15px;
}
.about_link .icon img {
width: 26px;
}
.about_mid .about_num {
width: 340px;
}
.about_num .num_ber span,
.about_num .num_ber strong {
font-size: 48px;
}
}
@media screen and (max-width:1024px) {
.down_icon {
display: none !important;
}
.in_about .about_mask {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media screen and (max-width:991px) {
.about_top .fl {
max-width: 690px;
width: calc(100% - 260px);
}
.about_num .num_ber span,
.about_num .num_ber strong {
font-size: 50px;
}
.about_link .border {
width: 100%;
}
.about_num .num_ber span,
.about_num .num_ber strong {
font-size: 48px;
}
}
@media screen and (max-width:767px) {
.about_top .fl {
max-width: inherit;
width: 100%;
}
.in_about .about_mask {
padding-top: 40px;
padding-bottom: 56px;
}
.about_top .about_k {
display: block;
}
.about_top .about_k .a_small_t {
display: none;
}
.about_video video {
display: none !important;
}
.about_video img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.about_mid {
justify-content: center;
padding-top: 35px;
padding-left: 0;
width: 100%;
}
.about_mid .about_num {
width: 100%;
}
.about_num .num_ber span,
.about_num .num_ber strong {
font-size: 28px;
}
.about_link {
display: none !important;
}
.about_link ul {
margin-left: -6px;
margin-right: -6px;
}
.about_link ul li {
width: 50%;
padding: 6px;
}
.about_num .li {
padding-bottom: 20px;
}
.about_k .fr {
width: 100%;
float: inherit;
}
.about_link .border {
padding: 24px 16px;
}
.a_text p,
.about_num .num_small {
font-size: 14px;
}
.about_top .a_more {
padding-top: 10px;
}
}
/*product */
.in_product {
position: relative;
height: 100%;
background: #ffffff;
padding-top: 90px;
z-index: 1;
}
.in_product:after {
content: "";
position: absolute;
right: 0;
width: 100%;
height: 38%;
bottom: 0;
background: #F1F8FD;
z-index: -1;
}
.in_product .pro_bg_r {
position: absolute;
right: 0;
bottom: 0;
width: 50%;
height: 50%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
opacity: 0.1;
}
.pro_content {
position: relative;padding:80px 0;
width: 100%;
height: 100%;
background-image: url('../images/pro_bg.jpg');
background-size: cover;
background-position: center; /* 确保图片居中 */
}
.pro_content h2{
line-height: 1.2;
font-size: 36px;
color: #182B62;
text-align: center;
font-weight: bold;
text-shadow: 0 0.3em 10px rgb(0 0 0 / 20%);
}
.productsgd{position: relative;}
.products_nr{width:90%;margin: 0 auto;overflow: hidden;}
.products_nr .swiper-wrapper{padding: 80px 0;}
.products_nr .swiper-slide{font-size: 16px;}
.products_nr .swiper-slide img {
display: block;
width: 100%;
height:auto;margin-bottom: 15px;
}
.products_nr .swiper-slide em{font-style: normal;padding-top: 15px;font-size: 12px;color: #7f8c94;display: block;line-height: 1.8;display: -webkit-box;
-webkit-line-clamp: 3; /* 限制显示的行数 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-word; /* 可选：处理长单词换行 */}
.products_nr .swiper-button-next {
position: absolute;
width: 60px;
height: 60px;
top: calc((100% - 60px) / 2);
cursor: pointer;
font-size: 24px;
color: #0068b7;
background: rgba(255, 255, 255, 1);
box-shadow: 0 0 40px rgb(29 56 75 / 17%);
align-items: center;
justify-content: center;
display: flex;
border-radius: 50%;
bottom: 10px;
z-index: 1;
transition: all .5s ease;
margin-top: 0px;
right: 5%;
margin-right: -30px;
}
.products_nr .swiper-button-prev {
position: absolute;
width: 60px;
height: 60px;
top: calc((100% - 60px) / 2);
cursor: pointer;
font-size: 24px;
color: #0068b7;
background: rgba(255, 255, 255, 1);
box-shadow: 0 0 40px rgb(29 56 75 / 17%);
align-items: center;
justify-content: center;
display: flex;
border-radius: 50%;
bottom: 10px;
z-index: 1;
transition: all .5s ease;
margin-top: 0px;
left: 5%;
margin-left: -30px;
}
.products_nr .swiper-button-prev:hover {
background: linear-gradient(45deg, #00a0e9 0%, #0068b7 80%);
box-shadow: 0 0 27px rgb(0 104 183 / 27%) !important
}
.products_nr .swiper-button-next:hover {
background: linear-gradient(45deg, #00a0e9 0%, #0068b7 80%);
box-shadow: 0 0 27px rgb(0 104 183 / 27%) !important
}
.products_nr .swiper-button-prev:hover:after {
color: #ffffff
}
.products_nr .swiper-button-next:hover:after {
color: #ffffff
}
.products_nr .swiper-slide {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
background_radio: 2;
display-radio: flex;
padding-top: 15px;
padding-bottom: 15px;
padding-right: 15px;
padding-left: 15px;
border-radius: 10px;
background-color: rgba(255,255,255,1);
box-shadow: 0 0 20px rgb(29 56 72 / 15%);
transition: all .5s
}
.products_nr .swiper-slide:hover {
transform: translateY(-20px);
background: linear-gradient(0deg, #00a0e9 0%, #0068b7 100%);
}
.products_nr .swiper-slide:hover a{color: #ffffff;}
.products_nr .swiper-slide:hover a em{color: #ffffff;}
.e_button-11 {
display: block;
position: relative;
overflow: hidden;
text-align: center;
box-sizing: border-box;
width: 160px;
height: 42px;
color: rgba(255,255,255,1);
padding-right: 20px;
padding-left: 20px;
padding-top: 0;
padding-bottom: 0;
line-height: 40px;
border-width: 1px;
border-style: none;
border-color: transparent;
border-top-left-radius: 20px;
border-top-right-radius: 0px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 0px;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 0%;
font-size: 15px;
background: linear-gradient(to right,#00a0e9,#0068b7);
transition: all .5s ease
}
.e_button-11:hover {
border-top-left-radius: 0px;
border-bottom-right-radius: 0px;
border-top-right-radius: 20px;
border-bottom-left-radius: 20px;
background: linear-gradient(to right,#0068b7,#00a0e9);
box-shadow: 0 16px 43px -8px rgb(0 104 183 / 50%)
}
.e_button-11 span {
display: block;
width: 100%;
position: relative;
z-index: 1;
outline: 0;
margin: 0px;
overflow: hidden;line-height: 42px;
}
.in_product .in_p_pic {
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 100%;
}
.in_product .in_p_cont {
float: right;
position: relative;
width: 100%;
height: 100%;
z-index: 9;
}
.in_product .in_p_cont:before {
content: "";
position: absolute;
right: 0;
top: 0;
background-image: url(../images/pro_bg_r.svg);
background-position: top right;
background-size: contain;
background-repeat: no-repeat;
width: 365px;
height: 317px;
z-index: -1;
}
.in_p_cont .container {
height: 100%;
}
.in_p_cont .p_r_cont {
position: relative;
width: 50%;
height: 100%;
padding-left: 84px;
display: flex;
flex-direction: column;
justify-content: center;
}
.in_p_cont .p_r_cont:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 365px;
height: 317px;
max-width: 50%;
background-image: url(../images/pro_bg2.png);
background-repeat: no-repeat;
background-size: contain;
background-position: bottom left;
}
.in_p_cont .in_title {
padding-top: 96px;
}
.in_product .in_p_pic .pro_loop_pic {
width: 100%;
height: 100%;
}
.in_product .in_p_pic .pro_loop_pic .thumb {
position: relative;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
font-size: 30px;
color: red;
display: flex;
align-items: center;
justify-content: center;
}
.in_product .in_p_pic .pro_loop_pic .thumb:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.20);
}
.in_product .in_p_pic .pro_loop_pic .thumb img {
display: none;
}
.pro-swiper01 {
width: 100%;
}
.pro-swiper01 .swiper-slide {
width: 120px;
}
.infor_button {
margin-top: 46px;
display: flex;
justify-content: space-between;
width: 100%;
position: relative;
z-index: 9;
}
.infor_button .in_l {
flex: 1;
display: flex;
align-items: center;
}
.infor_button .in_l .swiper-num {
display: flex;
align-items: center;
}
.infor_button .in_l .swiper-num span {
font-family: DIN;
font-size: 20px;
font-weight: 700;
line-height: 26px;
color: #BBCBD7;
}
.infor_button .in_l .swiper-num .total {
padding-left: 4px;
}
.infor_button .in_l .swiper-num .active {
color: var(--dark-color);
padding-right: 4px;
}
.infor-pagination {
margin-left: 27px;
position: relative;
width: calc(100% - 84px);
height: 2px;
background: #D2E0EA;
}
.infor-pagination .swiper-pagination-progressbar-fill {
background: var(--dark-color);
}
.infor_button .in_r {
display: flex;
align-items: center;
width: 116px;
}
.infor_button .in_r>div {
display: flex;
align-items: center;
justify-content: center;
margin-left: 8px;
width: 50px;
height: 50px;
border: 1px solid #ffffff;
background-color: var(--white-color);
border-radius: 50%;
transition: background-color 0.3s ease;
cursor: pointer;
}
.infor_button .in_r>div i {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
overflow: hidden;
}
.infor-prev i:before,
.infor-prev i:after,
.infor-next i:before,
.infor-next i:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
transition: transform 0.4s ease;
}
.infor-prev i:before {
left: 0;
top: 0;
background-image: url(../images/index_p_l.svg);
}
.infor-prev i:after {
left: 0;
top: 0;
transform: translateX(-100%);
background-image: url(../images/index_p_lh.svg);
}
.infor-next i:before {
left: 0;
top: 0;
background-image: url(../images/index_p_r.svg);
}
.infor-next i:after {
left: 0;
top: 0;
transform: translateX(-100%);
background-image: url(../images/index_p_rh.svg);
}
.infor_button .in_r>div:hover {
background-color: var(--main-color);
border-color: var(--main-color);
}
.infor_button .in_r>div.infor-prev:hover i:before {
transform: translateX(100%);
}
.infor_button .in_r>div.infor-prev:hover i:after {
transform: translateX(0);
}
.infor_button .in_r>div.infor-next:hover i:before {
transform: translateX(-100%);
}
.infor_button .in_r>div.infor-next:hover i:after {
transform: translateX(0);
}
.pro-swiper03 .swiper-slide {
opacity: 0 !important;
}
.pro-swiper03 .swiper-slide.swiper-slide-active {
opacity: 1 !important;
}
.pro-swiper01 .bg {
padding: 20px 10px;
border-radius: 8px;
cursor: pointer;
}
.pro-swiper01 .swiper-slide-active .bg {
background: #FFF;
}
.pro-swiper01 .bg .t {
margin-top: 8px;
color: var(--main-color);
text-align: center;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
}
.pro-swiper01 .bg span {
display: inline-block;
text-align: center;
width: 100%;
}
.pro-swiper01 .bg span img {
width: 58px;
}
.pro-swiper01:after {
content: "";
position: absolute;
right: 0;
top: 0;
height: 100%;
background-image: url(../images/pro_t_bg.svg);
width: 69px;
z-index: 1;
}
.pro-swiper03 {
margin-top: 55px;
margin-bottom: 110px;
width: 100%;
}
.pro-swiper03 .t {
position: relative;
padding-bottom: 16px;
color: var(--main-color);
font-style: normal;
font-weight: 700;
line-height: 1.1;
}
.pro-swiper03 .t:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
background-image: url(../images/pro_line.svg);
background-repeat: no-repeat;
background-position: left;
background-size: contain;
width: 31px;
height: 4px;
}
.pro-swiper03 .text {
margin-top: 24px;
color: #657188;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
height: 52px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.pro-swiper03 .more_n {
margin-top: 40px;
}
.pro-swiper03 .more_n a {
background-image: url(../images/more_b_bg.svg);
color: var(--main-color);
}
.pro-swiper03 .more_n a:hover {
color: #fff;
}
.pro-swiper03 .more_n a:before {
background-image: url(../images/more_bh_bg.svg);
}
.pro-swiper03 .more_n a:hover .icon svg path {
stroke: #ffffff;
}
.pro_content .down_icon {
bottom: 34px;
z-index: 9;
}
.down_icon.icon_blue span {
border-color: var(--main-color);
}
.pro_select_box {
display: flex;
width: calc(50% - 16px);
margin-right: 16px;
padding: 16px;
height: 58px;
justify-content: space-between;
align-items: center;
opacity: 1;
border-radius: 16px 0px 16px 16px;
background: #F1F8FD;
position: relative;
}
.select01 {
z-index: 9;
}
.select02 {
z-index: 8;
}
.pro_select_box .span {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
cursor: pointer;
z-index: 1;
}
.pro_select_box .span input {
display: block;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
width: calc(100% - 40px);
height: 100%;
padding: 0 16px;
background: #F1F8FD;
border-radius: 16px 0px 16px 16px;
font-size: 16px;
color: #657188;
}
.pro_select_box .span input::-webkit-input-placeholder {
color: #657188;
font-size: 16px;
}
.pro_select_box .span input:-moz-placeholder {
color: #657188;
font-size: 16px;
}
.pro_select_box .span input::-moz-placeholder {
color: #657188;
font-size: 16px;
}
.pro_select_box .span input:-ms-input-placeholder {
color: #657188;
font-size: 16px;
}
.pro_select_box .span .icon {
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
width: 24px;
height: 24px;
background-image: url(../images/pro_s_jt.svg);
}
.pro_select_box .drop_down_ {
position: absolute;
left: 0;
top: 100%;
right: 0;
border-radius: 0 0px 16px 16px;
background: #F1F8FD;
padding: 10px 5px;
display: none;
}
.select_pro,
.select_lingyu {
width: 100%;
padding-right: 20px;
height: 230px;
}
.select_pro .swiper-slide,
.select_lingyu .swiper-slide {
height: 46px;
}
.swiper-container-vertical>.select_pro,
.swiper-container-vertical>.select_lingyu {
width: 2px;
background-color: transparent;
}
.select_pro .swiper-scrollbar-drag,
.select_lingyu .swiper-scrollbar-drag {
background-color: var(--dark-color);
}
.pro_select_box .drop_down_ p {
color: var(--main-color);
font-size: 16px;
margin: 10px 0;
line-height: 26px;
cursor: pointer;
}
.pro_select_box .drop_down_ p:hover {
color: #666;
}
.pro_select_box.bg {
border-radius: 16px 0px 0 0;
}
/* .pro_mo_top .pro-swiper01 .swiper-wrapper {
margin-left: -240px;
}*/
@media (max-height:750px) {
.pro-swiper03 {
margin-top: 55px;
margin-bottom: 50px;
}
s .in_product::after {
height: 36%;
}
}
@media (max-height:700px) {
.pro-swiper03 {
margin-top: 35px;
margin-bottom: 30px;
}
.in_product::after {
height: 36%;
}
.pro-swiper03 .more_n {
margin-top: 30px;
}
}
@media (max-width:1366px) {
.pro-swiper03 {
margin-top: 55px;
margin-bottom: 50px;
}
.in_product::after {
height: 36%;
}
}
@media (max-width:1024px) {
.in_product {
padding-top: 0;
height: 730px;
}
.in_product::after {
height: 42%;
}
}
@media (max-width:767px) {
.in_product {
height: auto;
background: #F1F8FD;
}
.in_product::after {
display: none;
}
.in_product .in_p_cont::before {
max-width: 50%;
}
.in_p_cont .in_title {
padding-top: 50px;
}
.in_p_cont .p_r_cont {
width: 100%;
padding-left: 0;
padding-top: 25px;
}
.pro_select_box .span input {
font-size: 14px;
}
.pro_select_box .span input::-webkit-input-placeholder {
font-size: 14px;
}
.pro_select_box .span input:-moz-placeholder {
font-size: 14px;
}
.pro_select_box .span input::-moz-placeholder {
font-size: 14px;
}
.pro_select_box .span input:-ms-input-placeholder {
font-size: 14px;
}
.in_product .in_p_pic {
position: relative;
width: 100%;
height: 100%;
}
.in_product .in_title .a_small_t {
color: #657188;
display: none;
}
.in_product .in_title .a_small_t span::before {
background-color: #657188;
}
.in_product .in_title .a_big_t {
color: var(--main-color);
}
.in_product .in_p_pic .pro_loop_pic .thumb img {
display: block;
}
.pro-swiper01 .bg {
padding: 15px 10px;
padding-bottom: 10px;
}
.pro_select_box,
.pro_select_box .span input {
background-color: #fff;
}
.pro_select_box .drop_down_ {
background: #fff;
}
.pro_select_box {
width: calc(50% - 10px);
margin-right: 10px;
padding: 10px 10px;
height: 45px;
border-radius: 12px 0px 12px 12px;
}
.pro_select .pro_select_box:nth-child(2) {
margin-right: 0;
}
.pro-swiper03 {
margin-top: 160px;
margin-bottom: 30px;
}
.pro-swiper03 .more_n {
margin-top: 20px;
}
.pro_mo_top {
position: absolute;
left: 0;
top: 100px;
width: 100%;
height: 105px;
padding-left: 40px;
padding-right: 40px;
}
.pro-swiper01:after {
display: none;
}
.pro-swiper01 .bg span img {
width: 30px;
}
.pro-swiper01 .bg .t {
font-size: 14px;
height: 40px;
line-height: 20px;
}
.infor_button {
display: flex !important;
margin-top: 5px;
justify-content: flex-end;
z-index: 8;
}
.in_p_cont .p_r_cont:after,
.infor_button .in_l {
display: none;
}
.pro-swiper03 .text {
margin-top: 20px;
font-size: 14px;
line-height: 24px;
height: 48px;
}
.infor_button .in_r>div {
position: absolute;
top: -72px;
}
.infor_button .in_r .infor-prev {
left: -52px;
}
.infor_button .in_r .infor-next {
right: -44px;
}
.more_n a {
width: 127px;
height: 45px;
font-size: 14px;
line-height: 20px;
background-size: contain;
}
.more_n a .icon {
margin-left: 15px;
}
.more_n a .icon svg {
width: 20px;
height: 8px;
}
}
/*right*/
.right-navigate {
position: fixed;
right: 30px;
top: 50%;
transform: translateY(50%);
-webkit-transform: translateY(50%);
margin-top: -75px;
z-index: 20;
right: -100px;
opacity: 0;
transition: 0.68s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.right-navigate.show {
opacity: 1;
right: 30px;
}
.right-navigate.Colors .navigate-li li.active i:before {
background: none;
}
.right-navigate.Colors .navigate-li li i:before {
background: #fff;
}
.right-navigate.Colors .navigate-li li span {
color: #fff;
}
.right-navigate .consulting {
position: absolute;
bottom: -90px;
right: -20px;
}
.right-navigate .consulting i {
opacity: 0;
visibility: hidden;
margin-top: -15px;
transition: 0.45s;
}
.right-navigate .consulting:hover i {
opacity: 1;
visibility: visible;
margin-top: 0;
}
.navigate-li li {
position: relative;
margin-bottom: 16px;
cursor: pointer;
}
.navigate-li li:hover i:before,
.navigate-li li.active i:before {
left: 0;
margin-left: 0;
top: 0;
margin-top: 0;
width: 100%;
height: 100%;
border: 2px solid var(--main-color);
background: transparent;
}
.navigate-li li i {
display: block;
position: relative;
width: 10px;
height: 10px;
}
.navigate-li li i:before {
position: absolute;
left: 50%;
top: 50%;
margin-left: -5px;
margin-top: -5px;
content: "";
width: 10px;
height: 10px;
box-sizing: border-box;
background: rgba(101, 113, 136, 0.80);
border-radius: 50%;
transition: 0.45s;
}
.navigate-li li span {
display: none;
line-height: 14px;
color: var(--dark-color);
font-size: 12px;
font-weight: 400;
width: 12px;
opacity: 0;
visibility: hidden;
transition: 0.4s;
}
.navigate-li li.active span {
opacity: 1;
display: inline-block;
visibility: visible;
}
.navigate-li li:hover i {}
.navigate-li li.active i {
display: none;
}
@media (max-width:1024px) {
.right-navigate {
display: none !important;
}
}
/*首页整屏过渡效果*/
@media screen and (min-width:1025px) {
.in_title .a_small_t,
.in_title .a_big_t,
.about_top .a_text,
.about_top .a_more,
.about_link {
opacity: 0;
transform: translateY(4vw);
}
.index_page_current .in_title .a_small_t,
.about_num .li {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .2s;
transition-delay: .2s;
}
.index_page_current .a_big_t {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .3s;
transition-delay: .3s;
}
.index_page_current .about_top .a_text {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .4s;
transition-delay: .4s;
}
.index_page_current .about_top .a_more {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .5s;
transition-delay: .5s;
}
.index_page_current .about_link {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .6s;
transition-delay: .6s;
}
.index_page_current .about_num .li {
opacity: 1;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .6s;
transition-delay: .6s;
}
/*滚动加载*/
.pro_select {
opacity: 0;
pointer-events: none;
transform: translateY(4vw);
}
.pro-swiper01,
.pro-swiper03,
.infor_button {
opacity: 0;
pointer-events: none;
-webkit-transform: translateY(4vw);
transform: translateY(4vw);
}
.index_page_current .pro_select {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
}
.index_page_current .pro-swiper03 {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .4s;
transition-delay: .3s;
}
.index_page_current .pro-swiper01 {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .5s;
transition-delay: .5s;
}
.index_page_current .infor_button {
opacity: 1;
pointer-events: auto;
-webkit-transform: none;
transform: none;
-webkit-transition: all 1s cubic-bezier(.4, 0, .2, 1);
transition: all 1s cubic-bezier(.4, 0, .2, 1);
-webkit-transition-delay: .6s;
transition-delay: .6s;
}
}
/*news*/
.height90 {
width: 100%;
height: 90px;
}
.page_ban {
position: relative;
height: 550px;
width: 100%;
/*overflow: hidden;*/
}
.ban_mask {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.ban_mask .ban_w {
position: absolute;
right: 0;
top: 0;
width: 50%;
height: 100%;
max-width: 550px;
background-size: contain;
background-repeat: no-repeat;
opacity: 0.3;
}
.ban_mask .container {
height: 100%;
}
.pc_ban {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.location {
display: flex;
align-items: center;
position: relative;
z-index: 9;
background-image: url(../images/i_home_w.png);
padding-left: 30px;
background-size: 20px 20px;
background-position: left;
background-repeat: no-repeat;
}
.location>a {
color: #ffffff;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 24px;
opacity: 0.5;
}
.location .home {
background-image: url(../images/n_home.svg);
padding-left: 30px;
background-size: 20px 20px;
background-position: left;
background-repeat: no-repeat;
}
.location>a:nth-child(n+2) {
background-image: url(../images/line_x.svg);
background-repeat: no-repeat;
background-position: left;
padding-left: 16px;
margin-left: 10px;
background-size: 6px 24px;
}
.location>a:hover {
opacity: 1;
}
.location .click_down>a {
background-image: url(../images/line_x.svg);
background-repeat: no-repeat;
background-position: left;
padding-left: 16px;
margin-left: 10px;
line-height: 24px;
background-size: 6px 24px;
color: #fff;
opacity: 0.5;
}
.location .click_down>a:hover {
opacity: 1;
}
.click_down {
position: relative;
}
.click_down .erji {
position: absolute;
left: 50%;
transform: translateX(-50%);
padding: 10px;
width: 100px;
background-color: rgba(255, 255, 255, 1.0);
display: none;
}
.click_down .erji a {
display: block;
margin: 5px 0;
line-height: 30px;
text-align: center;
color: var(--blue-color);
}
.ban_text {
position: relative;
display: flex;
width: 100%;
height: 100%;
align-items: center;
}
.ban_text h2 {
padding-top: 10px;
color: #FFF;
font-weight: 700;
line-height: 1.4;text-shadow: 0 0.3em 10px rgb(0 0 0 / 20%);
}
.ban_text .eng {
padding-top: 10px;
color: #FFF;
font-family: Alimama FangYuanTi VF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.ban_text .ban_down {
position: absolute;
right: 0;
bottom: 40px;
}
.ban_text .ban_down i {
position: relative;
display: inline-block;
width: 48px;
height: 48px;
}
.ban_text .ban_down i img:first-child {
animation: spin 8s linear infinite;
}
.ban_text .ban_down i img:nth-child(2) {
position: absolute;
left: 50%;
top: 50%;
width: 24px;
height: 24px;
transform: translate(-50%, -50%);
animation: moveArrows 3s ease-in-out infinite;
}
.p_list{position: absolute;bottom: 0;left:50%;transform: translateX(-50%);display: flex;justify-content: center; gap: 20px;margin-bottom: -30px; z-index: 9;}
.p_list a.e_button-11{height: 60px;line-height: 60px;}
.p_list a.e_button-11 span{line-height: 60px;}
.neirong{background-color: rgba(246, 249, 251, 1);padding: 80px 48px;}
.p_data .p_focus {
display: flex;
flex-wrap: wrap;
position: relative;
max-width: 100%;
}
.p_data .p_focusItem {
flex-grow: 0;
flex-shrink: 0;
flex-basis: calc(96% / 3);
margin-right: 2%;
position: relative;
}
.p_data .p_focusItem:nth-child(3n) {
margin-right: 0
}
.p_data .p_right {
flex: 0 0 50%
}
.p_data .p_nodata {
min-height: 200px
}
.p_data .e_image-13 {
position: relative;
overflow: hidden;
width: 100%;
padding-bottom: 65%
}
.p_data .e_image-13 img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
transition: all .5s ease
}
.p_data .e_container-10 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
display-radio: flex;
padding-top: 35px;
padding-bottom: 35px;
padding-left: 35px;
padding-right: 35px;
margin-bottom: 50px;
background-color: rgba(255,255,255,1);
box-shadow: 0px 0px 20px 0px rgb(29 56 75 / 5%);
transform: translateY(0);
transition: all .5s ease
}
.p_data .e_container-10:hover {
transform: translateY(-10px);
box-shadow: 0 0 54px rgb(29 56 75 / 26%)
}
.p_data .e_container-10 > .p_item {
flex: 1;
max-width: 100%;
max-height: 100%
}
.p_data .e_timeFormat-11 {
min-height: 20px;
font_radio: 2;
display-radio: 1;
font-size: 14px;
color: rgba(127,140,148,1);
line-height: 1.5;
font-weight: normal;
font-family: Arial
}
.p_data .e_text-12 {
line-height: 30px;
height: 60px;
font_radio: 2;
display-radio: -webkit-box;
font-size: 20px;
color: rgba(34,34,34,1);
font-weight: bold;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
transition: all .5s ease;
margin-top: 15px;
margin-bottom: 20px
}
.p_data .e_container-10:hover .e_text-12 {
color: #0068b7
}
.p_data .e_container-10:hover .e_image-13 img {
transform: translate( -50%, -50%) scale(1.1)
}
.p_data .e_richText-14 {
font_radio: 2;
display-radio: -webkit-box;
margin-top: 20px;
margin-bottom: 20px;
font-size: 14px;
color: rgba(127,140,148,1);
line-height: 26px;
height: 52px;
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
transition: all .5s ease
}
.p_data .e_text-15 {
line-height: normal
}
.p_data .e_text-15 .new_top_more {
background: transparent;
color: #7f8c94;
padding: 0;
border-top: 2px solid #d8d8d8;
width: 100%;
border-radius: 0;
font-size: 14px;
line-height: 20px
}
.p_data .e_text-15 .common_more {
display: flex;
align-items: center;
justify-content: space-between;
height: 60px;
box-sizing: border-box;
transition: all .3s;
position: relative
}
.p_data .e_text-15 .more_box {
position: absolute;
width: 23px;
height: 23px;
border: 1px solid #fff;
border-radius: 50%;
display: inline-block;
opacity: 1;
right: 10px
}
.p_data .e_text-15 .new_top_more .more_box {
border: 1px solid #7f8c94;
right: 0
}
.p_data .e_text-15 .more_box::before {
position: absolute;
content: '';
left: 50%;
top: 50%;
width: 5px;
height: 5px;
background: #7f8c94;
border-radius: 50%;
margin-top: -2.5px;
margin-left: -2.5px;
z-index: 1
}
.p_data .e_text-15 .more_box::after {
position: absolute;
content: '';
top: 50%;
width: 52px;
height: 1px;
background: #7f8c94;
left: -42px;
margin-top: 0px
}
.p_data .e_container-10:hover .e_text-15 .new_top_more {
color: #0068b7
}
.p_data .e_container-10:hover .e_text-15 .more_box {
border: 1px solid #0068b7
}
.p_data .e_container-10:hover .e_text-15 .more_box::before {
background: #0068b7
}
.p_data .e_container-10:hover .e_text-15 .more_box::after {
background: #0068b7
}
.p_data .p_list {
display: flex;
flex-wrap: wrap
}
.p_data .p_loopItem {
position: relative;
flex: 0 0 100%
}
.p_data .e_container-25 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
display-radio: flex;
padding-top: 35px;
padding-bottom: 35px;
padding-right: 35px;
padding-left: 35px;
}
.p_data .e_container-18 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
display-radio: flex;
margin-bottom: 40px;
background-color: rgba(255,255,255,1);
transition: all .5s ease;
box-shadow: 0px 0px 20px 0px rgb(29 56 75 / 5%)
}
.p_data .e_container-18:hover {
box-shadow: 0 0 54px rgb(29 56 75 / 26%);
transform: translateY(-10px)
}
.p_data .e_container-18 > .p_item {
flex: 1;
max-width: 100%;
max-height: 100%
}
.p_data .e_container-18 .cbox-18-1 {
flex: 0 0 80%
}
.p_data .e_container-19 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
display-radio: flex;
padding-top: 4.8%;
padding-left: 5%;
padding-bottom: 4.8%;
padding-right: 5%
}
.p_data .e_container-19 > .p_item {
flex: 1;
max-width: 100%;
max-height: 100%
}
.p_data .e_container-20 {
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
display-radio: flex;
justify-content: space-between
}
.p_data .e_container-20 > .p_item {
flex: 1;
max-width: 100%;
max-height: 100%
}
.p_data .e_container-20 .cbox-20-0 {
flex: 0 0 70%
}
.p_data .e_container-20 .cbox-20-1 {
flex: 0 0 auto
}
.p_data .e_timeFormat-21 {
min-height: 20px;
font_radio: 2;
display-radio: 1;
font-size: 60px;
color: rgba(51,51,51,1);
line-height: 60px;
font-family: Impact;
text-align: center;
transition: all .5s ease
}
.p_data .e_text-23 {
line-height: 1.6;
font_radio: 2;
display-radio: -webkit-box;
font-size: 20px;
color: rgba(34,34,34,1);
font-weight: bold;
transition: all .2s ease;
-webkit-line-clamp: 1;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden
}
.p_data .e_richText-24 {
font_radio: 2;
display-radio: -webkit-box;
font-size: 14px;
color: rgba(127,140,148,1);
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 26px;
height: 52px;
margin-top: 15px
}
.p_data .e_container-18:hover .e_text-23 {
color: #0068b7
}.p_data .e_text-23 {
line-height: 1.6;
font_radio: 2;
display-radio: -webkit-box;
font-size: 20px;
color: rgba(34,34,34,1);
font-weight: bold;
transition: all .2s ease;
-webkit-line-clamp: 1;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden
}
.p_data .e_container-18:hover .e_text-23 {
color: #0068b7
}
.p_data .e_text-27 a {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
z-index: 2;
display: block
}
@media screen and (max-width: 768px) {
.neirong{padding:30px 3%;}
.p_data .p_focusItem {
flex-basis: calc(100% / 1);
margin-right: 0%
}
.p_data .e_container-10 {
display-radio: 1;
padding-top: 15px;
padding-left: 15px;
padding-bottom: 15px;
padding-right: 15px;
margin-bottom: 30px;
}
.p_data .e_container-18 {
display-radio: 1;
flex-direction: column;
padding: 10px;
margin-bottom: 30px;
}
.p_data .e_container-18 .cbox-18-1 {
flex: 0 0 100%;
}
.p_data .e_container-19 {
display-radio: 1;
padding-top: 20px;
padding-bottom: 2px;
padding-right: 2px;
padding-left: 2px;
}
.p_data .e_container-25 {
padding: 0px;
}
.p_data .e_container-20 .cbox-20-0 {
flex: 0 0 75%;
}
.p_data .e_timeFormat-21 {
font-size: 40px;
line-height: 40px
}
.p_data .e_timeFormat-21 {
font-size: 40px;
line-height: 40px
}
.p_data .e_text-23 {
font-size: 16px;
font_radio: 2;
display-radio: 1;
}
.p_data .e_richText-24 {
line-height: 22px;
height: 44px;
font-size: 13px;
margin-top: 8px;
}
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@keyframes moveArrows {
0% {
transform: translate(-50%, -50%);
}
50% {
transform: translate(-50%, -30%);
}
100% {
transform: translate(-50%, -50%);
}
}
@media (max-width:991px) {
.page_ban {
height: 450px;
}
.ban_mask .ban_w {
display: none;
}
}
@media (max-width:767px) {
.height90 {
height: 80px;
}
.page_ban {
height: auto;
}
.ban_text .ban_down {
bottom: 20px;
}
.ban_text .ban_down i {
width: 36px;
height: 36px;
}
.ban_text .ban_down i img:nth-child(2) {
height: 16px;
}
.location .home {
padding-left: 20px;
background-size: 15px 15px;
}
}
/*二级导航*/
.two_menu {
width: 100%;
background: #FFF;
box-shadow: 0px 4px 7px 0px rgba(24, 43, 98, 0.05);
}
.two_menu ul {
display: flex;
justify-content: flex-end;
width: 100%;
margin-left: -10px;
margin-right: -10px;
}
.two_menu ul li {
padding: 0 10px;
}
.two_menu ul li a {
display: inline-block;
position: relative;
padding: 24px 0;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.two_menu ul li a:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 2px;
background-color: var(--blue-color);
}
.two_menu ul li.active a {
color: var(--blue-color);
}
.two_menu ul li.active a:before {
width: 100%;
}
/*new list*/
.page_content {
min-height: 40vh;
}
.new_top {
padding-top: 54px;
}
.new_top .new_big a {
position: relative;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
background: #F1F8FD;
border-radius: 16px;
}
.new_top .new_big .thumb {
position: absolute;
overflow: hidden;
width: 58%;
height: 100%;
}
.new_top .new_big .thumb i {
position: absolute;
left: 0;
top: 0;
display: inline-block;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
-webkit-transition: -webkit-transform 1.3s;
transition: -webkit-transform 1.3s;
-o-transition: transform 1.3s;
transition: transform 1.3s;
transition: transform 1.3s, -webkit-transform 1.3s;
-webkit-transition: transform 1.3s;
}
.new_top .new_big_r {
position: relative;
float: right;
width: 42%;
padding: 64px 48px;
}
.new_top .new_big_r .time {
color: var(--dark-color);
text-shadow: 0px 0px 20px rgba(170, 170, 170, 0.16);
font-family: 'D-DINExp';
background-image: url(../images/blues_time.svg);
background-repeat: no-repeat;
background-size: 16px 16px;
background-position: left center;
padding-left: 24px;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.new_top .new_big_r .title {
margin-top: 16px;
color: var(--main-color);
font-style: normal;
font-weight: 700;
line-height: 46px;
max-height: 92px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.new_top .line {
margin: 40px 0;
width: 100%;
height: 1px;
background-color: #DCE3E8;
}
.new_top .new_big_r .des {
color: #657188;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
height: 52px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.new_top .new_big .more {
padding-top: 70px;
}
.new_top .new_big .more span {
padding-right: 26px;
color: var(--dark-color);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
background-image: url(../images/arrow_right_b.svg);
background-size: 20px 20px;
background-position: right;
background-repeat: no-repeat;
transition: padding .4s;
}
.new_top .new_big .new_add {
position: absolute;
bottom: 0;
right: 0;
display: flex;
align-items: center;
justify-content: center;
background: var(--dark-color);
width: 36px;
height: 36px;
}
.new_top .new_big a:hover .thumb i {
-webkit-transform: scale(1.03);
-ms-transform: scale(1.03);
transform: scale(1.03);
}
.new_top .new_big a:hover .more span {
padding-right: 28px;
}
.new_top .new_small {
padding-top: 20px;
}
.new_top .new_small ul {
margin-left: -12px;
margin-right: -12px;
}
.new_top .new_small ul li {
width: 25%;
padding: 12px;
float: left;
}
.new_top .new_small a {
padding: 36px 26px;
display: flex;
flex-direction: column;
border-radius: 16px;
border: 1px solid #DCE3E8;
transition: background .3s;
}
.new_top .new_small .time {
color: var(--dark-color);
font-family: 'D-DINExp';
font-size: 16px;
background-image: url(../images/blues_time.svg);
background-repeat: no-repeat;
background-size: 16px 16px;
background-position: left center;
padding-left: 24px;
font-weight: 400;
line-height: 24px;
}
.new_top .new_small .title {
margin-top: 20px;
color: var(--main-color);
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 28px;
height: 56px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.new_top .new_small .more {
position: relative;
margin-top: 40px;
display: flex;
align-items: center;
height: 26px;
}
.new_top .new_small .more span {
position: absolute;
left: 0;
top: 0;
height: 100%;
display: inline-block;
font-weight: 400;
line-height: 26px;
color: #FFF;
opacity: 0;
font-size: 16px;
padding-right: 24px;
overflow: hidden;
background-size: 20px 20px;
background-image: url(../images/arrow_right_w.svg);
background-repeat: no-repeat;
background-position: right;
transition: opacity .6s;
}
.new_top .new_small .more i {
display: inline-block;
width: 20px;
height: 26px;
background-image: url(../images/arrow-right.svg);
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: center;
}
.new_top .new_small a:hover {
background-color: var(--dark-color);
}
.new_top .new_small a:hover .time {
opacity: 0.5;
background-image: url(../images/white_time.svg);
color: rgba(255, 255, 255, 1);
}
.new_top .new_small a:hover .title {
color: var(--white-color);
}
.new_top .new_small a:hover .more span {
opacity: 1;
}
.new_top .new_small a:hover .more i {
opacity: 0;
}
.click_up a {
display: flex;
align-items: center;
color: var(--main-color);
font-size: 18px;
font-weight: 400;
line-height: 30px;
}
.click_up a img {
margin-right: 10px;
}
.newb_list {
padding-top: 100px;
}
.newb_list .click_more {
padding-bottom: 90px;
text-align: center;
}
.newb_list .click_more a {
display: inline-flex;
padding: 20px 54px;
align-items: center;
border-radius: 60px;
background: #F1F8FD;
color: var(--main-color);
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 28px;
}
.newb_list .click_more a img {
margin-right: 12px;
}
.newb_bg {
position: relative;
background: #F1F8FD;
width: 100%;
margin-top: 50px;
display: none;
overflow: hidden;
z-index: 1;
}
.newb_bg .newb_letter {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center top;
z-index: -1;
}
.ps_title {
padding-top: 50px;
}
.ps_title h3 {
color: var(--main-color);
font-weight: 700;
line-height: 1.4;
}
.newb_list.pt {
padding-top: 50px;
}
.list_new {
padding-top: 35px;
padding-bottom: 50px;
}
.year_select_box {
position: relative;
display: flex;
width: 342px;
z-index: 9;
}
.year_select_box>.span {
position: relative;
display: flex;
width: 100%;
padding: 16px;
justify-content: space-between;
align-items: center;
border-radius: 16px 0px 16px 16px;
background: #FFF;
cursor: pointer;
}
.year_select_box>.span input {
background: transparent;
border: none;
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.year_select_box>.span input::-webkit-input-placeholder {
color: var(--main-color);
font-size: 16px;
}
.year_select_box>.span input::-moz-placeholder {
color: var(--main-color);
font-size: 16px;
}
.year_select_box>.span input:-moz-placeholder {
color: var(--main-color);
font-size: 16px;
}
.year_select_box>.span input:-ms-input-placeholder {
color: var(--main-color);
font-size: 16px;
}
.year_select_box>.span.active {
border-radius: 16px 0px 0 0;
}
.year_select_box>.span .icon {
position: absolute;
right: 16px;
width: 24px;
height: 24px;
background-image: url(../images/new_icon2.svg);
background-repeat: no-repeat;
background-size: 100%;
}
.year_select_box .drop_down_ {
position: absolute;
display: none;
padding: 10px 15px 20px;
padding-bottom: 5px;
left: 50%;
top: 100%;
width: 100%;
transform: translateX(-50%);
padding-top: 20px;
background-color: #fff;
border-radius: 0px 0px 16px 16px;
max-height: 135px;
overflow-y: auto;
}
.year_select_box .drop_down_ p {
width: 25%;
float: left;
padding-bottom: 8px;
}
.year_select_box .drop_down_ p span {
font-size: 16px;
display: inline-block;
padding: 5px 10px;
cursor: pointer;
}
.year_select_box .drop_down_ p span:hover {
background-color: #eeeeee;
}
.year_select_box .drop_down_::-webkit-scrollbar {
width: 5px;
height: 5px;
background-color: #F5F5F5;
}
.year_select_box .drop_down_::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
.year_select_box .drop_down_::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #bdbdbd;
}
.list_new_ul {
padding-top: 40px;
}
.list_new_ul ul li {
padding: 40px 0px;
border-bottom: 1px solid #DCE3E8;
}
.list_new_ul ul li:hover {
border-bottom: 1px solid #0D9ED7;
}
.list_new_ul .left {
width: calc(100% - 117px);
padding-right: 30px;
}
.list_new_ul .right {
width: 117px;
position: relative;
padding-left: 20px;
text-align: center;
}
.list_new_ul .right:before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
background-color: #DCE3E8;
width: 1px;
height: 57px;
}
.list_new_ul .right span {
display: block;
font-family: 'D-DINExp';
line-height: 1.1;
}
.list_new_ul .right .date {
color: #657188;
font-size: 42px;
font-weight: 700;
}
.list_new_ul .right .year_moth {
padding-top: 2px;
color: #657188;
font-size: 16px;
font-weight: 400;
font-family: 'D-DINExp';
}
.list_new_ul .title {
position: relative;
color: var(--main-color);
font-size: 20px;
font-weight: 400;
line-height: 32px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
transition: padding-left .4s;
}
.list_new_ul .title:before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 0;
height: 1px;
background-color: var(--dark-color);
transition: width .4s;
}
.list_new_ul .des {
margin-top: 16px;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.form_search {
flex: 1;
margin-left: 24px;
display: flex;
justify-content: space-between;
align-items: center;
}
.sear_but {
width: 100px;
padding: 16px 10px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 16px 0px 16px 16px;
background: #FFF;
font-size: 16px;
color: var(--main-color);
cursor: pointer;
}
.submit_icon {
width: 100%;
height: 100%;
font-size: 16px;
color: var(--main-color);
line-height: 26px;
/*background-image: url(../images/new_s_icon.svg);*/
background-color: transparent;
outline: 0;
cursor: pointer;
}
.form_search .sear_input {
width: calc(100% - 120px);
height: 58px;
line-height: 26px;
font-size: 16px;
padding: 16px 10px;
border-radius: 16px 0px 16px 16px;
background: #FFF !important;
}
.form_search .sear_input::-webkit-input-placeholder {
color: rgba(101, 113, 136, 0.50);
font-size: 16px;
}
.form_search .sear_input::-moz-placeholder {
color: rgba(101, 113, 136, 0.50);
font-size: 16px;
}
.form_search .sear_input:-moz-placeholder {
color: rgba(101, 113, 136, 0.50);
font-size: 16px;
}
.form_search .sear_input:-ms-input-placeholder {
color: rgba(101, 113, 136, 0.50);
font-size: 16px;
}
.list_new_ul a:hover .title {
color: var(--dark-color);
padding-left: 26px;
}
.list_new_ul a:hover .title:before {
width: 16px;
opacity: 1;
}
.list_new_ul a:hover .date,
.list_new_ul a:hover .year_moth {
color: var(--dark-color);
}
@media screen and (max-width:1366px) {
.list_new_ul .right .date {
font-size: 32px;
}
}
@media screen and (max-width:1280px) {
.list_new_ul .right .date {
font-size: 38px;
}
}
@media screen and (max-width:991px) {
.new_top .new_big_r {
padding: 50px 40px;
}
.newb_list {
padding-top: 60px;
}
.new_top .new_small a {
padding: 36px 20px;
}
}
@media screen and (max-width:767px) {
.new_top .new_big .thumb {
position: relative;
height: auto;
width: 100%;
}
.new_top .new_big .thumb i {
position: relative;
}
.new_top .new_big_r {
width: 100%;
padding: 25px 20px;
}
.new_top .new_big_r .time {
font-size: 14px;
}
.new_top .new_big_r .title {
margin-top: 10px;
line-height: 30px;
height: 60px;
}
.new_top .line {
margin: 15px 0;
}
.new_top .new_small .time {
font-size: 14px;
}
.new_top .new_big .more {
padding-top: 40px;
}
.list_new .form {
display: block;
}
.list_new .form form {
display: block;
}
.year_select_box>.span input {
font-size: 14px;
}
.year_select_box {
width: 100%;
}
.year_select_box>.span {
padding: 10px;
border-radius: 12px 0px 12px 12px;
}
.form_search .sear_input {
height: 46px;
width: calc(100% - 110px);
}
.form_search {
margin-left: 0;
margin-top: 20px;
display: flex;
border-radius: 12px 0px 12px 12px;
}
.sear_but {
padding: 10px 10px border-radius: 12px 0px 12px 12px;
font-size: 14px;
}
.form_search .sear_input {
font-size: 14px;
}
.form_search .sear_input::-webkit-input-placeholder {
font-size: 14px;
}
.form_search .sear_input::-moz-placeholder {
font-size: 14px;
}
.form_search .sear_input:-moz-placeholder {
font-size: 14px;
}
.form_search .sear_input:-ms-input-placeholder {
font-size: 14px;
}
.year_select_box .drop_down_ p {
width: 33.33%;
}
.new_top .new_small ul li {
width: 100%;
}
.list_new_ul .right .date {
font-size: 30px;
}
.list_new_ul ul li {
padding: 30px 0px;
}
.list_new_ul ul li a {
display: block;
}
.list_new_ul .title {
font-size: 18px;
line-height: 28px;
}
.list_new_ul .left {
width: 100%;
padding-right: 0;
}
.list_new_ul .right {
padding-top: 15px;
width: auto;
padding-left: 0;
text-align: left;
}
.list_new_ul .right::before {
display: none
}
.newb_list {
padding-top: 50px;
}
.newb_list .click_more a {
padding: 12px 30px;
border-radius: 30px;
font-size: 16px;
}
.newb_list .click_more a img {
width: 20px;
}
.list_new_ul .right .year_moth {
font-size: 14px;
}
.newb_list.pt {
padding-top: 30px;
}
.newb_bg {
margin-top: 30px;
}
}
/*page*/
.paged {
padding: 50px 0 50px 0;
text-align: center;
overflow: hidden;
}
.paged .pagination {
display: flex;
align-items: center;
justify-content: center;
}
.paged .pagination li {
display: inline-block;
}
.paged:after {
clear: both;
content: '';
width: 0px;
display: block;
height: 0px;
visibility: hidden;
}
.paged a {
background: #ffffff;
display: flex;
align-items: center;
justify-content: center;
color: #999;
margin: 0 3px;
padding: 4px;
height: 40px;
width: 40px;
font-size: 18px;
font-weight: 400;
border-radius: 50%;
}
.paged a:hover,
.paged .active span {
color: #fff;
background-color: var(--dark-color);
}
.paged span {
background: #ffffff;
display: flex;
align-items: center;
justify-content: center;
color: #999;
margin: 0 3px;
padding: 4px;
height: 40px;
width: 40px;
font-size: 18px;
font-weight: 400;
border-radius: 50%;
}
.paged ul li:first-child span,
.paged ul li:last-child a,
.paged ul li:first-child a,
.paged ul li:last-child span {
background: none;
padding: 0;
width: 40px;
height: 40px;
background-color: #F1F8FD;
}
@media (max-width:767px) {
.paged {
padding: 30px 0 30px 0;
}
.paged span,
.paged a {
font-size: 14px;
padding: 0 10px;
margin: 0 2px;
}
.paged ul li:first-child span,
.paged ul li:last-child a,
.paged ul li:first-child a,
.paged ul li:last-child span {
/*width: 46px;*/
}
}
/*article*/
.article_ban {
width: 100%;
height: 400px;
background-color: var(--main-color);
overflow: hidden;
}
.article_ban .container {
height: 100%;
}
.article_ban .ar_ban_n {
height: 100%;
width: 100%;
padding-top: 26px;
z-index: 1;
}
.ar_ban_n .article_bg {
position: absolute;
right: 0;
top: 0;
width: 50%;
max-width: 364px;
height: 100%;
background-repeat: no-repeat;
background-size: contain;
z-index: -1;
}
.article_ban .ar_title {
padding-top: 90px;
max-width: 900px;
}
.article_ban .ar_title h3 {
color: var(--white-color);
font-weight: 700;
line-height: 1.4;
}
.article_ban .ar_title .ar_time {
padding-top: 16px;
color: var(--white-color);
font-family: D-DINExp;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.article_cont {
padding-top: 64px;
padding-bottom: 95px;
}
.article_cont .article_l {
flex: 1;
border-right: 1px solid #E0E0E0;
margin-right: 30px;
padding-right: 30px;
}
.article_cont .article_r {
width: 400px;
}
.article_l .articlen p {
padding-bottom: 24px;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.article_l .articlen p img {
display: block;
max-width: 100%;
width: auto !important;
height: auto !important;
margin: 0 auto;
}
.article_l .ar_label {
padding-top: 24px;
border-top: 1px solid #E0E0E0;
}
.article_l .ar_label .label_t {
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.article_l .ar_label .label_list {
padding-top: 5px;
}
.article_l .ar_label .label_list ul {
margin-left: -5px;
margin-right: -5px;
}
.article_l .ar_label .label_list ul li {
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
float: left;
}
.article_l .label_list a {
display: inline-block;
padding: 4px 12px;
border-radius: 16px;
background: #ECF3F9;
color: #768DA0;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.article_l .label_list a:hover {
background-color: #0562AF;
color: #fff;
}
.article_r .up_ {
padding: 24px;
width: 100%;
border-radius: 8px;
background: #F1F8FD;
}
.article_r .up_>a {
display: inline-block;
width: 100%;
}
.article_r .up_>a {
padding-bottom: 24px;
margin-bottom: 24px;
border-bottom: 1px solid #DAE8F3;
}
.article_r .up_>a .n {
padding-bottom: 16px;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
opacity: 0.5;
}
.article_r .up_>a .t {
color: var(--main-color);
font-size: 18px;
font-weight: 400;
line-height: 28px;
max-height: 56px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.article_r .up_>a .up_time {
display: inline-block;
margin-top: 8px;
color: var(--dark-color);
font-family: D-DINExp;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.article_r .up_>a:hover .t {
font-weight: 600;
}
.article_r .up_back {
padding-top: 24px;
}
.article_r .up_back a {
padding: 16px 24px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 30px;
background: var(--dark-color);
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.article_r .up_back a img {
margin-right: 12px;
width: 18px;
}
.move_article .article_ban {
display: none;
}
.article_fixed .article_ban {
height: auto;
}
.article_fixed .article_ban {
display: block;
}
.article_fixed .ar_ban_n .article_bg {
display: none !important;
}
.article_fixed .location {
display: none !important;
}
.article_fixed .ar_title {
padding-top: 20px;
padding-bottom: 20px;
max-width: inherit;
}
.article_fixed .ar_title .ar_time {
display: none !important;
}
.article_fixed .ar_title h3 {
font-size: 22px;
}
@media (max-width:1279px) {
.article_fixed .ar_title h3 {
font-size: 20px;
}
.article_cont .article_r {
width: 350px;
}
}
@media (max-width:991px) {
.article_fixed .ar_title h3 {
font-size: 20px;
}
.article_cont .article_r {
width: 350px;
}
}
@media (max-width:767px) {
.article_ban {
height: auto;
padding-bottom: 30px;
}
.article_cont {
padding-top: 40px;
padding-bottom: 35px;
display: block;
}
.article_cont .article_l {
width: 100%;
border-right: none;
padding-right: 0;
margin-right: 0;
}
.article_cont .article_r {
width: 100%;
padding-top: 30px;
}
.article_l .label_list a {
font-size: 14px;
}
.article_r .up_ .btn_ .t {
font-size: 16px;
}
.article_r .up_ .btn_:hover .t {
font-weight: 500;
}
.article_r .up_ .btn_ .up_time {
font-size: 14px;
}
.article_r .up_back a {
padding: 14px 24px;
font-size: 16px;
}
.article_r .up_back a img {
margin-right: 10px;
width: 12px;
}
}
/*about*/
.a_menu {
position: absolute;
top: 90px;
left: 0;
width: 100%;
background: rgba(0, 85, 155, 0.90);
backdrop-filter: blur(5px);
z-index: 9;
}
.a_menu .menu_loop {
display: flex;
align-items: center;
justify-content: center;
margin-left: -16px;
margin-right: -16px;
}
.a_menu .menu_loop li {
padding: 0 16px;
}
.a_menu .menu_loop a {
position: relative;
display: inline-block;
line-height: 80px;
height: 80px;
color: var(--white-color);
font-size: 16px;
font-weight: 400;
}
.a_menu .menu_loop a:before {
content: "";
position: absolute;
left: 50%;
bottom: 0;
height: 2px;
background-color: var(--white-color);
width: 100%;
transform-origin: center;
transform: translate(-50%, 0) scaleX(0);
transition: transform 0.3s ease-in-out;
}
.a_menu .menu_loop a:hover:before,
.a_menu .menu_loop .active a:before {
transform: translate(-50%, 0) scaleX(1);
}
.p_about_top {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh;
min-height: 650px;
z-index: 1;
}
.p_about_video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.p_about_video video {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: -1;
}
.p_about_video img {
display: none;
}
.p_about_mask {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0.8;
background: linear-gradient(180deg, #182B62 0%, rgba(24, 43, 98, 0.46) 100%);
z-index: 9;
}
.p_about_top .p_about_n {
position: relative;
padding-top: 114px;
height: 100%;
z-index: 9;
}
.p_about_top .p_about_n>.container {
height: 100%;
}
.p_about_year {
padding-top: 75px;
padding-bottom: 30px;
align-items: flex-end;
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.p_about_year .year_n {}
.p_about_year .year_n span {
color: var(--white-color);
font-family: D-DINExp;
font-size: 80px;
font-weight: 500;
line-height: 1;
}
.p_about_year .year_n span:first-child {
margin-right: 24px;
}
.p_about_year .year_t {
padding-left: 32px;
color: #FFF;
font-size: 18px;
font-weight: 400;
line-height: 28px;
background-image: url(../images/blue_kuai.svg);
background-size: 11px 11px;
background-position: left;
background-repeat: no-repeat;
}
.p_about_m {
margin-top: 50px;
}
.p_about_m .about_m_l {
color: var(--white-color);
padding-right: 60px;
}
.p_about_m .about_m_l span {
display: block;
line-height: 1.6;
font-weight: 400;
}
.p_about_m .about_m_l strong {
display: block;
line-height: 1.6;
font-weight: 700;
}
.p_about_m .about_m_r {
flex: 1;
max-width: 684px;
max-height: 258px;
overflow-y: auto;
}
.p_about_m .about_m_r::-webkit-scrollbar {
width: 5px;
height: 5px;
background-color: rgba(255, 255, 255, 0.2);
}
.p_about_m .about_m_r::-webkit-scrollbar-track {
border-radius: 10px;
background-color: rgba(255, 255, 255, 0.2);
}
.p_about_m .about_m_r::-webkit-scrollbar-thumb {
border-radius: 5px;
background-color: rgba(255, 255, 255, 0.6);
}
.p_about_m .about_m_r p {
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-bottom: 25px;
}
.p_about_m .about_m_r p:last-child {
padding-bottom: 0;
}
.about_video_b {
padding-top: 30px;
padding-bottom: 20px;
}
.about_video_b .bf {
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: center;
cursor: pointer;
}
.about_video_b .bf span {
display: inline-block;
position: relative;
z-index: 1;
}
.about_video_b .bf span:before {
content: "";
position: absolute;
left: 10px;
top: 0;
width: 50%;
height: 100%;
background-image: url(../images/play_border.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: left;
transition: all .4s;
opacity: 0;
z-index: -1;
}
.about_video_b .bf p {
padding-top: 24px;
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.about_video_b .bf:hover span:before {
left: -2px;
opacity: 1;
width: 100%;
}
.alltime,
.alltime * {
-webkit-transition: all .4s cubic-bezier(.4, 0, .2, 1);
-moz-transition: all .4s cubic-bezier(.4, 0, .2, 1);
transition: all .4s cubic-bezier(.4, 0, .2, 1);
}
.p_about_down {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 0;
color: #FFF;
text-align: center;
font-size: 16px;
font-weight: 400;
line-height: 26px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
cursor: pointer;
z-index: 9;
}
.p_about_down span {
padding-bottom: 15px;
}
.p_about_down i {
display: inline-block;
position: relative;
width: 1px;
height: 59px;
background-color: rgba(255, 255, 255, 0.2);
overflow: hidden;
}
.p_about_down i:before {
content: "";
position: absolute;
left: 0;
top: 0;
transform: translateY(0);
width: 1px;
height: 10px;
background-color: var(--white-color);
animation: right-swing 2s ease-out alternate infinite;
}
@keyframes right-swing {
0% {
transform: translateY(0);
}
50% {
transform: translateY(200%);
}
100% {
transform: translateY(0);
}
}
/* 视频弹窗 */
html.act {
height: 100vh;
overflow: hidden;
}
html.act body {
height: 100vh;
overflow: hidden;
}
.z_tanchuang {
position: fixed;
display: table;
height: 100%;
width: 100%;
top: 0;
left: 0;
transform: scale(0);
-webkit-transform: scale(0);
z-index: 110;
}
.z_tanchuang .tbox {
display: table-cell;
background: rgba(0, 0, 0, 0.7);
text-align: center;
vertical-align: middle;
}
.z_tanchuang .tbox .modal {
display: block;
position: relative;
width: 90%;
max-width: 1154px;
max-height: 90%;
margin: 0 auto;
}
.z_tanchuang .tbox .out {
position: absolute;
width: 68px;
height: 68px;
line-height: 40px;
background: var(--dark-color) url(../images/close_w.png) center no-repeat;
background-size: 30px 30px;
top: 0;
right: 0;
cursor: pointer;
}
.z_tanchuang .tbox .modal .img {
width: 100%;
max-height: 650px;
margin: 0 auto;
height: 80vh;
}
.z_tanchuang .tbox .modal .img video {
display: block;
width: 100%;
max-height: 100%;
object-fit: cover;
}
.z_tanchuang .tbox .modal .img img {
margin: 0 auto;
}
.z_tanchuang .tbox .modal .img {
max-width: 1200px;
}
/* 弹窗选中 */
.z_tanchuang.one {
transform: scaleY(0.01) scaleX(0);
animation: unfoldIn 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
-webkit-transform: scaleY(0.01) scaleX(0);
-webkit-animation: unfoldIn 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
.z_tanchuang.one .tbox .modal {
transform: scale(0);
animation: zoomIn 0.5s 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
-webkit-transform: scale(0);
-webkit-animation: mzoomIn 0.5s 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
.z_tanchuang.one.out {
transform: scale(1);
animation: unfoldOut 1s 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
-webkit-transform: scale(1);
-webkit-animation: unfoldOut 1s 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
.z_tanchuang.one.out .tbox .modal {
animation: zoomOut 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
-webkit-animation: zoomOut 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
/* 弹窗动画 */
@keyframes unfoldIn {
0% {
transform: scaleY(0.005) scaleX(0);
}
50% {
transform: scaleY(0.005) scaleX(1);
}
100% {
transform: scaleY(1) scaleX(1);
}
}
@keyframes mzoomIn {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes zoomOut {
0% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
@keyframes unfoldOut {
0% {
transform: scaleY(1) scaleX(1);
}
50% {
transform: scaleY(0.005) scaleX(1);
}
100% {
transform: scaleY(0.005) scaleX(0);
}
}
@-webkit-keyframes mzoomIn {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@-webkit-keyframes zoomOut {
0% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
@-webkit-keyframes unfoldOut {
0% {
transform: scaleY(1) scaleX(1);
}
50% {
transform: scaleY(0.005) scaleX(1);
}
100% {
transform: scaleY(0.005) scaleX(0);
}
}
@-webkit-keyframes unfoldIn {
0% {
transform: scaleY(0.005) scaleX(0);
}
50% {
transform: scaleY(0.005) scaleX(1);
}
100% {
transform: scaleY(1) scaleX(1);
}
}
.section {
position: relative;
width: 100%;
}
.section2 {
background-color: #111e45;
transition: background-color 0.4s linear;
}
.p_about_two {
overflow: hidden;
}
.p_about_two .about_two_n {
position: relative;
width: 100%;
padding: 180px 0 210px 0;
display: flex;
justify-content: space-between;
overflow: hidden;
z-index: 1;
}
.p_about_two .about_two_n:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 70%;
max-width: 542px;
height: 100%;
background-image: url(../images/a_two_w.svg);
background-size: contain;
background-repeat: no-repeat;
z-index: -1;
}
.about_two_n .two_n_left>div {
font-weight: 700;
line-height: 1.5;
}
.about_two_n .two_n_left>div:first-child {
color: var(--blue-color);
}
.about_two_n .two_n_left>div:nth-child(2) {
color: var(--white-color);
font-weight: 500;
}
.about_two_n .two_n_text {
flex: 1;
max-width: 684px;
margin-left: 80px;
}
.about_two_n .two_n_text p {
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-bottom: 25px;
}
.about_two_n .two_n_text p:last-child {
padding-bottom: 0;
}
.about_busi {
padding-top: 70px;
padding-bottom: 60px;
}
.about_busi .busi_title {
color: var(--main-color);
font-weight: 700;
line-height: 1.5;
}
.section2:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: #F1F8FD;
z-index: 0;
opacity: 0;
-webkit-transition: opacity 0.4s linear;
transition: opacity 0.4s linear;
pointer-events: none;
}
.newClassName:before {
opacity: 1;
}
.newClassName .about_two_n .two_n_left>div:nth-child(2) {
color: var(--main-color);
}
.newClassName .about_two_n .two_n_text p {
color: #657188;
}
.newClassName .p_about_two .about_two_n:before {
opacity: 0.2;
}
/*业务*/
.section3 {
position: relative;
overflow: hidden;
}
.busi_text {
position: absolute;
top: 24px;
left: 0;
text-align: left;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
z-index: 9;
}
.about_busi .world-map {
margin-bottom: 77px;
position: relative;
display: inline-block;
overflow: hidden;
}
.about_busi .world-map svg {
display: block;
width: 100%;
height: auto;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.about_busi .world-map svg path {
stroke: #0562AF;
stroke-dasharray: 2000;
stroke-dashoffset: -2000;
-webkit-animation: circle-draw 6s cubic-bezier(.215, .61, .355, 1) infinite forwards;
animation: circle-draw 6s cubic-bezier(.215, .61, .355, 1) infinite forwards
}
@keyframes circle-draw {
0% {
stroke-dashoffset: -2000
}
40% {
stroke-dashoffset: 0
}
70% {
stroke-dashoffset: 0
}
to {
stroke-dashoffset: 2000
}
}
@-webkit-keyframes circle-draw {
0% {
stroke-dashoffset: -2000
}
40% {
stroke-dashoffset: 0
}
70% {
stroke-dashoffset: 0
}
to {
stroke-dashoffset: 2000
}
}
.world-map {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 4;
}
.world-map .dot {
position: absolute;
z-index: 6;
display: flex;
align-items: center;
}
.world-map .dot span {
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.world-map .dot i {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--dark-color);
margin-right: 16px;
position: relative;
}
.world-map .dot i::before,
.world-map .dot i::after {
content: "";
display: block;
width: 16px;
height: 16px;
border: 1px solid rgba(0, 85, 155, .7);
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
animation: aboutbjRing 1.5s linear infinite;
opacity: 0;
}
.world-map .dot i::before {
animation-delay: .6s;
}
.world-map .dot i::after {
animation-delay: 0s;
}
@keyframes aboutbjRing {
0% {
opacity: 0;
transform: translate(-50%, -50%) scale(.8)
}
5% {
opacity: 1
}
to {
opacity: 0;
transform: translate(-50%, -50%) scale(3)
}
}
.world-map .dot {
position: absolute;
z-index: 6;
display: flex;
align-items: center;
}
.world-map .dot.active {
flex-direction: column-reverse;
justify-content: center;
}
.world-map .dot.active em {
position: absolute;
left: 50%;
bottom: 4px;
transform: translateX(-50%);
width: 18px;
height: 26px;
background-image: url(../images/busi_active.svg);
background-repeat: no-repeat;
}
.world-map .dot.active i {
margin-right: 0;
background: var(--blue-color) url('../images/pages/abo2_2.png') no-repeat center;
width: 12px;
height: 12px;
}
.world-map .dot.active span {
position: relative;
color: #fff;
font-size: 14px;
padding: 10px;
border-radius: 6px;
background: var(--dark-color);
box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.10);
margin-bottom: 24px;
}
.world-map .dot.active span:after {
content: "";
position: absolute;
left: 50%;
bottom: -8px;
transform: translateX(-50%);
width: 8px;
height: 8px;
background-image: url(../images/busi_jt.svg);
background-repeat: no-repeat;
background-size: contain;
}
.world-map .dot.active i::before,
.world-map .dot.active i::after {
border: 1px solid rgba(0, 86, 184, .7);
}
.world-map .dot.zhongguo {
left: 36.2%;
top: 29%;
}
.world-map .dot.deguo {
left: 8.7%;
top: 29%;
}
.world-map .dot.shate {
left: 18.2%;
top: 48.2%;
}
.world-map .dot.nanfei {
left: 13.4%;
top: 78.1%;
}
.world-map .dot.taiguo {
left: 33.2%;
top: 51.5%;
}
.world-map .dot.xinjiapo {
left: 33.8%;
top: 59.8%;
}
.world-map .dot.riben {
left: 43.2%;
top: 38.5%;
}
.world-map .dot.aodaliya {
left: 41.5%;
top: 75.8%;
}
.world-map .dot.jianada {
left: 73%;
top: 24.5%;
}
.world-map .dot.meiguo {
left: 76.5%;
top: 36.5%;
}
.world-map .dot.baxi {
left: 89.3%;
top: 67.4%;
}
.busi_bottom {
position: absolute;
bottom: 40px;
left: 0;
width: 100%;
z-index: 9;
}
.busi_bottom .sth {
float: right;
color: #CED2DA;
text-align: right;
font-size: 16px;
font-weight: 400;
line-height: 28px;
}
.busi_bottom .bottom_left {
display: flex;
float: left;
width: calc(100% - 220px);
}
.busi_bottom .bottom_number {
text-align: left;
padding-right: 40px;
}
.busi_bottom .bottom_number:last-child {
padding-right: 0;
}
.busi_bottom .bottom_number .busi_number {
text-align: left;
padding-right: 40px;
}
.busi_bottom .bottom_number .busi_number span {
color: #0562AF;
font-family: D-DINExp;
font-weight: 700;
line-height: 1;
}
.busi_bottom .bottom_number .busi_number em {
color: var(--dark-color);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
}
.busi_bottom .bottom_number p {
padding-top: 8px;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
@media (max-height:800px) {
.p_about_m .about_m_r {
max-height: 207px;
}
}
@media (max-height:750px) {
.p_about_year {
padding-top: 45px;
padding-bottom: 30px;
}
.p_about_m .about_m_r {
max-height: 157px;
}
}
@media (max-height:700px) {
.p_about_year {
padding-top: 45px;
padding-bottom: 20px;
}
.p_about_m .about_m_r {
max-height: 125px;
}
.p_about_m .about_m_l strong {
line-height: 1.4;
}
.p_about_m {
margin-top: 30px;
}
.about_video_b .bf img {
width: 50px;
}
.about_video_b .bf p {
padding-top: 14px;
}
}
@media (max-width:1580px) {
.world-map .dot.zhongguo {
left: 36%;
top: 27.2%;
}
}
@media (max-width:1440px) {
.p_about_year .year_n span {
font-size: 80px;
}
.world-map .dot.zhongguo {
left: 35.8%;
top: 26.4%;
}
.world-map .dot.nanfei {
left: 13.4%;
top: 77.1%;
}
}
@media (max-width:1366px) {
.p_about_year .year_n span {
font-size: 76px;
}
.world-map .dot.zhongguo {
left: 35.7%;
top: 26.4%;
}
.world-map .dot.active i {
width: 10px;
height: 10px;
}
}
@media (max-width:1300px) {
.world-map .dot.zhongguo {
left: 35.7%;
top: 25.8%;
}
}
@media (max-width:1280px) {
.p_about_year .year_n span {
font-size: 66px;
}
.busi_bottom .bottom_number {
padding-right: 30px;
}
.world-map .dot.zhongguo {
left: 35.5%;
top: 25.8%;
}
}
@media (max-width:1200px) {
.world-map .dot.zhongguo {
left: 35.4%;
top: 24.6%;
}
}
@media (max-width:1150px) {
.world-map .dot.zhongguo {
left: 35.2%;
top: 23.8%;
}
.world-map .dot.deguo {
left: 8.7%;
top: 28%;
}
.world-map .dot.taiguo {
left: 33.2%;
top: 50.5%;
}
.world-map .dot.aodaliya {
left: 41.3%;
top: 75.8%;
}
.world-map .dot.baxi {
left: 89.3%;
top: 67.2%;
}
.world-map .dot.shate {
left: 18%;
top: 48.2%;
}
}
@media (max-width:1100px) {
.world-map .dot.zhongguo {
left: 34.8%;
top: 22.8%;
}
}
@media (max-width:1100px) {
.busi_bottom {
position: relative;
bottom: inherit;
overflow: hidden;
}
.about_busi .world-map {
margin-bottom: 0;
}
.busi_bottom .bottom_left {
float: left;
padding-top: 30px;
display: block;
width: 100%;
text-align: left;
overflow: hidden;
}
.busi_bottom .bottom_number {
display: inline-block;
}
}
@media (max-width:1050px) {
.world-map .dot.zhongguo {
left: 34.6%;
top: 21.8%;
}
}
@media (max-width:991px) {
.p_about_year .year_n span {
font-size: 56px;
}
.p_about_year {
padding-top: 45px;
}
.about_video_b .bf img {
width: 50px;
}
.about_video_b .bf p {
padding-top: 14px;
}
.p_about_two .about_two_n {
padding: 100px 0 180px 0;
}
.p_about_two .about_two_n {
display: block;
padding: 100px 0 100px 0;
}
.about_two_n .two_n_text {
max-width: inherit;
margin-left: 0;
padding-top: 50px;
}
.world-map .dot.zhongguo {
left: 35.1%;
top: 22.9%;
}
}
@media (max-width:900px) {
.world-map .dot.zhongguo {
left: 34.6%;
top: 21.9%;
}
}
@media (max-width:768px) {
.busi_text {
position: relative;
top: auto;
}
.world-map .dot.zhongguo {
left: 33.6%;
top: 17.9%;
}
.world-map .dot.jianada {
left: 73%;
top: 23.6%;
}
.world-map .dot.aodaliya {
left: 41.1%;
top: 75.5%;
}
.world-map .dot.shate {
left: 18%;
top: 47.2%;
}
.world-map .dot.xinjiapo {
left: 32.8%;
top: 58.8%;
}
.world-map .dot.baxi {
left: 89.1%;
top: 65.4%;
}
.world-map .dot.nanfei {
left: 13.2%;
top: 76.2%;
}
}
@media (max-width:767px) {
.a_menu {
top: 0;
margin-top: 80px;
position: relative;
}
.p_about_video video {
display: none !important
}
.p_about_video img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.p_about_top {
height: auto;
}
.a_menu .menu_loop {
overflow-x: auto;
justify-content: inherit;
}
.a_menu .menu_loop li {
flex-shrink: 0;
}
.p_about_year .year_n span {
font-size: 36px;
}
.p_about_top .p_about_n {
padding-top: 104px;
}
.z_tanchuang .tbox .modal .img {
max-height: 90%;
height: auto;
}
.p_about_m {
margin-top: 40px;
display: block;
}
.p_about_m .about_m_l {
width: 100%;
padding-right: 0;
}
.p_about_m .about_m_r {
max-width: inherit;
margin-top: 30px;
width: 100%;
max-height: inherit;
}
.p_about_down {
display: none !important;
}
.p_about_m .about_m_r p {
font-size: 14px;
line-height: 20px;
padding-bottom: 15px;
}
.p_about_year .year_n span:first-child {
margin-right: 15px;
}
.p_about_year .year_t {
padding-left: 20px;
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 28px;
background-size: 8px 8px;
}
.p_about_two .about_two_n {
padding: 60px 0 60px 0;
}
.about_two_n .two_n_text {
padding-top: 50px;
}
.about_busi {
padding-top: 50px;
padding-bottom: 60px;
}
.busi_bottom .bottom_number {
width: 50%;
float: left;
padding-right: 10px;
padding-bottom: 25px;
}
.busi_bottom .sth {
font-size: 14px;
line-height: 24px;
}
.z_tanchuang .tbox .out {
width: 58px;
height: 58px;
line-height: 30px;
background-size: 30px 30px;
}
.busi_text {
font-size: 14px;
}
.about_busi .busi_title {
padding-bottom: 20px;
}
.about_busi .world-map {
margin-top: 30px;
}
.about_two_n .two_n_text p {
font-size: 16px;
line-height: 26px;
}
.p_about_two .about_two_n::before {
width: 100%;
}
.about_video_b {
text-align: center;
}
}
@media (max-width:413px) {
.busi_bottom .bottom_number {
width: 100%;
}
}
@media (max-width:359px) {
.p_about_year {
display: block;
}
}
/*culture*/
.culture_top {
width: 100%;
position: relative;
height: 990px;
overflow: hidden;
}
.culture_top .a_menu {
top: 0;
}
.culture_top .culture_bg {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
}
.culture_top .culture_mask {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(1, 4, 38, 0.50) 0%, rgba(0, 7, 24, 0.50) 100%);
}
.culture_top .container {
height: 100%;
}
.culture_cont {
position: relative;
width: 100%;
height: 100%;
padding-top: 24px;
}
.culture_big_t {
margin-top: 64px;
color: #FFF;
text-align: center;
min-height: 108px;
font-weight: 700;
line-height: 36px;
text-transform: uppercase;
}
.culture_top .culture_list {
padding-top: 394px;
}
.culture_top .culture_list li {
width: 33.33%;
float: left;
text-align: center;
}
.culture_top .culture_list span {
display: flex;
margin: 0 auto;
align-items: center;
justify-content: center;
width: 74px;
height: 74px;
border: 1px solid white;
border-radius: 50%;
}
.culture_top .culture_list span img {
width: 46px;
}
.culture_top .culture_list li:hover span {
background-color: var(--white-color);
}
.culture_top .culture_list span img:nth-child(2) {
display: none;
}
.culture_top .culture_list li:hover span img:nth-child(1) {
display: none;
}
.culture_top .culture_list li:hover span img:nth-child(2) {
display: inline-block;
}
.culture_top .culture_list .cu_list_t {
margin-top: 16px;
color: var(--white-color);
font-size: 22px;
font-style: normal;
font-weight: 400;
line-height: 28px;
}
.culture_top .culture_list p {
margin-top: 16px;
position: relative;
color: var(--white-color);
font-size: 22px;
font-weight: 400;
line-height: 1.8;
transition: all .4s;
}
@media (min-width:768px) {
.culture_top .culture_list p {
transition: all .4s;
}
.culture_top .culture_list p:before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0;
width: 1px;
height: 32px;
background-color: #fff;
opacity: 0;
}
.culture_top .culture_list li:hover p {
padding-top: 50px;
}
.culture_top .culture_list li:hover p:before {
opacity: 1;
}
.culture_top .culture_list li>div {
transition: all .4s;
}
.culture_top .culture_list li:hover>div {
transform: translateY(-30px);
}
}
@media (max-width:1366px) {
.culture_top .culture_list p {
font-size: 20px;
}
}
@media (max-width:1280px) {
.culture_top {
height: 900px;
}
.culture_top .culture_list {
padding-top: 304px;
}
.culture_top .culture_list p {
font-size: 18px;
}
}
@media (max-width:1200px) {
.culture_top {
height: 830px;
}
.culture_big_t {
margin-top: 40px;
}
}
@media (max-width:1100px) {
.culture_top {
height: 750px;
}
.culture_big_t {
margin-top: 30px;
}
.culture_top .culture_list {
padding-top: 240px;
}
}
@media (max-width:991px) {
.culture_top {
height: 700px;
}
.culture_big_t {
margin-top: 20px;
line-height: 1.4;
}
.culture_top .culture_list {
padding-top: 200px;
}
.culture_top .culture_list p {
font-size: 16px;
}
}
@media (max-width:767px) {
.culture_top {
height: auto;
}
.culture_top .a_menu {
margin-top: 0;
}
.culture_cont {
padding-top: 24px;
}
.culture_top .culture_list li {
width: 100%;
padding-bottom: 30px;
}
.culture_top .culture_list span {
width: 64px;
height: 64px;
}
.culture_top .culture_list span img {
width: 36px;
}
.culture_top .culture_list p {
padding-top: 15px;
}
.culture_top .culture_list p:before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 0;
width: 1px;
height: 10px;
background-color: #fff;
opacity: 1;
}
}
@media (max-width:540px) {
.culture_big_t {
margin-top: 40px;
max-width: 300px;
margin: 0 auto;
}
.culture_top .culture_list span {
width: 54px;
height: 54px;
}
.culture_top .culture_list span img {
width: 26px;
}
.culture_top .culture_list .cu_list_t {
margin-top: 10px;
}
}
/*video*/
.video_cont {}
.video_cont .year_select_box>.span,
.video_cont .form_search .sear_input {
background: #F1F8FD !important;
}
.video_cont .form_search .sear_but {
background: #F1F8FD;
}
.video_cont .year_select_box .drop_down_ {
background-color: #F1F8FD;
}
.form_search .sear_input {
background-color: transparent;
}
.a_video_list {
padding-top: 23px;
}
.a_video_list ul {
margin-left: -12px;
margin-right: -12px;
}
.a_video_list ul li {
padding: 17px 12px;
width: 33.33%;
float: left;
}
.a_video_list .thumb {
position: relative;
border-radius: 16px;
overflow: hidden;
}
.a_video_list .thumb i {
display: inline-block;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
-webkit-transition: -webkit-transform 1.3s;
transition: -webkit-transform 1.3s;
-o-transition: transform 1.3s;
transition: transform 1.3s;
transition: transform 1.3s, -webkit-transform 1.3s;
-webkit-transition: transform 1.3s;
}
.a_video_list .video_play {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.20);
transition: background .4s;
}
.a_video_list .video_play span {
display: inline-block;
position: relative;
z-index: 1;
}
.a_video_list .video_play span:before {
content: "";
position: absolute;
left: 10px;
top: 0;
width: 50%;
height: 100%;
background-image: url(../images/play_border.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: left;
transition: all .4s;
opacity: 0;
z-index: -1;
}
.a_video_list .video_play img {
width: 76px;
}
.a_video_list .video_botom {
position: relative;
padding-top: 24px;
padding-bottom: 24px;
}
.a_video_list .video_botom:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 2px;
background-color: #00559B;
transition: all .5s;
}
.a_video_list .video_botom .big_t {
color: var(--main-color);
font-size: 18px;
font-weight: 700;
line-height: 28px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.a_video_list .video_botom .more {
padding-top: 16px;
}
.a_video_list .video_botom .more span {
position: relative;
display: inline-block;
color: #999;
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-right: 33px;
transition: all .4s;
}
.a_video_list .video_botom .more span:after {
content: "";
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 23px;
height: 1px;
background-color: #9AA2A8;
}
.a_video_list .video_botom .more span:before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 23px;
height: 1px;
opacity: 0;
background-color: #9AA2A8;
}
.a_video_list a:hover .video_play {
background: transparent;
}
.a_video_list a:hover .thumb i {
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
}
.a_video_list a:hover .big_t {
color: var(--dark-color);
}
.a_video_list a:hover .video_botom .more span {
padding-right: 0;
padding-left: 33px;
}
.a_video_list a:hover .video_botom .more span:after {
opacity: 0;
}
.a_video_list a:hover .video_botom .more span:before {
opacity: 1;
}
.a_video_list a:hover .video_play span:before {
left: -2px;
opacity: 1;
width: 100%;
}
.a_video_list a:hover .video_botom:after {
width: 100%;
}
@media (max-width:991px) {
.a_video_list .video_play img {
width: 50px;
}
}
@media (max-width:767px) {
.a_video_list ul li {
width: 50%;
}
.a_video_list .video_botom {
padding-top: 16px;
}
.a_video_list .video_play img {
width: 40px;
}
.a_video_list .video_botom .big_t {
font-size: 16px;
font-weight: 500;
}
.a_video_list .video_botom .more {
padding-top: 10px;
}
.a_video_list .video_botom .more span {
font-size: 14px;
line-height: 24px;
}
}
@media (max-width:540px) {
.a_video_list ul li {
width: 100%;
}
}
/*product*/
.pro_b_num {
padding-top: 16px;
color: var(--white-color);
font-family: D-DINExp;
font-size: 70px;
font-weight: 700;
line-height: 1;
}
.p_pro_bg {
position: relative;
padding-bottom: 30px;
min-height: 60vh;
background: linear-gradient(270deg, #BECEDD 0%, #F0F5F9 100%);
overflow: hidden;
z-index: 1;
}
.p_pro_bg:before {
content: "";
position: absolute;
right: 0;
top: 0;
width: 90%;
height: 188px;
max-width: 1144px;
background-image: url(../images/p_pro_ybg.png);
background-size: contain;
background-repeat: no-repeat;
background-position: right top;
z-index: -1;
}
.p_pro_bg .pro_bg_bottom {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
z-index: -1;
}
.p_pro_bg .ps_title {
padding-top: 60px;
padding-bottom: 40px;
border-bottom: 1px solid #A7BBCC;
}
.p_pro_bg .ps_title p {
padding-top: 16px;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.p_pro_mid {
padding-top: 40px;
}
.p_pro_mid .select01,
.p_pro_mid .select02 {
width: 260px;
margin-right: 24px;
background: rgba(255, 255, 255, 1.0);
}
.p_pro_mid .span input {
color: var(--main-color);
}
.pro_select_box .span input {
background: transparent;
}
.p_pro_mid .span input::-webkit-input-placeholder {
color: var(--main-color);
}
.p_pro_mid .span input::-moz-placeholder {
color: var(--main-color);
}
.p_pro_mid .span input:-moz-placeholder {
color: var(--main-color);
}
.p_pro_mid .span input:-ms-input-placeholder {
color: var(--main-color);
}
.p_pro_mid .drop_down_ {
background: rgba(255, 255, 255, 1.0);
}
.pro_mid_sear .form_search {
margin-left: 0;
}
.pro_mid_sear .form_search input::-webkit-input-placeholder {
color: #657188;
}
.pro_mid_sear .form_search input::-moz-placeholder {
color: #657188;
}
.pro_mid_sear .form_search input:-moz-placeholder {
color: #657188;
}
.pro_mid_sear .form_search input:-ms-input-placeholder {
color: #657188;
}
.p_pro_list {
padding-top: 28px;
}
.p_pro_list ul {
margin-left: -12px;
margin-right: -12px;
}
.p_pro_list ul li {
float: left;
padding: 12px;
width: 33.33%;
}
.p_pro_list .bg {
position: relative;
display: flex;
padding: 22px;
height: 104px;
background: var(--white-color);
border-radius: 16px;
transition: background .4s;
}
.p_pro_list .bg:before {
content: "";
position: absolute;
left: 22px;
bottom: 0;
height: 2px;
width: 0;
background-color: rgba(255, 255, 255, 0.5);
transition: all 1s;
}
.p_pro_list .p_pro_bt {
flex: 1;
color: var(--main-color);
padding-right: 20px;
padding-left: 10px;
font-size: 18px;
font-weight: 700;
line-height: 60px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.p_pro_list .bg .icon {
position: relative;
display: block;
width: 60px;
height: 60px;
background-color: #F1F8FD;
border-radius: 50%;
overflow: hidden;
}
.p_pro_list .bg .icon img {
width: 40px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
transition: transform .6s;
}
.p_pro_list .bg .icon img:nth-child(2) {
transform: translate(-200%, -50%);
}
.p_pro_list a:hover .bg:before {
width: calc(100% - 114px);
}
.p_pro_list a:hover .p_pro_bt {
color: #fff;
}
.p_pro_list a:hover .icon {
background-color: rgba(6, 42, 62, 0.1);
}
.p_pro_list a:hover .icon img:first-child {
transform: translate(200%, -50%);
}
.p_pro_list a:hover .icon img:nth-child(2) {
transform: translate(-50%, -50%);
}
.p_pro_list a:hover .bg {
background: linear-gradient(272deg, #017FC3 1.39%, #00559B 97.43%);
}
.pro_loading {
padding-top: 36px;
padding-bottom: 64px;
}
.pro_loading a {
display: flex;
width: 90px;
margin: 0 auto;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.dots {
margin-left: 8px;
width: 34px;
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: space-between;
}
.dots div {
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #657188;
animation: fade 0.8s ease-in-out alternate infinite;
}
.dots div:nth-of-type(1) {
animation-delay: -0.4s;
}
.dots div:nth-of-type(2) {
animation-delay: -0.2s;
}
.end {
position: fixed;
left: 50%;
top: 50%;
display: none;
transform: translate(-50%, -50%);
z-index: 99;
}
.end a {
padding: 20px 50px;
background-color: rgba(0, 0, 0, 0.6);
font-size: 16px;
color: var(--white-color);
border-radius: 6px;
}
@keyframes fade {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@media (max-width:1440px) {
.pro_b_num {
font-size: 60px;
}
}
@media (max-width:1366px) {
.pro_b_num {
font-size: 56px;
}
}
@media (max-width:1280px) {
.pro_b_num {
font-size: 50px;
}
}
@media (max-width:1219px) {
.p_pro_list ul li {
width: 50%;
}
}
@media (max-width:991px) {
.pro_mid_sear .select01,
.pro_mid_sear .select02 {
width: 166px;
margin-right: 20px;
}
.pro_b_num {
font-size: 46px;
}
}
@media (max-width:767px) {
.pro_b_num {
font-size: 36px;
}
.p_pro_bg .ps_title {
padding-top: 40px;
padding-bottom: 20px;
}
.p_pro_bg .ps_title p {
font-size: 14px;
}
.pro_mid_sear {
display: block;
}
.pro_mid_sear .select01,
.pro_mid_sear .select02 {
width: 100%;
margin-right: 0;
margin-bottom: 20px;
}
.p_pro_list ul li {
width: 100%;
}
.p_pro_list .bg {
height: 94px;
}
.p_pro_list .bg .icon {
width: 50px;
height: 50px;
}
.p_pro_list .bg .icon img {
width: 30px;
}
.p_pro_list .p_pro_bt {
padding-left: 0px;
font-size: 16px;
font-weight: 500;
line-height: 50px;
}
}
/*product list*/
.list_big_t h3 img {
width: 40px;
margin-right: 16px;
}
.list_big_t .back_pro {
display: inline-block;
width: 158px;
height: 54px;
text-align: center;
line-height: 54px;
background-image: url(../images/more_b_bg.svg);
background-size: cover;
background-repeat: no-repeat;
}
.list_big_t .back_pro span {
color: var(--main-color);
font-size: 16px;
display: inline-block;
font-weight: 400;
line-height: 30px;
padding-right: 53px;
background-image: url(../images/back_icon_line.svg);
background-size: 30px 30px;
background-repeat: no-repeat;
background-position: right;
}
.list_big_t .back_pro:hover {
background-image: url(../images/more_bh_bg.svg);
}
.list_big_t .back_pro:hover span {
color: #fff;
background-image: url(../images/back_icon_hline.svg);
}
.pro_list_ser {
margin-top: 40px;
padding-bottom: 40px;
border-bottom: 1px solid #DFDFDF;
}
.pro_mid_sear .pro_select_box .drop_down_ {
max-height: 236px;
overflow-y: auto;
}
.pro_mid_sear .pro_select_box .drop_down_::-webkit-scrollbar {
width: 5px;
height: 5px;
background-color: #F5F5F5;
}
.pro_mid_sear .pro_select_box .drop_down_::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
.pro_mid_sear .pro_select_box .drop_down_::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #bdbdbd;
}
.pro_list_ser .select01 {
width: 260px;
margin-right: 24px;
}
.pro_list_ser .form_search .sear_input {
background: #F1F8FD !important;
}
.pro_list_ser .form_search .sear_but {
background: #F1F8FD;
}
.pro_list_ser .span input::-webkit-input-placeholder {
color: var(--main-color);
}
.pro_list_ser .span input::-moz-placeholder {
color: var(--main-color);
}
.pro_list_ser .span input:-moz-placeholder {
color: var(--main-color);
}
.pro_list_ser .span input:-ms-input-placeholder {
color: var(--main-color);
}
.pro_list_loop {
margin-top: 38px;
}
.pro_list_loop ul {
margin-left: -12px;
margin-right: -12px;
}
.pro_list_loop ul li {
width: 33.33%;
float: left;
padding: 12px;
}
.pro_list_loop .bg {
position: relative;
border-radius: 8px;
background-color: rgba(204, 224, 246, 0.12);
transition: background-image .8s;
overflow: hidden;
}
.pro_list_loop .bg:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-image: url(../images/list_w.svg);
background-position: center;
background-size: cover;
z-index: -1;
}
.pro_list_loop .bg:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 6px;
background-image: url(../images/blue_line.svg);
transition: all .4s;
}
.pro_list_loop .thumb {
padding: 23px 30px;
background-image: url(../images/twist-mask.svg);
background-position: 130px 130px;
background-repeat: no-repeat;
background-size: cover;
transition: background-position .6s;
}
.pro_list_loop a:hover .thumb {
/*background-position: 2px 2px;*/
background-position: right bottom;
transition: background-position .6s;
}
.pro_list_loop .thumb:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
height: 50%;
width: 100%;
background-image: url(../images/list_lizi.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center bottom;
z-index: -1;
}
.pro_list_loop .thumb:after {
content: "";
right: 20px;
position: absolute;
bottom: 15px;
width: 30px;
height: 30px;
background-image: url(../images/list_jt_blue.svg);
background-size: contain;
opacity: 0;
}
.pro_list_loop .thumb i {
display: block;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
-webkit-transition: -webkit-transform 1.3s;
transition: -webkit-transform 1.3s;
-o-transition: transform 1.3s;
transition: transform 1.3s;
transition: transform 1.3s, -webkit-transform 1.3s;
-webkit-transition: transform 1.3s;
}
.pro_list_loop .t {
padding-top: 16px;
}
.pro_list_loop .t h3 {
font-size: 20px;
font-weight: 700;
line-height: 26px;
color: var(--main-color);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.pro_list_loop .t span {
margin-top: 16px;
display: inline-block;
width: 30px;
height: 30px;
background-image: url(../images/list_jt_grey.svg);
background-repeat: no-repeat;
}
.pro_list_loop a:hover .bg {
background-repeat: no-repeat;
background-size: contain;
background-position: left top;
background-image: url(../images/pro_hoverbg.png);
background-size: cover;
background-repeat: no-repeat;
border-bottom-right-radius: 0;
transition: background-image .8s;
}
.pro_list_loop a:hover .bg:before,
.pro_list_loop a:hover .bg:after {
opacity: 0;
width: 0;
}
.pro_list_loop a:hover .thumb:before {
opacity: 0;
}
.pro_list_loop a:hover .thumb:after {
opacity: 1;
}
.pro_list_loop a:hover .thumb i {
-webkit-transform: scale(1.03);
-ms-transform: scale(1.03);
transform: scale(1.03);
}
.pro_list_loop a:hover .t span {
opacity: 0;
}
.p_list_last {
margin-bottom: 64px;
position: relative;
width: 100%;
height: 456px;
border-radius: 16px;
overflow: hidden;
}
.p_list_last .img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.p_list_last .img img {
height: 100%;
left: 50%;
object-fit: cover;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
}
.p_list_last .mask {
padding: 50px 112px;
display: flex;
align-items: center;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(108deg, #00559B -0.51%, rgba(0, 85, 155, 0.36) 54.49%);
z-index: 9;
}
.p_list_last .mask .small_t {
color: #FFF;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.p_list_last .mask .big_t {
padding-top: 16px;
color: #FFF;
font-weight: 700;
line-height: 36px;
text-transform: uppercase;
}
.p_list_last .more_n {
margin-top: 30px;
}
@media (max-width:1280px) {
.pro_list_loop .t h3 {
font-size: 18px;
}
}
@media (max-width:1200px) {
.pro_list_loop .thumb::after {
right: 10px;
bottom: 10px;
background-size: contain;
}
.p_list_last .mask {
padding: 50px 80px;
}
}
@media (max-width:991px) {
.pro_list_loop .thumb::after {
right: 10px;
bottom: 10px;
}
.p_list_last {
height: 400px;
}
.p_list_last .mask {
padding: 50px 60px;
}
}
@media (max-width:768px) {
.pro_list_loop ul li {
width: 50%;
}
.pro_list_loop .thumb::after {
right: 15px;
bottom: 15px;
}
}
@media (max-width:767px) {
.pro_mid_sear .pro_select_box {
/*background: #F1F8FD;*/
}
.pro_list_ser .select01 {
width: 100%;
margin-right: 0;
}
.p_list_last {
height: 280px;
}
.p_list_last .mask {
padding: 30px 20px;
}
.p_list_last .mask .big_t {
padding-top: 10px;
line-height: 30px;
}
}
@media (max-width:540px) {
.list_big_t h3 img {
width: 26px;
margin-right: 8px;
}
.list_big_t .back_pro {
width: 127px;
height: 44px;
line-height: 44px;
background-size: contain;
}
.list_big_t .back_pro span {
font-size: 14px;
line-height: 26px;
padding-right: 30px;
background-image: url(../images/back_icon_line.svg);
background-size: 20px 20px;
}
.pro_list_loop ul li {
width: 100%;
}
.pro_list_loop .thumb::after {
right: 15px;
bottom: 15px;
}
.pro_list_loop .t h3 {
font-size: 16px;
font-weight: 500;
}
}
/*pro deatail*/
.pro_xq_top {
position: relative;
width: 100%;
background: var(--main-color);
/*height: 710px;*/
overflow: hidden;
z-index: 1;
}
.pro_xq_top:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 80%;
height: 40%;
background-image: url(../images/p_xq_bg.png);
background-repeat: no-repeat;
background-size: contain;
background-position: left bottom;
opacity: 0.5;
z-index: -1;
}
.pro_xq_top .container {
height: 100%;
}
.pro_xq_top .xq_top_n {
padding-top: 24px;
width: 100%;
height: 100%;
position: relative;
}
.pro_xq_top .xq_top_n .xq_w_icon {
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 80%;
max-width: 664px;
background-position: right;
background-size: contain;
background-repeat: no-repeat;
z-index: -1;
}
.xq_top_one {
align-items: flex-start;
}
.xq_top_one .back_list a {
display: inline-block;
padding: 10px 10px;
width: 113px;
height: 46px;
backdrop-filter: blur(3px);
text-align: center;
background-image: url(../images/xq_back_bg.svg);
background-repeat: no-repeat;
}
.xq_top_one .back_list a span {
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
background-image: url(../images/xq_back_w.svg);
background-repeat: no-repeat;
background-position: left center;
background-size: 20px 20px;
padding-left: 26px;
}
.xq_top_one .back_list a:hover {
background-image: url(../images/xq_back_wbg.svg);
}
.xq_top_one .back_list a:hover span {
color: var(--main-color);
background-image: url(../images/xq_back_blue.svg);
}
.xq_top_two {
display: flex;
padding-top: 80px;
padding-bottom: 70px;
align-items: center;
justify-content: space-between;
}
.xq_top_two .top_two_l {
width: 586px;
min-width: 586px;
/* 设置最小宽度 */
flex-shrink: 0;
/* 防止缩小 */
}
.xq_top_two .top_two_r {
width: calc(100% - 586px);
margin-left: 30px;
max-width: 656px;
}
.top_two_l .a_small_t {
color: var(--white-color);
font-weight: 400;
line-height: 26px;
opacity: 0.5;
}
.top_two_l .top_tedian {
padding-top: 24px;
color: var(--blue-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.top_two_l .a_small_t span {
position: relative;
font-style: normal;
}
.top_two_l .a_small_t span:before {
content: "";
position: absolute;
left: calc(100% + 16px);
top: 50%;
transform: translateY(-50%);
width: 46px;
height: 1px;
background: #FFF;
}
.top_two_l .top_t_big {
padding-top: 24px;
color: #FFF;
font-weight: 700;
line-height: 1.4;
}
.top_two_l .two_l_button {
padding-top: 65px;
}
.top_two_l .two_l_button .more_n {
margin-right: 5px;
}
.xq_pic_loop {
width: 100%;
}
.xq_pic_loop .swiper-slide i {
display: block;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
-webkit-transition: -webkit-transform 1.3s;
transition: -webkit-transform 1.3s;
-o-transition: transform 1.3s;
transition: transform 1.3s;
transition: transform 1.3s, -webkit-transform 1.3s;
-webkit-transition: transform 1.3s;
}
.top_two_r .xq-pagination {
text-align: center;
padding-top: 10px;
}
.top_two_r .xq-pagination span {
width: 14px;
height: 4px;
display: inline-block;
background-image: url(../images/defa_but.svg);
background-repeat: no-repeat;
background-size: cover;
border-radius: 0;
opacity: 1;
margin: 0 4px;
outline: 0;
}
.top_two_r .xq-pagination span.swiper-pagination-bullet-active {
background-image: url(../images/active_but.svg);
background-color: transparent;
}
.xq_pro_title {
width: 100%;
background: #FFF;
opacity: 0;
height: 0;
}
.xq_pro_title .strong {
padding: 26px 0;
color: var(--main-color);
font-size: 18px;
font-weight: 700;
line-height: 28px;
}
.xq_fixed {
border-top: 1px solid #F6F9FB;
opacity: 1;
height: auto;
z-index: 9;
}
.xq_fixed .strong {
padding: 10px 0;
}
.xq_pro_cont {
position: relative;
padding: 20px 0 70px 0;
background: #F6F9FB;
overflow: hidden;
z-index: 1;
}
.pro_two_w {
position: absolute;
top: 0;
left: 10%;
width: 50%;
height: 100%;
background-repeat: no-repeat;
background-size: contain;
z-index: -1;
}
.xq_pro_tone {
padding-top: 56px;
padding-bottom: 10px;
border-bottom: 1px solid rgba(101, 113, 136, 0.1);
}
.xq_pro_tone:last-child {
border-bottom: none;
}
.xq_pro_tone .pro_tone_tit {
width: 350px;
flex-shrink: 0;
/* 防止缩小 */
}
.xq_pro_tone .pro_tone_r {
width: calc(100% - 350px);
}
.pro_tone_r .tone_r_t {
color: var(--main-color);
font-size: 18px;
font-weight: 400;
}
.pro_tone_r .table {
margin-top: 24px;
margin-bottom: 40px;
width: 100%;
overflow-x: auto;
}
.pro_tone_r .table::-webkit-scrollbar {
width: 4px;
height: 4px;
background-color: #F5F5F5;
}
.pro_tone_r .table::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 4px;
background-color: #F5F5F5;
}
.pro_tone_r .table::-webkit-scrollbar-thumb {
border-radius: 4px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #bdbdbd;
}
.pro_tone_r .table th,
.pro_tone_r .table td {
border: 1px solid transparent;
padding: 16px;
color: #657188;
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
text-align: center;
border-radius: 4px;
background: #FFF;
min-width: 146px;
}
.pro_tone_r .table th:hover,
.pro_tone_r .table td:hover {
background: var(--dark-color);
color: #fff;
}
.pro_tone_r.text p {
position: relative;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
/*padding-left: 18px;*/
}
/*.pro_tone_r.text p:before {
content: "";
position: absolute;
left: 0;
top: 12px;
width: 4px;
height: 4px;
border-radius: 50%;
background-color: #657188;
}*/
.pro_tone_tit h3 {
position: relative;
padding-bottom: 16px;
color: var(--main-color);
font-weight: 700;
line-height: 1.2;
}
.pro_tone_tit h3:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
background-image: url(../images/pro_line.svg);
background-repeat: no-repeat;
background-position: left;
background-size: contain;
width: 31px;
height: 4px;
}
.xq_pro_position {
position: relative;
margin-top: 14px;
margin-bottom: 64px;
overflow: hidden;
}
.xq_pro_position:after {
content: "";
position: absolute;
right: 0;
bottom: 0;
background-image: url(../images/xq_tj_bg.svg);
width: 10%;
max-width: 235px;
height: 428px;
z-index: 8
}
.like-prev i:before,
.like-prev i:after,
.like-next i:before,
.like-next i:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
transition: transform 0.4s ease;
}
.like-prev i:before {
left: 0;
top: 0;
background-image: url(../images/index_p_l.svg);
}
.like-prev i:after {
left: 0;
top: 0;
transform: translateX(-100%);
background-image: url(../images/index_p_lh.svg);
}
.like-next i:before {
left: 0;
top: 0;
background-image: url(../images/index_p_r.svg);
}
.like-next i:after {
left: 0;
top: 0;
transform: translateX(-100%);
background-image: url(../images/index_p_rh.svg);
}
.infor_button .in_r>div:hover {
background-color: var(--main-color);
border-color: var(--main-color);
}
.infor_button .in_r>div.like-prev:hover i:before {
transform: translateX(100%);
}
.infor_button .in_r>div.like-prev:hover i:after {
transform: translateX(0);
}
.infor_button .in_r>div.like-next:hover i:before {
transform: translateX(-100%);
}
.infor_button .in_r>div.like-next:hover i:after {
transform: translateX(0);
}
.xq_positon_bottom {
position: relative;
z-index: 8;
}
.xq_positon_bottom .container .pro-like {
overflow: initial;
}
.xq_positon_bottom .pro_list_loop {
margin-top: 32px;
}
.infor_button .in_r>div.like-prev,
.infor_button .in_r>div.like-next {
background-color: #F1F8FD;
}
.infor_button .in_r>div.like-prev:hover,
.infor_button .in_r>div.like-next:hover {
background-color: var(--main-color);
}
.xq_pro_position .infor_button .in_l .swiper-num .total {
padding-left: 8px;
}
.xq_pro_position .infor_button .in_l .swiper-num .active {
padding-right: 8px;
}
@media (max-width:1580px) {
.pro_tone_r .table th,
.pro_tone_r .table td {
min-width: 114px;
}
}
@media (max-width:1366px) {
.pro_tone_r .table th,
.pro_tone_r .table td {
min-width: inherit;
}
}
@media (max-width:1279px) {
.xq_pro_tone .pro_tone_tit {
width: 300px;
}
.xq_pro_tone .pro_tone_r {
width: calc(100% - 300px);
}
.xq_pro_position:after {
background-image: url(../images/xq_tj_bg.svg);
background-size: cover;
width: 10%;
height: 428px;
}
.xq_top_two .top_two_l {
width: 520px;
min-width: 520px;
}
.xq_top_two .top_two_r {
width: calc(100% - 520px);
margin-left: 0;
}
}
@media (max-width:991px) {
.xq_top_two {
display: block;
padding-top: 50px;
padding-bottom: 50px;
}
.xq_top_two .top_two_l {
width: 100%;
min-width: inherit;
}
.xq_top_two .top_two_r {
width: 100%;
margin-left: 0;
margin-top: 30px;
}
.top_two_l .two_l_button {
padding-top: 35px;
}
}
@media (max-width:767px) {
.xq_top_one {
display: block;
}
.back_list {
padding-top: 30px;
width: 100%;
text-align: right;
}
.xq_top_one .back_list a {
padding: 6px 10px;
width: 100px;
height: 40px;
background-size: contain;
}
.xq_top_one .back_list a span {
font-size: 14px;
background-size: 14px 14px;
padding-left: 20px;
background-position: left center;
}
.top_two_l .two_l_button {
display: block;
}
.top_two_l .two_l_button .more_n {
margin-bottom: 10px;
/*width: calc(50% - 6px);*/
float: left;
}
.xq_pro_tone {
display: block;
}
.pro_tone_r .tone_r_t {
font-size: 16px;
}
.xq_pro_tone .pro_tone_r {
width: 100%;
margin-top: 30px;
}
.pro_tone_r .table th,
.pro_tone_r .table td {
padding: 10px;
font-size: 14px;
min-width: 100px;
}
.xq_pro_position::after {
display: none;
}
.xq_pro_position .infor_button .in_l {
display: block;
}
.xq_pro_position .infor_button .in_r>div {
position: inherit;
top: inherit;
}
.infor_button .in_l .swiper-num span {
font-size: 18px;
font-weight: 700;
}
}
/*esg*/
.deve_mask {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0.5;
background: #000;
z-index: 9;
}
.p_about_top .deve_top {
position: relative;
padding-top: 114px;
height: 100%;
z-index: 9;
}
.p_about_top .deve_top .container {
height: 100%;
}
.deve_top .deve_top_cont {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
height: calc(100% - 150px);
}
.deve_top_cont .deve_top_icon {
padding-bottom: 54px;
}
.deve_top_cont .deve_top_icon img {
width: 78px;
}
.deve_top .deve_top_cont .big_t {
color: var(--white-color);
text-align: center;
font-weight: 700;
line-height: 1.2;
}
.deve_top .deve_top_cont .deve_text {
padding-top: 56px;
padding-bottom: 44px;
}
.deve_top .deve_top_cont .deve_text p {
color: var(--white-color);
text-align: center;
font-size: 18px;
font-weight: 400;
line-height: 28px;
}
.deve_cont {
position: relative;
width: 100%;
overflow: hidden;
}
.deve_bg {
position: relative;
padding-top: 130px;
padding-bottom: 130px;
text-align: center;
width: 100%;
background-image: url(../images/deve_bg.png);
background-size: contain;
background-repeat: no-repeat;
background-position: top center;
overflow: hidden;
z-index: 1;
}
.deve_bg .detwo_title {
color: var(--main-color);
text-align: center;
font-weight: 700;
line-height: 1.4;
}
.deve_bg .detwo_text {
padding-top: 24px;
}
.deve_bg .detwo_text p {
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.deve_menu {
border-bottom: 1px solid #F4F4F4;
background: linear-gradient(0deg, #FFF 0%, #FFF 100%), rgba(0, 85, 155, 0.90);
backdrop-filter: blur(5px);
z-index: 9;
}
.deve_menu ul {
display: flex;
justify-content: center;
margin-left: -16px;
margin-right: -16px;
}
.deve_menu ul li {
padding: 0 16px;
}
.deve_menu ul li a {
position: relative;
display: block;
height: 80px;
line-height: 80px;
color: #666;
font-size: 16px;
font-weight: 400;
}
.deve_menu a:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 2px;
background-color: var(--blue-color);
transition: all .4s;
}
.deve_menu .on a {
color: var(--blue-color);
}
.deve_menu .on a:before {
width: 100%;
}
.deve_fixed {
border-top: 1px solid #F4F4F4;
}
.deve_fixed ul li a {
height: 46px;
line-height: 46px;
}
.deve_list {}
.deve_list ul li {
overflow: hidden;
}
.deve_list .click_open {
position: relative;
min-height: 400px;
width: 100%;
height: 100%;
overflow: hidden;
}
.deve_list .click_open .thumb {
position: absolute;
top: 0;
width: 50%;
height: 100%;
}
.deve_list .click_open .deve_l_r {
width: 50%;
height: 100%;
min-height: 760px;
display: flex;
align-items: center;
padding: 70px;
}
.deve_list .click_open .thumb i {
display: block;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
width: 100%;
height: 100%;
}
.deve_list .click_open .thumb i img {
display: none;
}
.deve_l_r .l_r_cont {
max-width: 628px;
}
.deve_list ul li:nth-child(odd) .thumb {
right: 0;
}
.deve_list ul li:nth-child(odd) .deve_l_r {
float: left;
justify-content: flex-end;
}
.deve_list ul li:nth-child(even) .thumb {
left: 0;
}
.deve_list ul li:nth-child(even) .deve_l_r {
float: right;
}
.l_r_icon {
display: none;
}
.l_r_title {
color: var(--main-color);
font-weight: 700;
line-height: 1.2;
}
.l_r_des {
margin-top: 16px;
color: #333;
font-size: 18px;
font-weight: 400;
line-height: 28px;
}
.l_r_text {
margin-top: 40px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 9;
-webkit-box-orient: vertical;
}
.l_r_text2 {
display: none !important;
}
.l_r_text p {
color: #666;
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-bottom: 25px;
}
.l_r_text p:last-child {
padding-bottom: 0;
}
.read_more {
margin-top: 40px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 50px;
border-radius: 60px;
background: #F1F8FD;
cursor: pointer;
overflow: hidden;
transition: all .4s;
}
.read_more i:first-child {
position: absolute;
display: inline-block;
opacity: 0;
left: 15px;
width: 64px;
color: var(--main-color);
font-size: 16px;
font-weight: 400;
}
.read_more:hover {
width: 122px;
}
.read_more:hover i:first-child {
opacity: 1;
}
.read_more:hover i:nth-child(2) {
padding-left: 72px;
}
.his_tc {
position: fixed;
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, .5);
z-index: -999;
left: 0;
top: 0;
opacity: 0;
}
.join-tc-box {
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) translateY(100px);
z-index: 10;
width: 1200px;
max-width: 95%;
height: 90%;
max-height: 814px;
display: flex;
border-radius: 16px;
background: #FFF;
padding: 90px;
opacity: 0;
transition: all .6s;
}
.join-tc-box .md-close {
position: absolute;
right: 40px;
top: 40px;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background-color: #F1F8FD;
cursor: pointer;
}
.join-tc-box .md-close img:nth-child(2) {
display: none;
}
.join-tc-box .md-close:hover {
background-color: var(--blue-color);
}
.join-tc-box .md-close:hover img:nth-child(1) {
display: none;
}
.join-tc-box .md-close:hover img:nth-child(2) {
display: inline-block;
}
.his_tc .his-top {
padding-top: 30px;
}
.reply_text {
margin-top: 30px;
max-height: 83%;
overflow-y: auto;
}
.reply_text::-webkit-scrollbar {
width: 4px;
height: 4px;
background-color: #F5F5F5;
}
.reply_text::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 4px;
background-color: #F5F5F5;
}
.reply_text::-webkit-scrollbar-thumb {
border-radius: 4px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #bdbdbd;
}
.reply_text .text_01 p {
color: #666;
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-bottom: 20px;
}
.reply_text .text_01 p:last-child {
padding-bottom: 0;
}
.his_tc.show {
z-index: 120;
opacity: 1;
}
.his_tc.show .join-tc-box {
opacity: 1;
transform: translate(-50%, -50%) translateY(0px);
}
@media (max-height:750px) {
.deve_top_cont .deve_top_icon {
padding-bottom: 3%;
}
.deve_top .deve_top_cont .deve_text {
padding-top: 3%;
padding-bottom: 2.5%;
}
}
@media (max-height:700px) {
.deve_top_cont .deve_top_icon img {
width: 58px;
}
}
@media (max-width:1366px) {
.deve_list .click_open .deve_l_r {
min-height: 650px;
}
}
@media (max-width:1280px) {
.deve_top_cont .deve_top_icon img {
width: 58px;
}
.deve_top_cont .deve_top_icon {
padding-bottom: 3%;
}
.deve_top .deve_top_cont .deve_text {
padding-top: 3%;
padding-bottom: 2.5%;
}
.deve_list .click_open .deve_l_r {
min-height: 600px;
}
.deve_list .click_open .deve_l_r {
padding-right: 5%;
}
}
@media (max-width:991px) {
.deve_top_cont .deve_top_icon {
padding-bottom: 34px;
}
.deve_top .deve_top_cont .deve_text {
padding-top: 36px;
padding-bottom: 24px;
}
.deve_top_cont .deve_top_icon img {
width: 50px;
}
.deve_top .deve_top_cont .deve_text p {
font-size: 16px;
}
.deve_menu ul {
margin-left: -8px;
margin-right: -8px;
}
.deve_menu ul li {
padding: 0 8px;
}
.deve_list .click_open .deve_l_r {
min-height: inherit;
padding: 50px 30px;
}
}
@media (max-width:767px) {
.p_about_top .deve_top {
padding-top: 94px;
}
.deve_top_cont .deve_top_icon {
padding-bottom: 15px;
}
.deve_top_cont .deve_top_icon img {
width: 36px;
}
.deve_top .deve_top_cont {
height: auto;
display: block;
text-align: center;
padding-top: 50px;
}
.deve_list .click_open .deve_l_r {
padding: 30px 20px;
}
.l_r_des {
margin-top: 10px;
font-size: 16px;
line-height: 24px;
}
.l_r_text p {
/* font-size: 14px;
line-height: 24px;
*/
padding-bottom: 20px;
}
.l_r_text {
margin-top: 20px;
}
.deve_list .click_open .thumb {
position: relative;
width: 100%;
height: 100%;
}
.deve_list .click_open .thumb i img {
display: block;
}
.deve_list .click_open .deve_l_r {
width: 100% !important;
}
.deve_menu ul {
display: block;
}
.deve_menu ul li {
padding-bottom: 5px;
}
.deve_menu ul li a {
height: 40px;
line-height: 40px;
font-size: 16px;
}
.join-tc-box {
padding: 40px 20px;
}
.deve_icon img {
width: 36px;
}
.reply_text {
max-height: 79%;
}
.join-tc-box .md-close {
right: 20px;
top: 15px;
}
}
/*honor*/
.honor_ban {
position: relative;
overflow: hidden;
padding-top: 90px;
}
.honor_ban .honor_bgimg {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
z-index: -1;
}
.honor_ban .honor_mask {
padding-top: 24px;
width: 100%;
height: 100%;
background: linear-gradient(180deg, rgba(0, 16, 61, 0.00) 0%, rgba(0, 16, 61, 0.40) 100%);
}
.honor_ban .honor_mask .container {
height: 100%;
}
.honor_ban .honor_top_c {
position: relative;
width: 100%;
height: 100%;
padding-bottom: 100px;
}
.honor_ban .honor_top_c:after {
content: "";
position: absolute;
left: 0;
bottom: -10%;
width: 100%;
height: 30%;
background-image: url(../images/honor_w.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
}
.honor_ban .honor_top_c .big_t {
padding-top: 64px;
color: var(--white-color);
text-align: center;
font-weight: 700;
line-height: 1.6;
}
.hontop_number {
position: relative;
}
.hontop_hide {
position: absolute;
bottom: 0;
left: 0;
opacity: 0;
transform: translateY(10px);
transition: all .4s;
}
.hontop_number:hover .hontop_hide {
opacity: 1;
transform: translateY(0px);
}
.hontop_hide p {
color: rgba(255, 255, 255, 0.60);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.hontop_number {
padding-top: 95px;
}
.hontop_number ul {
margin-left: -30px;
margin-right: -30px;
}
.hontop_number ul li {
width: 20%;
float: left;
padding-bottom: 58px;
padding-left: 30px;
padding-right: 30px;
}
.hontop_number .small {
color: var(--white-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
margin-bottom: 24px;
}
.hontop_number .line {
width: 100%;
height: 1px;
background-color: rgba(255, 255, 255, 0.20);
}
.hontop_number .m_number {
padding-top: 30px;
}
.hontop_number .m_number span {
color: var(--white-color);
font-family: D-DINExp;
font-size: 56px;
font-weight: 700;
line-height: 1;
}
.hontop_number .m_number em {
color: var(--white-color);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 26px;
margin-left: 8px;
}
.honor_bg {
position: relative;
width: 100%;
background: #F1F8FD;
overflow: hidden;
z-index: 1;
}
.honor_bg .cicle {
position: absolute;
width: 66vw;
left: -33vw;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
}
.honor_line {
position: relative;
padding-top: 85px;
padding-bottom: 108px;
width: 100%;
height: 100%;
}
.honor_line:before {
content: "";
position: absolute;
left: 50%;
top: 0;
width: 1px;
height: 100%;
background-color: #CCD6DE;
}
.honor_line:after {
content: "";
position: absolute;
left: 50%;
top: 0;
width: 1px;
height: 52%;
background-color: var(--dark-color);
}
.honor_tabs {
float: right;
width: 50%;
padding-left: 75px;
}
.honor_tabs ul {
margin-left: -16px;
margin-right: -16px;
}
.honor_tabs ul li {
float: left;
padding: 0 16px;
}
.honor_tabs a {
position: relative;
display: inline-block;
color: var(--main-color);
font-size: 18px;
font-weight: 700;
line-height: 28px;
margin-bottom: 30px;
}
.honor_tabs a:before {
content: "";
position: absolute;
left: 0;
bottom: -10px;
width: 0;
height: 1px;
background-color: var(--blue-color);
transition: all .4s;
}
.honor_tabs li.active a {
color: var(--blue-color);
}
.honor_tabs li.active a:before {
width: 100%;
}
.honor_cont {
padding-top: 40px;
}
.honor_cont .pub-t1 {
display: none;
position: relative;
opacity: 0;
width: 100%;
overflow: hidden;
}
.honor_cont .pub-t1.d-show {
display: block;
opacity: 1;
}
.honor_two {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
.honor_two .honor_left {
width: 50%;
padding-left: 75px;
padding-right: 75px;
padding-bottom: 50px;
}
.honor_two .honor_right {
position: relative;
width: 50%;
height: 100%;
padding-bottom: 50px;
padding-left: 75px;
}
.honor_two .honor_b {
position: absolute;
bottom: 0;
right: 0;
display: flex;
align-items: center;
z-index: 9;
}
.honor_b>div {
display: flex;
align-items: center;
justify-content: center;
margin-left: 8px;
width: 50px;
height: 50px;
border: 1px solid #ffffff;
background-color: #C0D4E1;
border-radius: 50%;
transition: background-color 0.3s ease;
outline: 0;
cursor: pointer;
}
.honor_b>div i {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
font-size: 0;
overflow: hidden;
}
.honor-prev i:before,
.honor-prev i:after,
.honor-next i:before,
.honor-next i:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
transition: transform 0.4s ease;
}
.honor-prev i:before {
left: 0;
top: 0;
background-image: url(../images/index_p_l.svg);
}
.honor-prev i:after {
left: 0;
top: 0;
transform: translateX(-100%);
background-image: url(../images/index_p_lh.svg);
}
.honor-next i:before {
left: 0;
top: 0;
background-image: url(../images/index_p_r.svg);
}
.honor-next i:after {
left: 0;
top: 0;
transform: translateX(-100%);
background-image: url(../images/index_p_rh.svg);
}
.honor_b>div:hover {
background-color: var(--main-color);
border-color: var(--main-color);
}
.honor_b>div.honor-prev:hover i:before {
transform: translateX(100%);
}
.honor_b>div.honor-prev:hover i:after {
transform: translateX(0);
}
.honor_b>div.honor-next:hover i:before {
transform: translateX(-100%);
}
.honor_b>div.honor-next:hover i:after {
transform: translateX(0);
}
.honor_two .honor_left .thumb {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.honor_two .honor_left .thumb img {
max-height: 100%;
}
.honor_two .honor_left .honor_pic {
height: 600px;
}
.honor_two .honor-bt {
height: 600px;
}
.honor_pic .honor_bt {
display: none;
}
/*.honor-bt::before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 10%;
background: linear-gradient(180deg, #F1F8FD 0%, rgba(241, 248, 253, 0.00) 100%);
z-index: 11;
}*/
.honor-bt::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 10%;
background: linear-gradient(180deg, rgba(241, 248, 253, 0.00) 0%, #F1F8FD 100%);
z-index: 11;
}
.honor-bt .swiper-slide {
height: auto;
}
.honor-bt .t {
position: relative;
color: var(--main-color);
font-weight: 400;
line-height: 1.2;
font-size: 18px;
opacity: 0.5;
padding-left: 15px;
cursor: pointer;
}
.honor-bt .t:before {
content: "";
position: absolute;
left: 0;
top: 8px;
width: 5px;
height: 5px;
background-color: var(--main-color);
border-radius: 50%;
}
.honor-bt .honor_bottom {
display: none;
padding-top: 10px;
}
.honor-bt .time {
color: var(--main-color);
font-family: D-DINExp;
font-size: 18px;
font-weight: 400;
line-height: 1.2;
}
.honor-bt .swiper-slide.swiper-slide-active {
padding: 30px 0;
border-top: 1px solid #CCD6DE;
border-bottom: 1px solid #CCD6DE;
}
.honor-bt .swiper-slide.swiper-slide-active .t {
font-size: 30px;
padding-left: 0;
opacity: 1;
}
.honor-bt .swiper-slide.swiper-slide-active .t:before {
display: none
}
.honor-bt .swiper-slide-active .honor_bottom {
display: block;
}
.honor_pic .honor_bt {
padding-top: 20px;
}
.honor_pic .honor_bt .t {
font-size: 16px;
color: var(--main-color);
}
.honor_pic .honor_bt .time {
padding-top: 5px;
color: var(--main-color);
font-family: D-DINExp;
font-size: 13px;
font-weight: 400;
line-height: 20px;
}
@media (max-width:1366px) {
.honor_two .honor_left .honor_pic,
.honor_two .honor-bt {
height: 500px;
}
.hontop_number .m_number span {
font-size: 48px;
}
.honor_tabs ul {
margin-left: -12px;
margin-right: -12px;
}
.honor_tabs ul li {
padding: 0 12px;
}
.honor-bt .swiper-slide.swiper-slide-active .t {
font-size: 28px;
}
.honor-bt .swiper-slide.swiper-slide-active .t {
font-size: 24px;
}
}
@media (max-width:1280px) {
.honor_two .honor_left .honor_pic,
.honor_two .honor-bt {
height: 400px;
}
.hontop_number ul {
margin-left: -10px;
margin-right: -10px;
}
.hontop_number ul li {
padding-left: 10px;
padding-right: 10px;
}
.hontop_number .m_number span {
font-size: 46px;
}
.honor_tabs ul {
margin-left: -10px;
margin-right: -10px;
}
.honor_tabs ul li {
padding: 0 10px;
}
.honor-bt .swiper-slide.swiper-slide-active .t {
font-size: 26px;
}
.honor-bt .swiper-slide.swiper-slide-active .t {
font-size: 20px;
}
.honor_line {
padding-top: 65px;
padding-bottom: 60px;
}
.honor_tabs {
padding-left: 50px;
}
.honor_two .honor_left {
padding-left: 0px;
padding-right: 50px;
padding-bottom: 50px;
}
.honor_two .honor_right {
padding-bottom: 50px;
padding-left: 50px;
}
.honor_cont {
padding-top: 20px;
}
}
@media (max-width:991px) {
.hontop_number .m_number span {
font-size: 40px;
}
.hontop_number {
padding-bottom: 20px;
}
.hontop_number ul li {
width: 33.33%;
padding-bottom: 30px;
}
.hontop_number .m_number {
padding-top: 20px;
}
.honor_line {
padding-top: 35px;
padding-bottom: 60px;
}
.honor_two .honor_left .honor_pic,
.honor_two .honor-bt {
height: 450px;
}
.honor-bt .swiper-slide.swiper-slide-active {
padding: 20px 0;
}
}
@media (max-width:767px) {
.honor_ban {
padding-top: 0;
}
.honor_ban .honor_mask {
padding-top: 104px;
}
.hontop_number {
padding-top: 45px;
}
.hontop_number .m_number {
padding-top: 10px;
}
.hontop_number .m_number span {
font-size: 36px;
}
.hontop_number ul li {
width: 50%;
padding-bottom: 30px;
}
.hontop_number .small {
font-size: 16px;
line-height: 26px;
margin-bottom: 15px;
}
.honor_tabs {
float: left;
width: 100%;
padding-left: 0;
}
.honor_line {
padding-top: 40px;
padding-bottom: 40px;
}
.honor_line::before,
.honor_line::after {
display: none;
}
.honor_two .honor_left {
width: 100%;
padding-right: 0;
padding-bottom: 50px;
}
.honor_two .honor_right {
width: 100%;
opacity: 0;
height: 0;
}
.honor_bg .cicle {
display: none !important;
}
.honor_two .honor_left .honor_pic {
height: auto;
}
.honor_two .honor_left .honor_pic .thumb {
height: 250px;
}
.honor_pic .honor_bt {
display: block;
}
.honor_tabs ul {
margin-left: -10px;
margin-right: -10px;
}
.honor_tabs ul li {
padding: 0 10px;
/*width: 33.33%;*/
float: left;
}
.honor_tabs a {
font-size: 18px;
font-weight: 600;
line-height: 26px;
margin-bottom: 20px;
}
.honor_tabs a::before {
bottom: -5px;
}
.hontop_hide {
opacity: 1;
transform: translateY(0px);
}
}
/*集团成员*/
.jtcy_bg {
width: 100%;
background-image: url(../images/jtcy_bg.png);
background-repeat: no-repeat;
background-size: cover;
background-position: top center;
overflow: hidden;
}
.jtcy_cont {
padding-top: 95px;
padding-bottom: 106px;
}
.jtcy_big_top {
position: relative;
padding-bottom: 95px;
display: flex;
justify-content: center;
}
.jtcy_big_top:before {
content: "";
position: absolute;
left: 50%;
height: 142px;
bottom: 0;
width: 1px;
background-color: #657188;
}
.jtcy_big_top:after {
content: "";
position: absolute;
left: 50%;
bottom: -13px;
width: 25px;
height: 25px;
transform: translateX(-50%);
background-image: url(../images/jtcy_dian.svg);
background-size: contain;
z-index: 9;
}
.cy_x_circle {
content: "";
position: absolute;
top: 38px;
left: 50%;
width: 25px;
height: 25px;
transform: translateX(-50%);
background-image: url(../images/jtcy_dian.svg);
background-size: contain;
z-index: 9;
}
.s_logo {
display: flex;
align-items: center;
justify-content: center;
padding-bottom: 10px;
position: relative;
width: 342px;
height: 198px;
background-image: url(../images/jtcy_border.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.s_logo .jtcy_cicle {
position: relative;
width: 254px;
height: 110px;
display: flex;
align-items: center;
justify-content: center;
}
.jtcy_cicle .ul {
position: absolute;
left: 100%;
top: 50%;
transform: translateY(-50%);
padding-left: 125px;
display: none;
}
.jtcy_cicle .ul:before {
content: "";
position: absolute;
width: 125px;
left: 0;
top: 50%;
height: 1px;
transform: translateY(-50%);
background-color: #657188;
}
.jtcy_cicle .line01 {
content: "";
position: absolute;
left: 82px;
top: 50%;
transform: translateY(-50%);
width: 42px;
height: 142px;
background-image: url(../images/jtcy_line01.svg);
background-repeat: no-repeat;
background-size: contain;
}
.jtcy_cicle .line01:before {
content: "";
position: absolute;
left: -11px;
top: 50%;
width: 25px;
height: 25px;
transform: translateY(-50%);
background-image: url(../images/jtcy_dian.svg);
background-size: contain;
}
.jtcy_cicle .ul li {
padding: 8px 0;
}
.jtcy_cicle .bg {
display: flex;
width: 270px;
padding: 14px 10px;
align-items: center;
justify-content: center;
border-radius: 120px;
background: #FFF;
box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.05);
}
.jtcy_cicle .bg span {
color: var(--main-color);
font-size: 18px;
font-weight: 400;
line-height: 28px;
}
.jtcy_cicle .bg span:first-child {
color: var(--main-color);
}
.jtcy_cicle .bg span:nth-child(2) {
color: #657188;
padding-left: 12px;
margin-left: 4px;
position: relative;
}
.jtcy_cicle .bg span:nth-child(2):before {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 8px;
height: 1px;
background-color: #657188;
}
.jtcy_bgtwo {
background-image: url(../images/jtcy_nbg.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center bottom;
}
.jtcy_list {
width: 100%;
display: flex;
overflow-x: auto;
}
.jtcy_list::-webkit-scrollbar {
width: 5px;
height: 5px;
background-color: #F5F5F5;
}
.jtcy_list::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 6px;
background-color: #F5F5F5;
}
.jtcy_list::-webkit-scrollbar-thumb {
border-radius: 6px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #bdbdbd;
}
.tabs_list {
display: flex;
justify-content: center;
margin: 0 auto;
}
.jtcy_item {
display: inline-block;
position: relative;
padding: 17px 0;
}
.jtcy_item .item_bg {
display: flex;
flex-direction: column;
align-items: center;
width: 100px;
height: 350px;
padding: 60px 22px 10px 22px;
background-image: url(../images/jtcy_list.svg);
background-repeat: no-repeat;
background-position: center;
transition: all .4s;
cursor: pointer;
}
.jtcy_item .item_bg span:nth-child(2) {
padding-top: 8px;
display: inline-block;
width: 20px;
color: var(--main-color);
font-size: 18px;
font-weight: 400;
line-height: 22px;
}
.jtcy_item .item_bg:hover {
transform: translateY(-5px);
}
.jtcy_item .cy_x_line {
position: absolute;
left: 0;
top: 0;
right: 0;
height: 50px;
}
.jtcy_item .cy_x_line:after {
content: "";
width: 1px;
height: 100%;
background-color: #657188;
position: absolute;
top: 0;
left: 50%;
}
.jtcy_item .cy_x_line:before {
content: "";
width: 100%;
height: 1px;
background-color: #657188;
top: 0;
left: 0;
position: absolute;
}
.tabs_list .jtcy_item:first-child .cy_x_line:before {
width: 50%;
left: auto;
right: 0;
}
.tabs_list .jtcy_item:last-child .cy_x_line:before {
width: 50%;
}
.jtcy_tc {
position: fixed;
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, .5);
z-index: -999;
left: 0;
top: 0;
opacity: 0;
}
.jtcy_tc .jtcy_box {
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) translateY(100px);
z-index: 10;
width: 1400px;
max-width: 95%;
height: 80%;
max-height: 628px;
display: flex;
border-radius: 16px;
background: #ffffff;
opacity: 0;
transition: all .6s;
}
.jtcy-close {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
right: 0;
top: -50px;
width: 40px;
height: 40px;
background-color: rgba(0, 0, 0, 0.50);
border-radius: 50%;
cursor: pointer;
}
.jtcy_tc.show {
z-index: 120;
opacity: 1;
}
.jtcy_tc.show .jtcy_box {
opacity: 1;
transform: translate(-50%, -50%) translateY(0px);
}
.jtcy_tc .member_eject {
position: relative;
width: 100%;
display: flex;
border-radius: 16px;
overflow: hidden;
}
.jtcy_tc .member_eject .jtcy_tc_l {
width: 54%;
padding: 96px 72px 30px 72px;
}
.jtcy_tc .member_eject .jtcy_tc_pic {
position: relative;
width: 46%;
height: 100%;
}
.jtcy_tc .member_eject .jtcy_tc_pic img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
object-fit: cover;
transition: all 1s linear 0s;
-webkit-transition: all 1s linear 0s;
-moz-transition: all 1s linear 0s;
-ms-transition: all 1s linear 0s;
-o-transition: all 1s ease-in-out;
}
.cy_hidden,
.cy_pic {
display: none !important;
}
.jtcy_text {
margin-top: 30px;
height: calc(100% - 100px);
}
.cy_tc_text {
height: calc(100% - 88px);
overflow-y: auto;
}
.cy_tc_text::-webkit-scrollbar {
width: 5px;
height: 5px;
background-color: #F5F5F5;
}
.cy_tc_text::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
.cy_tc_text::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
background-color: #bdbdbd;
}
.jtcy_text .cy_tc_text p {
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-bottom: 25px;
}
.jtcy_text .cy_tc_text p:last-child {
padding-bottom: 0;
}
.jtcy_text .cy_tc_label {
padding-top: 20px;
min-height: 124px;
display: none !important;
}
.jtcy_text .cy_tc_label ul {
margin-left: -4px;
margin-right: -4px;
}
.jtcy_text .cy_tc_label ul li {
float: left;
padding: 4px;
}
.jtcy_text .cy_tc_label span {
display: inline-block;
padding: 8px 20px;
color: #657188;
font-size: 16px;
font-weight: 400;
line-height: 26px;
border-radius: 50px;
background: #F1F8FD;
border: 1px solid #F1F8FD;
}
.jtcy_text .cy_tc_label span:hover {
border: 1px solid #657188;
background: transparent;
}
.jtcy_text .more_n {
margin-top: 40px;
}
.jtcy_text .more_n a {
background-image: url(../images/more_l_bg.svg);
color: var(--main-color);
}
.jtcy_text .more_n a:hover {
color: #fff;
}
.jtcy_text .more_n a:before {
background-image: url(../images/more_bh_bg.svg);
}
.jtcy_text .more_n a:hover .icon svg path {
stroke: #ffffff;
}
body.m_fix {
overflow: hidden;
height: 100%;
}
@media (max-width:1280px) {
.jtcy_text .cy_tc_label {
min-height: inherit;
}
.jtcy_text .more_n {
margin-top: 40px;
}
.jtcy_tc .member_eject .jtcy_tc_l {
padding: 60px 50px 30px 50px;
}
.jtcy_big_top {
padding-bottom: 70px;
}
.jtcy_big_top::before {
height: 122px;
}
.s_logo {
padding-bottom: 10px;
width: 300px;
height: 174px;
}
.s_logo .jtcy_cicle {
width: 224px;
height: 92px;
}
.jtcy_cicle .line01 {
content: "";
position: absolute;
left: 56px;
background-position: center;
}
.jtcy_cicle .bg {
width: 250px;
padding: 14px 8px;
}
.jtcy_cicle .ul {
padding-left: 100px;
}
.jtcy_cicle .ul::before {
width: 100px;
}
}
@media (max-width:991px) {
.jtcy_tc .member_eject .jtcy_tc_l {
padding: 50px 40px 30px 40px;
}
.jtcy_text {
max-height: calc(100% - 100px);
}
.jtcy_cont {
padding-top: 25px;
padding-bottom: 106px;
}
.jtcy_cicle .line01 {
display: none;
}
.jtcy_big_top {
padding-bottom: 220px;
}
.jtcy_big_top::before {
height: 80%;
}
.jtcy_cicle .ul {
position: absolute;
left: 50%;
top: 115%;
transform: translate(-50%, 0);
padding-left: 0;
}
.jtcy_cicle .ul::before {
display: none;
}
}
@media (max-width:767px) {
.jtcy_tc .member_eject .jtcy_tc_l {
width: 100%;
padding: 40px 20px 30px 20px;
}
.jtcy_tc .member_eject {
display: block;
overflow-y: auto;
}
.jtcy_text {
max-height: inherit;
}
.jtcy_tc .member_eject .jtcy_tc_pic {
width: 100%;
height: auto;
}
.jtcy_tc .member_eject .jtcy_tc_pic img {
position: inherit;
top: inherit;
height: auto;
}
.s_logo {
width: 210px;
height: 114px;
}
.s_logo .jtcy_cicle {
width: 118px;
height: 72px;
}
.jtcy_big_top::before {
height: 72%;
top: 10%;
bottom: inherit;
}
.jtcy_big_top:after {
display: none;
}
}
/*contact*/
.contact_top {
position: relative;
padding-top: 114px;
background-image: url(../images/contact_bg.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
}
.contact_top .location>a,
.contact_top .location .click_down>a {
color: #BBC0CA;
}
.contact_top .location .home {
background-image: url(../images/n_home2.svg);
}
.contact_top .location>a:nth-child(n+2),
.contact_top .location .click_down>a {
background-image: url(../images/line_x2.svg);
}
.contact_bottom {
padding-top: 70px;
}
.contact_bottom .title {
width: 100%;
padding-bottom: 26px;
border-bottom: 1px solid #CAD6E1;
}
.contact_bottom .title strong {
color: var(--main-color);
font-weight: 700;
line-height: 1.4;
}
.contact_bottom .title p {
padding-top: 5px;
color: var(--main-color);
font-weight: 400;
line-height: 1.4;
}
.contact_cont {
padding-top: 50px;
padding-bottom: 120px;
display: flex;
justify-content: space-between;
position: relative;
z-index: 1;
}
.contact_cont .tact_left {
min-width: 364px;
}
.contact_cont .tact_right {
width: 50%;
}
.tact_left .small_t {
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.contact_cont .bg_map {
position: absolute;
left: 0;
top: 0;
z-index: -1;
}
.tact_left .tact_tel {
padding-top: 12px;
color: var(--blue-color);
font-family: D-DINExp;
font-size: 56px;
font-weight: 700;
line-height: 1;
}
.tact_left .tact_tel a {
font-size: inherit;
color: inherit;
line-height: inherit;
}
.tact_right p {
margin-bottom: 16px;
}
.tact_right p span:first-child {
width: 20px;
margin-right: 10px;
}
.tact_right p a {
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
}
.tact_right .tar_a {
padding-top: 40px;
}
.tact_right .tar_a a {
display: inline-block;
padding: 16px 24px;
border-radius: 50px;
border: 1px solid var(--main-color);
}
.tact_right .tar_a a span {
color: var(--main-color);
font-size: 16px;
font-weight: 400;
line-height: 26px;
padding-left: 26px;
background-image: url(../images/cont_icon_05.svg);
background-size: 20px 20px;
background-position: left center;
background-repeat: no-repeat;
}
.tact_right .tar_a a:hover {
background-color: var(--main-color);
}
.tact_right .tar_a a:hover span {
color: #fff;
background-image: url(../images/cont_icon_06.svg);
}
@media (max-width:1280px) {
.tact_left .tact_tel {
font-size: 50px;
}
}
@media (max-width:991px) {
.tact_left .tact_tel {
font-size: 46px;
}
}
@media (max-width:767px) {
.contact_top {
padding-top: 80px;
}
.contact_top .location {
margin-top: 24px;
}
.contact_cont {
display: block;
}
.contact_cont .tact_right {
width: 100%;
padding-top: 30px;
}
.tact_left .tact_tel {
font-size: 36px;
}
.tact_right p {
display: flex;
align-items: center;
}
}
/*site map*/
.map_top {
padding-top: 50px;
padding-bottom: 30px;
}
.wzdt_xt {
float: left;
width: calc(100% - 200px);
}
.wzdt_xt ul li {
float: left;
padding-left: 20px;
line-height: 45px;
}
.wzdt_xt ul li a {
font-size: 16px;
color: #657188;
}
.wzdt_xt ul li a:hover {
color: var(--blue-color);
}
.sitemapz {
overflow: hidden;
width: 100%;
margin: 0 auto;
margin-bottom: 30px;
}
.sitemapy {
width: 200px;
float: left;
background: none;
border: 1px solid var(--main-color);
text-align: center;
}
.sitemapy h3 {
margin: 0;
}
.sitemapy h3 a {
color: var(--main-color);
font-size: 18px;
font-weight: 700;
display: block;
line-height: 45px;
}
@media (max-width:767px) {
.sitemapy h3 a {
font-size: 18px;
}
.dtzuo {
width: 100%;
}
.sitemapy {
width: 100%;
}
.wzdt_xt {
padding: 10px 0;
width: 100%
}
.wzdt_xt ul li {
line-height: 30px;
padding-left: 15px;
}
.wzdt_xt ul li a {
font-size: 16px;
}
.have_no_method {
display: none !important;
}
}
/*search*/
.wucontent img {
max-width: 400px;
}
/*history*/
.dev_position {
position: absolute;
left: 0;
top: 114px;
width: 100%;
}
@media (max-width:767px) {
.dev_position {
top: 94px;
}
}
.contactus{
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 94%;
background_radio: 2;
display-radio: flex;
max-width: 1600px;
margin-left: auto;
margin-right: auto;
border-radius: 15px;
overflow: hidden;
box-shadow: 0 23px 50px -5px rgb(29 56 72 / 17%);
background: #0068b7;
}
.contactus .cbox-1-0 {
flex: 0 0 50%;
}
.contactus .cbox-1-1 {
flex: 0 0 50%;
align-self: center; color:#ffffff; font-size:16px; padding:50px;
}
.contactus .cbox-1-1 h2{font-size: 24px; margin-bottom:20px;}
.contactus .cbox-1-1 ul{ border-top:1px dashed #ffffff; border-bottom:1px dashed #ffffff; padding:20px 0;}
.contactus .cbox-1-1 ul li{ padding-bottom:10px;}
@media (max-width: 900px){
.contactus .cbox-1-0 ,.contactus .cbox-1-1 {
flex:100%;
}
.contactus{margin-top:50px;}
.contactus .cbox-1-1{padding:30px;}
}
.message{ padding:50px 0;width:94%;margin:0 auto;}
.message h2 {
line-height: 1.2;
font_radio: 2;
display-radio: 1;
font-size: 36px;
color: rgba(51, 51, 51, 1);
text-align: center;
font-weight: bold;
text-shadow: 0 0.3em 10px rgb(0 0 0 / 20%);margin-bottom:50px;
}
.ss-form{
border:1px solid #cccccc;
padding:50px;
border-radius:12px;
background:#fff;
}
.ss-form-grid{
display:grid;
grid-template-columns:1fr 1fr 1fr;
gap:15px;
}
@media (max-width: 900px){
.ss-form{padding:30px;}
.ss-form-grid{ grid-template-columns:1fr; }
}
.ss-form-full{ grid-column:1 / -1; }
.ss-form input,
.ss-form textarea{
width:100%;
padding:12px;
border:1px solid #cccccc;
border-radius:8px;
box-sizing:border-box;
}
.ss-form-actions{ margin-top:15px; }
.ss-btn{
padding:8px 14px;
border-radius:999px;
text-decoration:none;
font-weight:bold;
border:1px solid var(--ss-border);
display:inline-block;
cursor:pointer;
}
.ss-btn-primary{
background:#111827;
color:#fff;
border-color:#111827;
}
#workshop {
width: 100%;
background-color: #eef3fc; /* fallback 背景 */
background-image: url("../images/work_bg.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: top center;
padding-bottom: 100px;
}
/* 修复原样式中的不规范属性（background_radio, display-radio等）并保证功能 */
#workshop .p_top {
border-radius: 15px;
overflow: hidden;
box-shadow: 0 23px 90px -5px rgba(29, 56, 72, 0.17);
flex-direction: column;
width: 94%;
max-width: 1600px;
margin: 0 auto;
background: transparent;
}
/* 选项卡列表 - 三栏等宽 */
#workshop .p_tablist {
display: flex;
list-style: none;
margin: 0;
padding: 0;
}
#workshop .tab-item {
width: calc(100% / 3);
line-height: 88px;
font-weight: bold;
font-size: 18px;
background: #00a0e9;
color: #ffffff;
border-left: 1px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
cursor: pointer;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
user-select: none;
}
/* 去除第一个左边框 */
#workshop .tab-item:first-child {
border-left: none;
}
/* 激活状态样式 */
#workshop .p_active {
background: #ffffff;
color: #0068b7;
font-size: 22px;
}
/* 图标 SVG 统一样式 */
#workshop .p_icon svg {
width: 36px;
height: 36px;
display: block;
transition: fill 0.2s;
}
/* 非激活图标颜色微调（保持白色，激活时继承文字色） */
#workshop .tab-item:not(.p_active) .p_icon svg {
fill: #ffffff;
}
#workshop .p_active .p_icon svg {
fill: #0068b7;
}
/* 标题样式 */
#workshop h2 {
line-height: 1.2;
font-size: 30px;
color: rgba(0, 104, 183, 1);
text-align: center;
font-weight: bold;
padding-top: 70px;
padding-bottom: 40px;
margin: 0;
}
/* 内容区域包装器 */
#workshop .top-content {
position: relative;
background: #ffffff;
}
/* 每个内容块 - 默认隐藏，flex布局，图片文字各占一半 */
#workshop .p_content {
display: none;
flex-wrap: wrap;
flex-direction: row;
width: 100%;
background: #ffffff;
}
/* 激活的内容块显示为flex */
#workshop .p_content.active {
display: flex;
}
#workshop .p_content div {
flex: 0 0 50%;
padding: 50px;
align-self: center;
line-height: 1.8;
font-size: 16px;
color: #1f2f3a;
}
#workshop .p_content div:first-child {
padding-right: 0;
}
#workshop .p_content div img {
width: 100%;
max-width: 100%;
height: auto;
border-radius: 16px;
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
display: block;
transition: transform 0.2s;
}
/* 响应式：移动端每项占满，图片上文字下 */
@media screen and (max-width: 768px) {
#workshop {
padding-bottom: 40px;
}
#workshop h2 {
font-size: 24px;
padding-top: 40px;
padding-bottom: 24px;
}
#workshop .p_content div {
flex: 100%;
padding: 20px 16px;
}
#workshop .p_content div:first-child {
padding-right: 16px;
padding-bottom: 0;
}
#workshop .tab-item {
line-height: 60px;
font-size: 14px;
gap: 6px;
}
#workshop .p_active {
font-size: 16px;
}
#workshop .p_icon svg {
width: 26px;
height: 26px;
}
#workshop .p_content div {
font-size: 14px;
}
}
/* 微小屏幕进一步优化 */
@media screen and (max-width: 480px) {
#workshop .tab-item {
font-size: 12px;
gap: 4px;
}
#workshop .p_icon svg {
width: 22px;
height: 22px;
}
#workshop .p_content div {
padding: 16px 12px;
}
}
.zhengshu{}
.zhengshu h2 {
line-height: 1.2;
font-size: 30px;
color: rgba(0, 104, 183, 1);
text-align: center;
font-weight: bold;
padding-top: 70px;
padding-bottom: 40px;
margin: 0;
}
.res_con {
width: 100%;
padding: 20px 0px 80px;
position: relative;
}
.zhengshu .res_box {
position: relative;
width: 94%;
margin-right: auto;
overflow: hidden;
margin-left: auto;
max-width: 1600px;
z-index: 1
}
.zhengshu .res_box .res_nav_box {
position: absolute;
bottom: 25px;
width: 100%;
z-index: 1
}
.zhengshu .res_box .res_nav_box .swiper-button-prev {
left: auto;
right: 72%;
margin: 0px
}
.zhengshu .res_box .res_nav_box .swiper-button-next {
right: auto;
left: 72%;
margin: 0px
}
.zhengshu .res_box .res_img {
background-size: cover
}
.zhengshu .res_box .res_img img {
display: block;
width: 100%;
opacity: 1;
box-shadow: 0px 20px 30px rgb(29 56 75 / 20%);border:15px solid #681713;
}
.zhengshu .res_box .swiper-container {
width: 23%;
overflow: visible !important;
padding-bottom: 7px
}
.zhengshu .res_box .swiper-container .swiper-slide {
transform: scale(0.75);
transition: all .5s ease
}
.zhengshu .res_box .swiper-container .swiper-slide.active {
transform: none
}
.zhengshu .res_box .swiper-container .swiper-slide.active .res_name {
opacity: 1
}
.zhengshu .res_box .swiper-container .res_name {
opacity: 0;
margin-top: 40px;
width: 180%;
margin-left: -40%;
text-align: center;
font-size: 18px;
line-height: 1.5;
font-weight: bold;
color: #000;
transition: all .5s ease
}
.res_nav_box {
position: absolute;
bottom: 25px;
width: 100%;
z-index: 1;
}
.res_box .swiper-button-prev {
background: none;
font-size: 16px;
text-align: center;
line-height: 40px;
width: 40px;
height: 40px;
border: 1px solid #0068b7;
color: #0068b7;
cursor: pointer;
transition: all .5s ease;
transform: translateY(-50%);
border-radius: 100%
}
.res_box .swiper-button-next {
background: none;
font-size: 16px;
text-align: center;
line-height: 40px;
width: 40px;
height: 40px;
border: 1px solid #0068b7;
color: #0068b7;
cursor: pointer;
transition: all .5s ease;
transform: translateY(-50%);
border-radius: 100%
}
.zhengshu .res_box .swiper-button-prev:hover {
background-color: #0068b7;
color: #fff
}
.zhengshu .res_box .swiper-button-next:hover {
background-color: #0068b7;
color: #fff
}
.zhengshu .swiper-button-prev:after {
font-size: 20px
}
.zhengshu .swiper-button-next:after {
font-size: 20px
}
a.e_text-3 {
display: block;
height: 66px;
line-height: 66px;
background: #ffffff;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
box-shadow: 0px 14px 40px 0px rgb(126 134 148 / 32%);
border: none;
color: #7f8c94;
font-size: 16px;
transition: all .5s ease;
position: relative;
text-align: center;
overflow: hidden;padding: 0 20px;white-space: nowrap;
}
a.e_text-3:hover,a.active{
color: #ffffff;
background: linear-gradient(to right, #0068b7, #00a0e9)
}
.product_list h2{
line-height: 1.2;
font-size: 30px;
color: rgba(0, 104, 183, 1);
text-align: center;
font-weight: bold;
padding-bottom: 40px;
margin: 0;
}
.product_list ul{
display: flex;
flex-wrap: wrap;width: 100%;gap: 1.2rem;
}
.product_list ul li h3{font-size: 16px;text-align: center;font-weight: bold;margin-top: 15px;}
.product_list ul li hr{
border-top-style: solid;
border-top-width: 1px;
border-top-color: rgba(0, 104, 183, 1);
max-width: 50px;margin: 0 auto;
height: 1px;margin-top: 10px;margin-bottom: 10px;
}
.product_list ul li {
flex-grow: 0;
flex-shrink: 0;
flex-basis: calc(100% / 4);
flex: 0 0 calc(25% - 0.9rem); padding: 15px;background: #fff;
border-radius: 10px;
box-shadow: 0 0 15px rgb(29 56 72 / 10%);transition: transform 0.5s ease;margin-bottom: 30px;
}
.product_list ul li:hover {
transform: translateY(-5px);
box-shadow: 0 20px 30px -12px rgba(0, 104, 183, 0.8);
border-color: #cbdde9;
}
.product_list ul li div{line-height: 1.5; color: rgba(127, 140, 148, 1);
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;}
.product_list ul li a{margin-top: 20px;
border: 1px solid #efefef;
background: #efefef;
color: #333333;
transition: all .5s;display: block;width: 100%;text-align: center;
padding: 8px;}
.product_list ul li a:hover {
background: #0068b7;
border: 1px solid #0068b7;
color: #ffffff
}
.addproshowdh .container{max-width: 1400px;}
.addproshowdh .page_ban{height: 80px;}
.addproshowdh .location>a{color: #333333;}
.addproshowdh .location .click_down>a{color: #333333;}
.addproshowdh .location .home{background-image: url("../images/i_home.png");}
.addproshowdh .location .click_down>a{background-image: url("../images/i_x_line.png");}
.proshow1{}
.proshow1 .w50{width: 50%;float:left;}
.proshow1 .w50:nth-child(2) div{padding: 50px;}
.primg{}
.primg img{width: 100%;height: auto}
.proshow1 h1{font-size: 30px;padding-bottom: 10px;border-bottom: 1px solid #E3E3E3;margin-bottom: 10px;}
.proshow1 h3{line-height: 1.2;
font-size: 20px;
color: rgba(0, 104, 183, 1);
font-weight: normal;
padding-top:20px;padding-bottom: 5px; display: block;
}
.proshow1 p{font-size:16px;line-height: 2;color: #9b9b9b;}
.proshow1 a.more {
background: #0D9ED7;
color: #fff;
margin-top: 1.25rem;
border-color: #0D9ED7;
cursor: pointer;padding: 0 2.6875rem;
line-height: 3.125rem;
font-weight: 700;
font-size: 1rem;
border-radius: 2.5rem;
border: 1px solid rgba(0, 0, 0, 0.2);
display: inline-block;
}
.proshow1 a.more:hover {
color: #0D9ED7; border-color: transparent;background: #ffffff;
transition: all 0.4s;
-webkit-transform: all 0.4s;
-moz-transition: all 0.4s;
-o-transition: all 0.4s;border: 1px solid #0D9ED7;
}
.proshow1 a.more::before {
background: #fff;
}
.gallery-thumbs .swiper-slide {
width: 25%;
height: 100%;
opacity: 0.6;cursor: pointer;
}
.gallery-thumbs .swiper-slide-thumb-active {
opacity: 1;border: 2px solid #0D9ED7;
}
#showpro .p_tablist {
display: flex;
list-style: none;
margin: 0;
padding: 0;margin-top: 80px;
}
#showpro .tab-item {
width: calc(100% / 3);
line-height: 88px;
font-weight: bold;
font-size: 18px;
background: #00a0e9;
color: #ffffff;
border-left: 1px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
cursor: pointer;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
user-select: none;
}
/* 去除第一个左边框 */
#showpro .tab-item:first-child {
}
/* 激活状态样式 */
#showpro .p_active {
background: #ffffff;
color: #0068b7;
font-size: 22px;border:1px solid #00a0e9;
}
#showpro .p_content {
display: none;
flex-wrap: wrap;
flex-direction: row;
width:100%;padding:0 5% 80px 5%;
background: #ffffff;
}
/* 激活的内容块显示为flex */
#showpro .p_content.active {
display: block;
}
#showpro .p_content h3{line-height: 1.2;
font-size: 24px;
color: rgba(0, 104, 183, 1);
font-weight: bold;
padding-bottom:30px; display: block;padding-top: 50px;
}
#showpro .p_content table{border-collapse:collapse;width: 100%;}
#showpro .p_content table tr td{padding:10px 0;text-align: center;border:1px solid #cccccc;}
#showpro .p_content ul{display: flex;flex-wrap: wrap;padding-top: 50px; }
#showpro .p_content ul li{width: 33.3%;}
@media screen and (max-width: 768px) {
.zhengshu .res_box .res_img img{border:3px solid #681713}
.zhengshu .res_box .swiper-container .res_name{font-size: 16px;}
#showpro{padding:30px 0;}
.proshow1 .w50{width: 100%;float:none;}
.proshow1 .w50:nth-child(2) div{padding: 50px 0;}
#showpro .p_content ul li{width: 50%;}
a.e_text-3{font-size: 14px;padding: 0 5px;white-space:normal;line-height:26px;flex-wrap: nowrap;justify-content: center;
align-items: center;display: flex;}
.product_list{padding-top: 50px;}
.product_list ul{display: block}
.product_list h2{font-size: 20px;}
}