﻿#gywm .szys {display: flex; align-items: center; flex-flow: row wrap; justify-content: space-between; padding-left: 100px; padding-right: 100px;}
#gywm .szys li {padding: 0 40px; color: var(--a-hover-color); line-height: 1;}
#gywm .szys li p {margin-top: 5px; line-height: 1.5;}
#gywm .szys li div {display: flex; align-items: flex-end;}
#gywm .szys li:hover {transform: translateY(-5px);}
#gywm .szys .number {font-size: 40px; font-weight: bold;}
#gywm .szys .jia {margin-bottom: 2px; margin-left: 5px; font-size: 24px;}
#gywm .szys .wzs {margin-bottom: 3px; margin-left: 5px;}

.atis {display: flex; justify-content: center; text-align: center;}
.atis h2 {padding-bottom: 20px; color:#333; font-size: var(--atis-fs); line-height: 1; border-bottom: 2px solid var(--a-hover-color);}

.about > div {padding-bottom: 100px;}
.about .cont {display: flex; align-items: flex-start; margin-top: 60px;}
.about .cont .imgs {flex: 0 0 auto; position: relative; width: 46.875%; font-size: 0; overflow: hidden;}
.about .cont .imgs img {width: 100%;}
.about .cont .imgs:hover img {transform: scale(1.02);}
.about .cont .imgs a {position: absolute; inset: 0; background: url(../images/play2.png) no-repeat center center;}
.about .cont .imgs a.sj {display: none;}
.about .cont .text {flex: 1 1 auto; margin-left: 50px;}
.about .szys {margin-top: 80px;}

.zljs {background-color:#f6f6f6;}
.zljs > div {padding-top: 80px; padding-bottom: 80px;}
.zljs .text1 {display: flex;}
.zljs .text1 .code {flex: 0 0 auto; color: var(--a-hover-color); font-size: 28px; font-weight: bold;}
.zljs .text1 .editorc {flex: 1 1 auto; margin-left: 80px; color:#333;}
.zljs .text2 {margin-top: 40px; color:#333;}
.zljs .imgs {margin-top: 40px; font-size: 0; overflow: hidden;}
.zljs .imgs img {width: 100%;}
.zljs .szys {margin-top: 40px;}

.fzlc {background: url(../images/fzlc_bg.jpg) no-repeat center top/cover;}
.fzlc > div {padding-top: 100px; padding-bottom: 100px;}
.fzlc .cont {margin-top: 60px;}
.fzlc .item {display: grid; grid-template-columns: auto 40%; column-gap: 80px; align-items: center; padding-left: 100px; padding-right: 100px;}
.fzlc .item .text {position: relative; padding-right: 80px;}
.fzlc .item .text::after {position: absolute; top: 0; right: 0; display: block; width: 3px; height: 100px; background-color: var(--a-hover-color); content: '';}
.fzlc .item .text h4 {color: var(--a-hover-color); font-size: 26px; line-height: 1.5;}
.fzlc .item .text p {margin-top: 50px; font-size: 18px; line-height: 1.6;}
.fzlc .item .imgs {font-size: 0;}
.fzlc .item .imgs img {max-width: 100%; border: 1px solid #ddd; box-sizing: border-box;}
.fzlc .year {position: relative; margin-top: 50px; padding-left: 100px; padding-right: 100px;}
.fzlc .year::after {position: absolute; top: 25px; left: 60px; right: 60px; border-top: 2px dashed #aaa; content: '';}
.fzlc .year .swiper-slide {position: relative; z-index: 2; display: flex; align-items: flex-end; justify-content: center; height: 98px;}
.fzlc .year .swiper-slide::before {position: absolute; top: 18px; left: 50%; display: block; width: 15px; height: 15px; border-radius: 50%; box-sizing: border-box; border: 2px solid #999; background-color:#fff; content: ''; transform: translateX(-50%);}
.fzlc .year .swiper-slide span {padding: 5px 10px; font-size: 20px; border-radius: 5px; cursor: pointer;}
.fzlc .year .swiper-slide-thumb-active span {color:#fff; background-color: var(--a-hover-color);}
.fzlc .year .swiper-slide-thumb-active::before {border-color: var(--a-hover-color);}
.fzlc .year .swiper-button {position: absolute; top: 0; width: 50px; height: 50px; color:#999; font-size: 18px; text-align: center; border-radius: 50%; border: 1px solid #999; cursor: pointer;}
.fzlc .year .swiper-button-disabled {opacity: 0.2; cursor: default;}
.fzlc .year .swiper-button:not(.swiper-button-disabled):hover {color:#fff; border-color: var(--a-hover-color); background-color: var(--a-hover-color);}
.fzlc .year .swiper-prev {left: 0;}
.fzlc .year .swiper-next {right: 0;}


.honor {display: grid; grid-template-columns: repeat(4,1fr); gap: 30px 20px; margin-top: 50px;}
.honor a {text-align: center;}
.honor a .imgs {position: relative; padding-top: 67.05%; font-size: 0; border: 1px solid #eee; background-color:#f9f9f9; overflow: hidden;}
.honor a .imgs::before {position: absolute; inset: 0; z-index: 2; display: block; opacity: 0; background-color: rgba(0,0,0,0.4); content: ''; transition: ease-in-out 400ms;}
.honor a .imgs::after {position: absolute; inset: 0; z-index: 3; display: block; opacity: 0; background: url(../images/icon-1.png) no-repeat center center; content: ''; transform: translateY(50px); transition: ease-in-out 400ms;}
.honor a .imgs div {position: absolute; inset: 0;}
.honor a .imgs img {max-width: 100%; max-height: 100%; transition-duration: 700ms;}
.honor a p {margin-top: 12px; color:#666; font-size: 15px; line-height: 1.6;}
.honor a:hover .imgs {border-color: var(--a-hover-color);}
.honor a:hover .imgs::before {opacity: 1;}
.honor a:hover .imgs::after {opacity: 1; transform: translateY(0);}
.honor a:hover .imgs img {transform: scale(1.08);}


.quality .intro1 > div {display: flex; align-items: center; margin-top: 50px; padding-bottom: 80px;}
.quality .intro1 .imgs {flex: 0 0 auto; width: 50%; font-size: 0; overflow: hidden;}
.quality .intro1 .imgs img {width: 100%;}
.quality .intro1 .text {flex: 1 1 auto; margin-left: 60px;}
.quality .intro1 .text .tis {color:#333; font-size: 26px; font-weight: normal;}
.quality .intro1 .text .editorc {margin-top: 40px;}
.quality .intro1 .text .more {margin-top: 40px;}
.quality .intro2 {background: url(../images/gdBg.jpg) no-repeat center center/cover;}
.quality .intro2 .editorc {padding: 60px 80px; color:#fff;}
.quality .intro3 > div {display: flex; align-items: flex-start; padding-top: 60px; padding-bottom: 80px;}
.quality .intro3 .text {flex: 1 1 auto; margin-right: 60px;}
.quality .intro3 .text .tis {color:#333; font-size: 26px; font-weight: normal;}
.quality .intro3 .text .editorc {margin-top: 40px;}
.quality .intro3 .text .more {margin-top: 40px;}
.quality .intro3 .list {flex: 0 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 50px 10px; width: 50%;}
.quality .intro3 .list a {text-align: center;}
.quality .intro3 .list a .imgs {position: relative; height: 120px; font-size: 0; border: 1px solid #eee; overflow: hidden;}
.quality .intro3 .list a .imgs div {position: absolute; inset: 0;}
.quality .intro3 .list a .imgs img {max-width: 100%; max-height: 100%;}
.quality .intro3 .list a p {margin-top: 10px; font-size: 14px; line-height: 1.5;}
.quality .intro3 .list a:hover .imgs img {transform: scale(1.08);}


.rd > div {padding-bottom: 80px;}
.rd .cont {padding-left: 100px; padding-right: 100px;}
.rd .cont li {position: relative; margin-top: 50px; padding-bottom: 50px; padding-left: 200px;}
.rd .cont li .imgs {font-size: 0; overflow: hidden;}
.rd .cont li .imgs img {width: 100%; transition-duration: 700ms;}
.rd .cont li .text {position: absolute; bottom: 0; left: 0; padding: 30px 40px; width: 500px; text-align: center; box-sizing: border-box; border: 1px solid #eee; background-color:#fff;}
.rd .cont li .text h4 {color: var(--a-hover-color); font-size: 22px;}
.rd .cont li .text p {margin-top: 10px; font-size: 15px; line-height: 1.8;}
.rd .cont li:hover .imgs img {transform: scale(1.1);}

.hbtx > div {padding-bottom: 80px;}
.hbtx .cont li {display: grid; grid-template-columns: 1fr 1fr; margin-top: 60px;}
.hbtx .cont li:first-child {margin-top: 50px;}
.hbtx .cont li .imgs {font-size: 0; overflow: hidden;}
.hbtx .cont li .imgs img {width: 100%; transition-duration: 700ms;}
.hbtx .cont li .imgs:hover img {transform: scale(1.1);}
.hbtx .cont li .text {padding-top: 50px; box-sizing: border-box;}
.hbtx .cont li .text h4 {color:#333; font-size: 24px; line-height: 1.5;}
.hbtx .cont li .text p {margin-top: 40px; line-height: var(--lh18);}
.hbtx .cont li:nth-child(odd) .text {padding-left: 50px;}
.hbtx .cont li:nth-child(even) .imgs {grid-row-start: 1; grid-column: 2/3;}
.hbtx .cont li:nth-child(even) .text {grid-row-start: 1; grid-column: 1/2; padding-right: 50px;}


.gds .szs {position: relative; margin-top: 50px; padding-top: 47.293%; background-position: center center; background-repeat: no-repeat; background-size: cover;}
.gds .szs ul {position: absolute; inset: 0; display: flex;}
.gds .szs ul li {position: relative; padding: 20px; width: 25%; color:#fff; text-align: center; box-sizing: border-box; background-color: rgba(0,0,0,0.2);}
.gds .szs ul li:nth-child(odd) {background-color: rgba(0,0,0,0.4);}
.gds .szs ul li .item {position: absolute; inset: 0; margin: auto; padding: 0 40px; height: fit-content; transform: translateY(50px);}
.gds .szs ul li .tis {display: flex; align-items: flex-end; justify-content: center; line-height: 1;}
.gds .szs ul li .tis .number {font-size: 54px; font-weight: bold;}
.gds .szs ul li .tis .wzs {margin-bottom: 5px; margin-left: 3px; font-size: 22px;}
.gds .szs ul li .desc {display: table; margin: 10px auto auto auto; padding-bottom: 10px; font-size: 18px; border-bottom: 1px solid transparent;}
.gds .szs ul li .intro {margin-top: 20px; opacity: 0; line-height: 1.6;}
.gds .szs ul li:hover .item {transform: translateY(0);}
.gds .szs ul li:hover .desc {border-color:#fff;}
.gds .szs ul li:hover .intro {opacity: 1;}

.gds .cont {padding-bottom: 80px;}
.gds .cont .rows {margin-top: 80px;}
.gds .cont .intro {position: relative; margin-top: 50px; font-size: 0; overflow: hidden;}
.gds .cont .intro img {width: 100%;}
.gds .cont .intro .text {position: absolute; inset: 0; z-index: 2;}
.gds .cont .intro .text > div {display: flex; flex-direction: column; justify-content: center; height: 100%;}
.gds .cont .intro .mask {display: flex; flex-direction: column; align-items: flex-start; padding: 50px; width: 500px; color:#fff; box-sizing: border-box; background-color: rgba(0,0,0,0.5);}
.gds .cont .intro .mask h4 {padding-bottom: 10px; font-size: 20px; line-height: 1.5; border-bottom: 1px solid #fff;}
.gds .cont .intro .mask p {margin-top: 30px; font-size: var(--fs16); line-height: 1.6;}
.gds .cont .intro .mask p:nth-child(2) {margin-top: 20px;}
.gds .cont .rows:nth-child(odd) .intro .text > div {align-items: flex-end;}

@media only screen and (max-width: 1680px){

}

@media only screen and (max-width: 1500px){
	#gywm .szys {padding-left: 0; padding-right: 0;}
}

@media only screen and (max-width: 1280px){
	#gywm .szys li {padding: 0 30px;}
	#gywm .szys .number {font-size: 34px;}
	#gywm .szys .jia {font-size: 22px;}
		
	.about > div {padding-bottom: 6%;}
	.about .cont {margin-top: var(--pad-lr);}
	.about .cont .text {flex: 1 1 auto; margin-left: 5%;}
	.about .szys {margin-top: 6%;}
	
	.zljs > div {padding-top: 5%; padding-bottom: 5%;}
	.zljs .text1 .code {font-size: 22px;}
	.zljs .text1 .editorc {margin-left: 6%;}
	.zljs .text2 {margin-top: 3%;}
	.zljs .imgs {margin-top: 3%;}
	.zljs .szys {margin-top: 3.5%;}
	
	.fzlc > div {padding-top: 6%; padding-bottom: 6%;}
	.fzlc .cont {margin-top: 5%;}
	.fzlc .item {column-gap: 50px; padding-left: 50px; padding-right: 50px;}
	.fzlc .item .text {padding-right: 50px;}
	.fzlc .item .text::after {width: 3px; height: 60px;}
	.fzlc .item .text h4 {font-size: 20px;}
	.fzlc .item .text p {margin-top: 5%; font-size: 14px; line-height: 1.8;}
	.fzlc .year {margin-top: 4%; padding-left: 80px; padding-right: 80px;}

	.honor {margin-top: var(--pad-lr);}
	.honor a p {font-size: 14px;}

	.quality .intro1 > div {margin-top: var(--pad-lr); padding-bottom: 5%;}
	.quality .intro1 .text {margin-left: 5%;}
	.quality .intro1 .text .tis {font-size: 22px;}
	.quality .intro1 .text .editorc {margin-top: 3%;}
	.quality .intro1 .text .more {margin-top: 5%;}
	.quality .intro2 .editorc {padding: 4%;}
	.quality .intro3 > div {padding-top: 5%; padding-bottom: 6%;}
	.quality .intro3 .text {margin-right: 5%;}
	.quality .intro3 .text .tis {font-size: 22px;}
	.quality .intro3 .text .editorc {margin-top: 3%;}
	.quality .intro3 .text .more {margin-top: 5%;}
	.quality .intro3 .list {gap: 30px 10px;}

	.rd > div {padding-bottom: 6%;}
	.rd .cont {padding-left: 5%; padding-right: 5%;}
	.rd .cont li {margin-top: var(--pad-lr); padding-bottom: var(--pad-lr); padding-left: 15%;}
	.rd .cont li .text {padding: 30px; width: 400px;}
	.rd .cont li .text h4 {font-size: 18px;}
	.rd .cont li .text p {margin-top: 10px; font-size: 14px; line-height: 1.65;}

	.hbtx > div {padding-bottom: 6%;}
	.hbtx .cont li {margin-top: 5%;}
	.hbtx .cont li:first-child {margin-top: 5%;}
	.hbtx .cont li .text {padding-top: 4%;}
	.hbtx .cont li .text h4 {font-size: 18px;}
	.hbtx .cont li .text p {margin-top: 3%;}
	.hbtx .cont li:nth-child(odd) .text {padding-left: 6%;}
	.hbtx .cont li:nth-child(even) .text {padding-right: 6%;}

	.gds .szs {margin-top: var(--pad-lr);}
	.gds .szs ul li .item {padding: 0 30px;}
	.gds .szs ul li .tis .number {font-size: 40px;}
	.gds .szs ul li .tis .wzs {margin-bottom: 5px; margin-left: 3px; font-size: 16px;}
	.gds .szs ul li .desc {font-size: 14px;}
	.gds .szs ul li .intro {margin-top: 6%;}

	.gds .cont {padding-bottom: 6%;}
	.gds .cont .rows {margin-top: 6%;}
	.gds .cont .intro {margin-top: var(--pad-lr);}
	.gds .cont .intro .mask {padding: 40px;}
}

@media only screen and (max-width: 1024px){
	#gywm .szys {gap: 40px;}
	#gywm .szys li {padding: 0;}
	#gywm .szys .number {font-size: 30px;}
	#gywm .szys .jia {margin-bottom: 3px; font-size: 18px;}

	.about .cont {display: block;}
	.about .cont .imgs {width: 100%;}
	.about .cont .text {margin-left: 0; margin-top: var(--pad-lr);}

	.zljs .text1 .code {font-size: 18px;}

	.fzlc .item {column-gap: 30px;}
	.fzlc .item .text {padding-right: 30px;}
	.fzlc .item .text::after {width: 2px; height: 46px;}
	.fzlc .item .text h4 {font-size: 16px;}
	.fzlc .year {margin-top: 4%; padding-left: 100px; padding-right: 100px;}
	.fzlc .year::after {top: 19px; left: 50px; right: 50px;}
	.fzlc .year .swiper-slide {height: 70px;}
	.fzlc .year .swiper-slide::before {top: 14px; width: 12px; height: 12px;}
	.fzlc .year .swiper-slide span {font-size: 16px;}
	.fzlc .year .swiper-button {width: 40px; height: 40px; font-size: 14px;}

	.quality .intro1 > div {align-items: flex-start;}

	.rd .cont {padding-left: 0; padding-right: 0;}
	.rd .cont li {padding-left: 10%;}
	.rd .cont li .text {padding: 20px;}

	.gds .szs ul li .tis .number {font-size: 36px;}
	.gds .szs ul li .intro {font-size: 12px;}
	.gds .cont .intro .mask {padding: 3%; width: 400px;}
	.gds .cont .intro .mask h4 {padding-bottom: 10px; font-size: 16px;}
	.gds .cont .intro .mask p {margin-top: 5%;}
	.gds .cont .intro .mask p:nth-child(2) {margin-top: 4%;}
}

@media only screen and (max-width: 800px){
	#gywm .szys {gap: 30px;}
	#gywm .szys li p {font-size: 12px;}
	#gywm .szys .number {font-size: 24px;}
	#gywm .szys .jia {margin-bottom: 2px; font-size: 16px;}

	.fzlc .item {padding-left: 0; padding-right: 0;}
	.fzlc .year .swiper-slide span {font-size: 14px;}

	.honor {grid-template-columns: 1fr 1fr;}
	.honor a p {font-size: 14px;}

	.quality .intro1 > div {display: block;}
	.quality .intro1 .imgs {width: 100%;}
	.quality .intro1 .text {margin-top: var(--pad-lr); margin-left: 0;}
	.quality .intro1 .text .tis {font-size: 18px;}
	.quality .intro3 > div {display: block;}
	.quality .intro3 .text {margin-right: 0; width: auto;}
	.quality .intro3 .text .tis {font-size: 18px;}
	.quality .intro3 .list {gap: 30px 20px; margin-top: 6%; width: auto;}

	.rd .cont li {padding:0;}
	.rd .cont li .text {position: static; width: auto; border-top: none;}
	.rd .cont li .text h4 {font-size: 16px;}
	.rd .cont li .text p {margin-top: 10px;}

	.hbtx .cont li .text {padding-top: 0;}
	.hbtx .cont li .text h4 {font-size: 16px;}

	.gds .szs {padding-top: 0;}
	.gds .szs ul {position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 10px;}
	.gds .szs ul li {width: auto; background-color: rgba(0,0,0,0.4);}
	.gds .szs ul li .item {position: static; padding: 0; transform: translateY(0);}
	.gds .szs ul li .tis .number {font-size: 30px;}
	.gds .szs ul li .tis .wzs {margin-bottom: 5px; margin-left: 3px; font-size: 14px;}
	.gds .szs ul li .desc {margin-top: 10px; padding-bottom: 10px; font-size: 14px; border-bottom-color:#fff;}
	.gds .szs ul li .intro {margin-top: 3%; opacity: 1;}

	.gds .cont .intro .text {position: static; background-color:#7f7f7f;}
	.gds .cont .intro .text > div {display: block; padding: 0; height: auto;}
	.gds .cont .intro .mask {padding: var(--pad-lr); width: auto; background-color: initial;}
	.gds .cont .intro .mask p {margin-top: 4%;}
	.gds .cont .intro .mask p:nth-child(2) {margin-top: 3%;}
}

@media only screen and (max-width: 640px){
	.hbtx .cont li {display: block; margin-top: 8%;}
	.hbtx .cont li:first-child {margin-top: var(--pad-lr);}
	.hbtx .cont li .text {margin-top: var(--pad-lr);}
	.hbtx .cont li:nth-child(odd) .text {padding-left: 0;}
	.hbtx .cont li:nth-child(even) .text {padding-right: 0;}
}

@media only screen and (max-width: 480px){
	#gywm .szys {display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; gap: 10px;}
	#gywm .szys li {padding: 12px 15px; color:#fff; line-height: normal; background-color:#999;}
	#gywm .szys li p {margin-top: 5px; line-height: 1.4;}
	#gywm .szys li div {line-height: 1;}
	#gywm .szys .number {font-size: 20px;}
	#gywm .szys .jia {margin-bottom: 1px; font-size: 14px;}
	#gywm .szys .wzs {margin-bottom: 2px; font-size: 12px;}

	.atis h2 {padding-bottom: 10px;}

	.about .cont .imgs a {background-size: 50px 50px;}
	.about .cont .imgs a.pc {display: none;}
	.about .cont .imgs a.sj {display: block;}

	.zljs > div {padding-top: 6%; padding-bottom: 6%;}
	.zljs .text1 {display: block;}
	.zljs .text1 .code {font-size: 16px;}
	.zljs .text1 .editorc {margin-top: 3%; margin-left: 0;}
	.zljs .text2 {margin-top: 5%;}
	.zljs .imgs {margin-top: 5%;}
	.zljs .szys {margin-top: 5%;}

	.fzlc > div {padding-top: 8%; padding-bottom: 10%;}
	.fzlc .item {grid-template-rows: auto auto; grid-template-columns: auto; gap: 0;}
	.fzlc .item .imgs {grid-row: 1/2; width: 100%;}
	.fzlc .item .text {grid-row: 2/3; margin-top: 5%; padding-right: 0;}
	.fzlc .item .text::after {display: none;}
	.fzlc .item .text h4 {font-size: 14px;}
	.fzlc .item .text p {margin-top: 3%; font-size: 12px; line-height: 1.6;}
	.fzlc .year {margin-top: 6%; padding-left: 40px; padding-right: 40px;}
	.fzlc .year::after {top: 14px; left: 40px; right: 40px; border-top-width: 1px;}
	.fzlc .year .swiper-slide {height: 55px;}
	.fzlc .year .swiper-slide::before {top: 9px; width: 10px; height: 10px; border-width: 1px;}
	.fzlc .year .swiper-slide span {font-size: 14px;}
	.fzlc .year .swiper-button {width: 30px; height: 30px; font-size: 12px;}

	.honor {gap: 20px 10px;}
	.honor a p {margin-top: 10px; font-size: 12px; line-height: 1.5;}

	.quality .intro1 .text .tis {font-size: 16px; font-weight: bold;}
	.quality .intro2 .editorc {padding: 5%;}
	.quality .intro3 .text .tis {font-size: 16px; font-weight: bold;}
	.quality .intro3 .list {gap: 20px 10px;}
	.quality .intro3 .list a p {margin-top: 10px; font-size: 12px; line-height: 1.5;}

	.rd .cont li .text {padding: 5%; text-align: left;}
	.rd .cont li .text h4 {font-size: 14px;}
	.rd .cont li .text p {margin-top: 5px; font-size: 12px; line-height: 1.6;}

	.hbtx .cont li .text h4 {font-size: 14px;}
	.hbtx .cont li .text p {margin-top: 2%; font-size: 12px;}

	.gds .szs ul {grid-template-columns: 1fr; gap: 5px;}
	.gds .szs ul li .tis .number {font-size: 20px;}
	.gds .szs ul li .tis .wzs {margin-bottom: 3px; font-size: 12px;}
	.gds .szs ul li .desc {margin-top: 5px; padding-bottom: 5px; font-size: 12px;}
	.gds .szs ul li .intro {margin-top: 3%;}
	.gds .cont {padding-bottom: 0;}
	.gds .cont .rows {margin-top: 10%;}
	.gds .cont .intro .mask h4 {padding-bottom: 8px; font-size: 14px;}
	.gds .cont .intro .mask p {font-size: 12px;}
}