/* ================================================================
   Google Fontsのインポート
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;600;700&family=Noto+Serif:wght@400;600;700&family=Noto+Sans+JP:wght@400;600;700&family=Noto+Serif+JP:wght@400;600;700&display=swap');

/* ================================================================
   英語版用のCSS変数定義（Figmaデザインに基づく正確なフォントサイズ）
   ================================================================ */
:root {
    /* フォントファミリー - 英語版用 */
    --font-family-serif: 'Noto Serif';
    --font-family-sans: 'Noto Sans';
    --font-family-sans-base: 'Noto Sans';  /* step-badge用 */
    
    /* ボタン関連 */
    --cta-button-font-size: 18px;
    --bokunbutton-font-size: 20px;
    --contact-cta-font-size: 20px;
    --service-select-btn-font-size: 18px;
    
    /* ヒーローセクション */
    --hero-h1-font-size: 48px;
    --hero-subtitle-font-size: 20px;
    --hero-subtitle-02-font-size: 16px;
    
    /* チェックアウトセクション（ABOUTセクション） */
    --checkout-h2-font-size: 20px;
    --checkout-h3-font-size: 28px;
    --checkout-p-font-size: 18px;
    
    /* フローセクション（How to Use） */
    --flow-subtitle-font-size: 20px;
    --flow-h2-font-size: 40px;
    --step-number-font-size: 18px;  /* STEP.1/2 */
    --flow-step-h4-font-size: 24px; /* ステップタイトル */
    --step-badge-font-size: 16px;   /* デッドライン表示 */
    --flow-step-p-font-size: 16px;  /* ステップ説明文 */
    --flow-note-font-size: 14px;    /* 注意書き */
    --step-note-font-size: 14px;    /* ステップ内注意書き */
    
    /* サービスセクション（Book Now） */
    --services-subtitle-font-size: 20px;
    --services-h2-font-size: 40px;
    --services-description-font-size: 18px;
    --service-item-h3-font-size: 28px;  /* Regular便/Express便 */
    --price-number-font-size: 28px;     /* 価格の数字部分 */
    --price-unit-font-size: 20px;       /* item, tax included */
    --service-time-font-size: 20px;     /* Drop-off/Pick-up */
    --time-number-font-size: 32px;      /* 時間の数字 */
    --services-note-font-size: 14px;    /* PC版: 14px */
    
    /* ポイントセクション（4 Key Points） */
    --points-subtitle-font-size: 20px;
    --points-h2-font-size: 28px;        /* 4 Key Points */
    --point-number-font-size: 24px;     /* 01, 02, 03, 04 */
    --point-h3-font-size: 28px;         /* Simple, Same-Day等 */
    --point-p-font-size: 24px;          /* ポイント説明文 */
    --point-description-font-size: 16px; /* PC版: 16px */
    --point-note-font-size: 12px;       /* 注意書き */
    
    /* FAQセクション */
    --faq-subtitle-font-size: 20px;
    --faq-h2-font-size: 40px;
    --faq-item-h3-font-size: 24px;      /* PC版: 20px */
    --faq-item-p-font-size: 16px;
    
    /* コンタクトセクション */
    --contact-subtitle-font-size: 20px;
    --contact-h2-font-size: 40px;
    --contact-p-font-size: 18px;
    
    /* フッター */
    --footer-company-name-font-size: 28px;
    --footer-company-division-font-size: 14px;
    --footer-address-p-font-size: 16px;
    --footer-link-font-size: 16px;
    --footer-link-bottom-font-size: 14px;
    --footer-copyright-font-size: 14px;
    
    /* レスポンシブ用変数（モバイル：768px以下）- Figma EN-SP デザインに基づく正確なフォントサイズ */
    --mobile-hero-h1-font-size: 48px;              
    --mobile-hero-subtitle-font-size: 20px;        
    --mobile-hero-subtitle-02-font-size: 16px;     
    --mobile-checkout-h2-font-size: 14px;          
    --mobile-checkout-h3-font-size: 20px;          
    --mobile-checkout-p-font-size: 14px;           
    --mobile-flow-subtitle-font-size: 20px;        
    --mobile-flow-h2-font-size: 28px;              
    --mobile-step-number-font-size: 14px;
    --mobile-flow-step-h4-font-size: 24px;         
    --mobile-step-badge-font-size: 14px;           
    --mobile-flow-step-p-font-size: 14px;          
    --mobile-step-note-font-size: 12px;            
    --mobile-services-subtitle-font-size: 20px;    
    --mobile-services-h2-font-size: 28px;          
    --mobile-services-description-font-size: 14px;
    --mobile-service-item-h3-font-size: 24px;      
    --mobile-price-number-font-size: 28px;
    --mobile-service-price-font-size: 28px;
    --mobile-price-unit-font-size: 20px;           
    --mobile-service-time-font-size: 14px;         
    --mobile-time-number-font-size: 32px;        
    --mobile-service-select-btn-font-size: 14px;
    --mobile-services-note-font-size: 12px;        
    --mobile-points-subtitle-font-size: 20px;      
    --mobile-points-h2-font-size: 20px;            
    --mobile-point-number-font-size: 24px;         
    --mobile-point-h3-font-size: 24px;             
    --mobile-point-p-font-size: 18px;              
    --mobile-point-description-font-size: 14px;    
    --mobile-point-note-font-size: 12px;           
    --mobile-faq-subtitle-font-size: 18px;         
    --mobile-faq-h2-font-size: 28px;               
    --mobile-faq-item-h3-font-size: 20px;          
    --mobile-faq-item-p-font-size: 14px;           
    --mobile-contact-subtitle-font-size: 18px;     
    --mobile-contact-h2-font-size: 28px;           
    --mobile-contact-p-font-size: 14px;            
    --mobile-contact-cta-font-size: 16px;          
    --mobile-cta-button-font-size: 16px;           
    --mobile-bokunbutton-font-size: 20px;          
    
    /* レスポンシブ用変数（小画面：480px以下） */
    --small-hero-h1-font-size: 24px;
    --small-hero-subtitle-font-size: 16px;
    --small-hero-subtitle-02-font-size: 14px;
    --small-flow-step-h4-font-size: 20px;
    --small-service-item-h3-font-size: 20px;
    --small-point-h3-font-size: 22px;
    --small-rte-block-font-size: 18px;       /* SP版 rteBlock用 */

    /* STEP1の画像 */
    .step-image-1 {
        background-image: url('https://lirp.cdn-website.com/dad3912b/dms3rep/multi/opt/step1_en-1920w.webp');
    }
}

/* リセットCSS */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


