@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
*/


/* ========================================
   WPForms
   送信完了メッセージ
======================================== */
.wpforms-confirmation-container-full {
  background: #fff !important;
  border: 2px solid #6d6d6d !important;
}


/* ========================================
   カテゴリー一覧ページ
   サブタイトルを非表示
======================================== */
.c-pageTitle__subTitle {
  display: none;
}


/* ========================================
   投稿記事
   下部カテゴリーを非表示
======================================== */
.p-articleFoot {
  display: none;
}


/* ========================================
   投稿ページ
   タイトル下部カテゴリーを非表示
======================================== */
.single .c-categoryList {
  display: none !important;
}


/* ========================================
   トップビジュアル
   タイトルを拡大
======================================== */
div.p-mainVisual__slideTitle {
  font-size: 330% !important;
}


/* ========================================
   リスト
   下余白
======================================== */
ul li {
  margin-bottom: 0.6em !important;
}


/* ========================================
   ボトムウィジェット
   プロフィール枠を非表示
======================================== */
.p-profileBox {
  border: none;
  box-shadow: none;
}


/* ========================================
   H2見出し：共通
   大きめ・細め
======================================== */
.post_content h2 {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  color: inherit !important;
  padding: 0 !important;
  margin: 48px 0 18px;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.3;
}

.post_content h2::before,
.post_content h2::after {
  display: none !important;
  content: none !important;
}


/* ========================================
   H3見出し：共通
   小さめ・太め
======================================== */
.post_content h3 {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  color: inherit !important;
  padding: 0 !important;
  margin: 28px 0 10px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
}

.post_content h3::before,
.post_content h3::after {
  display: none !important;
  content: none !important;
}


/* ========================================
   H2・H3：スマホ
======================================== */
@media (max-width: 767px) {

  .post_content h2 {
    margin: 36px 0 14px;
    font-size: 36px;
  }

  .post_content h3 {
    margin: 24px 0 8px;
    font-size: 24px;
  }

}


/* ========================================
   Areaページ
   H1の上マージンを削除・文字を細くする
======================================== */
.area-title {
  margin-top: 0 !important;
  font-size: 30px;
  font-weight: 400;
}


/* ========================================
   投稿一覧ページ
   SWELL標準タイトルを非表示
======================================== */
#body_wrap.archive .c-pageTitle {
  display: none !important;
}


/* ========================================
   投稿一覧ページ
   標準タイトル削除後の余白を削除
======================================== */
#body_wrap.archive .p-termContent {
  margin-top: 0 !important;
}


/* ========================================
   投稿一覧ページ
   コンテンツ上部の余白を削除
======================================== */
#body_wrap.archive #content {
  padding-top: 0 !important;
}


/* ========================================
   投稿ページ
   記事本文エリア上部の余白を削除
======================================== */
#body_wrap.single-post .l-mainContent__inner {
  padding-top: 0 !important;
  margin-top: 0 !important;
}


/* ========================================
   投稿ページ
   SWELL標準の記事タイトル・上部メタ情報を非表示
======================================== */
#body_wrap.single-post .p-articleHead,
#body_wrap.single-post .p-articleMetas.-top {
  display: none !important;
}


/* ========================================
   メインコンテンツ
   上下の余白を削除
======================================== */
#content {
  padding-top: 0 !important;
}


/* ========================================
   シンプルH2
======================================== */
.post_content h2.simple-h2 {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
  color: inherit !important;
  font-size: 34px;
  font-weight: 500;
  line-height: 1.3;
}

.post_content h2.simple-h2::before,
.post_content h2.simple-h2::after {
  display: none !important;
  content: none !important;
}

/* ========================================
   シンプルH2 スマホ
======================================== */
@media (max-width: 767px) {
  .post_content h2.simple-h2,
  .post_content .cf-area-card-grid h2.simple-h2 {
    font-size: 34px !important;
  }
}


/* ========================================
   シンプルH3
======================================== */
h3.simple-h3 {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 12px;
  color: inherit !important;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
}

h3.simple-h3::before,
h3.simple-h3::after {
  display: none !important;
  content: none !important;
}


/* ========================================
   シンプルH2・細字版
======================================== */
.post_content h2.simple-h2-light {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
  color: inherit !important;
  font-size: 30px;
  font-weight: 300;
  line-height: 1.3;
}

