@charset "utf-8";

@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 300;
	src:local("Noto Sans JP Light"),
		url(../fonts/NotoSansJP-Light.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 400;
	src:local("Noto Sans JP Regular"),
		url(../fonts/NotoSansJP-Regular.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 500;
	src:local("Noto Sans JP Medium"),
		url(../fonts/NotoSansJP-Medium.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 600;
	src:local("Noto Sans JP SemiBold"),
		url(../fonts/NotoSansJP-SemiBold.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 700;
	src:local("Noto Sans JP Bold"),
		url(../fonts/NotoSansJP-Bold.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 800;
	src:local("Noto Sans JP Extra Bold"),
		url(../fonts/NotoSansJP-ExtraBold.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 900;
	src:local("Noto Sans JP Black"),
		url(../fonts/NotoSansJP-Black.ttf);
}

/*common*/
/*********************/
.page_ttl,
#bread {display: none;}
#main .free_block ol,
#main .free_block ul {
  list-style: none;
  margin: auto;
}
#main .txt,
#main * {
	font-family: "Noto Sans JP", "Meiryo";
}

.free_block h2.h2_ttl {
	color: #bb0009;
	font-size: clamp(2rem, 4.082vw, 4rem);
	font-weight: 900;
	text-align: center;
	border-radius: 4em;
	padding: .1em 0 .15em;
	background-color: #fff338;
	border: none;
}
.free_block h2::before {
	display: none;
}
.free_block h3.h3_ttl {
	color: #fff;
	font-size: clamp(1.2rem, 2.45vw, 2.4rem);
	font-weight: 900;
	background: none;
	padding: 0;
	display: flex;
}
.free_block h3.h3_ttl::before {
	content: '';
	display: block;
	width: calc(clamp(2rem, 4.082vw, 4rem) * .35);
	height: calc(clamp(2rem, 4.082vw, 4rem) * .35);
	margin: .5em .5em 0 0;
	background-color: #fff;
	border-radius: 50%;
	box-shadow: 0px 0px 0px 2px #000,0px 0px 0px 3px #fff;
}

.free_block .txt_l {
	color: #fff;
	font-size: clamp(1.5rem, 3.062vw, 3rem);
}
.free_block .txt_m {
	color: #fff;
	font-size: clamp(1.2rem, 2.45vw, 2.4rem);
}

.link_txt {
	color: #fff;
	text-decoration: underline;
	display: flex;
	align-items: center;
}
.link_txt::before {
	content: '';
	display: block;
	background-color: #fff338;
	width: 14px;
	height: 15px;
	clip-path: polygon(0 0, 0% 100%, 100% 50%);
	margin-right: 10px;
}
#main .free_block a.link_txt[target=_blank]::after{display: none;}

.free_block .mb0 {
	margin-bottom: 0;
}
.free_block .mb05 {
	margin-bottom: 5px;
}
.free_block .mb10 {
	margin-bottom: 10px;
}

@media screen and (min-width:641px) {
	.img.sp,
	.sp {
		display: none;
	}
	.img.pc,
	.pc {display: block;}
  #main .section {
  }
}
@media screen and (max-width:640px) {
	.img.pc,
	.pc {
		display: none;
	}
	.img.sp,
	.sp {display: block;}
	.free_block .txt_l {
		font-size: clamp(1.8rem, 4.688vw, 3.6rem);
	}
	.free_block .txt_m {
		font-size: clamp(1.45rem, 3.778vw, 2.9rem);
	}
	.free_block h2.h2_ttl {
		font-size: clamp(1.95rem, 5.08vw, 3.9rem);
		padding: .25em 0;
	}
	.free_block h3.h3_ttl {
		font-size: clamp(1.45rem, 3.778vw, 2.9rem);
	}
	.free_block h3.h3_ttl::before {
		width: calc(clamp(1.45rem, 3.778vw, 2.9rem) * .5);
		height: calc(clamp(1.45rem, 3.778vw, 2.9rem) * .5);
	}
}

/*section*/
#main {
	background-color: #000;
}
#main .section:last-of-type,
#main > .section {
  padding: 0;
  margin: 0 auto ;
  max-width: 100%;
	padding-bottom: min(5.625vw, 108px);
}
.free_block img {margin: 0;}
.wrap_cnt {
	width: min(93vw, 1200px);
	margin: auto;
}

.flex {
	display: flex;
}
.flex.center {
	justify-content: center;
	align-items: center;
}
@media screen and (min-width:641px) {
}
@media screen and (min-width:768px) {
}
@media screen and (max-width:640px) {
}

