﻿
@media only screen and (max-width: 1680px){
	.banner-waves1{
		width: 48%;
	}
	.banner-waves2{
		width: 60%;
	}
	.mascot-box{
		width: 25%;
		right: 5%;
	}
}
@media only screen and (max-width: 1366px){
	.footer-box{
		width: 95%;
	}
	.footer-list-box{
		width: calc(100% - 150px);
	}
}
@media only screen and (max-width: 1200px){
	.news-box, .activity-box{
		width: 1000px;
	}
	.news-list{
		width: 480px;
	}
	.news-list-img-box{
		height: 410px;
	}
	.activity-box .news-list{
		width: 320px;
		margin: 0;
		margin-bottom: 20px;
	}
	.activity-box .news-list:nth-child(3n+2){
		margin: 0 20px;
		margin-bottom: 20px;
	}
	.activity-box .news-list .news-list-img-box{
		height: 275px;
	}
	#about-concert .about-concert-b-box{
		width: 1000px;
	}
	.about-concert-music-box ul{
		width: 48%;
	}
	.attractions-list{
		width: 320px;
		height: 320px;
		margin: 0;
		margin-bottom: 20px;
	}
	.attractions-box .attractions-list:nth-child(3n+2){
		margin: 0 20px;
		margin-bottom: 20px;
	}
}
@media only screen and (max-width: 1024px){
	.banner-title-box{
		width: 450px;
		top: 6%;
		padding-top: 50px;
	}
	.banner-title-logo{
		width: 90%;
	}
	.banner-title-img{
		width: 80%;
	}
	.banner-main{
		display: -webkit-flex;
		display:         flex;
		-webkit-align-items: center;
		          align-items: center;
		-webkit-justify-content: center;
		          justify-content: center;
		flex-direction:column;
	}
	.header-menu> li{
		width: 120px;
	}
	.header-title{
		font-size: 16px;
	}
	.header-list-box li{
		font-size: 16px;
	}
	.about-fireworks-b-box{
		width: 95%;
	}
}
@media only screen and (max-width: 1000px){
	.news-box, 
	.activity-box{
		width: 750px;
	}
	.activity-box .news-list{
		width: 240px;
	}
	.activity-box .news-list .news-list-img-box{
		height: 205px;
	}
	.attractions-list{
		width: 240px;
		height: 240px;
		margin-bottom: 10px;
	}
	.attractions-box .attractions-list:nth-child(3n+2) {
	    margin: 0 10px;
	    margin-bottom: 10px;
	}
	.activity-box .news-list:nth-child(3n+2){
		margin: 0 10px;
	}
	.activity-box .news-list{
		margin-bottom: 10px;
	}
	.news-list{
		width: 48%;
		margin: 0 1%;
		margin-bottom: 2%;
	}
	.news-list-img-box{
		height: 307px;
	}
	.news-page-box{
		width: 95%;
	}
	#about-concert .about-concert-b-box{
		width: 95%;
	}
	.introduction-list1-img{
		width: 300px;
		max-width: 100%;
	}
	.introduction-list1-box  .introduction-list-p:nth-child(3){
		padding-top: 15px;
	}
	.fancybox-box{
		width: 95%;
	}
}
@media only screen and (max-width: 800px){
	.rwd-menu-box{
		display: block;
	}
	.rwd-box{
		padding: 20px 0;
		box-sizing: border-box;
		background-color: #1490d0;
	}
	.banner-title-box{
		top: 0%;
	}
	.about-img-border{
		width: 280px;
		height: 215px;
	}
	.about-img{
		height: 175px;
	}
	.news-page-box{
		padding-bottom: 150px;
	}
	.traffic-list3{
		width: 100%;
		display: block;
	}
	.banner-fireworks1-box{
		width: 160px;
	}
	.banner-fireworks2-box{
		width: 180px;
	}
	.header-menu{
		width: 80%;
		display: block;
		margin: 0 auto;
		background-color: #FFF;
	}
	.header-menu li{
		display: block;
		width: 100%;
		text-align: center;
		
	}
	.header-title{
		color: #013d76;
		line-height: 40px;
	}
	.header-menu li{
		border-top:1px solid  #1490d0;
		border-bottom: 0;

	}
	.header-menu li:last-child{
		border-bottom:1px solid  #1490d0;
	}
	.header-menu> li.active .header-title{
		color: #FFF;
	}
	.header-list-box{
		position: relative;
	}
	.header-list-box{
		background-color: #FFF;
	}
	.header-list-box li{
		line-height: 40px;
	}
	.header-menu> li> ul li:hover a, .header-menu> li> ul li.active a{
		color: #FFF;
	}
	.header-menu> li> ul.header-list-box li a, .header-menu> li> ul.header-list-box li a{
		color:#1490d0;
	}
	.header-menu li.active ul li{
		background-color: #FFF;
	}
	.header-menu li.active ul li.active a{
		color: red;
	}
	.header-menu li.active ul{
		display: block;
	}
	.header-menu li:hover .header-title{
		color: #FFF;
	}
	.about-img-border{
		float: none;
		display: block;
	}
	.about-carnival-img .mid,
	.introduction-list3-img-box .mid,
	.introduction-list4-img-box .mid{
		position: static;
	}
	.about-img-border{
		width: 500px;
		height: 385px;
		margin: 0 auto;
		margin-bottom: 20px;
	}
	.about-img{
		height: 345px;
	}
	.main-active  .about-img-border.left{
		animation: fadeInLeft .5s linear 0.6s 1 forwards!important;
	}
	.main-active  .about-img-border.right{
		animation: fadeInRight .5s linear 0.6s 1 forwards!important;
	}
	.about-concert-box{
		  justify-content:space-around;
	}
	.about-concert-time ul{
		width: 100%;
		display: block;
		margin-bottom: 10px;
	}
	.about-concert-time ul:nth-child(2){
		border: 1px solid #1793d3;
	}
	.about-concert-music-box ul{
		width: 100%;
		display: block;
		margin-bottom: 20px;
	}
	.footer-list-box{
		width: 100%;
		display: block;
	}
	.footer-bg1{
		height: 600px;
	}
	.main-active .news-page-title-line,
	.main-active .news-page-title,
	.main-active .news-page-time,
	.main-active .news-page-line,
	.main-active .about-title,
	.main-active .about-list,
	.main-active .about-concert-time-box, 
	.main-active .about-fireworks-img, 
	.main-active .traffic-list1-box,
	.main-active .introduction-list1-img,
	.main-active .introduction-list-p,
	.main-active .traffic-list2-box,
	.main-active .traffic-list3-box,
	.main-active .traffic-list4-box,
	.main-active .news-page-info-img,
	.main-active .news-page-edtior,
	.main-active .news-more{
		animation: none;
		opacity: 1;
	}

}
@media only screen and (max-width: 750px){
	.banner-title-box{
		width: 35%;
	}
	.banner-title-box{
		padding-top: 20px;
	}
	.index-in-box a{
		width: 150px;
		line-height: 60px;
		font-size: 18px;
		float: none;
	}
	.index-in-box{
		width: 150px;
	}
	.mascot-box{
		z-index: 11;
	}
	#banner .mascot-box{
		width: 85px;
		right: 10%;
	}
	.news-box, .activity-box{
		width: 95%;
	}
	.news-list{
		width: 250px;
	}
	.news-list-img-box{
		height: 250px;
	}
	.news-box, .activity-box{
		padding-bottom: 200px;
	}
	.footer-bg1{
		height: 670px;
	}
	.activity-box .news-list:nth-child(3n+2){
		margin: 0;
		margin-bottom: 10px;
	}
	.news-list-box{
		display: -webkit-flex;
	    display: flex;
	    flex-wrap: wrap;
	    align-content: flex-start;	   
	    justify-content: space-around;
	}
	.about-list2-left, .about-list2-right{
		width: 100%;
		display: block;
	}
	.a1, .a2, .a3, .a4{
		position: static;
	}
	.about-concert-list{
		width: 200px;
	}
	.about-concert-img{
		height: 240px;
	}
}
@media only screen and (max-width: 480px){
	.main-active .attractions-box{
		animation: none;
	}
	.about-concert-name{
		line-height: 35px;
	}
	.about-fireworks-title2{
		font-size: 16px;
	}
	#banner .banner-box{
		height: 250px;
	}
	#index .banner-title-box{
		width: 90%;
	}
	#index .index-in-box{
		padding-top: 25%;
	}
	.b-title,
	.news-list,
	.news-more,
	.news-page-title,
	.news-page-time,
	.news-page-info-img,
	.news-page-edtior,
	.about-title,
	.about-list,
	.about-list2,
	.a1,
	.a2,
	.a3,
	.a4,
	.about-carnival-title2,
	.about-carnival-p,
	.about-img-border,
	.about-concert-box,
	.about-concert-time-box,
	.about-fireworks-img,
	.traffic-list1-box,
	.attractions-box,
	.introduction-list-p,
	.introduction-list1-img,
	.about-fireworks-title2{
	 opacity: 1;
	 animation: none;
	}
	.b-title-line,
	.news-page-title-line,
	.news-page-line{
	  transform: scale(1);
	  animation: none;
	}
	.main-active .news-list,
	.main-active .b-title,
	.main-active .about-fireworks-title2{
		animation: none;
	}
	.news-box,
	.activity-box{
		width: 350px;
	}
	#news .news-list{
		width: 350px;
	}
	#news .news-list-img-box{
		height: 300px;
	}
	.footer-bg1{
		height: 130%;
	}
	.activity-box .news-list{
		width: 170px;
	}
	.activity-box .news-list .news-list-img-box{
		height: 145px;
	}
	.news-page-time{
		position: static;
	}
	.news-page-title{
		font-size: 18px;
	}
	.news-page-title-line{
		height: 15px;
	}
	.news-page-title-box{
		padding-left: 10px;
	}
	.about-img-border{
		height: 290px;
	}
	.about-img {
    height: 250px;
	}
	.traffic-list3-map{
		height: 300px;
	}
	.attractions-list{
		width: 300px;
		height: 300px;
		display: block;
		margin: 0 auto;
		margin-bottom: 10px;
	}
	.attractions-box .attractions-list:nth-child(3n+2){
		margin: 0 auto;
		margin-bottom: 10px;
	}
	.attractions-box{
		padding-top: 30px;
	}
	.introduction-list1-img{
		float: none;
	}
	.about-title{
		font-size: 18px;
	}
	.rwd-menu:after{
		border-right: 10px solid transparent;
 	    border-top: 10px solid #1490d0;
    	border-left: 10px solid transparent;
    	bottom: 15px;
	}
	.about-concert-list{
		width: 160px;
	}
	.about-concert-img{
		height: 150px;
	}
	.about-concert-time ul li{
		width: 100%;
		display: block;
		border-right: 0;
		border-bottom: 1px solid #1793d3;
	}
	.about-concert-list-time{
		background-color: #1490d0;
		color: #FFF;
	}
	.about-concert-list-time, .about-concert-show-name{
		line-height: 40px;
	}
	.fancybox-prev{
		position: static;
		float: left;
	}
	.fancybox-next{
		position: static;
		float: right;
	}
	.fancybox-p{
		padding-bottom: 30px;
	}
	.fancybox-close{
		top: 0;
		right: 0;
	}
	.fancybox-close span{
		width: 20px;
	}
	.fancybox-close span:nth-child(1){
		top: 2px;
	}
	.news-list-box{
		display: block;
	}
	.activity-box .news-list:nth-child(even){
		margin-left: 10px;
	}
	.news-list{
		margin: 0;
		margin-bottom: 10px;
	}
	.gov-logo{
		margin-bottom: 10px;
	}
}
@media only screen and (max-width: 320px){
	.activity-box{
		width: 300px;
	}
	#activity .news-list-box{
		display: block;
	}
	.activity-box .news-list{
		width: 100%;
	}
	.activity-box .news-list .news-list-img-box{
		height: 255px;
	}
}	