/*
Theme Name: レク工房（Cocoon子テーマ）
Template: cocoon-master
Description: 印刷して使える高齢者向けレク教材の公式サイト。教材は投稿から追加できます。
Version: 1.0.0
Author: レク工房
Text Domain: rekukobo
*/
:root{--ink:#383c36;--muted:#777b72;--orange:#b85627;--line:#e9e8df;--cream:#faf9f4}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;color:var(--ink);background:#fff;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.9;font-size:16px}a{color:inherit;text-decoration:none}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #427d94;outline-offset:6px}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.5;letter-spacing:.03em}section[id]{scroll-margin-top:24px}.header{max-width:1160px;margin:auto;padding:27px 34px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:25px;font-weight:800;letter-spacing:.09em;display:flex;align-items:center;gap:9px}.brand-dot{color:#d77845;margin-left:-8px}.brand-mark{background:#f8e5d8;color:#b45a2d;border-radius:10px;width:33px;height:33px;font-size:26px;line-height:32px;text-align:center;transform:rotate(-7deg)}nav{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:600}nav a:hover{color:var(--orange)}.nav-social{border:1px solid var(--line);padding:5px 17px;border-radius:30px}.hero{max-width:1160px;margin:auto;padding:56px 58px 66px;display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}.eyebrow{color:#8a6551;font-size:12px;font-weight:700;letter-spacing:.16em;margin-bottom:14px}.eyebrow>span{display:inline-block;background:#d7af64;width:7px;height:7px;border-radius:50%;margin-right:6px}.hero h1{font-size:clamp(40px,4.5vw,60px);font-weight:800;line-height:1.35;letter-spacing:.04em;margin-bottom:25px}.hero h1>span{position:relative}.hero h1>span:after{content:"";position:absolute;left:0;right:0;bottom:1px;height:10px;background:#fae7b6;border-radius:5px;z-index:-1}.hero-sub{font-size:21px;font-weight:700;margin-bottom:3px}.hero-description{font-size:16px;color:#656a61;margin-bottom:28px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;background:var(--orange);color:white;border:0;border-radius:12px;padding:14px 25px;font-weight:700;min-height:56px;transition:background .15s,transform .15s}.button:hover{background:#93401b;transform:translateY(-2px)}.button>span{font-size:22px;font-weight:400}.hero-note{font-size:11px;color:var(--muted);margin-top:14px}.hero-art{position:relative;min-height:415px;display:flex;align-items:center;justify-content:center;border-radius:50% 46% 44% 46%;background:#f8f5eb}.art-label{position:absolute;top:8px;left:24px;color:#857452;font-size:13px;letter-spacing:.06em;transform:rotate(-7deg)}.cards-sheet{width:280px;background:white;border:1px solid #e3dfd5;border-radius:3px;padding:17px 16px 10px;box-shadow:0 9px 20px #65574112}.hero-sheet{width:290px;transform:rotate(-8deg);box-shadow:8px 12px 0 #e9e2d3,0 20px 45px #665c481c}.sheet-top{font-size:13px;font-weight:700;border-bottom:1px solid #e8e4d9;padding-bottom:8px;display:flex;justify-content:space-between}.sheet-top span{font-size:10px;color:#777}.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:11px;border-left:1px dashed #d7d2c6;border-top:1px dashed #d7d2c6}.picture-card{border-right:1px dashed #d7d2c6;border-bottom:1px dashed #d7d2c6;padding:4px 3px 8px;text-align:center;display:flex;flex-direction:column;align-items:center}.picture-card svg{width:100%;height:68px}.picture-card span{font-size:13px;font-weight:600;letter-spacing:.13em}.sheet-bottom{font-size:7px;color:#999;margin-top:9px;text-align:right}.round-label{position:absolute;right:-4px;bottom:26px;border-radius:50%;background:#f4df98;width:112px;height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(9deg);font-size:13px;line-height:1.6}.round-label strong{font-size:15px}.spark{position:absolute}.spark-one{right:23px;top:38px;color:#97babf;font-size:35px;transform:rotate(10deg)}.spark-two{left:4px;bottom:28px;color:#bc9cb3;font-size:40px}.benefits{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:center;gap:70px;padding:17px 20px;background:#fdfcf8;font-size:13px;color:#68725f}.section{max-width:1160px;padding:78px 58px;margin:auto}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:29px;gap:24px}.section-heading p:last-child{font-size:13px;color:var(--muted)}h2{font-size:29px;font-weight:800}.small-flower{margin-left:16px;font-size:28px;color:#d3ab63}.material{border:1px solid var(--line);border-radius:22px;overflow:hidden;display:grid;grid-template-columns:.85fr 1.15fr}.materials-list{display:grid;gap:30px}.material-preview{background:#f0f3ec;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:50px 30px 27px;min-height:420px}.material-preview .cards-sheet{transform:rotate(-3deg);width:285px}.material-preview>p{font-size:10px;color:#757d6d;margin-top:20px}.preview-badge{position:absolute;top:20px;left:22px;background:#fff;border-radius:25px;font-size:11px;padding:4px 14px;color:#68725f}.material-content{padding:36px 37px}.tags{display:flex;align-items:center;gap:10px;font-size:11px;color:#788172;margin-bottom:12px}.free-tag{color:#616f49;background:#eef3e4;border-radius:5px;padding:2px 10px;font-weight:700}.material h3{font-size:26px;margin-bottom:12px}.material-content>p{font-size:14px}.word-chain{display:flex;flex-wrap:wrap;gap:4px;font-size:12px;background:#faf9f4;border-radius:9px;padding:12px;margin:17px 0}.word-chain span{display:inline-flex;align-items:center;gap:4px}.word-chain b{color:#b2a58a;font-weight:400}.material-details{font-size:13px;color:#656b61;margin-bottom:22px}.download{width:100%;font-size:15px}.pending{background:#a09b92;cursor:not-allowed}.pending:hover{background:#a09b92;transform:none}.pending-note{font-size:12px!important;color:#66685e;text-align:center;margin-top:8px}.format-note{font-size:10px!important;color:var(--muted);text-align:center;margin-top:9px}.how{text-align:center;background:var(--cream);max-width:none}.how>h2{font-size:27px}.steps{max-width:1044px;margin:35px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.step{position:relative}.step:not(:last-child):after{content:"→";position:absolute;right:-24px;top:72px;color:#b1b7a6}.step-number{font-size:11px;font-weight:700;color:#828b75;letter-spacing:.13em}.step-icon{display:flex;align-items:center;justify-content:center;background:white;border:1px solid #e9e7da;border-radius:21px;width:76px;height:76px;font-size:39px;color:#818d78;margin:14px auto 19px}.step:nth-child(2) .step-icon{color:#a98464}.step:nth-child(3) .step-icon{color:#7299a0}.step h3{font-size:17px;margin-bottom:9px}.step>p:last-child{font-size:12px;color:#777d70}.section-intro{color:#72796d;font-size:14px;margin-top:12px}.categories{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:28px}.category{border:1px solid var(--line);border-radius:15px;padding:24px 10px;text-align:center}.category-icon{width:47px;height:47px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;font-size:28px;margin-bottom:14px}.orange .category-icon{background:#faeee2;color:#b57543}.blue .category-icon{background:#e9f1f5;color:#668fa0}.purple .category-icon{background:#f0ebf6;color:#937ba3;font-size:23px}.pink .category-icon{background:#faedf0;color:#b58090}.green .category-icon{background:#ecf2e5;color:#809067}.category h3{font-size:16px;margin-bottom:6px}.category-status{font-size:11px;color:#71766b}.category-status b{font-weight:400;margin-left:8px}a.category:hover{border-color:#cbad8a;background:#fffdf8}.about{display:grid;grid-template-columns:1fr 1.1fr;gap:65px;border-top:1px solid var(--line);padding-top:68px;padding-bottom:68px}.about h2{font-size:32px;line-height:1.75}.about h2 span{color:#987644}.about-decoration{display:flex;align-items:center;gap:19px;margin-top:19px}.about-decoration span:nth-child(1){color:#a5ba8f;font-size:45px}.about-decoration span:nth-child(2){color:#f0d57b;font-size:26px}.about-decoration span:nth-child(3){color:#b6a5c3;font-size:30px}.about-text{padding-top:36px}.about-text h3{font-size:19px;margin-bottom:22px}.about-text p{font-size:15px;line-height:2.1;margin-bottom:18px}.sns{text-align:center;background:#f6f8f7;border-radius:22px;padding:45px 25px;margin-bottom:65px;max-width:1044px}.sns h2{font-size:26px;margin-bottom:13px}.sns>p:not(.eyebrow){font-size:14px;color:#6d776b}.social-links{display:flex;justify-content:center;gap:16px;margin-top:25px}.social-links>a,.social-pending{display:flex;align-items:center;gap:15px;border:1px solid #e0e5df;background:#fff;border-radius:10px;padding:13px 22px;font-size:14px;font-weight:600}.social-links span{font-size:24px;line-height:1}.social-links b{font-weight:400}.social-pending small{font-size:10px;font-weight:400;color:#70776c}.mobile-break{display:none}footer{max-width:1160px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:25px 58px;margin:auto}footer .brand{font-size:21px}footer p{font-size:11px;color:#7c8175}.skip-link{position:fixed;top:-100px;left:10px;background:#fff;padding:10px;z-index:10}.skip-link:focus{top:10px}@media(max-width:800px){.header{padding:22px 25px}.header nav{gap:18px}.header nav a:nth-child(2){display:none}.hero{padding:38px 30px 45px;gap:25px}.hero h1{font-size:43px}.hero-art{min-height:330px}.hero-sheet{width:235px}.round-label{width:85px;height:85px;font-size:11px;right:-5px}.round-label strong{font-size:12px}.art-label{font-size:11px;left:8px}.hero-note{font-size:10px}.benefits{gap:30px;font-size:12px}.section{padding:56px 30px}.section-heading{display:block}.section-heading p:last-child{margin-top:10px}.material{grid-template-columns:.8fr 1.2fr}.material-content{padding:27px 23px}.material-preview{padding:45px 17px;min-height:350px}.material-preview .cards-sheet{width:220px}.material h3{font-size:22px}.categories{gap:9px}.category h3{font-size:14px}.about{gap:30px}.about h2{font-size:28px}.sns{margin:0 30px 50px;padding:35px 20px}footer{padding:25px 30px}}
@media(max-width:600px){body{font-size:16px}.header{padding:20px}.brand{font-size:23px}.header nav{font-size:11px;gap:0}.header nav .nav-social{display:none}.hero{display:flex;flex-direction:column;align-items:stretch;padding:30px 24px 38px;gap:35px}.hero-copy{position:relative;z-index:1}.hero .eyebrow{font-size:11px}.hero h1{font-size:46px;margin-bottom:22px}.hero-sub{font-size:20px}.hero-description{font-size:15px}.hero-note{font-size:11px}.hero .button{font-size:15px}.hero-art{min-height:330px;max-width:350px;width:100%;align-self:center}.hero-sheet{width:244px}.art-label{top:0;left:15px}.round-label{bottom:5px;right:0;width:94px;height:94px}.round-label strong{font-size:13px}.spark-one{right:8px;font-size:27px}.spark-two{left:3px;bottom:15px;font-size:32px}.benefits{gap:14px;padding:16px 10px;font-size:10px}.section{padding:48px 22px}h2{font-size:25px}.section-heading{margin-bottom:23px}.section-heading p:last-child{font-size:12px}.material{grid-template-columns:1fr;border-radius:18px}.material-preview{min-height:300px;padding:40px 25px 20px}.material-preview .cards-sheet{width:250px}.material-content{padding:25px 23px 28px}.material h3{font-size:25px}.material-content>p{font-size:15px}.material-details{font-size:14px}.word-chain{font-size:13px;gap:7px}.format-note{font-size:10px!important}.how>h2{font-size:23px}.steps{grid-template-columns:1fr;gap:32px;margin-top:27px;text-align:left}.step{display:grid;grid-template-columns:70px 1fr;column-gap:18px}.step-number{grid-column:2;grid-row:1}.step-icon{grid-column:1;grid-row:1/4;margin:0;width:66px;height:74px;border-radius:16px}.step h3{grid-column:2;font-size:17px;margin:4px 0}.step>p:last-child{grid-column:2;font-size:13px}.step:not(:last-child):after{display:none}.categories{grid-template-columns:repeat(2,1fr);gap:12px;margin-top:23px}.category{padding:20px 13px}.category:last-child{grid-column:1/3;display:grid;grid-template-columns:55px 1fr;align-items:center;text-align:left;column-gap:14px}.category:last-child .category-icon{grid-row:1/3;margin:0}.category:last-child h3{margin:0}.category h3{font-size:16px}.category-status{font-size:12px}.about{grid-template-columns:1fr;gap:10px}.about h2{font-size:29px}.about h2 br:nth-of-type(2){display:none}.about-decoration{margin-top:8px}.about-text{padding-top:6px}.about-text h3{font-size:18px;margin-bottom:18px}.about-text p{font-size:15px}.sns{margin:0 22px 40px;padding:32px 19px}.sns h2{font-size:22px}.sns>p:not(.eyebrow){font-size:13px}.mobile-break{display:block}.social-links{flex-direction:column;gap:11px;margin-top:22px}.social-links>a,.social-pending{justify-content:flex-start;font-size:15px;padding:16px}.social-pending small,.social-links b{margin-left:auto}footer{padding:23px 22px}.hero .button{width:100%;max-width:320px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* 実際のPDFをそのまま紹介画像に使用 */
.pdf-sheet{padding:0;overflow:hidden;border-radius:5px}.pdf-sheet img{display:block;width:100%;height:auto}.material-preview .pdf-sheet{width:245px}.hero-art{min-height:460px}@media(max-width:800px){.hero-art{min-height:370px}.material-preview .pdf-sheet{width:215px}}@media(max-width:600px){.hero-art{min-height:385px}.material-preview{padding-top:55px}.material-preview .pdf-sheet{width:240px}}

.material-details p{margin-bottom:12px}.material-details a{color:var(--orange);text-decoration:underline}.material-content img{max-width:100%;height:auto}
