/*
 * Mansion Tower Detail V2
 * 2026-09-23
 *
 * Detail-page visual overrides only.
 * Common header/sidebar are intentionally excluded.
 */

/* ============================================================
   DETAIL V2 / VISUAL V1
   ============================================================ */

/* ----- Normal content sections ----- */

.mt-detail-page-main .content-box{
    box-sizing:border-box;
    margin:0 34px 32px;
    padding:28px 30px;
    background:#fff;
    border-radius:8px;
    box-shadow:0 1px 2px rgba(0,0,0,.04);
}

.mt-detail-page-main .content-box h2{
    margin:0 0 20px;
    padding:0 0 13px;
    border-bottom:1px solid #d8d1c9;
    color:#3b332f;
    font-size:21px;
    line-height:1.5;
    font-weight:700;
}

.mt-detail-page-main .content-copy{
    margin:0;
    color:#555;
    font-size:14px;
    line-height:2;
}


/* ----- Mansion information ----- */

.mt-final-info-preview{
    padding-top:34px;
    padding-bottom:34px;
}

.mt-final-info-box{
    box-shadow:0 1px 3px rgba(0,0,0,.04);
}

.mt-final-info-label{
    color:#3b332f;
    font-size:18px;
}


/* ----- Staff / recommend comments ----- */

.mt-detail-page-main .mt-final-info-preview + .content-box{
    border-left:4px solid #e85a00;
}

.mt-detail-page-main .content-box + .content-box{
    position:relative;
}


/* ----- Property section ----- */

.mt-detail-page-main .property-grid{
    display:block;
    margin:0;
}

.mt-detail-page-main .property-card{
    margin:0 0 18px;
    padding:0;
    overflow:hidden;
    border:1px solid #ddd6ce;
    border-radius:5px;
    background:#fff;
    box-shadow:none;
}

.mt-detail-page-main .property-card-link{
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    grid-template-rows:auto auto 1fr;
    min-height:220px;
    color:inherit;
    text-decoration:none;
}

.mt-detail-page-main .property-card-image{
    grid-column:1;
    grid-row:1 / 4;
    width:260px;
    height:100%;
    min-height:220px;
    margin:0;
    overflow:hidden;
    background:#eee;
}

.mt-detail-page-main .property-card-image img{
    display:block;
    width:100%;
    height:100%;
    min-height:220px;
    object-fit:cover;
}

.mt-detail-page-main .property-card-image-empty{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#999;
    font-size:12px;
    font-weight:700;
}

.mt-detail-page-main .property-price{
    grid-column:2;
    margin:24px 26px 7px;
    padding:0;
    color:#e85a00;
    font-size:27px;
    line-height:1.3;
    font-weight:700;
}

.mt-detail-page-main .property-meta{
    grid-column:2;
    margin:0 26px 15px;
    padding:0;
    color:#555;
    font-size:13px;
    line-height:1.9;
}

.mt-detail-page-main .property-detail-button{
    grid-column:2;
    align-self:end;
    margin:0 26px 24px;
    padding:11px 16px;
    border:1px solid #e85a00;
    border-radius:3px;
    background:#fff;
    color:#e85a00;
    text-align:center;
    font-size:13px;
    line-height:1.4;
    font-weight:700;
}

.mt-detail-page-main .property-card-link:hover
.property-detail-button{
    background:#e85a00;
    color:#fff;
}


/* ----- FAQ ----- */

.mt-detail-page-main .faq{
    margin-top:4px;
    border-top:1px solid #ddd6ce;
}

.mt-detail-page-main .faq-item{
    padding:19px 0;
    border-bottom:1px solid #ddd6ce;
}

.mt-detail-page-main .faq-q{
    margin:0 0 9px;
    color:#3b332f;
    font-size:14px;
    line-height:1.7;
    font-weight:700;
}

.mt-detail-page-main .faq-a{
    margin:0;
    color:#666;
    font-size:13px;
    line-height:1.8;
}


/* ----- Responsive ----- */

@media screen and (max-width:900px){

    .mt-detail-page-main .content-box{
        margin:0 15px 24px;
        padding:22px 18px;
    }

    .mt-detail-page-main .property-card-link{
        display:block;
        min-height:0;
    }

    .mt-detail-page-main .property-card-image{
        width:100%;
        height:260px;
        min-height:0;
    }

    .mt-detail-page-main .property-card-image img{
        min-height:0;
    }

    .mt-detail-page-main .property-price{
        margin:20px 20px 7px;
    }

    .mt-detail-page-main .property-meta{
        margin:0 20px 15px;
    }

    .mt-detail-page-main .property-detail-button{
        margin:0 20px 20px;
    }
}



