@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 4.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/


/* ========================================
   共通で入れているもの
======================================== */
/* ===========================
   ▼ここだけ変更する
=========================== */


:root {
  --button-main-color: #2ea875;
	  --button-main-color_hover: #247a5a;
}

/* ===========================
  ▲ ここだけ変更する
=========================== */






.center_micro{
    margin-bottom: 4px;
	font-weight: bold;
    text-align: center;
	color: var(--wp--preset--color--sango-main);
}

body #inner-content .entry-content .btn {
	margin-top:0px;
}

/* ===========================
   ▼ お問い合わせフォーム
=========================== */

/* Contact Form 7 スタイル */
.wpcf7-form {
  max-width: 800px;
  margin: 0 auto;
  padding: 30px;
  background-color: #f9f9f9;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  font-family: "Helvetica Neue", Arial, sans-serif;
}

/* ラベルのスタイル */
.wpcf7-form label {
  display: block;
  margin-bottom: 5px;
  font-weight: 600;
  color: #333;
  font-size: 15px;
}

/* すでにHTMLに含まれている * マークの色を変更 */
span.required-mark {
  color: #c7000b;
  margin-left: 5px;
}

/* 入力フィールドの共通スタイル */
.wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance) {
  width: 100%;
  padding: 12px 15px;
  margin-bottom: 20px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 15px;
  box-sizing: border-box;
  transition: border-color 0.3s, box-shadow 0.3s;
}

/* フォーカス時のスタイル */
.wpcf7-form-control:not(.wpcf7-submit):focus {
  outline: none;
  border-color: #4a90e2;
  box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.1);
}

/* テキストエリアのスタイル */
.wpcf7-textarea {
  min-height: 150px;
  resize: vertical;
}

/* セレクトボックスのスタイル */
select.wpcf7-form-control {
  background-position: calc(100% - 15px) center;
  background-repeat: no-repeat;
  background-size: 12px;
  padding-right: 40px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

/* チェックボックスのスタイル */
.wpcf7-acceptance {
  display: block;
  margin: 20px 0;
}

.wpcf7-acceptance .wpcf7-list-item {
  margin: 0;
}

.wpcf7-acceptance input[type="checkbox"] {
  margin-right: 8px;
  vertical-align: middle;
}

.wpcf7-acceptance .wpcf7-list-item-label {
  vertical-align: middle;
  font-size: 14px;
}

.wpcf7-acceptance .wpcf7-list-item-label a {
  color: #4a90e2;
  text-decoration: none;
}

.wpcf7-acceptance .wpcf7-list-item-label a:hover {
  text-decoration: underline;
}

/* 送信ボタンのスタイル */
.wpcf7-submit {
	background-color: #000;
  color: white;
  border: none;
  padding: 14px 30px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.1s;
  display: block;
  margin: 0 auto;
  min-width: 200px;
  text-align: center;
}

.wpcf7-submit:hover:not([disabled]) {
	background-color: #000;
  text-align: center;
}

.wpcf7-submit:disabled {
  background-color: #cccccc;
  cursor: not-allowed;
  opacity: 0.7;
  text-align: center;
}

/* スピナーのスタイル */
.wpcf7-spinner {
  margin: 0 0 0 10px;
  vertical-align: middle;
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #f0f0f0;
  border-radius: 50%;
}

/* エラーメッセージのスタイル */
.wpcf7-not-valid-tip {
  color: #dc3545;
  font-size: 13px;
  margin-top: 5px;
}

.wpcf7-response-output {
  margin: 20px 0 0;
  padding: 12px 15px;
  border-radius: 4px;
  font-size: 14px;
  text-align: center;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .wpcf7-form {
    padding: 20px 15px;
  }

  .wpcf7-submit {
    width: 100%;
  }
}

/*--------------------------------------
基本
--------------------------------------*/
div#content {
    font-weight: normal;
}

.header, .drawer__title {
    padding-top: 4px;
    padding-bottom: 0;
}

.header {
    box-shadow: none;
}

p.header-image__headline {
    letter-spacing: 1rem;
}

footer.entry-footer {
    display: none;
}

.sns-btn {
    display: none;
}

.prnx_tb {
    box-shadow: none;
}

label.fab-btn.extended-fab.main-c {
    display: none;
}

/* ============================================================
   記事内テーブル：スペック / 仕様 一覧型
============================================================ */
.entry-content table,
.entry-content .wp-block-table table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    margin: 1.6em 0;
    border: 1px solid #d8dee2;
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
}

.entry-content thead,
.entry-content tbody,
.entry-content tr,
.entry-content th,
.entry-content td {
    box-sizing: border-box;
}

.entry-content th,
.entry-content .wp-block-table th {
    padding: 16px 20px;
    text-align: left;
    vertical-align: middle;
    background: #f6f5f2;
    color: #2ea875;
    font-weight: 700;
    font-size: 1em;
    line-height: 1.65;
    border-right: 1px solid #e3e7ea;
    border-bottom: 1px solid #e3e7ea;
    letter-spacing: 0.02em;
}

.entry-content td,
.entry-content .wp-block-table td {
    padding: 16px 20px;
    vertical-align: middle;
    background: #ffffff;
    color: #333333;
    font-size: 1em;
    line-height: 1.85;
    border-bottom: 1px solid #e3e7ea;
}

/* td 内の箇条書き（・付き行）も th と同じサイズで表示 */
.entry-content td p,
.entry-content td span,
.entry-content .wp-block-table td p,
.entry-content .wp-block-table td span {
    font-size: inherit;
    line-height: inherit;
}

/* 最終行は下線なし */
.entry-content tr:last-child th,
.entry-content tr:last-child td {
    border-bottom: none;
}

/* 強調マーカー（◎・○など）のサイズ調整 */
.entry-content td:has(*:only-child),
.entry-content td:first-of-type {
    /* 単独◎は中央寄せ的に表示しても良い */
}

/* td 内の brつなぎ箇条書き（・○○ ／ ・○○）も読みやすく */
.entry-content td br + * {
    margin-top: 0.1em;
}

.entry-content blockquote {
    box-sizing: border-box;
    position: relative;
    margin: 1.5em 0;
    padding: 13px 15px 13px 50px;
    border: solid 1px #e0e0e0;
    color: #464646;
}

.entry-content table {
	max-width: 100%;
}

h1.entry-title.single-title,
h1.page-title {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.6;
}

.entry-content h2 {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
    padding-bottom: 5px;
    position: relative;
}

.entry-content h2 {
    font-size: 20px !important;
    border-left: 4px solid  var(--wp--preset--color--sango-main);
    padding: .5em .7em;
    background: #f2f2f2;
    color: #323232;
    margin-bottom: 15px;
}

.entry-content h3 {
  border-bottom: 2px solid var(--wp--preset--color--sango-main);/*下線*/
  color: #323232;
  padding-bottom: .5em;
  margin-bottom: 15px;
  border-top: none;
	border-left:none;
	font-weight: bold;
}

a.sgb-footer__menu-btn.dfont {
    display: none;
}

td {
    vertical-align: middle;
}

td p:last-child {
    margin-bottom: 0;
}

td a.btn.raised.accent-bc.strong {
    margin: 0.5em 0 !important;
    padding: 1.2em 0.5em !important;
    font-size: 0.5em;
}

td a.btn.btn.grad3 {
    margin: 0.5em 0 !important;
    padding: 1.2em 0.5em !important;
    font-size: 1em;
}

/*--------------------------------------
btn
--------------------------------------*/

.header a, .entry-content a{
   transition: opacity 0.1s ease;
}



body #inner-content .entry-content .btn {
    text-align: center;
    display: block;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding: 1rem 1.6rem;
    border-bottom: solid 5px rgba(0, 0, 0, 0.27);
    border-radius: 4px;
    font-weight: 700;
    margin-bottom: 0;
}

.btn {
	font-size: 16px;
}

body #inner-content .entry-content .accent {
    background-color: var(--button-main-color);
    color: #fff;
}

body #inner-content .entry-content .accent-bc  {
    background-color: var(--button-main-color);
	
    color: #fff;
}


body #inner-content .entry-content .newmark  {
background-color: var(--wp--preset--color--sango-main);
	
    color: #fff;
}


body #inner-content .entry-content .btn {
    transition: opacity 0.1s ease;
}

body #inner-content .entry-content .btn:hover {
	    background-color: var( --button-main-color_hover);
	
}

#inner-content .entry-content .btn {}

body #inner-content .entry-content .flat2 {
    background-color: #fff;
	border: 1px solid var(--button-main-color);
	color:var(--button-main-color);
}

body #inner-content .entry-content .grad3 {
    color: #000 !important;
    border: 1px solid #000 !important;
    background: #fff !important;
	margin-top:16px;
}


body #inner-content .entry-content .grad3:hover {
    background: #000!important;
    color: #fff !important;
}


body #inner-content .entry-content .flat2:hover {
    background: var(--button-main-color);
    color: #fff;
    opacity: 1;
} 


.single h1.entry-title.single-title {
    margin-top: 0;
}

/*--------------------------------------
マイクロコピーの中央揃えと余白調整
--------------------------------------*/
.center_micro {
	margin-bottom:0px!important;
	text-align: center!important;
	color: var(--button-main-color);
}


/*--------------------------------------
PR sango
--------------------------------------*/
  .pr-text {
    margin: 0 0 0 auto;
    display: block;
    background: #bfbfbf;
    padding: 0px 4px 0px;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
    font-weight: bold;
    width: 32px;
    height: 22px;
    text-align: center;
		line-height: 1.83;
}

.code-block-1{
	margin-bottom: 4px; 
		margin-top: 4px; 
	clear: both;
	}

.page .code-block.code-block-1 {
    display: none;
}

@media only screen and (max-width: 768px) {
	.code-block-1{
		margin-right: 4px; 
	}
	.pr-text {
    margin: 10px 10px 0 auto;
	}
}

*{ box-shadow: none!important; } 
*a:hover {
    opacity: 0.8!important;
}
*a img:hover {
    opacity: 0.8!important;
}

/* *{transition: none!important;} */
img.attachment-thumb-520.size-thumb-520.wp-post-image:hover {
    opacity: 0.8;
}
.related-posts .splide__slide a:hover img {
    transform: translateY(0px);
	 opacity: 0.8;
}
.related-posts li a:hover img {
    transform: translateY(0px);
	 opacity: 0.8;
}

.sidebar .my_popular_posts .widgettitle:before {
   display: none;
}



.sgb-full-bg .sgb-full-bg__content {
    padding-left:0px;
	}

#fixed_sidebar {
    top: 48px;
}

.layout-squared .normal-sidebar .widget {
    border-radius: 4px;
	}

@media only screen and (min-width: 769px) {
.layout-squared #entry {
    border-radius: 4px;
}
		}

.author-info__inner .tb {
    border-radius: 4px;
}
.prnx_tb {
     border-radius: 4px;
}

a.dfont {
    font-size: 12px;
}




@media screen and (max-width: 768px) {
  p.header-image__headline{
	  font-size: 16px;
		    letter-spacing: 0.8rem;
   }
}

/* レビュー用の星 */
span.rate-star {
    padding: 0 0.5em;
    width: auto !important;
}

span.dashicons {
    font-size: 20px;
    width: auto;
    height: auto;
    line-height: normal;
    text-decoration: inherit;
    vertical-align: middle;
}

.dashicons-star-filled::before {
    content: "\f155";
    font-family: dashicons;
    font-size: 20px;
    color: #fac225;
}

.dashicons-star-half::before {
    content: "\f459";
    font-family: dashicons;
    font-size: 20px;
    color: #fac225;
}

.dashicons-star-empty::before {
    content: "\f154";
    font-family: dashicons;
    font-size: 20px;
    color: #fac225;
}


/*--------------------------------------
FVランキング
--------------------------------------*/
/* ベーススタイル */
    .fv-rank_container * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

.fv-rank_container p {
    margin: 0;
}

    /* コンテナ */
    .fv-rank_container {
      max-width: 1000px;
      margin: 0 auto;
      font-family: sans-serif;
      line-height: 1.5;
    }

    /* ヘッダー - 高さと文字サイズを小さく調整 */
    .fv-rank_header {
      background-color: #1a1a1a;
      color: white;
      padding: 0.75rem; /* パディングを小さく */
      text-align: center;
      border-top-left-radius: 0.5rem;
      border-top-right-radius: 0.5rem;
      margin-bottom: 0;
      border: 1px solid #d1d5db;
    }

    .fv-rank_main-title {
      font-size: 1.125rem; /* 文字サイズを小さく */
      font-weight: bold;
      display: block;
    }

    /* サービスコンテナ */
    .fv-rank_services-container {
      border-radius: 0 0 0.5rem 0.5rem;
      overflow: hidden;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
      border: 1px solid #d1d5db;
      border-top: none;
    }

    /* サービス項目 */
    .fv-rank_service-item {
      display: flex;
      flex-direction: column;
      padding: 1.25rem;
      border-bottom: 1px solid #d1d5db;
      background-color: white;
      transition: all 0.1s;
      transform: translateY(0);
    }

    .fv-rank_service-item:last-child {
      border-bottom: none;
    }

    /* サービス画像 */
    .fv-rank_service-image-container {
      width: 100%;
      margin-bottom: 1rem;
    }

    .fv-rank_service-image {
      width: 100%;
      height: auto;
      border-radius: 0.5rem;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      transition: transform 0.1s;
    }

    /* サービスコンテンツ */
    .fv-rank_service-content {
      flex: 1;
      display: flex;
      flex-direction: column;
    }

    /* サービスヘッダー */
    .fv-rank_service-header {
      display: flex;
      align-items: center;
      margin-bottom: 0.75rem;
    }

    /* サービス番号 */
    .fv-rank_service-number {
      width: 2.5rem;
      height: 2.5rem;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #000;
      color: white;
      border-radius: 9999px;
      font-weight: bold;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      margin-right: 1rem;
      animation: fv-rank-buttonPulse 2s infinite;
    }

    /* サービスタイトル */
    .fv-rank_service-title-container {
      flex: 1;
    }

    .fv-rank_service-title {
      font-size: 1.125rem;
      font-weight: bold;
      color: #111827;
      display: block;
    }

    /* サービス説明 */
    .fv-rank_service-description {
      color: #4b5563;
    }

    /* サービスアクション */
    .fv-rank_service-actions {
      display: flex;
      flex-direction: column;
      gap: 0rem;
      margin-top: 1rem;
    }

    /* ボタン */
    .fv-rank_btn {
      display: inline-block;
      padding: 0.75rem 1.25rem;
      border-radius: 0.375rem;
      text-align: center;
      font-weight: 600;
      text-decoration: none;
      transition: all 0.1s;
      transform: translateY(0);
    }

    .fv-rank_btn:hover {
/*       opacity: 0.7; */
			text-decoration: none;
    }

    .fv-rank_btn-primary {
      color: white;

			    background: var(--button-main-color);

border: 1px solid var(--button-main-color);
			
    }


.fv-rank_btn-primary:hover {
opacity: 0.7;

 }



    .fv-rank_btn-secondary {
/*       color: var(--wp--preset--color--sango-main); */
			
			color:var(--button-main-color);
			
			
    background-color: white;
/*     border: 2px solid var(--wp--preset--color--sango-main); */
			border: 1px solid var(--button-main-color);
    }
    
    .fv-rank_btn-secondary:hover {
      color: #fff;
/*     background-color: var(--wp--preset--color--sango-main); */
			background:var(--button-main-color);
    border: 1px solid var(--wp--preset--color--sango-main);
    }

.fv-rank_service-image-container {
				display: flex;
        justify-content: center;
        align-items: center;
      }

    /* アニメーション */
/*     @keyframes fv-rank-buttonPulse {
      0% {
        box-shadow: 0 4px 8px rgba(204, 0, 0, 0.3);
      }
      50% {
        box-shadow: 0 6px 12px rgba(204, 0, 0, 0.5);
      }
      100% {
        box-shadow: 0 4px 8px rgba(204, 0, 0, 0.3);
      }
    } */

    /* モバイル表示 (768px未満) */
    @media (max-width: 767px) {
      .fv-rank_service-item {
        flex-direction: column;
      }
      
      .fv-rank_service-image-container {
        width: 100%;
        margin-bottom: 1rem;
        margin-right: 0;
      }
      
      .fv-rank_service-content {
        margin-right: 0;
      }
      
      .fv-rank_service-actions {
        width: 100%;
        margin-top: 1rem;
      }
    }

    /* タブレット・小さいデスクトップ表示 (768px〜1240px) */
    @media (min-width: 768px) and (max-width: 1240px) {
      .fv-rank_main-title {
        font-size: 1.25rem; /* 文字サイズを調整 */
      }
      
      .fv-rank_service-item {
        flex-direction: row;
        flex-wrap: wrap;
      }
      
      .fv-rank_service-image-container {
        width: 22%;  /* 画像サイズを相対的に調整 */
        min-width: 120px;
        margin-bottom: 0;
        margin-right: 3%;
        flex-shrink: 0;
      }
      
      .fv-rank_service-content {
        flex: 1;
        min-width: 200px;
        margin-right: 3%;
      }
      
      .fv-rank_service-actions {
        width: 15%;  /* ボタンエリアのサイズを相対的に調整 */
        min-width: 120px;
        margin-top: 0;
        flex-shrink: 0;
      }
      
      .fv-rank_btn {
        padding: 0.625rem 0.75rem;
        font-size: 0.875rem;
      }
      
      /* 画面幅が狭い場合、ボタンエリアを下に配置 */
      @media (max-width: 900px) {
        .fv-rank_service-content {
          margin-right: 0;
          margin-bottom: 1rem;
        }
        
        .fv-rank_service-actions {
          width: 100%;
          display: flex;
          flex-direction: row;
          gap: 1rem;
        }
        
        .fv-rank_btn {
          flex: 1;
        }
      }
    }

    /* 大きいデスクトップ表示 (1240px以上) */
    @media (min-width: 1241px) {
      .fv-rank_main-title {
        font-size: 1.375rem; /* 文字サイズを調整 */
      }

      .fv-rank_service-item {
        flex-direction: row;
      }

      .fv-rank_service-image-container {
        width: 180px;
        margin-bottom: 0;
        margin-right: 1.25rem;
        flex-shrink: 0;
				display: flex;
        justify-content: center;
        align-items: center;
      }

      .fv-rank_service-content {
        margin-right: 1.25rem;
      }

      .fv-rank_service-actions {
        width: 160px;
        margin-top: 0;
        flex-shrink: 0;
      }
    }



.footer .wp-block-search .wp-block-search__input, .sidebar .wp-block-search .wp-block-search__input, .drawer .wp-block-search .wp-block-search__input {
    border: solid 1px #efefef;
}

.entrycontent p {max-width:100%}





.top-btn-cta a {
    display: flex
;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    max-width: 300px;
    height: 60px;
    font-size: 18px;
    font-weight: normal;
    text-decoration: none;
    transition: 0.1s;
    border-radius: 7px;
    margin-right: auto;
    margin-left: auto;
    background-color: var(--button-main-color);
    color: #fff;
    transition: all 0.1s 
ease-in-out;
	font-weight:700;
}

.top-btn-cta a:hover {
    opacity: 0.7;
    transition: all 0.1s 
ease-in-out;
}

.top-btn-cta a::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 20px;
    transform: rotate(45deg) translateY(-50%);
    width: 6px;
    height: 6px;
    border-width: 2px 2px 0 0;
    border-style: solid;
    border-color: #fff;
}

#breadcrumb li:first-child a:before {
    content: "\f015";
}

/* タブレット以下：パンくずリストの背景を白に */
@media (max-width: 768px) {
  .breadcrumb {
    background: #fff;
  }
}
.wp-block-heading {
    color: #ffffff;
    background-color: var(--wp--preset--color--sango-main);
    margin-bottom: 0;
    padding: var(--wp--custom--widget--padding-vertical) var(--wp--custom--widget--padding-horizontal);
    font-size: 1.2em;
    margin-top: 0;
	font-weight:bold;
}

.entrycontent p {max-width:100%}


/* ========================================
   カスタムヘッダー
======================================== */
.ksk-header {
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #e8e8e8;
  position: sticky;
  top: 0;
  z-index: 1000;
}

.ksk-header__inner {
  display: flex;
  align-items: center;
  gap: 32px;
  max-width: 1600px;
  margin: 0 auto;
  width: 100%;
  padding: 0 24px;
  height: 64px;
  box-sizing: border-box;
}

/* ロゴ（三井金属バナー＋九州精密機器ロゴを縦積み） */
.ksk-header__logo {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}

/* 三井金属グループ バナー（小さく上に） */
.ksk-header__group-banner {
  display: inline-block;
  line-height: 0;
  text-decoration: none;
}

.ksk-header__group-banner img {
  display: block;
  height: auto;
}

/* h1/div どちらで囲んでも見た目を同一にする */
.ksk-header__logo h1,
.ksk-header__logo div {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
}

.ksk-header__logo a {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.ksk-header__logo svg,
.ksk-header__logo img {
  display: block;
}

/* カテゴリナビ: ロゴとボタンの間を埋めてボタン寄り（justify-content: flex-end） */
.ksk-header__nav {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}

.ksk-header__nav .ksk-nav-list,
.ksk-header__nav ul {
  display: flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ksk-header__nav li {
  margin: 0;
  padding: 0;
}

.ksk-header__nav li a {
  display: inline-block;
  padding: 6px 14px 4px; /* bottom padding を少し縮めて文字と線を近づける */
  border-radius: 0;
  font-size: 14px;
  font-weight: 500;
  color: #2ea875;
  text-decoration: none;
  white-space: nowrap;
  position: relative;
}

/* 下線：padding分を除いた文字幅の下に表示 */
.ksk-header__nav li a::after {
  content: "";
  position: absolute;
  bottom: 2px;          /* 文字に近づける */
  left: 14px;
  width: calc(100% - 28px);
  height: 1px;
  background: #2ea875;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.25s ease;
}

.ksk-header__nav li a:hover::after {
  transform: scaleX(1);
  transform-origin: left center;
}

/* CTAボタン */
.ksk-header__cta {
  flex-shrink: 0;
}

.ksk-header__btn {
  display: inline-block;
  padding: 8px 20px;
  background: #fff45a;
  color: #2ea875 !important;
  border: 1px solid #2ea875;
  font-size: 14px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, color 0.2s, opacity 0.2s;
  white-space: nowrap;
}

.ksk-header__btn:hover {
  background: #f0e232;
  border-color: #247a5a;
  color: #2ea875 !important;
  text-decoration: none;
}

/* ボタン内の矢印アニメーション */
.ksk-btn-arrow {
  display: inline-block;
  margin-left: 5px;
  transition: transform 0.2s ease;
}

/* ヘッダーCTAボタン：短縮テキストはデフォルト非表示 */
.ksk-btn-text--short {
  display: none;
}

/* 420px以下：短縮テキスト・矢印なしに切り替え */
@media (max-width: 420px) {
  .ksk-header__btn .ksk-btn-text--full,
  .ksk-header__btn .ksk-btn-arrow {
    display: none;
  }
  .ksk-header__btn .ksk-btn-text--short {
    display: inline;
  }
}

.ksk-header__btn:hover .ksk-btn-arrow,
.ksk-footer__btn:hover .ksk-btn-arrow,
.ksk-top-fv__btn:hover .ksk-btn-arrow,
.ksk-top-side-cv__btn:hover .ksk-btn-arrow,
.ksk-top-final__btn:hover .ksk-btn-arrow,
.ksk-top-sticky-cta:hover .ksk-btn-arrow,
.ksk-top-more__link:hover .ksk-btn-arrow,
.ksk-header-band__link:hover .ksk-btn-arrow {
  transform: translateX(4px);
}

/* SANGOデフォルトヘッダーを非表示（カスタムヘッダーと重複しないよう） */
#header .inner-header,
#header .sng-header-wrap {
  display: none;
}

/* ========================================
   ヘッダー下帯バナー
======================================== */
.ksk-header-band {
  width: 100%;
  background: linear-gradient(
    to right,
    #2ea875 0%,
    #26956a 30%,
    #26956a 70%,
    #2ea875 100%
  );
  text-align: center;
  padding: 6px 24px;      /* 高さを低く */
  box-sizing: border-box;
  position: sticky;       /* スクロール追従 */
  top: 64px;              /* ヘッダーの高さ分下にずらす */
  z-index: 999;           /* ヘッダー(1000)の直下 */
}

.ksk-header-band__link {
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: #fff;  /* 通常時からはっきり表示 */
  letter-spacing: 0.04em;
  transition: opacity 0.2s ease;
}

.ksk-header-band__link:hover {
  opacity: 0.75;
  text-decoration-color: #fff;
}

/* ========================================
   ハンバーガーボタン（スマホのみ表示）
======================================== */
.ksk-hamburger {
  display: none; /* PCでは非表示 */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  flex-shrink: 0;
  margin-left: auto;
}

.ksk-hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: #2ea875;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform-origin: center;
}

