.k_animation{ transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; -o-transition: all 0.5s; } .k_clear:before, .k_clear:after { clear: both; display: table; content: ""; } .k_sm_info_gs{ font-size: 24px; line-height: 30px; color: #ffffff; } .k_sm_info_gscode{ font-size: 24px; color: #ffffff; text-align: left; margin-top: 8px; } .k_sm_banner{ overflow:hidden; } .k_sm_banner_btn{ width:42px; height:42px; line-height:42px; text-align:center; color:#fff; background-color:rgba(0,0,0,0.5); position:absolute; top:50%; top:calc(50% - 21px); top:-webkit-calc(50% - 21px); top:-moz-calc(50% - 21px); top:-ms-calc(50% - 21px); z-index:3; cursor:pointer; } .k_sm_banner_btn_left{ left:20px; } .k_sm_banner_btn_right{ right:20px; } .k_sm_banner_container img{ transform: translate(0%, 0%); position: static; top: 0%; left: 0%; max-width: 100%; width: 100%; height: auto !important; vertical-align:bottom; } .k_sm_slider_item>a{ display:block; position:relative; } .k_sm_text{ position:absolute; left:0px; right:0px; top:31%; color:#fff; } .k_ft_en{ font-size:55px; line-height:1em; text-shadow: 0px 0px 5px #777; } .k_ft_cn{ font-size:50px; line-height:1em; margin-top:0px; text-shadow: 0px 0px 5px #777; } .k_sm_name{ font-size:16px; line-height:28px; letter-spacing:5px; text-transform: uppercase; margin-top:20px; opacity:0; filter:alpha(opacity=0); } .k_sm_line{ width:46px; height:1px; margin-left:0px; background-color:#fff; margin-top:25px; margin-bottom:25px; opacity:0; filter:alpha(opacity=0); } .k_ft_bai{ position:relative; overflow: hidden; text-transform: uppercase; } .k_ft_bai .k_bai_item{ display:inline-block; overflow: hidden; position:relative; visibility: hidden; opacity: 0; filter:alpha(opacity=0); } .k_ft_bai .k_bai_item span{ display:block; visibility: hidden; opacity: 0; filter:alpha(opacity=0); transition: all 0.4s; -moz-transition: all 0.4s; -webkit-transition: all 0.4s; -o-transition: all 0.4s; position: relative; right:-80px; } .swiper-slide-active .k_ft_bai .k_bai_item{ visibility: visible; opacity: 1; filter:alpha(opacity=100); } .swiper-slide-active .k_ft_bai .k_bai_item span{ visibility: visible; opacity: 1; filter:alpha(opacity=100); right:0px; } .swiper-slide-active .k_sm_name,.swiper-slide-active .k_sm_line{ opacity: 1; filter:alpha(opacity=100); } @media screen and (max-width:850px){ .k_ft_cn{ font-size:22px; } .k_ft_en{ font-size:25px; } .k_sm_line{ margin-top:15px; margin-bottom:15px; } .k_sm_name{ margin-top:10px; letter-spacing:0px; font-size:14px; } } @media screen and (max-width:460px){ .k_ft_cn{ font-size:16px; } .k_ft_en{ font-size:18px; } .k_sm_line{ margin-top:8px; margin-bottom:8px; } .k_sm_name{ margin-top:6px; } } .k_sm_info{ position:relative; z-index:1; margin-top:-123px; } .k_sm_info_wrapper{ background-color:rgba(0,0,0,0.5); } .k_sm_info_col{ float:left; width:19%; height:123px; position:relative; } .k_sm_info_col.k_sm_info_first{ width:24%; } .k_sm_info_col>div{ padding:23px; } .k_sm_info_col.k_sm_info_first>div{ padding-top:32px; padding-bottom:32px; } .k_sm_info_col .k_sm_info_content{ position:absolute; left:0px; right:0px; bottom:0px; top:auto; overflow:hidden; } .k_sm_info_col .k_sm_info_content .k_sm_info_pic{ position:absolute; z-index:0; } .k_sm_info_content .k_sm_info_text{ position:relative; z-index:1; } .k_sm_info_content .k_sm_info_text a{ display:block; color:#fff !important; } .k_sm_info_content .k_sm_info_text .k_sm_info_en{ font-size:18px; font-weight:bold; color:rgba(255,255,255,0.4); line-height:22px; text-transform: uppercase; } .k_sm_info_content .k_sm_info_text .k_sm_info_cn{ font-size:18px; line-height:32px; margin-top:1px; } .k_sm_info_content:hover{ padding-bottom:57px; } .k_sm_info_content:hover .k_sm_info_text .k_sm_info_en{ /* font-size:22px; */ line-height:26px; } .k_sm_info_content:hover .k_sm_info_text .k_sm_info_cn{ /* font-size:24px; */ margin-top:10px; } .k_sm_info_2 .k_sm_info_content{ background-color:#0b8fe3; } .k_sm_info_2 .k_sm_info_content .k_sm_info_pic{ right: -95px; bottom: -47px; } .k_sm_info_3 .k_sm_info_content{ background-color:#f4b544; } .k_sm_info_3 .k_sm_info_content .k_sm_info_pic{ right: -22px; bottom: -49px; } .k_sm_info_4 .k_sm_info_content{ background-color:#6fd6b7; } .k_sm_info_4 .k_sm_info_content .k_sm_info_pic{ right: -34px; bottom: -37px; } .k_sm_info_5 .k_sm_info_content{ background-color:#4b7ac9; } .k_sm_info_5 .k_sm_info_content .k_sm_info_pic{ right: -11px; bottom: -9px; } @media screen and (max-width:1600px){ .k_sm_info_content:hover .k_sm_info_text .k_sm_info_en{ font-size:18px; line-height:24px; } } @media screen and (max-width:1440px){ .k_sm_info_col{ width:20.5%; } .k_sm_info_col.k_sm_info_first{ width:18%; } .k_sm_info_col.k_sm_info_first .k_sm_info_gs{ font-size: 16px !important; } .k_sm_info_col.k_sm_info_first .k_sm_info_gscode{font-size: 16px;} .k_sm_info_wrapper .k_between_space{ padding-left:0px !important; padding-right:0px !important; } } @media screen and (max-width:1140px){ .k_sm_info_col{ width:25%; } .k_sm_info_col.k_sm_info_first{ display:none; } } @media screen and (max-width:940px){ .k_sm_info{ margin-top:0px; } .k_sm_info_wrapper{ background-color:#000; } .k_sm_info_content .k_sm_info_text .k_sm_info_en{ font-size:16px !important; } .k_sm_info_content .k_sm_info_text .k_sm_info_cn{ font-size:18px !important; } } @media screen and (max-width:850px){ .k_sm_info_col{ width:50%; } .k_sm_info_content:hover{ padding-bottom:23px; } .k_sm_info_content:hover .k_sm_info_text .k_sm_info_cn{ margin-top:1px; } .k_sm_info_content .k_sm_info_text .k_sm_info_en{ font-size:14px !important; line-height:22px; font-weight:normal; } .k_sm_info_content:hover .k_sm_info_text .k_sm_info_en{ line-height:22px; } } @media screen and (max-width:360px){ .k_sm_info_col{ width:100%; } }