/* 参考サイト風の3エリア構成。元のstyle.cssはそのまま残す。 */
html {scroll-behavior:smooth}
body.mrg-rails-demo {background:#081417;color:#fff;overflow-x:hidden}
.mrg-fixed-background {position:fixed;inset:0;z-index:0;background:linear-gradient(90deg,rgba(2,11,15,.76),rgba(2,11,15,.58)),url('../assets/images/mrg-city-original.png') center/cover no-repeat;filter:saturate(.85)}
.mrg-center-column {position:relative;z-index:2;width:min(480px,100%);margin:0 auto;background:#061016;min-height:100vh;box-shadow:0 0 55px rgba(0,0,0,.4)}
.mrg-side {position:fixed;z-index:3;top:0;bottom:0;width:calc((100vw - 480px)/2);display:flex;flex-direction:column;padding:clamp(20px,3vw,52px);pointer-events:none}
.mrg-side>* {pointer-events:auto}
.mrg-side-left {left:0;align-items:flex-start}
.mrg-side-right {right:0;justify-content:center}
.mrg-brand {font-size:clamp(28px,3.2vw,52px);font-weight:900;letter-spacing:.06em;line-height:1}
.mrg-brand span {display:block;font-size:10px;font-weight:500;letter-spacing:.26em;margin-top:12px;color:#c9ff45}
.mrg-side-message {font-size:clamp(17px,2vw,31px);font-weight:700;line-height:1.8;margin:auto 0}
.mrg-side-bottom,.mrg-side-note {font-size:10px;letter-spacing:.22em;color:#c9ff45}
.mrg-side-links {display:flex;flex-direction:column;width:100%}
.mrg-side-links a {color:white;text-decoration:none;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.24);font-size:clamp(11px,1vw,15px);letter-spacing:.05em}
.mrg-side-links a:hover,.mrg-side-links a:focus-visible {color:#c9ff45}
.mrg-side-links small {color:#c9ff45;font-size:10px;margin-right:12px}
.mrg-side-note {margin-top:36px;text-align:right}
.mrg-mobile-design {position:relative;line-height:0}
.mrg-mobile-design img {width:100%;height:auto;display:block}
.mrg-preview-entry {position:absolute;left:9%;width:82%;height:6%;top:66%;display:block}
/* 中央の既存LPも狭い画面に収まるようにする */
.mrg-center-column .container {width:calc(100% - 36px);max-width:100%;margin-left:auto;margin-right:auto}
.mrg-center-column .site-header {display:none}
.mrg-center-column .about-grid,.mrg-center-column .steps-grid,.mrg-center-column .feature-grid,.mrg-center-column .prize-grid,.mrg-center-column .schedule-grid,.mrg-center-column .entry-inner {grid-template-columns:1fr}
.mrg-center-column .section {padding-top:58px;padding-bottom:58px}
.mrg-center-column .section-title {font-size:clamp(24px,5vw,36px)}
.mrg-center-column .mobile-fixed-cta {display:none}
@media(max-width:1000px){.mrg-center-column {width:min(480px,100%)}.mrg-side {width:calc((100vw - min(480px,100vw))/2);padding:16px}.mrg-side-message {font-size:16px}.mrg-side-links a {font-size:10px;padding:10px 0}.mrg-side-links small {margin-right:3px}.mrg-brand {font-size:24px}.mrg-brand span {font-size:7px}}
@media(max-width:760px){.mrg-side {display:none}.mrg-center-column {width:100%;max-width:480px}.mrg-fixed-background {display:none}}

/* 君崎様への確認用：高解像度の未来都市イメージをそのまま使用 */
.mrg-fixed-background{background-image:url('../assets/images/mrg-city-original.png');background-size:cover;background-position:center center;filter:none}
.mrg-side{background:linear-gradient(90deg,rgba(2,10,17,.94),rgba(2,10,17,.82));backdrop-filter:blur(2px)}
.mrg-side-right{background:linear-gradient(270deg,rgba(2,10,17,.94),rgba(2,10,17,.82))}
.mrg-side-left{padding-top:clamp(35px,7vh,90px)}
.mrg-side-right{padding-top:clamp(35px,7vh,90px)}
.mrg-brand{color:#fff}.mrg-brand span{color:#fff;letter-spacing:.35em}
.mrg-side-message{font-family:Georgia,'Noto Serif JP',serif;font-weight:500;line-height:1.7;text-shadow:0 2px 18px #000}
.mrg-side-links a{letter-spacing:.16em}.mrg-side-links a:hover{color:#baff18}
.mrg-center-column{box-shadow:0 0 65px rgba(0,0,0,.85);border-left:1px solid rgba(255,255,255,.13);border-right:1px solid rgba(255,255,255,.13)}
.mrg-mobile-design img{display:block;width:100%}
@media(max-width:760px){.mrg-side{display:none}.mrg-fixed-background{display:none}}

/* 2026-10-25: actual browser layout, text-free city background */
.mrg-fixed-background {background: url('../assets/images/mrg-clean-city.jpg') center center / cover no-repeat fixed !important;filter:none!important}
.mrg-side {background:transparent!important;backdrop-filter:none!important;padding:clamp(25px,3.1vw,54px)!important}
.mrg-side-left {background:linear-gradient(90deg,rgba(1,8,15,.68),rgba(1,8,15,.10))!important}
.mrg-side-right {background:linear-gradient(270deg,rgba(1,8,15,.63),rgba(1,8,15,.12))!important;justify-content:center}
.mrg-brand {font-size:clamp(37px,3.6vw,62px)!important;letter-spacing:.07em;color:#fff!important}
.mrg-brand span {font-size:clamp(11px,1vw,16px)!important;letter-spacing:.23em!important;color:#fff!important;margin-top:10px!important}
.mrg-side-message {font-size:clamp(20px,2.35vw,40px)!important;line-height:1.65!important;max-width:410px;text-shadow:0 2px 12px #061018}
.mrg-side-links {width:min(100%,310px);margin-left:auto;margin-right:auto;background:rgba(2,10,17,.20);padding:15px 12px}
.mrg-side-links a {font-size:clamp(13px,1.16vw,18px)!important;padding:17px 2px!important;letter-spacing:.09em!important}
.mrg-side-links small {font-size:12px!important;margin-right:18px!important}
.mrg-side-note {text-align:center!important;color:#c7ff40}
.mrg-center-column {width:min(410px,100%)!important;box-shadow:0 0 28px rgba(0,0,0,.62)!important}
.mrg-side {width:calc((100vw - 410px)/2)!important}
.mrg-mobile-design img {filter:none!important}
@media(max-width:760px){.mrg-side{display:none!important}.mrg-fixed-background{display:none!important}.mrg-center-column{width:100%!important}}

/* 2026-10-25: 承認済みの文字なし近未来都市背景 + PC中央LP幅拡張 */
@media (min-width: 761px) {
  .mrg-fixed-background {
    background: url('../assets/images/mrg-approved-city.png') center center / cover no-repeat fixed !important;
    filter: none !important;
  }
  .mrg-center-column {
    width: 520px !important;
    max-width: 520px !important;
  }
  .mrg-side {
    width: calc((100vw - 520px) / 2) !important;
  }
}
@media (max-width: 760px) {
  .mrg-center-column {
    width: 100% !important;
    max-width: 480px !important;
  }
}

/* Approved city background: subtle darkening for central LP emphasis */
@media (min-width: 761px) {
  .mrg-fixed-background::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(3, 10, 20, 0.29);
    pointer-events: none;
  }
}

/* 2026-10-25: background-only darkening; bring left logo and heading closer */
@media (min-width: 761px) {
 .mrg-fixed-background {background-image:linear-gradient(rgba(3,9,18,.20),rgba(3,9,18,.20)),url('../assets/images/mrg-approved-city.png') !important;}
 .mrg-side-left {justify-content:flex-start !important;}
 .mrg-side-left .mrg-side-message {margin:clamp(36px,6vh,76px) 0 0 !important;}
 .mrg-side-left .mrg-side-bottom {margin-top:auto !important;}
}


/* 2026-10-25: 左側ロゴ＋見出しを一体として画面の縦中央へ */
@media (min-width: 761px) {
  .mrg-side-left .mrg-left-center-group {
    position: absolute;
    top: 50%;
    left: clamp(25px,3.1vw,54px);
    right: clamp(25px,3.1vw,54px);
    transform: translateY(-50%);
  }
  .mrg-side-left .mrg-left-center-group .mrg-side-message {
    margin: clamp(36px,6vh,76px) 0 0 !important;
  }
}

/* PC/SP FV artwork: switch only image, preserve approved layout */
.mrg-mobile-design picture{display:block;width:100%}
.mrg-mobile-design picture img{display:block;width:100%;height:auto}

/* Approved: transparent button-green overlay over the fixed desktop city only. */
@media (min-width:761px) {
  .mrg-fixed-background::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: rgba(28, 65, 22, .45) !important;
    pointer-events: none !important;
  }
}
