/* parts/07-examples/style.css */
/* 07-examples専用：記事サンプル3件。見出し・説明はindex.htmlで編集 */
.lp-examples{padding:84px 0 72px;background:#fff;color:var(--color-text);scroll-margin-top:24px}
.lp-examples__heading{text-align:center;margin-bottom:27px}
.lp-examples__eyebrow{font-size:10px;font-weight:700;letter-spacing:.2em;color:#1386c4;margin:0 0 14px}
.lp-examples h2{font-size:clamp(25px,2.6vw,34px);line-height:1.6;letter-spacing:-.035em;margin:0 0 14px;font-weight:800}
.lp-examples h2 span{color:var(--color-primary)}
.lp-examples__heading>p:last-child{margin:0;color:#647c90;font-size:14px}
.lp-examples__sample{text-align:center;font-size:11px;color:#66869c;margin:0 0 26px}
.lp-examples__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}
.lp-examples__card{min-width:0;border:1px solid #dcebf5;border-radius:12px;overflow:hidden;background:#fff}
/* 装飾はCSSのみ。新しい画像ファイルは不要です */
.lp-examples__cover{position:relative;overflow:hidden;height:150px;background:linear-gradient(130deg,#edf8ff,#d8eefb);padding:23px 26px;color:#4893bf}
.lp-examples__card:nth-child(2) .lp-examples__cover{background:linear-gradient(130deg,#effbfc,#d9f1f4);color:#4399ab}
.lp-examples__card:nth-child(3) .lp-examples__cover{background:linear-gradient(130deg,#f0f5ff,#e1eafb);color:#6c91c0}
.lp-examples__cover>span{font-size:9px;letter-spacing:.17em;font-weight:700;position:relative;z-index:1}
.lp-examples__cover>b{position:absolute;font-size:76px;line-height:1;right:22px;bottom:8px;letter-spacing:-.07em;color:#fff;opacity:.8}
.lp-examples__cover>div{width:100px;transform:rotate(-8deg);padding:15px;background:#ffffffb0;border-radius:6px;margin-top:15px}
.lp-examples__cover i{display:block;height:4px;background:currentColor;opacity:.35;margin-bottom:7px;border-radius:4px}.lp-examples__cover i:last-child{width:60%;margin-bottom:0}
.lp-examples__body{padding:24px}
.lp-examples__category{margin:0 0 10px;font-size:11px;color:#168ac1;font-weight:700}
.lp-examples h3{font-size:17px;line-height:1.8;letter-spacing:-.035em;margin:0 0 18px}
.lp-examples__keyword{font-size:11px;color:#387896;background:#f0f8fc;border-radius:5px;padding:10px 12px;margin:0 0 16px;overflow-wrap:anywhere}
.lp-examples__keyword>span{display:block;font-size:9px;color:#7996a9;margin-bottom:2px}
.lp-examples__text{font-size:12px;line-height:1.95;color:#60788c;margin:0 0 21px}
.lp-examples details{border-top:1px solid #e0edf5}
.lp-examples summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:15px;font-size:12px;font-weight:700;color:#0877c4;cursor:pointer;list-style:none}
.lp-examples summary::-webkit-details-marker{display:none}
.lp-examples summary>span{font-size:18px;line-height:1;transition:transform .15s}
.lp-examples details[open] summary>span{transform:rotate(45deg)}
.lp-examples summary:focus-visible{outline:3px solid #1386c4;outline-offset:5px}
.lp-examples__outline{padding-top:15px}.lp-examples__outline>p{font-size:10px;color:#7996a9;margin:0 0 8px}.lp-examples ol{padding-left:20px;margin:0;color:#50718a;font-size:12px;line-height:1.9}.lp-examples li+li{margin-top:7px}
.lp-examples__note{font-size:11px;color:#788e9f;margin:22px 0 0;line-height:1.9}
@media(max-width:950px){.lp-examples__grid{gap:15px}.lp-examples__body{padding:20px}.lp-examples h3{font-size:16px}}
@media(max-width:700px){.lp-examples{padding:58px 0 48px}.lp-examples__heading{text-align:left}.lp-examples__heading>p:last-child{font-size:13px}.lp-examples__sample{text-align:left}.lp-examples__grid{grid-template-columns:1fr;gap:22px}.lp-examples__body{padding:24px}.lp-examples__cover{height:140px}.lp-examples h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){.lp-examples summary>span{transition:none}}