/* ============================================================
   DETAIL V2 / PHASE 3
   CTA DOUBLE DISPLAY + STRONG ACTION BUTTONS
   ============================================================ */

/*
 * CTA is intentionally displayed twice:
 * 1. immediately below Street View / Map
 * 2. after current sale listings
 */

.mt-detail-page-main .mt-final-cta-area{
    padding-top:42px;
    padding-bottom:42px;
}

.mt-detail-page-main .mt-final-cta-card{
    border-radius:7px;
}


/* ----- SELL / BLUE ACTION BUTTONS ----- */

.mt-detail-page-main .mt-final-cta-sell a,
.mt-detail-page-main .mt-final-cta-card:first-child .mt-final-cta-links a{
    display:block;
    box-sizing:border-box;
    width:100%;
    margin:9px 0 0;
    padding:12px 40px 12px 20px;
    border:0;
    border-radius:30px;
    background:#1597c5;
    color:#fff !important;
    text-align:center;
    text-decoration:none;
    font-weight:700;
    line-height:1.4;
    position:relative;
    transition:
        background-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.mt-detail-page-main .mt-final-cta-sell a::after,
.mt-detail-page-main .mt-final-cta-card:first-child .mt-final-cta-links a::after{
    content:"›";
    position:absolute;
    right:20px;
    top:50%;
    transform:translateY(-52%);
    color:#fff;
    font-size:20px;
    font-weight:700;
}

.mt-detail-page-main .mt-final-cta-sell a:hover,
.mt-detail-page-main .mt-final-cta-card:first-child .mt-final-cta-links a:hover{
    background:#087eab;
    box-shadow:0 4px 12px rgba(0,0,0,.14);
    transform:translateY(-1px);
}


/* ----- BUY / GREEN ACTION BUTTONS ----- */

.mt-detail-page-main .mt-final-cta-buy a,
.mt-detail-page-main .mt-final-cta-card:last-child .mt-final-cta-links a{
    display:block;
    box-sizing:border-box;
    width:100%;
    margin:9px 0 0;
    padding:12px 40px 12px 20px;
    border:0;
    border-radius:30px;
    background:#58a62b;
    color:#fff !important;
    text-align:center;
    text-decoration:none;
    font-weight:700;
    line-height:1.4;
    position:relative;
    transition:
        background-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.mt-detail-page-main .mt-final-cta-buy a::after,
.mt-detail-page-main .mt-final-cta-card:last-child .mt-final-cta-links a::after{
    content:"›";
    position:absolute;
    right:20px;
    top:50%;
    transform:translateY(-52%);
    color:#fff;
    font-size:20px;
    font-weight:700;
}

.mt-detail-page-main .mt-final-cta-buy a:hover,
.mt-detail-page-main .mt-final-cta-card:last-child .mt-final-cta-links a:hover{
    background:#438b1e;
    box-shadow:0 4px 12px rgba(0,0,0,.14);
    transform:translateY(-1px);
}


/*
 * "詳細を読む" is a subordinate text link.
 * Do not render it as a large CTA button.
 */

.mt-detail-page-main .mt-final-cta-more a,
.mt-detail-page-main .mt-final-cta-detail a{
    display:inline;
    width:auto;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:#555 !important;
    font-weight:400;
    box-shadow:none;
}

.mt-detail-page-main .mt-final-cta-more a::after,
.mt-detail-page-main .mt-final-cta-detail a::after{
    content:none;
}


/* ----- Mobile ----- */

@media screen and (max-width:900px){

    .mt-detail-page-main .mt-final-cta-area{
        padding-top:30px;
        padding-bottom:30px;
    }

    .mt-detail-page-main .mt-final-cta-sell a,
    .mt-detail-page-main .mt-final-cta-buy a,
    .mt-detail-page-main .mt-final-cta-card:first-child .mt-final-cta-links a,
    .mt-detail-page-main .mt-final-cta-card:last-child .mt-final-cta-links a{
        padding-top:11px;
        padding-bottom:11px;
    }
}



/* ============================================================
   DETAIL V2 / CTA BUTTON VISUAL FIX
   Both CTA areas
   ============================================================ */

/* CTA heading */
.mt-final-cta-area .mt-final-cta-title{
    font-size:24px !important;
    line-height:1.45 !important;
    font-weight:700 !important;
}

.mt-final-cta-area .mt-final-cta-lead{
    font-size:14px !important;
    line-height:1.7 !important;
    font-weight:700 !important;
}


/* White cards */
.mt-final-cta-area .mt-final-cta-card{
    padding:30px 34px 26px !important;
}

.mt-final-cta-area .mt-final-cta-card h3{
    margin-bottom:12px !important;
    font-size:20px !important;
    line-height:1.45 !important;
    font-weight:700 !important;
}

.mt-final-cta-area .mt-final-cta-card p{
    font-size:13px !important;
    line-height:1.8 !important;
}


/* ------------------------------------------------------------
   ACTION LINKS
   Existing CTA markup uses list links.
   Turn the first three links on the left card into blue buttons.
   ------------------------------------------------------------ */

.mt-final-cta-area
.mt-final-cta-card:first-child
li a{
    display:block !important;
    position:relative !important;
    box-sizing:border-box !important;

    width:100% !important;
    max-width:430px !important;

    margin:9px auto !important;
    padding:12px 42px 12px 22px !important;

    border:0 !important;
    border-radius:999px !important;

    background:#1598c8 !important;
    color:#fff !important;

    text-align:center !important;
    text-decoration:none !important;

    font-size:14px !important;
    line-height:1.45 !important;
    font-weight:700 !important;

    box-shadow:none !important;

    transition:
        background-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease !important;
}

.mt-final-cta-area
.mt-final-cta-card:first-child
li a::after{
    content:"›" !important;
    position:absolute !important;
    right:19px !important;
    top:50% !important;
    transform:translateY(-54%) !important;

    color:#fff !important;
    font-size:21px !important;
    line-height:1 !important;
    font-weight:700 !important;
}

.mt-final-cta-area
.mt-final-cta-card:first-child
li a:hover{
    background:#087eac !important;
    color:#fff !important;
    box-shadow:0 4px 12px rgba(0,0,0,.16) !important;
    transform:translateY(-1px) !important;
}


/* ------------------------------------------------------------
   Right card = green buttons
   ------------------------------------------------------------ */

.mt-final-cta-area
.mt-final-cta-card:last-child
li a{
    display:block !important;
    position:relative !important;
    box-sizing:border-box !important;

    width:100% !important;
    max-width:430px !important;

    margin:9px auto !important;
    padding:12px 42px 12px 22px !important;

    border:0 !important;
    border-radius:999px !important;

    background:#58a62b !important;
    color:#fff !important;

    text-align:center !important;
    text-decoration:none !important;

    font-size:14px !important;
    line-height:1.45 !important;
    font-weight:700 !important;

    box-shadow:none !important;

    transition:
        background-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease !important;
}

.mt-final-cta-area
.mt-final-cta-card:last-child
li a::after{
    content:"›" !important;
    position:absolute !important;
    right:19px !important;
    top:50% !important;
    transform:translateY(-54%) !important;

    color:#fff !important;
    font-size:21px !important;
    line-height:1 !important;
    font-weight:700 !important;
}

.mt-final-cta-area
.mt-final-cta-card:last-child
li a:hover{
    background:#438b1e !important;
    color:#fff !important;
    box-shadow:0 4px 12px rgba(0,0,0,.16) !important;
    transform:translateY(-1px) !important;
}


/* CTA icons */
.mt-final-cta-area .mt-final-cta-icon{
    font-size:36px !important;
    line-height:1.1 !important;
}


/* Mobile */
@media screen and (max-width:900px){

    .mt-final-cta-area .mt-final-cta-title{
        font-size:21px !important;
    }

    .mt-final-cta-area .mt-final-cta-card{
        padding:24px 18px 22px !important;
    }

    .mt-final-cta-area .mt-final-cta-card h3{
        font-size:18px !important;
    }

    .mt-final-cta-area
    .mt-final-cta-card li a{
        max-width:none !important;
        padding-top:11px !important;
        padding-bottom:11px !important;
        font-size:13px !important;
    }
}



/* ============================================================
   DETAIL V2 / CTA REAL MARKUP BUTTON FIX
   Actual markup = .mt-final-cta-link
   ============================================================ */

/* CTA全体の文字サイズ */
.mt-final-cta-area .mt-final-cta-lead{
    margin-bottom:24px !important;
    font-size:15px !important;
    line-height:1.8 !important;
    font-weight:700 !important;
}

.mt-final-cta-area .mt-final-cta-lead .name{
    font-size:23px !important;
    line-height:1.5 !important;
    font-weight:700 !important;
}

.mt-final-cta-area .mt-final-cta{
    padding:30px 34px 28px !important;
}

.mt-final-cta-area .mt-final-cta-icon{
    margin-bottom:10px !important;
    font-size:34px !important;
}

.mt-final-cta-area .mt-final-cta h2{
    margin:0 0 14px !important;
    font-size:20px !important;
    line-height:1.5 !important;
    font-weight:700 !important;
}

.mt-final-cta-area .mt-final-cta p{
    min-height:68px !important;
    margin:0 0 16px !important;
    font-size:14px !important;
    line-height:1.8 !important;
}


/* 共通ボタン */
.mt-final-cta-area .mt-final-cta-link{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    box-sizing:border-box !important;
    width:88% !important;
    min-height:44px !important;

    margin:9px auto !important;
    padding:10px 42px 10px 22px !important;

    border:0 !important;
    border-radius:999px !important;

    color:#fff !important;
    text-align:center !important;

    font-size:14px !important;
    line-height:1.4 !important;
    font-weight:700 !important;

    box-shadow:none !important;
}


/* 右端の矢印 */
.mt-final-cta-area .mt-final-cta-link::after{
    content:"›" !important;

    position:absolute !important;
    right:20px !important;
    top:50% !important;

    transform:translateY(-53%) !important;

    color:#fff !important;
    font-size:20px !important;
    line-height:1 !important;
    font-weight:700 !important;
}


/* 売却側 = BLUE */
.mt-final-cta-area .mt-final-cta.blue .mt-final-cta-link{
    background:#1598c8 !important;
    color:#fff !important;
}


/* 購入・リフォーム側 = GREEN */
.mt-final-cta-area .mt-final-cta.green .mt-final-cta-link{
    background:#58a62b !important;
    color:#fff !important;
}


/* Mobile */
@media screen and (max-width:900px){

    .mt-final-cta-area .mt-final-cta-lead .name{
        font-size:20px !important;
    }

    .mt-final-cta-area .mt-final-cta{
        padding:25px 18px 23px !important;
    }

    .mt-final-cta-area .mt-final-cta h2{
        font-size:18px !important;
    }

    .mt-final-cta-area .mt-final-cta p{
        min-height:0 !important;
        font-size:13px !important;
    }

    .mt-final-cta-area .mt-final-cta-link{
        width:100% !important;
        min-height:42px !important;
        font-size:13px !important;
    }
}



/* ============================================================
   DETAIL V2 / PHASE 4
   LOCAL ENVIRONMENT
   ============================================================ */

.mt-v2-local-environment{
    overflow:hidden;
}

.mt-v2-local-environment > h2{
    margin-bottom:26px !important;
}

.mt-v2-local-grid{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);
    gap:30px;
    align-items:stretch;
}

.mt-v2-local-copy{
    padding:4px 4px 4px 0;
}

.mt-v2-local-copy h3{
    position:relative;
    margin:0 0 20px;
    padding:0 0 13px;
    color:#3b332f;
    font-size:18px;
    line-height:1.6;
    font-weight:700;
    border-bottom:1px solid #ddd4ca;
}

.mt-v2-local-copy h3::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-1px;
    width:38px;
    height:2px;
    background:#ef6c00;
}

