/*背景画像*/
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://salomach.co.jp/wp-content/uploads/2025/01/bg-img7-scaled.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.5; /* 透明度を調整 */
    z-index: -1;
}


/*セクションタイトル*/
.sec-title .smb-section__lede-wrapper.smb-section-side-heading__lede-wrapper{
    margin-top: -10px!important;
}

.sec-title .smb-section__lede-wrapper{
    margin-top: -10px!important;
}

.title-deco .smb-section__title.smb-section-side-heading__title{
    position: relative;
    display: inline-block;
    margin-bottom: 0.5em;
}

.title-deco .smb-section__title.smb-section-side-heading__title::before{
    content: '';
    position: absolute;
    bottom: -8px;
    display: inline-block;
    width: 40px;
    height: 4px;
    left: 0%;
    -webkit-transform: translateX(-0%);
    transform: translateX(-00%);
    background-color: var(--accent-color);
    border-radius: 2px;
}

.title-deco .smb-section__title{
    position: relative;
    display: inline-block;
    margin-bottom: 0.5em;
}

.title-deco .smb-section__title::before{
    content: '';
    position: absolute;
    bottom: -8px;
    display: inline-block;
    width: 40px;
    height: 4px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: var(--accent-color);
    border-radius: 2px;
}

/*ヘッダー*/
.l-header {
    background-color: rgba(0,0,0,0.85);
}

/*ドロワーメニュー*/
.c-drawer {
    background-color: rgba(0,0,0,0.85);
}

.c-blinking{
    padding-top: 4rem;
    padding-bottom: 2rem;
}

.drower-logo{
    max-width: 120px;
    width: 100%;
}

/*スマホ固定メニュー*/
.p-footer-sticky-nav {
    background-color: rgba(0,0,0,0.85);
}

.p-footer-sticky-nav .c-navbar__item>a {
    color: #FFF; /* 文字色 */
    font-size: 1rem;
    font-weight: bold;
    padding-top: 12px;
    padding-bottom: 12px;
}
.p-footer-sticky-nav a>svg{
    display: inline-block;
    margin: 0 8px 0px auto;
}

.svg-inline--fa.fa-lg{
    vertical-align: bottom;
}


/**TOPページ**/
/*FV*/
.fv-title .smb-section__lede-wrapper{
    margin-top: 10px!important;
}

.fv-title .smb-section__title {
    font-size: 2.8rem;
}

.wp-block-snow-monkey-blocks-section-with-bgimage.alignfull.smb-section.smb-section-with-bgimage.smb-section--left.smb-section--fit.is-style-smb-section-undecorated-title.fv-title{
    padding: 12rem 0;
}

@media screen and (max-width: 1023px) {
    .wp-block-snow-monkey-blocks-section-with-bgimage.alignfull.smb-section.smb-section-with-bgimage.smb-section--left.smb-section--fit.is-style-smb-section-undecorated-title.fv-title{
        padding: 9rem 0;
    }
    }

@media screen and (max-width: 639px) {
    .fv-title .smb-section__title {
        font-size: 2rem;
    }
    .wp-block-snow-monkey-blocks-section-with-bgimage.alignfull.smb-section.smb-section-with-bgimage.smb-section--left.smb-section--fit.is-style-smb-section-undecorated-title.fv-title{
        padding: 8.5rem 0;
    }
    }

/*Aboutセクション*/
@media (min-width: 640px) {
    .about-title .smb-section-side-heading__header {
        position: sticky;
        top: 120px; 
        z-index: 10; 
    }
}

/*特徴セクション*/
h3.wp-block-heading.is-style-plain.feature-title{
    padding: 12px;/*文字回りの余白（上下左右）*/
    display: block;
    border: 1px solid #A68D6C;/*囲み線（太さ 実線 色）*/
    position: relative;
}

h3.wp-block-heading.is-style-plain.feature-title::after{
    content: '';
    background:#EEEAE4;/*背景色*/
    width: calc(100% + 3px);
    height: calc(100% + 3px);
    position: absolute;
    top: 5px;/*背景の上下位置ずらし*/
    left: 5px;/*背景の左右位置ずらし*/
    z-index: -1;
}

/*CTAセクション*/
.cta-sec .smb-section__fixed-background{
    border-radius: 50px;
}

/*お客様の声*/
@media screen and (min-width: 1024px) {
	.voc-sec .c-entries{
		--entries--item-width: 50%;
	}
}

/*よくある質問*/
.faq-box .smb-panels__item__body {
    padding: 0;
}

/*Contactセクション*/
.wp-block-snow-monkey-blocks-section-with-bgimage.contact-sec {
    border-radius: 50px;
}

/*店舗検索*/
button.c-btn.sms-search-box__submit {
    border-radius: 30px;
}

/*下層ページヘッダー*/
.c-page-header[data-has-image=true] {
    height: clamp(200px, 62.5vw, 300px);
}

.c-page-header__title {
    position: relative;
    padding-left: 60px; /* 線とタイトルの間に余白を確保 */
    margin-left: -40px;
}

.c-page-header__title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 40px; /* 線の幅 */
    height: 1px; /* 線の高さ（太さ）*/
    background-color: #FFF; /* 線の色 */
    transform: translateY(-50%); /* 垂直中央揃え */
}

@media screen and (max-width: 639px) {
    .page-id-220 .c-page-header__title{
        font-size: 1.5rem;
    }
    }

/*サロン・スタイリストページタイトル*/
.header-title .smb-section__title{
    font-size: 2.4rem;
}
@media screen and (max-width: 639px) {
    .header-title .smb-section__title {
        font-size: 2rem;
    }
    }


/*スタイリストページ*/
.flow-block .smb-items__item__body.is-layout-constrained.wp-block-items-item-free-is-layout-constrained {
    height: 360px;
}
.has-sm-text-alt-background-color {
    background-color: #ffffff7A!important;
}

/*会社概要ページ*/
.outline-table .wp-block-snow-monkey-blocks-information-item.smb-information__item {
    border-bottom: solid 1px #DED7CF;
    padding-bottom: 25px;
}

/*プライバシーポリシーページ*/
h3.wp-block-heading.is-style-plain.privacy-title {
    position: relative;
    padding-left: 18px; 
    background-color: #EEEAE4;
    padding-top: 6px;
    padding-bottom: 6px;
}

h3.wp-block-heading.is-style-plain.privacy-title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 5px; 
    height: 100%; 
    background-color: var(--accent-color);
    transform: translateY(-50%); 
}

/*投稿ウィジェット*/
button.c-input-group__btn {
    color: #FFF;
    background-color: #000;
}

h2.c-widget__title {
    width: 100%;
    background-color: #E0E0E0;
    display: block;
    padding: 5px 12px;
    color: #000;
    border-radius: 5px;
}

/*CTA*/
.wp-block-snow-monkey-blocks-btn.smb-btn-wrapper.smb-btn-wrapper--wider.cta-btn {
    text-align: center;
}
.cta-btn .smb-btn.smb-btn--wider {
    width: 300px;
}

/*フッター*/
.c-copyright--inverse{
    background-color: #000;
}

/*レスポンシブ調整*/
@media screen and (max-width: 639px) {
    .about-title_sp{
        font-size: 1.2rem!important;
    }
}