@charset "utf-8";

/*html {
    font-size: 0.6666666666666667vw;
}*/

@media screen and (max-width: 1360px) {

	.sanasta_h3_box {margin: -5.8vw auto 0;}
	.sanasta_h3_box h3{font-size:3.5vw;}

}


@media screen and (max-width: 1200px) {

/* ---------------------------------------------------------
■ 準備中
--------------------------------------------------------- */
	.preparation_mv{
		padding:0;
		height:auto;
		aspect-ratio:16 / 9;
		font-size:8.5vw;
	}
	

}

@media screen and (max-width: 1100px) {
/* ---------------------------------------------------------
■ トップへ戻るボタン
--------------------------------------------------------- */
	#page-top {height:auto;}
	#page-top img{width:80%;}
	.head-items li{font-size:90%;}

	
/* ---------------------------------------------------------
■ 学年選択
--------------------------------------------------------- */
	.select_list ul li a{font-size: 27px;}
	
	
/* ---------------------------------------------------------
■ メインコンテンツ
--------------------------------------------------------- */
	.course_textbox{width:100%;}
	
	.course_wrap{margin: 0 auto;max-width:800px;}
	.course_wrap.rtl{margin: 0 auto;}
	
	.course_flex{padding: 40px 0 0;}
	.rtl .course_flex{padding: 40px 0 0;}
		
	.course_main{padding: 30px 50px;}
	.rtl .course_main{padding: 30px 50px;}
	
	.course_imgbox{width:100%;}
	
	.course_frame.top {width: 50%;}
	.course_frame.bottom {width: 55%;}
	
	.sanasta_box_deco.bottom {bottom: -2%;width: 16%;}
		
}


@media screen and (max-width: 850px) {
	header {
		width: 100%;
		height: auto;
		margin: 0 auto;
		text-align: center;
		background-color: #002b69;
		overflow: hidden;
		padding: 8px;
	}

	header img {width: 180px;}
	.head-02.open {transform: translateX(0px);}
	.head-wrap {height: 35px;padding-top: 0;}
	.head-nav .head-logo {width: 150px;}
	
	.header_btn{margin:0 40px 0 auto;}
	.header_btn a{padding: 1px 10px;}
}

@media screen and (max-width: 767px) {
	
	
	
/* ---------------------------------------------------------
■ 準備中
--------------------------------------------------------- */
	.preparation_mv{
		aspect-ratio:16 / 12;
	}
	
/* ---------------------------------------------------------
■ 学年選択
--------------------------------------------------------- */
	.select_list ul{gap:13px;}
	.select_list ul li{width: calc((100% - 13px) / 2);}
	.select_list ul li a{font-size: 22px;padding:13px 0;border-radius:8px;}
	.select_list ul li a::after{
		width:15px;height:12px;
		left:auto;bottom:auto;
		right:15px;top:50%;
		transform:translateY(-50%);
	}
	
/* ---------------------------------------------------------
■ メインコンテンツ
--------------------------------------------------------- */
	
	.course_wrap{margin: 0 -80px 0 auto;padding: 50px 0;}
	.course_wrap.rtl{margin: 0 auto 0 -80px;}
	
	.course_flex{padding:30px 50px 0 0;}
	.rtl .course_flex{padding: 30px 0 0 50px;}
	
	.course_main h3{line-height:1.2em;padding-bottom:8px;}
	.course_text p {font-size: 16px;}
	
	.course_linkbox{gap:15px;}
	.course_linkbox a{width:80%;font-size: 24px;padding:6px;}
	
	
/* ---------------------------------------------------------
■ サナスタ
--------------------------------------------------------- */
	.sanasta_wrap{padding:40px 0;}
	.sanasta_h3_box {margin: 0 auto 0;}
	.sanasta_h3_box h3 {font-size:5vw;}
	.sanasta_box_deco.top,.sanasta_box_deco.bottom{display:none;}
	
/* ---------------------------------------------------------
■ バナーエリア
--------------------------------------------------------- */
	.bunner_h2 h2::before {left: -35px;}
	
/* ---------------------------------------------------------
■ トップへ戻るボタン
--------------------------------------------------------- */
	#page-top {
		display: none;
	}

