@charset "utf-8";
#slide { max-width: 2400px; min-width: 1400px; margin: 0 auto;}
.slide_area { width: 100%; height: 700px; background: url("../img/top_img.jpg") no-repeat center bottom / cover; overflow: hidden;}
.slide_text { max-width: 1600px; min-width: 1400px; width: 100%; margin: -100px auto 0; padding: 0 5%; }
/*楽しく学ぶコンテンツ*/
#learning {}
.learn＿chara { text-align: right; margin-bottom: -70px; padding-right: 140px; }
.learn＿chara img { width: 159px; height: 183px;}
.learn_bgcolor { height: 200px; background: #E2F2EC; overflow: hidden;}
.learn_title { margin: 40px auto 0; font-size: 28px; font-weight: 700; color: #001661; height: 50px; background: url("../img/bg_line.png") no-repeat bottom; }
.learn＿link { margin: -75px auto 0;}
.learn＿link ul { display: flex; justify-content: space-between;}
.learn＿link li a:hover { opacity: 0.8;}
/*TOPICS*/
.topics_char img { margin: 50px 0 -170px -120px;}
.topics_area { display: flex; background-color: #F5F8FA; background-image: url( "../img/topics.png"); background-size: 400px 130px; background-repeat: no-repeat; background-position: bottom left; gap: 70px; padding: 50px 0; height: 300px; justify-content: center;}
.topics_title { width: 275px; margin-top: 20px;}
.oshirase { font-size: 28px; line-height: 120%; font-weight: 700; color: #001661; height: 50px; margin-bottom: 25px; background:  url("../img/bg_line.png") no-repeat left bottom;}
.btn_ichiran a { display: block; width: 235px; line-height: 45px; text-align: center; text-decoration: none; color: #fff; background-color: #001661; background-image: url("../img/btn_arrow_right.png"); background-size: 30px 30px; background-repeat: no-repeat; background-position: right 12px center; border-radius: 25px; margin: 0 auto 0; transition: background-color .5s;}
.btn_ichiran a:hover { background-color: #4D66AD;}
.topics_kiji_area { width: 590px; height: 280px; overflow: auto;}
.topics_kiji_area dl { display: flex; flex-wrap: wrap; border-bottom: solid 1px #ccc; padding-bottom: 15px; margin-bottom: 15px;}
/*.topics_kiji_area dl:last-child { padding-bottom: 0; margin-bottom: 0; border: none;}*/
.day { width: 100px; height: 25px; margin-right: 20px; padding: 3px 0 4px; text-align: center; font-size: 13px; color: #fff; background: #088F5E;}
.kiji { width: 440px; color: #002DAD; font-weight: 700;}
.kiji a { color: #002DAD; font-weight: 700; transition: color .5s; }
.kiji a:hover { color: #888;}
/*施設紹介ビデオ*/
#info_video { margin-top: 90px;}
.btn_video { width: 1100px;}
.btn_video img { width: 100%; height: auto;}
/*取り組み*/
#torikumi { margin: 90px auto 0; background: #E2F2EC; box-shadow: 0 0 0 100vmax #E2F2EC; clip-path: inset(0 -100vmax); padding-bottom: 40px}
.torikumi_area {}
.torikumi_title { padding: 40px 0; font-size: 28px; font-weight: 700; color: #001661; height: 50px; background: url("../img/bg_line.png") no-repeat left bottom;}
.torikumi_bnr {width: 1000px; margin: 30px auto 0;}
.torikumi_bnr a:hover{ opacity: 0.8;}
.torikumi_bnr img {width: 100%; height: auto;}
.book_calendar { display: flex; justify-content: space-between; width: 1000px; margin: 45px auto 0; }
.book_area { width: 480px; height: 215px; background: #F5F8FA;  padding: 20px; }
.calendar_area { width: 480px; height: 215px; background: #F5F8FA; padding: 20px;}
.book_title { font-size: 28px; font-weight: 700; color: #001661; height: 48px; background-image:url("../img/icon_book.png") , url("../img/bg_line.png"); background-repeat: no-repeat , no-repeat; background-position: left top 5px, left bottom; background-size: 32px 26px , 1100px ; padding: 5px 0 0 50px;}
.calendar_title { font-size: 28px; font-weight: 700; color: #001661; height: 48px; background-image:url("../img/icon_calendar.png") , url("../img/bg_line.png"); background-repeat: no-repeat , no-repeat; background-position: left top, left bottom; background-size: 32px 33px , 1100px ;  padding:7px 0 0 50px;}
.book_calendar_text { margin: 10px 0 0 0; font-weight: 500; color: #001661; line-height: 170%;}
.btn_book_calendar { margin-top: 18px;}
.btn_book_calendar a { display: block; width: 275px; line-height: 45px; text-align: center; text-decoration: none; color: #fff; background-color: #001661; background-image: url("../img/btn_link.png"); background-size: 30px 30px; background-repeat: no-repeat; background-position: right 10px center; border-radius: 25px; margin: 0 auto 0; transition: background-color .5s; }
.btn_book_calendar a:hover { background-color: #4D66AD;}
.apply_area { display: flex; justify-content: space-between; width: 1000px; margin: 30px auto 35px; padding: 35px 50px; border-radius: 20px; background: #fff;}
.apply_logo_area { width: 510px; margin-top: 10px}
.apply_title { line-height: 120%; font-size: 24px;}
.apply_logo { text-align: center; margin-top: 5px; }
.apply_text { color: #001661; font-weight: 500; margin-top: 30px; text-align: justify;}
.qr_area { width: 360px; }
.qr_dl { font-weight: 800;line-height: 28px; text-align: center;}
.qr_dl img { margin-right: 8px;}
.qr_os { display: flex; justify-content: space-between; text-align: center; margin-top: 10px; }
.qr_os dt {margin-bottom: 10px;}
.link_title { margin-top: 15px;}
.link_title a { display: block; width: 450px; line-height: 160%; padding: 20px 0; text-align: center; text-decoration: none; color: #fff; font-size: 18px; background-color: #001661; background-image: url("../img/btn_link.png"); background-size: 35px 35px; background-repeat: no-repeat; background-position: right 20px center; border-radius: 40px; margin: 0 auto 0; transition: background-color .5s; }
.link_title a:hover { background-color: #4D66AD;}
.link_text { text-align: center;  color: #001661; margin-top: 5px; font-weight: 500; }
/*下部リンク*/
#bottom_link { max-width: 2400px; min-width: 1400px; margin: 0 auto; height: 500px; background: url("../img/bg_btm_img.jpg") no-repeat center / cover; overflow: hidden;}
.shisetsu_box { width: 100%; max-width: 1600px; min-width: 1400px; margin: 30px auto 0;}
.shisetsu_area { display: flex; flex-wrap: wrap; width: 1000px; gap: 40px; margin: 0 auto;}
.shisetsu_a {}
.shisetsu_area dl { display: flex; justify-content: space-between; width: 480px; background: #fff; padding: 15px 20px;}

.icon01 { font-size: 24px; font-weight: 700; color: #001661; height: 45px; background-image:url("../img/icon_01.png") , url("../img/bg_line.png"); background-repeat: no-repeat , no-repeat; background-position: left top 5px, left bottom; background-size: 22px 29px , 1100px ; padding: 9px 0 0 40px;}
.icon02 { font-size: 24px; font-weight: 700; color: #001661; height: 45px; background-image:url("../img/icon_02.png") , url("../img/bg_line.png"); background-repeat: no-repeat , no-repeat; background-position: left top 5px, left bottom; background-size: 32px 25px , 1100px ; padding: 6px 0 0 40px;}
.icon03 { font-size: 24px; font-weight: 700; color: #001661; height: 45px; background-image:url("../img/icon_03.png") , url("../img/bg_line.png"); background-repeat: no-repeat , no-repeat; background-position: left top 5px, left bottom; background-size: 23px 30px , 1100px ; padding: 9px 0 0 40px;}
.icon04 { font-size: 24px; font-weight: 700; color: #001661; height: 45px; background-image:url("../img/icon_04.png") , url("../img/bg_line.png"); background-repeat: no-repeat , no-repeat; background-position: left top 5px, left bottom; background-size: 28px 28px , 1100px ; padding: 9px 0 0 40px;}

.shisetsu_area dl p { color: #001661; font-weight: 500; margin-top: 8px;}
.shisetsu_area dt { width: 240px; }
.shisetsu_area dd a { font-size: 13px; display: block; width: 190px; line-height: 45px; text-decoration: none; color: #fff; background-color: #001661; background-image: url("../img/btn_arrow_right.png"); background-size: 30px 30px; background-repeat: no-repeat; background-position: right 10px center; border-radius: 25px; margin: 0 auto 0; transition: background-color .5s; text-align: center; padding-right: 25px}

@media screen and (max-width: 768px) {
	#slide { max-width: none; min-width: auto; margin: 0;}
	.slide_area { width: 100%; height: 300px; background: url("../img/top_img.jpg") no-repeat center bottom / cover;}
	.slide_text { max-width: none; width: 100%; min-width: auto; margin: -11% 0 0 0; padding: 0 10% 0 5%; }
	.slide_text img { width: 100%; height: auto;}
	/*楽しく学ぶコンテンツ*/
	.learn＿chara { margin-bottom: -65px; padding-right: 30px; }
	.learn＿chara img { width: 110px; height: 99px;}
	.learn_bgcolor { height: 525px; padding: 0 5%;}
	.learn_title { width: 100%; margin: 40px auto 0; font-size: 22px; height: 40px; }
	.learn＿link { width: 100%; margin: -410px auto 0; padding: 0 3%;}
	.learn＿link ul { flex-direction: column; align-items: center; gap: 17px;}
	.learn＿link li { max-width: 350px;}
	.learn＿link img { width: 100%; height: auto;}
	/*TOPICS*/
	.topics_char img { position: relative; z-index: 2; width: 68px; height: 130px; margin: 50px 0 -75px 0;}
	.topics_area { flex-direction: column; background-size: 350px 114px; box-shadow: 0 0 0 100vmax #F5F8FA; clip-path: inset(0 -100vmax); gap: 60px; padding: 20px 0px 20px 0px; height: 500px; justify-content: flex-start;}
	.topics_title { width: 100%; margin-top: 0;}
	.oshirase { font-size: 22px; height: 40px; padding-left: 90px; margin-bottom: 0px;}
	.topics_kiji_area { width: 100%; height: 380px;}
	.kiji { width: 100%;  margin-top: 10px; }
	/*施設紹介ビデオ*/
	#info_video { margin-top: 60px;}
	.btn_video { max-width: 450px; width: 100%;}
	.btn_video img { width: 100%; height: auto;}
	/*取り組み*/
	#torikumi { margin: 90px auto 0; }
	.torikumi_area {}
	.torikumi_title { width: 100%; font-size: 22px; height: auto; line-height: 120%; padding-bottom: 10px;}
	.torikumi_bnr { width: 100%; max-width: 480px; margin: 15px auto 0;}
	.book_calendar { flex-direction: column; align-items: center; gap: 30px; width: 100%; margin: 30px 0 0; }
	.book_area { max-width: 480px; width: 100%; }
	.calendar_area { max-width: 480px; width: 100%;}
	.book_title { font-size: 22px; height: 45px; padding: 5px 0 0 50px;}
	.calendar_title { font-size: 22px; height: 45px; padding:7px 0 0 50px;}
	.apply_area { width: 480px; flex-direction: column; margin: 30px 0; padding: 30px 5%;}
	.apply_logo_area { max-width: 510px; width: 100%; }
	.apply_logo img { width: 100%; height: auto;}
	.qr_area { width: 100%; }
	.qr_dl { margin-top: 30px;}
	.qr_os { flex-direction: column; margin-top: 10px; }
	.qr_os img { width: 200px; height: auto;}
	.qr_apple { margin: 15px 0;}
	.link_title a { max-width: 450px; width: 100%; padding: 20px 50px; line-height: 140%; font-size: 16px; background-size: 30px 30px; background-position: right 15px center; }
	.link_title a span { display: inline-block;}
	/*下部リンク*/
	#bottom_link { max-width: none; min-width: auto; margin: 0; height: auto; padding: 0 5%;}
	.shisetsu_box { width: 100%; max-width: none; min-width: auto; margin: 30px 0;}
	.shisetsu_area { flex-direction: column; align-items: center; width: 100%; margin: 0;}
	.shisetsu_a { max-width: 480px;}
	.shisetsu_a img { width: 100%; height: auto; }
	.shisetsu_b { max-width: 480px; width: 100%;}
	.shisetsu_area dl { flex-direction: column; align-items: center; max-width: 480px; width: 100%; padding: 15px 20px;}
	.shisetsu_area dl h3 { font-size: 24px;}
	.shisetsu_area dt { max-width: 480px; width: 100%; }
	.shisetsu_area dd { margin-top: 20px;}
	.shisetsu_area dd a { width: 240px; padding-right: 0;}
	
}