/* Duda CMS 上書き対策 - 超高優先度 */
*#dm div.dmInner,
*#dm div.dmInner *.dmRespCol,
*#dm *.ecwid *,
*#dm *.dmform *.dmforminput label,
*.dmPrettyList *.listText,
*.dmPrettyList *.itemName,
*#dm *.dmRestaurantMenu *.menuItemBox,
*.dmRestaurantMenu *.menuItemName,
*.dmRestaurantMenu *.menuItemDesc,
*.dmRestaurantMenu *.menuItemPrice,
*.dmPhotoGallery p.caption-text,
*.dmGeoLocation a span.dmGeoMLocItemTitle,
*.dmGeoLocation a span.dmGeoMLocItemDetails,
*.map-popup-description,
*#dm div.dmContent h1,
*#dm div.p_hfcontainer h1,
*#dm div.dm-title h1,
#dm div.dmInner,
#dm div.dmInner .dmRespCol,
#dm .dmRespCol div.dmNewParagraph,
#dm .ecwid .ec-store,
#dm .dmform .dmforminput label {
    font-family: var(--font-family-serif) !important;
}


/* Duda CMS コンテナ幅制限の無効化 */
*#dm div.dmInner,
*#dm *.dmBody,
*#dm *.dmRespRowsWrapper,
*#dm *.dmRespRow,
*#dm *.dmRespColsWrapper {
    max-width: none !important;
    overflow-x: visible !important;
}

/* フルワイドセクション専用のコンテナリセット - 強化版（wireframe独自セクションのみ） */
*#dm *.dmBody .hero,
*#dm *.dmBody .flow,
*#dm *.dmBody .points,
*#dm *.dmBody .contact-section,
*#dm *.dmBody .luggage-footer,
*#dm *.dmBody .luggage-copyright,
*#dm .hero,
*#dm .flow,
*#dm .points,
*#dm .contact-section,
*#dm .luggage-footer,
*#dm .luggage-copyright {
    max-width: none !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    transform: translateX(0) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100vw !important;
    box-sizing: border-box !important;
}

/* Dudaの親コンテナも強制的にフルワイドに（wireframe独自セクションのみ） */
*#dm *.dmBody .hero,
*#dm *.dmBody .flow,
*#dm *.dmBody .points,
*#dm *.dmBody .contact-section,
*#dm *.dmBody .luggage-footer,
*#dm *.dmBody .luggage-copyright {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* Duda CMS の特殊な構造に対する追加対策（wireframe独自セクションのみ） */
*#dm div.dmInner .hero,
*#dm div.dmInner .flow,
*#dm div.dmInner .points,
*#dm div.dmInner .contact-section,
*#dm div.dmInner .luggage-footer,
*#dm div.dmInner .luggage-copyright,
*#dm .dmRespRow .hero,
*#dm .dmRespRow .flow,
*#dm .dmRespRow .points,
*#dm .dmRespRow .contact-section,
*#dm .dmRespRow .luggage-footer,
*#dm .dmRespRow .luggage-copyright,
*#dm .dmRespCol .hero,
*#dm .dmRespCol .flow,
*#dm .dmRespCol .points,
*#dm .dmRespCol .contact-section,
*#dm .dmRespCol .luggage-footer,
*#dm .dmRespCol .luggage-copyright {
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    width: 100vw !important;
    max-width: none !important;
}

/* Dudaの左右Paddingを削除 */
.dmMobileBody .dmRespDesignRow .column,
.dmMobileBody .dmRespDesignRow .dmRespDesignCol,
.dmMobileBody .dmRespRow .column,
.dmMobileBody .dmRespRow .dmRespCol {
    padding-left: 0px;
    padding-right: 0px;
}

/* 基本スタイル - Duda CMS対応（優先度強化） */
*#dm *.dmBody body,
*#dm *.dmBody,
*#dm div.dmInner,
*#dm div.dmInner *.dmRespCol,
body {
    font-family: var(--font-family-serif) !important;
    line-height: 1.6 !important;
    color: #131313 !important;
    background: #FFFFFF !important;
}


.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 60px;
}

/* ボタンスタイル */
.cta-button,
*#dm *.dmBody .cta-button {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 40px !important;
    gap: 0 !important;
    background: #15447E !important;
    border-radius: 4px !important;
    border: none !important;
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: var(--cta-button-font-size) !important;
    line-height: 1.6 !important;
    text-align: center !important;
    color: #FFFFFF !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    min-width: 300px !important;
    height: 72px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    letter-spacing: 0.54px !important;
}

.cta-button:hover {
    background: #E0B81B !important;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
}

/* ヒーローセクションの予約ボタンをゴールドに */
.hero .cta-button,
*#dm *.dmBody .hero .cta-button {
    background: #B68D12 !important;
}

.hero .cta-button:hover,
*#dm *.dmBody .hero .cta-button:hover {
    background: #E0B81B !important;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
}

/* リンクボタンの下線を確実に非表示 */
a.cta-button,
a.cta-button:link,
a.cta-button:visited,
a.cta-button:hover,
a.cta-button:active,
*#dm *.dmBody a.cta-button,
*#dm *.dmBody a.cta-button:link,
*#dm *.dmBody a.cta-button:visited,
*#dm *.dmBody a.cta-button:hover,
*#dm *.dmBody a.cta-button:active {
    text-decoration: none !important;
    color: #FFFFFF !important;
}

.cta-button.secondary,
*#dm *.dmBody .cta-button.secondary {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 20px 40px !important;
    gap: 8px !important;
    width: 183px !important;
    height: 69px !important;
    background: #15447E !important;
    border-radius: 4px !important;
}

.cta-button.secondary:hover,
*#dm *.dmBody .cta-button.secondary:hover {
    background: #2A71AF !important;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
}

/* お問い合わせボタン - CONTACTセクション用 - 削除（.contact-section .cta-buttonで管理） */

/* Bokun Widget ボタンスタイル - Duda CMS対応 */
.bokunButton,
*#dm *.dmBody .bokunButton,
*#dm div.dmInner .bokunButton {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 40px !important;
    gap: 0 !important;
    background: #B68D12 !important;
    border-radius: 4px !important;
    border: none !important;
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: var(--bokunbutton-font-size) !important;
    line-height: 1.2 !important;
    text-align: center !important;
    color: #FFFFFF !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    min-width: 300px !important;
    width: auto !important;
    height: 72px !important;
    text-decoration: none !important;
    z-index: 5 !important;
    position: relative !important;
    white-space: nowrap !important;
}

.bokunButton:hover {
    background-color: #E0B81B !important;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
}

/* ヒーローセクション - Duda CMS フルワイド対応 */
.hero,
*#dm *.dmBody .hero,
*#dm div.dmInner .hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 120px 40px !important;
    gap: 24px !important;
    width: 100vw !important;
    min-height: 555px !important;
    background: linear-gradient(0deg, rgba(21, 68, 126, 0.7), rgba(21, 68, 126, 0.7)), url('https://lirp.cdn-website.com/dad3912b/dms3rep/multi/opt/-%E8%B3%BC%E5%85%A5%E5%88%86-%E3%83%88%E3%83%83%E3%83%97%E7%94%BB%E5%83%8F--1920w.webp') !important;
    background-size: cover !important;
    background-position: center !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
}

