﻿
 @charset "UTF-8";

  /* ======================================================================== tablet ======================================================================== */


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

    @media screen and (min-width: 768px) and (max-width: 1032px) and (orientation: portrait) {

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

   body {
         font-size: 1rem;                                   /* 16px */
         background-attachment: scroll;
        }

  /* -------------------------------------------------------------- Header -------------------------------------------------------------- */

    .header {
             padding: 20px 25px;
            }

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

    .header-title {
                   gap: 30px;
                  }

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

    .header p {
               font-size: 1.125rem;                         /* 18px */
              }

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

    .responsive-main {
                      padding: 40px 40px;                   /* 余白指定 */
                     }

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

    .section-1,
    .section-2,
    .section-3 {
                flex-direction: column;                               /* 縦並び */
/*              align-items: stretch; */
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);           /* 背景に影を指定 */
               }

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

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

    .section-image {
                    order: 1;                               /* 表示する順番を決める数字（画像を 1番）*/
                    width: 100%;
                   }

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

    .section-content {
                      order: 2;                             /* 表示する順番を決める数字（文章を 2番）*/
                      padding: 30px;
                      width: 100%;
                     }

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

    .section-content h2 {
                         margin: 0 0 18px;
                         font-size: 24px;
                        }

    .section-content .Oshi {
                            top: 10px;
                            left: 200px;
                            width: 60px;
                           }

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

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

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

    .page-top {
               display: block;
               position: fixed;
               right: 25px;
               bottom: 30px;
               width: 50px;
               height: 50px;
               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 */