.mt-v2-local-copy .content-copy{
    margin:0;
    color:#555;
    font-size:14px;
    line-height:2;
}

.mt-v2-local-map{
    position:relative;
    min-height:330px;
    overflow:hidden;
    background:#eee;
    border:1px solid #ddd4ca;
    border-radius:5px;
}

.mt-v2-local-map iframe{
    display:block;
    width:100%;
    height:100%;
    min-height:330px;
    border:0;
}

@media (max-width:900px){

    .mt-v2-local-grid{
        grid-template-columns:1fr;
    }

    .mt-v2-local-map,
    .mt-v2-local-map iframe{
        min-height:300px;
    }
}


/* ============================================================
   DETAIL V2 / PHASE 5
   NEARBY FACILITIES
   ============================================================ */

.mt-v2-local-grid{
    grid-template-columns:1fr !important;
}

.mt-v2-local-copy{
    padding-bottom:8px;
}

.mt-v2-local-facilities{
    width:100%;
    margin-top:6px;
}

.mt-v2-facility-summary{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
    margin:0 0 18px;
}

.mt-v2-summary-card{
    box-sizing:border-box;
    min-height:118px;
    padding:17px 14px 14px;
    border:1px solid #ded6ce;
    border-radius:6px;
    background:#fff;
    text-align:center;
}

