/*
Theme Name:BLAZE child
Theme URI:https://tcd-theme.com/tcd120
Description:WordPressテーマ「BLAZE」の子テーマ
Template:blaze_tcd120
Author:TCD
Author URI:https://tcd-theme.com/
Version:1.0
*/

/*
  ここから下にCSSを追記してください。
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');


/* =========================================
   WordPress管理バーのログアウトメニュー重なり対策
   - 固定ヘッダーが管理バーのメニューに被るため調整
   - BLAZEのヘッダー系 z-index を下げ、
     管理バー側を前面に出す
   - 管理バー表示時（ログイン時）のみ適用
========================================= */

body.admin-bar .l-header,
body.admin-bar .p-header-bar,
body.admin-bar .p-header-nav,
body.admin-bar #js-header {
  z-index: 10 !important;
}

body.admin-bar #wpadminbar {
  z-index: 99999 !important;
}

body.admin-bar #wpadminbar .ab-sub-wrapper {
  z-index: 100000 !important;
}


/* =========================================
   ヘッダー最前面化
========================================= */

.p-header-bar {
  position: relative;
  z-index: 1000 !important;
}




/* =====================================
   全ページ共通
===================================== */


/* ヘッダー画像下のキャッチコピー */
.c-archive-header__copy div {
  font-size: 22px;
}

/* アーカイブタイトル色変更 */
.c-archive-header-title {
  font-size: 28px !important;
  font-weight: 600;
  color: #333 !important;
}

/* フッター直前CTA誘導テキスト */
.p-cb-header-catch {
  text-align: center;
  font-size: 26px;
  margin-bottom: 20px;
}

/* =====================================
SP
===================================== */
@media screen and (max-width: 767px) {

  .c-archive-header-title {
    font-size: 22px !important;
  }

  .p-cb-header-catch {
    font-size: 20px;
  }

  .c-archive-header__copy {
    height: auto !important;
    min-height: 60px;
    padding: 10px 16px;
    display: block;
  }

  .c-archive-header__copy div {
    font-size: 16px !important;
    line-height: 1.6;
    white-space: normal;
  }
}

/* =====================================
   1300px以下でSPヘッダーへ切替
===================================== */
@media (max-width: 1300px){

  /* PCグローバルメニュー非表示 */
  .p-header-nav {
    display: none !important;
  }

  /* SPメニューボタン表示 */
  .p-header-nav-sp {
    display: grid !important;
    color: #333 !important;
  }

  /* お問い合わせ・マイページ調整 */
  .p-megamenu01,
  .p-megamenu02 {
    display: none !important;
  }

}

/* 768px~1300pxの間は三本線の右に余白を設ける */
@media (min-width: 768px) and (max-width: 1300px){

  .p-header-nav-sp {
    margin-right: 24px;
  }

}
/* =====================================
   1301px以上ではSPボタンを消す
===================================== */
@media (min-width: 1301px){

  .p-header-nav-sp {
    display: none !important;
  }

}




/* ヘッダー画像の高さを580→750に変更し人物の顔が切れないように */
/* =====================================
共通ヘッダー画像設定
===================================== */

/* 固定ページ（COMPANYなど） */
.c-archive-header__content {
  position: relative;
  width: 100%;
  height: 580px;
  overflow: hidden;
  aspect-ratio: auto !important;
}

.c-archive-header__content img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* サービスページ */
.p-single-service-header__image {
  position: relative;
  width: 100%;
  height: 580px;
  overflow: hidden;
}

.p-single-service-header__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* =====================================
COMPANYページのみ顔位置調整
===================================== */

.page-company .c-archive-header__content img {
  object-position: center 35%;
}

/* =====================================
大型ディスプレイ対応
===================================== */

@media screen and (min-width: 2200px) {

  /* 固定ページ */
  .c-archive-header__content {
    height: 680px;
  }

  .c-archive-header__content img {
    height: 100%;
  }

  /* サービスページ */
  .p-single-service-header__image {
    height: 680px;
  }

  .p-single-service-header__image img {
    height: 100%;
  }

}

/* =====================================
SP時 固定ページヘッダー調整
===================================== */
@media screen and (max-width: 767px) {

  .c-archive-header__content {
    height: 320px;
  }

  .page-company .c-archive-header__image {
    object-position: center 20%;
  }

}

/* =========================
   パンくずリスト　調整
========================= */

@media (any-hover: hover) {
  .c-breadcrumb__item :where(a):hover {
    color: #8bb5e4 !important;
  }
}


@media (max-width:767px){

  .c-breadcrumb{
    height:auto;
    min-height:70px;
    padding:0 10px 15px;
    align-items:center;
  }

  .c-breadcrumb__list{
    flex-wrap:wrap;
    align-items:flex-start;
    row-gap:6px;
    column-gap:8px;
    white-space:normal !important;
    overflow:visible !important;
    line-height: 1.5;
  }

}
/* =====================================
 
20260403~TOPページ　ここから

 ===================================== */


/* =====================================

 ヘッダー グローバルメニュー（全ページ対応）

 ===================================== */

/* ヘッダー外枠 */
.l-header {
  background-color: #fff !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* 透明ヘッダー無効化 */
.l-header[data-header-bar-transparent] {
  background-color: #fff !important;
}

/* ロゴの白化防止 */
.p-header-logo {
  filter: none !important;
}

/* =====================================
   メニュー文字色（最重要）
===================================== */

/* 通常 */
.p-header-nav a {
  color: #333 !important;
}

/* サブメニュー */
.p-header-nav .sub-menu a {
  color: #333 !important;
}

/* ホバー */
.p-header-nav a:hover {
  color: #0F69AB !important;
}

  .p-header-nav-sp {
    justify-self: end;
    display: grid;
    place-items: center;
    font-size: 24px;
    z-index: 2;
  }


/* =====================================
   ヘッダーのグローバルメニュー　レイアウト
===================================== */

.p-header-bar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: 100%;
  padding-inline: 0;
}

/* ロゴ */
.p-header-logo {
  margin-right: auto;
  z-index: 1000;
}

/* ナビ右寄せ */
.p-header-nav {
  margin-left: auto;
}

/* SP時 sticky崩れ修正、左上ロゴ位置調整 */
@media (max-width: 768px) {

  html,
  body,
  .l-outer,
  #js-header {
    overflow: visible !important;
  }

  #js-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
  }

  .p-header-logo {
    margin-left: -18px;
  }

}


/* =====================================
   メニュー共通
===================================== */

.p-header-nav__list {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}

.p-header-nav__list > li {
  position: relative;
}

/* メニュー本体 */
.p-header-nav__list > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 80px;
  padding: 0 14px;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0.03em;
  white-space: normal;
}



/* =====================================
   グローバルメニュー：親
===================================== */

.p-header-nav__list > li {
  position: relative;
}

/* =====================================
   親リンクのみ（見出し化）
===================================== */

.p-header-nav__list .menu-title > a {
  pointer-events: none;
  cursor: default;
}

/* 通常メニュー */
.p-header-nav__list .menu-title:hover > a {
  opacity: 1 !important;
}


/* =====================================
   サブメニュー
===================================== */

.p-header-nav__list > li > ul {
  position: absolute;
  top: 100%;
  left: 0;

  /* 親メニュー幅を基準 */
  min-width: 100%;

  /* 必要時だけ広がる */
  width: max-content;
  max-width: 260px;

  background: #fff;
  z-index: 9999;
}

/* サブメニュー文字 */
.p-header-nav__list > li > ul a {
  display: block;
  padding: 12px 18px;

  line-height: 1.6;

  /* 基本は改行させない */
  white-space: nowrap;
  word-break: keep-all;
}


/* =====================================
SPハンバーガーメニュー背景・文字色
===================================== */

/* SP時 ハンバーガーメニュー */
@media (max-width: 1300px) {

  .p-header-nav-sp {
    color: #333;
  }

  .p-drawer {
    background: #0F69AB !important;
    color: #fff !important;
  }

  .p-drawer-nav a,
  .p-drawer-bottom-buttons-link,
  .p-drawer-bottom-nav a,
  .p-drawer-close {
    color: #fff !important;
  }

  .p-drawer-nav__submenu {
    background: #0b578f !important;
  }

  /* タップ時 */
  .p-drawer-nav a:active,
  .p-drawer-bottom-buttons-link:active,
  .p-drawer-bottom-nav a:active,
  .p-drawer-close:active {
    background: #72A6E0 !important;
    color: #fff !important;
  }

}@media (max-width: 1300px) {

  .p-header-nav-sp {
    color: #333;
  }

  .p-drawer {
    background: #0F69AB !important;
    color: #fff !important;
  }

  .p-drawer-nav a,
  .p-drawer-bottom-buttons-link,
  .p-drawer-bottom-nav a,
  .p-drawer-close {
    color: #fff !important;
  }

  .p-drawer-nav__submenu {
    background: #0b578f !important;
  }

  /* hover時 */
  .p-drawer-nav a:hover,
  .p-drawer-bottom-buttons-link:hover,
  .p-drawer-bottom-nav a:hover,
  .p-drawer-close:hover {
    background: #72A6E0 !important;
    color: #fff !important;
  }

}



/* =========================================
   SPヘッダー位置固定 完全上書き
========================================= */
@media (max-width: 768px) {

  [data-sticky-header="1"],
  [data-header-bar-transparent][data-sticky-header="1"].is-pre-scroll-sticky,
  [data-header-bar-transparent][data-sticky-header="1"].is-scroll-sticky {
    position: sticky !important;
    top: 0 !important;
    transform: none !important;
    transition: none !important;
  }

  .p-header-bar {
    height: 60px !important;
    padding-inline: 20px !important;
    padding-block: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body.admin-bar {
    margin-top: 0 !important;
  }

  html {
    margin-top: 0 !important;
  }

}


/* =====================================
   通常サブメニュー：ホバー
===================================== */

.p-header-nav__list > li:not(:nth-last-child(2)):not(:last-child) > ul a:hover {
  background: #f3f6fa;
}

/* =====================================
   右端メニューだけ右寄せ
===================================== */

.p-header-nav__list > li:last-child > ul {
  left: auto;
  right: 0;
}
/* =====================================
   右側ボタン（マイページ / お問い合わせ）
===================================== */

/* 幅固定 */
.p-header-nav__list > li:nth-last-child(2) > a,
.p-header-nav__list > li:last-child > a {
  width: 120px;
  padding: 0;
}

/* くっつける */
.p-header-nav__list > li:nth-last-child(2) {
  margin-right: -6px;
}

.p-header-nav__list > li:last-child {
  margin-left: -1px;
}

/* ボーダー削除 */
.p-header-nav__list > li:nth-last-child(2) > a,
.p-header-nav__list > li:last-child > a {
  border: none !important;
}



/* ===============================
   メニュー：　マイページ（オレンジ固定）
=============================== */

.p-header-nav__list > li:nth-last-child(2),
.p-header-nav__list > li:nth-last-child(2):hover {
  background: #e05c0f !important;
}

.p-header-nav__list > li:nth-last-child(2) > a,
.p-header-nav__list > li:nth-last-child(2):hover > a {
  color: #fff !important;
  background: transparent !important;
  transition: none !important;
}


/* サブメニュー */
.p-header-nav__list > li:nth-last-child(2) .sub-menu {
  background: #e05c0f;
  border: none;
}

.p-header-nav__list > li:nth-last-child(2) .sub-menu a {
  background: #e05c0f;
  color: #fff !important;
}

.p-header-nav__list > li:nth-last-child(2) .sub-menu a:hover {
  background: #ff7a3a;
}



/* ===============================
   メニュー：　お問い合わせ（水色）
=============================== */

/* 親メニュー */
.p-header-nav__list > li:last-child,
.p-header-nav__list > li:last-child:hover {
  background: #719fd4 !important;
}

.p-header-nav__list > li:last-child > a,
.p-header-nav__list > li:last-child:hover > a {
  background: transparent !important;
  color: #fff !important;
  transition: none !important;
}

/* サブメニュー全体 */
.p-header-nav__list > li:last-child .sub-menu {
  background: #719fd4;
  border: none;
}

/* サブメニューリンク */
.p-header-nav__list > li:last-child .sub-menu a {
  background: #719fd4;
  color: #fff !important;
}

/* サブメニュー hover */
.p-header-nav__list > li:last-child .sub-menu a:hover {
  background: #8bb5e4 !important;
  color: #fff !important;
}

/* ======================================
   ヘッダー下コンテンツ（台形ボタン本体）
====================================== */

/* 文字 */
.p-header-anchor__text {
  color: #333 !important;
  line-height: 1.6;
  transition: color 0.3s ease;
}

/* ===== アクティブ ===== */
.p-header-anchor__item.is-active {
  background: #0f69ab !important;
}

.p-header-anchor__item.is-active .p-header-anchor__text {
  color: #fff !important;
}

/* ===== ホバー ===== */
.p-header-anchor__item:hover {
  background: #0f69ab !important;
}

.p-header-anchor__item:hover .p-header-anchor__text {
  color: #fff !important;
}

/* ===== 斜めパーツ ===== */
.p-header-anchor__item::before,
.p-header-anchor__item::after {
  background: #fff;
  transition: all 0.3s ease;
}

.p-header-anchor__item.is-active::before,
.p-header-anchor__item.is-active::after,
.p-header-anchor__item:hover::before,
.p-header-anchor__item:hover::after {
  background: #0f69ab !important;
}


/* =========================================
   ヘッダー下スライダー矢印の重なり対策
========================================= */

.p-header-anchor {
  position: relative;
  z-index: 1 !important;
}

.p-header-anchor__arrows,
.p-header-anchor__arrow {
  z-index: 1 !important;
}


/* =========================================
   右矢印横の白線除去
========================================= */

.p-header-anchor__arrow svg {
  display: block;
}

.p-header-anchor__arrow--next {
  right: 0;
  border-left: none !important;
  box-shadow: none !important;
}

.p-header-anchor__arrow--next::before,
.p-header-anchor__arrow--next::after {
  display: none !important;
}



.p-header-anchor {
  overflow: hidden;
}

.p-header-anchor__track {
  margin-right: -1px;
}


/* =====================================
MV ヘッダー画像の表示位置調整
===================================== */

.p-mv2-content{
  padding-top:70px;
  box-sizing:border-box;
}


/* =====================================
MV 2枚目（Carbon Vision）
テキスト幅調整 + PC画像調整
===================================== */

/* テキストと画像の間隔 */
#js-mv2-slide02 .p-mv2-content-flex{
  gap: 0 !important;
}

/* テキストエリア */
#js-mv2-slide02 .p-mv2-text-content{
  width: 650px !important;
  min-width: 650px !important;
  flex-shrink: 0 !important;
}

/* タイトル */
#js-mv2-slide02 .p-mv2-content-title{
  line-height: 1.3;
}

/* 画像エリア */
#js-mv2-slide02 .p-mv2-content-clip-image{
  inline-size: 760px !important;
  flex-shrink: 0;
  overflow: visible;
  margin-right: 0 !important;
}

/* 画像本体 */
#js-mv2-slide02 .p-mv2-content-clip-image img{
  transform: translateX(-90px) scale(1.22);
  transform-origin: center center;
  filter: drop-shadow(0 30px 40px rgba(0,0,0,.24));
}



/* =====================================
SP版 MV共通調整
===================================== */
@media screen and (max-width: 767px) {

  /* -----------------------------
     SP時はサブ画像を非表示
  ----------------------------- */
  .p-mv2-content-clip-image{
    display:none !important;
  }

  /* -----------------------------
     テキストを中央揃え
  ----------------------------- */
  .p-mv2-text-content{
    position:absolute !important;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%, -50%) !important;
    width:100% !important;
    min-width:unset !important;
    max-width:100% !important;
    padding-inline:10px !important;
    text-align:center;
    row-gap: 40px;
  }

  /* -----------------------------
     2枚目だけ残っている固定幅解除
  ----------------------------- */
  #js-mv2-slide02 .p-mv2-text-content{
    width:100% !important;
    min-width:unset !important;
  }

  /* -----------------------------
     タイトル
  ----------------------------- */
  .p-mv2-content-title{
    line-height:1.5 !important;
  }

  /* -----------------------------
     CTA中央
  ----------------------------- */
  .p-mv2-button{
    justify-content:center;
  }

}

/* =====================================
SP時 MVの高さを短くする ※100から後で調整
===================================== */
@media screen and (max-width: 767px) {

  .p-mv2,
  .p-mv2 .splide__track,
  .p-mv2 .splide__list,
  .p-mv2 .splide__slide,
  .p-mv2 .p-mv2__slide,
  .p-mv2-content {
    min-height: 100svh !important;
    height: 100svh !important;
    block-size: 100svh !important;
  }

}

/* ===============================
 MVボタン (SEオーシャンブルー)
=============================== */

/* 通常（白枠） */
.home .p-mv2 .p-mv2-content-button {
  color: #fff;
  border: 1px solid #fff;
  background: transparent;
}

/* hover（青） */
@media (any-hover: hover) {
  .home .p-mv2 .p-mv2-content-button:hover {
    background-color: #0f69ab !important;
    border-color: #0f69ab !important;
    color: #fff !important;
  }
}

/* ===============================
 CBボタン（large_banner）＝MVと同じ仕様
=============================== */

/* 通常（白枠） */
.home .p-cb-large_banner .c-button01 {
  background: transparent !important;
  color: #fff !important;
  border: 1px solid #fff !important;
}


/* hover（青） */
@media (any-hover: hover) {
  .home .p-cb-large_banner .c-button01:hover {
    background-color: #0f69ab !important;
    border-color: #0f69ab !important;
    color: #fff !important;
  }
}

/* ===============================
 CBボタン 青グラデーション
=============================== */

