/* ======================================= コースページ 共通スタイル （自動車工業科・商業科など、学科ページ間で共有） 各ページ側の で、このファイルの後に ページ固有CSS（automotive.css / shogyo.css 等）を読み込み、 --course-bg / --course-accent を上書きして使う。 ======================================= */ /* ======================================= 共通リセット ======================================= */ body, h1, h2, h3, h4, p, ul, li, figure { margin: 0; padding: 0; list-style: none; } body { font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif; color: #333; line-height: 1.7; background-color: var(--course-bg); } a { text-decoration: none; color: inherit; } img { max-width: 100%; height: auto; display: block; } /* ======================================= 共通インナー ======================================= */ .crs-inner { max-width: 100rem; margin: 0 auto; padding: 0 1.6rem; } @media (min-width: 768px) { .crs-inner { padding: 0 4rem; } } /* ======================================= ヒーロー ======================================= */ .crs-hero { margin-top: var(--header-h-sp); width: 100%; } @media (min-width: 768px) { .crs-hero { margin-top: var(--header-h-pc); } } .crs-hero img { width: 100%; } /* SP時のみ表示する定員バッジ（ヒーロー画像内のテキストが縮小され読みづらくなるため実テキストで補足） */ .crs-hero__quota { display: flex; align-items: center; justify-content: center; padding: 1rem 1.6rem; background-color: var(--course-bg); text-align: center; } .crs-hero__quota-label { display: inline-block; border: 0.15rem solid var(--course-accent); color: var(--course-accent); font-weight: bold; font-size: 1.3rem; padding: 0.2rem 1rem; border-radius: 0.2rem; } .crs-hero__quota-num { font-weight: bold; font-size: 1.6rem; color: var(--course-accent); margin-left: 0.5rem; } /* ======================================= ポイント（01 / 02 / 03）共通部分 ※ 見出し画像や写真の並べ方はページごとに異なるため、 ここでは余白・本文テキストなど共通の骨格のみを定義する ======================================= */ .crs-point { padding: 0 0 3.6rem; } .crs-point__head { margin-bottom: 1.2rem; } .crs-point__title { width: 100%; } .crs-point__text { font-size: 1.75rem; font-weight: 600; line-height: 1.9; margin-bottom: 1.6rem; } @media (min-width: 768px) { .crs-point__text { font-size: 1.5rem; } } /* ======================================= SP/PC 表示切り替え ======================================= */ .u-sp-only { display: block; } .u-pc-only { display: none; } @media (min-width: 768px) { .u-sp-only { display: none; } .u-pc-only { display: block; } }