/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 19 2026 | 09:37:32 */
/* =========================================================
   マイらくプラス＋ 専用一括管理CSS
   （すべてのスタイルを .myraku-plus-page 内に限定）
   ========================================================= */

/* 不要なパーツの非表示 */
.com_head01 { display: none; }

/* ==========================================
   1. ベース設定 & ヒーローセクション
========================================== */
.myraku-plus-page { font-family: 'Noto Sans JP', sans-serif; color: #334155; background-color: #556670; line-height: 1.6; }

.myraku-plus-page .mrp-hero { background-color: #556670; color: #ffffff; padding: 80px 20px; text-align: center; position: relative; overflow: hidden; z-index: 0; }
.myraku-plus-page .mrp-hero h1 { font-size: 2.8rem; font-weight: 700; margin-bottom: 5px; letter-spacing: 2px; position: relative; z-index: 2; font-family: sans-serif; }
.myraku-plus-page .mrp-hero p { font-size: 1.1rem; opacity: 0.9; max-width: 600px; margin: 0 auto; line-height: 1.8; position: relative; z-index: 2; }

/* 泡アニメーション */
.myraku-plus-page .bubbles { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
.myraku-plus-page .bubble { position: absolute; bottom: -150px; background: rgba(255, 255, 255, 0.15); border-radius: 50%; animation: riseBubble infinite ease-in; }
.myraku-plus-page .bubble:nth-child(1) { width: 40px; height: 40px; left: 10%; animation-duration: 8s; animation-delay: 0s; }
.myraku-plus-page .bubble:nth-child(2) { width: 80px; height: 80px; left: 30%; animation-duration: 10s; animation-delay: 2s; }
.myraku-plus-page .bubble:nth-child(3) { width: 50px; height: 50px; left: 55%; animation-duration: 7s; animation-delay: 4s; }
.myraku-plus-page .bubble:nth-child(4) { width: 120px; height: 120px; left: 75%; animation-duration: 13s; animation-delay: 1s; }
.myraku-plus-page .bubble:nth-child(5) { width: 60px; height: 60px; left: 85%; animation-duration: 9s; animation-delay: 3s; }
.myraku-plus-page .bubble:nth-child(6) { width: 30px; height: 30px; left: 20%; animation-duration: 6s; animation-delay: 5s; }

@keyframes riseBubble {
    0% { bottom: -150px; transform: translateX(0); opacity: 0; }
    10% { opacity: 1; }
    50% { transform: translateX(30px); }
    90% { opacity: 1; }
    100% { bottom: 110%; transform: translateX(-30px); opacity: 0; }
}

/* ==========================================
   2. コンセプト & スライダー大枠
========================================== */
.myraku-plus-page .mrp-concept { padding: 60px 20px; text-align: center; background: #556670; }
.myraku-plus-page .mrp-concept h2 { font-size: 1.8rem; color: #ffffff; margin-bottom: 30px; }
.myraku-plus-page .mrp-concept-text { max-width: 800px; margin: 0 auto; font-size: 1.05rem; color: #ffffff; }
.myraku-plus-page .mrp-concept-text strong { color: #f9ff00; }

.myraku-plus-page .mrp-plans { padding: 60px 20px; max-width: 1050px; margin: 0 auto; box-sizing: border-box; }

/* 4連タブメニュー */
.myraku-plus-page .mrp-tab-menu-wrap { width: 100%; margin-bottom: 30px; display: block; }
.myraku-plus-page .mrp-tab-nav-custom { display: flex; flex-direction: row; width: 100%; list-style: none; padding: 0; margin: 0; border: none; background: transparent; box-sizing: border-box; }
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp { flex: 1 1 25%; width: 25%; text-align: center; cursor: pointer; transition: all 0.3s ease; border: 5px solid transparent; margin: 0; padding: 0; box-sizing: border-box; display: block; }

/* タブ枠線カラー */
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp.nav-a { border-color: #6a9596; }
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp.nav-b { border-color: #bda36b; }
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp.nav-c { border-color: #987598; }
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp.nav-alpha { border-color: #729671; }

/* タブヘッド */
.myraku-plus-page .mrp-tab-head { color: #fff; font-size: 15px; font-weight: bold; padding: 10px 5px; letter-spacing: 0.05em; font-family: sans-serif; display: block; width: 100%; box-sizing: border-box; white-space: nowrap; }
.myraku-plus-page .nav-a .mrp-tab-head { background-color: #6a9596; }
.myraku-plus-page .nav-b .mrp-tab-head { background-color: #bda36b; }
.myraku-plus-page .nav-c .mrp-tab-head { background-color: #987598; }
.myraku-plus-page .nav-alpha .mrp-tab-head { background-color: #729671; }

/* タブボディ */
.myraku-plus-page .mrp-tab-body { padding: 18px 5px; font-size: 14px; font-weight: bold; line-height: 1.4; background-color: #556670; color: #ffffff; display: block; width: 100%; box-sizing: border-box; }

/* アクティブタブ */
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp.active .mrp-tab-body { background-color: #ffffff; color: #4a5568; }
.myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp.active { background-color: transparent; }

/* 詳細カードスライダー */
.myraku-plus-page .mrp-slider-main-container { position: relative; width: 100%; }
.myraku-plus-page .mrp-slide-item { outline: none; }
.myraku-plus-page .mrp-slide-badge { width: 100%; color: #fff; font-weight: bold; font-size: 15px; padding: 12px 0; text-align: center; letter-spacing: 0.1em; font-family: sans-serif; }
.myraku-plus-page .mrp-slide-badge.color-a { background-color: #6a9596; }
.myraku-plus-page .mrp-slide-badge.color-b { background-color: #bda36b; }
.myraku-plus-page .mrp-slide-badge.color-c { background-color: #987598; }
.myraku-plus-page .mrp-slide-badge.color-alpha { background-color: #729671; }

.myraku-plus-page .mrp-plan-card { display: flex; background: #ffffff; border-radius: 0 0 8px 8px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.06); border: 1px solid #e2e8f0; border-top: none; margin-bottom: 10px; width: 100%; }
.myraku-plus-page .mrp-plan-img { flex: 1; width: 50%; min-width: 0; min-height: 450px; background: #e2e8f0; position: relative; }
.myraku-plus-page .mrp-plan-img img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }

.myraku-plus-page .mrp-price-badge { position: absolute; bottom: 25px; left: 25px; width: 120px; height: 120px; background-color: rgba(106, 149, 150, 0.95); color: #fff; border-radius: 50%; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 5; box-shadow: 0 6px 15px rgba(0,0,0,0.2); font-weight: bold; }
.myraku-plus-page .mrp-slide-item:nth-child(2) .mrp-price-badge { background-color: rgba(189, 163, 107, 0.95); }
.myraku-plus-page .mrp-slide-item:nth-child(3) .mrp-price-badge { background-color: rgba(152, 117, 152, 0.95); }
.myraku-plus-page .mrp-slide-item:nth-child(4) .mrp-price-badge { background-color: rgba(114, 150, 113, 0.95); }
.myraku-plus-page .mrp-price-badge p { font-size: 12px; margin: 0; opacity: 0.9; line-height: 1; }
.myraku-plus-page .mrp-price-badge h3 { font-size: 2.2rem; margin: 2px 0 0 0; font-weight: 800; line-height: 1; font-family: sans-serif; color: #fff; }
.myraku-plus-page .mrp-price-badge h3 span { font-size: 13px; font-weight: bold; margin-left: 2px; color: #fff; }

.myraku-plus-page .mrp-plan-content { flex: 1.1; width: 50%; padding: 45px; display: flex; flex-direction: column; justify-content: flex-start; box-sizing: border-box; }
.myraku-plus-page .mrp-plan-title { font-size: 26px; font-weight: 700; margin: 0 0 25px 0; color: #1e293b; text-align: left; }
.myraku-plus-page .mrp-plan-features { list-style: none; padding: 0; margin: 0 0 30px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.myraku-plus-page .mrp-plan-features li { background: #cbd5e1; color: #1e293b; padding: 8px 16px; border-radius: 4px; font-size: 13px; font-weight: bold; }
.myraku-plus-page .mrp-plan-desc { font-size: 15px; line-height: 1.8; color: #475569; margin: 0; text-align: justify; }

/* スライダー矢印 */
.myraku-plus-page .mrp-arrow { position: absolute; top: calc(50% + 20px); transform: translateY(-50%); width: 50px; height: 50px; background: transparent; border: none; cursor: pointer; z-index: 10; }
.myraku-plus-page .mrp-prev { left: -65px; }
.myraku-plus-page .mrp-next { right: -65px; }
.myraku-plus-page .mrp-arrow::after { content: ""; display: block; width: 24px; height: 24px; border-bottom: 2px solid #94a3b8; border-left: 2px solid #94a3b8; transition: border-color 0.3s; }
.myraku-plus-page .mrp-prev::after { transform: rotate(45deg); margin-left: 15px; }
.myraku-plus-page .mrp-next::after { transform: rotate(-135deg); margin-left: 5px; }
.myraku-plus-page .mrp-arrow:hover::after { border-color: #1e293b; }

/* 連動コンテンツアニメーション */
.myraku-plus-page .mrp-sub-content { animation: fadeInContent 0.5s ease-in-out; }
@keyframes fadeInContent {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==========================================
   3. Option A 用デザイン (GXセクション流用)
========================================== */
.myraku-plus-page .gx-section { width: 100%; margin: 0 auto; text-align: center; font-family: serif; padding: 2% 0 1%; letter-spacing: 0.4em; }
.myraku-plus-page .gx-section .gx-subtitle { margin-bottom: 10px; }
.myraku-plus-page .gx-section .gx-subtitle2 { font-size: 0.7em; color: maroon; margin-top: 10px; }
.myraku-plus-page .gx-section .gx-title { font-size: 1.5em; margin-bottom: 0; }
.myraku-plus-page .gx-features { width: 100%; display: flex; justify-content: space-between; padding-top: 40px; font-size: 0.9em; letter-spacing: 0.2em; line-height: 1.5em; }
.myraku-plus-page .gx-feature-item { flex: 1; padding: 20px; margin: 0px 70px; box-sizing: border-box; height: 300px; display: flex; flex-direction: column; font-size: 0.9em; }
.myraku-plus-page .gx-feature-item p { color: #a68b5a; font-weight: bold; font-size: 1.3em; }
.myraku-plus-page .gx-feature-item .gx-item-title { border-bottom: 2px solid #a68b5a; padding-bottom: 10px; margin-bottom: 15px; }
.myraku-plus-page .gx-feature-item .gx-item-title span { font-size: 1.8em; }

.myraku-plus-page .gx-drawer-btn { display: block; width: 100%; max-width: 1000px; margin: 40px auto 0; padding: 15px 0; background-color: transparent; border: 1px solid #a68b5a; color: #333; font-size: 16px; font-family: serif; letter-spacing: 0.2em; cursor: pointer; transition: background-color 0.3s ease; }
.myraku-plus-page .gx-drawer-btn:hover { background-color: #f9f9f9; }

.myraku-plus-page .gx-drawer-content { display: block; overflow: visible; margin-top: 0; }
.myraku-plus-page .gx-drawer-inner { min-height: 0; background-color: transparent; width: 100%; }

.myraku-plus-page .gx-d-close-wrap { padding: 0 5% 80px; background-color: #5d6d75; margin-top: -40px; }
.myraku-plus-page #gx-drawer-close-btn { border-color: #fff; color: #fff; }
.myraku-plus-page #gx-drawer-close-btn:hover { background-color: rgba(255,255,255,0.1); }

.myraku-plus-page .gx-d-sec { padding: 100px 0; font-family: 'Noto Sans JP', sans-serif; }
.myraku-plus-page .gx-d-inner { max-width: 1050px; margin: 0 auto; padding: 0 4%; }
.myraku-plus-page .gx-d-bg-white { background-color: #ffffff; color: #333; }
.myraku-plus-page .gx-d-bg-gray  { background-color: #8c8f91; color: #fff; }
.myraku-plus-page .gx-d-bg-light { background-color: #e5e5e5; color: #333; }
.myraku-plus-page .gx-d-bg-dark  { background-color: #242221; color: #fff; }
.myraku-plus-page .gx-d-bg-blue  { background-color: #5d6d75; color: #fff; }

.myraku-plus-page .gx-d-title { font-size: 26px; font-weight: bold; letter-spacing: 0.15em; margin-bottom: 40px; text-align: left; }
.myraku-plus-page .gx-d-title span { font-size: 32px; margin-right: 15px; font-family: serif; }
.myraku-plus-page .gx-d-subtitle { font-size: 14px; font-weight: bold; margin: -25px 0 40px 0; text-align: left; }

.myraku-plus-page .gx-d-dummy-img { width: 100%; background-color: rgba(0,0,0,0.15); border: 1px solid rgba(255,255,255,0.2); }
.myraku-plus-page .gx-d-bg-white .gx-d-dummy-img, .myraku-plus-page .gx-d-bg-light .gx-d-dummy-img { background-color: #ddd; border: none; }

.myraku-plus-page .gx-d-option-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 50px; width: 100%; }
.myraku-plus-page .gx-d-opt-label { background: #fff; color: #333; padding: 5px 25px; font-weight: bold; letter-spacing: 0.1em; font-size: 16px; }
.myraku-plus-page .gx-d-opt-line { flex-grow: 1; height: 1px; background-color: #fff; margin: 0 20px; }
.myraku-plus-page .gx-d-opt-price { color: #dcd033; font-size: 24px; font-weight: bold; letter-spacing: 0.1em; }
.myraku-plus-page .gx-d-opt-price span { font-size: 16px; }

.myraku-plus-page .gx-d-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 60px; margin-bottom: 60px; }
.myraku-plus-page .gx-d-row-reverse { flex-direction: row-reverse; }
.myraku-plus-page .gx-d-img, .myraku-plus-page .gx-d-txt { width: 48%; text-align: left; }

.myraku-plus-page .gx-d-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 25px; }
.myraku-plus-page .gx-d-tag { display: inline-block; background-color: #222; color: #fff; font-size: 12px; font-weight: bold; padding: 4px 10px; }
.myraku-plus-page .gx-d-tags-inv .gx-d-tag { background-color: #fff; color: #333; }
.myraku-plus-page .gx-d-catch { font-size: 28px; font-weight: bold; line-height: 1.5; margin-bottom: 25px; letter-spacing: 0.05em; }
.myraku-plus-page .gx-d-desc { font-size: 14px; line-height: 1.8; letter-spacing: 0.05em; text-align: justify; }
.myraku-plus-page .gx-d-note { font-size: 11px; line-height: 1.5; margin-top: 30px; opacity: 0.8; letter-spacing: 0.2em; }
.myraku-plus-page .gx-d-img-caption { background-color: #222; color: #fff; text-align: center; padding: 10px 0; font-weight: bold; font-size: 14px; margin-top: -5px; }
.myraku-plus-page .gx-d-img-caption-outline { border: 1px solid #fff; text-align: center; padding: 10px 0; font-weight: bold; font-size: 14px; margin-bottom: 5px; }

.myraku-plus-page .gx-d-list-btns { list-style: none; padding: 0; margin: 0; }
.myraku-plus-page .gx-d-list-btns li { border: 1px solid #333; text-align: center; padding: 18px 10px; margin-bottom: 10px; font-weight: bold; font-size: 14px; background: transparent; }
.myraku-plus-page .gx-d-cols { display: flex; justify-content: space-between; gap: 40px; }
.myraku-plus-page .gx-d-cols-3 .gx-d-col { width: 30%; text-align: left; }
.myraku-plus-page .gx-d-lines .gx-d-col { position: relative; }
.myraku-plus-page .gx-d-lines .gx-d-col:not(:first-child)::before { content: ""; position: absolute; left: -20px; top: 0; width: 1px; height: 100%; background-color: currentColor; }
.myraku-plus-page .gx-d-col-title { font-size: 18px; font-weight: bold; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 4px solid currentColor; line-height: 1.4; }
.myraku-plus-page .gx-d-col-title span { display: block; font-size: 24px; font-family: serif; margin-bottom: 5px; font-weight: normal; }
.myraku-plus-page .gx-d-lines .gx-d-col p { font-size: 13px; line-height: 1.7; text-align: justify; }

.myraku-plus-page .gx-d-cards .gx-d-card { width: 23%; background: #fff; color: #333; border: 1px solid #111; padding: 25px 15px; text-align: center; }
.myraku-plus-page .gx-d-card-en { display: block; font-size: 9px; color: #666; letter-spacing: 0.1em; margin-bottom: 5px; }
.myraku-plus-page .gx-d-card-title { font-size: 1em; font-weight: bold; margin-bottom: 15px; padding-bottom: 15px; position: relative; }
.myraku-plus-page .gx-d-card-title::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 30px; height: 1px; background-color: #333; }
.myraku-plus-page .gx-d-card p { font-size: 0.9em; line-height: 1.6; font-weight: bold; letter-spacing: 0.2em; }
.myraku-plus-page .gx-d-half-boxes { display: flex; gap: 10px; }
.myraku-plus-page .gx-d-half-box { flex: 1; border: 1px solid #fff; text-align: center; padding: 20px 10px; }
.myraku-plus-page .gx-d-half-box h5 { font-size: 18px; font-weight: bold; margin-bottom: 10px; letter-spacing: 0.2em; }
.myraku-plus-page .gx-d-half-box p { font-size: 11px; line-height: 1.5; letter-spacing: 0.2em; }

.myraku-plus-page .gx-d-chevrons { display: flex; width: 100%; height: 80px; margin-top: 50px; }
.myraku-plus-page .gx-d-chev { flex: 1; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: bold; color: #333; line-height: 1.4; text-align: left; padding-left: 20px; }
.myraku-plus-page .gx-d-chev-1 { background-color: #9c9c9c; clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%); padding-right: 15px; }
.myraku-plus-page .gx-d-chev-2 { background-color: #b5b5b5; clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%, 10% 50%); margin-left: -3%; padding-left: 30px; }
.myraku-plus-page .gx-d-chev-3 { background-color: #d1d1d1; clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%, 10% 50%); margin-left: -3%; padding-left: 30px; }
.myraku-plus-page .gx-d-chev-4 { background-color: #ffffff; clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 10% 50%); margin-left: -3%; padding-left: 30px; }


/* ==========================================
   4. B & C セクション共通背景・ベース設定
========================================== */
.myraku-plus-page .mrp-b-bg-white, .myraku-plus-page .mrp-c-bg-white { background-color: #ffffff; color: #333; }
.myraku-plus-page .mrp-b-bg-light, .myraku-plus-page .mrp-c-bg-light { background-color: #e5e5e5; color: #333; }
.myraku-plus-page .mrp-b-bg-gray,  .myraku-plus-page .mrp-c-bg-gray  { background-color: #8c8f91; color: #fff; }
.myraku-plus-page .mrp-b-bg-blue,  .myraku-plus-page .mrp-c-bg-blue  { background-color: #5d6d75; color: #fff; }
.myraku-plus-page .mrp-b-bg-dark,  .myraku-plus-page .mrp-c-bg-dark  { background-color: #242221; color: #fff; }

/* 背景色に応じたタグ色の自動反転 */
.myraku-plus-page .mrp-b-tag, .myraku-plus-page .mrp-c-tag { background-color: #222; color: #fff; border: none; font-weight: bold; display: inline-block; }
.myraku-plus-page :is(.mrp-b-bg-gray, .mrp-b-bg-blue, .mrp-b-bg-dark, .mrp-c-bg-gray, .mrp-c-bg-blue, .mrp-c-bg-dark) .mrp-b-tag,
.myraku-plus-page :is(.mrp-b-bg-gray, .mrp-b-bg-blue, .mrp-b-bg-dark, .mrp-c-bg-gray, .mrp-c-bg-blue, .mrp-c-bg-dark) .mrp-c-tag { background-color: #fff; color: #222; }

/* ダミー画像枠やブランド枠の統一 */
.myraku-plus-page .mrp-b-dummy-img, .myraku-plus-page .mrp-c-dummy-img { width: 100%; background-color: #ffffff00; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.myraku-plus-page .mrp-b-dummy-img img, .myraku-plus-page .mrp-c-dummy-img img { width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: 100% !important; object-fit: contain !important; padding: 10px; box-sizing: border-box; }

.myraku-plus-page .mrp-b-black-box, .myraku-plus-page .mrp-c-black-box { background-color: #242221; color: #fff; display: flex; padding: 25px; position: relative; justify-content: space-between; }
.myraku-plus-page .mrp-b-black-box span, .myraku-plus-page .mrp-c-black-box span { font-size: 10px; color: #999; letter-spacing: 0.1em; font-weight: bold; display: block; margin-bottom: 5px; }
.myraku-plus-page .mrp-b-black-box p, .myraku-plus-page .mrp-c-black-box p { font-size: 14px; font-weight: bold; margin: 0; letter-spacing: 0.05em; color: #fff; }


/* ==========================================
   5. Option B (With Dog&Cat) 用デザイン
========================================== */
.myraku-plus-page .mrp-b-wrapper { font-family: 'Noto Sans JP', sans-serif; line-height: 1.6; }
.myraku-plus-page .mrp-b-sec { padding: 100px 0; }
.myraku-plus-page .mrp-b-inner { max-width: 1000px; margin: 0 auto; padding: 0 4%; box-sizing: border-box; }
.myraku-plus-page .mrp-b-head { margin-bottom: 60px; text-align: left; }
.myraku-plus-page .mrp-b-head-top { display: flex; align-items: baseline; gap: 15px; margin-bottom: 10px; }

/* 文字色を「inherit (背景色に追従)」にしてモノトーン化 */
.myraku-plus-page .mrp-b-head-num { font-size: 70px; font-family: serif; color: inherit; opacity: 0.5; line-height: 1; }
.myraku-plus-page .mrp-b-head-en { font-size: 14px; font-weight: bold; letter-spacing: 0.2em; color: inherit; opacity: 0.7; }
.myraku-plus-page .mrp-b-title { font-size: 28px; font-weight: bold; margin-bottom: 15px; letter-spacing: 0.1em; color: inherit; }
.myraku-plus-page .mrp-b-lead { font-size: 14px; letter-spacing: 0.1em; line-height: 1.6; color: inherit; opacity: 0.8; }
.myraku-plus-page .mrp-b-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 60px; }
.myraku-plus-page .mrp-b-row-reverse { flex-direction: row-reverse; }
.myraku-plus-page .mrp-b-col-img, .myraku-plus-page .mrp-b-col-txt { width: 48%; }
.myraku-plus-page .mrp-b-dummy-img { aspect-ratio: 4/3; }
.myraku-plus-page .mrp-b-features { margin-top: 40px; display: flex; flex-direction: column; gap: 30px; }
.myraku-plus-page .mrp-b-feature { display: flex; align-items: flex-start; gap: 20px; }
.myraku-plus-page .mrp-b-feature-icon { width: 45px; height: 45px; border: 1px solid #999; display: flex; justify-content: center; align-items: center; flex-shrink: 0; background-color: #fff; }
.myraku-plus-page .mrp-b-feature-icon img { max-width: 60%; max-height: 60%; }
.myraku-plus-page .mrp-b-en { font-size: 11px; letter-spacing: 0.1em; font-weight: bold; display: block; margin-bottom: 5px; color: inherit; opacity: 0.7; }
.myraku-plus-page .mrp-b-feature-txt h4 { font-size: 16px; font-weight: bold; margin-bottom: 8px; color: inherit; }
.myraku-plus-page .mrp-b-feature-txt p { font-size: 12px; line-height: 1.6; opacity: 0.9; }

.myraku-plus-page .mrp-b-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 25px; }
.myraku-plus-page .mrp-b-tag { font-size: 12px; padding: 6px 15px; letter-spacing: 0.1em; }
.myraku-plus-page .mrp-b-catch { font-size: 24px; font-weight: bold; line-height: 1.6; margin-bottom: 15px; letter-spacing: 0.05em; color: inherit; }
.myraku-plus-page .mrp-b-subtitle { font-size: 12px; font-weight: bold; letter-spacing: 0.15em; margin-bottom: 15px; color: inherit; opacity: 0.9; }
.myraku-plus-page .mrp-b-line { width: 40px; height: 2px; background-color: currentColor; opacity: 0.4; margin-bottom: 25px; }
.myraku-plus-page .mrp-b-desc { font-size: 14px; line-height: 2; text-align: justify; letter-spacing: 0.05em; opacity: 0.9; }

.myraku-plus-page .mrp-b-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; margin-top: 80px; }
.myraku-plus-page .mrp-b-grid-item { text-align: left; }
.myraku-plus-page .mrp-b-grid-num { font-size: 36px; font-family: serif; color: inherit; opacity: 0.5; display: block; margin-bottom: 5px; line-height: 1; }
.myraku-plus-page .mrp-b-grid-title { font-size: 18px; font-weight: bold; color: inherit; margin-bottom: 15px; }
.myraku-plus-page .mrp-b-grid-line { width: 100%; height: 1px; background-color: currentColor; opacity: 0.3; margin-bottom: 15px; }
.myraku-plus-page .mrp-b-grid-item p { font-size: 13px; line-height: 1.8; opacity: 0.9; }


/* ==========================================
   6. Option C (防犯IoTパック) 用デザイン
========================================== */
.myraku-plus-page .mrp-c-wrapper { font-family: 'Noto Sans JP', sans-serif; line-height: 1.6; }
.myraku-plus-page .mrp-c-sec { padding: 60px 20px; }
.myraku-plus-page .mrp-c-inner { max-width: 1000px; margin: 0 auto; padding: 0 4%; box-sizing: border-box; }
.myraku-plus-page .mrp-c-head { margin-bottom: 40px; text-align: center; }
.myraku-plus-page .mrp-c-head-top { display: flex; justify-content: center; align-items: baseline; gap: 15px; margin-bottom: 10px; }
.myraku-plus-page .mrp-c-head-num { font-size: 3rem; color: inherit; opacity: 0.5; font-family: serif; line-height: 1; }
.myraku-plus-page .mrp-c-head-en { font-size: 0.9rem; color: inherit; opacity: 0.7; font-weight: bold; letter-spacing: 0.05em; }
.myraku-plus-page .mrp-c-title { font-size: 2rem; margin-bottom: 15px; font-weight: normal; color: inherit; }
.myraku-plus-page .mrp-c-main-title { font-size: 2.4rem; margin-bottom: 20px; color: inherit; }
.myraku-plus-page .mrp-c-lead { font-size: 1rem; color: inherit; opacity: 0.8; }

/* パック価格とサマリー (一番上) */
.myraku-plus-page .mrp-c-price-box { background-color: #242221; color: #fff; display: inline-flex; align-items: baseline; padding: 20px 30px; margin-bottom: 30px; }
.myraku-plus-page .mrp-c-price-label { color: #fff; font-size: 0.9rem; letter-spacing: 0.05em; margin-right: 15px; }
.myraku-plus-page .mrp-c-price-num { color: #dcd033; font-size: 2.2rem; font-family: serif; margin-right: 10px; }
.myraku-plus-page .mrp-c-price-tax { font-size: 0.8rem; color: #aaa; }
.myraku-plus-page .mrp-c-intro-text { font-size: 1.05rem; line-height: 1.8; opacity: 0.9; margin-bottom: 50px; }

.myraku-plus-page .mrp-c-summary-grid { display: flex; background: transparent; border: 1px solid currentColor; opacity: 0.9; }
.myraku-plus-page .mrp-c-summary-item { flex: 1; padding: 30px 15px; text-align: center; border-right: 1px solid currentColor; }
.myraku-plus-page .mrp-c-summary-item:last-child { border-right: none; }
.myraku-plus-page .mrp-c-summary-num { display: block; color: inherit; opacity: 0.8; font-size: 0.75rem; font-weight: bold; margin-bottom: 15px; letter-spacing: 0.05em; }
.myraku-plus-page .mrp-c-summary-icon { margin-bottom: 15px; min-height: 40px; }
.myraku-plus-page .mrp-c-summary-item h5 { font-size: 0.95rem; margin-bottom: 10px; border-bottom: 1px solid currentColor; padding-bottom: 10px; display: inline-block; }
.myraku-plus-page .mrp-c-summary-item p { font-size: 0.8rem; line-height: 1.5; opacity: 0.9; }

.myraku-plus-page .mrp-c-row { display: flex; flex-wrap: wrap; gap: 50px; align-items: flex-start; }
.myraku-plus-page .mrp-c-row-reverse { flex-direction: row-reverse; }
.myraku-plus-page .mrp-c-col-img { flex: 1; min-width: 300px; position: relative; }
.myraku-plus-page .mrp-c-col-txt { flex: 1; min-width: 300px; }

.myraku-plus-page .mrp-c-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.myraku-plus-page .mrp-c-tag { padding: 4px 10px; font-size: 0.8rem; }
.myraku-plus-page .mrp-c-catch { font-size: 1.5rem; line-height: 1.5; margin-bottom: 10px; color: inherit; }
.myraku-plus-page .mrp-c-subtitle, .myraku-plus-page .mrp-c-sub-accent { color: inherit; opacity: 0.9; font-size: 0.85rem; letter-spacing: 0.05em; font-weight: bold; margin-bottom: 15px; }
.myraku-plus-page .mrp-c-line { width: 40px; height: 2px; background-color: currentColor; opacity: 0.4; margin-bottom: 20px; }
.myraku-plus-page .mrp-c-desc { font-size: 0.95rem; opacity: 0.9; margin-bottom: 20px; }

.myraku-plus-page .mrp-c-feature-list { margin-top: 20px; }
.myraku-plus-page .mrp-c-fl-item { display: flex; align-items: flex-start; margin-bottom: 15px; }
.myraku-plus-page .mrp-c-fl-item span { color: inherit; opacity: 0.5; font-family: serif; font-size: 1.2rem; margin-right: 15px; line-height: 1; }
.myraku-plus-page .mrp-c-fl-item p { font-size: 0.9rem; opacity: 0.9; margin: 0; }
.myraku-plus-page .mrp-c-fl-item strong { margin-right: 10px; }
.myraku-plus-page .mrp-c-grid-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }

/* オプション3選 */
.myraku-plus-page .mrp-c-add-option-badge { background: #222; color: #fff; padding: 5px 15px; font-weight: bold; font-size: 0.9rem; }
.myraku-plus-page .mrp-c-add-option-line { height: 1px; background-color: currentColor; opacity: 0.3; flex: 1; margin: 0 20px; }
.myraku-plus-page .mrp-c-opt-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-bottom: 30px; }
.myraku-plus-page .mrp-c-opt-card { background: transparent; border: 1px solid currentColor; padding: 30px 20px; opacity: 0.9; }
.myraku-plus-page .mrp-c-opt-num { color: inherit; opacity: 0.5; font-family: serif; font-size: 2.5rem; display: block; margin-bottom: 10px; line-height: 1; }
.myraku-plus-page .mrp-c-opt-title { font-size: 1.1rem; margin-bottom: 15px; border-bottom: 1px solid currentColor; padding-bottom: 15px; opacity: 0.8; }
.myraku-plus-page .mrp-c-opt-price { color: #817a27; font-size: 1.4rem; font-weight: bold; margin-bottom: 15px; }
.myraku-plus-page .mrp-c-opt-price span { font-size: 0.8rem; font-weight: normal; color: inherit; }
.myraku-plus-page .mrp-c-opt-desc { font-size: 0.85rem; opacity: 0.9; margin-bottom: 15px; min-height: 60px; }
.myraku-plus-page .mrp-c-opt-list { padding-left: 15px; margin: 0; }
.myraku-plus-page .mrp-c-opt-list li { font-size: 0.8rem; opacity: 0.9; margin-bottom: 8px; position: relative; list-style: none; }
.myraku-plus-page .mrp-c-opt-list li::before { content: '▶︎'; color: inherit; opacity: 0.5; position: absolute; left: -15px; font-size: 0.7rem; top: 2px; }

.myraku-plus-page .mrp-c-opt-total { background: #242221; padding: 20px 30px; display: flex; justify-content: space-between; align-items: center; color: #fff; }
.myraku-plus-page .mrp-c-opt-total span { font-weight: bold; color: #fff; }
.myraku-plus-page .mrp-c-opt-total-price { color: #dcd033; font-size: 1.5rem; font-weight: bold; }
.myraku-plus-page .mrp-c-opt-total-price span { font-size: 0.9rem; font-weight: normal; color: #fff; }

.myraku-plus-page .mrp-c-footer-note { background-color: #1a1a1a; color: #999; text-align: center; padding: 30px 20px; font-size: 0.85rem; letter-spacing: 0.15em; }


/* ==========================================
   7. CTA（シミュレーション誘導）セクション
========================================== */
.myraku-plus-page .mrp-cta { text-align: center; padding: 80px 20px; background-color: #556670; color: #ffffff; clear: both; }
.myraku-plus-page .mrp-cta h2 { font-size: 24px; font-weight: bold; color: #ffffff; margin-bottom: 15px; }
.myraku-plus-page .mrp-cta p { color: #ffffff; font-size: 16px; }

.myraku-plus-page .mrp-btn { display: inline-block; background-color: #222; color: #ffffff; padding: 16px 50px; border-radius: 50px; font-size: 16px; font-weight: bold; text-decoration: none; transition: all 0.3s ease; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); }
.myraku-plus-page .mrp-btn:hover { background-color: #444; color: #ffffff; transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); }


/* ==========================================
   8. OPTION α (プチカスタム) 専用CSS
========================================== */

/* 価格ボックス */
.myraku-plus-page .mrp-alpha-price-box { background-color: #242221; color: #fff; padding: 40px; text-align: center; margin-top: 40px; }
.myraku-plus-page .mrp-alpha-price-flex { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 20px; }
.myraku-plus-page .mrp-alpha-price-item { flex: 1; border: 1px solid rgba(255,255,255,0.2); padding: 30px 20px; }
.myraku-plus-page .mrp-alpha-price-item.is-accent { border-color: #dcd033; }

/* 8個の変更例グリッド */
.myraku-plus-page .mrp-alpha-8grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px 25px; margin-top: 40px; }
.myraku-plus-page .mrp-alpha-8grid-item { text-align: left; }
.myraku-plus-page .mrp-alpha-8grid-num { color: #bda36b; font-weight: bold; font-size: 0.95rem; display: block; margin-bottom: 5px; letter-spacing: 0.05em; }
.myraku-plus-page .mrp-alpha-8grid-title { font-size: 1.1rem; font-weight: bold; margin-bottom: 12px; }
.myraku-plus-page .mrp-alpha-8grid-line { height: 1px; background-color: #bda36b; opacity: 0.3; margin-bottom: 12px; width: 100%; }
.myraku-plus-page .mrp-alpha-8grid-example { font-size: 0.7rem; color: #bda36b; letter-spacing: 0.1em; font-weight: bold; margin-bottom: 8px; display: block; }

/* できること・できないこと (PC2列) */
.myraku-plus-page .mrp-alpha-2col-grid { grid-template-columns: 1fr 1fr; }
.myraku-plus-page .mrp-alpha-2col-scope { display: flex; gap: 30px; margin-top: 40px; align-items: stretch; }
.myraku-plus-page .mrp-alpha-scope-box { flex: 1; padding: 40px; }
.myraku-plus-page .mrp-alpha-scope-box.is-can { background: #fff; border-top: 5px solid #242221; }
.myraku-plus-page .mrp-alpha-scope-box.is-cannot { background: #f1f5f9; border-top: 5px solid #94a3b8; }
.myraku-plus-page .mrp-alpha-list-circle, .myraku-plus-page .mrp-alpha-list-dash { padding-left: 20px; margin: 0; list-style: none; }
.myraku-plus-page .mrp-alpha-list-circle li { font-size: 0.9rem; margin-bottom: 12px; position: relative; }
.myraku-plus-page .mrp-alpha-list-circle li::before { content: '◎'; color: #bda36b; position: absolute; left: -25px; top: -1px; font-size: 1rem; }
.myraku-plus-page .mrp-alpha-list-dash li { font-size: 0.9rem; margin-bottom: 12px; position: relative; color: #475569; }
.myraku-plus-page .mrp-alpha-list-dash li::before { content: '—'; color: #94a3b8; position: absolute; left: -25px; top: -1px; font-weight: bold; }

/* プチカスタムの流れ */
.myraku-plus-page .mrp-alpha-flow { display: flex; justify-content: space-between; margin-top: 40px; position: relative; }
.myraku-plus-page .mrp-alpha-flow-item { flex: 1; text-align: center; padding: 0 15px; position: relative; }
.myraku-plus-page .mrp-alpha-flow-item:not(:last-child)::after { content: ''; position: absolute; right: -5px; top: 35px; width: 8px; height: 8px; border-top: 2px solid #cbd5e1; border-right: 2px solid #cbd5e1; transform: rotate(45deg); }
.myraku-plus-page .mrp-alpha-flow-num { width: 70px; height: 70px; border: 1px solid #bda36b; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #bda36b; font-family: serif; margin: 0 auto 20px; background: #fff; }


/* ==========================================
   9. レスポンシブ (スマホ・768px以下共通)
========================================== */
@media screen and (max-width: 768px) {
    /* ヒーロー・コンセプト */
    .myraku-plus-page .mrp-hero h1 { font-size: 1.8rem; }
    .myraku-plus-page .mrp-hero p { font-size: 0.8rem; }
    .myraku-plus-page .mrp-concept h2 { font-size: 1.2rem; }
    .myraku-plus-page .mrp-plans { padding: 20px 10px !important; }
    
    /* タブメニュー */
    .myraku-plus-page .mrp-tab-nav-custom { flex-wrap: wrap !important; border-bottom: none !important; }
    .myraku-plus-page .mrp-tab-nav-custom li.nav-item-mrp { width: 50% !important; max-width: 50% !important; min-width: 50% !important; flex: 1 1 50% !important; border-width: 3px !important; box-sizing: border-box !important; }
    .myraku-plus-page .mrp-tab-head { font-size: 11px !important; padding: 5px 2px !important; letter-spacing: 0 !important; }
    .myraku-plus-page .mrp-tab-body { font-size: 12px !important; padding: 10px 2px !important; line-height: 1.3 !important; }

    /* スライダーカード */
    .myraku-plus-page .mrp-plan-card { flex-direction: column !important; border-radius: 0 0 8px 8px !important; width: 100% !important; box-sizing: border-box !important; }
    .myraku-plus-page .mrp-plan-img { width: 100% !important; min-height: 220px !important; height: 220px !important; }
    .myraku-plus-page .mrp-price-badge { width: 80px !important; height: 80px !important; bottom: 15px !important; left: 15px !important; }
    .myraku-plus-page .mrp-price-badge p { font-size: 9px !important; }
    .myraku-plus-page .mrp-price-badge h3 { font-size: 1.4rem !important; }
    .myraku-plus-page .mrp-price-badge h3 span { font-size: 10px !important; }
    .myraku-plus-page .mrp-plan-content { width: 100% !important; padding: 25px 15px !important; box-sizing: border-box !important; }
    .myraku-plus-page .mrp-plan-title { font-size: 18px !important; margin-bottom: 12px !important; text-align: center !important; }
    .myraku-plus-page .mrp-plan-features { gap: 6px !important; margin-bottom: 15px !important; justify-content: center !important; }
    .myraku-plus-page .mrp-plan-features li { font-size: 11px !important; padding: 4px 10px !important; }
    .myraku-plus-page .mrp-plan-desc { font-size: 13px !important; line-height: 1.6 !important; }
    .myraku-plus-page .mrp-arrow { display: none !important; }
    
    /* CTA */
    .myraku-plus-page .mrp-cta { padding: 40px 15px; }
    .myraku-plus-page .mrp-cta h2 { font-size: 1.3rem; }
    .myraku-plus-page .mrp-btn { width: 100%; max-width: 290px; padding: 14px; font-size: 1rem; }

    /* Option A (GX) */
    .myraku-plus-page .gx-section { padding: 0; letter-spacing: 0.1em; }
    .myraku-plus-page .gx-features { flex-direction: column; gap: 20px; }
    .myraku-plus-page .gx-feature-item { margin: 0px; }
    .myraku-plus-page .gx-d-sec { padding: 60px 0; }
    .myraku-plus-page .gx-d-row, .myraku-plus-page .gx-d-row-reverse { flex-direction: column; gap: 30px; margin-bottom: 40px; }
    .myraku-plus-page .gx-d-img, .myraku-plus-page .gx-d-txt { width: 100%; }
    .myraku-plus-page .gx-d-option-bar { flex-direction: column; align-items: flex-start; gap: 15px; }
    .myraku-plus-page .gx-d-opt-line { display: none; }
    .myraku-plus-page .gx-d-cols { flex-direction: column; gap: 40px; }
    .myraku-plus-page .gx-d-cols-3 .gx-d-col { width: 100%; }
    .myraku-plus-page .gx-d-lines .gx-d-col:not(:first-child)::before { display: none; }
    .myraku-plus-page .gx-d-cards .gx-d-card { width: 100%; margin-bottom: 10px; }
    .myraku-plus-page .gx-d-catch { font-size: 1.2em; }
    .myraku-plus-page .gx-d-title { font-size: 1.2em; }
    .myraku-plus-page .gx-d-title span { font-size: 1.2em; }
    .myraku-plus-page .gx-d-list-btns li { font-size: 0.6em; }
    .myraku-plus-page .gx-d-opt-price { font-size: 1.2em; }
    .myraku-plus-page .gx-d-half-box p { font-size: 0.7em; }
    .myraku-plus-page .gx-d-chevrons { flex-direction: column; height: auto; margin-top: 30px; gap: 5px; }
    .myraku-plus-page .gx-d-chev { padding: 15px; text-align: center; clip-path: none !important; margin-left: 0 !important; justify-content: center; position: relative; }
    .myraku-plus-page .gx-d-chev:not(:last-child)::after { content: "▼"; position: absolute; bottom: -15px; left: 50%; transform: translateX(-50%); color: #fff; z-index: 2; }
    .myraku-plus-page .gx-d-col-title br, .myraku-plus-page .gx-d-half-box br { display: none !important; }

    /* Option B & C & α 共通・レイアウト調整 */
    .myraku-plus-page .mrp-b-sec, .myraku-plus-page .mrp-c-sec { padding: 60px 0; }
    .myraku-plus-page .mrp-b-head-num, .myraku-plus-page .mrp-c-head-num { font-size: 50px; }
    .myraku-plus-page .mrp-b-title, .myraku-plus-page .mrp-c-title { font-size: 22px; }
    .myraku-plus-page .mrp-b-catch, .myraku-plus-page .mrp-c-catch { font-size: 20px; }
    .myraku-plus-page .mrp-b-row, .myraku-plus-page .mrp-b-row-reverse,
    .myraku-plus-page .mrp-c-row, .myraku-plus-page .mrp-c-row-reverse { flex-direction: column; gap: 30px; margin-bottom: 40px; }
    
    .myraku-plus-page .mrp-b-col-img, .myraku-plus-page .mrp-b-col-txt,
    .myraku-plus-page .mrp-c-col-img, .myraku-plus-page .mrp-c-col-txt { min-width: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; }
    
    .myraku-plus-page .mrp-b-dummy-img, .myraku-plus-page .mrp-c-dummy-img { aspect-ratio: auto; min-height: 250px; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; }
    
    .myraku-plus-page .mrp-b-black-box, .myraku-plus-page .mrp-c-black-box { flex-direction: column; gap: 20px; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; padding: 15px !important; }
    .myraku-plus-page .mrp-b-bb-left, .myraku-plus-page .mrp-b-bb-right,
    .myraku-plus-page .mrp-c-bb-left, .myraku-plus-page .mrp-c-bb-right { width: 100%; text-align: left !important; min-width: 0; flex: 1; }
    .myraku-plus-page .mrp-b-black-box p, .myraku-plus-page .mrp-c-black-box p { font-size: 0.85rem !important; word-break: break-word !important; line-height: 1.4; }

    /* Option B Specific */
    .myraku-plus-page .mrp-b-grid { grid-template-columns: 1fr; gap: 40px; margin-top: 50px; }
    
    /* Option C Specific */
    .myraku-plus-page .mrp-c-summary-grid { flex-direction: column; }
    .myraku-plus-page .mrp-c-summary-item { border-right: none !important; border-bottom: 1px solid currentColor !important; }
    .myraku-plus-page .mrp-c-opt-grid { grid-template-columns: 1fr; }
    .myraku-plus-page .mrp-c-sec .mrp-c-inner > div[style*="display:flex"] { flex-direction: column; text-align: center; gap: 20px; }
    .myraku-plus-page .mrp-c-sec .mrp-c-inner > div > div { width: 100% !important; }
    
    .myraku-plus-page .mrp-c-price-box { width: 100% !important; box-sizing: border-box !important; display: flex; flex-direction: column; align-items: center; padding: 20px 15px !important; }
    .myraku-plus-page .mrp-c-price-label { margin-right: 0 !important; margin-bottom: 5px; }
    .myraku-plus-page .mrp-c-price-num { margin-right: 0 !important; font-size: 2rem !important; }

    /* Option α Specific */
    .myraku-plus-page .mrp-alpha-price-flex { flex-direction: column; gap: 10px; }
    .myraku-plus-page .mrp-alpha-price-item { width: 100%; box-sizing: border-box; }
    .myraku-plus-page .mrp-alpha-8grid { grid-template-columns: 1fr 1fr; gap: 30px 15px; }
    .myraku-plus-page .mrp-alpha-2col-grid { grid-template-columns: 1fr; }
    .myraku-plus-page .mrp-alpha-2col-scope { flex-direction: column; gap: 20px; }
    .myraku-plus-page .mrp-alpha-scope-box { padding: 30px 20px; }
    .myraku-plus-page .mrp-alpha-flow { flex-direction: column; gap: 40px; }
    .myraku-plus-page .mrp-alpha-flow-item:not(:last-child)::after { right: auto; left: 50%; top: auto; bottom: -25px; transform: translateX(-50%) rotate(135deg); }
}