@charset "utf-8";
@font-face {
  font-family: 'icongo';
  src: url('../font/iconfont.ttf?t=1649324623219') format('truetype');
}

body {
	background: #fff;
}
.icon-go {font-family: 'icongo'; font-size: 18px; font-style: normal; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale; }
.icon-go:before{content: "\e79c";}

.cwhy_header {
	background: url(../images/cwhy/bg_top.png) no-repeat center top;
	padding-top: 34.375%;
	background-size: cover;
}

.cwhy_main {
	position: relative;
	overflow: hidden;
	margin-top: -6.375rem;
}

.main_top {
	position: relative;
	width: 100%;
	border-top: solid 5px #3067d7;
	min-height: 7rem;
	background: #fff;
}
.main_top::before {
	content: "";
	position: absolute;
	left: -3.4375rem;
	top: 0;
	width: 2px;
	height: 0;
	border-left: solid 3.4375rem transparent;
	border-top: transparent;
	border-bottom: solid 6.6875rem #fff;
	border-right: 0;
}
.main_top::after {
	content: "";
	position: absolute;
	right: -3.4375rem;
	top: 0;
	width: 2px;
	height: 0;
	border-right: solid 3.4375rem transparent;
	border-top: transparent;
	border-bottom: solid 6.6875rem #fff;
	border-left: 0;
}
.container.main_top{overflow: visible;}
.hy_title {
	text-align: center;
	line-height:1.8;
	padding: 0.9em 0;
	font-size: 1.875rem;
	font-weight: bold;
}

.hy_title span {
	letter-spacing: 0;
}

.hy_title i {
	display: inline-block;
	width: 2em;
	height: 1.8em;
	background: url(../images/cwhy/wjx.png) center no-repeat;
	background-size: 40%;
}

.hy_title em {
	color: #999;
	padding-left: .3em;
	padding-right: .3em;
	font-style: normal;
	font-weight: 100;
}

.zt_title {
	font-size: 2.375rem;
	text-align: center;
	letter-spacing: .1em;
	color: #d11313;
	line-height: 1.5;
}

.zt_time {
	text-align: center;
	color: #333;
	opacity: .6;
	line-height: 2;
}

.mainbox {
	width: 47.5%;
	margin-top: 1.25rem;
}
.mainbox.fl{float: left;}
.mainbox.fr{float: right;}

.box_title {
	font-size: 1.875rem;
	padding-left: 1em;
	position: relative;
	margin: 1.5rem 0;
}

.box_title::after {
	content: "";
	position: absolute;
	left: 0;
	top: .5rem;
	height: .8em;
	width: 0.25rem;
	background: #da3325;
}

.ytcon{height: 21rem; overflow: auto;}
.ytcon::-webkit-scrollbar {
	width: 3px;
	/*设置滚动条的宽度*/
}
/* 滚动区域的样式 */
.ytcon::-webkit-scrollbar-thumb {
	border-radius: 10px;
	/*设置滚动条的圆角*/
	-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	/*设置内阴影*/
	background: rgb(81, 193, 238, 0.2);
	/*设置滚动条的颜色*/
}
/* 滚动条的背景样式 */
.ytcon::-webkit-scrollbar-track {
	 -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); 
	border-radius: 0;
}
.ytcon ul {
	position: relative;
	margin-left: 1rem;
}

.ytcon ul::after {
	content: "";
	width: 0;
	position: absolute;
	left: 0.36rem;
	top: 2.8em;
	bottom: 2.5em;
	border-left: 1px dashed #666;
	z-index: 0;
}

.ytcon ul li {
	position: relative;
	z-index: 1;
	margin-left: 2em;
	padding-left: 3em;
	line-height: 1.7;
}

.ytcon ul li::after {
	content: "";
	width: 2.25rem;
	height: 2.25rem;
	position: absolute;
	left: -3rem;
	top: 50%;
	margin-top: -1.125rem;
	background: url(../images/cwhy/time.png) center no-repeat;
}

