@charset "UTF-8";
body{
    font-family: "Squada One", sans-serif;
    font-weight: 400;
    font-style: normal;
	padding-top: 80px;
}

.page_gif{
	display: grid;
	justify-content: center;
	margin-top: 100px;
	margin-left: 40px;
	margin-right: 40px;
	.page__gif{
		width: 100%;
		height: 100%;
		.page___gif{
			border-radius: 10px;
			width: 100%;
			height: auto;
		}
	}

}

.header_box{
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
    width: 100%;
    height: 80px;
    background: black;
	.main_nav_list a:link {
		color: white;
		text-decoration: none;
	}
	.main_nav_list a:visited {
		color: white;
		text-decoration: none;
	}
	.main_nav{
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 80px;
		.logo_nav{
			position: absolute;
			left: 0;
			right: 0;
			display: flex;
			align-items: center;
			margin: auto;
			width: 100px;
			height: 100%;
			.logo_img{
				width: 100%;
				height: auto;
			}
		}
	}
	.content_nav,.about_nav,.histry_nav,.contact_nav{
		display: flex;
		float: left;
		align-items: center;
		list-style: none;
		font-size: 25px;
	}
	.content_nav,.about_nav,.histry_nav,.contact_nav{
		padding: 2px;
	}
}

.hum{
	display: none;
}

.content_box{
	display: block;
	justify-items: center;
	margin: 100px 0 100px 0;
	.content_tittle{
		text-align: center;
		font-size: 60px;
		margin: 50px 0 50px 0;
	}
	/* ↓スライドショー↓ */
	.slideshow {
		position: relative;
		overflow: hidden;
	}
	input[name="slideshow"] {
		display: none;
	}
	
	/* :::::: slideContents :::::: */
	.slideContents {
		display: flex;
		position: relative;
		width: 300%;
		background: #f7f7f7;
		text-align: center;
		-webkit-user-select: none;
		user-select: none;
		transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	.slideContents section {
		width: calc(100%/ 3);
	}
	.slideContents section img {
		max-width: 100%;
		height: auto;
		padding: 0 50px;
		box-sizing: border-box;
		vertical-align: middle;
	}
	@media (min-width: 520px) {
		.slideContents section img {
			aspect-ratio: 3 / 1;
			object-fit: cover;
		}
	}
	
	/* :::::: arrows :::::: */
	.arrow,
	.arrow label,
	.arrow .ico {
		position: absolute;
	}
	.arrow {
		top: 0;
		margin: 0;
		transition: background .3s;
	}
	.prev {
		left: 0;
	}
	.next {
		right: 0;
	}
	.arrow:hover {
		background: black;
	}
	.arrow,
	.arrow label {
		cursor: pointer;
		width: 50px;
		height: 100%;
	}
	.arrow label {
		top: 0;
		left: 0;
		z-index: 1;
	}
	.arrow .ico {
		top: calc(50% - 6px);
		width: 12px;
		height: 12px;
		border-top: 3px solid #fff;
		opacity: 0;
	}
	.prev .ico {
		left: 50%;
		border-left: 3px solid #fff;
		transform: rotate(-45deg);
		transition: left .3s cubic-bezier(0.215, 0.61, 0.355, 1), opacity .3s;
	}
	.next .ico {
		right: 50%;
		border-right: 3px solid #fff;
		transform: rotate(45deg);
		transition: right .3s cubic-bezier(0.215, 0.61, 0.355, 1), opacity .3s;
	}
	.arrow:hover .ico {
		opacity: .6;
	}
	.prev:hover .ico {
		left: calc(50% - 6px);
	}
	.next:hover .ico {
		right: calc(50% - 6px);
	}
	
	/* :::::: mechanism :::::: */
	#switch1:checked ~ .slideContents {
		transform: translateX(0);
	}
	#switch2:checked ~ .slideContents {
		transform: translateX(calc(-100% / 3));
	}
	#switch3:checked ~ .slideContents {
		transform: translateX(calc(-100% / 3 * 2));
	}
	
	/* :::::: arrow mechanism :::::: */
	.arrow label {
		pointer-events: none;
	}
	#switch1:checked ~ .prev label[for="switch3"],
	#switch2:checked ~ .prev label[for="switch1"],
	#switch3:checked ~ .prev label[for="switch2"],
	#switch1:checked ~ .next label[for="switch2"],
	#switch2:checked ~ .next label[for="switch3"],
	#switch3:checked ~ .next label[for="switch1"] {
		pointer-events: auto;
	}
	/* ↑スライドショー↑ */
	.content_setumei{
		font-size: 20px;
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: bold;
		font-style: normal;
		line-height: 1.7;
		margin-top: 50px;
	}
	.content_readmore a:link {
		color: white;
		text-decoration: none;
	}
	.content_readmore a:visited {
		color: white;
		text-decoration: none;
	}
	.content_readmore{
		text-align: center;
		padding-top: 1.5px;
		font-size: 30px;
		color: white;
		background-color: black;
		border-radius: 5px;
		margin: 40px 0 20px 0;
		width: 125px;
		height: 35px;
	}
	.content_readmore:hover{
		opacity: 50%;
	}
}

