@charset "utf-8";

.main{
	position: relative;
	overflow: hidden;
}

.main .main_cloud{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 1600px;
	max-width: 100%;
	margin: 0 auto;
}



.bg01{
	background: url(../images/festival/bg01.jpg) top center repeat;
}

.bg02{
	background: url(../images/festival/bg02.jpg) top center repeat;
}

h4{
	font-size:20px;
	background: #3b82c5;
	color: #FFFFFF;
	padding:5px 10px;
	margin-bottom: 20px;
}

h4:before{
	content:"\025cf";
	color: #fff200;
}

h4 span{
	font-size:90%;
	background: #fff200;
	color:#ea6094;
	padding:0 10px;
	border-radius: 100px;
}

h5{
	font-size:24px;
}


.txt{
	font-size:16px;
}

.txt2{
	font-size:14px;
}

.sec01{
	padding:20px;
	background: #FFFFFF;
	color: #ea6094;
	overflow: hidden;
}

.sec01 p{
	float:left;
	width:40%;
	font-size:20px;
	padding-left:20px;
	box-sizing:border-box;
	clear: both;
}

.sec01 p:nth-child(2n){
	width:60%;
	clear: none;
}

hr.pink{
	margin: 0;
	padding:0;
	border:none;
	background: none;
	height:0;
	
	border-bottom:solid 1px #ea6094;
	margin-bottom: 15px;
	margin-top: 15px;
}


.sec02 .naito{
	float: left;
	width:57.68%;
}

.sec02 .naito .img{
	float: left;
	width:36.60%;
}

.sec02 .naito>.txt{
	float: right;
	width:60.52%;
}

.sec02 .tegone{
	float: right;
	width:40.28%;
}

.sec02 .tegone .img{
	float: left;
	width:52.41%;
}

.sec02 .tegone>.txt{
	float: right;
	width:46.0%;
}

.half>li{
	width:47.23%;
	float:left;
	clear: both;
	overflow: hidden;
}

.half>li:nth-child(2n){
	float:right;
	clear: none;
}

.half .txtbox{
	float:left;
	width:52.94%;
}

.half .img{
	float:right;
	width:43.34%;
}

.sec03{
	overflow:hidden;
	margin-bottom:-30px;
}

.sec03 li{
	float:left;
	width:21.67%;
	margin-right:4.44%;
	margin-bottom:30px;
}

.sec03 li:nth-child(4n){
	margin-right: 0;
}

.sec03 li:nth-child(4n+1){
	clear: both;
}

.sec04{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	font-size:20px;
	justify-content: space-between;
}

.sec04 li:before{
	content:"\025a0";
	color: #3b82c5;
}

.txtbox2{
	position: relative;
}

.txtbox2 .txt{
	/* width:90%; */
}

.txtbox2 .img1{
	width:26%;
	top: 0;
	right: 0;
	position: absolute;
}

.txtbox2 .img2{
	margin-top: 20px;
	margin-bottom: 20px;
}

.txtbox2 .img2{
	margin-top: 20px;
}

@media screen and (max-width: 1100px){
	
	.txtbox2 .img1{
		width:auto;
		text-align: center;
		position: static;
		margin-top: 20px;
	}

	.txtbox2 .img2{
		text-align: center;
	}


	.txtbox2 .txt{
		width:auto;
	}
	
}

@media screen and (max-width: 900px){
	
}

@media screen and (max-width: 767px){


	h4{
		font-size:18px;
	}

	h5{
		font-size:20px;
	}

	.txt{
		font-size:12px;
	}

	.txt2{
		font-size:12px;
	}

	.sec01 p{
		float:none;
		width:auto;
		font-size:16px;
		text-indent:-1em;
		padding-left:1em;
	}

	.sec01 p:nth-child(2n){
		width:auto;
	}	


	.sec02 .naito{
		float: none;
		width:auto;
		overflow:hidden;
		margin-bottom:30px;
	}

	.sec02 .tegone{
		float: none;
		width:auto;
		overflow:hidden;
	}

	.sec02 .tegone .img{
		float: left;
		width:36.60%;
	}

	.sec02 .tegone>.txt{
		float: right;
		width:60.52%;
	}

	.half{
		margin-bottom:-30px;
	}
	.half>li{
		width:auto;
		float:none;
		margin-bottom:30px;
	}

	.sec03{
		max-width: 540px;
		margin: 0 auto -30px;
	}

	.sec03 li{
		width:48%;
		margin-right:4%;
		margin-bottom:30px;
	}

	.sec03 li:nth-child(2n){
		margin-right: 0;
	}

	.sec03 li:nth-child(2n+1){
		clear: both;
	}

	.sec04{
		font-size:14px;
	}


}

	
@media screen and (max-width: 600px){

	.container{
		padding: 50px 10px 50px;
	}

	.sec02 .naito .img{
		float: none;
		width:auto;
		text-align:center;
		padding-right:5%;
		margin-bottom:20px;
	}

	.sec02 .naito>.txt{
		float: none;
		width:auto;
	}

	.sec02 .tegone .img{
		float: none;
		width:auto;
		text-align:center;
		padding-right:5%;
		margin-bottom:20px;
	}

	.sec02 .tegone>.txt{
		float: none;
		width:auto;
	}


	
}

@media screen and (max-width: 980px){

}