
.search-page{font-size:18px;line-height:1.9}
.search-page .search-hero{padding-block:64px 56px;display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
.search-page .search-hero h1{font-size:clamp(34px,3.8vw,52px);line-height:1.6;margin:16px 0 24px}
.search-page .search-answer{max-width:42em;margin:0 0 24px}
.search-page .search-guide{background:var(--gray);border:1px solid var(--line);border-radius:12px;padding:28px}
.search-page .search-guide h2{font-family:inherit;font-size:22px;line-height:1.7;margin:0 0 16px}
.search-page .search-guide p{margin:12px 0}
.search-page .search-guide a{font-weight:700;text-decoration:underline;text-underline-offset:5px}
.search-page .search-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.search-page .search-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.search-page .search-card{border-top:2px solid var(--green);padding-top:20px;min-width:0}
.search-page .search-card h3{font-size:24px;line-height:1.6;margin:8px 0 14px}
.search-page .search-card p{margin:12px 0}
.search-page .search-card .search-price{font-size:26px;font-weight:700;color:var(--green);line-height:1.6}
.search-page .search-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:28px 0 0;padding:0;list-style:none;counter-reset:search-step}
.search-page .search-flow li{padding:22px;background:var(--gray);border:1px solid var(--line);border-radius:8px;min-width:0;counter-increment:search-step}
.search-page .search-flow li:before{content:"0" counter(search-step);display:block;color:var(--green);font-size:28px;font-weight:700;margin-bottom:8px}
.search-page .search-flow strong{font-size:21px;display:block;margin-bottom:8px}
.search-page .search-links{display:flex;gap:16px 28px;flex-wrap:wrap;padding:0;list-style:none}
.search-page .search-links a{text-decoration:underline;text-underline-offset:5px;font-weight:700}
.search-page .search-note{font-size:16px;color:var(--muted);margin-top:24px}
.search-page .search-checks{padding-left:1.5em}
.search-page .search-checks li{margin-bottom:14px}
.search-page a:focus-visible{outline:3px solid var(--green);outline-offset:5px}
@media(max-width:760px){.search-page .search-hero{grid-template-columns:1fr;gap:28px;padding-block:36px 40px}.search-page .search-grid,.search-page .search-grid.two,.search-page .search-flow{grid-template-columns:1fr;gap:28px}.search-page .search-hero h1{font-size:34px}.search-page .search-guide{padding:24px}.search-page .search-links{display:grid;gap:18px}}

