@charset "UTF-8"; :root { --bgColorPurple: #e3e0e9; --bgColorPurple02: rgb(119 106 174 / 70%); --colorPurple: #776aae; --fs7: 2.171vw; --fs7-5: 2.326vw; --fs8: 2.480vw; --fs9: 2.791vw; --fs10: 3.101vw; --fs10-5: 3.256vw; --fs11: 3.410vw; --fs12: 3.721vw; --fs13: 4.031vw; --fs14-5: 4.496vw; } .kc-sgl02 { position: relative; margin-block: 15px 0; padding-bottom: 50px; } .kc-sgl02 p em { font-style: normal; font-weight: 700; } .kc-sgl02-content { padding: 4.393vw 4.393vw 10vw; background-color: var(--bgColorPurple); font-family: "Noto Serif JP", serif; } .kc-sgl02-content-inner { padding: 4.651vw; background-color: #fff; } .kc-sgl02 .kc-sgl02-content-introTitle { margin: -5.168vw -4.651vw 2.584vw -9.044vw; } .kc-sgl02 .kc-sgl02-content-introTitle span { display: inline; padding: .25em .7em; background-color: var(--bgColorPurple02); box-decoration-break: clone; -webkit-box-decoration-break: clone; color: #fff; font-size: var(--fs14-5); font-weight: 500; line-height: 2.1; } .kc-sgl02 .kc-sgl02-content-introText { color: var(--colorPurple); font-size: var(--fs9); font-weight: 500; letter-spacing: -.05em; line-height: 1.8; } .kc-sgl02-textBox { margin-top: 11.628vw; } .kc-sgl02-textBox__title { margin-top: 11.628vw; margin-bottom: 1em; color: var(--colorPurple); font-size: var(--fs13); font-weight: 600; } .kc-sgl02-textBox p { margin-block: 1.5em; font-size: var(--fs9); font-weight: 500; line-height: 1.8; } .kc-sgl02-textBox p strong { display: block; color: var(--colorPurple); } .kc-sgl02-textBox a, .kc-sgl02-productBox-point__text a { color: var(--colorPurple); text-decoration: underline; } .kc-sgl02-textBox a:hover, .kc-sgl02-productBox-point__text a:hover { text-decoration: none; } .kc-sgl02-textBox img { margin-block: .5em; } .kc-sgl02-productBox { margin-top: 11.628vw; } .kc-sgl02-productBox__heading { display: flex; align-items: center; flex-wrap: wrap; gap: .25em; margin-bottom: 1em; } .kc-sgl02-productBox__heading--stack { flex-direction: column; align-items: flex-start; gap: 0.4em; } .kc-sgl02-productBox__title { display: inline-block; color: var(--colorPurple); font-size: var(--fs10-5); } .kc-sgl02-productBox__title a { border-bottom: solid 1px var(--colorPurple); } .kc-sgl02-productBox__title a:hover { border-bottom: none; } .kc-sgl02-productBox__note { font-size: var(--fs8); } .kc-sgl02-productBox__text { font-size: var(--fs8); line-height: 1.8; } .kc-sgl02-productBox-point + .kc-sgl02-productBox__text { margin-top: .5em; } .kc-sgl02-productBox-point { margin-top: 6.46vw; padding: 4.393vw 4vw 4.393vw 2.584vw; background-color: #efefef; } .kc-sgl02-productBox-point:first-of-type { margin-top: .5em; } .kc-sgl02-productBox-point__inner { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; } .kc-sgl02-productBox-point__image, .kc-sgl02-productBox-point__body { width: 47.5%; } .kc-sgl02-productBox-point__image { align-content: center; height: 44.15vw; background-color: #fff; text-align: center; } .kc-sgl02-productBox-point__image figure img { width: 85%; } .kc-sgl02-productBox-point__label { width: 30%; } .kc-sgl02-productBox-point__text { font-size: var(--fs7-5); font-weight: 400; } .kc-sgl02-productBox-point__name, .kc-sgl02-productBox-point__subtitle { color: var(--colorPurple); } .kc-sgl02-productBox-point__name { margin-top: .25em; font-size: var(--fs12); } .kc-sgl02-productBox-point__subtitle { font-size: var(--fs8); } .kc-sgl02-productBox-point__subtitle span { display: block; font-size: var(--fs7); } .kc-sgl02-productBox-point__link { display: block; margin-top: 1em; padding: .3em; background-image: linear-gradient(90deg, #beacd0, #a190bf); color: #fff; font-size: var(--fs10-5); font-weight: 700; text-align: center; } .kc-sgl02-content-bottomLink { display: inline-block; margin-top: 1.5em; padding: .25em 2em; background-image: linear-gradient(90deg, #beacd0, #a190bf); border-radius: 30px; color: #fff; filter: drop-shadow(2px 4px 4px rgba(0, 0, 0, 0.2)); font-size: var(--fs10); } .kc-sgl02 .ks-sgltags { padding-inline: 15px; } @media screen and (min-width: 769px) { .kc-sgl02-wrap { background: linear-gradient(100deg, #ede4f7, #ffffff, #ede4f7); margin: 0 calc(50% - 50vw); overflow: clip; background-attachment: fixed; } .kc-sgl02 { max-width: 720px; margin: 0 auto; padding-bottom: 80px; } .kc-sgl02-content { padding: 45px; } .kc-sgl02-content-inner { padding: 48px 24px; } .kc-sgl02 .kc-sgl02-content-introTitle { margin: -53px -48px 26px -69px; } .kc-sgl02 .kc-sgl02-content-introTitle span { font-size: 19px; } .kc-sgl02 .kc-sgl02-content-introText { font-size: 14px; } .kc-sgl02-textBox { margin-top: 45px; } .kc-sgl02-textBox__title { margin-top: 45px; font-size: 18px; } .kc-sgl02-textBox p { font-size: 14px; } .kc-sgl02-productBox { margin-top: 45px; } .kc-sgl02-productBox__title { font-size: 15px; } .kc-sgl02-productBox__note { font-size: 12px; } .kc-sgl02-productBox__text { font-size: 13px; } .kc-sgl02-productBox-point { margin-top: 45px; padding: 16px 20px 16px 10px; } .kc-sgl02-productBox-point__image { height: 265px; } .kc-sgl02-productBox-point__image figure img { width: 84%; } .kc-sgl02-productBox-point__text { font-size: 12px; } .kc-sgl02-productBox-point__name { font-size: 17px; } .kc-sgl02-productBox-point__subtitle { font-size: 13px; } .kc-sgl02-productBox-point__subtitle span { font-size: 12px; } .kc-sgl02-productBox-point__link { font-size: 15px; } .kc-sgl02-content-bottomLink { font-size: 15px; } }