@charset "UTF-8"; @media screen and (min-width: 768px),print {
    .slick-list-wap {
        background-image: url(../images/index/sra-bg.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: 100%;
    }

    .ugoki-loop {
        transform: rotate(-2deg);
        --nagare-w: 3246px;
        /* 背景画像の横幅 */
        --nagare-h: 236px;
        /* 背景画像の高さ */
        --nagare-speed: 30s;
        /* 1周する時間。長いほどゆっくり */
        z-index: 10;
        background-image: url(../images/index/ugoki-loop-01.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 110%;
        position: relative;
        left: -5px;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
        margin-bottom: -61px;
    }

    /* ← 左方向に流す */
    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }

        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ugoki-loop {
            animation: none;
        }
    }

    .ugoki-loop2 {
        transform: rotate(1deg);
        --nagare-w: 4695px;
        /* 背景画像の横幅 */
        --nagare-h: 100px;
        /* 背景画像の高さ */
        --nagare-speed: 30s;
        /* 1周する時間。長いほどゆっくり */
        background-image: url(../images/index/ugoki-loop-02.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 110%;
        position: relative;
        left: -5px;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
        margin-bottom: 98px;
    }

    /* ← 左方向に流す */
    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }

        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ugoki-loop2 {
            animation: none;
        }
    }

    body {
        font-size: 16px;
        background-color: #fff;
    }

    main {
        padding-top: 0;
        padding-bottom: 0;
        overflow: clip;
    }

    .hh-entry-btn {
        opacity: 0;
        pointer-events: none;
        transition: 0.4s;
        z-index: 600;
    }

    .hh-entry-btn.oon {
        opacity: 1;
        pointer-events: auto;
    }

    .hh-logo {
        width: 88px;
        margin: 0 auto;
        position: absolute;
        top: 46px;
        left: 12px;
        right: 0;
        z-index: 200;
    }

    .mv-sra-rel {
        max-width: 1920px;
        width: 100%;
        margin: 0 auto;
        position: relative;
        /* margin-bottom: -92px; */
    }

    .mv-sra-rel .mv-txt-1 {
        width: 43px;
        margin: 0 auto;
        position: relative;
        top: -42px;
        right: -11px;
    }

    .mv-sra-rel .mv-txt-2 {
        position: absolute;
        top: -190px;
        right: 55px;
        filter: drop-shadow(27px 26px 15px rgba(93, 0, 0, 0.2));
    }

    #mv-sra img {
        max-width: 1920px;
        width: 100%;
        margin: 0 auto;
    }

    #c1 {
        background-image: url(../images/index/c1-bg.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
        padding-bottom: 156px;
        padding-top: 169px;
        margin-top: -92px;
    }

    #c1 .inner .ttl {
        width: 1651px;
        margin-left: 10px;
        margin-bottom: 52px;
    }

    #c1 .inner .pic {
        width: 1498px;
        margin: 0 auto;
        margin-bottom: 70px;
        position: relative;
        left: 7px;
    }

    #c1 .inner .txt-1 {
        font-weight: 900;
        font-size: 84px;
        line-height: 102px;
        text-align: right;
        color: #fff;
        margin-right: 65px;
        margin-bottom: 134px;
    }

    #c1 .inner .txt-1 .txt-1-img {
        position: relative;
        top: 5px;
        margin-bottom: -5px;
    }

    #c1 .inner .txt-1 .ss {
        background-color: #000000;
        display: inline-block;
        line-height: 1;
        padding-left: 10px;
        padding-bottom: 14px;
        padding-top: 1px;
        position: relative;
        top: 0px;
    }

    #c1 .inner .rel-box {
        position: relative;
    }

    #c1 .inner .rel-box .pic-2 {
        position: absolute;
        bottom: -156px;
        left: 136px;
    }

    #c1 .nagare {
        --nagare-w: 1739px;
        --nagare-h: 99px;
        --nagare-speed: 25s;
        background-image: url(../images/index/c1-nagare.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 100%;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
    }

    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }
    }

    @keyframes nagare-left {
        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .nagare {
            animation: none;
        }
    }

    #c2 {
        background-image: url(../images/index/c2-bg.png);
        background-repeat: repeat;
        background-position: center 0;
        padding-top: 165px;
        padding-bottom: 1px;
    }

    #c2 .inner .ttl {
        width: 1581px;
        margin-left: 170px;
        margin-bottom: 134px;
    }

    #c2 .inner .s-ttl {
        text-align: center;
        margin-bottom: 53px;
    }

    #c2 .inner .s-ttl .ss {
        font-weight: 500;
        font-size: 24px;
        text-align: center;
        color: #fff;
        display: block;
        position: relative;
        left: 7px;
        margin-bottom: 9px;
    }

    #c2 .inner .s-ttl .ss1 {
        background-color: #202929;
        font-weight: 900;
        font-size: 56px;
        /* text-align: center; */
        color: #fff;
        line-height: 1;
        padding: 1px 6px 9px 1px;
        display: inline-block;
        position: relative;
        left: 10px;
    }

    #c2 .inner .s-ttl .ss1 .ss2 {
        color: #ede391;
    }

    #c2 .inner .s-ttl .s-ttl-img {
        width: 679px;
        margin: 0 auto;
        display: block;
        position: relative;
        left: 13px;
    }

    #c2 .inner .pic-1 {
        margin-bottom: 149px;
    }

    #c2 .inner .pic-1 img {
        width: 100%;
    }

    #c2 .inner .ugoki2 {
        margin-bottom: 80px;
    }

    #c2 .inner .ugoki2 img {
        width: 100%;
    }

    #c2 .inner .system-list {
        display: flex;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        width: 1758px;
        margin: 0 auto;
        margin-bottom: 156px;
        position: relative;
        left: 7px;
    }

    #c2 .inner .system-list li {
        width: 854px;
    }

    #c2 .inner .system-list li a {
        color: #fff;
    }

    #c2 .inner .system-list li a:hover {
        text-decoration: none;
    }

    #c2 .inner .system-list li a:hover .system-ttl-1 {
        text-decoration: underline;
    }

    #c2 .inner .system-list .system-pic {
        margin-bottom: 61px;
        background-color: #e0e0e0;
    }

    #c2 .inner .system-list .system-pic img {
        aspect-ratio: 854 / 569;
        max-width: 100%;
        height: auto;
    }

    #c2 .inner .system-list .system-ttl-1 {
        font-weight: bold;
        font-size: 24px;
        letter-spacing: 0.15em;
        line-height: 34px;
        text-align: center;
        color: #fff;
        padding-bottom: 59px;
        border-bottom: 1px solid #F58D89;
    }

    #c2 .inner .system-list .system-info {
        padding: 60px 51px 5px;
    }

    #c2 .inner .system-list .system-info .system-flex {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 4px;
    }

    #c2 .inner .system-list .system-info .system-flex .system-box-l {
        width: 96px;
    }

    #c2 .inner .system-list .system-info .system-flex .system-box-l .system-color {
        display: block;
        width: 96px;
        background-color: #202929;
        padding: 4px 5px 3px;
        text-align: center;
        font-weight: normal;
        font-size: 14px;
        letter-spacing: 0.2em;
        text-align: center;
        color: #fff;
    }

    #c2 .inner .system-list .system-info .system-flex .system-box-r {
        font-weight: normal;
        font-size: 18px;
        letter-spacing: 0.05em;
        line-height: 1.7;
        text-align: left;
        color: #fff;
        width: calc(100% - 96px);
        padding: 0px 16px 5px;
        position: relative;
        top: 2px;
    }

    #c2 .inner .system-list .hitokoto-box {
        width: 754px;
        margin: 0 auto;
        margin-top: 12px;
    }

    #c2 .inner .system-list .hitokoto-box .hitokoto {
        width: 96px;
        font-weight: 500;
        font-size: 14px;
        text-align: center;
        color: #fff;
        border-bottom: 1px solid #F58D89;
        padding-bottom: 2px;
        margin-bottom: 5px;
    }

    #c2 .inner .system-list .hitokoto-box .txt-box {
        font-weight: 300;
        font-size: 14px;
        letter-spacing: 0.05em;
        line-height: 26px;
        text-align: left;
        color: #fff;
    }

    #c3 {
        max-width: 1920px;
        margin: 0 auto;
        position: relative;
    }

    #c3 .pic-nagare {
        --nagare-w: 2720px;
        --nagare-h: 226px;
        --nagare-speed: 150s;
        margin-bottom: 200px;
        background-image: url(../images/index/c3-nagare.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 100%;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
    }

    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }
    }

    @keyframes nagare-left {
        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .pic-nagare {
            animation: none;
        }
    }

    #c3 .ttl {
        position: absolute;
        top: 215px;
        left: 40px;
    }

    #c3 .inner .ttl-2 {
        width: 1429px;
        margin: 0 auto;
        position: relative;
        left: 18px;
    }

    #c3 .inner .en {
        width: 368px;
        margin-left: auto;
        margin-right: 30px;
    }

    #c3 .inner .pic-set-rel {
        width: 1280px;
        margin: 0 auto;
        height: 772px;
        position: relative;
    }

    /* #c3 .inner .pic-set-rel .pic-ugoki-1 { position: absolute; top: 6px; left: -178px; }
#c3 .inner .pic-set-rel .pic-ugoki-2 { position: absolute; top: 115px; left: 233px; }
#c3 .inner .pic-set-rel .pic-ugoki-3 { position: absolute; top: 263px; right: -213px; }
*/
    #c3 .inner .pic-set-rel .pic-ugoki-1 {
        position: absolute;
        top: -56px;
        left: -178px;
        will-change: transform;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-2 {
        position: absolute;
        top: 185px;
        left: 233px;
        will-change: transform;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-3 {
        position: absolute;
        top: 103px;
        right: -213px;
        will-change: transform;
    }

    #c3 .inner .s-box {
        width: 1100px;
        margin: 0 auto;
        margin-bottom: 194px;
        position: relative;
        left: 136px;
    }

    #c3 .inner .s-box .pic-ugoki-4 {
        position: absolute;
        left: -353px;
        top: -158px;
    }

    #c3 .inner .s-box .inbox {
        width: 850px;
        margin-left: auto;
        position: relative;
    }

    #c3 .inner .s-box .s-ttl {
        margin-bottom: 64px;
    }

    #c3 .inner .s-box .txt-box {
        font-family: "Zen Old Mincho", serif;
        font-style: normal;
        font-weight: 700;
        font-size: 18px;
        line-height: 39px;
        text-align: left;
        color: #000;
        padding-left: 7px;
    }

    #c3 .inner .s-box .txt-box .p-mb {
        margin-bottom: 37px;
    }

    #c3 .inner .s-box-02 {
        background-image: url(../images/index/c3-pic-05.png),url(../images/index/c3-bg-01.png);
        background-repeat: no-repeat;
        background-position: right -15px bottom 0,left 0 top 0;
        padding-top: 96px;
        padding-bottom: 253px;
        margin-bottom: 330px;
    }

    #c3 .inner .s-box-02 .in-box {
        width: 1100px;
        margin: 0 auto;
        position: relative;
    }

    #c3 .inner .s-box-02 .txt-box-2 {
        width: 633px;
        font-family: "Zen Old Mincho", serif;
        font-style: normal;
        font-weight: bold;
        font-size: 18px;
        line-height: 39px;
        text-align: left;
        color: #fff;
        position: relative;
        left: -172px;
    }

    #c3 .inner .s-box-02 .txt-box-2 .s-ttl {
        font-size: 32px;
        letter-spacing: 0.05em;
        line-height: 53px;
        text-align: left;
        color: #fff;
        margin-bottom: 40px;
    }

    #c3 .inner .s-box-02 .txt-box-2 .p-mb {
        margin-bottom: 37px;
    }

    /*============================
#c4
============================*/
    #c4 {
    }

    #c4 .nimaime, #c4 .sanmaime {
        display: none;
    }

    /* #c4 .in-2.is-active .nimaime {
        display: block;
        background-image: url(../images/index/nimaime.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: 100%;
        width: 100%;
        height: 41px;
        position: absolute;
        top: 0;
        left: 0;
    }

    #c4 .in-3.is-active .sanmaime {
        display: block;
        background-image: url(../images/index/sanmaime.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: 100%;
        width: 100%;
        height: 41px;
        position: absolute;
        top: 0;
        left: 0;
    } */

    #c4 .inner {
        position: relative;
        background-image: url(../images/index/c4-bg.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
        /* padding-top: 170px; */
        padding-bottom: 75px;
    }

    #c4 .ttl-box {
        height: 170px;
        background-color: #202929;
    }

    #c4 .ttl-box .in {
        width: 1770px;
        margin: 0 auto;
        position: relative;
    }

    #c4 .ttl {
        margin-left: 20px;
        position: relative;
        top: -75px;
    }


 #c4 .in-ttl-wap{
        width: 1770px;
        margin: 0 auto;
        background-color: #fff;
        position: relative;
        padding-top: 86px;
 }