.content_tittle{
	text-align: center;
	font-size: 60px;
	margin: 50px 0 50px 0;
}

.content_box_p{
	display: grid;
	justify-content: center;
	.content_tittle_live{
		font-size: 45px;
		margin-bottom: 10px;
	}
	.content_box_live{
		margin-bottom: 50px;
		display: flex;
		.content_live_1{
			margin-right: 100px;
			width: 500px;
			height: 100%;
			.content_live_1_1{
				border-radius: 10px;
				width: 100%;
				height: auto;
			}
		}
		.content_live_2{
			width: 500px;
			height: 100%;
			.content_live_2_2{
				border-radius: 10px;
				width: 100%;
				height: auto;
			}
		}
	}
	.content_tittle_cutout{
		font-size: 45px;
		margin-bottom: 10px;
	}
	.content_box_cutout{
		margin-bottom: 50px;
		display: flex;
		.content_cutout_1{
			margin-right: 100px;
			width: 500px;
			height: 100%;
			.content_cutout_1_1{
				border-radius: 10px;
				width: 100%;
				height: auto;
			}
		}
		.content_cutout_2{
			width: 500px;
			height: 100%;
			.content_cutout_2_2{
				border-radius: 10px;
				width: 100%;
				height: auto;
			}
		}
	}
	.content_tittle_shorts{
		font-size: 45px;
		margin-bottom: 10px;
	}
	.content_box_shorts{
		display: flex;
		.content_shorts_1{
			margin-right: 100px;
			width: 500px;
			height: 100%;
			.content_shorts_1_1{
				border-radius: 10px;
				width: 100%;
				height: auto;
			}
		}
		.content_shorts_2{
			width: 500px;
			height: 100%;
			.content_shorts_2_2{
				border-radius: 10px;
				width: 100%;
				height: auto;
			}
		}
	}
}

.about_box{
	display: block;
	justify-items: center;
	margin: 100px 0 100px 0;
	.about_tittle{
		text-align: center;
		font-size: 60px;
		margin: 50px 0 50px 0;
	}
	.about_honbun{
		font-size: 20px;
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: bold;
		font-style: normal;
		line-height: 1.7;
	}
	.about_readmore a:link {
		color: white;
		text-decoration: none;
	}
	.about_readmore a:visited {
		color: white;
		text-decoration: none;
	}
	.about_readmore{
		text-align: center;
		padding-top: 1.5px;
		font-size: 30px;
		color: white;
		background-color: black;
		border-radius: 5px;
		margin: 40px 0 20px 0;
		width: 125px;
		height: 35px;
	}
	.about_readmore:hover{
		opacity: 50%;
	}
}

.histry_box{
	display: block;
	justify-items: center;
	margin: 100px 0 100px 0;
	.histry_tittle{
		text-align: center;
		font-size: 60px;
		margin: 50px 0 50px 0;
	}
	.histry_home_news ul li{
		list-style: none;
		font-size: 20px;
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: bold;
		font-style: normal;
		line-height: 1.7;
	}
	.histry_readmore a:link {
		color: white;
		text-decoration: none;
	}
	.histry_readmore a:visited {
		color: white;
		text-decoration: none;
	}
	.histry_readmore{
		text-align: center;
		padding-top: 1.5px;
		font-size: 30px;
		color: white;
		background-color: black;
		border-radius: 5px;
		margin: 40px 0 20px 0;
		width: 125px;
		height: 35px;
	}
	.histry_readmore:hover{
		opacity: 50%;
	}
}

