/*
 *  style.css by 453883682@qq.com
 */
 /* loading */
.load-mask{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 9999999;}
.load-mask .load-item{ position: absolute; left: 0; top: 0; width: 100%; height: 33.33%; background-color: #FFFFFF;}
.load-mask .load-item + .load-item{ top: 33.33%;}
.load-mask .load-item + .load-item + .load-item{ top: 66.66%;}
.load-mask .load-item.play { animation: animate-load-bg 0.5s forwards ease;}
.load-mask .load-logo{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 206px; height: 65px; z-index: 2; overflow: hidden;}
.load-mask .load-logo-left{ width: 32%; height: 100%; background: url(../images/logo.png) left center no-repeat; background-size: cover;}
.load-mask .load-logo-right{ width: 68%; height: 100%; background: url(../images/logo.png) right center no-repeat; background-size: cover;}

.load-mask.play .load-logo-left { animation: animate-load-left 0.8s forwards ease-in;}
.load-mask.play .load-logo-right { animation: animate-load-right 0.8s forwards ease-in;}

 /* banner */
.banner{  position: relative; height: 100vh; background-color: #FFFFFF;}
.banner::before{ display: block; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(to bottom,rgba(0,0,0,0.5) 0%, rgba(0,0,0,0));}
.banner video{ display: block; width: 100%; height: 100%; object-fit: cover;}
.banImg{ width: 100%; height: 100%;}
.mouse{ position: absolute; left: 50%; bottom: 3%; transform: translateX(-50%); width: 37px; height: 52px; border: 3px solid #FFFFFF; border-radius: 18px; z-index: 2;}
.mouse span{ display: block; position: absolute; left: 0; right: 0; top: 10%; width: 5px; height: 12px; margin: 0 auto; background: #ee7700; border-radius: 2px; animation: aniMouse 1.4s linear infinite;}
.ban-text{ position: absolute; left: 0; right: 0; bottom: 15%; z-index: 1;}
.ban-text .cn{ color: #ffb96e;}
.ban-text .en{ line-height: 1.2; font-family: 'BaiJamjuree-SemiBold'; font-weight: normal;}
.ban-btn{ position: absolute; top: 50%; transform: translateY(-50%); width: 74px; height: 74px; max-width: .8rem; max-height: .8rem; border-radius: 50%; border: 2px solid #FFFFFF; background-position: center center; background-size: contain; background-repeat: no-repeat; opacity: .5; cursor: pointer; z-index: 1; transition: all .3s;}
.ban-prev{ left: 4%; background-image: url(../images/ban-prev.png);}
.ban-next{ right: 4%; background-image: url(../images/ban-next.png);}
.ban-btn:hover{ background-color: #FFFFFF; opacity: 1;}
.ban-prev:hover{ background-image: url(../images/ban-prev-hover.png);}
.ban-next:hover{ background-image: url(../images/ban-next-hover.png);}

.index-type{ position: relative; line-height: 1.1; padding-left: 26px; margin-bottom: .2rem; text-transform: uppercase; font-weight: bold;}
.index-type::before{ display: block; content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; border-radius: 50%; background: var(--main-color);}
.index-type.color-f::before{ background-color: #FFFFFF; opacity: .5;}
.index-title{ line-height: 1.1; margin-bottom: .2rem; font-family: 'OPPOSans-B'; font-weight: normal;}
.index-more{ display: block; width: fit-content; padding: .1rem 0; border-bottom: 1px solid #FFFFFF;}
.index-more i{ display: inline-block; vertical-align: middle; margin-left: 5px; transform: rotate(-45deg); transition: all .3s;}
.index-more:hover i{ transform: rotate(0);}
.index-more.main-color{ border-bottom-color: var(--main-color);}

/* index-suning */
.box1-bg{ position: relative; padding: 1.5rem 0; background: url(../images/box1-bg.png) left center no-repeat; background-color: #FFFFFF; background-size: cover; overflow: hidden;}
.box1-text{ width: 50%; max-width: 814px; line-height: 1.8;}
.box1-des{ margin: .8rem 0 .5rem; text-align: justify;}
.box1-line{ position: relative; display: block; width: 100%; height: 3px; margin: .6rem 0; background: #C7C7C7;}
.box1-line::before{ display: block; content: ""; position: absolute; left: 30%; top: 50%; margin-top: -7px; width: 14px; height: 14px; background-color: var(--main-color); border-radius: 50%;}
.box1-line::after{ display: block; content: ""; position: absolute; left: 0; top: 0; width: 30%; height: 100%; background-color: var(--main-color);}
.box1-type{ position: relative; margin: .4rem 0; opacity: .6;}
.box1-list{ margin-top: 1.5rem;}
.box1-list p{ opacity: .7;}
.box1-num{ position: relative; display: flex; align-items: center; width: fit-content; color: var(--main-color);}
.box1-num strong{ line-height: 1; font-family: 'BaiJamjuree-SemiBold'; font-weight: bold;}
.box1-num span{ line-height: 1;}
.box1-num sup{ position: absolute; left: 100%; top: 0;}
.box1-num sub{ position: absolute; left: 100%; bottom: 0;}
.box1-video{ position: absolute; right: 0; top: 0; width: 42%; max-width: 815px; height: 100%; z-index: 1;}
.box1-video-bg{ position: absolute; right: 0; top: 0; width: 100%; height: 100%; background: url(../images/box1-video.png) left center no-repeat; background-size: cover; z-index: -1;}
.box1-video-title{ position: absolute; right: 12%; top: 10%; bottom: 10%; height: 80%;}
.box1-video-title img{ height: 100%;} 
.box1-video-play{ position: absolute; left: 50%; top: 40%; transform: translateY(-50%); width: 1rem; height: 1rem; cursor: pointer; z-index: 2;}
.box1-video-play span{ display: block; width: 100%; height: 100%; border-radius: 50%; background: url(../images/icon-play.png) center center #0269b8 no-repeat; background-size: contain;}
.box1-video-play::before,
.box1-video-play::after{ display: block; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 50%; background-color: rgba(2, 105, 184, 0.5); z-index: -1; animation: aniLight 1s linear infinite;}
.box1-video-play::after{ animation-delay: 0.3s;}
.box1-img{ position: absolute; right: 0; top: 0; width: 45%; max-width: 780px; height: 100%; z-index: 1;}
.box1-img .imgBg{ width: 100%; height: 100%; background-position: left center;}
.box1-video-pop{ position: absolute; left: 100%; top: 0; width: 100%; height: 100%; background-color: #000000; z-index: 1; opacity: 0; visibility: hidden; transition: all .3s;}
.box1-video-pop video{ display: block; width: 100%; height: 100%; object-fit: contain;}
.box1-video-close{ display: block; position: absolute; right: 5%; top: 5%; font-size: 30px; width: 50px; height: 50px; line-height: 50px; border-radius: 50px; background-color: rgba(0, 0, 0, 0.5); z-index: 1; text-align: center; cursor: pointer; transition: all .3s;}
.box1-video-close:hover{ background-color: #000000; transform: rotate(180deg);}
.box1-video-pop.open{ left: 0; opacity: 1; visibility: visible;}

/* index-Industry */
.box2-bg{ position: relative; background: #F4F7FC; z-index: 1;}
.box2-img li{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; visibility: hidden; overflow: hidden; transition: all .6s linear;}
.box2-img li img{ display: block; width: 100%; height: 100%; object-fit: cover;}
.box2-img li.active{ opacity: 1; visibility: visible; transition: all .3s linear;}

.box2-list{ height: calc(100vh - 80px); border-right: 1px solid rgba(255, 255, 255, 0.2);}
.box2-list li{ width: 20%; height: 100%; border-left: 1px solid rgba(255, 255, 255, 0.2); border-top: 1px solid rgba(255, 255, 255, 0.2); transition: all .3s linear;}
.box2-link{ position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; padding: .3rem .5rem;}
.box2-icon{ position: relative; width: 36px; height: 36px; transition: all .3s;}
.box2-icon img{ max-width: 100%; max-height: 100%;}
.box2-title{ position: relative; margin-bottom: .3rem; font-weight: normal;}
.box2-title span{ font-size: 66%;}
.box2-title::before{ display: block; content: ""; position: absolute; left: -.5rem; top: 50%; margin-top: -7px; margin-left: -7px; width: 14px; height: 14px; background-color: var(--main-color); border-radius: 50%; transform: scale(0); transition: all .3s;}
.box2-info{ height: 0; interpolate-size: allow-keywords; margin-bottom: .6rem; font-family: 'OPPOSans-R'; transition: all .3s;}
.box2-text{ height: 0; interpolate-size: allow-keywords; opacity: .7; margin-bottom: .3rem; transition: all .3s linear;}
.box2-more{ position: absolute; right: 0; bottom: 0; width: 120px; height: 120px; padding: 20px 0 0 20px; border-radius: 120px 0 0 0; color: #FFFFFF; background-color: var(--main-color); transform: scale(0); transform-origin: right bottom; transition: all .3s;}
.box2-link .box-more{ opacity: 0; visibility: hidden; transform: translateY(25%); transform-origin: left center; transition: all .3s;}

.box2-list li.active{ width: 40%; text-align: left;}
.box2-list li.active .box2-link{ align-items: flex-start;}
.box2-list li.active .box2-title span{ font-size: 100%;}
.box2-list li.active .box2-title{ margin: .4rem 0;}
.box2-list li.active .box2-title::before{ transform: scale(1);}
.box2-list li.active .box2-info{ height: auto;}
.box2-list li.active .box2-text{ height: auto; margin-bottom: 1rem;}
.box2-list li.active .box-more{ opacity: 1; visibility: visible; transform: translateY(0); transition: all .3s linear .3s;}

.box2-bot{ position: relative; width: 100%; height: .96rem; margin-top: -0; height: 0; background: url(../images/box5-bot.png) center bottom no-repeat; pointer-events: none; z-index: 1; background-size: 100% 100%;}

/* index-news */
.box3-bg{ position: relative; padding-top: .6rem; padding-bottom: 1.3rem; background-color: #FFFFFF; overflow: hidden; z-index: 1;}
.box3-top{ margin-bottom: .5rem;}
.box3-title .index-title{ margin-bottom: 0;}
.box3-sort li{ margin-left: .28rem;}
.box3-sort li a,
.box3-sort li span{ display: block; color: #000000; line-height: 36px; padding: 0 .25rem; border: 1px solid #CDCDCD; border-radius: 20px; transition: all .3s; cursor: pointer;}
.box3-sort li.active a,
.box3-sort li.active span,
.box3-sort li a:hover,
.box3-sort li span:hover{ border-color: var(--main-color); background-color: var(--main-color); color: #FFFFFF;}

.box3-left{ flex-shrink: 0; width: 48%; max-width: 783px; margin-right: 3%;}
.box3-right{ flex: auto; max-width: 836px; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between;}
.box3-right .index-more{ margin-left: auto;}
.box3-item{ display: none;}
.box3-link{ display: block;}
.box3-left .box3-link{ display: block; border-radius: 10px; background-color: var(--main-color);}
.box3-left .box3-img{ padding-bottom: 50.19%; border-radius: 10px;}
.box3-left .box3-text{ padding: .35rem;}
.box3-left .box-more .flex{ background-color: #FFFFFF;}
.box3-type{ position: absolute; right: .14rem; top: .2rem; width: fit-content; min-width: 126px; line-height: 44px; background: var(--main-color); border-radius: .22rem; text-align: center;}
.box3-name{ line-height: 1.5; margin-bottom: .3rem; -webkit-line-clamp: 2; transition: all .3s;}
.box3-link:hover .box3-img .imgBg{ transform: scale(1.05);}
.box3-link:hover .box-more .flex i{ background-color: var(--hover-color); color: #FFFFFF; font-size: 80%; transform: translateX(25%);}

.box3-list li{ border-bottom: 1px solid rgba(0, 0, 0, 0.2);}
.box3-list li:first-child .box3-link{ padding-top: 0;}
.box3-list .box3-link{ display: flex; padding: .3rem 0;}
.box3-list .box3-img{ flex-shrink: 0; width: 266px; max-width: 35%; border-radius: 10px; margin-right: .3rem; overflow: hidden;}
.box3-list .box3-img .imgBg{ height: 100%; min-height: 174px; transition: all 1s;}
.box3-list .box3-text{ flex: auto; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden;}
.box3-list .box3-name{ opacity: .8; -webkit-line-clamp: 3; line-height: 1.5; margin-bottom: .1rem; transition: all .3s linear;}
.box3-list .box3-time{ opacity: .6; font-family: 'BaiJamjuree-SemiBold';}
.box3-list .box3-link:hover .box3-name{ color: var(--main-color); opacity: 1;}


.box4-bg{ position: relative; padding: 0 0 1.5rem; background-color: #F4F7FC; overflow: hidden; z-index: 1;}
.box4-top{ width: 100%; height: 96px; height: 0; background: url(../images/box6-bot.png) center bottom no-repeat; pointer-events: none; z-index: 1; background-size: 100% 100%;}
.box4-bg .index-title{ margin: .3rem 0 .6rem;}
.box4-list{ gap: .15rem;}
.box4-list li{ position: relative; flex: .125; background-color: #0068B7; border-radius: 10px; overflow: hidden; transition: all .3s linear;}
.box4-list .box4-img{ opacity: 0; visibility: hidden;}
.box4-list .box4-img .imgBg{ height: 453px;}
.box4-mask{ position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background: url(../images/box4-mask.png) left top no-repeat; background-size: cover;}
.box4-icon{ width: auto; height: 70px; max-height: .9rem;}
.box4-icon img{ display: block; height: 100%;}
.box4-text{ position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; padding: .4rem .2rem;}
.box4-text .box4-icon img{ margin: 0 auto;}
.box4-text .box4-icon-bg{ position: absolute; left: -2%; bottom: -5%; width: 104%; transform-origin: center bottom; transition: all .4s linear .2s;}
.box4-text .box4-icon-bg img{ display: block; width: 100%; height: auto; opacity: .1;}
.box4-active{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: .4rem .5rem;}
.box4-active .box4-cn,
.box4-active .box4-en,
.box4-active .box4-icon{ opacity: 0; visibility: hidden; transform: translateX(-.2rem); transition: all .2s;}
.box4-active .box4-en{ text-transform: uppercase; font-family: 'BaiJamjuree-SemiBold';}
.box4-active .box4-icon{ margin-top: auto;}
.box4-list li.active{ flex: .5;}
.box4-list li.active .box4-img{ opacity: 1; visibility: visible;}
.box4-list li.active .box4-text{ opacity: 0; visibility: hidden;}
.box4-list li.active .box4-text .box4-icon-bg{ transform: translateY(100%);}
.box4-list li.active .box4-active .box4-cn,
.box4-list li.active .box4-active .box4-en,
.box4-list li.active .box4-active .box4-icon{ opacity: 1; visibility: visible; transform: translateX(0);}
.box4-list li.active .box4-active .box4-en{ opacity: .6;}
.box4-list li.active .box4-active .box4-cn{ transition: all .3s linear 0.2s;}
.box4-list li.active .box4-active .box4-en{ transition: all .3s linear 0.4s;}
.box4-list li.active .box4-active .box4-icon{ transition: all .3s linear 0.6s;}

/* dichan */
.dc-box1-bg{ position: relative; padding: 1.1rem 0; background: url(../images/industry/dc-box1-bg.png) center center fixed #FFFFFF no-repeat; background-size: cover; overflow: hidden;}
.dc-box1-text{ max-width: 1250px; line-height: 1.5; margin: .5rem auto;}
.dc-box1-text p{ opacity: .7;}
.dc-box1-list{ max-width: 900px; margin: 0 auto; margin-top: .9rem;}

.dc-box2-bg{ position: relative; padding: 1rem 0; overflow: hidden;}
.dc-box2-bg + .dc-box3-bg{ margin-top: -1rem;}
.dc-box2-tab{ margin-bottom: .5rem; font-family: 'OPPOSans-M';}
.dc-box2-tab li{ flex: 1; border-bottom: .04rem solid #F4F7FC; transition: all .3s;}
.dc-box2-tab li span{ display: block; padding: .3rem 0; cursor: pointer;color:#000}
.dc-box2-tab li.active{ border-bottom-color: var(--main-color);}
.dc-box2-tab li.active span{ color: var(--main-color);}
.dc-box2-con{ background: #F4F7FC; border-radius: 0 1rem 0px 1rem; overflow: hidden;}
.dc-box2-left,
.dc-box2-right{ flex-shrink: 0; width: 50%;}
.dc-box2-left{ padding: .6rem .3rem;}
.dc-box2-top{ gap: .2rem;}
.dc-box2-logo{ height: 53px; max-height: .7rem;}
.dc-box2-logo img{ max-height: 100%;}
.dc-box2-name{ font-family: 'STZhongsong';}
.dc-box2-info{ margin: .4rem 0;}
.dc-box2-list{ margin-top: .3rem;}
.dc-box2-list li{ position: relative; padding: 0 .4rem; margin-top: .2rem; border-left: 1px solid #000000;}
.dc-box2-list li:first-child{ border-left: none;}
.dc-box2-icon{ width: 53px; height: 53px; max-width: .6rem; max-height: .6rem; margin: 0 auto .15rem;}
.dc-box2-icon img{ width: 100%; height: 100%; object-fit: contain;}
.dc-box2-list p{ opacity: .7; line-height: 1;}
.dc-box2-img{ height: 100%; min-height: 5rem;}
.dc-box2-btn{ position: relative; display: flex; align-items: center; justify-content: flex-end; gap: .17rem; margin-top: .45rem;}
.dc-box2-btn .dc-box2-line{ display: block; flex: auto; height: 1px; background-color: rgba(0, 0, 0, 0.1); overflow: hidden;}
.dc-box2-btn .dc-box2-prev,
.dc-box2-btn .dc-box2-next{ flex-direction: row; width: 62px; height: 62px; max-width: .7rem; max-height: .7rem; border-radius: 30px; background: var(--main-color); cursor: pointer; transition: all .3s;}
.dc-box2-btn .dc-box2-next{ flex-direction: row-reverse;}
.dc-box2-btn .dc-box2-next span{ background-image: url(../images/industry/dc-box2-next.png); background-position: right center;}
.dc-box2-btn span{ width: 16px; height: 27px; max-width: 25%; max-height: 42%; background: url(../images/industry/dc-box2-prev.png) left center no-repeat; background-size: contain;}
.dc-box2-btn strong{ width: .8rem; height: 2px; background-color: #FFFFFF; width: 0; transition: all .3s;}
.dc-box2-btn i{ display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #FFFFFF; opacity: 0; transform: scale(0); transition: all .3s;}
.dc-box2-btn .dc-box2-prev:hover,
.dc-box2-btn .dc-box2-next:hover{ width: 158px; max-width: 2rem;}
.dc-box2-btn .dc-box2-prev:hover strong,
.dc-box2-btn .dc-box2-next:hover strong{ width: .8rem;}
.dc-box2-btn .dc-box2-prev:hover strong{ transform: translateX(-12px);}
.dc-box2-btn .dc-box2-next:hover strong{ transform: translateX(12px);}
.dc-box2-btn .dc-box2-prev:hover i,
.dc-box2-btn .dc-box2-next:hover i{ opacity: 1; transform: scale(1);}


.dc-box3-bg{ position: relative; padding: 1rem 0; overflow: hidden;}
.dc-box3-des{ max-width: 1068px; height: 34px; line-height: 34px; margin: .3rem auto; overflow: hidden; interpolate-size: allow-keywords; transition: all .3s;}
.dc-box3-des.active{ height: auto;}
.dc-box3-open{ width: fit-content; margin: 0 auto; cursor: pointer; transition: all .3s;}
.dc-box3-open i{ display: inline-block; vertical-align: middle; font-size: 80%; margin-left: 6px; transition: all .3s;}
.dc-box3-open.active i{ transform: rotate(-180deg);}
.dc-box3-open:hover{ color: var(--hover-color);}
.dc-box3-swiper{ position: relative; margin: .5rem 0 0; padding: 0 .9rem;}
.dc-box3-swiper .swiper-prev{ margin-left: -.3rem;}
.dc-box3-swiper .swiper-next{ margin-right: -.3rem;}
.dc-box3-item{ position: relative; display: block; border-radius: 10px; overflow: hidden;}
.dc-box3-img{ padding-bottom: 126.53%;}
.dc-box3-mask{ position: absolute; left: 0; bottom: 0; width: 100%; height: 50%; background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%); transition: all .3s;}
.dc-box3-text{ position: absolute; left: 0; bottom: 0; width: 100%; padding: .5rem; transition: all .3s;}
.dc-box3-hover{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: .5rem; opacity: 0; visibility: hidden; transition: all .3s;}
.dc-box3-name{ line-height: 1.5; margin: .3rem 0;}
.dc-box3-dot{ position: relative; width: 100%; height: 1px; background-color: rgba(255, 255, 255, 0.2);}
.dc-box3-dot::before{ display: block; content: ""; position: absolute; left: 50%; top: 50%; margin: -5px 0 0 -5px; width: 10px; height: 10px; border-radius: 10px; background-color: var(--main-color);}
.dc-box3-con{ line-height: 1.6; -webkit-line-clamp: 4; margin: .7rem auto;}
.dc-box3-more{ font-family: 'OPPOSans-M';}
.dc-box3-hover .dc-box3-name,
.dc-box3-hover .dc-box3-dot,
.dc-box3-hover .dc-box3-con,
.dc-box3-hover .dc-box3-more{ opacity: 0; visibility: hidden; transform: translateY(10px); transition: all .3s;}
.dc-box3-hover .dc-box3-dot::before{ background-color: #FFFFFF;}
.dc-box3-item:hover .dc-box3-img .imgBg{ transform: scale(1.05);}
.dc-box3-item:hover .dc-box3-text{ opacity: 0; visibility: hidden; transform: translateY(.2rem);}
.dc-box3-item:hover .dc-box3-mask{ height: 100%; background: var(--main-color); opacity: .9;}
.dc-box3-item:hover .dc-box3-hover{ opacity: 1; visibility: visible;}
.dc-box3-item:hover .dc-box3-hover .dc-box3-name,
.dc-box3-item:hover .dc-box3-hover .dc-box3-dot,
.dc-box3-item:hover .dc-box3-hover .dc-box3-con,
.dc-box3-item:hover .dc-box3-hover .dc-box3-more{ opacity: 1; visibility: visible; transform: translateY(0);}
.dc-box3-item:hover .dc-box3-hover .dc-box3-name{ transition: all .3s linear .3s;}
.dc-box3-item:hover .dc-box3-hover .dc-box3-dot{ transition: all .3s linear .4s;}
.dc-box3-item:hover .dc-box3-hover .dc-box3-con{ transition: all .3s linear .5s;}
.dc-box3-item:hover .dc-box3-hover .dc-box3-more{ transition: all .3s linear .7s;}

.dc-box4-bg{ position: relative; padding: 1rem 0; background-color: #F4F7FC; overflow: hidden;}
.dc-box4-swiper{ position: relative; margin: .5rem 0; padding: 0 .9rem;}
.dc-box4-swiper .swiper-btn span{ transform: translateY(-120%);}
.dc-box4-swiper .swiper-prev{ margin-left: -.3rem;}
.dc-box4-swiper .swiper-next{ margin-right: -.3rem;}
.dc-box4-item{ display: block;}
.dc-box4-img{ padding-bottom: 60.42%; border-radius: 10px; overflow: hidden;}
.dc-box4-time{ margin: .24rem 0; font-family: 'BaiJamjuree-SemiBold';}
.dc-box4-title{ margin: .2rem 0; transition: all .3s;}
.dc-box4-title.MultiLine{ -webkit-line-clamp: 2;}
.dc-box4-more{ font-family: 'OPPOSans-M';}
.dc-box4-item:hover .dc-box4-img .imgBg{ transform: scale(1.05);}
.dc-box4-item:hover .dc-box4-title{ color: var(--main-color);}
.dc-box4-item:hover .dc-box4-more i{ transform: rotate(0);}

/* 关注我们 */
.follow-bg{ position: relative; min-height: 5.55rem; padding: 1rem 0; background: url(../images/follow/follow-bg.png) center center no-repeat; background-size: cover; overflow: hidden;}
.follow-list{ margin-top: 1.3rem; gap: .45rem;}
.follow-list li{ position: relative;}
.follow-icon{ position: relative; display: block; width: 80px; height: 80px; max-width: .8rem; max-height: .8rem; margin: 0 auto; border-radius: 50%; overflow: hidden; cursor: pointer; z-index: 1;}
.follow-icon::before{ display: block; content: ""; position: absolute; left: 0%; top: 0%; transform: scale(0.9); width: 100%; height: 100%; border-radius: 50%; background-color: var(--main-color); z-index: -1;}
.follow-icon img{ display: block; width: 100%; height: 100%; object-fit: cover;}
.follow-con{ position: absolute; left: 50%; transform: translateX(-50%) translateY(-10px); bottom: 100%; width: 230px; max-width: 2.3rem; padding-bottom: .2rem; opacity: 0; visibility: hidden; transition: all .3s;}
.follow-con::before{ display: block; content: ""; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); border-top: .14rem solid #FFFFFF; border-left: .11rem solid transparent; border-right: .11rem solid transparent; margin-bottom: .07rem;}
.follow-img{ border-radius: 10px; overflow: hidden;}
.follow-img img{ display: block; width: 100%; height: auto;}
.follow-list li:hover{ z-index: 1;}
.follow-list li:hover .follow-con{ opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);}

.follow-box{ max-width: 1500px; margin: 0 auto; margin-top: .7rem;}
.follow-left{ flex-shrink: 0; max-width: 40%;}
.follow-right{ flex: auto;}
.follow-line{ flex-shrink: 0; width: 1px; height: 109px; max-height: 1.1rem; margin: 0 .6rem; margin-top: .8rem; background: url(../images/follow/follow-line.png) center center no-repeat; background-size: 100% 100%;}
.follow-title{ display: flex; flex-wrap: wrap; align-items: center; column-gap: .4rem; row-gap: .15rem;}
.follow-title span{ display: block; cursor: pointer;}
.follow-title span:not(.active){ color: rgba(255, 255, 255, 0.3); transition: all .3s;}
.follow-title span:not(.active):hover{ color: rgba(255, 255, 255, 0.8);}
.follow-title ~ .follow-list{ margin-top: .5rem;}
.follow-list li p{ margin-top: .2rem;}

/* dichan-shangye-detail */
.shangye-bg1{ padding: .4rem 0 .6rem;}
.shangye-title{ margin-bottom: .3rem;}
.shangye-info{ column-gap: .9rem; row-gap: .2rem; margin: .3rem 0 .4rem;}
.shangye-info img{ vertical-align: text-bottom; max-height: .34rem; margin-right: .12rem;}
.shangye-tag{ gap: .1rem;}
.shangye-tag span{ display: block; color: #6F6F6F; line-height: 1; padding: .1rem .2rem; background: #E3D9C5; border-radius: 6px;}
.shangye-bg3{ padding: .8rem 0 1.3rem;}
.shangye-box3{ max-width: 1500px; margin: 0 auto;}
.shangye-left{ flex-shrink: 0; min-width: 20%; padding-right: .2rem;}
.shangye-text{ color: rgba(0, 0, 0, 0.7); line-height: 1.7;}

/* dichan-zhuzhai-detail */
.zhuzhai-top{ position: relative; padding-top: 120px; background-color: #000000; overflow: hidden; z-index: 1;}
.zhuzhai-img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: .6; z-index: -1;}
.zuzhai-img-mask{ position: absolute; left: 0; top: 0; display: block; content: ""; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(15px); pointer-events: none;}
.zhuzhai-top .go-back{ color: #F4F7FC; border-color: rgba(255, 255, 255, 0.3);}
.zhuzhai-top .go-back:hover{ border-color: var(--main-color);}
.zhuzhai-top .bread-nav li{ color: rgba(255, 255, 255, 0.5);}
.zhuzhai-top .bread-nav li a{ color: rgba(255, 255, 255, 0.5);}
.zhuzhai-top .bread-nav li a:hover{ color: #FFFFFF;}
.zhuzhai-top .bread-nav li:first-child a{ background-image: url(../images/icon-home-white.png);}
.zhuzhai-box{ position: relative; height: 668px; max-height: 40vw; background-color: #FFFFFF; border-radius: 20px 20px 0 0; overflow: hidden;}
.zhuzhai-video{ position: relative; flex: auto; overflow: hidden;}
.zhuzhai-video .in-play{ right: auto; left: 50%; bottom: auto; top: 50%; transform: translate(-50%,-50%);}
.zhuzhai-video.playing .in-play{ display: none;}
.zhuzhai-text{ flex-shrink: 0; display: flex; flex-direction: column; width: 30%; max-width: 500px; padding: .45rem 2.6%;}
.zhuzhai-text .shangye-title{ margin-bottom: .44rem;}
.zhuzhai-text .shangye-tag{ margin-bottom: .3rem;}
.zhuzhai-text .shangye-info{ margin-top: .2rem;}
.zhuzhai-text .shangye-info p{ margin: .4rem 0;}
.zhuzhai-text .shangye-info p img{ width: 34px; object-fit: contain; }
.zhuzhai-text .shangye-info p a{ color: #6F6F6F;}
.zhuzhai-morenews{ margin-top: auto; font-weight: normal;}
.zhuzhai-share{ margin: .3rem 0; row-gap: .1rem;}
.zhuzhai-share li{ max-width: 25%;}
.zhuzhai-share img{ display: block; width: 100%; height: auto; max-width: .94rem; max-height: .94rem; object-fit: contain; margin: 0 auto .1rem;}
.zhuzhai-share p{ opacity: .6;}

.zhuzhai-bg1{ position: relative; padding: 1.1rem 0 0; overflow: hidden;}
.zhuzhai-bg2{ position: relative; padding: 1.1rem 0 0; background: #FFFFFF; overflow: hidden;}
.zhuzhai-bg3{ background: #FFFFFF;}

.zhuzhai1-box{ position: relative; padding-bottom: 46.875%; margin-top: .6rem; overflow: hidden; z-index: 1;}
.zhuzhai1-img li{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; visibility: hidden; overflow: hidden; transition: all .6s linear;}
.zhuzhai1-img li img{ display: block; width: 100%; height: 100%; object-fit: cover;}
.zhuzhai1-img li.active{ opacity: 1; visibility: visible; transition: all .3s linear;}
.zhuzhai1-list{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.zhuzhai1-list li{ width: 16.77%; height: 100%; border-left: 1px solid rgba(255, 255, 255, 0.2); transition: all .3s linear;}
.zhuzhai1-item{ position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; padding: .3rem; text-align: center;}
.zhuzhai1-title{ position: relative; margin-bottom: .1rem;}
.zhuzhai1-title span{ font-size: 82%;}
.zhuzhai1-info{ margin-bottom: .4rem;}
.zhuzhai1-info p{ font-size: 75%;}
.zhuzhai1-line{ display: block; width: 47px; height: 2px; background-color: #FFFFFF; margin: 0 auto;}
.zhuzhai1-con{ height: 0; line-height: 1.6; margin-top: .6rem; interpolate-size: allow-keywords; overflow: hidden;}
.zhuzhai1-list li.active{ width: 50%; text-align: left;}
.zhuzhai1-list li.active .zhuzhai1-item{ align-items: flex-start; max-width: 600px; margin: 0 auto; text-align: left;}
.zhuzhai1-list li.active .zhuzhai1-title span{ font-size: 100%;}
.zhuzhai1-list li.active .zhuzhai1-info p{ font-size: 100%;}
.zhuzhai1-list li.active .zhuzhai1-line{ margin-left: 0;}
.zhuzhai1-list li.active .zhuzhai1-con{ height: auto; transition: all .6s linear .3s;}

/* yimei */
.ym-box1-list{ column-gap: .2rem; row-gap: .2rem; margin-top: .9rem;}
.ym-box1-icon{ width: 116px; height: 116px; max-width: 1.2rem; max-height: 1.2rem; border-radius: 50%; margin: 0 auto .2rem;}
.ym-box1-icon img{ max-width: 100%; max-height: 100%;}
.ym-box1-con{ color: rgba(0, 0, 0, 0.7);}
.ym-box1-list li:hover .ym-box1-icon img{ animation: swing 1s linear;}

.ym-box2-box{ margin-top: .6rem;}
.ym-box2-left{ flex-shrink: 0; width: 38%; text-align: center;}
.ym-box2-left .swiper-container{ height: 545px; max-height: 6rem;}
.ym-box2-left .swiper-slide{ display: flex; flex-direction: column; align-items: center; justify-content: center; padding-right: 9px; background: url(../images/industry/ym-box2-line.png) right top repeat-y; transition: background 1s linear;}
.ym-box2-left .ym-box2-year{ font-size: 187px; line-height: 1; color: rgba(0, 0, 0, 0.1); font-family: 'BaiJamjuree-SemiBold'; transition: all .3s; cursor: pointer;}
.ym-box2-left .swiper-slide-thumb-active{ background-image: url(../images/industry/ym-box2-line-active.png);}
.ym-box2-left .swiper-slide-thumb-active .ym-box2-year{ color: var(--main-color);}
.ym-box2-btn{ color: rgba(0, 0, 0, 0.2); line-height: 50px;}
.ym-box2-btn span{ transition: all .3s; cursor: pointer;}
.ym-box2-btn span.swiper-button-disabled{ cursor: no-drop; opacity: .6;}
.ym-box2-btn span:not(.swiper-button-disabled):hover{ color: var(--main-color);}

.ym-box2-right{ position: relative; flex: auto; padding: 0 .3rem; overflow: hidden;}
.ym-box2-right .swiper-container{ position: absolute; left: 0; right: 0; top: 0; width: 90%; max-width: 860px; height: calc(100% - 80px); margin: 0 auto;}
.ym-box2-right .swiper-slide{ display: flex; flex-direction: column;}
.ym-box2-right .ym-box2-year{ flex-shrink: 0; line-height: 1.2; color: var(--main-color); margin-bottom: .1rem; font-family: 'BaiJamjuree-SemiBold';}
.ym-box2-text{ flex: auto; color: rgba(0, 0, 0, 0.7); overflow: hidden;}
.ym-box2-text p{ margin: .25rem 0;}
.ym-box2-text p span{ color: var(--main-color);}
.ym-box2-text p span.dot{ padding-right: .1rem;}
.ym-box2-text img{ max-width: 100% !important; height: auto; border-radius: .2rem;}
.ym-box2-con{ max-height: 100%; padding-right: .6rem; overflow-y: auto;}
.ym-box2-con::-webkit-scrollbar{ width: 7px; height: 7px; max-width: 0.08rem; max-height: 0.08rem; background-color: #F3F8FF; border-radius: 4px;}
.ym-box2-con::-webkit-scrollbar-thumb{ background: var(--main-color); border-radius: 4px;}

.ym-box3-bg{ background: #F3F8FF; margin-top: 0 !important;}
.ym-box4-bg{ background: #FFFFFF;}

.ym-box3-tab{ gap: .2rem; margin: .4rem 0 .6rem;}
.ym-box3-tab li{ flex: none; width: fit-content; border: none;}
.ym-box3-tab li span{ display: block; color: rgba(0, 0, 0, 0.7); padding: .12rem .4rem !important; border-radius: .3rem; background-color: #FFFFFF; cursor: pointer; transition: all .3s;}
.ym-box3-tab li:not(.active) span:hover{ color: var(--main-color);}
.ym-box3-tab li.active span{ background-color: var(--main-color); color: #FFFFFF;}

.ym-box3-box{ max-width: 1500px; margin: 0 auto;}
.ym-box3-item{ position: relative;}
.ym-box3-big{ flex-shrink: 0; position: relative; width: 50%;}
.ym-box3-big .swiper-container{ border-radius: .2rem;}
.ym-box3-big .ym-box3-mask{ display: none;}
.ym-box3-mini{ flex-shrink: 0; width: 47%;}
.ym-box3-mini .swiper-container{ border-radius: .2rem;}
.ym-box3-mini .ym-box3-text{ display: none;}
.ym-box3-img{ position: relative; padding-bottom: 78.88%; border-radius: .2rem; overflow: hidden;}
.ym-box3-mask{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); transition: all .3s;}

.ym-box3-text li{ position: absolute; left: 106%; bottom: 20%; max-width: 100%; z-index: 1;}
.ym-box3-line{ width: 198px; max-width: 3rem; height: 5px; max-height: .06rem; margin-bottom: .4rem; transform: translateX(-52%);}
.ym-box3-line span{ display: block; width: 0%; height: 100%; background-color: var(--main-color);}
.ym-box3-title{ opacity: 0; visibility: hidden; transform: translateX(10px);}
.ym-box3-text li.active .ym-box3-line span{ width: 100%; transition: all .3s linear .3s;}
.ym-box3-text li.active .ym-box3-title{ opacity: 1; visibility: visible; transform: translateX(0); transition: all .5s linear .5s;}

.ym-box3-btn{ position: absolute; right: 0; bottom: 0; gap: .1rem; z-index: 1;}

/* wenhua */
.wh-box2-bg{ position: relative; overflow: hidden;}
.wh-box2-page{ position: relative;}
.wh-box2-img{ padding-bottom: 46.875%;}
.wh-box2-text{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1;}
.wh-box2-text .wrap{ height: 100%;}
.wh-box2-con{ width: 530px; max-width: 50%; height: 100%; padding: .6rem .3rem; background-color: rgba(0, 0, 0, 0.4);}
.wh-box2-more{ margin-top: .6rem;}
.wh-box2-page:nth-child(2n + 1) .wh-box2-con{ margin-left: auto;}
.wh-box2-page:hover .wh-box2-img .imgBg{ transform: scale(1.05); transition: all 2s linear;}

.wh-box3-list{ margin: 0 -.15rem; margin-top: .3rem;}
.wh-box3-list li{ width: 50%; padding: .15rem;}
.wh-box3-link{ padding: .35rem .3rem; background: #FFFFFF; border-radius: .1rem; box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.07); transition: all .3s;}
.wh-box3-img{ flex-shrink: 0; width: 40%; max-width: 327px; border-radius: .1rem; overflow: hidden;}
.wh-box3-img .imgBg{ height: 100%; min-height: 2.4rem;}
.wh-box3-right{ flex: auto; display: flex; flex-direction: column; padding: 0 .3rem;}
.wh-box3-right .dc-box4-time{ margin: 0;}
.wh-box3-right .dc-box4-more{ margin-top: auto;}
.wh-box3-link:hover{ background: var(--main-color); transform: translateY(-5px);}
.wh-box3-link:hover .wh-box3-right *{ color: #FFFFFF;}

/* wenhua-detail */
.wh-top-text{ position: relative; flex: auto; display: flex; flex-direction: column; padding: .6rem .5rem .3rem; overflow: hidden;}
.wh-top-text .shangye-title{ margin-bottom: .2rem;}
.wh-top-text .shangye-info{ margin: 0;}
.wh-top-text .shangye-tag{ margin-bottom: .3rem;}
.wh-top-text .shangye-text{ flex: auto; padding-right: .1rem; margin-right: -.1rem; overflow-y: auto;}
.wh-top-text .shangye-text::-webkit-scrollbar{ width: 7px; height: 7px; max-width: 0.08rem; max-height: 0.08rem; background-color: #F3F8FF; border-radius: 4px;}
.wh-top-text .shangye-text::-webkit-scrollbar-thumb{ background: var(--main-color); border-radius: 4px;}
.wh-top-line{ display: block; width: 100%; height: 1px; background-color: rgba(0, 0, 0, 0.1); margin: .3rem auto;}
.wh-top-img{ flex-shrink: 0; width: 30%; max-width: 432px;}
.wh-top-img .imgBg{ height: 100%;}

.wh-detail-swiper{ margin-top: .6rem;}
.wh-detail-swiper .swiper-slide{ width: 90%; max-width: 1268px; margin: 0 auto;}
.wh-detail-swiper .wh-detail-img{ border-radius: .2rem; overflow: hidden;}
.wh-detail-mask{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000000; opacity: .5; transition: all .3s linear;}
.wh-detail-option{ margin-top: .6rem;}
.wh-detail-option .swiper-pagination{ width: auto; margin: 0 .2rem;}
.wh-detail-option .swiper-pagination-bullet{ margin: 0 .12rem;}
.wh-detail-swiper .swiper-slide-active .wh-detail-mask{ opacity: 0;}

/* shangye */
.sy-box1-tab{ justify-content: space-evenly; margin: .5rem; column-gap: .2rem; row-gap: .1rem;}
.sy-box1-tab li span{ display: block; opacity: .5; cursor: pointer; transition: all .3s;}
.sy-box1-tab li.active span{ color: var(--main-color); opacity: 1;}
.sy-box1-link{ position: relative; display: block; overflow: hidden;}
.sy-box1-img{ padding-bottom: 38.69%; border-radius: .3rem;}
.sy-box1-mask{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000000; opacity: .4;}
.sy-box1-text{ position: absolute; left: 0; top: 50%; right: 0; transform: translateY(-50%); padding: .3rem; z-index: 1;}
.sy-box1-con{ max-width: 645px; margin: .4rem auto; -webkit-line-clamp: 2;}
.sy-box1-link:hover .sy-box1-img .imgBg{ transform: scale(1.05);}
.sy-box1-link:hover .box-more .flex{ background: var(--hover-color);}
.sy-box1-link:hover .box-more .flex i{ background-color: #FFFFFF; color: var(--main-color); font-size: 80%; transform: translateX(25%);}
.sy-box1-swiper .swiper-pagination{ display: none;}

.sy-box2-bg{ position: relative; padding: 1.2rem 0 0; overflow: hidden;}
.sy-box2-bg .wrap{ max-width: 1530px;}
.sy-box2-img{ background-color: #000000;}
.sy-box2-img li{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000000; z-index: -1; transform: scale(1.1); opacity: 0; visibility: hidden; transition: all 1s linear;}
.sy-box2-img li::before,
.sy-box2-img li::after{ display: block; content: ""; position: absolute; left: 0; bottom: 0; z-index: 1;}
.sy-box2-img li::before{ width: 65%; height: 100%; background: linear-gradient(to right,rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);}
.sy-box2-img li::after{ width: 100%; height: 50%; background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%);}
.sy-box2-img li span{ display: block; width: 100%; height: 100%; opacity: .8;}
.sy-box2-img li.active{ transform: scale(1); opacity: 1; visibility: visible;}
.sy-box2-swiper{ max-width: 50%; margin: 1.6rem 0;}
.sy-box2-title{ margin-bottom: .5rem;}
.sy-box2-con{ max-width: 710px; line-height: 30px; height: 90px; margin-bottom: .5rem;}
.sy-box2-label{ position: relative; color: #adadad; line-height: 30px; padding: .4rem 0; text-align: center; cursor: pointer; transition: all .3s;}
.sy-box2-label::before{ display: block; content: ""; position: absolute; left: 0%; top: 0; width: 100%; height: 3px; max-height: .04rem; background-color: #FFFFFF; opacity: .2; transition: all .3s;}
.sy-box2-label::after{ display: block; content: ""; position: absolute; left: 50%; top: 0; width: 0%; height: 3px; background-color: #FFFFFF; opacity: .2; transition: all .3s;}
.sy-box2-thumbs .swiper-slide-thumb-active .sy-box2-label{ color: #FFFFFF;}
.sy-box2-thumbs .swiper-slide-thumb-active .sy-box2-label::after{ left: 0; width: 100%; opacity: 1;}
.sy-box3-bg .dc-box1-list{ max-width: 1350px; gap: .2rem;}
.sy-box3-bg .box1-num{ justify-content: center; width: fit-content; margin: 0 auto;}
.sy-box4-bg{ position: relative; padding: 1rem 0 1.4rem; overflow: hidden;}
.sy-box4-list{ row-gap: .2rem; margin: 0 -.4rem;}
.sy-box4-list li{ width: 25%; padding: 0 .4rem;}
.sy-box4-item{ position: relative; height: 100%; min-height: 124px; padding: 0 50px;}
.sy-box4-item::before,
.sy-box4-item::after{ display: block; content: ''; width: 58px; height: 124px; position: absolute; top: 50%; transform: translateY(-50%);}
.sy-box4-item::before{ left: 0; background: url(../images/industry/leaf-left.png) left center no-repeat; background-size: contain;}
.sy-box4-item::after{ right: 0; background: url(../images/industry/leaf-right.png) right center no-repeat; background-size: contain;}
.sy-box4-title{ margin-bottom: .1rem;}

/* shangye-jiudian */
.jd-top-swiper{ position: relative; flex: auto; overflow: hidden;}
.jd-top-swiper .jd-top-img{ display: block; width: 100%; height: 100%;}
.jd-top-swiper .swiper-pagination{ position: absolute; bottom: .3rem; z-index: 1;}
.jd-top-swiper .swiper-pagination-bullet{ max-width: 12px; max-height: 12px; background-color: #FFFFFF; opacity: 1; margin: 0 .1rem;}
.jd-top-swiper .swiper-pagination-bullet-active{ background: var(--main-color);}
.jd-top-swiper .swiper-btn .swiper-prev{ left: .2rem;}
.jd-top-swiper .swiper-btn .swiper-next{ right: .2rem;}
.jd-box-bg{ padding: .7rem 0;}
.jd-box{ background-color: #FFFFFF; border-radius: .1rem;}
.jd-left{ flex: auto; padding: .5rem; overflow: hidden;}
.jd-left-title{ margin-bottom: .4rem;}
.jd-left-text{ height: 330px; max-height: 4rem; color: rgba(0, 0, 0, 0.6); padding-right: .4rem; overflow-y: auto; font-family: 'OPPOSans-M';}
.jd-left-text::-webkit-scrollbar{ width: 7px; height: 7px; max-width: 0.08rem; max-height: 0.08rem; background-color: #F3F8FF; border-radius: 4px;}
.jd-left-text::-webkit-scrollbar-thumb{ background: var(--main-color); border-radius: 4px;}
.jd-right{ flex-shrink: 0; width: 30%; max-width: 500px; padding: .56rem 2%; border-left: 1px solid rgba(0, 0, 0, 0.1);}
.jd-right .follow-list{ margin: .3rem 0; gap: .15rem;}
.jd-right .follow-list + .jd-right-title{ margin-top: .8rem;}
.jd-right .follow-con{ max-width: 1.6rem; filter: drop-shadow(0 0 10px rgba(0,0,0,.1));}

/* shangye-gouwu */
.gouwu-bg{ position: relative; overflow: hidden;}
.gouwu-big .swiper-slide{ background-color: #000000;}
.gouwu-big .gouwu-img{ padding-bottom: 41.67%; background-color: #000000; overflow: hidden; animation-duration:5s;	animation-timing-function:linear; animation-fill-mode: forwards; -webkit-animation-duration:5s;	-webkit-animation-timing-function:linear; -webkit-animation-fill-mode: forwards;}
.gouwu-big .gouwu-img .imgBg{ opacity: .8;}
.leftUp .gouwu-img{-webkit-animation-name:leftUp;animation-name:leftUp;}
.moveRight .gouwu-img{-webkit-animation-name:moveRight;animation-name:moveRight;}
.moveDown .gouwu-img{-webkit-animation-name:moveDown;animation-name:moveDown;}
.centerBig .gouwu-img{-webkit-animation-name:centerBig;animation-name:centerBig;}
.rightDownBig .gouwu-img{-webkit-animation-name:rightDownBig;animation-name:rightDownBig;}

.gouwu-box{ position: absolute; left: 0; bottom: 0; width: 100%; padding: .8rem 0; background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(8px);}
.gouwu-small{ max-width: 1500px; margin: 0 auto;}
.gouwu-small .swiper-container{ padding-top: 2px;}
.gouwu-small .swiper-slide{ position: relative; border-top: 1px solid rgba(244, 247, 252, .2);}
.gouwu-small .swiper-slide::before{ display: block; content: ""; position: absolute; left: 0; top: -3px; width: 60px; height: 5px; background: var(--main-color); transition: all .3s;}
.gouwu-small .swiper-slide-thumb-active .gouwu-title{ color: var(--hover-color);}
.gouwu-item{ width: 400px; max-width: 90%; cursor: pointer;}
.gouwu-title{ line-height: 1.2; margin: .4rem 0;}
.gouwu-con{ line-height: 1.6; -webkit-line-clamp: 2;}

.gouwu-box2 .shangye-left{ width: 33.33%;}
.gouwu-box2 .shangye-info p{ margin: .2rem 0;}
.gouwu-box2 .shangye-info p img{ min-width: .34rem; object-fit: contain;}
.gouwu-box2 .shangye-text{ max-height: 230px; padding-right: .5rem; overflow-y: auto;}
.gouwu-box2 .shangye-text::-webkit-scrollbar{ width: 6px; height: 6px; max-width: 0.06rem; max-height: 0.06rem; background-color: #F3F8FF; border-radius: 4px;}
.gouwu-box2 .shangye-text::-webkit-scrollbar-thumb{ background: var(--main-color); border-radius: 4px;}

/* shangye-wuye */
.wuye-box2-bg{ position: relative; overflow: hidden;}
.wuye-box2-img{ padding-bottom: 46.875%;}
.wuye-box2-text{ position: absolute; left: 0; bottom: 0; width: 100%; padding: .6rem 0; background-color: rgba(0, 0, 0, 0.4); backdrop-filter: blur(8px);}
.wuye-box2-text .dc-box1-list{ max-width: 100%; margin: 0 auto;}
.wuye-box2-text .box1-num{ width: fit-content; color: #FFFFFF;}

.wuye-box3-left{ flex-shrink: 0; width: 42%; border-radius: .1rem; overflow: hidden;}
.wuye-box3-left img{ max-width: 100%; height: auto;}
.wuye-box3-right{ flex: auto; padding: 0 .6rem; display: flex; flex-direction: column;}
.wuye-box3-right .shangye-title{ flex-shrink: 0;}
.wuye-box3-con{ display: flex; flex-direction: column; height: 100%;}
.wuye-box3-text{ flex: auto; height: 260px; max-height: 3rem; line-height: 1.8; color: rgba(0, 0, 0, 0.7); padding-right: .45rem; overflow-y: auto;}
.wuye-box3-text::-webkit-scrollbar{ width: 6px; height: 6px; max-width: 0.06rem; max-height: 0.06rem; background-color: #F3F8FF; border-radius: 4px;}
.wuye-box3-text::-webkit-scrollbar-thumb{ background: var(--main-color); border-radius: 4px;}

/* search */
.search-bg{ margin-top: .48rem;}
.search-top{ padding: .6rem .5rem .3rem; margin: .34rem auto; background-color: #FFFFFF; border-radius: 10px;}
.search-top-name{ flex-shrink: 0; min-width: 1.1rem; line-height: 66px; padding-right: .3rem;}
.search-top-right{ flex: auto; max-width: 1266px; overflow: hidden;}
.search-top-box{ position: relative;}
.search-top-input{ display: block; width: 100%; height: 66px; padding: .1rem .2rem; padding-right: 55px; border-radius: 6px; border: 1px solid #DDDDDD;}
.search-top-btn{ position: absolute; right: 0; top: 0; display: block; width: 55px; height: 100%; border: none; background: url(../images/icon-search-gray.png) center center no-repeat; background-size: 60% auto; cursor: pointer;}
.search-top-result{ line-height: 1.1; margin: .3rem 0;}
.search-top-result span{ margin-right: .1rem;}
.search-list{ margin-bottom: .7rem;}
.search-list li{ margin: .34rem 0;}
.search-link{ padding: .4rem; background-color: #FFFFFF; border-radius: 6px; transition: all .6s;}
.search-text{ flex: auto; max-width: 1160px; overflow: hidden;}
.search-title span{ color: var(--main-color);}
.search-con{ margin: .3rem 0; -webkit-line-clamp: 2; opacity: .7;}
.search-btn{ flex-shrink: 0; margin-left: .4rem;}
.search-link:hover{ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);}
.search-link:hover .search-btn .flex{ background-color: var(--hover-color);}
.search-link:hover .search-btn .flex i{ background-color: #FFFFFF; color: var(--main-color); font-size: 80%; transform: translateX(25%);}

/* about */
.a1-box-bg{ position: relative; padding: 1rem 0; overflow: hidden;}
.a1-box-bg .dc-box1-text{ max-width: 1380px;}
.a1-box-bg .dc-box1-list{ max-width: 800px;}
.a1-video{ position: relative; max-width: 1500px; margin: 0 auto; margin-top: .9rem; margin-bottom: .2rem; border-radius: .2rem; object-fit: cover; overflow: hidden;}
.a1-video video{ display: block; width: 100%; height: 100%; object-fit: cover;}
.a1-video video::-webkit-media-controls-play-button,
.a1-video video::-webkit-media-controls-start-playback-button { display: none !important;}
.a1-video video::-moz-media-controls-play-button { display: none !important;}
.a1-video-btn{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 105px; height: 105px; max-width: 1.1rem; max-height: 1.1rem; border-radius: 50%; cursor: pointer;}
.a1-video-btn span{ position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; border-radius: 50%; background-color: var(--main-color); background-position: center center; background-size: contain; background-repeat: no-repeat; transition: all .3s;}
.a1-video-btn .a1-video-play{ background-image: url(../images/icon-play.png); opacity: 1;}
.a1-video-btn .a1-video-pause{ background-image: url(../images/icon-pause.png); opacity: 0; pointer-events: none;}
.a1-video.playing .a1-video-play { opacity: 0; pointer-events: none; transform: scale(0.8);}
.a1-video:not(.playing) .a1-video-play { opacity: 1; pointer-events: auto; transform: scale(1);}
.a1-video:not(.playing) .a1-video-pause { opacity: 0; pointer-events: none;}
.a1-video.playing:not(:hover) .a1-video-pause { opacity: 0; pointer-events: none;}
.a1-video.playing:hover .a1-video-pause { opacity: 1; pointer-events: auto;}

.a2-box-bg{ max-width: 1920px; margin: 0 auto; background: url(../images/about/a2-bg2.png) right center no-repeat; background-size: cover;}
.a2-left{ position: relative; flex-shrink: 0; width: 34.58%; padding: 1.2rem .3rem; background: url(../images/about/a2-bg1.png) center center no-repeat; background-size: cover; z-index: 1;}
.a2-left::before{ display: block; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--main-color); opacity: .9; z-index: -1;}
.a2-left img{ max-width: 65%; height: auto;}
.a2-right{ flex: auto; padding: 1rem .3rem; padding-left: .9rem; overflow: hidden;}
.a2-list{ display: grid; grid-template-columns: repeat(2, 1fr); gap: .3rem;}
.a2-list li:nth-child(1) { grid-column: 1; grid-row: 1;}
.a2-list li:nth-child(2) { grid-column: 1; grid-row: 2; display: flex; flex-direction: column; justify-content: end;}
.a2-list li:nth-child(3) { grid-column: 2; grid-row: 1 / 3;}
.a2-title{ margin-bottom: .3rem;}
.a2-text{ line-height: 1.8;}

.a3-box-bg{ position: relative; padding: 1rem 0; overflow: hidden;}
.a3-box{ max-width: 1500px; gap: .3rem; margin: 0 auto;}
.a3-left{ flex: auto; overflow: hidden;}
.a3-right{ flex-shrink: 0; max-width: 55%;}
.a3-right img{ max-width: 100%; height: auto; border-radius: .2rem;}
.a3-text{ line-height: 1.8; margin: .2rem 0 .4rem;}
.a3-more{ margin-top: auto;}

.a4-box-bg{ position: relative; padding: 1rem 0; overflow: hidden; z-index: 1; background-color: var(--main-color);}
.a4-box-img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: .26; z-index: -1; pointer-events: none;}
.a4-item{ flex: 1; padding: 1rem 0;}
.a4-item ~ .a4-item{ border-left: 1px solid rgba(255, 255, 255, 0.4);}
.a4-line{ display: block; width: 56px; height: 3px; margin: .4rem auto;}
.a4-line span{ display: block; width: 100%; height: 100%; background-color: #FFFFFF; margin: 0 auto;}
.a4-more{ margin-top: .65rem;}

.company-bg{ position: relative; padding: 0.9rem 0; background: url(../images/about/company-bg.png) center center #F4F7FC fixed no-repeat; background-size: cover; overflow: visible;}
.company-bg .index-title{ max-width: 1500px; margin: 0 auto;}
.company-box{ align-items: flex-start; max-width: 1500px; margin: .4rem auto;}
.company-left{ position: sticky; position: -webkit-sticky; top: 90px; width: 30%; max-width: 428px; padding: 0 .5rem; margin-right: .5rem; background: url(../images/about/company-left-bg.png) center center no-repeat; background-size: cover; overflow: hidden;}
.company-item{ margin: .5rem 0;}
.company-item img{ max-width: 90%; height: auto; opacity: .2; margin-left: -5%;}
.company-label{ font-weight: normal; opacity: .7;}
.company-con span{ line-height: 1.1; font-family: 'BaiJamjuree-SemiBold';}
.company-right{ flex: auto; width: 68%; padding-left: .5rem; color: rgba(0, 0, 0, 0.7); line-height: 1.8; border-left: 1px solid rgba(2, 105, 184, .1); overflow: hidden;}

.party-bg{ position: relative; padding: 1rem 0 1.1rem; overflow: hidden;}
.party-bg:nth-child(2n){ background-color: #F4F7FC;}
.party-bg:has(.page){ padding-bottom: 0 !important;}
.party-bg .wrap{ max-width: 1530px;}
.party-title{ margin-bottom: .6rem;}
.party-title .index-title{ margin-bottom: 0;}
.bread-bg + .party-title{ margin-top: .7rem;}

.party1-box{ display: grid; margin: 0 auto; grid-template-columns: 45.8% auto auto; gap: .3rem;}
.party1-swiper{ position: relative; border-radius: .1rem; overflow: hidden;}
.party1-swiper .swiper-slide{ position: relative;}
.party1-swiper .swiper-pagination{ position: absolute; right: 0; bottom: 0; text-align: right; padding: .4rem .2rem; margin: 0;}
.party1-swiper .swiper-pagination-bullet{ width: 10px; height: 10px; max-width: 1.2rem; max-height: 1.2rem; margin: 0 .07rem; background-color: #FFFFFF; opacity: .4;}
.party1-swiper .swiper-pagination-bullet-active{ opacity: 1; background-color: var(--main-color);}
.party1-img{ height: 100%;}
.party1-img .imgBg{ height: 100%; min-height: 4.8rem; transition: all 1s linear;}
.party1-mask{ position: absolute; left: 0; bottom: 0; width: 100%; height: 50%; background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%);}
.party1-name{ position: absolute; left: 0; bottom: 0; width: 100%; padding: .3rem; padding-right: 100px !important;}
.party1-swiper .swiper-slide:hover .party1-img .imgBg{ transform: scale(1.05);}
.party1-item{ padding: .3rem; background-color: #F4F7FC; border-radius: .1rem; transition: all .3s;}
.party1-title{ margin: .1rem 0; -webkit-line-clamp: 2; transition: all .3s;}
.party1-line{ width: 100%; height: 1px; background-color: rgba(0, 0, 0, 0.1); margin: .2rem 0; transition: all .3s;}
.party1-con{ line-height: 30px; height: 120px; color: rgba(0, 0, 0, 0.6); margin: .5rem auto; -webkit-line-clamp: 4; transition: all .3s;}
.party1-year{ opacity: .6; margin-bottom: .1rem; font-family: 'BaiJamjuree-SemiBold'; transition: all .3s;}
.party1-date{ line-height: 1; font-family: 'BaiJamjuree-SemiBold'; transition: all .3s;}
.party1-arrow{ opacity: .5; transition: all .3s;}
.party1-item:hover{ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); transform: translateY(-5px); background-color: var(--main-color);}
.party1-item:hover .party1-title,
.party1-item:hover .party1-con,
.party1-item:hover .party1-year,
.party1-item:hover .party1-date,
.party1-item:hover .party1-arrow{ color: #FFFFFF;}
.party1-item:hover .party1-line{ background-color: rgba(255, 255, 255, 0.1);}
.party2-swiper{ position: relative; padding: 0; margin: 0;}
.party2-swiper .swiper-btn.absolute span{ transform: translateY(-50%);}
.party2-swiper .swiper-btn.absolute .swiper-prev{ left: auto; right: 100%; margin-right: .6rem; margin-left: 0;}
.party2-swiper .swiper-btn.absolute .swiper-next{ right: auto; left: 100%; margin-left: .6rem; margin-right: 0;}
.party2-link{ display: block; height: 100%; background-color: #FFFFFF; border-radius: 6px; overflow: hidden; transition: all .3s;}
.party2-img{ padding-bottom: 66.39%; border-radius: 6px;}
.party2-text{ padding: .4rem .3rem;}
.party2-title{ opacity: .8; line-height: 1.5; height: 4.5em; -webkit-line-clamp: 3; margin-bottom: .2rem; transition: all .3s;}
.party2-time{ opacity: .6; margin: .1rem 0; font-family: 'BaiJamjuree-SemiBold'; transition: all .3s;}
.party2-link:hover{ background-color: var(--main-color);}
.party2-link:hover .party2-img .imgBg{ transform: scale(1.05);}
.party2-link:hover .party2-title{ opacity: 1; color: #FFFFFF;}
.party2-link:hover .party2-time{ color: #FFFFFF;}
.party3-left{ position: relative; flex-shrink: 0; width: 49.2%;}
.party3-left .party1-img .imgBg{ min-height: 5rem;}
.party3-right{ flex: auto; padding-left: .35rem; overflow: hidden;}
.party3-list{ display: flex; flex-direction: column; height: 100%; border-top: 1px solid rgba(0, 0, 0, 0.1);}
.party3-list li{ flex: 1; border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.party3-list li a{ display: flex; flex-direction: column; justify-content: center; height: 100%; padding: .2rem 0;}
.party3-title{ line-height: 1.5; -webkit-line-clamp: 2; transition: all .3s;}
.party3-time{ margin-top: .2rem; opacity: .6; font-family: 'BaiJamjuree-SemiBold'; transition: all .3s;}
.party3-list li a:hover .party3-title{ color: var(--main-color);}
.party3-list li a:hover .party3-time{ opacity: 1;}

.party-list{ margin: .5rem -.19rem; row-gap: .4rem;}
.party-list li{ width: 33.33%; padding: 0 .19rem;}
.party-list .party1-item{ display: flex; flex-direction: column; height: 100%;}
.party-list .party1-title{ line-height: 1.6; height: 3.2em; margin-bottom: 0 !important;}
.party-list .party1-line{ margin-bottom: 0 !important;}
.party-list .party1-bot{ margin-top: auto;}

.news-bg{ background: #F4F7FC;}
.news-bg:nth-child(2n){ background-color: #FFFFFF;}
.news3-box{}
.news3-img{ position: relative; flex-shrink: 0; width: 48.66%; z-index: 1; overflow: hidden;}
.news3-img .imgBg{ padding-bottom: 56.07%; transition: all 1s;}
.news3-text{ width: 70.4%; margin-left: -19.06%; margin-top: 1rem; padding-left: 19.06%; background-color: #FFFFFF;}
.news3-con{ padding: .6rem .5rem 1rem;}
.news3-title{ margin-bottom: .2rem; transition: all .3s;}
.news-des{ line-height: 1.7; color: rgba(0, 0, 0, 0.7); height: 200px; padding-right: .5rem; overflow-y: auto;}
.news-des::-webkit-scrollbar{ width: 6px; height: 6px; max-width: 0.06rem; max-height: 0.06rem; background-color: #F3F8FF; border-radius: 4px;}
.news-des::-webkit-scrollbar-thumb{ background: var(--main-color); border-radius: 4px;}

.news-title{ flex: auto; overflow: hidden;}
.news-title p{ margin-top: .2rem;}
.news-search{ flex-shrink: 0; position: relative; width: 348px;}
.news-input{ display: block; width: 100%; height: calc(36px + .3rem); padding: .1rem .2rem; padding-right: 60px; border-radius: 6px; border: 1px solid #DDDDDD; background: transparent; transition: all .3s;}
.news-input:focus{ border-color: var(--main-color);}
.news-btn{ position: absolute; right: 0; top: 0; width: 60px; height: 100%; background: url(../images/icon-search-gray.png) center center no-repeat; background-size: 55% auto; border: none; cursor: pointer;}

.media-top{ margin: .3rem 0; border-radius: .1rem; background-color: #FFFFFF; overflow: hidden;;}
.media-left{ flex-shrink: 0; width: 50%; border-radius: .1rem; overflow: hidden;}
.media-img{ display: block; height: 100%;}
.media-img .imgBg{ height: 100%; transition: all 1s;}
.media-right{ flex: auto; display: flex; flex-direction: column; gap: .4rem; padding: .6rem .7rem; overflow: hidden;}
.media-name{ -webkit-line-clamp: 2;}
.media-name a{ color: #000000; transition: all .3s;}
.media-con{ color: rgba(0, 0, 0, 0.7); line-height: 1.8; -webkit-line-clamp: 4;}
.media-img:hover .imgBg{ transform: scale(1.05);}
.media-name a:hover{ color: var(--main-color);}
.media-top:has(.media-name a:hover) .media-img .imgBg,
.media-top:has(.box-more .flex:hover) .media-img .imgBg{ transform: scale(1.05);}
.media-top:has(.media-img:hover) .media-name a,
.media-top:has(.box-more .flex:hover) .media-name a{ color: var(--main-color);}
.media-top:has(.media-img:hover) .box-more .flex,
.media-top:has(.media-name a:hover) .box-more .flex{ background: var(--hover-color);}
.media-top:has(.media-img:hover) .box-more .flex i,
.media-top:has(.media-name a:hover) .box-more .flex i{ background-color: #FFFFFF; color: var(--main-color); font-size: 80%; transform: translateX(25%);}

.media-list{ margin: .3rem 0;}
.media-list li{ margin: .32rem 0;}
.media-link{ padding: .4rem; background-color: #FFFFFF; border-radius: 6px; transition: all .3s;}
.media-time{ flex-shrink: 0; line-height: 1.2; text-align: center; font-family: 'BaiJamjuree-SemiBold';}
.media-time span{ margin-bottom: .1rem;}
.media-text{ flex: auto; overflow: hidden;}
.media-info{ flex: auto; max-width: 965px; margin: 0 .8rem; overflow: hidden;;}
.media-title{ margin-bottom: .3rem; transition: all .3s;}
.media-brief{ color: rgba(0, 0, 0, 0.7); line-height: 1.6; -webkit-line-clamp: 3; height: 4.8em;}
.media-more{ flex-shrink: 0;}
.media-link:hover{ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); transform: translateY(-5px);}
.media-link:hover .media-title{ color: var(--main-color);}
.media-link:hover .box-more .flex{ background: var(--hover-color);}
.media-link:hover .box-more .flex i{ background-color: #FFFFFF; color: var(--main-color); font-size: 80%; transform: translateX(25%);}

.topic-bg{ padding-top: 0 !important;}
.topic-list li{ margin: .7rem 0;}
.topic-list .news3-con{ padding-bottom: .8rem;}
.topic-con{ line-height: 1.7; height: 5.1em; margin-bottom: .4rem;}
.topic-list .news3-box:hover .news3-img .imgBg{ transform: scale(1.05);}
.topic-list .news3-box:hover .news3-title{ color: var(--main-color);}
.topic-list .news3-box:hover .box-more .flex{ background: var(--hover-color);}
.topic-list .news3-box:hover .box-more .flex i{ background-color: #FFFFFF; color: var(--main-color); font-size: 80%; transform: translateX(25%);}

.detail-bg .wrap{ max-width: 1530px;}
.news-detail{ padding: .6rem .9rem; margin: 0 auto 1rem; background: #FFFFFF; border-radius: 6px;}
.news-info{ column-gap: .3rem; color: rgba(0, 0, 0, 0.5); font-family: 'OPPOSans-M';}
.news-name{ line-height: 1.2; margin: .3rem 0 .6rem;}
.news-line{ width: 126px; max-width: 2rem; height: 4px; max-height: .04rem; background-color: var(--main-color); margin: .6rem 0;}
.news-text{ color: rgba(0, 0, 0, 0.8); line-height: 1.8; margin: .6rem 0;}
.news-page{ margin: .3rem 0; text-align: center;}
.news-page a{ display: flex; align-items: center; width: 564px; max-width: 45%; padding: 7px 12px; background-color: #F4F6F9; border-radius: 50px; transition: all .3s;}
.news-page a i{ flex-shrink: 0; width: 88px; height: 88px; max-width: .9rem; max-height: .9rem; background-color: var(--main-color); border-radius: 50%; transition: all .3s;}
.news-page a span{ flex: auto; overflow: hidden; transition: all .3s;}
.news-page .news-prev span{ padding-right: 10%;}
.news-page .news-next{ flex-direction: row-reverse;}
.news-page .news-next span{ padding-left: 10%;}
.news-page a:hover{ background-color: var(--main-color); color: #FFFFFF; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);}
.news-page a:hover i{ background-color: var(--hover-color); transform: scale(0.9);}
.news-detail-swiper{ margin: .4rem 0 1rem;}