@import url('https://fonts.googleapis.com/css?family=Fredericka+the+Great');
/*
 * Copyright 2017, TANK
 * 
 * 2017 / 02 / 23
 */


/* + box1
*----------------------------------------------------------------------------*/
#box1 {
	overflow: hidden;
	background: #4dd0e1;
}

#box1 .map {
	float: left;
	margin-right: 5%;
	width: 60%;
	min-height: 946px;
	background: url(/web/images/imgBaidu/box1/img-map.png) no-repeat right 0;
	background-size: auto 100%;
	display: inline-block;
	animation-name: fadeInLeft;
	-webkit-animation-name: fadeInLeft;
}

#box1 .map img {
	margin: 40px 10px;
	animation: blink 1s infinite alternate ease-in-out;
	-webkit-animation: blink 1s infinite alternate ease-in-out;
	-moz-animation: blink 1s infinite alternate ease-in-out;
	-ms-animation: blink 1s infinite alternate ease-in-out;
	-o-animation: blink 1s infinite alternate ease-in-out;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
}

@keyframes blink {
	0% { opacity: 1; }
	81% { opacity: 0; }
	100% { opacity: 0; }
}
@-o-keyframes blink { 
	0% { opacity: 1; }
	81% { opacity: 0; }
	100% { opacity: 0; }
}
@-webkit-keyframes blink { 
	0% { opacity: 1; }
	81% { opacity: 0; }
	100% { opacity: 0; }
}
@-moz-keyframes blink { 
	0% { opacity: 1; }
	81% { opacity: 0; }
	100% { opacity: 0; }
}
@-ms-keyframes blink { 
	0% { opacity: 1; }
	81% { opacity: 0; }
	100% { opacity: 0; }
}

#box1 .info ,
#box2 .info {
	float: left;
	width: 35%;
	text-align: center;
}

#box1 .info p ,
#box1 .info .hend {
	text-align: center;
	font-size: 30px;
	color: #e10602;
	animation-name: fadeInRightBig;
	-webkit-animation-name: fadeInRightBig;
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	-ms-animation-delay: 0.5s;
	-o-animation-delay: 0.5s;
}

#box1 .info p.logo {
	margin: 70px 0 20px;
	animation-name: fadeInDownBig;
	-webkit-animation-name: fadeInDownBig;
	animation-delay: 0s;
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-ms-animation-delay: 0s;
	-o-animation-delay: 0s;
}

#box1 .info p:nth-child(3) ,
#box1 .info p:nth-child(4) {
	color: #2932e1;
	-webkit-animation-delay: 1.5s;
	-moz-animation-delay: 1.5s;
	-ms-animation-delay: 1.5s;
	-o-animation-delay: 1.5s;
}

#box1 .info p:nth-child(3) {
	margin-top: 15px;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
}

#box1 .info p:nth-child(5) {
	margin-top: 10px;
	font-size: 48px;
	font-weight: bold;
	-webkit-animation-delay: 2s;
	-moz-animation-delay: 2s;
	-ms-animation-delay: 2s;
	-o-animation-delay: 2s;
}

#box1 .info .hend {
	margin-top: 25px;
	background: url(/web/images/imgBaidu/box1/img-hend.png) no-repeat 0 0;
	text-align: left;
}

#box1 .info .hend img {
	animation: shakeHend 1s infinite alternate ease-in-out;
	-webkit-animation: shakeHend 1s infinite alternate ease-in-out;
	-moz-animation: shakeHend 1s infinite alternate ease-in-out;
	-ms-animation: shakeHend 1s infinite alternate ease-in-out;
	-o-animation: shakeHend 1s infinite alternate ease-in-out;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
}