.histry_box_p{
	display: block;
	justify-items: center;
	margin: 100px 0 100px 0;
	.histry_tittle{
		text-align: center;
		font-size: 60px;
		margin: 50px 0 50px 0;
	}
	.histry_img_hover_p:hover{
		opacity: 50%;
	}
	.histry_nnn_p{
		margin-bottom: 50px;
		.histry_tittle_n_box_p{
			display: flex;
			align-items: center;
			margin-bottom: 10px;
			.histry_tittle_n_p{
				font-size: 45px;
				margin-right: 10px;
			}
			.histry_tittle_img_n_box_p{
				width: 40px;
				height: 100%;
				.histry_tittle_img_n_p{
					width: 100%;
					height: auto;
				}
			}
		}
	}
	.histry_yyy_p{
		margin-bottom: 50px;
		.histry_tittle_y_box_p{
			display: flex;
			align-items: center;
			margin-bottom: 10px;
			.histry_tittle_y_p{
				font-size: 45px;
				margin-right: 10px;
			}
			.histry_tittle_img_y_box_p{
				width: 50px;
				height: 100%;
				.histry_tittle_img_y_p{
					width: 100%;
					height: auto;
					margin-top: 5px;
				}
			}
		}
	}
	.histry_ttt_p{
		margin-bottom: 0;
		.histry_tittle_t_box_p{
			display: flex;
			align-items: center;
			margin-bottom: 10px;
			.histry_tittle_t_p{
				font-size: 45px;
				margin-right: 2.5px;
			}
			.histry_tittle_img_t_box_p{
				width: 45px;
				height: 100%;
				.histry_tittle_img_t_p{
					width: 100%;
					height: auto;
				}
			}
		}
	}
	.histry_home_news_p ul li{
		list-style: none;
		font-size: 20px;
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: bold;
		font-style: normal;
		line-height: 1.7;
	}
}

.form_box{
	display: block;
	justify-content: center;
	margin: 100px 0 100px 0;
	.contact_tittle{
		text-align: center;
		font-size: 60px;
		margin: 20px 0 20px 0;
	}
	.form_main{
		width: min(100% - 50px, 750px);
		margin: 50px auto;
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: bold;
		font-style: normal;
		line-height: 1.7;
		.form_name_k_box{
			margin-bottom: 40px;
			.form_name_k{
				border: 1px solid #ddd;
				border-radius: 15px;
				padding:1px 15px 1px 15px ;
				width: 100%;
				height: 30px;
				font-weight: 100;
				margin-top: 5px;
			}
		}
		.form_name_f_box{
			margin-bottom: 40px;
			.form_name_f{
				border: 1px solid #ddd;
				border-radius: 15px;
				padding:1px 15px 1px 15px ;
				width: 100%;
				height: 30px;
				font-weight: 100;
				margin-top: 5px;
			}
		}
		.form_email_box{
			margin-bottom: 40px;
			.form_email{
				border: 1px solid #ddd;
				border-radius: 15px;
				padding:1px 15px 1px 15px ;
				width: 100%;
				height: 30px;
				font-weight: 100;
				margin-top: 5px;
			}
		}
		.form_message_box{
			margin-bottom: 40px;
			.form_message{
				border: 1px solid #ddd;
				border-radius: 15px;
				padding:1px 15px 1px 15px ;
				width: 100%;
				height: 150px;
				font-weight: 100;
				margin-top: 5px;
			}
		}
		.form_submit_box{
			display: flex;
			justify-content: center;
			.form_submit{
				border: 1px solid #ddd;
				border-radius: 15px;
				padding:1px 15px 1px 15px ;
				width: 120px;
				height: 30px 
			}
			.form_submit:hover {
				background: black;
				color: white;
			}
		}
	}
}

