/* サイト全体 */

html{
    scrollbar-gutter: stable;
}

body{
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing:0.02em;
}
body.post,
body.page{
	margin:0;
}

ul, ol{
	margin:0 0 1.5em 0;
}

hr.wp-block-separator{
	background-color:unset;
}

a.wp-block-button__link{
	color:#fff;
}
a.wp-block-button__link:hover{
	opacity:.9;
}


/* メディアとテキストの時、余計な左右の余白を無くす */
.wp-block-media-text>.wp-block-media-text__content{
	padding-right:0;
}
.wp-block-media-text.has-media-on-the-right>.wp-block-media-text__content{
	padding-left:0;
	padding-right:8%;
}
@media (max-width: 600px) {
	.wp-block-media-text>.wp-block-media-text__content{
		padding-left:0;
	}
	.wp-block-media-text.has-media-on-the-right>.wp-block-media-text__content{
		padding-right: 0;
	}
}

/* メディアとテキストで、特定のクラス名でメディアを下にする */
@media (max-width: 767px) {
	.wp-block-media-text.reverse-sp {
		grid-template-columns: 100%;
	}
	.wp-block-media-text.reverse-sp .wp-block-media-text__content {
		grid-row: 1;
	}
	.wp-block-media-text.reverse-sp .wp-block-media-text__media {
		grid-row: 2;
	}
}


/* 背景色があるグループは隙間をつくる */
.wp-block-group.has-background{
	padding: 1.25em 2.375em;
	margin-bottom: 1.5em;
}


.site-main {
    background-color: #fdfdfd;
	padding:0;
	margin:0;
}
.container{
	max-width:1200px;
	margin-inline:auto;
	padding-inline:20px;
}


/* ---- タイトル ---- */
header.entry-header h1{
	font-size: clamp(1.6rem, 4vw, 2em);
    text-align: center;
    color: #556b2f;
    padding: 50px 10px;
    margin: 0;
	font-weight: 800;
}



h2.wp-block-heading{
	font-size:clamp(1.3em, 2vw, 1.5em);
	color:#4b6124;
}


/* ==================================================
   Header
================================================== */

/* ------------------------------
    
------------------------------ */
.site-header {
    position: relative;
    background: #fff;
    z-index: 100;
    padding: 10px 2em;
    position: sticky;
    top: 0;
}

.header-inner {
    display: flex;
	align-items: center;
    width: 100%;
    height: stretch;
}

.site-title{
	margin:0;
}
.site-branding{
	width:250px;
}
.site-branding .custom-logo-link img{
	max-height:70px;
	width:auto;
    max-width: 100%;
    height: auto;
}


/* ------------------------------
    PC menu
------------------------------ */
.main-navigation{
    width: auto;
	margin-left:auto;
	display:flex;
	align-items: center;
}
.main-navigation ul {
    display: flex;
    gap: 40px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-navigation a {
	color:#111;
	font-weight:500;
    text-decoration: none;
}
.main-navigation a:hover{
	color:#ff7a00;
}
.main-navigation .current-menu-item a{
	color:#ff7a00;
}

.main-navigation a.to-form-btn{
    display: flex;
    align-items: center;
	font-size:.9em;
	font-weight:600;
	letter-spacing:0.1em;
    width: fit-content;
    color: #fff;
    background-color: #ff7a00;
    padding: 7px 20px;
    margin-left: 30px;
    border-radius: 50px;
}
.main-navigation a.to-form-btn::before{
    content: "";
    background-image: url(../images/form/koji-person.svg);
    width: 25px;
    height: 25px;
    background-size: contain;
    display: inline-block;
	margin-right:5px;
}
.main-navigation a.to-form-btn:hover{
	background-color:#f39d51;
	color:#fff;
}


/* ------------------------------
    SP menu
------------------------------ */
/* ハンバーガーメニュー */
.menu-toggle {
    display: none;
    width: 42px;
    height: 42px;
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 1001;
	margin-left: auto;
}

.menu-toggle span {
    position: absolute;
    left: 8px;
    width: 26px;
    height: 3px;
    background: #333;
    transition: .3s;
}
.menu-toggle span:nth-child(1) { top: 11px;}
.menu-toggle span:nth-child(2) { top: 19px;}
.menu-toggle span:nth-child(3) { top: 27px;}

.menu-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 998;
}