@keyframes shakeHend {
	0% { transform: rotate(0deg); }
	25% { transform: rotate(10deg); }
	50% { transform: rotate(0deg); }
	100% { transform: rotate(0deg); }
}
@-o-keyframes shakeHend { 
	0% { transform: rotate(0deg); }
	25% { transform: rotate(10deg); }
	50% { transform: rotate(0deg); }
	100% { transform: rotate(0deg); }
}
@-webkit-keyframes shakeHend { 
	0% { transform: rotate(0deg); }
	25% { transform: rotate(10deg); }
	50% { transform: rotate(0deg); }
	100% { transform: rotate(0deg); }
}
@-moz-keyframes shakeHend { 
	0% { transform: rotate(0deg); }
	25% { transform: rotate(10deg); }
	50% { transform: rotate(0deg); }
	100% { transform: rotate(0deg); }
}
@-ms-keyframes shakeHend { 
	0% { transform: rotate(0deg); }
	25% { transform: rotate(10deg); }
	50% { transform: rotate(0deg); }
	100% { transform: rotate(0deg); }
}


/* + box2
*----------------------------------------------------------------------------*/
#box2 {
	overflow: hidden;
	position: relative;
	padding: 70px 0 50px;
	background: url(/web/images/imgBaidu/box2/img-Bg2.png) no-repeat 0 bottom;
}

#box2 .info {
	margin-top: 50px;
}

#box2 .info p {
	margin: 5px 0 5px 10%;
	font-size: 36px;
	animation-name: fadeInLeftBig;
	-webkit-animation-name: fadeInLeftBig;
}

#box2 .info p:nth-child(2) {
	animation-delay: 0.5s;
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	-ms-animation-delay: 0.5s;
	-o-animation-delay: 0.5s;
}

#box2 .info p b {
	margin-left: 10px;
	font-size: 50px;
	color: #e10602;
}

#box2 .info p:nth-child(3) ,
#box2 .info p:nth-child(4) {
	font-size: 30px;
	color: #e10602;
	animation-delay: 1.5s;
	-webkit-animation-delay: 1.5s;
	-moz-animation-delay: 1.5s;
	-ms-animation-delay: 1.5s;
	-o-animation-delay: 1.5s;
}

#box2 .info p:nth-child(3) {
	margin-top: 30px;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
}

#box2 .computer {
	position: relative;
	float: left;
	width: 65%;
	animation-name: fadeInRight;
	-webkit-animation-name: fadeInRight;
	z-index: 2;
}

#box2 .computer p {
	overflow: hidden;
	max-height: 580px;
	background: url(/web/images/imgBaidu/box2/img-computerBg.png) no-repeat 0 0;
	background-size: 100% auto;
	animation: readPage 4s infinite alternate ease-in-out;
	-webkit-animation: readPage 4s infinite alternate ease-in-out;
	-moz-animation: readPage 4s infinite alternate ease-in-out;
	-ms-animation: readPage 4s infinite alternate ease-in-out;
	-o-animation: readPage 4s infinite alternate ease-in-out;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
}

@keyframes readPage {
	0%{ background-position: 0 0; }
	20%{ background-position: 0 0; }
	40%{ background-position: 0 50%; }
	60%{ background-position: 0 50%; }
	80%{ background-position: 0 0; }
	100%{ background-position: 0 0; }
}
@-o-keyframes readPage {
	0%{ background-position: 0 0; }
	20%{ background-position: 0 0; }
	40%{ background-position: 0 50%; }
	60%{ background-position: 0 50%; }
	80%{ background-position: 0 0; }
	100%{ background-position: 0 0; }
}
@-webkit-keyframes readPage {
	0%{ background-position: 0 0; }
	20%{ background-position: 0 0; }
	40%{ background-position: 0 50%; }
	60%{ background-position: 0 50%; }
	80%{ background-position: 0 0; }
	100%{ background-position: 0 0; }
}
@-moz-keyframes readPage {
	0%{ background-position: 0 0; }
	20%{ background-position: 0 0; }
	40%{ background-position: 0 50%; }
	60%{ background-position: 0 50%; }
	80%{ background-position: 0 0; }
	100%{ background-position: 0 0; }
}
@-ms-keyframes readPage {
	0%{ background-position: 0 0; }
	20%{ background-position: 0 0; }
	40%{ background-position: 0 50%; }
	60%{ background-position: 0 50%; }
	80%{ background-position: 0 0; }
	100%{ background-position: 0 0; }
}

#box2 .computer img {
	width: 100%;
}

