/*
 Theme Name:   Kyotamba Location Office
 Theme URI:    https://www.kyotamba.org/kyotambalocationoffice/
 Description:  Twenty Twenty-Four の子テーマです。「京丹波町ロケーションオフィス」用にカスタマイズしてあります。
 Author:       京丹波町ロケーションオフィス
 Template:     twentytwentyfour
 Version:      1.0.0
*/

/* 親テーマのCSSを継承する場合、以下で追記できます */


@charset "UTF-8";

html {
  scroll-behavior: smooth;
}

/* 親テーマのスタイルは読み込まれる前提で、色だけ変更 */
body {
    background-color: #272727;
}

a {
    color: #FFF;  /*#CBD09C*/
}

a:hover {
    color: #CBD09C;
	text-decoration: none;
}

body .wp-block-navigation {
    /*background-color: #222;*/
}

/* PC表示用: 幅901px以上の場合 */
@media (min-width: 901px) {
    p {
        font-size: 15px;
        letter-spacing: 0.03em;
        line-height: 1.6; 
	}
	
h4,
h4 .is-style-default {
    font-size: 1.2rem!important;
	}
	
}

/* スマホでも段落の文字サイズを大きめにする */
@media (max-width: 600px) {
    p {
        font-size: 1.7rem;
		letter-spacing: 0.01em;
        line-height: 1.6;
    }
    h2 {
        /*font-size: 2.5rem!important;*/
		letter-spacing: 0.01em;
        line-height: 1.6;
	}
	h3 {
    font-size: 1.8rem !important;
	}
	
	h4,
h4 .is-style-default {
    font-size: 1.8rem !important;
	}
	
}

/* 投稿テンプレートの日付サイズ調整 */
.wp-block-post-date.has-extra-small-font-size time {
  font-size: 14px; /* 好きなサイズに調整 */
  line-height: 1.4;
}

/* スマホ表示（600px以下）の時にもう少し大きく */
@media (max-width: 600px) {
  .wp-block-post-date.has-extra-small-font-size time {
    font-size: 12px;
  }
}

/* カバー内タイトル（h2）をスマホでも小さくしすぎない */
/* デフォルト（PC用） */
.wp-block-cover h2.wp-block-heading {
  font-size: clamp(2rem, 2vw + 1rem, 3rem);
}
/* サブタイトルの段落 */
.wp-block-cover p {
  font-size: clamp(1rem, 1vw + 0.8rem, 1.25rem); /* 最小1remに調整 */
  line-height: 1.6;
}
/* スマホ用 */
@media (max-width: 600px) {
  .wp-block-cover h2.wp-block-heading {
    font-size: 2.7rem!important;   /*3.1rem */
  }
.wp-block-cover p {
  font-size: 1.6rem!important;
  line-height: 1.6;
}
	    h2.wp-block-heading {
        font-size: 2.3em!important;
        line-height: 1.2;
    }
}

/*------------------------------------------------------
　　　　　　　　　＊ MARGIN　＊
-------------------------------------------------------*/
.m_0 {margin: 0px !important;}
.m_10 {margin: 10px !important;}
.m_b0 {margin-bottom: 0px !important;}
.m_b5 {margin-bottom: 5px !important;}
.m_b10 {margin-bottom: 10px !important;}
.m_b15 {margin-bottom: 15px !important;}
.m_b20 {margin-bottom: 20px !important;}
.m_b25 {margin-bottom: 25px !important;}
.m_b30 {margin-bottom: 30px !important;}
.m_b35 {margin-bottom: 35px !important;}
.m_b40 {margin-bottom: 40px !important;}
.m_b50 {margin-bottom: 50px !important;}
.m_b60 {margin-bottom: 60px !important;}
.m_b70 {margin-bottom: 70px !important;}
.m_b80 {margin-bottom: 80px !important;}
.m_b90 {margin-bottom: 90px !important;}

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

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

.m_l5 {margin-left: 5px !important;}
.m_l10 {margin-left: 10px !important;}
.m_l15 {margin-left: 15px !important;}
.m_l20 {margin-left: 20px !important;}
.m_l25 {margin-left: 25px !important;}
.m_l30 {margin-left: 30px !important;}
.m_l35 {margin-left: 35px !important;}
.m_l40 {margin-left: 40px !important;}
.m_l60 {margin-left: 60px !important;}

.m_lr10 {margin: 0 10px !important;}
.m_lr20 {margin: 0 20px !important;}
.m_lrtb10 {margin: 10px 10px !important;}

.m_r5 {margin-right: 5px !important;}
.m_r10 {margin-right: 10px !important;}
.m_r15 {margin-right: 15px !important;}
.m_r20 {margin-right: 20px !important;}
.m_r30 {margin-right: 30px !important;}
.m_r35 {margin-right: 35px !important;}
.m_r40 {margin-right: 40px !important;}
.m_r50 {margin-right: 50px !important;}

.m_t0 {margin-top: 0px !important;}
.m_t5 {margin-top: 5px !important;}
.m_t10 {margin-top: 10px !important;}
.m_t12 {margin-top: 12px !important;}
.m_t15 {margin-top: 15px !important;}
.m_t20 {margin-top: 20px !important;}
.m_t25 {margin-top: 25px !important;}
.m_t30 {margin-top: 30px !important;}
.m_t40 {margin-top: 40px !important;}
.m_t50 {margin-top: 50px !important;}
.m_t-5 {margin-top: -5px !important;}
.m_t-10 {margin-top: -10px !important;}
.m_t100 {margin-top: 100px !important;}
.en-t00 {margin-top: -1.2em !important;}

/*------------------------------------------------------
　　　　　　　　　＊ PADDING　＊
-------------------------------------------------------*/

.p5 {padding: 5px !important;}
.p10 {padding: 10px !important;}
.p15 {padding: 15px !important;}
.p_l5 {padding-left: 5px !important;}
.p_lr5 {padding: 0px 5px 0px 5px !important;}
.p_lr10 {
	padding-right: 10px;
	padding-left: 10px !important;}
.p_lr10sp {
	padding-right: 10px;
	padding-left: 10px;}
.p_lr15 {
	padding-right: 15px;
	padding-left: 15px !important;}
