@import url("reset.css");
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&display=swap');

:root{
	/*カラー指定*/
	--color__white:#ffffff;
	--color__gray:#c4c4c4;
	--color__gray2:#efefef;
	--color__black:#3a3a3a;
	--color__pink:#fd5e99;
	--color__orange:#f39421;
	--color__yellow:#fff100;
	--color__r_green:#a3da02;
	--color__green:#4fcba7;
	--color__r_blue:#00bcfc;
	--color__blue:#5094db;
	--color__purple:#a66baa;
	
	--color__red:#960420;

	/*フォント指定*/
	--font__mplus:'M PLUS Rounded 1c', sans-serif;
}

body{ width: 100%; margin: auto; color: var(--color__black); font-family: var(--font__mplus);}
body.no-scroll { overflow: hidden; height: 100vh;}

.clearfix { *zoom: 1;}
.clearfix:before,
.clearfix:after { display: table; line-height: 0; content: "";}
.clearfix:after { clear: both;}

.forPC{ display: block;}
.forSP{ display: none;}

h1,h2,h3,h4,h5{}

p{ font-size: 14px; font-weight: normal; text-align: left; color: var(--color__black); line-height: 2;}
p.indent-1 { padding-left:1em; text-indent:-1em;}
p.indent-15 { padding-left:1.5em; text-indent:-1.5em;}
a{ text-decoration: none; color: var(--color__black); transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -webkit-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; -ms-transition: .3s ease-in-out; outline: none; font-size: 14px;}


.btn_area{ width: 100%; text-align: center; margin: 60px 0 0; position: relative; z-index: 1;}
.btn_area a{ display: block; width: 100%; max-width: 275px; padding: 20px 0; box-sizing: border-box; background-color: var(--color__black); border-radius: 100px; margin: auto; font-size: 30px; color: var(--color__white); position: relative;}
.btn_area a::after{ content: ""; position: absolute; top: 0; right: 10px; bottom: 0; margin: auto; width: 30px; aspect-ratio: 1 / 1; background-image: url("../images/arrow02.png"); background-size: 10px; background-repeat: no-repeat; background-position: center;}
.btn_area a:hover{ transform: scale(1.1);}

.entry-btn{ display: block; width: 100%; max-width: 275px; padding: 20px 0; box-sizing: border-box; background-color: var(--color__black); border-radius: 100px; margin: auto; font-size: 30px; color: var(--color__white); position: relative; transition: .3s ease-in-out; color: var(--color__white); font-family: var(--font__mplus);}
.entry-btn::after{ content: ""; position: absolute; top: 0; right: 10px; bottom: 0; margin: auto; width: 30px; aspect-ratio: 1 / 1; background-image: url("../images/arrow02.png"); background-size: 10px; background-repeat: no-repeat; background-position: center;}
.entry-btn:hover{ transform: scale(1.1);}

@keyframes floating01 {
  0% { transform: translateY(-10%);}
  100% { transform: translateY(10%);}
}
@keyframes floating02 {
  0% { transform: translateY(-5%);}
  100% { transform: translateY(5%);}
}
@keyframes floating03 {
  0% { transform: translateY(-2%);}
  100% { transform: translateY(2%);}
}

/* header */
header{ width: 100%; padding: 20px 40px 20px; box-sizing: border-box; position: fixed; z-index: 99999; background-color: var(--color__white);}
header .wrap{ width: 100%; max-width: 100%; margin: auto; display: flex; justify-content: space-between; align-items: center;}
header h1{ width: 100%; max-width: 240px; display: block;}
header ul{ list-style: none; display: flex; gap: 0 30px;}
header ul li{ transition: .3s ease-in-out;}
header ul li:hover{ transform: scale(1.1);}
header ul li a{ font-size: 16px; font-weight: bold;}
header ul li.space{ display: none}
header ul li.lang a{ width: 27px; aspect-ratio: 1 / 1; border-radius: 100px; border: 1px solid var(--color__black); box-sizing: border-box; font-size: 12px; display: flex; justify-content: center; align-items: center;}
header ul li.lang a{ background-color: var(--color__black); color: var(--color__white);}

