@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap');

/* SP */
/* 共通コンテナの左右余白を、このLPがあるページだけ解除 */
body:has(.bar-lp) { margin: 0; }
#wrapper:has(.bar-lp), #bg_wrapper:has(.bar-lp) { width: 100%; max-width: none; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
#wrapper2.container:has(.bar-lp) { width: 100%; max-width: none; min-width: 0; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; background: transparent; }
.bar-lp { width: 100%; margin: 0 auto; color: #111; background: #e5ce83; font-family: 'Noto Sans', 'Noto Sans Japanese', sans-serif; font-size: 3.2vw; line-height: 1.65; overflow-wrap: anywhere; }
.bar-lp *, .bar-lp *::before, .bar-lp *::after { box-sizing: border-box; }
.bar-lp h1, .bar-lp h2, .bar-lp p, .bar-lp ul, .bar-lp dl, .bar-lp dd { margin: 0; padding: 0; }
.bar-lp ul { list-style: none; }
.bar-lp img { display: block; width: 100%; max-width: 100%; height: auto; border: 0; }
.bar-lp a { color: inherit; text-decoration: none; }
.bar-lp a[href] { transition: opacity .2s; }
.bar-lp a[href]:hover { opacity: .75; }
.bar-lp a:focus-visible { outline: 3px solid #007ac3; outline-offset: 4px; }
.lp-inner { width: 100%; margin: 0 auto; background: #e5ce83; }
.lp-kv { line-height: 0; }
.lp-top-actions { padding: 6% 0 5%; background: #f0e8d2; }
.lp-entry { width: 84%; margin: 0 auto; }
.lp-entry-link { display: block; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.bar-lp .lp-entry-link:hover, .bar-lp .lp-entry-link:focus-visible { opacity: .75; }
.bar-lp .lp-entry-link:active { opacity: .6; }
.lp-entry-link[href] { cursor: pointer; }
.lp-anchor { display: block; width: 23.2%; margin: 4% auto 0; }
.lp-ribbon { line-height: 0; }
.lp-overview { background: #e5ce83; }
.lp-targets { padding-top: 5%; padding-bottom: calc(3% + .6rem); background: #fff; scroll-margin-top: 0; }
.lp-targets h2 { width: 93.2%; margin: 0 auto; }
.lp-targets-caption { padding: 1% 0 4% !important; text-align: center; font-weight: 700; }
.bar-lp .lp-targets-note { padding: 3% 4%; font-size: .8rem; line-height: 1.5; }
.lp-guide { padding: 5% 3% 6%; background: #aa9359; }
.lp-period { padding: 7% 7%; margin-bottom: 7%; border-radius: 4vw; background: #837045; color: #fff; }
.lp-period { line-height: 1.5; }
.lp-period dt { font-size: .9rem; font-weight: 700; }
.bar-lp .lp-period dd { font-size: .8rem; font-weight: 400; padding-bottom: 2vh; }
.lp-period ul { font-size: .8rem; font-weight: 400; line-height: 1.5; }
.lp-period li { padding-left: 1em; text-indent: -1em; }
.lp-flow { padding: 6% 4% 4%; border-radius: 4vw; background: #fff; }
.lp-flow h2 { width: 51.2%; margin: 0 auto 5%; }
.lp-flow p { margin-bottom: 4%; font-size: .92em; }
.lp-download { margin-top: 7%; padding: 7% 7%; background: #fff; border-radius: 4vw; text-align: center; }
.lp-download p { margin-bottom: 5%; font-size: .9em; font-weight: 700; }
.lp-app-links { display: flex; justify-content: center; align-items: center; gap: 4%; }
.lp-app-links a:first-child { flex: 267; }
.lp-app-links a:last-child { flex: 243; }
.lp-second-entry { padding: 6% 0 7%; background: #fff; }
.lp-products { padding-bottom: 1%; background: #e5ce83; }
.bar-lp .lp-products .lp-ribbon { margin-bottom: 4%; background: #fff; }
.lp-product { width: 94%; margin: 0 auto 5%; padding: 6.3%; border-radius: 4vw; background: #fff; }
.bar-lp .lp-manufacturer { margin: 0 0 3%; padding: 0; color: #111; font-family: inherit; font-size: 4vw; font-weight: bold !important; line-height: 1.4; text-align: left; }
.lp-product-link { display: block; width: 71%; padding: 3% 7%; margin: 6% auto 0; background: #c09d35; border-radius: 100px; }
.lp-product-2 .lp-product-link { background: #005c9f; }
.lp-product-3 .lp-product-link { background: #468130; }
.lp-product-4 .lp-product-link { background: #9a701e; }
.lp-product-5 .lp-product-link { background: #bf1220; }
.lp-notice { padding: 7% 4% 12%; background: #fff; font-size: 2.65vw; line-height: 1.65; }
.lp-notice .noticettl { margin: 0 0 3%; text-align: center; font-size: 1.3em; font-weight: 700; }
.lp-notice .noticetxt, .lp-notice .noticetxt2 { padding: 0 0 7%; }
.lp-notice .noticetxt li { position: relative; padding-left: 1.3em; }
.lp-notice .noticetxt li::before { content: attr(data-mark); position: absolute; left: 0; }
.bar-lp .lp-notice .blue-links a, .bar-lp .lp-notice .blue-links a:hover, .bar-lp .lp-notice .blue-links a:focus { color: #0878b2; text-decoration: none; }
.bar-lp .lp-contact-title { margin: 0 0 3vh; padding: 2%; background: #ede3c8; text-align: center; font-size: 1rem; font-weight: 400; line-height: 1.5; }
.lp-chat { display: block; width: 83%; margin: 0 auto; }
@media (prefers-reduced-motion: reduce) { .bar-lp a[href] { transition: none; } }

/* PC */
@media screen and (min-width: 750px) {
  #bg_wrapper:has(.bar-lp), .bar-lp { background-color: #e5dfcd; background-image: url('../img/bg.png'); background-repeat: repeat; background-position: center top; background-size: 500px 300px; background-attachment: fixed; }
  .bar-lp { position: relative; left: auto; width: 100%; margin: 0; font-size: 24px; }
  .lp-inner { width: 750px; }
  .lp-period, .lp-flow, .lp-download, .lp-product { border-radius: 28px; }
  .lp-period dt { font-size: 1.4rem; }
  .bar-lp .lp-period dd { font-size: 1.2rem; }
  .lp-period ul { font-size: 1rem; }
  .bar-lp .lp-manufacturer { font-size: 28px; }
  .lp-targets { padding-bottom: calc(3% + .75rem); }
  .bar-lp .lp-targets-note { font-size: 1rem; }
  .lp-notice { font-size: 20px; }
  .bar-lp .lp-contact-title { font-size: 1.4rem; margin-bottom: 5vh; }
}