#box2 .bird ,
#box2 .balloon {
	position: absolute;
	bottom: 120px;
	animation: bird 15s infinite alternate ease-in-out;
	-webkit-animation: bird 15s infinite alternate ease-in-out;
	-moz-animation: bird 15s infinite alternate ease-in-out;
	-ms-animation: bird 15s infinite alternate ease-in-out;
	-o-animation: bird 15s infinite alternate ease-in-out;
	z-index: 1;
}

@keyframes bird {
	0%{ left:-10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 120px; }
	100%{ left:120%; bottom: 190px; }
}
@-o-keyframes bird {
	0%{ left:-10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 120px; }
	100%{ left:120%; bottom: 190px; }
}
@-webkit-keyframes bird {
	0%{ left:-10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 120px; }
	100%{ left:120%; bottom: 190px; }
}
@-moz-keyframes bird {
	0%{ left:-10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 120px; }
	100%{ left:120%; bottom: 190px; }
}
@-ms-keyframes bird {
	0%{ left:-10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 120px; }
	100%{ left:120%; bottom: 190px; }
}

#box2 .balloon {
	animation: balloon 25s infinite alternate ease-in-out;
	-webkit-animation: balloon 25s infinite alternate ease-in-out;
	-moz-animation: balloon 25s infinite alternate ease-in-out;
	-ms-animation: balloon 25s infinite alternate ease-in-out;
	-o-animation: balloon 25s infinite alternate ease-in-out;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
	right: -10%;
}

@keyframes balloon {
	0%{ right: -10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 100px; }
	75%{ bottom: 150px; }
	100%{ right:120%; bottom: 200px; }
}
@-o-keyframes balloon {
	0%{ right: -10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 100px; }
	75%{ bottom: 150px; }
	100%{ right:120%; bottom: 200px; }
}
@-webkit-keyframes balloon {
	0%{ right: -10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 100px; }
	75%{ bottom: 150px; }
	100%{ right:120%; bottom: 200px; }
}
@-moz-keyframes balloon {
	0%{ right: -10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 100px; }
	75%{ bottom: 150px; }
	100%{ right:120%; bottom: 200px; }
}
@-ms-keyframes balloon {
	0%{ right: -10%; bottom: 120px; }
	25%{ bottom: 180px; }
	50%{ bottom: 100px; }
	75%{ bottom: 150px; }
	100%{ right:120%; bottom: 200px; }
}


/* + box3
*----------------------------------------------------------------------------*/
#box3 ,
#box4 ,
#box6 {
	overflow: hidden;
	position: relative;
	padding: 50px 0;
	background: url(/web/images/imgBaidu/box3/img-Bg3.png) #4cc4df no-repeat fixed center top / cover;
}

#box3 .shop {
	position: absolute;
	padding-top: 180px;
	height: 455px;
	background: url(/web/images/imgBaidu/box3/img-mapMarker.png) no-repeat 205px 0;
	top: 80px;
	left: 5%;
	animation: mapMarker 1s infinite alternate ease-in-out;
	-webkit-animation: mapMarker 1s infinite alternate ease-in-out;
	-moz-animation: mapMarker 1s infinite alternate ease-in-out;
	-ms-animation: mapMarker 1s infinite alternate ease-in-out;
	-o-animation: mapMarker 1s infinite alternate ease-in-out;
}

@keyframes mapMarker {
	0%{ background-position: 205px 0;}
	50%{ background-position: 205px 15px; }
	100%{ background-position: 205px 0; }
}
@-o-keyframes mapMarker {
	0%{ background-position: 205px 0;}
	50%{ background-position: 205px 15px; }
	100%{ background-position: 205px 0; }
}
@-webkit-keyframes mapMarker {
	0%{ background-position: 205px 0;}
	50%{ background-position: 205px 15px; }
	100%{ background-position: 205px 0; }
}
@-moz-keyframes mapMarker {
	0%{ background-position: 205px 0;}
	50%{ background-position: 205px 15px; }
	100%{ background-position: 205px 0; }
}
@-ms-keyframes mapMarker {
	0%{ background-position: 205px 0;}
	50%{ background-position: 205px 15px; }
	100%{ background-position: 205px 0; }
}

#box3 .info {
	float: right;
	width: 70%;
}