#c4 .in-ttl-wap .in-ttl{
  width: 775px;
  margin: 0 auto;
  
}


#c4 .inner .kamishibai2-bg-w .arrows {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  top: 415px;
  z-index: 10;
}
#c4 .inner .kamishibai2-bg-w .arrows > div {
  width: 96px;
  height: 96px;
  background-image: url(../images/index/bx-l.svg);
  background-repeat: no-repeat;
  background-position: center 0;
  background-size: 100%;
  position: absolute;
  background-color: #fff;
  border: 1px solid #fff;
}
#c4 .inner .kamishibai2-bg-w .arrows > div:hover {
  cursor: pointer;
  cursor: hand;
  opacity: 0.8;
}
#c4 .inner .kamishibai2-bg-w .arrows .slick_mae {
  left: -47px;
}
#c4 .inner .kamishibai2-bg-w .arrows .slick_ushiro {
  right: 83px;
  transform: scale(-1, 1);
}



    #c4 .inner .kamishibai2-bg-w{
      width: 1770px;
      margin: 0 auto;
      background-color: #fff;
    }


    #c4 .inner .kamishibai2 {

    }

    #c4 .inner .kamishibai2 .in-box {
        width: 1770px;
        margin: 0 auto;
        background-color: #FFFFFF;
        padding: 67px 99px 108px;
        position: relative;
        max-height: 88vh;
    }

    #c4 .inner .kamishibai2 .in-1 {
        /* background-image: url(../images/index/c4-bg.png); */
        /* background-repeat: no-repeat; */
        /* background-position: center 0; */
        /* background-size: cover; */
        /* padding-top: 75px; */
        /* padding-bottom: 75px; */
    }

    #c4 .inner .kamishibai2 .in-1 .in-ttl {
        width: 775px;
        margin: 0 auto;
        margin-bottom: 67px;
    }

    #c4 .inner .kamishibai2 .in-1 .flex {
        width: 1200px;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l {
        width: 480px;
        padding-top: 104px;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l .in-s-ttl {
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l .in-s-ttl .ss1 {
        display: block;
        margin-bottom: 13px;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l .in-s-ttl .ss2 {
        font-weight: bold;
        font-size: 35px;
        letter-spacing: 0.05em;
        line-height: 52px;
        text-align: left;
        color: #E50012;
        margin-bottom: 22px;
        display: block;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l .in-s-ttl .ss2 .iro {
        font-size: 42px;
        color: #cba21e;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l .txt-1 {
        font-weight: bold;
        font-size: 18px;
        letter-spacing: 0.05em;
        line-height: 36px;
        text-align: left;
        color: #e50012;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-r {
        width: 670px;
        position: relative;
        right: -173px;
        top: -12px;
    }

    #c4 .inner .kamishibai2 .in-2 {
    }

    #c4 .inner .kamishibai2 .in-2 .in-ttl {
        width: 775px;
        margin: 0 auto;
        margin-bottom: 55px;
    }

    #c4 .inner .kamishibai2 .in-2 .flex {
        width: 1200px;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l {
        width: 480px;
        padding-top: 86px;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l .in-s-ttl {
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l .in-s-ttl .ss1 {
        display: block;
        margin-bottom: 13px;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l .in-s-ttl .ss2 {
        font-weight: bold;
        font-size: 35px;
        letter-spacing: 0.05em;
        line-height: 52px;
        text-align: left;
        color: #E50012;
        margin-bottom: 20px;
        display: block;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l .in-s-ttl .ss2 .iro {
        font-size: 42px;
        color: #cba21e;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l .txt-1 {
        font-weight: bold;
        font-size: 18px;
        letter-spacing: 0.05em;
        line-height: 36px;
        text-align: left;
        color: #e50012;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-r {
        width: 670px;
        position: relative;
        right: -173px;
        top: -12px;
    }

    #c4 .inner .kamishibai2 .in-3 {
    }

    #c4 .inner .kamishibai2 .in-3 .in-ttl {
        width: 775px;
        margin: 0 auto;
        margin-bottom: 55px;
    }

    #c4 .inner .kamishibai2 .in-3 .flex {
        width: 1200px;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l {
        width: 480px;
        padding-top: 110px;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l .in-s-ttl {
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l .in-s-ttl .ss1 {
        display: block;
        margin-bottom: 13px;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l .in-s-ttl .ss2 {
        font-weight: bold;
        font-size: 35px;
        letter-spacing: 0.05em;
        line-height: 52px;
        text-align: left;
        color: #E50012;
        margin-bottom: 22px;
        display: block;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l .in-s-ttl .ss2 .iro {
        font-size: 42px;
        color: #cba21e;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l .txt-1 {
        font-weight: bold;
        font-size: 18px;
        letter-spacing: 0.05em;
        line-height: 36px;
        text-align: left;
        color: #e50012;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-r {
        width: 670px;
        position: relative;
        right: -172px;
        top: -12px;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-r {
        /* max-height: 500px; height: 100%; */
    }





    #c5 {
        background-image: url(../images/index/c5-bg-01.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
        padding-top: 109px;
        padding-bottom: 110px;
        position: relative;
        left: 0px;
    }

    #c5 .inner {
        width: 1726px;
        margin: 0 auto;
    }

    #c5 .inner .ttl {
        width: 980px;
        margin: 0 auto;
        margin-bottom: 16px;
        position: relative;
        left: 9px;
        margin-bottom: 60px;
    }

    #c5 .inner .bnr-list {
        width: 1726px;
        margin: 0 auto;
        position: relative;
        left: 7px;
        display: flex;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
    }

    #c5 .inner .bnr-list li {
        width: 823px;
    }

    #c5 .inner .bnr-list li:nth-child(2) {
        margin-top: 120px;
    }

    #c5 .inner .bnr-list li a {
        color: #fff;
    }

    #c5 .inner .bnr-list li a:hover img {
        opacity: 0.9;
    }

    #c5 .inner .bnr-list .ii-pic {
        margin-bottom: 15px;
    }

    #c5 .inner .bnr-list .li-txt {
        font-weight: bold;
        font-size: 18px;
        letter-spacing: 0.05em;
        line-height: 34px;
        text-align: left;
        color: #fff;
        position: relative;
        top: -14px;
        margin-left: 31px;
    }

    #c6 .inner {
        background-image: url(../images/index/c6-bg-01.png);
        background-repeat: repeat;
        background-position: center 0;
        padding: 149px 0px 200px;
    }

    #c6 .inner .in-box {
        width: 1320px;
        height: 495px;
        margin: 0 auto;
        background: #000;
        padding: 101px 111px 5px;
        position: relative;
        left: 7px;
    }

    #c6 .inner .in-box .en {
        position: absolute;
        top: -1px;
        left: -43px;
    }

    #c6 .inner .in-box .ttl {
        width: 1111px;
        margin: 0 auto;
        position: absolute;
        top: -18px;
        left: -4px;
        right: 0;
    }

    #c6 .inner .in-box .s-box .pic {
        position: absolute;
        bottom: -60px;
        right: -50px;
    }

    #c6 .inner .in-box .s-box .txt-1 {
        width: 490px;
        font-weight: normal;
        font-size: 14px;
        letter-spacing: 0.05em;
        line-height: 28px;
        text-align: left;
        color: #fff;
    }

    .fuwa2 {
        animation: fuwa 1s infinite linear alternate;
    }

    @keyframes fuwa {
        0% {
            transform: translate(0, 0) ;
        }

        50% {
            transform: translate(0, -6px);
        }

        100% {
            transform: translate(0, 0);
        }
    }

    .banner {
        background: #243034;
        overflow: hidden;
        padding: 32px 0;
    }

    .banner__track {
        display: flex;
        width: max-content;
        white-space: nowrap;
        will-change: transform;
        /* 右上→左下（↙︎）を“途切れず” */
        animation: diagLoop 20s linear infinite;
    }

    .banner__text {
        display: inline-flex;
        font-weight: 800;
        font-size: clamp(28px, 5vw, 78px);
        letter-spacing: 0.04em;
        color: #fff;
        padding-right: 4rem;
        /* 文字セット間の余白 */
    }

    /* 2セットあるので、-50%動かす＝1セット分だけ進む → 継ぎ目が消える */
    @keyframes diagLoop {
        0% {
            transform: translate3d(0%, 0%, 0);
        }

        100% {
            transform: translate3d(-50%, 50%, 0);
        }

        /* ↙︎ */
    }

    @media (prefers-reduced-motion: reduce) {
        .banner__track {
            animation: none;
        }
    }
}

