.tab-controls{ text-align: center; font-size: 0; overflow: hidden; border-bottom: 1px solid rgba(85,85,85,0.2); overflow-x: auto; white-space: nowrap; } .tab-controls a{ padding: 4em 0 2.5em; width: 9em; font-size: 18px; color: #555; position: relative; -webkit-transition: color 0.5s; transition: color 0.5s; display: inline-block; } .tab-controls a::after{ content: ""; border-left: 1px solid rgba(85,85,85,0.2); position: absolute; left: 0; top: 4em; bottom: 2.5em; width: 100%; } .tab-controls a:last-child::after{ border-right: 1px solid rgba(85,85,85,0.2); } .tab-controls a.active{ font-weight: 500; color: #0c67ba; } .tab-controls a::before{ content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background-color: transparent; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; } .tab-controls a.active::before{ background-color: #0c67ba; } .tab-controls a span{ position: relative; } .tab-controls a img{ width: auto; height: 1.7em; position: absolute; left: -1em; bottom: 0; opacity: 0; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; } .tab-controls a.active img{ opacity: 0.15; } @media only screen and (min-width:1024px){ .tab-controls a:hover{ font-weight: 500; color: #0c67ba; } .tab-controls a:hover img{ opacity: 0.15; } } @media only screen and (max-width:1366px){ .tab-controls a{ font-size: 15.75px; } } @media only screen and (max-width:1024px){ .tab-controls a{ font-size: 0.703125rem; } } .section-content.style1 .section{ padding: 7.03125% 0;/*135 0*/ font-size: 16px; } .section-content.style1 .section:nth-child(1){ padding: 7.8125% 0 7.03125%;/*150 0 135*/ } .section-content.style1 .section:nth-child(even){ background-color: #f4f4f4; } .section-content.style1 .section .inner{ -webkit-display: flex; -webkit-align-items: flex-start; -webkit-justify-content: space-between; -webkit-flex-wrap: wrap; display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; } .section-content.style1 .section:nth-child(odd) .inner{ -webkit-flex-direction: row-reverse; flex-direction: row-reverse; } .section-content.style1 .section:nth-child(even) .inner{ -webkit-flex-direction: row; flex-direction: row; } .section-content.style1 .section .text-box{ width: 720px; max-width: 60%; color: #666; opacity: 0; -webkit-transition-property: transform,opacity; -webkit-transition-duration: 1s,1s; transition-property: transform,opacity; transition-duration: 1s,1s; -webkit-transform: translateY(25%); transform: translateY(25%); } .section-content.style1 .section:nth-child(odd) .text-box{ -webkit-transition-delay: 0.5s,0.5s; transition-delay: 0.5s,0.5s; } .section-content.style1 .section .text-box.actived{ opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .section-content.style1 .section .text-box h3{ font-size: 2.625em; color: #333333; margin-bottom: 3.333%;/*24*/ } .section-content.style1 .section .text-box p.indent2em{ text-indent: 2em; font-size: 1.125em; color: inherit; line-height: 1.78; margin-bottom: 0.56em; } .section-content.style1 .section .text-box p.indent2em:last-child{ margin-bottom: 0; } .section-content.style1 .section .text-box .line{ width: 100%; height: 1px; background-color: rgba(0,0,0,0.1); margin: 6.94% 0;/*50 0*/ } .section-content.style1 .section .text-box .des{ margin-bottom: 9.444%;/*68*/ } .section-content.style1 .section .text-box .des li{ margin-bottom: 7.36%;/*53*/ padding-left: 3.333em; position: relative; } .section-content.style1 .section .text-box .des li:last-child{ margin-bottom: 0; } .section-content.style1 .section .text-box .des img{ position: absolute; left: 0; top: 0.5em; width: auto; height: 1.67em; } .section-content.style1 .section .text-box .des p{ font-size: 1.125em; color: inherit; line-height: 1.78; margin-bottom: 0.56em; } .section-content.style1 .section .text-box .des p:last-child{ margin-bottom: 0; } .section-content.style1 .section .text-box .des p b{ color: #0c67ba; } .section-content.style1 .section .text-box .contact-box{ background-color: #e6f0f8; -webkit-display: flex; -webkit-align-items: center; -webkit-justify-content: space-between; -webkit-flex-direction: row; -webkit-flex-wrap: wrap; display: flex; align-items: center; justify-content: space-between; flex-direction: row; flex-wrap: wrap; padding: 2.5% 5.56%;/*18 40*/ } .section-content.style1 .section .text-box .contact-box li{ margin-bottom: 2.03125%; } .section-content.style1 .section .text-box .contact-box li:last-child{ margin-bottom: 0; -webkit-flex-grow: 1; flex-grow: 1; } .section-content.style1 .section .text-box .contact-box li.linever{ border-right: 1px solid rgba(70,86,115,0.2); height: 2.33em; } .section-content.style1 .section .text-box .contact-box p{ font-size: inherit; color: inherit; line-height: 1.75; } .section-content.style1 .section .text-box .contact-box p b{ color: #333; } .section-content.style1 .section .text-box .contact-box p a{ font-size: inherit; color: inherit; } .section-content.style1 .section .img-box{ opacity: 0; -webkit-transition: transform 1s,opacity 1s; transition: transform 1s,opacity 1s; width: 27.0833%; position: relative; opacity: 0; -webkit-transition-property: transform,opacity; -webkit-transition-duration: 1s,1s; transition-property: transform,opacity; transition-duration: 1s,1s; -webkit-transform: translateY(25%); transform: translateY(25%); } .section-content.style1 .section:nth-child(even) .img-box{ -webkit-transition-delay: 0.5s,0.5s; transition-delay: 0.5s,0.5s; } .section-content.style1 .section .img-box.actived{ opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .section-content.style1 .section .img-box .cover{ width: 76.923%; margin-top: -77.95%; } .section-content.style1 .section:nth-child(odd) .img-box .cover{ margin-left: 60%; } .section-content.style1 .section:nth-child(even) .img-box .cover{ margin-left: -38.718%; } @media only screen and (max-width:1366px){ .section-content.style1 .section{ font-size: 14px; } } @media only screen and (max-width:1024px){ .section-content.style1 .section{ font-size: 0.625rem; padding: 12% 0;/*135 0*/ } .section-content.style1 .section:nth-child(1){ padding: 12% 0 10%;/*150 0 135*/ } .section-content.style1 .section .inner{ -webkit-display: block; display: block; } .section-content.style1 .section .text-box{ max-width: 100%; } .section-content.style1 .section:nth-child(odd) .text-box{ -webkit-transition-delay: 0s,0s; transition-delay: 0s,0s; } .section-content.style1 .section .text-box .line{ margin: 5% 0;/*50 0*/ } .section-content.style1 .section .text-box .des{ margin-bottom: 5%;/*68*/ } .section-content.style1 .section .text-box .des li{ margin-bottom: 5%;/*53*/ } .section-content.style1 .section .img-box{ margin-top: 10%; width: 60%; } .section-content.style1 .section:nth-child(odd) .img-box{ margin-left: 10%; } .section-content.style1 .section:nth-child(even) .img-box{ margin-left: 30%; -webkit-transition-delay: 0s,0s; transition-delay: 0s,0s; } } .section-content.style2 .section{ font-size: 16px; } .section-content.style2 .section{ padding: 8.02% 0 0;/*154 0 198*/ } .section-content.style2 .section:last-child{ padding: 8.02% 0 10.3125%;/*154 0 198*/ } .section-content.style2 .section .inner{ -webkit-display: flex; -webkit-align-items: center; -webkit-justify-content: space-between; -webkit-flex-wrap: wrap; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; } .section-content.style2 .section:nth-child(odd) .inner{ -webkit-flex-direction: row-reverse; flex-direction: row-reverse; } .section-content.style2 .section:nth-child(even) .inner{ -webkit-flex-direction: row; flex-direction: row; } .section-content.style2 .section .text-box{ width: 782px; max-width: 60%; color: #333; opacity: 0; -webkit-transition-property: transform,opacity; -webkit-transition-duration: 1s,1s; transition-property: transform,opacity; transition-duration: 1s,1s; -webkit-transform: translateY(25%); transform: translateY(25%); } .section-content.style2 .section:nth-child(odd) .text-box{ -webkit-transition-delay: 0.5s,0.5s; transition-delay: 0.5s,0.5s; } .section-content.style2 .section .text-box.actived{ opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .section-content.style2 .section .text-box h3{ font-size: 2em; color: inherit; line-height: 1.5; margin-bottom: 8.6%;/*67*/ } .section-content.style2 .section .text-box ul{ margin-bottom: 7.82%;/*61*/ -webkit-display: flex; -webkit-align-items: flex-start; -webkit-justify-content: space-between; -webkit-flex-direction: row; display: flex; align-items: flex-start; justify-content: space-between; flex-direction: row; } .section-content.style2 .section .text-box ul.left{ -webkit-justify-content: flex-start; justify-content: flex-start; } .section-content.style2 .section .text-box ul.left li{ margin-right: 14.1%;/*110*/ } .section-content.style2 .section .text-box ul.left li:last-child{ margin-right: 0; } .section-content.style2 .section .text-box h4{ font-size: inherit; color: #0c67ba; margin-bottom: 0.5em; font-weight: bold; position: relative; display: inline-block; vertical-align: top; } .section-content.style2 .section .text-box h4 > span{ position: relative; } .section-content.style2 .section .text-box h4 .plus{ position: absolute; left: 0.0625em; bottom: 100%; font-size: 1.25em; font-style: normal; font-weight: 500; margin-bottom: -0.1em; } .section-content.style2 .section .text-box h4 b,.section-content.style2 .section .text-box h4 b.odometer{ font-size: 2em; line-height: 1; vertical-align: baseline; } .section-content.style2 .section .text-box h5{ font-size: 0.875em; color: inherit; font-weight: normal; } .section-content.style2 .section .text-box p{ font-size: 1.125em; color: inherit; line-height: 1.78; text-indent: 2em; text-align: justify; margin-bottom: 12.18%;/*95*/ } .section-content.style2 .section .text-box .link{ font-size: 1.125em; color: #0c67ba; } .section-content.style2 .section .text-box .link span{ display: inline-block; vertical-align: middle; position: relative; } .section-content.style2 .section .text-box .link span::before{ content: ""; position: absolute; left: 0; top: 100%; width: 100%; height: 2px; background-color: #0c67ba; opacity: 0.2; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; margin-top: 0.333em; } .section-content.style2 .section .text-box .link img{ width: auto; height: 0.5em; margin-left: 0.7em; vertical-align: middle; } .section-content.style2 .section .img-box{ width: 36.111%;/*520*/ opacity: 0; -webkit-transition-property: transform,opacity; -webkit-transition-duration: 1s,1s; transition-property: transform,opacity; transition-duration: 1s,1s; -webkit-transform: translateY(25%); transform: translateY(25%); } .section-content.style2 .section:nth-child(even) .img-box{ -webkit-transition-delay: 0.5s,0.5s; transition-delay: 0.5s,0.5s; } .section-content.style2 .section .img-box.actived{ opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } @media only screen and (min-width:1024px){ .section-content.style2 .section .text-box .link:hover span::before{ opacity: 1; } } @media only screen and (max-width:1366px){ .section-content.style2 .section{ font-size: 14px; } } @media only screen and (max-width:1024px){ .section-content.style2 .section{ font-size: 0.625rem; } .section-content.style2 .section{ padding: 10% 0 0;/*154 0 198*/ } .section-content.style2 .section:last-child{ padding: 10% 0 15%;/*154 0 198*/ } .section-content.style2 .section .inner{ -webkit-display: block; display: block; } .section-content.style2 .section .text-box{ max-width: 100%; } .section-content.style2 .section:nth-child(odd) .text-box{ -webkit-transition-delay: 0s,0s; transition-delay: 0s,0s; } .section-content.style2 .section .text-box h3{ margin-bottom: 5%;/*67*/ } .section-content.style2 .section .text-box ul{ margin-bottom: 5%;/*61*/ -webkit-display: block; display: block; font-size: 1em; } .section-content.style2 .section .text-box ul.left li{ margin-right: 14.1%;/*110*/ } .section-content.style2 .section .text-box ul li{ margin-bottom: 5%; } .section-content.style2 .section .text-box ul li:last-child{ margin-bottom: 0; } .section-content.style2 .section .text-box h5{ font-size: 1em; } .section-content.style2 .section .img-box{ width: 70%;/*520*/ margin: 10% auto 0; } .section-content.style2 .section:nth-child(even) .img-box{ -webkit-transition-delay: 0s,0s; transition-delay: 0s,0s; } } .section-content.style3 .section{ font-size: 16px; color: #333; } .section-content.style3 .section .inner{ -webkit-display: flex; -webkit-align-items: flex-start; -webkit-justify-content: space-between; -webkit-flex-wrap: wrap; display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; border-bottom: 1px solid rgba(0,0,0,0.1); padding: 6.25% 0;/*120 0*/ } .section-content.style3 .section:last-child .inner{ border-bottom: 0 none; } .section-content.style3 .section:first-child .inner{ padding: 7.8125% 0 6.25%;/*137 0 120*/ } .section-content.style3 .section:last-child .inner{ padding: 6.25% 0 10.15625%;/*120 0 195*/ } .section-content.style3 .section:nth-child(odd) .inner{ -webkit-flex-direction: row-reverse; flex-direction: row-reverse; } .section-content.style3 .section:nth-child(even) .inner{ -webkit-flex-direction: row; flex-direction: row; } .section-content.style3 .section .text-box{ width: 54.3%; opacity: 0; -webkit-transition-property: transform,opacity; -webkit-transition-duration: 1s,1s; transition-property: transform,opacity; transition-duration: 1s,1s; -webkit-transform: translateY(25%); transform: translateY(25%); } .section-content.style3 .section:nth-child(odd) .text-box{ -webkit-transition-delay: 0.5s,0.5s; transition-delay: 0.5s,0.5s; } .section-content.style3 .section .text-box.actived{ opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .section-content.style3 .section .text-box h3{ font-size: 2em; color: inherit; line-height: 1.5; margin-bottom: 2.813%;/*22*/ } .section-content.style3 .section .text-box p.indent2em{ text-indent: 2em; font-size: 1.125em; color: inherit; line-height: 1.78; margin-bottom: 0.56em; } .section-content.style3 .section .text-box p.indent2em:last-child{ margin-bottom: 0; } .section-content.style3 .section .img-box{; width: 36.111%; opacity: 0; -webkit-transition-property: transform,opacity; -webkit-transition-duration: 1s,1s; transition-property: transform,opacity; transition-duration: 1s,1s; -webkit-transform: translateY(25%); transform: translateY(25%); } .section-content.style3 .section:nth-child(even) .img-box{ -webkit-transition-delay: 0.5s,0.5s; transition-delay: 0.5s,0.5s; } .section-content.style3 .section .img-box.actived{ opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .section-content.style3 .section ul{ -webkit-display: flex; -webkit-align-items: flex-start; -webkit-justify-content: flex-start; -webkit-flex-direction: row; -webkit-flex-wrap: wrap; display: flex; align-items: flex-start; justify-content: flex-start; flex-direction: row; flex-wrap: wrap; } .section-content.style3 .section ul.column2{ margin-top: 20.2%;/*105*/ } .section-content.style3 .section ul.column3{ margin-top: 14.45%;/*113*/ } .section-content.style3 .section ul.column2 li{ width: 25%; } .section-content.style3 .section ul.column3 li{ width: 33.333%; } .section-content.style3 .section h4{ font-size: inherit; color: #0c67ba; margin-bottom: 0.5em; font-weight: 500; position: relative; display: inline-block; vertical-align: top; } .section-content.style3 .section h4 span{ position: relative; } .section-content.style3 .section h4 .plus{ position: absolute; left: 0.0625em; bottom: 100%; font-size: 1.25em; font-style: normal; font-weight: 500; margin-bottom: -0.1em; } .section-content.style3 .section h4 b,.section-content.style3 .section h4 b.odometer{ font-size: 2em; line-height: 1; vertical-align: baseline; } .section-content.style3 .section h5{ font-size: 0.875em; color: inherit; font-weight: normal; } @media only screen and (max-width:1366px){ .section-content.style3 .section{ font-size: 14px; } } @media only screen and (max-width:1024px){ .section-content.style3 .section{ font-size: 0.625rem; } .section-content.style3 .section .inner{ -webkit-display: block; display: block; padding: 10% 0;/*120 0*/ } .section-content.style3 .section:first-child .inner{ padding: 12.5% 0 10%;/*137 0 120*/ } .section-content.style3 .section:last-child .inner{ padding: 10% 0 15%;/*120 0 195*/ } .section-content.style3 .section .text-box{ width: 100%; } .section-content.style3 .section:nth-child(odd) .text-box{ -webkit-transition-delay: 0s,0s; transition-delay: 0s,0s; } .section-content.style3 .section .text-box h3{ margin-bottom: 2.813%;/*22*/ } .section-content.style3 .section .img-box{ width: 100%; margin: 10% auto 0; } .section-content.style3 .section:nth-child(even) .img-box{ -webkit-transition-delay: 0s,0s; transition-delay: 0s,0s; } .section-content.style3 .section .img-box img{ display: block; margin: 0 auto; width: 70%; } .section-content.style3 .section ul.column2{ margin-top: 10%;/*105*/ -webkit-justify-content: space-between; justify-content: space-between; } .section-content.style3 .section ul.column3{ margin-top: 10%;/*113*/ -webkit-justify-content: space-between; justify-content: space-between; } .section-content.style3 .section ul.column2 li{ width: auto; } .section-content.style3 .section ul.column3 li{ width: auto; } } /*新增信件按钮和弹框*/ .section-content.style1 .btn-letter{ font-size: 1.125em; color: #0c67ba; display: block; margin-bottom: 7.36%;/*53*/ margin-top: -3.47%;/*-25*/ } .section-content.style1 .btn-letter .inline{ display: inline-block; border-bottom: 1px solid rgba(12,103,186,0.5); cursor: pointer; line-height: 1.67em; } .section-content.style1 .btn-letter span{ vertical-align: middle; } .section-content.style1 .btn-letter img{ vertical-align: middle; width: 1.278em; margin-left: 0.78em; -webkit-transition: transform 0.5s; transition: transform 0.5s; -webkit-transform: translateX(-15%); transform: translateX(-15%); } @media only screen and (min-width:1024px){ .section-content.style1 .btn-letter .inline:hover{ border-color: rgba(12,103,186,1); } .section-content.style1 .btn-letter .inline:hover img{ -webkit-transform: translateX(0); transform: translateX(0); } } @media only screen and (max-width:1024px){ .section-content.style1 .btn-letter img{ -webkit-transform: translateX(0); transform: translateX(0); } } .pop-cover{ position: fixed; left: 0; top: 0; z-index: 99; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); display: none; overflow-y: auto; } .pop-cover.active{ display: block; } .pop-cover .pop-box{ display: none; background-color: #fff; width: 1146px; max-width: 90%; padding: 3.02% 3.23%;/*58 62 114*/ position: absolute; margin: 3% auto; left: 0; right: 0; } .pop-cover .pop-box.active{ display: block; } .pop-cover .close{ cursor: pointer; position: absolute; right: 1.25em; top: 1.375em; width: 1.375em; opacity: 0.8; } .pop-cover h3{ font-size: 2.25em; color: #333333; font-weight: normal; text-align: center; margin-bottom: 0.89em; } .pop-cover li{ text-indent: 2em; text-align: justify; font-size: 1em; color: #333; line-height: 2.1875; border-bottom: 1px solid rgba(51,51,51,0.1); } .pop-cover li.noindent{ text-indent: 0; } .pop-cover li.align-right{ text-indent: 0; text-align: right; } .pop-cover li a{ color: inherit; } @media only screen and (max-width:1024px){ .pop-cover .pop-box{ padding: 2em;/*58 62 114*/ margin: 2em auto; } }