@charset "UTF-8";

  /* ********************************************************** ここから通常の CSSを記載 ******************************************************************** */

    @media screen and (max-width: 360px) and (max-height: 740px) and (orientation: portrait) {

  /* -------------------------------------------------------------------- body -------------------------------------------------------------------- */

    body {
          font-size: 0.9375rem;                             /* 15px */
         }

  /* ===================================================================  TOPS  =================================================================== */

    .TOPS { padding: 5px 0 20px; }

  /* -------------------------------------------------- メイン画像 -------------------------------------------------- */

    .TOPS .main-image {
/*                     flex-shrink: 0; */                   /* 「スペースが足りなくても、この要素を勝手に縮めないでください」という指定 */
                       flex: none;                          /* flex: none; を指定すると flex-shrink: 0; も含まれる */
                       margin-bottom: 15px;
                      }

  /* -------------------------------------------------- main-logo -------------------------------------------------- */

    .TOPS .LOGO {
                 position: static;                          /* .style.css の absolute を解除 */
                 text-align: left;
                 transform: none;
                 margin-bottom: 20px;
                 padding: 0 15px;
                 width: 100%;
                }

    .TOPS .LOGO h1 {
                    margin: 0;
                    font-size: clamp(18px, 4.5vw, 22px);
                   }

    .TOPS .LOGO img {
                     flex-shrink: 0;
                     margin: 0 auto;
                     max-width: 95%;
                    }

  /* -------------------------------------------------- 説明文と掲示板 -------------------------------------------------- */

    .TOPS .Preface {
                    flex: none;
                    flex-direction: column;
                    gap: 20px;                              /* Info と news の間の隙間 */
                    padding: 0 10px;
                    width: 100%;
                   }

    .TOPS .Info, .TOPS .news {
                              flex: none;                   /* 要素を勝手に伸ばしたり縮めたりしない */
                              padding: 15px 10px;
                              width: 100%;
                              height: auto;
                             }

    .TOPS .info p, .TOPS .news p {
                                  line-height: 1.7;         /* 行間の指定 */
                                 }

    .TOPS .Info p:last-child,
    .TOPS .news p:last-child {
                              margin-bottom: 0;
                             }

  /* =============================================================  TOPS-2P : TOPS-3P  ============================================================ */

    .TOPS-2P, .TOPS-3P {
                        height: auto;                       /* style.css の height: 100vh; を解除 */
                        min-height: 100vh;
                        min-height: 100svh;
                       }

  /* -------------------------------------------------- ヌルっと表示 -------------------------------------------------- */

    .TOPS-2P_inner, .TOPS-3P_inner {
                                    flex-direction: column;           /* 3カラム → 縦並び */
                                    gap: 30px;
                                    width: 100%;
                                    height: auto;
                                    padding: 20px 10px;
                                    box-sizing: border-box;
                                   }

  /* ============================================== 各 カラム ============================================= */

    .col {
          flex: none;
          width: 100%;
          height: auto;
         }

    /* PC用の階段配置を解除 */

    .col-top, .col-middle, .col-bottom { align-items: stretch; }

  /* =============================================== カード =============================================== */

    .card {
           padding: 20px 10px;
           width: 100%;
           border-radius: 16px;
          }

  /* ========================================== title（タイトル） ========================================= */

    .card_title {
                 margin: 0 0 14px 0;
                 font-size: 20px;
                }

  /* ================================================ 画 像 =============================================== */

    .card_img {
               margin: 0 auto 20px;
               width: 100%;
               height: auto;
               overflow: hidden;
              }

    .card_img img {                                         /* 画像の指定 */
                   display: block;
                   width: 100%;
                   height: 100%;
                   object-fit: cover;
                  }

  /* =============================================== 解説文 =============================================== */

    .card_text {
                margin: 0 0 14px 0;
                font-size: 0.9375rem;                       /* 15px */
               }

  /* ================================================ ボタン ============================================== */

    .card_btn {
               padding: 7px 24px;
               font-size: 0.9375rem;                        /* 15px */
              }

  /* ------------------------------------------------------------------- footer ------------------------------------------------------------------- */

    .footer {
             padding: 15px 10px;
             min-height: auto;
            }

                                                                                               }          /* @media end */

  /* ********************************************************** ここから通常の CSSは終了 ******************************************************************** */





  /* ------------------------------------------------------------------------- LINE ------------------------------------------------------------------------- */

  /* ---------------------------------------------------------------------------  --------------------------------------------------------------------------- */   /* 160 */

  /* ----------------------------------------------------------------------  ---------------------------------------------------------------------- */  /* 150 */

  /* -----------------------------------------------------------------  ----------------------------------------------------------------- */  /* 140 */

  /* ------------------------------------------------------------  ------------------------------------------------------------ */  /* 130 */

  /* -------------------------------------------------------  ------------------------------------------------------- */  /* 120 */

  /* --------------------------------------------------  -------------------------------------------------- */  /* 110 */

  /* ---------------------------------------------  --------------------------------------------- */  /* 100 */