/* ハンバーガー → ✕ アニメーション */
.ksk-hamburger.is-open span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.ksk-hamburger.is-open span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.ksk-hamburger.is-open span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ========================================
   モバイルメニュー
======================================== */
.ksk-mobile-menu {
  display: none; /* JS で制御 */
  background: #fff;
  border-top: 1px solid #e8e8e8;
  padding: 16px 24px 24px;
}

.ksk-mobile-menu.is-open {
  display: block;
}

.ksk-mobile-nav-list {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
}

.ksk-mobile-nav-list li {
  border-bottom: 1px solid #f0f0f0;
}

.ksk-mobile-nav-list li a {
  display: block;
  padding: 14px 4px;
  font-size: 15px;
  font-weight: 500;
  color: #2ea875;
  text-decoration: none;
  transition: color 0.2s;
}

.ksk-mobile-nav-list li a:hover {
  color: #3dc18a;
}

.ksk-mobile-menu__cta {
  padding-top: 8px;
}

.ksk-mobile-menu__cta .ksk-header__btn {
  display: block;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}

/* ========================================
   レスポンシブ：850px以下でハンバーガー表示
======================================== */
@media (max-width: 850px) {
  .ksk-header__inner {
    padding: 0 16px;
    gap: 0;
  }

  /* PC用ナビを非表示 */
  .ksk-header__nav {
    display: none;
  }

  /* CTAボタンをロゴの反対側（右端）に配置 */
  .ksk-header__cta {
    margin-left: auto;
  }

  /* ハンバーガーボタンを表示・CTAの直後に配置 */
  .ksk-hamburger {
    display: flex;
    margin-left: 8px;
  }
}


/* ========================================
   splide 関連
======================================== */


.l-inner {
  position: relative;
  box-sizing: content-box;
  max-width: 1200px;
  margin: 0 auto;
}

.l-section {
  border-top: 1px solid #eee;
}

.l-section .l-inner {
  padding-top: 0px;
  padding-bottom: 0px;
}

.c-temp {
  line-height: 1;
}

.c-temp .l-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.c-temp .text {
  font-size: 2.4rem;
  font-weight: bold;
}

.c-temp .button {
  font-size: 1.4rem;
  font-weight: bold;
  display: block;
  width: 12rem;
  padding: 1.6rem 0 1.2rem;
  text-align: center;
  letter-spacing: 0.1em;
  color: #fff;
  border-radius: 100px;
  background-color: #fff;
}

.c-footer .l-inner {
  padding-top: 0;
}

.c-footer .text {
  color: #333;
}

/* ========================================
   カスタムフッター
======================================== */
.ksk-footer {
  background: #F3F1EF;
  color: #333333;
  width: 100%;
  padding: 72px 0 0;
}

.ksk-footer__inner {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 32px;
}

.ksk-footer__main {
  min-height: 300px;
  display: grid;
  grid-template-columns: 280px 1fr 260px;
  gap: clamp(48px, 7vw, 96px);
  align-items: start;
}

.ksk-footer__brand {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.ksk-footer__logo {
  display: inline-flex;
  width: fit-content;
  text-decoration: none;
}

.ksk-footer__logo img {
  width: 220px;
  height: auto;
}

.ksk-footer__tagline {
  max-width: 280px;
  margin: 0;
  color: rgba(0, 0, 0, 0.6);
  font-size: var(--fs-s3, 13px);
  line-height: 1.9;
}

.ksk-footer__nav {
  display: grid;
  grid-template-columns: minmax(120px, 0.7fr) minmax(280px, 1.5fr) minmax(140px, 0.8fr);
  gap: 42px;
}

.ksk-footer__nav-title,
.ksk-footer__contact-title {
  margin: 0 0 18px;
  color: var(--ksk-top-c-primary, #2ea875);
  font-size: var(--fs-s1, 16px);
  font-weight: 700;
  letter-spacing: 0.04em;
}

.ksk-footer__nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ksk-footer__nav-list--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 28px;
}

.ksk-footer__nav-list li {
  margin: 0 0 9px;
}

.ksk-footer__nav-list a,
.ksk-footer__legal a {
  position: relative;
  display: inline-block;
  color: #333333;
  text-decoration: none;
  font-size: var(--fs-s2, 14px);
  line-height: 1.55;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.ksk-footer__nav-list a::after,
.ksk-footer__legal a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.25s ease;
}

.ksk-footer__nav-list a:hover,
.ksk-footer__legal a:hover {
  color: #2ea875;
}

.ksk-footer__nav-list a:hover::after,
.ksk-footer__legal a:hover::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.ksk-footer__contact {
  color: #333333;
}

.ksk-footer__contact-text {
  margin: 0 0 20px;
  color: rgba(0, 0, 0, 0.6);
  font-size: var(--fs-s2, 14px);
  line-height: 1.8;
}

.ksk-footer__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 12px 22px;
  background: #fff45a;
  color: #2ea875 !important;
  font-size: var(--fs-s2, 14px);
  font-weight: 700;
  border: 1px solid #2ea875;
  border-radius: 9999px;
  text-decoration: none;
  white-space: nowrap;
}

.ksk-footer__btn:hover {
  background: #f0e232;
  border-color: #247a5a;
  color: #2ea875 !important;
}


.ksk-footer__bottom {
  margin-top: 72px;
  padding: 24px 0 28px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 24px;
  align-items: center;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.ksk-footer__copyright {
  margin: 0;
  color: rgba(0, 0, 0, 0.6);
  font-size: var(--fs-s3, 13px);
}

.ksk-footer__legal {
  grid-column: 2 / 4;
  justify-self: end;
  display: flex;
  gap: 32px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ksk-footer__legal a {
  color: rgba(0, 0, 0, 0.7);
  font-size: var(--fs-s3, 13px);
}

/* ========================================
   フッター レスポンシブ
======================================== */
@media (max-width: 1100px) {
  .ksk-footer__main {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .ksk-footer__tagline {
    max-width: 560px;
  }

  .ksk-footer__nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ksk-footer__contact {
    max-width: 420px;
  }
}

@media (max-width: 760px) {
  .ksk-footer {
    padding-top: 52px;
  }

  .ksk-footer__inner {
    padding: 0 22px;
  }

  .ksk-footer__nav {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .ksk-footer__nav-list--grid {
    grid-template-columns: 1fr;
  }

  .ksk-footer__bottom {
    margin-top: 48px;
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ksk-footer__legal {
    grid-column: auto;
    justify-self: start;
    flex-direction: column;
    gap: 10px;
  }
}

.c-info {
  font-size: 1.4rem;
  display: inline-block;
  margin-top: 4rem;
  margin-bottom: 6.4rem;
}

.c-info li {
  position: relative;
  padding-left: 16px;
  color: #fff;
}

.c-info li::before {
  position: absolute;
  top: 0.6em;
  left: 0;
  display: inline-block;
  width: 8px;
  height: 2px;
  content: "";
  background-color: #fff;
}

.c-info li + li {
  margin-top: 0.8rem;
}

.c-title {
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 1.6;
  display: inline-block;
  min-width: 32rem;
  margin-bottom: 6.4rem;
  vertical-align: top;
  color: #fff;
}

.c-title [class*="ico-"] {
  font-size: 1.3rem;
  line-height: 1;
  display: block;
  width: 10rem;
  margin-bottom: 1.2rem;
  padding: 0.8rem 0 0.6rem;
  text-align: center;
  letter-spacing: 0.05em;
  border-radius: 100px;
}

.c-title .ico-advanced {
  color: #fff;
  background-color: #fff;
}

/* slider */
.slide-media,
.thumb-media {
  position: relative;
  overflow: hidden;
}

.slide-media img,
.thumb-media img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.splide {
  z-index: 0;
}

.splide-wrapper {
  position: relative;
}

.splide__arrow > svg {
  display: none;
}

.card04 {
  overflow: hidden;
}

.card04 .splide-a:not(.is-active) .splide__track {
  overflow: visible;
}

.card04 .splide__track {
  overflow: visible;
}

.card04 .splide__arrow--prev,
.card04 .splide__arrow--next {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  margin: auto;
}

.card04 .splide__arrow--prev {
  right: calc(100% - 1.6rem);
}

.card04 .splide__arrow--next {
  left: calc(100% - 1.6rem);
}

.card04 .splide-a:not(.is-active) {
  padding: 0;
}

.card04 .splide-a:not(.is-active) .splide__arrow--prev,
.card04 .splide-a:not(.is-active) .splide__arrow--next {
  display: none;
}

.card04 .splide-a:not(.is-active) .splide__list {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}

.card04 .slide {
  overflow: hidden;
  border-radius: 8px;
  height: 100%;
}

.card04 .slide-media {
  padding-top: 62.5%;
}

.card04 .slide-media img {
  height: calc(100%);
}

.card04 .slide-content {
  background-color: #fff;
  padding: 16px;
  height: 100%;
}

.card04 .slide-date {
  font-size: 1.2rem;
  line-height: 1;
  display: block;
  color: var(--color-theme);
}

.card04 .slide-title {
  line-height: 1.6;
  margin-top: 0;
  margin: 0px;
  padding: 0px;
  border-left-width: 0px;
  border-left-style: none;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
}
p.slide-text {
  font-size: 14px;
  margin-top: 12px;
  margin-bottom: 16px;
}
ul.slide-ul {
  margin-top: 0px;
  margin-bottom: 0px;
}
.slide-ul li {
  font-size: 14px;
  list-style-type: none;
  padding-top: 0px;
  padding-bottom: 0px;
  display: flex;
  align-items: center;
  font-weight: 700;
  margin-left: 16px;
}

@media only screen and (max-width: 599px) {
  .pc-tab {
    display: none !important;
  }
}

@media only screen and (min-width: 1025px) {
  .tab-sp {
    display: none !important;
  }

  .splide__arrow--prev:hover::before,
  .splide__arrow--next:hover::before {
    transform: scale(1.2);
  }
}

@media only screen and (min-width: 600px) {
  .sp {
    display: none !important;
  }
}

.splide.is-initialized:not(.is-active) .splide__list {
  /* display: block; */
  display: flex;
  flex-direction: row;
}
.card04 .splide-a:not(.is-active) .splide__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.splide__slide {
  color: #333;
}
article.slide {
  border: 1px solid #333;
}

.slide-ul li::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("../../uploads/top/check-circle.svg");
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
  vertical-align: middle;
}
button.splide__arrow.splide__arrow--prev {
  display: none;
}
button.splide__arrow.splide__arrow--next {
  display: none;
}

.image-overlay {
  display: flex;
  align-items: center;
}

.image-overlay img {
  display: block;
  width: auto;
  height: 50px !important;
  position: absolute;
  top: 0px;
  left: 0px;
  background: #fff;
  padding: 12px;
  border-bottom: 1px solid #333;
}

.overlay-number {
  font-size: 24px;
  color: #333;
  font-weight: bold;
  background-color: #e5e5e5;
  height: 50px;
  width: 50px;
  text-align: center;
  position: absolute;
  top: 0px;
  left: 91.5px;
  border-bottom: 1px solid #333;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
}

/*--------------------------------------
fv-image
--------------------------------------*/

.fv-article-image {
  height: 40vh;
  max-height: 500px;
  min-height: 200px;
  display: flex;
  align-items: stretch;
}

.fv-article-image img {
  height: 40vh;
  max-height: 500px;
  min-height: 200px;
  object-fit: cover;
}

.top-title-wrapper {
  display: flex;
}

/* ========================================
   新着コラム セクション
======================================== */

/* セクションタイトル */
.top-title-container {
  margin-bottom: 32px;
}

.top-heading-en {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #3dc18a;
  margin-bottom: 4px;
}

.top-title-h2 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #2ea875 !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

/* 左カラム（記事リスト）+ 右カラム（検索・カテゴリ）: 7.5:2.5 */
.top-left-article {
  flex-basis: 75% !important;
  padding-right: 0 !important;
}

.top-right-sidebar {
  flex-basis: 25% !important;
  border-left: 1px solid rgba(3, 56, 36, 0.1);
  padding-left: 24px !important;
}

/* もっと見るボタン */
.top-btn {
  margin-top: 24px;
  text-align: center;
}

/* 新着コラム「もっとみる」ボタン：下にボーダー */
.top-btn--new {
  padding-bottom: 48px;
  border-bottom: 1px solid #c7d9cd;
}

.top-btn a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 13px 32px !important;
  background: #fff !important;
  border: 1px solid #2ea875 !important;
  color: #2ea875 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: background 0.2s, color 0.2s !important;
  position: relative !important;
}

.top-btn a::after {
  content: "→";
  font-size: 14px;
  transition: transform 0.2s ease;
  display: inline-block;
}

.top-btn a:hover {
  background: #2ea875 !important;
  color: #fff !important;
}

.top-btn a:hover::after {
  transform: translateX(4px);
}

/* サイドバー：検索 */
.top-right-sidebar .wp-block-search {
  margin-bottom: 32px;
}

.top-right-sidebar .wp-block-search__input {
  border: 0px solid #ccc;
  border-radius: 6px 0 0 6px;
  padding: 8px 12px;
  font-size: 13px;
  outline: none;
}

.top-right-sidebar .wp-block-search__button {
  background: #2ea875;
  color: #fff;
  border: none;
  border-radius: 0 6px 6px 0;
  padding: 8px 14px;
  cursor: pointer;
}

.top-right-sidebar :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) {
  border-radius: 8px !important;
}

/* サイドバー：カテゴリタイトル（白背景・角丸） */
.ksk-category-title {
  background: #fff;
  border-radius: 8px 8px 0 0;
  padding: 16px 16px 12px !important;
  margin-bottom: 0 !important;
  font-weight: 700 !important;
  color: #2ea875 !important;
}

.top-right-sidebar .top-category {
  background: #fff;
  border-radius: 0 0 8px 8px;
  padding: 12px 16px 16px !important;
}

/* サイドバー：カテゴリタイトル */
.sidebar-main-title {
  font-size: 13px;
  font-weight: 700;
  color: #2ea875;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding-bottom: 8px;
  border-bottom: 2px solid #3dc18a;
  margin-bottom: 12px;
}

/* カテゴリリスト：タグ型ボタン */
.top-category {
  list-style: none !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.top-category li {
  border-bottom: none;
}

.top-category li a {
  display: inline-flex !important;
  align-items: center;
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #2ea875 !important;
  background: #ffffff;
  border: 1.5px solid #c7d9cd;
  border-radius: 999px !important;
  text-decoration: none !important;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  white-space: nowrap;
}

.top-category li a:hover {
  background: #2ea875 !important;
  color: #fff !important;
  border-color: #2ea875 !important;
}

/* レスポンシブ（850px以下）: タイトルサイズ変更 */
@media (max-width: 850px) {
  .top-title-h2 {
    font-size: 18px !important;
  }
}

/* レスポンシブ（600px以下）: 左右カラム縦積み */
@media (max-width: 600px) {
  .top-left-article {
    flex-basis: 100% !important;
    padding-right: 0 !important;
  }

  .top-right-sidebar {
    flex-basis: 100% !important;
    border-left: none;
    border-top: 1px solid rgba(3, 56, 36, 0.1);
    padding-left: 0 !important;
    padding-top: 32px !important;
  }
}

/* ksk-column-section 内の .wrap 幅を100%に */
.ksk-column-section .wrap {
  width: 100% !important;
}

/* ========================================
   人気ランキング（ksk-column-section内）
======================================== */
/* カードグリッド */
#sgb-css-id-7 .catpost-cards {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}

/* flatレイアウト（横並び）を縦型に上書き */
#sgb-css-id-7 .catpost-cards--flat .c_linkto {
  display: flex !important;
  flex-direction: column !important;
}

#sgb-css-id-7 .catpost-cards--flat .c_linkto_img_wrap {
  width: 100% !important;
  flex-shrink: 0 !important;
}

#sgb-css-id-7 .catpost-cards--flat .c_linkto_text {
  width: 100% !important;
}

/* カードのボーダー色・背景 */
#sgb-css-id-7 .catpost-cards .c_linkto_wrap {
  max-width: none !important;
  border: 1px solid #ffffff !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background: #fff !important;
}

/* ランキングバッジ（1位・2位・3位） */
#sgb-css-id-7 .catpost-cards .c_linkto_wrap:nth-child(1) .c_linkto_img_wrap::before,
#sgb-css-id-7 .catpost-cards .c_linkto_wrap:nth-child(2) .c_linkto_img_wrap::before,
#sgb-css-id-7 .catpost-cards .c_linkto_wrap:nth-child(3) .c_linkto_img_wrap::before {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

#sgb-css-id-7 .catpost-cards .c_linkto_wrap:nth-child(1) .c_linkto_img_wrap::before {
  content: "1";
  background: #D4A017;
}

#sgb-css-id-7 .catpost-cards .c_linkto_wrap:nth-child(2) .c_linkto_img_wrap::before {
  content: "2";
  background: #9EA5A8;
}

#sgb-css-id-7 .catpost-cards .c_linkto_wrap:nth-child(3) .c_linkto_img_wrap::before {
  content: "3";
  background: #B87333;
}

/* ホバー時の上移動・影を無効化 */
#sgb-css-id-7 .c_linkto_wrap,
#sgb-css-id-7 .c_linkto {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

#sgb-css-id-7 .c_linkto_wrap:hover,
#sgb-css-id-7 .c_linkto:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* ホバー時：画像を白くフェード */
#sgb-css-id-7 .c_linkto_img_wrap {
  position: relative;
  overflow: hidden;
  box-shadow: none !important;
  transition: none !important;
  border-radius: 0 !important;
}

#sgb-css-id-7 .c_linkto_img_wrap:hover {
  box-shadow: none !important;
  transform: none !important;
}

#sgb-css-id-7 .c_linkto_img_wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0);
  transition: background 0.3s ease;
  pointer-events: none;
}

#sgb-css-id-7 .c_linkto:hover .c_linkto_img_wrap::after {
  background: rgba(255, 255, 255, 0.3);
}

/* テキスト色・日付 */
#sgb-css-id-7 .c_linkto_text {
  color: #2ea875 !important;
  padding: 12px 14px 14px !important;
}

#sgb-css-id-7 .sng-link-time {
  font-weight: 400 !important;
}

/* タブレット（850px以下）: 2カラム */
@media (max-width: 850px) {
  #sgb-css-id-7 .catpost-cards {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
}

/* スマホ（480px以下）: 1カラム */
@media (max-width: 480px) {
  #sgb-css-id-7 .catpost-cards {
    grid-template-columns: 1fr !important;
  }
}

/* ランキングタイトルの上余白 */
.ksk-column-section .top-left-article .top-title-container:not(:first-child) {
  margin-top: 48px !important;
}

/* 新着コラム：カードグリッド 3カラム → 2カラム → 1カラム */
.ksk-column-section .catpost-cards {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}

/* カードのボーダー色 */
html body .ksk-column-section .catpost-cards .c_linkto_wrap,
html body .ksk-column-section .catpost-cards .c_linkto_wrap:hover {
  border: 1px solid #ffffff !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* タブレット（850px以下）: 2カラム */
@media (max-width: 850px) {
  .ksk-column-section .catpost-cards {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
}

/* スマホ（480px以下）: 1カラム */
@media (max-width: 480px) {
  .ksk-column-section .catpost-cards {
    grid-template-columns: 1fr !important;
  }
}




.splide {
  z-index: 0;
}

.splide-wrapper {
  position: relative;
}

.splide__arrow > svg {
  display: none;
}

.card04 .splide-a:not(.is-active) .splide__track {
  overflow: visible;
}

.card04 .splide__track {
  overflow: visible;
}

.card04 .splide__arrow--prev,
.card04 .splide__arrow--next {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  margin: auto;
}

.card04 .splide__arrow--prev {
  right: calc(100% - 1.6rem);
}

.card04 .splide__arrow--next {
  left: calc(100% - 1.6rem);
}

.card04 .splide-a:not(.is-active) {
  padding: 0;
}

.card04 .splide-a:not(.is-active) .splide__arrow--prev,
.card04 .splide-a:not(.is-active) .splide__arrow--next {
  display: none;
}

.card04 .splide-a:not(.is-active) .splide__list {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}

@media only screen and (min-width: 1025px) {
  .splide__arrow--prev:hover::before,
  .splide__arrow--next:hover::before {
    transform: scale(1.2);
  }
}

.splide.is-initialized:not(.is-active) .splide__list {
  /* display: block; */
  display: flex;
  flex-direction: row;
}

.card04 .splide-a:not(.is-active) .splide__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.splide__slide {
  color: #333;
}

button.splide__arrow.splide__arrow--prev {
  display: none;
}
button.splide__arrow.splide__arrow--next {
  display: none;
}

button.splide__toggle {
  text-align: center;
  margin-left: auto;
}

/* splide */

/* ページネーション分の下余白を確保 */
.container .splide {
  padding-bottom: 2.8em;
}

.container .splide .splide__slide .post-card {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}

.container .splide .thumbnail-link {
  display: block;
}

.container .splide img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.container .splide .post-card-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 1.6rem 2rem;
  border-radius: 4px;
  color: #000;
  text-decoration: none;
}

.container .splide .content-date {
  display: block;
  font-size: 14px;
  margin-bottom: 5px;
}

.container .splide .content-title {
  font-weight: 700;
  font-size: 18px;       /* デスクトップ: 18px */
  margin: 0;
  line-height: 1.6;
  background: rgba(0, 61, 37, 0.75);
  color: #fff;
  padding: 4px 8px;
  display: inline;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  text-align: left;
}

/* 1025〜1499px: フォントやや小さめ */
@media (max-width: 1499px) {
  .container .splide .content-title {
    font-size: 16px;
  }
}

/* 769〜1024px: さらに小さく */
@media (max-width: 1024px) {
  .container .splide .content-title {
    font-size: 15px;
  }
}

/* 〜768px: 背景なし・フォントさらに小さく */
@media (max-width: 768px) {
  .container .splide .content-title {
    font-size: 13px;
    background: none;
    padding: 0;
  }
}

/* 〜480px: 最小サイズ */
@media (max-width: 480px) {
  .container .splide .content-title {
    font-size: 12px;
  }
}

.splide__slide .post-card {
  transition: opacity 0.3s ease-out;
  box-shadow: 4px 6px 16px rgba(0, 0, 0, 25%);
}

div#splide01-track {
  overflow: hidden;
  /* padding: 24px; */
}

/* splide  */

.splide__pagination {
  bottom: -2.2em !important; /* スライドとの余白を確保 */
}

.splide__pagination__page {
  background: #ccc !important; /* 非アクティブなページネーションの色 */
  width: 10px !important; /* サイズ調整 */
  height: 10px !important;
  margin: 0 5px !important; /* 間隔調整 */
  transition: all 0.3s ease;
}

.splide__pagination__page.is-active {
  background: #2ea875 !important; /* アクティブなページネーションの色 */
  transform: scale(1.2) !important; /* アクティブ時に少し大きく */
}

/* スライダー要素のスタイル */
.splide__slider {
  position: relative;
}

/* 丸い矢印のスタイル */
.splide__arrows--round .splide__arrow {
  background: #fff;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  opacity: 0.8;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.splide__arrows--round .splide__arrow:hover {
  opacity: 1;
  background: #f8f8f8;
}

