.elementor-140 .elementor-element.elementor-element-712e1f2f{--display:flex;--min-height:0px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--overflow:hidden;--overlay-opacity:0.5;border-style:solid;--border-style:solid;border-width:1px 0px 0px 0px;--border-top-width:1px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-728df1b );--border-color:var( --e-global-color-728df1b );--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:80px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;--z-index:100;}.elementor-140 .elementor-element.elementor-element-712e1f2f:not(.elementor-motion-effects-element-type-background), .elementor-140 .elementor-element.elementor-element-712e1f2f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-e51634a );}.elementor-140 .elementor-element.elementor-element-712e1f2f::before, .elementor-140 .elementor-element.elementor-element-712e1f2f > .elementor-background-video-container::before, .elementor-140 .elementor-element.elementor-element-712e1f2f > .e-con-inner > .elementor-background-video-container::before, .elementor-140 .elementor-element.elementor-element-712e1f2f > .elementor-background-slideshow::before, .elementor-140 .elementor-element.elementor-element-712e1f2f > .e-con-inner > .elementor-background-slideshow::before, .elementor-140 .elementor-element.elementor-element-712e1f2f > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-140 .elementor-element.elementor-element-712e1f2f.e-con{--flex-grow:1;--flex-shrink:0;}.elementor-widget-icon-box.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon-box.elementor-view-framed .elementor-icon, .elementor-widget-icon-box.elementor-view-default .elementor-icon{fill:var( --e-global-color-primary );color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-title, .elementor-widget-icon-box .elementor-icon-box-title a{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-icon-box .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box:has(:hover) .elementor-icon-box-title, .elementor-widget-icon-box:has(:focus) .elementor-icon-box-title{color:var( --e-global-color-primary );}.elementor-widget-icon-box .elementor-icon-box-description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-wrapper{align-items:start;}.elementor-140 .elementor-element.elementor-element-6b964ed{--icon-box-icon-margin:15px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title{margin-block-end:14px;color:var( --e-global-color-primary );}.elementor-140 .elementor-element.elementor-element-6b964ed.elementor-view-stacked .elementor-icon{background-color:#FF6221;}.elementor-140 .elementor-element.elementor-element-6b964ed.elementor-view-framed .elementor-icon, .elementor-140 .elementor-element.elementor-element-6b964ed.elementor-view-default .elementor-icon{fill:#FF6221;color:#FF6221;border-color:#FF6221;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon{font-size:21px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title, .elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title a{font-family:"Roboto Condensed", Sans-serif;font-size:47px;font-weight:700;line-height:43px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-description{font-family:"Roboto Condensed", Sans-serif;font-size:18px;font-weight:500;line-height:5px;color:var( --e-global-color-63f0352 );}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-140 .elementor-element.elementor-element-a8ad318 .elementor-button{background-color:var( --e-global-color-237eaab );font-family:"Roboto", Sans-serif;font-weight:700;box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.24);border-style:solid;border-radius:40px 40px 40px 40px;padding:15px 30px 15px 30px;}.elementor-140 .elementor-element.elementor-element-a8ad318 .elementor-button-content-wrapper{flex-direction:row;}.elementor-140 .elementor-element.elementor-element-36b8fe7{--display:flex;--min-height:319px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overflow:hidden;--overlay-opacity:0.5;border-style:solid;--border-style:solid;border-width:1px 0px 0px 0px;--border-top-width:1px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-728df1b );--border-color:var( --e-global-color-728df1b );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;--z-index:100;}.elementor-140 .elementor-element.elementor-element-36b8fe7:not(.elementor-motion-effects-element-type-background), .elementor-140 .elementor-element.elementor-element-36b8fe7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-e51634a );}.elementor-140 .elementor-element.elementor-element-36b8fe7::before, .elementor-140 .elementor-element.elementor-element-36b8fe7 > .elementor-background-video-container::before, .elementor-140 .elementor-element.elementor-element-36b8fe7 > .e-con-inner > .elementor-background-video-container::before, .elementor-140 .elementor-element.elementor-element-36b8fe7 > .elementor-background-slideshow::before, .elementor-140 .elementor-element.elementor-element-36b8fe7 > .e-con-inner > .elementor-background-slideshow::before, .elementor-140 .elementor-element.elementor-element-36b8fe7 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-140 .elementor-element.elementor-element-36b8fe7.e-con{--flex-grow:1;--flex-shrink:0;}.elementor-140 .elementor-element.elementor-element-253a35e{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:5px 5px;--row-gap:5px;--column-gap:5px;}.elementor-140 .elementor-element.elementor-element-253a35e.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-140 .elementor-element.elementor-element-3bb40c5{width:var( --container-widget-width, 38% );max-width:38%;--container-widget-width:38%;--container-widget-flex-grow:0;text-align:left;}.elementor-140 .elementor-element.elementor-element-3bb40c5.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-140 .elementor-element.elementor-element-3bb40c5 img{width:100%;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-140 .elementor-element.elementor-element-3aca844 .elementor-heading-title{font-family:"Murecho", Sans-serif;font-size:18px;font-weight:600;letter-spacing:1.3px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(min-width:768px){.elementor-140 .elementor-element.elementor-element-36b8fe7{--content-width:1280px;}.elementor-140 .elementor-element.elementor-element-253a35e{--width:100%;}}@media(max-width:1024px){.elementor-140 .elementor-element.elementor-element-712e1f2f{--min-height:35px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:10px;--padding-left:50px;--padding-right:50px;}.elementor-widget-icon-box .elementor-icon-box-description{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-140 .elementor-element.elementor-element-6b964ed{--icon-box-icon-margin:6px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title{margin-block-end:8px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon{font-size:20px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title, .elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title a{font-size:43px;line-height:0.9em;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-description{font-size:14px;line-height:1.6em;}.elementor-140 .elementor-element.elementor-element-36b8fe7{--min-height:333px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:flex-start;--gap:30px 30px;--row-gap:30px;--column-gap:30px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;}.elementor-140 .elementor-element.elementor-element-253a35e{--justify-content:flex-start;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-140 .elementor-element.elementor-element-3bb40c5{--container-widget-width:348px;--container-widget-flex-grow:0;width:var( --container-widget-width, 348px );max-width:348px;}.elementor-140 .elementor-element.elementor-element-3aca844 .elementor-heading-title{font-size:16px;}}@media(max-width:767px){.elementor-140 .elementor-element.elementor-element-712e1f2f{--justify-content:flex-end;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:40px;--padding-bottom:30px;--padding-left:0px;--padding-right:0px;--z-index:100;}.elementor-140 .elementor-element.elementor-element-712e1f2f.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-icon-box .elementor-icon-box-description{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-140 .elementor-element.elementor-element-6b964ed{padding:0px 0px 0px 0px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-wrapper{text-align:left;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title{margin-block-end:0px;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title, .elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-title a{font-size:41px;line-height:1em;}.elementor-140 .elementor-element.elementor-element-6b964ed .elementor-icon-box-description{font-size:0px;line-height:0em;}.elementor-140 .elementor-element.elementor-element-36b8fe7{--min-height:60px;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:10px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;--z-index:100;}.elementor-140 .elementor-element.elementor-element-36b8fe7.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-140 .elementor-element.elementor-element-253a35e{--width:100%;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:0px;}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-140 .elementor-element.elementor-element-3bb40c5{--container-widget-width:241px;--container-widget-flex-grow:0;width:var( --container-widget-width, 241px );max-width:241px;}.elementor-140 .elementor-element.elementor-element-3aca844 .elementor-heading-title{font-size:15px;line-height:2em;}}@media(max-width:1024px) and (min-width:768px){.elementor-140 .elementor-element.elementor-element-712e1f2f{--content-width:785px;}.elementor-140 .elementor-element.elementor-element-36b8fe7{--content-width:100%;}.elementor-140 .elementor-element.elementor-element-253a35e{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-712e1f2f */header.sticky-header { /* スクロール前（通常時）のヘッダー設定 */ --header-height: 70px; --opacity: 1; --shrink-me: 0.9; --sticky-background-color: #fff; --transition: .8s ease-in-out; /* スクロール時のアニメーションを滑らかにするための設定 */ transition: background-color var(--transition), background-image var(--transition), backdrop-filter var(--transition), opacity var(--transition), padding var(--transition), min-height var(--transition); } header.sticky-header.elementor-sticky--effects { /* スクロール後のヘッダー設定 */ background-color: var(--sticky-background-color) !important; background-image: none !important; opacity: var(--opacity) !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); /* ヘッダーの高さのみを縮小 */ min-height: calc(var(--header-height) * var(--shrink-me)) !important; height: calc(var(--header-height) * var(--shrink-me)); } header.sticky-header.elementor-sticky--effects .elementor-container { /* コンテナの上下パディングを維持 */ padding-top: 5px !important; padding-bottom: 5px !important; } /* ロゴと特定のテキストの設定 */ header.sticky-header .logo img, header.sticky-header .text-item { transition: transform var(--transition); } header.sticky-header.elementor-sticky--effects .logo img, header.sticky-header.elementor-sticky--effects .text-item { /* スクロール後にロゴとテキストを個別に縮小する */ transform: scale(var(--shrink-me)); } /* =============================================== モーダルメニュー スタイル (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 */ /* Start custom CSS for container, class: .elementor-element-36b8fe7 */header.sticky-header { /* スクロール前（通常時）のヘッダー設定 */ --header-height: 70px; --opacity: 1; --shrink-me: 0.9; --sticky-background-color: #fff; --transition: .8s ease-in-out; /* スクロール時のアニメーションを滑らかにするための設定 */ transition: background-color var(--transition), background-image var(--transition), backdrop-filter var(--transition), opacity var(--transition), padding var(--transition), min-height var(--transition); } header.sticky-header.elementor-sticky--effects { /* スクロール後のヘッダー設定 */ background-color: var(--sticky-background-color) !important; background-image: none !important; opacity: var(--opacity) !important; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); /* ヘッダーの高さのみを縮小 */ min-height: calc(var(--header-height) * var(--shrink-me)) !important; height: calc(var(--header-height) * var(--shrink-me)); } header.sticky-header.elementor-sticky--effects .elementor-container { /* コンテナの上下パディングを維持 */ padding-top: 5px !important; padding-bottom: 5px !important; } /* ロゴと特定のテキストの設定 */ header.sticky-header .logo img, header.sticky-header .text-item { transition: transform var(--transition); } header.sticky-header.elementor-sticky--effects .logo img, header.sticky-header.elementor-sticky--effects .text-item { /* スクロール後にロゴとテキストを個別に縮小する */ transform: scale(var(--shrink-me)); } /* =============================================== モーダルメニュー スタイル (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 */