.mt-v2-summary-icon{
    margin-bottom:7px;
    color:#ed6b16;
    font-size:23px;
    line-height:1;
}

.mt-v2-summary-label{
    margin-bottom:6px;
    color:#3d3632;
    font-size:14px;
    font-weight:700;
}

.mt-v2-summary-value{
    color:#777;
    font-size:12px;
    line-height:1.45;
}

.mt-v2-summary-value strong{
    display:block;
    margin-bottom:3px;
    color:#e66410;
    font-size:18px;
    font-weight:700;
}

.mt-v2-summary-value small{
    display:block;
    color:#777;
    font-size:11px;
    line-height:1.5;
}

.mt-v2-facility-tabs{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    overflow:hidden;
    margin:0 0 13px;
    border:1px solid #ded6ce;
    border-radius:6px;
    background:#fff;
}

.mt-v2-facility-tab{
    appearance:none;
    -webkit-appearance:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    box-sizing:border-box;
    min-height:66px;
    margin:0;
    padding:8px 4px;
    border:0;
    border-right:1px solid #e8e0d8;
    border-radius:0;
    background:#fff;
    color:#625a55;
    cursor:pointer;
    font-family:inherit;
    font-size:12px;
    font-weight:700;
}

.mt-v2-facility-tab:last-child{
    border-right:0;
}

