/* Compact flat illustrations for the six existing category cards. */
#theme .theme{background:#fff;align-items:center;padding:13px 12px;gap:11px;min-width:0;transition:border-color .15s,background .15s}
#theme .theme:hover{border-color:#c8a96e;background:#fffcf7}
#theme .theme:focus-visible{outline:2px solid #568b87;outline-offset:3px}
#theme .t-illustration{display:block;width:48px;height:48px;flex:0 0 48px}
#theme .t-illustration img{display:block;width:100%;height:100%}
#theme .t-body{padding:0;min-width:0;flex:1}
#theme .t-no{display:block;background:none;width:auto;font-size:10px;letter-spacing:.1em;color:#a08049;line-height:1.3;margin-bottom:4px}
#theme .t-name{line-height:1.5}
#theme .t-word{display:inline-block;white-space:nowrap}
@container(max-width:640px){
 #theme .theme{padding:12px 8px;gap:6px;min-height:92px}
 #theme .t-illustration{width:32px;height:32px;flex-basis:32px}
 #theme .t-no{font-size:9px}
 #theme .t-name{font-size:11.5px;line-height:1.6}
}

/* Stage and series illustrations follow the same compact visual style. */
.phase-row .ph-head{display:grid;grid-template-columns:40px minmax(0,1fr);gap:9px;align-items:center}
.ph-illustration,.se-illustration{display:block;width:40px;height:40px;flex:0 0 40px}
.ph-illustration img,.se-illustration img{display:block;width:100%;height:100%}
.ph-copy{display:flex;flex-direction:column;min-width:0}
.series .se-top{gap:10px;align-items:center}
.se-heading{display:flex;flex-direction:column;gap:4px;min-width:0}
.se-heading .type{align-self:flex-start}
@container(max-width:640px){
 .phase-row .ph-head{grid-template-columns:32px minmax(0,1fr);gap:9px}
 .ph-illustration,.se-illustration{width:32px;height:32px;flex-basis:32px}
 .ph-copy{flex-direction:row;align-items:baseline;gap:8px;flex-wrap:wrap}
 .series .se-top{gap:8px}
}

.ph-unit{display:inline-block;white-space:nowrap}

