@charset "utf-8";
.admission-guide .information{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	padding-left : 40px;
	margin-bottom : 100px;
}
.admission-guide .information p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : justify;
	font-size : 20px;
	font-weight : 500;

}
.admission-guide-container{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	margin-bottom : 80px;
}
.admission-guide-container h4{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : justify;
	color : #992200;
	font-size : 25px;
	margin-bottom : 30px;
	padding-left : 1.5em;
	line-height : 1.2;
}
.admission-guide-container h4::before{
	content : "◼︎";
	position : absolute;
	display : block;
	line-height : 1;
	color : #992200;
	font-size : 30px;
	left : 0;
}
.admission-guide-container h4 span{
	color : var(--font-color);
	font-size : 16px;
}
.admission-guide-container > p{
	font-size : 20px;
	font-weight : 500;
	padding-left : 40px;
}








.flow{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	padding : 0 40px;
}
.flow .flow-box{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	margin-top : 10px;
}
.flow .flow-box:first-child(1){
	margin-top : 0;
}
.flow .flow-box .inner{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	padding : 40px 50px 40px 140px;
}
.flow .flow-box:nth-child(1){
	background-color : #FEF0D8;
}
.flow .flow-box:nth-child(2){
	background-color : #FEE4B7;
}
.flow .flow-box:nth-child(3){
	background-color : #FFD691;
}
.flow .flow-box:nth-child(4){
	background-color : #FFC765;
}
.flow .flow-box:nth-child(5){
	background-color : #FFB32E;
	margin-bottom : 0;
}
.flow-box:nth-of-type(1){
	z-index : 10;
}

.flow-box:nth-of-type(2){
	z-index : 9;
}

.flow-box:nth-of-type(3){
	z-index : 8;
}

.flow-box:nth-of-type(4){
	z-index : 7;
}

.flow-box:nth-of-type(5){
	z-index : 6;
}
.flow .flow-box .inner h5{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	color : #992200;
	font-size : 30px;
	font-weight : 600;
	margin-bottom : 30px;
}
.flow .flow-box .inner p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : justify;
	font-size : 18px;
}
.guide01-button,
.guide02-button{
	margin : 30px 0 0 auto;
}
.flow .flow-box .inner ul{
	position : relative;
	display : block;
	width : fit-content;
	height : auto;
	border-radius : 15px;
	border : 1px solid #992200;
	padding : 10px 20px;
	margin-top : 30px;
}
.flow .flow-box .inner ul li{
	position : relative;
	display : list-item;
	width : 100%;
	height : auto;
	padding-left : 1em;
	line-height : 1;
	font-size : 16px;
	margin-bottom : 10px;
}
.flow .flow-box .inner .list{
	position : relative;
}
.flow .flow-box .inner ul li:last-child{
	margin-bottom : 0;
}
.flow .flow-box .inner ul li::before{
	content : "◼︎";
	position : absolute;
	display : block;
	left : 0;
	line-height : 1;
	color : #992200;
}
.flow .flow-box:nth-of-type(3) .inner figure{
	position : absolute;
	display : block;
	width : 670px;
	height : auto;
	top : 0;
	right : -65px;
	bottom : 0;
	left : auto;
	margin : auto auto;
}
.flow .flow-box:nth-of-type(3) .inner figure img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.flow p.end {
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	border-radius : 50px;
	background-color : #F25700;
	line-height : 1;
	text-align : center;
	color : #FFF;
	font-size : 30px;
	font-weight : 600;
	padding : 20px 0;
	margin-top : 13px;
}
.admission-guide .information p.small{
	font-size : 16px;
	font-weight : normal;
}



/***** step *****/
.step-box{
	position : absolute;
	top : 0;
	bottom : 0;
	left : 30px;
	margin : auto auto;
	width : 80px;
	height: calc(100% - 35px);
	background-color : #992200;
	color : #FFF;
	display : flex;
	flex-direction : column;
	align-items : center;
	padding-top : 10px;
}
.step-box::before{
	content : "";
	position : absolute;
	top : -22px;
	left : 0;
	width : 100%;
	height : 30px;
	background-color : #992200;
	clip-path : polygon(0 0, 50% 20px, 100% 0, 100% 100%, 0 100%);	z-index : 1;
}
.flow-box:nth-of-type(1) .step-box{
	
}
.flow-box:nth-of-type(1) .step-box::before{
	top : -5px;
	clip-path: none;
}
.step-box::after{
	content : "";
	position : absolute;
	bottom : -36px;
	left : 0;
	width : 100%;
	height : 37px;
	background-color : #992200;
	clip-path : polygon(0 0, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px));
}