/* ---------------------------------------------------------
■ フッター
--------------------------------------------------------- */
	footer {
	}
	
/* ---------------------------------------------------------
■ button
--------------------------------------------------------- */
	.fixed_btn_list a{font-size: 16px;}
	.fixed_btn_list a svg{width:26px;}
	.fixed_btn_list a.hope_data svg{width:22px;}
	
}


@media screen and (max-width:580px) {

/* ---------------------------------------------------------
■ 準備中
--------------------------------------------------------- */
	.preparation_mv{font-size:12.5vw;}
	.preparation_text {font-size:20px;}
	
	.course_main h3{font-size: 26px;}
	
	.course_link_note{font-size:3.5vw;margin-top:-8px;}
	
}

@media screen and (max-width:520px) {
	
	.header_btn a{padding:0;background-color:rgba(255,255,255,0);border:none;max-width:105px;}
	.header_btn a img{width:100%}
	.header_btn a svg {display:none;}
	.header_btn a span {display:none;}
	.header_btn a span.header_btn-img{display:inline;}
	
/* ---------------------------------------------------------
■ 学年選択
--------------------------------------------------------- */
	.select_box{padding: 35px 20px 20px;}
	
	.course_flex{padding:23px 50px 0 0;}
	.rtl .course_flex{padding: 23px 0 0 50px;}
	
	.select_text{line-height:1.2em;}
	
	.select_list ul li{width:100%;}
	.select_list ul li a {
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		gap:5px;
        font-size: 18px;
		letter-spacing:0.05em;
        padding: 4px 15px;
        border-radius: 8px;
		text-shadow: 1px 1px 3px rgba(25, 50, 89, .25);
    }
	.select_list ul li a::after {width: 13px;height: 10px;}
	.select_list ul li a span{width:auto;margin:auto 0;}
	.select_list ul li a span.min{padding-top:.2em;}
	
	.select_list ul li a svg{margin: 3px 0 0 auto;width:30px;}
	
	
/* ---------------------------------------------------------
■ メインコンテンツ
--------------------------------------------------------- */
	.course_box{padding:45px 25px 0;}
	
	.course_wrap{padding: 30px 0;}
	
	.course_frame.top {width:70%;}
	
	.course_h2box span{top:5px;left:5px;}
	.rtl .course_h2box span{right:5px;}
	
	.course_textbox h2{padding: 13px 30px;}
	
	.course_main{padding:25px 7vw;}
	.rtl .course_main{padding:25px 7vw;}
	
	.course_main h3{font-size:5.2vw;}
	
	.course_text p{font-size:15px;}
	
	.course_linkbox{padding:8vw 20px;}
	.course_linkbox a{width:100%;font-size:20px;}
	.course_linkbox a.gray{font-size:18px;}
	
	.course_linkbox a::before, .course_linkbox a::after {height: 38%;aspect-ratio: 3 / 2;}
	.course_linkbox a::before{left:0;}
	.course_linkbox a::after{right:0;}
	
	
	.sanasta_wrap{padding:5vw 0 0;}
	.sanasta_wrap .course_linkbox{padding: 5vw 20px 8vw;}
	
/*-------------*/
	
	.bunner_box {padding: 35px 20px 60px;}
	.bunner_h2 {padding:3vw 0 4vw;}
	.bunner_h2 h2{font-size:6vw;}
	.bunner_h2 h2::before, .bunner_h2 h2::after {width: 9vw;}
	
	
	.footlogo {max-width: 220px;}
	
	
	.fixed_box {padding: 15px 15px;}
	.fixed_btn_list {gap: 10px;}
	.fixed_btn_list a {width:calc((100% - 10px)/ 2);}
	.fixed_btn_list a svg {width: 22px;}
	.fixed_btn_list a.hope_data svg {width:18px;}
	
}


@media screen and (max-width:370px) {
	
	.header_btn {margin: 0 35px 0 auto;}
	.header_btn a{max-width:80px;}
	
	.preparation_text {font-size:18px;}
	
	.select_list ul li a {padding: 4px 6px;}
	.select_list ul li a svg{margin: 8px 0 0 auto;width:20px;}
	
	.fixed_btn_list a {gap:1px;}
	.fixed_btn_list a span{display: block;width:100%;text-align:center;}
}