@charset "UTF-8";

  /* ===================================================================== small mobile ===================================================================== */


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

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

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

   body {
         margin: 0;
         font-family: 'YuKyokasho', 'Yu Kyokasho', 'UD Digi Kyokasho N-R', 'Yu Mincho', 'YuMincho', '游明朝', 'Roboto', 'Yu Gothic UI', 'Meiryo', serif;
         font-size: 0.875rem;                               /* 14px */
        }

  /* -------------------------------------------------------------- header -------------------------------------------------------------- */

    .header {
             padding: 12px 15px;
            }

  /* ---------------------------------------------------------- ページタイトル ---------------------------------------------------------- */

    .header-title {
                   gap: 15px;
                  }

    .header h1 {
                font-size: 22px;
               }

    .header p {
               display: none;
              }

  /* ---------------------------------------------------------- Responsive Main --------------------------------------------------------- */

    .responsive-main {
                      padding: 25px 10px;
                     }

  /* ----------------------------------------------------------- Section 共通 ----------------------------------------------------------- */

    .section-1,
    .section-2,
    .section-3 {
                flex-direction: column;
               }

    .section-1,
    .section-2 {
                margin-bottom: 35px;
               }

  /* ------------------------------------------------------------ Section 画像 ------------------------------------------------------------ */

    .section-image {
                    order: 1;                               /* 画像を 1番目に表示 */
                    width: 100%;
                   }

  /* ---------------------------------------------------------- Section Content --------------------------------------------------------- */

    .section-content {
                      order: 2;                             /* 文章を 2番目に表示 */
                      padding: 20px 15px;
                      width: 100%;
                     }

  /* ------------------------------------------------------- Section Content / h2 ------------------------------------------------------- */

    .section-content h2 {
                         margin: 0 0 12px;
                         font-size: 20px;
                        }

  /* -------------------------------------------------------- Section Content / p -------------------------------------------------------- */

    .section-content p {
                        margin: 0;
                        margin-bottom: 1em;
                       }

  /* ========================================================== Page Top Button ========================================================= */

    .page-top {
               display: block;
               position: fixed;
               right: 20px;
               bottom: 25px;
               width: 48px;
               height: 48px;
               border: none;
               border-radius: 50%;
               font-size: 18px;                             /* フォントの大きさを指定 */
               color: #111;
               background-color: transparent;               /* 背景色を透明にする */
               cursor: pointer;
               z-index: 1000;

               opacity: 0;
               visibility: hidden;
               transform: translateX(80px);
               transition: opacity 0.4s ease,
                           transform 0.4s ease,
                           visibility 0.4s;
              }

    .page-top.show {
                    opacity: 1;
                    visibility: visible;
                    transform: translateX(0);
                   }

                                                                                             }          /*----- @media end -----*/ 

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





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

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

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

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

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

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

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

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