.post_content h2.simple-h2-light::before,
.post_content h2.simple-h2-light::after {
  display: none !important;
  content: none !important;
}


/* SWELLステップブロックの縦線 */
.swell-block-step__item::before {
  border-left: 1px solid #999;
}


/* ========================================
   Area 地域紹介 内側余白削除
======================================== */
.post_content .cf-area-intro .swell-block-fullWide__inner {
  padding-left: 0 !important;
}


/* ========================================
   シンプルH4
======================================== */
.post_content h4.simple-h4 {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 18px 0 18px !important;
  color: inherit !important;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
}

.post_content h4.simple-h4::before,
.post_content h4.simple-h4::after {
  display: none !important;
  content: none !important;
}


/* ========================================
   CIページ 投稿リストのタイトルサイズ
======================================== */
.post_content .p-postList.-type-card .p-postList__title {
  font-size: 14px;
}


/* ========================================
   投稿カード 画像の角丸を解除
======================================== */
.p-postList.-type-card .p-postList__thumb,
.p-postList.-type-card .p-postList__thumb::before,
.p-postList.-type-card .c-postThumb__figure,
.p-postList.-type-card .c-postThumb__figure img {
  border-radius: 0;
}


/* ========================================
   投稿カード 画像とタイトルの余白調整
======================================== */
.p-postList.-type-card .p-postList__body {
  padding-top: 8px;
  padding-bottom: 10px;
}

.p-postList.-type-card .p-postList__title {
  margin-top: 0;
}


/* ========================================
   CIページ 下部関連記事エリアを非表示
======================================== */
.is-ci-page .l-articleBottom {
  display: none;
}


/* ========================================
   CIページ 本文下部の余白を削除
======================================== */
.is-ci-page .post_content {
  margin-bottom: 0 !important;
}

.is-ci-page #content {
  margin-bottom: 0 !important;
}


/* ========================================
   Area カード一覧 Exploreテキストリンク
======================================== */

/* PC・スマホ共通：右寄せ */
.post_content .cf-area-card-grid .swell-block-button {
  display: flex !important;
  justify-content: flex-end !important;
  padding-right: 8px !important;
}

/* PC・スマホ共通：枠なし */
.post_content .cf-area-card-grid .swell-block-button__link {
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0px 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #435846 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  transition: opacity .2s ease;
}

/* 矢印アイコン */
.post_content .cf-area-card-grid .swell-block-button__link i,
.post_content .cf-area-card-grid .swell-block-button__link svg {
  color: #435846 !important;
  stroke: currentColor;
}

/* ホバー */
.post_content .cf-area-card-grid .swell-block-button__link:hover {
  opacity: .7;
}


/* ========================================
   Area カード一覧 Exploreリンク強調
======================================== */
@media (min-width: 768px) {

  .post_content .cf-area-card-grid .swell-block-button__link {
    color: #304536 !important;
    font-size: 17px !important;
    font-weight: 500 !important;
  }

  .post_content .cf-area-card-grid .swell-block-button__link i,
  .post_content .cf-area-card-grid .swell-block-button__link svg {
    color: #304536 !important;
  }

}


/* ========================================
   Area・CI Exploreリンク スマホ文字サイズ
======================================== */
@media (max-width: 767px) {
  .post_content .cf-area-card-grid .swell-block-button .swell-block-button__link {
    font-size: 18px !important;
  }
}


/* ========================================
   Area タブ枠線非表示
======================================== */
.area-tabs .c-tabBody {
  border: none !important;
}


/* ========================================
   Explore Japan by Area 見出しデザイン
======================================== */
.post_content h2.cf-area-title {
  position: relative;
  margin: 0 0 48px;
  padding: 30px 0 0;
  border: none;
  background: none;
  box-shadow: none;
  font-size: clamp(34px, 4.5vw, 60px);
  line-height: 1.2;
  text-align: left;
}

.post_content h2.cf-area-title::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 70px;
  height: 2px;
  background: #52634e;
}

.post_content h2.cf-area-title::after {
  display: none;
}

@media (max-width: 767px) {
  .post_content h2.cf-area-title {
    padding-top: 24px;
    margin-bottom: 32px;
    font-size: 36px;
  }

  .post_content h2.cf-area-title::before {
    width: 50px;
  }
}