.hero-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    width: 100%;
    max-width: 1360px;
}

.hero-subtitle,
*#dm *.dmBody .hero-subtitle {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--hero-subtitle-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    letter-spacing: 0.6px !important;
}

.hero-subtitle-02,
*#dm *.dmBody .hero-subtitle-02 {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--hero-subtitle-02-font-size) !important;
    line-height: 200% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    letter-spacing: 0.48px !important;
}

.hero-content h1,
*#dm *.dmBody .hero-content h1,
*#dm div.dmInner h1 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--hero-h1-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    margin: 0 !important;
    letter-spacing: 1.44px !important;
}

/* チェックアウトセクション */
.checkout {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 120px 0px;
    gap: 24px;
    width: 100%;
    background: #FFFFFF;
}

.checkout-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px 60px;
    gap: 60px;
    width: 100%;
    max-width: 1200px;
}

.checkout-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
    flex: 1;
}

.checkout-text-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

.checkout-text h2,
*#dm *.dmBody .checkout-text h2,
*#dm div.dmInner h2 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--checkout-h2-font-size) !important;
    line-height: 160% !important;
    letter-spacing: 3px !important;
    color: #B68D12 !important;
    margin: 0 !important;
}

.checkout-text h3,
*#dm *.dmBody .checkout-text h3,
*#dm div.dmInner h3 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--checkout-h3-font-size) !important;
    line-height: 160% !important;
    color: #15447E !important;
    margin: 0 !important;
    text-align: left !important;
}

.checkout-text p,
*#dm *.dmBody .checkout-text p,
*#dm div.dmInner p {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--checkout-p-font-size) !important;
    line-height: 200% !important;
    color: #131313 !important;
    margin: 0 !important;
    text-align: left !important;
}

.checkout-image {
    width: 400px;
    height: 400px;
    background: url('https://lirp.cdn-website.com/dad3912b/dms3rep/multi/opt/checkout_image-1920w.webp');
    background-size: cover;
    background-position: center;
}

/* ご利用の流れ - Duda CMS フルワイド対応 */
.flow,
*#dm *.dmBody .flow,
*#dm div.dmInner .flow {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 120px 0px !important;
    gap: 24px !important;
    width: 100vw !important;
    background: #15447E !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
}

.flow-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px 60px;
    gap: 40px;
    width: 100%;
    max-width: 1200px;
}

.flow-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 4px;
    width: 100%;
}

.flow-subtitle,
*#dm *.dmBody .flow-subtitle {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--flow-subtitle-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    letter-spacing: 3px !important;
    color: #E0B81B !important;
    width: 100% !important;
    margin: 0 !important;
}

.flow h2,
*#dm *.dmBody .flow h2 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--flow-h2-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.flow-steps {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    gap: 56px;
    width: 100%;
}

.flow-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 24px;
    flex: 1;
}

.step-image {
    width: 100%;
    aspect-ratio: 3 / 2;
    background: #DDDDDD;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

/* 各STEPの画像(言語共通) */

.step-image-2 {
    background-image: url('https://lirp.cdn-website.com/dad3912b/dms3rep/multi/opt/step2-1920w.webp');
}

.step-image-3 {
    background-image: url('https://lirp.cdn-website.com/dad3912b/dms3rep/multi/opt/step3-1920w.webp');
}

.step-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}

.step-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 100%;
}

.flow-step .step-number,
.step-number,
*#dm *.dmBody .flow-step .step-number,
*#dm *.dmBody .step-number {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--step-number-font-size) !important;
    line-height: 160% !important;
    letter-spacing: 3px !important;
    color: #E0B81B !important;
    width: 100% !important;
    margin: 0 !important;
}

.flow-step h4,
*#dm *.dmBody .flow-step h4,
*#dm div.dmInner h4 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--flow-step-h4-font-size) !important;
    text-align: left !important;
    line-height: 160% !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.step-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
}

.step-badge {
    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: center;
    padding: 4px 8px;
    gap: 8px;
    width: 100%;
    background: #B68D12;
    font-family: var(--font-family-sans-base);
    font-weight: 600;
    font-size: var(--step-badge-font-size);
    line-height: 150%;
    letter-spacing: 0.8px;
    color: #FFFFFF;
}

.flow-step p,
*#dm *.dmBody .flow-step p {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--flow-step-p-font-size) !important;
    line-height: 160% !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

/* ステップ内の注意書きスタイル */
.step-note,
*#dm *.dmBody .step-note {
    font-size: var(--step-note-font-size) !important;
    display: inline;
}

/* サービスラインナップ */
.services {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 120px 0px;
    gap: 24px;
    width: 100%;
    background: #FFFFFF;
}

.services-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px 60px;
    gap: 40px;
    width: 100%;
    max-width: 1200px;
}

.services-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}

.services-header-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 100%;
}

.services-subtitle,
*#dm *.dmBody .services-subtitle {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--services-subtitle-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    letter-spacing: 0.15em !important;
    color: #B68D12 !important;
    width: 100% !important;
    margin: 0 !important;
}

.services h2,
*#dm *.dmBody .services h2 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--services-h2-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #15447E !important;
    width: 100% !important;
    margin: 0 !important;
}

.services-description,
*#dm *.dmBody .services-description {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--services-description-font-size) !important;
    line-height: 200% !important;
    text-align: center !important;
    color: #131313 !important;
    width: 100% !important;
    margin: 0 !important;
}

.services-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}

.service-grid {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 40px;
    width: 100%;
}

.service-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 32px;
    gap: 24px;
    flex: 1;
    background: #FFFFFF;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.15);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.service-item:hover {
    transform: translateY(-4px);
    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.2);
}

.service-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}

.service-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
}

.service-item h3,
*#dm *.dmBody .service-item h3 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--service-item-h3-font-size) !important;
    line-height: 160% !important;
    color: #B68D12 !important;
    width: 100% !important;
    margin: 0 !important;
}

.service-price,
*#dm *.dmBody .service-price {
    font-family: var(--font-family-sans) !important;
    font-weight: 700 !important;
    line-height: 160% !important;
    color: #15447E !important;
    width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
}

.price-number,
.price-amount {
    font-size: var(--price-number-font-size);
    font-weight: 700;
}

.price-unit,
.price-tax {
    font-size: var(--price-unit-font-size);
    font-weight: 700;
}