.p_lr25 {
	padding-right: 25px;
	padding-left: 25px !important;}
.p_t5 {padding-top: 5px !important;}
.p_t10 {padding-top: 10px !important;}
.p_r5 {padding-right: 5px !important;}
.p_t25 {padding-top: 25px !important;}
.p_t35 {padding-top: 35px !important;}
.p_b10 {padding-bottom: 10px !important;}
.p_b20 {padding-bottom: 20px !important;}
.p_b30 {padding-bottom: 30px !important;}
.p_b2em {padding-bottom: 2em !important;}
.p_b5em {padding-bottom: 5em !important;}
.p_b12em {padding-bottom: 12em !important;}

@media screen and (max-width: 600px){
.p_b2em {padding-bottom: 1em !important;}
.p_b12em {padding-bottom: 5em!important;}
}
@media screen and (max-width: 414px){
.p_lr10sp {
	padding-right: 0px;
	padding-left: 0px;}
.p_b12em {padding-bottom: 3em!important;}
}

/*------------------------------------------------------
　　　　　　　　　＊ FONT&TEXT　＊
-------------------------------------------------------*/

.f_bold {font-weight: bold !important;}
.f_line a{ text-decoration:underline !important;}

.f_gr {color: #70A452 !important;}
.f_red {color: #DD0000 !important;}
.f_white {color: #FFFFFF !important;}
.f_bl {color: #0391CD !important;}
.f_orange {color: #EE7332 !important;}
.f_orange2 {color: #F8B62B !important;}
.f_lye {color: #FAFCA6 !important;}
.f_bro {color: #634310 !important;}

.f_s9 {font-size: 70% !important;}
.f_s10 {font-size: 77% !important;}
.f_s11 {font-size: 85% !important;}
.f_s12 {font-size: 93% !important;}
.f_s13 {font-size: 100% !important;}
.f_s14 {font-size: 108% !important;}
.f_s14 a {font-size: 108% !important;}
.f_s15 {font-size: 116% !important;}
.f_s15 a {font-size: 116% !important;}
.f_s16 {font-size: 124% !important;}
.f_s16 a {font-size: 124% !important;}
.f_s17 a {font-size: 124% !important;}
.f_s17 {font-size: 131% !important;}
.f_s18 {font-size: 139% !important;}
.f_s19 {font-size: 147% !important;}
.f_s20 {font-size: 154% !important;}
.f_s21 {font-size: 162% !important;}
.f_s22 {font-size: 170% !important;}
.f_s23 {font-size: 177% !important;}
.f_s24 {font-size: 185% !important;}
.f_s25 {font-size: 193% !important;}

.f_s16res {font-size: 170% !important;}
.f_s20res {font-size: 154% !important;}
@media screen and (max-width: 360px){
.f_s20res {font-size: 134% !important;}
}

@media screen and (max-width: 1199px){
.f_s16res {font-size: 154% !important;}
}
@media screen and (max-width: 600px){
.f_s16res {font-size: 112% !important;}
}
@media screen and (max-width: 414px){
.f_s16res {font-size: 154% !important;}
.f_s23 {font-size: 127% !important;}
}
.f_lh100 {line-height: 1.0;}
.f_lh150 {line-height: 1.5;}
.f_lh200 {line-height: 2.0;}
.f_lh250 {line-height: 2.5;}


.t-a_right {text-align: right!important}
.t-a_center {text-align: center;}

@media only screen and (min-width:320px) and (max-width:414px) {
	.t-a_center {text-align: left;}
	.t-a_right {text-align: left!important}
}


/* -------------------------------- 
　横幅指定
-------------------------------- */
.max700 {
width: 100%;
max-width: 700px;
margin:0px auto;
}

.max900 {
width: 100%;
max-width: 900px;
margin:0px auto;
}

.max1000 {
width: 100%;
max-width: 1000px;
margin:0px auto;
}

.max1140 {
width: 100%;
max-width: 1140px;
margin:0px auto;
}


/* ===============================
   ヘッダーナビ完全カスタマイズ　優しいグレー #3a3a3a
   =============================== */

body .has-base-background-color {
  background-color: #000 !important;
}

/* 1. ヘッダー全体の背景色 */
body .wp-block-template-part.header-footer-group {
    /*background-color: #000;  ヘッダー背景 */
    color: #fff;            /* ヘッダー内テキスト色 */
}

/* 2. ナビゲーション ul 背景を透明化 */
body .wp-block-navigation__container,
body .wp-block-navigation.has-base-background-color {
    /*background-color: #000;  ヘッダー背景と同じに統一 */
    padding: 0;
}

/* 3. li 背景を透明化 */
body .wp-block-navigation__container li.wp-block-navigation-item {
    background-color: transparent;
}

/* hover・アクティブ時も li 背景なし */
body .wp-block-navigation__container li.wp-block-navigation-item:hover,
body .wp-block-navigation__container li.wp-block-navigation-item:active,
body .wp-block-navigation__container li.wp-block-navigation-item:focus {
    background-color: transparent;
}

/* 4. ナビリンクの基本スタイル */
body .wp-block-navigation-item__content {
    background-color: transparent; /* 背景なし */
    color: #fff;                   /* リンク文字色 */
    font-weight: 600;
    padding: 5px 10px;
    text-transform: uppercase;
    transition: all 0.3s;
}

/* 5. ナビリンク hover / アクティブ時 */
body .wp-block-navigation-item__content:hover,
body .wp-block-navigation-item__content:active,
body .wp-block-navigation-item__content:focus {
    color: #ffcc00;           /* 文字色ホバー */
    background-color: #555151; /* 背景色ホバー */
}

/* 6. サブメニュー（ドロップダウン）の背景と文字色 */
body .wp-block-navigation .wp-block-navigation-submenu {
    background-color: #000; /* サブメニュー背景 */
}

body .wp-block-navigation .wp-block-navigation-submenu a {
    color: #fff; /* サブメニューリンク色 */
}

body .wp-block-navigation .wp-block-navigation-submenu a:hover {
    color: #ffcc00; /* サブメニューリンクホバー色 */
    background-color: #555151; /* サブメニュー背景ホバー */
}

/* 7. レスポンシブ調整 */
@media screen and (max-width: 768px) {
    body .wp-block-navigation__container li.wp-block-navigation-item {
        display: block;
        margin: 5px 0;
    }

    body .wp-block-navigation-item__content {
        padding: 10px;
        font-size: 14px;
    }
}

/* ===============================
   フッター背景色
   =============================== */


/* フッター内リンク色 */
body .wp-block-template-part.footer a {
    color: #fff; /* リンク文字色 */
    transition: color 0.3s;
}

/* フッターリンクのホバー色 */
body .wp-block-template-part.footer a:hover,
body .wp-block-template-part.footer a:focus {
    color: #ffcc00; /* ホバー文字色 */
}


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

 /* メインビジュアルスライダー */
  .mv-front .slide-media img {
    transition: 7s 1s linear;
    transform: translateX(-1.5%) scale(1.1);
  }
 
  .mv-front .slide-title,
  .mv-front .slide-text,
  .mv-front .slide-link {
  animation: 2s var(--easing) both;
  opacity: 1; /* 初期状態で表示 */
  }
 
  .mv-front .splide__slide[class*=-active] .slide-media img {
    transition-delay: 0s;
    transform: translateX(1.5%) scale(1.05);
  }
 
  .mv-front .splide__slide.anm-started .slide-title,
  .mv-front .splide__slide.anm-started .slide-text,
  .mv-front .splide__slide.anm-started .slide-link {
    animation-name: mv02-fadeIn;
  }
 
  .mv-front .splide__slide.anm-finished .slide-title,
  .mv-front .splide__slide.anm-finished .slide-text,
  .mv-front .splide__slide.anm-finished .slide-link {
    animation-name: mv02-fadeOut;
  }
 
  @keyframes mv02-fadeIn {
    0% {
      transform: translateY(6rem);
      opacity: 0;
    }
 
    100% {
      transform: translateY(0);
      opacity: 1;
    }
  }
 
  @keyframes mv02-fadeOut {
    0% {
      transform: translateY(0);
      opacity: 1;
    }
 
    100% {
      transform: translateY(-6rem);
      opacity: 0;
    }
  }
 

 /* スライド装飾 */

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

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

    .l-section .l-inner {
      padding-top: 8rem;
      padding-bottom: 8rem;
    }


    /* 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__arrow--prev,
    .splide__arrow--next {
      display: grid;
      place-content: center;
      width: 6.4rem;
      height: 6.4rem;
      cursor: pointer;
      transition: var(--transition);
      background-color: var(--color-theme-darken);
      border-radius: 50%;
    }

    .splide__arrow--prev::after,
    .splide__arrow--next::after {
      width: 1.2rem;
      height: 1.2rem;
      content: "";
      border: solid var(--color-gray);
      border-width: 3px 3px 0 0;
    }

    .splide__arrow--prev::after {
      margin-left: 0.4rem;
      transform: rotate(-135deg);
    }

    .splide__arrow--next::after {
      margin-right: 0.4rem;
      transform: rotate(45deg);
    }

    .splide__arrow:disabled {
      pointer-events: none;
      opacity: 0;
    }

    .splide__arrow:focus-visible {
      outline: 3px solid rgba(180, 233, 0, 0.8);
      outline-offset: 3px;
      z-index: 1;
      transition: none;
    }

    .splide__pagination {
      font-size: 0;
    }

    .splide__pagination__page:focus-visible {
      outline: 3px solid rgba(180, 233, 0, 0.8);
      outline-offset: 3px;
      z-index: 1;
      transition: none;
    }

    .splide__slide:focus-visible {
      outline: 3px solid rgba(180, 233, 0, 0.8);
      outline-offset: 3px;
      z-index: 1;
      transition: none;
    }

    .splide-wrapper {
      position: relative;
    }

    .splide__arrow>svg {
      display: none;
    }

    .mv-front {
      /**/margin-bottom: 0!important;
    }

    .mv-front .l-inner {
      padding-bottom: 0;
    }


/* Splide ページネーションを棒状にする（丸みを解除） */
.mv-front .splide__pagination__page {
  border-radius: 0 !important; /* デフォルトの50%を打ち消す */
}

/* ページネーション（縦並び） */
.mv-front .splide__pagination {
  position: absolute;
  top: 50%;
  left: 0;                /* 左端に配置 */
  transform: translateY(-50%); /* 縦方向で中央寄せ */
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 0;
}



/* ページネーションの1本ごとのスタイル */
.mv-front .splide__pagination__page {
  display: block;
  width: 1.2rem;          /* 細めのライン */
  height: 2px;            /* 線を細く */
  cursor: pointer;
  background-color: #fff; /* 通常時は白 */
  transition: all 0.3s ease;
  border: none;
}

/* 棒の間隔 */
.mv-front .splide__pagination > li:not(:first-child) {
  margin-top: 0.5rem;
}

/* アクティブ時の棒 */
.mv-front .splide__pagination__page.is-active {
  width: 2rem; 
  background-color: #000;
}

/* インジケータクリック時の黒い枠を消す */
.mv-front .splide__pagination__page:focus,
.mv-front .splide__pagination__page:focus-visible {
  outline: none;
  box-shadow: none;
}


.mv-front .slide {
  position: relative;
  width: 100vw;
  height: 800px; /* 固定高さにする場合 */
  padding: 0;
  margin: 0;
  overflow: hidden; /* 画像などはみ出さない */
	  text-align: center;
}

.mv-front .slide {
  position: relative;
}


/* 画像は背面に */
    .mv-front .slide-media {
      position: absolute;
      z-index: -1;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }


    .mv-front .slide-media img {
      transition: 7s 1s linear;
      transform: translateX(-1.5%) scale(1.1);
    }



/*　これに切り替えでアニメーション動作*/
.mv-front .slide-title,
.mv-front .slide-text,
.mv-front .slide-link {
  color: #fff;
  z-index: 10;
  opacity: 0;
  animation-duration: 2s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}


.mv-front .slide-title {
  position: absolute;
  left: 30%;
  top: 30%;
  transform: translateX(-50%);
  font-size: 2.7rem;
  line-height: 1.1;
  margin-bottom: 0;
  color: var(--color-theme);
  text-align: center;
  z-index: 10;
text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4);
}


.mv-front .slide-text {
  position: absolute;
  left: 30%;
  top: 45%;
  transform: translateX(-50%);
  font-size: 1.2rem;
  margin: 0;
  animation-delay: 0.2s;
  line-height: 1.5;
  text-align: left;
			z-index: 10;
	text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.7);
}

.mv-front .slide-link {
  position: absolute;
  left: 50%;
  top: 65%; /* 上から65% */
  transform: translateX(-50%);
  margin: 0;
  animation-delay: 0.4s;
  text-align: center;
  z-index: 10;
}

.mv-front .slide-button {
font-size: 1.2rem;
font-weight: bold;
display: inline-block;
color: var(--color-theme);
}

.mv-front .slide-button::before {
display: inline-block;
width: 10rem;
height: 1px;
margin: -2px 1.6rem 0 0;
content: "";
vertical-align: middle;
background-color: currentColor;
}

     @media only screen and (max-width: 1024px) {
     html {
        -webkit-text-size-adjust: 100%;
      }

      .l-inner {
        padding: 0 4rem;
      }

      .pc {
        display: none !important;
      }
		 
		 
      .mv-front {
        margin-bottom: 8rem;
      }

      .mv-front .slide {
        height: max(70vh, 70vw);
		min-height: 400px;
      }

.mv-front .slide-title {
font-size: 2.5rem;
left: 30%;
top: 32%;
text-align: left;
line-height: 1.3;
}

.mv-front .slide-text {
  font-size: 1.2rem;
  margin: 3.2rem 1em 2em 0px;
left: 30%;
  text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.8);
}
	
.mv-front .slide-link {
  position: absolute;
  left: 50%;
  top: 56%; 
  transform: translateX(-50%);
  margin: 0;
  animation-delay: 0.4s;
  text-align: center;
  z-index: 10;
}
		 
.mv-front .slide-button {
left: 10%;
top: 50%;
font-size: 1.5rem;
margin-top: 3em;
}

.mv-front .slide-button::before {
width: 3.5rem;
}
		 
		 
}
    @media only screen and (max-width: 428px) {
		

 
      .mv-front {
        margin-bottom: 8rem;
      }

      .mv-front .slide {
        height: max(70vh, 70vw);
		min-height: 400px;
      }

.mv-front .slide-title {
font-size: 3rem;
left: 30%;
top: 32%;
text-align: left;
line-height: 1.3;
}

.mv-front .slide-text {
  font-size: 1.6rem;
  margin: 3.2rem 1em 2em 0px;
left: 30%;

}
		
.mv-front .slide-button {
left: 10%;
top: 50%;
font-size: 2rem;
margin-top: 3em;
}

.mv-front .slide-button::before {
width: 3.5rem;
}
		

    }

    @media only screen and (max-width: 599px) {
      html {
        font-size: 50%;
      }

      .pc-tab {
        display: none !important;
      }

    }

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

      .splide__arrow--prev::before,
      .splide__arrow--next::before {
        transition: var(--transition);
      }

      .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;
      }
		
    }




/*------------------------------------------------------
　　パーツデザイン
-------------------------------------------------------*/


/* TOP タイトル */

.hed-title .en-ttl {
letter-spacing: 0.2em;
font-size: 1.1rem;
display: block;
text-align: center;
}
.hed-title .ja-ttl {
font-size: 1.4rem;
font-weight: bold;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: block;
letter-spacing: 0.25em;
text-align: center;
margin-bottom: 2em;
}
.ja-ttl::before {
border-top-color: #333;
}
.ja-ttl::before {
content: "";
display: block;
width: 20px;
height: 1px;
margin: 10px auto 7px;
border-top: 1px solid #fff;
border-top-color: rgb(255, 255, 255);
}

@media (max-width: 599px) {
.hed-title .en-ttl {
letter-spacing: 0.2em;
font-size: 2.1rem;
display: block;
text-align: center;
}
.hed-title .ja-ttl {
font-size: 2.1rem;
font-weight: bold;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: block;
letter-spacing: 0.25em;
text-align: center;
margin-bottom: 2em;
}
}

/*ボタン */

/* アニメーション付きボタン */
.wp-block-button__link {
  display: inline-block;
  position: relative;
  overflow: hidden; 
  text-decoration: none;
  text-align: center;
  padding: 0.8rem 3.5rem;
  font-weight: bold;
  color: #303030;
  background-color: #fff; 
  border: 1px solid #fff;
  transition: color 0.5s ease;
  border-radius: 0;
  font-size: 18px;
}

/* 擬似要素で背景アニメーション */
.wp-block-button__link::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.5s ease;
  z-index: -2;
}

/* ホバー時 */
.wp-block-button__link:hover::before {
  transform: scaleX(1);
  transform-origin: left;
}

/* 文字色を前面に出す */
.wp-block-button__link,
.wp-block-button__link * {
  position: relative;
  z-index: 2;
  transition: color 0.5s ease;
}

/* ホバー時の文字色 */
.wp-block-button__link:hover,
.wp-block-button__link:hover * {
  color: #fff !important;  /* !important を入れて優先 */
}


/*-----*/
/* 右サイドバーに余白を追加 */
.sidebar-right {
  padding-left: 3rem;
  box-sizing: border-box;
}

@media screen and (max-width: 825px){
.sidebar-right {
  padding-left: 2rem;
}
}
@media screen and (max-width: 600px){
.sidebar-right {
  padding-left: 0;
}
}

/* 個別投稿右サイドバー見出し*/
.widget-ttl-flm {
  margin: 8px 5px 8px 0;
  font-weight: normal;
  padding: 5px 15px;
  font-size: 1rem;
  border: 1px solid #fff;
  /*font-weight: bold;*/
}

/*カテゴリー*/
.wp-block-categories {
  font-size: 0.9rem;
  padding-left: 10px;
  margin-left: 1em;
  padding-bottom: 2em;
}
/*アーカイブ*/
.wp-block-archives {
  padding-bottom: 2em;
}

/*投稿タイトル見出し*/

.wp-block-post-title{
	font-weight: normal;
}

.ttl_line {
  font-weight: normal;
  padding: 0.3em;
  margin-bottom: 0.6em;
  position: relative;
  font-size: 1.5rem;
  margin-left: 0!important;
  margin-right: 0!important;
}
.ttl_line::after {
  content: '';
  background-size: 10px 10px;
  background-color: #fff;
  background-image: repeating-linear-gradient(-45deg, #fff 0, #fff 3px, #272727 0, #272727 50%);
  width: 100%;
  height: 4px;
  position: absolute;
  bottom: -5px;
  left: 0;
}


body.single-post .wp-block-post-title {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
}


.ttl_center {
  font-weight: normal;
  padding: 0 3em;
  width: fit-content;
  margin: 0 auto;
  text-align: center;
  position: relative;
}
.ttl_center::before, .ttl_center::after {
  content: '';
  background: #FFFFFF;
  width: 2em;
  height: 1px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.ttl_center::before {
  left: 0;
}
.ttl_center::after {
  right: 0;
}


.udline-bo{
	border-bottom: 1px solid #fff;
	padding-bottom: 5px;
}

.tpline-bo {
	border-top: 1px solid #fff;
	padding-top: 5px;
}

.line-4bo{
	border: 1px solid #fff;
	padding: 10px;
}

.line-4bo a{
	text-decoration: none;
}

/* 投稿カテゴリーのリンク装飾 */
.wp-block-post-terms a {
    text-decoration: none;
    transition: all 0.3s ease;
}

/* ホバー時の背景白・文字黒 */
.wp-block-post-terms a:hover {
    background-color: #ffffff;
    color: #000000;
}
		
/* ロケ地カテゴリーの文字サイズ調整（スマホ用） */
@media (max-width: 600px) {
.wp-block-post-terms a{
    font-size: 1.5rem !important;
  }
}


.taxonomy-taglist{
padding: 7px 0 0 0!important;
margin: 0!important;
border-top: 1px solid #fff;
}

/**/
.wp-block-group {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
	
}

.limax900 {
max-width: 900px;
margin-left: auto !important;
margin-right: auto !important;
}

@media screen and (max-width: 810px){
.wp-block-group {

}	
	
}

@media screen and (max-width: 428px){
.limax900 {
max-width: 900px;
margin-left: auto !important;
margin-right: auto !important;
}	
}


.wp-block-post-date{
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.top-ttl_i {
  padding: 0.25em 0.5em;
  background: transparent;
  border-left: solid 10px #fff;
  font-size: 170%!important;
}
@media screen and (max-width: 428px){
.top-ttl_i {
  padding: 0.25em 0.5em;
  background: transparent;
  border-left: solid 10px #fff;
  font-size: 20px !important;
}
}

/*TOP投稿一覧リスト*/
/* ul.lastb の最初の li に上線をつける */
ul.lastb > li:first-child {
  border-top: 1px solid #ddd; /* 色や太さは調整 */
  padding-top: 1em;           /* 線と内容の間に余白 */
}

/* ul.lastb の各 li に下線をつける */
ul.lastb > li {
  border-bottom: 1px solid #ddd;
  padding-bottom: 1em;
}
ul.lastb li > div {
  margin: 0;   /* div に余白を持たせない */
  padding: 0;  /* 念のため内側余白もリセット */
}

ul.lastb li > div > * {
  margin-block-start: 0;
  margin-block-end: 0; /* time や h2 のデフォルト余白も打ち消す */
}
/* スマホ幅では padding を20pxに上書き */
@media (max-width: 768px) {
  .wp-block-query .wp-block-group[style*="padding"] {
    padding: 10px !important;
  }
}
@media screen and (max-width: 428px){
	
	}


/* --------------------------
  Locations Grid
-------------------------- */

/* 親グリッド */
.locations_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4列 */
  gap: 20px; /* カラム間・行間の間隔 */
  margin: 20px auto;
}

/* Location Box */
.location_box {
  position: relative;
  overflow: hidden;
}

.location_box a {
  display: block;
  text-decoration: none;
  color: inherit;
  position: relative;
}

/* 画像設定 */
.location_box .img_wrap {
  width: 100%;
  padding-top: 60%; /* 縦横比 */
  background-size: cover;
  background-position: center;
 filter: brightness(0.8);
  transition: filter 0.3s ease;
}


/* ホバーで明るく */
.location_box a:hover .img_wrap {
  filter: brightness(1.2);
}

/* 文字配置 */
.location_box .en-cat {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  font-family: sans-serif;
  text-shadow: 0 2px 6px rgba(0,0,0,0.5);
}

.location_box .enTtl {
  display: block;
  font-size: 12px;
  margin-bottom: 8px;
}
.location_box .border_line {
  display: block;
  width: 50%;
  height: 1px;
  background-color: #fff;
  margin: 0 auto 8px;
}
.location_box .ja-cat {
  display: block;
  font-size: 1.5rem;
  font-weight: bold;
}

.location_box .enTtl,
.location_box .ja-cat {
  white-space: nowrap;
}

/* location 画像 */
.location_box.location01 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location01.jpg');
}
.location_box.location02 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location02.jpg');
}
.location_box.location03 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location03.jpg');
}
.location_box.location04 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location04.jpg');
}
.location_box.location05 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location05.jpg');
}
.location_box.location06 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location06.jpg');
}
.location_box.location07 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location07.jpg');
}
.location_box.location08 .img_wrap {
  background-image: url('https://www.kyotamba.org/kyotambalocationoffice/wp-content/themes/location-office/img/location08.jpg');
}

