@charset "UTF-8";

/*
  CSS entry point
  案件でCSSファイルを増減するときだけ編集する。

  ★すべてのHTMLがこの1ファイルだけを読む。
    ページCSS（page/*.css）も全ページで読み込まれるが、該当クラスが無ければ
    影響しない。ファイルを分けているのは配信の最適化ではなく、
    「どこに書くか」を一意に決めるため（request.md の「実装先」欄がこれに対応する）。

  ★ページを増やしたら、page/[ページ名].css を作り、下の import を1行足す。
    忘れるとCSSが効かず、原因が分かりにくい。
*/
@layer reset, vendor, base, layout, component, page;

@import url("./core/foundation.css");

/* 外部CSS（Swiper 等）を使う場合だけ、コメントを外して layer(vendor) で読み込む。
   ★必ず layer(vendor) を付けること。レイヤーに属さないスタイルは
     すべてのレイヤーより強く、BEM側からの上書きが効かなくなる（§2）。
     <link rel="stylesheet"> にはレイヤーを指定する手段が無いため、
     外部CSSは必ずこの @import 経由で読み込む。
@import url("https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css") layer(vendor);
*/

@import url("./project/fonts.css") layer(base);
@import url("./project/settings.css") layer(base);
@import url("./project/component.css") layer(component);
@import url("./project/page/top.css") layer(page);
@import url("./project/page/join.css") layer(page);
@import url("./project/page/seminar.css") layer(page);
@import url("./project/page/reservation.css") layer(page);
@import url("./project/page/concept.css") layer(page);
@import url("./project/page/form-complete.css") layer(page);
@import url("./project/page/strengths.css") layer(page);
@import url("./project/page/privacy.css") layer(page);
@import url("./project/page/works.css") layer(page);
@import url("./project/page/works-detail.css") layer(page);
@import url("./project/page/works-content.css") layer(page);
@import url("./project/page/information.css") layer(page);
@import url("./project/page/data.css") layer(page);
@import url("./project/page/member-login.css") layer(page);
@import url("./project/mobile-navigation.css") layer(page);

/* ページを増やすときは、ここに1行足す
@import url("./project/page/about.css") layer(page);
*/