/* Roadmap illustrations stay before the title and readable on dark headers. */
.route-main .rm-head{display:grid;grid-template-columns:minmax(0,1fr) 120px auto;gap:12px;align-items:center}
.rm-heading{display:flex;gap:10px;align-items:center;min-width:0}
.rm-illustration{display:block;width:36px;height:36px;flex:0 0 36px;background:#fff;border-radius:5px}
.rm-illustration img{display:block;width:100%;height:100%;padding:2px}
.rm-title{min-width:0;line-height:1.6}
.rm-title-unit{display:inline-block;max-width:100%}
@container(max-width:640px){
 .route-main .rm-head{grid-template-columns:minmax(0,1fr) auto;gap:10px}
 .rm-heading{grid-column:1/-1;gap:9px}
 .rm-illustration{width:32px;height:32px;flex-basis:32px}
 .route-main .rm-title{font-size:13px;line-height:1.65}
 .route-main .rm-meta{margin-left:0}
}

/* Reading sequence and total article counts have different visual roles. */
#route .route-steps .r-no{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:3px;width:64px;min-height:28px;flex-shrink:0;padding:6px 7px;border:1.5px solid #bd9555;border-radius:5px;background:#fbf4e7;color:#805c25;font-size:11px;font-weight:800;line-height:1.2;letter-spacing:.07em;align-self:flex-start}
#route .route-steps a.done .r-no::after{font-size:8px;letter-spacing:0;white-space:nowrap}
.article-count{display:inline-flex!important;align-items:center;gap:3px;width:fit-content;padding:3px 7px!important;border:1px solid #d2e0de;border-radius:4px;background:#f0f5f4;color:#45696d!important;font-size:10px!important;line-height:1.35!important;font-weight:400;white-space:nowrap;vertical-align:middle;letter-spacing:0}
.article-count strong{font-size:12px;font-weight:700;line-height:1.2}
@container(max-width:640px){
 #route .route-steps a{align-items:center}
 #route .route-steps .r-no{align-self:center}
 #route .route-steps .r-title{flex:1;min-width:0}
}

/* Roadmap steps are disclosed only when a reader chooses a route. */
.route-main>summary.rm-head{cursor:pointer;list-style:none;grid-template-columns:minmax(0,1fr) 120px auto auto}
.route-main>summary.rm-head::-webkit-details-marker{display:none}
.route-main>summary.rm-head::marker{content:""}
.route-main>summary.rm-head:hover{background:#242424}
.route-main>summary.rm-head:focus-visible{outline:2px solid #c8a96e;outline-offset:-4px}
.rm-toggle{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;border:1px solid #816b42;border-radius:5px;padding:5px 8px;color:#d3b579;font-size:10px;line-height:1.4}
.rm-hide{display:none}
.rm-symbol{display:inline-block;font-size:15px;line-height:1;transition:transform .15s}
.route-main[open] .rm-hide{display:inline}
.route-main[open] .rm-show{display:none}
.route-main[open] .rm-symbol{transform:rotate(45deg)}
@container(max-width:640px){
 .route-main>summary.rm-head{grid-template-columns:minmax(0,1fr) auto auto;gap:9px}
 .route-main .rm-heading{grid-column:1/-1}
 .route-main .rm-bar{width:min(120px,100%)}
 .route-main .rm-meta{font-size:9px}
 .rm-toggle{padding:4px 6px;font-size:9px}
}

/* Light roadmap headers reduce the visual weight of the collapsed list. */
#route .route-main{border-color:#dedbd4;background:#fff}
#route .route-main>summary.rm-head{background:#fff;color:#294455;border-left:3px solid #c8a96e;padding-left:13px}
#route .route-main>summary.rm-head:hover{background:#faf8f3}
#route .route-main[open]>summary.rm-head{background:#faf8f3;border-bottom:1px solid #e6e1d7}
#route .rm-illustration{background:transparent}
#route .rm-meta{color:#7d8586}
#route .rm-bar{background:#e8e6df}
#route .rm-bar i{background:#c8a96e}
#route .rm-toggle{background:#fffdf8;border-color:#d7c7a7;color:#87672e}

/* Compact two-column roadmap choices, with independent step disclosure. */
#route .roadmap-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
#route .route-main+.route-main{margin-top:0}
#route .route-main>summary.rm-head{grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:16px 14px 16px 13px;min-height:90px}
#route .rm-heading{grid-column:auto}
#route .rm-title-unit{display:block}
#route .rm-toggle{justify-self:end}
#route .route-steps.s6{grid-template-columns:1fr}
#route .route-steps.s6 a{display:flex;flex-direction:row;align-items:center;gap:10px;border-right:0;border-top:1px solid #eeece8;padding:12px}
#route .route-steps.s6 a:first-child{border-top:0}
#route .route-steps .r-no{align-self:center}
#route .route-steps .r-title{flex:1;min-width:0}
@container(max-width:800px){
 #route .roadmap-list{grid-template-columns:1fr;gap:10px}
 #route .route-main>summary.rm-head{grid-template-columns:minmax(0,1fr);min-height:100px;gap:8px;padding:12px 14px 10px 11px}
}

/* A clear typographic hierarchy for the site's central promise. */
.hero .kicker{display:flex;align-items:center;gap:10px;color:#c8a96e}
.hero .kicker::before{content:"";width:24px;height:2px;background:#c8a96e;flex-shrink:0}
.hero h1.hero-copy{margin:16px 0 18px;line-height:1.5;letter-spacing:.035em}
.hero-copy .hero-intro{display:block;font-size:25px;color:#f7f5ef;font-weight:700}
.hero-copy .hero-promise{display:block;width:fit-content;font-size:36px;font-weight:800;color:#d8b878;padding-bottom:5px;background:linear-gradient(to right,#c8a96e 0%,#c8a96e 25%,transparent 25%) left bottom/100% 2px no-repeat}
.hero .sub{max-width:620px;color:#c4c3bd;font-size:13px;line-height:1.9;margin-bottom:24px}
@container(max-width:640px){
 .hero .kicker{font-size:8px;letter-spacing:.1em;gap:8px}
 .hero .kicker::before{width:16px}
 .hero h1.hero-copy{margin:14px 0 16px;letter-spacing:.015em}
 .hero-copy .hero-intro{font-size:21px}
 .hero-copy .hero-promise{font-size:25px;white-space:nowrap;padding-bottom:7px}
 .hero .sub{font-size:12px;line-height:1.9;margin-bottom:22px}
}

/* The promise and a timely seminar share the first view. */
.hero-top{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:36px;align-items:center}
.hero-message,.hero-seminar{min-width:0}
.hero-message .sub{margin-bottom:0;max-width:420px}
.hero-seminar h2{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#d8b878;margin-bottom:10px;letter-spacing:.06em}
.hero-seminar h2::before{content:"";width:5px;height:5px;border-radius:50%;background:#c8a96e}
.seminar-player{aspect-ratio:16/9;width:100%;border:1px solid #61543d;border-radius:8px;background:radial-gradient(ellipse at 75% 20%,#39484a 0,transparent 65%),linear-gradient(135deg,#293437,#1e272a);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;overflow:hidden}
.seminar-player iframe{width:100%;height:100%;border:0}
.seminar-play{width:52px;height:52px;display:flex;align-items:center;justify-content:center;border:1px solid #c8a96e;border-radius:50%;color:#1a1a1a;background:#d8b878;box-shadow:0 4px 16px #0003}
.seminar-play svg{margin-left:3px}
.seminar-placeholder{font-size:12px;letter-spacing:.1em;color:#d0d5d2}
.seminar-title{margin-top:9px;color:#c4c3bd;font-size:12px;line-height:1.7}
.hero-search{margin-top:28px;padding-top:24px;border-top:1px solid #383631}
.hero-search .search-big{max-width:100%}
.hero .stats{margin-top:22px}
@container(max-width:800px){
 .hero-top{grid-template-columns:1fr;gap:24px}
 .hero-message .sub{max-width:620px}
 .hero-seminar{max-width:620px;width:100%}
 .hero-search{margin-top:22px;padding-top:20px}
}

.hero-top{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
@container(max-width:800px){.hero-top{grid-template-columns:1fr}}

/* An airy ivory first view with restrained navy and gold accents. */
.hero{background:linear-gradient(120deg,#f9f8f4 0%,#f2f3f0 100%);color:#294455;border-top:1px solid #e1e3dd;padding-top:40px;padding-bottom:32px}
.hero .kicker{color:#886b3a}
.hero .kicker::before{background:#b5965e}
.hero-copy .hero-intro{color:#294455}
.hero-copy .hero-promise{color:#896831;background-image:linear-gradient(to right,#b5965e 0%,#b5965e 25%,transparent 25%)}
.hero .sub{color:#5d6b70}
.hero .seminar-title{color:#5d6b70}
.hero .seminar-player{border-color:#b9c5c3;box-shadow:0 8px 24px #29445512}
.hero-search{border-top-color:#dcded7}
.hero .search-big{border:1px solid #d7ddd8;box-shadow:0 3px 12px #29445505}
.hero .search-big .sb-input{color:#294455}
.hero .search-big .sb-input::placeholder{color:#85918f}
.hero .search-big .sb-btn{background:#b5965e;color:#fff}
.hero .hot .hot-label{color:#71807e}
.hero .hot a{color:#526b70;border-color:#cdd6d1;background:#ffffff80}
.hero .hot a:hover{background:#fff;border-color:#b5965e}
.hero .stats{border-top-color:#dcded7}
.hero .stats div{color:#71807e}
.hero .stats b{color:#294455}
@container(max-width:640px){.hero{padding-top:28px;padding-bottom:26px}}
/* The TOP header follows the light first view. */
.site-header{background:#fff;border-bottom:1px solid #e7e9e3}
.site-header .site-logo{color:#294455}
.site-header .site-logo span{color:#7b898b}
.site-header .header-nav a{color:#677b80}
.site-header .header-nav a.active{color:#896831}
.site-header .btn-mypage{color:#896831;border-color:#c5ad80}
.site-header .hamburger{color:#294455}

/* New articles have concise headlines and compact illustrated covers. */
#archive .shelf-cards{gap:14px}
#archive .new-card{display:block;min-width:0;background:#fff;border-color:#dce2de;border-radius:8px;transition:border-color .15s,box-shadow .15s}
#archive .new-card:hover{border-color:#b5965e;box-shadow:0 4px 14px #2944550c}
#archive .new-card:focus-visible{outline:2px solid #568b87;outline-offset:3px}
#archive .sh-thumb{position:relative;height:116px;background:#f0f4f1;border-bottom-color:#e1e7e1}
#archive .new-47 .sh-thumb,#archive .new-43 .sh-thumb{background:#f6f1e6}
#archive .new-44 .sh-thumb{background:#edf1f4}
#archive .sh-thumb img{display:block;width:76px;height:76px}
#archive .sh-thumb .type{position:absolute;left:10px;top:10px;font-size:9px}
#archive .sh-body{padding:13px 14px 14px}
#archive .sh-cat{font-size:10px;color:#89703e;margin-bottom:7px}
#archive .sh-title{font-size:14px;line-height:1.65;color:#294455;margin:0;min-height:47px}
#archive .sh-title span{display:block}
#archive .sh-meta{font-size:10px;line-height:1.6;color:#798783;margin-top:8px}
@container(max-width:640px){
 #archive .shelf-cards{display:grid;grid-template-columns:1fr;overflow:visible;gap:10px}
 #archive .new-card{display:grid;grid-template-columns:96px minmax(0,1fr)}
 #archive .sh-thumb{height:100%;min-height:116px;border-bottom:0;border-right:1px solid #e1e7e1}
 #archive .sh-thumb img{width:66px;height:66px;margin-top:12px}
 #archive .sh-thumb .type{left:7px;top:7px;font-size:8px}
 #archive .sh-body{padding:11px 12px}
 #archive .sh-title{font-size:12px;min-height:0;line-height:1.65}
 #archive .sh-cat{font-size:9px;margin-bottom:5px}
 #archive .sh-meta{font-size:9px;margin-top:6px}
}

/* New article icons quietly accompany the headline like the A–D sections. */
#archive .new-card{display:grid;grid-template-columns:40px minmax(0,1fr);gap:11px;align-items:center;padding:15px 13px}
#archive .sh-thumb{height:40px;min-height:0;width:40px;background:transparent!important;border:0;overflow:visible}
#archive .sh-thumb img{width:40px;height:40px;margin:0}
#archive .sh-thumb .type{display:none}
#archive .sh-body{min-width:0;padding:0}
#archive .sh-cat{margin-bottom:5px}
#archive .sh-title{font-size:13px;min-height:0;line-height:1.65}
#archive .sh-meta{margin-top:7px}
@container(max-width:640px){
 #archive .new-card{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:13px 12px}
 #archive .sh-thumb{width:32px;height:32px;min-height:0}
 #archive .sh-thumb img{width:32px;height:32px;margin:0}
 #archive .sh-title{font-size:12px}
}


/* New content forms its own quiet panel, distinct from the A–D sections. */
#archive{margin:22px 24px 6px;padding:23px 22px 24px;border:1px solid #d6dedb;border-radius:12px;background:#f3f6f4;box-shadow:0 4px 16px #29445506}
#archive .sec-head{align-items:center;margin-bottom:18px}
#archive .sec-head h2{color:#294455;font-size:19px;font-weight:700;letter-spacing:.035em;line-height:1.5;padding:0;border:0;background:none;box-shadow:none}
#archive .sec-head h2::before,#archive .sec-head h2::after{content:none}
#archive .see-all{color:#627b7d}
#archive .new-card{border-color:#e0e5e1;background:#fff}
@container(max-width:640px){
 #archive{margin:18px 16px 4px;padding:18px 12px;border-radius:10px}
 #archive .sec-head{gap:8px;margin-bottom:15px}
 #archive .sec-head h2{font-size:17px;letter-spacing:.025em}
 #archive .see-all{font-size:10px}
}

#academy-industries .industry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
#academy-industries .industry-card{display:flex;align-items:center;gap:11px;padding:17px 13px;border:1px solid #d9e1de;border-radius:8px;background:#fff;color:#294455;font-size:13px;font-weight:700;line-height:1.6;min-width:0}
#academy-industries .industry-card img{display:block;width:36px;height:36px;flex:0 0 36px}
@container(max-width:800px){#academy-industries .industry-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container(max-width:640px){#academy-industries .industry-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}#academy-industries .industry-card{gap:7px;padding:13px 9px;font-size:11px}#academy-industries .industry-card img{width:28px;height:28px;flex-basis:28px}}

#academy-industries .industry-word{display:inline-block;white-space:nowrap}