@charset "UTF-8";

/*
 * Template: swell
 * Theme Name: SWELL CHILD
 * Theme URI: https://swell-theme.com/
 * Description: SWELLの子テーマ
 * Version: 1.0.0
 * Author: LOOS WEB STUDIO
 * Author URI: https://loos-web-studio.com/
 * License: GNU General Public License
 * License URI: http://www.gnu.org/licenses/gpl.html
 */

/* ==========================================================================
   変数定義
   ========================================================================== */
:root {
    /* にじいろ鍼灸ブランドカラー - グラデーション */
    --niji-gra-pink: linear-gradient(to right, #fec0da, #ffffc5);
    --niji-gra-green: linear-gradient(to right, #c0f1ff, #fcffb2);
    --niji-gra-blue: linear-gradient(to right, #ddeafe, #c6f4fe);



    /* 単色 */
    --niji-red: #FF9A9A;
    --niji-green: #82DCCA;
    --er-yellow: #EDBD27;
    --niji-blue: #9EC4FE;
    --er-pink: #E18B95;

    /* フォント */
    --er-font-primary: "Zen Maru Gothic", sans-serif;
}

/* ==========================================================================
   共通ヘッダー
   ========================================================================== */
.-parallel .l-header__logo {
    width: 1200px;
    margin: auto;
    padding: 10px 10px !important;
}

@media not all and (min-width: 960px) {
    .l-header__inner {
        padding: 0 10px;
    }
}

/* グローバルナビゲーション */
.c-gnav>.menu-item>a .ttl {
    font-family: "Zen Maru Gothic", serif;
    font-size: 17px;
    font-weight: 500;
}

/* お問い合わせボタン */
.c-gnav>.menu-item:last-child {
    background: var(--color_main);
    color: #fff;
}

/* ==========================================================================
   共通コンポーネント
   ========================================================================== */

/* スマートフォン向け　デフォルト見出し変更*/
@media screen and (max-width: 767px) {
    .post_content h3 {
        font-size: 1.25em;
    }
}

.marumin {
    font-family: "Zen Maru Gothic", serif;
}

/* 角丸ユーティリティ */
.u-rounded-xs,
.u-rounded-xs img {
    border-radius: 4px;
}

.u-rounded-sm,
.u-rounded-sm img {
    border-radius: 8px;
}

.u-rounded-md,
.u-rounded-md img {
    border-radius: 12px;
}

.u-rounded-lg,
.u-rounded-lg img {
    border-radius: 16px;
}

.u-rounded-xl,
.u-rounded-xl img {
    border-radius: 24px;
}


/* 汎用高めテーブル */
.er-basic-table {
    margin-left: auto;
    margin-right: auto;
}

.er-basic-table table,
.er-basic-table th,
.er-basic-table td {
    border-color: var(--er-blue);
}


/* 線ボタン */
.is-style-btn_line a {
    background-color: rgba(255, 255, 255, 0.7);
}

/* Google Maps埋め込み */
.g_map {
    height: 0;
    padding-top: 50%;
    position: relative;
    width: 100%;
}

.g_map iframe,
.g_map object,
.g_map embed {
    border-radius: 15px;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

/* ==========================================================================
   トップページ
   ========================================================================== */
/* メインビジュアル */
.p-mainVisual__textLayer {
    top: -80px;
}

@media screen and (max-width: 767px) {
    .p-mainVisual__textLayer {
        left: 40% !important;
        width: 80%;
    }
}

/*メインビジュアル上コピーの影*/
.svg-shadow-w {
    filter: drop-shadow(0px 0px 19px #256808);
}

.svg-shadow-b {
    filter: drop-shadow(0px 0px 15px #ffffff) drop-shadow(0px 0px 8px #ffffff) drop-shadow(0px 0px 3px #ffffff);
}

/* アクセステーブル */
.er-access-table {
    margin-left: auto;
    margin-right: auto;
    width: 70%;
}


@media (max-width: 960px) {
    .er-access-table {
        width: 90%;
    }
}

.er-access-table table,
.er-access-table th,
.er-access-table td {
    border-color: var(--er-blue);
}

.er-access-table td:first-child {
    width: 30% !important;
}

/* ==========================================================================
   固定ページ共通
   ========================================================================== */
/* コンテンツの余白調整 */
.page .l-content {
    padding-top: 0;
}

@media (max-width: 960px) {
    .l-content {
        padding-top: 0;
    }
}

/* アイキャッチ画像設定 */
.page .l-topTitleArea__body {
    text-shadow: none;
}

.page:not(.home) .c-filterLayer__img {
    opacity: 0.6;
    z-index: 0;
}

/* ページタイトル */
.c-pageTitle {
    color: #555;
    font-family: "Zen Maru Gothic", serif;
    font-size: 1.6em;
    font-style: normal;
    font-weight: 500;
    text-align: center;
}


/* ==========================================================================
   アニメーション設定
   ========================================================================== */
/* フェードアップアニメーション */
.fade_up_img {
    transform: translateY(30px);
    opacity: 0;
    z-index: 0;
    position: relative;
}

.fade_up_img {
    transition: all 0.3s ease-out;
    transform: translateY(0);
    opacity: 1;
}

/* メインビジュアルレイヤー */
.p-mainVisual__slideLayer {
    z-index: 2;
    position: relative;
}

.p-mainVisual__bgLayer {
    z-index: 1;
    position: relative;
}

/* ==========================================================================
   背景グラデ設定
   ========================================================================== */

/* 代表あいさつ */
/* 背景グラデーションを最背面に */
.er-greeting__background {
    background-image: var(--er-gradient-green);
    position: relative;
    margin-top: 0 !important;
}

/* 代表あいさつ個別ページ */
/* 背景グラデーションを最背面に */
.er-green__background {
    background-image: var(--er-gradient-green);
    position: relative;
    z-index: -10;
    /* 最背面に配置 */
}

/* ==========================================================================
   印刷設定
   ========================================================================== */
@media print {

    .sp-button,
    .pc-button,
    .top_title {
        display: none !important;
    }
}

/* ==========================================================================
   インスタフィードボタン
   ========================================================================== */
#sb_instagram #sbi_load {
    margin: 10px auto;
}

#sb_instagram .sbi_follow_btn a {
    margin: 0 auto;
}

/* ==========================================================================
   汎用設定
   ========================================================================== */
.mt-2em {
    margin-top: 2em !important;
}

.mb-0em {
    margin-bottom: 0em !important;
}