.elementor-kit-6{--e-global-color-primary:#000000;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#333333;--e-global-color-accent:#69BD83;--e-global-color-635dd4b:#00338D;--e-global-color-df893ce:#00529A;--e-global-color-9fc5089:#FFCE00;--e-global-color-76fa0e7:#E0B500;--e-global-color-ddcfada:#7A2582;--e-global-color-1fcae43:#F7FBF8;--e-global-color-18ab41e:#005122;--e-global-color-59c40ad:#69BD83;--e-global-color-17fd485:#FF821C;--e-global-color-240904c:#E6FFF1;--e-global-color-4af0d34:#555555;--e-global-color-6a4556e:#F5F5F5;--e-global-typography-primary-font-family:"Zen Kaku Gothic New";--e-global-typography-primary-font-size:18px;--e-global-typography-primary-font-weight:500;--e-global-typography-primary-line-height:1.4;--e-global-typography-secondary-font-family:"Zen Kaku Gothic New";--e-global-typography-secondary-font-size:18px;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Zen Kaku Gothic New";--e-global-typography-text-font-size:22px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:38px;--e-global-typography-accent-font-family:"Noto Sans JP";--e-global-typography-accent-font-size:22px;--e-global-typography-accent-font-weight:700;color:#333333;font-family:"Kiwi Maru", Sans-serif;font-size:22px;line-height:30px;}.elementor-kit-6 a{color:var( --e-global-color-59c40ad );text-decoration:underline;}.elementor-kit-6 a:hover{color:var( --e-global-color-18ab41e );}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header{padding-inline-end:0px;padding-inline-start:0px;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{--e-global-typography-primary-font-size:18px;--e-global-typography-text-font-size:18px;font-size:18px;}.elementor-kit-6 a{font-size:18px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */body:not(.elementor-editor-active) .elementor-widget-menu-anchor {
	  position: relative;
	  z-index: -1;
	}

	body:not(.elementor-editor-active) .elementor-menu-anchor:before {
	  content: "";
	  display: block;
	  height: 80px; /* fixed header height*/
	  margin: -80px 0 0; /* negative fixed header height */
	  visibility: hidden;
	  pointer-events: none;
	}
	
	/*デスクトップとスマホで改行を切り替える*/
.br-dt {display:none; }
.br-sp {display: inline; }
@media screen and (min-width: 768px){
.br-dt {display:inline; }
.br-sp {display: none; }
}

/* ===============================================
   モーダルメニュー スタイル (clip-path版)
=============================================== */

/* モーダルメニューの基本スタイル（閉じた状態） */
.modal-menu {
  position: fixed;
  top: 0;
  left: auto;
  right: 0;
/* Elementorで調整 */
  /*width: 100%;
  height: 100vh;*/
  /* ビューポートの高さ一杯に */
/* 参考サイトの背景色 */
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  z-index: 999;

  /* アニメーションの定義 */
  transition: clip-path 0.7s cubic-bezier(0.31, -0.01, 0.18, 0.97), opacity 0.4s;
  
  /* 初期状態のマスク（下部に閉じた状態） */
  clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}

/* メニュー表示時のスタイル */
.modal-menu.is-active {
  opacity: 1;
  /* 開いた状態のマスク（全体表示） */
  clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}




/* ===============================================
   トグルボタン スタイル
=============================================== */

.toggle-button {
position: fixed;
top: 15px;
right: 30px;
width: 60px;
height: 42px;
cursor: pointer;
z-index: 9999;
background: none;
border: none;
padding: 0;
  /* ↓ この一行を追加 */
mix-blend-mode: difference;
}

.toggle-button span {
display: block;
position: absolute;
left: 6px;
width: 50px;
height: 1px;
  /* ↓ 色を #fff (白) に変更 */
background-color: #fff;
transition: transform 0.5s, opacity 0.5s, background-color 0.5s;
}

/* is-active 時の色も白のままにするか、必要に応じて調整します */
/* mix-blend-mode を使う場合、ここは特に変更しなくても反転します */
.toggle-button.is-active span {
  /* background-color の指定は親から継承されるので、削除してもOKです */
}

.toggle-button span:nth-child(1) { top: 10px; }
.toggle-button span:nth-child(2) { top: 20px; }
.toggle-button span:nth-child(3) { top: 30px; }

.toggle-button.is-active span:nth-child(1) {
top: 20px;
transform: rotate(45deg);
}
.toggle-button.is-active span:nth-child(2) {
opacity: 0;
}
.toggle-button.is-active span:nth-child(3) {
top: 20px;
transform: rotate(-45deg);
}

/* トグルボタンのホバー・フォーカス時の背景色を無効化 */
.toggle-button:hover,
.toggle-button:focus {
  background-color: transparent !important; /* 背景色を強制的に透明にする */
  outline: none; /* フォーカス時の青い枠線も消す場合 */
}


/* ===============================================
   機能性スタイル
=============================================== */
@media screen and (max-width: 768px) {
  .toggle-button {
    top: 15px;
    right: 0px;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  .toggle-button span {
width: 40px;
}
}
body.no-scroll {
  overflow: hidden;
}/* End custom CSS */