.elementor-37 .elementor-element.elementor-element-fc6b8d0{margin-top:0px;margin-bottom:0px;padding:6.25rem 0rem 6.25rem 0rem;}.elementor-37 .elementor-element.elementor-element-43e18e3 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-37 .elementor-element.elementor-element-d1ac67b{--display:flex;--gap:5rem 0rem;--row-gap:5rem;--column-gap:0rem;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-596c739 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 5px 0px;border-style:solid;border-width:0px 0px 3px 0px;border-color:var( --e-global-color-a7cf8c3 );}.elementor-37 .elementor-element.elementor-element-596c739.elementor-element{--align-self:center;}.elementor-37 .elementor-element.elementor-element-596c739{text-align:center;}.elementor-37 .elementor-element.elementor-element-596c739 .elementor-heading-title{font-size:var( --e-global-typography-1f434bf-font-size );font-weight:var( --e-global-typography-1f434bf-font-weight );line-height:var( --e-global-typography-1f434bf-line-height );letter-spacing:var( --e-global-typography-1f434bf-letter-spacing );color:var( --e-global-color-9317903 );}.elementor-37 .elementor-element.elementor-element-bcfeef8{text-align:center;font-family:var( --e-global-typography-text-font-family ), \"Noto Sans JP\", \"Hiragino Kaku Gothic ProN\", \"ヒラギノ角ゴ ProN W3\", \"Meiryo\" , \"メイリオ\", \"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 );letter-spacing:var( --e-global-typography-text-letter-spacing );color:var( --e-global-color-67403cb );}.elementor-37 .elementor-element.elementor-element-3a9fab2 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:3rem 0rem 0rem 0rem;}.elementor-37 .elementor-element.elementor-element-d7801f8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:5rem;--padding-bottom:5rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-d7801f8:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-d7801f8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://yokoele.com/wp/wp-content/uploads/2026/07/contact-q-and-a-bg-scaled.avif");background-position:center center;background-repeat:no-repeat;background-size:130% auto;}.elementor-37 .elementor-element.elementor-element-e676c15{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-f691b08{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:3rem 0rem;--row-gap:3rem;--column-gap:0rem;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-5ea8531{--display:grid;--e-con-grid-template-columns:35% 65%;--e-con-grid-template-rows:repeat(1, 1fr);--gap:0rem 0rem;--row-gap:0rem;--column-gap:0rem;--grid-auto-flow:row;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-a407090{--display:flex;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:none;--border-style:none;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-b53323f > .elementor-widget-container{margin:0rem 0rem 0rem 0rem;padding:0px 0px 0px 0px;}.elementor-37 .elementor-element.elementor-element-b53323f .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), \"Noto Sans JP\", \"Hiragino Kaku Gothic ProN\", \"ヒラギノ角ゴ ProN W3\", \"Meiryo\" , \"メイリオ\", \"sans-serif\";font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );color:var( --e-global-color-154c77e7 );}.elementor-37 .elementor-element.elementor-element-a84a270{--display:flex;--justify-content:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:solid;--border-style:solid;border-width:0px 0px 0px 2px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:2px;border-color:var( --e-global-color-154c77e7 );--border-color:var( --e-global-color-154c77e7 );--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-f5a59be > .elementor-widget-container{margin:0rem 0rem 0rem 2rem;padding:0px 0px 0px 0px;}.elementor-37 .elementor-element.elementor-element-f5a59be .elementor-heading-title{font-family:var( --e-global-typography-secondary-font-family ), \"Noto Sans JP\", \"Hiragino Kaku Gothic ProN\", \"ヒラギノ角ゴ ProN W3\", \"Meiryo\" , \"メイリオ\", \"sans-serif\";font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );color:var( --e-global-color-154c77e7 );}.elementor-37 .elementor-element.elementor-element-ceefbc0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-8212180{font-family:var( --e-global-typography-text-font-family ), \"Noto Sans JP\", \"Hiragino Kaku Gothic ProN\", \"ヒラギノ角ゴ ProN W3\", \"Meiryo\" , \"メイリオ\", \"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 );letter-spacing:var( --e-global-typography-text-letter-spacing );color:var( --e-global-color-154c77e7 );}.elementor-37 .elementor-element.elementor-element-b70e940{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--gap:2rem 0rem;--row-gap:2rem;--column-gap:0rem;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-9e9b826{--display:flex;--justify-content:center;--gap:0.5rem 0rem;--row-gap:0.5rem;--column-gap:0rem;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-895e018 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-37 .elementor-element.elementor-element-895e018{text-align:center;}.elementor-37 .elementor-element.elementor-element-895e018 .elementor-heading-title{font-size:var( --e-global-typography-91a433c-font-size );font-weight:var( --e-global-typography-91a433c-font-weight );line-height:var( --e-global-typography-91a433c-line-height );letter-spacing:var( --e-global-typography-91a433c-letter-spacing );color:var( --e-global-color-154c77e7 );}.elementor-37 .elementor-element.elementor-element-a6d56f8 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-37 .elementor-element.elementor-element-a6d56f8{text-align:center;}.elementor-37 .elementor-element.elementor-element-a6d56f8 .elementor-heading-title{font-size:var( --e-global-typography-b0d27ab-font-size );font-weight:var( --e-global-typography-b0d27ab-font-weight );line-height:var( --e-global-typography-b0d27ab-line-height );letter-spacing:var( --e-global-typography-b0d27ab-letter-spacing );color:var( --e-global-color-154c77e7 );}@media(min-width:768px){.elementor-37 .elementor-element.elementor-element-f691b08{--width:50%;}.elementor-37 .elementor-element.elementor-element-b70e940{--width:50%;}}@media(max-width:959px){.elementor-37 .elementor-element.elementor-element-fc6b8d0{padding:3rem 2rem 3rem 2rem;}.elementor-37 .elementor-element.elementor-element-d1ac67b{--gap:3rem 0rem;--row-gap:3rem;--column-gap:0rem;}.elementor-37 .elementor-element.elementor-element-596c739 .elementor-heading-title{font-size:var( --e-global-typography-1f434bf-font-size );line-height:var( --e-global-typography-1f434bf-line-height );letter-spacing:var( --e-global-typography-1f434bf-letter-spacing );}.elementor-37 .elementor-element.elementor-element-bcfeef8{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-37 .elementor-element.elementor-element-3a9fab2 > .elementor-widget-container{padding:3rem 0rem 0rem 0rem;}.elementor-37 .elementor-element.elementor-element-d7801f8:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-d7801f8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-size:cover;}.elementor-37 .elementor-element.elementor-element-d7801f8{--padding-top:3rem;--padding-bottom:3rem;--padding-left:2rem;--padding-right:2rem;}.elementor-37 .elementor-element.elementor-element-e676c15{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-f691b08{--gap:2rem 0rem;--row-gap:2rem;--column-gap:0rem;--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-5ea8531{--e-con-grid-template-columns:37% 63%;--grid-auto-flow:row;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-37 .elementor-element.elementor-element-a407090{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-37 .elementor-element.elementor-element-b53323f .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-37 .elementor-element.elementor-element-f5a59be > .elementor-widget-container{margin:0rem 0rem 0rem 1rem;}.elementor-37 .elementor-element.elementor-element-f5a59be .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-37 .elementor-element.elementor-element-8212180 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0rem 2rem 0rem 0rem;}.elementor-37 .elementor-element.elementor-element-8212180{text-align:justify;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-37 .elementor-element.elementor-element-b70e940{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:1.5rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-895e018 .elementor-heading-title{font-size:var( --e-global-typography-91a433c-font-size );line-height:var( --e-global-typography-91a433c-line-height );letter-spacing:var( --e-global-typography-91a433c-letter-spacing );}.elementor-37 .elementor-element.elementor-element-a6d56f8 .elementor-heading-title{font-size:var( --e-global-typography-b0d27ab-font-size );line-height:var( --e-global-typography-b0d27ab-line-height );letter-spacing:var( --e-global-typography-b0d27ab-letter-spacing );}}@media(max-width:767px){.elementor-37 .elementor-element.elementor-element-fc6b8d0{margin-top:0px;margin-bottom:0px;padding:1rem 1.25rem 3rem 1.25rem;}.elementor-37 .elementor-element.elementor-element-43e18e3 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:0px;}.elementor-37 .elementor-element.elementor-element-43e18e3 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-37 .elementor-element.elementor-element-596c739 .elementor-heading-title{font-size:var( --e-global-typography-1f434bf-font-size );line-height:var( --e-global-typography-1f434bf-line-height );letter-spacing:var( --e-global-typography-1f434bf-letter-spacing );}.elementor-37 .elementor-element.elementor-element-bcfeef8{text-align:justify;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-37 .elementor-element.elementor-element-3a9fab2 > .elementor-widget-container{padding:2rem 0rem 0rem 0rem;}.elementor-37 .elementor-element.elementor-element-d7801f8{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-e676c15{--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-f691b08:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-f691b08 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://yokoele.com/wp/wp-content/uploads/2026/07/corporate-blue-overlay-laptop-bg.avif");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-37 .elementor-element.elementor-element-f691b08{--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;--padding-top:2rem;--padding-bottom:2rem;--padding-left:1.25rem;--padding-right:1.25rem;}.elementor-37 .elementor-element.elementor-element-5ea8531{--e-con-grid-template-columns:25% 75%;--grid-auto-flow:row;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0rem;--padding-bottom:0rem;--padding-left:0rem;--padding-right:0rem;}.elementor-37 .elementor-element.elementor-element-a407090{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-37 .elementor-element.elementor-element-b53323f .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );letter-spacing:var( --e-global-typography-primary-letter-spacing );}.elementor-37 .elementor-element.elementor-element-f5a59be .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-37 .elementor-element.elementor-element-8212180 > .elementor-widget-container{padding:0rem 0rem 0rem 0rem;}.elementor-37 .elementor-element.elementor-element-8212180{text-align:justify;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-37 .elementor-element.elementor-element-b70e940:not(.elementor-motion-effects-element-type-background), .elementor-37 .elementor-element.elementor-element-b70e940 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://yokoele.com/wp/wp-content/uploads/2026/07/contact-q-and-a-bg-scaled.avif");background-position:top right;background-repeat:no-repeat;background-size:cover;}.elementor-37 .elementor-element.elementor-element-b70e940{--gap:2rem 0rem;--row-gap:2rem;--column-gap:0rem;--padding-top:2rem;--padding-bottom:2rem;--padding-left:1.25rem;--padding-right:1.25rem;}.elementor-37 .elementor-element.elementor-element-9e9b826{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-37 .elementor-element.elementor-element-895e018 .elementor-heading-title{font-size:var( --e-global-typography-91a433c-font-size );line-height:var( --e-global-typography-91a433c-line-height );letter-spacing:var( --e-global-typography-91a433c-letter-spacing );}.elementor-37 .elementor-element.elementor-element-a6d56f8 .elementor-heading-title{font-size:var( --e-global-typography-b0d27ab-font-size );line-height:var( --e-global-typography-b0d27ab-line-height );letter-spacing:var( --e-global-typography-b0d27ab-letter-spacing );}}/* Start custom CSS for html, class: .elementor-element-200e55c */@media screen and (min-width:960px) {
    
    /* ==========================================
   ボタン全体のベーススタイル
   ========================================== */
.elementor-37 .elementor-element.elementor-element-200e55c .custom-premium-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    
    width: 100%;
    max-width: 365px; 
    min-height: 60px;
    margin: 0 auto;
    padding: 10px 60px;
    box-sizing: border-box;
    border-radius: 5px;
    
    background-color: #ffffff !important;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: background-color 0.4s ease;
}

/* ホバー時のネイビー背景 */
.custom-premium-btn::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: #00B8FB !important;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.4s ease;
}
.custom-premium-btn:hover::before {
    opacity: 1;
}