.splide__arrows--round .splide__arrow svg {
  fill: #333;
  width: 20px;
  height: 20px;
}


/* モバイル対応 */
@media (max-width: 768px) {
  .splide__arrows--round .splide__arrow {
    width: 30px;
    height: 30px;
  }

  .splide__arrows--round .splide__arrow svg {
    width: 15px;
    height: 15px;
  }
}

/* アクセシビリティ修正 - 非表示スライドでもフォーカス可能に */
.splide__slide:not(.is-active) a {
  visibility: visible !important;
  pointer-events: auto !important;
}

/* 非アクティブスライドのリンクがフォーカスされたときの表示を改善 */
.splide__slide:not(.is-active) a:focus {
  outline: 2px solid #2ea875;
  outline-offset: 2px;
}

/* post-card の縦横を16:9に固定（どんな画像サイズでも崩れない） */
.container .splide .post-card {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 9;
}

/* post-card 内の img・a をすべて枠いっぱいに引き伸ばす */
.container .splide .thumbnail-link {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.container .splide .post-card img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;   /* どんなサイズの画像でも16:9枠に収める */
  object-position: center;
}

/* splide__slide 単体の img も念のため制御 */
.splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.splide__arrow {
  background: #000 !important;
}


/* ========================================
   Splide 初期化前のチラつき防止
   ※ HTMLのstyle属性でvisibility:hiddenを付与済み
   　 mounted後にJSでvisibility:visibleに戻す
======================================== */

/* 念のためCSSでも保証（JS読み込み前の一瞬もカバー） */
.splide-loop:not(.is-initialized) {
  visibility: hidden !important;
  opacity: 0 !important;
}
.splide-loop.is-initialized {
  visibility: visible !important;
  opacity: 1 !important;
}















/*--------------------------------------
ここから
--------------------------------------*/
.top-content-custum .wrap {
  margin: 0px;
}

@media only screen and (min-width: 769px) {
  .top-content-custum .wrap {
    margin: 0px;
  }

  #content.top-content-custum {
    padding: 0px !important;
  }
}

@media only screen and (min-width: 1030px) {
  .top-content-custum #inner-content {
    width: 100% !important;
  }
  #content.top-content-custum .entry-content {
    max-width: 100%;
    margin-right: 0px;
    margin-left: 0px;
  }
}

button.splide__toggle {
  text-align: center;
  margin-left: auto;
}

/* kokusai */
.contact-sticky-banner p {
  font-size: 17px;
}

.contact-container-kokusai img {
  max-width: 80%;
}

.contact-howto-title {
  max-width: 800px;
}

/* トップFV */
.top-fv {
  border-bottom: 1px solid #c7d9cd;
}

/* トップページのみ entry-content h2 のデフォルトスタイルを無効化 */
.page-forfront .entry-content h2 {
  border-left: none !important;
  padding: 0 !important;
  background: none !important;
}

/* サイドバーウィジェットタイトル（h4→divに変更したためスタイルを維持） */
div.widgettitle {
  display: block;
  font-size: 1em;
  font-weight: 700;
  margin-block-start: 0;
  margin-block-end: 0;
}

@media only screen and (min-width: 769px) {
  .page-forfront .wrap {
    width: 100%;
  }
}

/* 新着コラムセクション */
.ksk-column-section {
  border-bottom: 1px solid #c7d9cd;
  background: #ffffff;
}

html .page-forfront .ksk-column-section .sgb-full-bg__content {
  max-width: 1600px !important;
  width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  box-sizing: border-box !important;
}

@media only screen and (max-width: 1600px) {
  html .page-forfront .ksk-column-section .sgb-full-bg__content {
    padding-right: 32px !important;
    padding-left: 32px !important;
  }
}

@media only screen and (max-width: 768px) {
  html .page-forfront .ksk-column-section .sgb-full-bg__content {
    padding-right: var(--wp--custom--wrap--mobile--padding, 16px) !important;
    padding-left: var(--wp--custom--wrap--mobile--padding, 16px) !important;
  }
}





.top-consultation .sgb-full-bg__cover {
  opacity: 0.2;
}
.top-ranking .sgb-full-bg__cover {
  opacity: 0.2;
}

.splide__slide .post-card {
  transition: opacity 0.3s ease-out;
  box-shadow: 4px 6px 16px rgba(0, 0, 0, 25%);
}

.post-card-overlay {
  /* 下から上に向かって #2ea875 の線形グラデーション（80% → 30% → 完全透明） */
  background: linear-gradient(
    to top,
    rgba(0, 61, 37, 0.8) 0%,
    rgba(0, 61, 37, 0.3) 50%,
    rgba(0, 61, 37, 0) 100%
  );
}

.post-card:hover .post-card-overlay {
  background: linear-gradient(
    to top,
    rgba(0, 61, 37, 0.8) 0%,
    rgba(0, 61, 37, 0.3) 50%,
    rgba(0, 61, 37, 0) 100%
  );
}

@media (max-width: 768px) {
  .post-card:hover .post-card-overlay {
    background-color: rgba(255, 255, 255, 0);
  }
}

/* ========================================
   splide-loop スライダーの矢印を強制表示・スタイル
   （他の button.splide__arrow { display:none } を上書き）
======================================== */
.splide-loop .splide__arrow,
.splide-loop button.splide__arrow--prev,
.splide-loop button.splide__arrow--next,
.splide-loop button.splide__arrow.splide__arrow--prev,
.splide-loop button.splide__arrow.splide__arrow--next {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  /* ボタン本体のデザイン */
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 10 !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
  cursor: pointer !important;
  transition: background 0.2s ease, box-shadow 0.2s ease !important;
  padding: 0 !important;
  color: #2ea875 !important;
}

.splide-loop button.splide__arrow--prev {
  left: 8px !important;
}

.splide-loop button.splide__arrow--next {
  right: 8px !important;
}

.splide-loop .splide__arrow:hover,
.splide-loop button.splide__arrow--prev:hover,
.splide-loop button.splide__arrow--next:hover {
  background: rgba(255, 255, 255, 1) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}

/* 矢印のSVGを表示（他のルールでhideされている場合の対策） */
.splide-loop .splide__arrow > svg {
  display: block !important;
  fill: currentColor !important;
  width: 28px !important;
  height: 28px !important;
  pointer-events: none;
}

/* 親テーマの .splide__arrow--prev svg { transform: scaleX(-1) } を打ち消す */
.splide-loop .splide__arrow--prev svg {
  transform: none !important;
}

/* ========================================
   トップページのスライダーエリアのみ width・padding を上書き
======================================== */
@media only screen and (min-width: 769px) {
  .home .top-content-custum .wrap,
  .page-forfront .top-content-custum .wrap {
    width: 100% !important;
  }
}

.home #content.page-forfront,
.page-forfront #content.page-forfront {
  padding: 0 !important;
}

/* ========================================
   CTAセクション（画像＋テキスト）
======================================== */
.ksk-cta-section {
  width: 100%;
  background: #fff;
  padding: 48px 24px;
  box-sizing: border-box;
  border-bottom: 0px solid #c7d9cd;
}

.ksk-cta-section__inner {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 56px;
}

/* 左：画像 */
.ksk-cta-section__image {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
}

/* 右下→左上への薄いグラデーションオーバーレイ */
.ksk-cta-section__image::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 2px;
  background: linear-gradient(
    to top left,
    rgba(0, 61, 37, 0.55) 0%,
    rgba(0, 61, 37, 0.15) 30%,
    rgba(0, 61, 37, 0) 50%
  );
  pointer-events: none;
}

.ksk-cta-section__img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: 20% center;
  border-radius: 2px;
  display: block;
  background: #D9D9D9;
  filter: brightness(1.25);
}

/* ========================================
   ヒーローバナー（横長画像＋テキストオーバーレイ）
======================================== */
.ksk-hero-banner {
  width: 100%;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #c7d9cd;
}

.ksk-hero-banner__img {
  width: 100%;
  aspect-ratio: 1137 / 400;
  object-fit: cover;
  object-position: center 35%;
  display: block;
}

/* 下から上へのグラデーションオーバーレイ */
.ksk-hero-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 61, 37, 0.85) 0%,
    rgba(0, 61, 37, 0.5) 30%,
    rgba(0, 61, 37, 0) 55%
  );
  pointer-events: none;
}

/* コンテンツ：左下配置 */
.ksk-hero-banner__content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 32px 24px;
  box-sizing: border-box;
}

.ksk-hero-banner__content-inner {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  gap: 48px;
}

/* 左：サブタイトル＋タイトル */
.ksk-hero-banner__left {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
  text-align: left;
}

.ksk-hero-banner__sub {
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.1em;
  margin: 0;
}

.ksk-hero-banner__title {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

/* 右：本文＋ボタン */
.ksk-hero-banner__right {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.ksk-hero-banner__body {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.8;
  margin: 0;
}

.ksk-hero-banner__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 12px 28px;
  background: #2ea875;
  color: #fff !important;
  font-size: 14px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.2s;
}

.ksk-hero-banner__btn:hover {
  background: #247a5a;
  color: #fff !important;
}

.ksk-hero-banner__btn:hover .ksk-btn-arrow {
  transform: translateX(4px);
}

/* レスポンシブ（850px以下）: 縦積み */
@media (max-width: 850px) {
  .ksk-hero-banner__content {
    padding: 24px 20px;
  }

  .ksk-hero-banner__content-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .ksk-hero-banner__title {
    font-size: 20px !important;
  }

  .ksk-hero-banner__img {
    aspect-ratio: 16 / 10;
  }

  /* グラデーションの範囲を広げて左側も覆う */
  .ksk-hero-banner__overlay {
    background: linear-gradient(
      to top,
      rgba(0, 61, 37, 0.9) 0%,
      rgba(0, 61, 37, 0.6) 40%,
      rgba(0, 61, 37, 0.2) 70%,
      rgba(0, 61, 37, 0) 100%
    );
  }
}

/* スマホ（480px以下） */
@media (max-width: 480px) {
  .ksk-hero-banner__title {
    font-size: 18px !important;
  }

  .ksk-hero-banner__btn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }
}

/* 右：テキスト */
.ksk-cta-section__content {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-self: center;
  justify-content: center;
}

.entry-content .ksk-cta-section__label,
.ksk-cta-section__label {
  font-size: 12px !important;
  font-weight: 600;
  color: #3dc18a;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 !important;
}

.entry-content .ksk-cta-section__catch,
.ksk-cta-section__catch {
  font-size: 23px !important;
  font-weight: 700 !important;
  color: #2ea875 !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  border-left: none !important;
  padding: 0 !important;
  background: none !important;
}

.ksk-cta-section__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-self: flex-start; /* コンテンツ幅に合わせる */
  width: 100%;
  max-width: fit-content;
}

.ksk-cta-section__list li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
  color: #2ea875;
  background: #ffffff;
  border-radius: 8px;
  padding: 10px 14px;
  line-height: 1.5;
}

.ksk-cta-section__list li .material-icons-round {
  font-size: 20px;
  color: #3dc18a;
  flex-shrink: 0;
}

.entry-content .ksk-cta-section__body,
.ksk-cta-section__body {
  font-size: 14px;
  color: #4A5A52;
  line-height: 1.8;
  margin: 0 !important;
}

.ksk-cta-section__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 14px 28px;
  background: #2ea875;
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.2s;
  align-self: flex-start;
}

.ksk-cta-section__btn:hover {
  background: #247a5a;
  color: #fff !important;
}

.ksk-cta-section__btn:hover .ksk-btn-arrow {
  transform: translateX(4px);
}

/* CTAセクション レスポンシブ（850px以下） */
@media (max-width: 850px) {
  .ksk-cta-section {
    padding: 32px 20px;
  }

  .ksk-cta-section__inner {
    flex-direction: column;
    gap: 24px;
  }

  .ksk-cta-section__image {
    flex: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }

  .ksk-cta-section__img {
    aspect-ratio: 16 / 9;
    border-radius: 2px;
  }

  .ksk-cta-section__catch {
    font-size: 20px;
  }

  .ksk-cta-section__btn {
    align-self: stretch;
    justify-content: center;
  }
}

/* ========================================
   ヘッダーバンド・モバイルメニュー：850px以下
======================================== */
@media (max-width: 850px) {
  .ksk-header-band {
    top: 56px; /* スマホ時のヘッダー高さに合わせる */
  }

  .ksk-mobile-menu {
    top: calc(56px + 33px); /* ヘッダー + バンドの高さ */
  }
}

/* ========================================
   新着コラム カードリンク（c_linkto）上書き
======================================== */
/* ホバー時の上移動・影を無効化 */
.ksk-column-section .c_linkto_wrap,
.ksk-column-section .c_linkto {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

.ksk-column-section .c_linkto_wrap:hover,
.ksk-column-section .c_linkto:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* ホバー時：画像を白くフェード */
.ksk-column-section .c_linkto_img_wrap {
  position: relative;
  overflow: hidden;
}

.ksk-column-section .c_linkto_img_wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0);
  transition: background 0.3s ease;
  pointer-events: none;
}

.ksk-column-section .c_linkto:hover .c_linkto_img_wrap::after {
  background: rgba(255, 255, 255, 0.3);
}

/* テキスト色 */
.ksk-column-section .c_linkto_text {
  color: #2ea875 !important;
}

/* 日付フォントウェイトを通常に */
.ksk-column-section .sng-link-time {
  font-weight: 400 !important;
}

/* カード画像ホバー時の影を無効化 */
.ksk-column-section .c_linkto_img_wrap img,
.ksk-column-section .c_linkto:hover .c_linkto_img_wrap img {
  box-shadow: none !important;
}

/* カードテキスト余白 */
.ksk-column-section .c_linkto_text {
  padding: 12px 14px 14px !important;
}

/* ========================================
   バナーセクション
======================================== */
.ksk-banner-section {
  width: 100%;
  background: #2ea875;
  padding: 64px 24px;
  box-sizing: border-box;
  text-align: center;
}

.ksk-banner-section__inner {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.ksk-banner-section__sub {
  font-size: 13px;
  font-weight: 600;
  color: #3dc18a;
  letter-spacing: 0.08em;
  margin: 0;
}

.ksk-banner-section__title {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

.ksk-banner-section__body {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.8;
  margin: 0;
}

.ksk-banner-section__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 14px 32px;
  background: #2ea875;
  color: #fff !important;
  font-size: 15px;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.2s;
  white-space: nowrap;
}

.ksk-banner-section__btn:hover {
  background: #247a5a;
  color: #fff !important;
}

/* レスポンシブ（600px以下） */
@media (max-width: 600px) {
  .ksk-banner-section {
    padding: 48px 20px;
  }

  .ksk-banner-section__title {
    font-size: 20px !important;
  }

  .ksk-banner-section__btn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }
}

/* ========================================
   rlmg 画像ホバー：白くフェード演出
======================================== */
/* ホバー時の浮き上がり・影を無効化 */
a:has(figure.rlmg) {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

a:hover:has(figure.rlmg) {
  transform: none !important;
  box-shadow: none !important;
}

/* 画像ホバーで白くフェード・浮き上がり無効化 */
figure.rlmg {
  position: relative;
  overflow: hidden;
  transform: none !important;
  transition: none !important;
  box-shadow: none !important;
}

a:hover figure.rlmg,
a:hover figure.rlmg img {
  transform: none !important;
  transition: none !important;
}

figure.rlmg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0);
  transition: background 0.3s ease;
  pointer-events: none;
}

a:hover figure.rlmg::after {
  background: rgba(255, 255, 255, 0.3);
}

/* rlmg 画像の影を無効化 */
.rlmg img {
  box-shadow: none !important;
}

/* ========================================
   サイト全体：影・浮き上がりをまとめて無効化
======================================== */
figure,
figure img,
.prnx_box,
.prnx_box a,
.prnx,
.related-posts,
.related-posts a,
.related-posts li,
.c_linkto,
.c_linkto_wrap,
.c_linkto img,
.sng-card,
.sng-card img,
.cat-card,
.cat-card img {
  box-shadow: none !important;
}

figure:hover,
figure img:hover,
.prnx_box a:hover,
.related-posts a:hover,
.c_linkto:hover,
.c_linkto_wrap:hover,
.sng-card:hover,
.cat-card:hover {
  box-shadow: none !important;
  transform: none !important;
}

/* 前後記事ナビ（prnx_box）浮き上がり・影を無効化 */
.prnx_box a,
.prnx_box a:hover {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

.prnx_tb figure,
.prnx_tb figure img {
  box-shadow: none !important;
  transform: none !important;
}

/* ========================================
   関連記事スライド（related-posts）rlmg 画像
======================================== */
/* 浮き上がり・影を無効化 */
.related-posts a {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

.related-posts a:hover {
  transform: none !important;
  box-shadow: none !important;
}

.related-posts figure.rlmg {
  transform: none !important;
  box-shadow: none !important;
  transition: none !important;
}

.related-posts figure.rlmg img {
  box-shadow: none !important;
}








/* ========================================
 adinserter
======================================== */

/* タイトル */
.ksk-info-title {
  font-size: 20px !important;
  border-left: 4px solid var(--wp--preset--color--sango-main);
  padding: .5em .7em;
  background: #f2f2f2;
  color: #323232;
  margin-bottom: 15px;
  font-weight: 700;
  line-height: 1.6;
}

/* 画像 */
.ksk-info-image {
    margin: 0 0 1.5em;
}

/* リード文 */
.ksk-info-lead {
    margin: 0 0 1.2em;
    line-height: 1.9;
    color: #333;
}

/* 強調 */
.ksk-highlight {
    color: var(--sgb-accent-color);
    font-weight: 700;
}

/* ポイント枠 */
.entry-content ul.ksk-info-points {
     list-style: none;
}

.ksk-info-points {
    padding: 22px;
    margin: 0 0 1.5em;
    background: rgba(0, 174, 104, 0.05);
    border-radius: 10px;
}

.ksk-info-points li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 8px;
  font-size: 15px;
  line-height: 1.7;
  font-weight: 600;
  color: var(--sgb-main-color);
}

.ksk-info-points li:last-child {
  margin-bottom: 0;
}

.ksk-info-points li::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f058"; /* fa-circle-check */
  position: absolute;
  left: 0;
  top: 0;
  font-size: 18px;
  color: var(--sgb-accent-color);
}

/* CTA */
.ksk-info-cta {
  text-align: center;
  margin: 20px 0 8px;
}

.ksk-info-button {
  display: inline-block;
  padding: 14px 28px;
  background: var(--sgb-accent-color);
  color: #fff !important;
  text-decoration: none;
  border-radius: 6px;
  font-weight: 700;
  transition: all .2s ease;
}

.ksk-info-button:hover {
  background: #00995b;
}

/* マイクロコピー */
.ksk-info-microcopy {
  text-align: center;
  font-size: 12px;
  margin: 0 0 1.5em;
  color: #666;
}






/* feature-image / ksk-info-image：16:9 トリミング表示 */
.feature-image,
.ksk-info-image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* feature-box ラッパー */
.feature-box-wrapper {
  padding: 24px;
  background: rgba(0, 174, 104, 0.05);
  border-radius: 8px;
}

/* タイトル強調 */
.feature-box-title-main {
  display: block;
  color: var(--sgb-main-color);
  font-weight: 700;
  font-size: 1.4em;
  margin-top: 16px;
  margin-bottom: 0;
}

.feature-box-title-sub {
  color: #444;
  font-size: 1em;
}

/* 強調テキスト */
.ksk-highlight {
  color: var(--sgb-accent-color);
  font-weight: 700;
}

/* CTAリード文 */
.ksk-cta-lead {
  font-size: 1.05em;
  line-height: 2;
}


/* Article CTA before table of contents */
.ksk-before-toc-cta {
  margin: 28px 0;
  color: #333;
  border: 1px solid rgba(46, 168, 117, 0.22);
  border-radius: 12px;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 12%, rgba(255, 244, 90, 0.22) 0%, rgba(255, 244, 90, 0) 28%),
    linear-gradient(135deg, rgba(46, 168, 117, 0.1) 0%, rgba(255, 248, 54, 0.14) 100%);
}

.ksk-before-toc-cta__bg {
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(23, 120, 84, 0.96) 0%, rgba(46, 168, 117, 0.9) 58%, rgba(31, 111, 81, 0.96) 100%);
}

.ksk-before-toc-cta__container {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(220px, 0.92fr);
  gap: 0;
  align-items: stretch;
}

.ksk-before-toc-cta__image-col {
  order: 2;
  align-self: stretch;
  min-height: 100%;
}

.ksk-before-toc-cta__image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
}

.ksk-before-toc-cta__content {
  display: flex;
  align-items: center;
  order: 1;
  padding: 34px 32px;
}

.ksk-before-toc-cta__title {
  margin: 0;
  line-height: 1.75;
}

.ksk-before-toc-cta__title-main {
  display: block;
  color: #fff;
  font-size: clamp(1.22rem, calc(1.05rem + 0.65vw), 1.55rem);
  font-weight: 700;
  line-height: 1.55;
}

.ksk-before-toc-cta__title-sub {
  display: block;
  margin-top: 12px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.98rem;
  line-height: 1.9;
}

.ksk-before-toc-cta__info {
  padding: 26px 28px 30px;
  background-color: rgba(46, 168, 117, 0.06);
  border-top: 1px solid rgba(255, 255, 255, 0.56);
  backdrop-filter: blur(8px);
}

.ksk-before-toc-cta__lead {
  margin: 0 0 18px;
  font-size: 0.98rem;
  line-height: 1.95;
  color: #333;
}

.ksk-before-toc-cta__lead-first {
  color: #333;
  font-weight: 700;
}

.ksk-before-toc-cta__points {
  display: grid;
  gap: 3px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.ksk-before-toc-cta__points li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: var(--button-main-color);
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.42;
}

.ksk-before-toc-cta__points .material-icons-round {
  margin-top: 0.08em;
  color: #2ea875;
  font-size: 20px;
  line-height: 1;
}

.ksk-before-toc-cta__num {
  color: var(--button-main-color);
  background: linear-gradient(transparent 42%, rgba(255, 244, 90, 0.86) 42%);
  padding: 0 0.16em 0.02em;
  font-weight: 800;
}

.ksk-before-toc-cta__button-wrap {
  margin: 22px 0 0;
  text-align: center;
}

.ksk-before-toc-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 520px);
  min-height: 56px;
  padding: 14px 28px;
  background: #fff45a;
  color: #2ea875 !important;
  border: 1px solid #2ea875;
  border-radius: var(--ksk-top-radius-pill, 9999px);
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-decoration: none !important;
  box-sizing: border-box;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.ksk-before-toc-cta__button:hover,
.ksk-before-toc-cta__button:focus {
  background: #f0e232;
  border-color: #247a5a;
  color: #2ea875 !important;
  text-decoration: none !important;
}

@media (max-width: 767px) {
  .ksk-before-toc-cta {
    margin: 24px 0;
  }

  .ksk-before-toc-cta__container {
    display: flex;
    flex-direction: column;
  }

  .ksk-before-toc-cta__image-col {
    order: 1;
    min-height: 0;
  }

  .ksk-before-toc-cta__bg {
    background: #f4faf6;
  }

  .ksk-before-toc-cta__content {
    order: 2;
    padding: 22px 20px 6px;
  }

  .ksk-before-toc-cta__title-main {
    color: #2ea875;
  }

  .ksk-before-toc-cta__title-sub {
    color: #333;
  }

  .ksk-before-toc-cta__info {
    border-top: 0;
  }

  .ksk-before-toc-cta__image {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
    object-position: center;
  }

  .ksk-before-toc-cta__title-main {
    font-size: 1.18rem;
    line-height: 1.55;
  }

  .ksk-before-toc-cta__title-sub,
  .ksk-before-toc-cta__lead {
    font-size: 0.94rem;
    line-height: 1.85;
  }

  .ksk-before-toc-cta__points li {
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 7px;
    font-size: 0.94rem;
    line-height: 1.42;
  }

  .ksk-before-toc-cta__points .material-icons-round {
    font-size: 19px;
  }

  .ksk-before-toc-cta__info {
    padding: 22px 20px 24px;
  }

  .ksk-before-toc-cta__button {
    width: 100%;
    min-height: 54px;
    padding: 13px 18px;
  }
}