/* --------------------------
  レスポンシブ対応
-------------------------- */
@media (max-width: 1024px) {
  .locations_grid {
    grid-template-columns: repeat(2, 1fr); /* タブレットは2カラム */
    gap: 15px;
  }
}

@media (max-width: 600px) {
  .locations_grid {
    grid-template-columns: 1fr; /* スマホは1カラム */
  }

  .location_box .enTtl {
    font-size: 2rem;
  }
  .location_box .ja-cat {
    font-size: 3.7rem;
  }
}
footer{
	margin-top: 0!important;
}

.footer-lo-list{
}
.footer-lo-list li {
padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 0.3 !important;
}


/* --------------------------
  概要タイトル用
-------------------------- */

@font-face {
    font-family: 'Noto Serif';
    src: url('fonts/NotoSerif-Regular.woff2') format('woff2'),
         url('fonts/NotoSerif-Regular.woff') format('woff'),
         url('fonts/NotoSerif-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Noto Serif';
    src: url('fonts/NotoSerif-Bold.woff2') format('woff2'),
         url('fonts/NotoSerif-Bold.woff') format('woff'),
         url('fonts/NotoSerif-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

.ttl-number{
	font-family: 'Noto Serif', serif; /* Noto Serifを使用 */
    margin: 0;
    padding: 0 10px 0 10px;
    color: #333;
	font-size: 120%!important;
}

/*見出し部分*/
.under-line_bgwh{
 position:relative;
 padding:0.5rem 0;
 border-bottom:1px solid currentColor;
background-color: #fff;
}

@media (max-width: 600px) {
.wp-block-media-text > .wp-block-media-text__content {
  padding: 0!important;
}
}

/*固定ページ用スライド*/

/* ラッパー */
.gallery01 { max-width: 1200px; margin: 0 auto; }

/* メイン */
/*.gallery01 .splide-main { height: 560px; margin-bottom: 12px; }*/
.gallery01 .splide-main .splide__slide img { width:100%; height:100%; object-fit:cover; display:block; }

/* サムネ（横並び、下に表示）*/
.gallery01 .splide-thumb { max-width: 900px; margin: 0 auto; }
.gallery01 .splide-thumb .splide__slide {
  width: 120px; height: 72px; /* JS の fixedWidth/Height と合わせる */
  overflow: hidden;
}
.gallery01 .splide-thumb .splide__slide img {
  width:100%; height:100%; object-fit:cover; display:block;
  filter: brightness(0.55); transition: filter .25s ease, transform .25s ease;
}
.gallery01 .splide-thumb .splide__slide.is-active img {
  filter: brightness(1);
  transform: scale(1.03);
  box-shadow: 0 0 0 3px rgba(255,255,255,0.08);
}

/* レスポンシブ調整 */
@media (max-width: 768px) {
  .gallery01 .splide-main { height: 320px; }
  .gallery01 .splide-thumb .splide__slide { width: 80px; height: 48px; }
}

/* === メインスライダー === */
.gallery01 .splide-main {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 20px;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);

  /* 高さを常に16:9比率で確保 */
  aspect-ratio: 16 / 9;
}

.gallery01 .splide-main .splide__slide,
.gallery01 .splide-main .splide__track,
.gallery01 .splide-main .splide__list {
  height: 100% !important; /* 内部要素も親に合わせる */
}

.gallery01 .splide-main .splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: brightness(0.85);
}


/* スマホ調整（比率を少し縦長にする例） */
@media (max-width: 768px) {
  .gallery01 .splide-main {
    aspect-ratio: 4 / 3;  /* スマホでは4:3に変更 */
  }
}


/* 矢印（円形の白背景） */
.gallery01 .splide-main .splide__arrow {
  background: #fff;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  opacity: 0.9;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  border: 2px solid #fff;
}
.gallery01 .splide-main .splide__arrow svg {
  fill: #000;
}
.gallery01 .splide-main .splide__arrow:hover {
  opacity: 1;
}

/* === サムネイルスライダー === */
.gallery01 .splide-thumb {
  max-width: 900px;
  margin: 0 auto;
}
.gallery01 .splide-thumb .splide__slide {
  width: 120px;
  height: 72px;
  overflow: hidden;
  border-radius: 4px;
  cursor: pointer;
  transition: transform .2s;
}
.gallery01 .splide-thumb .splide__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.55);
  transition: filter .25s ease, transform .25s ease;
}
.gallery01 .splide-thumb .splide__slide.is-active img {
  filter: brightness(1);
  transform: scale(1.05);
  box-shadow: 0 0 0 3px #0073aa; /* WordPressカラー風枠線 */
}