.footer_base{
	background-color: white;
	box-shadow: 0 0 2px 0 black;
	height: 250px;
	width: 100%;
	display: block;
	align-content: end;
	margin-top: 100px;
	.copyright{
		background-color: black;
		display: flex;
		justify-content: center;
		color: white;
		font-size: 18px;
		line-height: 1.7;
	}
	.main_nav_f{
		padding-bottom: 20px;
		.logo_nav_f{
			display: flex;
			align-items: center;
			margin: 0 auto 0 auto;
			.logo_img_f{
				width: 100%;
				height: auto;
				margin-bottom: 15px;
			}
		}
		width: 100%;
		.main_nav_list_f a:link {
			color: black;
			text-decoration: none;
		}
		.main_nav_list_f a:visited {
			color: black;
			text-decoration: none;
		}
		.main_nav_list_f{
			display: flex;
			justify-content: center;
		}
		.logo_nav_f{
			width: 100px;
			height: 100%;
			padding-bottom: 6px;
		}
	}
	.footer_snsnav{
		display: grid;
		justify-content: center;
		align-items: center;
		padding-bottom: 20px;
		width: 100%;
		height: 80px;
		.footer_text{
			font-size: 20px;
			margin: 0 auto 0 auto;
		}
		.footer_imglink{
			display: flex;
			align-items: center;
			.img_sns{
				width: 100%;
				height: auto;
			}
			.img_sns:hover{
				opacity: 50%;
			}
			.footer_sns_y{
				margin-right: 20px;
				width: 40px;
				height: 100%;
			}
			.footer_sns_tw{
				margin-right: 20px;
				width: 40px;
				height: 100%;
			}
			.footer_sns_n{
				margin-right: 20px;
				width: 25px;
				height: 100%;
			}
			.footer_sns_ti{
				margin-right: 15px;
				width: 35px;
				height: 100%;
			}
			.footer_sns_x{
				margin-right: 20px;
				width: 30px;
				height: 100%;
			}
			.footer_sns_b{
				margin-right: 20px;
				width: 25px;
				height: 100%;
			}
		}
	}
}