#box3 .info .topText article {
	width: 50%;
	display: inline-block;
	text-shadow: 1px 1px 1px #000;
	font-size: 24px;
	color: #fff;
	line-height: 170%;
	animation-name: fadeInRightBig;
	-webkit-animation-name: fadeInRightBig;
}

#box3 .info .topText article:first-child {
	margin-right: 5%;
	width: 35%;
	font-size: 56px;
	animation-name: fadeInLeftBig;
	-webkit-animation-name: fadeInLeftBig;
}

#box3 .info .topText article:first-child p {
	text-align: right;
	line-height: 110%;
}

#box3 .info ul li {
	width: 49%;
	min-height: 141px;
	background: url(/web/images/imgBaidu/box3/img-cloud1.png) no-repeat center 0;
	display: inline-block;
	animation: pulse 1s infinite alternate ease-in-out;
	-webkit-animation: pulse 1s infinite alternate ease-in-out;
	-moz-animation: pulse 1s infinite alternate ease-in-out;
	-ms-animation: pulse 1s infinite alternate ease-in-out;
	-o-animation: pulse 1s infinite alternate ease-in-out;
}

#box3 .info ul li p ,
#box3 .info ul li b {
	display: block;
	text-align: center;
	font-size: 18px;
	color: #515151;
	font-weight: normal;
}

#box3 .info ul li p {
	padding: 50px 0 10px;
	font-size: 24px;
	color: #0088a7;
	font-weight: bold;
}

#box3 .info ul li:nth-child(2) {
	width: 30%;
	min-height: 222px;
	background: url(/web/images/imgBaidu/box3/img-cloud2.png) no-repeat center 30px;
	animation-delay: 0.4s;
	-webkit-animation-delay: 0.4s;
	-moz-animation-delay: 0.4s;
	-ms-animation-delay: 0.4s;
	-o-animation-delay: 0.4s;
}

#box3 .info ul li:nth-child(2) p {
	padding-top: 90px;
}

#box3 .info ul li:nth-child(3) {
	margin: 30px 0 0 200px;
	width: 40%;
	min-height: 332px;
	background: url(/web/images/imgBaidu/box3/img-cloud3.png) no-repeat center 0;
	animation-delay: 1.8s;
	-webkit-animation-delay: 1.8s;
	-moz-animation-delay: 1.8s;
	-ms-animation-delay: 1.8s;
	-o-animation-delay: 1.8s;
}

#box3 .info ul li:nth-child(3) p {
	padding-top: 60px;
}

#box3 .info ul li:nth-child(4) {
	width: 30%;
	min-height: 150px;
	background: url(/web/images/imgBaidu/box3/img-cloud4.png) no-repeat center 0;
	animation-delay: 2.3s;
	-webkit-animation-delay: 2.3s;
	-moz-animation-delay: 2.3s;
	-ms-animation-delay: 2.3s;
	-o-animation-delay: 2.3s;
}


/* + box4
*----------------------------------------------------------------------------*/
#box4 {
	background: url(/web/images/imgBaidu/box4/img-Bg4.png) no-repeat center bottom;
}

#box4 .champion {
	margin: auto;
	width: 20%;
	min-height: 593px;
	animation-name: fadeInDownBig;
	-webkit-animation-name: fadeInDownBig;
}

#box4 .champion img {
	animation: championImg 1s infinite alternate ease-in-out;
	-webkit-animation: championImg 1s infinite alternate ease-in-out;
	-moz-animation: championImg 1s infinite alternate ease-in-out;
	-ms-animation: championImg 1s infinite alternate ease-in-out;
	-o-animation: championImg 1s infinite alternate ease-in-out;
}

@keyframes championImg {
	0%{ transform:scale(1); }
	50%{ transform:scale(1.1); }
	100%{ transform:scale(1); }
}
@-o-keyframes championImg {
	0%{ transform:scale(1); }
	50%{ transform:scale(1.1); }
	100%{ transform:scale(1); }
}
@-webkit-keyframes championImg {
	0%{ transform:scale(1); }
	50%{ transform:scale(1.1); }
	100%{ transform:scale(1); }
}
@-moz-keyframes championImg {
	0%{ transform:scale(1); }
	50%{ transform:scale(1.1); }
	100%{ transform:scale(1); }
}
@-ms-keyframes championImg {
	0%{ transform:scale(1); }
	50%{ transform:scale(1.1); }
	100%{ transform:scale(1); }
}

