@charset "utf-8";

#pagetitle {
	&:has(.rank-math-breadcrumb) {
	    .pagetitle {
			padding-top: 63px;
		}
	}
    .pagetitle {
		padding-top: 88px;
        h1 {
            font-size:2.2rem;
            display:grid;
            justify-items:center;
            text-align:center;
            width:140px;
            margin:0 auto 1.7em;
            color:var(--color_main);
            letter-spacing:.1em;
            grid-row-gap:.66em;
            position:relative;
            span {
                width:100%;
                font-size:1.4rem;
                letter-spacing:.08em;
                padding-top:1.1em;
                position:relative;
                text-align:center;
                &::before {
                    content:'';
                    display:block;
                    background-color:var(--color_main);
                    border-radius:10px;
                    width:100%;
                    height:3px;
                    position:absolute;
                    left:0;
                    top:0;
                }
            }
            .obj {
                position:absolute;
                display:block;
                width:90px;
            }
        }
    }
	.rank-math-breadcrumb {
		width:calc(100% - 166px);
		max-width:100%;
		margin:0 auto;
		padding-top:10px;
		font-size:1.4rem;
		* {
			line-height:1.4;
		}
		span {
			color:#000000;
		}
		a,.separator {
			color:#9c9d9d;
		}
	}
}

#mv {
    overflow:clip;
	.wrap {
		padding-bottom:85px;
	}
    .slider_wrap {
        /* max-width:1200px; */
        margin:0 auto;
		position:relative;
        .page_slider {
			/* width:min(84vw,1000px); */
			margin:0 auto;
			position:relative;
            &::before,&::after {
                content:'';
				content:none;
                display:block;
                width:13.2%;
                height:100%;
                position:absolute;
                top:0;
                background-color:rgba(255,255,255,.66);
                z-index:2;
            }
			.slide {
				/* width:min(84vw,1000px); */
				transition:opacity .7s;
				overflow: hidden;
				img {
					display:block;
					width:100%;
					transform:scale(1.02);
				}
				&:not(.swiper-slide-active) {
					opacity:.4;
				}
			}
            &::before {
                right:0%;
            }
            &::after {
                left:0;
            }
        }
		.swiper-button-black {
			width:30px;
			height:30px;
			z-index:10;
			svg {
				display:none;
			}
			&.swiper-button-next {
				background:url(../img/common/next.svg) no-repeat center center/contain;
				right:7.4vw;
			}
			&.swiper-button-prev {
				background:url(../img/common/prev.svg) no-repeat center center/contain;
				left:7.4vw;
			}
		}
		.swiper-pagination {
			bottom:-25px;
			display:flex;
			justify-content:center;
			column-gap:20px;
			.swiper-pagination-bullet {
				width:8px;
				height:8px;
				border-radius:50%;
				background-color:#e6d6c1;
				margin:0;
				padding:0;
				opacity:1;
				&.swiper-pagination-bullet-active {
					background-color:var(--color_sub);
				}
			}
		}
    }
}

section {
	.wrap {
		.contents {
        }
    }
}

.pagenavi {
    .screen-reader-text {
        display:none;
    }
    .page-numbers {
        display:flex;
        align-items:start;
        justify-content:center;
        font-size:1.4rem;
        gap:.5em;
        li {
            a,span {
                background-color:#9c9d9d;
                color:#FFFFFF;
                min-height:1.7em;
                line-height:1.7;
                min-width:1.7em;
                padding:0 .4em;
				border-radius:3px;
				font-weight:600;
				&.next,&.prev {
					background:none;
					color:var(--color_main);
				}
            }
        }
        .current {
			background-color:var(--color_main);
        }
    }
}