/* サムネイルの hover 効果 */
.gallery01 .splide-thumb .splide__slide:hover img {
  filter: brightness(0.85);
}

/* レスポンシブ */
@media (max-width: 600px) {
  .gallery01 .splide-main { height: 320px; }
  .gallery01 .splide-thumb .splide__slide { width: 80px; height: 48px; }
}
		
.menu-item {
  margin: 35px 0;
  font-size: 17px;
}
.menu-item-name {
  font-size: 15px;
  color: #272727;
  border-bottom: 1px solid rgba(66,66,66,1.00);
  padding: 5px 10px;
}
.menu-item-price {
  float: right;
  font-weight: 600;
  color: #272727;
  margin-top: -35px;
    padding: 5px 10px;
}
.menu-item-price span {
  font-size: 80%;
}
@media (max-width: 600px) {
.menu-item-name {
    font-size: 1.7rem;
    letter-spacing: 0.01em;
    line-height: 1.6;
  }
		}
		

/* コンタクトフォーム */

.wpcf7-form label {
  display: block;
  margin-bottom: 1em;
  font-weight: 600;
  color: #333;
}

.wpcf7-form input,
.wpcf7-form textarea {
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 0.75em;
  font-size: 1rem;
  background: #fff;
}

.wpcf7-form textarea {
  min-height: 180px;
}
/* =========================
   📱 フォーム全体の調整（Contact Form 7用）
========================= */