.service-details {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.service-time-start,
.service-time-end,
*#dm *.dmBody .service-time-start,
*#dm *.dmBody .service-time-end,
*#dm div.dmInner .service-time-start,
*#dm div.dmInner .service-time-end {
    font-family: var(--font-family-sans) !important;
    font-weight: 700 !important;
    font-size: var(--service-time-font-size) !important;
    line-height: 160% !important;
    color: #15447E !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

.time-number {
    font-weight: 700;
    font-size: var(--time-number-font-size);
    color: #15447E;
}

.service-arrow {
    position: relative;
    border: 1px solid #B68D12;
    flex: 1;
    height: 0;
}

.service-arrow::after {
    content: '';
    position: absolute;
    right: -6px;
    top: -6px;
    width: 0;
    height: 0;
    border-left: 6px solid #B68D12;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}

.services-note,
*#dm *.dmBody .services-note {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--services-note-font-size) !important;
    line-height: 200% !important;
    text-align: center !important;
    color: #515151 !important;
    width: 100% !important;
    margin: 0 !important;
}

/* 選択ボタン */
.service-select-btn,
*#dm *.dmBody .service-select-btn {
    font-family: var(--font-family-sans) !important;
    font-weight: 700 !important;
    font-size: var(--service-select-btn-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    background: #B68D12 !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 12px 36px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    margin: 0 !important;
}

.service-select-btn:hover,
*#dm *.dmBody .service-select-btn:hover {
    background: #E0B81B !important;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    transform: translateY(-2px) !important;
}

/* 4つのポイント - Duda CMS フルワイド対応 */
.points,
*#dm *.dmBody .points,
*#dm div.dmInner .points {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 24px !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
}

.points-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 100px 60px;
    gap: 60px;
    width: 100%;
    max-width: 1200px;
    background: #15447E;
    border-radius: 24px;
    margin: 0 60px;
}

.points-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 60px;
    width: 100%;
    flex: 1;
}

.points-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    width: 100%;
}

.points-header-decoration {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: 100%;
    height: 80px;
}

.points-header-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    justify-content: center;
    height: 100%;
}

.points-left-decoration,
.points-right-decoration {
    height: 80px;
    width: auto;
    object-fit: contain;
    flex-shrink: 0;
}

.points-logo {
    height: 32px;
    width: auto;
    object-fit: contain;
}

.points-subtitle,
*#dm *.dmBody .points-subtitle {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--points-subtitle-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    letter-spacing: 0.15em !important;
    color: #B68D12 !important;
    width: 100% !important;
    margin: 0 !important;
}

.points h2,
*#dm *.dmBody .points h2 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--points-h2-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.points-grid {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 40px;
    width: 100%;
}

.point {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    flex: 1;
}

.point-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    width: 100%;
}

.point-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.point-number,
*#dm *.dmBody .point-number {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--point-number-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    letter-spacing: 3.6px !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.point h3,
*#dm *.dmBody .point h3 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--point-h3-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #E0B81B !important;
    width: 100% !important;
    margin: 0 !important;
}

.point-description {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.point p,
*#dm *.dmBody .point p {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--point-p-font-size) !important;
    line-height: 200% !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.point .point-description p,
*#dm *.dmBody .point .point-description p {
    font-size: var(--point-description-font-size) !important;
}

.point-note {
    font-family: var(--font-family-sans);
    font-weight: 400;
    font-size: var(--point-note-font-size);
    line-height: 200%;
    color: #FFFFFF;
    width: 100%;
    margin: 0;
}

/* よくある質問 */
.faq {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 120px 0px;
    gap: 24px;
    width: 100%;
    background: #FFFFFF;
}

.faq-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px 60px;
    gap: 24px;
    width: 100%;
    max-width: 1200px;
}

.faq-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 100%;
}

.faq-subtitle,
*#dm *.dmBody .faq-subtitle {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--faq-subtitle-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    letter-spacing: 0.15em !important;
    color: #B68D12 !important;
    width: 100% !important;
    margin: 0 !important;
}

.faq h2,
*#dm *.dmBody .faq h2 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--faq-h2-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #15447E !important;
    width: 100% !important;
    margin: 0 !important;
}

.faq-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    width: 100%;
    border-top: 1px solid #D1D1D1;
}

.faq-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 32px 0px;
    gap: 8px;
    width: 100%;
    border-bottom: 1px solid #D1D1D1;
}

.faq-item h3,
*#dm *.dmBody .faq-item h3 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--faq-item-h3-font-size) !important;
    line-height: 160% !important;
    color: #15447E !important;
    width: 100% !important;
    margin: 0 !important;
}

.faq-item p,
*#dm *.dmBody .faq-item p {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--faq-item-p-font-size) !important;
    line-height: 200% !important;
    color: #131313 !important;
    width: 100% !important;
    margin: 0 !important;
}

/* お問い合わせセクション - Duda CMS フルワイド対応 */
.contact-section,
*#dm *.dmBody .contact-section,
*#dm div.dmInner .contact-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 120px 0px !important;
    gap: 24px !important;
    width: 100vw !important;
    background: linear-gradient(90deg, rgba(21, 68, 126, 0.8) 0%, rgba(21, 68, 126, 0.8) 100%), url('https://lirp.cdn-website.com/dad3912b/dms3rep/multi/opt/-%E8%B3%BC%E5%85%A5%E5%88%86-%E3%82%B5%E3%83%96%E7%94%BB%E5%83%8F-1920w.webp') !important;
    background-size: auto, 100% 190.5% !important;
    background-position: 0% 0%, 0% 56.88% !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
}

.contact-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: 100%;
    max-width: 1200px;
    padding: 0 60px;
}

.contact-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: 100%;
    max-width: 1200px;
}

.contact-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
}

.contact-header-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    width: 100%;
}

.contact-subtitle,
*#dm *.dmBody .contact-subtitle,
*#dm .contact-section .contact-subtitle,
.contact-section .contact-header-inner .contact-subtitle,
*#dm .contact-section .contact-header-inner .contact-subtitle {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--contact-subtitle-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    letter-spacing: 3px !important;
    color: #E0B81B !important;
    width: 100% !important;
    margin: 0 !important;
    text-transform: uppercase !important;
}

.contact-section h2,
*#dm *.dmBody .contact-section h2 {
    font-family: var(--font-family-serif) !important;
    font-weight: 700 !important;
    font-size: var(--contact-h2-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.contact-description {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.contact-section p,
*#dm *.dmBody .contact-section p {
    font-family: var(--font-family-sans) !important;
    font-weight: 400 !important;
    font-size: var(--contact-p-font-size) !important;
    line-height: 200% !important;
    text-align: center !important;
    color: #FFFFFF !important;
    width: 100% !important;
    margin: 0 !important;
}

.contact-section .cta-button,
*#dm *.dmBody .contact-section .cta-button {
    background: #B68D12 !important;
    width: 320px !important;
    max-width: 100% !important;
    margin-top: 0 !important;
    font-family: var(--font-family-sans) !important;
    font-weight: 700 !important;
    font-size: var(--contact-cta-font-size) !important;
    line-height: 160% !important;
    padding: 20px 40px !important;
}