@media (max-width: 520px) {
  .ksk-before-toc-cta__title-main {
    font-size: 1.08rem;
  }

  .ksk-before-toc-cta__content,
  .ksk-before-toc-cta__info {
    padding-left: 18px;
    padding-right: 18px;
  }
}

/* 目次前 監修者ボックス */
.ksk-supervisor-box {
  padding: 20px 24px;
  background: #fff;
  border: 1px solid #c7d9cd;
  border-radius: 8px;
  margin-bottom: 24px;
}

.ksk-supervisor-box__label {
  font-size: 11px;
  font-weight: 600;
  color: #3dc18a;
  margin: 0 0 8px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ksk-supervisor-box__inner {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.ksk-supervisor-box__avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  object-position: top center;
  flex-shrink: 0;
}

.ksk-supervisor-box__body {
  flex: 1;
  min-width: 0;
}

.ksk-supervisor-box__name {
  font-size: 1.2em;
  font-weight: 700;
  margin: 0 0 6px;
  line-height: 1.4;
  color: #1a1a1a;
}

.ksk-supervisor-box__job {
  display: inline-block;
  font-size: 12px;
  color: #333;
  background: #f5f5f5;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 2px 10px;
  margin-bottom: 10px;
}

.ksk-supervisor-box__bio {
  font-size: 13px;
  line-height: 1.8;
  color: #444;
  margin: 0;
}

/* ボタン（SANGOテーマ .btn.raised.accent-bc.strong 準拠） */
.feature-box-button,
.ksk-feature-button {
  display: block;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 0;
  padding: 1rem 1.6rem;
  background-color: var(--button-main-color, var(--wp--preset--color--sango-accent));
  color: #fff !important;
  border: 0;
  border-bottom: solid 5px rgba(0, 0, 0, 0.27);
  border-radius: var(--ksk-top-radius-pill, 9999px);
  box-sizing: border-box;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  text-decoration: none !important;
  transition: opacity 0.1s ease, background-color 0.1s ease;
}

.feature-box-button:hover,
.feature-box-button:focus,
.ksk-feature-button:hover,
.ksk-feature-button:focus {
  background-color: var(--button-main-color_hover, var(--button-main-color, var(--wp--preset--color--sango-accent)));
  color: #fff !important;
  opacity: 0.85;
  text-decoration: none !important;
}

/* アウトラインボタン */
.ksk-feature-button-outline {
  display: block;
  width: 100%;
  text-align: center;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 0;
  padding: 1rem 1.6rem;
  background-color: transparent;
  color: var(--button-main-color, var(--wp--preset--color--sango-accent)) !important;
  font-weight: 700;
  text-decoration: none !important;
  border-radius: 4px;
  border: 2px solid var(--button-main-color, var(--wp--preset--color--sango-accent));
  border-bottom: solid 5px rgba(0, 0, 0, 0.15);
  transition: opacity 0.1s ease;
  box-sizing: border-box;
}

.ksk-feature-button-outline:hover,
.ksk-feature-button-outline:focus {
  opacity: 0.8;
  text-decoration: none !important;
}

/* CTAラッパー */
.feature-box-cta {
  text-align: center;
  margin: 12px 0;
}

/* CTAテキスト（.center_micro 準拠） */
.feature-box-cta-text {
  margin-bottom: 0px !important;
  text-align: center !important;
  color: var(--button-main-color);
  font-weight: bold;
}

/* マイクロコピー */
.ksk-feature-microcopy {
  text-align: center;
  font-size: 12px;
  margin-top: 8px;
  color: #666;
}

/* ============================================================
   ブランドカラーパレット（緑＋黄色テーマ）
   primary: #2ea875 / accent yellow: #fff836 / text: #333
============================================================ */

/* マーカーハイライト（重要キーワードに黄色の蛍光ペン風背景） */
.ksk-marker {
  background: linear-gradient(transparent 60%, #fff836 60%);
  padding: 0 0.12em;
}

.ksk-marker--solid {
  background: #fff836;
  padding: 0.05em 0.3em;
  color: #333;
}

/* 全ボタン共通：角丸r最大（pill型） */
.ksk-header__btn,
.ksk-footer__btn,
.ksk-top-fv__btn,
.ksk-top-side-cv__btn,
.ksk-top-final__btn,
.ksk-top-sticky-cta,
.ksk-top-more__link,
.ksk-header-band__link,
.wpcf7-submit {
  border-radius: var(--ksk-top-radius-pill, 9999px) !important;
}

/* 重要CTA：黄色背景+深緑文字でオーバーライド（最終CTA・追従CTA・サイドCV） */
.ksk-top-final__btn,
.ksk-top-sticky-cta,
.ksk-top-side-cv__btn {
  background: var(--ksk-top-c-cta-yellow) !important;
  color: var(--ksk-top-c-cta-text) !important;
  border: 1px solid var(--ksk-top-c-primary) !important;
}

.ksk-top-final__btn:hover,
.ksk-top-sticky-cta:hover,
.ksk-top-side-cv__btn:hover {
  background: var(--ksk-top-c-cta-yellow-hover) !important;
  color: var(--ksk-top-c-cta-text) !important;
  border-color: var(--ksk-top-c-primary-dark) !important;
}

/* ============================================================
   トップページテンプレート (page-ksk-top.php)
   ベース: kyushu-seimitsukiki-media-top-clean-v14.html
============================================================ */

.ksk-top {
  --ksk-top-c-primary: #2ea875;
  --ksk-top-c-primary-dark: #247a5a;
  --ksk-top-c-primary-light: #3dc18a;
  --ksk-top-c-accent: #2ea875;
  --ksk-top-c-accent-dark: #247a5a;
  --ksk-top-c-text: #333;
  --ksk-top-c-muted: #666;
  --ksk-top-c-line: #d4d4d4;
  --ksk-top-c-line-strong: #9e9e9e;
  --ksk-top-c-bg-soft: #ffffff;
  --ksk-top-c-bg-alt: #ffffff;
  --ksk-top-c-box: #ffffff;
  --ksk-top-radius-sm: 6px;
  --ksk-top-radius-md: 12px;
  --ksk-top-radius-lg: 16px;
  --ksk-top-radius-pill: 9999px;
  --ksk-top-c-cta-yellow: #fff45a;
  --ksk-top-c-cta-yellow-hover: #f0e232;
  --ksk-top-c-cta-text: #1f6f51;

  /* 文字サイズ：調和数列ベース (N=8, 基準=1.125rem=18px / 全体を12.5%拡大)
     L4=4rem(64px・H1強調用にスケール外で拡大) / L3=1.8rem(28.8) / L2=1.5rem(24) / L1=1.286rem(20.6)
     M=1.125rem(18) / S1=1rem(16) / S2=0.9rem(14.4) / S3=0.818rem(13.1) / S4=0.75rem(12) */
  --fs-l4: 4rem;
  --fs-l3: 1.8rem;
  --fs-l2: 1.5rem;
  --fs-l1: 1.2857rem;
  --fs-m:  1.125rem;
  --fs-s1: 1rem;
  --fs-s2: 0.9rem;
  --fs-s3: 0.8182rem;
  --fs-s4: 0.75rem;

  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
  color: var(--ksk-top-c-text);
  line-height: 1.7;
  font-size: var(--fs-s1);
}

.ksk-top a { transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease; }
.ksk-top img { max-width: 100%; height: auto; display: block; }

/* ===== FV (First View) — 左:テキスト+ロゴ背景 / 右:写真カルーセル / 下:強み3項目 ===== */
.ksk-top-fv {
  position: relative;
  background-image:
    linear-gradient(rgba(46, 168, 117, 0.95), rgba(46, 168, 117, 0.95)),
    url("images/ksk-fv-bg.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-bottom: 1px solid var(--ksk-top-c-line-strong);
  padding: 32px 0;
}

/* 緑背景に乗るFVテキストは白に */
.ksk-top-fv__kicker,
.ksk-top-fv__title,
.ksk-top-fv__lead,
.ksk-top-fv__strengths-eyebrow,
.ksk-top-fv__strengths-title {
  color: #ffffff !important;
}

.ksk-top-fv__inner {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 32px;
}

/* === 上段：2カラム === */
.ksk-top-fv__row-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
}

/* --- 左：テキスト + ロゴ背景 --- */
.ksk-top-fv__left {
  min-height: 280px;
  padding: 24px 0;
  overflow: hidden;
}

.ksk-top-fv__logo-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 0;
}

.ksk-top-fv__logo-mark-wrap {
  width: min(40vw, 480px);
  height: min(40vw, 480px);
  display: grid;
  place-items: center;
  transform: rotate(-6deg);
  opacity: 0.18;
}

.ksk-top-fv__logo-mark {
  width: 100%;
  height: auto;
  overflow: visible;
}

/* SVG3片の着地アニメーション */
.ksk-top-fv__logo-piece {
  transform-box: fill-box;
  transform-origin: center;
  opacity: 0;
  animation: ksk-top-fv-piece-in 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* SVG fill を CSS 側で固定（3片すべて白で統一） */
.ksk-top-fv__logo-mark .ksk-top-fv__logo-piece { fill: #ffffff; }

.ksk-top-fv__logo-piece--blue {
  animation-delay: 0.1s;
  transform: translate(-1.6px, 1.2px) rotate(-12deg) scale(0.78);
}

.ksk-top-fv__logo-piece--yellow {
  animation-delay: 0.32s;
  transform: translate(1.4px, -1.4px) rotate(14deg) scale(0.78);
}

.ksk-top-fv__logo-piece--green {
  animation-delay: 0.54s;
  transform: translate(1.2px, 1.8px) rotate(10deg) scale(0.78);
}

@keyframes ksk-top-fv-piece-in {
  0%   { opacity: 0; }
  65%  { opacity: 1; transform: translate(0, 0) rotate(0deg) scale(1.08); }
  100% { opacity: 1; transform: translate(0, 0) rotate(0deg) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .ksk-top-fv__logo-piece {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

/* テキスト本体（ロゴ背景より前面） */
.ksk-top-fv__copy {
  position: relative;
  z-index: 1;
}

.ksk-top-fv__kicker {
  font-size: var(--fs-s2);
  letter-spacing: 0.08em;
  color: var(--ksk-top-c-muted);
  margin: 0 0 12px;
}

.ksk-top-fv__title {
  font-size: var(--fs-l4);
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: -0.02em;
  margin: 0;
  color: #2ea875;
}

.ksk-top-fv__lead {
  margin: 18px 0 0;
  font-size: var(--fs-m);
  line-height: 1.85;
  color: #333;
}


.ksk-top-fv__lead-br {
  display: inline;
}

@media (max-width: 1180px) {
  .ksk-top-fv__lead-br { display: none; }
}

.ksk-top-fv__buttons {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 22px;
  flex-wrap: wrap;
}

.ksk-top-fv__btn {
  min-height: 64px;
  padding: 0 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: var(--fs-m);
  letter-spacing: 0.04em;
  font-weight: 700;
  transition: all 0.25s ease;
}

.ksk-top-fv__btn--primary {
  background: var(--ksk-top-c-cta-yellow);
  color: var(--ksk-top-c-cta-text);
  border: 1px solid var(--ksk-top-c-primary);
}

.ksk-top-fv__btn--primary:hover {
  background: var(--ksk-top-c-cta-yellow-hover);
  border-color: var(--ksk-top-c-primary-dark);
  color: var(--ksk-top-c-cta-text);
  box-shadow: 0 8px 20px rgba(46, 168, 117, 0.25);
}

.ksk-top-fv__btn--line {
  border: 1px solid #333;
  color: #222;
  background: rgba(255, 255, 255, 0.4);
}

.ksk-top-fv__btn--line:hover {
  background: rgba(255, 255, 255, 0.85);
  color: #fff;
  border-color: var(--ksk-top-c-primary);
}

/* --- 右：写真カルーセル（4枚自動切替） --- */
.ksk-top-fv__right {
  display: flex;
  align-items: stretch;
}

.ksk-top-fv__carousel {
  position: relative;
  width: 100%;
  aspect-ratio: 1950 / 1176;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: var(--ksk-top-radius-md);
}

.ksk-top-fv__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  overflow: hidden;
  border-radius: var(--ksk-top-radius-md);
  transition: opacity 0.8s ease;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.16);
}

.ksk-top-fv__slide::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.36) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0.52) 100%);
  z-index: 1;
}

.ksk-top-fv__slide.is-active {
  opacity: 1;
}

.ksk-top-fv__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 参考UIに合わせた右下テキスト */
.ksk-top-fv__slide-copy {
  position: absolute;
  right: 24px;
  bottom: 26px;
  z-index: 2;
  max-width: min(560px, 82%);
  color: #fff;
  text-align: right;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.38);
}

.ksk-top-fv__slide-label {
  display: block;
  margin: 0 0 8px;
  color: rgba(255, 255, 255, 0.86);
  background: transparent;
  border-radius: 0;
  padding: 0;
  font-size: var(--fs-s4);
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1.4;
}

.ksk-top-fv__slide-title {
  margin: 0 0 8px;
  color: #fff;
  font-size: var(--fs-m);
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
}

.ksk-top-fv__slide-desc {
  margin: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: var(--fs-s3);
  line-height: 1.55;
  text-align: right;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ドットページネーション（画像下中央） */
.ksk-top-fv__dots {
  position: absolute;
  left: 50%;
  bottom: -34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  z-index: 3;
  transform: translateX(-50%);
  width: max-content;
}

.ksk-top-fv__dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 50%;
  border: 0;
  background: #d8d8d8;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.15s ease;
  box-shadow: none;
}

.ksk-top-fv__dot:hover {
  background: #9f9f9f;
}

.ksk-top-fv__dot.is-active {
  background: #222;
  transform: scale(1.05);
}

.ksk-top-fv__dot:focus-visible,
.ksk-top-fv__play:focus-visible {
  outline: 2px solid #fff836;
  outline-offset: 3px;
}

.ksk-top-fv__play {
  width: 22px;
  height: 22px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8d8d8;
  border-radius: 50%;
  background: #fff;
  color: #111;
  line-height: 1;
  cursor: pointer;
}

.ksk-top-fv__play .material-icons-round {
  font-size: 15px;
  line-height: 1;
}

.ksk-top-fv__play:hover {
  border-color: #d8d8d8;
  color: var(--ksk-top-c-primary);
}

@media (max-width: 767px) {
  .ksk-top-fv__carousel { aspect-ratio: 4 / 5; margin-bottom: 38px; }
  .ksk-top-fv__slide-copy {
    left: 16px;
    right: 16px;
    bottom: 18px;
    max-width: none;
    text-align: left;
  }
  .ksk-top-fv__slide-title { font-size: var(--fs-s1); white-space: normal; }
  .ksk-top-fv__slide-desc {
    font-size: var(--fs-s3);
    -webkit-line-clamp: 4;
  }
  .ksk-top-fv__dots { bottom: -30px; gap: 10px; }
}

/* === CTAブロック（見出し＋強み＋ボタンの半透明囲み・左揃え） === */
.ksk-top-fv__cta-block {
  background: rgba(255, 255, 255, 0.2);
  border-radius: var(--ksk-top-radius-sm);
  padding: 22px 20px;
  margin: 20px 0 0;
  max-width: 400px;
}

/* === 強み見出し（コピー内に配置） === */
.ksk-top-fv__strengths-head {
  margin: 0 0 12px;
  text-align: center;
}

.ksk-top-fv__strengths-eyebrow {
  display: inline-block;
  font-size: var(--fs-s3);
  letter-spacing: 0.18em;
  color: var(--ksk-top-c-primary);
  font-weight: 700;
}

.ksk-top-fv__strengths-title {
  font-size: var(--fs-l1);
  color: var(--ksk-top-c-primary);
  margin: 4px 0 0;
  font-weight: 700;
  line-height: 1.4;
  position: relative;
  display: inline-block;
}

/* === 強み3項目（装飾なし・チェックマークリスト：全体は中央、各項目は左揃え） === */
.ksk-top-fv__strengths {
  list-style: none;
  width: fit-content;
  margin: 0 auto 24px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ksk-top-fv__strength {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
}

.ksk-top-fv__strength-check {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ksk-top-c-primary);
}

.ksk-top-fv__strength-title {
  font-size: var(--fs-s1);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.5;
}

.ksk-top-fv__strength-icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
  background: #f3f3f3;
}

.ksk-top-fv__strength-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 各スロットで写真の見える部分を変えて視覚バリエーション（同じ画像で別の領域を表示） */
.ksk-top-fv__strength-icon--cost img     { object-position: 15% center; }
.ksk-top-fv__strength-icon--material img { object-position: 50% center; }
.ksk-top-fv__strength-icon--tech img     { object-position: 85% center; }

.ksk-top-fv__strength-body {
  min-width: 0;
}

.ksk-top-fv__strength-body h3 {
  margin: 0 0 6px;
  font-size: var(--fs-s1);
  color: var(--ksk-top-c-primary);
  font-weight: 700;
  line-height: 1.45;
}

.ksk-top-fv__strength-body p {
  margin: 0;
  font-size: var(--fs-s2);
  line-height: 1.7;
  color: var(--ksk-top-c-text);
}

/* ===== セクション共通 ===== */
.ksk-top-sec {
  margin: 56px auto 0;
  max-width: 1600px;
  padding: 0 24px;
}

.ksk-top-sec-head {
  margin: 0 0 22px;
}

.ksk-top-sec-head__lab {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-accent);
  font-weight: 700;
  letter-spacing: 0.18em;
  margin: 0;
}

.ksk-top-sec-head__title {
  font-size: var(--fs-l3);
  color: var(--ksk-top-c-primary);
  margin: 4px 0 0;
  font-weight: 700;
  line-height: 1.4;
}

.ksk-top-sec-head__sub {
  font-size: var(--fs-s1);
  color: var(--ksk-top-c-muted);
  margin: 8px 0 0;
}

.ksk-top-empty {
  grid-column: 1 / -1;
  text-align: center;
  color: var(--ksk-top-c-muted);
  padding: 40px 16px;
  font-size: var(--fs-s1);
  margin: 0;
}

/* ===== 新着記事＋サイドCTA ===== */
.ksk-top-news-wrap {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 32px;
}

/* === 新着記事：混合グリッド（1 Big + 2 Mid + 3 Sm 均等） === */
.ksk-top-magazine {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr auto;
  grid-template-areas:
    "big big mid1"
    "big big mid2"
    "sm1 sm2 sm3";
  gap: 20px;
}

/* 位置割り当て（投稿順で自動配置） */
.ksk-top-mag-card:nth-child(1) { grid-area: big; }
.ksk-top-mag-card:nth-child(2) { grid-area: mid1; }
.ksk-top-mag-card:nth-child(3) { grid-area: mid2; }
.ksk-top-mag-card:nth-child(4) { grid-area: sm1; }
.ksk-top-mag-card:nth-child(5) { grid-area: sm2; }
.ksk-top-mag-card:nth-child(6) { grid-area: sm3; }

/* === 共通カード（背景なし・サムネのみ角丸） === */
.ksk-top-mag-card {
  background: transparent;
  display: flex;
  flex-direction: column;
}

.ksk-top-mag-card__link {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ksk-top-mag-card__thumb {
  position: relative;
  background: var(--ksk-top-c-box);
  overflow: hidden;
  aspect-ratio: 16 / 10;
  border-radius: var(--ksk-top-radius-md);
}

.ksk-top-mag-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.ksk-top-mag-card:hover .ksk-top-mag-card__thumb img {
  transform: scale(1.04);
}

.ksk-top-mag-card__cat {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(46, 168, 117, 0.7);
  border: none;
  border-radius: var(--ksk-top-radius-sm);
  font-size: var(--fs-s3);
  padding: 3px 10px;
  color: #ffffff;
  font-weight: 600;
  z-index: 1;
}

.ksk-top-mag-card__body {
  padding: 12px 0 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}

.ksk-top-mag-card__meta {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-muted);
  margin: 0;
}

.ksk-top-mag-card__title {
  margin: 0;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ksk-top-c-text);
}

.ksk-top-mag-card__link:hover .ksk-top-mag-card__title {
  color: var(--ksk-top-c-primary);
}

/* === サイズ別タイトル === */
/* Big は2行分の高さを占めるので、サムネはグリッドが決めた残スペースを埋める */
.ksk-top-mag-card--big .ksk-top-mag-card__link {
  height: 100%;
}

.ksk-top-mag-card--big .ksk-top-mag-card__thumb {
  aspect-ratio: auto;
  flex: 1 1 0;
  min-height: 0;
}

.ksk-top-mag-card--big .ksk-top-mag-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ksk-top-mag-card--big .ksk-top-mag-card__body {
  padding: 14px 0 0;
  flex: none;
}

.ksk-top-mag-card--big .ksk-top-mag-card__title {
  font-size: var(--fs-l1);
}