.mt-v2-facility-tab i{
    color:#ed6b16;
    font-size:18px;
}

.mt-v2-facility-tab:hover,
.mt-v2-facility-tab.active{
    background:#fff1e7;
    color:#d85c08;
}

.mt-v2-nearby-map{
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:400px;
    overflow:hidden;
    border:1px solid #ded6ce;
    border-radius:6px;
    background:#eee;
}

.mt-v2-nearby-map iframe{
    display:block;
    width:100%;
    height:100%;
    border:0;
}

.mt-v2-nearby-status{
    box-sizing:border-box;
    margin-top:8px;
    padding:8px 12px;
    border-radius:4px;
    background:#f7f4f1;
    color:#777;
    font-size:12px;
    line-height:1.5;
    text-align:right;
}

@media screen and (max-width:900px){

    .mt-v2-facility-summary{
        grid-template-columns:1fr;
    }

    .mt-v2-facility-tabs{
        grid-template-columns:repeat(3,1fr);
    }

    .mt-v2-facility-tab:nth-child(3){
        border-right:0;
    }

    .mt-v2-facility-tab:nth-child(-n+3){
        border-bottom:1px solid #e8e0d8;
    }

    .mt-v2-nearby-map{
        height:320px;
    }
}


/*
 * ============================================================
 * Mansion Detail V2 / Area Statistics
 * ============================================================
 */

.mt-area-statistics {
    margin-top: 32px;
}

.mt-area-statistics-heading {
    margin: 0 0 18px;
    padding: 12px 16px;
    background: #f5f5f5;
    border-left: 4px solid #222;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.6;
}

.mt-area-statistics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.mt-area-statistics-card {
    min-height: 150px;
    padding: 24px 20px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #fff;
    text-align: center;
    box-sizing: border-box;
}

.mt-area-statistics-label {
    margin-bottom: 12px;
    font-size: 15px;
    font-weight: 700;
}

.mt-area-statistics-value {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.25;
}

.mt-area-statistics-value span {
    margin-left: 4px;
    font-size: 16px;
    font-weight: 500;
}

.mt-area-statistics-date {
    margin-top: 10px;
    font-size: 13px;
    color: #666;
}

.mt-area-statistics-source {
    margin-top: 14px;
    font-size: 12px;
    line-height: 1.7;
    color: #777;
}

@media (max-width: 767px) {

    .mt-area-statistics {
        margin-top: 24px;
    }

    .mt-area-statistics-grid {
        grid-template-columns: 1fr;
    }

    .mt-area-statistics-card {
        min-height: auto;
        padding: 20px 16px;
    }

    .mt-area-statistics-value {
        font-size: 28px;
    }
}


/*
 * ============================================================
 * MT_MANSION_DETAIL_MOBILE_CTA_V1
 * Mansion detail / mobile fixed CTA + bottom sheet
 * ============================================================
 */

.mt-mobile-detail-cta,
.mt-mobile-detail-sheet,
.mt-mobile-detail-sheet-backdrop {
    display: none;
}