.contact-section .cta-button:hover,
*#dm *.dmBody .contact-section .cta-button:hover {
    background: #E0B81B !important;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
}

/* フッター - Duda CMS フルワイド対応 */
.luggage-footer,
*#dm *.dmBody .luggage-footer,
*#dm div.dmInner .luggage-footer,
footer.luggage-footer {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: 60px 0px !important;
    gap: 24px !important;
    width: 100vw !important;
    background: #F7F7F7 !important;
    background-image: none !important;
    border: 1px solid #EEEEEE !important;
    flex: none !important;
    order: 8 !important;
    align-self: stretch !important;
    flex-grow: 0 !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
}

.luggage-footer-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 120px;
    width: 100%;
    max-width: 1200px;
    padding: 0 60px;
}

/* フッター左側 */
.luggage-footer-left {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    flex: 1;
}

/* デスクトップ/モバイル表示制御 */
.luggage-footer-links-bottom.desktop-only {
    display: flex;
}

.luggage-footer-links-bottom.mobile-only {
    display: none;
}

@media (max-width: 768px) {
    .luggage-footer-links-bottom.desktop-only {
        display: none !important;
    }

    .luggage-footer-links-bottom.mobile-only {
        display: flex !important;
    }

    /* SP版でキャンセル関連文言を改行表示 */
    .cancel-note-sp::before {
        content: "\A";
        white-space: pre;
        display: inline;
    }
}

.luggage-footer-company {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.luggage-footer-company-name,
*#dm *.dmBody .luggage-footer-company-name {
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: var(--footer-company-name-font-size) !important;
    line-height: 160% !important;
    color: #131313 !important;
    margin: 0 !important;
}

.luggage-footer-company-division,
*#dm *.dmBody .luggage-footer-company-division {
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: var(--footer-company-division-font-size) !important;
    line-height: 160% !important;
    color: #515151 !important;
    margin: 0 !important;
}

.luggage-footer-address {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.luggage-footer-address p,
*#dm *.dmBody .luggage-footer-address p {
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: var(--footer-address-p-font-size) !important;
    line-height: 200% !important;
    color: #131313 !important;
    margin: 0 !important;
}

.luggage-footer-links-bottom {
    flex-direction: row;
    align-items: center;
    gap: 16px;
    margin-top: 40px;
    flex-wrap: wrap;
}

.luggage-footer-link-bottom,
*#dm *.dmBody .luggage-footer-link-bottom {
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: var(--footer-link-bottom-font-size) !important;
    line-height: 200% !important;
    color: #515151 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.luggage-footer-link-bottom:hover,
*#dm *.dmBody .luggage-footer-link-bottom:hover {
    color: #B68D12 !important;
    text-decoration: none !important;
}

/* フッター右側 */
.luggage-footer-right {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.luggage-footer-nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.luggage-footer-link,
*#dm *.dmBody .luggage-footer-link {
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: var(--footer-link-font-size) !important;
    line-height: 200% !important;
    color: #131313 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
    padding-left: 8px !important;
}

.luggage-footer-arrow,
*#dm *.dmBody .luggage-footer-arrow {
    color: #15447E !important;
    margin-right: 8px !important;
}

.luggage-footer-link:hover,
*#dm *.dmBody .luggage-footer-link:hover {
    color: #B68D12 !important;
    text-decoration: none !important;
}

/* コピーライト - Duda CMS フルワイド対応 */
.luggage-copyright,
*#dm *.dmBody .luggage-copyright,
*#dm div.dmInner .luggage-copyright {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 24px 0px !important;
    width: 100vw !important;
    background: #F7F7F7 !important;
    border-top: 1px solid #EEEEEE !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
}

.luggage-copyright p,
*#dm *.dmBody .luggage-copyright p {
    font-family: var(--font-family-sans) !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: var(--footer-copyright-font-size) !important;
    line-height: 160% !important;
    text-align: center !important;
    color: #666666 !important;
    margin: 0 !important;
}

/* Duda CMS ハンバーガーメニューの上部余白調整 */
*[dmtemplateid="mobileHamburgerLayout"].layout-drawer_fixed-header #mobile-hamburger-drawer.layout-drawer {
    top: 50px !important;
    max-height: calc(100% - 91.1875px) !important;
}

/* Duda CMS のデフォルト余白を無効化 */
*#dm .dmContent .dmRespRow,
*#dm .dmFooter .dmRespRow,
*#dm div.dmContent .dmRespRow,
*#dm div.dmFooter .dmRespRow {
    padding-top: 0px !important;
}