#box4 .champion article {
	margin: 30px 0;
	font-size: 18px;
	line-height: 170%;
	color: #271b11;
}

#box4 .info {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	text-align: center;
	z-index: 1;
}

#box4 .info ul ,
#box4 .info ul li {
	width: 49%;
	display: inline-block;
}

#box4 .info ul {
	margin: 30px 10% 0 0;
	width: 35%;
}

#box4 .info ul.rightBox {
	margin: 30px 0 0 10%;
	text-align: right;
}

#box4 .info ul li .checkBox {
	margin: 30px 0;
	padding: 20px 0 70px;
	background: url(/web/images/imgBaidu/box4/img-crownBg.png) no-repeat center;
	text-align: center;
	animation-name: bounceIn;
	-webkit-animation-name: bounceIn;
}

#box4 .info ul li .checkBox p {
	width: 48%;
	margin: 10px auto 0;
	font-size: 22px;
	color: #c98100;
	text-align: center;
	text-shadow: 0 0 1px #fff;
}

#box4 .info ul.leftBox li:first-child .checkBox:first-child {
	padding: 50px 0 90px;
}

#box4 .info ul.leftBox li:first-child .checkBox:last-child {
	animation-delay: 0.2s;
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	-ms-animation-delay: 0.2s;
	-o-animation-delay: 0.2s;
}

#box4 .info ul.leftBox li:last-child .checkBox {
	animation-delay: 0.4s;
	-webkit-animation-delay: 0.4s;
	-moz-animation-delay: 0.4s;
	-ms-animation-delay: 0.4s;
	-o-animation-delay: 0.4s;
}

#box4 .info ul.rightBox li:first-child .checkBox {
	animation-delay: 0.6s;
	-webkit-animation-delay: 0.6s;
	-moz-animation-delay: 0.6s;
	-ms-animation-delay: 0.6s;
	-o-animation-delay: 0.6s;
}

#box4 .info ul.rightBox li:last-child .checkBox:first-child {
	animation-delay: 0.8s;
	-webkit-animation-delay: 0.8s;
	-moz-animation-delay: 0.8s;
	-ms-animation-delay: 0.8s;
	-o-animation-delay: 0.8s;
}

#box4 .info ul.rightBox li:last-child .checkBox:last-child {
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
	-moz-animation-delay: 1s;
	-ms-animation-delay: 1s;
	-o-animation-delay: 1s;
}


/* + box5
*----------------------------------------------------------------------------*/
#box5 {
	overflow: hidden;
	position: relative;
	padding: 30px 0;
	background: url(/web/images/imgBaidu/box5/img-Bg5.png) #52c3f1 repeat-x 0 0;
	animation: box5Bg 40s infinite alternate ease-in-out;
	-webkit-animation: box5Bg 40s infinite alternate ease-in-out;
	-moz-animation: box5Bg 40s infinite alternate ease-in-out;
	-ms-animation: box5Bg 40s infinite alternate ease-in-out;
	-o-animation: box5Bg 40s infinite alternate ease-in-out;
}

@keyframes box5Bg {
	0%{ background-position: 0 0; }
	100%{ background-position: 1920px 0; }
}
@-o-keyframes box5Bg {
	0%{ background-position: 0 0; }
	100%{ background-position: 1920px 0; }
}
@-webkit-keyframes box5Bg {
	0%{ background-position: 0 0; }
	100%{ background-position: 1920px 0; }
}
@-moz-keyframes box5Bg {
	0%{ background-position: 0 0; }
	100%{ background-position: 1920px 0; }
}
@-ms-keyframes box5Bg {
	0%{ background-position: 0 0; }
	100%{ background-position: 1920px 0; }
}

#box5 > div ,
#box6 > div {
	margin: 30px 0;
	float: left;
	width: 50%;
}

#box5 .leftBox p {
	margin: 10px 0;
	text-align: center;
	font-size: 36px;
	color: #fff;
	text-shadow: 1px 1px 1px #000;
	animation-name: fadeInDownBig;
	-webkit-animation-name: fadeInDownBig;
}

