@charset "UTF-8";
/* CSS Document */

/* ============================
		reset
 ============================ */
 
 

/* ============================
		pageMenu
 ============================ */

#pageMenu {
margin: 0 0 3em 0;
padding: 0;
}

/* pageLinkMenuList */

.pageLinkMenuList {
list-style: none;
margin: 0;
padding: 0;
display: flex;
position: relative;
left: -10px;
width: calc(100% + 20px);
}

.pageLinkMenuList > li {
width: calc(25% - 4px);
box-sizing: border-box;
padding: 0 5px;
}

.pageLinkMenuList > li:first-child {
width: calc(25% + 12px);
}

.pageLinkMenuList > li > a {
background-color: #000077;
color: #fff;
line-height: 1.1em;
box-sizing: border-box;
padding: 0 10px 0 3px;
display: grid;
place-items: center;
height: 80px;
text-align: center;
border-radius: 10px;
background-image: url("../images/mark_white_arrow001.svg");
background-repeat: no-repeat;
background-position: center right 5px;
}

.pageLinkMenuList > li:first-child > a {
font-size: 1.3rem;
padding: 0 18px 0 3px;
text-align: left;
letter-spacing: -0.05em
}

.pageLinkMenuList > li > a:hover {
text-decoration: none;
opacity: 0.8;
}

.spDisplayOn {
display: none;
}


@media screen and (max-width: 543px) {
	.spDisplayNone {
	display: none;
	}
	.spDisplayOn {
	display: inline;
	}
}

@media screen and (max-width: 767px) and (min-width: 544px){
	.spDisplayNone {
	display: none;
	}
}

@media screen and (min-width: 768px) {




	.pageLinkMenuList > li:first-child > a {
	font-size: 1.4rem;
	padding: 0 10px 0 3px;
	letter-spacing: 0;
	text-align: center;
	}

}



/* ============================
		other
 ============================ */


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

@media screen and (max-width: 767px) and (min-width: 544px){
}

@media screen and (max-width: 991px) and (min-width: 768px){
}

@media screen and (min-width: 992px) {
}