.ksk-top-mag-card--mid .ksk-top-mag-card__title {
  font-size: var(--fs-m);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ksk-top-mag-card--sm .ksk-top-mag-card__body {
  padding: 10px 0 0;
}

.ksk-top-mag-card--sm .ksk-top-mag-card__title {
  font-size: var(--fs-s1);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* レスポンシブ */
@media (max-width: 900px) {
  .ksk-top-magazine {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-template-areas:
      "big big"
      "mid1 mid2"
      "sm1 sm2"
      "sm3 sm3";
  }
}

@media (max-width: 600px) {
  .ksk-top-magazine {
    grid-template-columns: 1fr;
    grid-template-areas:
      "big"
      "mid1"
      "mid2"
      "sm1"
      "sm2"
      "sm3";
  }
}

/* Featured */
/* 新着記事セクション専用：背景クリーム色 */
.ksk-top-sec.ksk-top-news-section {
  background: #F3F1EF;
  max-width: none;
  padding: 56px 0;
  margin-top: 0;
}

.ksk-top-news-section .ksk-top-news-wrap,
.ksk-top-news-section .ksk-top-sec-head {
  width: 100%;
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 32px;
  box-sizing: border-box;
}

/* 個別記事カード（共通：白・角丸8px） */
.ksk-top-feature {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: var(--ksk-top-radius-md);
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* カード内の本文：内側に padding */
.ksk-top-feature__meta,
.ksk-top-feature__title {
  padding-left: 20px;
  padding-right: 20px;
}

.ksk-top-feature__title {
  padding-bottom: 20px;
}

.ksk-top-feature__ribbon {
  display: inline-block;
  background: var(--ksk-top-c-accent);
  color: #fff;
  font-size: var(--fs-s3);
  padding: 4px 14px;
  letter-spacing: 0.12em;
  font-weight: 700;
  align-self: flex-start;
  margin-bottom: 12px;
}

.ksk-top-feature__link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.ksk-top-feature__thumb {
  background: var(--ksk-top-c-box);
  aspect-ratio: 16 / 10;
  position: relative;
  overflow: hidden;
}

.ksk-top-feature__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ksk-top-feature__cat {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #fff;
  border: 1px solid var(--ksk-top-c-line);
  font-size: var(--fs-s3);
  padding: 3px 12px;
  color: var(--ksk-top-c-primary);
  font-weight: 600;
}

.ksk-top-feature__meta {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-muted);
  margin: 14px 0 6px;
}

.ksk-top-feature__title {
  font-size: var(--fs-l1);
  margin: 0 0 8px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ksk-top-c-text);
}

.ksk-top-feature__link:hover .ksk-top-feature__title {
  color: var(--ksk-top-c-primary);
}

.ksk-top-feature__lead {
  font-size: var(--fs-s2);
  color: var(--ksk-top-c-muted);
  line-height: 1.85;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Article list（白カード化） */
.ksk-top-articles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-top: none;
}

.ksk-top-article {
  border-bottom: none;
  background: #ffffff;
  border-radius: var(--ksk-top-radius-md);
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.ksk-top-article__link {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 14px;
  padding: 10px 14px 10px 10px;
  text-decoration: none;
  color: inherit;
  align-items: center;
}

.ksk-top-article__link:hover .ksk-top-article__title {
  color: var(--ksk-top-c-primary);
}

.ksk-top-article__thumb {
  background: var(--ksk-top-c-box);
  width: 110px;
  aspect-ratio: 16 / 10;
  height: auto;
  border-radius: var(--ksk-top-radius-sm);
  border: 1px solid var(--ksk-top-c-line);
  overflow: hidden;
  flex-shrink: 0;
}

.ksk-top-article__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ksk-top-article__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}

.ksk-top-article__meta {
  font-size: var(--fs-s4);
  color: var(--ksk-top-c-muted);
  margin: 0 0 4px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.ksk-top-article__cat {
  background: #fff;
  border: 1px solid var(--ksk-top-c-line);
  padding: 1px 6px;
  font-size: var(--fs-s4);
  color: var(--ksk-top-c-primary);
  font-weight: 600;
}

.ksk-top-article__title {
  font-size: var(--fs-s2);
  font-weight: 700;
  line-height: 1.55;
  color: var(--ksk-top-c-text);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* More link */
.ksk-top-more {
  text-align: center;
  margin: 28px 0 0;
}

.ksk-top-more__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 320px;
  min-height: 64px;
  background: #fff;
  border: 1px solid var(--ksk-top-c-primary);
  color: var(--ksk-top-c-primary);
  padding: 18px 56px;
  font-size: var(--fs-m);
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.ksk-top-more__link:hover {
  background: var(--ksk-top-c-primary);
  color: #fff;
}

/* Side */
.ksk-top-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ksk-top-side-cv {
  background-image:
    linear-gradient(rgba(46, 168, 117, 0.9), rgba(46, 168, 117, 0.9)),
    url("images/ksk-fv-bg.webp");
  background-size: cover;
  background-position: center;
  border: none;
  border-radius: var(--ksk-top-radius-md);
  padding: 24px 20px;
  text-align: center;
  overflow: hidden;
}

.ksk-top-side-cv__title {
  display: block;
  font-size: var(--fs-s1);
  margin-bottom: 8px;
  line-height: 1.6;
  color: #fff;
  font-weight: 700;
}

.ksk-top-side-cv__text {
  font-size: var(--fs-s3);
  margin: 0 0 14px;
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.7;
}

.ksk-top-side-cv__btn {
  display: block;
  background: var(--ksk-top-c-cta-yellow);
  color: var(--ksk-top-c-cta-text);
  border: none !important;
  padding: 13px;
  font-size: var(--fs-s1);
  font-weight: 700;
  text-decoration: none;
}

.ksk-top-side-cv__btn:hover {
  background: var(--ksk-top-c-cta-yellow-hover);
  border-color: transparent;
  color: var(--ksk-top-c-cta-text);
}

.ksk-top-side-cat {
  background: var(--ksk-top-c-bg-soft);
  border: 1px solid var(--ksk-top-c-line);
  border-radius: var(--ksk-top-radius-md);
  padding: 16px;
}

.ksk-top-side-cat__lab {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-muted);
  font-weight: 700;
  margin: 0 0 8px;
  letter-spacing: 0.05em;
}

.ksk-top-side-cat__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ksk-top-side-cat__list li {
  border-bottom: 1px dashed var(--ksk-top-c-line);
}

.ksk-top-side-cat__list li:last-child {
  border-bottom: none;
}

.ksk-top-side-cat__list a {
  display: block;
  padding: 8px 0 8px 16px;
  color: var(--ksk-top-c-text);
  text-decoration: none;
  font-size: var(--fs-s2);
  position: relative;
}

.ksk-top-side-cat__list a::before {
  content: "›";
  position: absolute;
  left: 0;
  color: var(--ksk-top-c-primary);
  font-weight: 700;
}

.ksk-top-side-cat__list a:hover {
  color: var(--ksk-top-c-primary);
}

/* ===== MIMについて ===== */
/* セクション全幅：工場写真＋緑オーバーレイ（FVと同じ背景） */
.ksk-top-about-mim {
  margin: 0;
  max-width: none;
  background-image:
    linear-gradient(rgba(46, 168, 117, 0.92), rgba(46, 168, 117, 0.92)),
    url("images/ksk-about-mim-bg.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: none;
  padding: 72px 24px;
}

/* 内側の白カード：強みセクションと幅を統一 */
.ksk-top-about-mim__inner {
  display: block;
  background: #ffffff;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  padding: 56px;
  box-sizing: border-box;
  border-radius: var(--ksk-top-radius-lg);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.14);
}

.ksk-top-about-mim__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 410px);
  gap: 32px;
  align-items: start;
}

.ksk-top-about-mim__intro {
  min-width: 0;
}

.ksk-top-about-mim__visual {
  margin-top: 42px;
  background: #f2faf6;
  border: 1px solid rgba(46, 168, 117, 0.12);
  border-radius: var(--ksk-top-radius-md);
  padding: 34px;
  overflow: hidden;
}

.ksk-top-about-mim__visual img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  padding: 10px;
  box-sizing: border-box;
  display: block;
}

.ksk-top-about-mim__lab {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-accent);
  font-weight: 700;
  letter-spacing: 0.18em;
  margin: 0 0 10px;
}

.ksk-top-about-mim__title {
  font-size: var(--fs-l3);
  margin: 0 0 18px;
  line-height: 1.45;
  color: var(--ksk-top-c-primary);
  font-weight: 700;
}

.ksk-top-about-mim__lead {
  margin: 0;
  font-size: var(--fs-s1);
  color: var(--ksk-top-c-text);
  line-height: 1.95;
}

.ksk-top-about-mim__lead + .ksk-top-about-mim__lead {
  margin-top: 12px;
}

.ksk-top-about-mim__lead strong {
  color: var(--ksk-top-c-text);
  font-weight: 700;
}

.ksk-top-about-mim__lead .ksk-top-em-green {
  color: var(--ksk-top-c-primary);
}

.ksk-top-about-mim__features {
  width: 100%;
  max-width: 410px;
  justify-self: end;
  margin: 100px 0 0;
  padding: 0;
  border-top: 1px solid rgba(46, 168, 117, 0.22);
}

.ksk-top-about-mim__features ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ksk-top-about-mim__features li {
  position: relative;
  padding: 10px 0 10px 28px;
  margin: 0;
  border-bottom: 1px solid rgba(46, 168, 117, 0.16);
}

.ksk-top-about-mim__features li:last-child {
  border-bottom: 1px solid rgba(46, 168, 117, 0.16);
}

.ksk-top-about-mim__features li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: var(--ksk-top-c-primary);
}

.ksk-top-about-mim__features li::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 19px;
  width: 6px;
  height: 3px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
}

.ksk-top-about-mim__features strong {
  display: block;
  color: var(--ksk-top-c-primary);
  font-size: var(--fs-s2);
  line-height: 1.45;
  margin: 0 0 2px;
}

.ksk-top-about-mim__features span {
  display: block;
  color: var(--ksk-top-c-text);
  font-size: var(--fs-s3);
  line-height: 1.75;
}

/* ===== MIM プロセスフロー：タイムライン ===== */
.ksk-mim-flow {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px 20px;
  padding-top: 0;
  border-top: none;
}

.ksk-mim-flow__caption {
  grid-column: 1 / -1;
  position: static;
  transform: none;
  margin: 0 0 2px;
  color: var(--ksk-top-c-primary);
  font-size: var(--fs-s2);
  font-weight: 700;
  letter-spacing: 0.08em;
}

.ksk-mim-flow__step {
  position: relative;
  display: block;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  min-height: 0;
}

.ksk-mim-flow__step::before {
  content: "";
  position: absolute;
  display: none;
}

.ksk-mim-flow__step:not(:last-of-type)::after {
  display: none;
}

.ksk-mim-flow__step--final::before {
  display: none;
}

.ksk-mim-flow__num {
  color: var(--ksk-top-c-primary);
  font-size: var(--fs-s4);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  font-family: inherit;
  margin: 0 0 10px;
}

.ksk-mim-flow__image {
  width: 100%;
  aspect-ratio: 16 / 9;
  max-width: none;
  margin: 0 0 14px;
  background: #ffffff;
  border: 1px solid rgba(46, 168, 117, 0.12);
  border-radius: var(--ksk-top-radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ksk-mim-flow__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.ksk-mim-flow__step--07 .ksk-mim-flow__image img {
  transform: scale(1.22);
}

.ksk-mim-flow__image--text {
  background: #ffffff;
  color: var(--ksk-top-c-primary);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-align: center;
}

.ksk-mim-flow__image--text span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 112px;
  min-height: 48px;
  padding: 8px 14px;
  background: var(--ksk-top-c-cta-yellow);
  border-radius: var(--ksk-top-radius-sm);
  font-size: var(--fs-s3);
  line-height: 1.35;
}

.ksk-mim-flow__name {
  font-size: var(--fs-s1);
  font-weight: 700;
  color: var(--ksk-top-c-primary);
  margin: 0 0 8px;
  line-height: 1.45;
  min-height: 1.45em;
}

.ksk-mim-flow__sub {
  margin: -4px 0 8px;
  font-size: var(--fs-s4);
  line-height: 1.5;
  color: var(--ksk-top-c-primary);
  font-weight: 700;
}

.ksk-mim-flow__desc {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-text);
  line-height: 1.75;
  margin: 0;
}

.ksk-mim-flow__arrow {
  display: none;
}

@media (max-width: 1100px) {
  .ksk-top-about-mim__inner { padding: 40px; }
  .ksk-top-about-mim__body { grid-template-columns: 1fr; gap: 24px; }
  .ksk-top-about-mim__features { max-width: none; justify-self: stretch; margin-top: 0; }
  .ksk-top-about-mim__visual { padding: 26px; }
  .ksk-mim-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 18px;
  }
  .ksk-mim-flow__step::before,
  .ksk-mim-flow__step:not(:last-of-type)::after { display: none; }
}

@media (max-width: 600px) {
  .ksk-top-about-mim { padding: 40px 16px; }
  .ksk-top-about-mim__inner { padding: 28px 22px; gap: 24px; }
  .ksk-top-about-mim__title { font-size: var(--fs-l1); }
  .ksk-top-about-mim__lead { font-size: var(--fs-s1); }
  .ksk-top-pc-br { display: none; }
  .ksk-top-about-mim__visual { padding: 20px; }
  .ksk-mim-flow { grid-template-columns: 1fr; }
}

/* ===== 人気記事 ===== */
.ksk-top-sec.ksk-top-rank-section {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 56px 24px;
  background: #F3F1EF;
}

.ksk-top-rank-section > .ksk-top-sec-head,
.ksk-top-rank-section > .ksk-top-rank-board,
.ksk-top-rank-section > .ksk-top-more,
.ksk-top-rank-section > .ksk-top-empty {
  width: 100%;
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 32px;
  padding-right: 32px;
  box-sizing: border-box;
}

.ksk-top-rank-board {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) repeat(2, minmax(230px, 0.82fr));
  grid-template-rows: repeat(2, minmax(240px, 1fr));
  gap: 18px;
  align-items: stretch;
}

.ksk-top-rank-card {
  min-width: 0;
}

.ksk-top-rank-card--1 { grid-column: 1; grid-row: 1 / span 2; }
.ksk-top-rank-card--2 { grid-column: 2; grid-row: 1; }
.ksk-top-rank-card--3 { grid-column: 3; grid-row: 1; }
.ksk-top-rank-card--4 { grid-column: 2; grid-row: 2; }
.ksk-top-rank-card--5 { grid-column: 3; grid-row: 2; }
.ksk-top-rank-card--6,
.ksk-top-rank-card--7,
.ksk-top-rank-card--8 { display: none !important; }

.ksk-top-rank-card__link {
  position: relative;
  display: block;
  height: 100%;
  min-height: 240px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  background: #fff;
  border: 1px solid rgba(46, 168, 117, 0.16);
  border-radius: var(--ksk-top-radius-md);
  box-shadow: 0 10px 28px rgba(32, 33, 31, 0.06);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.ksk-top-rank-card__link:hover {
  border-color: rgba(46, 168, 117, 0.34);
  box-shadow: 0 14px 34px rgba(32, 33, 31, 0.09);
}

.ksk-top-rank-card--1 .ksk-top-rank-card__link {
  min-height: 500px;
}

.ksk-top-rank-card__thumb {
  position: relative;
  display: block;
  height: 100%;
  min-height: 240px;
  overflow: hidden;
  background: var(--ksk-top-c-box);
}

.ksk-top-rank-card--1 .ksk-top-rank-card__thumb {
  min-height: 500px;
}

.ksk-top-rank-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  transition: transform 0.35s ease;
}

.ksk-top-rank-card__link:hover .ksk-top-rank-card__thumb img {
  transform: scale(1.035);
}

.ksk-top-rank-card__thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.74) 100%);
}

.ksk-top-rank-card__body {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px;
  color: #fff;
}

.ksk-top-rank-card--1 .ksk-top-rank-card__body {
  padding: 28px 30px;
}

.ksk-top-rank-card__cat {
  width: fit-content;
  max-width: 100%;
  padding: 2px 8px;
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
  border-radius: var(--ksk-top-radius-sm);
  backdrop-filter: blur(6px);
  font-size: var(--fs-s4);
  font-weight: 700;
  line-height: 1.5;
}

.ksk-top-rank-card__title {
  display: -webkit-box;
  margin: 0;
  color: #fff;
  font-size: var(--fs-s1);
  font-weight: 700;
  line-height: 1.45;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ksk-top-rank-card--1 .ksk-top-rank-card__title {
  font-size: var(--fs-l2);
}

.ksk-top-rank-card__meta {
  margin-top: auto;
  color: rgba(255, 255, 255, 0.76);
  font-size: var(--fs-s4);
  line-height: 1.5;
}

.ksk-top-rank-card__no {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: #fff;
  font-family: inherit;
  font-size: var(--fs-s1);
  font-weight: 700;
  line-height: 1;
  border-radius: var(--ksk-top-radius-sm);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
}

.ksk-top-rank-card--1 .ksk-top-rank-card__no {
  top: 16px;
  left: 16px;
  width: 58px;
  height: 58px;
  font-size: var(--fs-l3);
}

.ksk-top-rank-card__no--1 {
  background: linear-gradient(135deg, #fff4a3 0%, #e0bd3a 44%, #b98a16 100%);
}

.ksk-top-rank-card__no--2 {
  background: linear-gradient(135deg, #f4f7f9 0%, #bec6cf 48%, #8e98a3 100%);
}

.ksk-top-rank-card__no--3 {
  background: linear-gradient(135deg, #f4bf7b 0%, #cd7f32 48%, #94501e 100%);
}

.ksk-top-rank-card__no--4,
.ksk-top-rank-card__no--5 {
  background: linear-gradient(135deg, #d8dde3 0%, #aab2bd 100%);
}

@media (max-width: 1100px) {
  .ksk-top-rank-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
  }

  .ksk-top-rank-card--1 {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .ksk-top-rank-card--2,
  .ksk-top-rank-card--3,
  .ksk-top-rank-card--4,
  .ksk-top-rank-card--5 {
    grid-column: auto;
    grid-row: auto;
  }

  .ksk-top-rank-card--1 .ksk-top-rank-card__link,
  .ksk-top-rank-card--1 .ksk-top-rank-card__thumb {
    min-height: 360px;
  }

  .ksk-top-rank-card__link,
  .ksk-top-rank-card__thumb {
    min-height: 220px;
  }
}

@media (max-width: 767px) {
  .ksk-top-rank-section > .ksk-top-sec-head,
  .ksk-top-rank-section > .ksk-top-rank-board,
  .ksk-top-rank-section > .ksk-top-more,
  .ksk-top-rank-section > .ksk-top-empty {
    padding-left: 18px;
    padding-right: 18px;
  }

  .ksk-top-rank-board {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .ksk-top-rank-card--1,
  .ksk-top-rank-card--2,
  .ksk-top-rank-card--3,
  .ksk-top-rank-card--4,
  .ksk-top-rank-card--5 {
    grid-column: auto;
    grid-row: auto;
  }

  .ksk-top-rank-card__link,
  .ksk-top-rank-card--1 .ksk-top-rank-card__link {
    display: grid;
    grid-template-columns: 42% minmax(0, 1fr);
    min-height: 128px;
    background: #fff;
    border: 1px solid rgba(46, 168, 117, 0.12);
  }

  .ksk-top-rank-card__thumb,
  .ksk-top-rank-card--1 .ksk-top-rank-card__thumb {
    height: 100%;
    min-height: 128px;
  }

  .ksk-top-rank-card__thumb::after {
    display: none;
  }

  .ksk-top-rank-card__body,
  .ksk-top-rank-card--1 .ksk-top-rank-card__body {
    position: static;
    justify-content: flex-start;
    padding: 12px 13px;
    color: var(--ksk-top-c-text);
    background: #fff;
  }

  .ksk-top-rank-card__cat {
    display: none;
  }

  .ksk-top-rank-card__title,
  .ksk-top-rank-card--1 .ksk-top-rank-card__title {
    color: var(--ksk-top-c-text);
    font-size: var(--fs-s1);
    line-height: 1.5;
  }

  .ksk-top-rank-card__meta,
  .ksk-top-rank-card--1 .ksk-top-rank-card__meta {
    color: var(--ksk-top-c-muted);
  }

  .ksk-top-rank-card__no,
  .ksk-top-rank-card--1 .ksk-top-rank-card__no {
    top: 10px;
    left: 10px;
    width: 34px;
    height: 34px;
    font-size: var(--fs-s1);
  }
}

/* ===== 当社の強み ===== */
.ksk-top-strength {
  margin: 56px auto 0;
  max-width: 1080px;
  background: transparent;
  border: none;
  padding: 0 24px;
}

.ksk-top-strength__banner {
  position: relative;
  margin: 0 0 28px;
  overflow: hidden;
  border-radius: var(--ksk-top-radius-md);
  min-height: 360px;
  background: #111;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
}

.ksk-top-strength-final__card .ksk-top-strength__banner {
  margin: -56px -56px 28px;
  border-radius: var(--ksk-top-radius-lg) var(--ksk-top-radius-lg) 0 0;
}

.ksk-top-strength__banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0.24) 42%, rgba(0, 0, 0, 0.04) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.28) 0%, rgba(0, 0, 0, 0.08) 100%);
  z-index: 1;
  pointer-events: none;
}

.ksk-top-strength__banner-title {
  position: absolute;
  left: 34px;
  top: 30px;
  z-index: 2;
  width: min(460px, calc(100% - 68px));
  color: #fff;
  padding: 0;
  display: flex;
  justify-content: flex-start;
  text-align: left;
}

.ksk-top-strength__banner-title h2 {
  margin: 0;
  font-size: var(--fs-l3);
  font-weight: 700;
  line-height: 1.45;
  color: #fff;
  letter-spacing: 0.04em;
  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.55);
}

.ksk-top-strength__banner-image {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #111;
}

.ksk-top-strength__banner-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.ksk-top-strength__sub {
  text-align: left;
  font-size: var(--fs-s1);
  color: var(--ksk-top-c-muted);
  margin: 0 0 32px;
}

.ksk-top-strength__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.ksk-top-strength__item {
  grid-column: span 2;
  padding: 22px 24px;
  border: 1px solid rgba(46, 168, 117, 0.18);
  border-radius: var(--ksk-top-radius-md);
  background: #f7fbf9;
}

/* .ksk-top-strength__item:nth-child(4),
.ksk-top-strength__item:nth-child(5) {
  grid-column: span 3;
} */

.ksk-top-strength__head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 12px;
}

.ksk-top-strength__num {
  min-width: 40px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ksk-top-radius-pill);
  background: var(--ksk-top-c-primary);
  color: #fff;
  font-size: var(--fs-s2);
  font-weight: 700;
  line-height: 1;
  font-family: inherit;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

.ksk-top-strength__name {
  font-size: var(--fs-s1);
  font-weight: 700;
  color: var(--ksk-top-c-primary);
  line-height: 1.55;
}

.ksk-top-strength__desc {
  margin: 0;
  font-size: var(--fs-s2);
  color: var(--ksk-top-c-text);
  line-height: 1.85;
}

.ksk-top-strength__note {
  font-size: var(--fs-s3);
  color: var(--ksk-top-c-muted);
  margin: 8px 0 0;
}

/* レスポンシブ */
@media (max-width: 767px) {
  .ksk-top-strength { padding: 0 16px; }
  .ksk-top-strength__banner { min-height: 300px; margin-bottom: 24px; }
  .ksk-top-strength-final__card .ksk-top-strength__banner { margin: -28px -22px 24px; }
  .ksk-top-strength__banner-title {
    left: 22px;
    top: 22px;
    width: min(300px, calc(100% - 44px));
  }
  .ksk-top-strength__banner-title h2 { font-size: var(--fs-l2); }
  .ksk-top-strength__list { grid-template-columns: 1fr; gap: 12px; }
  .ksk-top-strength__item,
  .ksk-top-strength__item:nth-child(4),
  .ksk-top-strength__item:nth-child(5) { grid-column: auto; padding: 18px; }
  .ksk-top-strength__head { gap: 10px; }
  .ksk-top-strength__num { min-width: 36px; height: 26px; font-size: var(--fs-s3); }
  .ksk-top-strength__name { font-size: var(--fs-s1); }

  .ksk-top-strength-final { padding: 36px 14px; }
  .ksk-top-strength-final__card { padding: 28px 22px; }
  .ksk-top-strength-final__card .ksk-top-strength { padding: 0; }
  .ksk-top-strength-final__card .ksk-top-final { margin: 32px -22px -28px; padding: 40px 20px; }
}

/* ===== 強み + 最終CTA ===== */
.ksk-top-strength-final {
  margin: 0;
  background:
    radial-gradient(circle at 18% 8%, rgba(255, 244, 90, 0.22) 0%, rgba(255, 244, 90, 0) 28%),
    radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 30%),
    linear-gradient(135deg, #1f8f66 0%, #2ea875 44%, #167553 100%);
  padding: 64px 24px;
}

.ksk-top-strength-final__card {
  max-width: 1080px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: var(--ksk-top-radius-lg);
  padding: 56px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
}

.ksk-top-strength-final__card .ksk-top-strength {
  margin: 0;
  max-width: none;
  padding: 0;
  background: transparent;
}

.ksk-top-strength-final__card .ksk-top-final {
  margin: 48px -56px -56px;
  background-image:
    linear-gradient(rgba(46, 168, 117, 0.9), rgba(46, 168, 117, 0.9)),
    url("images/ksk-fv-bg.webp");
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 54px 32px;
  border: none;
  border-radius: 0 0 var(--ksk-top-radius-lg) var(--ksk-top-radius-lg);
  overflow: hidden;
}

.ksk-top-strength-final__card .ksk-top-final__inner {
  max-width: 720px;
}

.ksk-top-strength-final__card .ksk-top-final__title {
  color: #fff;
}

.ksk-top-strength-final__card .ksk-top-final__lead {
  color: rgba(255, 255, 255, 0.94);
}

.ksk-top-strength-final__card .ksk-top-final__note {
  color: rgba(255, 255, 255, 0.78);
}

.ksk-top-strength-final__card .ksk-top-final__btn {
  border: none !important;
}

.ksk-top-final {
  margin: 56px 0 0;
  background: linear-gradient(135deg, var(--ksk-top-c-primary) 0%, var(--ksk-top-c-primary-light) 100%);
  color: #fff;
  padding: 56px 24px;
  text-align: center;
}

.ksk-top-final__inner {
  max-width: 1600px;
  margin: 0 auto;
}

.ksk-top-final__title {
  margin: 0 0 24px;
  font-size: var(--fs-l3);
  line-height: 1.5;
  color: #fff;
  font-weight: 700;
}

.ksk-top-final__pains {
  list-style: none;
  margin: 0 auto 28px;
  padding: 24px 28px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.25);
  text-align: left;
  max-width: 640px;
}

.ksk-top-final__pains li {
  font-size: var(--fs-s1);
  line-height: 1.95;
  color: #fff;
  padding-left: 24px;
  position: relative;
  margin: 0;
}

.ksk-top-final__pains li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 13px;
  width: 14px;
  height: 1px;
  background: #fff;
}

