@charset "utf-8"; body, html { width: 100%; overflow-x: hidden; } body { overflow-x: hidden; } * { margin: 0; padding: 0; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: "寰蒋闆呴粦"; } body, p, h1, h2, h3, h4, h5, table, ul, li, form, input { margin: 0; padding: 0; color: #000; line-height: 1; } body, p { font-size: 14px; border: none; color: #000; } a { font-size: 14px; color: #000; text-decoration: none; border: none; padding: 0; margin: 0; } table { border-collapse: collapse; } img { border: 0; margin: 0; padding: 0; display: block; } ul, li { list-style: none; border: 0; margin: 0; padding: 0; } dl, dt, dd { margin: 0; padding: 0; -webkit-margin-start: 0; } h1, h2, h3, h4, h5 { font-weight: normal; font-size: 12px; display: block; } /*strong, b { font-weight: normal; } */ table, tr, td { border-spacing: 0; } em, i, b { font-style: normal; } p { line-height: 170%; color: #555; font-size: 14px; } input, button, textarea { border: none; background: none; } figcaption { display: block; } input:focus, button:focus, label:focus, textarea { outline: none; } ::-webkit-input-placeholder { /* WebKit browsers */ font-size: 14px; color: #555; } ::-ms-input-placeholder { /* Internet Explorer 10+ */ font-size: 14px; color: #555; } .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; } .clearfix:after { clear: both; } .clear { clear: both; } .fl { float: left; } .fr { float: right; } svg:focus { outline: none; } input[type="button"], input[type="submit"], input[type="reset"] { -webkit-appearance: none; } .w1400 { max-width: 1400px; width: 100%; margin: 0 auto; } .container { margin: 0 auto; width: 100%; padding-left: 0px; margin-top: 90px; } .newtop { position: fixed; top: 0; left: 0; right: 0; z-index: 333; } .newtop .div1 { display: flex; align-items: center; padding: 15px 5rem; } .newtop li { position: relative; display: inline-block; vertical-align: middle; } .newtop li a { color: #fff; font-size: 16px; display: inline-block; vertical-align: middle; } .newpcul { margin: 0 auto; justify-content: space-between; display: flex; width: 60%; } .newpcul { display: flex; } .newtop .pc-top { position: relative; top: 0; right: 0; display: flex; justify-content: flex-end; z-index: 333; color: #fff; font-size: 15px; align-items: center; } .newtop .search-btn { color: #fff; font-size: 14px; cursor: pointer; } .newtop .white { display: block; } .newtop .search-btn img { display: inline-block; vertical-align: middle; margin-right: 5px; } .newtop .subnav a { display: block; font-size: 14px; line-height: 40px; text-align: center; transition: all 0.6s; } .newtop.on { background: #fff; animation: down10 1s; border-bottom: 1px solid #E0E0E0; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .newtop.on li>a, .newtop .subnav a { color: #333; } .newtop .pc-tel { margin-left: 50px; } .newtop .pc-tel span { font-family: 'DIN'; font-size: 20px; line-height: 1; color: #fff; } .newtop .pc-tel img { vertical-align: -1px; display: inline-block; margin-right: 5px; } .newtop .pc-tel .black, .newtop .search-btn .black { display: none; } .newtop.on .pc-tel span, .newtop.on .search-btn { color: #333; } .newtop.on .black { display: inline-block; } .newtop.on .white { display: none; } .newtop.on .logo img { height: 50px; transition: all 0.6s; } .subnav { position: absolute; top: 85px; border: 1px solid #e0e0e0; padding: 20px 25px; background: #fff; width: 100%; min-width: 150px; left: 50%; transform: translateY(10px) translateX(-50%); opacity: 0; visibility: hidden; transition: all 0.56s; z-index: 33333; box-shadow: 0px 0px 10px 0px rgba(6, 0, 1, 0.1); border-radius: 4px; } .subnav::before { position: absolute; content: ''; display: block; width: 0; height: 0; border-color: #fff #fff transparent transparent; transform: rotate(-45deg); border-style: solid; border-width: 8px; box-shadow: 2px -2px 2px rgba(0, 0, 0, 0.1); top: -8px; left: 50%; margin-left: -8px; } .newtop ul>li::before, .newtop ul>li.on::before { display: block; content: ''; position: absolute; left: 0; right: 0; transform-origin: center; background: #e62129; height: 3px; transition: all 0.6s; top: 47px; transform: scaleX(0); width: 100%; } .newtop li:hover .subnav { visibility: visible; opacity: 1; transform: translateY(0px) translateX(-50%); } .newtop ul>li:hover::before, .newtop ul>li.on::before { transform: scaleX(1); } .subnav a:hover { color: #E62129; } @keyframes down10 { from { transform: translateY(-30px); } to { transform: translateY(0); } } .fourline { width: 100%; position: absolute; left: 0; font-size: 0; letter-spacing: 0; top: 0; height: 100vh; pointer-events: none; position: fixed; z-index: 10000; } .fourline .line { width: 25%; position: relative; overflow: hidden; letter-spacing: .8px; display: inline-block; vertical-align: top; height: 100%; } .fourline .line { animation: linegrow 1.2s linear; } .fourline .line1 { animation-delay: 0.5s; } .fourline .line2 { animation-delay: 0.7s; } .fourline .line3 { animation-delay: 1s; } .fourline .line4 { animation-delay: 1.2s; } @keyframes linegrow { from { height: 100%; background: #000; border-right: 1px solid rgba(255, 255, 255, 0.2); } to { height: 0; background: transparent; border-right: 1px solid transparent; } } .pcsidebar { display: flex; flex-direction: column; flex-wrap: wrap; position: fixed; left: 0; top: 0; bottom: 0; width: 170px; align-content: center; height: 100%; box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.05); overflow: hidden; display: none; } .pcsidebar .logo { margin-top: 60px; } .pcul { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; margin-top: 30px; } .pcul li { padding: 25px 0; } .pcul li a { color: #000000; font-size: 16px; transition: all 0.6s; text-align: center; display: block; position: relative; } .pcul li a::after, .pcul li.on a::after { content: ''; display: block; height: 1px; width: 0; background-color: #e62129; position: absolute; left: -65px; top: 50%; transition: all 1s; /* border-radius: 100%; */ z-index: -1; } .pcul li a:hover::after, .pcul li.on a::after { left: 0%; width: 46px } .pcul li a:hover, .pcul li.on a { color: #e62129; } .linkicon { display: flex; justify-content: center; position: absolute; bottom: 60px; width: 100%; } .linkicon a { margin: 0 10px; display: block; transition: all 0.36s; } .linkicon .qq { background: url(../images/qq.png) no-repeat top center; width: 15px; height: 16px; } .linkicon .weixin { background: url(../images/weixin.png) no-repeat center -2px; width: 20px; height: 20px; position: relative; display: inline-block; } .linkicon .weibo { background: url(../images/weibo.png) no-repeat top center; width: 21px; height: 16px; } .linkicon a:hover { background-position: bottom center; } .linkicon .weixinpop { position: absolute; transition: all 0.6s; top: -120px; left: 50%; transform: translateY(-10px) translateX(-50%); /* box-shadow: 0 0 10px 5px rgba(0,0,0,0.05); */ border: 1px solid #eee; padding: 10px; opacity: 0; transition: all 0.36s; visibility: hidden; } .linkicon .weixin img { display: block; width: 90px; height: 90px; margin: 0 auto; } .linkicon .weixin:hover .weixinpop { opacity: 1; transform: translateY(0) translateX(-50%); visibility: visible; } .mobilebarwrap { display: none; z-index: 333; position: relative; } .mobilebar { position: fixed; top: 0; left: 0; right: 0; width: 100%; display: flex; justify-content: space-between; height: 50px; background: #fff; padding: 0 15px; border-bottom: 1px solid #e5e5e5; align-items: center; } .mobilebar .logo { display: flex; justify-content: center; align-items: center; } .mobilebar .logo img { display: block; height: 30px; } .mobile-ul { position: fixed; top: 50px; right: -100%; left: 0; padding: 30px; visibility: hidden; opacity: 0; transition: all 1s; background: #fff; height: 100%; } .mobile-ul li>a { font-size: 16px; display: block; text-align: center; line-height: 46px; font-weight: bold; } .mobile-ul .erji { display: none; } .mobile-ul .erji a { font-size: 14px; display: block; color: #333; text-align: center; line-height: 30px; } .bar-btnwrap { display: flex; align-items: center; height: 100%; } .bar-btn { display: flex; flex-direction: column; align-content: center; justify-content: space-around; height: 20px; width: 30px; align-items: flex-end; } .bar-btn span { display: block; height: 2px; width: 20px; background: #000; margin: 1px 0; transition: all 0.6s; } .bar-btn .span2 { width: 30px; } .mobilebar .search { margin-left: auto; margin-right: 20px; } .bar-btnwrap.on .bar-btn .span1 { width: 30px; } .bar-btnwrap.on .bar-btn .span2 { width: 20px; } .mobile-ul.on { opacity: 1; visibility: visible; right: 0; } .mobile-tel img { display: block; margin: 50px auto 20px auto; width: 40px; } .mobile-tel h3 { text-align: center; color: #333; font-size: 24px; } .search-bg { position: fixed; bottom: 0; right: 0; left: 0; top: 0; background: #000; z-index: 333; visibility: hidden; opacity: 0; transition: all 0.6s; } .pc-searchwrap { visibility: hidden; opacity: 0; z-index: 3333; } .pc-search { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3333; width: 60%; height: 59px; } .pc-search .input { color: #232; width: 80%; } .search-box { display: flex; justify-content: space-between; height: 59px; align-items: center; border-bottom: 2px solid #fff; } .serch-subbtn { background: url(../images/search.png) no-repeat top center; width: 21px; height: 21px; display: block; cursor: pointer; } .search-box .row { position: relative; width: 90%; } .search-box .in { height: 59px; color: #aaa; z-index: 33; padding-left: 10px; transition: all 0.6s; width: 100%; } .search-box label { position: absolute; left: 10px; top: 0px; height: 59px; transition: all 0.3s; color: #999; cursor: text; line-height: 59px; right: 0; font-size: 20px } .search-box .in:focus+label { top: -10px; opacity: 0; } .search-box .in:not(:focus):not(:placeholder-shown)+label { color: rgba(0, 0, 0, 0); } .search-box .in:not(:focus):not(:-ms-input-placeholder)+label { color: rgba(0, 0, 0, 0); } .pc-searchwrap.on { visibility: visible; opacity: 1; } .pc-searchwrap.on .search-bg { visibility: visible; opacity: 1; } .pc-searchwrap.on .search-box { animation: anim-open-2 1s linear; } .pc-top { position: absolute; top: 0; right: 0; width: 100%; display: flex; justify-content: flex-end; z-index: 333; color: #fff; font-size: 15px; padding: 40px 80px 0 0; align-items: center; display: none; } .pc-top img { display: inline-block; margin-right: 5px; } .pc-top .search-btn { cursor: pointer; } .pc-top .search-btn img { vertical-align: -3px; } .pc-top .pc-tel { margin-left: 50px; } .pc-top .pc-tel span { font-family: 'DIN'; font-size: 20px; line-height: 1; } .pc-top .pc-tel img { vertical-align: -1px; } .newtop .logo img { height: 50px; } /* banner */ .banner { width: 100%; height: 100vh; } .banner .swiper-slide img { width: 100%; height: 100vh; min-height: 100%; transition: 1s linear 2s; transform: scale(1.05, 1.05); object-fit: cover; margin: 0 auto; display: block; } .banner .swiper-slide-active img, .swiper-slide-duplicate-active img { transition: 6s linear; transform: scale(1, 1); } .banner .imgnum { position: absolute; bottom: 55px; left: 80px; } .banner .imgnum span { color: #ffffff; letter-spacing: 4px; font-size: 40px; font-family: 'DIN'; display: inline-block; margin-right: 3px; } .banner .imgnum strong { color: #ffffff; letter-spacing: 10px; font-size: 20px; font-family: 'DIN'; font-weight: normal; } .banner .mouse-tip { width: 34px; height: 60px; border-radius: 17px; border: solid 2px #ffffff; position: absolute; bottom: 50px; left: 50%; z-index: 333; overflow: hidden; cursor: pointer; } .banner .mouse-tip i { display: block; width: 2px; height: 10px; background: #fff; animation: b 1s linear infinite; position: absolute; left: 50%; top: 30px; margin-left: -2px; } .banner .swiper-pagination { left: auto; right: 80px; transform: none; width: auto; bottom: 55px; } .banner .swiper-pagination-bullet { background: #fff; width: 3px; border-radius: 0; height: 10px; opacity: 0.6; margin: 0 10px !important; transition: all 0.6s; } .banner .swiper-pagination-bullet-active { height: 20px; opacity: 1; } .index-sec1 { background: url(../images/indexbg1.png) no-repeat right top; } .index-sec1 .leftcont { padding: 5rem } .index-sec1 .div1 { display: flex; justify-content: space-between; ; } .index-sec1 .div1left h3 { color: #000000; font-size: 40px; line-height: 80px; font-weight: bold; } .index-sec1 .div1left h4 { color: #000000; font-size: 22px; line-height: 40px; display: block; } .index-sec1 .div1left i { display: block; width: 60px; height: 2px; background-color: #eeeeee; margin: 50px 0; } .index-sec1 .div1 .more { width: 201px; height: 60px; border: solid 2px #222222; color: #333333; font-size: 16px; display: flex; align-items: center; justify-content: center; transition: all 0.6s; } .index-sec1 .div1 .more img { display: inline-block; vertical-align: middle; margin-left: 5px; transition: all 0.6s; } .index-sec1 .div1 .more:hover { box-shadow: 0 0 20px 5px rgba(0, 0, 0, 0.2); padding-left: 10px; transform: translateX(10px); } .index-sec1 .div1 .more:hover img { transform: translateX(5px); } .index-sec1 .div2 { max-width: 795px; width: 100%; } .index-sec1 .div2 p { line-height: 40px; font-size: 15px; } .index-sec1 .div2 .p2 { margin-top: 35px; } .index-sec1 .timelinewrap { background: rgba(255, 255, 255, 0.9); } .index-sec1 .timeline { display: flex; align-items: flex-end; justify-content: space-around; padding: 70px 5rem 50px 5rem; width: 100%; } .index-sec1 .timeline li { display: flex; align-content: flex-end; } .index-sec1 .timeline li a { display: block; vertical-align: bottom; } .index-sec1 .timeline strong { color: #e62129; font-size: 60px; font-weight: bold; font-family: 'DIN'; display: inline-block; line-height: 0; padding: 0 5px; } .index-sec1 .timeline span { display: inline-block; font-size: 16px; font-size: 18px; color: #000; } .index-sec1 .reveal-block.right::before { background: #e62129; } .index-sec2 { position: relative; } .index-sec2 .leftcont { position: relative; /* max-width: 1225px; */ width: 70%; overflow: hidden; } .index-sec2 .item-text { background: #f00; /* max-width: 480px; */ top: 50%; right: 0; max-height: 520px; position: absolute; z-index: 3333; width: 40%; height: 100%; padding: 6rem 4rem; background: url(../images/redbg.png) no-repeat center; background-size: 100% 100%; transform: translateY(-50%); } .index-sec2 .item-text h3 { color: #ffffff; font-size: 30px; font-weight: bold; margin-bottom: 30px; } .index-sec2 .item-text p { color: #ffffff; font-size: 14px; line-height: 30px; transform: translateY(30px); opacity: 0; transition: all 800ms ease; } .index-sec2 .item-text .line { width: 14px; height: 4px; background: #fff; margin-bottom: 30px; transition: all 0.8s ease; transform: translateY(30px); opacity: 0; } .index-sec2 .item-text h3 { transform: translateY(30px); opacity: 0; transition: all 800ms ease; } .index-sec2 .swiper-slide-active .item-text h3 { transform: none; opacity: 1; } .index-sec2 .swiper-slide-active .item-text p { transform: none; opacity: 1; } .index-sec2 .swiper-slide-active .item-text .line { transform: none; opacity: 1; } .index-sec2 .item-num { position: absolute; bottom: 6rem; left: 4rem; transform: translateX(30px); opacity: 0; transition: all 800ms ease; } .index-sec2 .swiper-slide-active .item-num { transform: none; opacity: 1; } .index-sec2 .item-num span { color: #ffffff; font-size: 40px; font-family: 'DIN'; } .index-sec2 .item-num strong { color: #ffffff; font-size: 20px; font-family: 'DIN'; letter-spacing: 3px; } .index-sec2 .rightcont { position: absolute; width: 30%; background: url(../images/probg.png) no-repeat top center; /* height: 100%; */ right: 0; top: 0; bottom: 0; overflow: hidden; background-size: 100% 100%; } .index-sec2 .rightcont .centerdiv { height: 100%; display: flex; flex-direction: column; justify-content: center; padding-left: 4rem; } .index-sec2 .rightcont .swiper-wrapper { flex-direction: column; align-content: center; justify-content: center; align-self: center; } .index-sec2 .rightcont .swiper-slide { width: 100% !important; cursor: pointer; position: relative; margin-bottom: 40px; } .index-sec2 .rightcont h4 { color: #ffffff; font-size: 16px; font-family: 'DIN'; } .index-sec2 .rightcont h3 { color: #ffffff; font-size: 30px; padding: 4rem 0 6rem 0; line-height: 1.6; } .index-sec2 .rightcont span { color: #ffffff; opacity: 0.6; font-family: 'DIN'; display: inline-block; margin-right: 20px; transition: all 0.6s; } .index-sec2 .rightcont strong { color: #ffffff; opacity: 0.6; font-size: 16px; transition: all 0.6s; position: relative; } .index-sec2 .item-img img { width: 100%; min-height: 100%; transition: 1s linear 2s; transform: scale(1.05, 1.05); object-fit: cover; margin: 0 auto; } .index-sec2 .swiper-slide-active .item-img img, .index-sec2 .swiper-slide-duplicate-active img { transition: 6s linear; transform: scale(1, 1); } .index-sec2 .rightcont .swiper-slide-thumb-active span, .index-sec2 .rightcont .swiper-slide-thumb-active strong { opacity: 1; } .index-sec2 .divnum { position: relative; display: flex; width: auto; } .index-sec2 .rightcont i { height: 4px; background: #e62129; margin-top: -2px; position: absolute; right: 0; bottom: 0; left: -40px; display: inline-block; transition: all 0.6s; transform: scale(0, 1); transform-origin: left center } .index-sec2 .rightcont .swiper-slide-thumb-active i { transform: scale(1); } .index-sec2 .leftcont .reveal-holder .reveal-block::before { background: #000; } .index-sec2 .rightcont.reveal-holder .reveal-block::before { background: #e62129; } .reveal-holder .reveal-block::before { background: #E62129; } .index-sec3 { padding: 4rem 5rem; background: #fafafa; } .index-sec3 .index-title { text-align: center; } .index-sec3 .index-title h3 { text-align: center; color: #000000; font-size: 40px } .index-sec3 #tab { display: flex; justify-content: center; align-items: center; margin-top: 45px; } .index-sec3 #tab a { width: 140px; height: 44px; background-color: #ffffff; border-radius: 22px; border: solid 1px #eeeeee; display: block; text-align: center; line-height: 44px; box-sizing: content-box; margin: 0 23px; font-size: 18px; transition: all 0.6s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .index-sec3 #tab a.active, .index-sec3 #tab a:hover { background-color: #e62129; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); border-collapse: #e62129; color: #fff; } .index-sec3 ul { display: flex; margin-left: -22px; margin-right: -22px; margin-top: 45px; } .index-sec3 li { width: calc(100%/3 - 44px); margin-left: 22px; margin-right: 22px; transition: all 0.6s; } /*.index-sec3 li:last-child{ display: none;}*/ .index-sec3 .itemimg { overflow: hidden; position: relative; } .index-sec3 .itemimg img { display: block; width: 100%; transition: all 0.6s; } .index-sec3 .item-text p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #333333; font-size: 20px; line-height: 1; margin: 20px 0 0 0; transition: all 0.6s; } /*.index-sec3 li:hover .itemimg img{ transform: scale(1.1);}*/ /*.index-sec3 li:hover{ transform: translateY(-10px);}*/ /*.index-sec3 li:hover p{ color: #E62129; letter-spacing: 0.5px;}*/ .index-sec3 li .itemimg>img { display: block; width: 100%; transition: all 0.6s; } .index-sec3 li .whitelogo { position: absolute; bottom: 0; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: center; } .index-sec3 li .whitelogo img { position: relative; z-index: 33; transform: scale(1, 0); transition: all 0.6s; transition-delay: 0.3s; opacity: 0; width: 80%; } .index-sec3 li .itemimg::before { position: absolute; content: ''; display: block; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to top, #e62129, transparent); z-index: 33; transition: all 0.6s; transform: scale(1, 0); transform-origin: bottom center; opacity: 0; } .index-sec3 li:hover .itemimg::before { transform: scale(1); opacity: 1; } .index-sec3 li p { color: #333333; font-size: 26px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 30px 0; text-align: left; transition: all 0.6s; } .index-sec3 li:hover .whitelogo img { transform: scale(1); opacity: 1; } .index-sec3 li:hover p { color: #E62129; letter-spacing: 2px; } .index-sec4 { padding: 4rem 5rem 90px 5rem; background: url(../images/zixunbg.png) no-repeat top center; } .index-sec4 .maincont { display: flex; } .index-sec4 .leftcont { width: 26%; position: relative; } .index-sec4 .rightcont { width: 74%; overflow: hidden; } .index-sec4 .tit h3 { font-size: 40px; color: #333; } .index-sec4 .tit h4 { font-size: 20px; color: #333; margin-top: 20px; margin-bottom: 140px; } .index-sec4 #tab2 a { color: #333333; font-size: 20px; transition: all 0.6s; display: block; margin-bottom: 50px; } .index-sec4 #tab2 a.active { color: #e62129; font-size: 30px; font-weight: bold; } .index-sec4 .more { display: block; width: 170px; height: 50px; background-color: #e62129; border-radius: 25px; transition: all 0.6s; color: #fff; font-size: 16px; line-height: 50px; box-sizing: border-box; text-align: center; position: absolute; bottom: 0; left: 0; } .index-sec4 .more img { display: inline-block; transition: all 0.6s; } .index-sec4 .more:hover { box-shadow: 0 0 30px 10px rgba(230, 33, 41, 0.3); transform: translateX(10px); } .index-sec4 .more:hover img { transform: translateX(5px); } .index-sec4 .swiper-scrollbar-drag { background: #E62129; height: 4px; border-radius: 0; top: -1px; } .index-sec4 .swiper-container-horizontal>.swiper-scrollbar { left: 0; height: 2px; background: #eeeeee; } .index-sec4 .swiper-progress { display: none; } .index-sec4 .swiper-progress.on { display: block; } .index-sec4 .item-text { transition: all 0.6s; padding: 15px 10px; margin-bottom: 20px; } .index-sec4 .item-text p { transition: all 0.6s; } .index-sec4 .item-text .div2 { display: flex; justify-content: space-between; margin-bottom: 10px; } .index-sec4 .item-text .p1 { color: #333333; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 !important; } .index-sec4 .item-text .p2 { color: #333333; font-size: 20px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .index-sec4 .item-text .p3 { color: #333333; font-size: 14px; margin: 0 !important; } .index-sec4 .item-img { display: block; width: 100%; overflow: hidden; } .index-sec4 .item-img img { display: block; width: 100%; transition: all 0.6s; } .index-sec4 .swiper-slide { transition: all 0.6s; } .index-sec4 .swiper-slide:hover .item-img img { transform: scale(1.1); } .index-sec4 .swiper-slide:hover .item-text { background: #E62129; transform: translateY(-40px); } .index-sec4 .swiper-slide:hover .item-text p { color: #fff; } .footer { background: #FAFAFA; padding: 4rem 5rem; position: relative; } .footer .maincont { display: flex; } .footer .maincont .p1 span { display: inline-block; margin-right: 10px; } .footer .leftcont { width: 50%; display: flex; flex-direction: column; justify-content: center; height: 100%; } .footer .rightcont { width: 50%; display: flex; justify-content: space-between; height: 100%; padding-left: 5rem; position: relative; } .footer .line { position: absolute; bottom: 0; top: 0; width: 1px; height: 100%; background: #dddddd; left: 50%; } .footer .p2-div { display: flex; } .footer .p2-div .code { align-self: center; } .footer .p2-div p { margin-right: 110px; } .footer .p2-div .code p { text-align: center; margin-right: 0; margin-top: 10px; } .footer .p2-div .code img { width: 110px; height: 110px; } .footer .leftcont .p1, .footer .rightcont .p1 { font-size: 14px; color: #555; margin-bottom: 40px; } .footer .leftcont .p2 a { color: #000000; font-size: 16px; display: block; display: block; line-height: 50px; } .footer .rightcont .p2 { font-size: 16px; color: #000; line-height: 50px; } .footer .rightcont .div1 { position: relative; z-index: 33; } .footer .rightcont .div2 { position: absolute; top: 50%; transform: translateY(-50%); right: 0; } .footer .rightcont img { display: block; max-width: 90%; height: auto; } .footer .leftcont .p2 a { transition: all 0.6s; position: relative; z-index: 6; } .footer .leftcont .p2 a:hover, .footer .leftcont .p2 a:hover { color: #E62129 !important; } .footer .leftcont .p2 a::before { position: absolute; left: 0px; width: 100%; height: 2px; display: block; content: ''; transform: scaleX(0); transform-origin: right 50%; transition-property: transform; transition-duration: 380ms; bottom: -2px; background-color: #E62129; z-index: -1; } .footer .leftcont .p2 a:hover::before { transform: scaleX(1); transform-origin: left 50%; } .footer .rightcont .div2 .dot { position: absolute; bottom: 53%; right: 24%; width: 18px; height: 18px; border: solid 2px #e5a1a4; z-index: 33; border-radius: 100%; animation: linechange 1s forwards alternate-reverse infinite linear; } .footer .rightcont .dot::after { position: absolute; content: ''; display: block; left: 50%; top: 50%; background: #E62129; width: 8px; height: 8px; border-radius: 100%; border-radius: 100%; transform: translate(-50%, -50%); } .copyright { display: flex; justify-content: space-between; background: #FAFAFA; border-top: 1px solid #ddd; align-items: center; } .copyright .p1 { color: #555555; font-size: 14px; width: 50%; padding-left: 5rem; } .copyright .right { background: #E62129; padding: 50px 0; width: 50%; display: flex; padding-left: 5rem; } .copyright .right img { display: inline-block; vertical-align: middle; margin-right: 10px; } .copyright .right p { color: #fff; font-size: 14px; margin-right: 30px; } /* 鏂伴椈璧勮 */ .pc-neitop { color: #000; position: relative; padding-top: 40px !important; padding-bottom: 40px !important; } .pc-neitop .pc-tel span { color: #E62129; } .padding5rem { padding: 0 5rem; ; } .padding40 { padding-top: 40px; } .neibanner { width: 100%; overflow: hidden; display: flex; align-items: center; justify-content: center; /*margin-top: 80px;*/ } .neibanner img { display: block; width: 100%; object-fit: cover; } .breadcrumbwrap { border-bottom: 1px solid #e5e5e5; margin-bottom: 30px; } .breadcrumb { display: flex; justify-content: space-around; border-bottom: 1px solid #e5e5e5; } .breadcrumb a { display: block; margin: 0; color: #000000; font-size: 18px; padding: 40px 0; position: relative; transition: all 0.6s; } .breadcrumb a::before { position: absolute; bottom: -1px; height: 3px; background: #E62129; content: ''; display: block; left: 0; right: 0; width: 100%; transition: all 0.6s; transform: scale(0, 1); transform-origin: center; } .breadcrumb a.on, .breadcrumb a:hover { color: #E62129; } .breadcrumb a.on::before, .breadcrumb a:hover::before { transform: scale(1); } .xwzx-ul { display: flex; flex-wrap: wrap; margin-left: -25px; margin-right: -25px; } .xwzx-ul li { width: calc(100%/3 - 50px); margin-left: 25px; margin-right: 25px; transition: all 1s; margin-bottom: 40px; } .xwzx-ul .item-img { width: 100%; overflow: hidden; } .xwzx-ul .item-img img { display: block; width: 100%; transition: all 1.6s; overflow: hidden; } .xwzx-ul .item-text { padding: 15px 10px !important; transition: all 1s; /* height: 210px; */ } .xwzx-ul .item-text div { display: flex; justify-content: space-between; align-items: center; } .xwzx-ul .item-text div span { font-size: 12px; color: #666; transition: all 0.6s; } .xwzx-ul .item-text .p1 { color: #333333; font-size: 14px } .xwzx-ul .item-text .p2 { color: #333333; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 10px 0 10px 0; line-height: 1; } .xwzx-ul .item-text .p2-1 { color: #666; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 10px 0 10px 0; } .xwzx-ul .item-text .p3 { color: #333333; font-size: 16px; display: flex; justify-content: space-between; align-items: center; } .xwzx-ul .item-text .p3 img { transition: all 0.6s; opacity: 0; } .xwzx-ul li:hover { box-shadow: 0px 5px 32px 0px rgba(3, 0, 0, 0.34); } .xwzx-ul li:hover .item-text { background: #e62129; } .xwzx-ul li:hover .p1, .xwzx-ul li:hover .p2, .xwzx-ul li:hover .p2-1, .xwzx-ul li:hover .p3 { color: #fff; } .xwzx-ul li:hover .item-text .p3 img { opacity: 1; } /* .xwzx-ul li:hover .p2{ color: #e62129;} */ .xwzx-ul li:hover .item-img img { transform: scale(1.05); } .xwzx-ul li:hover .item-text div span { color: #fff; } .showmorebtn { width: 250px; height: 60px; background-color: #f7bcbe; display: block; text-align: center; color: #fff; line-height: 60px; margin: 0 auto 50px auto; font-size: 18px; transition: all 0.6s; } .showmorebtn:hover { box-shadow: 0 0 20px 10px rgba(230, 33, 41, 0.3); background: #E62129; letter-spacing: 3px; border-radius: 3px; } .wave-wrapper { width: 100%; height: 120px; position: relative; } .wave { width: 100%; height: 120px; position: absolute; } .wave1 { bottom: 0px; background: url('../images/wave1.png'); background-position: 0 0; animation: moveLeft 15s linear infinite; } .wave2 { bottom: 0; background: url('../images/wave2.png'); background-position: 0 0; animation: moveRight 15s linear infinite; } /* 鏂伴椈璇︽儏 */ .xwzxde-sec1 { padding-bottom: 5px; border-bottom: 1px solid #e5e5e5; display: flex; align-items: center; } .xwzxde-sec1>div { flex-grow: 1; padding-right: 10px; } .xwzxde-sec1 .backbtn { display: block; width: 50px; height: 50px; border: solid 1px #e5e5e5; border-radius: 100%; text-align: center; display: flex; align-items: center; justify-content: center; transition: all 0.6s; flex-shrink: 0; } .xwzxde-sec1 .backbtn img { display: inline-block; vertical-align: middle; transition: all 0.6s; width: 23px; height: 20px; } .xwzxde-sec1 .backbtn:hover { border-color: #E62129; box-shadow: 0 0 10px 5px rgba(230, 33, 41, 0.3); } .xwzxde-sec1 .backbtn:hover img { transform: scale(0.9); } .xwzxde-sec1 h3 { color: #333333; font-size: 28px; margin-bottom: 20px; text-align: center; } .xwzxde-sec1 p { text-align: center; } .xwzxde-sec1 p span { display: inline-block; margin-right: 10px; } .xwzxde-sec2 { display: flex; margin: 40px 0; align-items: center; height: 110px; } .xwzxde-sec2 strong { background: #E62129; color: #fff; font-family: "瀹嬩綋"; width: 159px; font-size: 40px; font-weight: bold; flex-shrink: 0; display: flex; align-items: center; justify-content: center; height: 100%; } .xwzxde-sec2 p { color: #333333; line-height: 36px; font-size: 16px; text-indent: 3em; display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .xwzxde-sec2 div { background: #f5f5f5; height: 100%; display: flex; align-items: center; padding: 30px 50px; flex-grow: 1; } .xwzxde-sec3 { line-height: 43px; font-size: 16px; color: #333333; margin: 20px 0; } .xwzxde-sec3 p { line-height: 43px; font-size: 16px; color: #333333; } .xwzxde-sec3 img { display: block; max-width: 100%; height: auto; margin: 10px auto; } .fenpian { display: flex; justify-content: space-between; padding: 50px 0; } .fenpian>div { display: block; width: 48%; } .fenpian span { color: #888; transition: all 0.6s; } .fenpian .prevpian { background: url(../images/arrowleft.png) no-repeat left center; padding-left: 25px; } .fenpian .nextpian { background: url(../images/arrowright.png) no-repeat right center; padding-right: 25px; } .fenpian .nextpian span { display: block; text-align: right; color: #888888; font-size: 14px } .fenpian .nextpian p { text-align: right; } .fenpian p { color: #333; font-size: 18px; margin-top: 10px; transition: all 0.6s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fenpian a:hover p { color: #E62129; } /* 鎷涜搐绾冲+ */ .join-sec1 { display: flex; } /* .join-sec1 .left{ width: 40%; background: #E62129; display: flex; flex-direction: column; justify-content: center; padding: 0 5rem; position: relative;} .join-sec1 .right{ width:60%;} .join-sec1 .right img{ display: block; width: 100%; height: auto;} .join-sec1 .left h4{ color: #ffffff; font-size: 40px; text-align: center; font-weight: bold; margin-bottom: 2rem;} .join-sec1 .left h5{ color: #ffffff; font-size: 30px; text-align: right;} .join-sec1 .left h5 i{ display: inline-block; vertical-align: middle; background: #fff; width: 54px; height: 2px; } .join-sec1 .left h2{ color: #ffffff; font-size: 40px; font-weight: bold; margin-bottom:2rem;} .join-sec1 .left p{ color: #ffffff; line-height: 50px; font-size: 26px;} .join-sec1 .arrow{ position: absolute; bottom: 4rem; right: 5rem;} .join-sec1 .div2{ margin-top: 6rem;} .join-sec1 .line1{ position: absolute; top: 5rem; right: 5rem; border:1px solid #fff; border-left: none; border-bottom: none; width: 40px; height: 40px; transition: all 0.6s; animation: linear linewidth 1s infinite alternate-reverse;} .join-sec1 .line2{ position: absolute; top: 16rem; left: 5rem; border:1px solid #fff; border-right: none; border-top: none; width: 40px; height: 40px; transition: all 0.6s; animation: linear linewidth 1s infinite alternate-reverse; vertical-align: bottom;} */ /* @keyframes linewidth{ from{ width: 40px; opacity: 0.5;} to{ width: 160px; opacity: 1;} } */ .join-sec2 .tit { margin-top: 70px; text-align: center; } .join-sec2 .tit h2 { text-align: center; font-size: 40px; color: #333; } .join-sec2 .tit h3 { text-align: center; font-size: 24px; color: #333; margin-top: 20px; } .join-sec2 ul { display: flex; justify-content: space-between; margin-top: 50px; } .join-sec2 li { max-width: 195px; transition: all 0.6s; width: calc(100%/6); } .join-sec2 li:nth-child(2n) { margin-top: 30px; width: calc(100%/9); } .join-sec2 li span { display: block; width: 80px; height: 80px; background-color: #e62129; text-align: center; line-height: 80px; color: #fff; font-size: 30px; border-radius: 100%; margin: 0 auto; transition: all 0.6s; } .join-sec2 li strong { color: #333333; font-size: 24px; font-weight: bold; text-align: center; display: block; margin: 20px auto; } .join-sec2 li p { text-align: center; color: #333333; font-size: 14px; line-height: 30px; } .join-sec2 li:hover span { box-shadow: 0px 0px 65px 0px rgba(230, 33, 41, 0.2); transform: scale(0.9); } .join-sec2 li:hover { transform: translateY(-10px); } .join-sec2 li img { display: block; margin: 0 auto; } .join-sec3 { background: url(../images/zxnshf.png) no-repeat top center; background-size: cover; height: 300px; display: flex; flex-direction: column; justify-content: center; padding-left: 70px; margin-top: 70px; } .join-sec3 h3 { color: #ffffff; font-size: 30px; margin-bottom: 30px; } .join-sec3 p { color: #ffffff; font-size: 20px; line-height: 30px; max-width: 1100px; } .join-sec4 { box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); margin-top: 70px; padding: 20px 70px; margin-bottom: 70px; } .join-sec4 .left { width: 80%; } .join-sec4 .text { display: flex; justify-content: space-between; max-width: 910px; } .join-sec4 .text span { color: #888888; font-size: 14px; display: inline-block; } .join-sec4 .tit { margin-bottom: 30px; } .join-sec4 .tit strong { color: #333333; font-size: 26px; transition: all 0.6s; } .join-sec4 .tit b { color: #888888; font-size: 16px; display: inline-block; margin-left: 35px; } .join-sec4 .div2 p { color: #666666; font-size: 14px; line-height: 34px; margin-top: 20px; } .join-sec4 .div2 { padding-top: 30px; display: none; } .join-sec4 li { border-bottom: 1px solid #eeeeee; position: relative; cursor: pointer; padding: 50px 0; } .join-sec4 li .btn { display: block; position: absolute; top: 50%; right: 10px; width: 30px; transform: translateY(-50%); height: 30px; background: url(../images/jia.png) no-repeat center; cursor: pointer; } .join-sec4 li.on .btn { background-image: url(../images/jian.png); top: 50px; transform: none; } .join-sec4 li:last-child { border-bottom: none; } .join-sec4 li:hover .tit strong { color: #E62129; } /* 浜у搧涓績 */ .cpzxbanner { overflow: hidden; /* margin-top: 80px;*/ } .cpzxbanner img { display: block; width: 100%; } .cpzx-page ul { padding: 0 80px; } .cpzx-page li { border: 1px solid #eee; margin-bottom: 50px; transition: all 0.6s; } .cpzx-page li a { display: flex; transition: all 0.6s; position: relative; } .cpzx-page li a::before { position: absolute; bottom: 0; background: #E62129; height: 10px; width: 100%; transition: all 0.6s; content: ''; display: block; transform: scale(0, 1); transform-origin: center } .cpzx-page li:nth-child(2n) .item-text { order: 2; } .cpzx-page li:nth-child(2n) .item-img { order: 3; } .cpzx-page li .item-img { width: 50%; } .cpzx-page li .item-text { width: 50%; position: relative; padding: 50px 70px 90px 70px; } .cpzx-page li .item-img { overflow: hidden; display: flex; align-items: center; justify-content: center; } .cpzx-page li .item-img img { display: block; height: 100%; transition: all 0.6s; object-fit: cover; width: 100%; } .cpzx-page li span { display: block; width: 14px; height: 4px; background-color: #eeeeee; margin: 30px 0 30px 0; } .cpzx-page .item-text h3 { color: #e62129; font-size: 24px; line-height: 30px; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cpzx-page .item-text p { color: #555; font-size: 14px; line-height: 30px; height: 120px; overflow: hidden; } .cpzx-page li strong { width: 150px; height: 50px; background-color: #999999; color: #ffffff; font-size: 16px; line-height: 50px; text-align: center; position: absolute; bottom: 70px; left: 70px; display: block; z-index: 2; transition: all 0.6s; } .cpzx-page li:hover { box-shadow: 0px 5px 29px 0px rgba(3, 0, 0, 0.18); } .cpzx-page li:hover a::before { transform: scale(1, 1); } .cpzx-page li strong::before { position: absolute; left: 0px; top: 0; width: 100%; height: 100%; display: block; content: ''; transform: scaleX(0); transform-origin: right 50%; transition-property: transform; transition-duration: 380ms; bottom: 0px; background-color: #E62129; z-index: -1; } .cpzx-page li:hover strong::before { transform: scaleX(1); transform-origin: left 50%; } /* 浜у搧涓績璇︽儏 */ .cpzxde-sec1 { display: flex; justify-content: space-between; padding: 80px; position: relative; } .cpzxde-sec1 .left { width: 50%; } .cpzxde-sec1 .tit h4 { font-size: 36px; color: #000; margin-bottom: 165px; display: block; } .cpzxde-sec1 .tit h3 { color: #e62129; font-size: 50px; margin: 0 0 50px 0; display: block; } .cpzxde-sec1 .tit span { display: inline-block; width: 110px; height: 2px; background: #E62129; vertical-align: middle; } .cpzxde-sec1 .tit b { display: inline-block; border-radius: 100%; width: 10px; height: 10px; background: #E62129; vertical-align: middle; transition: all 0.6s; transform: translateY(-100%); animation: gun 3s infinite linear alternate-reverse; } .cpzxde-sec1 .left .info { color: #333333; font-size: 16px; line-height: 40px; overflow-y: scroll; padding-right: 25px; /*overflow: hidden; */ height: 200px; } .cpzxde-sec1 .left .info::-webkit-scrollbar {/*婊氬姩鏉℃暣浣撴牱寮?/ /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ width: 3px;} .cpzxde-sec1 .left .info::-webkit-scrollbar-thumb {/*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/border-radius: 3px; background: #e62129; width: 3px; } .cpzxde-sec1 .left .info::-webkit-scrollbar-track {/*婊氬姩鏉¢噷闈㈣建閬?/border-radius: 3px; background: #f2f5f9; width: 3px; } .cpzxde-sec1 .right { width: 45%; align-self: flex-end; } .cpzxde-sec1 .right img { display: block; border-radius: 10px; display: block; width: 100%; } .cpzxde-page .cptit h3 { color: #000000; font-size: 30px; font-weight: bold; margin: 30px 0 30px 0; } .cpzxde-page .cptit i { display: inline-block; width: 6px; height: 28px; background-color: #e62129; transform: skew(0, -10deg) rotate(10deg); margin-right: 5px; vertical-align: -2px; animation: 1s opa linear alternate-reverse infinite; transform-origin: left top; } .cpzxde-sec1 .cptit i:last-child { animation-delay: 0.5s; margin-right: 10px; } .cpzxde-sec1 .bg { position: absolute; background: #fce8e9; height: 400px; right: 0; left: 0; bottom: 0; z-index: -1; } .cpzxde-sec1 .item-img { display: block; justify-content: center; align-items: center; border-radius: 10px; } .cpzxde-sec1 .item-img img { display: block; object-fit: cover; } .cpzxde-sec2 { padding: 80px 80px 0px 80px; position: relative; margin-bottom: 70px; } .cpzxde-sec2 .bg { position: absolute; right: 0; left: 0; bottom: 0px; z-index: -1; } .cpzxde-sec2 .bg img { display: block; width: 100%; } .cpzxde-sec2 .swiper-slide a { background-color: #ffffff; box-shadow: 0px 0px 10px 0px rgba(230, 33, 41, 0.24); display: block; height: 289px; padding: 50px; transition: all 0.6s; } .cpzxde-sec2 .div1 { width: 97px; height: 97px; background-color: #e62129; border-radius: 100%; display: flex; align-items: center; justify-content: center; text-align: center; margin: 0 auto; position: absolute; top: -50px; left: 50%; transform: translateX(-50%); transition: all 0.6s; } .cpzxde-sec2 .div1 b { display: block; border: 2px dashed #fff; border-radius: 100%; top: 5px; left: 5px; right: 5px; bottom: 5px; position: absolute; z-index: 333; } .cpzxde-sec2 .div1 span { display: block; border: 5px solid #f8c0c3; border-radius: 100%; top: 5px; left: 5px; right: 5px; bottom: 5px; position: absolute; transition: all 0.6s; transform: scale(0); } .cpzxde-sec2 .div2 h3 { color: #000000; font-size: 24px; text-align: center; margin: 30px 0; transition: all 0.6s; } .cpzxde-sec2 .div2 p { color: #000; font-size: 18px; text-align: center; line-height: 44px; } /*display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;*/ .cpzxde-sec2 .swiper-container { padding: 50px 30px 15px 30px; margin: 0 -30px 0 -30px; } .cpzxde-sec2 .swiper-slide-prev1, .cpzxde-sec2 .swiper-slide-next1 { width: 60px; height: 60px; background-color: #e62129; border-radius: 100%; text-align: center; display: flex; align-items: center; justify-content: center; margin: 0 7px; opacity: 0.2; transition: all 0.6s; cursor: pointer; } .cpzxde-sec2 .controldiv { display: flex; justify-content: center; padding: 50px 0; } .cpzxde-sec2 .controldiv>div:hover { opacity: 1; } .cpzxde-sec2 .swiper-slide:hover .div1 b { animation: ro 10s infinite linear; } .cpzxde-sec2 .swiper-slide:hover .div1 { box-shadow: 0px 0px 10px 0px rgba(230, 33, 41, 0.24); } .cpzxde-sec2 .swiper-slide:hover .div1 img { animation: jello 1s; } .cpzxde-sec2 .swiper-slide:hover .div2 h3 { color: #E62129; } .cpzxde-sec3 { padding: 0 80px; } .cpzxde-sec3 .backbtn { width: 133px; height: 36px; background-color: #ffffff; box-shadow: 0px 5px 5px 0px rgba(230, 33, 41, 0.3); border-radius: 18px; display: block; text-align: center; line-height: 36px; transition: all 0.6s; flex-shrink: 0; margin: 0 10px; color: #E62129; } .cpzxde-sec3 .backbtn:hover { box-shadow: 0 0 15px 5px rgba(230, 33, 41, 0.3); background: #E62129; color: #fff; } .cpzxde-sec3 .fenpian { padding: 0; position: relative; } .cpzxde-sec3 .fenpian>div { display: block; width: 40%; } /* 鍙戝睍鍘嗙▼ */ .fzlc-sec1 .tit { margin-bottom: 100px; } .fzlc-sec1 .tit h3 { color: #000000; font-size: 30px; text-align: center; font-weight: bold; } .fzlc-ul { display: flex; flex-wrap: wrap; position: relative; } .fzlc-ul::before { position: absolute; content: ''; display: block; width: 20px; height: 20px; background-color: #e62129; border: solid 1px #e62129; top: -60px; left: 50%; border-radius: 100%; margin-left: -12px; z-index: 2; } .fzlc-ul::after { width: 1px; height: 60px; background: #ddd; left: 50%; position: absolute; display: block; content: ''; top: -60px; z-index: 0; margin-left: -1px; } .fzlc-ul li { width: 50%; border-right: 1px solid #ddd; transition: all 0.6s; } .fzlc-ul li a { display: flex; position: relative; align-items: center; } .fzlc-ul .item-img img { width: 150px; height: 150px; background-color: #e62129; border-radius: 100%; transition: all 0.6s; } .fzlc-ul .item-text { padding-right: 50px; padding-left: 20px; box-sizing: content-box; } .fzlc-ul li p { color: #666666; font-size: 16px; line-height: 35px; text-align: right; /*display: -webkit-box;*/ /*-webkit-line-clamp: 3;*/ /*overflow: hidden;*/ /*text-overflow: ellipsis;*/ /*-webkit-box-orient: vertical;*/ } .fzlc-ul li span { color: #e62129; font-size: 30px; font-family: symbol; } .fzlc-ul li .nian b { color: #e62129; font-size: 18px; align-self: flex-end; display: inline-block; margin-left: 5px; } .fzlc-ul li .nian { text-align: left; display: flex; justify-content: flex-end; margin-bottom: 10px; } .fzlc-ul li:nth-child(2n) { margin-top: 150px; border-right: none; } .fzlc-ul li:nth-child(2n) .item-img { order: 1; } .fzlc-ul li:nth-child(2n) p { text-align: left; } .fzlc-ul li:nth-child(2n) .nian { justify-content: flex-start; } .fzlc-ul li .line { position: absolute; width: 17px; height: 17px; background-color: #ffffff; border: solid 1px #e62129; border-radius: 100%; right: -8px; top: 0px; text-align: center; transition: all 0.6s; } .fzlc-ul li:nth-child(2n) .line { left: -8px; right: auto; } .fzlc-ul li .line b { width: 9px; height: 9px; background-color: #e62129; border-radius: 100%; display: inline-block; transition: all 0.6s; } .fzlc-ul li:nth-child(2n) .item-text { padding-right: 0; padding-left: 50px; padding-right: 20px; } .fzlc-ul li:hover .line { animation: bian 0.5s infinite alternate-reverse linear; box-shadow: 0 0 10px 5px rgba(230, 33, 41, 0.24); } .fzlc-ul li:hover line b { transform: scale(0.9); } .fzlc-ul li:hover .item-img img { border-radius: 30% 0 50% 0; } .fzlc-sec1 .fzlcmore { color: #888888; font-size: 18px; text-align: center; display: block; padding: 20px 0; transition: all 0.6s; } .fzlc-sec1 .fzlcmore:hover { letter-spacing: 2px; color: #E62129; } @keyframes bian { from { transform: scale(0.9); } to { transform: scale(1.1); } } /* 鑽h獕璧勮川 */ .fzlc-sec1 { padding-bottom: 70px; } .ryzz-ul { display: flex; flex-wrap: wrap; margin-left: -25px; margin-right: -25px; } .ryzz-ul li { width: calc(100%/3 - 50px); margin-left: 25px; margin-right: 25px; margin-bottom: 30px; } .ryzz-ul li .item-img { border: solid 1px #dddddd; padding: 20px; transition: all 0.6s; } .ryzz-ul li img { display: block; width: 100%; } .ryzz-ul li p { text-align: center; color: #555555; font-size: 16px; margin: 20px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 0.6s; } .ryzz-ul li:hover .item-img { box-shadow: 1px 5px 35px 0px rgba(230, 33, 41, 0.29); } .ryzz-ul li:hover p { color: #E62129; } /* 瀹㈡埛妗堜緥 */ .khal-ul { display: flex; flex-wrap: wrap; margin-left: -50px; margin-right: -50px; justify-content: space-between; } .khal-ul li { width: calc(100%/2 - 100px); margin-left: 50px; margin-right: 50px; margin-bottom: 30px; } .khal-ul li .item-img { position: relative; } .khal-ul li .item-img>img { display: block; width: 100%; transition: all 0.6s; } .khal-ul li .whitelogo { position: absolute; bottom: 0; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: center; } .khal-ul li .whitelogo img { position: relative; z-index: 33; transform: scale(1, 0); transition: all 0.6s; transition-delay: 0.3s; opacity: 0; } .khal-ul li .item-img::before { position: absolute; content: ''; display: block; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to top, #e62129, transparent); z-index: 33; transition: all 0.6s; transform: scale(1, 0); transform-origin: bottom center; opacity: 0; } .khal-ul li:hover .item-img::before { transform: scale(1); opacity: 1; } .khal-ul li p { color: #333333; font-size: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 30px 0; text-align: left; transition: all 0.6s; } .khal-ul li:hover .whitelogo img { transform: scale(1); opacity: 1; } .khal-ul li:hover p { color: #E62129; letter-spacing: 2px; } /* 鏈嶅姟鏀寔 */ .fwzc-sec1 { display: flex; position: relative; background: url(../images/fwzxtuline.png) no-repeat right top; background-size: cover; padding-bottom: 50px; } .fwzc-sec1 .left { max-width: 715px; padding: 130px 0; } .fwzc-sec1 h3 { color: #000; font-size: 40px; font-weight: bold; margin-bottom: 50px; } .fwzc-sec1 .div1 { margin-bottom: 50px; } .fwzc-sec1 .div1 p { color: #666; font-size: 18px; line-height: 40px; } .fwzc-sec1 .div1 p span { color: #E62129; } .fwzc-sec1 .div2 p { color: #333333; font-size: 18px; background: url(../images/blacktel.png) no-repeat left 10px; padding-left: 40px; line-height: 40px; display: -webkit-box; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; } .fwzc-sec2 { background: url(../images/fwzcbg1.png) no-repeat center; background-size: cover; padding: 65px 0; } .fwzc-sec2 ul { display: flex; margin-left: -30px; margin-right: -30px; } .fwzc-sec2 li { width: calc(100%/3 - 60px); margin-left: 30px; margin-right: 30px; transition: all 0.6s; } .fwzc-sec2 li .item-text { background: #fff; padding: 30px; transition: all 0.6s; height: 250px; } .fwzc-sec2 li h3 { color: #000000; font-size: 24px; font-weight: bold; transition: all 0.6s; } .fwzc-sec2 li p { color: #555555; font-size: 15px; line-height: 30px; transition: all 0.6s; } .fwzc-sec2 li span { width: 20px; height: 2px; background-color: #e0e0e0; display: block; transition: all 0.6s; margin: 20px 0; } .fwzc-sec2 .item-img { display: block; overflow: hidden; } .fwzc-sec2 .item-img img { display: block; width: 100%; height: auto; transition: all 1.6s; overflow: hidden; } .fwzc-sec2 li:hover .item-text h3, .fwzc-sec2 li:hover .item-text p { color: #fff; } .fwzc-sec2 li:hover .item-text span { background: #fff; } .fwzc-sec2 li:hover .item-text { background: #E62129; } .fwzc-sec2 li:hover .item-img img { transform: scale(1.1); } .fwzc-sec3 { padding: 150px 0; position: relative; } .fwzc-sec3 .left h3 { color: #333333; font-size: 40px; line-height: 91px; max-width: 440px; position: relative; z-index: 33; } .fwzc-sec3 .left h3 b { color: #E62129; font-size: 60px; } .fwzc-sec3 .div1 { display: flex; flex-wrap: wrap; max-width: 640px; margin-left: -10px; margin-right: -10px; padding-top: 400px; z-index: 33; position: relative; } .fwzc-sec3 .div1 a { width: 200px; height: 60px; background-color: #f5f5f5; border-radius: 10px; color: #333333; font-size: 18px; display: block; text-align: center; line-height: 60px; margin-bottom: 20px; width: calc(100%/3 - 20px); margin-left: 10px; margin-right: 10px; transition: all 1.2s; } .fwzc-sec3 .div1 a:hover { background: #E62129; box-shadow: 1px 5px 35px 0px rgba(230, 33, 41, 0.29); color: #fff; letter-spacing: 1px; } .fwzc-sec3 .div1 a:nth-child(7),.fwzc-sec3 .div1 a:nth-child(8){ width: calc(100%/2 - 20px);} .fwzc-sec3 .map { position: absolute; right: 0; top: 150px; width: 56vw; } .fwzc-sec3 .map img { display: block; max-width: 100%; height: auto; } .fwzc-sec4 { /* background: url(../images/letter.png) no-repeat top center; */ background-size: 100%; display: flex; padding: 70px 130px 70px 90px; justify-content: space-between; margin-bottom: 20px; position: relative; } .fwzc-sec4::before { position: absolute; left: 0; top: 0; bottom: 0; background: url(../images/xinleft.png) no-repeat top center; content: ''; display: block; width: 13px; background-size: cover; } .fwzc-sec4::after { position: absolute; left: 0; top: 0; right: 0; background: url(../images/xintop.png) no-repeat top center; content: ''; display: block; height: 13px; background-size: cover; } .fwzc-sec4 ul::before { position: absolute; right: 0; top: 0; bottom: 0; background: url(../images/xinleft.png) no-repeat top center; content: ''; display: block; width: 13px; background-size: cover; } .fwzc-sec4 ul::after { position: absolute; left: 0; bottom: 0; right: 0; background: url(../images/xintop.png) no-repeat top center; content: ''; display: block; height: 13px; background-size: cover; } .fwzc-sec4 .div1 { width: 30%; } .fwzc-sec4 h3 { color: #333333; font-size: 40px; font-family: "DIN"; line-height: 50px; } .fwzc-sec4 h4 { color: #333333; font-size: 24px; margin-top: 30px; } .fwzc-sec4 .div2 { max-width: 1000px; width: 70%; } .fwzc-sec4 ul { display: flex; flex-wrap: wrap; } .fwzc-sec4 ul li { width: 33.33%; padding-right: 60px; } .fwzc-sec4 ul li:nth-child(3) { padding-right: 0; } .fwzc-sec4 ul li:nth-child(4) { width: 100%; padding-right: 0; margin: 40px 0; } .fwzc-sec4 li span { display: block; color: #000000; font-size: 18px; margin-bottom: 20px; } .fwzc-sec4 li input { background-color: #f9f9f9; height: 50px; width: 100%; padding-left: 15px; transition: all 0.6s; border: 1px solid transparent } .fwzc-sec4 li textarea { background: #F9F9F9; width: 100%; resize: none; height: 200px; padding: 15px; font-size: 14px; transition: all 0.6s; border: 1px solid transparent; } .fwzc-sec4 li button { width: 205px; height: 50px; background-color: #e62129; color: #fff; font-size: 18px; transition: all 0.6s; cursor: pointer; float: right; } .fwzc-sec4 li:last-child { width: 100%; padding: 0; } .fwzc-sec4 li button:hover { box-shadow: 1px 5px 35px 0px rgba(230, 33, 41, 0.29); letter-spacing: 2px; border-radius: 5px; } .fwzc-sec4 li:hover input, .fwzc-sec4 li:hover textarea { border: 1px solid #e62129 } .xiantiao { width: 100%; height: 100%; position: fixed; z-index: -1; top: 0; left: 0; } /* 鍏充簬鎴戜滑 */ .about-sec1 { background: url(../images/aboutbg1.png) no-repeat right bottom; padding-top: 50px; } .about-sec1 .maincont { display: flex; justify-content: space-between; } .about-sec1 .left { width: 34%; height: 100%; overflow: hidden; } .about-sec1 .left img { display: block; margin-top: 80px; overflow: hidden; object-fit: cover; min-height: 200px; } .about-sec1 .left .tit div { display: flex; flex-direction: column; align-items: center; } .about-sec1 .left .tit div { display: flex; flex-direction: column; align-items: center; } .about-sec1 .left .tit div { display: flex; flex-direction: column; align-items: center; } .about-sec1 .left h3 { color: #aaaaaa; font-size: 18px; } .about-sec1 .left h3 b { width: 80px; height: 1px; display: inline-block; background: #e62129; vertical-align: middle; margin-right: 40px; } .about-sec1 .left h2 { color: #000000; font-size: 46px; width: 100%; text-align: center; padding-left: 115px; margin-top: 30px; } .about-sec1 .right { width: 66%; padding-left: 80px; } .about-sec1 .right h4 { color: #000000; font-size: 40px; margin-bottom: 50px; } .about-sec1 .right p { color: #666666; font-size: 16px; line-height: 40px; margin-bottom: 0px !important; text-indent: 0rem !important; } .about-sec1 .right p:last-child { margin-bottom: 0; } .about-num { background: url(../images/aboutbg2.png) no-repeat top center; display: flex; height: 200px; align-items: center; justify-content: space-around; margin-top: 80px; background-size: cover; } .about-num li {} .about-num .p1 { color: #ffffff; font-size: 18px; margin-bottom: 25px; } .about-num strong { color: #ffffff; font-size: 42px; font-family: 'DIN'; display: inline-block; margin-right: 5px; } .about-num b { color: #ffffff; font-size: 18px; } .about-sec2 { padding: 60px 0; } .about-sec2 .maincont { position: relative; background: url(../images/qiu.png) no-repeat center; padding: 280px 180px; margin-top: 120px; } .about-tit h3 { color: #aaaaaa; font-size: 18px; text-align: center; font-weight: normal; margin-bottom: 15px; font-weight: lighter; } .about-tit h2 { color: #000000; font-size: 42px; text-align: center; } .about-sec2 li { width: 435px; position: absolute; } .about-sec2 li strong { color: #e62129; font-size: 24px; font-weight: bold; display: block; text-align: right; } .about-sec2 li span { color: #555; font-size: 18px; font-weight: bold; text-align: center; display: block; text-align: right; margin: 8px 0; line-height: 26px; } .about-sec2 li p { color: #333333; font-size: 15px; text-align: right; } .about-sec2 li:nth-child(2n) span, .about-sec2 li:nth-child(2n) strong, .about-sec2 li:nth-child(2n) p { text-align: left; } .about-sec2 li:nth-child(1) { left: -90px; top: -10px; } .about-sec2 li:nth-child(2) { right: -90px; top: -10px; } .about-sec2 li:nth-child(3) { left: -90px; bottom: -25px; } .about-sec2 li:nth-child(4) { right: -90px; bottom: -25px; } .about-sec2 .mapgun { bottom: 0px; background: url('../images/mpbig.png'); background-position: 0 0; animation: moveLeft 25s linear infinite reverse; position: absolute; width: 460px; height: 460px; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 100%; } .about-sec2 .mapgun:hover { animation-play-state: paused; } .about-sec3,.about-sec3-special { background: #f8f8f8; padding: 55px 5rem 55px 5rem; margin-top: 60px; } .about-sec3 .tit h2 { font-size: 30px; color: #E62129; } .about-sec3 .tit h3 { font-size: 26px; color: #E62129; margin-top: 20px; } .about-sec3 .prev { width: 60px; height: 60px; background-color: #e62129; opacity: 0.2; border-radius: 100%; display: flex; align-items: center; justify-content: center; transition: all 0.6s; } .about-sec3 .next { width: 60px; height: 60px; background-color: #e62129; opacity: 0.2; border-radius: 100%; display: flex; align-items: center; justify-content: center; transition: all 0.6s; margin-left: 10px; } .about-sec3 .condiv { display: flex; margin-top: -70px; position: relative; z-index: 333; } .about-sec3 .condiv>div:focus { outline: none; cursor: pointer; } .about-sec3 .condiv>div:hover { cursor: pointer; opacity: 1; } .about-sec3 .swiper-slide h2 { color: #000000; font-size: 34px; font-weight: bold; margin-bottom: 45px; } .about-sec3 .swiper-slide p { color: #000000; font-size: 18px; line-height: 40px; background: url(../images/duihao.png) no-repeat left 10px; padding-left: 30px; } .about-sec3 .maincont { display: flex; margin-top: 30px; justify-content: space-between; position: relative; } .about-sec3 .swiper-container1 { width: 50%; margin-top: 60px; flex-shrink: 0; margin-right: 15px; } .about-sec3 .swiper-slide img { display: block; width: 100%; height: auto; border-radius: 5px; } .about-sec3 .swiper-container2 { flex-grow: 1; } .about-sec4 { padding: 55px 0; overflow: hidden; } .about-sec4 .swiper-container { margin-top: 55px; } .about-sec4 .swiper-slide img { display: block; width: 100%; height: auto; } .about-sec5 .swiper-container { margin: 55px 0; } .about-sec5 .swiper-container p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #333333; font-size: 18px; line-height: 70px; transition: all 0.6s; } .about-sec5 .item-img { display: block; width: 100%; overflow: hidden; } .about-sec5 img { display: block; width: 100%; transition: all 1.6s; } .about-sec5 .swiper-slide:hover img { transform: scale(1.05); } .about-sec5 .swiper-slide:hover p { background: #E62129; color: #fff; padding-left: 5px; } /* 鑱旂郴鎴戜滑 */ .contactbg { background: #f3f3f3; padding: 0 80px 80px 80px; position: relative; } .contactpage { box-shadow: 3px 4px 32px 0px rgba(226, 226, 226, 0.75); background: #fff; position: relative; z-index: 3; } .contact-sec1 ul { display: flex; justify-content: space-between; } .contact-sec1 li { width: 50%; position: relative; transition: all 1s; border-bottom: 1px solid #e2e2e2; } .contact-sec1 li .text { padding: 50px 110px; z-index: 332; position: relative; } .contact-sec1 li:nth-child(1) { border-right: 1px solid #e2e2e2; } .contact-sec1 h3 { font-family: '寰蒋闆呴粦'; font-size: 44px; color: #333333; margin: 15px 0 10px 0; } .contact-sec1 p { color: #000000; font-size: 16px; } .contact-sec1 .libg { top: 0; left: 0; bottom: 1px; width: 100%; background: url(../images/contactline.jpg) repeat-x; width: 0; z-index: 33; border-bottom: 2px solid #E62129; box-shadow: 0 3px 1px rgba(0, 0, 0, .1); transition: all 1s; position: absolute; } .contact-sec1 li:hover .libg { width: 100%; } .contact-sec2 { padding: 80px 110px; border-bottom: 1px solid #E2E2E2; } .contact-sec2 ul { display: flex; justify-content: space-between; } .contact-sec2 li { position: relative; transition: all 1s; display: flex; align-items: center; align-content: center; } .contact-sec2 li p { color: #000; font-size: 18px; padding-left: 20px; } .contact-sec2 li:hover img { animation: jello 1s; } .contact-sec3 { padding: 80px 110px; position: relative; overflow: hidden; z-index: 3; display: flex; justify-content: space-between; } .contact-sec3 .left { max-width: 680px; width: 50%; padding-right: 50px; } .contact-sec3 h2 { color: #333333; font-size: 29px; } .contact-sec3 h3 { color: #333333; font-size: 44px; font-family: 'DIN'; margin-top: 15px; } .contact-sec3 label { display: flex; border-bottom: 1px solid #ddd; align-items: center; padding: 60px 0 20px 0; position: relative; } .contact-sec3 label img { display: block; flex-shrink: 0; width: 20px; margin-right: 10px; } .contact-sec3 label input { flex-grow: 1; font-size: 16px; color: #333; } .contact-sec3 input::-webkit-input-placeholder { color: #aaaaaa; font-size: 16px; } .contact-sec3 input:-moz-placeholder { color: #aaaaaa; font-size: 16px; } .contact-sec3 input::-moz-placeholder { color: #aaaaaa; font-size: 16px; } .contact-sec3 input:-ms-input-placeholder { color: #aaaaaa; font-size: 16px; } .contact-sec3 .skew { width: 399px; height: 76px; background-color: #e62129; transform: skew(-10deg); display: flex; align-items: center; justify-content: center; margin-top: 80px; transition: all .6s; cursor: pointer; } .contact-sec3 button { font-size: 24px; color: #fff; transform: skew(10deg); display: block; width: 100%; transition: all 0.6s; } .contact-sec3 .skew:hover { box-shadow: 0 0 20px 5px rgba(230, 33, 41, 0.35); transform: translateX(10px); } .contact-sec3 .skew:hover button { transform: none; } .contact-sec3 label i { position: absolute; bottom: 0; left: 0; right: 0; width: 0%; height: 1px; background: #E62129; transition: all 0.6s; z-index: 33; display: block; content: ''; } .contact-sec3 input:focus+i { width: 100%; } .contact-sec3 .mapbox { width: 50%; height: ; /* border-radius: 50%; */ z-index: 33; } .contact-sec3 .mapbox img { display: inline; max-width: none; max-height: inherit; } /* .contact-sec3 .mapbox div{ position: relative;} */ .contactbg .mapbg { position: absolute; right: -7.8vw; display: none; bottom: -18.3vw; width: 56.646vw; height: 56.646vw; background: #e62129; border-radius: 50%; transform: translate(-1.07rem, -1.1rem); -webkit-transform: translate(-1.07rem, -1.1rem); z-index: 0; box-sizing: content-box; } .contact-sec3 .css_animation { height: 104px; width: 104px; border-radius: 50%; background: rgba(250, 0, 0, 0.75); transform: scale(0.6); animation: myfirst 1.5s infinite; } .contact-sec3 .BMap_mask+div>div:nth-of-type(4) { z-index: 0 !important; } .cpzxde-page .cptit i:last-child { animation-delay: 0.5s; } .fzlc-ul .item-text { flex-grow: 1; } .xwzxdetail-page1 { padding-top: 50px; } .xwzx-ul .item-text .p2-1 { display: none; } .neibanner img { display: block; height: auto; width: 100%; } .swiper-wrapper-special .swiper-slide{ display: flex; align-items: center; width: 100%!important; } .caseBannerword{ position: absolute; left: 7%; } .caseBannerword_top{ background: url('../images/tri1.png'); background-repeat: no-repeat; width: 233px; height:53px; font-size: 25px; font-weight: bold; letter-spacing: 5px; line-height: 53px; margin-bottom: 40px; text-align: center; color: rgb(246,246,246); background-size: 100% 100%; } .caseBannerword_bottom{ padding: 30px 200px 30px 30px; background: rgba(255,255,255,0.2); } .caseBannerword_bottom p{ color: rgb(246,246,246); font-size: 23px; font-weight: bold; letter-spacing: 2px; margin-bottom:20px; } @-webkit-keyframes myfirst { to { transform: scale(1.05); background: rgba(0, 0, 0, 0); } } @keyframes myfirst { to { transform: scale(1.05); background: rgba(0, 0, 0, 0); } } @media (max-width:1900px) { .join-sec1 .left { padding: 0 3rem; } .join-sec1 .line1 { right: 2rem; top: 2rem; } .join-sec1 .line2 { left: 2rem; top: 15rem; } .join-sec1 .left h4, .join-sec1 .left h2 { font-size: 34px; } .join-sec1 .left p { font-size: 20px; line-height: 40px; } .join-sec1 .arrow { bottom: 2rem; right: 2rem; } .cpzx-page li .item-text { padding: 50px; } .cpzx-page li span { margin: 30px 0; } .cpzx-page li strong { left: 50px; bottom: 50px; } .cpzxde-sec1 .tit h3 { font-size: 46px; margin-bottom: 40px; } .cpzxde-sec1 .tit h4 { font-size: 30px; margin-bottom: 100px; } .cpzxde-page .cptit h3 { font-size: 26px } .cpzxde-sec2 .swiper-slide a { padding: 30px; } .cpzxde-sec2 .div2 h3 { margin-top: 50px; } .cpzxde-sec2 .div2 p { font-size: 16px; line-height: 40px; } .khal-ul { margin-left: -25px; margin-right: -25px; } .khal-ul li { width: calc(100%/2 - 50px); margin-left: 25px; margin-right: 25px; margin-bottom: 30px; } .khal-ul li p { font-size: 20px; margin: 10px 0; } .khal-ul li .whitelogo img { width: 250px; } .fwzc-sec4 li textarea { height: 120px; } .contact-sec2, .contact-sec1 li .text { padding: 40px 50px; } .contact-sec2 li p { font-size: 16px; padding-left: 15px; } .contact-sec1 h3 { font-size: 40px; margin-top: 25px; } .contact-sec3 .left { width: 50%; } .BMap_mask { width: 800px !important; height: 800px !important; } .contactbg .mapbg { right: -10.8vw; width: 53.646vw; height: 52vw; bottom: -14.3vw; } } @media (max-width:1600px) { .index-sec1 .leftcont { padding: 3rem; } .index-sec1 .timeline { padding: 60px 2rem 40px 2rem; } .newtop .div1 { padding: 15px 50px; } .timeline strong { font-size: 40px } .timeline span { font-size: 16px } .index-sec1 .div1left i { margin: 40px 0; } .index-sec2 .item-text { padding: 4rem 3rem; max-height: 450px; } .index-sec2 .item-text p { display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; } .index-sec2 .rightcont h3 { padding: 3rem 0; font-size: 24px } .index-sec2 .item-num { left: 3rem; bottom: 3rem; } .index-sec2 .item-text h3 { font-size: 24px } .index-sec3, .index-sec4, .footer { padding: 3.5rem 3rem; } .index-sec3 ul { margin-left: -15px; margin-right: -15px; } .index-sec3 li { width: calc(100%/3 - 30px); margin-left: 15px; margin-right: 15px; } .index-sec3 .item-text p { font-size: 16px } .index-sec4 .item-text .p2 { font-size: 18px } .index-sec4 .item-text .p1, .index-sec4 .item-text .p3 { font-size: 14px; } .index-sec4 .item-text .p1 { margin: 15px 0; } .index-sec4 .item-text .p3 { margin: 25px 0; } .index-sec4 .tit h4 { margin-bottom: 80px; font-size: 16px } .index-sec4 #tab2 a.active { font-size: 26px } .index-sec4 #tab2 a { font-size: 18px } .index-sec4 .tit h3 { font-size: 34px } .footer .rightcont { padding-left: 3rem; } .footer .rightcont .p2, .footer .leftcont .p2 a { font-size: 14px; line-height: 40px; } .copyright .right, .copyright .p1 { padding-left: 3rem; padding: 30px 15px; } .padding5rem { padding: 0 3rem; } .pc-neitop { padding-top: 40px !important; padding-bottom: 40px !important; } .breadcrumb a { font-size: 18px; padding: 30px 0; } .breadcrumbwrap { margin-bottom: 50px; } .xwzx-ul .item-text .p2 { font-size: 18px; } .xwzx-ul li { margin-bottom: 20px; } .xwzx-ul .item-text { /* height: 150px; */ padding: 15px 5px; } .xwzx-ul li:hover .item-text { padding: 10px 15px; } .xwzx-ul .item-text .p1, .xwzx-ul .item-text .p3 { font-size: 14px; } .xwzx-ul { margin-left: -15px; margin-right: -15px; } .xwzx-ul li { width: calc(100%/3 - 30px); margin-left: 15px; margin-right: 15px; margin-bottom: 30px; } .showmorebtn { width: 220px; height: 50px; font-size: 16px; line-height: 50px; } .fenpian p { font-size: 16px } .join-sec1 .left { padding: 0 2rem; } .join-sec1 .left h4, .join-sec1 .left h2 { font-size: 30px } .join-sec1 .line2 { top: 12rem; } .join-sec1 .left h5 { font-size: 24px; } .join-sec1 .left p { font-size: 18px } .join-sec1 .arrow { height: 30px; display: block; } .join-sec2 .tit h2 { font-size: 30px; } .join-sec2 .tit h3 { font-size: 18px } .join-sec2 li strong { font-size: 18px; margin: 15px auto; } .join-sec2 li span { width: 70px; height: 70px; line-height: 70px; font-size: 24px } .join-sec2 .tit { margin-top: 50px; } .join-sec3 { padding: 0 50px } .cpzx-page ul { padding: 0 50px; } .cpzx-page .item-text h3 { font-size: 24px } .cpzx-page li .item-text { padding: 40px; } .cpzx-page li span { margin: 20px 0; } .cpzx-page .item-text p { display: -webkit-box; -webkit-line-clamp: 5; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .cpzx-page li strong { width: 150px; height: 50px; line-height: 50px; font-size: 16px } .cpzxde-sec1 { padding: 50px; } .cpzxde-sec2 { padding: 50px 50px 0 50px; } .cpzxde-sec3 { padding: 0 50px; } .cpzxde-sec1 .tit h3 { font-size: 40px; margin-bottom: 20px; } .cpzxde-sec1 .bg { height: 350px; } .cpzxde-sec1 .right img { min-height: 400px; } .ryzz-ul { margin-left: -15px; margin-right: -15px; } .ryzz-ul li { margin-left: 15px; margin-right: 15px; width: calc(100%/3 - 30px); } .fwzc-sec1 h3 { font-size: 36px; margin-bottom: 20px; } .fwzc-sec1 .div1 p, .fwzc-sec1 .div2 p { font-size: 16px; line-height: 35px; } .fwzc-sec1 .left { padding-bottom: 0; padding-top: 80px; max-width: 600px; } .fwzc-sec2 ul { margin-left: -20px; margin-right: -20px; } .fwzc-sec2 li { width: calc(100%/3 - 40px); margin-left: 20px; margin-right: 20px; } .fwzc-sec2 li h3 { font-size: 26px } .fwzc-sec2 li p { font-size: 15px; } .fwzc-sec3 .div1 { padding-top: 300px; } .fwzc-sec3 { padding: 80px 0; } .fwzc-sec3 .left h3 { font-size: 36px; line-height: 1.6; } .fwzc-sec3 .div1 { max-width: 600px; } .fwzc-sec3 .div1 a { height: 50px; line-height: 50px; font-size: 16px; } .fwzc-sec3 .map { top: 80px; } .fwzc-sec4 li span { font-size: 16px; } .fwzc-sec4 ul li:nth-child(4) { margin: 30px 0; } .fwzc-sec4 { padding: 75px 50px; } .about-sec1 .left h2 { margin-top: 10px; } .about-sec1 .left h3 { font-size: 16px } .about-sec1 .right h4, .about-sec1 .left h2 { font-size: 34px } .about-sec1 .right p { font-size: 15px; margin-bottom: 20px; line-height: 36px; } .about-num strong { font-size: 36px } .about-num b, .about-num .p1 { font-size: 16px } .about-sec2 .maincont { background-image: url(../images/qiu2.png); } .about-sec2 li { width: 300px; } .about-sec2 li:nth-child(2) { top: 80px; right: 160px; } .about-sec2 li:nth-child(4) { bottom: 90px; right: 160px; } .about-sec2 li:nth-child(1) { top: 80px; left: 160px; } .about-sec2 li:nth-child(3) { bottom: 90px; left: 160px; } .about-sec2 li span { font-size: 16px } .about-sec2 li strong { font-size: 20px; } .about-sec2 .mapgun { width: 270px; height: 270px; } .about-tit h2 { font-size: 36px } .about-tit h3 { font-size: 16px; } .about-sec3{ padding: 50px 3rem 50px 3rem; margin-top: 0; } .about-sec3 .tit h2 { font-size: 20px; } .about-sec3 .tit h3 { font-size: 24px; margin-top: 10px; } .about-sec3 .swiper-slide h2 { font-size: 28px; margin-bottom: 20px; } .about-sec3 .swiper-slide p { line-height: 34px; background-size: 16px auto; padding-left: 20px; font-size: 16px } .about-sec3 .swiper-container1 { margin-top: 20px; } .about-sec3 .condiv>div { width: 50px; height: 50px; } .about-sec3 .condiv>div img { height: 20px; } .about-sec3 .condiv { margin-top: -30px; } .about-sec4 { padding: 50px 0; } .about-sec5 .swiper-container { margin: 50px 0 20px 0; } .about-sec5 .swiper-container p { font-size: 16px; } .contact-sec3 { padding: 50px 30px; } .contactbg { padding: 0 50px 50px 50px; } .contact-sec3 .skew { width: 300px; height: 60px; margin-top: 50px; } .contact-sec3 button { font-size: 20px; } .contact-sec3 .left { width: 50%; } .contact-sec3 h3 { font-size: 36px; } .contact-sec3 h2 { font-size: 24px; } .pc-top { padding-right: 50px; } .about-sec2 .maincont { margin-top: 60px; } .about-sec1 { padding-top: 0; } } @media (max-width:1460px) { .xwzx-ul li .p2-1 { display: none; } .contactbg .mapbg { right: -12.8vw; width: 53.646vw; height: 52vw; bottom: -13.3vw; } } @media (max-width:1460px) { .fwzc-sec4 { padding: 60px 50px; } .fwzc-sec4 li textarea { height: 100px; } .fwzc-sec4 h3 { font-size: 30px; } .fwzc-sec4 ul li { padding-right: 30px; } .fwzc-sec4 ul li:nth-child(4) { margin: 20px 0; } .about-sec1 .right h4, .about-sec1 .left h2 { font-size: 34px } .about-sec1 .right h4 { margin-bottom: 30px; } .about-sec1 .left img { margin-top: 50px; min-height: 140px; width: 100%; } .about-sec1 .right p { margin-bottom: 15px; line-height: 34px; } .about-sec1 .right { padding-left: 50px; } .about-num { margin-top: 50px; } .contact-sec2, .contact-sec1 li .text { padding: 40px 30px; } .contact-sec1 h3 { font-size: 36px; margin-top: 20px; margin-bottom: 5px; } .contact-sec1 p, .contact-sec2 li p { font-size: 15px; } .contact-sec2 li img { display: block; width: 36px; } .newpcul { width: 70%; } .newtop .pc-tel { display: none; } .about-sec2 li:nth-child(2) { top: 80px; right: 120px; } .about-sec2 li:nth-child(4) { bottom: 90px; right: 120px; } .about-sec2 li:nth-child(1) { top: 80px; left: 120px; } .about-sec2 li:nth-child(3) { bottom: 90px; left: 120px; } } @media (max-width:1300px) { .index-sec2 .rightcont h3 { padding: 2rem 0; line-height: 1.3; font-size: 20px } .index-sec2 .rightcont .swiper-slide { margin-bottom: 25px; } .index-sec2 .item-text { padding: 3rem 2rem; max-height: 350px; } .index-sec2 .item-num { left: 2rem; bottom: 2rem; } .index-sec4 .more { width: 120px; height: 40px; line-height: 40px; font-size: 14px; } /* .breadcrumb{ margin-bottom: 40px;} */ .padding5rem { padding: 0 2rem; } .xwzxde-sec2 { height: 90px; } .xwzxde-sec2 strong { font-size: 30px; width: 100px; } .xwzxde-sec2 div { padding: 20px; } .xwzxde-sec2 div p { font-size: 14px; line-height: 36px; } .xwzxde-sec3 p { font-size: 14px } .xwzxde-sec1 h3 { font-size: 26px; line-height: 1.6; } .join-sec1 .div2 { margin-top: 4rem; } .join-sec1 .line1 { top: 1rem; right: 1rem; } .join-sec1 .line2 { bottom: 1rem; top: auto; left: 1rem; } .join-sec1 .left h4, .join-sec1 .left h2 { font-size: 26px; } .join-sec1 .left p { font-size: 16px; line-height: 32px; } .join-sec1 .left h5 { font-size: 20px; } .join-sec3 h3 { font-size: 24px } .join-sec3 p { font-size: 16px } .join-sec4 { padding: 20px 50px; } .join-sec4 li { padding: 30px 0; } .join-sec4 .tit { margin-bottom: 20px; } .join-sec4 .tit strong { font-size: 20px; } .join-sec4 .tit b { font-size: 14px } .join-sec4 li .btn { background-size: 20px auto; } .join-sec4 .div2 { padding-top: 10px; } .join-sec4 .div2 p { margin-top: 10px; } .join-sec3 { margin-top: 50px; } .join-sec4 { margin: 50px 0; } .cpzx-page .item-text p { -webkit-line-clamp: 4; } .cpzx-page li .item-text { padding: 30px; } .cpzx-page li strong { left: 30px; bottom: 30px; width: 100px; height: 40px; line-height: 40px; font-size: 14px; } .cpzx-page .item-text h3 { font-size: 20px; } .cpzx-page li span { margin: 10px 0; } .cpzx-page li a::before { height: 5px; } .cpzxde-sec2 .div1 { width: 75px; height: 75px; } .cpzxde-sec2 .div1 img { height: 30px; } .cpzxde-sec2 .swiper-slide a { padding: 15px 15px 30px 15px; height: auto; } .cpzxde-sec2 .div2 p { font-size: 14px; line-height: 32px; } .cpzxde-sec2 .div2 h3 { font-size: 18px; margin-top: 30px; margin-bottom: 15px; } .cpzxde-sec2 .bg { display: flex; align-items: center; justify-content: center; } .cpzxde-sec2 .bg img { display: block; width: 100%; height: auto; min-height: 200px; object-fit: cover; } .cpzxde-sec2 .swiper-slide-prev1, .cpzxde-sec2 .swiper-slide-next1 { width: 40px; height: 40px; } .cpzxde-sec2 .controldiv img { display: block; height: 18px; } .fwzc-sec3 .left h3 { font-size: 30px } .fwzc-sec3 .left h3 b { font-size: 50px; } .fwzc-sec4 .div2 { max-width: 700px; width: 75%; } .fwzc-sec4 .div1 { width: 25%; padding-right: 35px; } .fwzc-sec4 li button { width: 180px; font-size: 16px; } .about-sec1 .right h4, .about-sec1 .left h2 { font-size: 24px; } .about-sec1 .right p { /* -webkit-line-clamp: 2; */ margin-bottom: 10px; font-size: 14px; } .about-sec1 .right h4 { margin-bottom: 20px; } .about-sec1 .right { padding-left: 30px; } .about-num { height: 150px; margin-top: 30px; } .about-num strong { font-size: 30px; } .about-num .p1 { margin-bottom: 10px; font-size: 15px; } .about-sec2 li { background: #fff; } .about-sec3 { padding: 50px 2rem 50px 2rem; margin-top: 0; } .about-sec3 .swiper-container1 { max-width: 400px; margin-right: 10px; } .about-sec3 .swiper-slide p { font-size: 14px; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 2; overflow: hidden; } .about-sec3 .condiv { margin-top: 0; } .about-sec3 .condiv>div { width: 40px; height: 40px; } .about-sec3 .swiper-slide h2 { font-size: 20px; } .about-sec3 .tit h2 { font-size: 18px; } .about-sec3 .tit h3 { font-size: 20px } .about-sec3 .swiper-container1 { margin-top: 0; width: 300px; } .about-tit h2 { font-size: 32px } .about-sec5 .swiper-container { margin: 35px 0; } .about-sec5 .swiper-container p { line-height: 50px; font-size: 14px; padding-left: 3px; } .contact-sec3 input::-webkit-input-placeholder { color: #aaaaaa; font-size: 14px; } .contact-sec3 input:-moz-placeholder { color: #aaaaaa; font-size: 14px; } .contact-sec3 input::-moz-placeholder { color: #aaaaaa; font-size: 14px; } .contact-sec3 input:-ms-input-placeholder { color: #aaaaaa; font-size: 14px; } .cpzxde-sec2 .div2 p { min-height: 64px; } .newtop li a { font-size: 15px } .newtop .logo img { height: 40px; } .newpcul { padding: 0 20px; width: 60%; } } @media (max-width:1200px) { .caseBannerword_top{ background: url('../images/tri1.png'); background-repeat: no-repeat; width: 160px; height:35px; font-size: 16px; font-weight: bold; letter-spacing: 5px; line-height: 35px; margin-bottom: 25px; text-align: center; color: rgb(246,246,246); background-size: 100% 100%; } .caseBannerword_bottom{ padding: 15px 170px 15px 20px; background: rgba(255,255,255,0.2); } .caseBannerword_bottom p{ color: rgb(246,246,246); font-size: 14px; font-weight: bold; letter-spacing: 2px; margin-bottom:15px; } .linkicon a { margin: 0 5px; } .pcsidebar .logo img { width: 70px; } .pcul li a::after, .pcul li.on a::after { display: none; } .banner .mouse-tip { width: 25px; height: 40px; border-radius: 15px; border: solid 1px #ffffff; bottom: 20px; } .banner .mouse-tip i { width: 2px; height: 5px; } .banner .imgnum { left: 15px; bottom: 25px; } .banner .imgnum span { font-size: 30px } .banner .swiper-pagination { right: 15px; bottom: 25px; } .banner .swiper-pagination-bullet { margin: 0 5px !important; } .banner { height: auto; overflow: hidden; } .banner .swiper-slide img { width: 100%; height: 100%; min-height: auto; } .index-sec1 .div1left h3 { font-size: 30px; line-height: 50px; } .index-sec1 .div1left h4 { font-size: 18px } .index-sec1 .div1 .more { width: 150px; height: 50px; font-size: 14px; } .index-sec1 .timeline strong { font-size: 34px } .index-sec1 .timeline span { font-size: 15px } .index-sec1 .div1left i { margin: 30px 0; } .index-sec3 .index-title h3 { font-size: 30px; } .index-sec3 #tab a { font-size: 14px; width: 120px; margin: 0 10px; height: 40px; line-height: 40px; } .index-sec3 #tab { margin-top: 30px; } .index-sec3 .item-text p { font-size: 14px } .index-sec4 .tit h4 { margin-bottom: 50px; font-size: 16px } .index-sec4 #tab2 a.active { font-size: 20px } .index-sec4 #tab2 a { font-size: 16px; margin-bottom: 30px; } .index-sec4 .tit h3 { font-size: 26px } .copyright { flex-direction: column; } .copyright .p1 { width: 100%; text-align: center; } .copyright .right { width: 100%; justify-content: center; } .copyright .right, .copyright .p1 { padding: 15px 15px; } .footer .rightcont { padding-left: 30px; } .pc-neitop { padding-top: 30px !important; padding-bottom: 30px !important; } .xwzx-ul .item-text .p2 { font-size: 16px; } .xwzx-ul .item-text .p3, .xwzx-ul .item-text .p1 { font-size: 13px } .xwzx-ul .item-text { /* height: 130px; */ } .xwzx-ul { margin-left: -10px; margin-right: -10px; } .xwzx-ul li { width: calc(100%/3 - 20px); margin-left: 10px; margin-right: 10px; margin-bottom: 30px; } .join-sec2 li:nth-child(2n) { display: none; } .cpzx-page li .item-img { width: 40%; } .cpzx-page li .item-text { width: 60%; padding: 20px; } .cpzx-page li strong { left: 20px; bottom: 20px; } .cpzx-page li { margin-bottom: 30px; } .cpzx-page ul { padding: 0 30px; } .cpzx-page .item-text p { -webkit-line-clamp: 2; } .cpzxde-sec1 .tit h3 { font-size: 34px; } .cpzxde-sec1 .tit h4 { font-size: 24px; margin-bottom: 80px; } .cpzxde-sec1 .right img { min-height: 350px; } .cpzxde-sec1 .left p { font-size: 15px; line-height: 35px; height: auto; } .cpzxde-sec1 .bg { height: 320px; } .cpzxde-page .cptit h3 { font-size: 24px; } .cpzxde-page .cptit i { height: 24px; } .khal-ul { margin-left: -20px; margin-right: -20px; } .khal-ul li { width: calc(100%/2 - 40px); margin-left: 20px; margin-right: 20px; margin-bottom: 20px; } .khal-ul li p { font-size: 16px; margin: 10px 0; } .khal-ul li .whitelogo img { width: 200px; } .fzlc-sec1 { padding-top: 5px } .fzlc-ul .item-img img { width: 100px; height: 100px; } .fzlc-ul li span, .fzlc-sec1 .tit h3 { font-size: 24px; } .fzlc-ul li .nian b { font-size: 14px; } .fzlc-ul li p { font-size: 14px; line-height: 30px; } .fzlc-ul li:nth-child(2n) .item-text { padding-left: 30px; } .fzlc-ul .item-text { padding-right: 30px; } .fwzc-sec2 ul { margin-left: -15px; margin-right: -15px; } .fwzc-sec2 li { width: calc(100%/3 - 30px); margin-left: 15px; margin-right: 15px; } .fwzc-sec2 li h3 { font-size: 20px; } .fwzc-sec2 li .item-text { padding: 15px; } .fwzc-sec2 li .item-text span { margin: 15px 0 10px 0; } .fwzc-sec2 li p { font-size: 14px; line-height: 30px; } .fwzc-sec2 { padding: 45px 0; } .fwzc-sec3 { padding: 50px 0; } .fwzc-sec3 .map { top: 50px; } .fwzc-sec3 .div1 { max-width: 500px; padding-top: 250px; } .xiantiao { display: none; } .about-sec2 .maincont { background-image: url(../images/qiu3.png); } .about-sec2 .mapgun { width: 270px; height: 270px; } .about-tit h2 { font-size: 32px; } .about-sec2 { padding: 50px 0; } .about-sec4 .swiper-container-3d { perspective: none } .contact-sec2, .contact-sec1 li .text { padding: 30px 20px; } .contact-sec1 h3 { font-size: 30px; margin-top: 15px; margin-bottom: 5px; } .contact-sec1 p, .contact-sec2 li p { font-size: 14px; } .contact-sec2 li img { display: block; width: 24px; } .contact-sec2 li p { padding-left: 5px; } .contact-sec1 li img { width: 36px; } .contactbg { padding: 0 30px 50px 30px; } .contact-sec3 h3 { font-size: 30px; margin-top: 5px; } .contact-sec3 h2 { font-size: 20px; } .contact-sec3 label { padding: 30px 0 20px 0; } .contact-sec3 ::-webkit-input-placeholder { /* WebKit browsers */ font-size: 14px; } .contact-sec3 ::-ms-input-placeholder { /* Internet Explorer 10+ */ font-size: 14px; } .contact-sec3 .skew { width: 240px; height: 50px; } .contact-sec3 button { font-size: 16px; } .about-sec2 li:nth-child(2) { top: 50px; right: 20px; } .about-sec2 li:nth-child(4) { bottom: 50px; right: 20px; } .about-sec2 li:nth-child(1) { top: 50px; left: 20px; } .about-sec2 li:nth-child(3) { bottom: 50px; left: 20px; } .about-sec2 .maincont { margin-top: 60px; } .contactbg .mapbg { right: -12.5vw; width: 52vw; height: 50.646vw; bottom: -11.3vw; } } @media (max-width:1000px) { .pcsidebar { display: none; } .container { padding-left: 0; } .mobilebarwrap { display: block; } .pc-top, .newtop { display: none; } .pc-search { width: 90%; } .search-box label { font-size: 16px } .banner { margin-top: 50px; } .index-sec1 .timeline { flex-wrap: wrap; padding: 30px; } .index-sec1 .timeline li { padding: 15px 0; } .index-sec1 .timeline .linetu { display: none; } .index-sec1 .timeline { justify-content: space-between; } .index-sec1 .timeline li { width: 50%; } .index-sec1 .timeline li:nth-child(3), .index-sec1 .timeline li:nth-child(7) { width: auto; } .index-sec2 .rightcont { display: none; } .index-sec2 .leftcont { width: 100%; max-width: 100%; } .index-sec2 .item-text { position: relative; width: 100%; max-width: 100%; padding: 2rem; top: 0; transform: none; } .index-sec2 .item-num { left: auto; right: 1rem; top: 1rem; } .index-sec3 ul { margin-left: -5px; margin-right: -5px; margin-top: 25px; } .index-sec3 li { width: calc(100%/3 - 10px); margin-left: 5px; margin-right: 5px; } .index-sec4 .item-text .p2 { font-size: 15px } .index-sec4 .item-text .p1 { margin: 5px 0; } .index-sec4 .item-text .p3 { margin: 10px 0; } .index-sec4 .item-text .p1, .index-sec4 .item-text .p3 { font-size: 12px } .footer .p2-div p { margin-right: 30px; } .footer .leftcont { /* width: 30%; */ } .footer .rightcont { /* width: 70%; */ /* padding-left: 0; */ } .footer .rightcont img { max-width: 60%; float: right; } .footer .p2-div .code img { width: 100px; height: 100px; } /* .footer .line{ left: 30%;} */ .footer .p2-div { justify-content: space-between; padding-right: 30px; } .footer .p2-div p:nth-child(2) { margin-right: 0; } .footer .leftcont .p1, .footer .rightcont .p1 { margin-bottom: 30px; } .footer { padding-left: 2rem; padding-right: 2rem; } .copyright { flex-direction: column; } .neibanner { margin-top: 50px; } .breadcrumb a { font-size: 16px; padding: 15px 0; } /* .breadcrumb{ margin-bottom: 30px;} */ .showmorebtn { width: 180px; height: 40px; font-size: 14px; line-height: 40px; margin-bottom: 30px; margin-top: 30px; } .xwzxde-sec1 h3 { font-size: 18px; line-height: 1.6; margin-bottom: 10px; } .xwzxde-sec1 { padding-bottom: 20px; } .xwzxde-sec2 { margin: 20px 0; height: 80px; } .xwzxde-sec2 strong { font-size: 22px; width: 80px; } .xwzxde-sec2 div { padding: 10px; } .xwzxde-sec2 div p { line-height: 1.6; } .fenpian p { font-size: 14px; margin-top: 5px; } .fenpian { padding: 25px 0; } .join-sec4 { padding: 30px; } .join-sec4 .left { width: 90%; } .cpzxbanner { margin-top: 50px; } .cpzxde-sec1 { padding: 40px 35px; } .cpzxde-sec2 { padding: 40px 35px 0 35px; } .cpzxde-sec3 { padding: 0 35px; } .fenpian>div { width: 45%; } .cpzxde-sec2 .div1 { width: 60px; height: 60px; top: -30px; } .cpzxde-sec2 .div2 h3 { font-size: 16px } .cpzxde-sec2 .div2 p { font-size: 13px; line-height: 30px; } .cpzxde-sec2 .div1 b { border-width: 1px; } .cpzxde-sec2 .div1 img { height: 24px; } .cpzxde-sec2 .swiper-container { margin-left: -15px; margin-right: -15px; padding: 50px 15px 0 15px; } .ryzz-ul li p { margin: 10px 0; } .ryzz-ul li { margin-bottom: 15px; } .fwzc-sec1 .left { padding-bottom: 30px; } .fwzc-sec1 h3 { font-size: 30px } .fwzc-sec1 .div1 p, .fwzc-sec1 .div2 p { font-size: 15px; } .fwzc-sec1 .left { padding-top: 50px; } .fwzc-sec1 .div1 { margin-bottom: 30px; } .fwzc-sec3 .div1 a { font-size: 14px } .fwzc-sec3 .left h3 { font-size: 24px; } .fwzc-sec3 .left h3 b { font-size: 28x } .fwzc-sec3 .div1 { padding-top: 150px; max-width: 450px; margin-left: -5px; margin-right: -5px; } .fwzc-sec3 .div1 a { width: calc(100%/3 - 10px); margin-left: 5px; margin-right: 5px; } .fwzc-sec4::after { height: 8px; } .fwzc-sec4::before { width: 8px; } .fwzc-sec4 ul::after { height: 8px; } .fwzc-sec4 ul::before { width: 8px; } .fwzc-sec4 { padding: 40px; } .fwzc-sec4 li span { font-size: 14px; } .fwzc-sec4 ul li { padding-right: 10px; } .fwzc-sec4 li input { padding-left: 5px; } .fwzc-sec4 h3 { font-size: 26px; line-height: 1.3; } .fwzc-sec4 h4 { font-size: 20px } .fwzc-sec4 li button { width: 150px; font-size: 14px; height: 45px; line-height: 45px; } .about-sec4 .swiper-container { margin-top: 40px; } .about-sec5 .swiper-container { margin: 35px 0 15px 0; } .about-sec1 { padding-top: 20px; } .cpzxde-sec2 .div2 p { min-height: 60px; } .about-sec2 li:nth-child(2) { top: 0px; right: 0px; } .about-sec2 li:nth-child(4) { bottom: 0px; right: 0px; } .about-sec2 li:nth-child(1) { top: 0px; left: 0px; } .about-sec2 li:nth-child(3) { bottom: 0px; left: 0px; } } @media (max-width:900px) { .join-sec1 .left h4, .join-sec1 .left h2 { font-size: 20px } .join-sec1 .left h5 { font-size: 16px } .join-sec1 .left h5 i { width: 30px; } .join-sec1 .arrow { height: 20px; } .join-sec1 .left h2 { margin-bottom: 15px; } .join-sec1 .left { flex-shrink: 0; width: 40%; } .join-sec1 .div2 { margin-top: 2rem; } .join-sec2 li { width: calc(100%/3); padding: 0 5px; max-width: initial; } .join-sec2 li:nth-child(2n) { display: none; } .join-sec2 li img { width: 20px; } .join-sec2 ul { flex-wrap: wrap; justify-content: space-around; } .join-sec2 li:nth-child(7) { flex-grow: 1; } .join-sec2 li:last-child { flex-grow: 1; } .cpzxde-sec1 .tit h3 { font-size: 24px; } .cpzxde-sec1 .tit h4 { font-size: 18px; } .cpzxde-sec1 .tit span { width: 80px; } .cpzxde-sec1 .tit b { width: 8px; height: 8px; } .cpzxde-sec1 .tit h4 { font-size: 16px; margin-bottom: 80px; } .cpzxde-page .cptit i { height: 20px; } .cpzxde-page .cptit h3 { font-size: 18px; margin: 15px 0; } .cpzxde-sec1 .bg { height: 280px; } .cpzxde-sec2 { padding-bottom: 0px; } .cpzxde-sec2 .bg img { min-height: 150px; } .ryzz-ul { margin-left: -15px; margin-right: -15px; } .ryzz-ul li { margin-left: 10px; margin-right: 10px; width: calc(100%/3 - 20px); } .khal-ul { margin-left: -10px; margin-right: -10px; } .khal-ul li { width: calc(100%/2 - 20px); margin-left: 10px; margin-right: 10px; margin-bottom: 10px; } .khal-ul li p { font-size: 14px } .fwzc-sec2 ul { margin-left: -5px; margin-right: -5px; display: inherit; } .fwzc-sec2 li .item-text { height: auto; } .fwzc-sec2 li { width: 100%; margin-left: 0px; margin-right: 0px; margin-bottom: 20px; } .fwzc-sec2 li h3 { font-size: 15px; } .fwzc-sec2 li p { line-height: 24px; font-size: 13px } .fwzc-sec2 li .item-text { padding: 15px 10px; } .fwzc-sec2 li .item-text span { margin: 10px 0 5px 0; } .fwzc-sec2 { padding: 35px 0; } .about-sec1 .maincont { flex-direction: column; } .about-sec1 .maincont .left { width: 100%; } .about-sec1 .maincont .right { width: 100%; padding-left: 0; margin-top: 30px; } } @media (max-width:750px) { .contact-sec3 { flex-direction: column; } .contact-sec3 .left { width: 100%; } .index-sec1 .leftcont { padding: 50px 30px; } .index-sec1 .div1left i { margin: 10px 0; width: 24px; } .index-sec1 .div1left h4 { font-size: 14px; line-height: 1.6; } .index-sec1 .div1 .more { height: 35px; width: 130px; border-width: 1px; line-height: 35px; } .index-sec1 .div1 .more img { width: 6px; } .index-sec1 .div2 .p2 { margin-top: 15px; } .index-sec1 .div2 p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; text-overflow: ellipsis; line-height: 26px; height: 104px; font-size: 14px } .index-sec1 .timeline span { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .index-sec1 .timeline strong { font-size: 30px } .index-sec3, .index-sec4, .footer { padding: 50px 30px; } .index-sec3 .index-title h3, .index-sec4 .tit h3 { font-size: 22px; } .index-sec3 #tab { display: flex; justify-content: space-between; margin-top: 20px; } .index-sec3 #tab a { font-size: 14px; margin: 0 5px; height: 36px; line-height: 36px; width: auto; flex-grow: 1; } .index-sec4 .tit h4 { margin-bottom: 0; margin-top: 10px; font-size: 14px } .index-sec2 .item-num span { font-size: 22px } .index-sec2 .item-num strong { font-size: 16px; } .footer .leftcont .p1, .footer .rightcont .p1 { margin-bottom: 15px; } .padding5rem { padding: 0 30px } .xwzx-ul { margin-left: -8px; margin-right: -8px; } .xwzx-ul li { width: calc(100%/2 - 16px); margin-left: 8px; margin-right: 8px; margin-bottom: 10px; } .xwzx-ul .item-text .p2 { margin: 0px 0 10px 0; font-size: 15px; } .xwzx-ul .item-text { height: auto; padding: 10px; } .xwzx-ul li:hover .item-text { padding: 10px; } .xwzx-ul .item-text .p3 img { width: 20px; } .xwzx-ul .item-text .p1, .xwzx-ul .item-text .p3 { font-size: 12px } /* .breadcrumb{ margin-bottom: 20px;} */ .breadcrumbwrap { margin-bottom: 20px; } .wave, .wave-wrapper { height: 80px; } .fenpian { flex-direction: column; } .fenpian>div { width: 100%; } .fenpian>div a { display: flex; align-items: center; } .fenpian .prevpian { background: none; padding-left: 0; margin-bottom: 10px; } .fenpian .nextpian { background: none; padding-left: 0; padding-right: 0; } .fenpian .nextpian span { text-align: left; } .fenpian span { display: block; flex-shrink: 0; width: 50px; } .fenpian p { margin-top: 0; } .cpzxde-sec3 .fenpian>div { width: 100%; } .cpzxde-sec3 .backbtn { position: absolute; left: 50%; bottom: -50px; transform: translateX(-50%); background: #fff; z-index: 3; } .cpzxde-sec2 .controldiv { padding: 20px 0 50px 0; } .cpzxde-sec2 .swiper-container { padding-bottom: 30px; } .cpzxde-sec2 .bg { bottom: 100px; } .cpzxde-sec2 .bg img { display: block; width: 100%; min-height: 150px; } .xwzxde-sec2 { height: 60px; } .xwzxde-sec2 strong { font-size: 18px; width: 70px; } .xwzxde-sec3 p { line-height: 32px; } .xwzxde-sec1 h3 { font-size: 16px; } .xwzxde-sec1 p span { font-size: 13px; } .xwzxde-sec2 div p { text-indent: 1em; } .xwzxde-sec2 div { padding: 5px; } .join-sec1 .left { width: 100%; padding: 15px; height: 130px; } .join-sec1 .left h4, .join-sec1 .left h2 { font-size: 20px; } .join-sec1 .left h5 { font-size: 16px; margin-top: 25px; } .join-sec1 .right { width: 50%; display: none; } .join-sec1 .left .div2 { display: none; } .join-sec1 .left h4 { margin-bottom: 20px; } .join-sec1 .line1 { animation: none; right: 15px; top: 15px; } .join-sec1 .line2 { animation: none; left: 15px; bottom: 15px; } .join-sec2 .tit h2 { font-size: 20px; } .join-sec2 .tit h3 { font-size: 15px } .join-sec2 li { margin-bottom: 20px; } .join-sec2 li p { display: -webkit-box; -webkit-line-clamp: 2; text-overflow: ellipsis; -webkit-box-orient: vertical; overflow: hidden; line-height: 24px; font-size: 12px } .join-sec2 li span { width: 50px; height: 50px; line-height: 50px; font-size: 18px; } .join-sec2 li strong { font-size: 16px; margin: 10px 0 5px 0; } .join-sec2 .tit { margin-top: 40px; } .join-sec3 { padding: 0 20px; height: 160px; } .join-sec3 h3 { font-size: 20px; margin-bottom: 15px; } .join-sec3 p { font-size: 14px; line-height: 20px; } .join-sec3 { margin-top: 10px; } .join-sec4 { padding: 15px; margin: 30px 0; } .join-sec4 .text { flex-wrap: wrap; } .join-sec4 .tit strong { font-size: 16px; } .join-sec4 .tit b { margin-left: 5px; } .join-sec4 li .btn { top: 20px; right: 0px; transform: none; background-size: 15px auto; } .join-sec4 .text span { width: 50%; margin-bottom: 10px; font-size: 12px; } .join-sec4 .text span:last-child { flex-grow: 1; } .join-sec4 li { padding: 15px 0; } .join-sec2 .tit h3 { margin-top: 10px; } .join-sec2 ul { margin-top: 30px; } .cpzx-page li a { flex-direction: column; } .cpzx-page li .item-img { width: 100%; } .cpzx-page li .item-text { width: 100%; order: 5 !important; } .cpzx-page .item-text p { -webkit-line-clamp: 4; line-height: 26px; } .cpzx-page li strong { position: relative; left: auto; bottom: auto; margin-top: 20px; margin-bottom: 10px; } .cpzx-page ul { padding: 0 15px; } .cpzx-page li { margin-bottom: 15px; } .cpzx-page .item-text h3 { font-size: 16px; } .cpzxde-sec1 { flex-direction: column; } .cpzxde-sec1 .left { width: 100%; margin-bottom: 15px; } .cpzxde-sec1 .bg { height: 200px; } .cpzxde-sec1 .right { width: 100%; } .cpzxde-sec1 .right img { min-height: initial; height: auto; } .cpzxde-sec1 .tit h4 { margin-bottom: 30px; } .cpzxde-sec1, .cpzxde-sec2 { padding: 35px 15px; } .cpzxde-sec2 { padding-bottom: 0; } .cpzxde-sec2 .bg { bottom: 30px; } .cpzxde-sec2 .controldiv { padding-bottom: 20px; } .cpzxde-sec2 { margin-bottom: 0px; } /* .ryzz-sec1{ padding: 0 10px;} */ .ryzz-ul { margin-left: -8px; margin-right: -8px; } .ryzz-ul li { width: calc(100%/2 - 16px); margin-left: 8px; margin-right: 8px; } .ryzz-ul li p { font-size: 14px } .ryzz-ul li .item-img { padding: 10px; } .breadcrumb a { font-size: 15px } .khal-ul { margin-left: -8px; margin-right: -8px; } .khal-ul li { width: calc(100%/2 - 16px); margin-left: 8px; margin-right: 8px; margin-bottom: 10px; } .khal-ul li .whitelogo img { width: 130px; } .xwzxdetail-page1 { padding-top: 30px; } .fzlc-sec1 { padding-bottom: 30px; } .fzlc-ul li { width: 100%; margin-bottom: 30px; border: none; border-bottom: 1px solid #F5F5F5; padding: 15px 0; margin-bottom: 0; } .fzlc-ul li .line { left: 0; display: none; } .fzlc-ul li:nth-child(2n) .item-img { order: 0; } .fzlc-ul li:nth-child(2n) { margin-top: 0; } .fzlc-ul .item-img img { width: 80px; height: 80px; } .fzlc-ul .item-text { padding: 0 0 0 15px; } .fzlc-ul li .nian { justify-content: flex-start; margin-bottom: 5px; } .fzlc-ul li:nth-child(2n) .item-text { padding-left: 15px; padding-right: 0; } .fzlc-sec1 .tit { margin-bottom: 10px; } .fzlc-ul::before, .fzlc-ul::after { display: none; } .fzlc-sec1 .tit h3 { font-size: 20px } .fzlc-ul li span { font-size: 18px; } .fzlc-ul li .nian b, .fzlc-sec1 .fzlcmore { font-size: 14px; } .fzlc-ul li p { line-height: 26px; text-align: left !important; } .fwzc-sec1 h3 { font-size: 20px } .fwzc-sec1 .div1 p, .fwzc-sec1 .div2 p { font-size: 14px; line-height: 30px; } .fwzc-sec1 .left { padding-top: 50px; } .fwzc-sec1 .div1 { margin-bottom: 30px; } .fwzc-sec1 { background: none; } .fwzc-sec1 .left { padding-top: 35px; } .fwzc-sec3 .div1 { padding-top: 30px; } .fwzc-sec3 .left h3 b { font-size: 24px } .fwzc-sec3 .left h3 { font-size: 18px; } .fwzc-sec3 { padding: 35px 0; } .fwzc-sec3 .map { position: relative; width: 100%; top: 0; } .fwzc-sec3 .div1 a { height: 40px; line-height: 40px; margin-bottom: 10px; } .fwzc-sec4 { flex-wrap: wrap; flex-direction: column; padding: 25px; } .fwzc-sec4 ul li { width: 100%; } .fwzc-sec4 .div1 { width: 100%; padding-right: 0; margin-bottom: 30px; } .fwzc-sec4 li span { margin-bottom: 15px; } .fwzc-sec4 ul li { margin-bottom: 15px; padding-right: 0; } .fwzc-sec4 li button { width: 100%; } .fwzc-sec4 h3 { white-space: nowrap; font-size: 20px } .fwzc-sec4 h3 br { display: none !important; } .fwzc-sec4 h4 { font-size: 16px; margin-top: 5px; } .fwzc-sec4 .div2 { width: 100%; } .about-sec1 .maincont { flex-direction: column; } .about-sec1 .maincont .left { width: 100%; margin-bottom: 25px; } .about-sec1 .maincont .right { width: 100%; padding-left: 0; } .about-sec1 .right h4, .about-sec1 .left h2 { font-size: 18px } .about-sec1 .right p { margin-bottom: 10px; -webkit-line-clamp: initial; } .about-sec1 .left img { min-height: initial; } .about-sec1 .left h2 { padding-left: 0; text-align: left; } .about-sec1 .left .tit div { display: block; } .about-sec1 .left h3 b { width: 40px; margin-right: 10px; } .about-sec1 .left h3 { font-size: 14px; } .about-sec1 .left img { margin-top: 25px; } .about-num { flex-wrap: wrap; background-size: cover; padding: 10px 0 10px 20px; height: initial; } .about-num li { padding: 10px 5px; width: calc(100%/3); } .about-num strong { font-size: 20px; } .about-num .p1 { margin-bottom: 5px; } .about-num li:nth-child(3) { order: 4; flex-grow: 1; } .about-sec2 li { position: relative !important; width: 100%; top: auto !important; left: auto !important; right: auto !important; margin-bottom: 25px; } .about-sec2 .maincont { padding: 0; background: none; } .about-sec2 li p { text-align: left; } .about-sec2 li span { text-align: left; } .about-sec2 li strong { text-align: left; } .about-sec2 .mapgun { display: none; } .about-sec2 .maincont { margin-top: 35px; } .about-tit h2 { font-size: 20px; margin-top: 0px; } .about-tit h3 { font-size: 14px; margin-bottom: 5px; } .about-sec2 { padding: 35px 0 15px 0; } .about-sec2 li strong, .about-sec2 li span { font-size: 16px; } .about-sec3 { padding: 40px 0 40px 30px; } .about-sec3 .condiv { justify-content: center; margin-top: 30px; } .about-sec3 { margin-top: 25px; } .about-sec4 { padding: 40px 0; } .contact-sec2, .contact-sec1 li .text { padding: 20px 10px; } .contact-sec1 h3 { font-size: 18px; margin-top: 5px; margin-bottom: 5px; } .contact-sec1 p, .contact-sec2 li p { font-size: 14px; } .contact-sec2 li img { display: block; width: 24px; } .contact-sec2 li p { padding-left: 10px; } .contact-sec2 li { margin-bottom: 10px; } .contact-sec2 ul { flex-wrap: wrap; } .contact-sec1 li img { width: 30px; } .contactbg { padding: 0 15px 35px 15px; } .contact-sec3 { padding: 30px 15px; } .contact-sec3 .left { width: 100%; } .contact-sec3 h3 { font-size: 20px; } .contact-sec3 h2 { font-size: 16px } .contact-sec3 .skew { width: 100%; height: 45px; margin-top: 20px; } .contact-sec3 label { padding: 20px 0; } .contact-sec3 button { font-size: 14px; } .contact-sec3 .mapbox { position: relative; width: 100%; height: 80vw; left: 0px; top: auto; right: 0px; bottom: 0vw; border-radius: 0; transform: none; box-sizing: border-box; margin-top: 30px; } .contactbg .mapbg { position: relative; display: none; } .BMap_Marker img, .BMap_Marker, .BMap_Marker>div { width: 45px !important; height: 45px !important; } .contact-sec3 .css_animation { width: 65px; height: 65px; } .about-sec3 .w1400 { padding: 0 15px; } .about-sec1 { padding-top: 10px; } } @media (max-width:600px) { .index-sec2 .item-text h3 { font-size: 18px; margin-bottom: 15px; } .index-sec2 .item-text .line { margin-bottom: 10px; } .index-sec2 .item-text { padding: 30px 15px; } /* .banner .swiper-slide,.banner{ height: 60vh;} .banner .swiper-slide img{ height: 60vh;} */ .index-sec3 li:last-child { display: block } .index-sec3 ul { flex-wrap: wrap; } .index-sec3 li { width: calc(100%/2 - 10px); margin-bottom: 20px; } .index-sec3, .index-sec4, .footer { padding: 30px 15px 25px 15px; } .index-sec1 .timeline li:nth-child(5) { width: 100%; } .index-sec4 .maincont { flex-direction: column; } .index-sec4 .rightcont { width: 100%; } .index-sec4 .leftcont { width: 100%; display: flex; justify-content: space-between; position: initial; align-items: center; margin-bottom: 20px; } .index-sec4 #tab2 a { font-size: 14px; margin-left: 15px; margin-bottom: 0; } .index-sec4 #tab2 a.active { font-size: 16px; } .index-sec4 .leftcont #tab2 { display: flex; align-items: center; } .index-sec4 { position: relative; padding-bottom: 60px; } .index-sec4 .more { bottom: 0; left: 50%; margin-left: -60px; } .footer .maincont { flex-direction: column; } .footer .p2-div { flex-wrap: wrap; padding-right: 0; } .footer .leftcont { width: 100%; } .footer .line { display: none; } .footer .leftcont .p1, .footer .rightcont .p1 { margin-bottom: 10px; } .footer .rightcont { padding-left: 0; width: 100%; margin-top: 20px; } .footer .p2-div p:nth-child(2) { /* margin-left: 5px; */ } .footer .p2-div p { margin-right: 0; } .footer .leftcont .p2 a { display: block; margin-right: 5px; } .footer .rightcont .p2, .footer .leftcont .p2 a { line-height: 30px; } .footer .rightcont .div2 { /* top: 10%; */ } .footer .p2-div { margin-top: 0px; } .footer .p2-div .code { display: flex; align-items: center; margin-top: 10px; } .footer .p2-div .code p { padding: 0; margin-left: 15px; font-size: 14px; } .footer .p2-div .code img { width: 80px; height: 80px; } .copyright .right { flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: 10px; } .index-sec4 .more { bottom: 30px; } .index-sec4 { padding-bottom: 100px; } .copyright .right img { margin-right: 5px; height: 10px; } .copyright .right p { font-size: 13px; margin-right: 0; } .padding5rem { padding: 0 15px } .neibanner img { height: 100px; } .joinpage .neibanner img { height: auto; } .showmorebtn { margin: 20px auto; } .xwzxde-sec1 .backbtn { width: 40px; height: 40px; } .xwzxde-sec1 .backbtn img { width: 14px; height: auto; } .xwzxde-sec1 h3 { font-size: 15px; } .copyright .p1 { font-size: 13px; width: 100%; text-align: center; padding: 10px; } .index-sec3 .item-text p { font-size: 14px; } .cpzx-page li .item-text { padding: 10px; } .about-sec3 .maincont { flex-direction: column; } .about-sec3 .swiper-container1 { width: 100% !important; margin-right: 0; max-width: 100% !important; } .about-sec3 { padding: 35px 15px; margin-top: 0; } .about-sec3 .swiper-container2 { margin-top: 20px; width: 100% !important; } .about-sec4 { padding: 35px 0; } .about-sec4 .swiper-container { margin-top: 30px; } .contact-sec3 label input { font-size: 14px; } .index-sec1 .timeline strong { font-size: 22px; } .index-sec1 .timeline li { padding: 10px 0; } .about-sec1 .maincont .right { margin-top: 0; } } @media (max-width:500px) { .index-sec1 .leftcont { padding: 30px 15px; } .index-sec1 .div1left h3 { font-size: 22px } .index-sec1 .timeline { padding: 30px 15px; } } @media (max-width:320px) { .breadcrumb a { font-size: 14px; padding: 15px 0; } .contact-sec1 h3 { font-size: 16px } .contact-sec3 h3 { font-size: 18px; } .contact-sec3 h2 { font-size: 14px } } @media (min-width:990px) { .xwzx-ul .item-img { overflow: hidden; height: 250px; } } /* 棣栭〉淇敼 */ .header { position: fixed; width: 100%; z-index: 990; transition: all .3s ease-in-out; } .header .Layer { display: flex; flex-direction: row; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, 0.2); padding: 0 60px; } .header .Layer .logo { position: relative; height: 100%; justify-content: center; display: flex; align-items: center; } .header .Layer .logo img { display: block; transition: all .3s ease-in-out; } .header .Layer .logo img.imgA { display: block; } .header .Layer .logo img.imgB { display: none; } .header .Layer .menubox { position: relative; display: flex; flex-direction: row; } .header .Layer .menubox .litag { position: relative; height: 90px; line-height: 90px; margin: 0 25px; transition: all .3s ease; float: left; } .header .Layer .menubox .litag:before { content: ""; position: absolute; width: 0%; height: 3px; background: #fff; bottom: 0; right: 50%; left: 50%; transition: all .3s ease-in-out; } .header .Layer .menubox .litag a { display: block; } .header .Layer .menubox .litag a.anjie { color: #fff; font-size: 16px; } .header .Layer .menubox .litag:hover:before, .header .Layer .menubox .litag.on:before { width: 100%; left: 0; right: 0; } .header .Layer .dragon { display: flex; flex-direction: row; align-items: center; justify-content: space-between; line-height: 30px; } .header .Layer .dragon .magnifier { cursor: pointer; color: #FFF; background: url(../images/search.png) left center no-repeat; padding-left: 28px; } .header .Layer .dragon .phone { padding: 0 40px 0 60px; color: #FFF; font-family: 'DIN'; font-size: 20px; background: url(../images/tel.png) 40px center no-repeat; } .header .Layer .dragon .dragonNav { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; height: 22px; cursor: pointer; } .header .Layer .dragon .dragonNav span { display: block; background: #FFF; height: 4px; transition: all 300ms; } .header .Layer .dragon .dragonNav span.line1 { width: 24px; } .header .Layer .dragon .dragonNav span.line2 { width: 17px; } .header .Layer .dragon .dragonNav span.line3 { width: 7px; } .header .Layer .dragon .dragonNav:active span { width: 24px; } .header.scroll { background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header.scroll .Layer { border: none; } .header.scroll .logo img.imgA { display: none; } .header.scroll .logo img.imgB { display: block; } .header.scroll .Layer .menubox .litag a.anjie { color: #000; } .header.scroll .Layer .menubox .litag:before { background: #E62129; } .header.scroll .Layer .menubox .litag:hover:before, .header.scroll .Layer .menubox .litag.on:before { width: 100%; left: 0; right: 0; } .header.scroll .Layer .dragon .magnifier { cursor: pointer; color: #000; background-image: url(../images/searchon.png); } .header.scroll .Layer .dragon .phone { color: #000; background-image: url(../images/telon.png); } .header.scroll .Layer .dragon .dragonNav span { background: #000; } .header.ny_white { background: #fff !important; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header.ny_white .Layer { border: none; } .header.ny_white .logo img.imgA { display: none; } .header.ny_white .logo img.imgB { display: block; } .header.ny_white .Layer .menubox .litag a.anjie { color: #000; } .header.ny_white .Layer .menubox .litag:before { background: #E62129; } .header.ny_white .Layer .menubox .litag:hover:before, .header.scroll .Layer .menubox .litag.on:before { width: 100%; left: 0; right: 0; } .header.ny_white .Layer .dragon .magnifier { cursor: pointer; color: #000; background-image: url(../images/searchon.png); } .header.ny_white .Layer .dragon .phone { color: #000; background-image: url(../images/telon.png); } .header.ny_white .Layer .dragon .dragonNav span { background: #000; } .gation { position: fixed; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; display: none; z-index: 1200; width: 100%; height: 100%; background: url(../images/gation.jpg) right center no-repeat; background-size: cover; } .gation .close { position: absolute; right: 0; top: 0; font-size: 50px; color: #FFF; z-index: 10; display: flex; flex-direction: column; width: 90px; height: 90px; background: rgba(255, 255, 255, 0.2); align-items: center; justify-content: center; cursor: pointer; } .gation .close:hover { background: rgba(255, 255, 255, 0.4); } .gation .gationCont { width: 100%; height: 100%; display: flex; flex-direction: column; position: relative; } .gation .gationCont .gationContLogo { display: flex; flex-direction: column; justify-content: center; padding: 0 60px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); height: 90px; } .gation .gationCont .rough { display: flex; flex-direction: row; justify-content: space-between; padding: 100px 200px 0; height: calc(100% - 90px); } .gation .gationCont .rough .roughLeft { display: flex; flex-direction: column; width: 60%; } .gation .gationCont .rough .roughTitle { display: flex; flex-direction: column; position: relative; line-height: 50px; padding-bottom: 40px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .gation .gationCont .rough .roughTitle h2 { font-size: 40px; color: #FFF; height: 50px; } .gation .gationCont .rough .roughTitle h3 { font-size: 40px; color: #FFF; font-weight: bold; } .gation .gationCont .rough .roughTitle:after { content: ''; position: absolute; left: 0; bottom: 0; z-index: 1; width: 100px; height: 1px; background: #FFF; } .gation .gationCont .rough .roughLeft .roughLeftFang { display: flex; flex-direction: column; padding-top: 30px; opacity: 0.7; } .gation .gationCont .rough .roughLeft .roughLeftFang ol { display: flex; flex-wrap: wrap; } .gation .gationCont .rough .roughLeft .roughLeftFang ol li { display: flex; flex-direction: column; width: calc(100% / 2); line-height: 2; padding: 20px 0; } .gation .gationCont .rough .roughLeft .roughLeftFang ol li span { color: #FFF; font-size: 18px; font-weight: bold; } .gation .gationCont .rough .roughLeft .roughLeftFang ol li b { color: #FFF; font-size: 18px; } .gation .gationCont .rough .roughLeft .roughLeftFang ol li sup { color: #FFF; font-size: 22px; font-family: 'DIN'; } .gation .gationCont .rough .roughRight { display: flex; flex-direction: column; width: 30%; } .gation .gationCont .rough .roughRight .roughRightNav { display: flex; flex-wrap: wrap; padding-top: 40px; } .gation .gationCont .rough .roughRight .roughRightNav a { display: block; width: 50%; padding: 20px 0; color: #FFF; font-size: 22px; opacity: 0.7; } .home { display: flex; flex-direction: column; } .home .inner { padding: 0 200px; } .brand .brandBox { display: flex; flex-direction: column; padding-top: 80px; padding-bottom: 60px; background: url(../images/indexbg1.png) right bottom no-repeat; background-size: 100%; } .brand .brandBox .brandBoxWord { display: flex; flex-direction: column; width: 50%; } .brand .brandBox .brandBoxWord .brandBoxWordUp { display: flex; flex-direction: column; position: relative; padding-bottom: 50px; } .brand .brandBox .brandBoxWord .brandBoxWordUp h2 { font-size: 40px; } .brand .brandBox .brandBoxWord .brandBoxWordUp h3 { font-size: 22px; padding-top: 25px; } .brand .brandBox .brandBoxWord .brandBoxWordUp:after { content: ''; width: 60px; height: 2px; background: #EEE; position: absolute; left: 0; bottom: 0; } .brand .brandBox .brandBoxWord .brandBoxWordCont { padding: 40px 0; display: flex; flex-direction: column; font-size: 15px; color: #666; line-height: 36px; } .brand .brandBox .brandBoxWord .brandBoxWordCont p { line-height: 36px; } .brand .brandBox .brandBoxWord .brandBoxWordMore { display: flex; margin-top: 90px; } .brand .brandBox .brandBoxWord .brandBoxWordMore a { transition: all 300ms; display: flex; border: 1px solid #222; line-height: 54px; padding: 0 70px 0 70px; font-size: 15px; background: url(../images/brandBoxWordMore.png); text-align: center; } .brand .brandBox .brandBoxWord .brandBoxWordMore a:hover { background-color: #E62129; border-color: #E62729; color: #FFF; background-image: url(../images/brandBoxWordMoreon.png); background-repeat: no-repeat; } .brand .brandTime { display: flex; flex-direction: column; } .brand ol { padding: 0 200px; display: flex; flex-direction: row; justify-content: space-between; height: 220px; align-items: center; } .brand ol li { display: flex; flex-direction: row; align-items: baseline; } .brand ol li span { font-size: 18px; } .brand ol li strong { font-size: 70px; font-family: 'DIN'; color: #E62129; padding: 0 10px; } .product { display: flex; flex-direction: column; position: relative; height: 900px; } .product .productLeft { width: 40%; background: linear-gradient(124deg, #E62129, #C5426e); height: 100%; } .product .productLeft .productLeftMing { display: flex; flex-direction: row; padding: 0 80px; align-items: center; border-bottom: 1px solid rgba(255, 255, 255, 0.2); height: 16%; } .product .productLeft .productLeftMing span { font-size: 30px; font-weight: bold; color: #FFF; } .product .productLeft .productLeftMing sup { font-size: 18px; font-weight: bold; color: #FFF; padding-left: 15px; } .product .productLetter { position: absolute; right: 0; top: 7%; width: 60%; font-size: 140px; text-align: center; font-family: 'DIN'; opacity: 0.1; text-transform: uppercase; z-index: 10; } .productShow { display: flex; flex-direction: column; position: absolute; width: 100%; top: 16%; left: 0; right: 0; bottom: 0; height: 84%; } .productShow .swiper-container { width: 100%; height: 100%; } .productShow .swiper-container .swiper-slide { display: flex; flex-direction: row; justify-content: space-between; } .productShow .swiper-container .swiper-slide .productShowTent { width: 30%; display: flex; flex-direction: column; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont { padding: 20% 80px 30%; height: 100%; display: flex; flex-direction: column; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont h3 { font-size: 36px; color: #FFF; padding-bottom: 50px; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont p { font-size: 16px; line-height: 40px; color: #FFF; } .productShow .swiper-container .swiper-slide .productShowPic { width: 70%; display: flex; flex-direction: column; } .productShow .swiper-container .swiper-slide .productShowPic img { width: 100%; height: 100%; object-fit: cover; } .productShow .productShowDian { position: absolute; left: 5%; bottom: 10%; width: 20%; z-index: 10; line-height: 50px; height: 50px; } .productShow .productShowDian .swiper-button-next:after, .productShow .productShowDian .swiper-button-prev:after { font-size: 24px; opacity: 0.3; transition: all .3s; } .productShow .productShowDian .swiper-button-next:hover:after, .productShow .productShowDian .swiper-button-prev:hover:after { opacity: 1; } .productShow .productShowDian .swiper-pagination { width: 100%; } .productShow .productShowDian .swiper-pagination .swiper-pagination-bullet { font-size: 24px; font-family: 'DIN'; width: auto; height: auto; background: none; border-radius: 0; color: #FFF; margin: 0 10px; } .productShow .productShowDian .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { font-size: 40px; } .news { padding: 0 0 60px; background: #F7F7F7; } .home .homeTitle { display: flex; flex-direction: row; justify-content: space-between; padding: 60px 200px; align-items: center; } .home .homeTitle h2 { font-size: 44px; line-height: 50px; } .home .homeTitle span a { position: relative; padding-left: 16px; } .home .homeTitle span a:before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -1px; height: 2px; width: 12px; background: #E62129; } .news .swiper-container { width: 100%; height: 100%; padding-bottom: 60px; margin-top: -20px; } .news .swiper-container .swiper-wrapper { display: flex; flex-direction: row; align-items: flex-end; } .news .swiper-container .swiper-slide { display: flex; flex-direction: column; transition: 300ms; width: 25%; } .news .swiper-container .swiper-slide .newsBox { position: relative; display: flex; flex-direction: column; padding: 22px; margin: 0 15px; height: 535px; background: #FFF; } .news .swiper-container .swiper-slide .newsBox:after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: #E62129; } .news .swiper-container .swiper-slide .newsBox .newsBoxPic { width: 100%; overflow: hidden; } .news .swiper-container .swiper-slide .newsBox .newsBoxPic img { display: block; width: 100%; /*transition: all 0.3s;*/ } /* .news .swiper-container .swiper-slide .newsBox:hover .newsBoxPic img{ transform: scale(1.05);} */ .news .swiper-container .swiper-slide .newsBox .newsBoxWord { display: flex; flex-direction: column; padding-top: 20px; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord span, .news .swiper-container .swiper-slide .newsBox .newsBoxWord p { color: #666; line-height: 30px; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord p { display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord h2 { font-size: 24px; padding: 15px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord sup { position: relative; margin: 25px 0 10px; line-height: 2; background: url(../images/newsBoxWord.png) 70px center no-repeat; } .news .swiper-container .swiper-pagination { bottom: 0; height: 34px; display: flex; flex-direction: row; align-items: center; justify-content: center; } .news .swiper-container .swiper-pagination .swiper-pagination-bullet { width: 10px; height: 10px; margin: 0 10px; } .news .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #E62129; } .news .swiper-container .swiper-button-next, .news .swiper-container .swiper-button-prev { bottom: 0; top: auto; width: auto; height: auto; } .news .swiper-container .swiper-button-prev { left: 200px; } .news .swiper-container .swiper-button-next { right: 200px; } .news .swiper-container .swiper-button-next:after, .news .swiper-container .swiper-button-prev:after { font-size: 34px; color: #AAA; line-height: 1; } .news .swiper-container .swiper-button-next:after:hover, .news .swiper-container .swiper-button-prev:after:hover { color: #E62129; } .news .swiper-container .swiper-slide.swiper-slide-active { opacity: 1; } .news .swiper-container .swiper-slide.swiper-slide-active .newsBox .newsBoxWord p { display: -webkit-box; } .news .swiper-container .swiper-slide.swiper-slide-active .newsBox .newsBoxWord sup { display: block; } .news .swiper-container .swiper-slide .newsBox:hover .newsBoxWord h2 { color: #E62129; } .case { position: relative; } .case .homeTitle { border-bottom: 1px solid #EEE; } .case .example { display: flex; flex-direction: column; padding: 60px 0; } .case .example .liest { display: flex; flex-direction: row; position: absolute; top: 0; right: 200px; } .case .example .liest li { font-size: 18px; margin-left: 90px; cursor: pointer; transition: all 300ms; position: relative; height: 170px; display: flex; flex-direction: column; justify-content: center; } .case .example .liest li:after { content: ''; position: absolute; right: 0; bottom: 0; width: 100%; opacity: 0; height: 3px; z-index: 1; background: #E62129; transition: all 300ms ease-in-out; } .case .example .liest li.on { color: #E62129; font-weight: bold; font-size: 22px; } .case .example .liest li.on:after { opacity: 1; } .case .example .dimian { overflow: hidden; } .case .example .dimian .exampleBox { display: none; padding: 0 200px; flex-direction: row; justify-content: space-between; position: relative; } .case .example .dimian .exampleBox.on { display: flex; } .case .example .dimian .exampleBox .exampleBoxList { display: flex; flex-direction: column; width: 24%; } /* .case .example .dimian .exampleBox .exampleBoxList:nth-child(1){ display: none;} */ .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListPic { width: 100%; position: relative; overflow: hidden; } .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListPic img { width: 100%; transition: all 0.3s; border-radius: 0; } .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListPic:before { content: ""; position: absolute; width: 200px; height: 100%; top: 0; left: -150px; z-index: 10; overflow: hidden; background: -moz-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, .2)), color-stop(100%, rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%); background: -o-linear-gradient(left, rgba(255, 255, 255, 0)0, rgba(255, 255, 255, .2)50%, rgba(255, 255, 255, 0)100%); -webkit-transform: skewX(-25deg); -moz-transform: skewX(-25deg); } .case .example .dimian .exampleBox .exampleBoxList:hover .exampleBoxListPic:before { left: 150%; transition: left 1s ease 0s; } .case .example .dimian .exampleBox .exampleBoxList:hover .exampleBoxListPic img { -webkit-transform: scale(1.06); -moz-transform: scale(1.06); -ms-transform: scale(1.06); -o-transform: scale(1.06); transform: scale(1.06); } .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListWord { font-size: 22px; text-align: center; padding-top: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .case .example .dimian .exampleBox .exampleBoxList:hover .exampleBoxListWord { color: #E62129; } .readMore { margin-top: 50px; color: #fff; font-size: 16px; padding: 18px 0px; border: 1px solid #fff; display: inline-block; width: 220px; text-align: center; transition: all 0.6s; } .readMore:hover { background: #fff !important; border: 1px solid #fff; color: rgb(219, 44, 63); } @media (max-width:1500px) { .header .Layer { padding: 0 20px; } .header .Layer .logo img { height: 40px; } .header .Layer .menubox .litag { margin: 0 15px; } .gation .gationCont .rough { padding: 80px 60px 0; } .gation .gationCont .gationContLogo { padding: 0 20px; } .home .inner { padding: 60px; } .brand ol { height: 200px; padding: 0 60px; } .brand ol li strong { font-size: 50px; } .product { height: 800px; } .product .productLeft .productLeftMing { height: 12%; } .product .productLetter { top: 3%; } .productShow { top: 12%; height: 88%; } .product .productLeft .productLeftMing { padding: 0 50px; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont { padding: 20% 50px 30%; } .productShow .productShowDian { left: 3%; width: 24%; } .news { padding: 0 0 40px; } .home .homeTitle { padding: 40px 60px; } .news .swiper-container .swiper-button-prev { left: 60px; } .news .swiper-container .swiper-button-next { right: 60px; } .case .example .liest { right: 60px; } .case .example .liest li { height: 130px; } .case .example .dimian .exampleBox { padding: 0 60px; } } @media (max-width:1200px) { .header .Layer { height: 60px; } .header .Layer .menubox { display: none; } .gation .gationCont .gationContLogo { height: 60px; } .gation .gationCont .gationContLogo img { height: 40px; } .gation .close { width: 60px; height: 60px; font-size: 40px; } .brand .brandBox .brandBoxWord { width: 100%; } .brand ol { height: 160px; } .brand ol li span { font-size: 15px; } .brand ol li strong { font-size: 40px; } .product { height: 700px; } .product .productLeft .productLeftMing { height: 10%; padding: 0 20px; } .product .productLeft .productLeftMing span { font-size: 26px; } .product .productLeft .productLeftMing sup { font-size: 15px; } .product .productLetter { top: 2%; } .productShow { top: 0%; height: 100%; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont { padding: 40% 20px 30%; } .productShow .productShowDian { left: 1%; width: 28%; } .home .homeTitle h2 { font-size: 36px; line-height: 40px; } .news .swiper-container .swiper-slide { width: 33.33%; } .case .example { padding: 40px 0; } .case .example .liest li { height: 120px; } .container { margin-top: 60px; } } @media (max-width:1000px) { .gation .gationCont .rough { padding-top: 0; } .brand ol { flex-wrap: wrap; justify-content: space-between; } .brand ol li { width: 50%; } .brand ol li strong { font-size: 30px; } .product .productLeft .productLeftMing span { font-size: 22px; } .news .swiper-container .swiper-slide { width: 50%; } .news .swiper-container .swiper-slide .newsBox { margin: 0 10px; } .case .example { padding-bottom: 20px; } .case .example .dimian .exampleBox { /* flex-direction: row-reverse; */ flex-wrap: wrap; } .case .example .dimian .exampleBox .exampleBoxList { width: 48%; margin: 0; margin-bottom: 20px; } .case .example .dimian .exampleBox .exampleBoxList:nth-child(1) { display: block; } .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListWord { font-size: 18px; } } @media (max-width:750px) { .caseBannerword{ position: absolute; left: 5%; width: 90%; } .caseBannerword_top{ display: none; } .caseBannerword_bottom{ padding: 5px 20px 5px 20px; background: rgba(255,255,255,0.2); } .caseBannerword_bottom p{ color: rgb(246,246,246); font-size: 12px; font-weight: bold; letter-spacing: 2px; margin-bottom:0px; } .gation .gationCont .rough .roughTitle { display: none; } .gation .gationCont .rough .roughLeft { display: none; } .gation .gationCont .rough .roughRight { width: 100%; } .gation .gationCont .rough .roughRight .roughRightNav a { width: 100%; padding: 12px 0; } .header { background: #FFF; } .header .Layer .dragon .magnifier { padding-right: 20px; color: #000; background-image: url(../images/searchon.png); } .header .Layer .dragon .phone { display: none; } .header .Layer .logo img.imgA { display: none; } .header .Layer .logo img.imgB { display: block; } .header .Layer .dragon .dragonNav span { background: #000; } .banner { margin-top: 60px; } .home .inner { padding: 30px 20px; } .brand .brandBox .brandBoxWord .brandBoxWordUp { padding-bottom: 20px; } .brand .brandBox .brandBoxWord .brandBoxWordMore { margin-top: 120px; } .brand .brandBox .brandBoxWord .brandBoxWordUp h2 { font-size: 32px; } .brand .brandBox .brandBoxWord .brandBoxWordUp h3 { font-size: 18px; line-height: 1.6; padding-top: 15px; } .brand .brandBox .brandBoxWord .brandBoxWordCont { padding: 25px 0; line-height: 2; } .brand .brandBox .brandBoxWord .brandBoxWordMore a { line-height: 40px; padding: 0 70px 0 20px; background-position: 90px center; } .brand ol { padding: 10px 20px; } .brand ol li { width: auto; } .brand ol li strong { font-size: 20px; font-weight: bold; } .product { height: auto; display: flex; flex-direction: column; background: linear-gradient(124deg, #E62129, #C5426e); } .product .productLeft { width: 100%; background: none; } .product .productLeft .productLeftMing { padding: 20px; flex-direction: column; align-items: flex-start; } .product .productLeft .productLeftMing span { font-size: 18px; } .product .productLeft .productLeftMing sup { padding: 10px 0 0 0; } .product .productLetter { display: none; } .productShow { position: inherit; left: auto; top: auto; right: auto; bottom: auto; width: 100%; } .productShow .swiper-container .swiper-slide { flex-direction: column; } .productShow .swiper-container .swiper-slide .productShowTent, .productShow .swiper-container .swiper-slide .productShowPic { width: 100%; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont { padding: 30px 20px; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont h3 { padding-bottom: 20px; font-size: 24px; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont p { font-size: 14px; line-height: 1.5; } .productShow .productShowDian { left: 0%; right: 0; width: 100%; bottom: 2%; } .productShow .productShowDian .swiper-pagination .swiper-pagination-bullet, .productShow .productShowDian .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { font-size: 18px; } .news { padding: 0 0 30px; } .home .homeTitle { padding: 20px; } .home .homeTitle h2 { font-size: 30px; } .news .swiper-container { margin-top: 0; } .news .swiper-container .swiper-button-prev { left: 20px; } .news .swiper-container .swiper-button-next { right: 20px; } .news .swiper-container .swiper-button-next:after, .news .swiper-container .swiper-button-prev:after { font-size: 24px; } .news .swiper-container .swiper-pagination { height: 24px; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord h2 { font-size: 18px; padding: 8px 0; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord sup { margin: 10px 0 0; } .news .swiper-container .swiper-slide .newsBox .newsBoxWord p { line-height: 1.4; } .case .example { padding: 20px 0 0; } .case .example .liest { right: 20px; } .case .example .liest li { height: 80px; margin-left: 30px; font-size: 16px; } .case .example .liest li.on { font-size: 18px; } .case .example .dimian .exampleBox { padding: 0 20px; } .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListWord { font-size: 16px; } } @media (max-width:500px) { .home .inner { padding: 20px; } .header.ny_white .Layer .dragon .magnifier, .header .Layer .dragon .magnifier { display: none; } .brand .brandBox .brandBoxWord .brandBoxWordMore { margin-top: 60px; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont { padding: 20px; } .productShow .swiper-container .swiper-slide .productShowTent .productShowTentCont h3 { font-size: 20px; font-weight: bold; } .home .homeTitle h2 { font-size: 26px; } .news .swiper-container .swiper-slide { width: 100%; } .news .swiper-container .swiper-slide .newsBox { margin: 0 20px; } .case .example { padding: 0; } .case .example .liest { position: initial; right: auto; top: auto; padding: 0 20px; display: flex; flex-direction: row; justify-content: space-between; padding-bottom: 20px; } .case .example .liest li { margin-left: 0; height: auto; padding: 20px 0; } .case .example .liest li.on { font-size: 16px; } .case .example .dimian .exampleBox .exampleBoxList .exampleBoxListWord { font-size: 14px; } }