/* Duda CMS フッター（#fcontainer）を非表示 */
#fcontainer,
*#dm #fcontainer,
*#dm *.dmBody #fcontainer {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* レスポンシブデザイン */
@media (max-width: 768px) {
    .container {
        padding: 0 20px;
    }

    /* ヒーロー */
    /* .hero {
        padding: 60px 16px;
    } */

    .hero-content h1,
    *#dm *.dmBody .hero-content h1,
    *#dm div.dmInner .hero-content h1 {
        font-size: var(--mobile-hero-h1-font-size) !important;
        letter-spacing: 0.96px !important;
    }

    .hero-subtitle {
        font-size: var(--mobile-hero-subtitle-font-size);
        letter-spacing: 0.54px !important;
    }

    .hero-subtitle-02,
    *#dm *.dmBody .hero-subtitle-02 {
        font-size: var(--mobile-hero-subtitle-02-font-size) !important;
        letter-spacing: 0.42px !important;
    }

    /* チェックアウト */
    .checkout {
        padding: 60px 0px;
    }

    .checkout-content {
        flex-direction: column;
        gap: 24px;
        padding: 0px 16px;
    }

    /* SP版で要素の順序を変更 */
    .checkout-text {
        display: contents; /* 子要素を直接の子として扱う */
    }

    .checkout-text-content {
        order: 1; /* タイトル部分を最初に */
        align-items: flex-start !important; /* 左寄せを確実にする */
        width: 100%; /* 幅を100%に */
    }

    .checkout-image {
        order: 2; /* 画像を2番目に */
    }

    .checkout-text > p {
        order: 3; /* 説明文を最後に */
        margin-top: 0; /* 余分な上マージンを削除 */
    }

    .checkout-text h3,
    *#dm *.dmBody .checkout-text h3,
    *#dm div.dmInner .checkout-text h3 {
        font-size: var(--mobile-checkout-h3-font-size) !important;
        text-align: left !important;
    }

    .checkout-text h2,
    *#dm *.dmBody .checkout-text h2 {
        font-size: var(--mobile-checkout-h2-font-size) !important;
        letter-spacing: 2.4px !important;
        text-align: left !important;
    }

    .checkout-text p,
    *#dm *.dmBody .checkout-text p {
        font-size: var(--mobile-checkout-p-font-size) !important;
        line-height: 200% !important;
        text-align: left !important;
    }

    /* ご利用の流れ（Flow）- モバイル版 */
    .flow,
    *#dm *.dmBody .flow,
    *#dm div.dmInner .flow {
        padding: 60px 0px !important;
    }

    .flow-content {
        gap: 24px;
        padding: 0px 16px;
    }

    .flow-subtitle,
    *#dm *.dmBody .flow-subtitle {
        font-size: var(--mobile-flow-subtitle-font-size) !important;
        letter-spacing: 2.4px !important;
    }

    .flow h2,
    *#dm *.dmBody .flow h2 {
        font-size: var(--mobile-flow-h2-font-size) !important;
    }

    .flow-steps {
        flex-direction: column;
        gap: 60px;
    }

    .flow-step {
        gap: 24px;
        width: 100%;
        max-width: 100%;
    }

    .step-image {
        height: 200px;
        width: 100%;
    }

    .step-content {
        gap: 16px;
        width: 100%;
    }

    .step-header {
        gap: 4px;
    }

    .flow-step .step-number,
    .step-number,
    *#dm *.dmBody .flow-step .step-number,
    *#dm *.dmBody .step-number {
        font-size: var(--mobile-step-number-font-size) !important;
        letter-spacing: 2.4px !important;
    }

    .flow-step h4,
    *#dm *.dmBody .flow-step h4,
    *#dm div.dmInner h4 {
        font-size: var(--mobile-flow-step-h4-font-size) !important;
    }

    .step-info {
        gap: 8px;
    }

    .step-badge {
        padding: 4px 8px;
        font-size: var(--mobile-step-badge-font-size);
    }

    .flow-step p,
    *#dm *.dmBody .flow-step p {
        font-size: var(--mobile-flow-step-p-font-size) !important;
        line-height: 160% !important;
    }

    .step-note,
    *#dm *.dmBody .step-note {
        font-size: var(--mobile-step-note-font-size) !important;
    }

    .checkout-image {
        width: 100%;
        height: 300px;
    }

    /* サービス */
    .service-grid {
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    /* モバイル版 サービスラインナップ */
    .services {
        padding: 60px 16px;
    }

    .services-content {
        padding: 0;
        max-width: none;
    }

    .services-subtitle,
    *#dm *.dmBody .services-subtitle {
        font-size: var(--mobile-services-subtitle-font-size) !important;
        letter-spacing: 2.4px !important;
    }

    .services-description,
    *#dm *.dmBody .services-description {
        font-size: var(--mobile-services-description-font-size) !important;
        line-height: 200% !important;
    }

    .service-grid {
        flex-direction: column;
        gap: 16px;
    }

    .service-item {
        padding: 24px;
        width: 100%;
        max-width: none;
    }

    .service-item h3,
    *#dm *.dmBody .service-item h3,
    *#dm div.dmInner .service-item h3 {
        font-size: var(--mobile-service-item-h3-font-size) !important;
    }

    .service-price,
    *#dm *.dmBody .service-price {
        font-size: var(--mobile-service-price-font-size) !important;
        font-weight: 700 !important;
        color: #15447E !important;
        text-align: left !important;
    }

    /* モバイル版では価格テキストのサイズを調整 */
    .price-number,
    .price-amount {
        font-size: var(--mobile-service-price-font-size) !important;
    }

    .price-unit,
    .price-tax {
        font-size: var(--price-unit-font-size) !important;
    }

    .service-time-start,
    .service-time-end,
    *#dm *.dmBody .service-time-start,
    *#dm *.dmBody .service-time-end {
        font-size: var(--mobile-service-time-font-size) !important;
        color: #15447E !important;
    }

    .service-details {
        gap: 8px;
    }

    .time-number {
        font-size: var(--time-number-font-size);
    }

    .services-note,
    *#dm *.dmBody .services-note {
        font-size: var(--mobile-services-note-font-size) !important;
    }

    /* 選択ボタン - モバイル調整 */
    .service-select-btn,
    *#dm *.dmBody .service-select-btn {
        padding: 8px 16px !important;
        font-size: var(--mobile-service-select-btn-font-size) !important;
    }

    /* ポイント */
    .points,
    *#dm *.dmBody .points,
    *#dm div.dmInner .points {
        padding: 0 16px !important;
    }

    .points-content {
        padding: 60px 16px;
        max-width: none;
        margin: 0;
        border-radius: 24px;
    }

    .points-grid {
        flex-direction: column;
        gap: 40px;
    }

    /* ポイントセクション - モバイル専用タイポグラフィ */
    .points h2,
    *#dm *.dmBody .points h2 {
        font-size: var(--mobile-points-h2-font-size) !important;
        line-height: 160% !important;
    }

    .point-number,
    *#dm *.dmBody .point-number {
        font-size: var(--mobile-point-number-font-size) !important;
        letter-spacing: 2.7px !important;
    }

    .point h3,
    *#dm *.dmBody .point h3 {
        font-size: var(--mobile-point-h3-font-size) !important;
    }

    .point p,
    *#dm *.dmBody .point p {
        font-size: var(--mobile-point-p-font-size) !important;
    }

    .point .point-description p,
    *#dm *.dmBody .point .point-description p {
        font-size: var(--mobile-point-description-font-size) !important;
    }

    /* FAQ */
    .faq {
        padding: 60px 0px;
    }

    .faq-content {
        padding: 0px 16px;
    }

    .faq-subtitle {
        font-size: var(--mobile-faq-subtitle-font-size) !important;
    }

    .faq-item h3,
    *#dm *.dmBody .faq-item h3 {
        font-size: var(--mobile-faq-item-h3-font-size) !important;
    }

    .faq-item p,
    *#dm *.dmBody .faq-item p {
        font-size: var(--mobile-faq-item-p-font-size) !important;
    }

    /* お問い合わせセクション */
    .contact-section,
    *#dm *.dmBody .contact-section,
    *#dm div.dmInner .contact-section {
        padding: 60px 0px !important;
    }

    .contact-content {
        padding: 0 16px;
    }

    .contact-inner {
        gap: 16px;
    }

    .contact-section h2,
    *#dm *.dmBody .contact-section h2 {
        font-size: var(--mobile-contact-h2-font-size) !important;
    }

    .contact-subtitle,
    *#dm *.dmBody .contact-subtitle,
    *#dm .contact-section .contact-subtitle,
    .contact-section .contact-header-inner .contact-subtitle,
    *#dm .contact-section .contact-header-inner .contact-subtitle {
        font-size: var(--mobile-contact-subtitle-font-size) !important;
        letter-spacing: 2.4px !important;
    }

    .contact-section p,
    *#dm *.dmBody .contact-section p {
        font-size: var(--mobile-contact-p-font-size) !important;
    }

    .contact-section .cta-button,
    *#dm *.dmBody .contact-section .cta-button {
        display: flex !important;
        padding: 20px 40px !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 400px !important;
        margin: 0 auto !important;
        font-size: var(--mobile-contact-cta-font-size) !important;
    }

    /* SP版のボタンhoverスタイル */
    .cta-button:hover {
        background-color: #E0B81B !important;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    }

    .hero .cta-button:hover,
    *#dm *.dmBody .hero .cta-button:hover {
        background: #E0B81B !important;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    }


    .bokunButton:hover {
        background-color: #E0B81B !important;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    }

    .service-select-btn:hover,
    *#dm *.dmBody .service-select-btn:hover {
        background: #E0B81B !important;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    }

    /* フッター */
    .luggage-footer {
        padding: 60px 0px;
    }

    .luggage-footer-content {
        flex-direction: column;
        gap: 40px;
        padding: 0 20px;
    }

    .luggage-footer-left {
        width: 100%;
        display: flex;
        flex-direction: column;
        order: 1;
        /* 左側コンテンツを最初に */
    }

    .luggage-footer-right {
        width: 100%;
        order: 2;
        /* ナビゲーションを次に */
    }

    .luggage-footer-nav {
        gap: 8px;
    }

    .luggage-footer-links-bottom.mobile-only {
        flex-wrap: wrap;
        gap: 16px;
        order: 3;
        /* 最下部に配置 */
        margin-top: 0;
        justify-content: left;
        width: 100%;
    }

    /* ボタン */
    .cta-button,
    *#dm *.dmBody .cta-button {
        display: flex !important;
        padding: 20px 40px !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
        min-width: 320px !important;
        width: auto !important;
        max-width: 100% !important;
        font-size: var(--mobile-cta-button-font-size) !important;
        margin: 0 auto !important;
    }

    .cta-button.secondary,
    *#dm *.dmBody .cta-button.secondary {
        display: flex !important;
        padding: 20px 40px !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 320px !important;
        height: 69px !important;
        margin: 0 auto !important;
        background: #15447E !important;
    }

    .cta-button.secondary:hover,
    *#dm *.dmBody .cta-button.secondary:hover {
        background: #2A71AF !important;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    }

    /* Bokunボタン */
    .bokunButton,
    *#dm *.dmBody .bokunButton {
        min-width: 320px !important;
        width: auto !important;
        max-width: 100% !important;
        font-size: var(--mobile-bokunbutton-font-size) !important;
        padding: 20px 30px !important;
    }

    /* ポイントセクション */
    .points-header-decoration {
        gap: 8px;
        height: 70px;
        padding: 20px 10px 0;
    }

    .points-left-decoration,
    .points-right-decoration {
        height: 60px;
        flex-shrink: 0;
    }

    .points-logo {
        height: 32px;
    }

    /* h2タイトル全般のモバイル調整 - CMS優先度強化 */
    .flow h2,
    .services h2,
    .faq h2,
    .contact-section h2,
    *#dm *.dmBody .flow h2,
    *#dm *.dmBody .services h2,
    *#dm *.dmBody .faq h2,
    *#dm *.dmBody .contact-section h2,
    *#dm div.dmInner .flow h2,
    *#dm div.dmInner .services h2,
    *#dm div.dmInner .faq h2,
    *#dm div.dmInner .contact-section h2 {
        font-size: var(--mobile-services-h2-font-size) !important;
    }

    .points h2,
    *#dm *.dmBody .points h2 {
        font-size: var(--mobile-points-h2-font-size) !important;
        line-height: 160% !important;
    }
}