.ksk-top-final__lead {
  margin: 0 auto 28px;
  max-width: 640px;
  font-size: var(--fs-s1);
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.95;
}

.ksk-top-final__btn {
  display: inline-block;
  background: var(--ksk-top-c-accent);
  color: #fff;
  padding: 18px 56px;
  font-size: var(--fs-m);
  font-weight: 700;
  border: 1px solid var(--ksk-top-c-accent);
  text-decoration: none;
  min-width: 320px;
  letter-spacing: 0.04em;
}

.ksk-top-final__btn:hover {
  background: var(--ksk-top-c-accent-dark);
  border-color: var(--ksk-top-c-accent-dark);
  color: #fff;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}

.ksk-top-final__note {
  font-size: var(--fs-s3);
  color: rgba(255, 255, 255, 0.7);
  margin: 18px 0 0;
  line-height: 1.7;
}

/* ===== 任意の追加コンテンツ ===== */
.ksk-top-extra {
  margin: 56px auto 0;
  max-width: 1600px;
  padding: 0 24px;
}

.ksk-top-extra__inner {
  font-size: var(--fs-s1);
  line-height: 1.85;
}

/* ===== 追従CTA（モバイルのみ） ===== */
.ksk-top-sticky-cta {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--ksk-top-c-accent);
  color: #fff;
  text-align: center;
  padding: 14px 16px;
  font-size: var(--fs-s1);
  font-weight: 700;
  z-index: 100;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15);
  text-decoration: none;
  letter-spacing: 0.04em;
}

.ksk-top-sticky-cta:hover {
  background: var(--ksk-top-c-accent-dark);
  color: #fff;
}

/* ===== レスポンシブ：タブレット (768〜1099px) ===== */
@media (max-width: 1099px) {
  .ksk-top-fv { padding: 24px 0; }
  .ksk-top-fv__inner { padding: 0 24px; }
  .ksk-top-fv__row-top { gap: 22px; }
  .ksk-top-fv__left { min-height: 240px; padding: 16px 0; }
  .ksk-top-fv__logo-mark-wrap { width: min(34vw, 380px); height: min(34vw, 380px); }
  .ksk-top-fv__title { font-size: var(--fs-l2); }

  .ksk-top-sec { margin: 40px 20px 0; padding: 0; }
  .ksk-top-news-wrap { grid-template-columns: 1fr; gap: 32px; }
  .ksk-top-magazine { gap: 14px; }
  .ksk-top-feature__title { font-size: var(--fs-l1); }

  .ksk-top-about-mim { margin: 0; padding: 48px 20px; }
  .ksk-top-about-mim__inner { grid-template-columns: 1fr; gap: 22px; padding: 28px 22px; }


  .ksk-top-strength { margin: 40px 20px 0; padding: 32px 22px; }
  .ksk-top-final { padding: 48px 20px; }
  .ksk-top-final__title { font-size: var(--fs-l2); }

  .ksk-top-extra { margin: 40px 20px 0; padding: 0; }
}

/* ===== レスポンシブ：モバイル (〜767px) ===== */
@media (max-width: 767px) {
  .ksk-top { font-size: var(--fs-s1); }

  .ksk-top-fv { padding: 20px 0; }
  .ksk-top-fv__inner { padding: 0 16px; }

  .ksk-top-fv__row-top {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ksk-top-fv__left {
    min-height: auto;
    padding: 12px 0;
  }

  .ksk-top-fv__logo-bg {
    justify-content: flex-end;
    padding-left: 0;
    align-items: flex-start;
  }

  .ksk-top-fv__logo-mark-wrap {
    width: 65vw;
    height: 65vw;
    max-width: 280px;
    max-height: 280px;
    transform: translateX(10vw) rotate(-6deg);
    opacity: 0.12;
    opacity: 0.08;
  }

  .ksk-top-fv__kicker { font-size: var(--fs-s3); margin-bottom: 10px; }
  .ksk-top-fv__title { font-size: var(--fs-l2); line-height: 1.4; }
  .ksk-top-fv__lead { font-size: var(--fs-s1); margin-top: 14px; line-height: 1.75; }
  .ksk-top-fv__buttons { flex-direction: column; gap: 10px; margin-top: 20px; }
  .ksk-top-fv__btn { width: 100%; min-height: 44px; font-size: var(--fs-s1); padding: 0 20px; }

  .ksk-top-fv__strengths {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 22px;
  }

  .ksk-top-sec { margin: 36px 16px 0; }
  .ksk-top-sec-head__title { font-size: var(--fs-l1); }

  .ksk-top-magazine { gap: 14px; }
  .ksk-top-feature__ribbon { font-size: var(--fs-s4); padding: 3px 12px; }
  .ksk-top-feature__title { font-size: var(--fs-m); }
  .ksk-top-feature__lead { font-size: var(--fs-s2); }

  .ksk-top-article__link { grid-template-columns: 80px 1fr; gap: 12px; padding: 12px 0; }
  .ksk-top-article__thumb { width: 80px; height: 60px; }

  .ksk-top-about-mim { margin: 0; padding: 40px 16px; }
  .ksk-top-about-mim__inner { padding: 22px 18px; }
  .ksk-top-about-mim__title { font-size: var(--fs-l1); }
  .ksk-top-about-mim__lead { font-size: var(--fs-s1); }


  .ksk-top-strength { margin: 36px 16px 0; padding: 28px 18px; }
  .ksk-top-strength__title { font-size: var(--fs-l1); }
  .ksk-top-strength__item { padding: 18px; grid-template-columns: 1fr; gap: 14px; }
  .ksk-top-strength__icon { width: 60px; height: 60px; }
  .ksk-top-strength__name { font-size: var(--fs-m); }
  .ksk-top-strength__desc { font-size: var(--fs-s1); }

  .ksk-top-final { padding: 36px 18px; }
  .ksk-top-final__title { font-size: var(--fs-l2); }
  .ksk-top-final__pains { padding: 18px 22px; }
  .ksk-top-final__pains li { font-size: var(--fs-s1); }
  .ksk-top-final__lead { font-size: var(--fs-s2); }
  .ksk-top-final__btn {
    display: block;
    width: 100%;
    min-width: 0;
    padding: 16px;
    font-size: var(--fs-m);
  }

  .ksk-top-extra { margin: 36px 16px 0; }

  .ksk-top-sticky-cta { display: block; }
  body.page-template-page-ksk-top { padding-bottom: 60px; }
}

/* ===== レスポンシブ：スモールモバイル (〜380px) ===== */
@media (max-width: 380px) {
  .ksk-top-fv__title { font-size: var(--fs-l1); }
  .ksk-top-fv__inner { padding: 0 14px; }
  .ksk-top-feature__title { font-size: var(--fs-m); }
  .ksk-top-about-mim__title { font-size: var(--fs-l1); }
  .ksk-top-final__title { font-size: var(--fs-l1); }
}


/* ===== KSK top responsive refinement ===== */
@media (max-width: 1180px) {
  .ksk-top-fv__lead-br { display: none; }
}

@media (min-width: 768px) and (max-width: 1099px) {
  .ksk-top-fv__row-top {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: 24px;
  }

  .ksk-top-fv__title { font-size: var(--fs-l3); }
  .ksk-top-fv__lead { font-size: var(--fs-s1); line-height: 1.85; }
  .ksk-top-fv__cta-block { max-width: 380px; padding: 20px 18px; }
  .ksk-top-fv__carousel { aspect-ratio: 16 / 10; }

  .ksk-top-news-section .ksk-top-news-wrap,
  .ksk-top-news-section .ksk-top-sec-head {
    padding: 0 24px;
  }

  .ksk-top-news-wrap {
    grid-template-columns: 1fr;
  }

  .ksk-top-side {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
  }

  .ksk-top-magazine {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "big big"
      "mid1 mid2"
      "sm1 sm2"
      "sm3 sm3";
  }

  .ksk-top-mag-card--big .ksk-top-mag-card__thumb {
    aspect-ratio: 16 / 9;
    flex: none;
  }

  .ksk-top-about-mim__body {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .ksk-top-about-mim__features {
    max-width: none;
    justify-self: stretch;
    margin-top: 0;
  }

  .ksk-top-about-mim__features ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 24px;
  }

  .ksk-mim-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px 20px;
  }

  .ksk-top-strength-final__card {
    max-width: 920px;
    padding: 44px;
  }

  .ksk-top-strength-final__card .ksk-top-strength__banner {
    margin: -44px -44px 28px;
  }

  .ksk-top-strength__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ksk-top-strength__item,
  .ksk-top-strength__item:nth-child(4),
  .ksk-top-strength__item:nth-child(5) {
    grid-column: auto;
  }

  .ksk-top-strength-final__card .ksk-top-final {
    margin: 40px -44px -44px;
    padding: 48px 28px;
  }
}

@media (max-width: 767px) {
  .ksk-top {
    --fs-l4: 2.4rem;
    --fs-l3: 1.65rem;
    --fs-l2: 1.36rem;
    --fs-l1: 1.15rem;
  }

  .ksk-top-fv {
    padding: 28px 0 34px;
  }

  .ksk-top-fv__inner,
  .ksk-top-news-section .ksk-top-news-wrap,
  .ksk-top-news-section .ksk-top-sec-head {
    padding-left: 18px;
    padding-right: 18px;
  }

  .ksk-top-fv__row-top {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .ksk-top-fv__left {
    padding: 6px 0 0;
  }

  .ksk-top-fv__title {
    font-size: var(--fs-l3);
    line-height: 1.38;
  }

  .ksk-top-fv__lead {
    font-size: var(--fs-s1);
    line-height: 1.8;
  }

  .ksk-top-fv__cta-block {
    max-width: none;
    padding: 18px 16px;
  }

  .ksk-top-fv__strengths-head {
    text-align: left;
  }

  .ksk-top-fv__strengths {
    margin-left: 0;
    margin-right: 0;
  }

  .ksk-top-fv__carousel {
    aspect-ratio: 4 / 5;
    margin-bottom: 36px;
  }

  .ksk-top-fv__slide-content {
    right: 18px;
    bottom: 20px;
    left: 18px;
    max-width: none;
  }

  .ksk-top-fv__slide-title {
    white-space: normal;
    font-size: var(--fs-l1);
    line-height: 1.5;
  }

  .ksk-top-sec.ksk-top-news-section,
  .ksk-top-sec.ksk-top-rank-section {
    padding: 44px 0;
  }

  .ksk-top-news-wrap {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .ksk-top-magazine {
    grid-template-columns: 1fr;
    grid-template-areas:
      "big"
      "mid1"
      "mid2"
      "sm1"
      "sm2"
      "sm3";
    gap: 22px;
  }

  .ksk-top-mag-card--big .ksk-top-mag-card__thumb,
  .ksk-top-mag-card__thumb {
    aspect-ratio: 16 / 10;
    flex: none;
  }

  .ksk-top-side {
    gap: 18px;
  }

  .ksk-top-more__link {
    min-width: 0;
    width: 100%;
    min-height: 56px;
    padding: 14px 20px;
    font-size: var(--fs-s1);
  }

  .ksk-top-about-mim {
    padding: 44px 16px;
  }

  .ksk-top-about-mim__inner {
    padding: 28px 20px;
  }

  .ksk-top-about-mim__body {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .ksk-top-about-mim__title {
    font-size: var(--fs-l2);
  }

  .ksk-top-about-mim__features {
    max-width: none;
    justify-self: stretch;
    margin-top: 0;
  }

  .ksk-top-about-mim__visual {
    margin-top: 30px;
    padding: 18px;
  }

  .ksk-mim-flow {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .ksk-mim-flow__image {
    aspect-ratio: 16 / 9;
  }

  .ksk-top-strength-final {
    padding: 44px 16px;
  }

  .ksk-top-strength-final__card {
    padding: 28px 20px;
    border-radius: var(--ksk-top-radius-lg);
  }

  .ksk-top-strength-final__card .ksk-top-strength__banner {
    margin: -28px -20px 24px;
    min-height: 280px;
  }

  .ksk-top-strength__banner-title {
    left: 20px;
    top: 20px;
    width: calc(100% - 40px);
  }

  .ksk-top-strength__banner-title h2 {
    font-size: var(--fs-l2);
  }

  .ksk-top-strength__list {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ksk-top-strength__item,
  .ksk-top-strength__item:nth-child(4),
  .ksk-top-strength__item:nth-child(5) {
    grid-column: auto;
    padding: 18px;
  }

  .ksk-top-strength-final__card .ksk-top-final {
    margin: 32px -20px -28px;
    padding: 40px 20px;
  }

  .ksk-top-final__title {
    font-size: var(--fs-l2);
  }

  .ksk-top-final__lead br {
    display: none;
  }

  .ksk-top-final__btn {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 420px) {
  .ksk-top-fv__title,
  .ksk-top-about-mim__title,
  .ksk-top-final__title {
    font-size: var(--fs-l1);
  }

  .ksk-top-fv__slide-title {
    font-size: var(--fs-s1);
  }

  .ksk-mim-flow__name,
  .ksk-top-strength__name {
    font-size: var(--fs-s1);
  }
}


/* Tablet: new articles as uniform 2-column cards */
@media (min-width: 768px) and (max-width: 1099px) {
  .ksk-top-magazine {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    grid-template-areas: none;
    align-items: start;
    gap: 28px 18px;
  }

  .ksk-top-mag-card,
  .ksk-top-mag-card:nth-child(1),
  .ksk-top-mag-card:nth-child(2),
  .ksk-top-mag-card:nth-child(3),
  .ksk-top-mag-card:nth-child(4),
  .ksk-top-mag-card:nth-child(5),
  .ksk-top-mag-card:nth-child(6) {
    grid-area: auto;
  }

  .ksk-top-mag-card--big .ksk-top-mag-card__link {
    height: auto;
  }

  .ksk-top-mag-card--big .ksk-top-mag-card__thumb,
  .ksk-top-mag-card--mid .ksk-top-mag-card__thumb,
  .ksk-top-mag-card--sm .ksk-top-mag-card__thumb,
  .ksk-top-mag-card__thumb {
    aspect-ratio: 16 / 10;
    flex: none;
  }

  .ksk-top-mag-card--big .ksk-top-mag-card__title,
  .ksk-top-mag-card--mid .ksk-top-mag-card__title,
  .ksk-top-mag-card--sm .ksk-top-mag-card__title {
    font-size: var(--fs-m);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}


/* Mobile refinement: FV hierarchy and MIM process columns */
@media (max-width: 767px) {
  .ksk-top-fv {
    padding: 24px 0 36px;
  }

  .ksk-top-fv__inner {
    padding-left: 12px;
    padding-right: 12px;
  }

  .ksk-top-fv__title {
    font-size: clamp(2.35rem, calc(1.35rem + 7.2vw), 3.45rem);
    line-height: 1.2;
    letter-spacing: 0;
  }

  .ksk-top-fv__lead {
    font-size: clamp(0.95rem, calc(0.86rem + 0.5vw), 1.08rem);
    line-height: 1.85;
  }

  .ksk-top-fv__cta-block {
    margin-top: 16px;
    padding: 18px 16px;
  }

  .ksk-top-fv__carousel {
    aspect-ratio: 1 / 1.16;
    margin-bottom: 34px;
  }

  .ksk-top-fv__slide-copy {
    left: 16px;
    right: 16px;
    bottom: 18px;
    max-width: none;
    text-align: left;
  }

  .ksk-top-fv__slide-title {
    white-space: normal;
    font-size: clamp(1rem, calc(0.9rem + 0.7vw), 1.15rem);
    line-height: 1.45;
  }

  .ksk-top-fv__slide-desc {
    text-align: left;
    font-size: var(--fs-s4);
    line-height: 1.55;
  }

  .ksk-top-fv__dots {
    bottom: -28px;
  }

  .ksk-mim-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 14px;
  }

  .ksk-mim-flow__caption {
    grid-column: 1 / -1;
  }

  .ksk-mim-flow__image {
    aspect-ratio: 16 / 10;
    margin-bottom: 10px;
  }

  .ksk-mim-flow__image img {
    padding: 8px;
  }

  .ksk-mim-flow__num {
    margin-bottom: 8px;
    font-size: var(--fs-s4);
  }

  .ksk-mim-flow__name {
    margin-bottom: 6px;
    font-size: var(--fs-s2);
    line-height: 1.45;
  }

  .ksk-mim-flow__desc {
    font-size: var(--fs-s4);
    line-height: 1.6;
  }
}

@media (max-width: 420px) {
  .ksk-top-fv__title {
    font-size: clamp(2.2rem, calc(1.2rem + 8vw), 3.15rem);
    line-height: 1.18;
  }
}

/* Mobile button width cap */
@media (max-width: 767px) {
  .ksk-top-fv__btn,
  .ksk-top-more__link,
  .ksk-top-final__btn,
  .ksk-header__cta,
  .ksk-footer__cta {
    width: 100%;
    max-width: 400px;
  }

  .ksk-top-fv__btn,
  .ksk-top-more__link,
  .ksk-top-final__btn {
    margin-left: auto;
    margin-right: auto;
  }
}

/* Mobile FV slider height tuning */
@media (max-width: 767px) {
  .ksk-top-fv__carousel {
    aspect-ratio: 16 / 12;
    min-height: 0;
    margin-bottom: 30px;
  }

  .ksk-top-fv__slide-copy {
    bottom: 16px;
  }

  .ksk-top-fv__slide-title {
    margin-top: 5px;
    font-size: clamp(0.95rem, calc(0.86rem + 0.45vw), 1.08rem);
    line-height: 1.35;
  }

  .ksk-top-fv__slide-desc {
    margin-top: 6px;
    font-size: clamp(0.74rem, calc(0.68rem + 0.35vw), 0.86rem);
    line-height: 1.45;
  }
}

@media (max-width: 420px) {
  .ksk-top-fv__carousel {
    aspect-ratio: 16 / 12.5;
  }
}

/* Mobile CTA width alignment */
@media (max-width: 767px) {
  .ksk-top-side-cv__btn {
    width: 100%;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Mobile FV layout: slider first */
@media (max-width: 767px) {
  .ksk-top-fv {
    padding-top: 16px;
  }

  .ksk-top-fv__row-top {
    gap: 22px;
  }

  .ksk-top-fv__right {
    order: -1;
  }

  .ksk-top-fv__left {
    order: 0;
    padding-top: 0;
  }

  .ksk-top-fv__carousel {
    aspect-ratio: 16 / 10.2;
    margin-bottom: 30px;
    border-radius: var(--ksk-top-radius-md);
  }

  .ksk-top-fv__slide {
    border-radius: var(--ksk-top-radius-md);
  }

  .ksk-top-fv__slide::after {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0) 42%, rgba(0, 0, 0, 0.58) 100%);
  }

  .ksk-top-fv__slide-copy {
    bottom: 14px;
  }

  .ksk-top-fv__slide-label {
    margin-bottom: 4px;
    font-size: var(--fs-s5);
  }

  .ksk-top-fv__slide-title {
    margin-bottom: 4px;
  }

  .ksk-top-fv__slide-desc {
    display: none;
  }

  .ksk-top-fv__dots {
    bottom: -26px;
  }
}

@media (max-width: 420px) {
  .ksk-top-fv__carousel {
    aspect-ratio: 16 / 10.8;
  }
}

/* Mobile FV CTA height alignment */
@media (max-width: 767px) {
  .ksk-top-fv__btn {
    min-height: 56px;
    padding: 0 28px;
  }
}

/* Mobile FV headline overlay inside slider */
@media (max-width: 767px) {
  .ksk-top-fv__row-top {
    position: relative;
  }

  .ksk-top-fv__copy {
    position: static;
  }

  .ksk-top-fv__kicker,
  .ksk-top-fv__title {
    position: absolute;
    left: 18px;
    right: 18px;
    z-index: 5;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.32);
  }

  .ksk-top-fv__kicker {
    top: 18px;
    margin: 0;
    font-size: clamp(0.78rem, calc(0.66rem + 0.6vw), 0.92rem);
    letter-spacing: 0.04em;
    white-space: nowrap;
  }

  .ksk-top-fv__title {
    top: 46px;
    max-width: none;
    margin: 0;
    font-size: clamp(1.7rem, calc(1.18rem + 3.6vw), 2.28rem);
    line-height: 1.18;
    white-space: nowrap;
  }

  .ksk-top-fv__lead {
    margin-top: 0;
  }

  .ksk-top-fv__slide::after {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.18) 42%, rgba(0, 0, 0, 0.62) 100%);
  }
}

@media (max-width: 420px) {
  .ksk-top-fv__kicker {
    top: 16px;
    font-size: clamp(0.72rem, calc(0.62rem + 0.55vw), 0.82rem);
  }

  .ksk-top-fv__title {
    top: 40px;
    font-size: clamp(1.58rem, calc(1.05rem + 3.9vw), 2rem);
  }
}

/* FV title fluid sizing: keep the intended two-line headline stable */
.ksk-top-fv__title {
  font-size: clamp(2.25rem, calc(1.05rem + 3.4vw), 3.45rem);
  line-height: 1.22;
  letter-spacing: 0;
  max-width: 11em;
}

@media (min-width: 1440px) {
  .ksk-top-fv__title {
    font-size: clamp(3.2rem, calc(2.1rem + 1.8vw), 4rem);
  }
}

@media (min-width: 768px) and (max-width: 1180px) {
  .ksk-top-fv__title {
    font-size: clamp(2rem, calc(1.1rem + 3vw), 3.05rem);
    line-height: 1.24;
    max-width: 10.5em;
  }
}

@media (max-width: 767px) {
  .ksk-top-fv__title {
    font-size: clamp(1.7rem, calc(1.18rem + 3.6vw), 2.28rem);
    line-height: 1.18;
    max-width: none;
    white-space: nowrap;
  }

  .ksk-top-fv__kicker {
    font-size: clamp(0.78rem, calc(0.66rem + 0.6vw), 0.92rem);
    letter-spacing: 0.04em;
    white-space: nowrap;
  }
}

@media (max-width: 420px) {
  .ksk-top-fv__title {
    font-size: clamp(1.58rem, calc(1.05rem + 3.9vw), 2rem);
    line-height: 1.18;
    max-width: none;
  }

  .ksk-top-fv__kicker {
    font-size: clamp(0.72rem, calc(0.62rem + 0.55vw), 0.82rem);
  }
}

/* Header tablet overflow fix */
@media (max-width: 1100px) {
  .ksk-header__inner {
    padding: 0 16px;
    gap: 0;
  }

  .ksk-header__nav {
    display: none;
  }

  .ksk-header__cta {
    margin-left: auto;
  }

  .ksk-hamburger {
    display: flex;
    margin-left: 8px;
  }
}

@media (max-width: 520px) {
  .ksk-header__logo img {
    width: 168px;
    height: auto;
  }

  .ksk-header__btn {
    padding: 8px 14px;
    font-size: 13px;
  }
}

/* Sticky CTA overflow fix */
@media (max-width: 1100px) {
  .ksk-top-sticky-cta {
    left: 16px;
    right: 16px;
    bottom: 12px;
    width: auto;
    max-width: 400px;
    min-height: 56px;
    margin: 0 auto;
    padding: 0 24px;
    display: none;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    z-index: 1200;
  }

  body.page-template-page-ksk-top {
    padding-bottom: 88px;
  }
}

@media (max-width: 767px) {
  .ksk-top-sticky-cta {
    display: flex;
  }
}

@media (max-width: 420px) {
  .ksk-top-sticky-cta {
    left: 12px;
    right: 12px;
    max-width: none;
  }
}

/* Footer responsive overflow fix */
.ksk-footer {
  overflow: hidden;
}

.ksk-footer__main,
.ksk-footer__brand,
.ksk-footer__nav,
.ksk-footer__nav-col,
.ksk-footer__contact {
  min-width: 0;
}

.ksk-footer__btn {
  width: 100%;
  max-width: 400px;
  min-height: 56px;
  box-sizing: border-box;
  text-align: center;
  white-space: normal;
}

@media (max-width: 1280px) {
  .ksk-footer__main {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .ksk-footer__tagline {
    max-width: 640px;
  }

  .ksk-footer__nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 36px;
  }

  .ksk-footer__contact {
    max-width: 400px;
  }
}

@media (max-width: 900px) {
  .ksk-footer__nav {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .ksk-footer__nav-col--wide {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .ksk-footer__btn {
    max-width: 400px;
  }
}

/* Mobile menu CTA width cap */
.ksk-mobile-menu__cta .ksk-header__btn {
  max-width: 400px;
  min-height: 56px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Tablet FV balance: keep headline in two lines */
@media (min-width: 768px) and (max-width: 1180px) {
  .ksk-top-fv__row-top {
    grid-template-columns: minmax(0, 1.16fr) minmax(320px, 0.84fr);
    gap: 28px;
  }

  .ksk-top-fv__right {
    width: 100%;
    max-width: 560px;
    justify-self: end;
  }

  .ksk-top-fv__title {
    font-size: clamp(2.45rem, calc(1.55rem + 2vw), 3rem);
    line-height: 1.2;
    max-width: 12em;
  }

  .ksk-top-fv__lead {
    max-width: 35em;
  }
}

@media (min-width: 768px) and (max-width: 960px) {
  .ksk-top-fv__row-top {
    grid-template-columns: minmax(0, 1.22fr) minmax(300px, 0.78fr);
    gap: 24px;
  }

  .ksk-top-fv__right {
    max-width: 500px;
  }

  .ksk-top-fv__title {
    font-size: clamp(2.25rem, calc(1.45rem + 2.3vw), 2.75rem);
    max-width: 12em;
  }
}

/* Mobile horizontal overflow guard */
@media (max-width: 767px) {
  html,
  body,
  #container,
  .container,
  .ksk-top {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .ksk-header,
  .ksk-header-band,
  .ksk-top-fv,
  .ksk-top-sec,
  .ksk-top-news-section,
  .ksk-top-rank-section,
  .ksk-top-about-mim,
  .ksk-top-strength-final,
  .ksk-footer {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .ksk-top-sec.ksk-top-news-section,
  .ksk-top-sec.ksk-top-rank-section {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .ksk-top-news-section .ksk-top-sec-head,
  .ksk-top-news-section .ksk-top-news-wrap,
  .ksk-top-rank-section > .ksk-top-sec-head,
  .ksk-top-rank-section > .ksk-top-rank-board,
  .ksk-top-rank-section > .ksk-top-more,
  .ksk-top-rank-section > .ksk-top-empty {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

/* Strength lead text color */
.ksk-top-strength__sub {
  color: var(--ksk-top-c-text);
}

/* Mobile new articles: compact list like popular ranking */
@media (max-width: 767px) {
  .ksk-top-news-wrap {
    gap: 24px;
  }

  .ksk-top-magazine {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-template-areas: none;
    gap: 14px;
  }

  .ksk-top-mag-card,
  .ksk-top-mag-card:nth-child(1),
  .ksk-top-mag-card:nth-child(2),
  .ksk-top-mag-card:nth-child(3),
  .ksk-top-mag-card:nth-child(4),
  .ksk-top-mag-card:nth-child(5),
  .ksk-top-mag-card:nth-child(6) {
    grid-area: auto;
  }

  .ksk-top-mag-card__link,
  .ksk-top-mag-card--big .ksk-top-mag-card__link {
    display: grid;
    grid-template-columns: 42% minmax(0, 1fr);
    min-height: 128px;
    height: auto;
    align-items: stretch;
    background: #fff;
    border: 1px solid rgba(46, 168, 117, 0.12);
    border-radius: var(--ksk-top-radius-md);
    overflow: hidden;
  }

  .ksk-top-mag-card__thumb,
  .ksk-top-mag-card--big .ksk-top-mag-card__thumb,
  .ksk-top-mag-card--mid .ksk-top-mag-card__thumb,
  .ksk-top-mag-card--sm .ksk-top-mag-card__thumb {
    height: 100%;
    min-height: 128px;
    aspect-ratio: auto;
    flex: none;
    border-radius: 0;
  }

  .ksk-top-mag-card__body,
  .ksk-top-mag-card--big .ksk-top-mag-card__body,
  .ksk-top-mag-card--mid .ksk-top-mag-card__body,
  .ksk-top-mag-card--sm .ksk-top-mag-card__body {
    padding: 12px 13px;
    justify-content: center;
    gap: 6px;
  }

  .ksk-top-mag-card__cat {
    display: none;
  }

  .ksk-top-mag-card__meta {
    order: 2;
    font-size: var(--fs-s4);
  }

  .ksk-top-mag-card__title,
  .ksk-top-mag-card--big .ksk-top-mag-card__title,
  .ksk-top-mag-card--mid .ksk-top-mag-card__title,
  .ksk-top-mag-card--sm .ksk-top-mag-card__title {
    order: 1;
    font-size: var(--fs-s1);
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

/* Mobile header: keep contact button and hamburger always visible */
@media (max-width: 1100px) {
  .ksk-header__inner {
    display: flex;
    align-items: center;
    min-width: 0;
  }

  .ksk-header__logo {
    min-width: 0;
    flex: 0 1 auto;
  }

  .ksk-header__cta {
    width: auto;
    max-width: none;
    min-width: 0;
    flex: 0 0 auto;
    margin-left: auto;
  }

  .ksk-header__cta .ksk-header__btn {
    width: auto;
    max-width: none;
    min-height: 42px;
    padding: 8px 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
  }

  .ksk-hamburger {
    display: flex !important;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    margin-left: 8px;
  }
}

@media (max-width: 520px) {
  .ksk-header__inner {
    padding: 0 12px;
  }

  .ksk-header__logo img {
    width: clamp(142px, calc(6.8rem + 12vw), 168px);
    height: auto;
  }

  .ksk-header__cta .ksk-header__btn {
    min-height: 38px;
    padding: 7px 13px;
    font-size: var(--fs-s4);
  }

  .ksk-hamburger {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
    margin-left: 6px;
  }
}

@media (max-width: 380px) {
  .ksk-header__logo img {
    width: 132px;
  }

  .ksk-header__cta .ksk-header__btn {
    padding-left: 11px;
    padding-right: 11px;
  }
}

/* Prevent desktop horizontal overflow from 100vw sections */
.ksk-top-sec.ksk-top-news-section,
.ksk-top-sec.ksk-top-rank-section {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

html,
body {
  overflow-x: clip;
}

@supports not (overflow-x: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

/* About MIM feature headings keep original style */
.ksk-top-about-mim__features h3 {
  margin: 0;
  color: var(--ksk-top-c-primary);
  font-size: var(--fs-s1);
  font-weight: 700;
  line-height: 1.6;
}

/* Strength heading structure: keep visual style after moving number outside h3 */
.ksk-top-strength__name {
  margin: 0;
}

/* MIM process flow heading size */
.ksk-mim-flow__caption {
  font-size: var(--fs-s1);
}

/* Shared section label logo decoration */
.ksk-top-sec-head__lab,
.ksk-top-about-mim__lab {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.ksk-top-label-mark {
  width: 18px;
  height: auto;
  display: inline-block;
  flex: 0 0 auto;
}

.ksk-top-label-mark__piece--yellow { fill: #EEEA42; }
.ksk-top-label-mark__piece--blue { fill: #1E257C; }
.ksk-top-label-mark__piece--green { fill: #3EB134; }

/* Single post content headings */
body:not(.page-template-page-ksk-top) .entry-content h2 {
  position: relative;
  margin: 3em 0 1.2em;
  padding: 0 0 0.72em;
  background: transparent;
  border: 0;
  border-bottom: 2px solid rgba(46, 168, 117, 0.18);
  color: #333;
  font-weight: 700;
  line-height: 1.55;
}

body:not(.page-template-page-ksk-top) .entry-content h2::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 72px;
  height: 2px;
  background: #2ea875;
}

body:not(.page-template-page-ksk-top) .entry-content h3 {
  position: relative;
  margin: 2.3em 0 0.9em;
  padding: 0 0 0 0.7em;
  border: 0;
  color: #252525;
  font-weight: 700;
  line-height: 1.6;
}

body:not(.page-template-page-ksk-top) .entry-content h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 4px;
  height: 1.2em;
  background: #2ea875;
  border-radius: 9999px;
}

body:not(.page-template-page-ksk-top) .entry-content h4 {
  position: relative;
  margin: 1.9em 0 0.8em;
  padding: 0.2em 0 0.2em 1.05em;
  background: transparent;
  border: 0;
  color: #333;
  font-weight: 700;
  line-height: 1.7;
}

body:not(.page-template-page-ksk-top) .entry-content h4::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.82em;
  width: 0.52em;
  height: 2px;
  background: #2ea875;
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .entry-content h2 {
    margin-top: 2.35em;
    padding-bottom: 0.62em;
  }

  body:not(.page-template-page-ksk-top) .entry-content h2::before {
    width: 56px;
  }

  body:not(.page-template-page-ksk-top) .entry-content h3 {
    margin-top: 1.95em;
    padding-left: 0.68em;
  }
}

body #inner-content .entry-content .btn.raised.accent-bc.strong {
  border-radius: var(--ksk-top-radius-pill, 9999px);
}

/* Anchor offset for fixed header */
html {
  scroll-padding-top: 112px;
}

body:not(.page-template-page-ksk-top) .entry-content h2,
body:not(.page-template-page-ksk-top) .entry-content h3,
body:not(.page-template-page-ksk-top) .entry-content h4,
body:not(.page-template-page-ksk-top) .entry-content [id] {
  scroll-margin-top: 112px;
}

@media (max-width: 1100px) {
  html {
    scroll-padding-top: 104px;
  }

  body:not(.page-template-page-ksk-top) .entry-content h2,
  body:not(.page-template-page-ksk-top) .entry-content h3,
  body:not(.page-template-page-ksk-top) .entry-content h4,
  body:not(.page-template-page-ksk-top) .entry-content [id] {
    scroll-margin-top: 104px;
  }
}

@media (max-width: 767px) {
  html {
    scroll-padding-top: 92px;
  }

  body:not(.page-template-page-ksk-top) .entry-content h2,
  body:not(.page-template-page-ksk-top) .entry-content h3,
  body:not(.page-template-page-ksk-top) .entry-content h4,
  body:not(.page-template-page-ksk-top) .entry-content [id] {
    scroll-margin-top: 92px;
  }
}

/* Single post standard lists */
body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]),
body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.toc_list):not(#toc_container) > ul:not([class]) {
  margin: 1.2em 0 1.8em;
  padding: 20px 24px;
  list-style: none;
  background: #fff;
  border: 1px solid rgba(46, 168, 117, 0.18);
  border-radius: 8px;
}

body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]) > li,
body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.toc_list):not(#toc_container) > ul:not([class]) > li {
  position: relative;
  display: grid;
  grid-template-columns: 0.62em minmax(0, 1fr);
  column-gap: 0.72em;
  align-items: baseline;
  margin: 0;
  color: #333;
  line-height: 1.65;
}

body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]) > li + li,
body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.toc_list):not(#toc_container) > ul:not([class]) > li + li {
  margin-top: 0.28em;
}

body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]) > li::before,
body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.toc_list):not(#toc_container) > ul:not([class]) > li::before {
  content: "";
  position: static;
  width: 0.48em;
  height: 0.48em;
  background: var(--button-main-color, #2ea875);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(46, 168, 117, 0.12);
  transform: translateY(-0.08em);
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]),
  body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.toc_list):not(#toc_container) > ul:not([class]) {
    padding: 16px 18px;
  }

  body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]) > li,
  body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.toc_list):not(#toc_container) > ul:not([class]) > li {
    line-height: 1.6;
  }
}