.search-page .search-hero{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);align-items:center;gap:40px}
.search-page .search-visual{margin:0;min-width:0}
.search-page .search-visual img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;background:#fff}
.search-page .search-visual figcaption{font-size:16px;line-height:1.8;color:var(--muted);margin:16px 0 0}
.search-page .search-guide-wide{margin-block:0 48px}
.search-page .search-guide .btn,.search-page .search-links .btn{text-decoration:none;font-size:18px;line-height:1.65;min-height:54px;white-space:normal}
.search-page .btn{max-width:100%;overflow-wrap:anywhere;min-height:54px}
.search-page .btn.outline{background:#fff;color:var(--green);border-color:var(--green)}
.search-page .btn.outline:hover{background:#e8efeb;color:var(--deep)}
.search-page .search-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.search-page .search-choice-grid>div{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.search-page .search-choice-grid>div>p:first-child{margin-top:0}
.search-page .search-choice-grid .btn{width:100%;margin-top:auto}
.search-page .search-choice-grid>div>.btn:first-child{margin-top:0}
.search-page .search-guide-related{display:flex;align-items:center;gap:24px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:28px;padding-top:24px}
.search-page .search-guide-related p{margin:0}
.search-page .search-guide-summary{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:center}
.search-page .search-guide-actions{display:grid;gap:16px;align-content:center}
.search-page .search-story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;align-items:center;margin-top:32px}
.search-page .search-story .search-problems{grid-template-columns:1fr;gap:28px}
.search-page .search-story .search-card{padding-top:18px}
.search-page .search-story .search-card h3{font-size:22px;margin-top:0}
.search-page .search-card .btn{font-size:18px;line-height:1.65;margin-top:16px;gap:16px}
.search-page .search-links{gap:16px;margin:32px 0 0}
.search-page .search-links li{display:flex;min-width:0;max-width:100%}
.search-page .search-links .btn{flex:1}
.search-page .search-related{margin-top:48px}
.search-page .search-related h3{font-size:21px;margin:32px 0 16px}
.search-page .search-related .search-links{margin-top:0}

.search-page .search-diagram{margin:32px 0 40px;padding:32px;background:#fff;border:1px solid var(--line);border-radius:16px;min-width:0}
.search-page .search-diagram>figcaption{font-size:24px;font-weight:700;line-height:1.6;color:var(--green);margin:0 0 28px}
.search-page .search-diagram h3{font-size:22px;line-height:1.6;margin:8px 0 16px}
.search-page .search-diagram-label{font-size:16px;font-weight:700;color:var(--green)}
.search-page .search-diagram-result{margin:24px 0 0;padding:20px 24px;background:var(--green);color:#fff;font-size:21px;font-weight:700;line-height:1.7;border-radius:8px}
.search-page .search-role-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.search-page .search-role{padding:24px;background:var(--gray);border-top:3px solid var(--green);min-width:0;position:relative}
.search-page .search-role:first-child:after{content:'→';position:absolute;right:-31px;top:50%;font-size:28px;line-height:1;color:var(--green)}
.search-page .search-role ul{padding-left:1.3em;margin:0}
.search-page .search-role li{margin:8px 0}
.search-page .search-journey{gap:40px;margin:0}
.search-page .search-journey li{position:relative;background:#fff;border:1px solid var(--green);border-top-width:4px}
.search-page .search-journey li:before{background:var(--gray);border-radius:50%;width:48px;height:48px;display:grid;place-items:center;font-size:23px;line-height:1;margin-bottom:20px}
.search-page .search-journey li:not(:last-child):after{content:'→';position:absolute;right:-32px;top:50%;font-size:28px;line-height:1;color:var(--green)}
.search-page .search-ingredients{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.search-page .search-ingredients>div{padding:20px;background:var(--gray);border:1px solid var(--line);border-radius:8px;position:relative}
.search-page .search-ingredients strong,.search-page .search-ingredients span{display:block}
.search-page .search-ingredients strong{font-size:22px;margin-bottom:12px}
.search-page .search-diagram-number{font-size:28px;font-weight:700;line-height:1.2;color:var(--green);margin-bottom:18px}
.search-page .search-merge-line{height:28px;margin:0 16.67%;border-inline:2px solid var(--green);border-bottom:2px solid var(--green);position:relative}
.search-page .search-merge-line:before{content:'';position:absolute;left:50%;height:48px;top:0;border-left:2px solid var(--green)}
.search-page .search-merge-line:after{content:'';position:absolute;left:calc(50% - 5px);bottom:-21px;border:6px solid transparent;border-top-color:var(--green);border-bottom:0}
.search-page .search-merge-line+.search-diagram-result{margin-top:24px}
.search-page .search-learning{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.search-page .search-learning .search-card{position:relative;background:var(--gray);border:0;padding:24px}
.search-page .search-learning .search-card:not(:last-child):after{content:'→';position:absolute;right:-31px;top:50%;font-size:28px;line-height:1;color:var(--green)}
.search-page .search-learning-return{margin:24px 0 0;border:2px solid var(--green);border-top:0;border-radius:0 0 16px 16px;padding:12px 20px 20px;font-weight:700;color:var(--green)}
.search-page .search-learning-return span{font-size:28px;vertical-align:middle;margin-right:8px}
.search-page .search-course-chart>.search-note{margin-top:0;margin-bottom:24px}
.search-page .search-course-row{display:grid;grid-template-columns:180px minmax(0,1fr);gap:32px;align-items:center;margin:24px 0}
.search-page .search-course-row>div:first-child strong,.search-page .search-course-row>div:first-child span{display:block}
.search-page .search-course-row>div:first-child strong{font-size:22px}
.search-page .search-course-meter{display:flex;align-items:center;gap:16px;min-width:0;position:relative;padding-bottom:32px}
.search-page .search-course-meter:before{content:'';position:absolute;left:0;right:0;bottom:0;height:16px;background:var(--gray);border-radius:3px}
.search-page .search-course-bar{position:absolute;bottom:0;left:0;height:16px;background:var(--green);border-radius:3px;z-index:1}
.search-page .search-course-bar.hours-12{width:50%}
.search-page .search-course-bar.hours-18{width:75%}
.search-page .search-course-bar.hours-24{width:100%}
.search-page .search-course-meter>strong{font-size:24px;line-height:1.4}
.search-page .search-update-row{display:grid;grid-template-columns:130px minmax(0,1fr);gap:24px;align-items:center;padding:24px 0;border-top:1px solid var(--line)}
.search-page .search-update-row h3{margin:0}
.search-page .search-update-row ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:0;margin:0;list-style:none}
.search-page .search-update-row li{position:relative;padding:18px;background:var(--gray);border-radius:6px}
.search-page .search-update-row li:not(:last-child):after{content:'→';position:absolute;right:-25px;top:50%;transform:translateY(-50%);font-size:24px;color:var(--green)}
.search-page .search-visitor-path{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;padding:0;margin:0;list-style:none}
.search-page .search-visitor-path li{position:relative;padding:20px;background:var(--gray);border-top:3px solid var(--green);border-radius:0 0 8px 8px}
.search-page .search-visitor-path span{font-size:16px;color:var(--muted);display:block;margin-bottom:12px}
.search-page .search-visitor-path strong{font-size:20px;line-height:1.7}
.search-page .search-visitor-path li:not(:last-child):after{content:'→';position:absolute;right:-26px;top:50%;font-size:24px;line-height:1;color:var(--green)}

@media(max-width:1000px){
 .search-page .search-hero{gap:28px}
 .search-page .search-choice-grid{grid-template-columns:1fr;gap:24px}
 .search-page .search-choice-grid>div{display:block}
 .search-page .search-choice-grid .btn{width:auto;margin-top:0}
 .search-page .search-story{gap:32px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
 .search-page .search-visitor-path{grid-template-columns:1fr;gap:32px}
 .search-page .search-visitor-path li:not(:last-child):after{content:'↓';left:50%;right:auto;top:auto;bottom:-28px}
 .search-page .search-update-row{grid-template-columns:1fr;gap:16px}
}
@media(max-width:760px){
 .search-page .search-hero{grid-template-columns:1fr;gap:32px}
 .search-page .search-hero-art{max-width:600px}
 .search-page .search-guide-wide{margin-bottom:32px}
 .search-page .search-guide-summary,.search-page .search-story{grid-template-columns:1fr;gap:32px}
 .search-page .search-guide .btn,.search-page .search-links,.search-page .search-links li,.search-page .search-card .btn{width:100%}
 .search-page .search-guide-related{display:grid;gap:16px}
 .search-page .search-diagram{padding:24px 20px;margin-block:28px 32px}
 .search-page .search-diagram>figcaption{font-size:22px}
 .search-page .search-role-grid,.search-page .search-ingredients,.search-page .search-learning{grid-template-columns:1fr;gap:32px}
 .search-page .search-journey{gap:32px}
 .search-page .search-role:first-child:after,.search-page .search-journey li:not(:last-child):after,.search-page .search-learning .search-card:not(:last-child):after{content:'↓';left:50%;right:auto;top:auto;bottom:-30px}
 .search-page .search-ingredients>div:not(:last-child):after{content:'＋';position:absolute;left:50%;bottom:-31px;font-size:24px;color:var(--green)}
 .search-page .search-merge-line{width:2px;margin-inline:auto;border:0;background:var(--green)}
 .search-page .search-merge-line:before{display:none}
 .search-page .search-merge-line:after{left:-5px;bottom:-5px}
 .search-page .search-merge-line+.search-diagram-result{margin-top:8px}
 .search-page .search-diagram-result{padding:20px;font-size:20px}
 .search-page .search-course-row{grid-template-columns:1fr;gap:16px;margin:28px 0}
 .search-page .search-course-row>div:first-child{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
 .search-page .search-update-row ol{grid-template-columns:1fr;gap:32px}
 .search-page .search-update-row li:not(:last-child):after{content:'↓';left:50%;right:auto;top:auto;bottom:-31px;transform:none;line-height:1}
}
