/* 基本的なスタイル */
       .story .wrap{
            width: 100%;
            max-width:1200px;
            position: relative;
            height: 100%;
            margin: 0 auto;
            padding:30px 0;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            background: #f0f0f0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #fff;
        }


/* Swiperコンテナのスタイル */
        .swiper {
            width: 100%;
            max-width: 100%;
            height: 100%;
            padding-bottom: 20px;
        }

        /* 各スライド（ページ）のスタイル */
        .swiper-slide {
            display: flex;
            /* Flexboxを使って中の要素を中央揃えに */
            text-align: center;
            padding: 20px;
            box-sizing: border-box;
            /* paddingを含めたサイズ計算に */
            background: #fff;
  justify-content: center;
  align-items:stretch;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
        }
        .swiper-slide img {
            min-width:46%;
            max-width:46%;
            height: auto;
            max-height:680px;
            border-radius: 10px 0 0 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }

        .swiper-slide div.rbox {
            font-size:22px;
            line-height:1.5;
            color: #333;
            min-width:46%;
            max-width:46%;
            padding:0;
            display: flex;
  justify-content: center;
  align-items: center;
              border-radius:0 10px 10px 0;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            border: 1px solid #ddd;
            -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
        }
        button#back-to-start-btn{
            width: 100%;
            max-width: 320px;
            padding: 10px;
        }
         .swiper-slide p{
            width: 100%;
            padding:20px 0 0 0;
            text-align: center;
         }
        .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal{
            bottom:0px;
            z-index: 500;
        }
        .swiper-slide div.rbox p{
padding: 0;
margin: 0;
list-style: 1;
        }
        .swiper-slide div.rbox p a{
font-size:13px;
        }        

        /* レスポンシブ対応：スマホサイズの時 */
        @media (max-width: 767px) {
            .story .wrap{
                padding: 0;
            }
            .swiper-slide {
                padding: 0 0px 10px 0px;
            }
            .swiper-slide  div.rbox,
            .swiper-slide img {
                min-width: 96%;
                max-width: 96%;
            }
            .swiper-slide img{
                border-radius: 10px 10px 0 0;
            }


            .swiper-slide  div.rbox {
                font-size:16px;
                padding: 2em 0;
                min-height: 282px;
                border-radius: 0 0 10px 10px;
            	align-items:flex-start;	
            }
        .swiper-pagination.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal{
position:absolute;
bottom:inherit;
top:20px;
        }            

        }