.ytcon ul li span {
	font-size: 1.125rem;
	display: block;
	padding: 1.4em 1em 1.4em 0;
	border-bottom: 1px solid #ccc;
	margin-bottom: -1px;
}

.ytcon ul li:hover {
	background: url(../images/cwhy/jy_li_bg.png) no-repeat;
	background-size: 100% 100%;
	z-index: 2;
}

.ytcon ul li:hover span {
	border-bottom: 0;
	margin-bottom: 0;
	color: #ca0909;
}

.ytcon ul li:hover::after {
	background: url(../images/cwhy/time1.png) center no-repeat;
}

.bftp{width:100%; height: 19.5625rem; position: relative;}
.bftp img{width: 100%; position: absolute; top:0; bottom:0; left: 0;}
.bftp::after{position: absolute; content: ""; left:50%; top: 50%; height:4rem; width: 4rem; background: url(../images/cwhy/bf_icon.png) center no-repeat rgba(0,0,0,.4); border-radius: 50%; margin-left: -2rem; margin-top: -2rem;}
.bftext{text-align: center; line-height: 2.5; font-size: 1.125rem;}

.tjtp{width:100%; height: 19.5625rem; position: relative;}
.tjtp img{width: 100%; position: absolute; top:0; bottom:0; left: 0;}