section {
    &:last-child {
        .wrap {
            padding-bottom: 120px;
        }
    }
    .wrap {
		padding-bottom:145px;
        .contents {
			max-width:1116px;
            h2 {
				text-align:center;
	            font-size:2.0rem;
				margin-bottom:3.6em;
				letter-spacing:.01em;
				color:var(--color_main);
				span {
					height:50px;
					background:#FFFFFF;
					border:3px solid var(--color_main);
					display:inline-grid;
					align-items:center;
					justify-content:center;
					padding:0 1.6em;
					border-radius:25px;
				}
			}
			h3 {
				font-size:2.3rem;
				line-height:1.74;
				font-family: "dnp-shuei-mgothic-std", sans-serif;
				letter-spacing:.08em;
				margin-bottom:.75em;
				font-weight:600;
			}
			p {
				font-size:1.4rem;
				line-height:1.71;
				font-weight:500;
				letter-spacing:.06em;
			}
			.btn,.acf-button {
				font-size:1.4rem;
				line-height:1;
				background-color:var(--color_main);
				color:#FFFFFF;
				height:34px;
				display:grid;
				grid-template-columns:repeat(2,auto);
				align-items:center;
				justify-content:center;
				letter-spacing:.05em;
				grid-column-gap:.5em;
				width:100%;
				max-width:130px;
				border-radius:17px;
				padding-bottom:2px;
				img {
					width:.9em!important;
					transform:translateY(1px);
				}
			}
        }
    }
}

@media ( hover:hover ){
    
}

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

	#pagetitle {
		.rank-math-breadcrumb {
			width:calc(100% - 60px);
			max-width:1200px
		}
	}
	
}


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


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

    /* #mv {
        .slider_wrap {
            .page_slider {
				.swiper-button-black {
					&.swiper-button-next {
	                    right:-8vw;
					}
					&.swiper-button-prev {
	                    left:-8vw;
					}
				}
            }
        }
    } */

}

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

    
	#pagetitle {
		.rank-math-breadcrumb {
			width:calc(100% - 50px);
		}
	}
}

@media screen and (max-width:768px){
    
    #pagetitle {
		&:has(.rank-math-breadcrumb) {
		    .pagetitle {
				padding-top: 23px;
			}
		}
        .pagetitle {
            padding-top:40px;
            h1 {
                font-size:1.76rem;
                width:112px;
                margin:0 auto 1.25em;
                span {
                    font-size:1.12rem;
                }
                .obj {
					width:76px;
                }
            }
        }
		.rank-math-breadcrumb {
			width:calc(100% - 40px);
			font-size:1.2rem;
		}
    }

    #mv {
        .wrap {
            padding-bottom:50px;
        }
        .slider_wrap {
            .page_slider {
                width:100%;
				.slide {
					width:100%;
				}
                &::before,&::after {
                    content:none;
                }
                .swiper-button-black {
					display:none;
                }
            }
        }
    }
    
    .pagenavi {
        .page-numbers {
            font-size:1.2rem;
        }
    }

	section {
        &:last-child {
            .wrap {
                padding-bottom: 60px;
            }
        }
	    .wrap {
			padding-bottom:70px;
	        .contents {
	            h2 {
		            font-size:1.6rem;
					margin-bottom:2em;
					span {
						height:44px;
						border:2px solid var(--color_main);
						border-radius:22px;
					}
				}
				h3 {
					font-size:1.84rem;
					margin-bottom:.4em;
				}
				p {
					font-size:1.3rem;
				}
				.btn, .acf-button {
					font-size:1.2rem;
					height:28px;
					border-radius:14px;
					padding-bottom:0;
				}
	        }
	    }
	}

	
}

.contbox {
	& + .fieldedit {
		margin-top: 30px;
		margin-bottom: 0;
	}
}
.fieldedit {
	padding:20px;
	background-color: #FFFFFF;
	margin-bottom: 60px;
	border-radius: 10px;
	box-shadow: 0 3px 6px rgba(0,0,0,.15) inset;
	.acf-button {
		border:none;
		text-align: center;
		margin:0 auto;
	}
	.btnedit {
		display: flex;
		gap:1em;
		justify-content: center;
		align-items: center;
		padding-top: 1em;
	}
	dl {
		dt {
			text-align: center;
			display: grid;
			grid-template-columns: repeat(2,auto);
			align-items: center;
			justify-content: center;
			grid-column-gap: .5em;
			cursor: pointer;
			&::after {
				content:'';
				display: block;
				background-color: #000000;
				width: .66em;
				height: .4em;
				clip-path: polygon(0 0,100% 0,50% 100%);
				transform: translate(0, .2em) rotate(0);
				transition: .3s;
			}
			&.open {
				&::after {
					transform: translate(0, .2em) rotate(180deg);
				}
			}
		}
		dd {
			padding-top: 1em;
			display: none;
		}
	}
}