/* × */
.menu-toggle.active span:nth-child(1) {
    transform: rotate(45deg);
    top: 19px;
}
.menu-toggle.active span:nth-child(2) {
    opacity: 0;
}
.menu-toggle.active span:nth-child(3) {
    transform: rotate(-45deg);
    top: 19px;
}

/* SP ナビ */

.mobile-navigation{
    position: fixed;
    top: 0;
    right: 0;
    width: min(85vw,360px);
    height: 100vh;
    background:#fff;
    transform:translateX(100%);
    transition:.35s ease;
    overflow-y:auto;
    z-index:999;
    padding:90px 0 30px;
}

.mobile-navigation.active{
    transform:translateX(0);
}

.mobile-nav__list{
    margin:0;
    padding:0;
    list-style:none;
}

.mobile-nav__list li{
    margin:0;
    border-bottom:1px solid #eee;
}

.mobile-nav__list li:first-child{
    border-top:1px solid #eee;
}


.mobile-nav__list a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:14px 25px;
    color:#333;
    text-decoration:none;
    font-size:16px;
    font-weight:500;
    transition:.25s;
}


.mobile-nav__list a::after{
    content:"›";
    font-size:22px;
    color:#999;
    transition:.25s;
}


.mobile-nav__list a:hover{
    background:#f7f7f7;
    color:#556B2F;
}

.mobile-nav__list a:hover::after{
    transform:translateX(5px);
    color:#556B2F;
}


.current-menu-item>a{
    color:#556B2F;
    font-weight:700;
}

.mobile-navigation .to-form-btn{
    display:block;
    width:calc(100% - 40px);
    margin:30px auto 30px;
    padding:16px;
    border-radius:8px;
    background:#f27400;
    color:#fff;
    text-align:center;
    text-decoration:none;
    font-weight:700;
}



@media(max-width:1100px) {
	.main-navigation ul{
		gap:20px;
		font-size:.9em;
	}
	.main-navigation a.to-form-btn{
		margin-left: 20px;
		font-size:.85em;
		padding:7px 15px;
	}
}
@media(max-width:1000px) {
	#menu-item-78{
		display:none;
	}
}

@media(max-width:900px) {
    .menu-toggle {
        display: block;
    }
    .main-navigation {
		flex-direction:column;
        position: fixed;
        top: 0;
        right: -320px;
        width: 300px;
        height: 100vh;
        background: #fff;
        transition: .35s;
        z-index: 999;
        padding-top: 100px;
    }
    .main-navigation ul {
        display: block;
    }
    .main-navigation li {
        border-bottom: 1px solid #eee;
    }
    .main-navigation a {
        display: block;
        padding: 18px 25px;
    }
    .main-navigation.active {
        right: 0;
    }
    .menu-overlay.active {
        opacity: 1;
        visibility: visible;
    }
    body.menu-open {
        overflow: hidden;
    }

    /* PCメニュー非表示 */
    .main-navigation ul {
        gap: 0;
    }
}
@media(max-width:768px){

    .pc-nav{
        display:none;
    }

    .sp-navigation{
        display:block;
    }

}

@media(max-width:768px){
	.site-branding{
		width:70%;
	}

}
@media(max-width:500px){
	.site-header{
		height:80px; /* 見積フォームの進捗バーの位置と連動 */
	}
}

.mobile-navigation .sub-link{
    font-size: .8em;
    color: #111;
    text-decoration: none;
    display: block;
    margin: 10px 25px;
}
}

.mobile-navigation{
    position: fixed;
    top: 0;
    right: 0;

    width: 300px;
    height: 100vh;
    background: #fff;

    transform: translateX(100%);
    transition: transform .3s ease;

    z-index: 999;
}

.mobile-navigation.active{
    transform: translateX(0);
}


.pc-nav{

}

.sp-navigation{
    display:none;
}




/* ==================================================
   Footer
================================================== */
/* ------------------------------
    
------------------------------ */
.entry-footer,
.site-footer .edit-link{
	display:none;
}

.site-footer{
    border-top:1px solid #e5e5e5;
}

.footer__inner{

}

/* ABOUT */
.footer__logo img{
    max-width:280px;
    height:auto;
}
.footer__catch{
    margin-top: 15px;
	margin-bottom: 5px;
    color: #4f6624;
    line-height: 1.8;
    font-size: .9em;
    font-weight: 500;
}
.footer__txt{
	font-size:.8em;
}