/* Latest posts block outside the top page */
body:not(.page-template-page-ksk-top) .wp-block-latest-posts {
  display: grid !important;
  gap: 10px;
  margin: 1.15em 0 1.7em;
  padding: 0 !important;
  list-style: none !important;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li {
  position: relative;
  display: grid !important;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin: 0 !important;
  padding: 8px 12px 8px 8px !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(46, 168, 117, 0.16);
  border-radius: 8px;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li:hover {
  border-color: rgba(46, 168, 117, 0.42);
  box-shadow: 0 8px 22px rgba(46, 168, 117, 0.1);
  cursor: pointer;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li::before,
body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li::after {
  display: none !important;
  content: none !important;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__featured-image {
  float: none !important;
  margin: 0 !important;
  width: 94px !important;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 6px;
  background: rgba(46, 168, 117, 0.08);
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__featured-image img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  transition: transform 0.28s ease, filter 0.28s ease, opacity 0.28s ease;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li:hover .wp-block-latest-posts__featured-image img {
  transform: scale(1.06);
  filter: saturate(1.06) contrast(1.04);
  opacity: 0.92;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__post-title {
  position: relative;
  z-index: 1;
  display: -webkit-box;
  color: #333;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.52;
  text-decoration: none !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__post-title:hover,
body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li:hover .wp-block-latest-posts__post-title {
  color: var(--button-main-color, #2ea875);
  text-decoration: none !important;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__card-link {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  overflow: hidden;
  text-indent: -9999px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts {
  background-color: transparent !important;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts > li {
  background-color: #fff !important;
}

body:not(.page-template-page-ksk-top) .widget ul li a:hover {
  background: transparent;
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .wp-block-latest-posts {
    gap: 9px;
  }

  body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 10px;
    padding: 8px 10px 8px 8px !important;
  }

  body:not(.page-template-page-ksk-top) .wp-block-latest-posts__featured-image {
    width: 88px !important;
  }

  body:not(.page-template-page-ksk-top) .wp-block-latest-posts__post-title {
    font-size: 0.76rem;
    line-height: 1.48;
    -webkit-line-clamp: 3;
  }
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
  -webkit-line-clamp: 2;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li {
  min-height: 82px;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__post-title {
  word-break: break-word;
  overflow-wrap: anywhere;
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .wp-block-latest-posts__post-title {
    -webkit-line-clamp: 2;
  }
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li {
  padding: 0 12px 0 0 !important;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__featured-image {
  align-self: stretch;
  height: 100%;
  border-radius: 8px 0 0 8px;
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li {
    padding: 0 10px 0 0 !important;
  }
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-heading,
body:not(.page-template-page-ksk-top) .sidebar .widgettitle {
  position: relative;
  margin: 0 0 12px;
  padding: 0 0 10px 14px;
  color: #333;
  background: transparent;
  border-bottom: 1px solid rgba(46, 168, 117, 0.18);
  border-radius: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-heading::before,
body:not(.page-template-page-ksk-top) .sidebar .widgettitle::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.18em;
  width: 4px;
  height: 1.2em;
  background: var(--button-main-color, #2ea875);
  border-radius: 9999px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts > li {
  min-height: 120px;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: center;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__featured-image {
  width: 104px !important;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
  -webkit-line-clamp: 4;
  line-height: 1.45;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts > li {
  transition-duration: 0.08s;
}

body:not(.page-template-page-ksk-top) .wp-block-latest-posts__featured-image img {
  transition-duration: 0.12s;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-heading,
body:not(.page-template-page-ksk-top) .sidebar .widgettitle {
  padding-left: 18px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-heading::before,
body:not(.page-template-page-ksk-top) .sidebar .widgettitle::before {
  left: 4px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: none;
  padding-bottom: 0.15em;
}

/* ============================================================
   サイドバー：カテゴリ一覧（タグピル型）
============================================================ */
body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories,
body:not(.page-template-page-ksk-top) .sidebar .widget_categories ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories li,
body:not(.page-template-page-ksk-top) .sidebar .widget_categories ul li {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  font-weight: normal !important;
  list-style: none !important;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories li a,
body:not(.page-template-page-ksk-top) .sidebar .widget_categories ul li a {
  display: inline-flex !important;
  align-items: center;
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #2ea875 !important;
  background: #ffffff !important;
  border: 1.5px solid #c7d9cd !important;
  border-radius: 9999px !important;
  text-decoration: none !important;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  white-space: nowrap;
  line-height: 1.4;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories li a:hover,
body:not(.page-template-page-ksk-top) .sidebar .widget_categories ul li a:hover {
  background: #2ea875 !important;
  color: #ffffff !important;
  border-color: #2ea875 !important;
}

/* カテゴリの記事数（(5) など）の表示調整 */
body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories .cat-count,
body:not(.page-template-page-ksk-top) .sidebar .widget_categories .cat-count,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories li > span {
  display: inline-block;
  margin-left: 4px;
  font-size: 11px;
  opacity: 0.7;
}

/* 階層カテゴリの子は1段下げる：折り返しで自然に並ぶ */
body:not(.page-template-page-ksk-top) .sidebar .wp-block-categories li ul,
body:not(.page-template-page-ksk-top) .sidebar .widget_categories ul li ul {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 8px 0 0 12px !important;
  padding: 0 !important;
}


/* Content-end CTA outside the top page */
body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta {
  margin: 3em 0;
  color: #333;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  margin: 1.35em 0 1.5em;
  border-radius: 10px;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quotes {
  display: grid;
  gap: 8px;
  margin: 0 0 1.45em;
  padding: 18px 20px;
  border: 1px solid rgba(46, 168, 117, 0.18);
  border-radius: 10px;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quote {
  position: relative;
  margin: 0;
  padding-left: 1.1em;
  color: #333;
  font-weight: 700;
  line-height: 1.65;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quote::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.68em;
  width: 0.42em;
  height: 0.42em;
  background: var(--button-main-color, #2ea875);
  border-radius: 50%;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__lead {
  margin: 0 0 1.15em;
  color: #333;
  line-height: 1.9;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__lead-strong {
  color: #333;
  font-weight: 700;
}

body:not(.page-template-page-ksk-top) .entry-content ul.ksk-after-content-cta__points {
  display: grid;
  gap: 8px;
  margin: 1.4em 0;
  padding: 18px 20px;
  list-style: none !important;
  background: #f4faf6;
  border: 1px solid rgba(46, 168, 117, 0.18);
  border-radius: 10px;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__points li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  margin: 0;
  padding: 0;
  color: #333;
  font-weight: 700;
  line-height: 1.65;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__points li::before {
  display: none !important;
  content: none !important;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__points .material-icons-round {
  margin-top: 0.1em;
  color: var(--button-main-color, #2ea875);
  font-size: 19px;
  line-height: 1;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__note {
  margin: 1.35em 0 1.1em;
  color: #333;
  line-height: 1.85;
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta {
    margin: 2.4em 0;
  }

  body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__image {
    margin: 1.1em 0 1.25em;
    border-radius: 8px;
  }

  body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quotes,
  body:not(.page-template-page-ksk-top) .entry-content ul.ksk-after-content-cta__points {
    padding: 15px 16px;
    border-radius: 8px;
  }

  body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__lead,
  body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__note {
    line-height: 1.75;
  }
}


/* Article body list background */
body:not(.page-template-page-ksk-top) .entry-content > ul:not([class]),
body:not(.page-template-page-ksk-top) .entry-content :not(.ksk-before-toc-cta):not(.ksk-after-content-cta):not(.toc_list):not(#toc_container) > ul:not([class]) {
  background-color: rgba(46, 168, 117, 0.06);
}


/* Match content-end quote list with article body list */
body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quotes {
  gap: 0.28em;
  margin: 0 0 1.45em;
  padding: 18px 22px;
  background-color: rgba(46, 168, 117, 0.06);
  border: 1px solid rgba(46, 168, 117, 0.18);
  border-radius: 10px;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quote {
  display: grid;
  grid-template-columns: 0.9em minmax(0, 1fr);
  column-gap: 0.75em;
  align-items: baseline;
  padding-left: 0;
  font-weight: 400;
  line-height: 1.65;
}

body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quote::before {
  position: static;
  width: 0.48em;
  height: 0.48em;
  align-self: center;
  background: var(--button-main-color, #2ea875);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(46, 168, 117, 0.12);
  transform: translateY(-0.08em);
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .entry-content .ksk-after-content-cta__quotes {
    padding: 16px 18px;
  }
}


/* Sidebar latest posts card refinement */
body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts {
  gap: 8px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts > li {
  min-height: 78px;
  grid-template-columns: 102px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 0 12px 0 0 !important;
  border-color: rgba(46, 168, 117, 0.14);
  border-radius: 7px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__featured-image {
  width: 102px !important;
  aspect-ratio: 4 / 3;
  border-radius: 7px 0 0 7px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
  display: -webkit-box !important;
  color: #333;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.48;
  letter-spacing: 0;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: calc(1.48em * 3);
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts > li:hover .wp-block-latest-posts__post-title {
  color: var(--button-main-color, #2ea875);
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts > li {
    min-height: 76px;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 10px;
  }

  body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__featured-image {
    width: 96px !important;
  }

  body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
    font-size: 0.7rem;
    line-height: 1.45;
    -webkit-line-clamp: 3;
    max-height: calc(1.45em * 3);
  }
}


/* サイドバー新着記事タイトル：line-clamp で省略（...） */
body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  max-height: none;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.78rem;
  line-height: 1.55;
  padding-bottom: 0;
}

@media (max-width: 767px) {
  body:not(.page-template-page-ksk-top) .sidebar .wp-block-latest-posts__post-title {
    -webkit-line-clamp: 3;
    max-height: none;
    line-height: 1.5;
  }
}


/* before-TOC CTA：薄緑の情報エリア（親グラデが透けないよう不透明指定） */
.ksk-before-toc-cta__info {
  background-color: #f4faf6 !important;
}

.ksk-before-toc-cta__points {
  background-color: transparent;
}


/* Keep fixed sidebar clear of the sticky header */
@media (min-width: 1024px) {
  #fixed_sidebar,
  #fixed_sidebar.fixed-sidebar {
    top: calc(var(--wp-admin--admin-bar--height, 0px) + 88px) !important;
  }
}


/* Sidebar fixed banner radius */
#fixed_sidebar .widget_media_image,
#fixed_sidebar .wp-block-image,
#fixed_sidebar .wp-block-image img {
  border-radius: 10px;
}

#fixed_sidebar .widget_media_image,
#fixed_sidebar .wp-block-image {
  overflow: hidden;
}

#fixed_sidebar .wp-block-image img {
  display: block;
  width: 100%;
}


/* Sidebar media banners and search radius */
body:not(.page-template-page-ksk-top) .sidebar .widget_media_image,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-image,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-image img,
body:not(.page-template-page-ksk-top) .sidebar .widget_media_image img {
  border-radius: 10px;
}

body:not(.page-template-page-ksk-top) .sidebar .widget_media_image,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-image {
  overflow: hidden;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-search__inside-wrapper {
  overflow: hidden;
  border-radius: 10px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-search__input {
  border-radius: 10px 0 0 10px;
}

body:not(.page-template-page-ksk-top) .sidebar .wp-block-search__button {
  border-radius: 0 10px 10px 0;
}


/* Round SANGO article buttons consistently */
body:not(.page-template-page-ksk-top) .entry-content .btn.flat2,
body:not(.page-template-page-ksk-top) .entry-content .btn.grad3,
body:not(.page-template-page-ksk-top) .entry-content a.btn.flat2,
body:not(.page-template-page-ksk-top) .entry-content a.btn.grad3 {
  border-radius: var(--ksk-top-radius-pill, 9999px) !important;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}


/* Sidebar banner hover feedback */
body:not(.page-template-page-ksk-top) .sidebar .widget_media_image img,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-image img {
  transition: filter 0.12s ease;
}

body:not(.page-template-page-ksk-top) .sidebar .widget_media_image a:hover img,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-image a:hover img,
body:not(.page-template-page-ksk-top) .sidebar .widget_media_image img:hover,
body:not(.page-template-page-ksk-top) .sidebar .wp-block-image img:hover {
  filter: brightness(1.06);
}


/* Keep before-TOC CTA soft on mobile */
@media (max-width: 767px) {
  .ksk-before-toc-cta__bg,
  .ksk-before-toc-cta__content {
    background: #f4faf6 !important;
  }

  .ksk-before-toc-cta__title-main {
    color: var(--button-main-color, #2ea875) !important;
  }

  .ksk-before-toc-cta__title-sub {
    color: #333 !important;
  }
}


/* Tablet tuning for before-TOC CTA */
@media (min-width: 768px) and (max-width: 900px) {
  .ksk-before-toc-cta__container {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.92fr);
  }

  .ksk-before-toc-cta__content {
    padding: 28px 24px;
  }

  .ksk-before-toc-cta__title-main {
    font-size: clamp(1.15rem, 2.7vw, 1.34rem);
    line-height: 1.48;
  }

  .ksk-before-toc-cta__title-sub {
    margin-top: 10px;
    font-size: 0.9rem;
    line-height: 1.75;
  }

  .ksk-before-toc-cta__info {
    padding: 22px 24px 26px;
  }

  .ksk-before-toc-cta__points li {
    font-size: 0.92rem;
    line-height: 1.45;
  }
}




/* Remove top padding from before-TOC CTA info on mobile */
@media (max-width: 767px) {
  .ksk-before-toc-cta__info {
    padding-top: 0 !important;
  }
}






/* Swap top-page Popular and About MIM section backgrounds */
.ksk-top-sec.ksk-top-rank-section {
  background-image:
    linear-gradient(rgba(46, 168, 117, 0.92), rgba(46, 168, 117, 0.92)),
    url("images/ksk-about-mim-bg.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.ksk-top-about-mim {
  background: #F3F1EF;
  background-image: none;
}


/* Popular section heading on green photo background */
.ksk-top-rank-section .ksk-top-sec-head__lab,
.ksk-top-rank-section .ksk-top-sec-head__lab span,
.ksk-top-rank-section .ksk-top-sec-head__title,
.ksk-top-rank-section .ksk-top-sec-head__sub {
  color: #fff;
}

.ksk-top-rank-section .ksk-top-label-mark path {
  fill: #fff;
}


/* Swap top-page Popular and About MIM max widths */
.ksk-top-rank-section > .ksk-top-sec-head,
.ksk-top-rank-section > .ksk-top-rank-board,
.ksk-top-rank-section > .ksk-top-more,
.ksk-top-rank-section > .ksk-top-empty {
  max-width: 1080px;
}

.ksk-top-about-mim__inner {
  max-width: 1600px;
}


/* Give Popular section a little more room */
.ksk-top-rank-section > .ksk-top-sec-head,
.ksk-top-rank-section > .ksk-top-rank-board,
.ksk-top-rank-section > .ksk-top-more,
.ksk-top-rank-section > .ksk-top-empty {
  max-width: 1240px;
}


/* About MIM: two-column editorial layout */
.ksk-top-about-mim__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(520px, 1.05fr);
  gap: 48px;
  align-items: start;
}

.ksk-top-about-mim__body {
  display: block;
  min-width: 0;
}

.ksk-top-about-mim__features {
  max-width: none;
  justify-self: auto;
  margin: 32px 0 0;
}

.ksk-top-about-mim__visual {
  margin-top: 0;
  padding: 30px;
}

.ksk-top-about-mim .ksk-mim-flow {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px 18px;
}

.ksk-top-about-mim .ksk-mim-flow__caption {
  margin-bottom: 4px;
}

.ksk-top-about-mim .ksk-mim-flow__image {
  margin-bottom: 12px;
}

@media (max-width: 1180px) {
  .ksk-top-about-mim__inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .ksk-top-about-mim__visual {
    padding: 26px;
  }
}

@media (max-width: 600px) {
  .ksk-top-about-mim .ksk-mim-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 14px;
  }

  .ksk-top-about-mim__visual {
    padding: 18px;
  }

  .ksk-top-about-mim .ksk-mim-flow__name {
    font-size: var(--fs-s2);
  }

  .ksk-top-about-mim .ksk-mim-flow__desc {
    font-size: var(--fs-s4);
  }
}


/* Widen Popular section slightly */
.ksk-top-rank-section > .ksk-top-sec-head,
.ksk-top-rank-section > .ksk-top-rank-board,
.ksk-top-rank-section > .ksk-top-more,
.ksk-top-rank-section > .ksk-top-empty {
  max-width: 1360px;
}


/* About MIM process flow: 3 columns */
.ksk-top-about-mim .ksk-mim-flow {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px 16px;
}

@media (max-width: 1180px) {
  .ksk-top-about-mim .ksk-mim-flow {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* Improve 1-9 process step readability */
.ksk-top-about-mim .ksk-mim-flow {
  align-items: stretch;
}

.ksk-top-about-mim .ksk-mim-flow__step {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 0;
  padding: 12px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(46, 168, 117, 0.14);
  border-radius: var(--ksk-top-radius-md);
}

.ksk-top-about-mim .ksk-mim-flow__num {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin: 0;
  color: #fff;
  background: var(--ksk-top-c-primary);
  border-radius: 50%;
  font-size: var(--fs-s4);
  letter-spacing: 0;
  box-shadow: 0 6px 14px rgba(46, 168, 117, 0.18);
}

.ksk-top-about-mim .ksk-mim-flow__image {
  margin: 0 0 12px;
  border-radius: var(--ksk-top-radius-sm);
}

.ksk-top-about-mim .ksk-mim-flow__content {
  display: block;
}

.ksk-top-about-mim .ksk-mim-flow__name {
  min-height: 0;
  margin-bottom: 6px;
  font-size: var(--fs-s2);
}

.ksk-top-about-mim .ksk-mim-flow__desc {
  font-size: var(--fs-s4);
  line-height: 1.65;
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__step {
    padding: 10px;
  }

  .ksk-top-about-mim .ksk-mim-flow__num {
    width: 30px;
    height: 30px;
    font-size: 0.72rem;
  }
}


/* Process flow arrows with Google Material Icons */
@media (min-width: 768px) {
  .ksk-top-about-mim .ksk-mim-flow__step::after {
    content: "arrow_forward";
    position: absolute;
    top: 50%;
    right: -20px;
    z-index: 3;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--ksk-top-c-primary);
    font-family: "Material Icons Round";
    font-size: 22px;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    direction: ltr;
    transform: translateY(-50%);
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "liga";
    pointer-events: none;
  }

  .ksk-top-about-mim .ksk-mim-flow__step--03::after,
  .ksk-top-about-mim .ksk-mim-flow__step--06::after,
  .ksk-top-about-mim .ksk-mim-flow__step--09::after {
    display: none !important;
    content: none !important;
  }
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__step::after {
    display: none !important;
    content: none !important;
  }
}


/* Process flow continuation arrows before 04 and 07 */
@media (min-width: 768px) {
  .ksk-top-about-mim .ksk-mim-flow__step--04::before,
  .ksk-top-about-mim .ksk-mim-flow__step--07::before {
    content: "arrow_forward";
    position: absolute;
    top: 50%;
    left: -20px;
    z-index: 3;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--ksk-top-c-primary);
    font-family: "Material Icons Round";
    font-size: 22px;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    direction: ltr;
    transform: translateY(-50%);
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "liga";
    pointer-events: none;
  }
}


/* About MIM process flow: 4 columns x 2 rows */
.ksk-top-about-mim .ksk-mim-flow {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px 18px;
}

@media (max-width: 1180px) {
  .ksk-top-about-mim .ksk-mim-flow {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .ksk-top-about-mim .ksk-mim-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Process flow arrows for 4-column layout */
@media (min-width: 901px) {
  .ksk-top-about-mim .ksk-mim-flow__step::after {
    display: inline-flex !important;
    content: "arrow_forward" !important;
  }

  .ksk-top-about-mim .ksk-mim-flow__step--04::after,
  .ksk-top-about-mim .ksk-mim-flow__step--08::after {
    display: none !important;
    content: none !important;
  }

  .ksk-top-about-mim .ksk-mim-flow__step--04::before,
  .ksk-top-about-mim .ksk-mim-flow__step--07::before {
    display: none !important;
    content: none !important;
  }

  .ksk-top-about-mim .ksk-mim-flow__step--05::before {
    content: "arrow_forward";
    position: absolute;
    top: 50%;
    left: -20px;
    z-index: 3;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: var(--ksk-top-c-primary);
    font-family: "Material Icons Round";
    font-size: 22px;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    transform: translateY(-50%);
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "liga";
    pointer-events: none;
  }
}

@media (max-width: 900px) {
  .ksk-top-about-mim .ksk-mim-flow__step::before,
  .ksk-top-about-mim .ksk-mim-flow__step::after {
    display: none !important;
    content: none !important;
  }
}


/* Give About MIM process flow more horizontal room */
.ksk-top-about-mim__inner {
  grid-template-columns: minmax(0, 0.82fr) minmax(620px, 1.18fr);
  gap: 44px;
}

@media (max-width: 1180px) {
  .ksk-top-about-mim__inner {
    grid-template-columns: 1fr;
  }
}


/* Popular section wider and without white card frames */
.ksk-top-rank-section > .ksk-top-sec-head,
.ksk-top-rank-section > .ksk-top-rank-board,
.ksk-top-rank-section > .ksk-top-more,
.ksk-top-rank-section > .ksk-top-empty {
  max-width: 1480px;
}

.ksk-top-rank-card__link {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.ksk-top-rank-card__link:hover {
  border-color: transparent;
  box-shadow: none;
}


/* Extend About MIM flow background across the full right column */
.ksk-top-about-mim__visual {
  align-self: stretch;
  background: #f2faf6;
}


/* Popular more button hover on green background */
.ksk-top-rank-section .ksk-top-more__link:hover,
.ksk-top-rank-section .ksk-top-more__link:focus {
  background: #f2f4f3;
  border-color: #f2f4f3;
  color: var(--ksk-top-c-primary);
}


/* Make About MIM process background fill the entire right column */
.ksk-top-about-mim__visual {
  background: #f2faf6;
  border: 1px solid rgba(46, 168, 117, 0.12);
  border-radius: var(--ksk-top-radius-md);
  padding: 30px;
}

.ksk-top-about-mim .ksk-mim-flow {
  height: 100%;
  background: transparent;
  border: 0;
  padding: 0;
}


/* Split About MIM card padding by column */
.ksk-top-about-mim__inner {
  padding: 0;
  overflow: hidden;
}

.ksk-top-about-mim__body {
  padding: 56px 0 56px 56px;
}

.ksk-top-about-mim__visual {
  margin: 0;
  padding: 56px;
  border: 0;
  border-radius: 0;
}

@media (max-width: 1180px) {
  .ksk-top-about-mim__body {
    padding: 40px 40px 0;
  }

  .ksk-top-about-mim__visual {
    padding: 40px;
  }
}

@media (max-width: 600px) {
  .ksk-top-about-mim__body {
    padding: 28px 20px 0;
  }

  .ksk-top-about-mim__visual {
    padding: 22px 20px 28px;
  }
}




/* Enlarge About MIM process text */
.ksk-top-about-mim .ksk-mim-flow__name {
  font-size: var(--fs-s1);
  line-height: 1.45;
}

.ksk-top-about-mim .ksk-mim-flow__desc {
  font-size: var(--fs-s3);
  line-height: 1.72;
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__name {
    font-size: var(--fs-s2);
  }

  .ksk-top-about-mim .ksk-mim-flow__desc {
    font-size: var(--fs-s4);
  }
}


/* Remove border from About MIM process images */
.ksk-top-about-mim .ksk-mim-flow__image {
  border: 0;
}


/* Tighten process heading and enlarge step text slightly */
.ksk-top-about-mim .ksk-mim-flow__caption {
  margin: 0 0 -4px;
  font-size: var(--fs-s1);
}

.ksk-top-about-mim .ksk-mim-flow__name {
  font-size: var(--fs-l1);
  line-height: 1.42;
}

.ksk-top-about-mim .ksk-mim-flow__desc {
  font-size: var(--fs-s2);
  line-height: 1.68;
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__caption {
    margin-bottom: 0;
  }

  .ksk-top-about-mim .ksk-mim-flow__name {
    font-size: var(--fs-s1);
  }

  .ksk-top-about-mim .ksk-mim-flow__desc {
    font-size: var(--fs-s3);
  }
}


/* Keep process numbers away from images */
.ksk-top-about-mim .ksk-mim-flow__step {
  display: block;
}

.ksk-top-about-mim .ksk-mim-flow__num {
  position: static;
  width: auto;
  height: auto;
  justify-content: flex-start;
  margin: 0 0 10px;
  color: var(--ksk-top-c-primary);
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  font-size: var(--fs-s2);
  font-weight: 700;
  line-height: 1;
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__num {
    width: auto;
    height: auto;
    font-size: var(--fs-s3);
  }
}


/* Slightly reduce process step title size */
.ksk-top-about-mim .ksk-mim-flow__name {
  font-size: var(--fs-s1);
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__name {
    font-size: var(--fs-s2);
  }
}


/* Process numbers as standalone circle badges */
.ksk-top-about-mim .ksk-mim-flow__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin: 0 0 10px;
  color: #fff;
  background: var(--ksk-top-c-primary);
  border-radius: 50%;
  box-shadow: 0 6px 14px rgba(46, 168, 117, 0.18);
  font-size: var(--fs-s4);
  line-height: 1;
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__num {
    width: 30px;
    height: 30px;
    font-size: 0.72rem;
  }
}


/* Slightly reduce process description text */
.ksk-top-about-mim .ksk-mim-flow__desc {
  font-size: var(--fs-s3);
}

@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__desc {
    font-size: var(--fs-s4);
  }
}


/* Compact mobile process timeline with down arrows */
@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .ksk-top-about-mim .ksk-mim-flow__step {
    display: grid;
    grid-template-columns: 34px 92px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 10px;
  }

  .ksk-top-about-mim .ksk-mim-flow__step::after {
    content: "arrow_downward" !important;
    position: absolute;
    left: 50%;
    right: auto;
    top: auto;
    bottom: -22px;
    z-index: 3;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    color: var(--ksk-top-c-primary);
    font-family: "Material Icons Round";
    font-size: 20px;
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    transform: translateX(-50%);
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "liga";
    pointer-events: none;
  }

  .ksk-top-about-mim .ksk-mim-flow__step--08::after {
    display: none !important;
    content: none !important;
  }

  .ksk-top-about-mim .ksk-mim-flow__num {
    grid-column: 1;
    grid-row: 1;
    width: 30px;
    height: 30px;
    margin: 0;
  }

  .ksk-top-about-mim .ksk-mim-flow__image {
    grid-column: 2;
    grid-row: 1;
    aspect-ratio: 4 / 3;
    margin: 0;
    background: #fff;
  }

  .ksk-top-about-mim .ksk-mim-flow__content {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
  }

  .ksk-top-about-mim .ksk-mim-flow__name {
    margin: 0 0 2px;
    font-size: var(--fs-s2);
    line-height: 1.35;
  }

  .ksk-top-about-mim .ksk-mim-flow__desc {
    font-size: var(--fs-s4);
    line-height: 1.5;
  }
}


/* Mobile process cards: larger image, top-left number, tighter radius */
@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__step {
    grid-template-columns: minmax(118px, 34%) minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    padding: 12px 16px 12px 12px;
    border-radius: 10px;
  }

  .ksk-top-about-mim .ksk-mim-flow__num {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 4;
    width: 32px;
    height: 32px;
    margin: 0;
    font-size: 0.75rem;
    box-shadow: 0 6px 14px rgba(46, 168, 117, 0.18);
  }

  .ksk-top-about-mim .ksk-mim-flow__image {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    aspect-ratio: 4 / 3;
    margin: 0;
    border-radius: 7px;
  }

  .ksk-top-about-mim .ksk-mim-flow__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .ksk-top-about-mim .ksk-mim-flow__content {
    grid-column: 2;
    grid-row: 1;
    padding-left: 2px;
  }

  .ksk-top-about-mim .ksk-mim-flow__name {
    margin: 0 0 6px;
  }
}


/* Mobile process cards: reduce vertical whitespace evenly */
@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow {
    gap: 20px;
  }

  .ksk-top-about-mim .ksk-mim-flow__step {
    min-height: 0;
    padding: 14px 16px 14px 12px;
  }

  .ksk-top-about-mim .ksk-mim-flow__image {
    aspect-ratio: 1 / 1;
    max-height: 112px;
  }

  .ksk-top-about-mim .ksk-mim-flow__step::after {
    bottom: -20px;
  }

  .ksk-top-about-mim .ksk-mim-flow__desc {
    margin: 0;
  }
}


/* Tighten mobile process card inner gap */
@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__step {
    gap: 8px;
    grid-template-columns: minmax(112px, 32%) minmax(0, 1fr);
  }
}


/* Remove mobile process card inner gap */
@media (max-width: 767px) {
  .ksk-top-about-mim .ksk-mim-flow__step {
    gap: 0;
  }

  .ksk-top-about-mim .ksk-mim-flow__content {
    padding-left: 10px;
  }
}


/* Mobile process card compact padding requested */
@media (max-width: 767px) {
  .ksk-mim-flow__image img {
    padding: 16px;
    box-sizing: border-box;
  }

  .ksk-top-about-mim .ksk-mim-flow__step {
    min-height: 0;
    padding: 0px 8px 0px 6px;
  }
}


/* Article CTA buttons use the same yellow as the header CTA */
body:not(.page-template-page-ksk-top) .entry-content .feature-box-button,
body:not(.page-template-page-ksk-top) .entry-content .ksk-feature-button,
body:not(.page-template-page-ksk-top) .entry-content .btn.raised.accent-bc.strong,
body:not(.page-template-page-ksk-top) .entry-content a.btn.raised.accent-bc.strong {
  background: #fff45a !important;
  background-color: #fff45a !important;
  color: #2ea875 !important;
  border: 1px solid #2ea875 !important;
  border-bottom: 1px solid #2ea875 !important;
  box-shadow: none;
}

body:not(.page-template-page-ksk-top) .entry-content .feature-box-button:hover,
body:not(.page-template-page-ksk-top) .entry-content .feature-box-button:focus,
body:not(.page-template-page-ksk-top) .entry-content .ksk-feature-button:hover,
body:not(.page-template-page-ksk-top) .entry-content .ksk-feature-button:focus,
body:not(.page-template-page-ksk-top) .entry-content .btn.raised.accent-bc.strong:hover,
body:not(.page-template-page-ksk-top) .entry-content .btn.raised.accent-bc.strong:focus,
body:not(.page-template-page-ksk-top) .entry-content a.btn.raised.accent-bc.strong:hover,
body:not(.page-template-page-ksk-top) .entry-content a.btn.raised.accent-bc.strong:focus {
  background: #f0e232 !important;
  background-color: #f0e232 !important;
  color: #2ea875 !important;
  border-color: #247a5a !important;
  opacity: 1;
  text-decoration: none !important;
}


/* Ranking page number badges */
body.page-id-49 .entry-content .catpost-cards {
  counter-reset: ksk-ranking;
}

body.page-id-49 .entry-content .catpost-cards .c_linkto_wrap {
  counter-increment: ksk-ranking;
}

body.page-id-49 .entry-content .catpost-cards .c_linkto {
  position: relative;
  overflow: hidden;
}

body.page-id-49 .entry-content .catpost-cards .c_linkto::before {
  content: counter(ksk-ranking);
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: #fff;
  background: linear-gradient(135deg, #d8dde3 0%, #aab2bd 100%);
  border-radius: 8px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
  font-size: 1.18rem;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
}

body.page-id-49 .entry-content .catpost-cards .c_linkto_wrap:nth-child(1) .c_linkto::before {
  background: linear-gradient(135deg, #fff4a3 0%, #e0bd3a 44%, #b98a16 100%);
}

body.page-id-49 .entry-content .catpost-cards .c_linkto_wrap:nth-child(2) .c_linkto::before {
  background: linear-gradient(135deg, #f4f7f9 0%, #bec6cf 48%, #8e98a3 100%);
}

body.page-id-49 .entry-content .catpost-cards .c_linkto_wrap:nth-child(3) .c_linkto::before {
  background: linear-gradient(135deg, #f4bf7b 0%, #cd7f32 48%, #94501e 100%);
}

@media (max-width: 767px) {
  body.page-id-49 .entry-content .catpost-cards .c_linkto::before {
    top: 10px;
    left: 10px;
    width: 36px;
    height: 36px;
    border-radius: 7px;
    font-size: 1rem;
  }
}


.ksk-after-content-cta__title{
position: relative;
    margin: 3em 0 1.2em;
    padding: 0 0 0.72em;
    background: transparent;
    border: 0;
    border-bottom: 2px solid rgba(46, 168, 117, 0.18);
    color: #333;
    font-weight: 700;
    line-height: 1.55;
	    font-size: 20px !important;
  }


.ksk-after-content-cta__title::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 72px;
    height: 2px;
    background: #2ea875;
}


/* /blog/102/ 記事内MIMセクション用：single-viralテンプレート時のみ反映 */
.post-template-single-viral .ksk-article-mim {
  --ksk-top-c-primary: #2ea875;
  --ksk-top-c-primary-dark: #247a5a;
  --ksk-top-c-primary-light: #3dc18a;
  --ksk-top-c-accent: #2ea875;
  --ksk-top-c-accent-dark: #247a5a;

  --ksk-top-c-text: #333;
  --ksk-top-c-muted: #666;
  --ksk-top-c-line: #d4d4d4;
  --ksk-top-c-line-strong: #9e9e9e;
  --ksk-top-c-bg-soft: #ffffff;
  --ksk-top-c-bg-alt: #ffffff;
  --ksk-top-c-box: #ffffff;

  --ksk-top-radius-sm: 6px;
  --ksk-top-radius-md: 12px;
  --ksk-top-radius-lg: 16px;
  --ksk-top-radius-pill: 9999px;

  --ksk-top-c-cta-yellow: #fff45a;
  --ksk-top-c-cta-yellow-hover: #f0e232;
  --ksk-top-c-cta-text: #1f6f51;

  --fs-s4: 11px;
  --fs-s3: 12px;
  --fs-s2: 13px;
  --fs-s1: 14px;
  --fs-m: 16px;
  --fs-l1: 18px;
  --fs-l2: 22px;
  --fs-l3: 28px;
  --fs-l4: 36px;
}

/* h2/h3/h4をdiv化した分の補正 */
.post-template-single-viral .ksk-article-mim .ksk-top-about-mim__feature-title {
  display: block;
  color: var(--ksk-top-c-primary);
  font-size: var(--fs-s1);
  font-weight: 700;
  line-height: 1.45;
  margin: 0 0 2px;
}

.post-template-single-viral .ksk-article-mim .ksk-top-strength__banner-heading {
  display: block;
  color: #fff;
  font-size: var(--fs-l3);
  font-weight: 700;
  line-height: 1.5;
}

.post-template-single-viral .ksk-article-mim .ksk-top-about-mim__title,
.post-template-single-viral .ksk-article-mim .ksk-mim-flow__caption,
.post-template-single-viral .ksk-article-mim .ksk-mim-flow__name,
.post-template-single-viral .ksk-article-mim .ksk-top-strength__name,
.post-template-single-viral .ksk-article-mim .ksk-top-final__title {
  display: block;
}

/* 既存HTML内に残っている矢印要素は使わない */
.post-template-single-viral .ksk-article-mim .ksk-mim-flow__arrow {
  display: none !important;
}

/* プロセスフロー矢印：PC */
.post-template-single-viral .ksk-article-mim .ksk-mim-flow__step::after {
  content: "arrow_forward" !important;
  position: absolute;
  right: -19px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  width: 22px;
  height: 22px;

  color: var(--ksk-top-c-primary);
  font-family: "Material Icons Round";
  font-size: 22px;
  font-weight: normal;
  font-style: normal;
  line-height: 1;

  pointer-events: none;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

/* 4番目・8番目は右矢印なし */
.post-template-single-viral .ksk-article-mim .ksk-mim-flow__step--04::after,
.post-template-single-viral .ksk-article-mim .ksk-mim-flow__step--08::after {
  display: none !important;
  content: none !important;
}

/* SPは下矢印 */
@media (max-width: 767px) {
  .post-template-single-viral .ksk-article-mim .ksk-mim-flow__step::after {
    content: "arrow_downward" !important;
    left: 50%;
    right: auto;
    top: auto;
    bottom: -22px;
    transform: translateX(-50%);
  }

  .post-template-single-viral .ksk-article-mim .ksk-mim-flow__step--08::after {
    display: none !important;
    content: none !important;
  }
}