@charset "utf-8";

.titlewrap {
	background-color:var(--color_sub);
	.page_ttl {
		width:calc(100% - 60px);
		max-width:1140px;
		margin:0 auto;
		height:100px;
		display:grid;
		align-items:center;
	}
    h1 {
		font-size:3.6rem;
		color:var(--color_white);
		letter-spacing:.05em;
		font-weight:500;
    }
}
.nav {
    .aioseo-breadcrumbs{
		width:calc(100% - 60px);
		max-width:1140px;
		margin:0 auto;
		font-size:1.4rem;
		padding:1em 0;
		text-align:right;
		color:var(--color_white);
		.aioseo-breadcrumb-separator {
			margin:0 .33em;
		}
		a,span {
			color:var(--color_white);
		}
    }
}

section {
	&:has( + #contact) {
		.wrap {
			padding-bottom:120px;
		}
	}
	.wrap {
		padding-top:90px;
		.contents {
			h2 {
				font-size:4.0rem;
				color:var(--color_white);
				line-height:1.5;
				display:grid;
				justify-items:start;
				grid-row-gap:.1em;
				margin-bottom:1em;
				font-weight: 500;
				.font_en {
					font-family:inherit;
					font-size:2.0rem;
					opacity:.4;
					letter-spacing:.25em;
				}
			}
			p {
				color:var(--color_white);
			}
			.inline-block {
				display: inline-block;
				font:inherit;
			}
		}
	}
}

.pagenavi {
    padding-top:30px;
	&:not(:has(.pagination)) {
		display:none;
	}
    .screen-reader-text {
        display:none;
    }
    .page-numbers {
        display:flex;
        align-items:start;
        justify-content:center;
        gap:.5em .33em;
        li {
            a,span {
                background-color: var(--color_main);
                color:var(--color_white);
                font-size:1.3rem;
				aspect-ratio:1;
                min-height:2em;
                line-height:2;
                min-width:2em;
                padding:0 .5em;
				border-radius:50%;
            }
        }
        .current {
            font-weight:700;
			color:var(--color_white);
			background-color:var(--color_sub);
        }
		&.next,&.prev {
			background:none;
			color:var(--color_white);
			aspect-ratio:unset;
		}
    }
}



@media ( hover:hover ){

}


/* =================================================================
    section
================================================================= */


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

}

@media screen and (max-width:1024px){
    
	.titlewrap {
		.page_ttl {
		}
	    h1 {
			font-size:3.0rem;
	    }
	}
	.nav {
	    .aioseo-breadcrumbs{
			width:calc(100% - 50px);
	    }
	}
	
	section {
		.wrap {
			.contents {
				h2 {
					font-size:3.0rem;
					.font_en {
						font-size:1.8rem;
					}
				}
			}
		}
	}
	
}

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

	.titlewrap {
		.page_ttl {
			width:calc(100% - 40px);
			height:80px;
		}
	    h1 {
			font-size:2.4rem;
	    }
	}
	.nav {
	    .aioseo-breadcrumbs{
			width:calc(100% - 40px);
			font-size:1.2rem;
	    }
	}
	
	section {
		&:has( + #contact) {
			.wrap {
				padding-bottom:90px;
			}
		}
		.wrap {
			padding-top:60px;
			.contents {
				h2 {
					font-size:2.4rem;
					.font_en {
						font-size:1.4rem;
					}
				}
			}
		}
	}

    .pagenavi {
		padding-top:20px;
        .page-numbers {
	        li {
	            a,span {
	            font-size:1.2rem;
				}
			}
        }
    }

	
}