@media screen and (max-width: 767px) {

    body.mt-has-mobile-detail-cta {
        padding-bottom: calc(72px + env(safe-area-inset-bottom));
    }

    .mt-mobile-detail-cta {
        position: fixed;
        z-index: 9000;
        left: 0;
        right: 0;
        bottom: 0;

        display: flex;

        padding:
            8px
            8px
            calc(8px + env(safe-area-inset-bottom));

        gap: 6px;

        background: rgba(255,255,255,.97);
        border-top: 1px solid #ddd;
        box-shadow: 0 -4px 18px rgba(0,0,0,.14);

        transform: translateY(110%);
        opacity: 0;
        pointer-events: none;

        transition:
            transform .24s ease,
            opacity .24s ease;
    }

    .mt-mobile-detail-cta.is-visible {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }

    .mt-mobile-detail-cta button {
        appearance: none;
        -webkit-appearance: none;

        flex: 1 1 50%;
        min-width: 0;
        min-height: 52px;

        margin: 0;
        padding: 8px 7px;

        border: 0;
        border-radius: 7px;

        color: #fff;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.25;
        text-align: center;

        cursor: pointer;
    }

    .mt-mobile-detail-cta .is-sell {
        background: #1ea0cb;
    }

    .mt-mobile-detail-cta .is-buy {
        background: #4eaf28;
    }


    /*
     * Bottom sheet
     */

    .mt-mobile-detail-sheet-backdrop {
        position: fixed;
        z-index: 9090;
        inset: 0;

        display: block;

        background: rgba(0,0,0,.44);

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transition:
            opacity .22s ease,
            visibility .22s ease;
    }

    .mt-mobile-detail-sheet-backdrop.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .mt-mobile-detail-sheet {
        position: fixed;
        z-index: 9100;

        left: 0;
        right: 0;
        bottom: 0;

        display: block;

        padding:
            18px
            16px
            calc(20px + env(safe-area-inset-bottom));

        background: #fff;

        border-radius: 18px 18px 0 0;

        box-shadow: 0 -8px 28px rgba(0,0,0,.22);

        transform: translateY(110%);

        transition: transform .25s ease;
    }

    .mt-mobile-detail-sheet.is-open {
        transform: translateY(0);
    }

    .mt-mobile-detail-sheet-head {
        display: flex;
        align-items: center;
        justify-content: space-between;

        gap: 12px;

        margin-bottom: 14px;
    }

    .mt-mobile-detail-sheet-title {
        margin: 0;

        color: #222;
        font-size: 17px;
        font-weight: 700;
        line-height: 1.4;
    }

    .mt-mobile-detail-sheet-close {
        appearance: none;
        -webkit-appearance: none;

        width: 36px;
        height: 36px;
        flex: 0 0 36px;

        margin: 0;
        padding: 0;

        border: 0;
        border-radius: 50%;

        background: #f0efed;
        color: #333;

        font-size: 24px;
        line-height: 36px;
        text-align: center;

        cursor: pointer;
    }

    .mt-mobile-detail-sheet-menu {
        display: grid;
        gap: 9px;
    }

    .mt-mobile-detail-sheet-menu a {
        position: relative;

        display: block;

        padding: 14px 38px 14px 16px;

        border-radius: 7px;

        color: #fff !important;
        text-decoration: none !important;

        font-size: 14px;
        font-weight: 700;
        line-height: 1.35;
    }

    .mt-mobile-detail-sheet-menu a::after {
        content: "›";

        position: absolute;
        top: 50%;
        right: 15px;

        font-size: 24px;
        font-weight: 400;

        transform: translateY(-52%);
    }

    .mt-mobile-detail-sheet.is-sell
    .mt-mobile-detail-sheet-menu a {
        background: #1ea0cb;
    }

    .mt-mobile-detail-sheet.is-buy
    .mt-mobile-detail-sheet-menu a {
        background: #4eaf28;
    }


    /*
     * Existing page CTA:
     * mobile side is slightly compressed.
     */

    .mt-final-cta-area {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .mt-final-cta-area .mt-final-cta {
        padding-top: 22px !important;
        padding-bottom: 22px !important;
    }

    .mt-final-cta-area .mt-final-cta-icon {
        margin-bottom: 6px !important;
    }

    .mt-final-cta-area .mt-final-cta p {
        margin-bottom: 16px !important;
    }

}


/*
 * End MT_MANSION_DETAIL_MOBILE_CTA_V1
 */