.step-box p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	line-height : 1;
	text-align : center;
	font-size : 30px;
	font-weight : bold;
	z-index : 1;
}
.step-box span{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	font-size : 16px;
}




/* # =================================================================
#### responsive
# ================================================================= */
/* # =================================================================
#### 1600px
# ================================================================= */
@media screen and (max-width: 1600px){
.flow .flow-box .inner .list{
	position : relative;
	display : grid;
	grid-template-columns : 350px 1fr;
	gap : 15px;
	margin-top : 30px;
}
.flow .flow-box .inner ul{
	margin-top : 0;
}
.flow .flow-box:nth-of-type(3) .inner figure{
	position : relative;
	width : auto;
	right : 0;
}
}/*** 1600px ***/
/* # =================================================================
#### 1400px
# ================================================================= */
@media screen and (max-width: 1400px){
.flow .flow-box .inner .list{
	display : block;
}
.flow .flow-box .inner ul{
	background-color : #FFF;
	padding-bottom : 60px;
}
.flow .flow-box:nth-of-type(3) .inner figure{
	width : 450px;
	margin-top : -40px;
}

.admission-guide .information p{
	font-size : 18px;
}
.flow .flow-box .inner h5{
	font-size : 24px;
}
.flow p.end{
	font-size : 24px;
}
.admission-guide-container h4{
	font-size : 22px;
}
.admission-guide-container > p{
	font-size : 18px;
}

}/*** 1400px ***/
/* # =================================================================
#### 1240px
# ================================================================= */
@media screen and (max-width: 1240px){

}/*** 1240px ***/
/* # =================================================================
#### 1024px
# ================================================================= */
@media screen and (max-width: 1024px){

}/*** 1024px ***/
/* # =================================================================
#### 896px
# ================================================================= */
@media screen and (max-width: 896px){
.flow{
	padding : 0;
}
.step-box{
	width : 70px;
	left : 10px;
}
.step-box p{
	font-size : 24px;
}
.step-box span{
	font-size : 14px;
}
.flow .flow-box .inner{
	padding : 30px 20px 30px 100px;
}


.flow .flow-box .inner h5{
	font-size : 24px;
	margin-bottom : 20px;
}
.flow .flow-box .inner p{
	font-size : 16px;
}
.flow .flow-box:nth-of-type(3) .inner figure{
	width : 300px;
}
.flow p.end{
	font-size : 22px;
}
/* # =================================================================
#### page-content01
# ================================================================= */
.page-content01 .admission-guide-container:last-of-type{
	margin-bottom : 0;
}
/* # =================================================================
#### page-content02
# ================================================================= */
.admission-guide .page-content02 .wrap{
	padding-bottom : 50px;
}
.admission-guide  .page-content02 .information{
	margin-bottom : 50px;
}





}/*** 896px ***/
/* # =================================================================
#### 600px
# ================================================================= */
@media screen and (max-width: 600px){
.admission-guide .information{
	padding-left : 0;
}
.admission-guide-container > p{
	font-size : 16px;
	padding-left : 0;
}



.admission-guide .information p{
	font-size : 18px;
}
.admission-guide-container h4{
	font-size : 20px;
}
.admission-guide-container h4 span{
	display : block;
	font-size : 14px;
	margin-top : 5px;
}
.flow .flow-box .inner h5{
	font-size : 20px;
}
.flow .flow-box:nth-of-type(3) .inner figure{
	width : 80%;
	margin : -30px 0 0 auto;
}
.flow .flow-box .inner .guide01-button,
.flow .flow-box .inner .guide02-button{
	width : 250px;
	margin : 30px auto 0;;
}
.admission-guide .information .image-button.guide03-button{
	margin : 30px auto;
}
.image-button.guide01-button a::after,
.image-button.guide02-button a::after{
	right : 15px;
}

.step-box{
	width : 50px;
	height : auto;
	top : 10px;
	bottom : auto;
	padding : 10px 0;
}
.step-box::before,
.step-box::after{
	content : none;
}
.flow .flow-box .inner{
	padding : 10px 15px 10px 70px;
}



}/*** 600px ***/
/* # =================================================================
#### 480px
# ================================================================= */
@media screen and (max-width: 480px){
.admission-guide .information .image-button.guide03-button{
	width : 250px;
	height : 40px;
	margin : 30px auto;
}
.admission-guide .information .image-button.guide03-button a::after{
	font-size : 20px;
	right : 11px;
}
}/*** 480px ***/
/* # =================================================================
#### 320px
# ================================================================= */
@media screen and (max-width: 320px){

}/*** 320px ***/