/* CSS Document */


/*- menu -*

page_select

* filetop *
------------------------------------------------------------------------------------------------------------------------------------------*/

/*- File name [ index.css ] -*/

/*----------------------------------------------------------------------------------------------------------------------------------------*

* page_select

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
#page_select{
	padding-top: clamp(36px, 5vw, 64px);
}

#page_select .lists{
	display: grid;
	gap: clamp(16px, 2.5vw, 32px);
}

#page_select .lists a{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(6px, 0.9375vw, 12px);
	border-radius: clamp(8px, 1.25vw, 16px);
	border: 2px solid #00a73c;
	background-color: #00a73c;
	font-weight: 500;
	font-size: clamp(1.6rem, 2.5vw, 3.2rem);
	color: #FFFFFF;
	height: clamp(80px, 7.8125vw, 100px);
	position: relative;
}

#page_select .lists a::after{
	content: "";
	display: block;
	background-color: #FFFFFF;
	aspect-ratio: 1 / 1.125;
	width: clamp(10px, 1.25vw, 16px);
	clip-path: polygon(0 0, 100% 50%, 0 100%, 0 0);
	transform: translateY(-50%);
	position: absolute;
	right: clamp(16px, 2.96875vw, 38px);
	top: 50%;
}

#page_select .lists a span{
	font-size: clamp(2.4rem, 3.125vw, 4rem);
	font-weight: 500;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	#page_select .lists{
		padding-inline: clamp(32px, 5vw, 64px);
	}
	
	#page_select .lists a:hover{
		background-color: #FFFFFF;
		color: #00a73c;
	}
	
	#page_select .lists a:hover::after{
		background-color: #00a73c;
	}
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* Add Sample Code

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}