@charset "utf-8";

/*=======================================               END  ================*/
.end{display: flex;width:100%;text-align: center;}

/*============================================================================
      .end_left,.end_right
=============================================================================*/
.end_left,.end_right{margin-top: 60px;width:25%;height:100vh;}
    .end_1,.end_3{height: 48%;} /*=== 画像の高さ ===*/
    .end_2,.end_4{height: 52%;} /*=== 画像の高さ ===*/

/*============================================================================
      .end_center   .end_center_group
=============================================================================*/
.end_center{position: relative;top: 60px;width:50%;height:100vh;
            z-index: 99;}/*=== 99 ここを上にしないと　hover時に全体を選択できない===*/
    .end_center_group{position: absolute;transform: translate(-50%,-50%);
                      width: 100%;text-align: center;
                      top: 46%;left:50%;}

      .jyuliyan_com{/*文字「jyuliyan.com」*/
                   font-family: 'Oswald', sans-serif;font-size: 30px;
                   letter-spacing: 2px;padding-top:50px;color:white;}
      .for-pc{display: none;}/*文字「HPのURL」*/
      .qr{width:80px;margin-top: 5px;padding-bottom: 30px;}
      .for-mobile{/*文字「for MOBILE」*/
                  font-family: 'Oswald', sans-serif;font-size: 20px;
                  color:white;padding-top:5px;margin-top: -15px;}

      .rink{width: 300px;margin: -10px auto 0;}

      .gamensize,.happy,.haiku
               {display:block;width: 100%;height: 25px;
                font-family: 'Oswald', sans-serif;letter-spacing: 1px;
                font-size: 15px;padding-top: 10px;color:tan;
                border-top: 1px solid tan;}
      .haiku{height: 45px;border-bottom: 1px solid tan;}/*最後の行だけ　下線を追加*/

      .gamensize:hover{color:yellow;}
      .happy:hover{color:darkorange;}
      .haiku:hover{color:pink;}
      .old_20xx:hover{color:darkorange;}

      .old{display: flex;justify-content: center;margin-top: -20px;}
      .old_20xx{display:block;width: 75px;height: 30px;
        font-family: 'Oswald', sans-serif;letter-spacing: 1px;
        font-size: 15px;padding-top: 1px;color:tan;
        border: 1px solid tan;}

      /*=====enter_kaiin =============================================*/
      .btn_kaiin{width:200px;
               display: inline-block;
               font-size: 15px;    /* ［会員専用」サイズ */
               padding: 3px 30px 3px; /* ［会員専用」アキ */
               color: darkred;/* ［会員専用」文字色 */
               margin-top: 20px;
               border-radius:30px;
               border:1px solid plum;
               background: plum;
               transition: all 0.4s ease-out;}
      .btn_kaiin:hover{
               border-color:transparent;color: #fff;
               background: linear-gradient(270deg,#dc143c 0%, #660014 50%, #dbafb8 100%);
               background-size: 200% auto;
               background-position: right center;
               box-shadow: 0 5px 10px rgb(250,108,159,0.4);}
      /*===== jasrak_mark ==============================================*/
      .end_center_group .jasrak_mark{width:auto;height: 50px;margin: 40px auto 0;}
      .jasrak_no{font-size: 12px;margin-top: 3px;letter-spacing: 2px;color:white;}

/*=======================================================================================
      レスポンシブ
=======================================================================================*/

@media screen and (max-width:1540px)/*　____________________　max-width:1540px */
{
/*======  end_center_group  ============*/
.end_center_group{top: 45%;left:50%;}
.jyuliyan_com{/*文字「jyuliyan.com」*/
             font-size: 30px;
             letter-spacing: 2px;padding-top:55px;color:white;}
.for-pc{display: none;}/*文字「HPのURL」*/
.qr{width:80px;margin-top: 5px;padding-bottom: 5px;}
.for-mobile{/*文字「for MOBILE」*/
            font-size: 15px;padding-top:1px;margin-top: -15px;}

.rink{width: 300px;margin: -10px auto 0;}

.gamensize,.index_2024,.index_2023,.index_2022,.index_2021
         {width: 100%;height: 20px;
          font-size: 15px;padding-top: 7px;
          border-top: 1px solid tan;}
.index_2021{height: 40px;border-bottom: 1px solid tan;}/*最後の行だけ　下線を追加*/
.btn_kaiin{width:200px;
         font-size: 15px;    /* ［会員専用」サイズ */
         padding: 3px 30px 3px; /* ［会員専用」アキ */
         margin-top: -10px;}
/*===== jasrak_mark ===============*/
.end_center_group .jasrak_mark{width:auto;height: 40px;margin: 10px auto 0;}
.jasrak_no{font-size: 10px;padding-bottom: 70px;}
}

@media screen and (max-width:700px)/*　____________________　max-width:700px */
{
.end_left,.end_right{display: none;}
.end_center{top: 60px;width:100%;height:100vh;}
.jyuliyan_com{/*文字「jyuliyan.com」*/
               font-size: 25px;padding-top:60px;}
.rink{width: 240px;margin: -10px auto 0;}
.old_20xx{width: 60px;height: 30px;font-size: 15px;padding-top: 1px;}

.btn_kaiin{width:200px;
         font-size: 15px;    /* ［会員専用」サイズ */
         padding: 3px 30px 3px; /* ［会員専用」アキ */
         margin-top: -10px;}
}

@media screen and (max-width:450px)/*　____________________　max-width:450px */
{
.end_center{z-index: 1;/*=== 99 ここを上にしないと　hover時に全体を選択できない===*/}
.end_center_group{top: 35%;left:50%;}
.jyuliyan_com{font-size: 30px;letter-spacing: 1px;padding-top:50px;}/*文字「jyuliyan.com」*/
.for-pc{display: block;color:white;font-size: 10px;
        margin-top: -15px;letter-spacing: 1px;}/*文字「HPのURL」 表示*/
.qr{display: none;}/*QR 非表示*/
.for-mobile{display: none;}/*文字「for MOBILE」非表示*/
.rink{width: 240px;margin: 20px auto 0;}
.old_20xx{width: 60px;height: 30px;font-size: 15px;padding-top: 2px;}

.btn_kaiin{width:200px;
           font-size: 15px;    /* ［会員専用」サイズ */
           padding: 2px 30px 4px; /* ［会員専用」アキ */
           margin-top: 10px;}
/*===== jasrak_mark ===============*/
.end_center_group .jasrak_mark{margin: 15px auto 0;}
.jasrak_no{font-size: 10px;padding-bottom: 0px;margin-top: 5px;}
}

@media screen and (max-width:321px)/*　____________________　max-width:331px */
{
.end_center_group{top: 200px;left:50%;}
.jyuliyan_com,.for-pc{display: none;}/*文字「jyuliyan.com」「アドレス」スペースないので非表示*/
.rink{width: 168px;margin:0px auto 0;}
.old_20xx{width: 42px;height: 30px;font-size: 15px;padding-top: 1px;}

.btn_kaiin{width:160px;
           font-size: 15px;    /* ［会員専用」サイズ */
           padding: 4px 5px 3px; /* ［会員専用」アキ */
           margin-top: -20px;}
}