@media screen and (min-width: 766px) and (max-width: 1919px) {
    #c2 .inner .pic-1 {
        margin-bottom: 7.76vw;
    }

    .ugoki-loop {
        transform: rotate(-2deg);
        --nagare-w: 3246px;
        /* 背景画像の横幅 */
        --nagare-h: 12.292vw;
        background-size: auto var(--nagare-h);
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
        margin-bottom: -3.177vw;
    }

    /* ← 左方向に流す */
    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }

        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ugoki-loop {
            animation: none;
        }
    }

    .ugoki-loop2 {
        transform: rotate(1deg);
        --nagare-w: 4695px;
        /* 背景画像の横幅 */
        --nagare-h: 5.208vw;
        background-size: auto var(--nagare-h);
        width: 110%;
        position: relative;
        left: -5px;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
        margin-bottom: 5.104vw;
    }

    /* ← 左方向に流す */
    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }

        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ugoki-loop2 {
            animation: none;
        }
    }

    #c4 .inner .kamishibai .flex .box-r {
        height: 52vh;
    }

    #c4 .inner .kamishibai .flex .box-r img {
        max-width: 100%;
        height: 100%;
    }

    #c4 .inner .kamishibai .in-ttl {
        width: 40.386vw !important;
    }

    #c4 .inner .kamishibai .in-ttl img {
        width: 100%;
    }

    #c4 .inner .in-ttl {
        width: 40.386vw !important;
    }

    #c4 .inner .in-ttl img {
        width: 100%;
    }

}