/* 中身を最前面に */
.mail-icon-mask, .btn-text, .arrow-circle {
    position: relative;
    z-index: 10;
}

/* ==========================================
   各パーツのデザイン調整
   ========================================== */

/* 中央のテキスト */
.btn-text {
    color: #333333 !important;
    font-size: 18px !important;
    font-weight: 600 !important; /* しっかり太字 */
    font-family: inherit;
    letter-spacing: 0.05em;
    transition: color 0.4s ease;
}
.custom-premium-btn:hover .btn-text {
    color: #ffffff !important;
}

/* 🛠️ 左側の手紙アイコン（URLを色反転させる特殊マスク設定） */
.mail-icon-mask {
    display: inline-block;
    width: 26px; /* アイコンの横幅 */
    height: 22px; /* アイコンの縦幅 */
    margin-right: 14px;
    background-color: #40B4F5; /* 通常時の手紙の色（青） */
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    flex-shrink: 0;
    transition: background-color 0.4s ease;
}

/* ホバー時に手紙の色を【白】に変更 */
.custom-premium-btn:hover .mail-icon-mask {
    background-color: #ffffff;
}

/* 右側の丸アイコン */
.arrow-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-left: auto;
    position: relative;
    background-color: #ffffff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.arrow-circle::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    border-radius: 50%;
    background: linear-gradient(90deg, #5363D7, #40B4F5) !important;
    z-index: 1;
    transition: opacity 0.4s ease;
}
.custom-premium-btn:hover .arrow-circle::before {
    opacity: 0;
}