/* 通常 */
.home .p-cb-button.c-button01 {
  background: linear-gradient(135deg, #1e88d8 0%, #0f69ab 100%) !important;
  color: #fff !important;
  border: none !important;

  box-shadow: 0 4px 12px rgba(15, 105, 171, 0.3);
  transition: all 0.25s ease;
}


/* hover */
@media (any-hover: hover) {
  .home .p-cb-button.c-button01:hover {
    background: linear-gradient(135deg, #2a9df4 0%, #1479c9 100%) !important;

    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 105, 171, 0.4);
  }
}

/* =====================================
SP ボタン上余白調整
===================================== */
@media screen and (max-width: 767px) {

  .home .p-cb-button{
    margin: 50px auto 30px !important;
  }

}


/* ========================================
   フッター背景色変更
======================================== */
.l-footer {
  background-color: #0f69ab !important;
}

/* 内部エリアも念のため統一 */
.l-footer_inner,
.p-footer-main,
.p-footer-logo_sns,
.p-footer-copyright {
  background-color: #0f69ab !important;
}

/* テキスト・リンクは白で統一 */
.l-footer,
.l-footer a {
  color: #ffffff;
}

/* SNSアイコンも白に */
.p-footer-logo_sns svg,
.p-footer-logo_sns i {
  fill: #ffffff;
  color: #ffffff;
}

/* フッター本体 */
.p-footer-main {
  background-color: #0f69ab !important;
  border-image: none !important;
}

/* テキスト白 */
.p-footer-main,
.p-footer-main a {
  color: #fff;
}

/* フッターの縦線を削除 */
.p-footer-nav {
  border-left: none !important;
}

.p-footer-main .p-footer-nav:last-of-type {
  border-right: none !important;
}


/* =================================
   見出しフォント変更（Noto Sans JP）
================================= */
/* タイトル */
.p-cb-header-title,
.c-inview-fade-in.is-active .p-cb-header-title {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-weight: 900 !important; 
  text-shadow: 0 0 0.5px #000;
}

/* サブタイトル */
.p-cb-header-sub_title,
.c-inview-fade-in.is-active .p-cb-header-sub_title {
  font-family: 'Noto Sans JP', sans-serif !important;
  font-weight: 700 !important;
  font-size:20px;

  /* デザインリセット */
  background: none !important;
  border: none !important;
  padding: 0 !important;

  /* 色を固定（アクセントカラーを使わない） */
  color: #333 !important;
}




/* =====================================
コンテンツビルダー見出し サブ見出し　間隔調整
===================================== */

/* コンテンツビルダー共通 */
.p-cb {
  row-gap: 140px;
}

.p-cb-header {
  row-gap: 40px;
}

.p-cb-header-main_contents {
  gap: 30px;
}

.p-cd-header-title_contents{
  gap: 10px !important;
}

@media screen and (max-width: 767px){
  /* コンテンツビルダー共通 */
  .p-cb {
    row-gap: 60px;
  }

  .p-cd-header-title_contents{
    gap: 8px !important;
  }

  .p-cb-header-subtitle {
    line-height: 2;
    font-size: 15px;
  }
}




/* ===========================

   TOP：SERVICE サービス一覧

   ========================= */

/* --- ヘッダー画像の暗さを調整 --- */
.p-service-header-overlay{
  background-color: color-mix(in srgb, #000 18%, transparent) !important;
}

/* --- 全体 --- */
.service-item{
  background: #f5f5f5;
  padding: 0 30px;
  margin-bottom: 40px;
}

/* 横並び */
.service-inner{
  display: flex;
  align-items: center;
}

/* --- 画像 --- */
.service-image{
  width: 35%;
}

.service-image img{
  width: 100%;
  height: auto;
  display: block;
}

/* --- コンテンツ --- */
.service-content{
  width: 65%;
  display: flex;
  flex-direction: column;
}

/* タイトル */
.service-title{
  font-size: 22px;
  font-weight: 700;
  color: #1c5fa8;
  padding-bottom: 8px;
  margin-bottom: 0;
  line-height: 1.5;
  position: relative;
}

/* グラデーション下線 */
.service-title::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(to right, #A5CEFE, #0F69AB);
}

/* キャッチ */
.service-catch{
  font-size: 18px;
  color: #666;
  margin-bottom: 10px;
}

/* 説明文 */
.service-desc{
  color: #333;
  font-size: 15px;
  line-height: 2;
  display: block;
  overflow: visible;
}

/* --- ★TOPと会社概要ページの場合、「続きを見る」ボタンを右寄せに --- */
.home .service-button,
.page-id-250 .service-button{
  text-align: right;
}

.service-button-link{
  display: inline-block;
  min-width: 140px;
  padding: 10px 20px;
  border: 1px solid #0f69ab;
  border-radius: 20px;
  color: #0f69ab;
  background: transparent;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* hover（カード全体でも反応） */
@media (any-hover: hover){

  .service-link:hover .service-button-link{
    background-color: #0f69ab;
    border-color: #0f69ab;
    color: #fff;
  }

}

/* カードを縦→横構造に */
.p-cb-service .p-cd-service-cards{
  display: block;
}

/* コンテンツ余白調整 */
.p-cd-service_item .p-service-cards-item__content{
  padding: 20px 5px 20px 30px;
}

/* テキスト間余白 */
.p-service-cards-item__content{
  gap: 30px;
}

/* 本文 */
.p-service-cards-item_desc{
  font-size: 14px;
}

/* =========================
   SP
========================= */

@media (max-width:767px){

  .service-inner{
    flex-direction: column;
  }

  .service-item{
    padding: 25px 25px 35px;
    overflow: visible;
  }

  .service-image,
  .service-content{
    width: 100%;
  }

  .p-cd-service_item .p-service-cards-item__content{
    padding: 0 10px;
  }

  .service-content{
    position: static;
    padding-bottom: 0;
  }

  .p-service-cards-item__content{
    gap: 20px;
  }

  .service-title{
    font-size: 18px;
    text-align: center;
    line-height: 1.4;
    margin-bottom: 6px;
  }

  /* 説明文：SPも全文表示 */
  .service-desc,
  .p-service-cards-item_desc,
  .service-desc.c-line-clamp {
    display: block !important;
    -webkit-box-orient: initial !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    line-height: 1.8;
    margin-bottom: 8px;
  }
  
  /* --- SP時は、「続きを見る」ボタンを真ん中寄せに --- */
  .home .service-button,
  .page-id-250 .service-button{
    text-align: center;
  }


  .service-content{
    display:flex;
    flex-direction:column;
  }

  .service-desc{
    margin-bottom:20px;
  }

  .service-button {
    position: static !important;
    margin-top: 0;
    clear: both;
  }

}


/* ===========================

   TOP：NEWS お知らせ一覧

   ========================= */
/* ページネーション */
.c-pagination :where(.nav-links) {
  display: grid;
  grid-template-columns: repeat(auto-fit, 50px);
  grid-template-rows: 50px;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  font-family: Arial;
  text-align: center;
}

.c-pagination :where(.nav-links > *) {
  display: grid;
  place-items: center;
  color: #000000;
  border: 1px solid #ddd;
  border-radius: 50%;
  background: #fff;
  transition: 0.3s ease;
}

.c-pagination :where(.nav-links > * + *) {
  margin-left: -1px;
}

/* 現在ページ */
.c-pagination :where(.nav-links > .current) {
  z-index: 1;
  color: #ffffff !important;
  border-color: #0F69AB !important;
  background: #0F69AB !important;
}

/* ホバー */
@media (any-hover: hover) {
  .c-pagination :where(.nav-links > a:hover) {
    z-index: 1;
    color: #0F69AB !important;
    border-color: #0F69AB !important;
    background: #EAF4FC !important;
  }
}

@media (max-width: 767px) {
  .c-pagination :where(.nav-links) {
    grid-template-columns: repeat(auto-fit, 50px);
    grid-template-rows: 50px;
  }
}

@media(max-width:380px) {
  .c-pagination :where(.nav-links) {
    grid-template-columns: repeat(auto-fit, 40px);
    grid-template-rows: 40px;
  }
}

/* =====================================
   お知らせカテゴリボタン（共通）
===================================== */

/* 説明テキストと検索カテゴリの間を短く調整 */

.c-archive-header {
    margin-bottom: 70px;
}


.category_terms_list_post .category_item{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: 160px;
  height: 60px;
  padding-inline: 22px;
  border-radius: 9999px;
  border: 1.5px solid;
  background: #fff;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
  transition: all 0.3s ease;
}


/* =====================================
   お知らせ カテゴリ検索ボタン
===================================== */

.category_terms_list_post .category_item{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: 160px;
  height: 60px;
  padding-inline: 22px;
  border-radius: 9999px;
  border: 1.5px solid;
  background: #fff;
  font-size: 14px;
  line-height: 1;
  white-space: nowrap;
  transition: all 0.3s ease;
}

/* 検索カテゴリ：　お知らせ */
.category_terms_list_post .category_item[href*="news"]{
  border-color: #C4D6E8 !important;
  color: #0F69AB !important;
}

.category_terms_list_post .category_item[href*="news"]:hover,
.category_terms_list_post .category_item[href*="news"].is-current{
  background: #0F69AB !important;
  border-color: #0F69AB !important;
  color: #fff !important;
}

/* 検索カテゴリ：　プレスリリース */
.category_terms_list_post .category_item[href*="press-release"]{
  border-color: #F4BB9B !important;
  color: #C66D3B !important;
}

.category_terms_list_post .category_item[href*="press-release"]:hover,
.category_terms_list_post .category_item[href*="press-release"].is-current{
  background: #C66D3B !important;
  border-color: #C66D3B !important;
  color: #fff !important;
}

/* 検索カテゴリ：　サービス情報 */
.category_terms_list_post .category_item[href*="service-info"]{
  border-color: #B7D4B0 !important;
  color: #5D935F !important;
}

.category_terms_list_post .category_item[href*="service-info"]:hover,
.category_terms_list_post .category_item[href*="service-info"].is-current{
  background: #5D935F !important;
  border-color: #5D935F !important;
  color: #fff !important;
}



/* =====================================
   SP
===================================== */

@media (max-width: 767px) {

  .category_terms_list,
  .category_terms_list_post {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    justify-items: center;
  }

  .category_terms_list a,
  .category_terms_list_post a {
    width: 100%;
    max-width: 320px !important;
    min-width: unset !important;
    height: 72px;
  }

  .c-archive-header-terms {
    width: calc(100% - 40px) !important;
    margin-inline: auto !important;
    overflow: visible !important;
    padding-inline: 0 !important;
  }

}

/* ===========================

   固定ページ：NEWS お知らせ

   ========================= */


/* お知らせの更新日を非表示 */
.c-date-item.c-date--updated {
  display: none !important;
}

/* =====================================
  カテゴリ（カード・個別）
===================================== */

/* 親 */
.p-news-cards-item_no_img_content .c-category_type{
  min-width: 140px;
  border: 1.5px solid !important;
  border-radius: 9999px;
  background: #fff !important;
  transition: all 0.3s ease;
}

/* 中の文字 */
.p-news-cards-item_no_img_content .c-category_type a{
  font-weight: 500;
}


/* ===== カテゴリ：　お知らせ ===== */

.p-news-cards-item_no_img_content .c-category_type:has(a[href*="news"]){
  border-color: #C4D6E8 !important;
}

.p-news-cards-item_no_img_content .c-category_type a[href*="news"]{
  color: #0F69AB !important;
}

.p-news-cards-item_no_img_content .c-category_type:hover:has(a[href*="news"]){
  background: #0F69AB !important;
  border-color: #0F69AB !important;
}

.p-news-cards-item_no_img_content .c-category_type:hover:has(a[href*="news"]) a{
  color: #fff !important;
}


/* ===== カテゴリ：　プレスリリース ===== */

.p-news-cards-item_no_img_content .c-category_type:has(a[href*="press-release"]){
  border-color: #F4BB9B !important;
}

.p-news-cards-item_no_img_content .c-category_type a[href*="press-release"]{
  color: #C66D3B !important;
}

.p-news-cards-item_no_img_content .c-category_type:hover:has(a[href*="press-release"]){
  background: #C66D3B !important;
  border-color: #C66D3B !important;
}

.p-news-cards-item_no_img_content .c-category_type:hover:has(a[href*="press-release"]) a{
  color: #fff !important;
}


/* ===== カテゴリ：　サービス情報 ===== */

.p-news-cards-item_no_img_content .c-category_type:has(a[href*="service-info"]){
  border-color: #B7D4B0 !important;
}

.p-news-cards-item_no_img_content .c-category_type a[href*="service-info"]{
  color: #5D935F !important;
}

.p-news-cards-item_no_img_content .c-category_type:hover:has(a[href*="service-info"]){
  background: #5D935F !important;
  border-color: #5D935F !important;
}

.p-news-cards-item_no_img_content .c-category_type:hover:has(a[href*="service-info"]) a{
  color: #fff !important;
}

/* ===== 個別記事：　お知らせタイトルホバー時　*/
@media (any-hover: hover) {
  .p-news-cards-item_no_img_top .p-news-cards-item__title:hover {
    color: #0F69AB;
    opacity: 1;
  }
}


/* =============================

  TOP：　フリースペース：CONTACT

  ============================= */
.free-contact-box {
  text-align: center;
}

/* 本文 */
.free-text {
  line-height: 2;
  margin-bottom: 20px !important; /* ←1行空け */
}

/* リンク */
.free-contact-link a {
  color: #036EB7;
  border-bottom: 2px solid #036EB7;
  text-decoration: none;
  font-weight: 500;
  transition: all 0.3s ease;
}

/* ホバー時（少し薄く） */
.free-contact-link a:hover {
  color: #5aa3db;
  border-bottom-color: #5aa3db;
}


/* フッターとの余白を広げる */
@media (max-width: 991px) {
    .l-container {
        padding-block: 0 50px !important;
    }
}

/* =============================
   TOP CONTACT 余白調整
============================= */

#free .p-cb-header {
  row-gap: 24px !important;
  margin-bottom: 0 !important;
}


/* =============================

  TOP：　フッター　会社情報ブロック

  ============================= */


.company-info-section {
  background: #f7f9fb;
  padding: 60px 20px;
}

.company-inner {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  align-items: center; 
  justify-content: space-between;
  gap: 50px;
}

/* =========================
  左：Sailar Energy　ロゴ
========================= */
.company-left img {
  width: 200px;
}

/* =========================
  中央：会社情報
========================= */

/* フリガナ */
.company-furigana {
  font-size: 12px;
  color: #666;
  margin-bottom: 3px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 10px 10px 0 /* ←微調整 */
}

.company-center h3 {
  font-size: 24px;
  margin-bottom: 14px;
  color: #2F2724;
}

.company-center p {
  line-height: 1.7;
  font-size: 14px;
  color: #333;
}

/* =========================
  右：NSGロゴ＋登録ボックス
========================= */

/* NSGロゴ */
.company-nsg-logo {
  margin-bottom: 15px;
  text-align: center;
}

.company-nsg-logo img {
  width: 120px;
}

/* 登録ボックス */
.company-box {
  border: 1px solid #ddd;
  border-radius: 0; /* ← radius削除 */
  overflow: hidden;
  min-width: 260px;
}

/* ヘッダー */
.box-head {
  background: linear-gradient(to right, #82b2e8, #0F69AB);
  color: #fff;
  padding: 10px 20px;
  font-size: 13px;
  text-align: center;
}

/* 本文 */
.box-body {
  padding: 18px;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  letter-spacing: 1px;
  color: #333;
  background-color: #FFF;
}

/* =========================
  レスポンシブ
========================= */
@media (max-width: 768px) {
  .company-inner {
    flex-direction: column;
    text-align: center;
    gap: 30px;
  }

  .company-info-section {
    padding: 20px 20px;
  }
  .company-left img {
    width: 160px;
  }

  .company-nsg-logo img {
    width: 130px;
  }

  .company-box {
    width: 100%;
    max-width: 320px;
  }
}


/* =============================================

  TOP：　フッター

  ============================================= */

  /* =====================================
　　スポンサー情報
===================================== */
.sponsor-info-section {
  background: #f7f9fb;
  padding: 12px 0 70px;
}

/* 見出し */
.sponsor-title-blue {
  font-size: 28px !important;
  color: #004C97 !important;
  margin: 0 0 30px !important;
  text-align: center;
  line-height: 1.5;
}

/* ロゴエリア */
.sponsor-logo-grid {
  max-width: 900px;
  margin: 0 auto 30px;

  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

/* ロゴカード */
.sponsor-logo-item {
  width: 160px;
  height: 95px;

  background: #fff;
  border: 1px solid #bdbdbd;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}

/* ロゴ画像 */
.sponsor-logo-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* リンク */
.sponsor-logo-item a {
  display: block;
  transition: opacity 0.3s ease;
}

/* hover */
.sponsor-logo-item a:hover {
  opacity: 0.7;
}

/* テキスト */
.sponsor-text {
  font-size: 14px;
  color: #333;
  line-height: 1.9;
  text-align: center;
  max-width: 900px;
  margin: 0 auto;
}

/* =====================================
SP
===================================== */
@media (max-width: 768px){

  .sponsor-info-section {
    padding: 30px 20px 36px;
  }

  .sponsor-title-blue {
    font-size: 22px !important;
    line-height: 1.6;
    margin-bottom: 24px !important;
  }

  .sponsor-logo-grid {
    gap: 18px;
    margin-bottom: 32px;
  }

  .sponsor-logo-item {
    width: calc(50% - 9px);
    max-width: 230px;
    height: 92px;
  }

  /* 最後の1枚中央 */
  .sponsor-logo-item:last-child {
    margin-left: auto;
    margin-right: auto;
  }

  .sponsor-text {
    font-size: 13px;
    line-height: 2;
    text-align: left;
  }

}

/* ======================================
   フッターバナー Swiper
====================================== */

.footer-banner-section {
  background: #f7f9fb;
  padding: 0 0 80px;
  overflow: visible !important;
}

.footer-banner-inner {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  overflow: visible !important;
}

/* ===============================
   Swiper本体
=============================== */

.footer-swiper {
  max-width: 720px;
  margin: 0 auto;
  position: relative;
  overflow: hidden !important;
}

/* Swiper全体 */
.swiper {
  overflow: hidden !important;
}

/* ===============================
   スライド
=============================== */

.footer-swiper .swiper-slide {
  box-sizing: border-box;
  padding: 0 2px;
}

.footer-swiper .swiper-slide a {
  display: block;
}

/* 画像 */
.footer-swiper img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid #d9d9d9;
}

/* ===============================
   矢印
=============================== */

.footer-prev,
.footer-next {
  position: absolute;
  top: 77%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  z-index: 100;
  cursor: pointer;
  pointer-events: auto;
}

/* 左 */
.footer-prev {
  left: 40px;
}

/* 右 */
.footer-next {
  right: 40px;
}

/* Swiper標準矢印 */
.swiper-button-prev::after,
.swiper-button-next::after {
  color: #0f69ab;
  font-size: 24px !important;
  font-weight: bold;
}

/* ===============================
   SP
=============================== */
@media (max-width: 768px) {

  .footer-banner-section {
    padding: 30px 20px;
  }

  .footer-banner-inner {
    padding: 0;
  }

  /* スライダー中央寄せ */
  .footer-swiper {
    width: 85%;
    margin: 0 auto;
    overflow: visible;
  }

  /* スライド */
  .footer-swiper .swiper-slide {
    padding: 0;
  }

  /* バナー */
  .footer-swiper img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* 矢印共通 */
  .footer-prev,
  .footer-next {
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
  }

  /* 左矢印 */
  .footer-prev {
    top: 66px;
    left: -16px;
  }

  /* 右矢印 */
  .footer-next {
    top: 66px;
    right: -16px;
  }

  /* 矢印サイズ */
  .swiper-button-prev::after,
  .swiper-button-next::after {
    font-size: 22px !important;
  }

}

/* ===============================
   フッターメニュー 4カラム
=============================== */

/* ========================================
   見出し
======================================== */

.p-footer-nav {
  line-height: 1.4;
  padding-left: 20px;
  
}


.p-footer-nav .footer-title > a {
  pointer-events: none;
  font-weight: bold;
  cursor: default;
  display: block;
  margin-bottom: 10px;
}

/* 見出しには矢印を付けない */
.p-footer-nav .footer-title > a::before {
  display: none;
  content: none;
}

/* リンク風だけどクリック不可 */
.p-footer-nav .footer-nolink > a {
  pointer-events: none;
  cursor: default;
  opacity: 0.9;
}

/* 長いタイトル用 */
.p-footer-nav .footer-long > a {
  display: inline-block;
  line-height: 1.9;
  letter-spacing: 0.02em;
  word-break: auto-phrase;
  font-size: 0.9em;
}


/* ========================================
   4カラムレイアウト
======================================== */

/* 4列均等ではなく3⇔4列目間を広げる */
/* 横並び */
.p-footer-main--row {
  display: flex;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
  align-items: flex-start;
}

/* 共通 */
.p-footer-nav {
  line-height: 1.4;
  padding-left: 20px;
  border-left: none !important;
  min-width: 0;
}

/* 1列目 */
#menu-footer-menu-1 {
  flex: 1;
}

/* 2列目 */
#menu-footer-menu-2 {
  flex: 1;
}

/* 3列目（契約・規約を少し広め） */
#menu-footer-menu-3 {
  flex: 1.35;
}

/* 4列目 */
#menu-footer-menu-4 {
  flex: 0.9;
}

/* 各項目 */
.p-footer-nav--row li {
  margin-bottom: 14px;
}

/* リンク */
.p-footer-nav--row a {
  display: inline-block;
  line-height: 1.7;
}

/* ========================================
   通常リンクだけ矢印
======================================== */

.p-footer-nav li:not(.footer-title) > a::before {
  content: "›";
  display: inline-block;
  margin-right: 8px;
  opacity: 0.7;
  transition: transform 0.2s ease;
}

/* hover */
.p-footer-nav li:not(.footer-title) > a:hover::before {
  transform: translateX(2px);
}

/* =====================================
   フッターメニュー（見出し＆リンク制御）
===================================== */

/* 見出し */
.p-footer-nav .footer-title > a {
  pointer-events: none;
  font-weight: bold;
  cursor: default;
  display: block;
  margin-bottom: 10px;
}

/* 見出しには矢印を付けない */
.p-footer-nav .footer-title > a::before {
  display: none;
  content: none;
}

/* クリック不可リンク */
.p-footer-nav .footer-nolink > a {
  pointer-events: none;
  cursor: default;
  opacity: 0.9;
  text-decoration: none;
}

/* hover時 */
.p-footer-nav .footer-title > a:hover,
.p-footer-nav .footer-nolink > a:hover {
  color: inherit;
}

/* ========================================
   長いタイトルの場合　※いったん使用無し
======================================== */

.p-footer-nav .footer-long > a {
  display: inline-block;
  line-height: 1.9;
  letter-spacing: 0.02em;
  word-break: auto-phrase;
  font-size: 0.9em;
}

.p-footer-nav .footer-long > a::before {
  position: relative;
  top: -1px;
}


/* =====================================
   フッター：横長の画像バナー カスタム
===================================== */
.p-footer-4banner-item-icon {
  border: 1px solid #036EB7;
  opacity: .5;
  transition: opacity .3s ease;
}

.p-footer-4banner-item-icon svg {
  fill: #036EB7;
}

.p-footer-4banner-item-title {
    font-size: 22px;
    color: #333;
}

.p-footer-4banner-item_subtitle {
    font-size: 16px;
    color: #333;
}

/* =====================================
   フッター：コピーライト白帯
===================================== */


/* フッター背景 */
.l-footer {
  background: #0F69AB;
}

/* 内側の余計な背景を無効化 */
.l-footer_inner {
  background: transparent !important;
}




/* =====================================
   フッター　コピーライト（白帯・端まで表示）
===================================== */

.p-footer-copyright {
  background: #fff !important;
  color: #333 !important;
  block-size: 50px;

  /* 画面端まで広げる（重要） */
  width: 100vw;
  margin-left: calc(50% - 50vw);

  /* レイアウト */
  text-align: center;
  box-sizing: border-box;

  border-top: 1px solid rgba(0,0,0,0.05);
}

/* 中の余計な余白リセット */
.p-footer-copyright p {
  margin: 0;
}

/* フォント微調整（任意） */
.p-footer-copyright {
  font-size: 13px;
  letter-spacing: 0.05em;
}


/* =====================================================
   上に戻るボタン（全ページ共通）
===================================================== */

.back-to-top {
  position: fixed;
  right: 0;
  bottom: 0;

  width: 60px;
  height: 60px;

  background: rgba(0, 0, 0, 0.2);

  color: #fff;
  text-decoration: none;

  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 9999;

  opacity: 0;
  visibility: hidden;

  transition:
    background 0.3s ease,
    opacity 0.3s ease;
}

/* 表示時 */
.back-to-top.is-active {
  opacity: 1;
  visibility: visible;
}

/* ホバー */
.back-to-top:hover {
  background: linear-gradient(
    135deg,
    #0F69AB 0%,
    #2A8FD8 100%
  );
}
/* 矢印 */
.back-to-top__arrow {
  position: relative;

  width: 14px;
  height: 14px;

  border-top: 3px solid #fff;
  border-right: 3px solid #fff;

  transform: rotate(-45deg);

  margin-top: 8px;

  font-size: 0;
}

/* SP */
@media (max-width: 768px) {

  .back-to-top {
    width: 54px;
    height: 54px;
  }

  .back-to-top__arrow {
    width: 12px;
    height: 12px;
  }

}


/* =====================================
   サービス一覧アーカイブ（カラム１行ずつ）
===================================== */

.service-list-wrap {
  max-width: 100%;
  overflow-x: hidden;
}

.service-item {
  width: 100%;
}

/* ▼ grid完全無効化（最重要） */
.p-archive.p-archive--service.p-service-cards {
  display: block !important;
}

/* ▼ 子要素も横幅100% */
.p-archive.p-archive--service.p-service-cards > * {
  width: 100% !important;
  max-width: 100% !important;
}

/* ▼ articleも追加 */
.p-archive.p-archive--service.p-service-cards article,
.p-archive.p-archive--service.p-service-cards .service-section {
  width: 100% !important;
  display: block !important;
  padding: 60px 30px;
  margin-bottom: 40px;
}


/* SP */
@media (max-width: 768px) {

  .p-archive.p-archive--service.p-service-cards article,
  .p-archive.p-archive--service.p-service-cards .service-section {
    padding: 40px 26px;
}


}


/* =====================================
   レイアウト（縦1列）
===================================== */

.service-section {
  background: #f7f7f7;
  padding: 30px;
  margin-bottom: 40px;
  text-align: center;
}

/* =====================================
   画像
===================================== */

.service-section__image {
  width: 100%;
  height: 250px;
  overflow: hidden;
  margin: 20px 0;
}

.service-section__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.service-section:hover .service-section__image img {
  transform: scale(1.05);
}

/* =====================================
   タイトル
===================================== */

.service-section__title {
  font-size: 22px;
  color: #0f69ab;
  margin-bottom: 25px;
}

.service-section__title::after {
  content: "";
  display: block;
  width: 160px;
  height: 5px;
  margin: 12px auto 0;
  background: linear-gradient(to right, #A5CEFE, #0F69AB);
}



/* =====================================
   「続きを見る⇒」ボタンを真ん中揃えに
===================================== */
.post-type-archive-service .service-button{
  text-align: center;
}

.service-button-link {
  display: inline-block;
  min-width: 140px;
  padding: 10px 20px;
  border: 1px solid #0f69ab;
  border-radius: 20px;
  color: #0f69ab;
  background: transparent;
  font-size: 13px;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* ▼ カードhoverでも反応 */
.service-section:hover .service-button-link {
  background-color: #0f69ab;
  border-color: #0f69ab;
  color: #fff;
}


/* SP */

@media screen and (max-width: 768px) {

  .service-section {
    padding: 20px;
  }

  .service-section__image {
    height: 160px;
  }

  .service-section__title {
    font-size: 20px !important;
    line-height: 1.4;
  }

}


/* =====================================
   サービス：　アーカイブ一覧キャッチコピー見出し
===================================== */
.service-section__lead {
    font-size: 20px !important;
    font-weight: bold;
    line-height: 1.3;
    margin: 40px 0 30px !important;
}

.service-section__desc {
    font-size: 16px !important;
    color: #333;
    margin-bottom: 30px;
     line-height: 1.8; 
}


/* SP */

@media screen and (max-width: 768px) {
  .service-section__lead {
    margin: 22px 0 18px !important;
  }

  .service-section__desc {
    font-size: 14px !important;
    margin-bottom: 24px;
    text-align: left;
  }

}

/* =====================================
   サービスカテゴリ　アクティブ＆ホバー
===================================== */

@media (any-hover: hover){
  .category_terms_list_post a:hover,
  .category_terms_list_post a.is-current {
    background-color: #0f69ab !important;
    color: #fff !important;
    border-color: #0f69ab !important;
    box-shadow: 0 4px 12px rgba(15, 105, 171, 0.3);
  }
}

/* =====================================
   サービスカテゴリ（可変グリッド・中央揃え）
   ※ボタン幅に応じて自動折り返し（現在は3 + 3）
===================================== */

.category_terms_list_post {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px 24px;
}

/* ▼ 各ボタン（幅広げる） */
.category_terms_list_post a {
  flex: 0 0 280px;     /* ← 幅ここで調整（220〜300OK） */
  max-width: 100%;
  text-align: center;
}

/* ▼ 2段目も同じ幅（維持） */
.category_terms_list_post a:nth-child(n+5) {
  flex: 0 0 280px;
}

/* ▼ ボタン本体 */
.category_item {
  min-width: auto;
  padding: 14px 28px;
  white-space: normal;   /* ← 折り返し許可（重要） */
  line-height: 1.4;
}



/* ===============================

   COMPANY：　会社概要ページ 

   =============================== */

/* 本体 */
.page-id-250 .p-company-headline {
  position: relative;
  display: flex;
  justify-content: flex-start; /* ← 左寄せ */
  align-items: center;   /* ← 縦中央 */
  margin: 60px 0 40px;
  padding: 0 0 0 20px;
  font-size: 28px;
  font-weight: 700;
  color: #111;
  border: none !important;
}

/* 縦線 */
.page-id-250 .p-company-headline::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 80%;
  background: #0F69AB;
}

/* 下線系が残っている場合の強制リセット */
.page-id-250 .p-company-headline::after {
  display: none !important;
}

/* 直後の余白調整 */
.page-id-250 .p-company-headline + * {
  margin-top: 0;
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
  .page-id-250 .p-company-headline {
    font-size: 24px;
    margin: 36px 0 12px;
    padding-left: 16px;
    
  }

  .page-id-250 .p-company-headline::before {
    width: 4px;
    height: 75%;
  }
}

/* =====================================
COMPANYページのみ lead 下余白調整
===================================== */

.page-id-250 .sec-lead {
  padding-bottom: 60px;
}


/* =======================================
  01:  3カラムの図と事業者番号セクション
======================================= */
.company-intro-section{
  position: relative;

  width: 100vw;
  left: 50%;
  transform: translateX(-50%);

  background: linear-gradient(to bottom right, #ffffff, #D6E9FF);
  padding: 50px 20px;
}

.company-intro-inner{
  max-width: 1000px;
  margin: 0 auto;
}

/* =========================
  タイトル
========================= */
.company-intro-title{
  text-align: center !important;
  font-size: 36px !important;
  color: #20509E !important;
  margin-bottom: 40px !important;
  font-weight: bold !important;
  text-shadow: 0 0 0.6px #20509E;
}

/* =========================
  3カラムのカード全体
========================= */
.company-intro-cards{
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 11px;
}

/* =========================
  各カード
========================= */
.company-intro-card {
  flex: 1;
  background: #fff;
  border: 2px solid #D9D9D9;
  border-radius: 20px;
  padding: 14px 18px 18px;
  text-align: center;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.15);
}

/* 中央カードを大きく */
.company-intro-card.is-center{
  flex: 1.3;
  text-align: center;
}

/* =========================
  左右カード用
========================= */
.company-intro-card:not(.is-center) .company-intro-image{
  width: 100%;
  height: 100px;
  margin-bottom: 10px;

  display: flex;
  align-items: center;
  justify-content: center;
}

/* 左右画像 */
.company-intro-card:not(.is-center) .company-intro-image img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}


/* ===================================
  中央カード：画像＋ヘッダー横並び
=================================== */


.company-intro-card.is-center .center-head{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 20px 0 0;
  margin-bottom: 5px;
}

/* 中央画像（小さく・横並び用） */
.company-intro-card.is-center .company-intro-image{
  width: 60px;
  height: 60px;
  margin-bottom: 0;
}

/* 中央画像  ※左寄せ*/
.company-intro-card.is-center .company-intro-image img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* タイトル */
.company-intro-card.is-center h3{
  font-size: 24px;
  margin: 0;
}

.company-intro-number{
  font-size: 28px !important; 
  margin: 0 0 20px !important;
}


