@charset "utf-8";

@media (min-width: 768px) {
    html {
        font-size: 28px!important;
    }
}
@media (min-width: 1025px) {
	
    html {
        font-size: 30px!important;
    }
    body{
        -ms-overflow-style: scrollbar;
    }
}
@media (min-width: 1440px) {
    html {
        font-size: 36px!important;
    }
}
@media (min-width: 1680px) {
    html {
        font-size: 40px!important;
    }
}


@keyframes spin{
    to{transform: rotate(1turn);}
}
@keyframes spin2{
    to{transform: rotate(-1turn);}
}
@keyframes spin-reverse{
    from{
        transform:rotate(1turn);
    }
}
@keyframes spin-reverse2{
    from{
        transform:rotate(-1turn);
    }
}
.welfare-box{
	padding: 3rem 0;
}
.welfare-box .index-news .item{
	margin-bottom: 2.25rem;
}
.welfare-box .index-news .page-box{
	margin-top: .9rem;
}


@keyframes pointAni {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0
    }

    20% {
        opacity: 1
    }

    75% {
        transform: translate(-50%, -50%) scale(2);
        opacity: 0
    }

    100% {
        opacity: 0
    }

}
.all-bubbles{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.all-bubbles .bubble{
	position: absolute;
}
.all-bubbles .bubble .circle{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 100%;
}
.all-bubbles .bubble1{
	width: 115px;
	padding-top: 115px;
	left: 38%;
	top: -6.1%;
}
.all-bubbles .bubble1 .circle{
	border: 1px solid #fff;
}
.all-bubbles .bubble2{
	width: 12px;
	padding-top: 12px;
	left: 24.79%;
	top: 20.37%;
}
.all-bubbles .bubble2 .circle{
	background-color: #7dbbea;
}
.all-bubbles .bubble3{
	width: 35px;
	padding-top: 35px;
	left: 13.28%;
	top: 31%;
}
.all-bubbles .bubble3 .circle{
	background-color: #fff;
}

.all-bubbles .bubble4{
	width: 56.875%;
	padding-top: 56.875%;
	left: -26%;
	top: 48.15%;
}
.all-bubbles .bubble4 .circle{
	background: -webkit-linear-gradient(135deg, rgba(255,255,255,0),rgba(255,255,255,.05) 100%);
	background: -ms-linear-gradient(135deg, rgba(255,255,255,0),rgba(255,255,255,.05) 100%);
	background: linear-gradient(135deg, rgba(255,255,255,0),rgba(255,255,255,.05) 100%);
}
.all-bubbles .bubble5{
	width: 54px;
	padding-top: 54px;
	left: 7.552%;
	top: 63.88%;
}
.all-bubbles .bubble5 .circle{
	border: 1px solid #fff;
}

.all-bubbles .bubble6{
	width: 56.875%;
	padding-top: 56.875%;
	left: 71.1875%;
	top: -50.9%;
}
.all-bubbles .bubble6 .circle{
	background: -webkit-linear-gradient(135deg, rgba(255,255,255,.05),rgba(255,255,255,0) 100%);
	background: -ms-linear-gradient(135deg, rgba(255,255,255,.05),rgba(255,255,255,0) 100%);
	background: linear-gradient(135deg, rgba(255,255,255,.05),rgba(255,255,255,0) 100%);
}
.all-bubbles .bubble7{
	width: 84px;
	padding-top: 84px;
	left: 72%;
	top: 20.55%;
}
.all-bubbles .bubble7 .circle{
	background-color: #ff495f;
}
.all-bubbles .bubble8{
	width: 56.875%;
	padding-top: 56.875%;
	left: 50%;
	top: 85.648%;
}
.all-bubbles .bubble8 .circle{
	background: -webkit-linear-gradient(90deg, rgba(255,255,255,.0),rgba(255,255,255,.05) 100%);
	background: -ms-linear-gradient(90deg, rgba(255,255,255,.0),rgba(255,255,255,.05) 100%);
	background: linear-gradient(90deg, rgba(255,255,255,.0),rgba(255,255,255,.05) 100%);
}
.all-bubbles .bubble9{
	width: 26px;
	padding-top: 26px;
	left: 70.98958%;
	top: 90.27%;
}
.all-bubbles .bubble9 .circle{
	border: 1px solid #fff;
}
.all-bubbles .bubble10{
	width: 38px;
	padding-top: 38px;
	left: 87.2%;
	top: 97.685%;
}
.all-bubbles .bubble10 .circle{
	background-color: #fff;
}
.all-bubbles .bubble{
	animation:spin 6s infinite linear;
	transform-origin: 50% 40%;
}
.all-bubbles .bubble:nth-child(2n){
	animation:spin2 6s infinite linear;
}
.all-bubbles .bubble .circle{
	animation:spin-reverse 6s infinite linear;
}
.all-bubbles .bubble:nth-child(2n) .circle{
	animation:spin-reverse2 6s infinite linear;
}
.all-bubbles .sm-bubble{
	transform-origin: 30% 30px;
}


.ban-about-wrap{
	height: 100vh;
	position: relative;
}
.ban-about{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.fix{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.ban-about .text{
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	text-align: center;
	transform: translateY(-50%);
}
.ban-about .text .sub-tit{
	font-size: 1rem;
	line-height: 1.1rem;
	color: #fff;
}
.ban-about .text .tit{
	font-size: 1.75rem;
	line-height: 1.8rem;
	color: #fff;
	margin-top: .4rem;
}

.ban-about .ban-mask{
	position: absolute;
	left: 0%;
	top: 0%;
	width: 100%;
	height: 100%;
	transform: scale(34);
	transform-origin: center 45.37%;
}
.ban-about .ban-mask .mask-svg{
	position: absolute;
	left: 0;
	top: 0;
}
.ban-about .mask-svg>rect{
	-webkit-mask: url(#cup-mask);
	mask: url(#cup-mask);
	fill: #fff;
}
.heart-box{
	position: relative;
	height: 100vh;
	z-index: 1;
}
.heart-box .heart-wrap{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.heart-box .heart-bubbles-bg{
	position: absolute;
	left:0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	opacity: 0;
}
.heart-box .heart-bubbles-bg .bubble{
	position: absolute;
}
.heart-box .heart-bubbles-bg .bubble .circle{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 100%;
}
.heart-box .heart-bubbles-bg .bubble1{
	left: -15.625%;
	top: -15%;
	width: 44.17%;
	padding-top: 44.17%;
}
.heart-box .heart-bubbles-bg .bubble1 .circle{
	background: -webkit-linear-gradient(180deg, #eff8fe,#eff8fe 100%);
    background: -ms-linear-gradient(180deg, #eff8fe,#eff8fe 100%);
    background: linear-gradient(180deg, #eff8fe,#eff8fe 100%);
}
.heart-box .heart-bubbles-bg .bubble2{
	left: 72.9%;
	top: -47.22%;
	width: 49.375%;
	padding-top: 49.375%;
}
.heart-box .heart-bubbles-bg .bubble2 .circle{
	background-color: #eff8fe;
}
.heart-box .heart-bubbles-bg .bubble3{
	left: 72.9%;
	top: 71%;
	width: 44.17%;
	padding-top: 44.17%;
}
.heart-box .heart-bubbles-bg .bubble3 .circle{
	background-color: #e6f2fa;
}
.heart-box .heart-bubbles-bg .bubble4{
	left: 27.4479%;
	top: 24.8%;
	width: 75px;
	padding-top: 75px;
}
.heart-box .heart-bubbles-bg .bubble4 .circle{
	background-color:#e6f2fa;
}
.heart-box .heart-bubbles-bg .bubble5{
	left: 28.958%;
	top: 34.259%;
	width: 10px;
	padding-top: 10px;
}
.heart-box .heart-bubbles-bg .bubble5 .circle{
	background-color: #0068b7;
	opacity: .1;
}
.heart-box .heart-bubbles-bg .bubble6{
	left: 21.875%;
	top: 42.6%;
	width: 110px;
	padding-top: 110px;
}
.heart-box .heart-bubbles-bg .bubble6 .circle{
	border: 1px solid #0068b7;
}
.heart-box .heart-bubbles-bg .bubble7{
	left: 6.25%;
	top: 36.11%;
	width: 10px;
	padding-top: 10px;
}
.heart-box .heart-bubbles-bg .bubble7 .circle{
	background-color: #0068b7;
	opacity: .1;
}
.heart-box .heart-bubbles-bg .bubble8{
	left: 9.73958%;
	top: 45%;
	width: 6px;
	padding-top: 6px;
}
.heart-box .heart-bubbles-bg .bubble8 .circle{
	background-color: #0068b7;
	opacity: .1;
}
.heart-box .heart-bubbles-bg .bubble9{
	left: 76.2%;
	top: -1.85%;
	width: 140px;
	padding-top: 140px;
}
.heart-box .heart-bubbles-bg .bubble9 .circle{
	border: 1px solid #1380d3;
}
.heart-box .heart-bubbles-bg .bubble10{
	left: 66.1458%;
	top: 10.37%;
	width: 50px;
	padding-top: 50px;
}
.heart-box .heart-bubbles-bg .bubble10 .circle{
	border: 1px solid #0068b7;
}
.heart-box .heart-bubbles-bg .bubble11{
	left: 68.958%;
	top: 31.11%;
	width: 10px;
	padding-top: 10px;
}
.heart-box .heart-bubbles-bg .bubble11 .circle{
	background-color: #0068b7;
	opacity: .1;
}
.heart-box .heart-bubbles-bg .bubble12{
	left: 79.27%;
	top: 39.44%;
	width: 10px;
	padding-top: 10px;
}
.heart-box .heart-bubbles-bg .bubble12 .circle{
	background-color: #0068b7;
	opacity: .1;
}
.heart-box .heart-bubbles-bg .bubble13{
	left: 71.875%;
	top: 41.38%;
	width: 114px;
	padding-top: 114px;
}
.heart-box .heart-bubbles-bg .bubble13 .circle{
	border: 1px solid #0068b7;
}
.heart-box .heart-bubbles-bg .bubble14{
	left: 64.9479%;
	top: 55%;
	width: 16px;
	padding-top: 16px;
}
.heart-box .heart-bubbles-bg .bubble14 .circle{
	background-color: #0068b7;
	opacity: .1;
}
.heart-box .heart-bubbles-bg .bubble15{
	left: 81.4%;
	top: 51.38%;
	width: 70px;
	padding-top: 70px;
}
.heart-box .heart-bubbles-bg .bubble15 .circle{
	background-color: #7dbbea;
}
.heart-box .heart-bubbles-bg .bubble16{
	left: 56%;
	top: 71%;
	width: 140px;
	padding-top: 140px;
}
.heart-box .heart-bubbles-bg .bubble16 .circle{
	background-color: #cde7fa;
}

.heart-box .heart-bubbles-bg .bubble{
	animation:spin 6s infinite linear;
	transform-origin: 50% 45%;
}
.heart-box .heart-bubbles-bg .bubble:nth-child(2n){
	animation:spin2 6s infinite linear;
}
.heart-box .heart-bubbles-bg .bubble .circle{
	animation:spin-reverse 6s infinite linear;
}
.heart-box .heart-bubbles-bg .bubble:nth-child(2n) .circle{
	animation:spin-reverse2 6s infinite linear;
}
.heart-box .heart-bubbles-bg .sm-bubble{
	transform-origin: 30% 30px;
}


.heart-box .heart-cup{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	/* background-color: #fff; */
	opacity: 0;
	z-index: 2;
}
.heart-box .heart-cup .cup{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 6;
}
.heart-box .heart-cup .line{
	position: absolute;
	left: 0;
	bottom:0;
	width: 100%;
	height: 0%;
	overflow: hidden;
}
.heart-box .heart-cup .line .img{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100vh;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.heart-box .cup-bubbles{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	z-index: 3;
}

.heart-box .cup-bubbles .cls-1 {
  fill: #ea6c7f;
}

.heart-box .cup-bubbles .cls-2 {
  fill: #eee;
}

.heart-box .cup-bubbles .cls-3 {
  fill: #f07f8d;
}

.heart-box .cup-bubbles .cls-4,
.heart-box .cup-bubbles .cls-7 {
  fill: #fff;
}

.heart-box .cup-bubbles .cls-4,
.heart-box .cup-bubbles .cls-5,
.heart-box .cup-bubbles .cls-9 {
  fill-rule: evenodd;
}

.heart-box .cup-bubbles .cls-5,
.heart-box .cup-bubbles .cls-8 {
  fill: #d80c25;
}

.heart-box .cup-bubbles .cls-6,
.heart-box .cup-bubbles .cls-9 {
  fill: none;
  stroke: #fff;
  stroke-width: 1px;
}
.heart-box .heart-text{
	position: fixed;
	left: 0;
	bottom: 22%;
	width: 100%;
	text-align: center;
	z-index: 6;
	opacity: 0;
	z-index: 1;
}
.heart-box .heart-text .tit{
	
	line-height: 2.1rem;
	color: #333;
}
.heart-box .heart-text .tit1{
	font-size: 1.7rem;
	color: #0068b7;
}
.heart-box .heart-text .tit2{
	font-size: 1.7rem;
}
.heart-box .heart-text .tit1 span{
	font-size: 2.5rem;
}

.heart-box .red-bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 6;
}
.heart-box .red-bg circle{
	stroke-dashoffset: 4470;
	stroke-dasharray: 4470;
	transform: rotate(-90deg);
	/* transform-origin: 51.82% 33.854%; */
	transform-origin: 50% 44%;
}
.about-box{
	position: relative;
	z-index: 1;
	/* background-color: #d70c25; */
	/* margin-top: -100vh; */
}
.about-box .people-box{
	padding-top: 4.5rem;
	position: relative;
}
.about-box .people-box .bubbles-bg{
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.about-box .people-box .bubble{
	position: absolute;
}
.about-box .people-box .bubble .circle{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 100%;
}
.about-box .people-box .bubble1{
	width: 86px;
	padding-top: 86px;
	left: 28.125%;
	top: 11.11%;
}
.about-box .people-box .bubble1 .circle{
	background-color: #fff;
	opacity: .1;
}
.about-box .people-box .bubble2{
	width: 5px;
	padding-top: 5px;
	left: 9.375%;
	top: 39.8%;
}
.about-box .people-box .bubble2 .circle{
	background-color: #fff;
}
.about-box .people-box .bubble3{
	width: 178px;
	padding-top: 178px;
	left: 2%;
	top: 41.67%;
}
.about-box .people-box .bubble3 .circle{
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-image: url('../images/about-people-bg1.jpg')
}
.about-box .people-box .bubble4{
	width: 10px;
	padding-top: 10px;
	left: 7.3%;
	top: 49.537%;
}
.about-box .people-box .bubble4 .circle{
	background-color: #fff;
	opacity: .1;
}
.about-box .people-box .bubble5{
	width: 7px;
	padding-top: 7px;
	left: 10.7%;
	top: 58.33%;
}
.about-box .people-box .bubble5 .circle{
	background-color: #fff;
	opacity: .1;
}
.about-box .people-box .bubble6{
	width: 12px;
	padding-top: 12px;
	left: 10.7%;
	top: 58.33%;
}
.about-box .people-box .bubble6 .circle{
	background-color: #7dbbea;
}
.about-box .people-box .bubble7{
	width: 12px;
	padding-top: 12px;
	left: 28.7%;
	top: 82.4%;
}
.about-box .people-box .bubble7 .circle{
	background-color: #7dbbea;
}
.about-box .people-box .bubble8{
	width: 12px;
	padding-top: 12px;
	left: 51.3%;
	top: 80.37%;
}
.about-box .people-box .bubble8 .circle{
	background-color: #fff;
}
.about-box .people-box .bubble9{
	width: 5px;
	padding-top: 5px;
	left: 59.8958%;
	top: 32.96%;
}
.about-box .people-box .bubble9 .circle{
	background-color: #fff;
}
.about-box .people-box .bubble10{
	width: 150px;
	padding-top: 150px;
	left: 82.8125%;
	top: 14.8%;
}
.about-box .people-box .bubble10 .circle{
	border: 1px solid #fff;
}
.about-box .people-box .bubble11{
	width: 6px;
	padding-top: 6px;
	left: 74.84375%;
	top: 63.5%;
}
.about-box .people-box .bubble11 .circle{
	background-color: #fff;
	opacity: .5;
}
.about-box .people-box .bubble12{
	width: 140px;
	padding-top: 140px;
	left: 75.52%;
	top: 70.37%;
}
.about-box .people-box .bubble12 .circle{
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-image: url('../images/about-people-bg2.jpg')
}
.about-box .people-box .bubble13{
	width: 5px;
	padding-top: 5px;
	left: 93.23%;
	top: 86.11%;
}
.about-box .people-box .bubble13 .circle{
	background-color: #fff;
}

.about-box .people-box .bubble{
	animation:spin 6s infinite linear;
	transform-origin: 50% 45%;
}
.about-box .people-box .bubble:nth-child(2n){
	animation:spin2 6s infinite linear;
}
.about-box .people-box .bubble .circle{
	animation:spin-reverse 6s infinite linear;
}
.about-box .people-box .bubble:nth-child(2n) .circle{
	animation:spin-reverse2 6s infinite linear;
}
.about-box .people-box .sm-bubble{
	transform-origin: 30% 30px;
}

.about-box .top-text{
	font-size: 1rem;
	line-height: 1.5rem;
	color: #fff;
	visibility: hidden;
	opacity: 0;
	top: 1rem;
	letter-spacing: 4px;
	padding-left:50px;
}
.top-text p{ font-size: 1.2rem;
	line-height: 1.5rem;}
	.top-text p span{ font-size: 1.7rem;}

.about-box .people-circle{
	width:18rem;
	height: 18rem;
	margin: .7rem auto 0;
	position: relative;
	visibility: hidden;
	opacity: 0;
	top: 1rem;
}
.about-box .people-circle1{
	position: absolute;
	left: 50%;
	top: 50%;
	width: 18rem;
	height: 18rem;
	margin: -9rem 0 0 -9rem;
	border-radius: 100%;
	border: 1px solid rgb(255,255,255,.2);
	box-sizing: border-box;
}
.about-box .people-circle1 .img{
	position: absolute;
	width: 1.5rem;
	border-radius: 100%;
	overflow: hidden;
	left: -2.2%;
	top: 27.22%;
}
.about-box .people-circle1 .img img{
	width: 100%;
}
.about-box .people-circle2{
	position: absolute;
	width: 12rem;
	height:12rem;
	border-radius: 100%;
	left: 50%;
	top: 50%;
	margin: -6rem 0 0 -6rem;
	border: 2px dashed rgba(255,255,255,.6);
}
.about-box .people-circle2 .icon{
	position: absolute;
	width: 2.25rem;
	height: 2.25rem;
	background-color: #fff;
	border-radius: 100%;
}
.about-box .people-circle2 .icon:nth-child(1){
	left: 18.75%;
	top: -5%;
}
.about-box .people-circle2 .icon:nth-child(2){
	left: 86.458%;
	top: 62.5%;
}
.about-box .people-circle2 .icon:nth-child(3){
	left: 7.9%;
	top: 78.125%;
}

.about-box .people-circle2 .icon img{
	width: 100%;
}

.about-box .people-circle .center-img{
	position: absolute;
	left: 50%;
	top: 50%;
	width: 7.5rem;
	height: 7.5rem;
	border-radius: 100%;
	margin: -3.75rem 0 0 -3.75rem;
	overflow: hidden;
	box-sizing: border-box;
	border: 5px solid #fff;
}
.about-box .people-circle .center-img img{
	width: 100%;
}
.about-box .people-circle .txt{
	font-size: .55rem;
	line-height: .6rem;
	color: #fff;
	position: absolute;
	left: 60%;
	top: 0%;
	white-space: nowrap;
	transform: rotate(40deg);
}


@media (max-width: 1366px){
	.culture-box .tab-box .tab-item:nth-child(3) .text-item:nth-child(1){
		width: 40%;
		padding-top: 40%;
	}
	.culture-box .tab-box .tab-item:nth-child(3) .text-item:nth-child(1) .txt{
		transform: rotate(-9.5deg) translate(-9%,12%);
	}
}