/* 丸の中の矢印 */
.arrow-circle::after {
    content: '';
    width: 7px;
    height: 7px;
    border-top: 3px solid #ffffff !important;
    border-right: 3px solid #ffffff !important;
    transform: rotate(45deg);
    position: relative;
    z-index: 2;
    margin-left: -2px;
    transition: border-color 0.4s ease;
}
.custom-premium-btn:hover .arrow-circle::after {
    border-top: 3px solid #1B3679 !important;
    border-right: 3px solid #1B3679 !important;
}
}

@media screen and (min-width:768px)and (max-width: 959px) {
    
    /* ==========================================
   ボタン全体のベーススタイル
   ========================================== */
.elementor-37 .elementor-element.elementor-element-200e55c .custom-premium-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    
    width: 100%;
    max-width: 326px; 
    min-height: 50px;
    margin: 0 auto;
    padding: 10px 53px;
    box-sizing: border-box;
    border-radius: 5px;
    
    background-color: #ffffff !important;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: background-color 0.4s ease;
}

/* ホバー時のネイビー背景 */
.custom-premium-btn::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: #00B8FB !important;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.4s ease;
}
.custom-premium-btn:hover::before {
    opacity: 1;
}

/* 中身を最前面に */
.mail-icon-mask, .btn-text, .arrow-circle {
    position: relative;
    z-index: 10;
}