#box5 .leftBox .pieChart {
	margin: 20px 0;
	text-align: center;
	animation-name: fadeInUpBig;
	-webkit-animation-name: fadeInUpBig;
}

#box5 .airplane {
	position: absolute;
	float: none;
	width: 100%;
	bottom: 30px;
	left: 10%;
}

#box5 .rightBox {
	text-align: center;
}

#box5 .rightBox .title {
	margin-bottom: 110px;
	text-align: center;
}

#box5 .rightBox .title b {
	margin: 0 10px;
	display: inline-block;
	font-size: 60px;
	color: #fff;
	vertical-align: top;
	text-shadow: 1px 1px 1px #000;
}

#box5 .rightBox .title b:nth-child(2) {
	margin-top: 20px;
	font-size: 36px;
}

#box5 .rightBox .title b:nth-child(3) {
	margin-top: 15px;
	font-size: 48px;
}

#box5 .rightBox .title b:nth-child(4) {
	margin-top: 10px;
}

#box5 .rightBox ul {
	overflow: hidden;
	display: inline-block;
}

#box5 .rightBox ul li {
	position: relative;
	padding: 10px 20px;
	width: 140px;
	height: 120px;
	float: left;
	border: 1px #fff solid;
}

#box5 .rightBox ul li:nth-child(2) ,
#box5 .rightBox ul li:nth-child(4) {
	padding: 60px 0 0;
	width: auto;
	height: auto;
	border: 0;
}

#box5 .rightBox ul:nth-child(2) li:last-child {
	padding: 0 0 0;
	width: 90%;
	height: auto;
	border: 0;
	text-align: right;
}

#box5 .rightBox ul li:after {
	position: absolute;
	left: 30px;
	bottom: 30px;
	content: "1";
	font-family: 'Fredericka the Great', cursive;
	font-size: 50px;
	color: #fff;
}

#box5 .rightBox ul li:nth-child(3):after {
	content: "2";
}

#box5 .rightBox ul li:nth-child(5):after {
	content: "3";
}

#box5 .rightBox ul:nth-child(3) li:first-child:after {
	content: "4";
}

#box5 .rightBox ul:nth-child(3) li:nth-child(3):after {
	content: "5";
}

#box5 .rightBox ul:nth-child(3) li:nth-child(5):after {
	content: "6";
}

#box5 .rightBox ul li:nth-child(2):after ,
#box5 .rightBox ul li:nth-child(4):after ,
#box5 .rightBox ul:nth-child(2) li:last-child:after {
	content: "";
}

#box5 .rightBox ul li p {
	text-align: right;
	font-size: 30px;
	color: #fff;
}

#box5 .rightBox ul:nth-child(3) li {
	float: right;
}


/* + box6
*----------------------------------------------------------------------------*/
#box6 {
	background: url(/web/images/imgBaidu/box6/img-Bg6.png) no-repeat fixed center top / cover;
}

#box6 .leftBox .title {
	font-size: 36px;
	color: #37474f;
}

#box6 .leftBox .title h3 ,
#box6 .leftBox .title p {
	text-align: center;
	animation-name: fadeInDownBig;
	-webkit-animation-name: fadeInDownBig;
}

#box6 .leftBox .title p {
	font-size: 30px;
}

#box6 .leftBox .title p b {
	font-size: 60px;
	color: #ff1a16;
}

#box6 .leftBox .moneyHend ,
#box6 .leftBox .info {
	position: relative;
	margin: 20px 0 0;
	width: 49%;
	display: inline-block;
}

#box6 .leftBox .moneyHend {
	animation-name: fadeInLeftBig;
	-webkit-animation-name: fadeInLeftBig;
}

#box6 .leftBox .moneyHend .money {
	position: absolute;
	width: 100%;
}

#box6 .leftBox .moneyHend .money img {
	margin: auto;
	width: auto;
	display: block;
}

#box6 .leftBox .info {
	font-size: 20px;
	color: #617179;
}

#box6 .leftBox .info p {
	margin: 40px 60px;
	line-height: 200%;
	animation-name: fadeInRightBig;
	-webkit-animation-name: fadeInRightBig;
}

