.load-more-state { text-align: center; opacity: 0.7; padding-top: 20px; } .load-more-state > .state.loading, .load-more-state > .state.end { display: none; } .load-more-state > .state > i { font-size: 150%; opacity: 0.5; display: inline-block; margin-right: 5px; } .load-more-state > .state.loading > i { animation: xuanzhuan 2s ease-out infinite; } @keyframes xuanzhuan { 0% { transform: rotateZ(0); } 100% { transform: rotateZ(360deg); } } .load-more-state.loading > .state.default, .load-more-state.loading > .state.end { display: none; } .load-more-state.loading > .state.loading { display: block; } .load-more-state.end > .state.default, .load-more-state.end > .state.loading { display: none; } .load-more-state.end > .state.end { display: block; } .load-more-state.active { background-color: #127fc3; color: #fff; } .compensate-for-scrollbar { padding-right: 0!important; } .swiper-timing { height: 8px; } @media (min-width: 769px) { .swiper-timing { height: 2em!important; } } .swiper-timing > .swiper-pagination-bullet { vertical-align: top; cursor: pointer; } @media (min-width: 769px) { .swiper-timing > .swiper-pagination-bullet { width: 2em; height: 2em; line-height: 2em; background-color: transparent!important; opacity: 1; } .swiper-timing > .swiper-pagination-bullet:not(:last-child) { margin: 0 0.3rem 0 0 !important; } } @media (max-width: 768px) { .swiper-timing > .swiper-pagination-bullet { background-color: #fff; } } .swiper-timing > .swiper-pagination-bullet .cls-1, .swiper-timing > .swiper-pagination-bullet .cls-2 { fill: none; stroke-width: 1; } .swiper-timing > .swiper-pagination-bullet .cls-1 { stroke: transparent; } .swiper-timing > .swiper-pagination-bullet .cls-3 { fill: #fff; } .swiper-timing > .swiper-pagination-bullet.swiper-pagination-bullet-active .cls-2 { stroke: #fff; stroke-dasharray: 0, 141.3; animation-name: banner-swiper; animation-timing-function: linear; animation-iteration-count: infinite; } @keyframes banner-swiper { 0% { stroke-dasharray: 0, 141.3; } 100% { stroke-dasharray: 141.3, 0; } } .swiper-timing.web > .swiper-pagination-bullet > svg > .cls-3 { fill: #9a9a9a; } .swiper-timing.web > .swiper-pagination-bullet > svg > .cls-2 { fill: none; } .swiper-timing.web > .swiper-pagination-bullet.swiper-pagination-bullet-active > svg > .cls-3 { fill: #127fc3; } .swiper-timing.web > .swiper-pagination-bullet.swiper-pagination-bullet-active > svg > .cls-2 { stroke: #127fc3; } .swiper-pagination.default { position: relative; left: auto!important; z-index: 10; bottom: auto; margin: 0.3rem auto 0; padding-top: 20px; transform: translate(0, 0) !important; height: 8px; } .swiper-pagination.default > .swiper-pagination-bullet { vertical-align: top; background-color: #000; } .swiper-pagination.default > .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #127fc3; } .swiper-pagination.default.white > .swiper-pagination-bullet { background-color: #fff; } .go { width: 1.8em; height: 1.8em; text-align: center; line-height: 1.8em; border: 1px solid #999999; color: #999; border-radius: 100%; } .go > i { font-size: 0.7em; display: block; } a.more .font-num, a.button .font-num, a.mr .font-num { line-height: 1; /*padding-top: 0.06rem;*/ } a.more i:first-child, a.button i:first-child, a.mr i:first-child { margin-right: 6px; } a.more i:last-child, a.button i:last-child, a.mr i:last-child { margin-left: 6px; } a.button { width: 13.6em; height: 2.5em; border-radius: 2.5em; background-color: #127fc3; color: #fff; margin: 2.5em auto 0; } a:hover .go { border-color: #4fb02a; background-color: #4fb02a; color: #fff; } a:hover .mr { color: #4fb02a; } .mr:hover { color: #4fb02a; } .more { border-style: solid; border-width: 1px; width: 90px; height: 28px; padding: 0.5em 2.4em; margin: 0 auto; border-radius: 200px; line-height: 1; } .more.d { border-color: #d9d9d9; color: #949494; } .more.d:hover { border-color: #4fb02a; background-color: #4fb02a; color: #fff; } .more.w { border-color: rgba(255, 255, 255, 0.5); color: #fff; } .more.w:hover { border-color: #fff; background-color: #fff; color: #4fb02a; } .more > div { width: 100%; height: 100%; } .section-title { padding-bottom: 24px; margin-bottom: 0.16rem; } .section-title .hr { padding: 10px 0; margin: 0.35rem auto; display: none; } .section-title .hr:before { width: 28px; height: 2px; margin: 0 auto; background-color: #127fc3; } .section-title .hr:last-child { margin-bottom: 0; } .section-title h1 { font-size: 1.6em; } .nav-padding { height: 4.5em; } @media (max-width: 1000px) { .nav-padding { font-size: 14px; } } .article-line { margin-bottom: 0.24rem; padding-bottom: 12px; } .article-line:before { width: 16px; height: 3px; background-color: #00459c; } .page-point { line-height: 1; opacity: 1; color: rgba(255, 255, 255, 0.7); } .page-point a { display: inline; } .page-point a:hover { text-decoration: underline; color: #fff; } .page-point i { color: #fff; } .datum { margin: 0 -0.85rem; } @media (max-width: 768px) { .datum { margin: 30px -20px 0; } } .datum ul { margin: 0 -20px; } @media (max-width: 1000px) { .datum ul { position: static; } } @media (max-width: 768px) { .datum ul { display: block; } } .datum > .container { max-width: 960px; margin: 0 auto; } @media (min-width: 1001px) { .datum > .container:after { padding-top: 30%; } } .datum .item { margin-top: 16px; } .datum .circle { z-index: 2; width: 2.4em; height: 2.4em; line-height: 2.4em; text-align: center; background-color: #127fc3; color: #fff; margin-right: 1em; } .datum .circle:after { left: 100%; top: 50%; border-top: 0.2em solid transparent; border-bottom: 0.2em solid transparent; border-left: 0.3em solid #127fc3; margin-top: -0.2em; } .datum .char { color: #636363; } .datum .data { font-size: 2.1em; line-height: 1; height: 1em; overflow: hidden; font-weight: bold; padding-right: 18px; position: relative; pointer-events: none; user-select: none; } .datum .data:after { content: '\e626'; font-family: iconfont; font-size: 14px; line-height: 1; position: absolute; top: 0; right: 0; } .datum .key { font-size: 14px; } .datum .item { padding: 0 20px; } @media (min-width: 1001px) { .datum .item:before { top: 2.4em; left: 1.2em; z-index: 1; border-left: 0.1em dashed #127fc3; margin-left: 20px; transform: translateX(-0.05em); height: 110px; } .datum .item:nth-of-type(1):before { height: 200px; } .datum .item:nth-of-type(2) { top: -1em; } .datum .item:nth-of-type(3) { top: 1em; } } .column-title { font-size: max(20px,0.36rem); text-align: center; padding-bottom: 20px; margin-bottom: 0.4rem; } [id*='Anchor'] { height: 0; width: 0; position: relative; top: -4.5em; } ul.pagination { text-align: center; padding-top: 30px; margin-top: 0.2rem; font-size: 0; } ul.pagination > li { border-radius: 100px; display: inline-block; vertical-align: middle; transition: all 0.2s linear; font-size: 20px; border: 1px solid #e6e6e6; width: 2.4em; height: 2.4em; line-height: 2.4em; color: #333; margin: 0 0.25em; } @media (max-width: 1500px) { ul.pagination > li { font-size: 18px; } } @media (max-width: 1200px) { ul.pagination > li { font-size: 16px; } } @media (max-width: 1000px) { ul.pagination > li { font-size: 14px; } } @media (max-width: 768px) { ul.pagination > li { font-size: 12px; } } ul.pagination > li > a, ul.pagination > li > span { font-size: 0.9em; } ul.pagination > li:last-child > span, ul.pagination > li:first-child > span { display: block; } ul.pagination > li:last-child > a, ul.pagination > li:first-child > a, ul.pagination > li:last-child > span, ul.pagination > li:first-child > span { position: relative; overflow: hidden; text-indent: -100px; font-size: 12px; } ul.pagination > li:last-child > a:after, ul.pagination > li:first-child > a:after, ul.pagination > li:last-child > span:after, ul.pagination > li:first-child > span:after { position: absolute; left: 0; right: 0; top: 0; bottom: 0; text-indent: 0; font-family: "iconfont"; } ul.pagination > li:last-child { margin-left: 0.26rem; } ul.pagination > li:last-child > a:after, ul.pagination > li:last-child > span:after { content: "\e606"; } ul.pagination > li:first-child { margin-right: 0.26rem; } ul.pagination > li:first-child > a:after, ul.pagination > li:first-child > span:after { content: "\e605"; } ul.pagination > li:not(.disabled).active, ul.pagination > li:not(.disabled):hover { color: #FFF; background-color: #127fc3; border-color: #127fc3; } .row-title { text-align: center; margin-bottom: 0.16rem; padding-bottom: 24px; line-height: 1; color: #000; } .row-title .en { text-transform: uppercase; font-size: 14px; font-weight: normal; margin-top: 12px; color: #999; display: inline-block; } .row-title .en:after, .row-title .en:before{ top: 50%; margin-top: -0.5px; height: 1px; background-color: #999; width: 60px; } /*.row-title.w .en:after,*/ /*.row-title.w .en:before{*/ /* background-color: #fff;*/ /*}*/ .row-title .en:after{ left: 100%; margin-left: 10px; } .row-title .en:before{ right: 100%; margin-right: 10px; } .row-title .title { font-size: max(22px,1.3em); } #nav { position: fixed; left: 0; right: 0; top: 0; z-index: 500; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } #nav > .body-container { height: 4.5em; line-height: 4.5em; } @media (max-width: 1000px) { #nav > .body-container { font-size: 14px; } } #nav .toggle { font-size: max(20px,1.2em); } #nav .toggle:hover { color: #4fb02a; } #nav .logo { max-width: 60%; } #nav .logo .line { width: 1px; height: 1.4em; background-color: #d9d9d9; margin: 0 0.3rem; } #nav .logo img { max-height: 2.8em; max-width: 50%; } #nav .navbar-button { margin-left: 20px; position: relative; } @media (min-width: 1001px) { #nav .navbar-button { display: none; } } @media (min-width: 1001px) { #nav .nav-mask { display: none; } } @media (max-width: 1000px) { #nav .nav-mask { position: fixed; left: 0; right: 0; top: 63px; bottom: 0; background-color: rgba(0, 0, 0, 0.7); z-index: 300; transition: all 0.4s ease-out; } } #nav .navbar { margin-right: 1.6rem; } #nav .navbar a{ font-size: 106.25%; } @media (max-width: 1200px) { #nav .navbar { margin-right: 1rem; } } @media (max-width: 1000px) { #nav .navbar { transition: all 0.4s ease-out; margin-right: 0; position: fixed; left: -60%; width: 50%; top: 63px; z-index: 500; bottom: 0; background-color: #4fb02a; color: #fff; line-height: 50px; overflow-y: auto; } } @media (min-width: 1001px) { #nav .navbar .interaction { padding: 0 0.15rem; float: left; } #nav .navbar .interaction:not(:last-child) { margin-right: 0.25rem; } #nav .navbar .interaction:after, #nav .navbar .interaction:before { height: 2px; background-color: #00459c; position: absolute; left: 0; right: 0; opacity: 0; transition: all 0.2s linear; } #nav .navbar .interaction i { display: none; } #nav .navbar .interaction .sub-list { transition: all 0.2s ease-out; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); background-color: #4fb02a; margin-top: 1em; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); padding: 1em; white-space: nowrap; min-width: 100%; text-align: center; color: #fff; line-height: 2em; pointer-events: none; opacity: 0; visibility: hidden; } #nav .navbar .interaction:after { bottom: 0; } #nav .navbar .interaction:before { top: 0; } #nav .navbar .interaction.active > a { color: #00459c; } #nav .navbar .interaction.active:after, #nav .navbar .interaction.active:before { opacity: 1; } #nav .navbar .interaction:hover > a { color: #00459c; } #nav .navbar .interaction:hover .sub-list { opacity: 1; visibility: visible; pointer-events: unset; margin-top: 0; } } @media (max-width: 1000px) { #nav .navbar .interaction { padding: 0 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.5); } #nav .navbar .interaction > a { display: inline-block; } #nav .navbar .interaction i { position: absolute; right: 12px; top: 25px; margin-top: -9px; line-height: 1; font-size: 18px; } #nav .navbar .interaction .sub-list { display: none; border-top: 1px solid rgba(255, 255, 255, 0.1); line-height: 32px; padding-bottom: 16px; } #nav .navbar .interaction.active { background-color: rgba(255, 255, 255, 0.2); } #nav .navbar .interaction.open i { transform: rotateZ(90deg); } } #nav .navbar .sub-list:empty, #nav .navbar .sub-list:empty + i { display: none; } #nav .navbar .sub-list a:hover { text-decoration: underline; } #nav.active .navbar { left: 0; } #nav.active .nav-mask { visibility: visible; opacity: 1; pointer-events: unset; } #nav.active .navbar-button .default { opacity: 0; } #nav.active .navbar-button .fade { opacity: 1; visibility: visible; } #searchContent { display: none; padding: 0; background-color: transparent; width: 90%; max-width: 30em; } @media (max-width: 1025px) { #searchContent { margin-top: -40px; } } #searchContent > .clear > button { width: 3em; height: 3em; background-color: #4fb02a; color: #fff; cursor: pointer; } #searchContent > .clear > .content { height: 3em; margin-right: 3.5em; background-color: #fff; padding-left: 1em; } #searchContent > .carousel__button { display: none; } #banner .swiper .padding { overflow: hidden; max-height: 100vh; /*min-height: 450px;*/ } #banner .swiper .padding:after { padding-top: 56.25%; } /*#banner .swiper .padding:before {*/ /* position: absolute;*/ /* left: 0;*/ /* top: 0;*/ /* bottom: 0;*/ /* width: 50%;*/ /* min-width: 360px;*/ /* background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), transparent);*/ /* background-image: linear-gradient(left, rgba(0, 0, 0, 0.5), transparent);*/ /*}*/ #banner .swiper .content { font-size: 1rem; color: #fff; padding-right: 2rem; transition: all 0.6s ease-out; } @media (max-width: 1000px) { #banner{ padding-top: 63px; } #banner .swiper .content { font-size: 50px; } } #banner .swiper .content h1 { font-size: 0.48em; margin-bottom: 1em; } #banner .swiper .content .real, #banner .swiper .content .real p { position: relative; } #banner .swiper .content .real p { position: relative; font-size: 0.18em; line-height: 2; z-index: 2; } #banner .swiper .content .real a { width: 1.3em; height: 1.3em; line-height: 1; border: 1px solid #fff; margin: -0.24rem 0 0 -0.24rem; left: 100%; top: 0; position: absolute; } #banner .swiper .content .real a:hover { background-color: #fff; color: #4fb02a; } #banner .swiper-timing > .swiper-pagination-bullet .cls-3 { fill: #127fc3; } #banner .swiper-timing > .swiper-pagination-bullet.swiper-pagination-bullet-active .cls-2{ stroke: #127fc3; } #banner .swiper.ready .swiper-slide-active .content { visibility: visible; opacity: 1; pointer-events: unset; } #banner .column { position: relative; color: #fff; } #banner .column .padding { overflow: hidden; max-height: 50vh; min-height: 300px; } #banner .column .padding:after { padding-top: 36.45%; } #banner .column h1 { font-size: max(20px,0.48rem); padding-bottom: 20px; line-height: 1; margin-bottom: 0.2rem; color: #fff; } #banner .pagination { bottom: 0.85rem; z-index: 2; color: #fff; } @media (max-width: 768px) { #banner .pagination { bottom: 10px; } } #banner .pagination .swiper-page { font-weight: bold; } #banner .pagination .swiper-page .current { font-size: 1.2em; } #banner .pagination .swiper-page .total { font-size: max(12px,0.7em); } #banner .pagination .swiper-button { position: static; margin: 0; width: 2em; height: 2em; color: #127fc3; } #banner .pagination .swiper-button:after { display: none; } #banner .pagination .swiper-button:hover { color: #4fb02a; } @media (max-width: 768px) { #banner .pagination .swiper-button, #banner .pagination .swiper-page { display: none; } } @media (min-width: 769px) { #banner .pagination .swiper-pagination { position: static; width: auto; margin: 0 0.6rem; } } #indexAbout > .body-container { background-image: url(../images/index-about.jpg); text-align: center; } #indexAbout h1 img { max-width: 70%; } #indexAbout h2 { font-size: 1.6em; padding: 20px 0; margin: 0.3rem auto; max-width: 860px; } #indexAbout .text { max-width: 1300px; margin: 0 auto; } #indexAbout .datum { margin-top: 0.7rem; } @media (min-width: 1001px) { #indexAbout .datum { background-image: url(../images/index-about-line.png); } } #indexAbout .datum .item { margin-top: 16px; } @media (min-width: 1001px) { #indexAbout .datum .item { margin-top: 0; } } #indexAbout .more { margin-top: 40px; position: relative; z-index:10; } @media (min-width: 1001px) { #indexAbout .more { margin-top: -0.6rem; } } #indexProduct { color: #fff; overflow: hidden; } @media (min-width: 1001px) { #indexProduct .thumb { left: auto; z-index: 2; width: 6.4rem; position: absolute; right: 0; top: 0; bottom: 0; overflow: visible; } #indexProduct .thumb .swiper-pagination { display: none; } } #indexProduct .thumb .fade .mask, #indexProduct .thumb .point { background-color: rgba(0, 69, 156, 0.7); } #indexProduct .thumb .point { right: 100%; width: 0; font-size: 0; overflow: hidden; } #indexProduct .thumb .point .border { left: auto; background-color: #fff; opacity: 0.1; width: 1px; } #indexProduct .thumb .default .mask { background-color: rgba(0, 0, 0, 0.6); } #indexProduct .thumb .container { margin: 0 auto; width: 100%; max-width: 480px; } #indexProduct .thumb .container > .item { width: 45%; } #indexProduct .thumb .container .circle { width: 3em; height: 3em; text-align: center; line-height: 3em; border: 1px solid #fff; margin-bottom: 1em; } #indexProduct .thumb .container .name { font-size: 1.3em; margin-bottom: 1.2em; } #indexProduct .thumb .container img { -webkit-filter: drop-shadow(0 1em 0.5em rgba(0, 0, 0, 0.4)); filter: drop-shadow(0 1em 0.5em rgba(0, 0, 0, 0.4)); } #indexProduct .thumb .swiper-slide { height: 50%; padding: 30px; box-sizing: border-box; } #indexProduct .thumb .swiper-slide.swiper-slide-thumb-active .default { visibility: hidden; opacity: 0; pointer-events: none; } #indexProduct .thumb .swiper-slide.swiper-slide-thumb-active .fade { visibility: visible; opacity: 1; pointer-events: unset; } #indexProduct .thumb .swiper-slide.swiper-slide-thumb-active .point { width: 40px; font-size: 16px; } #indexProduct .thumb .swiper-pagination > .swiper-pagination-bullet { background-color: #fff; } #indexProduct .thumb .swiper-scrollbar { background-color: rgba(255, 255, 255, 0.2); right: 4px; top: 4px; height: auto; bottom: 4px; } #indexProduct .thumb .swiper-scrollbar-drag { background-color: #fff; } @media (max-width: 1000px) { #indexProduct .thumb .fade .mask { background-color: #127fc3; } #indexProduct .thumb .point, #indexProduct .thumb .swiper-scrollbar { display: none; } #indexProduct .thumb .swiper-slide { padding-bottom: 60px; } } @media (min-width: 1001px) { #indexProduct .main .cover .mask, #indexProduct .main .container { right: 6.4rem; } #indexProduct .main .container .content { right: 40px; } } #indexProduct .main .cover { min-height: 400px; position: relative; z-index: 1; } #indexProduct .main .cover > .padding { padding-top: 46.875%; } #indexProduct .main .cover > .mask { top: auto; height: 50%; min-height: 320px; background-image: -webkit-linear-gradient(bottom, #000, transparent); background-image: linear-gradient(bottom, #000, transparent); } #indexProduct .main .container { bottom: 0.85rem; z-index: 2; } #indexProduct .main .container .content { top: auto; padding-bottom: 0.85rem; border-bottom: 2px solid #fff; } #indexProduct .main .container h1 { font-size: 1.6em; margin-bottom: 1em; } #indexProduct .main .container .text { margin-right: 0.64rem; height: auto; max-height: 9em; -webkit-line-clamp: 5; } @media (max-width: 768px) { #indexProduct .main .container .row { display: block; } #indexProduct .main .container .text { margin-right: 0; } #indexProduct .main .container .more { margin: 24px 0 0 0; } #indexProduct .main .container .content { border-bottom: 1px solid rgba(255, 255, 255, 0.5); } } #indexService { color: #fff; } @media (max-width: 1000px) { #indexService .container { display: block; } } #indexService .tab-content { order: 1; } @media (min-width: 1001px) { #indexService .tab-content { width: calc(100% - 5.5rem); } } #indexService .tab-content .cover { min-height: 240px; } @media (min-width: 1001px) { #indexService .tab-content .cover { min-height: 100%; } } #indexService .tab-content .cover > .padding { padding-top: 54%; } #indexService .tab-content .cover > .mask { top: auto; height: 30%; min-height: 180px; background-image: -webkit-linear-gradient(bottom, #000, transparent); background-image: linear-gradient(bottom, #000, transparent); } #indexService .tab-content .body-container { z-index: 2; margin-bottom: 0.5rem; top: auto; } @media (min-width: 1001px) { #indexService .tab-content .body-container { margin-right: 15em; } } @media (max-width: 768px) { #indexService .tab-content .body-container { margin-bottom: 42px; } } #indexService .tab-content .body-container h1 { font-size: 1.3em; margin-bottom: 1em; } #indexService .tab-content .body-container .text { height: auto; max-height: 3.6em; -webkit-line-clamp: 2; } #indexService .tab-content .swiper-pagination { bottom: 20px; } @media (min-width: 769px) { #indexService .tab-content .swiper-pagination { left: auto; width: auto; right: 0.85rem; margin-bottom: 0.4rem; } } #indexService .aside { background-color: #127fc3; order: 2; } @media (min-width: 1001px) { #indexService .aside { width: 5.5rem; } } #indexService .aside > .body-container { padding-top: 0.85rem; padding-bottom: 0.85rem; box-sizing: border-box; } #indexService .aside > .body-container .title { font-size: 1.6em; text-align: center; } @media (min-width: 1001px){ #indexService .aside > .body-container .title { margin: 0 auto; } } #indexService .aside > .body-container > .hr { margin: 0 auto 10px; padding: 0.64rem 0 0.4rem; } #indexService .aside > .body-container > .hr:after { height: 1px; background-color: #fff; opacity: 0.2; } #indexService .aside > .body-container > .tab-option { padding-bottom: 10px; } #indexService .aside > .body-container > .tab-option > .item { margin-top: 1.4em; line-height: 1.7em; opacity: 0.5; cursor: pointer; } #indexService .aside > .body-container > .tab-option > .item > i { font-size: 1.7em; } #indexService .aside > .body-container > .tab-option > .item > .ell { margin-left: 8px; font-size: 1.3em; } #indexService .aside > .body-container > .tab-option > .item.active { opacity: 1; } #indexService .aside > .body-container > .more { margin-top: 0.4rem; } @media (min-width: 1001px) { #indexService .aside > .body-container > .tab-option { display: block; } #indexService .aside .top .more , #indexService .aside .top .mr{ display: none; } #indexService .aside > .body-container > .more { margin-left: 0; } } @media (max-width: 1000px) { #indexService .aside > .body-container > .tab-option > .item { font-size: 87.5%; } #indexService .aside .more { display: none; } } #indexCase { overflow: hidden; background: url(../images/index-case.png) no-repeat scroll left bottom; } #indexCase .swiper .char, #indexCase .swiper .clip, #indexCase .container, #indexCase .swiper { width: 50%; } @media (max-width: 1000px) { #indexCase > .body-container { display: block; } #indexCase .container, #indexCase .swiper { width: auto; } } @media (max-width: 768px) { #indexCase .swiper { margin-top: 40px; } #indexCase .swiper .char, #indexCase .swiper .clip { width: auto; } } #indexCase .container .char { position: relative; z-index: 2; } #indexCase .container .content { margin-right: 0.75rem; } @media (max-width: 1000px) { #indexCase .container .content { margin-right: 0; } } #indexCase .container h1 { font-size: 1.6em; margin-bottom: max(24px,0.4rem); } #indexCase .container h2 { font-size: 1.2em; } #indexCase .container .text { margin-bottom: max(30px,0.5rem); } #indexCase .container .text i { font-size: 22px!important; font-weight: bold; padding: 0 10px; } #indexCase .container .more { margin-bottom: 20px; } @media (min-width: 1001px) { #indexCase .container .more { margin-left: 0; margin-bottom: -0.14rem; } #indexCase .container .map { padding: 0 1rem; } } #indexCase .container .map { position: relative; margin: 0 auto; z-index: 1; } #indexCase .container .map:before { padding-top: 80%; } #indexCase .container .map > .dot { width: 138%; pointer-events: none; background-image: radial-gradient(#f2f2f2 20%, transparent 0); background-size: 10px 10px; background-position: 8px 8px; z-index: 1; } #indexCase .container .map > .contain { background-image: url(../images/map.png); z-index: 2; } #indexCase .container .map > .contain > .mask { position: absolute; left: 46.2%; top: 66.56%; } #indexCase .container .map > .contain > .mask > .circle { background-color: #208d64; opacity: 0.3; width: 0.8rem; height: 0.8rem; left: 50%; top: 50%; position: absolute; animation: map-mask 6s linear infinite; transform: translate(-50%, -50%) scale(0); } #indexCase .container .map > .contain > .mask > .circle:nth-of-type(2) { animation-delay: 2s; } #indexCase .container .map > .contain > .mask > .circle:nth-of-type(3) { animation-delay: 4s; } @keyframes map-mask { 0% { transform: translate(-50%, -50%) scale(0); opacity: 0.3; } 100% { transform: translate(-50%, -50%) scale(6); opacity: 0; } } #indexCase .swiper { position: relative; z-index: 2; } @media (min-width: 769px) { #indexCase .swiper .swiper-wrapper { display: block; } } @media (min-width: 769px) { #indexCase .swiper .swiper-slide { height: auto; } #indexCase .swiper .swiper-slide:nth-of-type(2n) { text-align: right; } #indexCase .swiper .swiper-slide:nth-of-type(2n) .go { margin-right: 0; margin-left: auto; } #indexCase .swiper .swiper-slide:nth-of-type(2n) .clip { order: 2; } #indexCase .swiper .swiper-slide:nth-of-type(2n) .char { order: 1; } } @media (max-width: 768px) { #indexCase .swiper .swiper-slide .flex { display: block; } } #indexCase .swiper .cover { min-height: 100%; } #indexCase .swiper .cover:after { padding-top: 56%; } #indexCase .swiper .content { padding: max(20px,0.34rem); box-sizing: border-box; width: 100%; } @media (max-width: 768px) { #indexCase .swiper .content { padding: 10px 0 0; } } #indexCase .swiper .content h1 { font-size: 1.1em; line-height: 1; margin-top: 1em; -webkit-line-clamp: 1; height: 1em; } @media (max-width: 550px) { #indexCase .swiper .content h1 { margin-top: 10px; } } #indexCase .swiper .content .go { margin-top: 2em; } #indexNews .section-title .right { color: #949494; } @media (min-width: 1001px) { #indexNews .container > .left { width: 42.85%; } #indexNews .container > .right { width: 54.85%; margin-top: -12px; } } @media (max-width: 1000px) { #indexNews .container { display: block; } } #indexNews .container .main .cover { height: 19.5em; padding-bottom: 24px; } #indexNews .container .item { margin-top: 12px; background-color: #fff; height: 6.5em; padding-right: 2em; } @media (max-width: 768px) { #indexNews .container .item { padding-right: 1em; } } #indexNews .container .item:before { left: 6.5em; top: 0; bottom: 0; width: 1px; background-color: #e5e5e5; } #indexNews .container .item .ell-more { height: 1em; line-height: 1; -webkit-line-clamp: 1; } #indexNews .container .item .title { font-size: max(14px,1em); margin-bottom: 1em; } @media (max-width: 768px) { #indexNews .container .item .title { margin-bottom: 0.75em; } } #indexNews .container .item .char { width: 100%; } #indexNews .container .item .right { padding-left: 2em; } #indexNews .container .item .date { padding-right: 2em; } @media (max-width: 768px) { #indexNews .container .item .date { padding-right: 1em; } } #indexNews .container .item .date > .content { width: 6.5em; text-align: center; line-height: 1; } #indexNews .container .item .date > .content > .d { font-size: 2.5em; font-weight: bold; } @media (max-width: 768px) { #indexNews .container .item .date > .content > .d { font-size: 2.2em; } } #indexNews .container .item .date > .content > .y { font-size: max(12px,0.7em); opacity: 0.7; } #indexPartner { overflow: hidden; } #indexPartner > .body-container { color: #fff; background-image: url(../images/index-partner.jpg); } #indexPartner .swiper { margin: 0 -2em 0 0; height: 9.8em; } #indexPartner .swiper .swiper-slide { height: 4.9em; } #indexPartner .swiper .content { margin: 0 2em 1.2em 0; background-color: #fff; padding: 0.4em; height: 2.1em; border-radius: 0.5em; } #indexPartner .swiper .content img { max-height: 100%; } #indexPartner .swiper-pagination { position: static; width: 100%; margin: 0.3rem auto 0; transform: none; } #footer { background-color: #0072dc; color: #fff; } @media (max-width: 1000px) { #footer .main { display: block; padding: 50px 0; } } #footer .main .content { padding: 0.7rem 0; } @media (max-width: 1000px) { #footer .main .content { padding: 16px 0; } } #footer .main .contact { font-size: 14px; } #footer .main .contact .content { width: 3rem; min-width: 220px; } @media (max-width: 1000px) { #footer .main .contact .content { width: auto; min-width: unset; padding-top: 0; } } #footer .main .contact .logo { margin-bottom: 0.5rem; } #footer .main .contact .logo img { -webkit-filter: grayscale(1) brightness(2000%); filter: grayscale(1) brightness(2000%); } #footer .main .contact .key { padding-top: 30px; margin-top: 0.2rem; padding-bottom: 8px; margin-bottom: 0.16rem; } #footer .main .contact .info .clear { padding-top: 2px; margin-top: 0.1rem; } #footer .main .contact .info .clear dd { margin-left: 3em; } @media (max-width: 1000px) { #footer .main .contact .tel { text-align: center; } } #footer .main .contact .tel > a { font-weight: bold; font-size: 1.2em; margin-top: 0.5em; line-height: 1; letter-spacing: 0.1em; } #footer .main .message { flex: 1; border-left: 1px solid rgba(255, 255, 255, 0.2); border-right: 1px solid rgba(255, 255, 255, 0.2); } #footer .main .message .top { margin-bottom: 1.5em; } #footer .main .message .top > i { font-size: 1.5em; margin-right: 10px; } #footer .main .message .char { width: 60px; font-size: 14px; text-align: right; right: auto; } #footer .main .message .placeholder { position: absolute; top: 0; left: 68px; font-size: 12px; opacity: 0.7; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #footer .main .message .textarea { position: relative; } #footer .main .message .textarea .placeholder { top: 17px; } #footer .main .message .textarea .char { line-height: 18px; top: 17px; } #footer .main .message textarea, #footer .main .message input { box-sizing: border-box; width: 100%; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; padding-left: 68px; font-size: 12px; padding-right: 16px; } #footer .main .message textarea:focus, #footer .main .message input:focus { border-color: #fff; } #footer .main .message textarea:focus + .placeholder, #footer .main .message input:focus + .placeholder { display: none!important; } #footer .main .message input { height: 100%; } #footer .main .message textarea { min-height: 126px; max-width: 100%; padding-top: 16px; padding-bottom: 16px; } #footer .main .message .submit-button { cursor: pointer; width: 7.5em; height: 2.1em; background-color: rgba(255, 255, 255, 0.2); margin-top: 2em; text-align: center; line-height: 2.1em; font-weight: bold; } #footer .main .message .submit-button:hover { background-color: #fff; color: #4fb02a; } #footer .main .message .clear { margin: 0 -1em 0 0; } @media (max-width: 480px) { #footer .main .message .clear > .col-item { width: 100%; } } #footer .main .message .clear > .col-item > .col-content { margin: 0 1em 1em 0; height: 2.6em; line-height: 2.6em; } #footer .main .web .content { width: 5rem; } @media (max-width: 1200px) { #footer .main .web .content { width: auto; display: block; box-sizing: border-box; height: 100%; } } @media (max-width: 1000px) { #footer .main .web .content { padding-bottom: 0; } } @media (max-width: 1200px) { #footer .main .web .left { display: none; } } #footer .main .web .list > .clear { border-bottom: 1px dashed rgba(255, 255, 255, 0.5); padding: 1em 0; } #footer .main .web .list > .clear:first-child { padding-top: 0; } #footer .main .web .list > .clear > .ell { margin-right: 3em; } #footer .main .web .list > .clear > i { float: right; } #footer .main .web .list > .clear > .ell, #footer .main .web .list > .clear > i { font-size: 0.9em; } #footer .main .web .list > .clear:hover { color: #4fb02a; } #footer .main .web .share { margin-top: 0.24rem; padding-top: 16px; } #footer .main .web .share > .circle:not(:last-child) { margin-right: 0.32rem; } #footer .main .web .aside { padding-left: 0.7rem; } @media (min-width: 1201px) { #footer .main .web .aside .share { display: none; } } @media (max-width: 1200px) { #footer .main .web .aside { padding-left: 0; height: 100%; } #footer .main .web .aside .to-top { display: none; } } #footer .main .web .aside .to-top { margin: 0 0 0 auto; } #footer .main .web .wechat { width: 100px; font-size: 14px; text-align: center; margin: 0 auto; } #footer .main .web .wechat img { width: 100%; margin-bottom: 10px; } #footer .main .web a.circle { width: 2.1em; height: 2.1em; background-color: #fff; color: #000; } #footer .main .web a.circle > i { font-size: 0.9em; } #footer .main .web a.circle:hover { color: #4fb02a; } #footer .main .web a.interaction > .fade { bottom: 100%; background-color: #fff; border-radius: 10px; padding: 12px; width: 200px; -webkit-filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.5)); filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.5)); } #footer .main .web a.interaction > .fade > img { width: 200px; } #footer .main .web a.interaction > .fade > .arrow { top: 100%; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #fff; } #footer .main .web a.interaction:hover > .fade { margin-bottom: 10px; } #footer .copyright { border-top: 1px solid rgba(255, 255, 255, 0.2); padding-top: 22px; padding-bottom: 22px; font-size: 12px; text-align: center; } #footer .copyright > .content { margin: 0 -20px; } #footer .copyright > .content > .item-m { margin: 0 20px; opacity: 0.8; } #columnNav { text-align: center; border-bottom: 1px solid #d9d9d9; } @media (max-width: 1000px) { #columnNav { display: none; } } #columnNav a { flex: 1; max-width: 11.5em; line-height: 4.25em; box-sizing: border-box; border-right: 1px solid #d9d9d9; padding: 0 1em; } #columnNav a:first-child { border-left: 1px solid #d9d9d9; } #columnNav a:hover, #columnNav a.active { background-color: #127fc3; color: #fff; border-color: transparent; } @media (min-width: 1201px) { .company .img { display: none; } } #indexAbout.company .main{ text-align: left; } #indexAbout.company .main > .col-item.oppress { box-sizing: border-box; padding-left: 0.85rem; } #indexAbout.company .main > .left { width: 52%; } #indexAbout.company .main > .oppress { width: 48%; } @media (max-width: 1200px) { #indexAbout.company .main { display: block; } #indexAbout.company .main > .col-item { float: none; width: auto; } #indexAbout.company .main > .col-item.oppress { display: none; } } #indexAbout.company .img { /*padding-top: 64%;*/ margin-top: 30px; } #indexAbout.company h1 { font-size: 1.6em; } #honor > .body-container { background-image: url(../images/honor.jpg); } #honor .tab-option { margin-bottom: 2em; } @media (max-width: 768px) { #honor .tab-option { margin-bottom: 1em; } } #honor .tab-option .item { flex: 1; padding: 1.8em 1.6em; text-align: center; background-color: #fff; box-sizing: border-box; line-height: 1; } @media (max-width: 768px) { #honor .tab-option .item { padding: 1.2em; } } #honor .tab-option .item:not(:last-child) { margin-right: 2em; } @media (max-width: 768px) { #honor .tab-option .item:not(:last-child) { margin-right: 1em; } } #honor .tab-option .item > .arrow { top: 100%; border-left: 0.45em solid transparent; border-right: 0.45em solid transparent; border-top: 0.6em solid #127fc3; } #honor .tab-option .item > .num { opacity: 0.8; font-size: max(12px,0.8em); } #honor .tab-option .item > .name { color: #127fc3; margin-bottom: 0.5em; } #honor .tab-option .item > .name > i { font-size: 2em; margin-right: 0.25em; } #honor .tab-option .item > .name > .char { font-size: 1.2em; padding-top: 0.1em; font-weight: bold; } #honor .tab-option .item.active { background-color: #127fc3; } #honor .tab-option .item.active, #honor .tab-option .item.active > .name { color: #fff; } #honor .swiper { margin-right: -2em; } @media (max-width: 768px) { #honor .swiper { margin-right: -1em; } } #honor .swiper .content { margin-right: 2em; padding: 2.1em; text-align: center; background-color: #fff; line-height: 1; } @media (max-width: 768px) { #honor .swiper .content { margin-right: 1em; padding: 1.5em; } } #honor .swiper .content .contain { margin-bottom: 1.2em; padding-top: 100%; border: 1px solid #d9d9d9; } #honor .swiper .content:hover { color: #127fc3; } #honor .swiper .content:hover .contain { border-color: #127fc3; } #honor .swiper-pagination { font-size: inherit; padding-right: 1em; } #culture .swiper { background-color: #00459c; color: #fff; text-align: center; } #culture .swiper .cover { padding-top: 137.3%; } @media (max-width: 480px) { #culture .swiper .cover { padding-top: 100%; } } #culture .swiper .title { font-size: 1.2em; } #culture .swiper .line { width: 20px; height: 0; background-color: #fff; margin: 0.5em auto; } #culture .swiper .char { font-size: max(14px,0.8em); } #culture .swiper .default { padding: max(20px,0.7rem); top: auto; } #culture .swiper .fade { border: 1px solid #fff; box-sizing: border-box; max-width: 75%; width: 2.4rem; padding: 1em; border-radius: 100%; margin-top: -1em; min-width: 160px; } #culture .swiper .swiper-slide:hover .cover { opacity: 0.4; } #culture .swiper .swiper-slide:hover .fade { visibility: visible; opacity: 1; pointer-events: unset; margin-top: 0; } #culture .swiper .swiper-slide:hover .default { margin-bottom: 1em; opacity: 0; visibility: hidden; pointer-events: none; } #product .container > .flex { margin-bottom: max(30px,0.46rem); } #product .container > .flex:hover { color: #4fb02a; } @media (min-width: 551px) { #product .container > .flex .content { max-width: 25em; } #product .container > .flex .clip, #product .container > .flex .char { width: 50%; } #product .container > .flex:nth-of-type(2n-1) .clip { border-right: 0 none; } #product .container > .flex:nth-of-type(2n) .clip { order: 2; border-left: 0 none; } #product .container > .flex:nth-of-type(2n) .char { order: 1; text-align: right; } #product .container > .flex:nth-of-type(2n) .go { margin-right: 0; margin-left: auto; } } @media (max-width: 550px) { #product .container > .flex { display: block; } #product .container > .flex .clip { border-bottom: 0 none; } } #product .container .clip, #product .container .box { box-sizing: border-box; } #product .container .clip { border: 1px solid #d9d9d9; } #product .container .img { overflow: hidden; min-height: 100%; } #product .container .img:before { padding-top: 62.5%; } #product .container .box { width: 100%; padding: 2em; } #product .container .content { margin: 0 auto; box-sizing: border-box; width: 100%; } #product .container .title { font-size: max(16px,1.2em); margin-bottom: 1.2em; } #product .container .text { color: #000; } #product .container .go { margin-top: 0.74rem; } #operation .container { max-width: 920px; text-align: center; margin: 0 auto; } #operation .container .section-title { margin-bottom: 0; } #operation .container .top { font-size: 1rem; margin-bottom: 0.4rem; padding-bottom: 20px; } @media (max-width: 768px) { #operation .container .top { font-size: 40px; } } #operation .container .top > .item { width: 2.7em; height: 0.75em; border: 1px solid #d9d9d9; color: #999999; border-radius: 100px; box-sizing: border-box; max-width: 30%; } @media (max-width: 768px) { #operation .container .top > .item { height: 36px; } } #operation .container .top > .item > i { font-size: 0.42em; } #operation .container .top > .item > .char { font-size: 0.3em; margin-left: 0.1rem; } #operation .container .top > .item:hover, #operation .container .top > .item.active { color: #127fc3; border-color: #127fc3; } @media (max-width: 768px) { #case .col-item { width: 50%; } } @media (max-width: 550px) { #case .col-item { width: 100%; } } #case .col-item .col-content { background-color: #fff; } #case .col-item .col-content:hover { color: #4fb02a; } #case .col-item .col-content:before { left: 0; top: 0; width: 100%; height: 100%; z-index: 100; } #case .col-item .cover { padding-top: 50%; } #case .col-item .content { padding: max(20px,0.3rem); } #case .col-item .title { font-size: max(14px,0.9em); margin-bottom: 0.75em; } #case .col-item .text { padding-bottom: 0.3rem; border-bottom: 1px solid #d9d9d9; color: #000; } .fixed-panel { position: fixed; z-index: 600; background-color: rgba(0, 0, 0, 0.5); padding: 0.85rem; } .detail-box { width: 100%; position: relative; color: #000; } .detail-box .close { position: absolute; left: 100%; bottom: 100%; margin: 0 0 -1.8em -1.8em; width: 3.5em; height: 3.5em; color: #fff; border-radius: 100%; background-image: -webkit-linear-gradient(top, #30abf9, #1380c4); background-image: linear-gradient(top, #30abf9, #1380c4); cursor: pointer; z-index: 3; } .detail-box .close:hover > i { transform: rotateZ(90deg); } .detail-box .container { background-color: #fff; padding: 0.9rem 0 0.9rem 0.9rem; margin-right: 0.9rem; z-index: 2; } @media (max-width: 1000px) { .detail-box .container { display: block; } } .detail-box .container .carousel { width: 100%; } .detail-box .container .carousel .carousel__slide { width: 100%; padding: 0; } .detail-box .container .carousel .img { padding-top: 70%; } .detail-box .container .carousel .carousel__button { width: 2.5em; height: 2.5em; font-family: 'iconfont'; background-color: #d6d6d6; color: #707070; transition: all 0.2s linear; } .detail-box .container .carousel .carousel__button svg { display: none; } .detail-box .container .carousel .carousel__button:after { font-size: 12px; } .detail-box .container .carousel .carousel__button.is-prev { left: -1.25em; } .detail-box .container .carousel .carousel__button.is-prev:after { content: '\e605'; } .detail-box .container .carousel .carousel__button.is-next { right: -1.25em; } .detail-box .container .carousel .carousel__button.is-next:after { content: '\e606'; } .detail-box .container .carousel .carousel__button:hover { background-color: #127fc3; color: #fff; } .detail-box .container .content { width: 100%; padding-top: 0.8rem; text-align: center; } @media (min-width: 1001px) { .detail-box .container .content { width: 4.3rem; margin-left: 0.9rem; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; padding: 0.8rem; } } .detail-box .container .content .title { font-size: 1.6em; } .detail-box .container .content .text { margin-top: 0.36rem; font-size: max(14px,0.9em); } .detail-box .padding { left: auto; background-color: #fff; width: 0.9rem; top: 2.3em; } .detail-box .padding:after { bottom: 100%; right: 0; width: 2.5em; height: 2.5em; background: url(../images/close.png) no-repeat scroll right top; background-size: 100% 100%; margin-bottom: -0.2em; } .detail-box .padding:before { bottom: 100%; left: 0; background-color: #fff; right: 2.3em; height: 2.3em; } #news .swiper { margin-right: -0.6rem; } #news .swiper .content { margin-right: 0.6rem; } #news .swiper .content .clip { position: relative; margin-bottom: 0.3rem; } @media (max-width: 1200px) { #news .swiper .content .clip { font-size: 16px; } } #news .swiper .content .clip .cover { padding-top: 60%; } #news .swiper .content .clip .mask { bottom: auto; height: 30%; min-height: 80px; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.7), transparent); background-image: linear-gradient(top, rgba(0, 0, 0, 0.7), transparent); z-index: 1; } #news .swiper .content .clip .circle { background-color: #127fc3; width: 5em; height: 5em; margin: -1em 0 0 -1em; z-index: 1; } #news .swiper .content .clip .date { color: #fff; z-index: 2; text-align: center; width: 3.5em; line-height: 1; padding-top: 0.8em; } #news .swiper .content .clip .date > .d { font-weight: bold; font-size: 1.7em; } #news .swiper .content .clip .date > .y { font-size: 12px; } #news .swiper .content .title { padding-top: 10px; font-size: 1em; margin-bottom: 1em; } #news .swiper .content .go { margin-top: 0.26rem; } #news .swiper .content:hover .title { color: #4fb02a; } #news .swiper .content:hover .mask, #news .swiper .swiper-slide-active .content .mask { opacity: 0; visibility: hidden; pointer-events: none; } #news .swiper .content:hover .bg, #news .swiper .swiper-slide-active .content .bg { opacity: 1; visibility: visible; pointer-events: unset; } @media (max-width: 768px) { #news .container { margin: 0 -20px; } } #news .container .flex { border-bottom: 1px solid #d9d9d9; padding: max(20px,0.4rem); position: relative; } #news .container .flex .date { text-align: center; line-height: 1.2; position: relative; } #news .container .flex .date > .d { font-weight: bold; font-size: 2em; } #news .container .flex .date > .y { font-size: 12px; } #news .container .flex .date > .line { position: absolute; left: 0; bottom: 0.3em; width: 15px; height: 2px; background-color: #000; } #news .container .flex .center { width: 100%; box-sizing: border-box; padding: 0 0.7rem; margin-right: 4em; } @media (max-width: 768px) { #news .container .flex .center { margin-right: 0; padding-right: 0; } } #news .container .flex .center .title { font-size: 1em; margin-bottom: 1em; height: 1.5em; -webkit-line-clamp: 1; } #news .container .flex .right { opacity: 0.7; margin-right: 0.8rem; } #news .container .flex .right i { margin-left: 6px; } #news .container .flex:first-child { border-top: 1px solid #d9d9d9; } #news .container .flex:hover { border-color: #127fc3; background-color: #127fc3; color: #fff; } #news .container .flex:hover .date > .line { background-color: #fff; opacity: 0.7; } @media (max-width: 1000px) { #detail > .container { display: block; } } #detail .main { width: 100%; } #detail .main h1 { font-size: max(20px,0.5rem); margin-bottom: 0.9em; } #detail .main .date { font-size: 112.5%; } #detail .main .line { margin: 0.75rem auto; height: 1px; background-color: #d9d9d9; } #detail .main .page > .clear { line-height: 1.125em; } #detail .main .page > .clear > .fl { font-size: 87.5%; } #detail .main .page > .clear > a { font-size: 112.5%; margin-right: 2rem; padding-left: 15px; } #detail .main .page > .clear > a:before { left: 0; top: 50%; width: 5px; height: 5px; background-color: #666; border-radius: 5px; margin-top: -2.5px; transition: all 0.2s linear; } #detail .main .page > .clear:first-child { border-bottom: 1px dashed #d9d9d9; padding-bottom: max(20px,0.45rem); } #detail .main .page > .clear:last-child { padding-top: max(20px,0.45rem); } #detail .main .page > .clear:hover { color: #127fc3; } #detail .main .page > .clear:hover > a:before { background-color: #127fc3; } #detail .aside > .body-container { margin-top: 50px; } @media (min-width: 1001px) { #detail .aside > .body-container { width: 5.5rem; padding-left: 0; margin-top: 0; } } #detail .aside h2 { font-size: 1.2em; margin-bottom: 1.5em; } #detail .aside ul { margin: 0 -1em; } @media (min-width: 1001px) { #detail .aside ul { display: block; margin: 0; } } @media (max-width: 768px) { #detail .aside ul { display: block; margin: 0; } } @media (max-width: 1000px) and (min-width: 769px) { #detail .aside ul li { width: 50%; box-sizing: border-box; padding: 0 1em; } } #detail .aside ul li:not(:last-child) { padding-bottom: 12px; margin-bottom: 0.3rem; } #detail .aside ul li .clip { width: 40%; } #detail .aside ul li .cover { min-height: 100%; overflow: hidden; } #detail .aside ul li .cover:after { padding-top: 55%; } #detail .aside ul li .text { color: #000; } #detail .aside ul li .title { height: 3em; margin-bottom: 1em; } #detail .aside ul li .char { width: 60%; box-sizing: border-box; padding-left: 1em; } #detail .aside ul li a:hover { color: #4fb02a; } #zxpt > .body-container { background-image: url(../images/zxpt.png); background-position: right bottom; } #zxpt .container { text-align: center; max-width: 1100px; margin: 0 auto 0.36rem; padding-bottom: 30px; } #zxpt .section-title h2 { font-size: 1.3em; color: #00459c; margin-bottom: 0.24rem; padding-bottom: 12px; padding-top: 10px; margin-top: 0.2rem; } #yycj .thumb { margin: 0 -0.2rem; } #yycj .thumb .box { padding: 0.75em; } #yycj .thumb .content { color: #7b7b7b; border: 1px solid #d9d9d9; border-radius: 100%; text-align: center; margin: 0 auto; width: 6.2em; cursor: pointer; } #yycj .thumb .content:before { left: 50%; position: absolute; top: 100%; border-left: 0.3em solid transparent; border-right: 0.3em solid transparent; border-top: 0.55em solid #127fc3; margin-left: -0.3em; transition: all 0.2s linear; opacity: 0; } #yycj .thumb .content:after { padding-top: 100%; } #yycj .thumb .item { padding: 0 0.2rem; margin-bottom: 0.4rem; } #yycj .thumb .item.active .content { background-color: #127fc3; border-color: #127fc3; color: #fff; } #yycj .thumb .item.active .content:before { opacity: 1; } #yycj .thumb .char { font-size: 0.8em; line-height: 1.2; } #yycj .main dl { margin-top: 1em; } #yycj .main dt { font-weight: bold; margin-right: 1em; } #yycj .main .cover { padding-top: 37.41%; } #ptld { color: #fff; } #ptld .arrow { border-left: 1.6em solid transparent; border-right: 1.6em solid transparent; border-top: 1.5em solid #f6f6f6; top: 0; z-index: 2; } #ptld .arrow.ad { border-top-color: #fff; } #ptld .padding { height: 2.4rem; } @media (max-width: 768px) { #ptld .container { display: block; } } #ptld .container .item { flex: 1; box-sizing: border-box; padding: 2em; background-image: -webkit-linear-gradient(left, #49a9e5, #1280c4); background-image: linear-gradient(left, #49a9e5, #1280c4); } @media (max-width: 1500px) { #ptld .container .item { padding: 1.5em; } } @media (max-width: 1000px) { #ptld .container .item { padding: 1.5em 1.2em; } } @media (min-width: 769px) { #ptld .container .item:not(:last-child) { margin-right: 2em; } } @media (max-width: 768px) { #ptld .container .item:not(:last-child) { margin-bottom: 1em; } } #ptld .container .item .order { font-weight: bold; line-height: 1; opacity: 0.05; font-size: max(36px,0.86rem); margin-left: 0.232em; } @media (max-width: 768px) { #ptld .container .item .order { opacity: 0.1; } } #ptld .container .item .char + .order { padding-left: 20px; } #ptld .container .item .clear { line-height: 1.5em; flex: 1; } #ptld .container .item .box > i{ font-size: 1.5em; } #ptld .container .item .clear > i { margin: 0 8px 0 0; font-size: 1.5em; } #ptld .container .item .box > .char { margin-left: 8px; } #ptld .container .item .clear > .txt { font-size: 1em; margin: 0 auto; letter-spacing: 0.2em; white-space: nowrap; } @media (max-width: 1000px) and (min-width: 769px) { #ptld .container .item .clear { font-size: 14px; } #ptld .container .item .order { font-size: 1.2em; opacity: 1; } } #ptjm .container { margin: 0 -0.6rem; } @media (max-width: 768px) { #ptjm .container { display: block; } } #ptjm .container .item { width: 50%; } @media (max-width: 768px) { #ptjm .container .item { width: auto; margin-bottom: 40px; } } #ptjm .container .item .content { padding: 0 0.6rem; } #ptjm .container .item .contain { padding-top: 68.42%; } #ptjm .container .item .tag { width: 1.9rem; height: 2.4em; line-height: 2.4em; border-top: 1px solid #127fc3; border-bottom: 1px solid #127fc3; color: #000; margin: 1.4em auto 0; text-align: center; } #clzz { background: url(../images/clzz.png) no-repeat scroll right bottom; } #clzz .section-title { text-align: center; } #clzz .container { margin-right: -0.6rem; } @media (max-width: 1000px) { #clzz .container { display: block; } } #clzz .container .item { width: 50%; } @media (max-width: 1000px) { #clzz .container .item { width: auto; } #clzz .container .item:not(:last-child) { margin-bottom: 20px; } } #clzz .container .item .contain { padding-top: 65%; } #clzz .container .item .oppress { border: 1px solid #d9d9d9; } #clzz .container .item .content { margin-right: 0.6rem; font-size: 112.5%; line-height: 2.18; } #cpyl > .body-container { background-image: url(../images/cpyl.jpg); } #cpyl .text { text-align: center; max-width: 930px; margin: 0 auto 0.3rem; padding-bottom: 20px; } #param { color: #fff; } #param .tab-option { background-color: #127fc3; margin-bottom: 0.5rem; } #param .tab-option .item { flex: 1; box-sizing: border-box; line-height: 1.6em; height: 4em; position: relative; } #param .tab-option .item > i { font-size: 1.6em; margin-right: 6px; } #param .tab-option .item > .arrow { top: 100%; border-left: 0.6em solid transparent; border-right: 0.6em solid transparent; border-top: 0.7em solid #fff; } #param .tab-option .item.active { color: #127fc3; background-color: #fff; } #param .tab-option .item.active > .arrow { visibility: visible; opacity: 1; pointer-events: unset; } #param .tab-content { background-color: #fff; color: #000; padding: max(20px,0.5rem); }