/* ==========================================
   各パーツのデザイン調整
   ========================================== */

/* 中央のテキスト */
.btn-text {
    color: #333333 !important;
    font-size: 16px !important;
    font-weight: 600 !important; /* しっかり太字 */
    font-family: inherit;
    letter-spacing: 0.05em;
    transition: color 0.4s ease;
}
.custom-premium-btn:hover .btn-text {
    color: #ffffff !important;
}

/* 🛠️ 左側の手紙アイコン（URLを色反転させる特殊マスク設定） */
.mail-icon-mask {
    display: inline-block;
    width: 26px; /* アイコンの横幅 */
    height: 22px; /* アイコンの縦幅 */
    margin-right: 14px;
    background-color: #40B4F5; /* 通常時の手紙の色（青） */
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    flex-shrink: 0;
    transition: background-color 0.4s ease;
}

/* ホバー時に手紙の色を【白】に変更 */
.custom-premium-btn:hover .mail-icon-mask {
    background-color: #ffffff;
}

/* 右側の丸アイコン */
.arrow-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-left: auto;
    position: relative;
    background-color: #ffffff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.arrow-circle::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    border-radius: 50%;
    background: linear-gradient(90deg, #5363D7, #40B4F5) !important;
    z-index: 1;
    transition: opacity 0.4s ease;
}
.custom-premium-btn:hover .arrow-circle::before {
    opacity: 0;
}