@media screen and (min-width: 766px) and (max-width: 1900px) {
    #c2 {
        padding-top: 6.594vw;
    }

    #c2 .inner .ttl {
        width: 92.344vw;
        margin-left: 3.854vw;
        margin-bottom: 3.979vw;
    }

    #c2 .inner .ttl img {
        width: 100%;
    }

    #c2 .inner .system-list {
        width: 1100px;
        margin: 0 auto;
        margin-bottom: 156px;
        position: relative;
        left: 7px;
    }

    #c2 .inner .system-list img {
        width: 100%;
    }

    #c2 .inner .system-list li {
        width: 525px;
    }

    #c2 .inner .system-list .hitokoto-box {
        width: 100%;
        margin: 0 auto;
        margin-top: 12px;
    }

    #c2 .inner .system-list .system-info {
        padding: 60px 0px 5px;
    }
}

@media screen and (min-width: 766px) and (max-width: 1850px) {
    /* .ugoki-loop { background-size: auto 157px; margin-bottom: -121px; }
.ugoki-loop2 { background-size: auto 67px; }
*/#c3 .inner .s-box-02 {
        background-position: right -165px bottom 0, left 0 top 0;
    }

    #c5 .inner {
        width: 1200px;
        margin: 0 auto;
    }

    #c4 .ttl-box .in {
        width: 1280px;
    }

    #c4 .inner .kamishibai .in-box {
        width: 1200px;
    }

    #c4 .ttl {
        width: 1258px;
        top: -75px;
        left: 13px;
        z-index: 100;
    }

    #c4 .ttl img {
        width: 100%;
    }

    #c4 .inner .kamishibai .in-1 .flex .box-r {
        width: 497px;
        position: relative;
        right: -74px;
        top: -12px;
    }

    #c4 .inner .kamishibai .in-2 .flex .box-r {
        width: 497px;
        position: relative;
        right: -74px;
        top: -12px;
    }

    #c4 .inner .kamishibai .in-3 .flex .box-r {
        width: 497px;
        position: relative;
        right: -74px;
        top: -12px;
    }

    #c4 .ttl-box {
        height: 111px;
    }

        #c4 .inner .kamishibai2 .in-box {
        width: 1200px;
    }