header .menu-btn{ display: none; flex-direction: column;  justify-content: space-between; width: 29px; height: 20px;  cursor: pointer;}
header .menu-btn span{ display: block; height: 3px; background: var(--color__black); border-radius: 2px; transition: 0.3s;}
header .menu-btn.active span:nth-child(1){ transform: rotate(45deg) translate(6px, 6px);}
header .menu-btn.active span:nth-child(2){ opacity: 0;}
header .menu-btn.active span:nth-child(3){ transform: rotate(-45deg) translate(6px, -6px);}
@media screen and (max-width: 1200px) {
	header .menu-btn{ display: flex; z-index: 1;}
	header nav{ position: fixed; top: -10px; left: 0; right: 0; margin: auto; width: 90%; height: calc(100vh - 80px); background-color: var(--color__white); transform: translateY(-100%); transition: transform 0.4s ease;}
	
	header{ width: 100%; padding: 10px 20px 10px;}
	header h1{ width: 100%; max-width: 180px; display: block;}
	header nav{ height: auto; border-radius: 20px; padding: 40px; box-sizing: border-box; box-shadow: 0px 0px 7px -3px #777777;}
	header nav.active{ transform: translateY(0); top: 80px; height: auto;}
	header nav ul{ justify-content: space-between; flex-wrap: wrap; flex-direction: inherit; gap: 20px 0; margin-top: 0; width: 100%; max-width: 730px; margin: auto;}
	header nav ul::before{ content:""; display: block; order:1;}
	header nav ul::after{ content:""; display: block;}
	header nav ul::before,
	header nav ul::after,
	header nav ul li{ width: calc(100% / 4);}
	header nav ul li.space{ display: block; width: calc(100% / 4);}
	header nav ul li a{ font-size: 20px;}
	header nav ul li.lang{ width: 40px; display: block;}
	header ul li.lang a{ width: 40px;}
}

/* schedule_area */
.schedule_area{ width: 100%; padding-bottom: 160px;}
.schedule_area .wrap{ width: 100%; margin: auto;}
.schedule_area .wrap .con_title{ width: 100%; max-width: 700px;}
.schedule_area .schedule_box{ width: 100%; border-bottom: 1px solid var(--color__black);}
.schedule_area .schedule_box li{ width: 100%; border-top: 1px solid var(--color__black); background-color: var(--color__white); padding: 20px 60px 20px 40px; box-sizing: border-box;}
.schedule_area .schedule_box li a{ width: 100%; display: flex; justify-content: flex-start; align-items: center; position: relative;}
.schedule_area .schedule_box li a::after{ content: ""; position: absolute; top: 0; right: -40px; bottom: 0; margin: auto; width: 30px; height: 30px; background-image: url("../images/arrow03.png"); background-size: 18px; background-repeat: no-repeat; background-position: center;}
.schedule_area .schedule_box li a:hover{ transform: scale(1.02);}
.schedule_area .schedule_box li a.non{ pointer-events: none;}
.schedule_area .schedule_box li a.non::after{ display: none;}
.schedule_area .schedule_box li a .img{ width: 100%; max-width: 180px; aspect-ratio: 183 / 143; background-image: url("../images/schedule_item01.jpg"); background-size: 100%; padding: 10px 10px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; transition: .1s ease-in-out;}
.schedule_area .schedule_box li a .txt{ width: 100%; padding: 0 0 0 20px; box-sizing: border-box;}
.schedule_area .schedule_box li a .txt > div{ width: 100%; display: flex; justify-content: flex-start; align-items: center;}
.schedule_area .schedule_box li a .txt > div .date{ font-size: 16px; font-weight: bold; margin-right: 20px;}
.schedule_area .schedule_box li a .txt > div .cate{ font-size: 16px; font-weight: bold;}
.schedule_area .schedule_box li a .txt .ti{ font-size: 20px; font-weight: bold; position: relative; padding: 0 0 0 30px;}
.schedule_area .schedule_box li a .txt .ti::before{ content: ""; display: block; width: 20px; aspect-ratio: 1 / 1; background-color: var(--color__green); border: 2px solid var(--color__black); box-sizing: border-box; border-radius: 100px; position: absolute; top: 9px; left: 0; margin: auto;}
.schedule_area .wrap .schedule_menu_box{ display: flex; justify-content: flex-start; align-items: center; margin-top: 60px; padding: 0 40px; box-sizing: border-box;}
.schedule_area .wrap .btn_area{ width: 100%; max-width: 275px; margin: 0 20px 0 0;}
.schedule_area .wrap ul{ width: 100%; list-style: none; display: flex; justify-content: flex-start; align-items: center; gap: 0 10px;}
.schedule_area .wrap ul li{ width: 100%; max-width: 130px;}
.schedule_area .wrap ul li a{ width: 100%; display: block; text-align: center; font-size: 16px; font-weight: bold; color: var(--color__white); background-color: var(--color__green); padding: 15px 10px; box-sizing: border-box; border-radius: 20px; border: 2px solid var(--color__black);}
.schedule_area .wrap ul li a:hover{ transform: scale(1.1); background-color: var(--color__black); color: var(--color__green);}

/* news_area */
.news_area{ width: 100%; border-top: 2px solid var(--color__black);}
.news_area .wrap{ width: 100%; margin: auto;}
.news_area .wrap .con_title{ width: 100%; max-width: 700px;}
.news_area .news_box{ width: 100%; border-bottom: 1px solid var(--color__black);}
.news_area .news_box li{ width: 100%; border-top: 1px solid var(--color__black); background-color: var(--color__white); padding: 20px 60px 20px 40px; box-sizing: border-box; position: relative;}
.news_area .news_box li a{ width: 100%; display: flex; justify-content: flex-start; align-items: center; position: relative;}
.news_area .news_box li a::after{ content: ""; position: absolute; top: 0; right: -40px; bottom: 0; margin: auto; width: 30px; height: 30px; background-image: url("../images/arrow04.png"); background-size: 18px; background-repeat: no-repeat; background-position: center;}
.news_area .news_box li a.non{ pointer-events: none;}
.news_area .news_box li a.non::after{ display: none;}
.news_area .news_box li a:hover{ transform: scale(1.02);}
.news_area .news_box li a .img{ width: 100%; max-width: 180px; aspect-ratio: 183 / 143; background-image: url("../images/schedule_item01.jpg"); background-size: 100%; padding: 10px 10px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; transition: .1s ease-in-out;}
.news_area .news_box li a .txt{ width: 100%; padding: 0 0 0 20px; box-sizing: border-box;}
.news_area .news_box li a .txt > div{ width: 100%; display: flex; justify-content: flex-start; align-items: center;}
.news_area .news_box li a .txt > div .date{ font-size: 16px; font-weight: bold; margin-right: 20px;}
.news_area .news_box li a .txt > div .cate{ font-size: 16px; font-weight: bold;}
.news_area .news_box li a .txt .ti{ font-size: 20px; font-weight: bold; position: relative; padding: 0 0 0 30px;}
.news_area .news_box li a .txt .ti::before{ content: ""; display: block; width: 20px; aspect-ratio: 1 / 1; background-color: var(--color__yellow); border: 2px solid var(--color__black); box-sizing: border-box; border-radius: 100px; position: absolute; top: 9px; left: 0; margin: auto;}
.news_area .wrap .news_menu_box{ display: flex; justify-content: flex-start; align-items: center; margin-top: 60px; padding: 0 40px; box-sizing: border-box;}
.news_area .wrap .btn_area{ width: 100%; max-width: 275px; margin: 0 20px 0 0;}
.news_area .wrap ul{ width: 100%; list-style: none; display: flex; justify-content: flex-start; align-items: center; gap: 0 10px;}
.news_area .wrap ul li{ width: 100%; max-width: 130px;}
.news_area .wrap ul li a{ width: 100%; display: block; text-align: center; font-size: 16px; font-weight: bold; color: var(--color__black); background-color: var(--color__yellow); padding: 15px 10px; box-sizing: border-box; border-radius: 20px; border: 2px solid var(--color__black);}
.news_area .wrap ul li a:hover{ transform: scale(1.1); background-color: var(--color__black); color: var(--color__yellow);}


/* footer */
footer{ width: 100%; position: relative; z-index: 1;}
footer .bnr_slide{ width: 100%; margin-top: 40px;}
footer .bnr_slide .bnr_slider{ width: 100%; max-width: 1680px; margin: auto; display: flex; flex-direction: column; overflow: hidden;}
footer .bnr_slide .bnr_slider .slick-list{ order: 3; margin: 20px 0; overflow: initial;}
footer .bnr_slide .bnr_slider .slick-num{ order: 1; padding: 0 20px; box-sizing: border-box; font-size: 40px; font-weight: bold; text-align: right;}
footer .bnr_slide .bnr_slider .slider-item{ margin: 0 20px; border: 1px solid var(--color__gray); box-sizing: border-box; transition: .3s ease-in-out;}
footer .bnr_slide .bnr_slider .slider-item:hover{ transform: scale(1.05);}
footer .bnr_slide .bnr_slider .dots-wrap{ display: flex; justify-content: flex-end; align-items: center; padding: 0 20px; box-sizing: border-box; order: 2;}
footer .bnr_slide .bnr_slider .dots-wrap li{ width: 15px; height: 15px; margin: 0 5px; background: var(--color__gray); border-radius: 50%; cursor: pointer; list-style: none;}
footer .bnr_slide .bnr_slider .dots-wrap li:last-child{ margin: 0;}
footer .bnr_slide .bnr_slider .dots-wrap li:hover,
footer .bnr_slide .bnr_slider .dots-wrap li.slick-active{ background: var(--color__black);}
footer .bnr_slide .bnr_slider .dots-wrap li button{ display: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; padding: 0; border: none; background-color: transparent;}

footer .bnrContent_slide{ width: 100%;}
footer .bnrContent_slide .wrap{ width: 100%; max-width: 1680px; padding: 20px 20px 0; box-sizing: border-box; gap: 0 40px; margin: auto; display: flex; justify-content: space-between; align-items: center;}
footer .bnrContent_slide a{ width: calc(100% / 2); aspect-ratio: 811 / 243; border: 3px solid var(--color__black); box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center; position: relative;}
footer .bnrContent_slide a::after{ content: ""; position: absolute; top: -3px; left: -3px; width: calc(100% + 6px); height: calc(100% + 6px); border: 3px solid var(--color__black); box-sizing: border-box; border-radius: 40px; opacity: 0; transition: .2s ease-in-out;}
footer .bnrContent_slide a:hover::after{ opacity: 1;}
footer .bnrContent_slide a p{ font-size: 40px; font-weight: bold; display: block; width: 100%; padding: 0 40px; box-sizing: border-box; position: relative;}
footer .bnrContent_slide a.bnr_recruit{ background-image: url("../images/bnr_recruit.jpg"); background-size: cover;}
footer .bnrContent_slide a.bnr_recruit p::after{ content: ""; position: absolute; top: 0; right: 40px; bottom: 0; margin: auto; width: 30px; height: 30px; background-image: url("../images/arrow05.png"); background-size: 18px; background-repeat: no-repeat; background-position: center;}
footer .bnrContent_slide a.bnr_contact{ background-image: url("../images/bnr_contact.jpg"); background-size: cover;}
footer .bnrContent_slide a.bnr_contact p::after{ content: ""; position: absolute; top: 0; right: 40px; bottom: 0; margin: auto; width: 30px; height: 30px; background-image: url("../images/arrow06.png"); background-size: 18px; background-repeat: no-repeat; background-position: center;}
footer .footer_nav{ width: 100%; padding: 40px 40px; box-sizing: border-box; display: flex; justify-content: space-between; align-items: stretch; padding-top: 60px;}
footer .footer_nav .left{ width: 100%; max-width: calc(100% - 96px);}
footer .footer_nav .left .logo{ width: 100%;}
footer .footer_nav .left .logo img{ max-width: 569px;}
footer .footer_nav .left ul{ width: 100%; max-width: 1080px; display: flex; justify-content: space-between; align-items: center; flex-wrap : wrap; margin: 40px 0 0;}
footer .footer_nav .left ul::before{ width: calc(100% / 4); content:""; display: block; order:1;}
footer .footer_nav .left ul::after{ width: calc(100% / 4); content:""; display: block;}
footer .footer_nav .left ul li{ width: calc(100% / 4); list-style: none; margin: 20px 0 0;}
footer .footer_nav .left ul li a{ font-size: 40px; font-weight: bold; display: inline-block;}
footer .footer_nav .left ul li a:hover{ transform: scale(1.1);}
footer .footer_nav .left .txt{ margin: 80px 0 0;}
footer .footer_nav .left .txt p{ font-size: 18px;}
footer .footer_nav .right{ width: 100%; max-width: 96px; background-color: var(--color__white); padding: 20px; border: 3px solid var(--color__black); box-sizing: border-box; border-radius: 10px; display: flex; flex-direction: column;}
footer .footer_nav .right p{ display: flex; justify-content: center; align-items: center; width: 100%; padding: 20px 0 40px; box-sizing: border-box; border-bottom: 3px solid var(--color__black);}
footer .footer_nav .right p a{ writing-mode: vertical-rl; font-size: 16px; font-weight: bold; transform: scale(1);}
footer .footer_nav .right p a:hover{ transform: scale(1.1);}
footer .footer_nav .right ul{ list-style: none; margin-top: auto;}
footer .footer_nav .right ul li{ display: flex; align-items: flex-end; flex-direction: column;}
footer .footer_nav .right ul li:nth-child(2){ margin-top: 10px;}
footer .footer_nav .right ul li a:hover{ transform: scale(1.1);}
@media screen and (max-width: 1150px) {
	footer .bnr_slide .bnr_slider{ max-width: 100%;}
	footer .bnr_slide .bnr_slider .slick-num{ font-size: 20px;}
	footer .bnrContent_slide{ width: 100%;}
	footer .bnrContent_slide .wrap{ width: 100%; max-width: 100%; padding: 0 20px 0; box-sizing: border-box; display: block;}
	footer .bnrContent_slide a{ width: 100%;}
	footer .bnrContent_slide a:nth-child(2){ margin-top: 10px;}
	footer .bnrContent_slide a p{ font-size: 20px; padding: 0 20px;}
	footer .bnrContent_slide a.bnr_recruit p::after,
	footer .bnrContent_slide a.bnr_contact p::after{ right: 20px;}
	
	footer .footer_nav{ width: 100%; padding: 40px 20px; display: block;}
	footer .footer_nav .left{ width: 100%; max-width: 100%;}
	footer .footer_nav .left .logo{ }
	footer .footer_nav .left .logo img{ max-width: 240px;}
	footer .footer_nav .left ul{ width: 100%; max-width: 580px; margin: 0 0 0;}
	footer .footer_nav .left ul::before{ width: calc(100% / 3);}
	footer .footer_nav .left ul::after{ width: calc(100% / 3);}
	footer .footer_nav .left ul li{ width: calc(100% / 3); margin: 10px 0 0;}
	footer .footer_nav .left ul li a{ font-size: 18px;}
	footer .footer_nav .left .txt{ margin: 10px 0 0;}
	footer .footer_nav .left .txt p{ font-size: 12px;}
	footer .footer_nav .right{ width: 100%; max-width: 100%; margin-top: 20px; padding: 10px; border: 2px solid var(--color__black); display: flex; justify-content: space-between; align-items: center; flex-direction: inherit;}
	footer .footer_nav .right p{ width: calc(100% - 90px); display: block; padding: 0; border-bottom: 0px none; text-align: center;}
	footer .footer_nav .right p a{ writing-mode: horizontal-tb; font-size: 14px;}
	footer .footer_nav .right ul{ display: flex; justify-content: space-between; align-items: center; flex-direction: inherit;}
	footer .footer_nav .right ul li{ width: 40px;}
	footer .footer_nav .right ul li:nth-child(2){ margin: 0 0 0 10px;}
}