/* /course/: shared site shell and footer CTA, with article link cards. */
.course-page .kids-hero-mask-one img { width:488.35px;height:325.61px;left:-79.67px;top:-27.31px;object-fit:cover; }
.course-page .kids-hero-mask-two img { width:672px;height:449px;left:-130.65px;top:-73.88px;transform:none;object-fit:cover; }
.course-recommended { position:relative; }
.course-heading-cloud { position:absolute;right:-18px;top:36.93px;transform:rotate(180deg) scaleY(-1);pointer-events:none; }
.course-section-heading { position:relative;display:flex;flex-direction:column;align-items:center;gap:8px; }
.course-page .course-select { position:relative;padding:6px 10px;border-radius:100px;background:var(--color-accent-pink-1);color:var(--color-main);font:700 12px/1 var(--font-ja);letter-spacing:0; }
.course-select-mark { position:absolute;left:-7px;top:-8px;transform:rotate(139.95deg) scaleY(-1); }
.course-card-list { display:flex;flex-direction:column;gap:12px;width:100%; }
.course-card { display:block;padding:16px;border-radius:20px;background:var(--color-white);color:var(--color-text);text-decoration:none;transition:opacity .25s ease; }
.course-card:hover,.course-card:focus-visible { opacity:.65; }
.course-card-inner { display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:16px;border:1px dashed var(--color-main);border-radius:12px; }
.course-card-photo { position:relative;width:100%;aspect-ratio:322/215;overflow:hidden;border-radius:12px; }
.course-card-photo img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center; }
.course-card h3 { max-width:100%;padding:4px;border-bottom:1px dashed var(--color-main);color:var(--color-main);font:700 18px/1.2 var(--font-ja);letter-spacing:0; }
.course-page .course-card p { font-size:14px;line-height:1.4;letter-spacing:.42px; }
.course-duration { display:flex;margin:0;font-size:12px;line-height:1;letter-spacing:0; }
.course-duration dt,.course-duration dd { padding:4px 8px;margin:0;font-weight:500; }
.course-duration dt { display:flex;align-items:center;background:var(--color-accent-beige); }
.course-duration dd { border:1px solid var(--color-accent-beige); }
.course-more { align-self:flex-end;padding:8px 16px;border-radius:33px;background:var(--color-text);color:var(--color-white);font-size:14px;line-height:1;filter:drop-shadow(1px 1px 1px var(--color-text)); }
.course-more:hover { opacity:.65; }
.course-map { display:flex;flex-direction:column;align-items:center;gap:4px; }
.course-map h3 { width:100%;padding:8px;background:var(--color-accent-beige);text-align:center;font:500 18px/1 var(--font-ja);letter-spacing:.54px; }
.course-map-image { display:block;width:100%;height:auto; }
.course-map-link { display:flex;align-items:center;justify-content:center;gap:4px;padding:8px 12px;border:1px solid var(--color-text);border-radius:44px;font-size:14px;line-height:1; }
.course-map-link:hover { opacity:.65; }
.course-season { display:flex;flex-direction:column;gap:8px;padding:16px 20px 16px 24px;background:var(--color-white);border-left:4px solid var(--color-accent-pink-2);border-radius:0 2px 2px 0; }
.course-season-2 { border-left-color:#e8dbc6; }
.course-season-3 { border-left-color:#f2c0ff; }
.course-season-4 { border-left-color:#d2e9ff; }
.course-season h3 { display:flex;align-items:center;gap:6px;font:700 16px/1 var(--font-ja);letter-spacing:.48px; }
.course-season h3 img { flex:none; }
.course-tip { display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:32px 24px 24px;border:1px solid var(--color-accent-beige);background:var(--color-white); }
.course-tip h3 { padding:2px 4px;background:var(--color-accent-beige);font:500 18px/1.2 var(--font-ja);letter-spacing:.54px; }
.course-tip ul { display:flex;flex-direction:column;gap:8px;width:100%; }
.course-tip li { display:flex;align-items:flex-start;gap:4px; }
.course-tip li img { flex:none;margin-top:8px; }
.course-tip li span { flex:1;min-width:0; }
@media(max-width:389px) {
 .course-card { padding:12px; }
 .course-card-inner { padding:12px; }
 .course-card h3 { font-size:16px; }
 .course-season { padding-left:16px;padding-right:16px; }
 .course-tip { padding-left:16px;padding-right:16px; }
}
.course-page .kids-related h3 { color:var(--color-main); }