header{display: none;} body{padding: 0px;} /* -------------------------------------------------------------------------- 0. WordPress テーマリセット（このLPのページだけに効く） -------------------------------------------------------------------------- */ /* ページタイトルの h1 を隠す（LP内のロゴの h1 .l-header-logo は除く） */ .lout-grid:has(#custom-lp-wrapper.lp-39) h1:not(.l-header-logo) { display: none; border-bottom: none; } .lout-grid:has(#custom-lp-wrapper.lp-39) h1:not(.l-header-logo):after { content: none; } /* ここから下のテーマ調整は、すべて「このLPを含むページ」だけに効く（他の固定ページ・他のLPには効かない） */ .lout-grid:has(#custom-lp-wrapper.lp-39), .lout-contents:has(#custom-lp-wrapper.lp-39), .mod-page-section:has(#custom-lp-wrapper.lp-39) { width: 100%; max-width: none; padding-left: 0; padding-right: 0; } /* テーマ共通の下部固定ナビ（資料請求／見学会情報／ご来店予約）は、LPの追従CTAと重なるので、このLPのページだけ隠す。 元ページ（/39campaign）にも出ていない。残したい場合はこの1行を消す */ body:has(#custom-lp-wrapper.lp-39) .lout-followmenu { display: none; } /* -------------------------------------------------------------------------- 1. テーマのスタイルを持ち込まないための下地（元ページのCSSより先に置き、元ページのクラス指定が勝つ） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39 { overflow-x: clip; text-align: left; } #custom-lp-wrapper.lp-39 p:empty { display: none !important; } /* class の無い

＝ WordPress が生成したもの（LP内の

にはすべて class を付けている） */ #custom-lp-wrapper.lp-39 p:not([class]):not(:has(*)) { display: none !important; } #custom-lp-wrapper.lp-39 :is(h1, h2, h3, h4, h5, h6) { visibility: visible !important; border: 0; font-family: inherit; font-weight: bold; color: inherit; line-height: inherit; text-align: inherit; } #custom-lp-wrapper.lp-39 :is(h1, h2, h3, h4, h5, h6, li)::before, #custom-lp-wrapper.lp-39 :is(h1, h2, h3, h4, h5, h6, li)::after { content: none; } #custom-lp-wrapper.lp-39 :is(p, li, dl, dt, dd, span, a, small) { font-family: inherit; color: inherit; line-height: inherit; text-align: inherit; } #custom-lp-wrapper.lp-39 :is(ul, ol, li) { list-style: none; } #custom-lp-wrapper.lp-39 img { border: 0; box-shadow: none; border-radius: 0; } /* -------------------------------------------------------------------------- 2. 元ページのCSS（39campaign.css から移植） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39 { --mh--breakpoint--min: 375px; --mh--breakpoint--sm: 640px; --mh--breakpoint--md: 768px; --mh--breakpoint--lg: 1180px; --mh--breakpoint--x2l: 1400px; } #custom-lp-wrapper.lp-39 { --mh--font-family--base: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", meiryo, sans-serif; --mh--font-family--en: "Inter", sans-serif; } #custom-lp-wrapper.lp-39 { --mh--font-size--x3s: 12px; --mh--font-size--x2s: 13px; --mh--font-size--xs: 14px; --mh--font-size--sm: 15px; --mh--font-size--md: 16px; --mh--font-size--lg: 17px; --mh--font-size--xl: 18px; --mh--font-size--x2l: 20px; --mh--font-size--x3l: 21px; --mh--font-size--x4l: 22px; --mh--font-size--x5l: 24px; --mh--font-size--x6l: 26px; --mh--font-size--x7l: 27px; --mh--font-size--x8l: 29px; --mh--font-size--x9l: 31px; --mh--font-size--x10l: 34px; --mh--font-size--x11l: 36px; --mh--font-size--x12l: 39px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 { --mh--font-size--lg: 18px; --mh--font-size--xl: 20px; --mh--font-size--x2l: 23px; --mh--font-size--x3l: 26px; --mh--font-size--x4l: 29px; --mh--font-size--x5l: 32px; --mh--font-size--x6l: 36px; --mh--font-size--x7l: 41px; --mh--font-size--x8l: 46px; --mh--font-size--x9l: 52px; --mh--font-size--x10l: 58px; --mh--font-size--x11l: 66px; --mh--font-size--x12l: 74px; } } #custom-lp-wrapper.lp-39 { --mh--letter-spacing--sm: -0.03em; --mh--letter-spacing--md: 0.04em; } #custom-lp-wrapper.lp-39 { --mh--line-height--none: 1; --mh--line-height--xs: 1.1; --mh--line-height--sm: 1.5; --mh--line-height--md: 1.7; --mh--line-height--lg: 2; } #custom-lp-wrapper.lp-39 { --mh--header--height: 70px; } @media (min-width: 1180px) { #custom-lp-wrapper.lp-39 { --mh--header--height: 120px; } } #custom-lp-wrapper.lp-39 { --mh--sidebar--width: 240px; } #custom-lp-wrapper.lp-39 { --mh--contents--width: 1100px; --mh--contents--wide-width: 1400px; --mh--contents--padding--side: 20px; --mh--contents--width-with-padding: calc( var(--mh--contents--width) + var(--mh--contents--padding--side) * 2 ); --mh--contents--wide-width-with-padding: calc( var(--mh--contents--wide-width) + var(--mh--contents--padding--side) * 2 ); } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 { --mh--contents--padding--side: 40px; } } #custom-lp-wrapper.lp-39 { --mh--color--primary-100: rgb(230 248 255); --mh--color--primary-400: rgb(30 155 201); --mh--color--primary-500: rgb(43 89 177); --mh--color--secondary-500: rgb(254 245 98); --mh--color--grayscale-100: rgb(255 255 255); --mh--color--grayscale-200: rgb(242 242 242); --mh--color--grayscale-500: rgb(204 204 204); --mh--color--grayscale-800: rgb(136 136 136); --mh--color--grayscale-900: rgb(0 0 0); } #custom-lp-wrapper.lp-39 { --mh--easing: ease; --mh--duration: 0.45s; } @keyframes cp39-flowing-left { 0% { transform: translateX(0px); } 100% { transform: translateX(-100%); } } #custom-lp-wrapper.lp-39 { --mh--space--10-10: 10px; --mh--space--10-15: 10px; --mh--space--10-30: 10px; --mh--space--10-40: 10px; --mh--space--10-60: 10px; --mh--space--15-15: 15px; --mh--space--15-20: 15px; --mh--space--20-120: 20px; --mh--space--20-15: 20px; --mh--space--20-20: 20px; --mh--space--20-30: 20px; --mh--space--20-50: 20px; --mh--space--20-60: 20px; --mh--space--20-80: 20px; --mh--space--25-25: 25px; --mh--space--25-30: 25px; --mh--space--25-60: 25px; --mh--space--25-70: 25px; --mh--space--25-80: 25px; --mh--space--30-30: 30px; --mh--space--30-40: 30px; --mh--space--30-50: 30px; --mh--space--30-80: 30px; --mh--space--40-100: 40px; --mh--space--40-120: 40px; --mh--space--40-60: 40px; --mh--space--60-100: 60px; --mh--space--60-160: 60px; --mh--space--x5s: 2px; --mh--space--x4s: 5px; --mh--space--x3s: 10px; --mh--space--x2s: 15px; --mh--space--xs: 20px; --mh--space--sm: 30px; --mh--space--md: 40px; --mh--space--lg: 50px; --mh--space--xl: 60px; --mh--space--x2l: 70px; --mh--space--x3l: 80px; --mh--space--x4l: 90px; --mh--space--x5l: 100px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 { --mh--space--10-15: 15px; --mh--space--10-30: 30px; --mh--space--10-40: 40px; --mh--space--10-60: 60px; --mh--space--15-20: 20px; --mh--space--20-120: 120px; --mh--space--20-15: 15px; --mh--space--20-30: 30px; --mh--space--20-50: 50px; --mh--space--20-60: 60px; --mh--space--20-80: 80px; --mh--space--25-25: 25px; --mh--space--25-30: 30px; --mh--space--25-60: 60px; --mh--space--25-70: 70px; --mh--space--25-80: 80px; --mh--space--30-30: 30px; --mh--space--30-40: 40px; --mh--space--30-50: 50px; --mh--space--30-80: 80px; --mh--space--40-100: 100px; --mh--space--40-120: 120px; --mh--space--40-60: 60px; --mh--space--60-100: 100px; --mh--space--60-160: 160px; --mh--space--x5s: 4px; --mh--space--x4s: 10px; --mh--space--x3s: 20px; --mh--space--x2s: 30px; --mh--space--xs: 40px; --mh--space--sm: 60px; --mh--space--md: 80px; --mh--space--lg: 100px; --mh--space--xl: 120px; --mh--space--x2l: 140px; --mh--space--x3l: 160px; --mh--space--x4l: 180px; --mh--space--x5l: 200px; } } #custom-lp-wrapper.lp-39 { --border-radius-sm: 2px; --border-radius-md: 5px; --border-radius-lg: 8px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 { --border-radius-sm: 4px; --border-radius-md: 12px; --border-radius-lg: 20px; } } #custom-lp-wrapper.lp-39 * { box-sizing: border-box; padding: 0px; margin: 0px; font-size: 100%; vertical-align: baseline; background: transparent; } #custom-lp-wrapper.lp-39 ::before, #custom-lp-wrapper.lp-39 ::after { box-sizing: border-box; } #custom-lp-wrapper.lp-39 :focus-visible { outline: solid 2px; } #custom-lp-wrapper.lp-39 { -webkit-font-smoothing: antialiased; text-rendering: optimizespeed; } #custom-lp-wrapper.lp-39 img, #custom-lp-wrapper.lp-39 video, #custom-lp-wrapper.lp-39 canvas, #custom-lp-wrapper.lp-39 audio, #custom-lp-wrapper.lp-39 iframe, #custom-lp-wrapper.lp-39 embed, #custom-lp-wrapper.lp-39 object { display: block; } #custom-lp-wrapper.lp-39 img, #custom-lp-wrapper.lp-39 svg, #custom-lp-wrapper.lp-39 video { max-inline-size: 100%; block-size: auto; } #custom-lp-wrapper.lp-39 svg { fill: currentcolor; stroke: none; } #custom-lp-wrapper.lp-39 p, #custom-lp-wrapper.lp-39 h1, #custom-lp-wrapper.lp-39 h2, #custom-lp-wrapper.lp-39 h3, #custom-lp-wrapper.lp-39 h4, #custom-lp-wrapper.lp-39 h5, #custom-lp-wrapper.lp-39 h6 { word-break: break-word; overflow-wrap: break-word; line-break: strict; } #custom-lp-wrapper.lp-39 ul, #custom-lp-wrapper.lp-39 ol { list-style: none; } #custom-lp-wrapper.lp-39 a[class] { text-decoration: none; } #custom-lp-wrapper.lp-39 a[href], #custom-lp-wrapper.lp-39 area, #custom-lp-wrapper.lp-39 button, #custom-lp-wrapper.lp-39 input, #custom-lp-wrapper.lp-39 label[for], #custom-lp-wrapper.lp-39 select, #custom-lp-wrapper.lp-39 summary, #custom-lp-wrapper.lp-39 textarea, #custom-lp-wrapper.lp-39 [tabindex]:not([tabindex*="-"]) { touch-action: manipulation; cursor: pointer; } #custom-lp-wrapper.lp-39 { font-family: var(--mh--font-family--base); font-size: var(--mh--font-size--md); line-height: var(--mh--line-height--md); color: var(--mh--color--grayscale-900); text-size-adjust: 100%; } @media (min-width: 768px) and (hover: none) { #custom-lp-wrapper.lp-39 { text-size-adjust: none; } } #custom-lp-wrapper.lp-39 * { letter-spacing: var(--mh--letter-spacing--md); } #custom-lp-wrapper.lp-39 a { color: inherit; } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 a:hover { text-decoration: none; } } #custom-lp-wrapper.lp-39 .l-wrapper { position: relative; padding-bottom: env(safe-area-inset-bottom); } #custom-lp-wrapper.lp-39 .c-bg01 { position: relative; } #custom-lp-wrapper.lp-39 .c-bg01.is-img-relative .c-bg01__img { position: unset; } #custom-lp-wrapper.lp-39 .c-bg01.is-img-relative .c-bg01__img img { height: auto; object-fit: unset; } #custom-lp-wrapper.lp-39 .c-bg01.is-img-relative .c-bg01__inner { position: absolute; inset: 0px; } #custom-lp-wrapper.lp-39 .c-bg01__img { position: absolute; inset: 0px; } #custom-lp-wrapper.lp-39 .c-bg01__img img { width: 100%; height: 100%; object-fit: cover; } #custom-lp-wrapper.lp-39 .c-bg01__inner { position: relative; } #custom-lp-wrapper.lp-39 .c-bg02::before { content: ""; position: fixed; top: 0px; left: 0px; width: 100%; height: 100vh; background-image: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg01_sp.png"); background-size: cover; background-position: center top; z-index: -1; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .c-bg02::before { background-image: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg01_pc.png"); } } #custom-lp-wrapper.lp-39 .c-btn01__link, #custom-lp-wrapper.lp-39 .c-btn01__in { position: relative; } #custom-lp-wrapper.lp-39 .c-btn01__link { display: block; background-color: rgb(255, 89, 0); box-shadow: 0 var(--mh--space--x4s) 0 0 rgb(199, 86, 20); border-radius: 100vmax; color: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .c-btn01__link:focus-visible { outline-color: var(--mh--color--grayscale-900); } #custom-lp-wrapper.lp-39 .c-btn01__ico-wrap { position: absolute; top: 50%; transform: translateY(-50%); aspect-ratio: 1 / 1; border-radius: 50%; color: rgb(255, 89, 0); } @media (hover: hover) and (pointer: fine) { #custom-lp-wrapper.lp-39 .c-btn01__link { transition: background-color var(--mh--duration) var(--mh--easing); } #custom-lp-wrapper.lp-39 .c-btn01__link:hover { background-color: rgb(255, 123, 0); } } #custom-lp-wrapper.lp-39 .c-cta01__box { position: relative; margin-top: -23px; padding: 37px 17px 42px; border: 3px solid var(--mh--color--grayscale-900); overflow: visible !important; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub { display: flex; justify-content: center; align-items: center; column-gap: 6px; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub-max { writing-mode: vertical-rl; border: 2px solid rgb(43, 89, 177); font-size: 16px; border-radius: 60px; padding: 10px 0px; display: inline-block; font-weight: 600; letter-spacing: 0.1em; transform: translateY(1px); } #custom-lp-wrapper.lp-39 .c-cta01__head-sub-txt { margin-bottom: -0.25em; } #custom-lp-wrapper.lp-39 .c-cta01__head-first-txt { padding-left: 0.25em; line-height: 1.25; letter-spacing: 0.25em; } #custom-lp-wrapper.lp-39 .c-cta01__head-main { text-align: center; } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 .c-cta01__head { display: grid; justify-content: center; align-items: center; grid-template-rows: repeat(2, auto); grid-template-columns: 75px max-content; padding-inline: 8px; gap: 3px 5px; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub { grid-area: 1 / 1 / 2 / 3; margin-inline: -8px; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub-en { font-size: 61px; } #custom-lp-wrapper.lp-39 .c-cta01__head-first { font-size: 14px; } #custom-lp-wrapper.lp-39 .c-cta01__head-main { line-height: 1.3 !important; } } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .c-cta01__box { margin-top: -39px; padding: 65px 0px 75px; border-width: 5px; overflow: visible !important; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub { column-gap: 16px; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub-en { font-size: 145px; } #custom-lp-wrapper.lp-39 .c-cta01__head-sub-max { font-size: 26px; padding: 15px 1px 15px 0px; border-width: 3px; transform: translateY(4px); } #custom-lp-wrapper.lp-39 .c-cta01__head-sub-txt { margin-bottom: -0.6em; } #custom-lp-wrapper.lp-39 .c-cta01__head-first { position: absolute; top: -35px; left: -45px; width: 150px; aspect-ratio: 1 / 1; } #custom-lp-wrapper.lp-39 .c-cta01__head-first-txt { font-size: 29px; } #custom-lp-wrapper.lp-39 .c-cta01__head-main { margin-top: -3px; } } #custom-lp-wrapper.lp-39 .c-cta01-limited { margin-top: 18px; padding-top: 12px; position: relative; } #custom-lp-wrapper.lp-39 .c-cta01-limited::before { content: ""; position: absolute; top: 0px; left: 0px; bottom: auto; display: block; width: 100%; height: 3px; background: var(--mh--color--grayscale-900); mask-image: url("data:image/svg+xml;utf8,%3Csvg%20width%3D%228%22%20height%3D%223%22%20viewBox%3D%220%200%208%203%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M3.03251%201.5C3.03251%200.671702%202.36479%200.000208892%201.5415%200H1.49102C0.667552%200%200%200.671573%200%201.5C0%202.32843%200.667552%203%201.49102%203H1.5415C2.36479%202.99979%203.03251%202.3283%203.03251%201.5Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); mask-repeat: repeat-x; } #custom-lp-wrapper.lp-39 .c-cta01-limited__content { padding-bottom: 13px; position: relative; } #custom-lp-wrapper.lp-39 .c-cta01-limited__content::before { content: ""; position: absolute; top: auto; left: 0px; bottom: 0px; display: block; width: 100%; height: 3px; background: var(--mh--color--grayscale-900); mask-image: url("data:image/svg+xml;utf8,%3Csvg%20width%3D%228%22%20height%3D%223%22%20viewBox%3D%220%200%208%203%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M3.03251%201.5C3.03251%200.671702%202.36479%200.000208892%201.5415%200H1.49102C0.667552%200%200%200.671573%200%201.5C0%202.32843%200.667552%203%201.49102%203H1.5415C2.36479%202.99979%203.03251%202.3283%203.03251%201.5Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); mask-repeat: repeat-x; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .c-cta01-limited { position: relative; display: flex; column-gap: 30px; width: max-content; max-width: 100%; margin-inline: auto; padding: 15px 15px 0px; } #custom-lp-wrapper.lp-39 .c-cta01-limited__head { width: max-content; } #custom-lp-wrapper.lp-39 .c-cta01-limited__content { position: static; flex: 1 1 0%; padding-bottom: 15px; } } #custom-lp-wrapper.lp-39 .c-cta01-btn { position: relative; margin: calc(var(--mh--space--xs) - 2px) auto 0; z-index: 2; } #custom-lp-wrapper.lp-39 .c-cta01-btn__img { position: absolute; top: -4px; left: -12px; width: 76px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__in { padding: 20px 44px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__txt { font-size: 21px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__ico-wrap { right: 20px; width: 24px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .c-cta01-btn { max-width: 600px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__img { top: -24px; left: -33px; width: 157px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__in { padding-block: 30px 35px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__txt { font-size: 36px; } #custom-lp-wrapper.lp-39 .c-cta01-btn__ico-wrap { right: 30px; width: 50px; } } #custom-lp-wrapper.lp-39 .c-head01 { position: relative; width: max-content; margin-inline: auto; -webkit-text-stroke-width: 9px; -webkit-text-stroke-color: var(--mh--color--grayscale-100); paint-order: stroke; z-index: 2; } #custom-lp-wrapper.lp-39 .c-head01::before, #custom-lp-wrapper.lp-39 .c-head01::after { content: ""; position: absolute; top: 8px; display: block; width: 9px; height: 88px; background-color: currentcolor; border: 3px solid var(--mh--color--grayscale-100); border-radius: 100vmax; } #custom-lp-wrapper.lp-39 .c-head01::before { left: -48px; transform: rotate(-20deg); transform-origin: 0px 0px; } #custom-lp-wrapper.lp-39 .c-head01::after { right: -48px; transform: rotate(20deg); transform-origin: right 0px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .c-head01::before, #custom-lp-wrapper.lp-39 .c-head01::after { top: 4px; width: 16px; height: 79px; border: 6px solid var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .c-head01::before { left: -45px; transform: rotate(-25deg); } #custom-lp-wrapper.lp-39 .c-head01::after { right: -45px; transform: rotate(25deg); } } #custom-lp-wrapper.lp-39 .c-ico { display: inline-block; vertical-align: baseline; } #custom-lp-wrapper.lp-39 .c-ico.is-blank01 { line-height: 0; } #custom-lp-wrapper.lp-39 .c-ico.is-blank01::after { display: inline-block; width: var(--mh--space--x3s); height: var(--mh--space--x3s); color: currentcolor; content: ""; background-color: currentcolor; mask-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M13.3333%206.66667V18.3333H1.66667V6.66667H13.3333ZM15%205H0V20H15V5Z%22%20fill%3D%22%23FF5900%22%2F%3E%20%3Cpath%20d%3D%22M20%200V15H13.3333V13.3333H18.3333V1.66667H6.66667V6.66667H5V0H20Z%22%20fill%3D%22%23FF5900%22%2F%3E%3C%2Fsvg%3E"); mask-repeat: no-repeat; mask-position: center center; mask-size: contain; } #custom-lp-wrapper.lp-39 .c-img02 { width: 100%; height: auto; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .c-img02-md-up { width: 100%; height: auto; } } #custom-lp-wrapper.lp-39 .c-simple-list01 { display: grid; row-gap: 8px; } #custom-lp-wrapper.lp-39 .c-simple-list01__item { position: relative; padding-left: 13px; font-size: var(--mh--font-size--md); } #custom-lp-wrapper.lp-39 .c-simple-list01__item::before { position: absolute; top: calc((1em * var(--mh--line-height--sm) - 4px) / 2 + 1px); left: 0px; width: 4px; aspect-ratio: 1 / 1; content: ""; background-color: rgb(255, 89, 0); border-radius: 50%; } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 .c-simple-list01__item { margin-right: -0.25em; } } #custom-lp-wrapper.lp-39 .c-note01 { position: relative; padding-left: calc(1em + 5px); line-height: var(--mh--line-height--sm); } #custom-lp-wrapper.lp-39 .c-note01::before { content: "※"; position: absolute; top: 0px; left: 0px; display: block; width: 1em; height: calc(1em * var(--mh--font-size--sm)); } #custom-lp-wrapper.lp-39 .c-sticky-cta01 { overflow: hidden; position: fixed; left: 0px; bottom: 0px; width: 100%; height: 70px; z-index: 8; transition: opacity var(--mh--duration) var(--mh--easing), transform var(--mh--duration) var(--mh--easing); } #custom-lp-wrapper.lp-39 .c-sticky-cta01::before { content: ""; position: absolute; top: 0px; left: 0px; display: block; width: 100%; height: 2px; background-color: var(--mh--color--primary-500); } #custom-lp-wrapper.lp-39 .c-sticky-cta01__inner, #custom-lp-wrapper.lp-39 .c-sticky-cta01__main, #custom-lp-wrapper.lp-39 .c-sticky-cta01__value { display: flex; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__inner, #custom-lp-wrapper.lp-39 .c-sticky-cta01__main { align-items: center; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__inner { justify-content: center; height: 100%; padding-block: 10px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__main { flex: 1 1 0%; max-width: max-content; column-gap: 10px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__first { width: 50px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__first-txt { padding-left: 0.23em; font-size: 11px; line-height: 1.25; letter-spacing: 0.23em; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__wrap { position: relative; flex: 1 1 0%; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value { align-items: flex-end; column-gap: 3px; position: relative; z-index: 1; padding-bottom: 3px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value-max { writing-mode: vertical-rl; border: 1px solid rgb(43, 89, 177); font-size: 10px; border-radius: 60px; padding: 3px 0px; display: inline-block; font-weight: 600; transform: translateY(1px); } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value-en { font-size: 23px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value-txt { padding-bottom: 0.143em; font-size: 14px; line-height: 1.2; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__txt { margin-right: -0.25em; font-size: 13px; line-height: 1.2; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__img { position: absolute; top: -16px; right: 3px; line-height: 0; width: 43px; } @media (max-width: 1179.98px) { #custom-lp-wrapper.lp-39 .c-sticky-cta01__inner { column-gap: 10px; padding-inline: 10px !important; } } @media (min-width: 1180px) { #custom-lp-wrapper.lp-39 .c-sticky-cta01 { min-width: var(--mh--contents--width-with-padding); height: 150px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01::before { height: 4px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__reserve { position: relative; width: 186px; font-size: 21px; line-height: 1.4; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__reserve::before, #custom-lp-wrapper.lp-39 .c-sticky-cta01__reserve::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); display: block; width: 10px; height: 12px; clip-path: polygon(0px 0px, 0% 100%, 100% 50%); background-color: var(--mh--color--primary-500); } #custom-lp-wrapper.lp-39 .c-sticky-cta01__reserve::before { right: 38px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__reserve::after { right: 24px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__inner { padding-block: 22px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__main { padding-right: 30px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__first { width: 105px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__first-txt { font-size: 21px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value { column-gap: 7px; padding-bottom: 0px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value-max { border-width: 3px; font-size: 16px; padding: 10px 0px; transform: translateY(-7px); letter-spacing: 0.1em; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value-en { font-size: 68px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__value-txt { padding-bottom: 0.306em; font-size: 36px; line-height: 1.2; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__txt { margin-top: -0.219em; font-size: 32px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01__img { top: -20px; right: -13px; width: 97px; } } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn { width: 123px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__in { display: flex; align-items: center; padding: 7px 34px 7px 25px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__txt { font-size: 14px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__ico-wrap { right: 18px; width: 16px; } @media (max-width: 1179.98px) { #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__ico::after { width: 6px !important; height: 6px !important; } } @media (min-width: 1180px) { #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn { width: 370px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__link { box-shadow: rgb(199, 86, 20) 0px 7px 0px 0px !important; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__in { justify-content: center; padding: 26px 64px 26px 51px; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__txt { font-size: var(--mh--font-size--x2l); } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__ico::after { width: 16px !important; height: 16px !important; } #custom-lp-wrapper.lp-39 .c-sticky-cta01-btn__ico-wrap { right: 22px; width: 42px; } } #custom-lp-wrapper.lp-39 .l-footer { position: relative; } #custom-lp-wrapper.lp-39 .l-footer__bg { background: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .l-footer-cta { background-position: center center; background-size: cover !important; } #custom-lp-wrapper.lp-39 .l-footer-cta__inner { padding-block: 55px 70px; } #custom-lp-wrapper.lp-39 .l-footer-cta__content { position: relative; } #custom-lp-wrapper.lp-39 .l-footer-cta__img { position: absolute; left: 50%; bottom: -51px; transform: translateX(-50%); width: 144px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-footer-cta__inner { padding-block: 120px; } #custom-lp-wrapper.lp-39 .l-footer-cta__img { width: 1157px; bottom: -68px; } } #custom-lp-wrapper.lp-39 .l-footer-logo { width: 149px; margin-inline: auto; line-height: 0; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-footer-logo { width: 228px; } } #custom-lp-wrapper.lp-39 .l-footer-cr__txt { font-size: inherit; } #custom-lp-wrapper.lp-39 .l-footer-official { border-top: 1px solid var(--mh--color--grayscale-500); } #custom-lp-wrapper.lp-39 .l-footer-official__link { display: block; background-color: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .l-footer-official__in { display: flex; justify-content: center; align-items: center; column-gap: 10px; padding-block: 34px 35px; } #custom-lp-wrapper.lp-39 .l-footer-official__ico-wrap { width: 30px; aspect-ratio: 1 / 1; background-color: var(--mh--color--primary-500); border: 1px solid var(--mh--color--primary-500); border-radius: 50%; color: var(--mh--color--grayscale-100); line-height: 0; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-footer-official__in { column-gap: 14px; } #custom-lp-wrapper.lp-39 .l-footer-official__ico::after { width: 10px !important; height: 10px !important; } #custom-lp-wrapper.lp-39 .l-footer-official__link { transition: background-color var(--mh--duration) var(--mh--easing); } #custom-lp-wrapper.lp-39 .l-footer-official__link:hover { background-color: var(--mh--color--primary-100); } #custom-lp-wrapper.lp-39 .l-footer-official__link:hover .l-footer-official__ico-wrap { background-color: var(--mh--color--grayscale-100); color: var(--mh--color--primary-500); } #custom-lp-wrapper.lp-39 .l-footer-official__ico-wrap { transition: background-color var(--mh--duration) var(--mh--easing), color var(--mh--duration) var(--mh--easing); } } #custom-lp-wrapper.lp-39 .l-header { position: absolute; top: 0px; left: 0px; z-index: 10; width: 100%; min-width: 320px; } #custom-lp-wrapper.lp-39 .l-header__inner { padding: 19px 10px 0px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-header { min-width: var(--mh--contents--width-with-padding); } } @media (min-width: 768px) and (hover: none) { #custom-lp-wrapper.lp-39 .l-header { left: 0px !important; } } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-header__inner { max-width: 1920px; margin-inline: auto; padding: 25px 25px 0px; } } #custom-lp-wrapper.lp-39 .l-header-logo { width: 74px; line-height: 0; margin: 0px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-header-logo { width: 147px; } } #custom-lp-wrapper.lp-39 .l-main-img { overflow: hidden; background-position: center center; background-size: cover !important; } #custom-lp-wrapper.lp-39 .l-main-img__inner { position: relative; padding-block: 14.6% 1.6%; } #custom-lp-wrapper.lp-39 .l-main-img__slider { position: absolute; left: 0px; bottom: 37.89%; display: flex; width: 277.33%; } #custom-lp-wrapper.lp-39 .l-main-img__slider-img { animation: 39s linear 0s infinite normal none running cp39-flowing-left; } #custom-lp-wrapper.lp-39 .l-main-img__copy { position: relative; width: 95%; margin-inline: auto; } #custom-lp-wrapper.lp-39 .l-main-img__copy-note { position: absolute; left: 50%; bottom: 0.32%; transform: translateX(-50%); display: flex; justify-content: space-between; width: 92.9%; } #custom-lp-wrapper.lp-39 .l-main-img__copy-txt { font-size: clamp(8px, 0.3664px + 2.03562vw, 16px); line-height: 136%; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .l-main-img__inner { max-width: 1920px; margin-inline: auto; padding-block: 1.93% 1.88%; } #custom-lp-wrapper.lp-39 .l-main-img__slider { bottom: 23.15%; width: 284.79%; } #custom-lp-wrapper.lp-39 .l-main-img__copy { width: 93.964%; } #custom-lp-wrapper.lp-39 .l-main-img__copy-note { bottom: 5.43%; width: 89.55%; } #custom-lp-wrapper.lp-39 .l-main-img__copy-txt { font-size: clamp(8px, 1.6216px + 0.540541vw, 12px); line-height: 1.5; } } #custom-lp-wrapper.lp-39 .home-intro__inner { padding-block: 55px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .home-intro__inner { padding-block: 120px 110px; } } #custom-lp-wrapper.lp-39 .home-campaign__bg { position: relative; background-image: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg02_sp.png"); background-repeat: repeat-y; background-size: 100%; } #custom-lp-wrapper.lp-39 .home-campaign__inner { padding-block: 60px; } #custom-lp-wrapper.lp-39 .home-campaign__head { position: relative; } #custom-lp-wrapper.lp-39 .home-campaign__head-main { width: 100%; margin-inline: auto; } #custom-lp-wrapper.lp-39 .home-campaign__head-sub { position: relative; width: 90.45%; margin: 0px auto; padding-inline: 30px; } #custom-lp-wrapper.lp-39 .home-campaign__head-sub::before, #custom-lp-wrapper.lp-39 .home-campaign__head-sub::after { content: ""; position: absolute; top: 0px; display: block; width: 50px; height: 100%; background: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg_campaign01_sp.svg") 0px 0px / 100% 100% no-repeat; z-index: 1; } #custom-lp-wrapper.lp-39 .home-campaign__head-sub::before { left: 0px; } #custom-lp-wrapper.lp-39 .home-campaign__head-sub::after { right: 0px; transform: scale(-1, 1); } #custom-lp-wrapper.lp-39 .home-campaign__head-sub-txt { position: relative; padding-block: 8px 9px; background-color: rgb(56, 107, 203); border-top: 4px solid var(--mh--color--grayscale-900); border-bottom: 4px solid var(--mh--color--grayscale-900); font-size: 17px; z-index: 2; } #custom-lp-wrapper.lp-39 .home-campaign__head-under { width: 96%; margin: 3% auto 0px; transform: translateX(4%); } #custom-lp-wrapper.lp-39 .home-campaign__head-img { position: absolute; left: 50%; bottom: -9%; transform: translateX(-50%); width: 100%; z-index: 3; } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 .home-campaign { position: relative; } #custom-lp-wrapper.lp-39 .home-campaign::before { content: ""; position: absolute; left: 0px; bottom: 0px; display: block; width: 100%; height: var(--border-radius-lg); background-color: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .home-campaign__head { padding-bottom: 3.88%; } } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .home-campaign { padding: 20px; } #custom-lp-wrapper.lp-39 .home-campaign__bg { background-image: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg02_pc.png"); } #custom-lp-wrapper.lp-39 .home-campaign__inner { padding-block: 180px 150px; } #custom-lp-wrapper.lp-39 .home-campaign__head-main { width: 1120px; margin: 0px -10px; } #custom-lp-wrapper.lp-39 .home-campaign__head-sub { width: 100%; margin-top: 0px; } #custom-lp-wrapper.lp-39 .home-campaign__head-sub::before, #custom-lp-wrapper.lp-39 .home-campaign__head-sub::after { background-image: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg_campaign01_pc.svg"); } #custom-lp-wrapper.lp-39 .home-campaign__head-sub-txt { padding-block: 2px 5px; font-size: var(--mh--font-size--x8l); } #custom-lp-wrapper.lp-39 .home-campaign__head-under { margin: 60px auto 0px; width: 1027px; transform: translateX(0%); } #custom-lp-wrapper.lp-39 .home-campaign__head-img { bottom: 0px; margin: 0px 0px 0px -10px; width: 1505px; top: 450px; display: none; } } #custom-lp-wrapper.lp-39 .home-campaign-sec__head { position: relative; padding-left: 26px; } #custom-lp-wrapper.lp-39 .home-campaign-sec__head::before { content: ""; position: absolute; top: calc((1em * var(--mh--line-height--sm) - 12px) / 2 + 3px); left: 1px; display: block; width: 14px; height: 12px; clip-path: polygon(0px 0px, 100% 0%, 50% 100%); background-color: currentcolor; } #custom-lp-wrapper.lp-39 .home-campaign-sec__note { display: flex; flex-direction: column; align-items: flex-end; row-gap: 10px; } #custom-lp-wrapper.lp-39 .home-campaign-sec__note-list { display: flex; gap: 10px; } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 .home-campaign-sec { margin-top: 39px; padding-top: 41px; position: relative; } #custom-lp-wrapper.lp-39 .home-campaign-sec::before { content: ""; position: absolute; top: 0px; left: 0px; bottom: auto; width: 100%; height: 3px; background: var(--mh--color--grayscale-100); mask-image: url("data:image/svg+xml;utf8,%3Csvg%20width%3D%228%22%20height%3D%223%22%20viewBox%3D%220%200%208%203%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M3.03251%201.5C3.03251%200.671702%202.36479%200.000208892%201.5415%200H1.49102C0.667552%200%200%200.671573%200%201.5C0%202.32843%200.667552%203%201.49102%203H1.5415C2.36479%202.99979%203.03251%202.3283%203.03251%201.5Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); mask-repeat: repeat-x; display: none; } #custom-lp-wrapper.lp-39 .home-campaign-sec__note-list { flex-direction: column; } } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .home-campaign-sec { padding-top: 62px; position: relative; } #custom-lp-wrapper.lp-39 .home-campaign-sec::before { content: ""; position: absolute; top: 0px; left: 0px; bottom: auto; width: 100%; height: 3px; background: var(--mh--color--grayscale-100); mask-image: url("data:image/svg+xml;utf8,%3Csvg%20width%3D%228%22%20height%3D%223%22%20viewBox%3D%220%200%208%203%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M3.03251%201.5C3.03251%200.671702%202.36479%200.000208892%201.5415%200H1.49102C0.667552%200%200%200.671573%200%201.5C0%202.32843%200.667552%203%201.49102%203H1.5415C2.36479%202.99979%203.03251%202.3283%203.03251%201.5Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); mask-repeat: repeat-x; display: none; } #custom-lp-wrapper.lp-39 .home-campaign-sec { margin-top: 60px; padding-top: 60px; } #custom-lp-wrapper.lp-39 .home-campaign-sec__head { padding-left: 38px; } #custom-lp-wrapper.lp-39 .home-campaign-sec__head::before { top: calc((1em * var(--mh--line-height--sm) - 18px) / 2 + 3px); left: 2px; width: 21px; height: 18px; } #custom-lp-wrapper.lp-39 .home-campaign-sec__note-list { flex-wrap: wrap; } } #custom-lp-wrapper.lp-39 .home-campaign-content__list { display: grid; gap: 10px; } #custom-lp-wrapper.lp-39 .home-campaign-content__item { border-radius: var(--border-radius-lg); border: 3px solid var(--mh--color--grayscale-900); background-color: var(--mh--color--grayscale-100); padding: 17px; text-align: center; } #custom-lp-wrapper.lp-39 .home-campaign-content__item-num { color: var(--mh--color--secondary-500); -webkit-text-stroke-width: 3px; -webkit-text-stroke-color: var(--mh--color--primary-500); paint-order: stroke; font-family: var(--font-family-Inter, Inter); font-weight: 700; letter-spacing: 0.48px; position: absolute; left: 10px; top: 5px; } #custom-lp-wrapper.lp-39 .home-campaign-content__item-img { position: relative; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .home-campaign-content__list { display: flex; justify-content: center; flex-wrap: wrap; gap: 26px; } #custom-lp-wrapper.lp-39 .home-campaign-content__item { border-width: 5px; text-align: left; padding: 25px; width: calc(50% - 13px); } #custom-lp-wrapper.lp-39 .home-campaign-content__item-num { top: 8px; left: 15px; } } #custom-lp-wrapper.lp-39 .home-campaign-sec-block__head { padding-block: 12px; } #custom-lp-wrapper.lp-39 .home-feature { position: relative; background: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .home-feature__bg-top, #custom-lp-wrapper.lp-39 .home-feature__bg-bottom { position: absolute; left: 0px; width: 100%; } #custom-lp-wrapper.lp-39 .home-feature__bg-top { top: 0px; } #custom-lp-wrapper.lp-39 .home-feature__bg-bottom { bottom: 0px; } #custom-lp-wrapper.lp-39 .home-feature__head-img { margin: 0px auto 11px; width: 82px; } #custom-lp-wrapper.lp-39 .home-feature__head-main { position: relative; width: max-content; margin-inline: auto; } #custom-lp-wrapper.lp-39 .home-feature__head-main::before, #custom-lp-wrapper.lp-39 .home-feature__head-main::after { content: ""; position: absolute; top: 11px; display: block; width: 3px; height: 124px; background-color: currentcolor; border-radius: 100vmax; } #custom-lp-wrapper.lp-39 .home-feature__head-main::before { left: -45px; transform: rotate(-13deg); transform-origin: 0px 0px; } #custom-lp-wrapper.lp-39 .home-feature__head-main::after { right: -45px; transform: rotate(13deg); transform-origin: right 0px; } #custom-lp-wrapper.lp-39 .home-feature__inner { position: relative; } #custom-lp-wrapper.lp-39 .home-feature__content { display: flex; flex-direction: column; row-gap: var(--mh--space--15-20); } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 .home-feature__head-main-punc { margin-right: -0.75em; } } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .home-feature__bg-top img, #custom-lp-wrapper.lp-39 .home-feature__bg-bottom img { max-width: 1920px; margin-inline: auto; } #custom-lp-wrapper.lp-39 .home-feature__head-img { width: 159px; margin-bottom: 18px; } #custom-lp-wrapper.lp-39 .home-feature__head-main::before, #custom-lp-wrapper.lp-39 .home-feature__head-main::after { top: 5px; width: 4px; height: 66px; } #custom-lp-wrapper.lp-39 .home-feature__head-main::before { left: -39px; transform: rotate(-24deg); } #custom-lp-wrapper.lp-39 .home-feature__head-main::after { right: -39px; transform: rotate(24deg); } } #custom-lp-wrapper.lp-39 .home-feature-sec { position: relative; display: grid; padding: 17px; border: 3px solid var(--mh--color--grayscale-900); } #custom-lp-wrapper.lp-39 .home-feature-sec__head { display: flex; justify-content: center; flex-direction: row-reverse; column-gap: var(--mh--space--10-15); } #custom-lp-wrapper.lp-39 .home-feature-sec__head-num { position: absolute; top: 15px; right: 19px; -webkit-text-stroke-width: 4px; -webkit-text-stroke-color: var(--mh--color--primary-500); paint-order: stroke; letter-spacing: var(--mh--letter-spacing--md) !important; } #custom-lp-wrapper.lp-39 .home-feature-sec__head-main, #custom-lp-wrapper.lp-39 .home-feature-sec__head-sub { writing-mode: vertical-rl; letter-spacing: 0.07em !important; line-height: 1.475 !important; } #custom-lp-wrapper.lp-39 .home-feature-sec__head-main { padding-top: 10px; } #custom-lp-wrapper.lp-39 .home-feature-sec__head-main-horizontal { display: inline-block; margin-inline: -0.2em -0.06em; transform: rotate(-90deg); letter-spacing: 0.04em !important; line-height: 1 !important; } @media (max-width: 1023.98px) { #custom-lp-wrapper.lp-39 .home-feature-sec__head { padding-bottom: 35px; } #custom-lp-wrapper.lp-39 .home-feature-sec__img { margin-bottom: 15px; } } @media (min-width: 1024px) { #custom-lp-wrapper.lp-39 .home-feature-sec { grid-template-columns: 460px 1fr; grid-template-rows: 1fr max-content; gap: 12px 60px; padding: 55px; border-width: 5px; } #custom-lp-wrapper.lp-39 .home-feature-sec.is-reverse { grid-template-columns: 1fr 460px; } #custom-lp-wrapper.lp-39 .home-feature-sec.is-reverse .home-feature-sec__head { grid-area: 1 / 1 / 2 / 2; } #custom-lp-wrapper.lp-39 .home-feature-sec.is-reverse .home-feature-sec__head-num { left: 55px; right: auto; } #custom-lp-wrapper.lp-39 .home-feature-sec.is-reverse .home-feature-sec__img { grid-area: 1 / 2 / 3 / 3; } #custom-lp-wrapper.lp-39 .home-feature-sec__head { grid-area: 1 / 2 / 2 / 3; padding-top: 10px; } #custom-lp-wrapper.lp-39 .home-feature-sec__head-num { top: 47px; right: 55px; } #custom-lp-wrapper.lp-39 .home-feature-sec__img { grid-area: 1 / 1 / 3 / 2; min-height: 652px; } } #custom-lp-wrapper.lp-39 .home-feature-bnr { display: grid; gap: 20px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .home-feature-bnr { grid-template-columns: repeat(2, 1fr); } } #custom-lp-wrapper.lp-39 .u-hidden { display: none; } @media (max-width: 767.98px) { #custom-lp-wrapper.lp-39 .u-hidden-md-down { display: none; } } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .u-hidden-md-up { display: none; } } #custom-lp-wrapper.lp-39 .u-sr-only { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; white-space: nowrap; border-width: 0px; clip: rect(0px, 0px, 0px, 0px); } #custom-lp-wrapper.lp-39 .u-capitalize { text-transform: capitalize; } #custom-lp-wrapper.lp-39 .u-text-right { text-align: right; } #custom-lp-wrapper.lp-39 .u-text-center { text-align: center; } #custom-lp-wrapper.lp-39 .u-text-x2s { font-size: var(--mh--font-size--x2s); } #custom-lp-wrapper.lp-39 .u-text-sm { font-size: var(--mh--font-size--sm); } #custom-lp-wrapper.lp-39 .u-text-md { font-size: var(--mh--font-size--md); } #custom-lp-wrapper.lp-39 .u-text-lg { font-size: var(--mh--font-size--lg); } #custom-lp-wrapper.lp-39 .u-text-xl { font-size: var(--mh--font-size--xl); } #custom-lp-wrapper.lp-39 .u-text-x2l { font-size: var(--mh--font-size--x2l); } #custom-lp-wrapper.lp-39 .u-text-x3l { font-size: var(--mh--font-size--x3l); } #custom-lp-wrapper.lp-39 .u-text-x4l { font-size: var(--mh--font-size--x4l); } #custom-lp-wrapper.lp-39 .u-text-x5l { font-size: var(--mh--font-size--x5l); } #custom-lp-wrapper.lp-39 .u-text-x8l { font-size: var(--mh--font-size--x8l); } #custom-lp-wrapper.lp-39 .u-text-x9l { font-size: var(--mh--font-size--x9l); } #custom-lp-wrapper.lp-39 .u-text-x10l { font-size: var(--mh--font-size--x10l); } #custom-lp-wrapper.lp-39 .u-text-md { line-height: var(--mh--line-height--md); letter-spacing: var(--mh--letter-spacing--md); } #custom-lp-wrapper.lp-39 .u-text-x2s, #custom-lp-wrapper.lp-39 .u-text-xs, #custom-lp-wrapper.lp-39 .u-text-sm, #custom-lp-wrapper.lp-39 .u-text-lg, #custom-lp-wrapper.lp-39 .u-text-xl, #custom-lp-wrapper.lp-39 .u-text-x2l, #custom-lp-wrapper.lp-39 .u-text-x3l, #custom-lp-wrapper.lp-39 .u-text-x4l, #custom-lp-wrapper.lp-39 .u-text-x5l, #custom-lp-wrapper.lp-39 .u-text-x6l, #custom-lp-wrapper.lp-39 .u-text-x7l, #custom-lp-wrapper.lp-39 .u-text-x8l, #custom-lp-wrapper.lp-39 .u-text-x9l, #custom-lp-wrapper.lp-39 .u-text-x10l, #custom-lp-wrapper.lp-39 .u-text-x11l, #custom-lp-wrapper.lp-39 .u-text-x12l, #custom-lp-wrapper.lp-39 .u-text-x13l, #custom-lp-wrapper.lp-39 .u-text-x14l, #custom-lp-wrapper.lp-39 .u-text-x15l { line-height: var(--mh--line-height--sm); letter-spacing: var(--mh--letter-spacing--md); } #custom-lp-wrapper.lp-39 .u-leading-sm { line-height: var(--mh--line-height--sm); } #custom-lp-wrapper.lp-39 .u-leading-md { line-height: var(--mh--line-height--md); } #custom-lp-wrapper.lp-39 .u-font-bold { font-weight: 700; } #custom-lp-wrapper.lp-39 .u-font-black { font-weight: 900; } #custom-lp-wrapper.lp-39 .u-font-en { font-family: var(--mh--font-family--en); font-weight: 700; line-height: var(--mh--line-height--xs); letter-spacing: var(--mh--letter-spacing--sm); } #custom-lp-wrapper.lp-39 .u-inner { padding-right: var(--mh--contents--padding--side); padding-left: var(--mh--contents--padding--side); } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .u-inner { width: 100%; max-width: var(--mh--contents--width-with-padding); margin-right: auto; margin-left: auto; } } @media (min-width: 1180px) { #custom-lp-wrapper.lp-39 .u-inner { max-width: var(--mh--contents--width); padding-right: 0px; padding-left: 0px; } } #custom-lp-wrapper.lp-39 .u-item-center { display: grid; place-items: center; } #custom-lp-wrapper.lp-39 a.u-alpha { display: block; text-decoration: none; } @media (hover: hover) and (pointer: fine) { #custom-lp-wrapper.lp-39 a.u-alpha { transition: opacity var(--mh--duration) var(--mh--easing); } #custom-lp-wrapper.lp-39 a.u-alpha:hover { opacity: 0.7; } } #custom-lp-wrapper.lp-39 .u-media-query { font-family: sp; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39 .u-media-query { font-family: tb; } } @media (min-width: 1180px) { #custom-lp-wrapper.lp-39 .u-media-query { font-family: pc; } } #custom-lp-wrapper.lp-39 .u-text-primary-500 { color: var(--mh--color--primary-500); } #custom-lp-wrapper.lp-39 .u-text-secondary-500 { color: var(--mh--color--secondary-500); } #custom-lp-wrapper.lp-39 .u-text-grayscale-100 { color: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .u-text-grayscale-800 { color: var(--mh--color--grayscale-800); } #custom-lp-wrapper.lp-39 .u-bg-primary-100 { background-color: var(--mh--color--primary-100); } #custom-lp-wrapper.lp-39 .u-bg-secondary-500 { background-color: #ecdca5; } #custom-lp-wrapper.lp-39 .u-bg-grayscale-100 { background-color: var(--mh--color--grayscale-100); } #custom-lp-wrapper.lp-39 .u-mt-x3s { margin-top: var(--mh--space--x3s); } #custom-lp-wrapper.lp-39 .u-py-md { padding-block: var(--mh--space--md); } #custom-lp-wrapper.lp-39 .u-py-x3l { padding-block: var(--mh--space--x3l); } #custom-lp-wrapper.lp-39 .u-mt-10-10 { margin-top: var(--mh--space--10-10); } #custom-lp-wrapper.lp-39 .u-mb-10-15 { margin-bottom: var(--mh--space--10-15); } #custom-lp-wrapper.lp-39 .u-mt-15-15 { margin-top: var(--mh--space--15-15); } #custom-lp-wrapper.lp-39 .u-mt-20-20 { margin-top: var(--mh--space--20-20); } #custom-lp-wrapper.lp-39 .u-p-20-30 { padding: var(--mh--space--20-30); } #custom-lp-wrapper.lp-39 .u-mb-25-25 { margin-bottom: var(--mh--space--25-25); } #custom-lp-wrapper.lp-39 .u-mb-30-30 { margin-bottom: var(--mh--space--30-30); } #custom-lp-wrapper.lp-39 .u-mt-30-50 { margin-top: var(--mh--space--30-50); } #custom-lp-wrapper.lp-39 .u-mb-30-50 { margin-bottom: var(--mh--space--30-50); } #custom-lp-wrapper.lp-39 .u-mt-60-100 { margin-top: var(--mh--space--60-100); } #custom-lp-wrapper.lp-39 [class*="u-radius"] { overflow: hidden; } #custom-lp-wrapper.lp-39 .u-radius-md, #custom-lp-wrapper.lp-39 .u-link-radius-md { border-radius: var(--border-radius-md); } #custom-lp-wrapper.lp-39 .u-radius-lg, #custom-lp-wrapper.lp-39 .u-link-radius-lg { border-radius: var(--border-radius-lg); } #custom-lp-wrapper.lp-39 a:not(.wp-element-button) { text-decoration: inherit; } /* -------------------------------------------------------------------------- 3. WordPress 用の追加 -------------------------------------------------------------------------- */ /* 3-1. 画面に固定された放射光の背景（元ページの .c-bg02::before）を、LPの範囲の中だけに見せる。 clip-path で切り抜くと、position:fixed の背景もこの箱の外（テーマのヘッダー・フッター）に出ない */ #custom-lp-wrapper.lp-39 .l-wrapper { z-index: 0; clip-path: inset(0); } /* 3-2. 追従CTA。元ページはJSで「10pxスクロールしたら出す／下部のフッターが見えたら隠す」。 ・出す：スクロール連動アニメーション（Chrome・Edge 115+／Safari 26+）。非対応のブラウザでは最初から表示 ・隠す：下部のフッターを追従CTAより手前に重ね、上がってきたフッターがCTAにかぶさって隠す（全ブラウザで動く）。 フッターの放射光の背景は、フッターの箱の中だけに切り抜く */ @supports (animation-timeline: scroll()) { #custom-lp-wrapper.lp-39 .c-sticky-cta01 { animation: cp39-sticky-in linear both; animation-timeline: scroll(root); animation-range: 10px 110px; } } @keyframes cp39-sticky-in { from { opacity: 0; translate: 0 100%; } to { opacity: 1; translate: 0 0; } } #custom-lp-wrapper.lp-39 .l-footer { position: relative; z-index: 9; } #custom-lp-wrapper.lp-39 .l-footer-cta { clip-path: inset(0); } /* 3-3. タブレット（768〜1179px）。元ページは 768px 以上で body に min-width:1180px を掛けて横スクロールさせている。 WordPress では横スクロールを出せないので、1180px 前提の固定幅の部品だけ画面幅に合わせる */ @media (min-width: 768px) and (max-width: 1179.98px) { #custom-lp-wrapper.lp-39 .home-campaign__head-main { width: auto; margin: 0; } #custom-lp-wrapper.lp-39 .home-campaign__head-under { width: auto; max-width: 1027px; margin-left: auto; margin-right: auto; } #custom-lp-wrapper.lp-39 .l-footer-cta__img { width: calc(100% + 56px); } /* 追従CTAはこの幅ではスマホの組み（1180px からPCの組み） */ #custom-lp-wrapper.lp-39 .c-sticky-cta01 .u-hidden-md-down { display: none; } } /* 3-3b. 768〜1023px：見出し「ヤマト住建の家づくり、3つの安心」は46pxだと幅746pxで画面からはみ出すので38pxに。来場CTAの星の位置も */ @media (min-width: 768px) and (max-width: 1023.98px) { #custom-lp-wrapper.lp-39 .home-feature__head-main { font-size: 38px; } /* 来場CTA：金額を一回り小さくし、「初回限定」の星を見出しの線と重ならない位置（金額の左）へ */ #custom-lp-wrapper.lp-39 .c-cta01__head-sub-en { font-size: 100px; } #custom-lp-wrapper.lp-39 .c-cta01__head-first { top: 58px; left: -18px; width: 90px; } #custom-lp-wrapper.lp-39 .c-cta01__head-first-txt { font-size: 18px; } } /* 3-5. テーマと重複するものは出さない。 WordPress ではテーマのヘッダー（ロゴ）とフッター（ロゴ・コピーライト）が上下に必ず出るので、 LP内のロゴ（左上）・住所とコピーライトの帯・「公式サイトへ」（公式サイトの中なので不要）は隠す。 元ページどおりに出したい場合は、この3行を消す */ #custom-lp-wrapper.lp-39 .l-header, #custom-lp-wrapper.lp-39 .l-footer__bg, #custom-lp-wrapper.lp-39 .l-footer-official { display: none; } /* 3-4. 動きを減らす設定の尊重（住宅イラストの横流れを止める） */ @media (prefers-reduced-motion: reduce) { #custom-lp-wrapper.lp-39 .l-main-img__slider-img { animation: none; } } /* ========================================================================== 39キャンペーン 11月版（グラン エネージュ誕生記念）— 11月版で足した部品 土台（元ページの部品）は ../キャンペーン/39campaign-lp.css。build.py がこの2つをつないで 39campaign-nov-lp.css（納品用）を作る。編集はこのファイルだけ。 設計: デザイン設計書.md ／ 起点: #custom-lp-wrapper.lp-39nov（外枠 class="lp-39 lp-39nov"） ========================================================================== */ #custom-lp-wrapper.lp-39nov { --nv-walnut: #5D281C; /* チラシの帯（実測） */ --nv-walnut-d: #3E1A11; --nv-bordeaux: #881B20; /* チラシの標準仕様の見出し・UA値・価格（実測） */ --nv-magenta: #B82478; /* ご成約者様限定・プレゼント！（実測） */ --nv-pink: #D2287A; /* 各店限定3棟の縁 */ --nv-cream: #F7F1EA; --nv-beige: #EFE8E1; /* チラシ下半分の地色 */ --nv-peach: #F8D5B8; /* 断熱の部位ラベル（チラシの橙の札） */ --nv-marker: #F4EC3A; /* 価格の黄色いマーカー（実測） */ --nv-gold: linear-gradient(180deg, #FFF7C9 0%, #F3D774 28%, #D7A93A 56%, #F6DE87 78%, #B9852A 100%); --nv-gold-tail: linear-gradient(180deg, #C8962E 0%, #8C5F17 100%); --nv-serif: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif; --nv-bodoni: "Bodoni Moda", "Shippori Mincho", serif; /* 大きく使うときは font-variation-settings: "opsz" 11 で細線を太らせる */ --nv-decol: "Kaisei Decol", "Shippori Mincho", serif; } /* 共通：まとまりの中では折り返さない（折り返すならまとまりの間で） */ #custom-lp-wrapper.lp-39nov .nv-nw { display: inline-block; white-space: nowrap; } /* -------------------------------------------------------------------------- 共通：金のリボン（シグネチャー） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .nv-ribbon { position: relative; z-index: 3; width: max-content; max-width: calc(100% - 40px); margin: 0 auto; padding: 0 26px; text-align: center; } #custom-lp-wrapper.lp-39nov .nv-ribbon::before, #custom-lp-wrapper.lp-39nov .nv-ribbon::after { content: ""; position: absolute; top: 9px; z-index: -1; width: 40px; height: 100%; background: var(--nv-gold-tail); } #custom-lp-wrapper.lp-39nov .nv-ribbon::before { left: 0; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 12px 50%); } #custom-lp-wrapper.lp-39nov .nv-ribbon::after { right: 0; clip-path: polygon(0 0, 100% 0, calc(100% - 12px) 50%, 100% 100%, 0 100%); } #custom-lp-wrapper.lp-39nov .nv-ribbon__txt { display: block; padding: 7px 22px 8px; background: var(--nv-gold); border-top: 3px solid var(--nv-walnut-d); border-bottom: 3px solid var(--nv-walnut-d); box-shadow: 0 3px 0 rgba(62, 26, 17, 0.25); color: var(--nv-walnut-d); font-size: 17px; font-weight: 900; line-height: 1.4; letter-spacing: 0.12em; white-space: nowrap; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .nv-ribbon { padding: 0 44px; } #custom-lp-wrapper.lp-39nov .nv-ribbon::before, #custom-lp-wrapper.lp-39nov .nv-ribbon::after { top: 14px; width: 70px; } #custom-lp-wrapper.lp-39nov .nv-ribbon::before { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 20px 50%); } #custom-lp-wrapper.lp-39nov .nv-ribbon::after { clip-path: polygon(0 0, 100% 0, calc(100% - 20px) 50%, 100% 100%, 0 100%); } #custom-lp-wrapper.lp-39nov .nv-ribbon__txt { padding: 8px 56px 10px; border-width: 4px; font-size: 34px; letter-spacing: 0.16em; } } /* -------------------------------------------------------------------------- S0. TOPの背景（元ページの放射光の画像を、チラシのシャンパンゴールドに寄せる） チラシ実測：市松の濃い色 #E2CA80／淡い色 #F1E6C1。この値で濃い色 #E3D088 になる。紙吹雪は残る -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .c-bg02::before { filter: saturate(0.55) sepia(0.15) brightness(0.98); } /* -------------------------------------------------------------------------- S1. FV 並び：タブ → ロゴ（右上に各店限定3棟）→ 金のリボン → 賞品の箱（上の角にバッジ・下の角にぶた） → キャンペーン期間 → 住宅イラストの帯（いちばん下＝地面） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .nv-mv { position: relative; } #custom-lp-wrapper.lp-39nov .nv-mv__inner { position: relative; max-width: 1920px; margin: 0 auto; padding: 66px 0 0; } #custom-lp-wrapper.lp-39nov .nv-mv__copy { position: relative; z-index: 1; width: calc(100% - 30px); max-width: 980px; margin: 0 auto; text-align: center; } #custom-lp-wrapper.lp-39nov .nv-mv__tab { position: absolute; top: -66px; left: 50%; transform: translateX(-50%); padding: 4px 14px 5px; background: var(--nv-walnut); border-radius: 0 0 8px 8px; color: #fff; font-size: 12px; font-weight: 700; line-height: 1.4; letter-spacing: 0.12em; white-space: nowrap; } #custom-lp-wrapper.lp-39nov .nv-mv__title { position: relative; width: 100%; margin: 0 auto; } #custom-lp-wrapper.lp-39nov .nv-mv__logo img { width: 100%; } /* 「サンキュー」のルビ：39 の上（ロゴ画像の「おかげ様で39周年」と「39」の間のすき間） */ #custom-lp-wrapper.lp-39nov .nv-mv__ruby { position: absolute; top: 32%; left: 5.5%; z-index: 1; color: #1a1a1a; font-size: 9px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; -webkit-text-stroke: 3px #fff; paint-order: stroke fill; } /* 各店限定3棟（ピンクの縁の花形） */ #custom-lp-wrapper.lp-39nov .nv-mv__limit { position: absolute; top: -60px; right: -8px; z-index: 2; display: grid; place-items: center; width: 62px; aspect-ratio: 1; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpolygon%20points%3D%2750.00%2C3.00%2056.49%2C9.01%2064.52%2C5.30%2068.84%2C13.02%2077.63%2C11.98%2079.34%2C20.66%2088.02%2C22.37%2086.98%2C31.16%2094.70%2C35.48%2090.99%2C43.51%2097.00%2C50.00%2090.99%2C56.49%2094.70%2C64.52%2086.98%2C68.84%2088.02%2C77.63%2079.34%2C79.34%2077.63%2C88.02%2068.84%2C86.98%2064.52%2C94.70%2056.49%2C90.99%2050.00%2C97.00%2043.51%2C90.99%2035.48%2C94.70%2031.16%2C86.98%2022.37%2C88.02%2020.66%2C79.34%2011.98%2C77.63%2013.02%2C68.84%205.30%2C64.52%209.01%2C56.49%203.00%2C50.00%209.01%2C43.51%205.30%2C35.48%2013.02%2C31.16%2011.98%2C22.37%2020.66%2C20.66%2022.37%2C11.98%2031.16%2C13.02%2035.48%2C5.30%2043.51%2C9.01%27%20fill%3D%27%23fff%27%20stroke%3D%27%23D2287A%27%20stroke-width%3D%273.5%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; transform: rotate(8deg); } #custom-lp-wrapper.lp-39nov .nv-mv__limit-in { display: block; color: #1a1a1a; font-size: 11px; font-weight: 900; line-height: 1.15; letter-spacing: 0.04em; } #custom-lp-wrapper.lp-39nov .nv-mv__limit-n { font-family: var(--mh--font-family--en); font-size: 1.6em; font-weight: 700; color: var(--nv-magenta); line-height: 1; } #custom-lp-wrapper.lp-39nov .nv-ribbon--mv { margin-top: -6px; } /* 賞品の箱（元ページの白い箱と同じ文法：黒い縁・角丸） */ #custom-lp-wrapper.lp-39nov .nv-mv__prize { --pig-h: 60px; position: relative; z-index: 2; width: calc(100% - 24px); max-width: 800px; margin: 32px auto 0; padding: 26px 14px 24px; background: #fff; border: 3px solid #000; border-radius: 20px; } /* ぶた：元ページのキャラクター画像（左右の端に1匹ずつ）から1匹ずつ切り出し、箱の下の角にぶら下げる */ #custom-lp-wrapper.lp-39nov .nv-mv__prize::before, #custom-lp-wrapper.lp-39nov .nv-mv__prize::after { content: ""; position: absolute; z-index: 3; bottom: calc(var(--pig-h) * -0.32); height: var(--pig-h); background: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/img_campaign02_pc.png") no-repeat; background-size: calc(var(--pig-h) * 5.5) auto; pointer-events: none; } #custom-lp-wrapper.lp-39nov .nv-mv__prize::before { left: calc(var(--pig-h) * -0.42); width: calc(var(--pig-h) * 0.86); background-position: calc(var(--pig-h) * -0.16) 0; } #custom-lp-wrapper.lp-39nov .nv-mv__prize::after { right: calc(var(--pig-h) * -0.36); width: calc(var(--pig-h) * 0.78); background-position: calc(var(--pig-h) * -4.66) 0; } #custom-lp-wrapper.lp-39nov .nv-mv__aircon { width: 74%; margin: 0 auto; } #custom-lp-wrapper.lp-39nov .nv-mv__aircon img { width: 100%; } #custom-lp-wrapper.lp-39nov .nv-mv__present { margin-top: 6px; color: #000; line-height: 1; } #custom-lp-wrapper.lp-39nov .nv-mv__present-line { display: flex; justify-content: center; align-items: baseline; column-gap: 2px; white-space: nowrap; } #custom-lp-wrapper.lp-39nov .nv-mv__present-a, #custom-lp-wrapper.lp-39nov .nv-mv__present-b { font-size: 24px; font-weight: 900; letter-spacing: 0.02em; } #custom-lp-wrapper.lp-39nov .nv-mv__present-n { padding: 0 4px 0 2px; font-family: var(--mh--font-family--en); font-size: 62px; font-weight: 700; letter-spacing: 0; line-height: 0.85; background: linear-gradient(180deg, #FFF3A6 0%, #F2CF4E 38%, #C9922A 70%, #F4D86E 100%); filter: drop-shadow(2px 3px 0 #000); -webkit-background-clip: text; background-clip: text; color: transparent; } #custom-lp-wrapper.lp-39nov .nv-mv__present-c { display: block; margin-top: 6px; color: var(--nv-magenta); font-family: var(--nv-decol); font-size: 40px; font-weight: 700; letter-spacing: 0.04em; white-space: nowrap; transform: skewX(-8deg); } /* 今だけ（元ページの「初回限定」と同じ星形）：箱の左上の角 */ #custom-lp-wrapper.lp-39nov .nv-mv__now { position: absolute; top: -24px; left: -14px; z-index: 3; display: grid; place-items: center; width: 64px; aspect-ratio: 1; background: url("https://www.yamatojk.co.jp/wordpress/wp-content/themes/ymt_juken_orgtheme/img/39campaign/bg_cta02.svg") center / contain no-repeat; transform: rotate(-10deg); } #custom-lp-wrapper.lp-39nov .nv-mv__now-txt { color: var(--mh--color--primary-500); font-size: 13px; font-weight: 900; letter-spacing: 0.06em; } /* ご成約者様限定（マゼンタの円）：箱の右上の角 */ #custom-lp-wrapper.lp-39nov .nv-mv__only { position: absolute; top: -26px; right: -14px; z-index: 3; display: grid; place-items: center; width: 72px; aspect-ratio: 1; background: var(--nv-magenta); border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 2px var(--nv-magenta); } #custom-lp-wrapper.lp-39nov .nv-mv__only-txt { color: #fff; font-size: 11px; font-weight: 900; line-height: 1.35; letter-spacing: 0.02em; } /* キャンペーン期間（チラシ下端のこげ茶の帯） */ #custom-lp-wrapper.lp-39nov .nv-mv__period { position: relative; z-index: 2; display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; column-gap: 10px; width: max-content; max-width: 100%; margin: 38px auto 0; padding: 7px 18px 9px; background: var(--nv-walnut); border-radius: 100vmax; color: #fff; line-height: 1.3; } #custom-lp-wrapper.lp-39nov .nv-mv__period-k { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; } #custom-lp-wrapper.lp-39nov .nv-mv__period-v { font-size: 13px; font-weight: 900; } #custom-lp-wrapper.lp-39nov .nv-mv__period-n { font-family: var(--mh--font-family--en); font-size: 1.55em; font-weight: 700; letter-spacing: 0; margin: 0 1px; } #custom-lp-wrapper.lp-39nov .nv-mv__period-w { font-size: 0.9em; } /* 住宅イラストの帯（元ページの部品）：FVのいちばん下に「地面」として流す。賞品の箱とは重ねない */ #custom-lp-wrapper.lp-39nov .nv-mv__slider { position: relative; left: auto; bottom: auto; z-index: 0; margin-top: -14px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .nv-mv__inner { padding-top: 64px; } #custom-lp-wrapper.lp-39nov .nv-mv__copy { width: calc(100% - 80px); } #custom-lp-wrapper.lp-39nov .nv-mv__tab { top: -64px; padding: 6px 22px 7px; font-size: 15px; } #custom-lp-wrapper.lp-39nov .nv-mv__title { width: 76%; } #custom-lp-wrapper.lp-39nov .nv-mv__ruby { top: 21%; left: 9%; font-size: 14px; -webkit-text-stroke-width: 5px; } #custom-lp-wrapper.lp-39nov .nv-mv__limit { top: -26px; right: -112px; width: 124px; } #custom-lp-wrapper.lp-39nov .nv-mv__limit-in { font-size: 21px; } #custom-lp-wrapper.lp-39nov .nv-ribbon--mv { margin-top: -12px; } #custom-lp-wrapper.lp-39nov .nv-mv__prize { --pig-h: 116px; display: grid; grid-template-columns: 40% 1fr; align-items: center; column-gap: 4%; width: 78%; margin-top: 44px; padding: 30px 48px 34px 62px; border-width: 5px; } #custom-lp-wrapper.lp-39nov .nv-mv__aircon { width: 100%; } #custom-lp-wrapper.lp-39nov .nv-mv__present { margin-top: 0; text-align: left; } #custom-lp-wrapper.lp-39nov .nv-mv__present-line { justify-content: flex-start; } #custom-lp-wrapper.lp-39nov .nv-mv__present-a, #custom-lp-wrapper.lp-39nov .nv-mv__present-b { font-size: 32px; } #custom-lp-wrapper.lp-39nov .nv-mv__present-n { font-size: 96px; } #custom-lp-wrapper.lp-39nov .nv-mv__present-c { margin-top: 6px; font-size: 56px; } #custom-lp-wrapper.lp-39nov .nv-mv__now { top: -46px; left: -50px; width: 110px; } #custom-lp-wrapper.lp-39nov .nv-mv__now-txt { font-size: 22px; } #custom-lp-wrapper.lp-39nov .nv-mv__only { top: -48px; right: -50px; width: 116px; border-width: 4px; } #custom-lp-wrapper.lp-39nov .nv-mv__only-txt { font-size: 17px; } #custom-lp-wrapper.lp-39nov .nv-mv__period { margin-top: 62px; padding: 10px 34px 12px; column-gap: 18px; } #custom-lp-wrapper.lp-39nov .nv-mv__period-k { font-size: 17px; } #custom-lp-wrapper.lp-39nov .nv-mv__period-v { font-size: 20px; } #custom-lp-wrapper.lp-39nov .nv-mv__slider { width: 200%; margin-top: -36px; } } /* -------------------------------------------------------------------------- S3. グラン エネージュ誕生（ウォールナットの世界） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .nv-ge { position: relative; margin-top: 26px; padding: 0 0 56px; background: var(--nv-walnut); color: #fff; } /* 金のリボンが、39の世界とこげ茶の世界の境目に掛かる */ #custom-lp-wrapper.lp-39nov .nv-ribbon--ge { top: -24px; margin-bottom: 10px; } #custom-lp-wrapper.lp-39nov .nv-ge__inner { display: grid; row-gap: 26px; } #custom-lp-wrapper.lp-39nov .nv-ge__visual { position: relative; overflow: hidden; border-radius: 20px; border: 3px solid #000; aspect-ratio: 4 / 4.3; } #custom-lp-wrapper.lp-39nov .nv-ge__photo, #custom-lp-wrapper.lp-39nov .nv-ge__photo img { width: 100%; height: 100%; } /* 写真は「下端（建物の足元）を基準に」パネルより縦長に置き、上の空だけを切り落とす。 スマホは写真の上23%、PCは上29%を落とす計算（建物が大きくなり、空にはロゴが収まる分だけ残る） */ #custom-lp-wrapper.lp-39nov .nv-ge__photo { position: relative; overflow: hidden; } #custom-lp-wrapper.lp-39nov .nv-ge__photo img { position: absolute; left: 0; bottom: 0; height: 130%; object-fit: cover; object-position: 50% 100%; } #custom-lp-wrapper.lp-39nov .nv-ge__visual::after { content: ""; position: absolute; inset: 0 0 auto 0; z-index: 1; height: 46%; background: linear-gradient(180deg, rgba(36, 14, 8, 0.62) 0%, rgba(36, 14, 8, 0.28) 55%, rgba(36, 14, 8, 0) 100%); pointer-events: none; } #custom-lp-wrapper.lp-39nov .nv-ge__new { z-index: 2; position: absolute; top: 7%; left: 7%; display: flex; align-items: center; column-gap: 12px; } #custom-lp-wrapper.lp-39nov .nv-ge__new-k { padding: 2px 12px; border-left: 1px solid rgba(255, 255, 255, 0.85); border-right: 1px solid rgba(255, 255, 255, 0.85); color: #fff; font-family: var(--nv-serif); font-size: 14px; font-weight: 800; letter-spacing: 0.2em; } #custom-lp-wrapper.lp-39nov .nv-ge__logo { display: block; width: 230px; max-width: 100%; filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.35)); aspect-ratio: 472.5 / 185.1; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 472.5 185.1'%3E%3Cpath fill='%23F3EEE8' d='M140.7 85.7L140.7 138.2C127.3 148 108.3 157.2 81.3 157.2C32.6 157.2 0 128.6 0 79.6C0 31.1 34.5 0 80.1 0C104.5 0 125 10.5 137.3 24.5L126.9 33.9C116.4 16.3 99.9 3.3 78.2 3.3C44.7 3.3 23.4 32.8 23.4 78.2C23.4 122.5 46.8 153.4 82.4 153.4C97.6 153.4 111.8 148.2 121 140.9L121 89.5L86.1 89.5L83.8 85.7L140.7 85.7M195.9 98.3C195.9 87.2 189.2 80 175.4 80L167.7 80L167.7 117.9C170.1 118.3 175.3 118.5 177.4 118.5C188.8 118.5 195.9 109.3 195.9 98.3M211.9 143.7L211.9 157L211.2 157L180.2 122.4C178.7 120.7 177.7 120.2 174.7 120.2L167.7 120.2L167.7 154.7L157 154.7L157 78.3L175.8 78.3C195.9 78.3 206.7 84.6 206.7 97.6C206.7 108.4 198.3 114.1 188.4 117.5L211.9 143.7M256.1 127.7L242 92.7L230.1 122L227.8 127.7L256.1 127.7M256.9 129.6L227.1 129.6C222.5 141.9 221.2 148.5 220.9 154.7L213.7 154.7C218.7 144.2 222.7 134.4 228.1 121.2L246.4 76.6L246.8 76.6L278.6 154.7L267 154.7L256.9 129.6M341.1 78.3C339.8 86.7 339 97 339 111.7L339 155.9L338.1 155.9L289.5 88.7L289.5 121.3C289.5 136 290.1 146.3 291.6 154.7L285.3 154.7C286.7 146.3 287.4 136 287.4 121.3L287.4 85.8L282.3 78.6L282.3 78.3L295 78.3L336.9 137.5L336.9 111.7C336.9 97 336.3 86.7 334.8 78.3L341.1 78.3M410 116.2C410 94.6 398.4 80 380.4 80L365.2 80L365.2 152.1C368 152.7 372.9 153 381.3 153C399.6 153 410 139.7 410 116.2M421.8 115.7C421.8 140.3 405.4 154.7 379.5 154.7L354.5 154.7L354.5 78.3L381.3 78.3C405.5 78.3 421.8 91.4 421.8 115.7M176.1 41C177.8 41 178.8 41.8 178.8 42.6C178.8 43 178.5 43.3 178.1 43.3C177.7 43.3 177.5 43 177.1 42.6C176.7 42.2 175.8 41.7 175.3 41.6C175.1 41.5 175 41.4 175 41.3C175 41.1 175.6 41 176.1 41M174.6 42.8C176.3 42.8 177.5 43.7 177.5 44.5C177.5 44.9 177.2 45.3 176.8 45.3C176.4 45.3 176.1 44.9 175.7 44.5C175.3 44 174.9 43.6 174.3 43.3C174.1 43.2 173.9 43 173.9 42.9C173.9 42.8 174.3 42.8 174.6 42.8M167.9 43.8C167.9 43.6 168.1 43.5 168.4 43.5C169 43.5 169.3 43.6 169.8 43.9C170.1 44.2 170.5 44.5 170.5 44.8C170.5 45 170.1 45.4 169.8 45.7C169.7 45.8 169.7 45.9 169.7 46C169.7 46.1 169.8 46.2 170 46.2C170.5 46.2 172.4 45.6 173 45.3C173.3 45.1 173.6 45 173.8 45C174.1 45 174.4 45.1 174.7 45.3C175 45.5 175.2 45.6 175.4 45.8C175.7 45.9 176.2 46.2 176.2 46.6C176.2 46.8 175.9 47.1 175.6 47.2C175.1 47.5 175.1 47.5 174.8 48C173 51 171.2 53.3 168.3 55.4C166.9 56.4 165.3 57.4 163.8 57.9C163.5 58 163.1 58.1 163 58.1C162.9 58.1 162.8 58.1 162.8 57.9C162.8 57.8 163 57.8 163.1 57.7C165.7 56.3 168.4 53.9 170.5 51.3C171.5 50 173.3 47.4 173.3 46.8C173.3 46.6 173.2 46.5 173.1 46.5C173 46.5 172.9 46.6 172.7 46.6C172.2 46.7 170.5 47.1 170.1 47.1C169.8 47.1 169.7 47 169.4 47C169 47 168.9 47.2 168.1 48C167.3 49 166.5 49.8 165.4 50.6C164.7 51 163.5 51.7 163.2 51.7C163.1 51.7 163.1 51.7 163.1 51.6C163.1 51.5 163.3 51.3 163.7 51C164.7 50.1 165.6 49 166.4 48C167 47.2 168.1 45.5 168.1 44.7C168.1 44.4 167.9 44 167.9 43.8M183.5 43.8C183.9 43.9 184.3 44 184.8 44C186.3 44 187.5 43.9 188.7 43.6C189.2 43.4 189.6 43.4 190 43.4C190.6 43.4 191.4 43.7 191.4 44.2C191.4 45 189.7 45.1 189 45.1C188 45.2 184.8 45.5 184.6 45.5C183.3 45.5 182.8 43.9 182.8 43.8C182.8 43.7 182.8 43.6 182.9 43.6C183 43.6 183.2 43.7 183.5 43.8M182.9 57.2C184.5 56.4 186.4 55.1 187.7 53.7C188.9 52.7 189.8 51.4 190.6 50.1C190.7 49.9 191 49.3 191 49C191 48.8 190.9 48.7 190.6 48.7C190 48.7 186.5 49.3 185.5 49.5C184.8 49.6 184.2 49.8 183.6 50C183.4 50.1 183.3 50.1 183.2 50.1C182.7 50.1 181.9 49.6 181.4 48.9C181.2 48.6 180.8 48 180.8 47.7C180.8 47.6 180.9 47.6 180.9 47.6C181 47.6 181.2 47.7 181.4 47.7C181.9 48 182.9 48.1 183.4 48.1C184.7 48.1 187 47.8 188.3 47.7C189.7 47.5 190.3 47.5 190.8 47.4C191 47.4 191.1 47.4 191.3 47.3C191.5 47.2 191.6 47.1 191.7 47.1C192 47.1 192.3 47.4 192.8 47.8C193.1 48.1 193.6 48.5 193.6 48.9C193.6 49.2 193.4 49.4 193 49.7C192.6 50.1 192.3 50.6 192 51.1C190.5 53.5 189 55.1 186.2 56.4C185.3 56.9 183.1 57.8 182.6 57.8C182.4 57.8 182.4 57.7 182.4 57.6C182.4 57.5 182.4 57.4 182.9 57.2M201 44.6C201.9 45 202.5 45.7 202.5 46.5C202.5 47.1 202.1 47.6 201.5 47.6C200.8 47.6 200.3 46.7 200 46.2C199.6 45.6 199 45 198.4 44.6C198.2 44.5 198 44.4 198 44.3C198 44.2 198.3 44.1 198.6 44.1C199.4 44.1 200.2 44.3 201 44.6M210.7 46.3C210.7 46.4 210.1 47.3 209.8 47.6C208 50.2 205.3 52.6 202.7 54.6C202.2 55 201.9 55.2 201.4 55.8C201 56.2 200.9 56.3 200.5 56.3C199.4 56.3 197.8 55 197.8 54.1C197.8 53.5 197.9 52.9 198.1 52.9C198.3 52.9 198.4 53.1 198.7 53.3C199.1 53.6 199.7 53.8 200.1 53.8C200.8 53.8 203.7 51.9 205.2 50.7C207 49.4 208.7 48 210.2 46.5C210.4 46.2 210.5 46.1 210.6 46.1C210.6 46.1 210.7 46.2 210.7 46.3M219.7 46.3C219.9 46.3 220.9 46.5 221.7 46.5C222.8 46.5 226.3 46 227.1 45.6C227.5 45.4 227.6 45.3 227.8 45.3C228.4 45.3 229.9 45.8 229.9 46.5C229.9 46.8 229.5 46.9 229.1 47C227.7 47 226.8 47.2 226 47.3C225.8 47.3 225.7 47.4 225.7 47.5C225.7 47.6 225.8 47.7 225.9 47.9C226.2 48.1 226.4 48.3 226.4 48.5C226.4 48.6 226.4 48.7 226.3 49.1C226.1 50 225.9 51.7 225.9 52.1C225.9 52.4 226.1 52.5 226.4 52.5C226.9 52.5 230.2 52.2 230.7 52.2C230.9 52.1 231.1 52.1 231.3 52.1C231.9 52.1 233.4 53.1 233.4 53.7C233.4 54 232.9 54.2 232.5 54.2C232.3 54.2 232.1 54.2 232 54.1C230.7 53.8 230.2 53.7 228.9 53.7C226.5 53.7 221.7 54.1 219.7 54.9C219.4 55 219.3 55.1 219.1 55.1C218.9 55.1 218.2 54.7 217.9 54.4C217.6 54.2 217.2 53.9 217.1 53.6C217 53.4 216.9 53.1 216.9 53C216.9 52.8 217 52.8 217.1 52.8C217.2 52.8 217.3 52.8 217.5 52.9C218.1 53 218.8 53.1 219.6 53.1C220.6 53.1 222.7 52.8 223.8 52.7C224.5 52.6 224.6 52.4 224.6 50.3C224.6 49.6 224.6 48.4 224.3 47.9C224.2 47.7 224.1 47.6 223.9 47.6C223.6 47.6 222.1 48 221.8 48.1C221.6 48.2 221.5 48.2 221.4 48.2C220.9 48.2 219.6 47 219.6 46.4C219.6 46.3 219.6 46.3 219.7 46.3M249.2 50.9C250 51.4 250.9 52.2 250.9 53.1C250.9 53.5 250.5 54.1 250 54.1C249.3 54.1 249.1 53.5 248.9 53.1C248.4 52.2 247.8 51.5 247 50.6C247 50.5 246.9 50.5 246.9 50.4C246.9 50.3 247 50.3 247.1 50.3C247.8 50.3 248.6 50.5 249.2 50.9M244.3 42.3C244.9 42.7 245.4 43.3 245.4 43.9C245.4 44.3 244.9 44.8 244.4 44.8C243.8 44.8 243.4 44 243 43.4C242.6 42.8 241.9 42.3 241.3 41.9C241.2 41.8 241.1 41.7 241.1 41.7C241.1 41.6 241.4 41.5 241.6 41.5C242.5 41.5 243.6 41.8 244.3 42.3M237.7 46.8C237.9 46.8 238.8 47.1 239.7 47.1C240.3 47.1 241.1 46.9 241.9 46.8C242.5 46.7 243.3 46.5 243.8 46.3C244 46.2 244.3 46 244.5 45.9C244.6 45.8 244.8 45.8 244.9 45.8C245.4 45.8 246.3 46.6 246.3 46.9C246.3 47.1 246.2 47.2 245.9 47.4C245.4 47.7 244.9 48.4 244.3 49.2C244.2 49.4 244.1 49.5 244.1 49.6C244 49.7 244.1 49.8 244.1 49.8C244.3 50 244.6 50.1 244.8 50.3C245 50.5 245.1 50.7 245.1 51C245 51.3 245 51.7 245 52.1C244.9 52.9 244.9 54.4 244.9 55.3C244.9 56.1 244.9 56.9 245 57.5C245 57.8 245 58.4 244.7 58.5C244.6 58.6 244.5 58.6 244.4 58.6C244.2 58.6 244 58.5 243.8 58.3C243.5 58.1 243.1 57.5 243.1 57.1C243.2 56.4 243.3 55.5 243.4 54.9C243.4 54.4 243.5 52.5 243.5 51.9C243.4 51.4 243.3 51.1 243.2 51C243.1 50.9 243.1 50.9 243 50.9C242.9 51 242.4 51.4 242.2 51.7C240.5 53.4 238.7 54.7 236.6 55.6C236.3 55.7 236 55.8 235.9 55.8C235.9 55.8 235.8 55.8 235.8 55.7C235.8 55.6 236.5 55.1 236.8 54.9C239.2 53 241.1 51.1 242.7 48.8C243 48.4 243.2 48 243.2 47.8C243.2 47.7 243.1 47.7 243 47.7C242.9 47.7 240.4 48.6 240 48.7C239.9 48.8 239.7 48.9 239.5 48.9C239.1 48.9 238.3 48.4 237.9 47.9C237.6 47.6 237.5 47.1 237.5 47C237.5 46.9 237.6 46.8 237.7 46.8M264.8 49.2C265.5 49.2 268.3 49.1 268.6 49.1C269.5 49.1 270.1 49.6 270.1 50.1C270.1 50.8 269 50.8 268.5 50.8C267.8 50.8 266.5 50.8 265.5 50.8C263.6 50.8 260.2 50.9 258.4 51.1C257.9 51.1 257.5 51.2 257 51.4C256.7 51.4 256.5 51.5 256.3 51.5C255.8 51.5 255 50.9 254.7 50.4C254.6 50.1 254.4 49.6 254.4 49.3C254.4 49.2 254.5 49.1 254.6 49.1C254.6 49.1 254.8 49.1 255 49.2C255.9 49.5 256.8 49.5 257.8 49.5C260.3 49.5 263.2 49.3 264.8 49.2M289 43.5C289 43.9 288.8 44.3 288.3 44.3C287.8 44.3 287.6 43.8 287.3 43.3C287 42.9 286.2 42.3 285.7 42C285.6 41.9 285.5 41.9 285.5 41.8C285.5 41.6 285.8 41.6 286.1 41.6C287.4 41.6 289 42.4 289 43.5M286.9 45C286.9 45.3 286.6 45.8 286.1 45.8C285.8 45.8 285.4 45.3 285.1 44.8C284.7 44.2 284.3 43.8 283.8 43.4C283.7 43.3 283.5 43.2 283.5 43.1C283.5 43 283.8 42.9 284 42.9C285.2 42.9 286.9 43.8 286.9 45M280.4 45.9C280.4 46.4 280 46.9 279.6 46.9C279.2 46.9 279 46.7 278.7 46.4C278.1 45.5 277.6 45.1 276.7 44.8C276.4 44.8 276.4 44.7 276.4 44.6C276.4 44.4 277.5 44.2 278.1 44.2C279.4 44.2 280.4 45 280.4 45.9M275.5 56.4C275.3 56 275.2 55.8 275 55.5C274.8 55.2 274.7 54.8 274.7 54.7C274.7 54.6 274.7 54.5 274.8 54.5C275 54.5 275.3 54.7 275.5 54.7C275.8 54.8 276 54.9 276.1 54.9C276.8 54.9 278.8 53.8 279.8 53.2C282.2 51.9 285.4 49.7 287.3 47.7C287.5 47.5 287.6 47.4 287.7 47.4C287.8 47.4 287.9 47.4 287.9 47.5C287.9 47.7 287.3 48.4 287.1 48.8C285.1 51.6 281.9 54.1 278.6 56.1C278.2 56.3 277.7 56.6 277.4 56.9C277 57.2 276.8 57.4 276.4 57.4C276.1 57.4 275.7 56.9 275.5 56.4M277.9 49.8C277.9 50.3 277.6 50.9 277 50.9C276.7 50.9 276.5 50.7 276.2 50.3C275.9 49.7 275.2 49 274.6 48.7C274.3 48.5 274.2 48.5 274.2 48.3C274.2 48.1 275 48 275.6 48C276.8 48 277.9 48.8 277.9 49.8M293.1 49.8C294.1 49.8 296.8 49.1 297 49C297.3 48.9 297.6 48.7 297.8 48.7C298.4 48.7 299.5 49.5 299.5 49.9C299.5 50.1 299.1 50.4 299 50.6C298.8 50.9 298.6 51.7 298.5 52.5C298.4 53.3 298.3 54 298.3 54.3C298.3 54.5 298.4 54.6 298.6 54.6C299.1 54.6 300.3 54.2 300.7 54.2C301.7 54.2 303 54.9 303 55.7C303 56 302.8 56.2 302.4 56.2C302.3 56.2 302 56.2 301.2 56C300.6 55.9 300 55.8 299.2 55.8C297.5 55.8 294 56.1 292 56.6C291.6 56.6 291 56.9 290.8 56.9C290.5 56.9 289 56 289 55C289 54.8 289.1 54.8 289.2 54.8C289.3 54.8 289.6 54.9 289.7 54.9C290.5 55.1 291 55.2 291.3 55.2C291.8 55.2 296.1 54.9 296.3 54.8C296.6 54.7 296.7 54.4 296.7 54C296.8 53.5 297.2 50.8 297.2 50.6C297.2 50.4 297.1 50.3 296.9 50.3C296.7 50.3 294.4 50.8 293.8 51.1C293.6 51.2 293.2 51.4 293.1 51.4C292.6 51.4 291.8 50.4 291.8 49.9C291.8 49.7 291.8 49.7 292 49.7C292.1 49.7 292.8 49.8 293.1 49.8'/%3E%3Cpath fill='%23F2D78E' d='M315.8 144.3C322.6 143.5 332 143.3 333.7 142.3C334.3 142.6 334.8 144.2 333.3 144.6C331.4 145.1 324.8 145.6 318.5 146.2C319.3 146.7 319.8 147.3 319.8 147.9C319.5 150.4 317.8 154.2 314.7 162.3C320 161.3 326.2 160.1 327.2 160.7C328.5 161.6 327.2 162.7 326.6 162.7C325.8 162.2 318.8 164 313.6 165.2C311.4 170.8 309.1 177.9 308.3 181.4C314.6 180.2 325.1 177.5 326.5 178.7C327.5 179.5 326.6 180.7 326.1 180.6C325.7 179.4 307.7 183.8 305.6 184.9C303.8 185.1 302.7 183 303 182.2C302.9 182.1 302.9 182 302.9 181.9C302.6 180.1 305.8 171.7 307.8 166.2C306.6 165.8 306 163.8 307 163.3C307.3 163.4 307.9 163.4 308.8 163.3C311.5 155.6 314.1 149.6 314.8 146.6C307.9 147.7 301.7 150.9 302.5 154.3C299.1 154.7 298.2 151.3 300 149.1C302.7 145.8 312.3 144.7 315.8 144.3M353.5 143.2C353.8 145 354.6 156 359 171.5C358.9 169.2 360.6 163.5 362 159.8C366.3 147.9 370 139.6 372.2 138C373.9 136.7 375.4 137.4 375.4 138.4C374.1 138.7 369.2 148.3 365.9 158.1C363.4 165.8 361.1 174.3 361.3 178.6C359.9 179.9 357.5 180.1 356.4 178.5C352.7 171.8 350.7 157.8 349 148C347.5 152.2 345.2 159.1 343.7 163.9C340.9 173.2 338.8 180 339 181.2C338.1 182.2 335.4 182.1 335.7 180.2C336.1 177.1 339 168.1 340.5 163.4C341.7 159.5 347.1 143.1 347.5 141.4C348.5 139 352.9 141.3 353.5 143.2M386.6 137.2C393.3 136.4 402.7 136.2 404.4 135.2C405.1 135.5 405.6 137.1 404 137.5C402.2 138 395.5 138.5 389.2 139.1C390 139.6 390.6 140.2 390.5 140.8C390.3 143.3 388.6 147.1 385.4 155.2C390.7 154.2 397 153 398 153.6C399.2 154.5 398 155.6 397.3 155.6C396.6 155.1 389.5 156.9 384.3 158.1C382.2 163.7 379.8 170.8 379.1 174.3C385.3 173 395.8 170.4 397.2 171.6C398.2 172.4 397.4 173.6 396.8 173.5C396.4 172.3 378.4 176.7 376.3 177.8C374.5 178 373.4 175.9 373.8 175.1C373.7 175 373.6 174.9 373.6 174.8C373.3 173 376.5 164.6 378.6 159.1C377.3 158.7 376.7 156.7 377.8 156.2C378 156.3 378.7 156.3 379.6 156.2C382.2 148.5 384.8 142.5 385.5 139.5C378.7 140.6 372.4 143.8 373.3 147.2C369.9 147.6 368.9 144.2 370.8 142C373.4 138.7 383.1 137.6 386.6 137.2M420 178.5C419.2 176.6 420.1 173.2 423.3 165.8C426.3 159.1 427.9 156.2 428.4 155.2C427.7 156.2 421 166.8 416 169.1C412.2 170.8 406.3 167.9 405 163.8C403.8 159.9 406 152.4 410.1 144.8C413.9 137.6 420.7 128.8 426.3 127.1C429.8 126 436.3 128.3 437.7 132.5C438.4 134.4 434.9 139.6 432.9 141C431.5 142 430.2 141.2 430.4 140.4C431.5 139.2 434.2 133.4 433.7 131.2C433.1 129.1 431.9 129.1 430.2 129.7C427.5 130.6 420.7 136.6 415.5 146.4C408.9 159 408.4 168.4 413.2 167C418.7 165.5 430.8 148 432.1 145.8C433.6 143.2 438 144.5 438.3 146C436.7 147.4 434.2 153.5 430.2 162.6C425.6 172.9 424.1 179.2 424.7 179.9C423.7 180.6 421 180.6 420 178.5M453.5 130.5C460.2 129.7 469.7 129.4 471.4 128.5C472 128.8 472.5 130.3 470.9 130.8C469.1 131.3 462.5 131.8 456.2 132.4C457 132.9 457.5 133.5 457.5 134C457.2 136.5 455.5 140.4 452.4 148.5C457.7 147.5 463.9 146.2 464.9 146.9C466.2 147.8 464.9 148.8 464.3 148.8C463.5 148.4 456.4 150.1 451.3 151.3C449.1 157 446.7 164.1 446 167.6C452.3 166.3 462.8 163.7 464.2 164.8C465.2 165.6 464.3 166.9 463.8 166.7C463.3 165.6 445.4 169.9 443.3 171.1C441.5 171.3 440.4 169.2 440.7 168.4C440.6 168.3 440.6 168.2 440.6 168.1C440.3 166.2 443.5 157.9 445.5 152.4C444.2 152 443.6 150 444.7 149.5C445 149.6 445.6 149.6 446.5 149.5C449.2 141.7 451.8 135.7 452.5 132.8C445.6 133.9 439.4 137 440.2 140.5C436.8 140.9 435.9 137.5 437.7 135.2C440.4 131.9 450 130.9 453.5 130.5'/%3E%3C/svg%3E") left center / contain no-repeat; } #custom-lp-wrapper.lp-39nov .nv-ge__ua { z-index: 2; position: absolute; right: 6%; top: 34%; display: grid; place-content: center; justify-items: center; width: 86px; aspect-ratio: 1; background: var(--nv-bordeaux); border-radius: 50%; color: #fff; line-height: 1.15; } #custom-lp-wrapper.lp-39nov .nv-ge__ua-k { font-family: var(--nv-serif); font-size: 12px; font-weight: 800; } #custom-lp-wrapper.lp-39nov .nv-ge__ua-v { font-variation-settings: "opsz" 11; font-family: var(--nv-bodoni); font-size: 26px; font-weight: 600; letter-spacing: 0; } #custom-lp-wrapper.lp-39nov .nv-ge__ua-u { font-size: 9px; letter-spacing: 0; } #custom-lp-wrapper.lp-39nov .nv-ge__lead { font-size: 19px; font-weight: 900; line-height: 1.6; letter-spacing: 0.06em; } #custom-lp-wrapper.lp-39nov .nv-ge__born { margin-top: 10px; background: var(--nv-gold); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: var(--nv-serif); font-size: 30px; font-weight: 800; line-height: 1.3; letter-spacing: 0.14em; } /* キャンペーン価格（生成りの札・黄色のマーカー） */ #custom-lp-wrapper.lp-39nov .nv-price { position: relative; margin-top: 20px; padding: 16px 18px 14px; background: var(--nv-cream); border: 3px solid #000; border-radius: 20px; color: var(--nv-bordeaux); } #custom-lp-wrapper.lp-39nov .nv-price__k { display: inline-block; padding: 3px 12px 4px; background: var(--nv-walnut); border-radius: 6px; color: #fff; font-size: 13px; font-weight: 700; letter-spacing: 0.1em; } #custom-lp-wrapper.lp-39nov .nv-price__v { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 4px; margin-top: 4px; line-height: 1; } #custom-lp-wrapper.lp-39nov .nv-price__mark { white-space: nowrap; padding: 0 4px; background: linear-gradient(transparent 66%, var(--nv-marker) 66%, var(--nv-marker) 94%, transparent 94%); } #custom-lp-wrapper.lp-39nov .nv-price__n { font-family: var(--nv-bodoni); font-variation-settings: "opsz" 11; font-size: 46px; font-weight: 700; letter-spacing: -0.01em; } #custom-lp-wrapper.lp-39nov .nv-price__u { margin-left: 2px; font-size: 20px; font-weight: 900; } #custom-lp-wrapper.lp-39nov .nv-price__per { color: #1a1a1a; font-size: 17px; white-space: nowrap; font-weight: 700; } #custom-lp-wrapper.lp-39nov .nv-price__tax { margin-top: 6px; color: #4a3a33; font-size: 12px; font-weight: 700; } #custom-lp-wrapper.lp-39nov .nv-ge__photo2 { margin-top: 20px; overflow: hidden; border-radius: 20px; } #custom-lp-wrapper.lp-39nov .nv-ge__photo2 img { width: 100%; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .nv-ge { margin-top: 40px; padding-bottom: 110px; } #custom-lp-wrapper.lp-39nov .nv-ribbon--ge { top: -36px; margin-bottom: 30px; } #custom-lp-wrapper.lp-39nov .nv-ge__inner { grid-template-columns: 44% 1fr; column-gap: 56px; align-items: start; } #custom-lp-wrapper.lp-39nov .nv-ge__visual { align-self: stretch; border-width: 5px; aspect-ratio: auto; min-height: 560px; } #custom-lp-wrapper.lp-39nov .nv-ge__new-k { font-size: 16px; } #custom-lp-wrapper.lp-39nov .nv-ge__logo { width: 340px; } #custom-lp-wrapper.lp-39nov .nv-ge__photo img { height: 140%; } #custom-lp-wrapper.lp-39nov .nv-ge__ua { width: 118px; top: 30%; } #custom-lp-wrapper.lp-39nov .nv-ge__ua-k { font-size: 15px; } #custom-lp-wrapper.lp-39nov .nv-ge__ua-v { font-size: 36px; } #custom-lp-wrapper.lp-39nov .nv-ge__ua-u { font-size: 11px; } #custom-lp-wrapper.lp-39nov .nv-ge__body { padding-top: 12px; } #custom-lp-wrapper.lp-39nov .nv-ge__lead { font-size: 27px; } #custom-lp-wrapper.lp-39nov .nv-ge__born { margin-top: 14px; font-size: 44px; } #custom-lp-wrapper.lp-39nov .nv-price { margin-top: 28px; padding: 22px 30px 20px; border-width: 5px; } #custom-lp-wrapper.lp-39nov .nv-price__k { font-size: 16px; } #custom-lp-wrapper.lp-39nov .nv-price__n { font-size: 92px; } #custom-lp-wrapper.lp-39nov .nv-price__u { font-size: 38px; } #custom-lp-wrapper.lp-39nov .nv-price__per { font-size: 30px; } #custom-lp-wrapper.lp-39nov .nv-price__tax { font-size: 15px; } #custom-lp-wrapper.lp-39nov .nv-ge__photo2 { margin-top: 28px; } } /* -------------------------------------------------------------------------- S4. 標準仕様（生成りの面） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .nv-spec { padding: 56px 0 50px; background: var(--nv-beige); color: #1a1a1a; } #custom-lp-wrapper.lp-39nov .nv-tabhead { text-align: center; margin-bottom: 26px; } #custom-lp-wrapper.lp-39nov .nv-tabhead__txt { display: inline-block; padding: 8px 26px 9px; background: var(--nv-bordeaux); clip-path: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 0 100%); color: #fff; font-family: var(--nv-serif); font-size: 16px; font-weight: 800; letter-spacing: 0.06em; white-space: nowrap; } #custom-lp-wrapper.lp-39nov .nv-point { position: relative; padding: 22px 16px 20px; background: #fff; border: 3px solid var(--nv-walnut); border-radius: 20px; } #custom-lp-wrapper.lp-39nov .nv-point__head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 16px; } #custom-lp-wrapper.lp-39nov .nv-point__badge { display: inline-flex; align-items: baseline; column-gap: 2px; padding: 3px 12px 4px; background: var(--nv-bordeaux); border-radius: 100vmax; color: #fff; font-family: var(--mh--font-family--en); font-size: 14px; font-weight: 700; font-style: italic; letter-spacing: 0.02em; } #custom-lp-wrapper.lp-39nov .nv-point__no { font-size: 1.35em; } #custom-lp-wrapper.lp-39nov .nv-point__lead { flex-basis: 100%; order: 2; color: var(--nv-walnut); font-size: 13px; font-weight: 700; letter-spacing: 0.06em; } #custom-lp-wrapper.lp-39nov .nv-point__title { order: 3; color: var(--nv-bordeaux); font-size: 19px; font-weight: 900; line-height: 1.45; letter-spacing: 0.04em; } #custom-lp-wrapper.lp-39nov .nv-point--1 .nv-point__title { order: 1; } #custom-lp-wrapper.lp-39nov .nv-kitchens { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 12px; } #custom-lp-wrapper.lp-39nov .nv-kitchen { text-align: center; } #custom-lp-wrapper.lp-39nov .nv-kitchen__ph { overflow: hidden; border-radius: 12px; aspect-ratio: 3 / 2; } #custom-lp-wrapper.lp-39nov .nv-kitchen__ph img { width: 100%; height: 100%; object-fit: cover; } #custom-lp-wrapper.lp-39nov .nv-kitchen__maker { margin-top: 8px; color: #3a2a24; font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: 0.04em; } #custom-lp-wrapper.lp-39nov .nv-kitchen__name { color: var(--nv-bordeaux); font-family: var(--nv-bodoni); font-variation-settings: "opsz" 11; font-size: 19px; font-weight: 600; line-height: 1.25; letter-spacing: 0.1em; } #custom-lp-wrapper.lp-39nov .nv-kitchen__kana { color: var(--nv-bordeaux); font-size: 10px; letter-spacing: 0.1em; } #custom-lp-wrapper.lp-39nov .nv-dish { display: grid; grid-template-columns: auto 1fr 96px; align-items: center; column-gap: 12px; margin-top: 22px; padding-top: 18px; border-top: 2px dotted var(--nv-walnut); } #custom-lp-wrapper.lp-39nov .nv-dish__plus { display: grid; place-items: center; width: 34px; aspect-ratio: 1; background: var(--nv-bordeaux); border-radius: 50%; color: #fff; font-size: 22px; font-weight: 900; line-height: 1; } #custom-lp-wrapper.lp-39nov .nv-dish__txt { color: var(--nv-bordeaux); font-size: 16px; font-weight: 900; line-height: 1.45; } #custom-lp-wrapper.lp-39nov .nv-dish__maker { display: block; margin-top: 2px; color: #3a2a24; font-size: 13px; font-weight: 700; letter-spacing: 0.04em; } #custom-lp-wrapper.lp-39nov .nv-dish__ph { overflow: hidden; border-radius: 50%; border: 3px solid var(--nv-beige); aspect-ratio: 1; } #custom-lp-wrapper.lp-39nov .nv-dish__ph img { width: 100%; height: 100%; object-fit: cover; } #custom-lp-wrapper.lp-39nov .nv-points { display: grid; gap: 16px; margin-top: 16px; } #custom-lp-wrapper.lp-39nov .nv-point__ph { overflow: hidden; border-radius: 12px; aspect-ratio: 16 / 10; } #custom-lp-wrapper.lp-39nov .nv-point__ph img { width: 100%; height: 100%; object-fit: cover; } #custom-lp-wrapper.lp-39nov .nv-point--2 .nv-point__ph img { object-position: 50% 45%; } #custom-lp-wrapper.lp-39nov .nv-point__ph--cut { background: #f4f2ef; } #custom-lp-wrapper.lp-39nov .nv-point__ph--cut img { object-fit: contain; padding: 6% 8%; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .nv-spec { padding: 100px 0 90px; } #custom-lp-wrapper.lp-39nov .nv-tabhead { margin-bottom: 40px; } #custom-lp-wrapper.lp-39nov .nv-tabhead__txt { padding: 12px 54px 13px 46px; font-size: 30px; clip-path: polygon(0 0, 100% 0, calc(100% - 22px) 100%, 0 100%); } #custom-lp-wrapper.lp-39nov .nv-point { padding: 36px 40px 34px; border-width: 4px; } #custom-lp-wrapper.lp-39nov .nv-point__head { margin-bottom: 24px; gap: 8px 18px; } #custom-lp-wrapper.lp-39nov .nv-point__badge { font-size: 18px; padding: 4px 16px 5px; } #custom-lp-wrapper.lp-39nov .nv-point__lead { font-size: 15px; } #custom-lp-wrapper.lp-39nov .nv-point__title { font-size: 26px; } #custom-lp-wrapper.lp-39nov .nv-point--1 .nv-point__title br { display: none; } #custom-lp-wrapper.lp-39nov .nv-kitchens { grid-template-columns: repeat(4, 1fr); gap: 20px; } #custom-lp-wrapper.lp-39nov .nv-kitchen__maker { margin-top: 12px; font-size: 14px; } #custom-lp-wrapper.lp-39nov .nv-kitchen__name { font-size: 24px; } #custom-lp-wrapper.lp-39nov .nv-kitchen__kana { font-size: 11px; } #custom-lp-wrapper.lp-39nov .nv-dish { grid-template-columns: auto auto 130px; justify-content: center; column-gap: 22px; margin-top: 30px; padding-top: 26px; } #custom-lp-wrapper.lp-39nov .nv-dish__plus { width: 46px; font-size: 30px; } #custom-lp-wrapper.lp-39nov .nv-dish__txt { font-size: 24px; } #custom-lp-wrapper.lp-39nov .nv-dish__maker { font-size: 16px; } #custom-lp-wrapper.lp-39nov .nv-points { grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 24px; } } /* -------------------------------------------------------------------------- S5. 性能（白い面） 3枚のカードは「見出しと説明／図版の台／キャプション」の3段。PCでは subgrid で段の高さを揃え、 図版の台の上端と高さが3枚とも同じになる（非対応のブラウザでは各カードの中で上から詰めて並ぶ） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .nv-perf { padding: 54px 0 60px; background: #fff; color: #1a1a1a; } #custom-lp-wrapper.lp-39nov .nv-perf__title { margin-bottom: 26px; color: var(--nv-walnut); font-size: 26px; font-weight: 900; line-height: 1.45; letter-spacing: 0.06em; text-align: center; } #custom-lp-wrapper.lp-39nov .nv-perf__grid { display: grid; gap: 16px; } #custom-lp-wrapper.lp-39nov .nv-pcard { display: grid; align-content: start; padding: 22px 18px 18px; background: #fff; border: 3px solid var(--nv-walnut); border-radius: 20px; } #custom-lp-wrapper.lp-39nov .nv-pcard__head { color: var(--nv-bordeaux); font-size: 20px; font-weight: 900; line-height: 1.4; letter-spacing: 0.04em; } #custom-lp-wrapper.lp-39nov .nv-pcard__sub { display: block; margin-bottom: 2px; color: var(--nv-walnut); font-size: 13px; font-weight: 700; } #custom-lp-wrapper.lp-39nov .nv-pcard__txt { margin-top: 10px; font-size: 15px; line-height: 1.75; } /* 図版の台：3枚とも同じ高さ・同じ角丸 */ #custom-lp-wrapper.lp-39nov .nv-pcard__ph { display: grid; place-items: center; min-height: 200px; margin-top: 16px; overflow: hidden; border-radius: 12px; } #custom-lp-wrapper.lp-39nov .nv-pcard__ph img { width: 100%; } #custom-lp-wrapper.lp-39nov .nv-pcard__ph--sash { padding: 12px 0; background: #f4f4f4; } #custom-lp-wrapper.lp-39nov .nv-pcard__ph--sash img { width: auto; height: 176px; } #custom-lp-wrapper.lp-39nov .nv-pcard__ph--damper { padding: 0 12px; background: #111; } @media (max-width: 767.98px) { /* スマホ：ダンパーは横長の写真なので、黒い台を写真の高さに合わせて詰める */ #custom-lp-wrapper.lp-39nov .nv-pcard__ph--damper { min-height: 0; padding: 26px 12px; } } #custom-lp-wrapper.lp-39nov .nv-pcard__ph--ins { place-items: stretch; align-content: center; padding: 16px 14px; background: var(--nv-cream); } #custom-lp-wrapper.lp-39nov .nv-pcard__cap { margin-top: 8px; color: #5a4a43; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-align: center; } /* 断熱材の厚み（棒の長さ＝厚み。屋根 200mm を全幅とする） */ #custom-lp-wrapper.lp-39nov .nv-layers { display: grid; row-gap: 10px; } #custom-lp-wrapper.lp-39nov .nv-layer { display: grid; grid-template-columns: 62px 1fr; align-items: center; column-gap: 10px; } #custom-lp-wrapper.lp-39nov .nv-layer__part { padding: 4px 0 5px; background: var(--nv-peach); border-radius: 6px; color: var(--nv-walnut-d); font-size: 13px; font-weight: 900; text-align: center; } #custom-lp-wrapper.lp-39nov .nv-layer__mat { position: relative; padding-bottom: 9px; font-size: 13px; font-weight: 700; line-height: 1.4; } #custom-lp-wrapper.lp-39nov .nv-layer__mat::after { content: ""; position: absolute; left: 0; bottom: 0; height: 5px; border-radius: 3px; background: linear-gradient(90deg, #F2A86B, var(--nv-bordeaux)); } #custom-lp-wrapper.lp-39nov .nv-layer--200 .nv-layer__mat::after { width: 100%; } #custom-lp-wrapper.lp-39nov .nv-layer--50 .nv-layer__mat::after { width: 25%; } #custom-lp-wrapper.lp-39nov .nv-layer--40 .nv-layer__mat::after { width: 20%; } #custom-lp-wrapper.lp-39nov .nv-layer__mm { margin-left: 6px; color: var(--nv-bordeaux); font-family: var(--mh--font-family--en); font-size: 1.15em; font-weight: 700; letter-spacing: 0; white-space: nowrap; } #custom-lp-wrapper.lp-39nov .nv-chips { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 18px; } #custom-lp-wrapper.lp-39nov .nv-chip { padding: 10px 6px 11px; background: var(--nv-cream); border: 2px solid var(--nv-walnut); border-radius: 10px; color: var(--nv-walnut-d); font-size: 14px; font-weight: 900; line-height: 1.3; text-align: center; } /* 来場予約（主）とカタログ請求（副） */ #custom-lp-wrapper.lp-39nov .nv-cv { margin-top: 40px; text-align: center; } #custom-lp-wrapper.lp-39nov .nv-cv__lead { color: var(--nv-walnut); font-size: 17px; font-weight: 900; line-height: 1.5; } #custom-lp-wrapper.lp-39nov .nv-btn { max-width: 420px; margin: 16px auto 0; } #custom-lp-wrapper.lp-39nov .nv-btn__in { display: grid; place-items: center; padding: 18px 50px 19px 40px; } #custom-lp-wrapper.lp-39nov .nv-btn__txt { font-size: 20px; } #custom-lp-wrapper.lp-39nov .nv-btn__ico { right: 18px; width: 26px; } #custom-lp-wrapper.lp-39nov .nv-sub { margin-top: 18px; } #custom-lp-wrapper.lp-39nov .nv-sub__link { display: inline-flex; align-items: center; column-gap: 8px; max-width: 100%; min-height: 44px; padding: 8px 20px; border: 2px solid var(--nv-walnut); border-radius: 100vmax; background: #fff; color: var(--nv-walnut); transition: background-color 0.3s ease, color 0.3s ease; } #custom-lp-wrapper.lp-39nov .nv-sub__link:hover { background: var(--nv-walnut); color: #fff; } #custom-lp-wrapper.lp-39nov .nv-sub__txt { font-size: 13px; font-weight: 900; line-height: 1.4; } #custom-lp-wrapper.lp-39nov .nv-sub__tag { flex: none; padding: 1px 8px 2px; background: var(--nv-bordeaux); border-radius: 4px; color: #fff; font-size: 11px; font-weight: 700; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .nv-perf { padding: 100px 0 110px; } #custom-lp-wrapper.lp-39nov .nv-perf__title { margin-bottom: 44px; font-size: 40px; } #custom-lp-wrapper.lp-39nov .nv-pcard { padding: 30px 26px 24px; border-width: 4px; } #custom-lp-wrapper.lp-39nov .nv-pcard__head { font-size: 22px; } #custom-lp-wrapper.lp-39nov .nv-pcard__sub { font-size: 14px; } #custom-lp-wrapper.lp-39nov .nv-pcard__ph { min-height: 220px; margin-top: 18px; } #custom-lp-wrapper.lp-39nov .nv-chips { grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 24px; } #custom-lp-wrapper.lp-39nov .nv-chip { font-size: 17px; padding: 14px 8px 15px; } #custom-lp-wrapper.lp-39nov .nv-cv { margin-top: 64px; } #custom-lp-wrapper.lp-39nov .nv-cv__lead { font-size: 24px; } #custom-lp-wrapper.lp-39nov .nv-btn { max-width: 520px; margin-top: 22px; } #custom-lp-wrapper.lp-39nov .nv-btn__in { padding: 26px 70px 28px 56px; } #custom-lp-wrapper.lp-39nov .nv-btn__txt { font-size: 28px; } #custom-lp-wrapper.lp-39nov .nv-btn__ico { right: 26px; width: 40px; } #custom-lp-wrapper.lp-39nov .nv-sub { margin-top: 24px; } #custom-lp-wrapper.lp-39nov .nv-sub__txt { font-size: 17px; } } /* 768〜1179px：3枚を横に並べると狭いので、カードの中を「文字｜図版」の2列に */ @media (min-width: 768px) and (max-width: 1179.98px) { #custom-lp-wrapper.lp-39nov .nv-pcard { grid-template-columns: 1fr 42%; grid-template-rows: 1fr auto; column-gap: 28px; } #custom-lp-wrapper.lp-39nov .nv-pcard__lead { grid-area: 1 / 1 / 3 / 2; align-self: center; } #custom-lp-wrapper.lp-39nov .nv-pcard__ph { grid-area: 1 / 2 / 2 / 3; margin-top: 0; } #custom-lp-wrapper.lp-39nov .nv-pcard__cap { grid-area: 2 / 2 / 3 / 3; } } @media (min-width: 1180px) { #custom-lp-wrapper.lp-39nov .nv-perf__grid { grid-template-columns: repeat(3, 1fr); grid-template-rows: auto 1fr auto; column-gap: 20px; row-gap: 0; } #custom-lp-wrapper.lp-39nov .nv-pcard { grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; } } /* -------------------------------------------------------------------------- S6. 条件（元ページの青い箱） FVでロゴと賞品を見せているので、ここではくり返さない。帯の見出し＋2つの条件だけ -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign__inner { padding-top: 46px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign__head { padding-bottom: 0; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign-sec:first-of-type { margin-top: 30px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign__inner { padding-top: 100px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign-sec:first-of-type { margin-top: 40px; } } /* -------------------------------------------------------------------------- タブレット（768〜1179px）の調整 -------------------------------------------------------------------------- */ @media (min-width: 768px) and (max-width: 1179.98px) { #custom-lp-wrapper.lp-39nov .nv-mv__limit { right: -84px; width: 104px; } #custom-lp-wrapper.lp-39nov .nv-mv__limit-in { font-size: 17px; } #custom-lp-wrapper.lp-39nov .nv-mv__prize { --pig-h: 96px; width: 86%; padding: 26px 34px 30px 48px; } #custom-lp-wrapper.lp-39nov .nv-mv__present-a, #custom-lp-wrapper.lp-39nov .nv-mv__present-b { font-size: 24px; } #custom-lp-wrapper.lp-39nov .nv-mv__present-n { font-size: 72px; } #custom-lp-wrapper.lp-39nov .nv-mv__present-c { font-size: 42px; } #custom-lp-wrapper.lp-39nov .nv-mv__now { left: -34px; width: 92px; } #custom-lp-wrapper.lp-39nov .nv-mv__now-txt { font-size: 19px; } #custom-lp-wrapper.lp-39nov .nv-mv__only { right: -34px; width: 96px; } #custom-lp-wrapper.lp-39nov .nv-mv__only-txt { font-size: 14px; } #custom-lp-wrapper.lp-39nov .nv-ribbon__txt { font-size: 26px; } #custom-lp-wrapper.lp-39nov .nv-ge__inner { grid-template-columns: 1fr; } #custom-lp-wrapper.lp-39nov .nv-ge__visual { aspect-ratio: 16 / 10; min-height: 0; } #custom-lp-wrapper.lp-39nov .nv-ge__photo img { height: 100%; object-position: 50% 92%; } #custom-lp-wrapper.lp-39nov .nv-ge__logo { width: 280px; } #custom-lp-wrapper.lp-39nov .nv-ge__ua { top: 12%; } } @media (min-width: 768px) and (max-width: 1023.98px) { #custom-lp-wrapper.lp-39nov .nv-kitchens { grid-template-columns: repeat(2, 1fr); } #custom-lp-wrapper.lp-39nov .nv-points .nv-point__title { font-size: 22px; } } /* -------------------------------------------------------------------------- 余白の調整（元ページの値のままだと、11月版ではセクションの間が空きすぎる） -------------------------------------------------------------------------- */ #custom-lp-wrapper.lp-39nov .home-intro__inner { padding-block: 46px 40px; } #custom-lp-wrapper.lp-39nov .nv-ge { padding-bottom: 46px; } #custom-lp-wrapper.lp-39nov .nv-spec { padding: 46px 0 44px; } #custom-lp-wrapper.lp-39nov .nv-perf { padding: 46px 0 52px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign__inner { padding-top: 40px; padding-bottom: 44px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign-sec { margin-top: 36px; padding-top: 0; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign-sec:first-of-type { margin-top: 28px; } @media (min-width: 768px) { #custom-lp-wrapper.lp-39nov .home-intro__inner { padding-block: 80px 64px; } #custom-lp-wrapper.lp-39nov .nv-ge { padding-bottom: 80px; } #custom-lp-wrapper.lp-39nov .nv-spec { padding: 80px 0 72px; } #custom-lp-wrapper.lp-39nov .nv-perf { padding: 80px 0 84px; } #custom-lp-wrapper.lp-39nov .nv-perf__title { margin-bottom: 36px; } #custom-lp-wrapper.lp-39nov .nv-cv { margin-top: 52px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign__inner { padding-top: 80px; padding-bottom: 80px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign-sec { margin-top: 56px; } #custom-lp-wrapper.lp-39nov .nv-camp .home-campaign-sec:first-of-type { margin-top: 40px; } #custom-lp-wrapper.lp-39nov .home-feature__inner { padding-top: 120px; padding-bottom: 120px; } #custom-lp-wrapper.lp-39nov .l-footer-cta__inner { padding-block: 96px 110px; } } /* 動きを減らす設定の尊重 */ @media (prefers-reduced-motion: reduce) { #custom-lp-wrapper.lp-39nov .nv-sub__link { transition: none; } }