#box6 .rigeBox .title {
	font-size: 30px; 
	color: #37474f;
	text-align: center;
	font-weight: bold;
	animation-name: fadeInDownBig;
	-webkit-animation-name: fadeInDownBig;
}

#box6 .rigeBox .title span {
	margin-left: 5px;
	font-size: 18px;
}

#box6 .rigeBox .cont {
	animation-name: fadeInUpBig;
	-webkit-animation-name: fadeInUpBig;
}

#box6 .rigeBox .cont p {
	margin: 30px 0;
	text-align: center;
}

#box6 .rigeBox .cont p input ,
#box6 .rigeBox .cont p textarea {
	padding: 10px 20px;
	width: 50%;
	background: 0;
	border-bottom: 1px #37474f solid;
}

#box6 .rigeBox .cont p textarea {
	border: 1px #37474f solid;
}

#box6 .rigeBox .cont p input#Checknum {
	width: 160px;
}

#box6 .rigeBox .cont p img {
	margin: 0 15px;
}

#box6 .rigeBox .cont p b {
	padding: 10px 90px;
	background: #37474f;
	display: inline-block;
	color: #fff;
}


/************ = 適應性 = ************/
/* +width:1680 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 1680px) {
	#box1 .map img {
		margin: 149px -30px;
	}
	#box3 .info .topText article:first-child {
		font-size: 46px;
	}
	#box3 .info .topText article {
		font-size: 18px;
	}
}

/* +width:1366 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 1366px) {
	#box1 .map img {
		margin: 249px -30px;
	}
	#box1 .info p.logo {
		margin: 30px 0 20px;
	}
	#box1 .info p {
		font-size: 28px;
	}
	#box1 .info p:nth-child(5) {
		font-size: 38px;
	}
	#box2 .info {
		margin-top: 0;
	}
	#box3 .info .topText article:first-child {
		width: 40%;
	}
	#box3 .info ul li ,
	#box3 .info ul li:nth-child(4) {
		width: 305px;
	}
	#box3 .info ul li:nth-child(2) ,
	#box3 .info ul li:nth-child(3) {
		width: 323px;
	}
	#box3 .info ul li:nth-child(2) ,
	#box3 .info ul li:nth-child(7) {
		margin-left: 70px;
	}
	#box4 .info ul li .checkBox {
		background-size: 100% auto;
	}
	#box4 .info ul li .checkBox p {
		font-size: 18px;
	}
	#box4 .champion {
		margin-top: 50px;
	}
	#box5 .rightBox ul li {
		width: 110px;
	}
	#box5 .rightBox ul li p {
		font-size: 25px;
	}
	#box6 .leftBox .title {
		font-size: 26px;
	}
	#box6 .leftBox .title p {
		font-size: 20px;
	}
	#box6 .leftBox .title p b {
		font-size: 40px;
	}
	#box6 .leftBox .info p {
		margin: 10px 20px;
	}
}

/* +width:1280 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 1280px) {
	#box1 {
		overflow: hidden;
		position: relative;
	}
	#box1 .map {
		position: absolute;
	}
	#box1 .info {
		margin-right: 10px;
		float: right;
		width: 40%;
	}
	#box3 .info {
		width: 75%;
	}
	#box4 {
		padding: 0;
	}
	#box5 {
		background-repeat: repeat;
	}
	#box5 > div ,
	#box6 > div {
		margin: 20px 0;
		float: none;
		width: 100%;
	}
	#box6 .leftBox .moneyHend .money img:nth-child(3) {
		display: none;
	}
}

/* +width:1024 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
	#box1 .info {
		width: 50%;
	}
	#box2 .computer {
		position: absolute;
		right: 0;
	}
	#box2 .info {
		position: relative;
		width: 40%;
		z-index: 3;
	}
	#box3 .info ,
	#box4 .champion ,
	#box4 .info ul {
		width: 100%;
	}
	#box3 .info ul {
		text-align: center;
	}
	#box4 {
		background: url(/web/images/imgBaidu/box4/img-Bg4.png) no-repeat fixed center top / cover;
	}
	#box4 .champion {
		min-height: inherit;
	}
	#box4 .champion img ,
	#box4 .champion article {
		margin: 0 30px;
		display: inline-block;
		width: 20%;
	}
	#box4 .champion article {
		width: 60%;
	}
	#box4 .info {
		position: relative;
		margin: 30px 0;
	}
	#box4 .info ul li {
		width: auto;
	}
	#box4 .info ul li .checkBox {
		width: 291px;
		display: inline-block;
	}
	#box4 .info ul.rightBox {
		margin-left: 0;
	}
}

/* +width:768 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
	#box1 {
		background: url(/web/images/imgBaidu/box1/img-BgS.png) #4dd0e1 no-repeat 0 0;
		background-size: 100% auto;
	}
	#box1 .map ,
	#box2 .computer ,
	#box3 .info .topText article:nth-child(2) ,
	#box5 .airplane {
		display: none;
	}
	#box1 .info ,
	#box2 .info {
		width: 100%;
		background: rgba(255, 255, 255, 0.24);
	}
	#box1 .info p.logo {
		margin-top: 90px;
	}
	#box1 .info .hend {
		background-position: right 0;
	}
	#box1 .info .hend img {
		margin-left: 120px;
	}
	#box2 {
		padding: 0;
		background-position: right bottom;
	}
	#box2 .info {
		padding: 50px 0;
		background: rgba(0, 0, 0, 0);
	}
	#box3 .info .topText article:first-child {
		width: 100%;
		font-size: 40px;
		text-align: left;
		text-align: center;
	}
	#box3 .info .topText article:first-child p {
		display: inline-block;
	}
	#box3 .info ul li:nth-child(3) {
		margin-left: 0;
	}
	#box4 .info ul ,
	#box4 .info ul.rightBox {
		text-align: center;
	}
	#box4 .info ul.leftBox li:last-child ,
	#box4 .info ul.rightBox li:first-child {
		width: 80%;
	}
	#box4 .info ul.rightBox {
		margin-top: -276px;
	}
	#box4 .info ul.rightBox li:first-child {
		text-align: right;
	}
}

/* +width:640 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 640px) {
	#box1 .info .hend img {
		margin-left: 0;
	}
	#box2 .info p {
		margin-left: 0;
		text-align: center;
	}
	#box2 .info p b {
		font-size: 40px;
	}
	#box3 .info ul li:nth-child(3) {
		min-height: 212px;
	}
	#box3 .shop {
		top: 40%;
	}
	#box4 .champion {
		text-align: center;
	}
	#box4 .champion img {
		width: 50%;
		margin-bottom: 30px;
	}
	#box4 .info ul.leftBox li:last-child ,
	#box4 .info ul.rightBox li:first-child {
		width: 100%;
	}
	#box5 .rightBox ul li {
		width: 80px;
		height: 140px;
	}
	#box6 .rigeBox .cont p input ,
	#box6 .rigeBox .cont p textarea {
		width: 70%;
	}
}

/* +width:480 ↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
	#box1 .info ,
	#box2 .info {
		margin-right: 0;
		padding: 0 2%;
		width: 96%;
	}
	#box1 .info .hend {
		background-position: 0 0;
	}
	#box4 .info ul li ,
	#box4 .info ul.rightBox li:first-child {
		text-align: center;
	}
	#box4 .info ul.rightBox {
		margin-top: 0;
	}
	#box5 {
		animation: inherit;
		-webkit-animation: inherit;
		-moz-animation: inherit;
		-ms-animation: inherit;
		-o-animation: inherit;
	}
	#box5 .rightBox ul {
		display: block;
	}
	#box5 .rightBox ul li {
		padding: 10px 2%;
		float: none;
		width: 96%;
		height: 50px;
		border: 0;
		text-shadow: 1px 1px 1px #000;
	}
	#box5 .rightBox ul li.line {
		display: none;
	}
	#box5 .rightBox ul li p {
		margin-left: 70px;
		text-align: left;
	}
	#box6 .leftBox .title p b {
		display: block;
	}
	#box6 .leftBox .moneyHend {
		display: none;
	}
	#box6 .leftBox .info {
		width: 100%;
	}
}