.mtjdcon{position: relative; background: #f6f7f8; border-radius: .6rem; height: 19.5625rem; box-sizing: border-box; padding: 2rem; }
.jdtext{font-size: 1.25rem; color: #000; padding: 1em 0; line-height: 1.5;}
.jdrq{color: #666; line-height: 2;font-size: 1.25rem;}

.mtjdcon .ckxq{color: #e98686; line-height: 3; font-size: 1.125rem; position: absolute; bottom: 2rem;}

.main_tp {
	margin: 2rem 0 3.5rem 0;
}

.main_bottom {
	background: #f6f7f8;
	width: 100%;
	overflow: hidden;
}
.main_bottom .container{overflow: visible;}
.swiper-container {
      width: 100%;
	  overflow: visible;
	  margin-bottom: 4rem;
}
    .swiper-slide {
      text-align: center;
	  width: 55%;
      font-size: 18px;
      background:url(../images/cwhy/wq_box_bg.png) right center no-repeat ;
	  background-size: 100% 100%;
      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
	  flex-direction:column;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
	  transition: 300ms;
	  padding-top: 3%;
	  padding-bottom: 3%;
	  opacity: 0;
	  box-sizing: border-box;
      min-height:25.8125rem;
    }
	.swiper-slide-active{
		opacity: 1;
	  z-index: 9;
	}
	.swiper-slide-prev,.swiper-slide-next{opacity: .6;}
	
.wq_swiper .rq_title{margin-left:1%; width: 99%;}
.wq_swiper .rq_title span{float: left; background: url(../images/cwhy/cwhy_htt.png) no-repeat; background-size: 100% 100%; width:30%; min-width: 10rem; height: 2.8em; font-size: 1.25rem; color: #fff; line-height: 2.4;}
.wq_swiper .wq_title{color: #d11313; font-size: 1.5rem; width: 90%; margin: .5em auto 1em;}
.wq_swiper .wq_jy{width: 86%; margin: 0 auto; text-align: left; text-indent: 2em; line-height: 1.8; max-height: 5.4em; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.wq_swiper .ckxq{display: block; width:12rem; margin-top: 1.2em; background: #ff6b54; border-radius: 1.3em; line-height:2.6em; color: #fff;}
.wq_swiper .ckxq:hover{color: #fff;}

.wq_swiper .ckxq i{display:inline-block; width: 1.4em; margin-right: -2em; color: #fff;}
.wq_swiper .pagea{position: absolute; left: 0; right: 0; top: 50%; height: 4em; margin-top: -2em;}
.wq_swiper .pagea .nav-b{position: absolute; top: 0; height: 2rem; width: 2rem; border-radius: 50%; border: #d11313 1px solid; color: #d11313; font-size: 2rem; cursor: pointer; z-index: 10;}
.wq_swiper .pagea .button-next{right: -3rem;}
.wq_swiper .pagea .button-prev{left: -3rem; transform:rotate(180deg);}


#jy_tab{margin-bottom:48px;}

@media (max-width: 1300px) {
	.cwhy_main {margin-top: -4rem;}
	.main_top {
		width: calc(100% - 6.875rem);
		margin: auto;
	}
	.main_bottom .container{overflow: hidden !important;}
	.main_tp img{transform: scale(1.2);}
	.wq_swiper .pagea .button-next{right: 4%;}
	.wq_swiper .pagea .button-prev{left: 4%;}
}

@media (max-width: 750px) {
	.cwhy_header {
		background-size: 140%;
		padding-top: 40%;
	}
	.cwhy_main {margin-top: -2rem;}
	.main_top {
		width: calc(100% - 3.875rem);
	}
	.hy_title {
		font-size: 1.25rem;
	}

	.zt_title {
		font-size: 1.375rem;
	}
	.mainbox {
		width: 96%;
		margin: 1rem 2%;
	}
	.box_title {
		font-size: 1.5rem;
	}
	.ytcon{height:auto;}
	.ytcon ul::after {left: 0;}
	.ytcon ul li {
		padding-left:1em;
	}
	.ytcon ul li:hover {
		background:#f9f4f4;
	}
	.bftp, .tjtp{width:100%; height:0; padding-top: 56.6%;}
	.main_tp{margin:0 0 1rem 0; overflow: hidden; height: 3rem;}
	.main_tp img{transform: scale(2);}
	.swiper-slide {
	  text-align: center;
	  width: 80%;
	  overflow: hidden !important;
	  }
}
@media (max-width: 640px) {
    .wq_swiper .pagea .button-next{right: 0;}
	.wq_swiper .pagea .button-prev{left: 0;}
}
@media (max-width: 480px) {
	.cwhy_header {
		background-size: 160%;
		padding-top: 45%;
	}
	.cwhy_main {margin-top: -1.2rem;}
	.main_top {
		width: calc(100% - 1rem);
	}
	.main_tp img{transform: scale(3);}
	.swiper-slide {
	  width:94%;
	  opacity: 0;
	  }
	.swiper-slide-active{opacity: 1;}
	.wq_swiper .wq_title{font-size: 1.4rem;}
}

/*手机适老版*/
body.older .ytcon ul li::after{left: -4.25rem;}
body.older.ytcon ul li{padding-left: 2em;}
body.older .main_cen a{
	font-size: 1.35em;
}
body.older .hy_title{font-size:2.1rem;}
body.older .ytcon ul li span {
	font-size: 1.5rem;
	display: block;
	padding: .8em .8em 1.2em 0;
}
body.older .bftext, body.older .jdtext, body.older .jdrq{font-size: 1.6rem;}
body.older .wq_swiper .rq_title{font-size: 1.5rem;}
body.older .wq_swiper .wq_title{font-size: 2rem; margin-bottom:.3em}
body.older .wq_swiper .wq_jy{font-size:1.75rem;}
body.older .wq_swiper .ckxq{font-size: 1.6rem; margin-top: .3em;}
body.older .swiper-container {height: 28rem;}
@media (max-width: 992px) {
  body.older .main_cen{margin-bottom: 30px;}
  body.older .mainbox{float: none; width: auto;}
  body.older .tjtp{height: auto;}
  body.older .tjtp img{position: static; display: block; width: 100%;}
  body.older .mtjdcon{height: auto;}
  body.older .bftp{height: auto;}
  body.older .bftp img{position: static; display: block; width: 100%;}
  body.older .mtjdcon .ckxq{position: static;}
  body.older .wq_swiper .wq_jy{display: none;}
}