/* 全体の入力欄を拡大・見やすく */
.wpcf7 form input[type="text"],
.wpcf7 form input[type="email"],
.wpcf7 form input[type="tel"],
.wpcf7 form textarea {
  width: 100%;
  font-size: 1rem;          /* ← 基本文字サイズ（16px相当） */
  line-height: 1.6;
  padding: 0.75em 1em;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-sizing: border-box;
  background-color: #fff;
  transition: border-color 0.3s, box-shadow 0.3s;
}

/* フォーカス時の視認性アップ */
.wpcf7 form input:focus,
.wpcf7 form textarea:focus {
  border-color: #0073aa;
  box-shadow: 0 0 4px rgba(32, 111, 89, 0.4);s
  outline: none;
}

/* ラベルの余白調整 */
.wpcf7 form label {
  display: block;
  margin-bottom: 1em;
			font-size: 1rem;
}

/* 送信ボタン */
.wpcf7 form input[type="submit"] {
  display: inline-block;
  padding: 0.8em 2em;
  background: #333;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 1rem;
  transition: background 0.3s;
}
.wpcf7 form input[type="submit"]:hover {
  background: #555;
}

/* =========================
   スマホ用の微調整
========================= */
@media (max-width: 600px) {
  .wpcf7 form input[type="text"],
  .wpcf7 form input[type="email"],
  .wpcf7 form input[type="tel"],
  .wpcf7 form textarea {
    font-size: 1.8rem;       /* ← スマホでは文字を少し大きく */
    padding: 1em;            /* ← タップしやすい余白 */
  }

  .wpcf7 form input[type="submit"] {
    width: 100%;             /* ← スマホではボタンを横いっぱいに */
    font-size: 1.8rem;
			}
.wpcf7 form label {
  font-size: 2rem;
			}

}

