*{ margin: 0; padding: 0; } @-webkit-keyframes zoomIn { from { opacity: 0; transform: scale3d(.3,.3,.3) } 50% { opacity: 1 } } @-webkit-keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } } @keyframes fadeInRight { 0% { opacity: 0; transform: translate3d(100%,0,0); } 100% { opacity: 1; transform: none; } } @keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%,0,0) } to { opacity: 1; transform: none } } @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0,100%,0) } to { opacity: 1; transform: none } } .fadeInLeft { animation-name: fadeInLeft; animation-duration: 1.25s; } .fadeInRight { animation-name: fadeInRight; animation-duration: 1.25s; } .fadeInUp { animation-name: fadeInUp; animation-duration: 1.25s; } .zoomIn{ animation-name: zoomIn; animation-duration: 1.25s; } .fadeIn { animation-name: fadeIn; -webkit-animation-duration: 2s; animation-duration: 2s; } .zoomIns{ -webkit-animation: zoomIns 0.5s 0s ease; } .zoomInss{ -webkit-animation: zoomInss 0.5s 0s ease; } @-webkit-keyframes zoomIns { 0%{ -webkit-transform:scale(0.6); opacity: 0; } 100%{ -webkit-transform:scale(1); opacity: 1; } } /* @-webkit-keyframes zoomInnn2 { 0%{ -webkit-transform:scale(1.6); opacity: 0; } 100%{ -webkit-transform:scale(1); opacity: 1; } } */ h1, h2, h3, h4, h5, h6 { font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } li{ list-style:none; cursor: pointer; } a{ text-decoration: none; cursor: pointer; } .wrap .top_tab { position: absolute; width: 100%; margin-top: 0px; margin-bottom: 0px; top: 0px; z-index: 9999; } .wrap .top_tab .top_tab_a{ transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s; margin-top: 0px; padding: 0% 3% 0% 3%; z-index: 9999; min-height: 90px; display: flex; align-items: center; position: relative; box-sizing: border-box; } .wrap .top_tab .top_tab_a .left { width: 80%; align-content: flex-end; align-items: flex-end; } .wrap .top_tab .top_tab_a .left .left_a a{ display: inline-block; } .wrap .top_tab .top_tab_a .left .left_a a img{ width: 90px; vertical-align: middle; display: inline-block; height: auto; max-width: 100%; border: none; box-shadow: none; } .wrap .top_tab .top_tab_a .right { width: 20%; } .wrap .top_tab .top_tab_a .right .right_a{ text-align: right; } .wrap .top_tab .top_tab_a .right .right_a a{ font-family: "Talfel Sans", tafel sans; font-size: 17px; font-weight: bold; fill:#e6ff2b; color:#e6ff2b; background-color: #000c36; border-style: solid; padding: 12px 24px; border-width: 0px 0px 0px 0px; border-color: #E6FF2B00; border-radius: 0px 0px 0px 0px; display: inline-block; line-height: 1; } .wrap .conert .conert_image{ /* background-image: url(./image/image_04.jpg); */ background-position: 0px 1px; background-repeat: no-repeat; background-size: cover; height: 60vh; } .wrap .conert .conert_image .top_image_bag { background-color: #000000; opacity: 0.4; transition: background 0.3s, border-radius 0.3s, opacity 0.3s; height: 60vh; width: 100%; top: 0; left: 0; position: absolute; } .wrap .conert .conert_image .top_image { display: flex; position: relative; top: 30%; transform: translate(0,-50%); } .wrap .conert .conert_image .top_image .top_image_left{ width: 50%; } .wrap .conert .conert_image .top_image .top_image_left .top_image_left_text{ position: relative; padding: 10% 13% 10% 13%; width: 100%; text-align: left; margin-top: 90px; } .wrap .conert .conert_image .top_image .top_image_left h2{ color: #fafff2; font-family: "Noto Sans SC", tafel sans; font-size: 100px; font-weight: bold; font-style: italic; text-shadow: 0px 0px 0px rgba(12,12,12,0.3); margin: 0px 0px 0px -8px; } .wrap .conert .conert_image .top_image .top_image_left h2:before { background: #767676; content: "\020"; display: block; height: 2px; margin: 1rem 0; width: 1em; } .wrap .conert .conert_image .top_image .top_image_right{ width: 50%; min-height: 1px; } .wrap .middle{ background-color: #000c36; padding: 100px 0px 100px 0px; } .wrap .middle .middle_con{ max-width: 1140px; padding: 10px 30px 125px; margin: auto; } .wrap .middle .middle_con .middle_con_top_pc{ display: flex; padding-bottom: 100px; } .wrap .middle .middle_con .middle_con_top_pc .middle_con_top_pc_w{ width: 33.33%; } .wrap .middle .middle_con .middle_con_top_pc .middle_con_top_pc_left{ z-index: 2; width: 254px; max-width: 254px; margin-top: 30px; margin-left: 60px; } .wrap .middle .middle_con .middle_con_top_pc .middle_con_top_pc_middle{ padding-bottom: 30px; z-index: 3; margin-left: -30px; } .wrap .middle .middle_con .middle_con_top_pc .middle_con_top_pc_middle img{ margin-bottom: 30px; } .wrap .middle .middle_con .middle_con_top_pc .middle_con_top_pc_middle .middle_con_top_pc_middle_text p{ color: #fff; font-family: "Noto Sans SC", tafel sans; font-size: 20px; font-weight: 600; line-height: 1.8; margin-top: 52px; font-weight: normal; } .wrap .middle .middle_con .middle_con_top_pc .middle_con_top_pc_right{ margin-left: -30px; z-index: 4; margin-top: 120px; } .wrap .middle .middle_con .middle_con_top_pc img{ width: 100%; } .wrap .middle .middle_con .middle_con_top_pc img:hover{ transform: scale(1.1); transition-duration: .3s; transition-property: transform; } .wrap .middle .middle_con .middle_con_top_h5{ width: 100%; text-align: center; } .wrap .middle .middle_con .middle_con_top_h5 .middle_con_top_h5_middle_text p{ color: #fff; font-family: "Noto Sans SC", tafel sans; font-size: 20px; font-weight: 600; line-height: 1.8; margin-top: 52px; font-weight: normal; } .wrap .middle .middle_con_middle_pc{ display: flex; padding: 60px 0 0; align-items: center; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_left{ width: 50%; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_left p{ font-size: 18px; color: #fff; padding: 10px; line-height: 1.8; margin-top: 20px; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_left .title h2{ font-size: 2.3em; color: #fff; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_left .title h2:before { background: #767676; content: "\020"; display: block; height: 2px; margin: 1rem 0; width: 1em; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_right{ width: 50%; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_right .middle_con_middle_pc_right_img{ padding: 10px; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_right .middle_con_middle_pc_right_img img{ height: auto; max-width: 100%; border: none; -webkit-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_right .middle_con_middle_pc_right_img img:hover{ transform: scale(1.1); transition-duration: .3s; transition-property: transform; } .wrap .middle .middle_bottom_pc { background-color: #fafff2; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con{ max-width: 1140px; padding: 10px 30px; margin: auto; display: flex; padding: 50px 0; align-items: center; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_left{ width: 74.554%; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_left h2{ font-size: 39px; color: #000; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_left h2:before { background: #767676; content: "\020"; display: block; height: 2px; margin: 1rem 0; width: 1em; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_right{ display: flex; width: 25.446%; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_right span svg{ width: 25px; display: block; background: #f9d661; height: 25px; text-align: center; margin: 0 5px; cursor: pointer; padding: 10px; fill:currentColor; color: #fff; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_right span svg:hover{ background: #fafff2; fill:currentColor; color:#f9d661; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news{ max-width: 1140px; padding: 10px 30px; margin: auto; display: flex; padding: 50px 0; align-items: center; justify-content: space-around; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list .news_list_con{ float: left; width: 32%; background: #000c36; margin-right: 1%; margin-bottom: 10px; cursor: pointer; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list .news_list_con .news_list_con_img img { width: 100%; min-height: 230px; max-height: 230px; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list .news_list_con .news_list_con_bot{ font-size: 18px; color: #fff; font-weight: 600; padding: 20px; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list .news_list_con p{ text-align: center; padding-bottom: 10px; color: #e6ff2b; font-size: 12px; font-weight: 700; } .bottom_nav { background-color: #000c36; } .bottom_nav .bottom_nav_conert { display: flex; margin-right: auto; margin-left: auto; position: relative; max-width: 1140px; padding: 10px; text-align: center; padding-bottom: 60px; } .bottom_nav .bottom_nav_conert_c { width: 33.33%; } .bottom_nav .bottom_nav_conert_c .bottom_nav_conert_c_span{ padding: 20px 0 60px; } .bottom_nav .bottom_nav_conert_c .bottom_nav_conert_c_ul { width: 100%; } .bottom_nav .bottom_nav_conert_c .bottom_nav_conert_c_ul ul li{ line-height: 2.5; font-size: 1.3em; font-weight: 700; } .bottom_nav .bottom_nav_conert_c .bottom_nav_conert_c_ul ul li a span{ color: #fff; } .bottom_nav .bottom_nav_conert_c .bottom_nav_conert_c_ul ul li a span:hover{ color: #e6ff2b; } .bottom_nav .bottom_nav_conert_c .bottom_nav_conert_c_span svg:hover{ transform: scale(1.1); transition-duration: .3s; transition-property: transform; } .bottom_nav .bottom_tab { padding: 30px 0; } .bottom_nav .bottom_tab .text h6{ font-size: 1em; } .nav_box{ position: fixed; bottom: 0; left: 0; z-index: 9999; background-color: #000c36; height: 100vh; width: 100vw; overflow: auto; display: none; } .nav_box .nav_box_wrap .backspace { cursor: pointer; position: absolute; top: 20px; /* margin-top: 0; */ right: 40px; opacity: 1; z-index: 9999; pointer-events: all; display: block; } .nav_box .backspace .eicon{ /* color: #e6ff2b; */ } .nav_box .nav_box_wrap { display: flex; } .nav_box .nav_box_wrap .left { padding: 66px; } .nav_box .nav_box_wrap .left .left_image .left_image_one{ text-align: justify; color: #e6ff2b; font-family: "Noto Sans SC", tafel sans; font-size: 14px; font-weight: 600; line-height: 25px; letter-spacing: 6px; margin-bottom: 30px; } .nav_box .nav_box_wrap .left .left_image .left_image_two{ text-align: justify; color: #2cbcac; font-family: "Noto Sans SC", tafel sans; font-size: 14px; margin-bottom: 30px; font-weight: 600; line-height: 25px; letter-spacing: 6px; } .nav_box .nav_box_wrap .left .left_ul .left_ul_one .left_ul_one_li{ line-height: 2.5; font-size: 1.3em; font-weight: 700; } .nav_box .nav_box_wrap .left .left_ul .left_ul_one .left_ul_one_li a span{ color: #fff; } .nav_box .nav_box_wrap .left .left_ul .left_ul_one .left_ul_one_li a span:hover{ color: #e6ff2b; } .nav_box .nav_box_wrap .left .left_ul .left_ul_one .left_ul_one_li .left_ul_one_li_ul{ display: none; margin-left: 20px; } .nav_box .nav_box_wrap .right { padding: 60px 0; width: 70%; } .nav_box .nav_box_wrap .right .right_cont .right_image{ text-align: justify; color: #e6ff2b; font-family: "Noto Sans SC", tafel sans; font-size: 14px; font-weight: 600; line-height: 25px; letter-spacing: 6px; text-align: center; } .nav_box .nav_box_wrap .right .right_cont .right_image2{ text-align: justify; color: #2cbcac; font-family: "Noto Sans SC", tafel sans; font-size: 14px; font-weight: 600; line-height: 25px; letter-spacing: 6px; text-align: center; } .nav_box .nav_box_wrap .right .right_cont .right_image img{ width: 130px; } .nav_box .nav_box_wrap .right .right_cont{ display: flex; margin-bottom: 40px; } .nav_box .nav_box_wrap .right .right_cont .right_cp { clear: both; width: 1100px; padding: 0 160px 0 120px; margin-top: 40px; } .nav_box .nav_box_wrap .right .right_cont .right_cp .cp_cont{ float: left; text-align: center; font-weight: 600; font-size: 14px; color: #fff; padding: 10px 20px; } .nav_box .nav_box_wrap .right .right_cont .right_cp .cp_cont img{ width: 120px; height: 120px; } .nav_box .nav_box_wrap .right .right_cont .right_cp .cp_cont:hover{ color: #e6ff2b; } .cp_conet_h5{ position: fixed; bottom: 0; left: 0; z-index: 99999; background-color: #000c36; height: 100vh; width: 100vw; overflow: auto; display: none; } .cp_conet_h5 .backspace{ cursor: pointer; position: fixed; top: 20px; /* margin-top: 0; */ left: 20px; opacity: 1; z-index: 99999; pointer-events: all; display: block; } .cp_conet_h5_cp{ clear: both; display: inline-block; margin: 30px 0 0 30px; } .cp_conet_h5_cp .cp_conet_h5_cp_cont{ float: left; text-align: center; font-weight: 600; font-size: 14px; color: #fff; padding: 10px 15px; } .cp_conet_h5_cp .cp_conet_h5_cp_cont img{ width: 80px; height: 80px; } .cp_conet_h5_cp .cp_conet_h5_cp_cont:hover{ color: #e6ff2b; } .wx_code{ display: none; } .wx_code .wx_code_none{ display: flex; width: 640px; height: 100vh; align-items: center; overflow: auto; background: #000c36; position: fixed; bottom: 0; left: 50%; transform: translate(-50%,0); z-index: 99999; } .wx_code img{ width: 100%; } .wx_code .wx_code_left { width: 50%; padding: 30px; text-align: center; color: #fff; font-family: "Notosans思源黑体", tafel sans; font-size: 24px; font-weight: 700; } .wx_code .wx_code_left img{ max-width: 83%; } .wx_code .wx_code_right { width: 50%; padding:30px; } .wx_code .backspace { position: absolute; top: 25px; right: 25px; cursor: pointer; } .dy_code{ display: none; } .dy_code .dy_code_none{ display: flex; width: 640px; height: 100vh; align-items: center; overflow: auto; background: #000c36; position: fixed; bottom: 0; left: 50%; transform: translate(-50%,0); z-index: 99999; } .dy_code .backspace { position: absolute; top: 25px; right: 25px; cursor: pointer; } .dy_code .dy_code_img{ width: 65%; padding: 20px; margin: auto; } .dy_code .dy_code_img img{ width: 100%; } @media(max-width: 767px) { .wrap .top_tab { position: fixed; } .wrap .top_tab .top_tab_a .left{ width:60%; } .wrap .top_tab .top_tab_a .right{ width: 40%; } .wrap .conert .conert_image .top_image .top_image_left .top_image_left_text{ text-align: left; padding: 0px 0px 0px 0px; } .wrap .conert .conert_image .top_image .top_image_left .top_image_left_text h2{ font-size: 3em; } .wrap .conert .conert_image .top_image .top_image_right { width: 5%; } .wrap .conert .conert_image .top_image .top_image_left { width: 95%; } .bottom_nav .bottom_nav_conert{ max-width: 767px; } .bottom_nav .bottom_nav_conert .bottom_nav_conert_cspan{ width: 100%; } .nav_box .nav_box_wrap { height: 100vh; width: 250px; } .nav_box .nav_box_wrap .backspace { right: 55%; transform: translate(-50%,0); } .nav_box .nav_box_wrap .left { background-color: #000c36; padding:40px; } .nav_box .nav_box_wrap .right { display: none; } .nav_box{ background: #000c3600; } .wrap .middle { padding: 0 0 100px 0; } .wrap .middle .middle_con{ max-width: 767px; padding: 10px 30px; } .wrap .middle .middle_con .middle_con_top_h5{ display: block; } .wrap .middle .middle_con .middle_con_top_pc{ display: none; } .wrap .middle .middle_con_middle_pc { flex-direction: column; /* padding: 120px 0 0; */ } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_left{ width: 100%; } .wrap .middle .middle_con .middle_con_top_h5 .middle_con_top_h5_middle_text p { padding-bottom: 120px; } #middle_con_middle_pc_left1_img{ padding-top: 60px; } /* #middle_con_middle_pc_left2_img{ padding-top: 230px; } */ .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_right{ width: 100%; /* padding-top: 120px; */ } .wrap .middle .middle_con_middle_pc .middle_con_middle_pc_right .middle_con_middle_pc_right_img { padding-right: 0px !important; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con{ max-width: 767px; text-align: center; flex-direction: column; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news{ max-width: 767px; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_con .middle_bottom_pc_con_right{ margin-top: 20px; width: 100%; justify-content: center; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list .news_list_con{ float: left; width: 48%; margin-right: 1%; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list{ padding-left: 10px; } .wx_code .wx_code_none{ flex-direction: column; z-index: 999; } .wx_code .wx_code_none .backspace { top: 15%; right: 25%; } .wx_code .wx_code_none .wx_code_left { width: 40%; } .wx_code .wx_code_none .wx_code_right { width: 40%; } .dy_code .dy_code_img{ width: 50%; padding-top: 80px; margin: 0 auto; } .dy_code .dy_code_none { z-index: 999; } .dy_code .dy_code_none .backspace { top: 12%; right: 25%; } .wrap .middle .middle_bottom_pc .middle_bottom_pc_news .news_list .news_list_con .news_list_con_img img { width: 100%; min-height: 130px; max-height: 130px; } } @media(min-width: 768px) { .wrap .top_tab .top_tab_a .left{ width:60%; } .wrap .top_tab .top_tab_a .right{ width: 40%; } .nav_box .nav_box_wrap .left { width: 30%; } .nav_box .nav_box_wrap .left_image { display: none; } .nav_box .nav_box_wrap { align-items: center; } .wrap .middle .middle_con .middle_con_top_h5{ display: none; } .wrap .middle .middle_con_middle_pc img{ transform: scale(1.0); transition-duration: 0.3s; transition-property: transform; } } @media (max-width: 1024px){ .bottom_nav .bottom_nav_conert{ max-width: 1024px; justify-content: space-evenly; flex-wrap: wrap; } }