@media(max-width:800px){
	.content_box{
		.content_setumei{
			font-size: 60%;
			font-family: "Noto Sans JP", sans-serif;
			font-optical-sizing: auto;
			font-weight: bold;
			font-style: normal;
			line-height: 1.7;
			margin-top: 25px;
		}
	}
	.about_box{
		.about_tittle{
			text-align: center;
			font-size: 60px;
			margin: 50px 0 25px 0;
		}
		.about_honbun{
			font-size: 60%;
			font-family: "Noto Sans JP", sans-serif;
			font-optical-sizing: auto;
			font-weight: bold;
			font-style: normal;
			line-height: 1.7;
		}
	}
	.content_box_p{
		display: grid;
		justify-content: center;
		.content_tittle_live{
			font-size: 45px;
			margin-bottom: 10px;
		}
		.content_box_live{
			margin-bottom: 50px;
			flex-direction: column;
			.content_live_1{
				margin-right: 0;
				margin-bottom: 10px;
				width: 350px;
				height: 100%;
				.content_live_1_1{
					border-radius: 10px;
					width: 100%;
					height: auto;
				}
			}
			.content_live_2{
				width: 350px;
				height: 100%;
				.content_live_2_2{
					border-radius: 10px;
					width: 100%;
					height: auto;
				}
			}
		}
		.content_tittle_cutout{
			font-size: 45px;
			margin-bottom: 10px;
		}
		.content_box_cutout{
			margin-bottom: 50px;
			flex-direction: column;
			.content_cutout_1{
				margin-right: 0;
				margin-bottom: 10px;
				width: 350px;
				height: 100%;
				.content_cutout_1_1{
					border-radius: 10px;
					width: 100%;
					height: auto;
				}
			}
			.content_cutout_2{
				width: 350px;
				height: 100%;
				.content_cutout_2_2{
					border-radius: 10px;
					width: 100%;
					height: auto;
				}
			}
		}
		.content_tittle_shorts{
			font-size: 45px;
			margin-bottom: 10px;
		}
		.content_box_shorts{
			flex-direction: column;
			.content_shorts_1{
				margin-right: 0;
				margin-bottom: 10px;
				width: 350px;
				height: 100%;
				.content_shorts_1_1{
					border-radius: 10px;
					width: 100%;
					height: auto;
				}
			}
			.content_shorts_2{
				width: 350px;
				height: 100%;
				.content_shorts_2_2{
					border-radius: 10px;
					width: 100%;
					height: auto;
				}
			}
		}
	}
	.histry_box_p{
	.histry_home_news_p ul li{
		list-style: none;
		font-size: 60%;
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: bold;
		font-style: normal;
		line-height: 1.7;
	}
	}
	.histry_box{
		.histry_tittle{
			text-align: center;
			font-size: 60px;
			margin: 50px 0 25px 0;
		}
		.histry_home_news ul li{
			list-style: none;
			font-size: 60%;
			font-family: "Noto Sans JP", sans-serif;
			font-optical-sizing: auto;
			font-weight: bold;
			font-style: normal;
			line-height: 1.7;
		}
	}
	.page_gif{
		margin-top: 20px;
	}
	.content_box{
		margin-top: 50px;
	}
	.header_box{
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10;
		width: 100%;
		height: 80px;
		background: black;
		.main_nav_list a:link {
			color: white;
			text-decoration: none;
		}
		.main_nav_list a:visited {
			color: white;
			text-decoration: none;
		}
		.main_nav{
			position: relative;
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: 80px;
			.logo_nav{
				position: absolute;
				left: 0;
				right: 0;
				display: flex;
				align-items: center;
				margin: auto;
				width: 100px;
				height: 100%;
				.logo_img{
					width: 100%;
					height: auto;
				}
			}
		}
		nav ul li{
			display: flex;
			float: left;
			align-items: center;
			list-style: none;
			font-size: 25px;
		}
		.content_nav,.about_nav,.histry_nav,.contact_nav{
			display: none;
			padding: 2px;
			z-index: 1;
		}
	}
	.hum{
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-radius: 50px;
		margin-left: 85%;
		.logo_hum {
			font-size: 24px;
			.nav_list {
				list-style: none;
			}
			.drawer_hidden {
				display: none;
			}
			.drawer_open {
				display: flex;
				height: 45px;
				width: 45px;
				justify-content: center;
				align-items: center;
				position: relative;
				z-index: 100;
				cursor: pointer;
			}
			.drawer_open span,
			.drawer_open span:before,
			.drawer_open span:after {
				content: '';
				display: block;
				height: 3px;
				width: 25px;
				border-radius: 3px;
				background: white;
				transition: 0.5s;
				position: absolute;
			}
			.drawer_open span:before {
				bottom: 8px;
			}
			.drawer_open span:after {
				top: 8px;
			}
			#drawer_input:checked ~ .drawer_open span {
				background: rgba(255, 255, 255, 0);
			}
			#drawer_input:checked ~ .drawer_open span::before {
				bottom: 0;
				transform: rotate(-45deg);
				background-color: black;
			}
			#drawer_input:checked ~ .drawer_open span::after {
				top: 0;
				transform: rotate(45deg);
				background-color: black;
			}
			.nav_hum_content {
				width: 100%;
				height: 100%;
				position: fixed;
				top: 0;
				left: 100%; 
				z-index: 99;
				background: #fff;
				transition: .5s;
				.img_hum_logo_box{
					margin: auto;
					margin-top: 15px;
					width: 100px;
					height: auto;
					.img_hum_logo{
						width: 100%;
						height: 100%;
					}
				}
				.nav_hum_item1,.nav_hum_item2,
				.nav_hum_item3,.nav_hum_item4,
				a:link{
					color: black;
					text-decoration: none;
				}
				.nav_hum_item1,.nav_hum_item2,
				.nav_hum_item3,.nav_hum_item4,
				a:visited{
					color: black;
					text-decoration: none;
				}
				.nav_hum_item1{
					margin-top: 40px;
					margin-left: 40px;
					font-size: 40px;
				}
				.nav_hum_item2{
					margin-top: 20px;
					margin-left: 40px;
					font-size: 40px;
				}
				.nav_hum_item3{
					margin-top: 20px;
					margin-left: 40px;
					font-size: 40px;
				}
				.nav_hum_item4{
					margin-top: 20px;
					margin-left: 40px;
					font-size: 40px;
				}
				.nav_hum_sns_box{
					margin-top: 50px;
					margin-left: 40px;
					.nav_hum_sns_tittle{
						font-size: 25px;
					}
					.nav_hum_sns_img{
						display: flex;
						align-items: center;
						.nav_hum_sns_y{
							margin-right: 10px;
							width: 50px;
							height: 100%;
							.img_hum_sns{
								width: 100%;
								height: auto;
							}
						}
						.nav_hum_sns_tw{
							margin-right: 10px;
							width: 50px;
							height: 100%;
							.img_hum_sns{
								width: 100%;
								height: auto;
							}
						}
						.nav_hum_sns_n{
							margin-right: 5px;
							width: 30px;
							height: 100%;
							.img_hum_sns{
								width: 100%;
								height: auto;
							}
						}
						.nav_hum_sns_ti{
							margin-right: 5px;
							width: 45px;
							height: 100%;
							.img_hum_sns{
								width: 100%;
								height: auto;
							}
						}
						.nav_hum_sns_x{
							margin-right: 20px;
							width: 35px;
							height: 100%;
							.img_hum_sns{
								width: 100%;
								height: auto;
							}
						}
						.nav_hum_sns_b{
							margin-right: 20px;
							width: 30px;
							height: 100%;
							.img_hum_sns{
								width: 100%;
								height: auto;
							}
						}
					}
				}
			}
			#drawer_input:checked ~ .nav_hum_content {
				left: 0;
			}
		}
	}
}