/* フッターSP文字サイズ調整 */
		@media (max-width: 600px) {
.wp-block-site-title {
  box-sizing: border-box;
  font-size: 2rem!important;
			}
.wp-block-site-tagline {
  font-size: 1.5rem!important;
			}
  footer h2.wp-block-heading {
    font-size: 1.4em !important;
  }
		}
		
/* お知らせ一覧SP文字サイズ調整 */
@media (max-width: 600px) {
  .wp-block-post-date time {
    font-size: 1.8rem !important;
			}
			.wp-block-post-title{
				font-size: 2rem !important;
			line-height: 1.3 !important;	
}
  .taxonomy-category.wp-block-post-terms {
    font-size: 1.3rem !important;
  }
		}
		
/* ロケーションリスト */	
.location-list {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

.location-list ul {
  list-style-type: none;
  padding: 0;
}

.location-list li {
  border: 1px solid #ddd;
  margin-bottom: 10px;
  padding: 10px;
}

.location-list h2 {
  font-size: 1.5em;
  color: #333;
}
		
		

		
/* --- ロケ地詳細ページ --- */
.location-single {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
}

.location-mainimg img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 30px;
}

.grid-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}

.location-cat .cat-label {
  display: inline-block;
  background: #206f59;
  color: #fff;
  font-size: 0.9em;
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 10px;
}

