@charset "utf-8";

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

   CSS変数定義

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

:root {
  /* ========================================

     メインカラー

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

  --color-primary: #2a65a9; /* 青：見出し・強調 */

  --color-secondary: #0a744e; /* 緑：機能・ポイント */

  --color-accent: #f37431; /* オレンジ：CTA */

  --color-danger: #c40003; /* 赤：重要ボタン */

  --color-text: #333;

  --color-white: #fff;

  --color-gray: #ddd;

  --color-bg-gray: #efefef;

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

     フォント

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

  --font-family: "Open Sans", "Arial", "メイリオ", "Meiryo", sans-serif;

  /* PC用サイズ */

  --font-xxl: 44px; /* メインタイトル */

  --font-xl: 36px; /* セクションタイトル */

  --font-lg: 24px; /* サブタイトル・リード */

  --font-md: 20px; /* 大きめ本文 */

  --font-base: 18px; /* 標準本文 */

  --font-sm: 16px; /* 小さめ本文 */

  /* SP用サイズ */

  --font-sp-xxl: 22px; /* メインタイトル */

  --font-sp-xl: 20px; /* セクションタイトル */

  --font-sp-lg: 18px; /* サブタイトル・リード */

  --font-sp-md: 16px; /* 大きめ本文 */

  --font-sp-base: 14px; /* 標準本文 */

  --font-sp-sm: 12px; /* 小さめ本文 */

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

     レイアウト

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

  /* PC用 */

  --width-container: 1100px; /* メインコンテナ */

  --width-cta: 550px; /* CTAエリア */

  /* SP用 */

  --width-sp-container: 95%; /* メインコンテナ */

  --width-sp-cta: 90%; /* CTAエリア */

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

     共通値

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

  --radius-card: 15px; /* カード・ボタンの角丸 */

  --radius-small: 8px; /* 小要素の角丸 */

  /* PC用スペーシング */

  --spacing-section: 100px; /* セクション間隔 */

  --spacing-large: 30px; /* 大きめの余白 */

  --spacing-medium: 20px; /* 標準余白 */

  --spacing-small: 10px; /* 小さめの余白 */

  /* SP用スペーシング */

  --spacing-sp-section: 50px; /* セクション間隔 */

  --spacing-sp-large: 20px; /* 大きめの余白 */

  --spacing-sp-medium: 15px; /* 標準余白 */

  --spacing-sp-small: 5px; /* 小さめの余白 */
}

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

   1. ベース・リセット（共通）

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

body {
  margin: 0;

  font-family: sans-serif;

  line-height: 1.6;

  color: var(--color-text);

  background-color: #f4f4f4;
}

.clearfix::after {
  content: "";

  display: table;

  clear: both;
}

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

   2. ヘッダー（共通）

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

.navi-002-01 header {
  padding: var(--spacing-small) var(--spacing-medium);

  background-color: var(--color-white);

  border-bottom: 1px solid var(--color-gray);
}

.navi-002-01 .logo img {
  max-height: 40px;
}

.main-menu ul {
  display: flex;

  gap: var(--spacing-medium);

  margin: 0;

  padding: 0;

  list-style: none;
}

.main-menu a {
  font-weight: bold;

  color: #007acc;

  text-decoration: none;
}

.header-news {
  padding: var(--spacing-small);

  background-color: #ffc;

  border-bottom: 1px solid #eec;

  text-align: center;
}

.header-news ul {
  display: inline-flex;

  gap: var(--spacing-sp-medium);

  margin: 0;

  padding: 0;

  list-style: none;
}

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

   3. メインビジュアル・FV（共通）

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

.ktbl-k-lgu-fv {
  min-height: 698px;

  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-fv-img2.png)
    no-repeat;

  background-color: #efefef;

  background-size: 100% auto; /* 幅を要素幅にフィットさせ、高さは自動 */
}

.ktbl-fv-catch-area {
  display: block;

  width: var(--width-sp-container);

  max-width: 825px;

  margin: 0 auto;

  padding-top: var(--spacing-large);
}

.ktbl-fv-catch {
  max-width: 625px;

  margin: 0 auto;

  padding: 30px 20px;

  background: #ffffffcf;

  box-sizing: border-box;
}

.ktbl-catch-label {
  display: block;

  padding: var(--spacing-sp-small);

  background: var(--color-secondary);

  border-radius: 5px;

  font-size: 30px;

  font-weight: bold;

  color: var(--color-white);

  text-align: center;
}

.ktbl-fv-catch__main {
  margin-bottom: var(--spacing-large);

  font-size: 50px;

  font-weight: bold;

  line-height: 1.3;

  color: var(--color-secondary);

  text-align: center;
}

.ktbl-catch-large {
  display: block;

  font-size: 76px;

  font-weight: bold;

  color: var(--color-text);

  text-align: center;
}

.ktbl-catch-small {
  font-size: 38px;

  font-weight: bold;

  display: block;

  color: var(--color-text);

  margin-top: 10px;
}

.ktbl-fv-catch__sub {
  text-align: center;
}