/* =========================
  テキスト
========================= */
.company-intro-card h3{
  font-size: 18px;
  text-align: center;
  margin: 0 0 10px;
}

.company-intro-card p{
  font-size: 14px;
  line-height: 1.7;
  margin: 0;
}

/* 中央カラムだけ文字を大きく */
.company-intro-card.is-center h3{
  font-size: 24px;
}

.company-intro-card.is-center p{
  font-size: 15px;
}

/* =========================
  SP
========================= */
@media screen and (max-width: 768px){

  .page-id-250 .sec-lead {
    padding-bottom: 30px;
  }

  .company-intro-title{
    font-size: 22px !important;
    margin-bottom: 0 !important;
  }

  .company-intro-cards{
    flex-direction: column;
    gap: 0 !important;
    padding-bottom: 26px;
  }

  .company-intro-card,
  .company-intro-card.is-center{
    flex: unset;
  }

  .company-intro-card.is-center p{
    font-size: 14px;
    line-height: 1.7;
  }

}


/* ======================================================
   02：　会社概要 沿革テーブル調整
====================================================== */

/* 一番上の行だけ上ボーダー追加 */
.page-id-250 .p-company-dl .p-company-row:first-child {
  border-top: 1px solid #ddd;
}

/* 左側（項目名）の背景色変更 */
.page-id-250 .p-company-dt {
  background: #F5FAFF !important;
  text-align: center;
}

/* =====================================
   03: 沿革デザイン
   左：年 / 中央：ライン / 右：月・内容
===================================== */

.company-history {
  margin-top: 60px;
}

.company-history .history-row {
  display: grid;
  grid-template-columns: 105px 28px 60px 1fr;
  column-gap: 16px;
  align-items: start;
  position: relative;
  padding: 26px 0;
}

/* 年 */
.company-history .history-year {
  grid-column: 1;
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
  color: #0F69AB;
  text-align: left;
  position: relative;
  z-index: 2;
}

/* 月 */
.company-history .history-month {
  grid-column: 3;
  font-size: 18px;
  line-height: 1.4;
  font-weight: 500;
  color: #666;
  padding-top: 2px;
}

/* 内容 */
.company-history .history-content {
  grid-column: 4;
  font-size: 18px;
  line-height: 1.7;
  font-weight: 500;
  color: #111;
}

/* 月なしでも位置維持 */
.company-history .history-month:empty {
  visibility: hidden;
}

/* 縦ライン */
.company-history .history-row::before {
  content: "";
  position: absolute;
  left: 118px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #d9d9d9;
}

/* 丸 */
.company-history .history-row::after {
  content: "";
  position: absolute;
  left: 113px;
  top: 36px;
  width: 10px;
  height: 10px;
  background: #fff;
  border: 2px solid #d9d9d9;
  border-radius: 50%;
  box-sizing: border-box;
  z-index: 2;
}

/* 最初のライン */
.company-history .history-row:first-child::before {
  top: 40px;
}

/* 最後のライン */
.company-history .history-row:last-child::before {
  bottom: calc(100% - 40px);
}

/* 見出し */
.company-history-title {
  position: relative;
  margin: 0 0 36px;
  padding-left: 20px;
  font-size: 36px;
  font-weight: 700;
  line-height: 1.4;
  color: #111;
}

.company-history-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 80%;
  background: #0F69AB;
  border-radius: 3px;
}

/* =========================
   SP
========================= */
@media screen and (max-width: 768px){

  .page-id-250 .p-company-dt {
    font-size: 13px;
  }

  .company-history {
    margin-top: 40px;
  }

  .company-history .history-row {
    grid-template-columns: 62px 16px 36px 1fr;
    column-gap: 8px;
    padding: 18px 0;
    align-items: start;
  }

  .company-history .history-year {
    font-size: 20px;
    line-height: 1;
  }

  .company-history .history-month {
    font-size: 14px;
    line-height: 1.4;
    padding-top: 0;
  }

  .company-history .history-content {
    font-size: 15px;
    line-height: 2;
    margin-top: -4px;
    word-break: break-word;
  }

  /* SPライン */
  .company-history .history-row::before {
    left: 70px;
    top: 0;
    bottom: 0;
  }

  /* SP丸 */
  .company-history .history-row::after {
    left: 66px;
    top: 22px;
    width: 8px;
    height: 8px;
  }

  /* 最初のライン */
  .company-history .history-row:first-child::before {
    top: 22px;
  }

  /* 最後のライン */
  .company-history .history-row:last-child::before {
    bottom: calc(100% - 22px);
  }

  .company-history-title {
    margin: 0 0 28px;
    padding-left: 16px;
    font-size: 28px;
  }

  .company-history-title::before {
    width: 4px;
  }

}

/* ================================
   04: 代表メッセージ
================================ */

/* 全体 */
.p-company-message {
  padding: 10px 0;
}

/* キャッチコピー */
.p-company-catch {
  color: #3485C0;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 40px;
}

/* 2カラム */
.p-company-message-inner {
  display: flex;
  gap: 50px;
  align-items: flex-start;
}

/* 左：文章 */
.p-company-message-text {
  flex: 1;
  font-size: 15px;
  line-height: 2;
}

.p-company-message-text p {
  margin-bottom: 30px;
}

/* 右：画像 */
.p-company-message-photo {
  width: 200px;
  text-align: right;
}

.p-company-message-photo img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 20px;
}

/* 署名 */
.p-company-sign {
  font-size: 14px;
  color: #333;
}

/* ================================
   SP
================================ */
@media (max-width: 768px) {

  .p-company-message-inner {
    flex-direction: column;
    gap: 30px;
  }

  .p-company-message-photo {
    width: 100%;
    text-align: center;
  }

  .p-company-message-photo img {
    width: 80%;
    margin: 0 auto;
    display: block;
  }

  .p-company-catch {
    font-size: 20px;
    margin-bottom: 30px;
  }

  .p-company-message-text p {
    margin-bottom: 0;
  }

  .p-company-sign {
    margin-top: 14px;
    text-align: right;
    padding-right: 10%;
  }
}


/* ================================
   05: ロゴ・社名に込めた想い
================================ */

.p-company-logo {
  padding: 10px 0 40px;
}

/* 2カラム */
.p-company-logo-inner {
  display: flex;
  align-items: center;
  gap: 60px;
}

/* 左：ロゴ */
.p-company-logo-img {
  width: 280px;
  flex-shrink: 0;
}

.p-company-logo-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* 右：文章 */
.p-company-logo-text {
  flex: 1;
  font-size: 15px;
  line-height: 2;
}

.p-company-logo-text p {
  margin-bottom: 30px;
}

/* 強調（bold部分） */
.p-company-logo-text strong {
  font-weight: 700;
}

/* ================================
   SP
================================ */

@media (max-width: 768px) {

  .p-company-logo {
    padding: 10px 0 20px;
}

  .p-company-logo-inner {
    flex-direction: column;
    gap: 30px;
  }

  .p-company-logo-img {
    width: 70%;
    margin: 0 auto;
  }

  .p-company-logo-text p {
    margin-bottom: 0;
  }

}



/* =========================
  06:　採用情報
========================= */

.p-company-recruit {
  padding: 10px 0px 40px;
}

.p-company-recruit h2{
  font-size: 20px;
  font-weight: normal;
  margin: 0 0 30px !important;
}

.tcdce-card {
  background: #fafafa;
  border: 1px solid #ddd;
}

.tcdce-card__link {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px;
  text-decoration: none !important;
  color: #000 !important;
}

/* 画像 */
.tcdce-card__image {
  flex: 0 0 130px;
}

.tcdce-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* コンテンツ */
.tcdce-card__content {
  flex: 1;
}

/* タイトル */
.tcdce-card__title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.7;
  margin-bottom: 8px;
}

/* 説明文 */
.tcdce-card__desc {
  font-size: 14px;
  line-height: 1.7;
}

/* ホバー */
@media (any-hover: hover) {
  .tcdce-card__link:hover .tcdce-card__title {
    opacity: 0.6;
  }
}

/* =========================
   SP
========================= */
@media screen and (max-width: 767px) {

  .p-company-recruit {
    padding: 0 0 30px;
  }

  .p-company-recruit h2 {
    font-size: 17px;
    line-height: 1.8;
    margin: 0 0 20px !important;
  }

  .tcdce-card__link {
    gap: 12px;
    padding: 14px;
    align-items: flex-start;
  }

  /* 画像 */
  .tcdce-card__image {
    flex: 0 0 72px;
  }

  .tcdce-card__image img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* コンテンツ */
  .tcdce-card__content {
    flex: 1;
    min-width: 0;
  }

  /* タイトル */
  .tcdce-card__title {
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 6px;
  }

  /* 説明文 */
  .tcdce-card__desc {
    font-size: 12px;
    line-height: 1.8;
  }

}


/* =========================
　07: アクセス
========================= */

.company-access {
  margin: 80px 0;
}

.company-access-inner {
  max-width: 1150px;
  margin: 0 auto;
}

/* 2件目以降だけ余白 */
.company-access-inner + .company-access-inner {
  margin-top: 90px;
}

/* 事業所名 */
.company-office {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 16px;
}

/* 住所 */
.company-address {
  font-size: 18px;
  margin-bottom: 20px;
  line-height: 1.6;
}

/* =========================
　Google MAP埋め込み
========================= */

.company-map {
  margin-top: 30px;
}

.company-map iframe {
  width: 100%;
  height: 450px;
  display: block;
  border: none;
}

/* =========================
　SP
========================= */

@media screen and (max-width: 767px) {

  .company-access {
    margin: 60px 0;
  }

  .company-access-inner + .company-access-inner {
    margin-top: 30px;
  }

  .company-office {
    font-size: 18px;
  }

  .company-address {
    font-size: 16px;
  }

  .company-map iframe {
    height: 300px;
  }
}



/* ========================================

   SERVICE：　カスタム投稿：サービス個別ページ 

   ======================================== */

/* 20260412夜_サービス投稿だけ幅を元に戻す */
.single-service .l-inner {
  max-width: 1000px;
  margin: 0 auto;
  width: 100%;
}



/* ===============================
   サービス詳細ヘッダー全幅化
=============================== */

