/*YQtitle*/ .YQtitle { font-size: 0.35rem; text-align: center; line-height: 1; padding: 1.1rem 0 0.8rem 0; color: #333333; } @media screen and (max-width: 1680px) { .YQtitle { font-size: 0.25rem; padding: 1rem 0 0.7rem 0; } } @media screen and (max-width: 1250px) { .YQtitle { font-size: 0.2rem; padding: 0.9rem 0 0.6rem 0; } } @media screen and (max-width: 768px) { .YQtitle { font-size: 20px; padding: 0.7rem 0 0.5rem 0; } } /*YQtab*/ .YQtab { border: 1px solid #ededed; text-align: center; border-radius: 50px; overflow: hidden; margin-bottom: 0.7rem; } .YQtab a { width: 20%; display: block; float: left; font-size: 30px; height: 70px; line-height: 70px; } .YQtab a.on { background: #04bac7; color: #fff; } .YQtab a:hover { background: #04bac7; color: #fff; } .YQtab1 a:hover, .YQtab1 a.on { border-radius: 50px; } @media screen and (max-width: 1680px) { .YQtab a { font-size: 22px; } } @media screen and (max-width: 1380px) { .YQtab a { font-size: 20px; } } @media screen and (max-width: 1250px) { .YQtab a { font-size: 18px; } } @media screen and (max-width: 1024px) { .YQtab a { font-size: 18px; height: 60px; line-height: 60px; } } @media screen and (max-width: 910px) { .YQtab { text-align: center; border-radius: 0 !important; padding: 5px; } .YQtab a { width: 50%; font-size: 16px; background: #f1f1f1; border: 5px solid #fff; box-sizing: border-box; line-height: 50px; } } .YQintroThree .YQtitledian { display: inline-block; } .YQintroThree .YQtitlewen { display: inline-block; margin-left: 10px; margin-top: 0px; } /*YQintro*/ .YQintro { padding-bottom: 0.2rem; margin-bottom: 110px; } .YQintro .introLeft { width: 45%; position: relative; } .YQintro .introLeft img { width: 100%; z-index: 1; position: relative; } .YQintro .introLeft .bg { width: 100%; background: #04bac7; position: absolute; right: -0.2rem; bottom: -0.2rem; } .YQintro .introLeft .bg img { opacity: 0; } .YQintro .introRight { width: 47%; font-size: 20px; line-height: 1.9; position: relative; top: 0.1rem; } .YQintro .introRight * { font-size: 22px; line-height: 1.9; } @media screen and (max-width: 1680px) { .YQintro { margin-bottom: 80px; } .YQintro .introRight { width: 51%; font-size: 20px; } .YQintro .introRight * { font-size: 20px; } } @media screen and (max-width: 1380px) { .YQintro { margin-bottom: 70px; } .YQintro .introRight { width: 51%; font-size: 18px; } .YQintro .introRight * { font-size: 18px; } } @media screen and (max-width: 1250px) { .YQintro { margin-bottom: 65px; } .YQintro .introRight { width: 51%; font-size: 16px; } .YQintro .introRight * { font-size: 16px; } } @media screen and (max-width: 1024px) { .YQintro { margin-bottom: 55px; } .YQintro .YQbox { display: block; zoom: 1; } .YQintro .YQbox:after { clear: both; display: block; visibility: hidden; overflow: hidden; height: 0; content: "\200B"; } .YQintro .introLeft { float: left; } .YQintro .introRight { float: right; top: 0; } } @media screen and (max-width: 910px) { .YQintro { margin-bottom: 40px; } .YQintro .title { font-size: 28px; padding: 40px 0; font-weight: 700; } .YQintro .YQbox { display: block; zoom: 1; } .YQintro .introLeft { width: calc(100% - 0.2rem); } .YQintro .introRight { width: 100%; margin-top: 0.5rem; } } /*YQintroTwo*/ .YQintroTwo { background: #e9eef0; position: relative; } /*.YQintroTwo::after {*/ /* content: "";*/ /* position: absolute;*/ /* left: 0;*/ /* top: 0;*/ /* z-index: 1;*/ /* width: 100%;*/ /* height: 100%;*/ /* opacity: 0.8;*/ /*}*/ .YQintroTwo .title { font-size: 48px; text-align: center; line-height: 1; padding: 110px 0 50px 0; color: #fff; } .YQintroTwo .txt { font-size: 22px; line-height: 1.8; color: #333; text-align: center; position: relative; z-index: 1; } .YQintroTwo .img { max-width: 1600px; margin: 0 auto; position: relative; padding: 0.2rem 0; } .YQintroTwo img { width: 100%; min-width: 1; } @media screen and (max-width: 1680px) { .YQintroTwo .title { font-size: 40px; padding: 70px 0 60px 0; } .YQintroTwo .txt { font-size: 20px; } } @media screen and (max-width: 1380px) { .YQintroTwo .title { font-size: 35px; padding: 60px 0 50px 0; } .YQintroTwo .txt { font-size: 18px; } } @media screen and (max-width: 1250px) { .YQintroTwo .title { font-size: 32px; padding: 55px 0 40px 0; } .YQintroTwo .txt { font-size: 16px; } } @media screen and (max-width: 1024px) { .YQintroTwo .title { font-size: 30px; padding: 40px 0 30px 0; } } @media screen and (max-width: 910px) { .YQintroTwo .title { font-size: 28px; padding: 35px 0 25px 0; font-weight: 700; } } /*YQintroThree*/ .YQintroThree { background: #f7f7f7; } .YQintroThree .title { font-size: 48px; text-align: center; line-height: 1; padding: 110px 0 50px 0; } .YQintroThree .ul { overflow: hidden; } .YQintroThree dl { width: 31.33333333333333%; background: #fff; float: left; } .YQintroThree dl:nth-child(2) { margin: 0 3%; } .YQintroThree dl dt { width: 92px; height: 92px; margin: 40px auto 0 auto; } .YQintroThree dl dt img { width: 100%; height: 100%; } .YQintroThree dl .dd1 { font-size: 25px; padding: 28px 10px 20px 10px; text-align: center; } .YQintroThree dl .dd2 { line-height: 2; font-size: 15px; color: #656565; padding: 0 60px; height: 200px; padding-bottom: 50px; } .YQintroThree .img { max-width: 1600px; margin: 0 auto; position: relative; padding: 0.75rem 0; } .YQintroThree img { width: 100%; min-width: 1; } @media screen and (max-width: 1680px) { .YQintroThree .title { font-size: 40px; padding: 70px 0 60px 0; } .YQintroThree .txt { font-size: 20px; } .YQintroThree dl dt { width: 85px; height: 85px; } .YQintroThree dl .dd1 { font-size: 18px; } .YQintroThree dl .dd2 { font-size: 13px; height: 180px; padding: 0 40px; padding-bottom: 40px; } } @media screen and (max-width: 1380px) { .YQintroThree .title { font-size: 35px; padding: 60px 0 50px 0; } .YQintroThree .txt { font-size: 18px; } } @media screen and (max-width: 1250px) { .YQintroTwo .img{height:auto !important;} .YQintroThree .title { font-size: 32px; padding: 55px 0 40px 0; } .YQintroThree .txt { font-size: 16px; } .YQintroThree dl { width: 32.33333333333333%; } .YQintroThree dl:nth-child(2) { margin: 0 1.5%; } .YQintroThree dl dt { width: 80px; height: 80px; margin-top: 30px; } .YQintroThree dl .dd1 { font-size: 18px; padding: 22px 8px 16px 8px; } .YQintroThree dl .dd2 { font-size: 13px; height: 160px; padding: 0 30px; padding-bottom: 30px; } } @media screen and (max-width: 1024px) { .YQintroThree .title { font-size: 30px; padding: 35px 0 25px 0; font-weight: 700; } .YQintroThree dl { width: 32.33333333333333%; } .YQintroThree dl:nth-child(2) { margin: 0 1.5%; } .YQintroThree dl dt { width: 70px; height: 70px; } .YQintroThree dl .dd1 { font-size: 13px; padding: 20px 8px 14px 8px; } .YQintroThree dl .dd2 { font-size: 12px; height: 140px; padding: 0 20px; padding-bottom: 20px; } } @media screen and (max-width: 910px) { .YQintroThree .title { font-size: 35px; padding: 60px 0 50px 0; } .YQintroThree dl { width: 100%; margin: 0 0 0.3rem 0 !important; } .YQintroThree dl:last-child { margin-bottom: 0 !important; } .YQintroThree dl .dd1 { font-size: 18px; } .YQintroThree dl .dd2 { height: auto !important; font-size: 16px; } } /*YQintroFour*/ .YQintroFour .title { font-size: 48px; text-align: center; line-height: 1; padding: 110px 0 50px 0; } .YQintroFour ul { overflow: hidden; margin-top: 0.3rem; } .YQintroFour ul li { width: 31.25%; float: left; margin-right: 3.125%; margin-bottom: 0.2rem; } .YQintroFour ul li:nth-child(3n + 3) { margin-right: 0; } .YQintroFour ul li .img { width: 100%; position: relative; } .YQintroFour ul li .img img { width: 100%; } .YQintroFour ul li .img .mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; background: rgba(0, 0, 0, 0.7); padding: 0.2rem; box-sizing: border-box; opacity: 0; transition: all 0.2s ease 0s; } .YQintroFour ul li .img .mask .txt { font-size: 18px; color: #fff; line-height: 1.8; padding-left: 0.2rem; position: relative; } .YQintroFour ul li .img .mask .txt::after { content: ""; width: 5px; height: 5px; background: #00b3c3; position: absolute; left: 0; top: 18px; border-radius: 5px; } .YQintroFour ul li .img .icon { padding-left: 0.2rem; margin-top: 0.3rem; } .YQintroFour ul li .img .icon .hr { width: 0rem; height: 1px; background: #00b3c3; display: block; transition: all 0.2s ease 0s; } .YQintroFour ul li .img .icon .i { width: 0.5rem; height: 0.5rem; background: #00b3c3; display: block; border-radius: 50%; line-height: 0.5rem; margin-left: 0.2rem; color: #fff; text-align: center; } .YQintroFour ul li .text { text-align: center; font-size: 0.15rem; line-height: 1.8; padding: 10px 0; } .YQintroFour ul li:hover .img .mask { opacity: 1; transition: all 0.2s ease 0s; } .YQintroFour ul li:hover .img .icon .hr { width: 0.65rem; transition: all 0.2s ease 0s; } @media screen and (max-width: 1680px) { .YQintroFour .title { font-size: 40px; padding: 70px 0 60px 0; } .YQintroFour ul li .img .mask .txt { font-size: 18px; } } @media screen and (max-width: 1440px) { .YQintroFour .title { font-size: 35px; padding: 60px 0 50px 0; } .YQintroFour ul li .img { width: 100%; position: relative; } .YQintroFour ul li .img .mask .txt { font-size: 13px; } .YQintroFour ul li .img .icon .i { width: 0.4rem; height: 0.4rem; line-height: 0.4rem; text-align: center; } } @media screen and (max-width: 1250px) { .YQintroFour .title { font-size: 32px; padding: 55px 0 40px 0; } .YQintroFour ul li .img .icon { margin-top: 0.1rem; } } @media screen and (max-width: 1024px) { .YQintroFour .title { font-size: 30px; padding: 35px 0 25px 0; font-weight: 700; } .YQintroFour ul li .text { font-size: 16px; } .YQintroFour ul li { width: 48%; margin-right: 0; } .YQintroFour ul li .img { width: 100%; position: relative; } .YQintroFour ul li .img .mask .txt { font-size: 14px; } .YQintroFour ul li:nth-child(3n + 3) { margin-right: 0; } .YQintroFour ul li:nth-child(2n + 2) { float: right; } .YQintroFour ul li .img .icon .i { width: 0.3rem; height: 0.3rem; line-height: 0.3rem; font-size: 12px; } } @media screen and (max-width: 910px) { .YQintroFour .title { font-size: 35px; padding: 60px 0 50px 0; } .YQintroFour ul li .img { width: 100%; position: relative; } .YQintroFour ul li .text { font-size: 14px; } .YQintroFour ul li .img .mask { display: none; } } /*YQintroFour-ul2*/ .YQintroFour .ul2 li { width: 100%; padding: 0.6rem 0; } .YQintroFour .introLeft { width: 50%; position: relative; } .YQintroFour .introLeft img { width: 100%; z-index: 1; position: relative; } .YQintroFour .introRight { width: 50%; font-size: 22px; line-height: 1.9; position: relative; box-sizing: border-box; } .YQintroFour .introRight h2 { font-size: 30px; font-weight: 700; color: #000000; line-height: 1.3; margin-bottom: 0.5rem; } .YQintroFour .ul2 li:nth-child(odd) .introRight { padding-left: 3%; } .YQintroFour .ul2 li:nth-child(even) .introRight { padding-right: 3%; } .YQintroFour .ul2 li:nth-child(odd) .introLeft1 { display: block; } .YQintroFour .ul2 li:nth-child(odd) .introLeft2 { display: none; } .YQintroFour .ul2 li:nth-child(even) .introLeft1 { display: none; } .YQintroFour .ul2 li:nth-child(even) .introLeft2 { display: block; } @media screen and (max-width: 1680px) { .YQintroFour .introRight h2 { margin-bottom: 0.4rem; font-size: 26px; } .YQintroFour .introRight { font-size: 20px; } .YQintroFour .introRight * { font-size: 20px; } } @media screen and (max-width: 1380px) { .YQintroFour .introRight h2 { margin-bottom: 0.3rem; } .YQintroFour .introRight { font-size: 18px; } .YQintroFour .introRight * { font-size: 18px; } } @media screen and (max-width: 1250px) { .YQintroFour .introRight h2 { font-size: 22px; } .YQintroFour .introRight { font-size: 16px; } .YQintroFour .introRight * { font-size: 16px; } } @media screen and (max-width: 1024px) { .YQintroFour .introRight h2 { margin-bottom: 0.2rem; font-size: 18px; } .YQintroFour .introLeft { float: left; } .YQintroFour .introRight { float: right; top: 0; } } @media screen and (max-width: 910px) { .YQintroFour .ul2 li { border-bottom: none; box-shadow: 0 0 8px rgba(0, 0, 0, 0.1); } .YQintroFour .ul2 li a { display: block; } .YQintroFour .ul2 li .introLeft1 { display: block !important; padding: 0; } .YQintroFour .ul2 li .introLeft2 { display: none !important; padding: 0; } .YQintroFour .introLeft { width: calc(100% - 0.2rem); } .YQintroFour .introRight { width: 100%; margin-top: 0.5rem; padding: 0; } } /****+++++++++++++author锛歰upan++++++++++++++++++++++++++++++++++++++++++++++++ /****+++++++++++++time:2022-11-14 20:51++++++++++++++++++++++++++++++++++++++++ /*************>>>>>>>>>>>>鏍稿績涓氬姟--澶ф皵娌荤悊<<<<<<<<<<<<<<<<<<<<<<*************/ /****YQcommonTit 鍏叡title*/ .YQcommonTit { text-align: center; } .YQcommonTit h4 { color: #333333; font-size: 36px; line-height: 50px; } .YQcommonTit h4::after { content: ""; display: block; width: 67px; height: 4px; background: #03b9c5; margin: 20px auto 0 auto; } .introContent { font-size: 22px; line-height: 1.9; margin-top: 30px; overflow: hidden; text-align: center; color: #333333; } .businessE .YQcommonTit { margin-top: 120px; overflow: hidden; } .YQintrobusinessEcase { overflow: hidden; height: auto; width: 100%; margin-top: 0.8rem; } .YQintrobusinessEcase .ul2 .introRight h2 { overflow: hidden; font-size: 30px; color: #000; width: 72%; display: block; margin-top: 0.3rem; } .YQintrobusinessEcase .ul2 .introRight p { padding-left: 0; margin-top: 0.3rem; } .YQintrobusinessEcase .ul2 .introRight p::after { display: none; } .YQintro .YQintrobusinessEcase .introRight { width: 45%; } .lables { width: 1.9rem; height: 0.5rem; text-align: center; line-height: 0.5rem !important; color: #fff; font-size: 0.3rem !important; border-radius: 0.25rem; background: #03bac6; font-weight: 600; } .YQintro.businessE .YQtab a { width: 25%; } .businessG .YQtitle { text-align: left; font-size: 36px; padding-top: 0.2rem; font-weight: 600; } .businessG { margin-top: 1.2rem; } .YQuntroThreeG { background: #059ba4 url(../images/YQ_7bg.png) no-repeat center; position: relative; background-size: cover; } .YQuntroThreeG .img, .YQintroThreeH .img { width: 100%; max-width: 1490px; margin: 0 auto; position: relative; } .YQuntroThreeG .img img, .YQintroThreeH .img img { width: 100%; object-fit: cover; } .YQintroThreeH dl .dd2 { height: 150px; } @media screen and (max-width: 1440px) { .YQcommonTit h4 { font-size: 28px; font-weight: 500; } .YQintrobusinessEcase .ul2 .introRight h2 { line-height: 1.6; width: 80%; font-weight: 500; font-size: 26px; } .introContent { font-size: 18px; } .businessG .YQtitle { font-size: 32px; padding-bottom: 0.5rem; } .businessG { margin-top: 0.6rem; } .YQintro .introRight, .YQintro .introRight * { font-size: 14px; } .lables { font-size: 24px !important; } .YQintrobusinessEcase .ul2 .introRight p { margin-top: 0.18rem; } .YQintrobusinessEcase { overflow: visible; } } @media screen and (max-width: 1250px) { .YQintrobusinessEcase .ul2 .introRight h2 { width: 95%; font-size: 24px; } .introContent { font-size: 16px; } .lables { font-size: 22px !important; } .YQintroFours ul li a .text { font-size: 18px; } } @media screen and (max-width: 1080px) { .YQcommonTit h4 { font-size: 28px; } .YQintrobusinessEcase .ul2 .introRight h2 { font-size: 24px; width: 90%; } .lables { font-size: 0.28rem !important; } .introContent { font-size: 18px; } .businessE .YQcommonTit { margin-top: 0rem; } .YQintro .introRight { font-size: 12px; } .businessG .YQtitle { padding: 0; font-size: 22px; } .businessG { margin-top: 0; } } @media screen and (max-width: 910px) { .YQintro.businessE .introLeft { width: 100%; overflow: hidden; float: none; } .YQintrobusinessEcase .ul2 li a { display: block; } .YQintro .YQintrobusinessEcase .introRight { float: none; width: 100%; } .businessE .YQcommonTit { margin-top: -0.2rem; } .YQintrobusinessEcase .ul2 .introRight h2 { font-size: 16px; } .YQintrobusinessEcase { margin-top: 0.5rem; } } @media screen and (max-width: 768px) { .YQcommonTit h4 { font-size: 20px; } .YQintro.businessG { margin-bottom: 0; } .YQcommonTit h4::after { margin: 0.1rem auto; } .introContent { font-size: 14px; padding: 0.3rem; margin-top: 0; } .lables { font-size: 14px !important; width: 100px; height: 30px; line-height: 30px !important; } .YQintrobusinessEcase .ul2 .introRight h2 { width: 100%; } .YQintro .introRight *, .YQintro .introRight { font-size: 14px; } .businessG { margin-top: 0.3rem; } .YQcommonTit h4::after { width: 60px; } .YQintro .introRight { margin-top: 0.3rem; } .YQintrobusinessEcase .ul2 .introRight h2 { margin-top: 0.2rem; } .YQtab.YQtab1, .YQtab { display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; } .YQtab a { height: 40px; line-height: 40px; border-radius: 0.2rem; border: none; font-size: 14px; display: block; width: 47% !important; margin: 10px 0; float: left; } .YQtab a.on { border-radius: 50px; } .YQintroThree dl .dd2 { font-size: 14px; text-align: center; } .YQintroFour .introRight * { font-size: 14px; } .YQintrobusinessEcase { margin-top: 0.3rem; } .YQintrobusinessEcase .ul2 .introRight p { margin-top: 0.1rem; } .YQintroFour ul { margin-top: 0.1rem; } }