/* ナビ */
.footer__nav{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:40px;
}
.footer__column h3{
    margin-bottom:20px;
    font-size:1.05rem;
    color:#4f6523;
    font-weight:700;
}
.footer__column ul{
    list-style:none;
    padding:0;
    margin:0;
	font-size:.85em;
}
.footer__column li{
    margin-bottom:12px;
}
.footer__column a{
    color:#333;
    text-decoration:none;
    transition:.3s;
}
.footer__column a:hover{
    color:#76a95e;
}

/* CTA */
.footer__cta-box{
    background:#f1f3ef;
    border-radius:12px;
    padding:25px;
    text-align:center;
}
.footer__cta-box h3{
    font-size: 1.4rem;
    line-height: 1.4;
    margin-bottom: 12px;
    color: #4f6523;
	margin-top:0;
}
.footer__cta-box p{
	margin-bottom: 15px;
    font-size: .85em;
    font-weight: 500;
}
a.footer__btn{
    display:block;
    background:#ff7a00;
    color:#fff;
    text-decoration:none;
    padding:18px;
    border-radius:8px;
    font-weight:700;
    transition:.3s;
}
a.footer__btn:hover{
    background:#f39d51;
}

/* コピーライト */
.footer__copyright{
    background:#f1f3ef;
    text-align:center;
    padding:20px;
    font-size:0.8rem;
    color:#666;
}

@media (max-width:1024px){
    .footer__inner{
        grid-template-columns:1fr;
    }
    .footer__nav{
        grid-template-columns:repeat(2,1fr);
    }
}

@media (max-width:768px){
	.footer__inner{
		gap:10px;
	}
    .footer__nav{
        gap:20px;
		margin-bottom:10px;
    }
	.footer__column li{
		margin-bottom:7px;
	}
    .footer__tel{
        font-size:1.8rem;
    }
    .footer__cta-box h3{
        font-size:1.3rem;
    }
}


/* =====================
	FAQ
===================== */
.faq-list{
	max-width:900px;
	margin:auto;
}
.faq__item{
	margin-bottom:16px;
}

/* 質問 */
.faq__question{
	position:relative;
	display:block;
	width:100%;
	background:#fff;
	border:none;
	padding:28px 80px 28px 30px;
	border-radius:16px;
	text-align:left;
	font-size:18px;
	font-weight:700;
	cursor:pointer;
	box-shadow:0 4px 20px rgba(0,0,0,.05);
	transition:.3s;
}
.faq__question:hover{
	box-shadow:0 8px 30px rgba(0,0,0,.08);
	transform:translateY(-2px);
}

/* ＋マーク */
.faq__question::before,
.faq__question::after{
	content:"";
	position:absolute;
	right:32px;
	top:50%;
	display:block;
	background:#5d7d57;
}
.faq__question::before{
	width:18px;
	height:2px;
	transform:translateY(-50%);
}
.faq__question::after{
	width:2px;
	height:18px;
	transform: translateX(-8px) translateY(-50%);
}

/* 開いたら－ */
.faq__item.is-open .faq__question::after{
	opacity:0;
}

/* 回答 */
.faq__answer{
	display:none;
	padding:24px 30px 30px;
	background:#fff;
	line-height:2;
	color:#666;
	border-top:1px solid #edf0ea;
	border-radius:0 0 16px 16px;
	box-shadow:0 8px 20px rgba(0,0,0,.04);
}
.faq__answer p{
	margin:0;
}

/* 開いた時の質問 */
.faq__item.is-open .faq__question{
	border-radius:16px 16px 0 0;
	box-shadow:none;
}






/* ==========================================
   WordPressブロック調整
========================================== */


@media (max-width: 600px) {
	
	/* .img-none-sp：スマホ時に画像を非表示 */
	.img-none-sp .wp-block-media-text__media{
		display:none;
	}
	
	/* スマホ時テキストの中央寄せを"左寄せ"に修正 */
	.has-text-align-center.wp-block-paragraph{
		text-align:left;
	}
}



/* 背景色がある場合、内側に空白をつける */
@media (max-width: 600px) {
	:root :where(p.has-background),
	.wp-block-group.has-background{
    	padding: 1.25em 1.5em;
	}
}







/* フォーム送信成功時のボックスを無くす */
.ff-message-success {
	border:none;
	box-shadow:unset;
}