@media (max-width: 480px) {

    /* ヒーロー */
    .hero,
    *#dm *.dmBody .hero,
    *#dm div.dmInner .hero {
        padding: 100px 16px !important;
        min-height: 400px !important;
    }

    .hero-content {
        gap: 24px !important;
    }

    .hero-content h1,
    *#dm *.dmBody .hero-content h1,
    *#dm div.dmInner .hero-content h1 {
        font-size: var(--small-hero-h1-font-size) !important;
        margin-bottom: 6px !important;
        letter-spacing: 0.84px !important;
    }

    .hero-subtitle,
    *#dm *.dmBody .hero-subtitle {
        font-size: var(--small-hero-subtitle-font-size) !important;
        margin-bottom: 2px !important;
        letter-spacing: 0.48px !important;
    }

    .hero-subtitle-02,
    *#dm *.dmBody .hero-subtitle-02 {
        font-size: var(--small-hero-subtitle-02-font-size) !important;
        margin-bottom: 12px !important;
        letter-spacing: 0.36px !important;
    }

    /* テキストサイズ調整 */
    .checkout-text h2,
    .flow-subtitle,
    .services-subtitle,
    .points-subtitle {
        font-size: var(--mobile-checkout-h2-font-size);
    }

    .contact-subtitle,
    *#dm *.dmBody .contact-subtitle,
    *#dm .contact-section .contact-subtitle,
    .contact-section .contact-header-inner .contact-subtitle,
    *#dm .contact-section .contact-header-inner .contact-subtitle {
        font-size: var(--mobile-contact-subtitle-font-size) !important;
    }

    .faq-subtitle {
        font-size: var(--mobile-faq-subtitle-font-size);
    }

    .checkout-text h3,
    *#dm *.dmBody .checkout-text h3,
    *#dm div.dmInner .checkout-text h3 {
        font-size: var(--mobile-checkout-h3-font-size) !important;
    }

    .flow h2,
    *#dm *.dmBody .flow h2,
    *#dm div.dmInner .flow h2 {
        font-size: var(--mobile-flow-h2-font-size) !important;
    }

    .services h2,
    *#dm *.dmBody .services h2,
    *#dm div.dmInner .services h2 {
        font-size: var(--mobile-services-h2-font-size) !important;
    }

    /* .points h2,
    *#dm *.dmBody .points h2,
    *#dm div.dmInner .points h2 {
        font-size: var(--mobile-checkout-h3-font-size) !important;
    } */
    
    .faq h2,
    *#dm *.dmBody .faq h2,
    *#dm div.dmInner .faq h2 {
        font-size: var(--mobile-faq-h2-font-size) !important;
    }
    
    .contact-section h2,
    *#dm *.dmBody .contact-section h2,
    *#dm div.dmInner .contact-section h2 {
        font-size: var(--mobile-contact-h2-font-size) !important;
    }

    .step-number {
        font-size: var(--flow-subtitle-font-size);
    }

    .flow-step h4,
    *#dm *.dmBody .flow-step h4,
    *#dm div.dmInner .flow-step h4 {
        font-size: var(--small-flow-step-h4-font-size) !important;
        text-align: left !important;
    }

    .service-item h3,
    *#dm *.dmBody .service-item h3,
    *#dm div.dmInner .service-item h3 {
        font-size: var(--small-service-item-h3-font-size) !important;
    }

    .service-price {
        font-size: var(--small-service-item-h3-font-size);
    }

    .point h3,
    *#dm *.dmBody .point h3,
    *#dm div.dmInner .point h3 {
        font-size: var(--small-point-h3-font-size) !important;
    }

    /* ポイントセクション - 小画面 */
    .points-header-decoration {
        gap: 6px;
        height: 60px;
        padding: 25px 5px 0;
    }

    .points-left-decoration,
    .points-right-decoration {
        height: 60px;
    }

    .points-logo {
        height: 32px;
    }

    .points h2,
    *#dm *.dmBody .points h2,
    *#dm div.dmInner .points h2 {
        font-size: var(--mobile-points-h2-font-size) !important;
    }

    .point-number,
    *#dm *.dmBody .point-number {
        font-size: var(--mobile-point-number-font-size) !important;
        letter-spacing: 2.7px !important;
    }

    .point h3,
    *#dm *.dmBody .point h3,
    *#dm div.dmInner .point h3 {
        font-size: var(--mobile-point-h3-font-size) !important;
    }

    /* ボタン */
    .cta-button,
    *#dm *.dmBody .cta-button {
        display: flex !important;
        padding: 20px 40px !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
        min-width: auto !important;
        width: 100% !important;
        height: 60px !important;
        font-size: var(--mobile-cta-button-font-size) !important;
        margin: 0 auto !important;
    }

    .cta-button.secondary,
    *#dm *.dmBody .cta-button.secondary {
        display: flex !important;
        padding: 20px 40px !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        height: 60px !important;
        margin: 0 auto !important;
        background: #15447E !important;
    }

    .cta-button.secondary:hover,
    *#dm *.dmBody .cta-button.secondary:hover {
        background: #2A71AF !important;
        box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1) !important;
    }

    /* Bokunボタン */
    .bokunButton,
    *#dm *.dmBody .bokunButton {
        min-width: auto !important;
        width: 100% !important;
        height: 60px !important;
        font-size: var(--mobile-cta-button-font-size) !important;
        padding: 15px 40px !important;
    }

    /* モバイル版 サービスラインナップ */
    .services {
        padding: 60px 16px;
    }

    .services-content {
        padding: 0;
        max-width: none;
    }

    .services-subtitle,
    *#dm *.dmBody .services-subtitle {
        font-size: var(--mobile-services-subtitle-font-size) !important;
        letter-spacing: 2.4px !important;
    }

    .services-description,
    *#dm *.dmBody .services-description {
        font-size: var(--mobile-services-description-font-size) !important;
        line-height: 200% !important;
    }

    .service-grid {
        flex-direction: column;
        gap: 16px;
    }

    .service-item {
        padding: 16px;
        width: 100%;
        max-width: none;
    }

    .service-item h3,
    *#dm *.dmBody .service-item h3,
    *#dm div.dmInner .service-item h3 {
        font-size: var(--mobile-service-item-h3-font-size) !important;
    }

    .service-price,
    *#dm *.dmBody .service-price {
        font-size: var(--mobile-service-price-font-size) !important;
        font-weight: 700 !important;
        color: #15447E !important;
        text-align: left !important;
    }

    /* モバイル版では価格テキストのサイズを調整 */
    .price-number,
    .price-amount {
        font-size: var(--mobile-service-price-font-size) !important;
    }

    .price-unit,
    .price-tax {
        font-size: var(--price-unit-font-size) !important;
    }

    .service-time-start,
    .service-time-end,
    *#dm *.dmBody .service-time-start,
    *#dm *.dmBody .service-time-end {
        font-size: var(--mobile-service-time-font-size) !important;
        color: #15447E !important;
    }

    .service-details {
        gap: 8px;
    }

    .time-number {
        font-size: var(--time-number-font-size);
    }

    .services-note,
    *#dm *.dmBody .services-note {
        font-size: var(--mobile-services-note-font-size) !important;
    }

    /* 選択ボタン - 小画面調整 */
    .service-select-btn,
    *#dm *.dmBody .service-select-btn {
        padding: 8px 16px !important;
        font-size: var(--mobile-service-select-btn-font-size) !important;
    }

    /* コンテナ調整 */
    .container,
    .flow-content,
    .faq-content {
        padding: 0 15px;
    }

    .checkout-content,
    .contact-content {
        padding: 0px 16px;
    }

    .points-content {
        padding: 60px 32px;
        max-width: none;
        margin: 0 20px;
        border-radius: 24px;
    }

    /* フッターの小画面調整 */
    .luggage-footer {
        padding: 40px 0px;
    }

    .luggage-footer-content {
        padding: 0 15px;
        gap: 32px;
    }

    .luggage-footer-company-name {
        font-size: 20px;
    }

    .luggage-footer-company-division {
        font-size: var(--footer-company-division-font-size);
    }

    .luggage-footer-address p {
        font-size: var(--point-note-font-size);
    }

    .luggage-footer-nav {
        gap: 8px;
    }

    .luggage-footer-link {
        font-size: var(--footer-link-bottom-font-size);
    }

    .luggage-footer-link-bottom {
        font-size: var(--point-note-font-size);
    }

    .luggage-footer-links-bottom {
        gap: 12px;
        margin-top: 16px;
    }

    /* SP版ヘッダーロゴスタイル */
    .rteBlock span,
    *#dm *.dmBody .rteBlock span {
        font-size: var(--small-rte-block-font-size) !important;
        font-family: var(--font-family-serif) !important;
    }
    *#dm *.p_hfcontainer div.u_1166822126 {
        padding-left: 0px !important;
    } 
}separatorHomeCss{color:red !important}/**#dm *.d-page-1716942098 DIV.dmInner {*/
/*  background-repeat:no-repeat;*/
/*  background-size:cover;*/
/*  background-attachment:fixed;*/
/*  background-position:50% 50%;*/
/*}*/

/**#dm *.d-page-1716942098 DIV#dmSlideRightNavRight {*/
/*  background-repeat:no-repeat !important;*/
/*  background-image:none !important;*/
/*  background-size:cover !important;*/
/*  background-attachment:fixed !important;*/
/*  background-position:50% 50% !important;*/
/*}*/

/**#dm *.dmBody div.u_1243667655 {*/
/*  margin-left:0px !important;*/
/*  padding-top:200px !important;*/
/*  padding-left:40px !important;*/
/*  padding-bottom:200px !important;*/
/*  margin-top:0px !important;*/
/*  margin-bottom:0px !important;*/
/*  padding-right:40px !important;*/
/*  margin-right:0px !important;*/
/*  float:none !important;*/
/*  top:0 !important;*/
/*  left:0 !important;*/
/*  width:auto !important;*/
/*  position:relative !important;*/
/*  height:auto !important;*/
/*  max-width:none !important;*/
/*  min-width:0 !important;*/
/*  text-align:center !important;*/
/*}*/
