/*
Theme Name: となりの製作室
Theme URI: https://tonarino-seisakushitsu.site/
Author: となりの製作室
Description: となりの製作室トップページと、ブラウザ内変換ツール「となりの変換くん」を収録した専用テーマです
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: tonari-studio
*/
:root{--tn-blue:#2d78c8;--tn-deep:#174f87;--tn-sky:#eaf6ff;--tn-line:#cfe2f2;--tn-cream:#fffaf0;--tn-text:#27445f;--tn-muted:#637b8f;--tn-radius:20px;--tn-shadow:0 8px 30px rgba(54,91,122,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--tn-text);background:#fff;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;line-height:1.9}img{max-width:100%;display:block}a{color:var(--tn-deep);text-decoration:none}a:hover{text-decoration:underline}button,input,select{font:inherit}.tn-container{width:min(1120px,calc(100% - 40px));margin:auto}
.tn-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid var(--tn-line);backdrop-filter:blur(10px)}.tn-header-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.tn-brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;white-space:nowrap}.tn-brand img{width:38px;height:38px;object-fit:contain}.tn-brand small{display:block;color:var(--tn-muted);font-size:10px;font-weight:500}.tn-nav{display:flex;gap:22px;align-items:center;overflow-x:auto;white-space:nowrap;font-size:13px;font-weight:700}.tn-nav .tool-link{padding:7px 13px;background:var(--tn-sky);border-radius:999px}
.tn-hero{border-bottom:1px solid var(--tn-line);background:linear-gradient(90deg,#f9fdff 0,#fff 48%,#f7fbf7 100%)}.tn-hero-grid{min-height:520px;display:grid;grid-template-columns:.9fr 1.25fr;align-items:stretch}.tn-hero-copy{padding:78px 50px 70px 10px;align-self:center}.tn-eyebrow{color:#5c8caf;font-size:13px;letter-spacing:.08em}.tn-hero h1{margin:.15em 0 0;color:var(--tn-deep);font-size:clamp(38px,5vw,64px);line-height:1.25;letter-spacing:.08em}.tn-title-sub{font-weight:700;color:var(--tn-deep);font-size:20px}.tn-hero-image{overflow:hidden}.tn-hero-image img{width:100%;height:100%;object-fit:cover;object-position:center}
.tn-button-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.tn-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:8px 22px;border:1px solid #9ec3e5;border-radius:999px;background:#fff;font-weight:700}.tn-button.primary{color:#fff;background:var(--tn-blue);border-color:var(--tn-blue)}.tn-button:hover{filter:brightness(.96);text-decoration:none}
.tn-section{padding:92px 0}.tn-section.alt{background:#fbfdff;border-top:1px solid #edf4f9;border-bottom:1px solid #edf4f9}.tn-section-heading{display:flex;align-items:center;justify-content:center;gap:10px}.tn-section-heading.left{justify-content:flex-start}.tn-section-heading span{color:#75b893;font-size:26px}.tn-section h2{margin:0;color:var(--tn-deep);font-size:30px;letter-spacing:.06em}.tn-lead{text-align:center;max-width:860px;margin:16px auto 42px;color:#536f85}.tn-center{text-align:center;margin-top:34px}
.tn-icon-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:14px}.tn-icon-grid article{min-height:160px;padding:22px 12px;border:1px solid var(--tn-line);border-radius:16px;background:#fff;text-align:center;box-shadow:var(--tn-shadow)}.tn-icon-grid img{width:74px;height:74px;object-fit:contain;margin:0 auto 10px}.tn-icon-grid h3{font-size:13px;line-height:1.5;margin:0}
.tn-card-grid{display:grid;gap:24px}.tn-works-grid{grid-template-columns:repeat(3,1fr)}.tn-card{overflow:hidden;border:1px solid var(--tn-line);border-radius:var(--tn-radius);background:#fff;box-shadow:var(--tn-shadow)}.tn-card>img{width:100%;height:200px;object-fit:cover;background:#f6fbff}.tn-card-body{padding:24px}.tn-card h3{margin:.5em 0;color:var(--tn-deep)}.tn-card p{color:#5e7385;font-size:14px}.tn-card a{display:block;margin-top:8px;font-weight:700;font-size:14px}.tn-label{display:inline-block;padding:4px 10px;border-radius:999px;background:#f3eefc;color:#715a87;font-size:11px}.tn-tool-grid{grid-template-columns:repeat(4,1fr)}.tn-tool-card>img{width:90px;height:90px;margin:22px auto 0;object-fit:contain}.tn-tool-card .tn-card-body{padding-top:10px}
.tn-values{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:42px}.tn-values article{text-align:center;padding:28px 20px}.tn-values article>span{font-size:35px;color:#71a8cf}.tn-values h3{font-size:17px;color:var(--tn-deep)}.tn-values p{font-size:14px;color:#63798c}
.tn-profile-grid{display:grid;grid-template-columns:170px 1.25fr 1fr 1fr;gap:32px;align-items:start;margin-top:44px}.tn-profile-img{width:150px;height:150px;border-radius:50%;object-fit:cover;border:5px solid #eef7fb}.tn-profile-grid h3{color:var(--tn-deep);margin-top:0}.tn-profile-grid ul{padding-left:1.2em}.tn-tags{display:flex;flex-wrap:wrap;gap:8px}.tn-tags span{padding:5px 9px;border-radius:8px;background:#eef5fb;font-size:12px}
.tn-contact-section{background:#fffdf7}.tn-contact-box{position:relative;padding:54px;border:1px solid #eadfca;border-radius:24px;background:linear-gradient(120deg,#fff 0,#fffdf8 75%,#f4fbf5 100%);overflow:hidden}.tn-contact-box>p{max-width:760px}.tn-contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:800px;margin-top:32px}.tn-contact-card{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:138px;padding:18px;border:1px solid var(--tn-line);border-radius:16px;background:#fff;text-align:center}.tn-contact-card>span{font-size:30px;color:#5d9bcc}.tn-contact-card small{color:#75889a}.tn-contact-plant{position:absolute;right:-40px;bottom:-78px;width:260px;opacity:.75}
.tn-news-list{max-width:820px;margin:36px auto 0;border-top:1px solid var(--tn-line)}.tn-news-list article{display:grid;grid-template-columns:140px 1fr;gap:30px;padding:17px 10px;border-bottom:1px solid var(--tn-line)}.tn-news-list p{margin:0}
.tn-footer{padding:42px 0;background:#f8fcff;border-top:1px solid var(--tn-line)}.tn-footer-inner{display:flex;justify-content:space-between;align-items:center;gap:24px}.tn-footer-brand{display:flex;align-items:center;gap:12px}.tn-footer-brand img{width:42px}.tn-footer small{color:var(--tn-muted)}
/* Converter */
.cv-page{background:#fffdf8}.cv-hero{padding:76px 20px 68px;text-align:center;background:linear-gradient(120deg,#eef9ff,#fffaf0);border-bottom:1px solid #dcecf3}.cv-badge{display:inline-flex;gap:8px;align-items:center;padding:7px 13px;border:1px solid #b9def0;border-radius:999px;background:white;color:#4f7f99;font-size:12px;font-weight:700}.cv-hero h1{font-size:clamp(39px,6vw,68px);line-height:1.25;margin:20px 0 12px}.cv-hero h1 em{font-style:normal;color:#3d9bd2}.cv-hero p{color:#657c8d}.cv-wrap{max-width:1000px;margin:auto;padding:80px 20px}.cv-heading{text-align:center;margin-bottom:34px}.cv-heading h2{font-size:32px;margin:0}.cv-heading p{color:#788b99}.cv-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}.cv-tab{min-height:95px;border:1px solid #d5e8f3;border-radius:15px;background:white;color:#24384a;cursor:pointer;padding:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.cv-tab.active{border:2px solid #3d9bd2;background:#f5fbff}.cv-tab small{font-size:10px;color:#8093a0}.cv-panel{border:1px solid #d5e8f3;border-radius:24px;background:#fff;padding:34px 40px;box-shadow:0 18px 55px rgba(68,116,139,.1)}.cv-intro{padding-bottom:22px;border-bottom:1px solid #e8f0f3}.cv-intro h2{margin:0 0 5px;font-size:21px}.cv-intro p{margin:0;color:#758795;font-size:12px}.cv-drop{height:280px;border:2px dashed #a8d5e9;border-radius:18px;background:#f7fcff;margin-top:27px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;cursor:pointer}.cv-drop:hover,.cv-drop.dragging{background:#eaf8ff;border-color:#55a9d6}.cv-drop input{position:absolute;opacity:0;pointer-events:none}.cv-upload{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:#dff3ff;color:#3c9bd1;font-size:28px;font-weight:800}.cv-drop small{color:#8b9ba5}.cv-work{margin-top:26px}.cv-file{display:flex;gap:14px;align-items:center;padding:13px;background:#f6fafc;border-radius:14px}.cv-file img{width:72px;height:58px;object-fit:cover;border-radius:8px}.cv-file div{display:flex;flex-direction:column;flex:1;min-width:0}.cv-file b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cv-file small{color:#80929f}.cv-file button{border:0;background:transparent;font-size:24px;cursor:pointer}.cv-settings{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:25px 0}.cv-settings label{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:800}.cv-settings select{border:1px solid #cfe2eb;border-radius:10px;padding:12px;background:white}.cv-quality{grid-column:1/3}.cv-quality span{display:flex;justify-content:space-between}.cv-quality input{accent-color:#3d9bd2}.cv-convert{width:100%;border:0;border-radius:12px;background:#3d9bd2;color:white;padding:15px;font-weight:900;cursor:pointer;box-shadow:0 5px 0 #c5e5f4}.cv-convert:disabled{opacity:.6}.cv-result{display:flex;align-items:center;gap:12px;margin-top:18px;background:#effaf5;border:1px solid #ccebdc;padding:13px 15px;border-radius:12px}.cv-check{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#50ad83;color:white}.cv-result div{display:flex;flex-direction:column;flex:1}.cv-download{background:#45a579;color:white!important;padding:9px 13px;border-radius:8px;font-size:11px;font-weight:900}.cv-privacy{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:23px;color:#718694;font-size:11px}.cv-coming{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.cv-coming h3{font-size:22px;margin-bottom:4px}.cv-coming p{color:#7a8c98}.cv-error{color:#bd4f4f;background:#fff1f1;padding:11px;border-radius:9px}.cv-info{padding:80px 20px;background:#edf8fd}.cv-info-inner{max-width:950px;margin:auto}.cv-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.cv-info article{background:white;border:1px solid #d4e7f0;border-radius:16px;padding:24px}.cv-info h3{margin-top:0}.cv-info p{font-size:13px;color:#718594}.hidden{display:none!important}
@media(max-width:900px){.tn-hero-grid{grid-template-columns:1fr}.tn-hero-copy{padding:54px 10px 36px}.tn-hero-image{height:390px}.tn-icon-grid{grid-template-columns:repeat(3,1fr)}.tn-works-grid{grid-template-columns:1fr 1fr}.tn-tool-grid,.tn-values{grid-template-columns:1fr 1fr}.tn-profile-grid{grid-template-columns:150px 1fr}}
@media(max-width:640px){.tn-container{width:min(100% - 28px,1120px)}.tn-header{position:static}.tn-header-inner{align-items:flex-start;flex-direction:column;padding:12px 0}.tn-nav{width:100%;padding-bottom:6px}.tn-hero-grid{min-height:0}.tn-hero-copy{padding:42px 0 30px}.tn-hero h1{font-size:38px}.tn-hero-image{height:280px}.tn-button-row{display:grid}.tn-button{width:100%}.tn-section{padding:68px 0}.tn-section h2{font-size:25px}.tn-icon-grid{grid-template-columns:1fr 1fr}.tn-works-grid,.tn-tool-grid,.tn-values,.tn-profile-grid,.tn-contact-grid{grid-template-columns:1fr}.tn-contact-box{padding:36px 24px}.tn-contact-plant{display:none}.tn-news-list article{grid-template-columns:1fr;gap:0}.tn-footer-inner{flex-direction:column;align-items:flex-start}.cv-hero{padding-top:55px}.cv-wrap{padding:60px 13px}.cv-tabs{gap:6px}.cv-tab{padding:9px 4px;font-size:12px}.cv-tab small{display:none}.cv-panel{padding:24px 14px}.cv-drop{height:235px}.cv-settings{grid-template-columns:1fr}.cv-quality{grid-column:auto}.cv-result{flex-wrap:wrap}.cv-download{width:100%;text-align:center}.cv-info-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
