@charset "UTF-8";
/*
Template: swell
Theme Name: CustomTheme
Theme URI: https://example.com/
Description: 流山デザインの子テーマ
Version: 1.0.0
Author: naofumi yamada

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/* 既存指定＋ふわっと表示 */
.p-mainVisual__slideTitle{
  font-size: 40px;
  font-weight: 600;
  letter-spacing: 4px;

  /* ここからアニメ用 */
  opacity: 0;
  transform: translateY(10px);
  filter: blur(2px);
  animation: mvFadeUp 1.5s cubic-bezier(.22,.61,.36,1) .05s forwards;
  will-change: opacity, transform, filter;
}

@keyframes mvFadeUp{
  0%   { opacity:0; transform: translateY(12px); filter: blur(3px); }
  60%  { opacity:1; transform: translateY(0);    filter: blur(0.5px); }
  100% { opacity:1; transform: translateY(0);    filter: blur(0); }
}

/* ユーザーが“動きを減らす”設定のときは無効化 */
@media (prefers-reduced-motion: reduce){
  .p-mainVisual__slideTitle{ animation: none; opacity:1; transform:none; filter:none; }
}

.p-mainVisual__slideTitle{
  font-family: "Noto Serif JP","游明朝",YuMincho,"Hiragino Mincho ProN","MS PMincho",serif;
  font-weight: 600;
}

/* ===== KoteiPage Heading ===== */
.koteipage{
  /* 調整用 */
  --kp-line-color: #0f3d2e;  /* 線の色（深い緑） */
  --kp-text-color: #222;     /* 日本語タイトル色 */
  --kp-en-color: #2e6b58;    /* 英語の色 */
  --kp-line-thick: 2px;      /* 線の太さ */
  --kp-gap: 14px;            /* タイトルと英語の間隔 */
  --kp-gap-bottom: 18px;     /* 英語と線の間隔 */

  position: relative;
  display: block;
  text-align: center;
  margin: 0 0 28px;
  padding-bottom: calc(var(--kp-gap) + var(--kp-gap-bottom));
}

.koteipage .koteipage__ja{
  display: block;
  font-size: 30px;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--kp-text-color);
  margin: 0;
}

.koteipage .koteipage__en{
  display: block;
  font-size: 14px;
  line-height: 1.4;
  margin-top: var(--kp-gap);
  color: var(--kp-en-color);
  letter-spacing: .08em;
  font-weight: 600;
}

/* 全幅の単色ライン（左だけ色付きにならないよう全面カラー） */
.koteipage::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: var(--kp-line-thick);
  background: var(--kp-line-color);
}

/* オプション：英語を大文字にしたい場合 */
/* .koteipage .koteipage__en{ text-transform: uppercase; } */


/* 画面全体の三角アニメ背景用キャンバス */
#triangles-bg{
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  /* 必要に応じてブレンドを試せます（外観と相性次第）
     mix-blend-mode: soft-light;  または multiply; */
}

.c-gnav>.menu-item>a .ttl {
font-size: 20px;
letter-spacing: 0.3px;
}

.u-center{ text-align:center; }
.u-center .fa, .u-center [class*="fa-"], .u-center .icon{ 
  display:inline-block; line-height:1; 
}

/* 汎用：アイコンをカラフルなグラデで塗る */
.fa-gradient{
  display:inline-block;                    /* クリップのため */
  background: linear-gradient(135deg,
    #ff6fd8 0%, #7a5cff 25%, #05d5ff 55%, #00ffa3 100%);
  background-size: 200% 200%;             /* 余裕を持たせる */
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;                      /* 文字色は透明に */
  -webkit-text-fill-color: transparent;    /* Safari対策 */
}
/* さりげない動き（任意。なければ削除） */
.fa-gradient:hover{
  background-position: 100% 0;
  transition: background-position 1.2s ease;
}

/* サポート外ブラウザのフォールバック色 */
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .fa-gradient{ color:#2e6b58; }
}

/* カラーバリエ（必要なら） */
.fa-grad-emerald{
  background: linear-gradient(135deg,#0f3d2e,#1e7f67,#7ad5c1);
}
.fa-grad-sunset{
  background: linear-gradient(135deg,#ff9a9e,#fad0c4,#fbc2eb);
}

.l-footer .copyright {
    font-size: 20px;
    text-align: center;
}


/* PCのみ：左右に20%の外側余白（強制版） */
@media (min-width: 782px){
  .mx-20p{
    width: 60% !important;             /* 20% + 60% + 20% */
    margin-left: 20% !important;
    margin-right: 20% !important;
    max-width: none !important;         /* alignwide/alignfullの制限を無効化 */
    display: block;
  }

  /* Columns内で列(.wp-block-column)に直接付けた場合はflex-basisを上書き */
  .wp-block-columns > .wp-block-column.mx-20p{
    flex: 0 0 60% !important;          /* 既定の幅指定に勝つ */
  }

  /* Group/Cover/MediaTextに付けても同じ効果に */
  .wp-block-group.mx-20p,
  .wp-block-cover.mx-20p,
  .wp-block-media-text.mx-20p{
    width: 60% !important;
  }
}

/* スマホは通常に戻す（任意） */
@media (max-width: 781.98px){
  .mx-20p{
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* 固定ページ：コンテンツ直下の6emをゼロに（左右のautoは残す） */
.page .l-content,
.page .l-contents{
  margin: 0 auto 0 !important;  /* 0 auto 0 ＝ 上0/左右auto/下0 */
}

/* 中身側に残る下マージンもゼロ（最後のブロックの“はみ出し”対策） */
.page .post_content{ margin-bottom: 0 !important; }
.page .post_content > *:last-child{ margin-bottom: 0 !important; }

/* コンテンツラッパの下パディングがある場合の保険 */
.page .l-main,
.page .l-contents{ padding-bottom: 0 !important; }

.c-widget .textwidget>:not(:last-child) {
    margin-bottom: 1em;
    font-size: 20px;
}

    .c-widget__title {
        font-size: 20px;
    }
}