body{
  background-image:url(https://tkww-static.tkww.hk/special/DongjiangWater/bg.jpg);
  background-size:100% 100%;
}
body .footer{
  background-color: #136fa9;
}
.water-audio{
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:0;
  opacity:0;
}
.water-shadow-inner-content-inner-unit-img-text{
  font-size: 18px;
  color: #4c6974;
  width: calc(851 / 1277* 100%);
  margin: 5px auto 0;
  line-height: 23px;
}
.water-list-unit{
  width:calc( 18 / 1280 * 100% );
  height:18px;
  background-color:#e08d30;
  border-radius:50%;
  position:absolute;
  cursor:pointer;
  transform: translate(-50%, -50%);
}
.water-list-unit:nth-child(1){
  left: calc( 947 / 1280 * 100%);
  top: 7.5%;
}
.water-list-unit:nth-child(2){
  left: calc( 883 / 1280 * 100%);
  top: 12%;
}
.water-list-unit:nth-child(3){
  left: calc(707 / 1280 * 100%);
  top: 17.5%;
}
.water-list-unit:nth-child(4){
  left: calc( 832 / 1280 * 100%);
  top: 39%;
}
.water-list-unit:nth-child(5){
  left: calc( 582 / 1280 * 100%);
  top: 43.5%;
}
.water-list-unit:nth-child(6){
  left: calc(635 / 1280* 100%);
  top: 51.3%;
}
.water-list-unit:nth-child(7){
  left: calc( 517 / 1280 * 100%);
  top: 67%;
}
.water-list-unit:nth-child(8){
  left: calc( 255 / 1280 * 100%);
  top: 68.5%;
}
.water-list-unit:nth-child(9){
  left: calc( 408 / 1280 * 100%);
  top: 69.5%;
}
.water-list-unit:nth-child(10){
  left: calc( 408 / 1280 * 100%);
  top: 78%;
}
.water-list-unit:nth-child(11){
  left: calc(396 / 1280* 100%);
  top: 86.5%;
}
.water-list-unit:nth-child(12){
  left: calc(429 / 1280 * 100%);
  top: 86.5%;
}
.water-list-unit-inner{
  position:absolute;
  width:100%;
  height:100%;
  background-color:#e08d30;
  transform: scale(0);
  opacity: 1;
  left:0;
  top:0;
  border-radius:50%;
}
.water-list{
  position:absolute;
  width:100%;
  height:100%;
  z-index:99;
  left:0;
  top:0;
}
.water-map{
  width:100%;
  position:relative;
  z-index:10;
}
@keyframes flash{
  0%{
    opacity: 1;
    transform: scale(0);
  }
  100%{
    opacity: 0;
    transform: scale(3);
  }
}
.water-list-unit-active .water-list-unit-inner{
  animation:flash 1.5s infinite linear;
}

.water-box{
  margin-top:20px;
  position:relative;
}
.video-shadow{
  display:none;
  position:fixed;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background-color:rgba(0,0,0,0.7);
  z-index:99;
  align-items:center;
}
.water-shadow{
  position:fixed;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), #226da2 20%, #226da2 80%, rgba(0, 0, 0, 0));
  z-index:99;
  align-items:center;
  display:none;
}
.video-shadow .main-box,.water-shadow .main-box{
  flex:1;
}
.video-shadow-inner{
  width:calc( 833 / 1280 * 100%);
  height:calc( 833px * 9 / 16 );
  position:relative;
  margin:0 auto;
}
.water-shadow-inner{
  width:100%;
  background-image: linear-gradient(209deg, 
    #ffffff 16%, 
    #ddf6ff 38%, 
    #bbecff 59%, 
    #ddf6ff 69%, 
    #ffffff 100%), 
    linear-gradient(
      #ffffff, 
      #ffffff);
  background-blend-mode: normal, 
    normal;
  box-shadow: 0px 3px 28px 15px 
    rgba(36, 110, 163, 0.49);
  border-radius: 20px;
  position:relative;
}
.water-shadow-inner-content{
  width:100%;
  max-height:70vh;
  overflow-y:auto;
  overflow-x:hidden;
  padding-bottom:46px;
}
.water-shadow-inner-content-inner-unit{
  margin-top:35px;
}
.water-shadow-inner-content-inner-unit-img{
  width:calc( 851 / 1277 * 100% );
  margin:0 auto;
}
.water-shadow-inner-content-inner-unit-text{
  margin-top:20px;
  font-size: 21px;
  color: #004372;
  text-indent:42px;
  line-height:36px;
}
.water-shadow-inner-content-inner-unit-text-unit{
  margin-top:20px;
}
.water-shadow-inner-content-inner-unit-text-unit:first-of-type{
  margin-top:0;
}
.water-shadow-inner-content-inner{
  width:calc( 1147 / 1277 * 100% );
  margin:0 auto;
}
.video-shadow-close{
  position:absolute;
  right:0;
  bottom:calc( 100% + 5px );
  width:40px;
  cursor:pointer;
}
.water-shadow-close{
  position:absolute;
  right:0;
  top:-29px;
  width:40px;
  cursor:pointer;
}
.bg1{
  background-image:url(https://tkww-static.tkww.hk/special/DongjiangWater/bg1.png);
  background-size:100% auto;
  background-position:left bottom;
  background-repeat:no-repeat;
  padding-bottom:72px;
}
.news-list .common-column-list-unit-box{
  padding:26px 0;
  background-image: linear-gradient(56deg, #1a82c3 43%, #00caad 66%, rgba(0, 0, 0, 0) 87%);
  background-blend-mode: normal;
}
.news-list .common-column-list-unit-title{
  height:unset;
}
.news-list .common-column-list-unit-title,.news-list .common-column-list-unit-text{
  color:#ffffff!important;
}
.news-list .common-column-list-unit-bottom-time{
  color:#ffffff;
  margin-left:auto;
}
.news-list.common-column-list-ur .common-column-list-unit{
  align-items:center;
}
.news-list .common-column-list-unit-box:nth-child(2n){
  background-image: linear-gradient(56deg, rgba(0, 0, 0, 0) 16%, #00caad 37%, #1a82c3);
}
.news-list .common-column-list-unit{
  width:100%;
  padding: 0 57px 0 39px;
}
.news-list .common-column-list-unit-img{
  width:476px;
  height:calc( 476px * 9 / 16 );
  border-radius: 10px;
}
.common-column-list-ur.news-list .common-column-list-unit-content{
  padding:0 0 0 64px;
}
.swiper4.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
  top:calc( 100% + 5px );
}
.story-list{
  margin-top:20px;
}
.swiper4 .common-column-list-unit-title{
  color:#ffffff!important;
}
.column-section{
  margin-top:40px;
}
.column-title-box{
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
}
.column-title{
  height:84px;
  flex:none;
}
.colunmn-more{
  height:31px;
  line-height:31px;
  padding-left:25px;
  padding-right:25px;
  color: #ffffff;
  font-size: 20px;
  position:absolute;
  right:0;
  bottom:3px;
  background-image:linear-gradient(to right,rgba(0,0,0,0),#67a0da,rgba(0,0,0,0));
}
.swiper1-title-bac{
  width:100%;
  padding:28px 0;
  background-color: #27a3ea;
}

.swiper1 .swiper1-button-prev,.swiper1 .swiper1-button-next,.swiper-button-prev.swiper4-button,.swiper-button-next.swiper4-button{
  width:32px;
  height:auto;
  margin-top:0;
  transform:translateY(-50%);
}
.swiper1 .swiper1-button-prev,.swiper-button-prev.swiper4-button{
  left:0;
}
.swiper1 .swiper1-button-next{
  right:calc( 422 / 1280 * 100% );
}
.swiper-button-next.swiper4-button{
  right:0;
}
.column-swiper-slide-title{
  height: 161px;
  display:block;
}
.column-swiper-slide-title-bac{
  position:absolute;
  z-index:99;
  left:0;
  bottom:0;
  width:100%;
  background-image: linear-gradient(0deg, 
		#075b91 0%, 
		rgba(0,0,0,0) 100%);
}
.video-list{
  display:none;
}
.swiper4 .swiper-shadow{
  position:absolute;
  z-index:199;
  width:100%;
  height:100%;
  background-image: linear-gradient(90deg, 
		#0098bf 0%,#0098bf 16%, 
		rgba(0,0,0,0) 100%);
}
.swiper-slide-prev .swiper-shadow{
  background-image: linear-gradient(270deg, 
		#0098bf 0%,#0098bf 16%, 
		rgba(0,0,0,0) 100%);
}
.swiper4-box{
  margin-top:19px;
  position:relative;
}
.swiper4{
  width:calc( 503 / 1280 * 100% );
  overflow:visible;
}
.swiper4 .swiper-slide{
  cursor:pointer;
}
.swiper4-slide{
  position:relative;
  /*border-radius: 25px;
  border: solid 3px #ffffff;*/
  overflow:hidden;
  display:none;
}
.swiper4-slide.swiper-slide-active{
  box-shadow: 3.8px -7.1px 16px 0px rgba(6, 6, 6, 0.2);
}
.swiper-slide-active .swiper4-slide,.swiper-slide-prev .swiper4-slide,.swiper-slide-next .swiper4-slide{
  display:block;
}
.swiper4-img-box{
  position:relative;
  z-index:10;
}
.swiper4-img{
  width:100%;
  height:calc( 730px * 9 / 16 );
}
.swiper4-title-box{
  background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.5));
  position:absolute;
  z-index:99;
  left:0;
  width:100%;
  height:139px;
  box-sizing:border-box;
  bottom:0;
  display:flex;
  padding:0 22px 22px 43px;
  align-items:flex-end;
  justify-content:space-between;
}
.swiper4-title{
  flex:none;
  color:#ffffff!important;
  font-size: 46px;
  max-width:500px;
}
.swiper4-time{
  font-size:28px;
  flex:none;
  color:#ffffff!important;
}
.swiper4-button{
  width:32px;
  height:auto;
  margin-top:0;
  transform:translateY( -50% );
}
.swiper-box{
  margin-top:24px;
}
.swiper-box>.main-box{
  position:relative;
}
.swiper1 .swiper-pagination-bullet,.swiper4-box .swiper-pagination-bullet{
  border-radius:4px;
}
.swiper1{
  width:100%;
  background-image: linear-gradient(80deg, 
		#0b4c95 41%, 
		#40d4ef 100%), 
	linear-gradient(
		#233d77, 
		#233d77);
	background-blend-mode: normal, 
		normal;
	border-radius: 10px;
}
/*body .swiper-container,body .swiper-wrapper{
  height:auto;
}*/
.swiper1-slide-inner{
  display:flex;
  width:100%;
  height:100%;
}
.swiper1-slide-left{
  flex:none;
  height:100%;
  position:relative;
}
.swiper1-img{
  width:829px;
  height:calc( 829px * 9 / 16 );
  box-sizing:content-box;
  border-radius: 10px;
  border: solid 6px #64c6fa;
  display:block;
  overflow:hidden;
  position:relative;
}
.swiper1-slide-right{
  flex:1;
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.swiper1-title{
  font-size:22px;
  color: #ffffff;
  width:80%;
  margin: 0 auto;
  line-height: 34.6px;
  transition:0.5s;
}
.swiper1-slide-right-line{
  width:86%;
  margin:14px auto 0;
  border-bottom:1px dashed #ffffff;
}
.swiper1 .common-column-list-unit-bottom-time{
  color:#ffffff;
  margin-top:10px;
  text-align:right;
  width:80%;
  margin-left:auto;
  margin-right:auto;
}
.swiper1-text{
  font-size:17px;
  line-height: 22.6px;
  width:80%;
  margin: 29px auto 0 auto;
  color:#ffffff;
}
.swiper1-pagination{
  text-align:left;
  padding-left:21%;
}
.swiper4-pagination{
  text-align:center;
  width:100%;
}
.swiper1-pagination .swiper-pagination-bullet,.swiper4-pagination .swiper-pagination-bullet{
  opacity: 1;
}
.swiper1 .swiper-pagination-bullet,.swiper4-box .swiper-pagination-bullet{
  width:27px;
}

.swiper1-slide-right-top-line,.swiper1-slide-right-bottom-line{
  width:238px;
  height:1px;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  background-image:linear-gradient(to right,transparent, rgba(237,227,150,1), transparent);
}
.swiper1-slide-right-top-line{
  top:17px;
}
.swiper1-slide-right-bottom-line{
  bottom:17px;
}
.swiper1 .swiper-pagination-bullet,.swiper4-box .swiper-pagination-bullet{
  background-color:#e6ae57!important;
}
.swiper1 .swiper-pagination-bullet:nth-child(2n),.swiper4-box .swiper-pagination-bullet:nth-child(2n){
  background-color:#fe8223!important;
}
body .swiper1 .swiper-pagination-bullet-active:nth-child(n),body .swiper4-box .swiper-pagination-bullet-active:nth-child(n){
  box-shadow: 0px 3px 9px 4px 
		#00a1dc;
  background-color:#ffffff!important;
}
.swiper4 .common-column-list-unit-content{
  margin-top:11px;
}
.swiper-slide-active .swiper4-slide .common-column-list-unit-box{
  background-image: linear-gradient(73deg, 
		#00b3d4 18%, 
		#157cce 100%), 
	linear-gradient(0deg, 
		#6c95e1 0%, 
		#ffffff 100%);
	background-blend-mode: normal, 
		normal;
}
.swiper-slide-prev .swiper4-slide .common-column-list-unit-box,.swiper-slide-next .swiper4-slide .common-column-list-unit-box{
  background-image: linear-gradient(176deg, 
		#1a82c3 59%, 
		#00caad 100%), 
	linear-gradient(0deg, 
		#6c95e1 0%, 
		#ffffff 100%);
}
.swiper4-slide{
  border-radius: 10px;
}
.swiper4 .common-column-list-unit-img{
  height:calc( 475px * 9 / 16  );
  border-radius:10px;
}
.swiper4 .common-column-list-unit{
  width:100%;
  margin:0 auto;
}
.swiper4-slide .common-column-list-unit{
  width:calc( 475 / 503 * 100% );
}
.swiper4-slide .common-column-list-unit-box{
  padding-top:14px;
  padding-bottom:24px;
}
@media ( min-width:768px ){
  @-moz-document url-prefix() {
    .water-shadow-inner-content{
      scrollbar-width: thin;
      scrollbar-color: #42a8d3 #ffffff;
    }
  }
  .water-shadow-inner-content::-webkit-scrollbar{
    width: 10px;
    height: 10px;
  }
  .water-shadow-inner-content::-webkit-scrollbar-button{
    display:none;
  }
  .water-shadow-inner-content::-webkit-scrollbar-track{
    background: #ffffff;
    border-radius:1vw;
  }
  .water-shadow-inner-content::-webkit-scrollbar-thumb{
    background: #42a8d3;
    border-radius:1vw;
  }
  .water-shadow-inner-content::-webkit-scrollbar-thumb:hover{
    background: #42a8d3;
  }
  .water-shadow-inner-content::-webkit-scrollbar-corner {
    background: #42a8d3;
  }
}
@media (max-width:1400px){
  .video-shadow-inner{
    height:calc( 91vw * 833 / 1280 * 9 / 16 )
  }
  .swiper1-img{
    width:calc( 829 / 1280 * 91vw );
    height:calc( 829 / 1280 * 91vw * 9 / 16 );
  }
  .news-list .common-column-list-unit-img{
    width:calc( 476 / 1280 * 91vw );
    height:calc( 476 / 1280 * 91vw * 9 / 16 );
  }
  .swiper4 .common-column-list-unit-img{
    height:calc( 91vw * 475 / 503 * 503 / 1280 * 9 / 16  );
  }
  .water-list-unit{
    height:calc( 91vw * 18 / 1280 );
  }
  /*.water-list-unit:nth-child(1){
    top: calc( 91vw * 96 / 1280 );
  }
  .water-list-unit:nth-child(2){
    top: calc( 91vw * 165 / 1280 );
  }
  .water-list-unit:nth-child(3){
    top: calc( 91vw * 245 / 1280 );
  }
  .water-list-unit:nth-child(4){
    top: calc( 91vw * 553 / 1280 );
  }
  .water-list-unit:nth-child(5){
    top: calc( 91vw * 955 / 1280 );
  }
  .water-list-unit:nth-child(6){
    top: calc( 91vw * 976 / 1280 );
  }
  .water-list-unit:nth-child(7){
    top: calc( 91vw * 995 / 1280 );
  }
  .water-list-unit:nth-child(8){
    top: calc( 91vw * 1109 / 1280 );
  }
  .water-list-unit:nth-child(9){
    top: calc( 91vw * 1233 / 1280 );
  }*/
}
@media (max-width:1099px){
  .swiper1-title-bac{
    padding-top:1vw;
    padding-bottom:1vw;
  }
  .swiper1-title{
    font-size:2vw;
    line-height:2.2vw;
  }
  .swiper1-text{
    font-size:1.7vw;
    line-height:2vw;
  }
  .column-title{
    height: 8vw;
  }
}
@media (max-width:767px){
  .water-shadow-inner-content{
    padding-bottom:7vw;
  }
  .water-shadow-inner-content-inner-unit-text{
    font-size:4.27vw;
    text-indent:calc( 4.27vw * 2 );
    line-height:5.33vw;
  }
  .water-shadow-inner-content-inner-unit-text-unit,.water-shadow-inner-content-inner-unit-text{
    margin-top:4vw;
  }
  .water-shadow-inner-content-inner-unit{
    margin-top:7vw;
  }
  .water-shadow-inner-content-inner-unit-img{
    width:100%;
  }
  .water-list-unit{
    width:2.5vw;
    height:2.5vw;
  }
  .video-shadow-inner{
    width:100%;
    height:calc( ( 100vw - 1.87vw - 1.87vw ) * 9 / 16 );
  }
  .video-shadow-close,.water-shadow-close{
    width:8vw;
  }
  .swiper1-slide-inner{
    display:block;
  }
  .swiper1-img{
    width:100%;
    height:calc( ( 100vw - 1.87vw - 1.87vw - 6px - 6px ) * 9 / 16 + 6px + 6px );
    box-sizing:border-box;
  }
  .column-swiper-slide-title{
    height:8vw;
  }
  .swiper1-title{
    font-size:4.27vw;
    line-height:5.33vw;
    width:96.26%;
  }
  .swiper1 .common-column-list-unit-bottom-time{
    width:96.26%;
  }
  .swiper1-text{
    display:none;
  }
  .swiper1-pagination{
    padding-left:0;
    text-align:center;
  }
  .swiper1{
    padding-bottom:10vw;
  }
  .swiper1 .swiper-pagination-bullet, .swiper4-box .swiper-pagination-bullet{
    width:5vw;
  }
  .column-title{
    height:13vw;
  }
  .colunmn-more{
    font-size: 3.73vw;
    height:6vw;
    line-height:6vw;
  }
  .swiper1 .swiper1-button-prev, .swiper1 .swiper1-button-next{
    width:7vw;
    top:calc( ( ( 100vw - 1.87vw - 1.87vw - 6px - 6px ) * 9 / 16 + 6px + 6px ) / 2 );
  }
  .swiper1 .swiper1-button-next{
    right:0;
  }
  .swiper4-box{
    display:none;
  }
  .video-list{
    display:block;
  }
  .video-list .common-column-list-unit-title{
    color:#ffffff;
  }
  .video-list .common-column-list-unit{
    width:100%;
  }
  .common-column-list-unit-img{
    height:calc( ( 100vw - 1.87vw - 1.87vw ) * 9 / 16 );
  }
  .common-column-list-unit-title{
    -webkit-line-clamp: 2;
    height:unset;
  }
  .news-list .common-column-list-unit{
    padding:0;
  }
  .news-list .common-column-list-unit-box{
    padding:0;
    background-image: unset;
    margin-top:6.53vw;
  }
  .news-list .common-column-list-unit-box:first-of-type{
    margin-top:0;
  }
  .news-list .common-column-list-unit-box:nth-child(2n){
    background-image: unset;
  }
  .common-column-list-col-1 .common-column-list-unit{
    margin-top:6.53vw;
  }
  .news-list .common-column-list-unit-img{
    height:calc( ( 100vw - 1.87vw - 1.87vw ) * 9 / 16 );
    width:100%;
  }
  .common-column-list-unit-text{
    display:none;
  }
  .bg1{
    background-image:unset;
    padding-bottom:0;
  }
  .water-shadow-inner-content-inner-unit-img-text{
    width:100%;
    font-size:3.73vw;
    margin:1vw auto 0;
    line-height:5vw;
  }
}