/* PC design values; generated responsive output is useful-items.css. */
.fs-body-category-useful-items #left-nav { width:100%; max-width:1440px; margin:auto; gap:50px; }
.fs-body-category-useful-items #left-nav .left-flex { flex:1; min-width:0; max-width:1140px; }
.fs-body-category-useful-items #left-nav .side-navi { flex:0 0 250px; }
.fs-body-category-useful-items .left-flex > .fs-c-subgroup {  }
.p-useful-renewal { color:#333; font-family:'Noto Sans JP',sans-serif; font-size:16px; line-height:1.9; width:100%; margin-top: 50px; }
.p-useful-renewal *,.p-useful-renewal *::before,.p-useful-renewal *::after { box-sizing:border-box; }
.p-useful-renewal p,.p-useful-renewal h2,.p-useful-renewal h3,.p-useful-renewal ul,.p-useful-renewal ol { margin:0; padding:0; }
.p-useful-renewal a { color:inherit; text-decoration:none; }
.p-useful-renewal img { display:block; max-width:100%; }
.p-useful-renewal__section { padding:60px 0; background:white; scroll-margin-top:180px; }
.p-useful-renewal__section--pale { background:#f2faf5; }
.p-useful-renewal__inner { width:calc(100% - 60px); margin:auto; }
.p-useful-renewal__heading { text-align:center; color:#50320b; }
.p-useful-renewal__heading > p { display:table; margin:auto; background:#64cc82; color:white; padding:0 20px; font-family:Nunito,sans-serif; font-size:22px; font-weight:700; letter-spacing:.1em; line-height:34px; }
.p-useful-renewal__heading h2 { margin:18px 0 22px; font-size:26px; font-weight:400; line-height:1.6; letter-spacing:.02em; }
.p-useful-renewal__icon { width:62px; height:62px; margin:auto; }
.p-useful-renewal__icon img { width:100%; height:auto; }
.p-useful-renewal__sp { display:none; }
.p-useful-renewal__lead { text-align:center; margin:30px auto 70px!important; }
.p-useful-renewal__purpose-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 30px; }
.p-useful-renewal__purpose { position:relative; background:white; display:flex; flex-direction:column; border:1px solid #dff3e6; }
.p-useful-renewal__purpose > img { width:100%; aspect-ratio:1050/300; height:auto; object-fit:cover; }
.p-useful-renewal__badge { position:absolute; top:0; left:50%; transform:translate(-50%,-50%); width:200px; border-radius:40px; background:#64cc82; color:white; padding:8px 15px!important; font:500 18px/1.6 Nunito,'Noto Sans JP',sans-serif; text-align:center; letter-spacing:.1em; z-index:1; }
.p-useful-renewal__badge::after { content:""; position:absolute; top:100%; left:50%; margin-left:-7px; border-left:7px solid transparent; border-right:7px solid transparent; border-top:9px solid #64cc82; }
.p-useful-renewal__purpose-copy { padding:26px 30px 28px; flex:1; display:flex; flex-direction:column; }
.p-useful-renewal__purpose h3 { display:flex; align-items:center; justify-content:center; gap:22px; color:#50320b; font-size:24px; font-weight:400; line-height:1.5; margin-bottom:20px; }
.p-useful-renewal__purpose h3::before,.p-useful-renewal__purpose h3::after { content:""; display:block; flex:none; width:16px; height:30px; background:url('../img/useful-items/renewal/title-chevron.svg') center/contain no-repeat; }
.p-useful-renewal__purpose h3::before { transform:rotate(180deg); }
.p-useful-renewal__purpose-copy > p { text-align:center; font-size:16px; line-height:1.65; }
.p-useful-renewal__purpose ul { list-style:none; display:grid; grid-template-rows:repeat(3,auto); grid-auto-flow:column; grid-template-columns:1fr 1fr; gap:8px 20px; padding:20px 0 28px; font-size:14px; color:#583c17; letter-spacing:.08em; }
.p-useful-renewal__button { display:flex; align-items:center; justify-content:center; position:relative; background:#846f54; color:white!important; border-radius:3px; padding:15px 42px; min-height:60px; text-align:center; line-height:1.6; font-size:18px; letter-spacing:.1em; }
.p-useful-renewal__button::before { content:""; position:absolute; inset:0 auto 0 0; width:0; border-radius:inherit; background:rgba(80,50,11,.9); transition:width .3s; }
.p-useful-renewal__button::after { content:""; position:absolute; right:15px; top:50%; transform:translateY(-50%); width:16px; height:13px; background:url('../img/useful-items/renewal/arrow-right-white.svg') center/contain no-repeat; }
.p-useful-renewal__button span { position:relative; z-index:1; }
.p-useful-renewal__purpose .p-useful-renewal__button { margin-top:auto; }
.p-useful-renewal__compare-nav { display:flex; gap:10px; margin-bottom:30px; }
.p-useful-renewal__compare-nav > * { display:flex; align-items:center; justify-content:center; width:180px; min-height:50px; border:1px solid #ccc; border-radius:2px; padding:8px 20px; text-align:center; }
#useful-compare .p-useful-renewal__compare-nav a[aria-current] { background:#846f54; border-color:#846f54; color:white!important; }
.p-useful-renewal__compare-nav [aria-disabled] { color:#666; }
#useful-compare .p-useful-renewal__inner { width:100%; }
.p-useful-renewal__table-scroll { width:100%; overflow:auto; overscroll-behavior-x:contain; }
.p-useful-renewal table { border-collapse:collapse; width:100%; min-width:1080px; table-layout:fixed; font-size:16px; line-height:1.8; background:white; }
.p-useful-renewal th,.p-useful-renewal td { border:0; border-bottom:1px solid #ddd; padding:12px 4px; height:90px; text-align:center; vertical-align:middle; font-weight:400; }
.p-useful-renewal thead { background:#dff3e6; }
.p-useful-renewal thead th { padding:17px 6px; }
.p-useful-renewal tbody th { background:#f7f7f7; }
.p-useful-renewal thead th:first-child { width:17.54%; }
.p-useful-renewal thead th:nth-child(2) { width:9%; }
.p-useful-renewal thead th:nth-child(3) { width:9.5%; }
.p-useful-renewal thead th:nth-child(4) { width:11%; }
.p-useful-renewal thead th:nth-child(5) { width:12%; }
.p-useful-renewal thead th:nth-child(6) { width:10%; }
.p-useful-renewal thead th:nth-child(7) { width:9%; }
.p-useful-renewal thead th:nth-child(8) { width:13%; }
.p-useful-renewal thead th:last-child { width:8.96%; }
.p-useful-renewal table { letter-spacing:0; }
.p-useful-renewal td { white-space:nowrap; }
#useful-compare table a { color:#64cc82!important; white-space:nowrap; }
.p-useful-renewal__tag { display:inline-block; padding:7px 14px; border-radius:2px; white-space:nowrap; }
.p-useful-renewal__tag--adjust { background:#bdcac2; }
.p-useful-renewal__tag--post { background:#ebe1ac; }
.p-useful-renewal__tag--base { background:#e1cfaf; }
.p-useful-renewal__note { font-size:12px; line-height:1.6; color:#777; margin-top:20px!important; }
.p-useful-renewal__note a { text-decoration:underline; }
.p-useful-renewal__steps { list-style:none; display:grid; gap:40px; }
.p-useful-renewal__steps li { display:grid; grid-template-columns:250px 1fr; align-items:center; gap:25px; position:relative; border:1px solid #64cc82; border-radius:3px; background:white; min-height:130px; padding:32px 30px; }
.p-useful-renewal__steps .p-useful-renewal__badge { left:30px; transform:translateY(-50%); width:180px; }
.p-useful-renewal__steps h3 { color:#846f54; font-size:20px; line-height:1.8; font-weight:500; }
#useful-choose .p-useful-renewal__button { max-width:470px; margin:50px auto 0; }
.p-useful-renewal__heading--leaf > img { width:25px; height:auto; margin:0 auto 10px; }
.p-useful-renewal__heading--leaf h2 { margin:0 0 4px; }
.p-useful-renewal__heading--leaf > p { background:none; color:#50320b; font-size:22px; font-weight:400; padding:0; }
#useful-works .p-useful-renewal__inner { width:100%; }
.p-useful-renewal__carousel { position:relative; }
.p-useful-renewal__works { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px 28px; }
.p-useful-renewal__work { min-width:0; }
.p-useful-renewal__work > img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.p-useful-renewal__species { display:table; padding:0 8px!important; margin:18px 0 10px!important; background:#64cc82; color:white; font-size:14px; line-height:1.6; font-weight:500; }
.p-useful-renewal__work h3 { font-size:18px; line-height:2; font-weight:500; margin-bottom:8px; }
.p-useful-renewal__work > p:last-child { font-size:16px; line-height:1.8; }
.p-useful-renewal__work a:hover { text-decoration:underline; }
.p-useful-renewal__carousel-controls { display:none; }
#useful-works .p-useful-renewal__button { width:400px; margin:50px auto 0; }
.p-useful-renewal__columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.p-useful-renewal__columns > a { padding:24px; background:white; border:1px solid #dff3e6; }
.p-useful-renewal__columns h3 { font-size:18px; font-weight:500; color:#50320b; margin-bottom:12px; }
.p-useful-renewal__columns p { font-size:14px; }
.p-useful-renewal__sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.p-useful-renewal a:focus-visible,.p-useful-renewal button:focus-visible,.p-useful-renewal [tabindex]:focus-visible { outline:3px solid #245f39; outline-offset:4px; }
@media(hover:hover) { .p-useful-renewal__button:hover::before { width:100%; } .p-useful-renewal__columns a:hover { border-color:#64cc82; } }
@media(prefers-reduced-motion:reduce) { .p-useful-renewal *,.p-useful-renewal *::before { transition:none!important; scroll-behavior:auto!important; } }
/* Related columns: Figma 3:6516. */
#useful-columns { background:white; }
#useful-columns .p-useful-renewal__inner { width:100%; }
#useful-columns .p-useful-renewal__heading h2 { font-weight:300; letter-spacing:.08em; }
#useful-columns .p-useful-renewal__lead { margin:30px auto 50px!important; }
#useful-columns .p-useful-renewal__columns { grid-template-columns:repeat(4,minmax(0,1fr)); gap:36px 28px; align-items:start; }
#useful-columns .p-useful-renewal__columns > a { display:block; padding:0; border:0; background:none; }
#useful-columns .p-useful-renewal__columns img { width:100%; height:auto; aspect-ratio:263/175; object-fit:cover; }
#useful-columns .p-useful-renewal__columns h3 { font-size:16px; line-height:1.75; font-weight:400; color:#333; margin:18px 0 10px; }
#useful-columns .p-useful-renewal__column-caption { font-size:14px; line-height:22px; }
#useful-columns .p-useful-renewal__column-read { display:flex; justify-content:flex-end; align-items:center; gap:8px; font-size:16px; line-height:1.5; color:#64cc82; margin-top:12px; }
#useful-columns .p-useful-renewal__column-read::after { content:''; display:block; width:14px; height:13px; background:url('../img/useful-items/renewal/arrow-right-green.svg') center/contain no-repeat; }
#useful-columns .p-useful-renewal__button { width:350px; margin:70px auto 0; font-weight:400; }
@media(hover:hover) { #useful-columns .p-useful-renewal__columns > a:hover h3 { text-decoration:underline; } }

#useful-choose .p-useful-renewal__heading > p { text-transform:lowercase; }

@media (768px < width < 1440px) {
/* PC design values; generated responsive output is useful-items.css. */
.fs-body-category-useful-items #left-nav { width:100%; max-width:calc(100vw / 1440 * 1440); margin:auto; gap:calc(100vw / 1440 * 50); }
.fs-body-category-useful-items #left-nav .left-flex { flex:1; min-width:0; max-width:calc(100vw / 1440 * 1140); }
.fs-body-category-useful-items #left-nav .side-navi { flex:0 0 calc(100vw / 1440 * 250); }
.fs-body-category-useful-items .left-flex > .fs-c-subgroup {  }
.p-useful-renewal { color:#333; font-family:'Noto Sans JP',sans-serif; font-size:calc(100vw / 1440 * 16); line-height:1.9; width:100%; margin-top: calc(100vw / 1440 * 50); }
.p-useful-renewal *,.p-useful-renewal *::before,.p-useful-renewal *::after { box-sizing:border-box; }
.p-useful-renewal p,.p-useful-renewal h2,.p-useful-renewal h3,.p-useful-renewal ul,.p-useful-renewal ol { margin:0; padding:0; }
.p-useful-renewal a { color:inherit; text-decoration:none; }
.p-useful-renewal img { display:block; max-width:100%; }
.p-useful-renewal__section { padding:calc(100vw / 1440 * 60) 0; background:white; scroll-margin-top:calc(100vw / 1440 * 180); }
.p-useful-renewal__section--pale { background:#f2faf5; }
.p-useful-renewal__inner { width:calc(100% - calc(100vw / 1440 * 60)); margin:auto; }
.p-useful-renewal__heading { text-align:center; color:#50320b; }
.p-useful-renewal__heading > p { display:table; margin:auto; background:#64cc82; color:white; padding:0 calc(100vw / 1440 * 20); font-family:Nunito,sans-serif; font-size:calc(100vw / 1440 * 22); font-weight:700; letter-spacing:.1em; line-height:calc(100vw / 1440 * 34); }
.p-useful-renewal__heading h2 { margin:calc(100vw / 1440 * 18) 0 calc(100vw / 1440 * 22); font-size:calc(100vw / 1440 * 26); font-weight:400; line-height:1.6; letter-spacing:.02em; }
.p-useful-renewal__icon { width:calc(100vw / 1440 * 62); height:calc(100vw / 1440 * 62); margin:auto; }
.p-useful-renewal__icon img { width:100%; height:auto; }
.p-useful-renewal__sp { display:none; }
.p-useful-renewal__lead { text-align:center; margin:calc(100vw / 1440 * 30) auto calc(100vw / 1440 * 70)!important; }
.p-useful-renewal__purpose-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:calc(100vw / 1440 * 48) calc(100vw / 1440 * 30); }
.p-useful-renewal__purpose { position:relative; background:white; display:flex; flex-direction:column; border:calc(100vw / 1440 * 1) solid #dff3e6; }
.p-useful-renewal__purpose > img { width:100%; aspect-ratio:1050/300; height:auto; object-fit:cover; }
.p-useful-renewal__badge { position:absolute; top:0; left:50%; transform:translate(-50%,-50%); width:calc(100vw / 1440 * 200); border-radius:calc(100vw / 1440 * 40); background:#64cc82; color:white; padding:calc(100vw / 1440 * 8) calc(100vw / 1440 * 15)!important; font:500 calc(100vw / 1440 * 18)/1.6 Nunito,'Noto Sans JP',sans-serif; text-align:center; letter-spacing:.1em; z-index:1; }
.p-useful-renewal__badge::after { content:""; position:absolute; top:100%; left:50%; margin-left:calc(100vw / 1440 * -7); border-left:calc(100vw / 1440 * 7) solid transparent; border-right:calc(100vw / 1440 * 7) solid transparent; border-top:calc(100vw / 1440 * 9) solid #64cc82; }
.p-useful-renewal__purpose-copy { padding:calc(100vw / 1440 * 26) calc(100vw / 1440 * 30) calc(100vw / 1440 * 28); flex:1; display:flex; flex-direction:column; }
.p-useful-renewal__purpose h3 { display:flex; align-items:center; justify-content:center; gap:calc(100vw / 1440 * 22); color:#50320b; font-size:calc(100vw / 1440 * 24); font-weight:400; line-height:1.5; margin-bottom:calc(100vw / 1440 * 20); }
.p-useful-renewal__purpose h3::before,.p-useful-renewal__purpose h3::after { content:""; display:block; flex:none; width:calc(100vw / 1440 * 16); height:calc(100vw / 1440 * 30); background:url('../img/useful-items/renewal/title-chevron.svg') center/contain no-repeat; }
.p-useful-renewal__purpose h3::before { transform:rotate(180deg); }
.p-useful-renewal__purpose-copy > p { text-align:center; font-size:calc(100vw / 1440 * 16); line-height:1.65; }
.p-useful-renewal__purpose ul { list-style:none; display:grid; grid-template-rows:repeat(3,auto); grid-auto-flow:column; grid-template-columns:1fr 1fr; gap:calc(100vw / 1440 * 8) calc(100vw / 1440 * 20); padding:calc(100vw / 1440 * 20) 0 calc(100vw / 1440 * 28); font-size:calc(100vw / 1440 * 14); color:#583c17; letter-spacing:.08em; }
.p-useful-renewal__button { display:flex; align-items:center; justify-content:center; position:relative; background:#846f54; color:white!important; border-radius:calc(100vw / 1440 * 3); padding:calc(100vw / 1440 * 15) calc(100vw / 1440 * 42); min-height:calc(100vw / 1440 * 60); text-align:center; line-height:1.6; font-size:calc(100vw / 1440 * 18); letter-spacing:.1em; }
.p-useful-renewal__button::before { content:""; position:absolute; inset:0 auto 0 0; width:0; border-radius:inherit; background:rgba(80,50,11,.9); transition:width .3s; }
.p-useful-renewal__button::after { content:""; position:absolute; right:calc(100vw / 1440 * 15); top:50%; transform:translateY(-50%); width:calc(100vw / 1440 * 16); height:calc(100vw / 1440 * 13); background:url('../img/useful-items/renewal/arrow-right-white.svg') center/contain no-repeat; }
.p-useful-renewal__button span { position:relative; z-index:1; }
.p-useful-renewal__purpose .p-useful-renewal__button { margin-top:auto; }
.p-useful-renewal__compare-nav { display:flex; gap:calc(100vw / 1440 * 10); margin-bottom:calc(100vw / 1440 * 30); }
.p-useful-renewal__compare-nav > * { display:flex; align-items:center; justify-content:center; width:calc(100vw / 1440 * 180); min-height:calc(100vw / 1440 * 50); border:calc(100vw / 1440 * 1) solid #ccc; border-radius:calc(100vw / 1440 * 2); padding:calc(100vw / 1440 * 8) calc(100vw / 1440 * 20); text-align:center; }
#useful-compare .p-useful-renewal__compare-nav a[aria-current] { background:#846f54; border-color:#846f54; color:white!important; }
.p-useful-renewal__compare-nav [aria-disabled] { color:#666; }
#useful-compare .p-useful-renewal__inner { width:100%; }
.p-useful-renewal__table-scroll { width:100%; overflow:auto; overscroll-behavior-x:contain; }
.p-useful-renewal table { border-collapse:collapse; width:100%; min-width:calc(100vw / 1440 * 1080); table-layout:fixed; font-size:calc(100vw / 1440 * 16); line-height:1.8; background:white; }
.p-useful-renewal th,.p-useful-renewal td { border:0; border-bottom:calc(100vw / 1440 * 1) solid #ddd; padding:calc(100vw / 1440 * 12) calc(100vw / 1440 * 4); height:calc(100vw / 1440 * 90); text-align:center; vertical-align:middle; font-weight:400; }
.p-useful-renewal thead { background:#dff3e6; }
.p-useful-renewal thead th { padding:calc(100vw / 1440 * 17) calc(100vw / 1440 * 6); }
.p-useful-renewal tbody th { background:#f7f7f7; }
.p-useful-renewal thead th:first-child { width:17.54%; }
.p-useful-renewal thead th:nth-child(2) { width:9%; }
.p-useful-renewal thead th:nth-child(3) { width:9.5%; }
.p-useful-renewal thead th:nth-child(4) { width:11%; }
.p-useful-renewal thead th:nth-child(5) { width:12%; }
.p-useful-renewal thead th:nth-child(6) { width:10%; }
.p-useful-renewal thead th:nth-child(7) { width:9%; }
.p-useful-renewal thead th:nth-child(8) { width:13%; }
.p-useful-renewal thead th:last-child { width:8.96%; }
.p-useful-renewal table { letter-spacing:0; }
.p-useful-renewal td { white-space:nowrap; }
#useful-compare table a { color:#64cc82!important; white-space:nowrap; }
.p-useful-renewal__tag { display:inline-block; padding:calc(100vw / 1440 * 7) calc(100vw / 1440 * 14); border-radius:calc(100vw / 1440 * 2); white-space:nowrap; }
.p-useful-renewal__tag--adjust { background:#bdcac2; }
.p-useful-renewal__tag--post { background:#ebe1ac; }
.p-useful-renewal__tag--base { background:#e1cfaf; }
.p-useful-renewal__note { font-size:calc(100vw / 1440 * 12); line-height:1.6; color:#777; margin-top:calc(100vw / 1440 * 20)!important; }
.p-useful-renewal__note a { text-decoration:underline; }
.p-useful-renewal__steps { list-style:none; display:grid; gap:calc(100vw / 1440 * 40); }
.p-useful-renewal__steps li { display:grid; grid-template-columns:calc(100vw / 1440 * 250) 1fr; align-items:center; gap:calc(100vw / 1440 * 25); position:relative; border:calc(100vw / 1440 * 1) solid #64cc82; border-radius:calc(100vw / 1440 * 3); background:white; min-height:calc(100vw / 1440 * 130); padding:calc(100vw / 1440 * 32) calc(100vw / 1440 * 30); }
.p-useful-renewal__steps .p-useful-renewal__badge { left:calc(100vw / 1440 * 30); transform:translateY(-50%); width:calc(100vw / 1440 * 180); }
.p-useful-renewal__steps h3 { color:#846f54; font-size:calc(100vw / 1440 * 20); line-height:1.8; font-weight:500; }
#useful-choose .p-useful-renewal__button { max-width:calc(100vw / 1440 * 470); margin:calc(100vw / 1440 * 50) auto 0; }
.p-useful-renewal__heading--leaf > img { width:calc(100vw / 1440 * 25); height:auto; margin:0 auto calc(100vw / 1440 * 10); }
.p-useful-renewal__heading--leaf h2 { margin:0 0 calc(100vw / 1440 * 4); }
.p-useful-renewal__heading--leaf > p { background:none; color:#50320b; font-size:calc(100vw / 1440 * 22); font-weight:400; padding:0; }
#useful-works .p-useful-renewal__inner { width:100%; }
.p-useful-renewal__carousel { position:relative; }
.p-useful-renewal__works { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:calc(100vw / 1440 * 36) calc(100vw / 1440 * 28); }
.p-useful-renewal__work { min-width:0; }
.p-useful-renewal__work > img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.p-useful-renewal__species { display:table; padding:0 calc(100vw / 1440 * 8)!important; margin:calc(100vw / 1440 * 18) 0 calc(100vw / 1440 * 10)!important; background:#64cc82; color:white; font-size:calc(100vw / 1440 * 14); line-height:1.6; font-weight:500; }
.p-useful-renewal__work h3 { font-size:calc(100vw / 1440 * 18); line-height:2; font-weight:500; margin-bottom:calc(100vw / 1440 * 8); }
.p-useful-renewal__work > p:last-child { font-size:calc(100vw / 1440 * 16); line-height:1.8; }
.p-useful-renewal__work a:hover { text-decoration:underline; }
.p-useful-renewal__carousel-controls { display:none; }
#useful-works .p-useful-renewal__button { width:calc(100vw / 1440 * 400); margin:calc(100vw / 1440 * 50) auto 0; }
.p-useful-renewal__columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:calc(100vw / 1440 * 20); }
.p-useful-renewal__columns > a { padding:calc(100vw / 1440 * 24); background:white; border:calc(100vw / 1440 * 1) solid #dff3e6; }
.p-useful-renewal__columns h3 { font-size:calc(100vw / 1440 * 18); font-weight:500; color:#50320b; margin-bottom:calc(100vw / 1440 * 12); }
.p-useful-renewal__columns p { font-size:calc(100vw / 1440 * 14); }
.p-useful-renewal__sr-only { position:absolute; width:calc(100vw / 1440 * 1); height:calc(100vw / 1440 * 1); overflow:hidden; clip-path:inset(50%); }
.p-useful-renewal a:focus-visible,.p-useful-renewal button:focus-visible,.p-useful-renewal [tabindex]:focus-visible { outline:calc(100vw / 1440 * 3) solid #245f39; outline-offset:calc(100vw / 1440 * 4); }
@media(hover:hover) { .p-useful-renewal__button:hover::before { width:100%; } .p-useful-renewal__columns a:hover { border-color:#64cc82; } }
@media(prefers-reduced-motion:reduce) { .p-useful-renewal *,.p-useful-renewal *::before { transition:none!important; scroll-behavior:auto!important; } }
/* Related columns: Figma 3:6516. */
#useful-columns { background:white; }
#useful-columns .p-useful-renewal__inner { width:100%; }
#useful-columns .p-useful-renewal__heading h2 { font-weight:300; letter-spacing:.08em; }
#useful-columns .p-useful-renewal__lead { margin:calc(100vw / 1440 * 30) auto calc(100vw / 1440 * 50)!important; }
#useful-columns .p-useful-renewal__columns { grid-template-columns:repeat(4,minmax(0,1fr)); gap:calc(100vw / 1440 * 36) calc(100vw / 1440 * 28); align-items:start; }
#useful-columns .p-useful-renewal__columns > a { display:block; padding:0; border:0; background:none; }
#useful-columns .p-useful-renewal__columns img { width:100%; height:auto; aspect-ratio:263/175; object-fit:cover; }
#useful-columns .p-useful-renewal__columns h3 { font-size:calc(100vw / 1440 * 16); line-height:1.75; font-weight:400; color:#333; margin:calc(100vw / 1440 * 18) 0 calc(100vw / 1440 * 10); }
#useful-columns .p-useful-renewal__column-caption { font-size:calc(100vw / 1440 * 14); line-height:calc(100vw / 1440 * 22); }
#useful-columns .p-useful-renewal__column-read { display:flex; justify-content:flex-end; align-items:center; gap:calc(100vw / 1440 * 8); font-size:calc(100vw / 1440 * 16); line-height:1.5; color:#64cc82; margin-top:calc(100vw / 1440 * 12); }
#useful-columns .p-useful-renewal__column-read::after { content:''; display:block; width:calc(100vw / 1440 * 14); height:calc(100vw / 1440 * 13); background:url('../img/useful-items/renewal/arrow-right-green.svg') center/contain no-repeat; }
#useful-columns .p-useful-renewal__button { width:calc(100vw / 1440 * 350); margin:calc(100vw / 1440 * 70) auto 0; font-weight:400; }
@media(hover:hover) { #useful-columns .p-useful-renewal__columns > a:hover h3 { text-decoration:underline; } }

#useful-choose .p-useful-renewal__heading > p { text-transform:lowercase; }

}
@media (max-width:768px) {
/* PC design values; generated responsive output is useful-items.css. */
.fs-body-category-useful-items #left-nav { width:100%; max-width:calc(100vw / 750 * 2880); margin:auto; gap:calc(100vw / 750 * 100); }
.fs-body-category-useful-items #left-nav .left-flex { flex:1; min-width:0; max-width:calc(100vw / 750 * 2280); }
.fs-body-category-useful-items #left-nav .side-navi { flex:0 0 calc(100vw / 750 * 500); }
.fs-body-category-useful-items .left-flex > .fs-c-subgroup {  }
.p-useful-renewal { color:#333; font-family:'Noto Sans JP',sans-serif; font-size:calc(100vw / 750 * 32); line-height:1.9; width:100%; margin-top: calc(100vw / 750 * 50);}
.p-useful-renewal *,.p-useful-renewal *::before,.p-useful-renewal *::after { box-sizing:border-box; }
.p-useful-renewal p,.p-useful-renewal h2,.p-useful-renewal h3,.p-useful-renewal ul,.p-useful-renewal ol { margin:0; padding:0; }
.p-useful-renewal a { color:inherit; text-decoration:none; }
.p-useful-renewal img { display:block; max-width:100%; }
.p-useful-renewal__section { padding:calc(100vw / 750 * 120) 0; background:white; scroll-margin-top:calc(100vw / 750 * 360); }
.p-useful-renewal__section--pale { background:#f2faf5; }
.p-useful-renewal__inner { width:calc(100% - calc(100vw / 750 * 120)); margin:auto; }
.p-useful-renewal__heading { text-align:center; color:#50320b; }
.p-useful-renewal__heading > p { display:table; margin:auto; background:#64cc82; color:white; padding:0 calc(100vw / 750 * 40); font-family:Nunito,sans-serif; font-size:calc(100vw / 750 * 44); font-weight:700; letter-spacing:.1em; line-height:calc(100vw / 750 * 68); }
.p-useful-renewal__heading h2 { margin:calc(100vw / 750 * 36) 0 calc(100vw / 750 * 44); font-size:calc(100vw / 750 * 52); font-weight:400; line-height:1.6; letter-spacing:.02em; }
.p-useful-renewal__icon { width:calc(100vw / 750 * 124); height:calc(100vw / 750 * 124); margin:auto; }
.p-useful-renewal__icon img { width:100%; height:auto; }
.p-useful-renewal__sp { display:none; }
.p-useful-renewal__lead { text-align:center; margin:calc(100vw / 750 * 60) auto calc(100vw / 750 * 140)!important; }
.p-useful-renewal__purpose-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:calc(100vw / 750 * 96) calc(100vw / 750 * 60); }
.p-useful-renewal__purpose { position:relative; background:white; display:flex; flex-direction:column; border:calc(100vw / 750 * 2) solid #dff3e6; }
.p-useful-renewal__purpose > img { width:100%; aspect-ratio:1050/300; height:auto; object-fit:cover; }
.p-useful-renewal__badge { position:absolute; top:0; left:50%; transform:translate(-50%,-50%); width:calc(100vw / 750 * 400); border-radius:calc(100vw / 750 * 80); background:#64cc82; color:white; padding:calc(100vw / 750 * 16) calc(100vw / 750 * 30)!important; font:500 calc(100vw / 750 * 36)/1.6 Nunito,'Noto Sans JP',sans-serif; text-align:center; letter-spacing:.1em; z-index:1; }
.p-useful-renewal__badge::after { content:""; position:absolute; top:100%; left:50%; margin-left:calc(100vw / 750 * -14); border-left:calc(100vw / 750 * 14) solid transparent; border-right:calc(100vw / 750 * 14) solid transparent; border-top:calc(100vw / 750 * 18) solid #64cc82; }
.p-useful-renewal__purpose-copy { padding:calc(100vw / 750 * 52) calc(100vw / 750 * 60) calc(100vw / 750 * 56); flex:1; display:flex; flex-direction:column; }
.p-useful-renewal__purpose h3 { display:flex; align-items:center; justify-content:center; gap:calc(100vw / 750 * 44); color:#50320b; font-size:calc(100vw / 750 * 48); font-weight:400; line-height:1.5; margin-bottom:calc(100vw / 750 * 40); }
.p-useful-renewal__purpose h3::before,.p-useful-renewal__purpose h3::after { content:""; display:block; flex:none; width:calc(100vw / 750 * 32); height:calc(100vw / 750 * 60); background:url('../img/useful-items/renewal/title-chevron.svg') center/contain no-repeat; }
.p-useful-renewal__purpose h3::before { transform:rotate(180deg); }
.p-useful-renewal__purpose-copy > p { text-align:center; font-size:calc(100vw / 750 * 32); line-height:1.65; }
.p-useful-renewal__purpose ul { list-style:none; display:grid; grid-template-rows:repeat(3,auto); grid-auto-flow:column; grid-template-columns:1fr 1fr; gap:calc(100vw / 750 * 16) calc(100vw / 750 * 40); padding:calc(100vw / 750 * 40) 0 calc(100vw / 750 * 56); font-size:calc(100vw / 750 * 28); color:#583c17; letter-spacing:.08em; }
.p-useful-renewal__button { display:flex; align-items:center; justify-content:center; position:relative; background:#846f54; color:white!important; border-radius:calc(100vw / 750 * 6); padding:calc(100vw / 750 * 30) calc(100vw / 750 * 84); min-height:calc(100vw / 750 * 120); text-align:center; line-height:1.6; font-size:calc(100vw / 750 * 36); letter-spacing:.1em; }
.p-useful-renewal__button::before { content:""; position:absolute; inset:0 auto 0 0; width:0; border-radius:inherit; background:rgba(80,50,11,.9); transition:width .3s; }
.p-useful-renewal__button::after { content:""; position:absolute; right:calc(100vw / 750 * 30); top:50%; transform:translateY(-50%); width:calc(100vw / 750 * 32); height:calc(100vw / 750 * 26); background:url('../img/useful-items/renewal/arrow-right-white.svg') center/contain no-repeat; }
.p-useful-renewal__button span { position:relative; z-index:1; }
.p-useful-renewal__purpose .p-useful-renewal__button { margin-top:auto; }
.p-useful-renewal__compare-nav { display:flex; gap:calc(100vw / 750 * 20); margin-bottom:calc(100vw / 750 * 60); }
.p-useful-renewal__compare-nav > * { display:flex; align-items:center; justify-content:center; width:calc(100vw / 750 * 360); min-height:calc(100vw / 750 * 100); border:calc(100vw / 750 * 2) solid #ccc; border-radius:calc(100vw / 750 * 4); padding:calc(100vw / 750 * 16) calc(100vw / 750 * 40); text-align:center; }
#useful-compare .p-useful-renewal__compare-nav a[aria-current] { background:#846f54; border-color:#846f54; color:white!important; }
.p-useful-renewal__compare-nav [aria-disabled] { color:#666; }
#useful-compare .p-useful-renewal__inner { width:100%; }
.p-useful-renewal__table-scroll { width:100%; overflow:auto; overscroll-behavior-x:contain; }
.p-useful-renewal table { border-collapse:collapse; width:100%; min-width:calc(100vw / 750 * 2160); table-layout:fixed; font-size:calc(100vw / 750 * 32); line-height:1.8; background:white; }
.p-useful-renewal th,.p-useful-renewal td { border:0; border-bottom:calc(100vw / 750 * 2) solid #ddd; padding:calc(100vw / 750 * 24) calc(100vw / 750 * 8); height:calc(100vw / 750 * 180); text-align:center; vertical-align:middle; font-weight:400; }
.p-useful-renewal thead { background:#dff3e6; }
.p-useful-renewal thead th { padding:calc(100vw / 750 * 34) calc(100vw / 750 * 12); }
.p-useful-renewal tbody th { background:#f7f7f7; }
.p-useful-renewal thead th:first-child { width:17.54%; }
.p-useful-renewal thead th:nth-child(2) { width:9%; }
.p-useful-renewal thead th:nth-child(3) { width:9.5%; }
.p-useful-renewal thead th:nth-child(4) { width:11%; }
.p-useful-renewal thead th:nth-child(5) { width:12%; }
.p-useful-renewal thead th:nth-child(6) { width:10%; }
.p-useful-renewal thead th:nth-child(7) { width:9%; }
.p-useful-renewal thead th:nth-child(8) { width:13%; }
.p-useful-renewal thead th:last-child { width:8.96%; }
.p-useful-renewal table { letter-spacing:0; }
.p-useful-renewal td { white-space:nowrap; }
#useful-compare table a { color:#64cc82!important; white-space:nowrap; }
.p-useful-renewal__tag { display:inline-block; padding:calc(100vw / 750 * 14) calc(100vw / 750 * 28); border-radius:calc(100vw / 750 * 4); white-space:nowrap; }
.p-useful-renewal__tag--adjust { background:#bdcac2; }
.p-useful-renewal__tag--post { background:#ebe1ac; }
.p-useful-renewal__tag--base { background:#e1cfaf; }
.p-useful-renewal__note { font-size:calc(100vw / 750 * 24); line-height:1.6; color:#777; margin-top:calc(100vw / 750 * 40)!important; }
.p-useful-renewal__note a { text-decoration:underline; }
.p-useful-renewal__steps { list-style:none; display:grid; gap:calc(100vw / 750 * 80); }
.p-useful-renewal__steps li { display:grid; grid-template-columns:calc(100vw / 750 * 500) 1fr; align-items:center; gap:calc(100vw / 750 * 50); position:relative; border:calc(100vw / 750 * 2) solid #64cc82; border-radius:calc(100vw / 750 * 6); background:white; min-height:calc(100vw / 750 * 260); padding:calc(100vw / 750 * 64) calc(100vw / 750 * 60); }
.p-useful-renewal__steps .p-useful-renewal__badge { left:calc(100vw / 750 * 60); transform:translateY(-50%); width:calc(100vw / 750 * 360); }
.p-useful-renewal__steps h3 { color:#846f54; font-size:calc(100vw / 750 * 40); line-height:1.8; font-weight:500; }
#useful-choose .p-useful-renewal__button { max-width:calc(100vw / 750 * 940); margin:calc(100vw / 750 * 100) auto 0; }
.p-useful-renewal__heading--leaf > img { width:calc(100vw / 750 * 50); height:auto; margin:0 auto calc(100vw / 750 * 20); }
.p-useful-renewal__heading--leaf h2 { margin:0 0 calc(100vw / 750 * 8); }
.p-useful-renewal__heading--leaf > p { background:none; color:#50320b; font-size:calc(100vw / 750 * 44); font-weight:400; padding:0; }
#useful-works .p-useful-renewal__inner { width:100%; }
.p-useful-renewal__carousel { position:relative; }
.p-useful-renewal__works { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:calc(100vw / 750 * 72) calc(100vw / 750 * 56); }
.p-useful-renewal__work { min-width:0; }
.p-useful-renewal__work > img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.p-useful-renewal__species { display:table; padding:0 calc(100vw / 750 * 16)!important; margin:calc(100vw / 750 * 36) 0 calc(100vw / 750 * 20)!important; background:#64cc82; color:white; font-size:calc(100vw / 750 * 28); line-height:1.6; font-weight:500; }
.p-useful-renewal__work h3 { font-size:calc(100vw / 750 * 36); line-height:2; font-weight:500; margin-bottom:calc(100vw / 750 * 16); }
.p-useful-renewal__work > p:last-child { font-size:calc(100vw / 750 * 32); line-height:1.8; }
.p-useful-renewal__work a:hover { text-decoration:underline; }
.p-useful-renewal__carousel-controls { display:none; }
#useful-works .p-useful-renewal__button { width:calc(100vw / 750 * 800); margin:calc(100vw / 750 * 100) auto 0; }
.p-useful-renewal__columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:calc(100vw / 750 * 40); }
.p-useful-renewal__columns > a { padding:calc(100vw / 750 * 48); background:white; border:calc(100vw / 750 * 2) solid #dff3e6; }
.p-useful-renewal__columns h3 { font-size:calc(100vw / 750 * 36); font-weight:500; color:#50320b; margin-bottom:calc(100vw / 750 * 24); }
.p-useful-renewal__columns p { font-size:calc(100vw / 750 * 28); }
.p-useful-renewal__sr-only { position:absolute; width:calc(100vw / 750 * 2); height:calc(100vw / 750 * 2); overflow:hidden; clip-path:inset(50%); }
.p-useful-renewal a:focus-visible,.p-useful-renewal button:focus-visible,.p-useful-renewal [tabindex]:focus-visible { outline:calc(100vw / 750 * 6) solid #245f39; outline-offset:calc(100vw / 750 * 8); }
@media(hover:hover) { .p-useful-renewal__button:hover::before { width:100%; } .p-useful-renewal__columns a:hover { border-color:#64cc82; } }
@media(prefers-reduced-motion:reduce) { .p-useful-renewal *,.p-useful-renewal *::before { transition:none!important; scroll-behavior:auto!important; } }
/* Related columns: Figma 3:6516. */
#useful-columns { background:white; }
#useful-columns .p-useful-renewal__inner { width:100%; }
#useful-columns .p-useful-renewal__heading h2 { font-weight:300; letter-spacing:.08em; }
#useful-columns .p-useful-renewal__lead { margin:calc(100vw / 750 * 60) auto calc(100vw / 750 * 100)!important; }
#useful-columns .p-useful-renewal__columns { grid-template-columns:repeat(4,minmax(0,1fr)); gap:calc(100vw / 750 * 72) calc(100vw / 750 * 56); align-items:start; }
#useful-columns .p-useful-renewal__columns > a { display:block; padding:0; border:0; background:none; }
#useful-columns .p-useful-renewal__columns img { width:100%; height:auto; aspect-ratio:263/175; object-fit:cover; }
#useful-columns .p-useful-renewal__columns h3 { font-size:calc(100vw / 750 * 32); line-height:1.75; font-weight:400; color:#333; margin:calc(100vw / 750 * 36) 0 calc(100vw / 750 * 20); }
#useful-columns .p-useful-renewal__column-caption { font-size:calc(100vw / 750 * 28); line-height:calc(100vw / 750 * 44); }
#useful-columns .p-useful-renewal__column-read { display:flex; justify-content:flex-end; align-items:center; gap:calc(100vw / 750 * 16); font-size:calc(100vw / 750 * 32); line-height:1.5; color:#64cc82; margin-top:calc(100vw / 750 * 24); }
#useful-columns .p-useful-renewal__column-read::after { content:''; display:block; width:calc(100vw / 750 * 28); height:calc(100vw / 750 * 26); background:url('../img/useful-items/renewal/arrow-right-green.svg') center/contain no-repeat; }
#useful-columns .p-useful-renewal__button { width:calc(100vw / 750 * 700); margin:calc(100vw / 750 * 140) auto 0; font-weight:400; }
@media(hover:hover) { #useful-columns .p-useful-renewal__columns > a:hover h3 { text-decoration:underline; } }

#useful-choose .p-useful-renewal__heading > p { text-transform:lowercase; }

/* SP board values at calc(100vw / 750 * 750). */
.fs-body-category-useful-items #left-nav { display:block; }
.fs-body-category-useful-items #left-nav .side-navi { display:none; }
.fs-body-category-useful-items #left-nav .left-flex { width:100%; max-width:none; }
.p-useful-renewal { font-size:calc(100vw / 750 * 28); line-height:1.8; }
.p-useful-renewal__section { padding:calc(100vw / 750 * 80) 0; scroll-margin-top:calc(100vw / 750 * 190); }
.p-useful-renewal__inner { width:calc(100% - calc(100vw / 750 * 100)); }
.p-useful-renewal__heading > p { font-size:calc(100vw / 750 * 30); line-height:calc(100vw / 750 * 40); padding:0 calc(100vw / 750 * 24); }
.p-useful-renewal__heading h2 { font-size:calc(100vw / 750 * 46); line-height:1.5; letter-spacing:.08em; margin:calc(100vw / 750 * 26) 0 calc(100vw / 750 * 28); }
.p-useful-renewal__sp { display:block; }
.p-useful-renewal__icon { width:calc(100vw / 750 * 80); height:calc(100vw / 750 * 80); }
.p-useful-renewal__lead { text-align:left; margin:calc(100vw / 750 * 50) auto calc(100vw / 750 * 80)!important; }
.p-useful-renewal__purpose-grid { grid-template-columns:1fr; gap:calc(100vw / 750 * 80); }
.p-useful-renewal__badge { width:calc(100vw / 750 * 180); font-size:calc(100vw / 750 * 26); padding:calc(100vw / 750 * 7) calc(100vw / 750 * 20)!important; }
.p-useful-renewal__purpose-copy { padding:calc(100vw / 750 * 40); }
.p-useful-renewal__purpose h3 { font-size:calc(100vw / 750 * 32); gap:calc(100vw / 750 * 35); margin-bottom:calc(100vw / 750 * 28); letter-spacing:.02em; }
.p-useful-renewal__purpose h3::before,.p-useful-renewal__purpose h3::after { width:calc(100vw / 750 * 16.4143); height:calc(100vw / 750 * 29.9961); }
.p-useful-renewal__purpose-copy > p { font-size:calc(100vw / 750 * 28); line-height:1.8; text-align:left; }
.p-useful-renewal__purpose-copy > p br { display:none; }
.p-useful-renewal__purpose ul { display:block; font-size:calc(100vw / 750 * 26); line-height:1.8; padding:calc(100vw / 750 * 28) calc(100vw / 750 * 20) calc(100vw / 750 * 30); letter-spacing:.02em; }
.p-useful-renewal__purpose li + li { margin-top:calc(100vw / 750 * 12); }
.p-useful-renewal__button { font-size:calc(100vw / 750 * 28); min-height:calc(100vw / 750 * 90); padding:calc(100vw / 750 * 20) calc(100vw / 750 * 55); }
.p-useful-renewal__button::after { width:calc(100vw / 750 * 23); height:calc(100vw / 750 * 19.5); right:calc(100vw / 750 * 22); }
#useful-compare .p-useful-renewal__inner { width:calc(100% - calc(100vw / 750 * 100)); }
.p-useful-renewal__compare-nav { gap:calc(100vw / 750 * 24); margin-bottom:calc(100vw / 750 * 50); }
.p-useful-renewal__compare-nav > * { width:calc(100vw / 750 * 200); min-height:calc(100vw / 750 * 112); padding:calc(100vw / 750 * 14) calc(100vw / 750 * 30); font-size:calc(100vw / 750 * 28); }
.p-useful-renewal table { min-width:calc(100vw / 750 * 2300); font-size:calc(100vw / 750 * 28); }
.p-useful-renewal th,.p-useful-renewal td { padding:calc(100vw / 750 * 34) calc(100vw / 750 * 18); height:calc(100vw / 750 * 149); }
.p-useful-renewal thead th { padding:calc(100vw / 750 * 30) calc(100vw / 750 * 16); height:calc(100vw / 750 * 130); }
.p-useful-renewal thead th:first-child { width:calc(100vw / 750 * 350); }
.p-useful-renewal thead th:nth-child(n+3):nth-child(-n+7) { width:auto; }
.p-useful-renewal thead th:nth-child(2) { width:calc(100vw / 750 * 300); }
.p-useful-renewal thead th:nth-child(8) { width:calc(100vw / 750 * 300); }
.p-useful-renewal thead th:last-child { width:calc(100vw / 750 * 220); }
.p-useful-renewal__tag { padding:calc(100vw / 750 * 10) calc(100vw / 750 * 16); }
.p-useful-renewal__note { font-size:calc(100vw / 750 * 26); margin-top:calc(100vw / 750 * 36)!important; }
.p-useful-renewal__steps { gap:calc(100vw / 750 * 80); }
.p-useful-renewal__steps li { display:block; padding:calc(100vw / 750 * 64); min-height:0; }
.p-useful-renewal__steps .p-useful-renewal__badge { left:50%; transform:translate(-50%,-50%); width:calc(100vw / 750 * 190); }
.p-useful-renewal__steps h3 { font-size:calc(100vw / 750 * 32); text-align:center; margin-bottom:calc(100vw / 750 * 26); }
#useful-choose .p-useful-renewal__button { width:100%; max-width:none; margin-top:calc(100vw / 750 * 60); font-size:calc(100vw / 750 * 26); padding-left:calc(100vw / 750 * 40); }
.p-useful-renewal__heading--leaf > img { width:calc(100vw / 750 * 32); margin-bottom:calc(100vw / 750 * 16); }
.p-useful-renewal__heading--leaf h2 { font-size:calc(100vw / 750 * 46); margin:0 0 calc(100vw / 750 * 12); }
.p-useful-renewal__heading--leaf > p { font-size:calc(100vw / 750 * 26); line-height:1.6; }
#useful-works .p-useful-renewal__inner { width:calc(100% - calc(100vw / 750 * 100)); }
.p-useful-renewal__works { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; gap:calc(100vw / 750 * 60); scrollbar-width:none; }
.p-useful-renewal__works::-webkit-scrollbar { display:none; }
.p-useful-renewal__work { flex:0 0 100%; padding:0 calc(100vw / 750 * 40); scroll-snap-align:start; }
.p-useful-renewal__species { font-size:calc(100vw / 750 * 24); padding:0 calc(100vw / 750 * 10)!important; margin:calc(100vw / 750 * 30) 0 calc(100vw / 750 * 24)!important; }
.p-useful-renewal__work h3 { font-size:calc(100vw / 750 * 30); line-height:1.8; margin-bottom:calc(100vw / 750 * 20); }
.p-useful-renewal__work > p:last-child { font-size:calc(100vw / 750 * 28); line-height:1.8; }
.p-useful-renewal__carousel-controls:not([hidden]) { display:flex; justify-content:space-between; pointer-events:none; position:absolute; left:calc(100vw / 750 * -25); right:calc(100vw / 750 * -25); top:calc(100vw / 750 * 380); }
.p-useful-renewal__carousel-controls button { border:0; padding:0; width:calc(100vw / 750 * 45); height:calc(100vw / 750 * 70); background:url('../img/useful-items/renewal/carousel-next.svg') center/calc(100vw / 750 * 28) calc(100vw / 750 * 55) no-repeat; cursor:pointer; pointer-events:auto; }
.p-useful-renewal__carousel-controls button[data-direction="-1"] { transform:rotate(180deg); }
.p-useful-renewal__carousel-controls button:disabled { opacity:.25; cursor:default; }
#useful-works .p-useful-renewal__button { width:calc(100vw / 750 * 580); max-width:100%; margin-top:calc(100vw / 750 * 90); }
.p-useful-renewal__columns { grid-template-columns:1fr; gap:calc(100vw / 750 * 28); }
.p-useful-renewal__columns > a { padding:calc(100vw / 750 * 36); }
.p-useful-renewal__columns h3 { font-size:calc(100vw / 750 * 30); margin-bottom:calc(100vw / 750 * 20); }
.p-useful-renewal__columns p { font-size:calc(100vw / 750 * 26); }
/* Related columns: Figma 3:13448 (calc(100vw / 750 * 750) board). */
#useful-columns .p-useful-renewal__inner { width:calc(100% - calc(100vw / 750 * 100)); }
#useful-columns .p-useful-renewal__heading > p { font-family:'Noto Sans JP',sans-serif; font-size:calc(100vw / 750 * 26); line-height:1.5; }
#useful-columns .p-useful-renewal__lead { margin:calc(100vw / 750 * 40) auto calc(100vw / 750 * 60)!important; font-size:calc(100vw / 750 * 28); line-height:1.8; }
#useful-columns .p-useful-renewal__columns { grid-template-columns:repeat(2,minmax(0,1fr)); gap:calc(100vw / 750 * 50) calc(100vw / 750 * 30); }
#useful-columns .p-useful-renewal__columns > a { display:flex; flex-direction:column; height:100%; }
#useful-columns .p-useful-renewal__columns h3 { font-size:calc(100vw / 750 * 30); line-height:1.65; letter-spacing:.05em; margin:calc(100vw / 750 * 24) 0 calc(100vw / 750 * 24); }
#useful-columns .p-useful-renewal__column-caption { display:none; }
#useful-columns .p-useful-renewal__column-read { font-size:calc(100vw / 750 * 30); line-height:1.5; gap:calc(100vw / 750 * 16); margin-top:auto; }
#useful-columns .p-useful-renewal__column-read::after { width:calc(100vw / 750 * 24); height:calc(100vw / 750 * 22); }
#useful-columns .p-useful-renewal__button { width:calc(100vw / 750 * 580); margin:calc(100vw / 750 * 70) auto 0; font-size:calc(100vw / 750 * 28); }

#useful-choose .p-useful-renewal__heading > p { text-transform:uppercase; }

}