.ktbl-fv-sub-ttl {
  position: relative;

  display: inline-block;

  margin: 0 auto 15px;

  padding: var(--spacing-sp-small) var(--spacing-medium);

  background-image: linear-gradient(90deg, var(--color-accent), #ff8700);

  border-radius: 30px;

  font-size: 22px;

  font-weight: bold;

  color: var(--color-white);

  text-align: center;
}

.ktbl-fv-sub-ttl:before,
.ktbl-fv-sub-ttl:after {
  position: absolute;

  top: 50%;

  left: -5%;

  display: block;

  width: 100%;

  max-width: 160px;

  height: 2px;

  background: var(--color-secondary);

  transform: translate(-100%, -50%);

  content: "";
}

.ktbl-fv-sub-ttl:after {
  right: -5%;

  left: auto;

  transform: translate(100%, -50%);
}

.ktbl-fv-sub-list {
  text-align: left;
}

.ktbl-fv-sub-list li {
  position: relative;

  display: inline-block;

  margin-bottom: var(--spacing-small);

  padding-left: 2rem;

  background: linear-gradient(
      to right,
      transparent 0 1.5em,
      var(--color-accent) 1.5em 100%
    )
    bottom left / 100% 2px no-repeat;

  box-sizing: border-box;

  font-size: 22px;

  overflow: visible;

  font-weight: bold;
}

.ktbl-fv-sub-list li:before {
  position: absolute;

  top: 60%;

  left: 0;

  transform: translateY(-50%);

  content: url("/wp-content/themes/kotobal_theme/img/k-lgu/check-icon.png");
}

p.ktbl-fv-lead {
  width: 100%;

  padding: 20px;

  background: var(--color-white);

  border: 7px solid #10a46f;

  box-sizing: border-box;

  font-size: 24px;

  font-weight: bold;

  text-align: center;

  border-radius: 10px;
}

p.ktbl-fv-lead span {
  font-weight: bold;

  color: #f17839;
}

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

   4. スライダー（共通）

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

.ktbl-k-lgu-slider .slick-slide {
  margin: 0 15px;
}

.ktbl-k-lgu-slider .slick-arrow {
  z-index: 2;
}

.ktbl-k-lgu-slider .slick-prev:before,
.ktbl-k-lgu-slider .slick-next:before {
  content: unset;

  font-size: 60px;

  color: var(--color-text);
}

.slick-dots li button:before,
.slick-dots li.slick-active button:before {
  content: unset;
}

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

   5. ホバーエフェクト（共通）

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

.ktbl-k-lgu-wrap a:hover .ktbl-casestudy-item-link {
  opacity: 1;

  background: linear-gradient(to right, #006fde 0%, #8bc5ff 100%);

  color: var(--color-white);
}

.ktbl-floating-bnr a img:hover,
.ktbl-k-lgu-slider a img:hover {
  opacity: 0.7;
}

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

   6. 統計セクション（共通）

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

.ktbl-statistics-text .ktbl-graph-caution {
  display: block;

  margin: var(--spacing-small) 0 0 0;

  padding: var(--spacing-small) 0 0 0;

  border-top: 1px dotted #ccc;

  font-weight: normal;

  color: #666;
}

.ktbl-statistics-text .ktbl-graph-caution a {
  color: #666;
}

p.ktbl-graph-caution {
  /* font-weight: bold; */

  word-break: break-all;
}

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

   7. 課題セクション（共通）

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

.ktbl-issues-subtitle {
  font-size: 27px;

  font-weight: bold;
}

.ktbl-issues-subtitle span {
  font-weight: bold;

  color: var(--color-primary);
}

.ktbl-issues-item {
  background: var(--color-white);

  border-radius: var(--radius-card);

  text-align: center;
}

.ktbl-issues-item img {
  width: 100%;

  height: auto;

  padding: 15px var(--spacing-medium) var(--spacing-small);

  box-sizing: border-box;
}

.ktbl-issues-item-title {
  margin: 0;

  padding: var(--spacing-small) 0;

  background: var(--color-primary);

  border-radius: var(--radius-card) var(--radius-card) 0 0;

  font-size: var(--font-md);

  font-weight: bold;

  color: var(--color-white);
}

.ktbl-issues-item-text p {
  padding: 5px 25px 32px;

  font-size: var(--font-sm);

  font-weight: bold;

  line-height: 29px;

  text-align: left;
}

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

   8. CTAセクション（共通）

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

.ktbl-cta-wrap {
  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-bg-cv-area.png)
    no-repeat;

  background-size: cover;

  text-align: center;
}

.ktbl-cta-tct-area img {
  display: block;

  margin: 0 auto;
}

a.ktbl-cta-button {
  position: relative;

  display: block;

  border-radius: var(--radius-card);

  font-weight: bold;

  color: var(--color-white);

  text-align: center;

  text-decoration: none;
}

a.ktbl-cta-button img {
  position: relative;

  top: -3px;

  left: 5px;

  display: inline-block;
}

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

   9. 動画セクション（共通）

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

.ktbl-video-iframe {
  position: relative;

  margin: 0 auto;

  border-radius: var(--radius-small);

  overflow: hidden;
}

.ktbl-video-iframe iframe {
  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border: 0;
}

.ktbl-video-inner {
  background: var(--color-white);
}

.ktbl-video-subtitle {
  font-weight: bold;

  color: #555;

  text-align: center;
}

.ktbl-video-subtitle span {
  font-weight: bold;

  color: var(--color-primary);
}

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

   10. 比較表（共通）

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

.ktbl-compare-table {
  width: 100%;

  border-collapse: collapse;

  font-size: 0.9rem;

  text-align: center;
}

.ktbl-compare-table th,
.ktbl-compare-table td {
  padding: 25px var(--spacing-large);

  background: var(--color-white);

  vertical-align: middle;

  font-size: var(--font-base);

  font-weight: bold;

  color: var(--color-text);
}

.ktbl-compare-table td ul {
  padding: 0 0 0 22px;

  font-weight: bold;

  list-style: disc;

  text-align: left;
}

.ktbl-compare-table td ul li {
  font-weight: bold;
}

.ktbl-compare-table .ktbl-compare-label {
  background: #f7f7f7;

  font-weight: bold;

  text-align: left;
}

.ktbl-compare-table img {
  height: auto;
}

.ktbl-compare-table td:nth-child(4) {
  border: 3px solid var(--color-primary);
}

/* 比較表タイトル */

.ktbl-compare-title {
  margin-bottom: 40px;

  font-size: var(--font-xl);

  font-weight: bold;

  color: var(--color-text);

  text-align: center;
}

.ktbl-compare-title span {
  font-size: var(--font-xxl);

  font-weight: bold;

  color: var(--color-secondary);
}

.ktbl-compare-title:after {
  display: block;

  width: 88px;

  margin: 16px auto var(--spacing-medium);

  border-top: 3px solid var(--color-secondary);

  content: "";
}

.ktbl-compare-lead {
  margin-bottom: var(--spacing-large);

  font-size: var(--font-sp-md);

  font-weight: bold;

  text-align: center;
}

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

   11. 機能セクション（共通）

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

.ktbl-feature-wrap {
  margin: 0;
}

.ktbl-feature-item {
  background: var(--color-white);

  border-radius: var(--radius-card);

  text-align: center;
}

.ktbl-feature-item img {
  width: 52%;

  height: auto;

  margin-bottom: 1rem;

  border-radius: var(--radius-small);
}

.ktbl-feature-item-text p {
  padding: 5px 25px 32px;

  font-weight: bold;

  text-align: left;
}

.ktbl-feature-subtitle {
  font-weight: bold;

  color: #555;

  text-align: center;
}

.ktbl-feature-subtitle span {
  font-weight: bold;

  color: var(--color-primary);
}

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

   12. ケーススタディ（共通）

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

.ktbl-casestudy-wrap {
  margin: 0;

  text-align: center;
}

.ktbl-casestudy-subtitle {
  margin-bottom: 2rem;

  font-size: 1rem;

  color: #555;

  text-align: center;
}

.ktbl-casestudy-item {
  background: var(--color-white);

  border-radius: var(--radius-card);

  text-align: center;
}

.ktbl-casestudy-txt {
  position: relative;

  height: 300px;
}

.ktbl-casestudy-bttom-txt {
  position: absolute;

  bottom: 0;

  width: 100%;

  padding: 0 0 15px 0;

  background: var(--color-text);
}

.ktbl-casestudy-txt.ktbl-casestudy-img01 {
  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-casestudy-img01.png)
    no-repeat;
}

.ktbl-casestudy-txt.ktbl-casestudy-img02 {
  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-casestudy-img02.png)
    no-repeat;
}

.ktbl-casestudy-txt.ktbl-casestudy-img03 {
  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-casestudy-img03.png)
    no-repeat;
}

.ktbl-casestudy-item h3:after {
  display: block;

  width: 86px;

  margin: 16px auto 0;

  border-top: 3px solid var(--color-secondary);

  content: "";
}

.ktbl-casestudy-item-title {
  margin: var(--spacing-medium) var(--spacing-medium) 0;

  padding: 0;

  background: var(--color-white);

  border-radius: 20px;

  font-size: var(--font-base);

  font-weight: bold;

  color: var(--color-primary);
}

.ktbl-casestudy-item-text {
  margin: var(--spacing-small) 0 0 0;

  font-size: var(--font-md);

  font-weight: bold;

  color: var(--color-white);
}