#c4 .in-ttl-wap{
       width: 1200px;
}

    #c4 .inner .kamishibai2-bg-w {
       width: 1200px;
        margin: 0 auto;
        background-color: #fff;
        position: relative;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-r {
        width: 497px;
        position: relative;
        right: -25px;
        top: -12px;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-r {
        width: 497px;
        position: relative;
        top: -12px;
        right: -25px;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-r {
        width: 497px;
        position: relative;
        right: -25px;
        top: -12px;
    }


#c4 .inner .kamishibai2-bg-w .arrows {
  top: 240px;
}
#c4 .inner .kamishibai2-bg-w .arrows > div {
  width: 96px;
  height: 96px;
}
#c4 .inner .kamishibai2-bg-w .arrows .slick_mae {
  left: -27px;
}
#c4 .inner .kamishibai2-bg-w .arrows .slick_ushiro {
  right: -32px;
}

    #c5 .inner .bnr-list {
        width: 1200px;
    }

    #c5 .inner .bnr-list li {
        width: 572px;
    }

    #c5 .inner .bnr-list li img {
        width: 100%;
    }

    #c5 .inner .bnr-list li:nth-child(2) {
        margin-top: 120px;
    }

    #c5 .inner .bnr-list .li-txt {
        margin-left: 0px;
    }
}

@media screen and (min-width: 766px) and (max-width: 1710px) {
    .hh-logo {
        width: 4.583vw;
        top: 2.396vw;
    }

    .hh-logo img {
        width: 100%;
    }

    .mv-sra-rel .mv-txt-1 {
        width: 2.24vw;
        top: -2.187vw;
        right: -0.99vw;
    }

    .mv-sra-rel .mv-txt-1 img {
        width: 100%;
    }

    #c1 {
        padding-top: 6.193vw;
        margin-top: -5.6vw;
    }

    #c1 .inner .ttl {
        width: 1220px;
        margin-bottom: 48px;
    }

    #c1 .inner .ttl img {
        width: 100%;
    }

    #c1 .inner .pic {
        width: 1200px;
    }

    #c1 .inner .pic img {
        width: 100%;
    }

    #c1 .inner .txt-1 {
        font-weight: 900;
        font-size: 71px;
        line-height: 94px;
        text-align: right;
        color: #fff;
        margin-top: -16px;
    }

    #c1 .inner .txt-1 .txt-1-img {
        width: 887px;
        display: inline-block;
    }

    #c1 .inner .txt-1 .txt-1-img img {
        width: 100%;
        height: auto;
    }

    #c1 .inner .rel-box .pic-2 {
        left: 50px;
        width: 296px;
    }

    #c1 .inner .rel-box .pic-2 img {
        width: 100%;
        height: auto;
    }

    #c3 .inner .ttl-2 {
        width: 1016.98px;
        margin: 0 auto;
        position: relative;
        left: 18px;
    }

    #c3 .inner .ttl-2 img {
        width: 100%;
    }

    #c3 .ttl {
        width: 66.57px;
        left: 27px;
        top: 259px;
    }

    #c3 .ttl img {
        width: 100%;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-1 {
        width: 260px;
        top: 84px;
        left: -36px;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-1 img {
        width: 100%;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-2 {
        width: 573px;
        top: 182px;
        left: 269px;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-2 img {
        width: 100%;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-3 {
        width: 421px;
        top: 215px;
        right: -52px;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-3 img {
        width: 100%;
    }

    #c3 .inner .s-box .pic-ugoki-4 {
        width: 420px;
        left: -43px;
        top: -158px;
    }

    #c3 .inner .s-box .pic-ugoki-4 img {
        width: 100%;
    }

    #c3 .inner .pic-set-rel {
        height: 819px;
    }

    #c3 .inner .s-box {
        width: 1100px;
        margin: 0 auto;
        margin-bottom: 194px;
        left: 0;
    }

    #c3 .inner .s-box .inbox {
        width: 660px;
        margin-right: -7px;
    }

    #c3 .inner .s-box-02 .txt-box-2 {
        width: 633px;
        left: 0;
    }

    #c3 .inner .s-box-02 {
        background-position: right -320px bottom 0, left 0 top 0;
    }
}

@media screen and (min-width: 766px) and (max-width: 1500px) {
    #c3 .inner .s-box-02 {
        background-position: right -516px bottom 0, left -140px top 0;
        margin-bottom: 248px;
    }

    #c3 .inner .s-box-02 .txt-box-2 {
        left: 8px;
    }

    #c6 .inner .in-box {
        width: 1180px;
        padding: 101px 75px 5px;
    }

    #c6 .inner .in-box .s-box .pic {
        right: -120px;
    }
}