.location-name {
  font-size: 1.8rem;
  margin: 10px 0 20px;
}

.location-detail-list {
  font-size: 1rem;
}

.location-detail-list dt {
  font-weight: bold;
  float: left;
  width: 6em;
  clear: left;
}

.location-detail-list dd {
  margin: 0 0 10px 6em;
}

.googlemap iframe {
  width: 100%;
  height: 350px;
  border: 0;
  border-radius: 6px;
}

/* --- スマホ対応 --- */
@media (max-width: 768px) {
  .grid-2col {
    grid-template-columns: 1fr;
  }
  .location-name {
    font-size: 1.5rem;
  }
		}
		
/* --- ロケ地リスト投稿 --- */
		
		.lc-ttl-bb {
	position: relative;
  padding: 0.5rem 0;
  border-bottom: 1px solid #fff;
			
		}
		
		.location-title {
			font-size:1.4rem;
			color:#fff;
			
		}
		.location-exp {

		}
		
		
		@media (max-width: 600px) {
			
		.location-title {
			font-size:2.3rem!important;
			color:#fff;
			
		}
		}
		
/* ▼ FSEページネーション（次のページ）ボタン風スタイル ▼ */
		.wp-block-query-pagination-next,
	.wp-block-query-pagination-previous	{
  display: inline-block;
background-color: #fff;
  color: #272727 !important;
  padding: 0.6em 1.2em;
  border-radius: 5px;       /* 丸み */
  text-decoration: none;
  font-weight: 600;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

/* ホバー時 */
		.wp-block-query-pagination-next:hover,
	.wp-block-query-pagination-previous:hover	{
  background-color: #dfdfdf;
  text-decoration: none;
}

/* 矢印との間隔を少し広げる */
.wp-block-query-pagination-next .is-arrow-arrow {
  margin-left: 0.3em;
}

/* ページネーション全体の配置調整 */
.wp-block-query-pagination {
  text-align: center;
  margin-top: 2em;
}

/* 小さい画面用（スマホ）調整 */
@media (max-width: 600px) {
			.wp-block-query-pagination-next,
		.wp-block-query-pagination-previous	{
    font-size: 1.5rem;
    padding: 0.5em 1em;
  }
}
		
		/* スマホ用（画面幅768px以下） */
@media (max-width: 600px) {
  .wp-block-query-title,
  .wp-block-archive-title {
    font-size: 2.1rem!important;
    line-height: 1.3;
  }
		}
		
/* ▼ 個別投稿ページ「前・次」ナビゲーション（FSEブロック対応） ▼ */
.wp-block-post-navigation-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  text-align: center;
  background-color: #698073;
  color: #fff !important;
  padding: 0.8em 1.4em;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

/* ホバー時：少し浮き上がる */
.wp-block-post-navigation-link:hover {
  background-color: #808080;
  transform: translateY(-3px);
}

/* 矢印マークの調整 */
.wp-block-post-navigation-link__arrow-previous {
  margin-right: 0.3em;
}
.wp-block-post-navigation-link__arrow-next {
  margin-left: 0.3em;
}

/* ラベル（前:・次:）を少し控えめに */
.post-navigation-link__label {
  opacity: 0.85;
  font-size: 0.9em;
  margin-right: 0.2em;
}
	
/* ▼ 矢印アイコンを変更（← → → ◀︎ ▶︎） ▼ */
.wp-block-post-navigation-link__arrow-previous::before {
  content: "◀︎";
}

.wp-block-post-navigation-link__arrow-next::before {
  content: "▶︎";
}

/* 元の ← → を非表示にする */
.wp-block-post-navigation-link__arrow-previous,
.wp-block-post-navigation-link__arrow-next {
  font-size: 0; /* 中身を隠す */
  position: relative;
}

.wp-block-post-navigation-link__arrow-previous::before,
.wp-block-post-navigation-link__arrow-next::before {
  font-size: 1rem; /* 新しいアイコンのサイズ */
  color: inherit;
  position: relative;
  top: 0;
}
/* ▼ 投稿ナビゲーションの装飾調整 ▼ */

/* 下線を消す */
.wp-block-post-navigation-link a {
  text-decoration: none !important;
}

/* ホバー時も下線を出さない */
.wp-block-post-navigation-link a:hover {
  text-decoration: none !important;
}

/* 「前:」「次:」のテキストを非表示にする */
.post-navigation-link__label {
  display: none;
}

@media (max-width: 600px) {
  .wp-block-post-navigation-link {
    font-size: 1.8rem;
  }
}

/* 全体のナビゲーションエリアの配置 
.wp-block-group.is-content-justification-space-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 3em;
  padding-top: 2em;
  border-top: 1px solid #ddd;
}*/
	
/* スマホで中央揃え＆縦並び 
@media (max-width: 768px) {
  .wp-block-group.is-content-justification-space-between {
    flex-direction: column;
    gap: 1em;
  }
  .wp-block-post-navigation-link {
    width: 100%;
    max-width: 320px;
  }
}*/
		
@media (max-width: 600px) {
.wp-block-archives-list,
.wp-block-categories-list	{
  font-size: 1.8rem;
			}
.wp-block-search__label {
  font-size: 1.8rem;
}
		}
/* スマホ画面（幅600px以下） */
@media (max-width: 600px) {
  .wp-block-search__input {
    font-size: 15px; /* ← スマホで少し大きめに */
    padding: 0.6em 1em; /* ← 余白も広げて押しやすく */
  }

  /* 検索ボタンも少し大きくする場合 */
  .wp-block-search__button {
    font-size: 15px;
    padding: 0.6em 1.2em;
  }
		}

/* ▼ スマホ時のみ▼ */

@media (max-width: 768px) {
  /* ハンバーガーのボタン全体 */
  .wp-block-navigation__responsive-container-open {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* 「Menu」ラベルを疑似要素で追加 */
  .wp-block-navigation__responsive-container-open::after {
    content: "MENU"; /* ← 表示文字 */
    display: block;
    font-size: 12px;
    color: #fff;
    margin-top: 4px;
    letter-spacing: 0.05em;
  }
}
		
/* ▼ カスタムスライドダウン式ナビ （スマホ限定）上からドロップアニメーション▼ */
@media (max-width: 768px) {
			
/* トグルボタンのスタイル */
.wp-block-navigation__responsive-container-open {
    background-color: #444; /* ボタンの背景色 */
    border: none; /* ボーダーを削除 */
    border-radius: 5px; /* 角を丸くする */
    cursor: pointer; /* カーソルをポインターに */
    padding: 10px; /* 内側の余白 */
    transition: background-color 0.3s; /* 背景色のトランジション */
}

.wp-block-navigation__responsive-container-open:hover {
    background-color: #555; /* ホバー時の背景色 */
}

/* ×マークのスタイル */
.wp-block-navigation__responsive-container-close {
    background-color: transparent; /* 背景色を透明に */
    border: none; /* ボーダーを削除 */
    cursor: pointer; /* カーソルをポインターに */
				padding: 10px; /* 内側の余白 */
}

/* メニューのオーバーレイスタイル */
.wp-block-navigation__responsive-container {
    background-color: rgba(0, 0, 0, 0.8); /* 背景を半透明に */
    color: #fff; /* テキスト色を白に */
    padding: 20px; /* 内側の余白 */
}

/* 現在のメニュー項目のスタイル */
.current-menu-item a {
    background-color: rgba(255, 255, 255, 0.1); /* 現在の項目の背景色 */
}

/* ナビゲーションリンクのスタイル */
header .wp-block-navigation__container {
    width: 100%!important; /* 幅を100%に設定 */
	position: relative!important; /* 相対位置を設定 */
}

header .wp-block-navigation__container li {
    width: 100%!important; /* 幅を100%に設定 */
    border-bottom: 1px solid #eee!important; /* 下線 */
    text-align: center; /* テキストを中央揃え */
}

header .wp-block-navigation__container a {
    color: #fff; /* リンクの色を白に */
    text-decoration: none; /* 下線を削除 */
    padding: 15px 0!important; /* 上下の内側の余白 */
    display: block; /* ブロック要素にする */
    transition: background-color 0.3s; /* 背景色のトランジション */
	width: 100%; /* 幅を100%に設定 */
	font-size: 17px; /* フォントサイズを大きくする */
	font-weight: nomal; /* 現在のメニュー項目を太字に */
}
/* ×印の下に余白を追加 */
header .wp-block-navigation__container {
    margin-top: 30px!important;
}
header .wp-block-navigation__container a:hover {
    background-color: rgba(255, 255, 255, 0.2); /* ホバー時の背景色 */
}

/* オーバーレイメニューのリンクをセンター揃え */
header .wp-block-navigation__responsive-container-content {
    display: flex; /* フレックスボックスを使用 */
    flex-direction: column; /* 縦に並べる */
    align-items: center!important; /* 中央揃え */
    justify-content: center!important; /* 垂直方向も中央揃え */
    height: 100%; /* 高さを100%に */
}
/* メニューを閉じるボタンのスタイル */
.wp-block-navigation__responsive-container-close {
    background-color: rgba(0, 0, 0, 0.5); /* 半透明の黒背景 */
    border: none; /* ボーダーを削除 */
    color: #fff; /* テキストの色を白に */
    font-size: 24px; /* フォントサイズを大きくする */
    padding: 10px; /* 内側の余白を追加 */
    cursor: pointer; /* カーソルをポインターに変更 */
    transition: background-color 0.3s; /* 背景色のトランジション */
    margin-bottom: 20px; /* 下に余白を追加 */
    position: absolute; /* 絶対位置に設定 */
    top: 10px; /* 上からの位置 */
    right: 10px; /* 右からの位置 */
    border-radius: 5px; /* 角を丸くする */
    z-index: 1000; /* 他の要素の上に表示 */
}

.wp-block-navigation__responsive-container-close:hover {
    background-color: rgba(0, 0, 0, 0.7); /* ホバー時の背景色 */
}

			
}