/*mv*/
/***************/
#mv {
	width: 100%;
	height: min(50vw, 960px);
	background: url(../../images/event/hado_event_202605/mv_pc02.webp) 100% 0 no-repeat;
	background-size: auto 100%;
	margin-bottom: min(1.5625vw, 30px);
}
#mv .ttl_wp {
	width: min(100%, 1920px);
	margin: auto;
	background: url(../../images/event/hado_event_202605/mv_pc01.webp) 0 0 no-repeat;
	background-size: auto 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-start;
	padding-top: min(1.875vw, 36px);
	padding-right: min(15.15625vw, 291px);
}
#mv .ttl_wp * {
	width: min(32.96875vw, 633px);
	display: flex;
	justify-content: center;
}
#mv .ttl_wp .mv_ttl .img {
	width: min(18.75vw, 360px);
}
#mv .ttl_wp .mv_date .img {
	width: min(28.4375vw, 546px);
}
.free_block #mv .mv_date {margin-bottom: 0;}

/*top read*/
.free_block .top_txt {
	color: #fff;
	font-size: clamp(1.5rem, 3.062vw, 3rem);
	font-weight: 800;
	line-height: 1.8;
	text-align: center;
	margin-bottom: min(3.90625vw, 75px);
}
.wrap_certificate {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: min(2.65625vw, 51px);
}
.wrap_certificate .img_txt {
	width: min(27.96875vw, 537px);
}
.wrap_certificate .img_crt {
	width: min(15vw, 288px);
}

/*info dl*/
.info_dl {
	width: min(90vw, 1100px);
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
}
.info_dl .info_dt {
	color: #bb0009;
	font-size: clamp(1.55rem, 3.164vw, 3.1rem);
	font-weight: 900;
	padding: .1em 1em .15em;
	margin-right: min(1.09375vw, 21px);
	margin-bottom: min(1.875vw, 36px);
	background-color: #fff338;
	border-radius: 3em;
}
.info_dl .info_dd {
	width: calc(100% - 13em);
	margin-bottom: min(1.875vw, 36px);
}
.free_block .info_dl .txt_l {
	font-weight: 800;
}
.free_block .info_dl p {
	margin-bottom: 0;
}
.free_block .info_dl p.mb10 {
	margin-bottom: 10px;
}

@media screen and (min-width:641px) {
}
@media screen and (min-width:1200px) {
}
@media screen and (max-width:640px) {
	#mv {
		background: url(../../images/event/hado_event_202605/mv_sp.webp) 0 0 no-repeat;
		background-size: 100% auto;
		height: auto;
		margin-bottom: min(4vw, 30px);
	}
	#mv .ttl_wp {
		align-items: center;
		background: none;
		padding-top: min(56vw, 420px);
		padding-right: 0;
	}
	#mv .ttl_wp * {
		width: min(84.4vw, 633px);
	}
	#mv .ttl_wp .mv_ttl .img {
		width: min(48vw, 360px);
	}
	#mv .ttl_wp .mv_date .img {
		width: min(72.8vw, 546px);
	}

	.free_block .top_txt {
		font-size: clamp(1.8rem, 4.688vw, 3.6rem);
		line-height: 1.7;
		margin-bottom: min(12vw, 90px);
	}
	.wrap_certificate {
		flex-direction: column;
		justify-content: flex-start;
		margin-bottom: min(12vw, 90px);
	}
	.wrap_certificate .img_txt {
		width: min(82vw, 615px);
		margin-bottom: min(8vw, 60px);
	}
	.wrap_certificate .img_crt {
		width: min(61.6vw, 462px);
	}

	.info_dl {
		width: min(84vw, 630px);
		flex-direction: column;
	}
	.info_dl .info_dt {
		font-size: clamp(1.85rem, 4.818vw, 3.7rem);
		padding: .1em 1.6em .2em;
	}
	.info_dl .info_dd {
		width: 100%;
		margin-bottom: min(6vw, 45px);
	}
}



/*cont01*/
/*******************/
#cont01 {
	width: min(84vw, 1100px);
	margin: auto;
}

/*video*/
.video_wrap {
	aspect-ratio: 1100 / 618;
  margin: 0 auto min(4vw, 30px);
	position: relative;
}
.video_wrap .video {
	width: 100%;
	height: 100%;
	aspect-ratio: 1100 / 618;
	overflow: hidden;
}
.video_wrap .thumn_mv {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
}
.playActive.thumn_mv {display: none;}


@media screen and (min-width:641px) {

}
@media screen and (min-width:768px) {
}
@media screen and (min-width:1200px) {
}

@media screen and (max-width:640px) {
	#cont01 {
		width: 100%;
	}
	#cont01 .h2_ttl {
		width: min(84vw, 630px);
		margin-right: auto;
		margin-left: auto;
	}

}

/*cont02*/
/*******************/
#cont02 {
	width: min(84vw, 1100px);
	margin: auto;
}

.free_block #cont02 .txt_m {
	margin-bottom: 0;
}
#cont02 .sec + .sec {
	margin-top: min(3.125vw, 60px);
}


@media screen and (max-width:640px) {
	#cont02 {
		width: min(84vw, 630px);
	}
	#cont02 .sec + .sec {
		margin-top: min(6vw, 45px);
	}

}
