@charset "UTF-8";

/*=========================================================================================================
TOP
=========================================================================================================*/

/*【 TOP ALL SETTING 】_■■■■■■■■■■■■■■■■■■■■■■■■■*/
#TOP{
	margin: 2%;
}
#RNW{
	width: 90%;
	
	padding: 5vw;
	margin: 0 auto;
	text-align: center;
	
	font-size: clamp(1.563rem, -0.104rem + 8.33vw, 5.625rem);
	
	color: red;
	box-sizing: border-box;
	
	border: double 20px red;
	background: rgba(255,255,255,0.3);
	backdrop-filter: blur(6px);
}
/*■■■■■■■■■■■■■■■■■■■■■■_【 TOP ALL SETTING / END 】*/


/*【 TOP COPY AREA SETTING 】_■■■■■■■■■■■■■■■■■■■■■■*/
/*.【 MAIN COPY SETTING 】=====================================■*/
#TOP_copy{
	width: 100%;
	
	max-width: 1200px;
	min-width: 760px;
	
	padding: 10vw 5vw;
	
	color: #FFFFFF;
	font-size: clamp(1.75rem, -1.063rem + 4.09vw, 2.875rem);
	line-height: clamp(4.125rem, 0.375rem + 5.45vw, 5.625rem);
	font-weight: 700;
	
	box-sizing: border-box;
	
	text-shadow: 0 0 2px #5D3819, 3px 3px 3px #5D3819;
	/*【 VALUES 】min:  28px & max:  46px */
	/*【 VALUES 】min:  66px & max:  90px 	＜line-height＞ */  
	/*【VIEWPORT】min:1100px & max:1540px 〈min:1100 / max:1200+340〉*/
}
#TOP_copy span{
	font-size: clamp(1.188rem, -1.313rem + 3.64vw, 2.188rem);
	/*【 VALUES 】min: 19px & max:  35px */
	/*【 VALUES 】min: 30px & max:  40px 	＜line-height＞ */  
	/*【VIEWPORT】min:1100px & max:1540px 〈max:1200+340〉*/
}
.br{
	display: block;
}
/*. ==============================【 MAIN COPY SETTING / END 】■*/

/*.【 STUDY COPY SETTING 】====================================■*/
#TOP_study{
	padding: 5vw;
	font-size: clamp(1.25rem, 0.781rem + 0.68vw, 1.438rem);
	
	color: #FFFFFF;
	text-shadow: 0 0 2px #5D3819, 0px 0px 3px #5D3819;
}
/*. =============================【 STUDY COPY SETTING / END 】■*/
/*■■■■■■■■■■■■■■■■■■■_【 TOP COPY AREA SETTING / END 】*/


/*【 TOP INFOMATION AREA SETTING 】_■■■■■■■■■■■■■■■■■■■*/
#INF{
	width: 90%;
	margin: 5vw auto;
	padding: 3vw;
	border-radius: 15px;
	box-sizing: border-box;
	backdrop-filter: blur(5px) sepia(0.4);
	}
#INF > div{
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	
	}
#INF > div:first-child::before{
	content: "新着情報";
	width: 100%;
	margin: 0 0 2vw 0;
	padding: 0 0 15px 0;
	font-size: clamp(1.875rem, -1.25rem + 4.55vw, 3.125rem);
	color: #6B2723;
	font-weight: 700;
	letter-spacing: 2px;
	text-align: center;
	display: block;
	border-bottom: dashed 5px /*#6B2723*/#FFFFFF;
	/*
	background: red;*/
	text-shadow: 0 0 10px #FFFFFF,0 0 10px #FFFFFF,0 0 10px #FFFFFF;
	-webkit-text-stroke: 5px #FFFFFF;
	paint-order: stroke;
	}

/*.【 LIST BOTTON SETTING 】===================================■*/
#INF > div:nth-child(2){
	padding: 70px 0 30px 0;
	}
#INF > div:nth-child(2) a{
	width: 100%;
	display: block;
	text-align: center;
	text-decoration: none;
	}
#INF > div:nth-child(2) a::before{
	content: "お知らせ一覧 ＞";
	padding: 10px 50px;
	font-size: 25px;
	letter-spacing: 2px;
	line-height: 35px;
	color: #FFFFFF;
	font-weight: 500;
	
	text-shadow: 0 0 5px #6E2723, 0 0 5px #6E2723, 0 0 5px #6E2723;
	border-radius: 50px;
	border: solid 3px #6E2723;
	
	background: rgba(255,235,230,0.8);
	transition: all 500ms;
	}

/*..《《 LIST BOTTON【 HOVER 】SETTING 》》____________________●*/
@media screen and (min-width: 1101px) {
	#INF > div:nth-child(2) a:hover::before{
		font-size: 30px;
		transition: all 500ms;
	}
}
/*______________《《 LIST BOTTON【 HOVER 】SETTING / END 》》..●*/
/*. ============================【 LIST BOTTON SETTING / END 】■*/

/*.【 ＜ INF ＞ SETTING 】=====================================■*/
.INF_up{
	width: calc(97% / 3); 
	min-height: 150px;
	padding: 20px;
	text-align: center;
	border: solid 2px #666666;
	box-sizing: border-box;
	background: rgba(255,255,255,0.8);
	}
.INF_up:nth-child( n + 4 ){
	display: none;
}
.INF_up > div:nth-child(1){
	line-height: 30px;	
	}
.INF_up > div:nth-child(2){
	padding: 0 0 15px 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 20px;
	box-sizing: border-box;
	border-bottom: dotted 2px #666666;
	}
.INF_up > div:nth-child(3){
	padding: 15px 0 0 0;
	}
.INF_up > div:nth-child(3) a{
	color: #E9545D;
	}
.INF_up > div:nth-child(3) span{
	display: block;
	padding: 5px 0 0 0;
	font-size: 14px;
	}
.INF_up > div:nth-child(3) span::before{
	content: "PDF";
	margin: 0 5px 0 0;
	padding: 0 5px;
	color: #FFFFFF;
	background: #E9545D;
	}
.INF_up > div:nth-child(3) span::after{
	content: "KB";	
	}
/*. ==============================【 ＜ INF ＞ SETTING / END 】■*/
/*■■■■■■■■■■■■■■■■_【 TOP INFOMATION AREA SETTING / END 】*/

/*=========================================================================================================
UNIFORM / END
=========================================================================================================*/