.ktbl-casestudy-item-link {
  display: block;

  padding: 12px 0;

  border-radius: 0 0 var(--radius-card) var(--radius-card);

  font-size: var(--font-base);

  font-weight: bold;

  color: var(--color-white);

  text-decoration: none;
}

/* ケーススタディ専用スタイル */

.ktbl-casestudy-title .ktbl-title-label {
  display: inline-block;

  margin-bottom: var(--spacing-medium);

  padding: var(--spacing-small) 40px;

  background-image: linear-gradient(90deg, var(--color-accent), #ff8700);

  border-radius: 50px;

  font-size: var(--font-xl);

  font-weight: bold;
}

.ktbl-casestudy-title .ktbl-title-large {
  font-size: 56px;

  font-weight: bold;
}

.ktbl-casestudy-title:after {
  display: block;

  width: 88px;

  margin: 16px auto var(--spacing-medium);

  border-top: 3px solid var(--color-accent);

  content: "";
}

.ktbl-case-lead {
  margin-bottom: 100px;

  font-size: var(--font-lg);

  font-weight: bold;

  color: var(--color-white);
}

.ktbl-case-number {
  display: flex;

  justify-content: center;

  align-items: center;

  width: 98px;

  height: 98px;

  margin: 0 auto;

  background: var(--color-white);

  border-radius: 50px;

  font-size: 73px;

  font-weight: bold;

  color: var(--color-secondary);
}

.ktbl-number-area {
  margin-top: -80px;
}

.ktbl-number-area .ktbl-reason {
  position: relative;

  display: inline-block;

  padding: 0 24px;

  font-size: var(--font-lg);

  font-weight: bold;

  color: var(--color-white);
}

.ktbl-number-area .ktbl-reason:before,
.ktbl-number-area .ktbl-reason:after {
  position: absolute;

  top: 50%;

  width: 24px;

  height: 3px;

  background: var(--color-white);

  border-radius: 20px;

  content: "";
}

.ktbl-number-area .ktbl-reason:before {
  left: 0;

  transform: translateY(-50%) rotate(60deg);
}

.ktbl-number-area .ktbl-reason:after {
  right: 0;

  transform: translateY(-50%) rotate(-60deg);
}

.ktbl-casestudy-item .ktbl-item-lead {
  margin-bottom: var(--spacing-medium);

  font-size: var(--font-md);

  font-weight: bold;

  color: var(--color-text);
}

.ktbl-caseitem-imgarea {
  position: relative;

  margin-bottom: var(--spacing-medium);
}

.ktbl-imgarea-label {
  position: absolute;

  right: 0;

  bottom: 0;

  display: inline-block;

  padding: 5px var(--spacing-small);

  background: #000;

  color: var(--color-white);
}

.ktbl-caseitem-reviews {
  position: relative;

  display: flex;

  justify-content: center;

  align-items: center;

  min-height: 191px;

  margin: var(--spacing-medium) 15px;

  padding: var(--spacing-large) var(--spacing-medium) var(--spacing-large) 10%;

  border: 3px solid var(--color-secondary);

  box-sizing: border-box;

  font-size: 26px;

  font-weight: bold;

  color: var(--color-text);
}

.ktbl-caseitem-reviews:before {
  position: absolute;

  left: 3%;

  width: 43px;

  height: 37px;

  margin-right: var(--spacing-small);

  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/voice-icon.png)
    no-repeat;

  content: "";
}

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

   13. シーンセクション（共通）

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

section.ktbl-usage-scene-wrap {
  margin: 0;

  padding: 0 0 var(--spacing-section) 0;

  background: #dbf2e2;
}

section.ktbl-new-features-wrap {
  margin: 0;

  padding: 0 0 var(--spacing-section) 0;

  background-size: cover;
}

.ktbl-scene-inner {
  width: var(--width-container);

  margin: 0 auto;

  padding: var(--spacing-section) 0 0;

  box-sizing: border-box;
}

.ktbl-scene-title {
  margin-bottom: 40px;

  font-size: var(--font-xl);

  font-weight: bold;

  color: var(--color-text);

  text-align: center;
}

.ktbl-scene-title span {
  font-size: var(--font-xxl);

  font-weight: bold;

  color: var(--color-secondary);
}

.ktbl-scene-title:after {
  display: block;

  width: 88px;

  margin: 16px auto var(--spacing-medium);

  border-top: 3px solid var(--color-secondary);

  content: "";
}

.ktbl-scene-itme {
  display: flex;

  justify-content: space-between;

  align-items: center;

  gap: 2rem;

  margin-bottom: 60px;

  flex-wrap: wrap;
}

.ktbl-scene-img {
  width: 380px;

  box-shadow: 4px 4px 2px #0a745c;
}

.ktbl-scene-img img {
  display: block;
}

.ktbl-scene-txt {
  width: 62%;
}

.ktbl-scene-txt .ktbl-scene-lead {
  display: inline-block;

  margin-bottom: 5px;

  padding: var(--spacing-sp-small);

  background: var(--color-secondary);

  border-radius: 30px;

  font-size: var(--font-lg);

  font-weight: bold;

  color: var(--color-white);
}

.ktbl-scene-txt h3 {
  margin-bottom: var(--spacing-small);

  font-size: 29px;

  font-weight: bold;

  line-height: 1.3;

  color: var(--color-secondary);
}

.ktbl-scene-explanation {
  padding: var(--spacing-medium) var(--spacing-large);

  background: var(--color-white);

  font-size: var(--font-md);

  font-weight: bold;
}

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

   14. 新機能セクション（共通）

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

.ktbl-new-futures-inner {
  width: var(--width-container);

  margin: var(--spacing-section) auto 0;

  padding: 60px;

  background: var(--color-white);

  border: 8px solid #f4f4f4;

  outline: 5px solid var(--color-white);

  box-sizing: border-box;
}

.ktbl-new-features-title {
  position: relative;

  display: block;

  margin: 0 auto 40px;

  padding-left: 10%;

  font-size: var(--font-xl);

  font-weight: bold;

  color: var(--color-text);

  text-align: center;
}

.ktbl-new-features-title span {
  font-size: var(--font-xxl);

  font-weight: bold;

  color: var(--color-secondary);
}

.ktbl-new-features-title:before {
  position: absolute;

  top: 0;

  left: 6%;

  display: block;

  width: 233px;

  height: 117px;

  background: url(/wp-content/themes/kotobal_theme/img/k-lgu/check-img.png)
    no-repeat;

  background-size: contain;

  content: "";
}

.ktbl-new-features-title:after {
  display: block;

  width: 88px;

  margin: 16px auto var(--spacing-medium);

  border-top: 3px solid var(--color-secondary);

  content: "";
}

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

   15. フローティングバナー（共通）

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

.ktbl-floating-bnr,
.ktbl-floating-bnr-sp {
  position: fixed;

  z-index: 50;

  display: none;

  padding: 15px;

  border-radius: var(--radius-small);

  color: white;

  text-align: center;
}

.ktbl-floating-bnr a,
.ktbl-floating-bnr-sp a {
  font-weight: bold;

  color: white;

  text-decoration: none;
}

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

   16. フッター（共通）

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

