@charset "utf-8";

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

.sec01{
	color:#3b8acf;
	max-width: 980px;
	margin: 0 auto;
	padding: 30px 0 0;
}

.sec01 h5{
	font-size:25px;
	margin-bottom: 30px;
	font-weight: bold;
}

.sec01 p{
	line-height:1.8;
	font-size: 16px;
	margin-bottom: 1.5em;
	font-weight: 500;
}

.sec01 p a{
	color: #00418e;
	font-weight: bold;
	text-decoration: underline;
}

.sec01 p a:hover{
	text-decoration: none;
}

.sec01 .left{
	float: left;
	width:60%;
}

.sec01 .right{
	float: right;
	width:40%;
	text-align: center;
	position: relative;
}

.sec01 .right p{
	position: relative;
}

.sec01 .right:before{
	content: "";
	position: absolute;
	background: url(../images/event/tanabata/fw01.png) center center no-repeat;
	width:129px;
	height:130px;
	top:0%;
	left: 0;
	transform:translate(calc(-50% + 0.5px),-50%);
}

.sec02{
	max-width: 980px;
	margin: 0 auto;
	padding: 10px 0 0;
	position: relative;
}

.sec02:before{
	content: "";
	position: absolute;
	background: url(../images/event/tanabata/fw02.png) center center no-repeat;
	width:80px;
	height:79px;
	top:0%;
	right: 0;
}

.sec02:after{
	content: "";
	position: absolute;
	background: url(../images/event/tanabata/fw04.png) center center no-repeat;
	width:80px;
	height:79px;
	bottom:2%;
	left: 5%;
}

.s2_in{
	width:69.38%;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.s2_in .fw{
	padding-right:3%;
}



@media screen and (max-width: 960px){
	
	.sec01 p br{
		display: none;
	}
	
	.sec01 p span{
		display: inline-block;
	}

	.sec01 .right{
		width:35%;
	}
	
}

@media screen and (max-width: 767px){
	
	.sec01{
		padding: 0;
	}
	
	.sec01 .left{
		float: none;
		width:auto;
	}

	.sec01 .right{
		float: none;
		width:60%;
		max-width: 349px;
		margin: 0 auto;
		padding-top:30px;
	}
	
	.sec01 .right:before{
		transform:translate(-80%,0%);
	}
	
	.s2_in{
		width:480px;
		margin: 0 auto;
		max-width: 100%;
	}

	

}
	
@media screen and (max-width: 600px){
	
	.sec01 h5{
		font-size:18px;
	}

	.sec01 p{
		font-size: 14px;
	}

	.s2_in{
		align-items:flex-start;
	}

	.sec02:before{
		background-size:contain;
		max-width:15%;
		top:-35%;
	}

	.sec02:after{
		background-size:contain;
		max-width:20%;
		bottom:0%;
		left: 0%;
	}
	
		

}