.p-single-service-header {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

/* 中身は中央寄せ */
.p-single-service-header__inner {
  max-width: 1000px;
  margin: 0 auto;
}




/* =========================================

   サービス個別ページ 共通テンプレ

   ========================================= */

/* セクション全体 */
.sec-lead {
  padding: 40px 20px 10px;
  text-align: center;
}

/* コンテンツ幅 */
.sec-lead {
  max-width: 1100px;
  margin: 0 auto;
}

/* メイン見出し */
.sec-lead h2 {
  margin: 0 0 36px;
  font-size: 28px;
  line-height: 1.4;
  font-weight: 700;
  color: #222;
}

/* サブコピー */
.sec-lead h3 {
  all: unset;
  display: block;
  font-size: 16px;
  line-height: 2;
  font-weight: 500;
  text-align: center;
  color: #505050;
}

/* ========================
   SP
======================== */
@media screen and (max-width: 768px) {

  .sec-lead {
    padding: 26px 20px 0;
  }

  .sec-lead h2 {
    font-size: 24px;
    margin-bottom: 20px;
    line-height: 1.5;
  }

  .sec-lead h3 {
    font-size: 16px;
    line-height: 1.9;
  }
}




/* =================================
   ヘッダー画像内のテキスト並び替え
================================= */
.p-single-service-header__contents {
  display: flex;
  gap: 0;
  flex-direction: column;
}

.p-single-service-header-copy {
  order: 1;
  margin-bottom: 0px;
  font-size: 60px;
}

.c-service-header__subheadline {
  order: 2;
  margin-top: 10px;
}


@media (max-width: 767px) {
  .p-single-service-header-copy {
    font-size: 42px !important;
  }

  .c-service-header__subheadline {
    max-width: 220px;
    font-size: 12px;
  }
  
}

/* =========================
   タイトル
========================= */
.p-single-service-header_title {
  font-size: 60px;
  font-weight: 700;
}

/* =========================
   サブラベル
========================= */
.c-service-header__subheadline span {
  font-size: 16px;
  padding: 10px 22px;
  border-radius: 999px;
}

/* =========================
   SP
========================= */
@media screen and (max-width: 768px) {

  .p-single-service-header_title {
    font-size: 32px;
  }

  .c-service-header__subheadline span {
    font-size: 14px;
    padding: 8px 16px;
  }
}



/* =========================

   ★サービス01：　高圧電力

   ========================= */


/* =========================
   2カラム全体
========================= */
.stats-wrap {
  display: flex;
  gap: 30px;
  justify-content: center;
  margin: 20px 0 20px;
}

/* =========================
   ２つの統計　各ボックス
========================= */
.stats-box {
  flex: 1;
  max-width: 400px;
  border-radius: 30px;
  overflow: hidden;
  border: 1px solid #d0d7de;
  background: #fff;
}

/* 上部（グラデ） */
.stats-head {
  background: linear-gradient(to top, #0F69AB, #A3D8FF);
  color: #fff;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  height: 70px;              /* ← 固定高さ */
  display: flex;             /* ← 中央揃え用 */
  align-items: center;       /* ← 縦中央 */
  justify-content: center;   /* ← 横中央 */
  line-height: 1.4;         
  padding: 0 10px;           /* ← 上下padding削除 */
}


/* 本体 */
.stats-body {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 0 20px;
}

/* アイコン */
.stats-icon {
  width: 70px;
  height: auto;
}

/* 数字エリア */
.stats-text {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

/* 強調数字 */
.stats-strong-orange {
  font-size: 48px;
  font-weight: 700;
  color: #e05c0f;
}

/* 単位 */
.unit {
  font-size: 18px;
  color: #333;
}

/* 注釈 */
.stats-note {
  text-align: right;
  font-size: 14px;
  color: #666;
  margin-right: 90px !important;
}

/* =========================
   SP対応
========================= */
@media screen and (max-width: 768px) {

  .stats-wrap {
    flex-direction: column;
    gap: 20px;
    padding: 10px 30px;
    margin: 20px 0 0;
  }

  .stats-head {
    text-align: center;
    font-size: 16px;
    height: 54px;          
    line-height: 1.2; 
  }

  .stats-box {
    max-width: 100%;
  }

  .stats-body {
    padding: 0 15px;
  }

  .stats-strong-orange {
    font-size: 38px;
  }

  .stats-note {
   margin-right: 32px !important;
  }
}

/* ===============================
   セクション見出し（全ページ共通）
=============================== */
.section-header {
  text-align: center;
  margin: 80px 0 40px;
}

/* 英語タイトル */
.section-header__en {
  font-size: 48px !important;
  color: #2F2724 !important;
  margin: 110px 0 0 !important;
  line-height: 1.4;
}

/* サブコピー */
.section-header__sub {
  font-size: 22px;
  line-height: 1.4;
  font-weight: 700 !important;
  color: #333;
  margin: 0 0 16px !important;
}

/* 日本語見出し */
.section-header__text {
  font-size: 18px;
  font-weight: 400 !important;
  color: #2F2724;
  margin: 0;
  line-height: 1.8;
}

@media (max-width: 768px) {
  .section-header {
    margin: 50px 0 30px;
    padding: 0 20px;
  }

  .section-header__en {
    font-size: 30px !important;
    margin: 0 !important;
  }

  .section-header__sub {
    font-size: 20px;
  }

  .section-header__text {
    font-size: 14px;
  }
}


/* ===============================
   共通CTA配置
=============================== */
.button-cta {
  text-align: center;
  margin-top: 40px;
}

.button-cta .p-cb-button {
  margin: 0 !important;
}

/* ===============================
   共通ボタンの個別色指定
=============================== */
.p-cb-button.c-button01.button-gradation {
  display: inline-flex;              /* ←これ追加 */
  align-items: center;               /* 縦中央 */
  justify-content: center;           /* 横中央 */

  text-align: center;
  line-height: 1.4;
  padding: 14px 32px;

  background: linear-gradient(135deg, #1e88d8 0%, #0f69ab 100%) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(15, 105, 171, 0.3);

  text-decoration: none !important;  /* ←下線対策もここで */
}

/* hover */
@media (any-hover: hover) {
  .p-cb-button.c-button01.button-gradation:hover {
    background: linear-gradient(135deg, #2a9df4 0%, #1479c9 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 105, 171, 0.4);

    text-decoration: none !important; /* ←追加 */
  }
}



/* ===============================
   feature-grid（共通）
=============================== */
.feature-grid {
  display: grid;
  border-top: 1px solid #bfc5cc;
  border-left: 1px solid #bfc5cc;
}

.feature-grid.is-col3 {
  grid-template-columns: repeat(3, 1fr);
}

.feature-grid.is-col2 {
  grid-template-columns: repeat(2, 1fr);
}

/* 各カード */
.feature-grid__item {
  padding: 36px 22px 30px;
  text-align: center;
  border-right: 1px solid #bfc5cc;
  border-bottom: 1px solid #bfc5cc;
  background: #fff;
  
}

/* 丸背景 */
.feature-grid__icon-circle {
  width: 132px;
  height: 132px;
  margin: 0 auto 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 丸の色 */
.feature-grid__icon-circle.is-blue {
  background: #79A6DA;
}

.feature-grid__icon-circle.is-green {
  background: #88B78D;
}

.feature-grid__icon-circle.is-orange {
  background: #E5A25A;
}

/* アイコン画像 */
.feature-grid__icon-circle img {
  max-width: 90px;
  max-height: 90px;
  width: auto;
  height: auto;
  display: block;
}

/* タイトル */
.feature-grid__title {
  margin: 0 0 12px !important;
  font-size: 22px !important;
  text-align: center !important;
  min-height: 2.75em;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.5 !important;
}

  .feature-grid__title.is-long {
  font-size: 20px !important;
}

/* 説明文 */
.feature-grid__desc {
  margin: 0;
  padding: 0 0 10px !important;
  font-size: 16px;
  line-height: 1.9;
  text-align: left;
  color: #2f2724;
}



/* =========================
   feature-grid SP
========================= */

@media (max-width:767px){

  .feature-grid{
    border-left:none;
    border-top:none;
    gap:0px;
  }

  .feature-grid.is-col3,
  .feature-grid.is-col2{
    grid-template-columns:1fr;
  }


  .feature-grid.is-col2 {
    max-width: 100% !important;
    width: 100%;
  }


  .feature-grid__item{
    padding:35px 24px 30px;
    margin:0 18px;
    border:1px solid #d8dde3;
  }

  .feature-grid__icon-circle{
    width:110px;
    height:110px;
    margin:0 auto 24px;
  }

  .feature-grid__icon-circle img{
    max-width:72px;
    max-height:72px;
  }

  .feature-grid__title{
    min-height:auto;
    margin:0 0 18px !important;
    font-size:18px !important;
    line-height:1.5 !important;
  }

  .feature-grid__title.is-long{
    font-size:18px !important;
  }

  .feature-grid__desc{
    padding:0 !important;
    font-size:15px;
    line-height:2;
  }

}



/* ===============================
   上段３カラム＋下段２カラムの場合
=============================== */
/* 親 */
.feature-grid-wrap {
  margin-top: 0;
}

/* 上と下の境界をくっつける */
.feature-grid.is-col2 {
  margin-top: -1px; /* ←これが重要 */
  max-width: 66.666%;
  margin-left: auto;
  margin-right: auto;
  border-top: none;
}

/* 下段の位置調整（中央寄せ） */
.feature-grid.is-col2 {
  max-width: 66.666%;
  margin: 0 auto;
  border-top: none;
}


/* ===============================
   SP
=============================== */
@media (max-width: 768px) {
  .feature-grid {
    grid-template-columns: 1fr !important;
    border-left: none;
    border-top: none;
  }

  .feature-grid__item {
    padding: 28px 20px 24px;
    border-left: 1px solid #bfc5cc;
  }

  .feature-grid__icon-circle {
    width: 108px;
    height: 108px;
    margin-bottom: 22px;
  }

  .feature-grid__icon-circle img {
    max-width: 56px;
    max-height: 56px;
  }


  .feature-grid__desc {
    font-size: 15px;
    text-align: center;
    line-height: 1.9;
  }
}


/* ===============================
   電力プランの選び方　全体レイアウト　※現在ボツ
=============================== */

.voice-list {
  max-width: 900px;
  margin: 0 auto;
}

.voice-item {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 28px;
}

/* アイコン */
.voice-item__icon {
  width: 70px;
  flex-shrink: 0;
}

.voice-item__icon img {
  width: 100%;
  border-radius: 50%;
  display: block;
}

/* ===============================
   吹き出し本体
=============================== */

.voice-item__bubble {
  position: relative;
  flex: 1;
  padding: 20px 70px 20px 26px;
  border: 2px solid #222;
  border-radius: 14px;
  background: #fff;
  text-decoration: none;
  color: #000;
  display: block;
  transition: all 0.25s ease;
}

/* テキスト */
.voice-item__bubble p {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.7;
}

/* ===============================
   吹き出しの口
=============================== */

/* 外側（三角：枠） */
.voice-item__bubble::before {
  content: "";
  position: absolute;
  left: -24px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 12px;
  border-style: solid;
  border-color: transparent #222 transparent transparent;
}

/* 内側（三角：中身） */
.voice-item__bubble::after {
  content: "";
  position: absolute;
  left: -19px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 10px;
  border-style: solid;
  border-color: transparent #fff transparent transparent;
}

/* ===============================
   右の丸矢印
=============================== */

.voice-item__arrow {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
}

/* ▼三角 */
.voice-item__arrow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -30%);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 16px solid #fff;
}

/* 色 */
.is-blue .voice-item__arrow {
  background: linear-gradient(to bottom, #A3D8FF, #0F69AB);
}

.is-green .voice-item__arrow {
  background: linear-gradient(to bottom, #97D77A, #5D9B65);
}

.is-orange .voice-item__arrow {
  background: linear-gradient(to bottom, #F8AE25, #E0780F);
}

.is-gray .voice-item__arrow {
  background: #bdbdbd;
}

/* ===============================
   hover
=============================== */

@media (any-hover: hover) {

  .voice-item__bubble:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.15);
  }

}

/* ===============================
   SP対応
=============================== */

@media (max-width: 768px) {

  /* 全体左右余白 */
  .voice-list {
    padding: 0 18px;
  }

  .voice-item {
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
  }

  /* アイコン */
  .voice-item__icon {
    width: 42px;
  }

  /* 吹き出し */
  .voice-item__bubble {
    padding: 18px 54px 18px 16px;
    border-radius: 12px;
  }

  /* テキスト */
  .voice-item__bubble p {
    font-size: 14px;
    line-height: 1.9;
    font-weight: 700;
  }

  /* 吹き出しの口 */
  .voice-item__bubble::before {
    left: -16px;
    border-width: 8px;
  }

  .voice-item__bubble::after {
    left: -13px;
    border-width: 7px;
  }

  /* 矢印 */
  .voice-item__arrow {
    width: 38px;
    height: 38px;
    right: 12px;
  }

  .voice-item__arrow::before {
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 13px solid #fff;
  }

}



/* ===================================
   プランボックス内 白文字シャドウ（共通）
=================================== */

/* メインタイトル＋サブタイトル */
.plan-box-blue__title-main,
.plan-box-blue__title-sub,
.plan-box-green__title-main,
.plan-box-green__title-sub,
.plan-box-orange__title-main,
.plan-box-orange__title-sub,

/* ①②などの丸アイコン想定 */
.plan-box-blue__title-main span,
.plan-box-green__title-main span,
.plan-box-orange__title-main span {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}



/* =========================
   3つのプラン
========================= */
.plan-wrapper {
  margin-top: 80px; /* ←上の吹き出しとの距離 */
  display: flex;
  flex-direction: column;
  gap: 60px; /* ←各プランの間 */
}


/* ===============================
  ３つのプランのレイアウト：ブルー
=============================== */

.plan-section-blue {
  background: #EFEFEF;
  border-radius: 30px;
  border: 3px solid #0F69AB;
  padding: 0px 40px 50px;
  max-width: 1100px;
  margin: 0 auto;
}

/* タイトル */
.plan-title-blue {
  font-size: 26px !important;
  color: #0F69AB !important;
  margin: 40px 0 35px !important;
}

/* =========================
   上段レイアウト
========================= */
.plan-top {
  display: flex;
  gap: 40px;
  margin-bottom: 50px;
}

.plan-left {
  flex: 1;
}

.plan-right {
  flex: 1;
}

.plan-right img {
  width: 100%;
  display: block;
}

/* =========================
   プランボックス（青）
========================= */
.plan-box-blue {
  border: 2px solid #0F69AB;
  background: linear-gradient(
    to bottom,
    #DEF0FD 5%,
    #A3D8FF 20%,
    #0F69AB 100%
  );
  text-align: center;
  padding: 22px 20px;
  margin-bottom: 20px;
}

.plan-box-blue__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.plan-box-blue__title-main {
  font-size: 42px;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.08em;
  line-height: 1.2;
  margin-bottom: 5px;
}

.plan-box-blue__title-sub {
  font-size: 28px;
  color: #fff;
  font-weight: bold;
  line-height: 1.2;
}

/* =========================
   説明文
========================= */
.plan-text {
  font-size: 18px;
  line-height: 1.8;
}

.plan-text-sub {
    font-size: 16px;
    line-height: 1.6;
}
.strong-blue {
  color: #0F69AB;
  font-weight: bold;
}
.strong-blue-large {
  color: #0F69AB !important;
  font-weight: bold !important;
  font-size: larger !important;
}


/* =========================
   メリット（共通レイアウト）
========================= */
.merit-list {
  display: flex;
  gap: 20px;
}

/* カラム制御 */
.merit-list.is-col2 > * {
  width: calc((100% - 20px) / 2);
}

.merit-list.is-col3 > * {
  width: calc((100% - 40px) / 3);
}


/* =========================
   メリット（ボックス共通）
========================= */
.merit-box {
  border: 2px solid;
  border-radius: 18px;
  padding: 25px 16px;
  background: #fff;
  text-align: center;
}

/* 見出し */
.merit-box h3 {
  font-size: 16px;
  margin-bottom: 10px;
  text-align: center;
}

/* タイトル */
.merit-title {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 12px !important;
  padding-bottom: 12px;
  border-bottom: 1px solid;
}

/* 本文 */
.merit-text {
  font-size: 14px;
  line-height: 1.8;
  text-align: center;
}

/* =========================
   カラー（ブルー）
========================= */
.merit-blue {
  border-color: #0F69AB;
}

.merit-blue .merit-title {
  color: #0F69AB;
  border-color: #0F69AB;
}

/* =========================
   表示切り替え
========================= */

/* デフォルト（PC） */
.pc-only {
  display: inline;
}

.sp-only {
  display: none;
}

/* SP時 */
@media (max-width: 768px) {

  .pc-only {
    display: none;
  }

  .sp-only {
    display: inline;
  }

}


/* ===============================
  グリーンver（２カラム）
=============================== */

.plan-section-green {
  background: #EFEFEF;
  border-radius: 30px;
  border: 3px solid #5D9B65;
  padding: 0px 40px 50px;
  max-width: 1100px;
  margin: 0 auto;
}

/* タイトル */
.plan-title-green {
  font-size: 26px !important;
  color: #5D9B65 !important;
  margin: 40px 0 35px !important;
}

/* =========================
   プランボックス（グリーン）
========================= */
.plan-box-green {
  border: 2px solid #5D9B65;
  background: linear-gradient(
    to bottom,
    #EAF6EC 5%,
    #97D77A 20%,
    #5D9B65 100%
  );
  text-align: center;
  padding: 22px 20px;
  margin-bottom: 20px;
}

.plan-box-green__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.plan-box-green__title-main {
  font-size: 42px;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.08em;
  line-height: 1.2;
  margin-bottom: 5px;
}

.plan-box-green__title-sub {
  font-size: 28px;
  color: #fff;
  font-weight: bold;
  line-height: 1.2;
}

/* =========================
   強調テキスト
========================= */
.strong-green {
  color: #5D9B65;
  font-weight: bold;
  font-size: larger;
}

/* =========================
   メリット（緑）
========================= */

/* カラー（グリーン） */
.merit-green {
  border-color: #5D9B65;
}

.merit-green .merit-title {
  color: #5D9B65;
  border-color: #5D9B65;
}

/* ===============================
  オレンジver（２カラム）
=============================== */

.plan-section-orange {
  background: #EFEFEF;
  border-radius: 30px;
  border: 3px solid #E0780F;
  padding: 0px 40px 50px;
  max-width: 1100px;
  margin: 0 auto;
}

/* タイトル */
.plan-title-orange {
  font-size: 26px !important;
  color: #E0780F !important;
  margin: 40px 0 35px !important;
}

/* =========================
   プランボックス（オレンジ）
========================= */
.plan-box-orange {
  border: 2px solid #E0780F;
  background: linear-gradient(
    to bottom,
    #FFE9D6 5%,
    #F8AE25 20%,
    #E0780F 100%
  );
  text-align: center;
  padding: 22px 20px;
  margin-bottom: 20px;
}

.plan-box-orange__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.plan-box-orange__title-main {
  font-size: 42px;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.08em;
  line-height: 1.2;
  margin-bottom: 5px;
}

.plan-box-orange__title-sub {
  font-size: 28px;
  color: #fff;
  font-weight: bold;
  line-height: 1.2;
}

/* =========================
   強調テキスト
========================= */
.strong-orange {
  color: #E0780F;
  font-weight: bold;
}

/* =========================
   メリット（オレンジ）
========================= */

/* カラー（オレンジ） */
.merit-orange {
  border-color: #E0780F;
}

.merit-orange .merit-title {
  color: #E0780F;
  border-color: #E0780F;
}

/* =========================
   右上のオレンジグラデのバッジ
========================= */
/* 親を基準にする */
.plan-section-blue {
  position: relative;
}

/* バッジ本体 */
.plan-badge {
  position: absolute;
  top: -38px;
  right: -30px;

  width: 140px;
  height: 140px;
  border-radius: 50%;

  background: linear-gradient(90deg, #E0780F, #F8AE25);

  color: #fff;
  font-weight: bold;
  text-align: center;

  display: flex;
  align-items: center;
  justify-content: center;

  line-height: 1.4;
  font-size: 26px;

  z-index: 5;
}

/* 強調 */
.plan-badge br + * {
  font-size: 22px;
}

/* 影（重要：浮き感出る） */
.plan-badge {
  box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

/* ===============================
   3つのプラン　SP最適化のみ
=============================== */

@media (max-width: 768px) {

  /* 全体余白 */
  .plan-wrapper {
    margin-top: 50px;
    gap: 40px;
    padding: 0 16px;
  }

  /* 各プラン枠 */
  .plan-section-blue,
  .plan-section-green,
  .plan-section-orange {
    padding: 72px 18px 30px;
    border-radius: 22px;
  }

  /* タイトル */
  .plan-title-blue,
  .plan-title-green,
  .plan-title-orange {
    font-size: 18px !important;
    line-height: 1.6;
    margin: 0 0 24px !important;
    text-align: center;
  }

  /* 上段を縦並び */
  .plan-top {
    flex-direction: column;
    gap: 24px;
    margin-bottom: 30px;
  }

  .plan-left,
  .plan-right {
    width: 100%;
  }

  /* プランボックス */
  .plan-box-blue,
  .plan-box-green,
  .plan-box-orange {
    padding: 18px 12px;
    margin-bottom: 16px;
  }

  /* メインタイトル */
  .plan-box-blue__title-main,
  .plan-box-green__title-main,
  .plan-box-orange__title-main {
    font-size: 32px;
    line-height: 1.2;
    letter-spacing: 0.04em;
  }

  /* サブタイトル */
  .plan-box-blue__title-sub,
  .plan-box-green__title-sub,
  .plan-box-orange__title-sub {
    font-size: 22px;
  }

  /* 説明文 */
  .plan-text {
    font-size: 15px;
    line-height: 2;
  }

  .plan-text-sub {
    font-size: 13px;
    line-height: 1.9;
  }

  /* メリットを1列 */
  .merit-list {
    flex-direction: column;
    gap: 22px;
  }

  .merit-list.is-col2 > *,
  .merit-list.is-col3 > * {
    width: 100%;
  }

  /* メリットBOX */
  .merit-box {
    padding: 22px 16px;
    border-radius: 16px;
  }

  .merit-box h3 {
    font-size: 15px;
    margin-bottom: 10px;
  }

  .merit-title {
    font-size: 18px;
    line-height: 1.6;
    padding-bottom: 10px;
    margin-bottom: 14px !important;
  }

  .merit-text {
    font-size: 14px;
    line-height: 1.8;
  }

  /* バッジ縮小 */
  .plan-badge {
    width: 86px;
    height: 86px;
    top: -38px;
    right: -10px;
    font-size: 16px;
    line-height: 1.4;
  }

  .plan-badge br + * {
    font-size: 15px;
  }

}



/* =============================
   年間最大削減額の全体背景
============================= */
.cost-section{
  position: relative;

  /* フル幅化 */
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);

  background: linear-gradient(to bottom right, #ffffff, #D6E9FF);
  padding: 50px 20px;
}

.cost-inner{
  max-width: 1000px;
  margin: 0 auto;
}

/* タイトル */
.cost-title{
  text-align: center;
  font-size: 28px !important;
}

/* タイトル全体 */
.cost-title{
  text-align: center;
  font-size: 28px;
  font-weight: bold;
}

/* オレンジ金額 */
.cost-title-orange{
  color: #f26500;
  font-size: 42px;
  font-weight: bold;
}

/* 円だけ小さく */
.cost-title-orange .yen{
  font-size: 0.6em;
  margin-left: 2px;
  vertical-align: baseline;
}

/* 削減（青） */
.cost-title-blue{
  color: #0F69AB;
  font-size: 38px;
  font-weight: bold;
}

/* =============================
   カードレイアウト
============================= */
.cost-cards{
  display: flex;
  gap: 30px;
}

.cost-card{
  flex: 1;
  background: #fff;
  border: 2px solid #D9D9D9;
  border-radius: 10px;
  padding: 30px 20px;
  text-align: center;

  /* 右下シャドウ */
  box-shadow: 6px 6px 12px rgba(0,0,0,0.15);
}

/* =============================
   画像エリア
============================= */
.img-placeholder{
  width: 100%;
  height: 90px; /* 必要なら調整 */
  overflow: hidden;
  border-radius: 0;
}

.img-placeholder img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain; 
  object-position:center;
}

/* 上画像 */
.img-placeholder.top{
  margin-bottom: 20px;
}

/* 下画像 */
.img-placeholder.bottom{
  margin-top: 0;
}

/* SP調整 */
@media (max-width:768px){

  .img-placeholder{
    height:auto;          /* 高さ固定やめる */
  }

  .img-placeholder img{
    height:auto;
    width:100%;
  }

}

/* =============================
   オレンジ下向きラベル
============================= */
/* =============================
   下向きオレンジラベル（完成版）
============================= */
.down-orange-label{
  position: relative;
  display: inline-block;
  width: 180px;
  padding: 16px 10px 18px;
  border-radius: 10px; /* ←丸すぎNG */

  /* 濃いオレンジグラデ */
  background: linear-gradient(135deg, #F8AE25 0%, #F26500 100%);

  color: #fff;
  font-weight: 700;
  text-align: center;

  /* 文字調整 */
  line-height: 1.4;
  font-size: 18px;

  /* 立体感 */
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  text-shadow: 0 2px 3px rgba(0,0,0,0.25);
}

/* ▼三角（しっかり大きく） */
.down-orange-label::after{
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -22px;

  width: 60px;
  height: 22px;

  background: linear-gradient(135deg, #F8AE25 0%, #F26500 100%);

  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.down-orange-label small{
  display: block;
  font-size: 14px;
  margin-top: 4px; /* ←ここで微調整 */
  line-height: 1.2;
}


/* =============================
   削減額
============================= */
.down-sub{
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
  margin: 30px 0 0 !important;
}

.down-price{
  font-size: 34px;
  font-weight: bold;
  line-height: 1.2;
  color: #f26500;
  margin-bottom: 0 !important;
}

/* 円だけ小さく */
.down-price .yen{
  font-size: 0.65em;
  vertical-align: baseline;
}

/* グレー下線 */
.gray-border-line{
  width: 80%;
  height: 2px;
  background: #D9D9D9;
  margin: 5px auto;
}

/* =============================
   割合
============================= */
.down-rate{
  font-size: 24px;
  font-weight: bold;
  line-height: 1.6;
  color: #f26500;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

/* ▼矢印（大きく＆やわらかく） */
.down-rate::before{
  content: "";
  width: 28px;   /* ← 約2倍 */
  height: 20px;

  background: linear-gradient(to bottom, #F8AE25, #E0780F);

  /* 少し丸みのある三角 */
  clip-path: polygon(
    50% 100%,
    5% 10%,
    95% 10%
  );

  /* 少しぼかして角を柔らかく見せる */
  filter: drop-shadow(0 1px 0 rgba(0,0,0,0.1));
}
/* =============================
   注意書き
============================= */
.down-note{
  text-align: center;
  margin-top: 20px;
  font-size: 18px;
}

/* =============================
   SP対応
============================= */
@media (max-width: 768px){
  .cost-cards{
    flex-direction: column; 
  }

  .cost-title span{
    font-size: 32px;
  }

  .down-note{
  font-size: 14px;
}

}



/* =============================
   導入の流れ　blue-4-step
============================= */
.flow-step-blue-col-4{
  padding: 30px 0 40px;
}

.flow-step-blue-col-4 .flow-inner{
  max-width: 1100px;
  margin: 0 auto;
  position: relative;
}

/* =============================
   グリッド
============================= */
.flow-step-blue-col-4 .flow-grid{
  display: grid;
  gap: 0;
  position: relative;
  z-index: 1;
}

.flow-step-blue-col-4 .flow-grid.col-4{
  grid-template-columns: repeat(4, 1fr);
}

/* =============================
   ライン（青）
============================= */
.flow-step-blue-col-4 .flow-line{
  position: absolute;
  top: 0px;
  left: 0;
  width: 100%;
  height: 4px;
  z-index: 1;
}

.flow-step-blue-col-4 .flow-line-blue{
  background: linear-gradient(
    to right,
    #F8FBFF 0%,
    #A5CEFE 15%,
    #0F69AB 100%
  );
}

/* =============================
   カラム
============================= */
.flow-step-blue-col-4 .flow-item{
  text-align: center;
  padding: 35px 18px 25px;

  border-top: 0.5px solid #898989;
  border-bottom: 0.5px solid #898989;
  border-left: 0.5px solid #898989;
  border-right: none;

  background: transparent;
  position: relative;
  z-index: 2;
}

.flow-step-blue-col-4 .flow-item:last-child{
  border-right: 0.5px solid #898989;
}

/* =============================
   ステップ円
============================= */
.flow-step-blue-col-4 .flow-step{
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 60px;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 22px;
  font-weight: bold;
  color: #fff;

  z-index: 3;
}

.flow-step-blue-col-4 .flow-step-num{
  position: relative;
  z-index: 1;
}

.flow-step-blue-col-4 .flow-step-blue{
  background: linear-gradient(to bottom, #A3D8FF, #0F69AB);
}

/* =============================
   タイトル
============================= */
.flow-step-blue-col-4 .flow-title{
  margin: 12px auto 0 !important;
  font-size: 20px !important;
  text-align: center !important;
  font-weight: bold;
  line-height: 1.5;
}

.flow-step-blue-col-4 .flow-title-blue{
  color: #0F69AB !important;
}

/* =============================
   画像
============================= */
.flow-step-blue-col-4 .flow-img{
  width: 100%;
  margin: 20px 0;
  border-radius: 20px;
}

/* =============================
   テキスト
============================= */
.flow-step-blue-col-4 .flow-text{
  font-size: 13px;
  line-height: 1.8;
  text-align: center;
}

.flow-step-blue-col-4 .flow-message{
  text-align: center;
  font-size: 22px;
  color: #0F69AB;
  margin-top: 20px;
}

/* =============================
   SP
============================= */

@media (max-width: 768px){

  /* 外枠左右余白 */
  .flow-step-blue-col-4 .flow-inner{
    padding: 0 16px;
  }

  .flow-step-blue-col-4 {
    padding: 30px 0 10px;
  }

  /* 1カラム化 */
  .flow-step-blue-col-4 .flow-grid.col-4{
    grid-template-columns: 1fr;
    gap: 0;
  }

  /* ライン非表示 */
  .flow-step-blue-col-4 .flow-line{
    display: none;
  }

  /* カード */
  .flow-step-blue-col-4 .flow-item{
    border: 0.5px solid #898989;
    padding: 32px 18px 4px;
  }

  .flow-step-blue-col-4 .flow-item + .flow-item{
  border-top: none;
  }

  .flow-step-blue-col-4 .flow-item:last-child{
    margin-bottom: 0;
  }

  /* ステップ円 */
  .flow-step-blue-col-4 .flow-step{
    top: -28px;
    width: 56px;
    height: 56px;
    font-size: 20px;
  }

  /* タイトル */
  .flow-step-blue-col-4 .flow-title{
    font-size: 18px !important;
    line-height: 1.6;
    margin-top: 8px !important;
  }

  /* 画像 */
  .flow-step-blue-col-4 .flow-img{
    margin: 18px 0;
    border-radius: 18px;
  }

  /* テキスト */
  .flow-step-blue-col-4 .flow-text{
    font-size: 14px;
    line-height: 2;
    margin-bottom: 34px;
  }

  .flow-step-blue-col-4 .flow-item:last-child .flow-text{
  margin-bottom: 22px;
  }

  /* 下メッセージ */
  .flow-step-blue-col-4 .flow-message{
    font-size: 18px;
    line-height: 1.8;
    margin-top: 26px;
    padding: 0 16px;
  }

}




/* =================================================
  よくあるご質問 FAQ（サービスページ：フッター5問表示） 
================================================= */
.service-faq-section{
  padding: 0 20px 50px;
}

.service-faq-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.service-faq-head{
  text-align: center;
  margin-bottom: 40px;
}

.service-faq-heading{
  font-size: 48px !important;
  margin: 0 !important;
}

.service-faq-subheading{
    font-size: 22px;
    line-height: 1.4;
    font-weight: 700 !important;
    color: #333;
    margin: 0 0 16px !important;
}

.service-faq-list{
  border-top: 1px solid #0F69AB;
  padding-bottom: 40px;
}

.service-faq-item{
  border-bottom: 1px solid #0F69AB;
}



.service-faq-question{
  width: 100%;
  background: #fff;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  text-align: left;
  min-height: 76px;
}

.service-faq-question-left{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px 18px 16px;
  min-width: 0;
}

.service-faq-q{
  flex: 0 0 auto;
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
  color: #0F69AB;
}

.service-faq-question-text{
  font-size: 18px;
  line-height: 1.6;
  font-weight: 700;
  color: #222;
}

.service-faq-toggle{
  position: relative;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  margin-right: 16px;
  background: linear-gradient(to bottom, #A3D8FF, #0F69AB);
}

.service-faq-toggle::before,
.service-faq-toggle::after{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: #fff;
  transform: translate(-50%, -50%);
}

.service-faq-toggle::before{
  width: 14px;
  height: 2px;
}

.service-faq-toggle::after{
  width: 2px;
  height: 14px;
}

.service-faq-answer{
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;
}

.service-faq-answer-inner{
  overflow: hidden;
  padding: 0 20px;
}

.service-faq-answer-inner > *:first-child{
  margin-top: 0;
}

.service-faq-answer-inner > *:last-child{
  margin: 0 0 10px 40px;
}

.service-faq-item.is-open .service-faq-answer{
  grid-template-rows: 1fr;
}

.service-faq-item.is-open .service-faq-answer-inner{
  padding-top: 0;
  padding-bottom: 24px;
}

.service-faq-item.is-open .service-faq-toggle::after{
  display: none;
}

.service-faq-answer-inner p{
  font-size: 16px;
  line-height: 1.9;
  color: #333;
}

@media (max-width: 767px){
  .service-faq-section{
    padding: 56px 20px;
  }

  .service-faq-heading{
    font-size: 40px;
  }

  .service-faq-subheading{
    font-size: 14px;
    margin-top: 12px;
  }

  .service-faq-question{
    min-height: 64px;
    gap: 12px;
  }

  .service-faq-question-left{
    gap: 10px;
    padding: 16px 14px;
  }

  .service-faq-q{
    font-size: 24px;
  }

  .service-faq-question-text{
    font-size: 16px;
    line-height: 1.5;
  }

  .service-faq-toggle{
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    margin-right: 12px;
  }

  .service-faq-toggle::before{
    width: 18px;
  }

  .service-faq-toggle::after{
    height: 18px;
  }

  .service-faq-answer-inner{
    padding-left: 14px;
    padding-right: 14px;
  }

  .service-faq-answer-inner p{
    font-size: 14px;
    line-height: 1.8;
  }
}

/* =====================================
   サービス詳細：CONTACT CTA
===================================== */

.service-cta-contact{
  padding: 0 20px 10px;
  text-align: center;
}

.service-cta-contact .section-header{
  margin-bottom: 35px;
}

.service-cta-contact .section-header__en{
  font-size: 48px !important;
  line-height: 1.4;
  color: #2F2724 !important;
  margin: 0 !important;
}

.service-cta-contact .section-header__sub{
  font-size: 22px;
  line-height: 1.4;
  font-weight: 700 !important;
  color: #333;
  margin: 0 0 16px !important;
}

.service-cta-contact .section-header__text{
  max-width: 900px;
  margin: 34px auto 0;
  font-size: 21px;
  line-height: 1.7;
  font-weight: 700 !important;
  text-align: center;
}

/* 本文ボックス */
.service-contact-box{
  max-width: 1000px;
  margin: 40px auto 0;
  text-align: center;
}

/* 説明文 */
.service-contact-box .free-text{
  margin: 0;
  font-size: 16px;
  line-height: 2;
  color: #2f2724;
}

/* リンク */
.service-contact-box .free-contact-link{
  margin: 28px 0 0;
}

.service-contact-box .free-contact-link a{
  display: inline-block;
  color: #0F69AB;
  border-bottom: 1.5px solid #0F69AB;
  text-decoration: none;
  font-size: 16px;
  line-height: 1.8;
  font-weight: 500;
  transition: all 0.3s ease;
}

.service-contact-box .free-contact-link a:hover{
  color: #5aa3db;
  border-bottom-color: #5aa3db;
}


.service-cta-contact .section-header__text{
  max-width: 900px;
  margin: 34px auto 0;
  font-size: 28px;
  line-height: 1.5;
  font-weight: 700 !important;
  text-align: center;
  letter-spacing: 0; 
}

.service-contact-box{
  max-width: 1000px;
  margin: 10px auto 0;
  text-align: center;
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: 0;
  color: #2f2724;
}

.service-contact-box .free-text{
  margin: 0 0 10px;
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}
/* =============================
   SP
============================= */
@media (max-width: 767px){

  .service-cta-contact{
    padding: 4px 20px 10px;
  }

  .service-cta-contact .section-header{
    margin-bottom: 24px;
  }

  .service-cta-contact .section-header__en{
    font-size: 38px !important;
    margin: 0 !important;
  }

  .service-cta-contact .section-header__sub{
    font-size: 22px;
    margin-top: 10px;
  }

  .service-cta-contact .section-header__text{
    margin-top: 24px;
    font-size: 16px;
    line-height: 1.7;
  }

  .service-contact-box{
    margin-top: 28px;
  }

  .service-contact-box .free-text{
    font-size: 14px;
    line-height: 1.9;
  }

  .service-contact-box .free-contact-link{
    margin-top: 20px;
  }

  .service-contact-box .free-contact-link a{
    font-size: 14px;
    line-height: 1.7;
  }
}




/* =========================

   ★サービス02：　低圧電力

   ========================= */

/* ===============================
 従量料金単価セクション 全体
=============================== */
.usage-based {
  padding: 80px 20px 30px;
  background: #fff;
}

/* ===============================
 タイトル
=============================== */
.usage-based-title {
  font-size: 38px !important;
  margin-bottom: 0 !important;
}

.usage-based-sub {
  text-align: center;
  font-size: 22px;
}

/* ===============================
 レイアウト
=============================== */
.usage-based-inner {
  display: flex;
  align-items: center;
  gap: 12px;
}

.usage-based-left,
.usage-based-right {
  width: 50%;
}

/* ===============================
 boxグループ
=============================== */
.usage-based-box-group {
  display: flex;
  align-items: center;
  gap: 25px;
  margin-bottom: 10px !important;

  position: relative; /* ★追加：中央＋の基準 */
}

/* 左（縦2段） */
.usage-based-col-left {
  display: flex;
  flex-direction: column;
  gap: 15px;
  position: relative;
}

/* 右（大） */
.usage-based-col-right {
  display: flex;
}

/* ===============================
 ボックス
=============================== */
.usage-based-box {
  background: #fff;
  border-radius: 12px;
  padding: 18px;
  text-align: center;

  box-shadow: 6px 6px 15px rgba(0,0,0,0.15);
}

/* サイズ */
.usage-based-box.small {
  width: 220px;
}

.usage-based-box.large {
  width: 240px;
  height: 190px;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* ===============================
 アイコン
=============================== */
.usage-based-box.large .box-icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-bottom: 5px;
}

.usage-based-box.large .box-icon img {
  display: block;
  width: 100%;
  height: auto;
}

/* ===============================
 テキスト
=============================== */
.box-title {
  font-size: 22px;
  font-weight: bold;
  line-height: 1.4;
  margin: 0 !important;
}

.box-desc {
  font-size: 13px;
  line-height: 1.6;
  color: #555;
}

/* ===============================
 ＋（共通）
=============================== */
.usage-based-plus {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  background: linear-gradient(180deg, #F8AE25, #E0780F);
  border: 2px solid #fff;
  flex-shrink: 0;
}

/* ===============================
 左の＋（縦中央）
=============================== */
.usage-based-col-left .usage-based-plus {
  position: absolute;
  right: 75px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

/* ===============================
 ★中央＋（完全中央配置）
=============================== */
.usage-based-plus.center {
  position: absolute;
  top: 50%;
  left: calc(220px + 5px); 
  /* small幅 + gap + 微調整 */

  transform: translate(-50%, -50%);
  z-index: 20;
}
/* ===============================
 結果バー
=============================== */
.usage-based-result {
  margin: 15px auto 5px;
  padding: 0 25px;
  border-radius: 12px;
  font-size: 22px;
  font-weight: bold;
  color: #fff;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  background: linear-gradient(
    135deg,
    #A5CEFE 0%,
    #EEAF71 50%,
    #EE8316 100%
  );

  box-shadow: 6px 6px 15px rgba(0,0,0,0.15);
}

/* チェック */
.usage-based-result .check {
  background: #fff;
  color: #F8AE25;
  border-radius: 50%;
  width: 30px;
  height: 30px;

  display: flex;
  align-items: center;
  justify-content: center;
}

/* 0円 */
.usage-based-result .highlight {
  font-size: 34px;
  margin-left: 5px;
}

.usage-based-result .result-text {
  display: flex;
  align-items: center; /*文字の真ん中で合わせる */
}

/* ===============================
 補足
=============================== */
.usage-based-note {
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  color: #036EB7;
}

/* ===============================
 右画像
=============================== */
.usage-based-right img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===============================
 SP対応
=============================== */
@media (max-width: 768px) {

  .usage-based {
    padding: 55px 20px 40px;
    overflow: hidden;
  }

  /* ===============================
   タイトル
  =============================== */

  .usage-based-title {
    font-size: 34px !important;
    line-height: 1.3;
    margin-bottom: 20px !important;
  }

  .usage-based-sub {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 35px;
  }

  /* ===============================
   全体レイアウト
  =============================== */

  .usage-based-inner {
    flex-direction: column;
    gap: 45px;
  }

  .usage-based-left,
  .usage-based-right {
    width: 100%;
  }

  /* ===============================
   BOXグループ
  =============================== */

  .usage-based-box-group {
    flex-direction: column;
    align-items: center;
    gap: 28px;
    margin-bottom: 25px !important;
  }

  /* 左２つ */
  .usage-based-col-left {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 26px;
    position: relative;
  }

  /* ===============================
   BOX
  =============================== */

  .usage-based-box.small {
    width: calc(50% - 13px);
    max-width: 180px;
    min-height: 110px;

    padding: 18px 12px;
  }

  /* ===============================
   アイコン
  =============================== */

  .usage-based-box.large .box-icon {
    width: 92px;
    height: 92px;
    margin-bottom: 12px;
  }

  /* ===============================
   テキスト
  =============================== */

  .box-title {
    font-size: 20px;
    line-height: 1.4;
  }

  .box-desc {
    font-size: 13px;
    line-height: 1.6;
  }

  /* ===============================
   左中央の＋
  =============================== */

  .usage-based-col-left .usage-based-plus {
    position: absolute;
    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);
    z-index: 20;
  }

  /* ===============================
   中央＋（大BOXとの間）
  =============================== */

  .usage-based-plus.center {
    position: absolute;

    left: 50%;
    top: calc(100% - 115px);

    transform: translateX(-50%);
    z-index: 30;
  }

  /* ===============================
   ＋ 共通
  =============================== */

  .usage-based-plus {
    width: 54px;
    height: 54px;
    font-size: 28px;
  }

  /* ===============================
   結果バー
  =============================== */

  .usage-based-result {
    margin: 20px auto 18px;
    padding: 18px 20px;

    border-radius: 18px;

    gap: 12px;

    flex-wrap: wrap;
  }

  .usage-based-result .check {
    width: 34px;
    height: 34px;
    font-size: 20px;
  }

  .usage-based-result .result-text {
    font-size: 22px;
    line-height: 1.4;
  }

  .usage-based-result .highlight {
    font-size: 52px;
    line-height: 1;
  }

  /* ===============================
   補足
  =============================== */

  .usage-based-note {
    font-size: 16px;
    line-height: 2;
    padding: 0 10px;
  }

  /* ===============================
   グラフ画像
  =============================== */

  .usage-based-right img {
    width: 100%;
    max-width: 430px;
    margin: 0 auto;
    display: block;
  }

}



/* ===============================
SP対応
=============================== */
@media (max-width: 768px) {

  .usage-based {
    padding: 55px 22px 40px;
    overflow: hidden;
  }

  /* ===============================
   タイトル
  =============================== */
  .usage-based-title {
    font-size: 28px !important;
    line-height: 1.3 !important;
    margin-bottom: 18px !important;
  }

  .usage-based-sub {
    font-size: 17px;
    line-height: 1.9;
    margin-bottom: 35px;
  }

  /* ===============================
   全体
  =============================== */
  .usage-based-inner {
    flex-direction: column;
    gap: 40px;
  }

  .usage-based-left,
  .usage-based-right {
    width: 100%;
  }

  /* ===============================
   BOX全体
  =============================== */
  .usage-based-box-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    position: relative;
    margin-bottom: 25px !important;
  }

  /* ===============================
   上２つ横並び固定
  =============================== */
  .usage-based-col-left {
    display: flex;
    flex-direction: row !important;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    gap: 18px;
    width: 100%;
    position: relative;
  }

  /* 小BOX */
  .usage-based-box.small {
    width: calc(50% - 5px);
    max-width: 180px;
    min-height: 85px;
    padding: 16px 10px;
    flex-shrink: 0;
  }

  /* ===============================
   大BOX
  =============================== */
  .usage-based-box.large {
    width: 100%;
    max-width: 380px;
    height: auto !important;
    min-height: unset !important;
    padding: 28px 16px 22px;
    display: block;
  }

  /* 上段 */
  .usage-based-box.large .box-top {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 0;
  }

  /* アイコン */
  .usage-based-box.large .box-icon {
    width: 68px;
    height: 68px;
    margin-bottom: 0;
    flex-shrink: 0;
    position: relative;
    top: -6px;
  }

  /* タイトル */
  .usage-based-box.large .box-title {
    font-size: 28px;
    line-height: 1.2;
    margin: 0 !important;
  }

  /* 説明文 */
  .usage-based-box.large .box-desc {
    text-align: center;
    font-size: 14px;
    line-height: 0.9;
  }

  /* ===============================
   ＋共通
  =============================== */
  .usage-based-plus {
    width: 52px;
    height: 52px;
    font-size: 28px;
    z-index: 20;
  }

  /* 左２つの間 */
  .usage-based-col-left .usage-based-plus {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  /* 真ん中＋ */
  .usage-based-plus.center {
    position: absolute;
    left: 50%;
    top: 118px;
    transform: translateX(-50%);
  }

  /* ===============================
   結果バー
  =============================== */
  .usage-based-result {
    margin: 20px auto 18px;
    padding: 18px 16px;
    border-radius: 16px;
    gap: 12px;
  }

  .usage-based-result .check {
    width: 34px;
    height: 34px;
    font-size: 20px;
    flex-shrink: 0;
  }

  .usage-based-result .result-text {
    font-size: 22px;
    line-height: 1.4;
  }

  .usage-based-result .highlight {
    font-size: 52px;
    line-height: 1;
  }

  /* ===============================
   補足
  =============================== */
  .usage-based-note {
    font-size: 15px;
    line-height: 2;
    padding: 0 10px;
  }

  /* ===============================
   グラフ
  =============================== */
  .usage-based-right img {
    width: 100%;
    max-width: 430px;
    display: block;
    margin: 0 auto;
  }
}


/* =============================
 ３つの電力契約の目安　全体 
============================= */


.section-power-contract {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(to bottom right, #ffffff, #D6E9FF);
  padding: 50px 20px;
}

.power-contract-inner {
  max-width: 1100px;
  margin: 0 auto;
}

/* タイトル */
.power-contract-inner .usage-based-title {
  font-size: 32px !important;
  margin-bottom: 40px !important;
}

/* =====================================
   各ボックス
===================================== */

.power-contract-box {
  background: #fff;
  padding: 34px 40px;
  margin-bottom: 40px;
}

/* 上部 */
.power-contract-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 4px;
  gap: 30px;
}

.power-contract-company {
  color: #036EB7 !important;
  font-size: 32px !important;
  font-weight: bold !important;
  line-height: 1.2 !important;
  margin: 0;
}

/* 折り返しにならないよう調整 */
.power-contract-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 30px;
}

.power-contract-company {
  width: auto !important;
  flex: 0 0 auto;
  margin: 0;
}

.power-contract-condition {
  flex: 1;
  text-align: right;
  white-space: nowrap;
}



.power-contract-company span {
  font-size: 28px;
}

.power-contract-condition {
  margin: 0;
  font-size: 16px;
  line-height: 1.7;
  text-align: right;
  color: #333;
  padding-top: 12px;
}

/* =====================================
   中身
===================================== */

.power-contract-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

/* 左 */
.power-contract-before {
  width: 400px;
  background: #F1F1F1;
  padding: 22px 20px;
  text-align: center;
}

.power-contract-label {
  display: inline-block;
  background: #fff;
  padding: 3px 8px;
  font-size: 13px;
  margin-bottom: 8px;
}

.power-contract-small {
  font-size: 18px;
  margin-bottom: 0;
  line-height: 1.6;
  color: #333;
}

.power-contract-price {
  font-size: 30px !important;
  font-weight: bold;
  line-height: 1.2;
  color: #000;
}

.power-contract-price span {
  font-size: 28px;
}

.power-contract-price-small {
  font-size: 0.55em !important;
  position: relative;
  top: -0.08em;
}

/* 矢印 */
.power-contract-arrow {
  color: #036EB7;
  font-size: 26px;
  font-weight: bold;
  line-height: 1; 
}

/* =====================================
   中央
===================================== */

.power-contract-after {
  display: flex;
  border: 2px solid #036EB7;
}

.power-contract-after-left {
  width: 420px;
  background: #fff;
  text-align: center;
  padding: 22px 22px 14px;
}

.power-contract-after-label {
  display: inline-block;
  background: #B4D4EA;
  padding: 2px 18px;
  font-size: 13px;
  margin-bottom: 8px;
}

/* 右 */
.power-contract-saving {
  width: 320px;
  background: #036EB7;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 30px 18px;
  text-align: center;
}

.power-contract-saving-text {
  font-size: 18px;
  line-height: 1.4;
}

.power-contract-saving-text-sub {
  font-size: 14px;
  line-height: 1.4;
}


.power-contract-saving-price {
  font-size: 26px;
  font-weight: bold;
  line-height: 1.2;
  margin: 10px 0;
}

/* イラスト */
.power-contract-image {
  width: 220px;
  flex-shrink: 0;
}

.power-contract-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* 注釈 */
.power-contract-note {
  margin-top: 30px !important;
  padding-left: 1.2em !important;
  font-size: 14px !important;
  line-height: 2 !important;
  text-align: left !important;
  list-style: none !important;
  padding-left: 50px !important;
}

.power-contract-note li {
  position: relative;
  list-style: none !important;
}

.power-contract-note li::before {
  content: "※" !important;
  position: absolute !important;
  left: -1.2em !important;
  top: 0 !important;
  background: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  width: auto !important;
  height: auto !important;
}


/* =============================
 SP
============================= */
@media screen and (max-width: 768px) {

  .section-power-contract {
    padding: 40px 16px;
  }

  .power-contract-inner {
    max-width: 100%;
  }

  .power-contract-inner .usage-based-title {
    font-size: 28px !important;
    line-height: 1.5;
    margin-bottom: 28px !important;
  }

  .power-contract-box {
    padding: 24px 16px;
    margin-bottom: 24px;
  }

  /* =============================
   上部
  ============================= */

  .power-contract-head {
    display: block;
    margin-bottom: 20px;
  }

  .power-contract-company {
    width: auto !important;
    font-size: 24px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    margin-bottom: 4px;
  }

  .power-contract-company span {
    font-size: 16px;
  }

  .power-contract-condition {
    margin: 0;
    padding-top: 0;
    font-size: 13px;
    line-height: 1.7;
    text-align: center;
    white-space: normal;
  }

  /* =============================
   中身
  ============================= */

  .power-contract-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }

  /* 左 */

  .power-contract-before {
    width: 100%;
    padding: 20px 16px;
  }

  .power-contract-label {
    font-size: 12px;
    padding: 3px 8px;
    margin-bottom: 8px;
  }

  .power-contract-small {
    font-size: 16px;
    margin-bottom: 8px;
  }

  .power-contract-price {
    font-size: 28px !important;
  }

  .power-contract-price-small {
    font-size: 0.55em !important;
    position: relative;
    top: -0.08em;
  }

  /* 矢印 */

  .power-contract-arrow {
    font-size: 22px;
    transform: rotate(90deg);
    margin: 0;
  }

  /* =============================
   Sailar Energy側
  ============================= */

  .power-contract-after {
    width: 100%;
    display: block;
  }

  .power-contract-after-left {
    width: 100%;
    padding: 20px 16px 16px;
  }

  .power-contract-after-label {
    font-size: 12px;
    padding: 3px 10px;
    margin-bottom: 8px;
  }

  /* 削減額 */

  .power-contract-saving {
    width: 100%;
    padding: 18px 14px;
  }

  .power-contract-saving-text {
    font-size: 16px;
  }

  .power-contract-saving-price {
    font-size: 28px;
    margin: 8px 0;
  }

  /* イラスト */

  .power-contract-image {
    width: 72%;
    max-width: 220px;
    margin-top: 2px;
  }

  .power-contract-image img {
    width: 100%;
    height: auto;
    display: block;
  }

 /* 注釈 */
  .power-contract-note {
    margin-top: 20px !important;
    padding-left: 0 !important;
    font-size: 12px !important;
    line-height: 1.9 !important;
    text-align: left !important;
  }

  .power-contract-note li {
    position: relative;
    padding-left: 1.2em;
  }

  .power-contract-note li::before {
    content: "※" !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    background: none !important;
    mask-image: none !important;
    -webkit-mask-image: none !important;
    width: auto !important;
    height: auto !important;
  }

}



/* =============================
 青グラデ・下▽付きの見出し
============================= */
.blue-gradation-head{
  position: relative;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  padding: 8px 12px;
  line-height: 1.4; 
  margin: 20px auto 50px;
  background: linear-gradient(to bottom, #A3D8FF, #0F69AB);
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

/* ▼（文字→図形に変更） */
.blue-gradation-head::after{
  content: "";
  position: absolute;
  bottom: -13px !important;
  top: auto;
  left: 50%;
  transform: translateX(-50%);
  bottom: -16px;

  width: 0;
  height: 0;

  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 14px solid #0F69AB;
}
/* =============================
   SP：青グラデ見出し余白
============================= */
@media (max-width: 768px) {
  .blue-gradation-head{
    margin: 20px 0 20px;
    font-size: 20px;
  }
}


/* =============================
 レイアウト
============================= */
.down-example-content{
  display: flex;
  gap: 40px;
  margin-top: 30px;
  padding: 0 30px;
}

.down-example-left,
.down-example-right{
  flex: 1;
}

/* =============================
 左
============================= */
.down-example-left img{
  width: 100%;
  display: block;
  margin: 0 auto 6px;
}

/* 金額 */
.down-example-prices{
  display: flex;
  justify-content: space-between;
  font-size: 22px;
  padding: 0 30px;
  font-weight: bold;
}


/* 強調テキスト */
.strong-normal{
  font-weight:700;
  font-size:1.35em;
  line-height:1;
}

/* =============================
 右ボックス
============================= */
.down-example-box{
  border: 2px solid #036EB7;
  background: #fff;
  margin-top: 30px;
}

/* 上帯 */
.down-example-box-head{
  background: #036EB7;
  color: #fff;
  text-align: center;
  padding: 10px;
  font-weight: bold;
  line-height: 1.1;
}

/* 本体 */
.down-example-box-body{
  text-align: center;
  padding: 15px;
}

/* テキスト */
.down-example-text{
  font-size: 22px;
  font-weight: bold;
  line-height: 1.2;
}

/* オレンジ金額（少し小さめ） */
.down-example-text .cost-title-orange{
  font-size: 32px;
}

.down-example-text .yen{
  font-size: 0.6em;
}

/* 青 */
.down-example-text .cost-title-blue{
  font-size: 26px;
}

/* 注意書き */
.down-example-note{
  text-align: center;
  font-size: 12px;
  margin-top: 12px;
  line-height: 1.6;
}


/* =============================
 SP
============================= */
@media (max-width:768px){

  .down-example-content{
    flex-direction: column;
    gap: 0;
  }

  /* 金額 */
  .down-example-prices{
    font-size: 18px;
    padding: 0 10px;
  }

  /* 強調テキスト */
  .strong-normal{
    font-size:1.1em;
  }


}



/* ===================================================

   サービス03：　CO₂排出量の見える化（Carbon Vision）

   =================================================== */

/* =====================================
   セクション全体
===================================== */
.issue-solution-section {
  padding: 70px 20px 60px;
  background: #fff;
}

.issue-solution-section .inner {
  max-width: 1000px;
  margin: 0 auto;
}


/* =====================================
   上：issue
===================================== */
.issue-inner {
  display: flex;
  gap: 60px;
  padding: 0 40px;
  align-items: flex-start;
}

.issue-image {
  width: 45%;
}

.issue-image img {
  width: 100%;
  display: block;
}

.issue-content {
  width: 55%;
}

.issue-title {
  font-size: 20px !important;
  margin-bottom: 20px !important;
  text-align: left !important;
}

/* =====================================
   チェックアイコン修正（テーマ上書き）
===================================== */

/* デフォルトの黒丸を消す */
.issue .issue-list {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 0;
}

/* liのベース */
.issue .issue-list li {
  position: relative;
  padding-left: 36px;
  margin-bottom: 14px;
  font-size: 16px;
}

/* チェックアイコン */
.issue .issue-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 2px;

  width: 22px;
  height: 22px;
  background: #5D9B65;
  color: #fff;

  border-radius: 50%;
  font-size: 14px;
  text-align: center;
  line-height: 22px;
  font-weight: bold;
}


/* =====================================
   三角（グラデーション）
===================================== */

.issue-solution-arrow {
  width: 90px;
  height: 58px;
  margin: 30px auto 50px;
  position: relative;
}

.issue-solution-arrow::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;

  /* グラデーション（白30%） */
  background: linear-gradient(
    to bottom,
    #ffffff 0%,
    #ffffff 5%,
    #B4D6A5 100%
  );

  /* 三角に切り抜き */
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}

/* =====================================
   下：solution
===================================== */
.solution-inner {
  display: flex;
  gap: 20px;
  padding: 0 20px;
  align-items: flex-start;
}

.solution-content {
  width: 45%;
}

.solution-title {
  font-size: 24px !important;
  margin-bottom: 20px !important;
  text-align: left !important;;
}

.solution-text {
  font-size: 15px;
  line-height: 1.8;
}

.solution-image {
  width: 55%;
}

.solution-image img {
  width: 100%;
  display: block;
}

.solution-note {
  font-size: 13px;
  margin-top: 10px;
  color: #333;
  font-weight: bold;
  text-align: left;
}


/* =============================
   太陽光PPA 横幅55%バリエーション
============================= */

.solution--wide {
  margin-top: 100px;
}


.solution--wide .solution-content {
  width: 50%;
}

.solution--wide .solution-image {
  width: 45%;
}

/* =====================================
   SP対応
===================================== */
@media screen and (max-width: 768px) {

  .issue-solution-section {
    padding: 30px 20px 40px;
    background: #fff;
}


  .issue-inner,
  .solution-inner {
    flex-direction: column;
    padding: 0;
  }

  .issue-image,
  .issue-content,
  .solution-content,
  .solution-image {
    width: 100%;
  }

  .issue-solution-arrow {
    margin: 30px auto;
  }

  .issue-title,
  .solution-title {
    font-size: 20px;
  }

  .issue .issue-list li {
    margin-bottom: 12px;
    font-size: 13px;
  }
  
  .solution-note {
    font-size: 12px;
    line-height: 1.6;
  }
}

/* =====================================
   SP対応（太陽光発電ページ postid-20 のみ）
===================================== */
@media screen and (max-width: 768px) {

  body.postid-20 .issue-solution-section {
    padding: 30px 20px 40px;
    background: #fff;
  }

  body.postid-20 .issue-inner,
  body.postid-20 .solution-inner,
  body.postid-20 .solution--wide .solution-inner {
    display: flex;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 24px;
    width: 100%;
    padding: 0;
    box-sizing: border-box;
  }

  body.postid-20 .issue-image,
  body.postid-20 .issue-content,
  body.postid-20 .solution-content,
  body.postid-20 .solution-image,
  body.postid-20 .solution--wide .solution-content,
  body.postid-20 .solution--wide .solution-image {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    box-sizing: border-box;
  }

  body.postid-20 .issue-solution-arrow {
    margin: 30px auto;
  }

  body.postid-20 .issue-title,
  body.postid-20 .solution-title {
    font-size: 22px !important;
    line-height: 1.5;
    margin-bottom: 20px !important;
    word-break: keep-all;
    text-align: center !important;
  }

  body.postid-20 .solution-title br {
    display: none;
  }

  body.postid-20 .issue .issue-list li {
    margin-bottom: 12px;
    font-size: 13px;
  }

  body.postid-20 .solution-text {
    font-size: 15px;
    line-height: 2;
  }

  body.postid-20 .solution-note {
    font-size: 12px;
    line-height: 1.6;
  }

  body.postid-20 .solution-image img,
  body.postid-20 .issue-image img,
  body.postid-20 .solution--wide .solution-image img {
    width: 100%;
    height: auto;
    display: block;
  }

  body.postid-20 .solution--wide {
    margin-top: 60px;
    padding: 0 20px;
  }

}


/* =====================================
   YouTube埋め込み
===================================== */
.solution-movie {
  margin-bottom: 80px;
}

.solution-movie-inner {
  max-width: 700px; /* ← 横幅指定 */
  margin: 0 auto;
}

/* レスポンシブ対応（16:9） */
.youtube-wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.youtube-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}



/* =====================================
   TRANSFORMATION セクション
===================================== */

/* 共通verの上marginを解除 */
.transformation-section .section-header {
  margin-top: 0;
}


/* TRANSFORMATIONだけ見出しの上余白を変更 */
.transformation-section .section-header__en{
  margin-top:20px !important;
}


.transformation-section {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(to bottom right, #ffffff, #B4D6A5);
  padding: 50px 20px 56px;
  margin-bottom: 80px;
}

.transformation-inner {
  max-width: 1000px;
  margin: 0 auto;
}


/* グリッド */
.transformation-grid {
  display: flex;
  gap: 20px;
  margin-top: 50px;
}

/* カード */
.transformation-card {
  position: relative;
  flex: 1;
  background: #fff;
  border-radius: 20px;
  padding: 30px 20px 25px;
  text-align: center;

  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

/* 番号（丸） */
.transformation-step {
  position: absolute;
  top: -25px;
  left: 50%;
  transform: translateX(-50%);

  width: 60px;
  height: 60px;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #fff;
  font-weight: bold;
  font-size: 20px;
}

/* 既存流用（色修正） */
.flow-step-green {
  background: linear-gradient(to bottom, #AACDA5, #3D8647);
}

/* タイトル */
.transformation-title {
  font-size: 18px !important;
  font-weight: bold !important;
  color: #3D8647 !important;
  margin-bottom: 15px !important;
  margin-top: 20px !important;
  text-align: center !important;
  line-height: 1.4 !important;
}

/* 下線 */
.transformation-title::after {
  content: "";
  display: block;
  width: 95%;
  height: 1px;
  background: #3D8647;
  margin: 10px auto 0;
}

/* テキスト */
.transformation-text {
  font-size: 14px;
  margin: 15px 0 20px !important;
  line-height: 1.6;
}

/* 画像 */
.transformation-image img {
  width: 100%;
  display: block;
  border-radius: 8px;
}


/* =====================================
   SP対応
===================================== */
@media screen and (max-width: 768px) {

  /* セクション余白 */
  .transformation-section {
    padding: 40px 28px 50px;
  }

  .transformation-section .section-header {
    padding: 0 !important;
  }

  /* EN見出し */
  .transformation-section .section-header__en{
    font-size: 30px !important;
    margin-top: 10px !important;
  }

  /* グリッド */
  .transformation-grid {
    flex-direction: column;
    gap: 40px;
    margin-top: 40px;
  }

  /* カード */
  .transformation-card {
    padding: 30px 20px;
  }

  /* タイトル */
  .transformation-title {
    font-size: 22px !important;
    line-height: 1.4 !important;
    margin-top: 12px !important;
    margin-bottom: 18px !important;
  }

  /* 本文 */
  .transformation-text {
    font-size: 16px;
    line-height: 1.6;
    margin: 8px 0 12px !important;
  }

  /* 画像 */
  .transformation-image {
    text-align: center;
  }

  .transformation-image img {
    width: 75%;
    margin: 0 auto;
    display: block;
  }

}



/* =====================================
   Carbon Vision 料金セクション
===================================== */
.cv-fee-section {
  padding: 0 20px 0;
  background: #fff;
}

.cv-fee-inner {
  max-width: 1100px;
  margin: 0 auto;
}

/* タイトル */
.cv-fee-title {
  margin: 0 auto !important;
  text-align: center !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #10563C !important;
}

/* 共通グラデーションライン */
.cv-fee-line {
  width: 100%;
  max-width: 620px;
  height: 12px;
  margin: 8px auto 50px;
  background: linear-gradient(to right, #DCEDCE, #5D9B65);
}

.cv-fee-line--short {
  max-width: none;
  width: 100%;
  height: 10px;
  margin: 18px 0 12px;
}

/* 2カラム */
.cv-fee-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

/* カード */
.cv-fee-card {
  background: #fff;
  border: 2px solid #D9D9D9;
  padding: 28px 24px 24px;
  text-align: center;
}

.cv-fee-card-title {
  margin: 0 0 18px;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  color: #333 !important;
}

/* 金額行 */
.cv-fee-price-row {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
  flex-wrap: nowrap;
}

.cv-fee-label {
  display: inline-block;
  padding: 7px 12px;
  border: 1px solid #666;
  font-size: 16px;
  line-height: 1.2;
  white-space: nowrap;
  margin-bottom: 5px;
}

.cv-fee-price {
  font-size: 46px;
  font-weight: 700;
  line-height: 1;
  color: #000;
  letter-spacing: 0.01em;
}

.cv-fee-yen {
  font-size: 0.9em;
}

.cv-fee-tax {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  margin-bottom: 3px;
}

/* 下の説明 */
.cv-fee-subprice {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  color: #111;
}

.cv-fee-subprice strong {
  font-size: 1.25em;
  font-weight: 700;
}

/* 注記 */
.cv-fee-note {
  text-align: center;
  margin-top: 16px !important;
  font-size: 14px;
}

/* =====================================
   SP
===================================== */
@media screen and (max-width: 768px) {
  .cv-fee-section {
    padding: 10px 20px 0;
  }

  .cv-fee-title {
    font-size: 24px !important;
  }

  .cv-fee-line {
    height: 10px;
    margin: 14px auto 34px;
  }

  .cv-fee-line--short {
    margin: 16px 0;
  }

  .cv-fee-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .cv-fee-card {
    padding: 28px 18px 24px !important;
  }

  .cv-fee-card-title {
    font-size: 18px !important;
    margin-bottom: 8px !important;
  }

  .cv-fee-price-row {
    gap: 8px;
    flex-wrap: wrap;
  }

  .cv-fee-label {
    font-size: 14px;
    padding: 6px 10px;
    margin-bottom: 0;
  }

  .cv-fee-price {
    font-size: 28px;
  }

  .cv-fee-tax {
    font-size: 18px;
    margin-bottom: 0;
  }

  .cv-fee-subprice {
    font-size: 18px !important;
  }

  .cv-fee-note {
    font-size: 14px;
    margin-top: 12px !important;
  }
}


/* =====================================
  プランの詳細説明ブロック（ユーザーID）など
===================================== */
.cv-fee-extra {
  display: flex;
  gap: 20px;
  margin: 0 auto 60px;
}

/* 左テキスト */
.cv-fee-discription {
  width: 30%;
  font-size: 16px;
  line-height: 1.9;
  color: #333;
  text-align: left;
  margin-top: 20px;
}

/* =========================
   右カラム
========================= */
.cv-fee-info {
  width: 70%;
  display: flex;
  flex-direction: column;
}

/* ★グレー背景はこっちに移動 */
.cv-fee-info-box {
  background: #F7F6F0;
  border-radius: 20px;
  padding: 12px 38px 16px 18px;
  margin-bottom: 8px;
}

/* リスト */
.cv-fee-info-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cv-fee-info-list li {
  display: flex;
  align-items: center;
  gap: 40px; /* ←これで左と右の間隔固定 */
  padding: 12px 0 0;
  border-bottom: 1px solid #898989;
}


.cv-fee-info-list li:last-child {
  border-bottom: none;
}

/* 左（アイコン＋ラベル） */
.cv-fee-info-left {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 220px;
}

.cv-fee-info-left img {
  width: 40px;
  height: auto;
}

.cv-fee-info-label {
  font-size: 18px;
  font-weight: 700;
  color: #10563C;
}

/* =========================
   右（数値まわり）
========================= */
.cv-fee-info-right {
  display: flex;
  align-items: center;
  gap: 5px;
}

.cv-strong-orange {
  font-size: 42px;
  font-weight: 700;
  color: #E0780F;
  line-height: 1;
  margin-bottom: 12px;
}

.cv-fee-info-text {
  font-size: 18px;
  font-weight: 700;
  color: #333;
  line-height: 1.6;
}

/* =========================
   注記（NOTE）
========================= */
.cv-fee-info-note {
  margin-top: 4px;
  font-size: 14px;
  color: #333;
  text-align: left;
  line-height: 1.6;
}

/* =====================================
   SP
===================================== */
/* =====================================
   SP
===================================== */
@media screen and (max-width: 768px) {

  /* 全体縦並び */
  .cv-fee-extra {
    flex-direction: column;
    gap: 0;
  }

  /* 左右カラム */
  .cv-fee-discription,
  .cv-fee-info {
    width: 100%;
    padding: 0 20px;
  }

  .cv-fee-info {
    padding: 20px 20px 0;
  }

  /* 情報BOX */
  .cv-fee-info-box {
    background: #F7F6F0;
    border-radius: 20px;
    padding: 2px 18px 6px;
  }

  /* リスト */
  .cv-fee-info-list {
    padding: 0 !important;
  }

  .cv-fee-info-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }

  /* 左側 */
  .cv-fee-info-left {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 180px;
  }

  /* 右側 */
  .cv-fee-info-right {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
  }

  /* ラベル */
  .cv-fee-info-label {
    font-size: 14px;
  }

  /* 説明 */
  .cv-fee-info-text {
    font-size: 12px;
    line-height: 1.6;
  }

  /* 数字 */
  .cv-strong-orange {
    display: inline-block;
    font-size: 26px;
    line-height: 1;
    white-space: nowrap;
    margin-bottom: 4px;

  }

  /* 注釈 */
  .cv-fee-info-note {
    margin-top: 14px;
  }

}


/* =====================================
    無料トライアルCTAバナー
===================================== */
.cv-banner {
  max-width: 700px;
  margin: 20px auto;
  padding: 50px 20px;

  background: linear-gradient(
    to bottom,
    #3F9F4C 0%,
    #DCEDCE 60%,
    #F8F8F8 100%
  );
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
}

/* 内側 */
.cv-banner-inner {
  text-align: center;
}

/* タイトル */
.cv-banner-title {
  font-size: 36px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 0 !important;

  /* うっすら影で視認性UP */
  text-shadow: 0 3px 6px rgba(0,0,0,0.4);
}

/* ボタン余白 */
.cv-banner-button {
  display: flex;
  justify-content: center;
}

/* 下の注記 */
.cv-banner-note {
  text-align: center;
  font-weight: 700;
  margin: 40px auto 30px  !important;
  font-size: 18px;
  color: #333;
  padding-bottom: 20px;
}


/* =========================
   3カラム グリーンver（追加分）
========================= */

/* 横幅制御だけ追加 */
.merit-list-green-3 {
  max-width: 1000px;
  margin: 0 auto 80px;
}

/* 既存blueの置き換え用（ほぼ同じ構造） */
.merit-box-green {
  flex: 1;
  border: 2px solid #5D9B65;
  border-radius: 18px;
  padding: 30px 20px;
  background: #fff;
  text-align: center;
}

/* タイトル */
.merit-title-green {
  color: #5D9B65;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 12px !important;
  padding-bottom: 12px;
  border-bottom: 1px solid #5D9B65;
}


/* =========================
   SP対応
========================= */
@media (max-width: 768px) {

  /* 全体余白 */
  .merit-list-green-3 {
    padding: 0 18px;
    margin-bottom: 50px;
  }

  /* 縦積み */
  .merit-list-green-3 {
    display: flex;
    flex-direction: column;
    gap: 22px;
  }

  /* カード */
  .merit-box-green {
    padding: 34px 24px 30px;
    border-radius: 22px;
  }

  /* タイトル */
  .merit-title-green {
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 18px !important;
    padding-bottom: 16px;
  }

  /* 本文 */
  .merit-box-green p {
    font-size: 18px !important;
    line-height: 1.8 !important;
    margin: 12px 0 0 !important;
  }

}


/* オレンジバッジを年間プランだけ基準にする */
.cv-fee-card.year-plan {
  position: relative;
}

.cv-fee-card.year-plan .plan-badge {
  position: absolute;
  top: -70px;
  right: -30px;
  z-index: 3;
}

.cv-fee-card-title {
  margin-top: 0 !important;
}


/* =========================
   SP対応
========================= */
@media screen and (max-width: 768px) {

  .cv-fee-card.year-plan .plan-badge {
    top: -28px;
    right: -10px;
  }

  .cv-banner-title {
    font-size: 28px !important;
    line-height: 1.4;
  }

  .cv-banner-note {
    font-size: 14px;
    line-height: 1.5;
    margin: 30px auto 0 !important;
    padding: 0 20px;
  }
}



/* =============================
   flow-step-green-col-5
============================= */
.flow-step-green-col-5{
  padding: 30px 0 10px;
}

.flow-step-green-col-5 .flow-inner{
  max-width: 1200px; /* ←5カラムなので少し広げる */
  margin: 0 auto;
  position: relative;
}

/* =============================
   グリッド
============================= */
.flow-step-green-col-5 .flow-grid{
  display: grid;
  gap: 0;
  position: relative;
  z-index: 1;
}

.flow-step-green-col-5 .flow-grid.col-5{
  grid-template-columns: repeat(5, 1fr);
}

/* =============================
   ライン（緑）
============================= */
.flow-step-green-col-5 .flow-line{
  position: absolute;
  top: 0px;
  left: 0;
  width: 100%;
  height: 4px;
  z-index: 1;
}

.flow-step-green-col-5 .flow-line-green{
  background: linear-gradient(
    to right,
    #EAF5EC 0%,
    #AACDA5 20%,
    #3D8647 100%
  );
}

/* =============================
   カラム
============================= */
.flow-step-green-col-5 .flow-item{
  text-align: center;
  padding: 35px 12px 25px;

  border-top: 0.5px solid #898989;
  border-bottom: 0.5px solid #898989;
  border-left: 0.5px solid #898989;
  border-right: none;

  background: transparent;
  position: relative;
  z-index: 2;
}

.flow-step-green-col-5 .flow-item:last-child{
  border-right: 0.5px solid #898989;
}

/* =============================
   ステップ円
============================= */
.flow-step-green-col-5 .flow-step{
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 60px;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 22px;
  font-weight: bold;
  color: #fff;

  z-index: 3;
}

.flow-step-green-col-5 .flow-step-green{
  background: linear-gradient(to bottom, #AACDA5, #3D8647);
}

/* =============================
   タイトル
============================= */
.flow-step-green-col-5 .flow-title{
  margin: 12px auto !important;
  font-size: 20px !important;
  text-align: center !important;
}

.flow-step-green-col-5 .flow-title-green{
  color: #2E6F3A !important;
}

/* =============================
   画像
============================= */
.flow-step-green-col-5 .flow-img{
  width: 100%;
  margin: 10px auto 0;
}

/* =============================
   テキスト
============================= */
.flow-step-green-col-5 .flow-text{
  font-size: 12px;
  line-height: 1.8;
}

.flow-step-green-col-5 .flow-message{
  text-align: center;
  font-size: 22px;
  color: #2E6F3A;
  margin-top: 20px;
}


/* =============================
   SP
============================= */
@media (max-width: 768px){

  /* 外枠余白 */
  .flow-step-green-col-5 {
    padding: 10px 0 0;
  }



  .flow-step-green-col-5 .flow-inner{
    padding: 0 18px;
  }

  /* 1カラム */
  .flow-step-green-col-5 .flow-grid.col-5{
    grid-template-columns: 1fr;
    gap: 0;
  }

  /* ライン非表示 */
  .flow-step-green-col-5 .flow-line{
    display: none;
  }

  /* カード */
  .flow-step-green-col-5 .flow-item{
    border: 0.5px solid #898989;
    padding: 34px 18px 24px;
    border-bottom: none;
  }

  /* 最後だけ下border戻す */
  .flow-step-green-col-5 .flow-item:last-child{
    border-bottom: 0.5px solid #898989;
  }

  /* ステップ円 */
  .flow-step-green-col-5 .flow-step{
    top: -24px;
    width: 54px;
    height: 54px;
    font-size: 20px;
  }

  /* タイトル */
  .flow-step-green-col-5 .flow-title{
    font-size: 20px !important;
    line-height: 1.6 !important;
    margin: 8px auto 12px !important;
  }

  /* 画像 */
  .flow-step-green-col-5 .flow-img{
    width: 75%;
    margin: 10px auto 14px;
  }

  /* 本文 */
  .flow-step-green-col-5 .flow-text{
    font-size: 15px;
    line-height: 1,7;
  }

  /* 下メッセージ */
  .flow-step-green-col-5 .flow-message{
    font-size: 18px;
    line-height: 1.8;
    margin-top: 24px;
    padding: 0 16px;
  }

 /* Carbon Visionだけ セクション間余白調整 */
  .single-service.postid-21 .p-single {
    row-gap: 10px;
  }

}

/* =============================
   solar-discription
============================= */
.solar-discription {
  padding: 60px 20px 20px;
}

.solar-discription-inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

/* タイトル */
.solar-discription-title {
  font-size: 32px;
  margin-bottom: 20px;
}

/* リード文 */
.solar-discription-lead {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 30px;
}

/* 画像 */
.solar-discription-image img {
  width: 100%;
  display: block;
  margin-bottom: 20px;
}

/* 補足テキスト */
.solar-discription-note {
  font-size: 14px;
  color: #333;
  margin-bottom: 30px !important;
  line-height: 1.7;
}

/* =============================
   メリット（4分割）
============================= */

/* ul本体 */
.solar-discription-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  font-weight: 700;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

/* li本体 */
.solar-discription-list li {
  position: relative;

  background: #EDF3F0;
  padding: 10px 15px 10px 60px;
  border-radius: 10px;

  font-weight: bold;
  font-size: 20px;

  list-style: none !important;

  display: flex;
  align-items: center;
}

/* ←これが超重要（TCD対策） */
.solar-discription-list li::marker {
  content: "" !important;
}

/* チェックマーク */
.solar-discription-list li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 24px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 22px !important;
  height: 22px !important;
  background: #5D9B65 !important;
  color: #fff !important;
  border-radius: 50%;
  font-size: 14px;
  text-align: center;
  line-height: 22px;
  font-weight: bold;
}

/* =============================
   SP対応
============================= */
@media (max-width: 768px){

  .solar-discription {
    padding: 30px 20px 10px;
  }

  .solar-discription-title {
    font-size: 24px;
  }

  .solar-discription-lead {
    font-size: 15px;
    line-height: 1.8;
    text-align: left;
    margin-bottom: 10px;
}

  .solar-discription-list {
    grid-template-columns: 1fr;
  }

  .solar-discription-note {
    font-size: 13px;
    text-align: left;
}

/* メリット4項目 → 2列×2行 */
  .solar-discription-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }

  .solar-discription-list li {
    padding: 14px 10px 14px 44px;
    font-size: 14px;
    min-height: 52px;
    line-height: 1.5;
  }

  .solar-discription-list li::before {
    left: 14px !important;
    width: 20px !important;
    height: 20px !important;
    line-height: 20px;
    font-size: 12px;
  }

  .solar-discription-note {
    font-size: 13px;
    text-align: left;
  }

}


/* =============================
   PPA比較表
============================= */
.ppa-table-wrap {
  max-width: 1000px;
  margin: 40px auto 80px;
}

/* テーブル本体 */
.ppa-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  table-layout: fixed; /* ←これ重要 */
}

/* セル共通 */
.ppa-table th,
.ppa-table td {
  border: 1px solid #999;
  padding: 12px 10px;
  text-align: left;
  background: #fff;
  word-break: break-word;
}

/* =============================
   列幅調整
============================= */

/* 左列（項目）少し狭く */
.ppa-table th:first-child {
  width: 30%;
}

/* 残り3列を均等分割 */
.ppa-table th:not(:first-child),
.ppa-table td {
  width: calc(70% / 3);
}

/* =============================
   PPA列だけ色
============================= */
.ppa-highlight {
  background: #E6F2F8 !important;
}

/* =============================
   SP（横スクロールなし）
============================= */
@media (max-width: 768px){

  .s_table table {
     position: relative;
    padding: 0 20px;
    }

  .ppa-table,
  .ppa-table thead,
  .ppa-table tbody,
  .ppa-table th,
  .ppa-table td,
  .ppa-table tr {
    display: block;
    width: 100%;
  }

  /* ヘッダー非表示 */
  .ppa-table thead {
    display: none;
  }

  .ppa-table tr {
    margin-bottom: 20px;
    border: 1px solid #ddd;
    padding: 10px;
  }

  .ppa-table th {
    background: none;
    border: none;
    font-weight: bold;
    padding: 10px;
    margin-bottom: 5px;
  }


  .ppa-table td {
    border: none;
    padding: 5px 0;
    position: relative;
    padding-left: 110px;
  }

  /* ラベル表示 */
  .ppa-table td::before {
    position: absolute;
    left: 10px;
    top: 5px;
    font-weight: bold;
    white-space: nowrap;
  }

  /* 各列ラベル */
  .ppa-table td:nth-of-type(1)::before { content: "PPAモデル"; }
  .ppa-table td:nth-of-type(2)::before { content: "自己所有型"; }
  .ppa-table td:nth-of-type(3)::before { content: "リース"; }

  /* PPA強調は維持 */
  .ppa-highlight {
    background: #E6F2F8 !important;
    padding: 8px;
    border-radius: 5px;
  }

}

/* ========================================
   ４つのメリット（青2カラム × 2段）時だけ制御
======================================== */

.merit-col2-only {
  max-width: 1000px;
  margin: 40px auto 80px;
  flex-wrap: wrap;
}

/* ========================================
   フロー 7ステップ　上段＋3カラム（下段用css）
======================================== */
/* 下段3カラムだけ中央寄せ */
.flow-step-blue-col-4 .flow-grid.col-3{
  grid-template-columns: repeat(3, 1fr);
  max-width: 760px;
  margin: 0 auto;
}

/* 共通 */
.flow-step-blue-col-4 .flow-block{
  position: relative;
}

/* 上段：フル幅 */
.flow-step-blue-col-4 .flow-block .flow-line{
  top: 0;
  left: 0;
  width: 100%;
}

/* 下段だけ中央寄せライン */
.flow-step-blue-col-4 .flow-block-3 .flow-line{
  left: 50%;
  transform: translateX(-50%);
  max-width: 760px;
  width: 100%;
}

/* =====================================
   フロー 7ステップ SP版
===================================== */
@media (max-width: 768px){

  /* 全体余白 */
  .flow-step-blue-col-4{
    padding: 30px 0 24px;
  }

  .flow-step-blue-col-4 .flow-inner{
    padding: 0;
  }

  /* 上段4・下段3 を全部1列化 */
  .flow-step-blue-col-4 .flow-grid.col-4,
  .flow-step-blue-col-4 .flow-grid.col-3{
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 100%;
  }

  /* 下段中央寄せ解除 */
  .flow-step-blue-col-4 .flow-block-3{
    margin-top: 0 !important;
  }

  /* 青ライン非表示 */
  .flow-step-blue-col-4 .flow-line{
    display: none;
  }

  /* カード */
  .flow-step-blue-col-4 .flow-item{
    border: 0.5px solid #898989;
    padding: 32px 18px 6px;
  }

  /* 重複線防止 */
  .flow-step-blue-col-4 .flow-item + .flow-item{
    border-top: none;
  }

  /* ステップ円 */
  .flow-step-blue-col-4 .flow-step{
    top: -28px;
    width: 56px;
    height: 56px;
    font-size: 20px;
  }

  /* タイトル */
  .flow-step-blue-col-4 .flow-title{
    font-size: 18px !important;
    line-height: 1.6;
    margin-top: 8px !important;
  }

  /* 画像 */
  .flow-step-blue-col-4 .flow-img{
    width: 100%;
    margin: 18px 0;
    border-radius: 18px;
  }

  /* テキスト */
  .flow-step-blue-col-4 .flow-text{
    font-size: 14px;
    line-height: 2;
    margin-bottom: 28px;
  }

  .flow-step-blue-col-4 .flow-item:last-child .flow-text{
    margin-bottom: 18px;
  }

}

/* ========================================
   ご準備いただく資料
======================================== */

.flow-materials{
  display: flex;
  border: 1.5px solid #D9D9D9;
}

/* 左 */
.flow-materials__head{
  width: 260px;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 20px;
  font-weight: bold;
  color: #004879;

  /* 背景（30%透明） */
  background: linear-gradient(
    to bottom,
    rgba(163, 216, 255, 0.3),
    rgba(15, 105, 171, 0.3)
  );

  /* 枠線 */
  border-right: 1.5px solid #D9D9D9;
}
/* 右 */
.flow-materials__list{
  flex: 1;
  padding: 20px 40px;

  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px 40px;
}

/* アイテム */
.flow-materials__item{
  display: flex;
  align-items: center;
  gap: 12px;
}

/* アイコン */
.flow-materials__item img{
  width: 40px;
  height: 40px;
}

/* テキスト */
.flow-materials__item p{
  font-size: 16px;
  font-weight: bold;
  margin: 0;
}


/* ========================================
   SP対応
======================================== */
@media screen and (max-width: 768px){

  .flow-materials{
    flex-direction: column;
  }

  .flow-materials__head{
    width: 100%;
    padding: 4px;
    font-size: 16px;
  }

  .flow-materials__list{
    grid-template-columns: 1fr;
    padding: 18px;
    gap: 16px;
  }

  /* アイコン */
  .flow-materials__item img{
    width: 24px;
    height: 24px;
}

/* テキスト */
.flow-materials__item p{
  font-size: 14px;
  font-weight: bold;
  line-height: 1.4;
  margin: 0;
  text-align: left;
  }
}


/* ========================================

  サービス05：　環境商材・ 省エネソリューション

  ======================================== */

  /* =====================================
   ソリューションボタン（4カラム）
===================================== */

.solution-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin: 60px 30px 70px;
}

/* 4カラム固定 */
.solution-item {
  flex: 0 0 calc(25% - 12px); /* ← 4列 */
  max-width: calc(25% - 12px);
  text-align: center;
  padding: 14px 20px;
  border-radius: 40px;
  border: 1px solid #ccc;
  background: #f7f7f7;
  color: #333;
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
  transition: all 0.3s ease;
  white-space: normal;
}

/* hover */
.solution-item:hover {
  background: #0f69ab;
  color: #fff;
  border-color: #0f69ab;
}

/* アクティブ（選択中） */
.solution-item.is-active {
  background: #0f69ab;
  color: #fff;
  border-color: #0f69ab;
  font-weight: bold;
}

/* =====================================
   SP
===================================== */

/* タブレット：2列 */
@media (max-width: 1024px) {
  .solution-item {
    flex: 0 0 calc(50% - 10px);
    max-width: calc(50% - 10px);
  }
}

/* スマホ：1列 */
@media (max-width: 767px) {
  .solution-item {
    flex: 0 0 100%;
    max-width: 100%;
  }
}


@media (max-width: 767px) {
.solution-items {
    margin: 30px 20px 40px;
  }


}
/* =====================================
   ソリューション共通CSS
===================================== */

.sol-section {
  padding: 0 20px 50px;
}

.sol-wrap {
  max-width: 1000px;
  margin: 0 auto;
  background: #F8F8FF;
  padding: 38px 56px 48px;
}

/* 見出し */
.sol-midashi {
  margin: 0 0 34px;
  padding: 18px 20px;
  background: #FFF;
  border: 3px solid #20509E;
  box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.18);
  text-align: center;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.4;
  color: #20509E;
}

/* 説明文 */
.sol-text {
  margin: 0 0 22px !important;
  font-size: 16px;
  line-height: 1.6;
  color: #333;
  text-align: center;
}
/* 2カラム */
.sol-cols {
  display: flex;
  gap: 36px;
  align-items: stretch;
  margin-bottom: 40px;
}

.sol-box {
  flex: 1 1 0;
  background: #FFF;
  border-radius: 20px;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

/* ボックス見出し */
.sol-box-title {
  margin-bottom: 0 !important;
  padding: 12px 20px 8px !important;  
  text-align: center !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #FFF !important;
  background: linear-gradient(90deg, #C7D7EA 0%, #3B84D8 100%) !important;
}

/* リスト全体 */
.sol-list {
  list-style: none;
  margin: 15px 26px 24px !important;
  padding: 0;
}

.sol-list li {
  display: flex;
  align-items: flex-start;
  gap: 22px;
  padding: 18px 0;
  border-bottom: 1px solid #898989;
}

.sol-list li:last-child {
  border-bottom: none;
  padding-bottom: 10px;
}

/* テーマのpadding-left:16pxを打ち消す */
.sol-list {
  padding-left: 0 !important;
  padding-inline-start: 0 !important;
}
/* アイコン */
.sol-icon {
  flex: 0 0 60px;
  width: 602px;
}

.sol-icon img {
  width: 60px;
  height: 60px;
  display: block;
  object-fit: cover;
}

/* テキスト */
.sol-list-text {
  flex: 1;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
  color: #333;
}



/* =================================================
   solリスト最適化（高さズレ・間延び完全対応版）
================================================= */

/* =========================================
   共通レイアウト
========================================= */

/* 2カラム */
.sol-flex {
  display: flex;
  gap: 30px;
}

/* ボックス */
.sol-box {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* リスト */
.sol-list {
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 15px 26px 24px !important;
  padding: 0;
}

/* 右カラム（均等配置） */
.sol-box:nth-child(2) .sol-list {
  justify-content: space-between;
  margin: 8px 24px 12px !important;
}

/* 左カラム（通常） */
.sol-box:nth-child(1) .sol-list {
  justify-content: flex-start;
}

/* 共通 */
.sol-list li {
  display: flex;
  align-items: center;
  gap: 22px;
  border-bottom: 1px solid #898989;
}

.sol-list li:last-child {
  border-bottom: none;
}


/* =========================================
   可搬型蓄電システム（行数が違うためカスタム）
========================================= */

/* 2カラム */
.sol-section-storage .sol-cols {
  display: flex;
  gap: 34px;
  align-items: stretch;
}

/* ボックス */
.sol-section-storage .sol-box {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* リスト本体 */
.sol-section-storage .sol-list {
  display: flex;
  flex-direction: column;
  flex: 1;

  margin: 15px 26px 24px !important;
  padding: 0 !important;

  list-style: none;
}

/* li共通 */
.sol-section-storage .sol-list li {
  display: flex;
  align-items: center;
  gap: 22px;

  flex: 1;

  padding: 0;

  border-bottom: 1px solid #898989;
  box-sizing: border-box;
}

/* 最後だけ線なし */
.sol-section-storage .sol-list li:last-child {
  border-bottom: none;
}

/* 左：4等分 */
.sol-section-storage .sol-box:nth-child(1) .sol-list li {
  min-height: 0;
}

/* 右：3等分 */
.sol-section-storage .sol-box:nth-child(2) .sol-list li {
  min-height: 0;
}

/* アイコン共通 */
.sol-section-storage .sol-icon {
  flex: 0 0 56px;
  width: 56px;

  display: flex;
  align-items: center;
  justify-content: center;
}

/* アイコン画像 */
.sol-section-storage .sol-icon img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  display: block;
}

/* テキスト */
.sol-section-storage .sol-list-text {
  flex: 1;
  line-height: 1.8;
}

/* 左最後だけ微調整 */
.sol-section-storage .sol-box:nth-child(1) .sol-list li:last-child .sol-list-text {
  line-height: 1.5;
  margin-top: 4px;
}

/* =========================================
   SP調整
========================================= */
@media (max-width: 768px){

  /* 1カラム */
  .sol-section-storage .sol-cols {
    flex-direction: column;
    gap: 26px;
  }

  /* 全体余白 */
  .sol-section-storage .sol-list {
    margin: 12px 18px 18px !important;
  }

  /* li */
  .sol-section-storage .sol-list li {
    gap: 16px;
    padding: 14px 0;
    align-items: center;
  }

  /* アイコン */
  .sol-section-storage .sol-icon {
    flex: 0 0 46px;
    width: 46px;
  }

  .sol-section-storage .sol-icon img {
    width: 46px !important;
    height: 46px !important;
  }

  /* テキスト */
  .sol-section-storage .sol-list-text {
    line-height: 1.7;
    font-size: 15px;
  }

  /* 右カラム余白 */
  .sol-section-storage .sol-box:nth-child(2) .sol-list li {
    padding: 16px 0;
  }

}


/* =====================================
   非化石証書専用
===================================== */

.sol-nfc .sol-midashi {
  font-size: 26px;
  color: #20509E;
  border-color: #20509E;
  background-color: #FFF;
  line-height: 2;
  border: solid 2px #20509E;
}

/* =====================================
   白背景の見出し 共通
===================================== */

.sol-midashi {
  font-size: 26px !important;
  color: #20509E !important;
  border: solid 2px #20509E !important;
  background-color: #FFF !important;
  line-height: 1.7 !important;
}


/* =====================================
   セクション別
===================================== */

/* 非化石証書 */
.sol-nfc .sol-box-title {
  background: linear-gradient(90deg, #C7D7EA 0%, #3B84D8 100%);
}

/* 可搬型蓄電システム */
.sol-storage .sol-box-title {
  background: linear-gradient(90deg, #C7D7EA 0%, #3B84D8 100%);
}

/* 燃料販売 */
.sol-fuel .sol-box-title {
  background: linear-gradient(90deg, #FFE3C7 0%, #FF8A3D 100%);
}

/* 節水事業 */
.sol-water .sol-box-title {
  background: linear-gradient(90deg, #FFE3C7 0%, #FF8A3D 100%);
}

/* =====================================
   SP
===================================== */

@media screen and (max-width: 767px) {
  .sol-section {
    padding: 0 16px;
  }

  .sol-wrap {
    padding: 24px 16px 30px;
  }

  .sol-midashi {
    margin-bottom: 22px !important;
    font-size: 22px !important;
    padding: 4px 0 !important;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.16);
  }

  .sol-text {
    margin-bottom: 24px;
    font-size: 15px;
    line-height: 1.9;
    text-align: left;
    padding: 0 6px;
  }

  .sol-cols {
    flex-direction: column;
    gap: 20px;
  }

  .sol-box {
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.16);
  }

  .sol-box-title {
    font-size: 18px !important;
    padding: 16px 12px;
  }

  .sol-list {
    padding: 18px 16px;
  }

  .sol-list li {
    gap: 14px;
    padding: 14px 0;
  }

  .sol-icon,
  .sol-icon img {
    width: 46px;
    height: 46px;
  }

  .sol-list-text {
    font-size: 15px;
    line-height: 1.7;
  }
}


/* =====================================
   非化石証書の仕組み　フロー全体
===================================== */

.sol-nfc-flow {
  margin-top:0;
}

/* -------------------------------------
   説明テキスト
------------------------------------- */
.sol-nfc-text {
  font-size: 14px;
  text-align: center;
  margin: 20px 18px !important;
  line-height: 1.8;
}

/* 区切り線 */
.sol-nfc-line {
  border-bottom: 1px solid #898989;
  margin: 0 20px;
  max-width: 800px;
}


/* 20260420リネーム！ */
/* 共通boxはcssの中身なし */

/* フロー専用 */
.sol-box--flow {
  margin: 40px 0 10px;
  padding-bottom: 30px;
}

/* テキスト */
.sol-box--flow .sol-nfc-text {
  text-align: center;
  margin: 20px auto 20px !important;
  line-height: 1.8;
}

/* 区切り線 */
.sol-box--flow .sol-nfc-line {
  border-bottom: 1px solid #898989;
  margin: 0 auto;
  max-width: 800px;
}
/* -------------------------------------
   3カラム構成
------------------------------------- */
.sol-nfc-cols {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 14px;
  margin: 25px 35px 30px;
}

/* 各ボックス */
.sol-nfc-box-inner {
  width: 260px;
  background: #fff;
  border: 3px solid #719FD4;
  border-radius: 20px;
  padding: 16px 10px 16px;
  text-align: center;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* 中央カードだけを下げてバランス調整 */
.sol-nfc-box-middle .sol-nfc-img{
  margin-bottom: 18px;
}

/* 画像 */
.sol-nfc-img img{
  width:100%;
  height:auto;
  margin-bottom: 10px;
  display:block;
  object-fit:cover;
}

/* タイトル */
.sol-nfc-title {
  font-size: 20px !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin: 0 0 6px;
}

/* テキスト */
.sol-nfc-sub {
  font-size: 16px;
  margin: 0;
}

.sol-nfc-sub-top {
  font-size: 14px;
  line-height: 1.9;
  font-weight: 600;
  margin-bottom: 0 !important;
}

/* -------------------------------------
   矢印（三角）
------------------------------------- */
.sol-nfc-arrow {
  width: 40px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
}

.sol-nfc-arrow::before {
  content: "";
  width: 100%;
  height: 100%;

  background: linear-gradient(to right, #ffffff 0%, #6EB1FF 67%);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

/* -------------------------------------
   下の水色グラデーションボックス
------------------------------------- */
.sol-nfc-bottom {
  margin: 5px 35px 30px;
  padding: 20px;
  text-align: center;

  border: 2px solid #719FD4;
  background: linear-gradient(135deg, #FFFFFF, #D6E9FF);

  max-width: 900px;
  border-radius: 6px;
}

/* 上テキスト */
.sol-nfc-bottom-top {
  font-size: 18px;
  line-height: 1.4;
  font-weight: 700;
  margin-bottom: 0 !important;
}

/* メインテキスト */
.sol-nfc-bottom-main {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.6;
}

/* -------------------------------------
   強調カラー（指定）
------------------------------------- */
.strong-dark-blue {
  color: #20509E !important;
  font-weight: 700 !important;
  margin: 0 !important;
  line-height: 1.4;
  display: inline;
}

/* -------------------------------------
   レスポンシブ
------------------------------------- */
@media (max-width: 768px) {

  .sol-nfc-cols {
    flex-direction: column;
  }

  .sol-nfc-box-inner {
    width: 100%;
  }

  .sol-nfc-arrow {
    transform: rotate(90deg);
    width: 30px;
    height: 40px;
  }

  .sol-nfc-bottom {
    margin-top: 30px;
    padding: 16px;
  }

  .sol-nfc-bottom-main {
    font-size: 18px;
  }
}

/* ===========================================
   家電型蓄電システムシリーズ
=========================================== */

/* 見出し */
.sol-section-title {
  text-align: center;
  font-size: 22px !important;
  font-weight: bold;
  color: #20509E !important;
  margin: 50px 0 26px !important;
  line-height: 1.4;
}

/* =========================================
   3カラム
========================================= */
.sol-blue-col-3 {
  display: flex;
  gap: 30px;
  align-items: stretch;
}

/* カード */
.sol-blue-card {
  flex: 1;

  background: #fff;
  border-radius: 20px;
  overflow: hidden;

  box-shadow: 0 10px 20px rgba(0,0,0,0.08);

  display: flex;
  flex-direction: column;
}

/* =========================================
   カード見出し
========================================= */
.sol-blue-card-head {
  background: #4673BD;
  color: #fff;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.5;

  padding: 10px 12px;
}

/* =========================================
   本文
========================================= */
.sol-blue-card-body {
  flex: 1;

  padding: 16px 16px 12px;

  display: block;
}

/* float解除 */
.sol-blue-card-body::after {
  content: "";
  display: block;
  clear: both;
}

/* =========================================
   リスト
========================================= */
.sol-blue-card ul {
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
}

.sol-blue-card li {
  position: relative;

  padding-left: 16px;
  margin-bottom: 8px;

  font-size: 13.5px;
  line-height: 1.6;

  display: block;
}

/* 最後だけ余白なし */
.sol-blue-card ul li:last-child {
  margin-bottom: 0;
}

/* 青丸 */
.sol-blue-col-3 .sol-blue-card ul li::before {
  content: "●" !important;
  position: absolute;
  left: 2px;
  top: -0.2em;
  color: #0b57d0 !important;
  font-size: 10px;
  background: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}

/* テキスト */
.sol-blue-card li .text {
  display: block;
  word-break: break-word;
  line-break: strict;
  line-height: 2 !important;
}

/* 強調 */
.strong-dark-blue {
  color: #2f5ea8;
  font-weight: bold;
}

/* =========================================
   バッジ
========================================= */
.sol-gray-badge {
  float: right;

  width: 80px;
  height: 80px;

  margin: 0 0 2px 8px;

  border-radius: 50%;

  background: linear-gradient(
    135deg,
    #FFFFFF,
    #C6CDD2
  );

  display: flex;
  align-items: center;
  justify-content: center;

  text-align: center;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.5;
  color: #4673BD;
}

/* =========================================
   画像
========================================= */
.sol-blue-img {
  margin-top: auto;
}

.sol-blue-img img {
  width: 100%;
  height: auto;
  display: block;

  border-radius: 10px;
}

/* =========================================
   SP
========================================= */
@media (max-width: 768px){

  /* 縦積み */
  .sol-blue-col-3 {
    flex-direction: column;
    gap: 24px;
  }

  /* カード */
  .sol-blue-card {
    width: 100%;
  }

  /* 見出し */
  .sol-section-title {
    font-size: 20px !important;
    line-height: 1.6;
    margin: 40px 0 22px !important;
    padding: 0 10px;
  }

  /* カード見出し */
  .sol-blue-card-head {
    font-size: 16px;
    padding: 12px 14px;
  }

  /* 本文 */
  .sol-blue-card-body {
    padding: 16px 16px 14px;
  }

  /* バッジ */
  .sol-gray-badge {
    width: 74px;
    height: 74px;

    font-size: 12px;
    line-height: 1.4;

    margin-left: 10px;
  }

  /* リスト */
  .sol-blue-card li {
    font-size: 14px;
    line-height: 1.7;
  }

  .sol-blue-card li .text {
    line-height: 1.7 !important;
  }

  /* 画像 */
  .sol-blue-img {
    margin-top: 18px;
  }

}


/* =====================================
   燃料サービス
===================================== */

/* 見出し */
.sol-fuel .sol-midashi {
  font-size: 26px;
  color: #20509E;
  border: solid 2px #20509E;
  background-color: #FFF;
  line-height: 2;
}

/* ボックスタイトル（色変えたい場合） */
.sol-fuel .sol-box-title {
  background: linear-gradient(90deg, #FFE3C7 0%, #FF8A3D 100%);
}

/* セクション余白調整 */
.sol-fuel .sol-cols {
  margin-top: 30px;
}


/* =====================================
   燃料テーブル
===================================== */

.sol-fuel-table-wrap {
  margin: 30px auto;
  max-width: 1000px;
}

.sol-fuel-table {
  width: 100%;
  border-collapse: collapse;
  background: #FFF;
}

.sol-fuel-table td {
  border: 2px solid #BFBFBF; /* グレー */
  padding: 18px 12px;
  text-align: center;
  font-size: 16px;
  color: #333;
  background: #FFF;
  transition: 0.2s;
}

/* 下の注意書き */
.sol-fuel-note {
  font-size: 14px;
  text-align: center;
  margin-top: 20px;
  color: #333;
}

/* =====================================
   SP
===================================== */
@media (max-width: 768px){
  .sol-fuel-table-wrap {
    margin: 24px auto;
    background: #FFF;
  }

  .sol-fuel-table-wrap .s_table table,
  .sol-fuel-table {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    padding: 0 !important;
    background: #FFF;
  }

  .sol-fuel-table,
  .sol-fuel-table tbody,
  .sol-fuel-table tr {
    display: block;
    width: 100%;
  }

  .sol-fuel-table tr {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .sol-fuel-table td {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 68px;
    padding: 12px 10px;
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
    background: #FFF;
    box-sizing: border-box;
    border: 0 !important;
    border-right: 1px solid #BFBFBF !important;
    border-bottom: 1px solid #BFBFBF !important;
  }

  .sol-fuel-table tr:first-child td:nth-child(-n+2) {
    border-top: 1px solid #BFBFBF !important;
  }

  .sol-fuel-table td:nth-child(odd) {
    border-left: 1px solid #BFBFBF !important;
  }

  .sol-fuel-note {
    font-size: 13px;
    line-height: 1.8;
    text-align: left;
    margin-top: 16px;
    padding: 0 4px;
  }
}


/* ========================================

  サステナビリティ

  ======================================== */

  /* =========================
  セクション全体（背景フル幅）
========================= */
.issue-sustainability-section {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(to bottom right, #ffffff, #B4D6A5);
  padding: 50px 20px 40px;
  margin: 40px auto 30px;
}

/* 内側 */
.issue-sustainability-inner {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

/* =========================
  見出し
========================= */
.issue-sustainability-heading {
  font-size: 28px !important;
  font-weight: bold !important;
  color: #14523A !important;
  margin-bottom: 24px !important;
}

/* =========================
  4カラム
========================= */
.issue-sustainability-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin: 0 auto 0 !important;
}

/* カード */
.issue-sustainability-card {
  background: #fff;
  border: 1px solid #D9D9D9;
  border-radius: 12px;
  padding: 20px 15px;
  text-align: center;
  box-shadow: 4px 4px 0 #d9d9d9;
}

/* 画像 */
.issue-sustainability-card img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  margin-bottom: 18px;
}

/* タイトル */
.issue-sustainability-title {
  font-size: 18px !important;
  font-weight: bold !important;
  color: #0E3A28 !important;
  text-align: center !important;
  margin: 0 auto 12px !important;
}

/* タイトル4つ目のみカラー変更 */
.issue-brown-title{
  color:#5D3636 !important;
}


/* テキスト */
.issue-sustainability-text {
  font-size: 15px;
  color: #333;
  line-height: 1.7;
  margin-bottom: 10px !important;
}

/* =========================
  強調ボックス
========================= */
.issue-sustainability-highlight {
  background: #fff;
  padding: 8px;
  margin: 30px auto 20px;
  font-size: 18px;
  font-weight: normal;
}

/* 強調テキスト */
.strong-darkgreen {
  color: #0E3A28;
  font-weight: bold;
  font-size: larger;
}

/* =========================
  注釈
========================= */
.issue-sustainability-note {
  font-size: 15px;
  text-align: center;
  margin-top: 20px;
  color: #333;
  line-height: 1.8;
}

/* =========================
  レスポンシブ
========================= */
@media screen and (max-width: 768px) {

  .issue-sustainability-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }

  /* カード */
  .issue-sustainability-card {
    padding: 18px 12px;
    border-radius: 10px;
  }

  /* 画像 */
  .issue-sustainability-card img {
    width: 52px;
    height: 52px;
    margin-bottom: 14px;
  }

  /* タイトル */
  .issue-sustainability-title {
    font-size: 16px !important;
    line-height: 1.5;
    margin-bottom: 10px !important;
  }

  /* 本文 */
  .issue-sustainability-text {
    font-size: 13px;
    line-height: 1.8;
    margin-bottom: 0 !important;
  }

  /* 強調ボックス */
  .issue-sustainability-highlight {
    margin: 24px auto 18px;
    padding: 10px 14px;
    font-size: 15px;
    line-height: 1.8;
  }

  /* 強調文字 */
  .strong-darkgreen {
    font-size: 1.05em;
  }

  /* 注釈 */
  .issue-sustainability-note {
    font-size: 13px;
    line-height: 1.9;
  }

  /* 見出し */
  .issue-sustainability-heading {
    font-size: 22px !important;
    line-height: 1.5;
  }

}

/* =========================
  超小型SPも2列維持
========================= */
@media screen and (max-width: 480px) {

  .issue-sustainability-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .issue-sustainability-card {
    padding: 16px 10px;
  }

  .issue-sustainability-card img {
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
  }

  .issue-sustainability-title {
    font-size: 14px !important;
  }

  .issue-sustainability-text {
    font-size: 12px;
    line-height: 1.7;
  }

}

/* =========================
  企業の対応（年表）セクション
========================= */
.history-sustainability-section {
  padding: 20px 20px 0;
}

.history-sustainability-inner {
  max-width: 1000px;
  margin: 0 auto;
}

/* =========================
  見出し
========================= */
.history-sustainability-heading {
  font-size: 38px !important;
  font-weight: bold !important;
  color: #14523A !important;
  text-align: center;
  margin-bottom: 24px !important;
}

/* =========================
  リスト全体
========================= */
.history-sustainability-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* =========================
  行
========================= */
.history-sustainability-section .history-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  align-items: baseline;
}

/* 年 */
.history-sustainability-section .history-year-green {
  font-size: 28px;
  line-height: 1;
  font-weight: 700;
  color: #5D9B65;
  text-align: right;
}

/* コンテンツ */
.history-sustainability-section .history-content {
  padding-left: 30px;
}

/* =========================
  タイトル
========================= */
.history-sustainability-title {
  font-size: 24px !important;
  font-weight: bold !important;
  color: #14523A !important;
  margin-bottom: 6px !important;
}

/* =========================
  線＋ラベル
========================= */
.history-sustainability-section .history-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #A9A9A9;
  margin-bottom: 10px;
  padding-bottom: 6px;
}

/* ラベル */
.history-sustainability-section .history-label {
  margin-top: 8px;
  padding: 4px 8px;
  background: #FCF7D7;
  font-size: 12px;
  white-space: nowrap;
}

/* 本文 */
.history-sustainability-section .history-sustainability-text {
  font-size: 14px;
  line-height: 1.7;
  color: #333;
}

/* =========================
  下部テキスト
========================= */
.history-sustainability-section .history-sustainability-note {
  margin-top: 40px;
  font-size: 15px;
  line-height: 1.8;
  text-align: center;
  color: #333;
}

/* 強調 */
.strong-green {
  color: #5D9B65;
  font-weight: bold;
}

/* =========================
  history-row 疑似要素 強制削除
========================= */
.history-sustainability-section .history-row::before,
.history-sustainability-section .history-row::after {
  display: none !important;
  content: none !important;
}


/* =========================
  SP：767px以下
========================= */
@media screen and (max-width: 767px) {

  .history-sustainability-section {
    padding: 10px 8px 20px;
  }

  .history-sustainability-heading {
    font-size: 28px !important;
    line-height: 1.4;
    margin-bottom: 32px !important;
  }

  .history-sustainability-list {
    gap: 12px;
  }

  /* 行全体 */
  .history-sustainability-section .history-row {
    grid-template-columns: 62px 1fr;
    align-items: flex-start;
  }

  /* 年 */
  .history-sustainability-section .history-year-green {
    font-size: 20px;
    line-height: 1.1;
    text-align: left;
    padding-top: 2px;
  }

  /* 右側 */
  .history-sustainability-section .history-content {
    padding-left: 0;
  }

  /* タイトル */
  .history-sustainability-title {
    font-size: 20px !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
  }

  /* 線＋ラベル */
  .history-sustainability-section .history-line {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 10px;
  }

  /* ラベル */
  .history-sustainability-section .history-label {
    margin-top: 0;
    font-size: 12px;
    line-height: 1.4;
    white-space: normal;
  }

  /* 本文 */
  .history-sustainability-section .history-sustainability-text {
    font-size: 14px;
    line-height: 1.8;
    margin-top: 8px;
  }

  /* 下部テキスト */
  .history-sustainability-section .history-sustainability-note {
    margin-top: 36px;
    font-size: 14px;
    line-height: 1.9;
    text-align: left;
  }

  /* 緑文字 */
  .history-sustainability-section .history-sustainability-note .green {
    display: inline-block;
    line-height: 1.8;
  }

}


/* =========================
  SDGs セクション
========================= */
.sdgs-section {
  margin-bottom: 60px;
}

.sdgs-inner {
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px 0 60px;
  text-align: center;
}


/* =========================
  見出し
========================= */

.sdgs-heading {
  position: relative;
  display: inline-block;
  font-size: 28px !important;
  font-weight: bold !important;
  color: #036EB7 !important;
  padding-bottom: 12px !important;
  margin-bottom: 20px !important;
}

/* PC */
.sdgs-heading::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: calc(50% + 10px);
  height: 2px;
  background: #036EB7;
  transform: translateX(-50%);
}


/* =========================
  テキスト ※共通
========================= */

.sastain-text {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 30px !important;
  text-align: center;
}


/* =========================
  アイコン
========================= */

.sdgs-icons {
  display: flex;
  justify-content: center;
  gap: 40px;
  margin-bottom: 50px;
}

.sdgs-icons img {
  width: 120px;
  height: 120px;
  object-fit: contain;
}


/* =========================
  2カラム（ここだけスコープ）
========================= */

.sdgs-business {
  display: flex;
  gap: 30px;
}


/* =========================
  ボックス
========================= */
.business-box {
  border: 2px solid #0F69AB;
  border-radius: 18px;
  padding: 25px 20px;
  background: #fff;
  flex: 1;
  text-align: center; /* ← 本文も中央 */
}

/* タイトル行 */
.business-box-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: fit-content;    
  margin: 0 auto 10px;    /* ← 1セットごと中央へ */
}

/* 画像 */
.business-box-img {
  width: 60px !important;
  height: 60px !important;
  object-fit: contain;
  flex-shrink: 0;
}

/* タイトル */
.business-box-title {
  font-size: 22px !important;
  color: #0F69AB !important;
  margin: 0 !important;
  line-height: 1.2;
  text-align: left; 
}

/* 下線 */
.business-box-line {
  width: 100%;
  height: 2px;
  background: #0F69AB;
  margin: 10px 0 15px;
}

/* 本文 */
.business-box p {
  font-size: 14px;
  line-height: 1.8;
  margin: 0;
  text-align: center;
}


/* =========================
  SP：767px以下
========================= */
@media screen and (max-width: 767px) {

  .sdgs-section {
    margin-bottom: 40px;
  }

  .sdgs-inner {
    padding: 10px 8px 40px;
  }

  /* 見出し */
  .sdgs-heading {
    font-size: 22px !important;
    line-height: 1.4;
    margin-bottom: 18px;
    display: block;
    width: 100%;
    text-align: center;
  }

  /* SPは横幅いっぱい */
  .sdgs-heading::after {
    width: 100%;
    left: 0;
    transform: none;
  }

  /* 本文 */
  .sastain-text {
    font-size: 14px;
    line-height: 1.9;
    margin-bottom: 24px !important;
    text-align: left;
  }

/* =========================
  SDGsアイコン
========================= */

.sdgs-icons{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:nowrap;
  gap:10px;
  margin-bottom:32px;
}

.sdgs-icons img{
  width:30%;
  height:auto;
  max-width:82px;
  display:block;
  flex-shrink:0;
}

/* =========================
  SP調整：767px以下のみ
========================= */

@media screen and (max-width: 767px){

  .sdgs-icons{
    gap:14px;
  }

  .sdgs-icons img{
    width:calc((100% - 16px) / 3);
    max-width:82px;
    min-width:0;
    height:auto;
    flex:0 1 calc((100% - 16px) / 3);
    object-fit:contain;
  }

}
  /* =========================
    2カラム
  ========================= */

  .sdgs-business {
    flex-direction: column;
    gap: 20px;
  }

  /* ボックス */
  .business-box {
    padding: 22px 16px;
    border-radius: 14px;
  }

  /* タイトル行 */
  .business-box-head {
    gap: 8px;
    margin-bottom: 8px;
  }

  /* アイコン */
  .business-box-img {
    width: 46px !important;
    height: 46px !important;
  }

  /* タイトル */
  .business-box-title {
    font-size: 18px !important;
    line-height: 1.4;
  }

  /* 線 */
  .business-box-line {
    margin: 10px 0 14px;
  }

  /* 本文 */
  .business-box p {
    font-size: 13px;
    line-height: 1.9;
  }

}


/* =========================
 5つの透明性　全体
========================= */
.transparency-section{
  margin-top: 140px;
}


.transparency-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 30px 10px;
}

/* =========================
  グリッド（ここが重要）
========================= */
.transparency-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center; /* ← 奇数時に中央揃え */
}

/* =========================
  カード
========================= */
.transparency-card {
  width: calc(50% - 10px); /* 2カラム */
  border: 1px solid #898989;
  padding: 10px 30px 30px;
  background: #fff;
  box-sizing: border-box;
}

/* =========================
  タイトル
========================= */
.transparency-card-title {
  font-size: 22px !important;
  color: #036EB7 !important;
  font-weight: bold !important;
  margin: 12px 0 8px !important;
  text-align: center !important;
}

/* =========================
  青グラデーション線
========================= */
.transparency-line-blue {
  height: 3px;
  margin-bottom: 20px;
  background: linear-gradient(to right, #A5CEFE 0%, #0F69AB 100%);
}

/* =========================
  テキスト
========================= */
.transparency-card-text {
  font-size: 14px;
  line-height: 1.8;
  margin: 0 !important;
}


/* =========================
  強調ボックス
========================= */
.transparency-highlight {
  border: 2px solid #0F69AB;
  padding: 14px 18px 20px;
  margin-top: 20px;
  text-align: center;
}

/* ラベル */
.transparency-highlight-label {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 2px !important;
}

/* 数値（メイン） */
.transparency-highlight-value {
  font-size: 26px;
  line-height: 1.2;
  font-weight: bold;
  color: #0F69AB;
  margin: 0;
}

/* =========================
  SP：767px以下
========================= */
@media screen and (max-width: 767px) {

  /* 全体 */
  .transparency-section {
    margin-top: 70px;
  }

  .transparency-inner {
    padding: 10px 8px 30px;
  }

  /* =========================
    グリッド
  ========================= */

  .transparency-grid {
    flex-direction: column;
    gap: 18px;
  }

  /* =========================
    カード
  ========================= */

  .transparency-card {
    width: 100%;
    padding: 10px 18px 24px;
  }

  /* タイトル */
  .transparency-card-title {
    font-size: 20px !important;
    line-height: 1.5;
    margin: 10px 0 8px !important;
  }

  /* 青線 */
  .transparency-line-blue {
    margin-bottom: 16px;
  }

  /* 本文 */
  .transparency-card-text {
    font-size: 13px;
    line-height: 1.9;
  }

  /* =========================
    強調ボックス
  ========================= */

  .transparency-highlight {
    margin-top: 18px;
    padding: 12px 14px 18px;
  }

  /* ラベル */
  .transparency-highlight-label {
    font-size: 13px;
    line-height: 1.6;
  }

  /* 数値 */
  .transparency-highlight-value {
    font-size: 22px;
    line-height: 1.4;
  }

}

/* ===============================================
  ※CO2見える化サービス算定
=============================================== */
.co2-section{
  margin-top: 60px;
}

.co2-text {
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 10px !important;
    text-align: center;
}
.co2-section p {
  margin-bottom: 0 !important;
}


/* =========================
   排出量リスト 全体
========================= */
.p-sustain__emissions .box2 .detail {
  max-width: 780px;
  margin: 0 auto 38px;
}

/* =========================
   画像
========================= */
.co2-section .img1 img {
  display: block;
  margin: 0 auto !important;
  padding-bottom: 30px;
}
/* =========================
   各行（li）
========================= */
.p-sustain__emissions .box2 .detail li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 7px;
  padding: 10px 33px 10px 29px;
  border-bottom: 1px solid #666;
  position: relative;
}

.p-sustain__emissions .box2 .detail li:last-child {
  margin-bottom: 0;
}

/* 左のカラーライン */
.p-sustain__emissions .box2 .detail li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 1px;
  width: 10px;
  height: 90%;
}

/* =========================
   左側テキスト（scope）
========================= */
.p-sustain__emissions .box2 .detail li .t {
  font-size: 22px;
  margin: 0;
  flex-shrink: 0;
}

/* =========================
   右側数値
========================= */
.p-sustain__emissions .box2 .detail li p {
  font-size: 24px;
  line-height: 1.2;

  margin: 0 10px 0 auto;
  
  display: flex; 
  align-items: baseline;
  justify-content: flex-end;
  gap: 10px;

  white-space: nowrap;
  text-align: right;
}

/* 単位 */
.p-sustain__emissions .box2 .detail li p .unit {
  font-size: 20px;
  line-height: 1.2;
  margin-right: 20px; 
  white-space: nowrap;
}

/* sub（CO₂対策） */
.p-sustain__emissions .box2 .detail li p sub {
  font-size: 70%;
  vertical-align: baseline;
  position: relative;
  top: 0.2em;
}

/* =========================
   カラー
========================= */
.p-sustain__emissions .box2 .detail li.d1::before {
  background: #8FC31F;
}
.p-sustain__emissions .box2 .detail li.d2::before {
  background: #7ECEF4;
}
.p-sustain__emissions .box2 .detail li.d3::before {
  background: #007F41;
}
.p-sustain__emissions .box2 .detail li.d4::before {
  background: linear-gradient(to bottom, #3f9960 0%, #8fc31f 100%);
}

/* 合計だけ強調 */
.p-sustain__emissions .box2 .detail li.d4 p {
  font-size: 32px;
}

/* =========================
   注釈
========================= */
.p-sustain__emissions .box2 .detail .note {
  margin-top: 17px;
  color: #666;
  font-size: 14px;
  line-height: 1.5;
  padding-left: 18px;
}

/* =========================
   下の説明リスト
========================= */
.p-sustain__emissions .box2 .info {
  max-width: 780px;
  margin: 0 auto;
  padding: 0 18px 50px;
}

.p-sustain__emissions .box2 .info li {
  text-indent: -4em;
  padding-left: 4em;
  line-height: 1.7;
  font-size: 13px;
}


/* =========================
  SP：767px以下
========================= */
@media screen and (max-width: 767px) {

  /* 全体 */
  .co2-section {
    margin-top: 0;
    padding: 0;
  }


  .p-sustain__emissions .box2 .detail .note {
    padding-left: 0;
  }

  /* テキスト */
  .co2-text {
    font-size: 14px;
    line-height: 2;
    text-align: left;
    word-break: normal;
    overflow-wrap: break-word;
  }

  /* 強調 */
  .co2-text strong {
    display: inline-block;
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 10px;
  }

  /* brで細かく折れているためSPで整える */
  .co2-text br {
    display: none;
  }

}

/* =========================
   削除方針
========================= */

.policy-section {
    margin-top: 100px;
}

@media screen and (max-width: 767px) {

.policy-section {
  margin-top: 10px;
  }
}


/* =========================
   
　お知らせ　個別記事

========================= */

/* サイドバーを表示させない*/
.single-news .l-main {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

.single-news .l-sidebar {
  display: none;
}

/* コンテンツ共通 */
.news-article {
  max-width: 900px;
  margin: 0 auto;
  padding: 10px 0 60px;
  color: #333;
  line-height: 1.8;
}


/* 記事下の「新着のお知らせ」のカラーを黒から変更 */
.p-single-bottom-title {
    font-size: 28px;
    color: #0F69AB;
}

/* デフォルトの<p>の余白を解除 */
.news-article p {
  margin: 0;
}

.news-article p + p {
  margin-top: 32px;
}

.news-box {
  margin: 30px 0 60px;
  padding: 20px;
  border-left: 4px solid #0f69ab;
  background: #f7f9fb;
}

.news-box h2 {
  margin-bottom: 10px;
  font-size: 22px;
}


.news-box h3 {
  margin-bottom: 10px;
  font-size: 18px;
  text-align: center;
}

.news-highlight {
  font-weight: normal;
  margin: 0 0 10px !important;
  text-align: center;
}

.news-price {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  color: #0f69ab;
  margin: 0 !important;
  line-height: 1.4;
  margin: 0 !important;
}

.news-note {
  font-size: 14px;
  color: #333;
  margin: 0 !important;
  text-align: center;
}

.pdf-area {
  margin-top: 30px;
}

.news-pdf-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#0f69ab;
  text-decoration:underline;
  transition:all 0.3s ease;
  line-height:1.6;
}

.news-pdf-link:hover{
  color:#0c4f85;
  text-decoration:none;
}

/* Font Awesome PDFアイコン読み込み */
.news-pdf-icon{
  color:#d60000;
  font-size:28px;
  line-height:1;
  flex-shrink:0;
  position:relative;
  top:8px;
}


/* タイトル */
.news-title {
  font-size: 28px;
  font-weight: bold;
  margin-bottom: 24px;
  padding-left: 16px;
  border-left: 5px solid #0f69ab;
}

/* リード */
.news-lead {
  margin-bottom: 24px;
}

/* 強調 */
.news-accent {
  color: #0f69ab;
}

/* CTA */
.news-cta {
  text-align: center;
  margin: 30px 0 60px;
}

/* ニュース内のCTAボタンだけ上余白調整 */
.single-news .p-cb-button.c-button01.button-gradation {
  margin-top: 10px;
}

/* セクション */
.news-section {
  margin-bottom: 30px;
}

.news-section h2 {
  font-size: 22px;
  color: #0f69ab;
  margin: 50px 0 10px;
  padding-bottom: 6px;
  border-bottom: 2px solid #e1e7ef;
  text-align: left;
}

/* カード */
.news-card {
  background: #fff;
  border-left: 4px solid #0f69ab;
  padding: 18px 16px;
}

/* フッター */
.news-footer {
  margin-top: 40px;
  padding: 20px;
  background: #f7f9fb;
  border-radius: 8px;
}


/*  箇条書き調整　 */
/* =========================
   NEWS 箇条書き調整
========================= */
.news-list {
    max-width: 720px;
    margin: 12px auto !important;
    padding-inline-start: 270px !important;
}

.news-list li {
    margin-bottom: 4px !important;
    line-height: 1.9 !important;
    text-align: left;
    font-size: 14px;
}

.news-list li:last-child {
    margin-bottom: 0;
}

/* =========================
   SP調整
========================= */
@media screen and (max-width: 768px) {

    .news-list {
        padding-inline-start: 30px !important;
    }

}

/* ================================================
   カテゴリ（お知らせ詳細ページ用 ※記事タイトルすぐ下）
================================================ */

/* 共通ベース */
.p-single--news .c-category_type a {
  display: inline-block;
  min-width: 140px;
  text-align: center;
  padding: 12px 18px;
  border: 1px solid;
  border-radius: 20px;
  font-size: 13px;
  text-decoration: none;
  transition: 0.3s;
}

/* ホバー時の透明化を無効化 */
.p-single--news .c-category_type a:hover {
  opacity: 1;
}

/* お知らせ */
.p-single--news .c-category_type a[href*="news"] {
  border-color: #C4D6E8;
  color: #0F69AB;
}

.p-single--news .c-category_type a[href*="news"]:hover {
  background: #0F69AB;
  color: #fff;
}

/* プレスリリース */
.p-single--news .c-category_type a[href*="press-release"] {
  border-color: #F4BB9B;
  color: #C66D3B;
}

.p-single--news .c-category_type a[href*="press-release"]:hover {
  background: #C66D3B;
  color: #fff;
}

/* サービス情報 */
.p-single--news .c-category_type a[href*="service-info"] {
  border-color: #B7D4B0;
  color: #5D935F;
}

.p-single--news .c-category_type a[href*="service-info"]:hover {
  background: #5D935F;
  color: #fff;
}



/* =====================================

   よくある質問　FAQ 共通

   ===================================== */

.faq-section {
  padding: 0 20px 50px;
}

.faq-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.faq-head {
  text-align: center;
  margin-bottom: 40px;
}

.faq-heading {
  font-size: 48px;
  margin: 0;
}

.faq-subheading {
  font-size: 22px;
  font-weight: 700;
  color: #333;
}

/* リスト */
.faq-list {
  border-top: 1px solid #0F69AB;
}

.faq-item {
  border-bottom: 1px solid #0F69AB;
}

/* 質問 */
.faq-question {
  width: 100%;
  background: #fff;
  border: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 76px;
}

/* 左側 */
.faq-question-left {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px 18px 16px;
}

.faq-q {
  font-size: 28px;
  font-weight: bold;
  color: #0F69AB;
}

.faq-question-text {
  font-size: 18px;
  font-weight: bold;
}

/* トグル */
.faq-toggle {
  width: 30px;
  height: 30px;
  margin-right: 16px;
  background: linear-gradient(to bottom, #A3D8FF, #0F69AB);
  position: relative;
}

.faq-toggle::before,
.faq-toggle::after {
  content: "";
  position: absolute;
  background: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.faq-toggle::before {
  width: 14px;
  height: 2px;
}

.faq-toggle::after {
  width: 2px;
  height: 14px;
}

/* 回答 */
.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: 0.3s;
}

.faq-answer-inner {
  overflow: hidden;
  padding: 0 20px;
}

.faq-item.is-open .faq-answer {
  grid-template-rows: 1fr;
}

.faq-item.is-open .faq-answer-inner {
  padding-bottom: 24px;
}

.faq-item.is-open .faq-toggle::after {
  display: none;
}

.faq-answer-inner p {
  margin: 0 0 10px 40px;
  text-align: left;
  line-height: 1.9;
}


/* =====================================
   FAQ質問行 高さ固定
===================================== */

.faq-question {
  min-height: 76px;
  align-items: center !important;
  line-height: 1 !important;
}

.faq-question-left {
  display: flex;
  align-items: center;
  line-height: 1.4 !important;
}

.faq-question-text {
  line-height: 1.4 !important;
  margin: 0 !important;
}

.faq-q {
  line-height: 1 !important;
}

/* =========================
   SP
========================= */
@media (max-width: 767px){

  /* セクション下余白調整 */
  .faq-section {
    padding: 0 20px 0;
  }

  /* 見出し */
  .faq-heading {
    font-size: 40px;
  }

  .faq-subheading {
    font-size: 14px;
  }

  /* 質問行 */
  .faq-question {
    min-height: 64px;
    align-items: stretch;
  }

  .faq-question-left {
    padding: 16px 14px;
    align-items: flex-start;
    gap: 10px;
  }

  /* Q */
  .faq-q {
    font-size: 24px;
    line-height: 0.8 !important;
    flex-shrink: 0;
  }

  /* 「・」を非表示 */
  .faq-q::after {
    display: none;
  }

  /* 質問文 */
  .faq-question-text {
    font-size: 14px;
    text-align: left;
    line-height: 1.7 !important;
  }

  /* トグル */
  .faq-toggle {
    width: 24px;
    min-width: 24px;
    height: 24px;
    margin-right: 6px;
    margin-top: 0;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* 回答 */
  .faq-answer-inner {
    padding: 0 14px;
  }

  .faq-answer-inner p {
    margin-left: 28px;
    font-size: 14px;
    line-height: 2;
  }

}

/* =====================================

   FAQ よくある質問　詳細ページ

===================================== */

/* 親スタイルのpadding-top:120pxを上書き、スラッグではなくページidで指定 */
body.page-id-637 .p-page.page_default_header .p-single-content {
  padding-top: 40px !important;
}

/* サービス見出し */
.faq-service-title {
  font-size: 28px;
  font-weight: 700;
  text-align: center;
  margin: 120px 0 0;
  color: #20509E;
}

/* 最初だけ余白調整 */
.faq-service-title:first-of-type {
  margin-top: 40px;
}

/* カテゴリ見出し */
.faq-group-title {
  font-size: 18px;
  font-weight: 700;
  margin: 70px 0 0;
  padding-bottom: 12px;
  border-bottom: 2px solid #0F69AB;
  color: #0F69AB;
}


/* ============================================
   「お問合せの前にご確認ください」全体セクション
============================================ */
/* ======================================
   外側余白
====================================== */

.before-contact {
  margin: 10px auto;
}

/* ======================================
   内側ボックス（背景はここだけ）
====================================== */
.before-contact-innner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
  background: #eaf3fb;
  padding: 60px 40px;
}

/* 見出し */
.before-contact-midashi {
  font-size: 26px;
  font-weight: bold;
  color: #20509E;
  margin-bottom: 40px;
}

/* ======================================
   タブ
====================================== */
.customer-type-head {
  display: flex;
  margin-bottom: 40px;
}

.customer-type-head__item {
  flex: 1;
  padding: 18px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  position: relative;
  font-size: 18px;
}

/* 法人 */
.customer-type-head__item.is-active {
  background: #0F69AB;
}

/* ▼三角 */
.customer-type-head__item.is-active::after {
  content: "";
  position: absolute;
  bottom: -16px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
  border-top: 16px solid #0F69AB;
}

/* 個人 */
.customer-type-head__item.is-gray {
  background: #C3C3C3;
}

/* ======================================
   リスト
====================================== */
.before-contact-list {
  display: grid;
  max-width: 940px;
  align-items: center;
  grid-template-columns: repeat(2, 1fr);
  margin: 20px auto 0; 
  gap: 24px 24px;
  margin-top: 20px;
}
/* ======================================
   ボタンカード
====================================== */
.before-contact-title {
  position: relative;
  display: block;
  padding: 20px 70px 20px 20px; /* ← 矢印分少し広げる */
  background: #fff;
  border: 1px solid #0F69AB;
  border-radius: 15px;
  text-align: left;
  color: #000;
  text-decoration: none;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
  transition: 0.2s;
}

.before-contact-title:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
}

/* テキスト */
.before-contact-title__text {
  font-weight: normal;
}

/* ======================================
   右丸矢印（微調整）
====================================== */
.before-contact-arrow {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(to bottom, #A3D8FF, #0F69AB);
}

/* ▼三角 */
.before-contact-arrow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -25%);
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 9px solid #fff;
}

/* ======================================
   CTAボタンの margin-topを変更
====================================== */
body.page-id-637 .before-contact + .button-cta {
  margin: 50px auto 80px;
}

/* ======================================
   SP
====================================== */
@media screen and (max-width: 768px) {

  .before-contact-innner {
    padding: 40px 20px;
  }

  .before-contact-list {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .before-contact-midashi {
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 24px;
  }


 .customer-type-head__item {
   min-width: 110px;
   padding: 8px 0;
   font-size: 14px;
   line-height: 1.3;
   align-content: center;
  }

  .before-contact-title__text {
    line-height: 1.3;
  }

  .before-contact-title {
    padding: 16px 70px 16px 20px;
  }

  .before-contact-arrow {
    width: 30px;
    height: 30px;
  }


  
/* 「よくあるご質問」ページだけQ＆Aの余白調整*/
  .page-id-637 .p-single-content {
    padding-inline: 0 !important;
  }

  .page-id-637 .l-inner {
    width: 100%;
    max-width: 100%;
  }

  .page-id-637 .faq-detail-section {
    padding: 0;
  }
}


/* =====================================

   固定ページ　プライバシーポリシー

===================================== */

.privacy-policy__inner {
  max-width: 1000px;
  margin: 0 auto;
}


/* リード文
------------------------------------- */

.privacy-policy__lead {
  margin-bottom: 50px;
}

.privacy-policy__lead p {
  font-size: 16px;
  line-height: 2;
}


/* リスト
------------------------------------- */

.privacy-policy__list {
  margin: 0;
  padding: 0;
  list-style: none;

  counter-reset: privacy-number;
}

.privacy-policy__list li {
  position: relative;

  margin-bottom: 28px;
  padding-left: px;

  line-height: 2;
}

.privacy-policy__list li::before {
  counter-increment: privacy-number;
  content: counter(privacy-number);

  position: absolute;
  top: 2px;
  left: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #0f69ab;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}


/* お問い合わせ
------------------------------------- */

.privacy-contact {
  margin-top: 40px;
  padding: 30px;
  text-align:center;
  background: #f7f9fc;
  border-radius: 12px;
}

.privacy-contact__row + .privacy-contact__row {
  margin-top: 24px;
}

.privacy-contact__head {
  line-height: 1.2;
  margin-bottom: 2px;
  font-weight: bold;
  color: #0f69ab;
}

.privacy-contact__body a {
  color: #0f69ab;
  text-decoration: underline;
}


/* 署名
------------------------------------- */

.privacy-sign {
  margin-top: 30px;
  text-align: right;
}

.privacy-sign p {
  line-height: 1.6;
}


/* =====================================
   共同利用
===================================== */

.privacy-shared {
  margin-top: 100px;
}

.privacy-shared__title {
  margin-bottom: 40px !important;
  font-size: 32px !important;
  font-weight: 700 !important;
}


/* テーブル
------------------------------------- */

.privacy-table-wrap {
  overflow-x: auto;
}

.privacy-table {
  width: 100%;
  border-collapse: collapse;
}

.privacy-table th,
.privacy-table td {
  border: 1px solid #d8dde6;
  padding: 24px 20px;

  vertical-align: top;
  line-height: 2;
}

.privacy-table th {
  width: 32%;

  background: #f7f9fc;

  font-weight: bold;
  text-align: left;
}


/*  番号付きリスト
===================================== */

/* =====================================
   Privacy：表内の丸数字リスト調整
   ※ BLAZE editor.css の ol/ul 指定を上書き
===================================== */

.tcdce-body .privacy-table__olist,
.editor-styles-wrapper .privacy-table__olist,
.privacy-table__olist {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  counter-reset: none !important;
}

.tcdce-body .privacy-table__olist li,
.editor-styles-wrapper .privacy-table__olist li,
.privacy-table__olist li {
  position: relative;
  margin: 0 0 12px 0 !important;
  padding-left: 1.2em !important;
  text-indent: -1em !important;

  list-style: none !important;
  list-style-type: none !important;
  counter-increment: none !important;

  line-height: 2 !important;
}

.tcdce-body .privacy-table__olist li::before,
.editor-styles-wrapper .privacy-table__olist li::before,
.privacy-table__olist li::before,
.tcdce-body .privacy-table__olist li::marker,
.editor-styles-wrapper .privacy-table__olist li::marker,
.privacy-table__olist li::marker {
  content: none !important;
}

.tcdce-body .privacy-table__olist li:last-child,
.editor-styles-wrapper .privacy-table__olist li:last-child,
.privacy-table__olist li:last-child {
  margin-bottom: 0 !important;
}
/* 注釈
------------------------------------- */

.privacy-notes {
  margin-top: 50px;
}

.privacy-notes p {
  margin-bottom: 24px;

  font-size: 14px;
  line-height: 2;
}



/* =====================================
   SP
===================================== */


@media screen and (max-width: 767px) {

  /* タイトル */
  .privacy-shared__title {
    margin-bottom: 20px;

    font-size: 28px;
    line-height: 1.5;
    text-align: center;
  }


  /* テーブルSP化
  ------------------------------------- */

  .privacy-table,
  .privacy-table tbody,
  .privacy-table tr,
  .privacy-table th,
  .privacy-table td {
    display: block;
    width: 100%;

    box-sizing: border-box;
  }

  .privacy-table thead {
    display: none;
  }

  .privacy-table {
    border-collapse: collapse;
    margin-bottom: 0;
  }


  /* 行間を消す ← 重要 */
  .privacy-table tr {
    margin-bottom: 0;
  }


  /* 見出し */
  .privacy-table th {
    padding: 14px 12px;

    background: #f7f9fc;

    border: 1px solid #d7d7d7;
    border-bottom: none;

    text-align: center;

    font-size: 15px;
    line-height: 1.6;
  }


  /* 本文 */
  .privacy-table td {
    padding: 14px 12px;

    border: 1px solid #d7d7d7;
    border-bottom: none;

    font-size: 14px;
    line-height: 2;

    /* はみ出し防止 */
    word-break: break-word;
    overflow-wrap: break-word;
  }


  /* 最後だけ下線戻す */
  .privacy-table tr:last-child td {
    border-bottom: 1px solid #d7d7d7;
  }


  /* リンク折返し */
  .privacy-table a,
  .privacy-notes a {
    word-break: break-all;
  }


  /* 注釈 */
  .privacy-notes {
    margin-top: 25px;
  }

  .privacy-notes p {
    margin-bottom: 16px;

    font-size: 14px;
    line-height: 2;

    word-break: break-word;
  }

}

/* =====================================
   Privacy Policy SP：横はみ出し防止
===================================== */

@media screen and (max-width: 767px) {

  html,
  body {
    overflow-x: hidden;
  }

  .privacy-policy {
    padding: 30px 8px;
    overflow-x: hidden;
  }

  .privacy-policy__inner {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .privacy-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }

  .privacy-table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed;
  }

  .privacy-table,
  .privacy-table tbody,
  .privacy-table tr,
  .privacy-table th,
  .privacy-table td {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .privacy-table th,
  .privacy-table td {
    white-space: normal !important;
    word-break: break-all;
    overflow-wrap: anywhere;
  }

  .privacy-table td {
    overflow: visible !important;
  }

  .privacy-notes,
  .privacy-notes p {
    max-width: 100%;
    word-break: break-all;
    overflow-wrap: anywhere;
  }
}