.foot {
  padding: 2rem;

  background: var(--color-text);

  color: var(--color-white);
}

.foot a {
  color: var(--color-white);

  text-decoration: none;
}

.foot-copyright {
  margin-top: 2rem;

  font-size: 0.8rem;

  color: #aaa;

  text-align: center;
}

.ktbl-k-lgu-catch-footer {
  margin: 80px auto 88px;

  background: var(--color-white);

  border: 5px solid var(--color-primary);

  border-radius: var(--radius-card);
}

.ktbl-k-lgu-catch-footer h2 {
  margin-bottom: 0.5rem;

  font-weight: bold;

  line-height: 53px;

  color: var(--color-primary);

  text-align: center;

  white-space: normal;
}

.ktbl-cta-button:hover {
  background: linear-gradient(to right, #006fde 0%, #8bc5ff 100%);

  color: var(--color-white);
}

.ktbl-cta-button:hover:before {
  content: none;
}

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

   PC・タブレット版スタイル（min-width: 768px）

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

@media screen and (min-width: 768px) {
  /* レイアウト・構造 */

  .ktbl-k-lgu-inner {
    margin: 0 auto;

    padding: 0;

    font-family: var(--font-family);
  }

  .ktbl-k-lgu-wrap .sp-br {
    display: none;
  }

  /* スライダー */

  .ktbl-k-lgu-wrap .ktbl-k-lgu-slider {
    width: 100%;

    margin: 0 auto 2rem;

    padding: var(--spacing-large) 0;

    background: var(--color-primary);
  }

  .ktbl-k-lgu-slider div.ktbl-k-lgu-slide {
    position: relative;

    display: flex;

    justify-content: center;

    align-items: center;

    min-width: 1060px;

    height: 550px;

    box-sizing: border-box;

    font-size: 2rem;

    color: #555;
  }

  .ktbl-k-lgu-slider .slick-prev {
    left: 50%;

    width: 51px;

    height: 51px;

    margin-left: -575px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-prev-btn.png)
      no-repeat;
  }

  .ktbl-k-lgu-slider .slick-next {
    right: 50%;

    width: 51px;

    height: 51px;

    margin-right: -575px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-next-btn.png)
      no-repeat;
  }

  .ktbl-k-lgu-slider iframe {
    position: absolute;

    top: 43px;

    left: 39px;

    width: 990px;

    height: 437px;
  }

  .slick-dots {
    position: absolute;

    bottom: -45px;

    display: block;

    width: 100%;

    margin: 0;

    padding: 0;

    list-style: none;

    text-align: center;
  }

  .slick-dots li {
    width: 150px;

    border-top: 2px solid #ccc;
  }

  .slick-dots li.slick-active {
    width: 150px;

    border-top: 2px solid var(--color-text);
  }

  .ktbl-slider-txt01 {
    position: absolute;

    top: 147px;

    left: 87px;

    font-size: 41px;

    font-weight: bold;

    color: var(--color-white);

    text-align: center;
  }

  .ktbl-slider-btn01 {
    position: absolute;

    bottom: 207px;

    left: 109px;

    display: block;

    width: 294px;

    height: 30px;

    padding: 11px 3px 15px 58px;

    background: var(--color-danger)
      url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-button-check.png)
      no-repeat;

    background-position: 0px 14px;

    border-radius: 13px;

    font-size: var(--font-lg);

    font-weight: bold;

    color: var(--color-white);

    text-align: center;

    text-decoration: none;
  }

  .ktbl-video-caption {
    position: absolute;

    top: 9px;

    left: 310px;

    font-size: var(--font-lg);

    font-weight: bold;

    color: var(--color-text);
  }

  /* 統計セクション */

  .ktbl-statistics-wrap {
    z-index: 1;

    width: var(--width-container);

    margin: 2rem auto;

    padding: 2rem 0 0 2rem;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-ttl-bg-rowline.png)
      no-repeat;

    background-position: 0px 17px;

    box-sizing: border-box;
  }

  .ktbl-statistics-title {
    margin-bottom: 0.5rem;

    font-size: 1.8rem;

    font-weight: bold;

    color: var(--color-primary);

    text-align: left;
  }

  .ktbl-statistics-title span.ktbl-ttl-bg-area {
    display: block;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-hote-ttl-bg-img.png)
      no-repeat;

    background-position: 123px 0;

    font-weight: bold;
  }

  .ktbl-statistics-title span.ktbl-ttl-sub-area {
    font-size: 40px;

    font-weight: bold;

    color: var(--color-white);
  }

  .ktbl-statistics-content {
    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 2rem;

    flex-wrap: wrap;
  }

  .ktbl-statistics-text p {
    font-size: var(--font-md);

    font-weight: bold;

    line-height: 34px;
  }

  .ktbl-statistics-text .ktbl-graph-caution {
    font-size: 13px;

    line-height: 21px;
  }

  .ktbl-statistics-graph img {
    width: 300px;

    height: auto;

    margin: var(--spacing-small) 0 0 77px;

    border-radius: var(--radius-small);
  }

  /* 課題セクション */

  .ktbl-issues-wrap {
    z-index: 1;

    width: var(--width-container);

    margin: 2rem auto;

    padding: 2rem 2rem 0 0;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-ttl-bg-rowline-right.png)
      no-repeat;

    background-position: right 25px;

    box-sizing: border-box;
  }

  .ktbl-issues-title {
    margin-bottom: 0.5rem;

    font-size: 1.8rem;

    font-weight: bold;

    color: var(--color-primary);

    text-align: right;
  }

  .ktbl-issues-title span.ktbl-ttl-bg-area {
    display: block;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-hote-ttl-bg-img-left.png)
      no-repeat;

    background-position: -5px;

    font-weight: bold;
  }

  .ktbl-issues-title span.ktbl-ttl-sub-area {
    font-size: 40px;

    color: var(--color-white);
  }

  .ktbl-issues-subtitle {
    margin: 33px 0;

    padding: 0 0 19px 0;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-under-line.png)
      no-repeat;

    background-position: center bottom;

    background-size: 56%;

    font-size: 27px;

    font-weight: bold;

    color: var(--color-text);

    text-align: center;
  }

  .ktbl-issues-list {
    display: flex;

    justify-content: space-between;

    gap: 2rem;

    flex-wrap: wrap;
  }

  .ktbl-issues-item {
    flex: 1 1 30%;
  }

  /* CTAセクション */

  .ktbl-cta-wrap {
    margin: -205px 0 0 0;

    padding: 178px 0 120px 0;
  }

  .ktbl-cta-button-area {
    width: var(--width-cta);

    margin: 35px auto 0;
  }

  .ktbl-cta-button-area span {
    position: relative;

    z-index: 1;

    display: block;

    width: 530px;

    margin: 0 auto -20px;

    background: var(--color-white);

    border: 3px solid var(--color-accent);

    border-radius: var(--radius-card);

    font-size: var(--font-md);

    font-weight: bold;

    color: var(--color-accent);

    text-align: center;
  }

  a.ktbl-cta-button {
    padding: 26px 0 14px;

    background: var(--color-accent);

    font-size: 26px;
  }

  a.ktbl-cta-button::before {
    position: absolute;

    top: 38%;

    left: -33px;

    display: block;

    width: 72px;

    height: 28px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-button-check.png)
      no-repeat;

    content: "";
  }

  /* 動画セクション */

  .ktbl-video-wrap {
    width: var(--width-container);

    margin: 0 auto;

    padding: 15px;

    border: 10px solid var(--color-white);

    box-sizing: border-box;
  }

  .ktbl-video-title {
    display: block;

    margin: 0 auto 0 97px;

    padding: 0 0 0 152px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-video-icon.png)
      no-repeat;

    font-size: 32px;

    font-weight: bold;

    color: var(--color-text);
  }

  .ktbl-video-title span {
    font-size: 40px;

    font-weight: bold;

    color: var(--color-primary);
  }

  .ktbl-video-iframe {
    width: 800px;

    height: 500px;
  }

  .ktbl-video-inner {
    padding: 35px 0;
  }

  .ktbl-video-subtitle {
    margin: var(--spacing-large) 0 35px 0;

    font-size: var(--font-lg);

    line-height: 45px;
  }

  /* 比較表 */

  .ktbl-compare-wrap,
  .ktbl-download-wrap,
  .ktbl-final-download-wrap {
    width: var(--width-container);

    margin: 2rem auto;

    padding: 0;

    box-sizing: border-box;
  }

  .ktbl-compare-wrap {
    padding: 50px 0 var(--spacing-section);

    overflow-x: auto;
  }

  .ktbl-mobile-scroll-note {
    display: none;
  }

  .ktbl-compare-table th,
  .ktbl-compare-table td {
    padding: 25px var(--spacing-large);

    border: 3px solid #dddddd;

    border-right: none;
  }

  .ktbl-compare-table th:first-child {
    width: 13%;

    background: #98aab5;

    border: 1px solid #eaeaea;

    font-size: var(--font-lg);

    font-weight: bold;

    text-align: center;
  }

  .ktbl-compare-table th {
    width: 23%;

    background: #eaeaea;

    border-top: 4px solid #eaeaea;

    border-bottom: 3px solid #eaeaea;

    border-left: 3px solid #eaeaea;

    font-size: var(--font-lg);

    font-weight: bold;

    text-align: center;
  }

  .ktbl-compare-table th:nth-child(4) {
    background: var(--color-primary);

    border: 3px solid var(--color-primary);

    font-size: var(--font-lg);

    font-weight: bold;

    color: var(--color-white);

    text-align: center;
  }

  .ktbl-compare-table td:first-child {
    background: #98aab5;

    border: 3px solid var(--color-gray);

    font-size: var(--font-base);

    color: var(--color-white);

    text-align: center;

    vertical-align: middle;
  }

  .ktbl-compare-table td:nth-child(2) {
    background: var(--color-white);

    border-top: 3px solid var(--color-gray);

    border-bottom: 3px solid var(--color-gray);

    border-left: 3px solid var(--color-gray);

    vertical-align: middle;
  }

  .ktbl-conpare-mark-circle {
    font-size: 90px;

    font-weight: bold;

    color: var(--color-primary);
  }

  .ktbl-conpare-mark-xross {
    font-size: 60px;

    font-weight: bold;
  }

  /* 機能セクション */

  .ktbl-feature-wrap {
    padding: 50px 0 var(--spacing-section);

    background: var(--color-bg-gray);
  }

  .ktbl-feature-inner {
    width: var(--width-container);

    margin: 2rem auto 0;

    padding: 0;

    box-sizing: border-box;
  }

  .ktbl-feature-title {
    margin-bottom: 40px;

    font-size: var(--font-xl);

    font-weight: bold;

    color: var(--color-text);

    text-align: center;
  }

  .ktbl-feature-title::after {
    display: block;

    width: 88px;

    margin: 16px auto var(--spacing-medium);

    border-top: 3px solid var(--color-secondary);

    content: "";
  }

  .ktbl-feature-title span.ktbl-feature-sub-title {
    display: inline-block;

    margin: 0 0 var(--spacing-small) 0;

    background: #0a74bd;

    border-radius: 40px;

    font-weight: bold;

    color: var(--color-white);
  }

  .ktbl-feature-title span {
    font-size: var(--font-xxl);

    font-weight: bold;

    color: var(--color-secondary);
  }

  .ktbl-feature-subtitle {
    margin: var(--spacing-large) 0 35px 0;

    font-size: var(--font-lg);

    line-height: 45px;
  }

  .ktbl-feature-list {
    display: flex;

    justify-content: space-around;

    gap: 1.5rem;

    margin-bottom: var(--spacing-large);

    flex-wrap: wrap;
  }

  .ktbl-feature-item {
    flex: 1 1 30%;

    border: 3px solid var(--color-secondary);

    box-shadow: 2px 4px 1px var(--color-secondary);
  }

  .ktbl-feature-item-title {
    display: flex;

    justify-content: center;

    align-items: center;

    flex-direction: column;

    flex-wrap: wrap;

    min-height: 142px;

    margin: var(--spacing-large) 0 var(--spacing-medium) 0;

    font-size: 26px;

    font-weight: bold;

    line-height: 1.3;

    color: var(--color-secondary);
  }

  .ktbl-feature-item-title::after {
    display: block;

    width: 50px;

    margin: 16px auto var(--spacing-medium);

    border-top: 3px solid var(--color-secondary);

    content: "";
  }

  .ktbl-feature-item-text p {
    font-size: var(--font-base);

    line-height: 33px;
  }

  /* ケーススタディ */

  .ktbl-casestudy-wrap {
    padding: 0 0 var(--spacing-section) 0;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/green-bg.png)
      no-repeat;

    background-size: cover;
  }

  .ktbl-casestudy-inner {
    width: var(--width-container);

    margin: 0 auto;

    padding: var(--spacing-section) 0 0;

    box-sizing: border-box;
  }

  .ktbl-casestudy-title {
    margin-bottom: 40px;

    font-size: var(--font-xxl);

    font-weight: bold;

    line-height: 1.3;

    color: var(--color-white);

    text-align: center;
  }

  .ktbl-casestudy-list {
    display: flex;

    justify-content: space-around;

    gap: 2rem;

    flex-wrap: wrap;
  }

  .ktbl-casestudy-item {
    flex: 1 1 48%;

    margin-bottom: 80px;

    text-decoration: unset;
  }

  .ktbl-casestudy-item h3 {
    position: relative;

    padding: 0 0 15px;

    background-position: 13px center;

    font-size: 29px;

    font-weight: bold;

    color: var(--color-secondary);
  }

  .ktbl-casestudy-item img {
    width: 100%;

    height: auto;
  }

  .ktbl-casestudy-item-link {
    background: #000000
      url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-button-check-green.png)
      no-repeat;

    background-position: left 18% center;
  }

  /* フローティングバナー */

  .ktbl-floating-btn-area {
    position: absolute;

    bottom: 11px;

    right: 17px;

    width: 86%;
  }

  .ktbl-floating-btn-area img {
    width: 100%;
  }

  .ktbl-floating-bnr {
    bottom: 8rem;

    right: 0;

    width: 230px;

    height: auto;

    padding: 0;
  }

  .ktbl-floating-bnr-sp {
    bottom: 0;

    left: 0;

    width: 100%;

    height: auto;

    border-radius: 0;
  }

  .ktbl-floating-bnr a,
  .ktbl-floating-bnr-sp a {
    background: var(--color-white);

    border-radius: 7px;

    margin-bottom: 5px;

    display: block;
  }

  .ktbl-k-lgu-catch-footer {
    width: 750px;
  }

  .ktbl-k-lgu-catch-footer h2 {
    font-size: 32px;
  }

  div#my-gallery a {
    pointer-events: none;
  }
}

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

   タブレット版スタイル（max-width: 1100px）

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

