header{ position:fixed; display:flex; top:0px; justify-content:center; flex-direction: column; } header.notop, header.headerhover{ background:#fff; } header.notop nav > ul > li > a, header.header_black nav > ul > li > a, header.headerhover nav > ul > li > a{ color: #849199; } header nav > ul > li:hover > a, header.notop nav > ul > li > a:hover, header.header_black nav > ul > li > a:hover, header.headerhover nav > ul > li > a:hover{ color:#9d063d; } header.notop .right .login a, header.header_black .right .login a, header.headerhover .right .login a{ background:#849199; } header.notop .right .login a:hover, header.header_black .right .login a:hover, header.headerhover .right .login a:hover{ background:#9d063d; } header.notop .right .lang a, header.header_black .right .lang a, header.headerhover .right .lang a{ color: #849199; } header.notop .right .search span, header.header_black .right .search span, header.headerhover .right .search span{ color: #849199; } header.notop .right.search-click .search span, header.header_black .right.search-click .search span, header.headerhover .right.search-click .search span{ color: #fff; } header.notop .logo a img, header.header_black .logo a img, header.headerhover .logo a img{ display: none; } header.notop .logo a img.mobile, header.header_black .logo a img.mobile, header.headerhover .logo a img.mobile{ display: block; } header .right .lang{ position:relative; } header .right .lang ul{ position:absolute; width:100%; } footer{ overflow:hidden; } footer .con > .top{ position:relative; border:0px; } footer .con > .top::before{ position:absolute; clear:none; width:200%; left:-50%; content:" "; background:#dee7f0; z-index:1; top:0px; height:100%; } footer .con > .top h2{ position:relative; z-index:2; color:#252b3a; } footer .con .bottom{ position:relative; display: flex; justify-content: space-between; } footer .con .bottom::before{ position:absolute; clear:none; width:200%; left:-50%; content:" "; background:#f2f2f2; z-index:1; top:0px; height:100%; } footer .con .bottom ul{ position:relative; z-index:2; width: 42.5%; } footer .con .bottom > ul > li{ width:33.33%; } footer .con .bottom > ul > li:last-child { width:33.33%; } footer .con .bottom > ul > li > a { color: #252b3a; } footer .con .bottom > ul > li > ul li a{ color: #849199; opacity:1; } footer .con .bottom > ul > li:not(:last-child) > a::before{ display:none; } footer .con .bottom > ul > li > ul { margin-top: 1.5rem; width: 100%; } footer .pc_new_contact{ display:flex; font-size:1rem; color:#252b3a; float: right; position:relative; z-index:2; } footer .pc_new_contact a{ margin-left:15px; position:relative; } footer .pc_new_contact a span{ width:1.8rem; height:1.8rem; line-height: 1.8rem; border-radius:1000px; background:none; border: 1px solid #849199; font-size:1.2rem; color:#849199; display:inline-block; text-align:center; } footer .pc_new_contact a:hover span{ color:#ac063c; } footer .pc_new_contact a img{ position:absolute; bottom:130%; width:290%; left:0%; transform: translateX(-30%); display:none; border: 4px solid #fff; } footer .pc_new_contact a:hover img{ display:block; } footer .pc_new_contact_02{ font-size:0.75rem; color:#252b3a; width: calc(100% - 42.5% - 12% - 100px); margin-left: 8%; position:relative; z-index:2; } footer .pc_new_contact_02 .bt02{ color: #252b3a; font-size: 1.2rem; letter-spacing: 1px; } footer .pc_new_contact_02 .bb02{ color: #849199; margin-top: 1.5rem; font-size: 0.7rem; line-height: 1.8rem; } footer .pc_new_contact_02 .bb02 span{ color: #ac063c; font-size: 0.8rem; font-weight: bold; } footer .pc_new_contact_03{ position:relative; z-index:2; width: 130px; } footer .pc_new_contact_03 img{ width: 100%; display: block; border: 10px solid #fff; } footer .pc_new_contact_03 .bt{ color: #849199; font-size: 14px; margin-top: 12px; text-align: center; } footer .copy::before{ position:absolute; clear:none; width:200%; left:-50%; content:" "; background:#f2f2f2; z-index:1; top:0px; height:100%; } footer .copy{ height: auto; position: relative; overflow: visible; } footer .copy .copy_in{ height: auto; padding-top: 1.5rem; padding-bottom: 4rem; border-top: 1px solid #bbc1c5; overflow: visible; position: relative; z-index: 2; } footer .copy .left{ position: relative; z-index: 2; display: flex; } footer .copy .left img{ display: block; height: 1.4rem; margin-right: 1.2rem; } footer .copy .left p{ line-height: 1.2rem; } footer .con .bottom { padding: 5rem 0 2.5rem; } .com_title { text-align: center; padding: 3rem 0 2rem; } .com_title h2 { font-size: 1.75rem; font-weight:bold; display: inline-block; position: relative; } .com_title h2:before { content: '/'; position: absolute; font-size: 1.75rem; left: -40px; top: 0; color: #9f223d; } .com_title h2:after { content: '/'; position: absolute; font-size:1.75rem; right: -40px; top: 0; color: #9f223d; } .benefit_new .text_new{ font-size:16px; color:#333; line-height:36px; background:#f7fafd; padding:10px 25px; margin-bottom:15px; } .benefit_new .text_new strong{ font-weight:bold; font-size:1.125em; } .customcase_new{ padding:4rem 0; background: #edeef0; } .customcase_new_in{ text-align:center; } a.new_spe_a01 { display: inline-block; width: 10rem; height: 3rem; border-radius: 30px; border: 1px solid #fff; background:#fff; text-align: center; line-height: 3rem; font-size: 0.8rem; color: #333; margin-top: 3rem; } #new_pro_tab{ background: url(../img/product/product_detail_ban_bg.jpg) #fff no-repeat right bottom; width: 100%; z-index: 111; } .new_pro_tab{ display:flex; justify-content: center; padding:3rem 0; } .new_pro_tab a{ font-size:18px; color:#333; padding:0 0 10px; position:relative; text-align: center; transition: all 0.5s ease 0.5 ; -webkit-transition: all 0.5s ; -moz-transition: all 0.5s ; -ms-transition: all 0.5s ; } .new_pro_tab a.active, .new_pro_tab a:hover{ color:#9f223d; font-weight:bold; transition: all 0.5s ease 0.5 ; -webkit-transition: all 0.5s ; -moz-transition: all 0.5s ; -ms-transition: all 0.5s ; } .new_pro_tab a::after{ transition: all 0.5s ease 0.5 ; -webkit-transition: all 0.5s ; -moz-transition: all 0.5s ; -ms-transition: all 0.5s ; position:absolute; bottom:0px; height:4px; width:0%; left:50%; content:" "; background:#9f223d; } .new_pro_tab a.active::after, .new_pro_tab a:hover::after{ width:100%; left:0%; transition: all 0.5s ease 0.5 ; -webkit-transition: all 0.5s ; -moz-transition: all 0.5s ; -ms-transition: all 0.5s ; } .new_pro_concon{ display: none; } .new_pro_concon.active{ display: block; } .banner_product_new{ padding:5rem 8%; background:url(../images/pro_bottom_bg.png) 92% bottom #edeef0 no-repeat; background-size:auto 100%; } .banner_product_new .new_t01{ font-size:2.2rem; color:#9f223d; font-weight:bold; } .banner_product_new .new_t02{ font-size:1.2rem; color:#252b3a; margin:0.4rem 0 1.2rem; } .banner_product_new .new_con{ display:flex; } .banner_product_new .new_con input{ width:19.5rem; height:3rem; line-height:3rem; border-radius:0.6rem; border:2px solid #9f223d; margin-right:1.8rem; font-size:1rem; color:#bfbfbf; padding:0 15px; } .banner_product_new .new_con button{ background:#9f223d; width:12rem; height:3rem; line-height:3rem; font-size:1.5rem; color:#fff; font-weight:bold; border-radius:0.6rem; border:0px; } .prodiv{ display:none; } .prodiv.active{ display:flex; flex-wrap:wrap; } .prodiv_list{ background-size:cover; background-position:right top; box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2); padding:1.9rem;width:calc(33.33% - (2.2rem * 2) / 3); margin-left:2.2rem; margin-top:2rem; } .prodiv_list:nth-child(3n+1){ margin-left:0px; } .prodiv_list:nth-child(-n+3){ margin-top:0px; } .prodiv_list .pro_n_t{ font-size:1rem; color:#1a1a1a; } .prodiv_list:hover .pro_n_t{ color:#9d063d; } .prodiv_list .pro_n_b{ font-size:0.8rem; color:#666; margin-top:0.8rem; margin-bottom:0.5rem; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; } .prodiv_list .pro_n_c{ display:flex; flex-wrap:wrap; } .prodiv_list .pro_n_c span{ font-size:0.7rem; color:#999; padding:7px 12px; border:1px solid #ccc; margin:0.5rem 0; margin-right:10px; } .prodiv_list .pro_n_c span:hover{ background: #9d063d; border-color: #9d063d; color: #fff; } .prodiv_list .pro_n_a{ margin-top:1rem; } .prodiv_list .pro_n_a a{ font-size:0.8rem; color:#9a0b37; } .honor_new{ padding:3.5rem 0; background:#f5f5f7; position:relative; z-index:10; } .honor_new_in{ display:flex; justify-content:space-between; flex-direction: row-reverse; } .honor_new_left{ width:84.8%; padding-top:4rem; position:relative; } .honor_new_left::before{ position:absolute; top:0px; width:1.8rem; height:1.8rem; content:""; z-index:2; left:-0.45rem; background:url(../images/honor_icon.png) no-repeat; background-size:100% 100%; } .honor_new_left::after{ position:absolute; top:0px; left:calc(0.35rem - 1px); width:2px; height:100%; content:""; background:#d5b0ba; } .honor_new_left_list{ display:flex; position:relative; z-index:2; } .honor_new_left_l01{ width:0.7rem; height:0.7rem; border-radius:111px; background:#9f223d; margin-top:1rem; } .honor_new_left_l02{ font-size:1.8rem; width:5rem; color:#9f223d; font-weight:bold; margin:0 1.7rem; text-align:center; } .honor_new_left_l03{ width:calc(100% - (0.7rem + 1.7rem * 2 + 5rem)); display:flex; flex-wrap:wrap; font-size:1rem; font-weight:bold; line-height:3; border-top:1px solid #9f223d; margin-top: 1.3rem; padding-top: 0.6rem; overflow:hidden; } .honor_new_left_l03 a{ display:inline-block; min-width:50%; max-width:100%; position:relative; color:#333333; } .honor_new_left_l03 a::after{ position:absolute; bottom:0px; left:0px; width:250%; height:1px; content:""; background:#d9d9d9; } .honor_new_left_l03 a img{ opacity:0; width:0px; height:0px; } .honor_new_right{ width:10.8%; } .honor_new_right_in{ background:#fff; padding:1rem 0; width:100%; text-align:center; } .honor_new_right_in a{ display:block; font-size:0.9rem; color:#000; height:2rem; line-height:2rem; } .honor_new_right_in a.active{ background:#9f223d; color:#fff; } .banner .decor_text{ display:none; } .banner .swiper-pagination-bullets { bottom: 1.5rem; left: 0; } .banner .swiper-pagination-bullets .swiper-pagination-bullet { width: 40px; height: 2px; background: #849199; margin: 0 5px; opacity: 1; border-radius:0px; } .banner .swiper-pagination-bullets .swiper-pagination-bullet-active { background: #fff; } .index_new{ padding:0 8%; } .index_new01_in{ display:flex; justify-content:space-between; padding:5rem 0; flex-wrap:wrap; } .index_new01_left{ width:50.3%; } .index_new01_right{ width:46.25%; } .index_new01_right img{ display:block; width:100%; } .index_new01_left .t01{ font-size:2rem; color:#252b3a; font-weight:bold; } .index_new01_left .b01{ font-size:1.2rem; color:#849199; margin:0.5rem 0 0.8rem; } .index_new01_left .c01{ font-size:0.8rem; color:#849199; line-height:2; } .index_new01_left .a01{ font-size:0.8rem; margin-top:0.5rem; } .index_new01_left .a01 a{ color:#849199; } .index_new01_left .d01{ display:flex; justify-content:space-between; flex-wrap:wrap; } .index_new01_left .d01 .d01_li{ width:50%; margin-top:3rem; } .index_new01_left .d01 .d01_li .d01_t{ font-size:3rem; color:#9f223d; } .index_new01_left .d01 .d01_li .d01_t em{ font-size:2.4rem; font-weight:normal; margin-left:0.7rem; font-style:unset; } .index_new01_left .d01 .d01_li .d01_b{ font-size:0.8rem; color:#849199; } .index_new01_left .d01 .d01_li:hover .d01_t{ color:#9f223d; } .index_new02_in{ display:flex; justify-content:space-between; padding:5rem 0; padding-top:0px !important; } .index_new02_left{ width:10rem; text-align:center; display:flex; flex-direction:column; justify-content:center; font-size:1.8rem; color:#fff; font-weight:bold; background:#9f223d; } .index_new02_right{ box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.4); background:#fff; overflow:hidden; width:calc(100% - 10rem); } .index_new02_right_show{ padding-bottom:2rem; } .index_new02_right .swiper-slide{ text-align:center; padding:1.5rem 0; } .index_new02_right .swiper-slide img{ height:5.3rem; } .index_new02_right .swiper-slide img:first-child{ display:inline-block; } .index_new02_right .swiper-slide img:last-child{ display:none; } .index_new02_right .swiper-slide .index_new02_text{ font-size:0.9rem; color:#666666; margin-top:1rem; } .index_new02_right .swiper-slide:hover img:first-child{ display:none; } .index_new02_right .swiper-slide:hover img:last-child{ display:inline-block; } .index_new02_right .swiper-slide:hover .index_new02_text{ color:#9f223d; } .index_new02_right .swiper-pagination-bullets { bottom: 1.25rem; left: 0; } .index_new02_right .swiper-pagination-bullets .swiper-pagination-bullet { width: 0.7rem; height: 0.7rem; background: #d3d5d8; margin: 0 0.4rem; opacity: 1; } .index_new02_right .swiper-pagination-bullets .swiper-pagination-bullet-active { background: #8f9aa2; } .index_new03{ background:#f2f2f2; } .index_new03_in{ padding:5rem 0; } .index_new03_t01{ font-size:2rem; color:#252b3a; font-weight:bold; text-align:center; } .index_new03_tab{ margin:2rem 0; width:100%; display:flex; } .index_new03_tab a{ width:33.33%; display:flex; justify-content:center; flex-direction:column; background:#fff; height:5rem; box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.2); text-align:center; position:relative; } .index_new03_tab a .t03{ font-size:1.2rem; color:#333; } .index_new03_tab a .b03{ font-size:0.8rem; color:#999; } .index_new03_tab a.active{ background:#9f223d; box-shadow: unset; } .index_new03_tab a.active .t03{ color:#fff; font-weight:bold; } .index_new03_tab a.active .b03{ color:#fff; } .index_new03_tab a.active::after { content: ''; width: 0; height: 0; border-width: 0.9rem 0.9rem 0; border-style: solid; border-color:#9f223d transparent transparent ; position: absolute; bottom: -0.88rem; left: 50%; transform:translateX(-50%); } .index_new03_con_li{ display:none; flex-wrap:wrap; } .index_new03_con_li.active{ display:flex; } .index_new03_con_linew{ width:calc(33.33% - ((1.75rem * 2) / 3)); margin-left: 1.75rem; margin-top: 1.5rem; position: relative; overflow: hidden; } .index_new03_con_linew:nth-child(3n+1){ margin-left: 0; } .index_new03_con_linew:nth-child(-n+3){ margin-top: 0; } .index_new03_con_linew .img { position: relative; height: 0; padding-bottom: 74.82%; overflow: hidden; z-index: 1; } .index_new03_con_linew .img img { position: absolute; height: 100%; top: 0; left: 50%; transform: translateX(-50%); min-width: 100%; } .index_new03_con_linew::after { display: block; content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.3; background: rgba(0, 0, 0, 0.6); transition: all 0.6s linear; z-index: 2; } .index_new03_con_linew:hover::after { opacity: 1; transition: all 0.6s linear; } .index_new03_con_linew .text { position: absolute; width: 100%; padding: 0 1.5rem; bottom: -55%; color: white; z-index: 3; transition: all 0.6s linear; } .index_new03_con_linew:hover .text{ bottom: 30px; transition: all 0.6s linear; } .index_new03_con_linew .text .t{ font-size: 1.2rem; font-weight: bold; } .index_new03_con_linew .text .b{ font-size: 0.9rem; margin-top: 0.2rem; margin-bottom: 0.6rem; } .index_new03_con_linew .text .c{ opacity: 0; transition: all 0.6s linear; } .index_new03_con_linew:hover .text .c{ opacity: 1; transition: all 0.6s linear; } .index_new03_con_linew .text .c .cli{ font-size: 0.8rem; color: #e5e5e5; margin-top: 0.4rem; display: flex; } .index_new03_con_linew .text .c .cli em{ display: flex; flex-direction: column; justify-content: center; } .index_new03_con_linew .text .c .cli img{ display: inline-block; height: 0.4rem; margin-right: 0.5rem; } .index_new03_con_linew .text .a a{ width: 8rem; height: 2.5rem; display: flex; flex-direction: column; justify-content: center; text-align: center; background: #9f223d; border-radius: 1000px; font-size: 0.8rem; font-weight: bold; margin-top: 0.8rem; color: #fff; opacity: 0; transition: all 0.6s linear; } .index_new03_con_linew:hover .text .a a{ opacity: 1; transition: all 0.6s linear; } .index_new04_in{ position:relative; } .index_new04_tab{ position:absolute; bottom:0px; left:0px; width:100%; z-index:1111; } .index_new04_tab_in{ display:flex; } .index_new04_tab_in a{ font-size:1rem; color:#fff; padding:1rem 4rem; } .index_new04_tab_in a.active{ background:rgba(37,43,58,0.4); } .index_new04 .solve .solve-con.active h3{ margin:1rem 0 2rem; } .index_new05_in{ padding:5rem 0; } .index_new05_con{ display:flex; flex-wrap:wrap; margin:2.5rem 0; } .index_new05_con a{ width:calc(33.33% - ((2.5rem * 2) / 3)); box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.3); background:#fff; padding:1rem; border:2px solid #fff; margin-left:2.5rem; } .index_new05_con a:nth-child(3n+1){ margin-left:0px; } .index_new05_con a:nth-child(4){ display:none; } .index_new05_con a .index_new05_img { height: 0; padding-bottom: 56%; overflow: hidden; position:relative; } .index_new05_con a .index_new05_img img { width: 100%; } .index_new05_con a .index_new05_img .cate_name{ position:absolute; left:0px; top:0px; background:#909ba3; font-size:0.9rem; color:#fff; padding:0.5rem 1rem; } .index_new05_con a .index_new05_text{ padding:0 1rem; } .index_new05_con a .index_new05_t{ font-size: 1.2rem; color:#333; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; margin-top:0.5rem; } .index_new05_con a .index_new05_b{ font-size: 0.8rem; color:#999; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; margin: 0.2rem 0 1rem; } .index_new05_con a .index_new05_c{ display:flex; justify-content:space-between; font-size: 0.8rem; color:#ccc; } .index_new05_con a:hover{ border-color:#9f223d; box-shadow:unset; } .index_new05_con a:hover .index_new05_img .cate_name{ background:#9f223d; } .index_new05_con a:hover .index_new05_img img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .index_new05_con a:hover .index_new05_t{ color:#9f223d; } .index_new05_to{ text-align:center; } .index_new05_to a{ font-size: 1rem; color:#252b3a; display:inline-block; border-radius:1000px; border:2px solid #252b3a; width:10rem; height:2.5rem; line-height:2.4rem; } .index_new05_to a:hover{ color:#fff; border-color:#9f223d; background:#9f223d; } .index_new06_midbanner{ position:relative; overflow:hidden; } .index_new06_midbanner > img{ display:block; width:100%; } .index_new06_text{ position:absolute; top:15%; left:0px; text-align:center; width:100%; color:#fff; } .index_new06_text .index_new06_t{ font-size:2.4rem; font-weight:bold; } .index_new06_text .index_new06_b{ font-size:1.5rem; margin-top:1rem; } .index_new07{ margin-bottom:5rem; position:relative; z-index:2; } .index_new07_con{ display:flex; flex-wrap:wrap; margin:2.5rem 0; margin-top:-9rem; } .index_new07_con a{ width:calc(33.33% - ((2.5rem * 2) / 3)); box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.3); background:#fff; padding:0.2rem; margin-left:2.5rem; } .index_new07_con a:nth-child(3n+1){ margin-left:0px; } .index_new07_con a:nth-child(4){ display:none; } .index_new07_con a .index_new07_img { height: 0; padding-bottom: 56%; overflow: hidden; position:relative; } .index_new07_con a .index_new07_img > img { width: 100%; } .index_new07_con a .index_new07_img .toshow{ position:absolute; width:100%; height:100%; top:0px; left:0px; text-align:center; opacity:0; transition: all 0.5s; background:rgba(51,51,51,0.7); display:flex; justify-content:center; flex-direction:column; } .index_new07_con a .index_new07_img .toshow img{ display:inline-block; width:4rem; } .index_new07_con a .index_new07_img .toshow div div{ font-size:1rem; color:#fff; margin-top:1rem; } .index_new07_con a .index_new07_text{ padding:1rem 1.5rem; background:#f5f5f7; } .index_new07_con a .index_new07_t{ font-size: 1.5rem; font-weight:bold; color:#252b3a; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; } .index_new07_con a .index_new07_b{ font-size: 1rem; color:#666; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; margin: 0.2rem 0 0.5rem; } .index_new07_con a .index_new07_c{ font-size: 0.8rem; color:#849199; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden; line-height: 1.5; } .index_new07_con a:hover .index_new07_img > img { transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); } .index_new07_con a:hover .index_new07_t{ color:#9f223d; } .index_new07_con a:hover .index_new07_img .toshow{ opacity:1; transition: all 0.5s; } .banner .swiper-slide{ overflow: hidden; } .banner .swiper-slide.play.video-button{ cursor: pointer; } .con_text_01 .context_left{ display: inline-block; transform: translateX(-1000px); opacity: 0; transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; } .swiper-slide-active .con_text_01 .context_left{ transform: translateX(0px); opacity: 1; transition: all 1.5s ease 0.4s; -webkit-transition: all 1.5s ease 0.4s; -moz-transition: all 1.5s ease 0.4s; -ms-transition: all 1.5s ease 0.4s; } .con_text_01 .context_left .new_ban_t { font-size: 3rem; color: #9f233e; font-style: normal; } .con_text_01 .context_left .new_ban_b { font-size: 2.2rem; color: #333; font-style: normal; width: 60%; } .con_text_01 .context_left .new_ban_c { display: flex; flex-wrap: wrap; justify-content: space-between; width: 80%; font-style: normal; } .con_text_01 .context_left .new_ban_c .new_ban_cli{ width: 50%; margin-top: 1.5rem; } .con_text_01 .context_left .new_ban_c .new_ban_cli .new_ban_cli_t{ font-size: 1.8rem; color: #9f233e; font-weight: bold; } .con_text_01 .context_left .new_ban_c .new_ban_cli .new_ban_cli_t span{ font-size: 1.2rem; } .con_text_01 .context_left .new_ban_c .new_ban_cli .new_ban_cli_b{ font-size: 0.7rem; color: #849199; width: 60%; } .con_text_02{ display: flex; justify-content: space-between; } .con_text_02 .context_left{ display: flex; justify-content: center; flex-direction: column; transform: translateX(-1000px); opacity: 0; transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; } .swiper-slide-active .con_text_02 .context_left{ transform: translateX(0px); opacity: 1; transition: all 1.5s ease 0.4s; -webkit-transition: all 1.5s ease 0.4s; -moz-transition: all 1.5s ease 0.4s; -ms-transition: all 1.5s ease 0.4s; } .con_text_02 .context_left .new_ban_t { font-size: 3.6rem; color: #191919; font-style: normal; } .con_text_02 .context_left .new_ban_b { font-size: 1.8rem; color: #333; font-style: normal; } .con_text_02 .context_left .new_ban_c { } .con_text_02 .context_left .new_ban_c span{ font-size: 1.5rem; color: #fff; display: inline-block; background: #9f233e; border-radius: 1000px; font-style: normal; padding: 0.4rem 2.5rem; margin-top: 1rem; } .con_text_02 .context_right{ width: 45.5%; transform: translateX(1000px); opacity: 0; transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; } .swiper-slide-active .con_text_02 .context_right{ transform: translateX(0px); opacity: 1; transition: all 1.5s ease 1s; -webkit-transition: all 1.5s ease 1s; -moz-transition: all 1.5s ease 1s; -ms-transition: all 1.5s ease 1s; } .con_text_02 .context_right img{ display: block; width: 100%; }