#title h1{
width:100%;
}
#title h1 img{
height: auto;
width:100%;
}

#event h2 {
background: #00beff;
color: black;
font-family: "happy-ruika", sans-serif;
font-size: min(2.5em, 5.0vw);
margin: -0.5em auto 0;
padding: 0.8em 0;
text-align: center;
text-shadow: 0 0 5px #ffffff;
}
#event{
background: rgb(101 56 14 / 80%);
}
#event .text{
margin: 0 auto 2em;
}
#event dl{
display: flex;
flex-flow: row wrap;
width: 100%;
}
#event dl dt{
background-color: #3f2c16;
border-bottom: 1px solid #ccc;
color: white;
flex-basis: 20%;
padding: min(20px, 5%);
}
#event dl dd{
background-color: #fff;
border-bottom: 1px solid #ccc;
color: black;
flex-basis: 80%;
padding: min(20px, 5%);
}
#event dl dt:last-of-type,
#event dl dd:last-of-type {
border-bottom: none;
}
#event dl dd .formBtn {
background: linear-gradient(90deg, #0012fd, #3095ff);
box-shadow: 0 0 10px rgb(36 27 35 / 40%);
border-radius: 10px;
color: #fff !important;
display: block;
margin: 3% auto 0;
padding: 10px 0;
text-decoration: none !important;
text-align: center;
user-select: none;
max-width: 540px;
width: 80%;
}
#event dl dd .formBtn:hover{
opacity: 0.6;
}
#event dl dd .formBtnEnd {
background: #aaa;
border-radius: 10px;
color: #1f1f1f;
margin: 3% auto 0;
padding: 10px 0;
text-decoration: none !important;
text-align: center;
max-width: 540px;
user-select: none;
width: 80%;
}

#event .comBox {
display: flex;
margin: 0.5em auto 8%;
}
#event h4 {
font-size: min(1.5em, 4.0vw);
font-family: "happy-ruika", sans-serif;
margin: 1.5em auto 0;
text-align: center;
text-shadow: 0 0 5px black;
}
#event .comBox .f_photo {
flex-basis: 35%;
margin: 0 2% 0 0;
}
#event .comBox .f_photo img{
height: auto;
width: 100%;
}
#event .comBox .f_text{
flex-basis: 65%;
padding: 0.5em 0 0;
text-shadow: 0 0 5px black;
word-break: auto-phrase;
}
#event small{
font-size: 85%;
}
#itemEv{
position: absolute;
right: 0%;
bottom: -5%;
width: 25%;
}
#itemEv img {
height: auto;
width: 100%;
}
@media screen and (max-width: 800px) {
	#contents .inbox {
	padding: 5% 5% 10%;
	}
	#event dl {
	flex-flow: column;
	}
	#event small {
	display: block;
	}
	#event .comBox{
	display: block;
	}
	#event .comBox .f_photo{
	text-align: center;
	}
	#event .comBox .f_photo img{
	max-width: 240px;
	}
	#event .comBox .f_text{
	word-break: unset;
	}
	#itemEv{
	bottom: -5vw;
	}
}