@media screen and (max-width: 767px) {
    .slick-list-wap {
        background-image: url(../images/index/sp-sra-bg.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: 100%;
    }

    .ugoki-loop {
        transform: rotate(-2deg);
        --nagare-w: 377.778vw;
        /* 背景画像の横幅 */
        --nagare-h: 28.986vw;
        /* 背景画像の高さ */
        --nagare-speed: 30s;
        /* 1周する時間。長いほどゆっくり */
        z-index: 10;
        background-image: url(../images/index/sp-ugoki-loop-01.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 110%;
        position: relative;
        left: -1.208vw;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
        margin-bottom: -8.937vw;
    }

    /* ← 左方向に流す */
    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }

        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ugoki-loop {
            animation: none;
        }
    }

    .ugoki-loop2 {
        transform: rotate(1deg);
        --nagare-w: 360.87vw;
        /* 背景画像の横幅 */
        --nagare-h: 10.145vw;
        /* 背景画像の高さ */
        --nagare-speed: 30s;
        /* 1周する時間。長いほどゆっくり */
        background-image: url(../images/index/sp-ugoki-loop-02.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 110%;
        position: relative;
        left: -1.208vw;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
        margin-bottom: 18.947vw;
    }

    /* ← 左方向に流す */
    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }

        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ugoki-loop2 {
            animation: none;
        }
    }

    body {
        background-color: #fff;
    }

    .fuwa2 {
        animation: fuwa .8s infinite linear alternate;
    }

    @keyframes fuwa {
        0% {
            transform: translate(0, 0) ;
        }

        50% {
            transform: translate(0, -0.966vw);
        }

        100% {
            transform: translate(0, 0);
        }
    }

    .sp-header {
        padding-top: 0;
    }

    main {
        padding-top: 0;
        padding-bottom: 0;
    }

    .sp-header .h-logo {
        width: 32.367vw;
        position: absolute !important;
        top: 4.106vw;
        left: 4.106vw;
        z-index: 200;
        margin-left: 0;
    }

    .mv-sra-rel {
        max-width: 100%;
        width: 100%;
        margin: 0 auto;
        position: relative;
    }

    .mv-sra-rel .mv-txt-1 {
        left: 4.106vw;
        right: 0;
        width: 8.937vw;
        margin: 0 auto;
        position: absolute;
        top: -5.797vw;
    }

    .mv-sra-rel .mv-txt-2 {
        position: absolute;
        top: -45.894vw;
        right: 13.285vw;
        filter: drop-shadow(27px 26px 15px rgba(93, 0, 0, 0.2));
        display: none;
    }

    #c1 {
        background-image: url(../images/index/sp-c1-bg.webp);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
        padding-top: 13.043vw;
        padding-bottom: 20.048vw;
    }

    #c1 .inner .ttl {
        width: 96.618vw;
        margin-left: 0.242vw;
        margin-bottom: 6.763vw;
    }

    #c1 .inner .pic {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 13.527vw;
        position: relative;
    }

    #c1 .inner .txt-1 {
        width: 91.787vw;
        margin: 0 auto;
        font-weight: 900;
        font-size: 10.145vw;
        line-height: 12.077vw;
        color: #fff;
        margin-bottom: 0.483vw;
    }

    #c1 .inner .txt-1 .sp-ss-1 {
        display: block;
        background-color: #000000;
        position: relative;
        line-height: 1;
        padding: 0.242vw 0.725vw 1.449vw;
        left: -0.242vw;
        width: 92.995vw;
        margin-bottom: 1.449vw;
        margin-top: 1.449vw;
    }

    #c1 .inner .txt-1 .sp-ss-2 {
        display: block;
        background-color: #000000;
        position: relative;
        line-height: 1;
        padding: 0.242vw 0.725vw 1.449vw;
        left: -0.242vw;
        width: 36.957vw;
    }

    #c1 .inner .txt-1 .txt-1-img {
        width: 91.787vw;
        display: inline-block;
        margin-top: 1.449vw;
        margin-bottom: 12.319vw;
    }

    #c1 .inner .rel-box {
        position: relative;
    }

    #c1 .inner .rel-box .pic-2 {
        position: absolute;
        width: 32.126vw;
        right: 4.106vw;
        bottom: -20.048vw;
    }

    #c1 .nagare {
        --nagare-w: 440.338vw;
        --nagare-h: 13.164vw;
        --nagare-speed: 50s;
        background-image: url(../images/index/sp-c1-nagare.png);
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 100%;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
    }

    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }
    }

    @keyframes nagare-left {
        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .nagare {
            animation: none;
        }
    }

    #c2 {
        background-image: url(../images/index/c2-bg.png);
        background-repeat: repeat;
        background-position: center 0;
        padding-top: 13.768vw;
        padding-bottom: 0.242vw;
    }

    #c2 .inner .ttl {
        width: 93.478vw;
        margin-bottom: 18.841vw;
        margin-left: 4.106vw;
    }

    #c2 .inner .s-ttl {
        text-align: center;
        margin-bottom: 8.696vw;
    }

    #c2 .inner .s-ttl .ss {
        font-weight: 500;
        font-size: 4.348vw;
        text-align: center;
        color: #fff;
        display: block;
        position: relative;
        left: 0px;
        margin-bottom: 2.657vw;
    }

    #c2 .inner .s-ttl .ss1 {
        background-color: #202929;
        font-weight: 900;
        font-size: 7.488vw;
        color: #fff;
        line-height: 1;
        padding: 0.242vw 1.449vw 1.208vw 0.242vw;
        display: inline-block;
        position: relative;
        left: 0.483vw;
    }

    #c2 .inner .s-ttl .ss1 .ss2 {
        color: #ede391;
    }

    #c2 .inner .s-ttl .s-ttl-img {
        display: block;
        width: 91.546vw;
        margin: 0 auto;
        margin-bottom: 1.932vw;
    }

    #c2 .inner .pic-1 {
        margin-bottom: 15.459vw;
    }

    #c2 .inner .ugoki2 {
        margin-bottom: 16.184vw;
    }

    #c2 .inner .system-list {
        display: flex;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        width: 83.575vw;
        margin: 0 auto;
        margin-bottom: 4.589vw;
        position: relative;
    }

    #c2 .inner .system-list li {
        width: 100%;
        margin-bottom: 18.599vw;
    }

    #c2 .inner .system-list li a {
        color: #fff;
    }

    #c2 .inner .system-list li a:hover {
        text-decoration: none;
    }

    #c2 .inner .system-list li a:hover .system-ttl-1 {
        text-decoration: underline;
    }

    #c2 .inner .system-list .system-pic {
        margin-bottom: 7.005vw;
        background-color: #e0e0e0;
    }

    #c2 .inner .system-list .system-pic img {
        aspect-ratio: 346 / 244;
        max-width: 100%;
        height: auto;
    }

    #c2 .inner .system-list .system-ttl-1 {
        font-weight: bold;
        text-align: center;
        color: #fff;
        border-bottom: 1px solid #F58D89;
        font-size: 4.348vw;
        letter-spacing: 0.15em;
        line-height: 6.763vw;
        padding: 0 5.797vw 6.763vw;
    }

    #c2 .inner .system-list .system-info {
        padding: 8.454vw 0px 1.208vw;
    }

    #c2 .inner .system-list .system-info .system-flex {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 1.932vw;
    }

    #c2 .inner .system-list .system-info .system-flex .system-box-l {
        width: 100%;
        margin-bottom: 1.691vw;
    }

    #c2 .inner .system-list .system-info .system-flex .system-box-l .system-color {
        display: block;
        width: 23.188vw;
        background-color: #202929;
        padding: 0.242vw 0.966vw 0.242vw 1.691vw;
        text-align: center;
        font-weight: normal;
        font-size: 3.382vw;
        letter-spacing: 0.2em;
        text-align: center;
        color: #fff;
    }

    #c2 .inner .system-list .system-info .system-flex .system-box-r {
        font-weight: normal;
        text-align: left;
        color: #fff;
        width: 100%;
        padding: 0px 0px 1.208vw;
        position: relative;
        font-size: 3.865vw;
        letter-spacing: 0.05em;
        line-height: 1.7;
    }

    #c2 .inner .system-list .hitokoto-box {
        width: 100%;
        margin: 0 auto;
        margin-top: 0.966vw;
    }

    #c2 .inner .system-list .hitokoto-box .hitokoto {
        width: 23.188vw;
        font-weight: 500;
        font-size: 3.382vw;
        text-align: center;
        color: #fff;
        border-bottom: 1px solid #F58D89;
        padding-bottom: 0.483vw;
        margin-bottom: 1.208vw;
        padding-bottom: 0px;
    }

    #c2 .inner .system-list .hitokoto-box .txt-box {
        font-weight: 300;
        font-size: 3.382vw;
        letter-spacing: 0.05em;
        line-height: 6.28vw;
        text-align: left;
        color: #fff;
    }

    #c3 {
        max-width: 100%;
        margin: 0 auto;
        position: relative;
    }

    #c3 .pic-nagare {
        --nagare-w: 657.005vw;
        --nagare-h: 29.469vw;
        --nagare-speed: 150s;
        margin-bottom: 33.333vw;
        background-image: url(../images/index/sp-c3-nagare.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-repeat: repeat-x;
        background-position: 0 0;
        background-size: auto var(--nagare-h);
        width: 100%;
        height: var(--nagare-h);
        animation: nagare-left var(--nagare-speed) linear infinite;
        will-change: background-position;
    }

    @keyframes nagare-left {
        from {
            background-position-x: 0;
        }
    }

    @keyframes nagare-left {
        to {
            background-position-x: calc(-1 * var(--nagare-w));
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .pic-nagare {
            animation: none;
        }
    }

    #c3 .ttl {
        width: 50.725vw;
        position: absolute;
        top: 27.295vw;
        right: 2.415vw;
    }

    #c3 .inner .ttl-2 {
        width: 90.338vw;
        margin-left: 5.072vw;
        position: relative;
        margin-bottom: 0px;
    }

    #c3 .inner .en {
        width: 48.792vw;
        margin: 0 auto;
    }

    #c3 .inner .pic-set-rel {
        position: relative;
        padding-top: 69.324vw;
    }

    #c3 .inner .pic-set-rel {
        position: relative;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-1 {
        position: absolute;
        top: 6.039vw;
        left: 2.415vw;
        width: 13.527vw;
        will-change: transform;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-2 {
        position: absolute;
        top: 18.111vw;
        left: 21.256vw;
        width: 49.758vw;
        will-change: transform;
    }

    #c3 .inner .pic-set-rel .pic-ugoki-3 {
        position: absolute;
        top: 17.391vw;
        right: 2.415vw;
        width: 29.71vw;
        will-change: transform;
    }

    #c3 .inner .s-box {
        width: 83.575vw;
        margin: 0 auto;
        margin-bottom: 12.077vw;
        position: relative;
    }

    #c3 .inner .s-box .pic-ugoki-4 {
        left: 44.928vw;
        top: 1.449vw;
    }

    #c3 .inner .s-box .inbox {
        width: 100%;
        margin-left: auto;
        position: relative;
        margin-bottom: 11.111vw;
    }

    #c3 .inner .s-box .s-ttl {
        width: 56.522vw;
        margin-bottom: 13.527vw;
    }

    #c3 .inner .s-box .txt-box {
        font-family: "Zen Old Mincho", serif;
        font-style: normal;
        font-weight: 700;
        font-size: 4.348vw;
        line-height: 9.42vw;
        text-align: left;
        color: #000;
        font-size: 3.865vw;
        line-height: 7.729vw;
    }

    #c3 .inner .s-box .txt-box .p-mb {
        margin-bottom: 10.145vw;
    }

    #c3 .inner .s-box-02 {
        background-image: url(../images/index/sp-c3-pic-05.png),url(../images/index/sp-c3-bg-01.png);
        background-repeat: no-repeat;
        background-position: right 0px bottom 0,left 0 top 0;
        background-size: 91.787vw,contain;
        padding-top: 16.425vw;
        padding-bottom: 69.082vw;
        margin-bottom: 27.536vw;
    }

    #c3 .inner .s-box-02 .in-box {
        width: 83.575vw;
        margin: 0 auto;
        position: relative;
    }

    #c3 .inner .s-box-02 .txt-box-2 {
        width: 100%;
        font-family: "Zen Old Mincho", serif;
        font-style: normal;
        font-weight: bold;
        color: #fff;
        position: relative;
        font-size: 3.865vw;
        line-height: 7.729vw;
        text-align: left;
    }

    #c3 .inner .s-box-02 .txt-box-2 .s-ttl {
        font-size: 7.729vw;
        letter-spacing: 0.05em;
        line-height: 12.802vw;
        text-align: left;
        color: #fff;
        margin-bottom: 13.527vw;
        font-size: 6.763vw;
        letter-spacing: 0.05em;
        line-height: 10.145vw;
    }

    #c3 .inner .s-box-02 .txt-box-2 .p-mb {
        margin-bottom: 10.145vw;
    }

    .sp-fix-list {
        transition: opacity .2s;
    }

    body.kamishibai-on .sp-fix-list {
        display: none !important;
    }

    #c4 .nimaime, #c4 .sanmaime {
        display: none;
    }

    /* #c4 .in-2.is-active .nimaime {
        display: block;
        background-image: url(../images/index/sp-nimaime.png);
        background-repeat: no-repeat;
        background-position: center top -2px;
        background-size: auto 9.903vw;
        width: 100%;
        height: 9.903vw;
        position: absolute;
        top: 0;
        left: 0;
    }

    #c4 .in-3.is-active .sanmaime {
        display: block;
        background-image: url(../images/index/sp-sanmaime.png);
        background-repeat: no-repeat;
        background-position: center top -2px;
        background-size: auto 9.903vw;
        width: 100%;
        height: 9.903vw;
        position: absolute;
        top: -0.242vw;
        left: 0;
    } */




    #c4 .inner {
        position: relative;
        background-image: url(../images/index/sp-c4-bg.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
        padding-bottom: 7.729vw;
        padding-top: 19.807vw;
    }


    #c4 .in-ttl-wap {
        width: 91.787vw;
        margin: 0 auto;
        background-color: #fff;
        position: relative;
        padding-top: 12.077vw;
    }

    #c4 .inner .kamishibai2-bg-w .arrows {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  top: 72.464vw;
  z-index: 10;
}
#c4 .inner .kamishibai2-bg-w .arrows > div {
  width: 11.594vw;
  height: 11.594vw;
  background-image: url(../images/index/bx-l.svg);
  background-repeat: no-repeat;
  background-position: center 0;
  background-size: 100%;
  position: absolute;
  background-color: #fff;
  border: 1px solid #fff;
}
#c4 .inner .kamishibai2-bg-w .arrows > div:hover {
  cursor: pointer;
  cursor: hand;
  opacity: 0.8;
}
#c4 .inner .kamishibai2-bg-w .arrows .slick_mae {
  left: -4.106vw;
}
#c4 .inner .kamishibai2-bg-w .arrows .slick_ushiro {
  right: 4.106vw;
  transform: scale(-1, 1);
}

    #c4 .inner .kamishibai2-bg-w{
        width: 91.787vw;
      margin: 0 auto;
      background-color: #fff;
    }
    

    #c4 .ttl-box {
        /* height: 12.29vw; */
        background-color: #202929;
        /* margin-bottom: -5.242vw; */
    }

    #c4 .ttl-box .in {
        width: 100%;
        margin: 0 auto;
        position: relative;
    }

    #c4 .ttl {
        position: absolute;
        top: -5.072vw;
        z-index: 100;
        width: 81.28vw;
        margin: 0 auto;
        left: 1.208vw;
        margin-bottom: -5.072vw;
        right: 0;
    }


    #c4 .inner .kamishibai2 .in-box {
        width: 91.787vw;
        margin: 0 auto;
        background-color: #FFFFFF;
        /* padding: 12.077vw 4.106vw 20.773vw; */
        padding: 7.729vw 4.106vw 11vw;
        position: relative;
        margin-bottom: -2px;
        /* left: 0px; */
    }

    #c4 .inner .kamishibai2 .in-1 {
        background-image: url(../images/index/sp-c4-bg.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
    }

    #c4 .inner .kamishibai2 .in-1 .in-box {
    /* height: 148.309vw; */
    /* background-color: #FFFFFF; */
    }

    #c4 .inner .in-ttl {
        width: 79.227vw;
        margin: 0 auto;
        /* margin-bottom: 7.729vw; */
    }

    #c4 .inner .kamishibai2 .in-1 .flex {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l {
        width: 74.913vw;
        margin: 0 auto;
        padding-top: 0;
        position: relative;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-l .in-s-ttl .ss1 {
        display: block;
        margin-bottom: 0.483vw;
        width: 21.256vw;
        position: relative;
        left: 0.483vw;
    }

    #c4 .inner .kamishibai2 .flex .box-l .in-s-ttl .ss2 {
        font-weight: bold;
        font-size: 7.005vw;
        letter-spacing: 0.05em;
        line-height: 1.5;
        text-align: left;
        color: #E50012;
        margin-bottom: 2.415vw;
        display: block;
    }

    #c4 .inner .kamishibai2 .flex .box-l .in-s-ttl .ss2 .iro {
        font-size: 8.696vw;
        ; color: #cba21e;
    }

    #c4 .inner .kamishibai2 .flex .box-l .txt-1 {
        font-weight: bold;
        text-align: left;
        color: #e50012;
        font-size: 3.865vw;
        letter-spacing: 0.05em;
        line-height: 1.8;
    }

    #c4 .inner .kamishibai2 .in-1 .flex .box-r {
        width: 100%;
        position: relative;
        right: 0;
        top: 0;
        order: -1;
        margin-bottom: 4.831vw;
    }

    #c4 .inner .kamishibai2 .in-2 .in-ttl {
        width: 79.227vw;
        margin: 0 auto;
        margin-bottom: 7.246vw;
    }

    #c4 .inner .kamishibai2 .in-2 .flex {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l {
        width: 73.913vw;
        margin: 0 auto;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-l .in-s-ttl .ss1 {
        width: 28.019vw;
        display: block;
        margin-bottom: 0.725vw;
    }

    #c4 .inner .kamishibai2 .in-2 .flex .box-r {
        width: 100%;
        position: relative;
        right: 0;
        top: 0;
        order: -1;
        margin-bottom: 4.831vw;
    }

    #c4 .inner .kamishibai2 .in-3 .in-ttl {
        width: 79.227vw;
        margin: 0 auto;
        margin-bottom: 7.246vw;
    }

    #c4 .inner .kamishibai2 .in-3 .flex {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l {
        width: 73.913vw;
        margin: 0 auto;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-l .in-s-ttl .ss1 {
        display: block;
        margin-bottom: 0.725vw;
        width: 19.324vw;
    }

    #c4 .inner .kamishibai2 .in-3 .flex .box-r {
        width: 100%;
        position: relative;
        right: 0;
        top: 0;
        order: -1;
        margin-bottom: 4.831vw;
    }


    #c5 {
        background-image: url(../images/index/c5-bg-01.png);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: cover;
        padding-top: 13.285vw;
        padding-bottom: 24.155vw;
        position: relative;
        left: 0px;
    }

    #c5 .inner {
        width: 100%;
        margin: 0 auto;
    }

    #c5 .inner .ttl {
        width: 87.681vw;
        margin: 0 auto;
        margin-bottom: 3.865vw;
        position: relative;
        left: 0.242vw;
        margin-bottom: 11.836vw;
    }

    #c5 .inner .bnr-list {
        width: 83.575vw;
        margin: 0 auto;
        position: relative;
        display: flex;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
    }

    #c5 .inner .bnr-list li {
        width: 100%;
    }

    #c5 .inner .bnr-list li:nth-child(2) {
        margin-top: 13.043vw;
    }

    #c5 .inner .bnr-list li a {
        color: #fff;
    }

    #c5 .inner .bnr-list li a:hover img {
        opacity: 0.9;
    }

    #c5 .inner .bnr-list .ii-pic {
        margin-bottom: 3.623vw;
    }

    #c5 .inner .bnr-list .li-txt {
        font-weight: bold;
        text-align: left;
        color: #fff;
        position: relative;
        top: 0px;
        margin-left: 0px;
        font-size: 3.865vw;
        letter-spacing: 0.05em;
        line-height: 5.797vw;
    }

    #c6 .inner {
        background-image: url(../images/index/c6-bg-01.png);
        background-repeat: repeat;
        background-position: center 0;
        padding: 20.29vw 0px 14.493vw;
        margin-bottom: 0px;
    }

    #c6 .inner .in-box {
        width: 91.787vw;
        margin: 0 auto;
        background: #000;
        padding: 20.773vw 6.522vw 6.522vw;
        position: relative;
    }

    #c6 .inner .in-box .en {
        width: 18.841vw;
        margin: 0 auto;
        position: absolute;
        top: -12.319vw;
        left: 0.242vw;
        right: 0;
    }

    #c6 .inner .in-box .ttl {
        width: 77.536vw;
        margin: 0 auto;
        position: absolute;
        top: -3.382vw;
        left: 0px;
        right: 0;
    }

    #c6 .inner .in-box .s-box .pic {
        margin-bottom: 5.314vw;
    }

    #c6 .inner .in-box .s-box .txt-1 {
        width: 100%;
        font-weight: normal;
        font-size: 3.382vw;
        letter-spacing: 0.05em;
        line-height: 6.763vw;
        text-align: left;
        color: #fff;
    }
}