@charset "utf-8";
.container { position: relative; width: 100%; }

.aArea { background:url(aArea.jpg) no-repeat center; overflow:hidden; /*background-attachment: fixed!important; background-size: cover!important; background-repeat: no-repeat; background-position: top center!important;*/ }
.aArea .hd01 { padding:95px 0 45px; text-align:center; }
.aArea .hd01 .p1 { font-size:34px; line-height:35px; color:#1a1a1a; margin-bottom:20px; }
.aArea .hd01 .p2 { font-size:14px; line-height:20px; color:rgba(0,0,0,0.5); }

.aArea01 { position:relative; left:50%; width:1440px; margin-left:-720px; }
.aArea01 .hd { width:1200px; margin:0 auto; background:#eff4f9; border-radius:5px; overflow:hidden; }
.aArea01 .hd ul li { position:relative; float:left; width:calc(100% / 6); text-align:center; padding:20px 0; line-height:20px; font-size:18px; color:#1a1a1a; border-right:1px solid #dcdcdc; box-sizing: border-box; transition: all 0.6s; cursor:pointer; }
.aArea01 .hd ul li:after { position:absolute; top:0; left:50%; margin-left:-1px; display:none; background:#fff; content:""; width:2px; height:16px; z-index:5; }
.aArea01 .hd ul li:last-child { border-right:none; }
.aArea01 .hd ul li.on { padding:25px 0 15px; color:#fff; background: linear-gradient(to right,#00b099,#047bbc); }
.aArea01 .hd ul li.on:after { display:block; }

.aArea01 .bd ul { position:relative; min-height:825px; }
.aArea01 .bd ul li { position:absolute; z-index:5; }
.aArea01 .bd ul li a { display:block; width:115px; height:138px; background:url(a01.png) no-repeat center; text-align:center; }
.aArea01 .bd ul li .pic { padding-top:20px; min-height:55px; }
.aArea01 .bd ul li .pic .img02 { display:none; }
.aArea01 .bd ul li .txt { padding:0 5px; }
.aArea01 .bd ul li .txt .p1 { font-size:16px; color:#1a1a1a; height:20px; line-height:20px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.aArea01 .bd ul li .txt .p2 { font-size:12px; color:rgba(0,0,0,0.5); font-family:"Arial"; text-transform:uppercase; height:20px; line-height:20px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }

@media all and (min-width:1280px){
	.aArea01 .bd ul li .p3 { margin:20px 0 0 49px; width:10px; padding:3px; border:2px solid #068bae; border-radius:100%; }
	.aArea01 .bd ul li .p3 i { display:block; width:10px; height:10px; border-radius:100%; background:transparent; }
	.aArea01 .bd ul li .p4 { margin-left:59px; width:1px; height:80px; background:url(a03.png) no-repeat center bottom; }

	.aArea01 .bd ul li:hover a { background:url(a02.png) no-repeat center; }
	.aArea01 .bd ul li:hover .pic .img01 { display:none; }
	.aArea01 .bd ul li:hover .pic .img02 { display:inline-block; }
	.aArea01 .bd ul li:hover .txt .p1 { color:#fff; }
	.aArea01 .bd ul li:hover .txt .p2 { color:rgba(255,255,255,0.5); }
	.aArea01 .bd ul li:hover .p3 i { background:#068bae; }
}
@media all and (max-width:1280px){
	.aArea { background-size:cover; }
	.aArea .hd01 { padding:60px 0 35px; }
	.aArea01 { left:0; width:100%; margin-left:0; }
	.aArea01 .hd { width:96%; }
	
	.aArea01 .bd { width:96%; margin:30px auto 0; }
	.aArea01 .bd ul { min-height:300px; }
	.aArea01 .bd ul li { position:relative; left:0!important; top:0!important; float:left; width:24%; margin:0 1.33% 1.3% 0; }
	.aArea01 .bd ul li:nth-child(4n) { margin-right:0; }
	.aArea01 .bd ul li a { display:block; width:100%; height:130px; background:#fff; border:2px solid #068bae; box-sizing: border-box; }
	.aArea01 .bd ul li .txt .p2 { transform: scale(0.8); }
}
@media all and (max-width:1000px){
	.aArea .hd01 { padding:30px 0; }
	.aArea01 .hd ul li { font-size:14px; }
}
@media all and (max-width:750px){
	.aArea .hd01 .p1 { font-size:24px; line-height:25px; margin-bottom:15px; }
	.aArea .hd01 .p2 { font-size:12px; padding:0 15px; }
	
	.aArea01 .hd ul li { width:calc(100% / 3); transition: all 0s; padding:10px 0; }
	.aArea01 .hd ul li:nth-child(1) { border-bottom:1px solid #dcdcdc; }
	.aArea01 .hd ul li:nth-child(2) { border-bottom:1px solid #dcdcdc; }
	.aArea01 .hd ul li:nth-child(3) { border-bottom:1px solid #dcdcdc; }
	.aArea01 .hd ul li:nth-child(3n) { border-right:none!important; }
	.aArea01 .hd ul li:after { height:8px; }
	.aArea01 .hd ul li.on { padding:13px 0 7px; }
	
	.aArea01 .bd ul li { width:32%; margin:0 2% 2% 0; }
	.aArea01 .bd ul li:nth-child(4n) { margin-right:2%; }
	.aArea01 .bd ul li:nth-child(3n) { margin-right:0; }
}

.bArea { background:url(bArea.jpg) no-repeat center top; }
.bArea .g-in { width:1560px; margin:0 auto; }

.bArea01 { float:left; width:29%; padding-top:100px; }
.bArea01 .hd .p1 { font-size:34px; line-height:35px; color:#1a1a1a; margin-bottom:20px; }
.bArea01 .hd .p2 { font-size:14px; line-height:20px; color:rgba(0,0,0,0.5); }
.bArea01 .bd { margin:85px 0 60px;  }
.bArea01 .bd ul li { padding-right:14%; margin-bottom:25px; }
.bArea01 .bd ul li:last-child { margin-bottom:0; }
.bArea01 .bd ul li .p1 { padding-left:28px; background:url(b02.png) no-repeat center left; font-size:14px; color:rgba(0,0,0,0.6); margin-bottom:10px; }
.bArea01 .bd ul li .p2 { font-size:16px; color:#000; height:50px; line-height:25px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box;  -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.bArea01 .bd ul li .p2 a { color:#000; }
.bArea01 .bd01 a { display:block; width:120px; height:38px; text-align:center; line-height:38px; color:#fff; font-size:14px; background: linear-gradient(to right,#00b099,#047bbc); border-radius:25px; }

.bArea02 { float:right; width:71%; }
.bArea02 .hd { float:left; width:80px; line-height:80px; text-align:center; font-size:24px; color:#333; text-transform:uppercase; padding:390px 0 50px; background:url(b01.png) no-repeat center bottom; }
.bArea02 .hd .p { -webkit-writing-mode:vertical-rl; writing-mode:vertical-rl; writing-mode:tb-rl; }
.bArea02 .hd .p i { font-size:20px; color:#808080; }
.bArea02 .bd { float:left; width:calc(100% - 80px); }
.bArea02 .bd ul li { float:left; width:25%; box-sizing: border-box; border-left:1px solid #d6dce2; text-align:center; }
.bArea02 .bd ul li a { display:block; min-height:760px; }
.bArea02 .bd ul li .p1 { padding-top:275px; font-size:30px; color:rgba(0,0,0,0.3); font-weight:bold; font-family:"Arial"; text-transform:uppercase; line-height:35px; }
.bArea02 .bd ul li .p2 { margin:25px 0 35px; font-size:26px; color:#000; line-height:30px; }
.bArea02 .bd ul li .p3 { width:100%; height:1px; background:url(b04.png) no-repeat center; }
.bArea02 .bd ul li .p4 { display:none; padding-top:60px; min-height:170px; font-size:16px; line-height:30px; color:rgba(255,255,255,0.7); }
.bArea02 .bd ul li .p5 { display:none; height:23px; background:url(b06.png) no-repeat center; }
.bArea02 .bd ul li .p6 { display:none; margin-top:77px; }

@media all and (max-width:1600px){
	.bArea { background:none; }
	.bArea .g-in { width:96%; }
	.bArea02 { background:#eef5fc; }
}
@media all and (max-width:1500px){
	.bArea02 .bd ul li .p1 { font-size:24px; }
	.bArea02 .bd ul li .p2 { font-size:20px; }
	.bArea02 .bd ul li .p4 { font-size:14px; }
}
@media all and (min-width:1300px){
	.bArea02 .bd ul li:hover { background:url(b03.jpg) no-repeat center; background-size:cover; }
	.bArea02 .bd ul li:hover .p1 {  padding-top:150px; color:rgba(255,255,255,0.3); }
	.bArea02 .bd ul li:hover .p2 {color:#fff; font-weight:bold; }
	.bArea02 .bd ul li:hover .p3 { background:url(b05.png) no-repeat center; }
	.bArea02 .bd ul li:hover .p4 { display:block; }
	.bArea02 .bd ul li:hover .p5 { display:block; }
	.bArea02 .bd ul li:hover .p6 { display:block; }
}
@media all and (max-width:1300px){
	.bArea02 .bd ul li .p1 { font-size:20px; }
	.bArea02 .bd ul li .p2 { font-size:16px; padding:0 10px; }
}
@media all and (max-width:750px){
	.bArea01 { float:none; width:100%; padding:30px 0; }
	.bArea01 .hd .p1 { font-size:24px; line-height:25px; margin-bottom:15px; }
	.bArea01 .hd .p2 { font-size:12px; }
	.bArea01 .bd { margin:30px 0;  }
	.bArea01 .bd ul li { padding-right:0; margin-bottom:10px; }
	.bArea01 .bd ul li .p1 { font-size:12px; margin-bottom:5px; }
	.bArea01 .bd ul li .p2 { font-size:14px; height:40px; line-height:20px; }

	.bArea02 { float:none; width:100%; }
	.bArea02 .hd { padding:70px 0 30px 0; font-size:16px; width:40px; line-height:40px; background-size:25%; }
	.bArea02 .hd .p i { font-size:12px; }
	.bArea02 .bd { width:calc(100% - 40px); }
	.bArea02 .bd ul li a { display:block; min-height:100px; padding:80px 0; }
	.bArea02 .bd ul li .p1 { padding-top:0; font-size:12px; }
	.bArea02 .bd ul li .p2 { font-size:14px; margin:20px 0; line-height:20px; }
}

.cArea { background:url(cArea.jpg) no-repeat center; background-size:cover; }
.cArea ul li { float:left; width:20%; text-align:center; }
.cArea ul li a { display:block; padding:110px 0 40px; transition: all 0.6s; }
.cArea ul li .p1 span { position:relative; }
.cArea ul li .p1 i { font-size:40px; color:#fff; font-family:"Impact"; line-height:42px; }
.cArea ul li .p1 em { position:absolute; color:#fff;font-size:16px; top:-30px; right:-15px; z-index:2; }
.cArea ul li .p2 { padding:0 10%; font-size:16px; color:rgba(255,255,255,0.7); line-height:30px; min-height:90px; margin:20px 0 10px; }
.cArea ul li .p3 { height:23px; }

@media all and (min-width:1200px){
	.cArea ul li:hover a { padding:90px 0 60px; }
	.cArea ul li:hover .p3 { background:url(c01.png) no-repeat center; }
}
@media all and (max-width:1200px){
	.cArea ul li a { padding:50px 0; }
	.cArea ul li .p1 i { font-size:30px;line-height:32px; }
	.cArea ul li .p1 em { top:-20px; }
	.cArea ul li .p2 { padding:0 5%; font-size:12px; line-height:20px; min-height:20px; margin:20px 0 0; }
	.cArea ul li .p3 { display:none; }
}
@media all and (max-width:750px){
	.cArea ul li { width:50%; }
	.cArea ul li a { padding:0 0 25px 0; }
	.cArea ul li:nth-child(1) a { padding-top:25px; }
	.cArea ul li:nth-child(2) a { padding-top:25px; }
	.cArea ul li:nth-child(5) { width:80%; margin-left:10%; }
	.cArea ul li .p2 { min-height:60px; }
}
@media all and (max-width:350px){
	.cArea ul li .p2 { min-height:80px; }
}


.dArea { padding:90px 0 110px; background:url(dArea.jpg) no-repeat center top; background-size:cover; }
.dArea .hd { text-align:center; }
.dArea .hd .p1 { font-size:34px; line-height:35px; color:#1a1a1a; margin-bottom:20px; }
.dArea .hd .p2 { font-size:14px; line-height:20px; color:rgba(0,0,0,0.5); }
.dArea .hd .p3 { font-size:16px; line-height:30px; color:rgba(0,0,0,0.7); padding:0 9%; margin:30px 0 25px; }
.dArea .hd .p4 a { display:block; width:115px; height:38px; line-height:38px; border:1px solid #a0a0a0; border-radius:25px; font-size:12px; color:rgba(0,0,0,0.8); margin:0 auto; }
.dArea .hd .p4 a i { display:inline-block; padding-right:20px; background:url(d01.png) no-repeat center right; }

.dArea .bd { margin-top:70px; }
.dArea .bd ul li { float:left; padding:15px; width:145px; height:145px; border-radius:100%; overflow:hidden; background:url(d03.png) no-repeat center; background-size:cover; margin:0 calc(12.5% - 87.5px); }
.dArea .bd ul li a { position:relative; display:block; width:145px; height:145px; border-radius:100%; overflow:hidden; }
.dArea .bd ul li .txt { position:absolute; top:100px; left:0; width:145px; height:145px; background:url(d02.png) no-repeat center; background-size:cover; border-radius:100%; overflow:hidden; text-align:center; transition: all 0.6s; }
.dArea .bd ul li .txt .p1 { display:none; padding-top:35px; font-size:24px; color:#fff; font-weight:bold; line-height:25px; margin-bottom:15px; }
.dArea .bd ul li .txt .p2 { height:45px; line-height:45px; font-size:16px; color:#fff; }


@media all and (min-width:1000px){
	.dArea .bd ul li:hover .txt { top:0; }
	.dArea .bd ul li:hover .txt .p1 { display:block; }
	.dArea .bd ul li:hover .txt .p2 { font-size:18px; font-weight:bold; }
}
@media all and (max-width:1000px){
	.dArea { padding:50px 0 70px; }
	.dArea .bd ul li { padding:10px; width:120px; height:120px; margin:0 calc(12.5% - 70px); }
	.dArea .bd ul li a { width:120px; height:120px; }
	.dArea .bd ul li .txt { top:75px; width:120px; height:120px; }
}
@media all and (max-width:750px){
	.dArea { padding:35px 0; }
	.dArea .hd .p1 { font-size:24px; line-height:25px; margin-bottom:15px; }
	.dArea .hd .p2 { font-size:12px; }
	.dArea .hd .p3 { font-size:14px; line-height:20px; padding:0 3%; margin:15px 0 20px; }
	.dArea .bd { margin-top:30px; }
	.dArea .bd ul li { margin:0 calc(25% - 70px); }
	.dArea .bd ul li:nth-child(1) { margin-bottom:25px; }
	.dArea .bd ul li:nth-child(2) { margin-bottom:25px; }
}


.viArea { position:fixed; top:0; right:0; left:0; bottom:0; background:rgba(0,0,0,0.7); z-index:99; display:none; }
.viArea.on { display:block; }
.viArea .viArea01 { position:absolute; top:50%; left:50%; margin:-325px 0 0 -600px; width:1200px; z-index:9; }
.viArea .viArea01 video { width:1200px; height:650px; background:#000; }
.viArea .viArea01 .viclose { position:absolute; top:-40px; right:0; color:#fff; font-size:20px; cursor:pointer; z-index:9; }

@media all and (max-width:1200px){
	.viArea .viArea01 { margin:0 0 0 0; left:5%; top:20%; width:90%; }
	.viArea .viArea01 video { width:100%; height:auto; }
}