/* =========================================================
   custom.css
   追加・修正用CSS

   使い方：
   - Next.jsが出力した _next/static/... のCSSはなるべく触らず、
     後から直したい見た目はこの custom.css に追記する。
   - index.html の </head> の直前に下記を追加して読み込む。
     <link rel="stylesheet" href="./custom.css">
   ========================================================= */


/* =========================================================
   1. 共通調整
   ========================================================= */

/* 必要になったらここに全体調整を書く */


/* =========================================================
   2. PC表示の調整
   ========================================================= */

@media screen and (min-width: 768px) {
  /* PC・タブレット幅での調整 */
}


/* =========================================================
   3. スマホ表示の調整
   ========================================================= */

@media screen and (max-width: 767px) {
  /* スマホ幅での調整 */
}


/* =========================================================
   4. 画像差し替え箇所の調整
   ========================================================= */

/*
例：
画像を out/images/custom/top-photo01.jpg に入れて、
index.html 側で <img src="./images/custom/top-photo01.jpg" alt=""> とした場合、
サイズ調整などが必要ならここに書く。

例：
.custom-top-photo {
  width: 100%;
  height: auto;
  display: block;
}
*/


/* =========================================================
   5. 一時的な非表示
   ========================================================= */

/*
リンク切れ箇所や未使用要素を一時的に非表示にしたい場合、
index.html 側に class="is-hidden" を付けると非表示になります。
*/

.is-hidden {
  display: none !important;
}