/* 丸の中の矢印 */
.arrow-circle::after {
    content: '';
    width: 7px;
    height: 7px;
    border-top: 3px solid #ffffff !important;
    border-right: 3px solid #ffffff !important;
    transform: rotate(45deg);
    position: relative;
    z-index: 2;
    margin-left: -2px;
    transition: border-color 0.4s ease;
}
.custom-premium-btn:hover .arrow-circle::after {
    border-top: 3px solid #1B3679 !important;
    border-right: 3px solid #1B3679 !important;
}
}


@media screen and (max-width: 767px) {
    
    /* ==========================================
   ボタン全体のベーススタイル
   ========================================== */
.elementor-37 .elementor-element.elementor-element-200e55c .custom-premium-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    overflow: hidden;
    
    width: 100%;
    max-width: 100%; 
    min-height: 50px;
    margin: 0 auto;
    padding: 10px 56px;
    box-sizing: border-box;
    border-radius: 5px;
    
    background-color: #ffffff !important;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: background-color 0.4s ease;
}

/* ホバー時のネイビー背景 */
.custom-premium-btn::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: #00B8FB !important;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.4s ease;
}
.custom-premium-btn:hover::before {
    opacity: 1;
}

/* 中身を最前面に */
.mail-icon-mask, .btn-text, .arrow-circle {
    position: relative;
    z-index: 10;
}

/* ==========================================
   各パーツのデザイン調整
   ========================================== */

/* 中央のテキスト */
.btn-text {
    color: #333333 !important;
    font-size: 14px !important;
    font-weight: 600 !important; /* しっかり太字 */
    font-family: inherit;
    letter-spacing: 0.05em;
    transition: color 0.4s ease;
}
.custom-premium-btn:hover .btn-text {
    color: #ffffff !important;
}

/* 🛠️ 左側の手紙アイコン（URLを色反転させる特殊マスク設定） */
.mail-icon-mask {
    display: inline-block;
    width: 26px; /* アイコンの横幅 */
    height: 22px; /* アイコンの縦幅 */
    margin-right: 14px;
    background-color: #40B4F5; /* 通常時の手紙の色（青） */
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    flex-shrink: 0;
    transition: background-color 0.4s ease;
}

/* ホバー時に手紙の色を【白】に変更 */
.custom-premium-btn:hover .mail-icon-mask {
    background-color: #ffffff;
}

/* 右側の丸アイコン */
.arrow-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-left: auto;
    position: relative;
    background-color: #ffffff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.arrow-circle::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    border-radius: 50%;
    background: linear-gradient(90deg, #5363D7, #40B4F5) !important;
    z-index: 1;
    transition: opacity 0.4s ease;
}
.custom-premium-btn:hover .arrow-circle::before {
    opacity: 0;
}

/* 丸の中の矢印 */
.arrow-circle::after {
    content: '';
    width: 7px;
    height: 7px;
    border-top: 3px solid #ffffff !important;
    border-right: 3px solid #ffffff !important;
    transform: rotate(45deg);
    position: relative;
    z-index: 2;
    margin-left: -2px;
    transition: border-color 0.4s ease;
}
.custom-premium-btn:hover .arrow-circle::after {
    border-top: 3px solid #1B3679 !important;
    border-right: 3px solid #1B3679 !important;
}
}/* End custom CSS */