@media screen and (min-width: 768px) and (max-width: 1100px) {
  .ktbl-compare-wrap,
  .ktbl-download-wrap,
  .ktbl-final-download-wrap {
    width: var(--width-sp-container);
  }

  .ktbl-casestudy-inner {
    width: var(--width-sp-container);
  }

  .ktbl-feature-inner {
    width: var(--width-sp-container);
  }

  .ktbl-scene-inner {
    width: var(--width-sp-container);
  }

  .ktbl-new-futures-inner {
    width: var(--width-sp-container);
  }

  .ktbl-scene-img {
    width: 35%;
  }

  .ktbl-scene-txt {
    width: 60%;
  }

  .ktbl-caseitem-reviews {
    font-size: 20px;

    padding-left: 60px;
  }

  .ktbl-casestudy-item-link {
    background-position: left 9% center;

    padding-left: 30px;
  }

  .ktbl-casestudy-item .ktbl-item-lead {
    font-size: 18px;
  }

  .ktbl-casestudy-item h3 {
    font-size: 26px;
  }

  .ktbl-new-features-title:before {
    left: -4%;
  }

  .ktbl-new-features-title {
    padding-left: 20%;
  }
}

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

   SP版スタイル（max-width: 767px）

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

@media screen and (max-width: 767px) {
  /* レイアウト・構造 */

  .ktbl-k-lgu-inner {
    margin: 0 auto;

    font-family: var(--font-family);
  }

  .ktbl-k-lgu-wrap .pc-br {
    display: none;
  }

  /* スライダー */

  .ktbl-k-lgu-wrap .ktbl-k-lgu-slider {
    width: 100%;

    margin: 0 auto 2rem;

    padding: var(--spacing-sp-medium) 0;

    background: var(--color-primary);
  }

  .ktbl-k-lgu-slider h1 {
    margin: 0;

    padding: 0;
  }

  .ktbl-k-lgu-slider div.ktbl-k-lgu-slide {
    position: relative;

    box-sizing: border-box;

    font-size: 2rem;

    color: #555;
  }

  .ktbl-k-lgu-slider div.ktbl-k-lgu-slide img {
    width: 370px;
  }

  .ktbl-k-lgu-slider .slick-prev {
    left: 5%;

    width: 25px;

    height: 25px;

    margin-left: -15px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-prev-btn.png)
      no-repeat;

    background-size: cover;
  }

  .ktbl-k-lgu-slider .slick-next {
    right: 5%;

    width: 25px;

    height: 25px;

    margin-right: -15px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-next-btn.png)
      no-repeat;

    background-size: cover;
  }

  .ktbl-k-lgu-slider iframe {
    position: absolute;

    top: 20px;

    left: 7px;

    width: 96%;
  }

  .slick-dots li {
    width: 50px;

    border-top: 2px solid #ccc;
  }

  .slick-dots li.slick-active {
    width: 50px;

    border-top: 2px solid var(--color-text);
  }

  .ktbl-slider-txt01 {
    position: absolute;

    top: 45px;

    left: 30px;

    font-size: var(--font-sp-base);

    font-weight: bold;

    color: var(--color-white);

    text-align: center;
  }

  .ktbl-slider-btn01 {
    position: absolute;

    bottom: 49px;

    left: 36px;

    display: block;

    width: 119px;

    padding: 5px 3px 5px 0;

    background: var(--color-danger);

    background-position: 0px 14px;

    border-radius: 4px;

    font-size: var(--font-sp-base);

    font-weight: bold;

    color: var(--color-white);

    text-align: center;

    text-decoration: none;
  }

  .ktbl-video-caption {
    position: absolute;

    top: 2px;

    left: 65px;

    font-size: var(--font-sp-sm);

    font-weight: bold;

    color: var(--color-text);
  }

  /* 統計セクション */

  .ktbl-statistics-wrap {
    width: 100%;

    padding: 0;

    background: none;

    font-size: var(--font-sp-xxl);
  }

  .ktbl-statistics-title,
  .ktbl-issues-title,
  .ktbl-video-title,
  .ktbl-feature-title,
  .ktbl-casestudy-title {
    margin-bottom: 0.5rem;

    font-size: var(--font-sp-xl);

    font-weight: bold;

    color: var(--color-text);

    text-align: center;
  }

  .ktbl-statistics-title::after,
  .ktbl-issues-title::after,
  .ktbl-video-title::after {
    display: block;

    width: 50px;

    margin: 16px auto var(--spacing-sp-large);

    border-top: 3px solid #1786d0;

    content: "";
  }

  .ktbl-statistics-title span.ktbl-ttl-bg-area {
    background: none;

    font-weight: bold;
  }

  .ktbl-statistics-title span.ktbl-ttl-sub-area {
    background: var(--color-primary);

    font-size: 27px;

    font-weight: bold;

    color: var(--color-white);
  }

  .ktbl-statistics-content {
    margin: 0;

    padding: 0;

    font-size: 42px;

    line-height: 1.5;

    letter-spacing: 0.04em;
  }

  .ktbl-statistics-text p {
    font-size: var(--font-sp-md);

    font-weight: bold;

    line-height: 28px;
  }

  .ktbl-statistics-text .ktbl-graph-caution {
    font-size: var(--font-sp-sm);

    line-height: 21px;
  }

  .ktbl-statistics-graph img {
    display: block;

    width: 70%;

    max-width: 350px;

    height: auto;

    margin: var(--spacing-sp-large) auto 21px;

    border-radius: var(--radius-small);
  }

  /* 課題セクション */

  .ktbl-issues-wrap {
    width: 100%;

    margin: 70px 0 0 0;

    padding: 0;

    background: none;
  }

  .ktbl-issues-title span.ktbl-ttl-bg-area {
    background: none;

    font-weight: bold;
  }

  .ktbl-issues-title span.ktbl-ttl-sub-area {
    background: var(--color-primary);

    font-size: 25px;

    font-weight: bold;

    color: var(--color-white);
  }

  .ktbl-issues-subtitle {
    margin: var(--spacing-sp-medium) 0;

    padding: 0 0 19px 0;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-under-line.png)
      no-repeat;

    background-position: center bottom;

    background-size: 100%;

    font-size: var(--font-sp-lg);

    font-weight: bold;

    color: var(--color-text);

    text-align: center;
  }

  .ktbl-issues-item {
    flex: 1 1 30%;

    margin: 0 0 25px 0;
  }

  /* CTAセクション */

  .ktbl-cta-wrap {
    margin: 0;

    padding: 0 0 60px 0;
  }

  .ktbl-cta-button-area {
    width: var(--width-sp-cta);

    margin: 35px auto 0;
  }

  .ktbl-cta-button-area span {
    position: relative;

    z-index: 1;

    display: block;

    width: 93%;

    margin: 0 auto -20px;

    background: var(--color-white);

    border: 3px solid #f37431;

    border-radius: var(--radius-card);

    font-size: var(--font-sp-base);

    font-weight: bold;

    color: var(--color-accent);

    text-align: center;
  }

  a.ktbl-cta-button {
    padding: 23px 0 9px;

    background: var(--color-accent);

    font-size: var(--font-sp-lg);

    line-height: 23px;
  }

  .ktbl-cta-tct-img {
    width: 25%;
  }

  /* 動画セクション */

  .ktbl-video-wrap {
    margin: var(--spacing-sp-large) auto 0;

    box-sizing: border-box;
  }

  .ktbl-video-title {
    display: block;

    margin: 0;

    padding: 72px 0 0 0;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-video-icon.png)
      no-repeat;

    background-position: center top;

    background-size: 83px;

    font-size: var(--font-sp-lg);

    font-weight: bold;

    color: var(--color-text);
  }

  .ktbl-video-title span {
    font-size: var(--font-sp-xxl);

    font-weight: bold;

    color: var(--color-primary);
  }

  .ktbl-video-iframe {
    width: 100%;

    height: 250px;
  }

  .ktbl-video-inner {
    padding: var(--spacing-sp-large) var(--spacing-sp-medium) 35px;
  }

  .ktbl-video-subtitle {
    margin: 19px 0 var(--spacing-sp-large) 0;

    font-size: var(--font-sp-md);

    line-height: 29px;
  }

  /* 比較表 */

  .ktbl-table-wrap {
    overflow-x: auto;
  }

  .ktbl-compare-wrap {
    margin: var(--spacing-sp-section) 0 var(--spacing-sp-section);

    padding: 0 var(--spacing-sp-medium);
  }

  .ktbl-mobile-scroll-note {
    display: block;

    margin-bottom: 0.5rem;

    font-size: var(--font-sp-base);

    font-weight: bold;

    color: #555;

    text-align: center;
  }

  .ktbl-compare-table th,
  .ktbl-compare-table td {
    padding: 12px var(--spacing-sp-small);

    border: 1px solid #eaeaea;

    font-size: var(--font-sp-md);

    line-height: 28px;
  }

  .ktbl-compare-table th:first-child {
    width: 15%;

    background: #98aab5;

    border: 1px solid #eaeaea;

    font-size: 21px;

    font-weight: bold;

    text-align: center;
  }

  .ktbl-compare-table th {
    width: 30%;

    background: #eaeaea;

    border-top: 1px solid #eaeaea;

    border-bottom: 1px solid #eaeaea;

    border-left: 1px solid #eaeaea;

    font-size: var(--font-sp-lg);

    font-weight: bold;

    text-align: center;

    border-right: none;
  }

  .ktbl-compare-table th:nth-child(3) {
    background: #eaeaea;

    border: 1px solid #ffffff;

    font-size: var(--font-sp-lg);

    font-weight: bold;

    color: var(--color-text);

    text-align: center;

    border-top: 0;
  }

  .ktbl-compare-table th img {
    width: 30%;

    height: auto;
  }

  .ktbl-compare-table td:first-child {
    background: #98aab5;

    border: 1px solid var(--color-gray);

    font-size: var(--font-sp-md);

    color: var(--color-white);

    text-align: center;

    vertical-align: middle;
  }

  .ktbl-compare-table td:nth-child(2) {
    background: var(--color-white);

    border-top: 1px solid var(--color-gray);

    border-bottom: 1px solid var(--color-gray);

    border-left: 1px solid var(--color-gray);

    vertical-align: middle;
  }

  .ktbl-conpare-mark-circle {
    font-size: 100px;

    font-weight: bold;

    color: var(--color-primary);

    color: #333;
  }

  .ktbl-conpare-mark-xross {
    font-size: 45px;

    font-weight: bold;
  }

  /* 機能セクション */

  .ktbl-feature-wrap {
    margin: 0;

    padding: var(--spacing-sp-large) 0 var(--spacing-sp-section) 0;

    background: var(--color-bg-gray);
  }

  .ktbl-feature-inner {
    margin: 0 auto 2rem;

    padding: 0 var(--spacing-sp-medium);

    box-sizing: border-box;
  }

  .ktbl-feature-title {
    margin-bottom: 0.5rem;
  }

  .ktbl-feature-title::after {
    display: block;

    width: 50px;

    margin: 16px auto var(--spacing-sp-large);

    border-top: 3px solid var(--color-secondary);

    content: "";
  }

  .ktbl-feature-title span.ktbl-feature-sub-title {
    display: inline-block;

    margin: 0 0 3px 0;

    background: #0a74bd;

    border-radius: 40px;

    font-weight: bold;

    color: var(--color-white);
  }

  .ktbl-feature-title span {
    font-size: var(--font-sp-xxl);

    font-weight: bold;

    color: var(--color-secondary);
  }

  .ktbl-feature-subtitle {
    margin: var(--spacing-sp-large) 0 35px 0;

    font-size: var(--font-sp-md);

    line-height: 32px;
  }

  .ktbl-feature-subtitle span {
    margin: 0 0 var(--spacing-sp-large) 0;
  }

  .ktbl-feature-item {
    flex: 1 1 30%;

    margin: 0 0 var(--spacing-sp-large) 0;

    border: 3px solid var(--color-secondary);
  }

  .ktbl-feature-item-title {
    margin: var(--spacing-sp-large) 0 var(--spacing-sp-large) 0;

    font-size: var(--font-sp-xxl);

    font-weight: bold;

    line-height: 32px;

    color: var(--color-secondary);
  }

  .ktbl-feature-item-title::after {
    display: block;

    width: 50px;

    margin: 16px auto var(--spacing-sp-large);

    border-top: 3px solid var(--color-secondary);

    content: "";
  }

  .ktbl-feature-item-text p {
    font-size: var(--font-sp-md);

    line-height: 33px;
  }

  /* ケーススタディ */

  .ktbl-casestudy-wrap {
    margin: 0;

    padding: 0;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-bg-cv-area.png)
      no-repeat;

    background-size: cover;
  }

  .ktbl-casestudy-inner {
    margin: 0 auto;

    padding: 52px var(--spacing-sp-medium) var(--spacing-sp-section);

    box-sizing: border-box;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/green-bg.png)
      no-repeat;

    background-color: #086140;
  }

  .ktbl-casestudy-title {
    margin-bottom: 25px;

    font-size: var(--font-sp-xl);

    font-weight: bold;

    line-height: 1.3;

    color: var(--color-white);

    text-align: center;
  }

  .ktbl-casestudy-item {
    margin: 0 auto 90px;

    text-decoration: none;

    padding: 10px;

    padding-bottom: 0;
  }

  .ktbl-casestudy-txt.ktbl-casestudy-img01,
  .ktbl-casestudy-txt.ktbl-casestudy-img02,
  .ktbl-casestudy-txt.ktbl-casestudy-img03 {
    background-position: center;
  }

  .ktbl-casestudy-item h3 {
    padding: 13px 0 12px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-casestudy-icon.png)
      no-repeat;

    background-position: 13px center;

    background-size: 30px;

    font-size: var(--font-sp-xxl);

    font-weight: bold;

    color: #0679c9;
  }

  .ktbl-casestudy-item img {
    width: 100%;

    height: auto;
  }

  .ktbl-casestudy-item-link {
    padding: 12px 0 12px 40px;

    background: #000000
      url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-button-check-green.png)
      no-repeat;

    background-position: left center;

    margin: 0 -10px;
  }

  /* フローティングバナー */

  .ktbl-floating-btn-area {
    display: flex;

    justify-content: space-between;

    max-width: 300px;

    margin: 0 auto;

    padding: 5px 5px var(--spacing-sp-small);
  }

  .ktbl-floating-btn-area img {
    width: 95%;
  }

  .ktbl-floating-bnr {
    bottom: 8rem;

    right: 0;

    width: 300px;

    height: auto;

    padding: var(--spacing-sp-medium) 0;
  }

  .ktbl-floating-bnr-sp {
    bottom: 0;

    left: 0;

    width: 78%;

    height: auto;

    padding: var(--spacing-sp-small) var(--spacing-sp-small) 0;

    background: #001a43;

    border-radius: 0;
  }

  .ktbl-k-lgu-catch-footer {
    width: var(--width-sp-cta);
  }

  .ktbl-k-lgu-catch-footer h2 {
    font-size: var(--font-sp-md);

    line-height: 33px;
  }

  .ktbl-scene-inner {
    width: var(--width-sp-container);
    padding: var(--spacing-sp-section) var(--spacing-sp-medium) 0;
  }

  .ktbl-new-futures-inner {
    width: 100%;
    margin: var(--spacing-sp-section) auto 0;
    padding: 15px;
  }

  .ktbl-k-lgu-fv {
    max-height: 780px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/k-lgu-fv-sp2.png)
      no-repeat;

    background-size: 200%;

    background-position-x: 50%;

    background-color: #efefef;
  }

  .ktbl-fv-sub-ttl:before,
  .ktbl-fv-sub-ttl:after {
    max-width: 30px;
  }

  .ktbl-catch-label {
    font-size: 18px;
  }

  .ktbl-catch-large {
    font-size: clamp(39px, 10vw, 50px);
  }

  span.ktbl-catch-small {
    font-size: clamp(18px, 5vw, 32px);
  }

  .ktbl-fv-catch__main {
    margin-bottom: var(--spacing-small);

    font-size: clamp(24px, 12vw, 50px);
  }

  .ktbl-fv-catch {
    width: 95%;

    padding: 20px 10px;
  }

  .ktbl-fv-sub-ttl {
    font-size: 18px;
  }

  .ktbl-fv-sub-list li {
    font-size: 18px;

    background: none;
  }

  p.ktbl-fv-lead {
    font-size: 16px;

    padding: 15px;
  }

  .ktbl-casestudy-title .ktbl-title-label {
    font-size: var(--font-sp-xl);

    padding: var(--spacing-small) 20px;

    margin-bottom: 10px;
  }

  .ktbl-casestudy-title .ktbl-title-large {
    font-size: 40px;
  }

  .ktbl-case-lead {
    font-size: var(--font-sp-lg);

    margin-bottom: 120px;
  }

  .ktbl-number-area {
    margin-top: -80px;
  }

  .ktbl-casestudy-list {
    display: flex;

    flex-wrap: wrap;

    flex-direction: column;
  }

  .ktbl-casestudy-item .ktbl-item-lead {
    font-size: var(--font-sp-md);
  }

  .ktbl-caseitem-reviews {
    min-height: auto;

    padding: var(--spacing-sp-large) var(--spacing-sp-medium);

    padding-left: 10%;

    font-size: 17px;

    margin-inline: 0px;
  }

  .ktbl-caseitem-reviews:before {
    width: 30px;

    height: 26px;

    background-size: contain;
  }

  .ktbl-caseitem-imgarea {
    margin: 0 -10px;
  }

  .ktbl-casestudy-item:last-of-type {
    margin-bottom: 0;
  }

  .ktbl-compare-table th:nth-child(4) {
    border: 3px solid var(--color-primary);

    background: var(--color-primary);

    color: #fff;

    border-top: 0;
  }

  .ktbl-compare-table {
    width: 710px;
  }

  .ktbl-conpare-mark-circle .ktbl-conpare-mark-circle {
    color: var(--color-primary);
  }

  .ktbl-scene-title {
    font-size: var(--font-sp-xl);
  }

  .ktbl-scene-title span {
    font-size: var(--font-sp-xxl);
  }

  .ktbl-scene-txt .ktbl-scene-lead {
    font-size: var(--font-sp-lg);
  }

  .ktbl-scene-txt h3 {
    font-size: 20px;
  }

  .ktbl-scene-explanation {
    padding: var(--spacing-sp-medium) var(--spacing-sp-medium);

    font-size: var(--font-sp-md);
  }

  section.ktbl-usage-scene-wrap {
    padding: 0 0 var(--spacing-sp-section);
  }

  section.ktbl-new-features-wrap {
    padding: 15px 15px var(--spacing-sp-section);
  }

  .ktbl-new-features-title {
    font-size: var(--font-md);

    padding-left: 20%;

    line-height: 1.3;

    box-sizing: border-box;
  }

  .ktbl-new-features-title:before {
    position: absolute;

    top: 50%;

    left: -5%;

    display: block;

    width: 90px;

    height: 50px;

    background: url(/wp-content/themes/kotobal_theme/img/k-lgu/check-img.png)
      no-repeat;

    background-size: contain;

    content: "";

    transform: translateY(-50%);
  }

  .ktbl-new-features-title:after {
    display: block;

    width: 88px;

    margin: 16px auto var(--spacing-medium);

    border-top: 3px solid var(--color-secondary);

    content: "";

    position: absolute;

    left: 50%;

    transform: translateX(-50%);
  }

  .ktbl-new-features-title span {
    font-size: var(--font-sp-xxl);

    font-weight: bold;

    color: var(--color-secondary);
  }

  .ktbl-scene-txt {
    width: 100%;
  }

  .ktbl-scene-itme:nth-of-type(2) .ktbl-scene-img {
    order: -1;
  }

  .ktbl-scene-itme:last-of-type {
    margin-bottom: 0;
  }

  .theme-fo-base
    :is(.main-visual, .contents, .side, .foot)
    .component.heading:is(.hd_custom01, .hd_custom02)
    h2 {
    font-size: 20px;
  }

  .ktbl-new-futures-inner a[data-zoomable] img {
    cursor: zoom-in;

    touch-action: manipulation;
  }

  .ktbl-fv-sub-list li span {
    border-bottom: 3px solid var(--color-accent);
  }

  .ktbl-compare-title span {
    font-size: var(--font-sp-xxl);
  }

  .ktbl-compare-title {
    font-size: var(--font-sp-xl);
  }

  .ktbl-scene-img {
    width: 100%;
  }

  .navi-002-01 header {
    padding: 0;
  }
}
/*tuika*/
.theme-fo-base .main-visual.sub-page-custom {
  padding: 0;
}
h1.entry-title {
  display: none;
}

.theme-fo-base a:hover {
  opacity: unset;
}