/* ========================================
   Area カード一覧 PC余白調整
======================================== */
@media (min-width: 768px) {

  /* カード同士の横間隔 */
  .post_content .cf-area-card-grid {
    column-gap: 28px !important;
  }

  /* カラムブロック同士の縦間隔 */
  .post_content .cf-area-card-grid + .cf-area-card-grid {
    margin-top: 70px !important;
  }

}


/* ========================================
   Area カード一覧 スマホ文字サイズ調整
======================================== */
@media (max-width: 767px) {

  /* エリア名 */
  .post_content .cf-area-card-grid h2 {
    font-size: 24px !important;
  }

  /* サブエリア名 */
  .post_content .cf-area-card-grid h3 {
    font-size: 14px !important;
  }

}


/* ========================================
   Area カード一覧 スマホ縦余白調整
======================================== */
@media (max-width: 767px) {

  /* 4枚をまとめた親カラム */
  .post_content .cf-area-card-grid {
    row-gap: 24px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* 親カラム同士の間隔 */
  .post_content .cf-area-card-grid + .cf-area-card-grid {
    margin-top: 24px !important;
  }

  /* SWELL標準の子カラム下余白 */
  .post_content .cf-area-card-grid > .wp-block-column,
  .post_content .cf-area-card-grid > .swell-block-column {
    margin-bottom: 10px !important;
  }

}


/* ========================================
   Area カード一覧 最下部スペーサー調整
======================================== */
@media (max-width: 767px) {
  .post_content .cf-area-bottom-spacer {
    height: 10px !important;
    min-height: 10px !important;
  }
}

/* ========================================
   シンプルH1
======================================== */
.post_content h1.simple-h1 {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
  color: inherit !important;
  font-size: 36px;
  font-weight: 600;
  line-height: 1.3;
}

.post_content h1.simple-h1::before,
.post_content h1.simple-h1::after {
  display: none !important;
  content: none !important;
}

/* ========================================
   シンプルH1 スマホ
======================================== */
@media (max-width: 767px) {
  .post_content h1.simple-h1 {
    font-size: 36px;
  }
}

/* ========================================
   区切り線 左揃え
======================================== */
.post_content .divider-left {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* ========================================
   投稿ページ テーブル用2カラムの縦並び
======================================== */
@media (max-width: 1060px) {

  .single-post .post_content .table-columns.wp-block-columns {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
  }

  .single-post .post_content .table-columns.wp-block-columns > .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
  }

}

/* ========================================
   フッター スマホ時のArea一覧を非表示
======================================== */
@media (max-width: 767px) {
  #footer .w-footer__box:first-child {
    display: none !important;
  }
}

/* ========================================
   H2見出し H3と同じデザイン
======================================== */
.post_content h2.h2-small {
  margin: 28px 0 10px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
}

/* スマホ */
@media (max-width: 767px) {
  .post_content h2.h2-small {
    margin: 24px 0 8px;
    font-size: 24px;
  }
}

/* ========================================
   ページコンテンツ 下部マージン調整
======================================== */
.l-content {
  margin-bottom: 2em;
}


/* ========================================
   HOME・About Us 最終CTA 上下余白削除
======================================== */
.home .post_content > .cf-final-cta,
.page-id-133 .post_content > .cf-final-cta {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* ========================================
   HOME・About Us フッター余白調整
======================================== */
.home .l-footer__widgetArea,
.page-id-133 .l-footer__widgetArea {
  padding-top: 40px;
}


/* ========================================
   HOME・About Us メインコンテンツ余白削除
======================================== */
.home #content,
.page-id-133 #content {
  padding-top: 0 !important;
  margin-bottom: 0 !important;
}


/* ========================================
   CI - Journey Highlights H3
======================================== */
.post_content .ci-highlight-title h3 {
    font-size: 1.0rem !important;
    color: #28421f !important;
}

/* ========================================
   Product Page - Accordion
======================================== */

/* アコーディオン項目タイトルを太字に統一 */
.cf-product-page .swell-block-accordion__title {
    font-weight: 700;
}


/* ========================================
   Product Page - Sidebar H3
======================================== */

.cf-product-page .cf-product-sidebar h3 {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
}