@charset "utf-8";

.titlewrap {
    background: #F8F8F8;
    background: linear-gradient(120deg,rgba(248, 248, 248, 1) 50%, var(--color_main) 50.1%);
    padding-top:140px;
    padding-bottom:20px;
    position:relative;
    margin-bottom:120px;
    &::before {
        content:'';
        width:40%;
        height:100%;
        position:absolute;
        right:0;
        top:0;
        background:url(../img/common/title-obj.svg) no-repeat left center/auto 100%;
    }
    .title_inner {
        width:calc(100% - 60px);
        max-width:1100px;
        margin:0 auto;
        h1 {
            font-size:5.0rem;
            color:var(--color_main);
            display:grid;
            grid-template-columns:repeat(2,auto);
            justify-content:start;
            align-items:end;
            grid-column-gap:.66em;
			text-shadow:0 0 2px #FFFFFF,
						0 0 2px #FFFFFF,
						0 0 2px #FFFFFF,
						0 0 2px #FFFFFF,
						0 0 2px #FFFFFF,
						0 0 2px #FFFFFF;
            .jp {
                font-size:3.0rem;
                font-weight:500;
                &::before,&::after {
                    content:'-';
                    margin:0 .33em;
                }
            }
        }
        .aioseo-breadcrumbs {
            margin-top:30px;
            span,a {
                font-size:1.2rem;
                color:var(--color_main);
				text-shadow:0 0 1px #FFFFFF,
							0 0 1px #FFFFFF,
							0 0 1px #FFFFFF,
							0 0 2px #FFFFFF,
							0 0 2px #FFFFFF,
							0 0 2px #FFFFFF;
            }
        }
    }
}

section {
    .wrap {
        padding-bottom:120px;
        .contents {
            h2 {
                font-size:3.2rem;
                line-height:1.5;
                margin-bottom:1em;
                display:grid;
                grid-template-columns:auto 1fr;
                grid-column-gap:.5em;
                &::before {
                    content:'';
                    width:1.6em;
                    height:1.6em;
                    background:url(../img/common/tit-icon.svg) no-repeat center center/contain;
                }
            }
			.btn {
				height:55px;
				max-width:250px;
				font-size:1.6rem;
				line-height:1;
				background-color:var(--color_main);
				display:grid;
				grid-template-columns:repeat(2,auto);
				align-items:center;
				justify-content:space-between;
				grid-column-gap:1em;
				color:#FFFFFF;
				position:relative;
				padding:0 1.2em;
				img {
					width:1.25em;
				}
				&:not(:has(img)) {
					grid-template-columns:1fr;
					justify-content:center;
					text-align:center;
				}
			}
        }
    }
}

#linkbox {
	.wrap {
		.contents {
			h2 {
				grid-template-columns:auto 1.2em;
				justify-content:start;
				align-items:center;
				&::before {
					content:none;
				}
			}
			.contents_inner {
				&::before {
					content:none;
				}
				display:flex;
				column-gap:0;
				row-gap:50px;
				flex-wrap:wrap;
				li {
					width:50%;
					a {
						display:block;
						.img {
							overflow:hidden;
							img {
								display:block;
                                width: 100%;
							}
						}
						h3 {
							font-size:2.0rem;
							margin-top:1em;
                            line-height: 1.3;
						}
					}
				}
			}
		}
	}
	&.business {
		.wrap {
			.contents {
				.contents_inner {
					li:nth-last-child(-n+3) {
						width:calc(100%/3);
					}
				}
			}
		}
	}
}

.pagenavi {
    padding-top:60px;
    .screen-reader-text {
        display:none;
    }
    .page-numbers {
        display:flex;
        align-items:start;
        justify-content:center;
        gap:.5em .33em;
        li {
            a,span {
                background-color:#f1f1f1;
                color:var(--color_main);
                font-size:1.2rem;
                min-height:2em;
                line-height:2;
                min-width:2em;
                padding:0 .5em;
            }
        }
        .current {
            font-weight:700;
        }
    }
}

/**en**/
body {
	&.wp-singular {
		&[class$="-en"] {
			h1 {
				.jp {
					display:none;
				}
			}
		}
	}
}

@media ( hover:hover ){  

	#linkbox {
		.wrap {
			.contents {
				.contents_inner {
					li {
						a {
							.img {
								img {
									transition:.3s;
								}
							}
							&:hover {
								.img {
									img {
										transform:scale(1.05);
									}
								}
							}
						}
					}
				}
			}
		}
	}
	
}


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


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

    .titlewrap {
        background: linear-gradient(120deg,rgba(248, 248, 248, 1) 60%, var(--color_main) 60.1%);
        &::before {
            width:30%;
        }
    }
    
}

@media screen and (max-width:1024px){
    
    .titlewrap {
        padding-top:100px;
        margin-bottom:90px;
        .title_inner {
            width:calc(100% - 50px);
            h1 {
                font-size:4.0rem;
                .jp {
                    font-size:2.4rem;
                }
            }
            .aioseo-breadcrumbs {
                margin-top:20px;
            }
        }
    }

	#linkbox {
		.wrap {
			.contents {
				.contents_inner {
					li {
						a {
							h3 {
								font-size:1.8rem;
							}
						}
					}
				}
			}
		}
    }

    section {
        .wrap {
            padding-bottom:90px;
            .contents {
                h2 {
                    font-size:2.8rem;
                }
            }
        }
    }
    
}

@media screen and (max-width:768px){
    
    .titlewrap {
        background: linear-gradient(120deg,rgba(248, 248, 248, 1) 70%, var(--color_main) 70.1%);
        padding-top:80px;
        padding-bottom:10px;
        margin-bottom:60px;
        .title_inner {
            width:calc(100% - 40px);
            h1 {
                font-size:3.0rem;
                grid-template-columns:1fr;
                grid-row-gap:.33em;
                .jp {
                    font-size:1.8rem;
                }
            }
            .aioseo-breadcrumbs {
                margin-top:15px;
                span,a {
                    font-size:1.1rem;
                }
            }
        }
    }

    section {
        .wrap {
            padding-bottom:60px;
            .contents {
                h2 {
                    font-size:2.2rem;
                    grid-column-gap:.33em;
                }
				.btn {
					height:50px;
					width:100%;
					max-width:280px;
					margin:0 auto;
					grid-template-columns:1fr auto;
					text-align:center;
					padding-right:.66em;
					padding-left:2em;
					&:not(:has(img)) {
						padding-left:.66em;
					}
				}
            }
        }
    }

	#linkbox {
		.wrap {
			.contents {
				.contents_inner {
					row-gap:20px;
					li {
						width:50%;
						a {
							h3 {
								font-size:1.6rem;
								margin-top:.66em;
							}
						}
					}
				}
			}
		}
		&.business {
			.wrap {
				.contents {
					.contents_inner {
						li:nth-last-child(-n+3) {
							width:50%;
						}
					}
				}
			}
		}
	}
    
    .pagenavi {
        padding-top:45px;
        .page-numbers {
            font-size:1.4rem;
        }
    }
}