@charset "utf-8";
html {
background-color: #fff;
height: -webkit-fill-available;
}

body {
position: relative;
left: 0;
min-width: 320px;
min-height: 100vh;
min-height: -webkit-fill-available;
/*animation: bgcchange 20s ease infinite;*/
color: #222;
font-family: Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
font-feature-settings: "palt";
overflow-x: hidden;
font-size: 16px;
line-height: 1.5;
}

a {
color: #231815;
}

@media (max-width: 767px) {
body {
font-size: 16px;
}
}

/*
CLASSES
===========================================
*/

/* パソコンで見たときは"pc"のclassがついた画像が表示される */

.pc {
display: block !important;
}

.sp {
display: none !important;
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */

@media only screen and (max-width: 767px) {
.pc {
display: none !important;
}
.sp {
display: block !important;
}
}

@media (min-width: 768px) {
.pc-br:after {
content: "";
display: block;
}
.for-sp {
display: none;
}
}

/*
BOOTSTRAP EXTENTIONS
===========================================
*/

.container {
max-width: 1100px;
position: relative;
margin-right: auto;
margin-left: auto;
padding-left: 15px;
padding-right: 15px;
width: auto;
}
#page-visual .container {
max-width: none;
}

.img-cover {
width: 100%;
height: auto;
}

/* navbar */

.navbar {
border-radius: 0;
min-height: 48px;
}

.container > .navbar-header,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-collapse {
padding: 0 !important;
border-top: 0 none;
}

.navbar-header {
background: #ffffff;
background: no-repeat url("../img/bg_paper.png");
width: auto;
}

.navbar-brand {
margin: 0 !important;
padding: 10px !important;
width: 100%;
}

.navbar-brand .img-cover {
width: auto;
height: 66px;
display: flex !important;
margin: 0 auto;
}

@media (min-width: 768px) {
.container-fluid {
padding: 0;
}
.navbar-header {
width: 221px;
}
.navbar-brand {
height: auto;
}
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
.navbar-brand {
margin-left: 0px !important;
}
}

/* PARALLAX
--------------------- */

.parallax-wrap {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
z-index: 0;
}

.parallax-wrap .parallax1 {
position: absolute;
top: -50%;
width: 100%;
height: 1600%;
}

.parallax-wrap .parallax1 .parallax-inner {
width: 100%;
height: 100%;
background: url("../img/bg_parallax1.png") repeat center top;
}

.parallax-wrap .parallax2 {
position: absolute;
top: -50%;
width: 100%;
height: 1800%;
}

.parallax-wrap .parallax2 .parallax-inner {
width: 100%;
height: 100%;
background: url("../img/bg_parallax2.png") repeat-y center top;
}

.parallax-wrap .parallax3 {
position: absolute;
top: -50%;
width: 100%;
height: 800%;
}

.parallax-wrap .parallax3 .parallax-inner {
width: 100%;
height: 100%;
background: url("../img/bg_parallax3.png") repeat-y center top;
}

@media screen and (max-width: 768px) {
.parallax-wrap {
min-width: 100%;
max-width: 100%;
}
.parallax-wrap .parallax1 .parallax-inner {
background: url("../img/bg_parallax1_sp.png") repeat-y center top;
background-size: 100% auto;
}
.parallax-wrap .parallax2 .parallax-inner {
background: url("../img/bg_parallax2_sp.png") repeat-y center top;
background-size: 100% auto;
}
.parallax-wrap .parallax3 .parallax-inner {
background: url("../img/bg_parallax3_sp.png") repeat-y center top;
background-size: 100% auto;
}
}

/*
OBJECT LAYOUT
===========================================
*/

#page {
position: relative;
overflow: hidden;
z-index: 1;
padding-top: 86px;
}

.visual {
position: relative;
text-align: center;
overflow: hidden;
background-color: #fff;
}

@media (min-width: 767px) {
#page {
min-height: 100vh;
padding-bottom: 292px;
/*padding-bottomにfooterの高さを指定する*/
}
}

/*
SECTION TYPE
===========================================*/

/* BASE SECTION */

/* CONTENT SECTION */

.content {
padding: 50px 0;
}

.content.darkblue {
background-image: linear-gradient(to bottom, #060001, #1b2959);
background-color: #192159;
}

.content.blue {
color: #1b2959;
}

.content .title {
font-size: 32px;
font-weight: bold;
padding-bottom: 25px;
position: relative;
z-index: 2;
text-align: center;
margin-bottom: 0px !important;
margin-top: 0px !important;
color: #192159;
}

.content .title img {
max-width: 100%;
height: auto;
}

.content .title span {
display: block;
font-size: 0.5em;
font-style: normal;
margin: 0.5em 0;
letter-spacing: 0.1em;
}

@media (max-width: 767px) {
.content {
padding: 30px 0;
}
}

/*
VISUAL
===========================================
*/

/*@media (min-width: 768px) {
.visual {
position: relative;
background: url(../img/index/top_pc2nd.png) no-repeat scroll center top;
padding-bottom: 4px;
border-bottom: 4px solid #d23519;
}
}

@media (min-width: 768px) and (max-width: 1399.98px) {
.visual {
width: 100%;
height: auto;
background-size: cover;
}
.visual:before {
content: "";
display: block;
padding-top: 11.4%;*/
/* 高さを幅の11.4%に固定 */
/*}
}


@media (min-width: 768px) {
.visual {
height: 160px;
}
.visual::after {
content: "";
position: absolute;
z-index: -1;
background: #efc68f;
width: 100%;
top: 0;
left: 0;
height: 160px;
}
}*/

@media (min-width: 1600.1px) {
    .visual {
        position: relative;
        background: url(../img/index/top_lg_pc2nd.png) no-repeat scroll center top;
        padding-bottom: 4px;
        border-bottom: 4px solid #d23519;
        height: 160px;
    }

    .visual::after {
        content: "";
        position: absolute;
        z-index: -1;
        background: #192159;
        width: 100%;
        top: 0;
        left: 0;
        height: 160px;
    }
}

@media (min-width: 965px) and (max-width: 1600px) {
    .visual {
        position: relative;
        background: url(../img/index/top_pc2nd.png) no-repeat scroll center top;
        padding-bottom: 4px;
        border-bottom: 4px solid #d23519;
        height: 160px;
    }

    .visual::after {
        content: "";
        position: absolute;
        z-index: -1;
        background: #192159;
        width: 100%;
        top: 0;
        left: 0;
        height: 160px;
    }
}

@media (min-width: 965px) and (max-width: 1399.98px) {
.visual {
    width: 100%;
    height: auto;
    background-size: cover;
}

.visual:before {
    content: "";
    display: block;
    padding-top: 11.4%;
    /* 高さを幅の11.4%に固定 */
}
}

@media (max-width: 964px) {
.visual .for-sp{
    display: block;
}

}

/* HEADER MENU
===========================================*/

.navbar,
.navbar-toggle {
    border: 0 none;
}

#page-header {
    line-height: 12px;
    margin: 0;
    background-color: #ffffff;
    box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
}

    #page-header .menu {
        font-size: 14px;
        margin: 0;
    }

        #page-header .menu > li {
            display: table;
            letter-spacing: 0.05em;
            margin-left: -1px;
            width: 14%;
            position: relative;
        }

            #page-header .menu > li > a,
            #page-header .menu > li > span {
                display: table-cell;
                width: 100%;
                height: 86px;
                vertical-align: middle;
                padding: 0;
                letter-spacing: 0.1em;
                text-align: center;
                font-weight: 700;
                color: #192159;
            }

            #page-header .menu > li a:hover,
            #page-header .menu > li a:focus,
            #page-header .menu > li.open > a,
            #body-top #page-header .menu > li.gnav_top > a,
            #body-yoso #page-header .menu > li.gnav_yoso > a,
            #body-timetable #page-header .menu > li.gnav_timetable > a,
            #body-events #page-header .menu > li.gnav_events > a,
            #body-camp #page-header .menu > li.gnav_camp > a,
            #body-prosports #page-header .menu > li.gnav_prosports > a,
            #body-access #page-header .menu > li.gnav_access > a,
            #body-foodfes #page-header .menu > li.gnav_foodfes > a {
                color: #fff;
                background-color: #192159;
                background-image: linear-gradient(to left, #e72410 0%, #192159 30%);
                text-decoration: none;
            }

/* 出場予定選手・アクセス　アイコン付きメニュー */
.gnav_entry a,
.gnav_access a {
    padding: 10px;
}

.gnav_entry span,
.gnav_access span {
    display: inline-block;
    position: relative;
    padding-right: 20px;
}

    .gnav_entry span::after,
    .gnav_access span::after {
        content: "";
        display: inline-block;
        background-size: 18px 18px;
        background-position: right center;
        background-repeat: no-repeat;
        width: 18px;
        height: 18px;
        position: absolute;
        top: 50%;
        right: 0px;
        margin-top: -9px;
    }

    .gnav_entry span::after {
        background-image: url(../img/icon_keirinjp.svg);
    }

.gnav_entry a:hover span::after {
    filter: brightness(10) grayscale(100%);
    ;
}

.gnav_access span::after {
    background-image: url(../img/icon_global.svg);
}

#body-access .gnav_access > a span::after,
.nav .open.gnav_access > a span::after,
.gnav_access a:focus span::after,
.gnav_access a:hover span::after {
    background-image: url(../img/icon_global_hover.svg);
}

/* .dropdown-toggle 下矢印アイコン付きメニュー */

.dropdown-toggle {
    position: relative;
}

    .dropdown-toggle::before {
        content: "";
        display: inline-block;
        background-size: 16px 16px;
        background-repeat: no-repeat;
        width: 16px;
        height: 16px;
        position: absolute;
        bottom: 0;
        left: 50%;
        margin-left: -8px;
        background-image: url(../img/icon_arrow_d.svg);
    }

    #body-yoso .gnav_yoso > a.dropdown-toggle::before,
    #body-access .gnav_access > a.dropdown-toggle::before,
    .nav .open > a.dropdown-toggle::before,
    .dropdown-toggle:focus::before,
    .dropdown-toggle:hover::before {
        background-image: url(../img/icon_arrow_d_hover.svg);
    }

/* .dropdown-menu ドロップダウンメニュー指定 */

.dropdown-menu,
.navbar-nav .open .dropdown-menu {
    padding: 0;
    background-color: #ffffff;
    color: #192159;
}

    .dropdown-menu > li > a {
        color: #192159;
        font-weight: 700;
        padding: 8px 16px;
    }

    .navbar-nav .open .dropdown-menu > li > a:focus,
    .navbar-nav .open .dropdown-menu > li > a:hover {
        color: #fff;
        background-color: #192159;
        background-image: linear-gradient( to right, #e72410 0%, #192159 25% 75%, #e72410 100% );
    }

@media (min-width: 1200px) {
    #page-header .menu {
        width: calc(100% - 221px);
        background-color: #ffffff;
    }

    .navbar-toggle {
        display: none;
    }

    .navbar-collapse.collapse {
        display: block !important;
    }

    .navbar-right .dropdown-menu {
        right: 0;
        left: auto;
    }

    .navbar-right .dropdown-menu-left {
        right: auto;
        left: 0;
    }

    #page-header .menu > li.gnav_prosports {
        width: 16%;
    }

    #page-header .menu > li::after {
        content: "";
        display: block;
        width: 1px;
        height: 56px;
        background-color: #192159;
        position: absolute;
        top: 15px;
        right: 0px;
    }

    #page-header .menu > li:last-child:after {
        display: none;
    }
}

/* スマホ版グローバルナビゲーション指定 */

@media (max-width: 1199px) {
    /* ナビゲーションが開いたときに背景を固定する */
    .is-fixed {
        height: 100%;
        overflow: hidden;
    }

    .bg-navbar {
        display: none;
    }

    .is-fixed .bg-navbar {
        position: absolute;
        display: block;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        height: 100%;
        z-index: 1029;
        /*.navbar-fixed-topがz-index: 1030;なので*/
        background-color: rgba(0, 0, 0, 0.5);
        cursor: pointer;
    }
    /*.navbarの高さと同じサイズ*/
    #page {
        padding-top: 88px;
    }
    /* .navbar-toggle スマホ版グローバルナビゲーション開閉ボタン */
    .navbar-toggle {
        display: block;
        margin: 0;
        padding: 10px;
        color: #fff;
        background-color: #e72410;
        text-decoration: none;
        width: 88px;
        height: 88px;
        border-radius: 0;
    }

        .navbar-toggle .icon-bar {
            background-color: #fff;
            -webkit-transition: transform 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
            transition: transform 200ms cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
            margin: auto;
        }

    .opened .navbar-toggle .icon-bar {
        -webkit-transform: translateY(6px) rotate(45deg);
        transform: translateY(6px) rotate(45deg);
    }

        .opened .navbar-toggle .icon-bar::after {
            background-color: #fff;
            content: "";
            display: block;
            height: 2px;
            -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
            width: 22px;
        }

        .opened .navbar-toggle .icon-bar + .icon-bar {
            opacity: 0;
        }

    .navbar-collapse.in {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

    .navbar-fixed-top .navbar-collapse.in {
        max-height: calc(100vh - 88px);
    }

    #page-header .menu {
        padding: 0;
        margin: 0;
        width: 100%;
        font-size: 16px;
    }

    .container-fluid > .navbar-collapse{
        margin: 0;
    }

    #page-header .menu > li {
        display: block;
        text-align: left;
        width: 100%;
        padding: 0;
        margin: 0;
        border: 0 none;
        border-top: 1px solid #ccc;
        color: #ffffff;
        font-size: 1.2rem;
        height: auto;
        min-height: 50px;
    }

            #page-header .menu > li:nth-child(5) {
                width: 100%;
            }

            #page-header .menu > li > a {
                display: block;
                text-align: left;
                padding: 0 1em;
            }

            #page-header .menu > li > a,
            #page-header .menu > li > span {
                width: 100%;
                height: auto;
                line-height: 50px;
            }

            #page-header .menu > li.open > a,
            #page-header .menu > li.open > a:hover,
            #page-header .menu > li.open > a:focus {
                color: #fff;
                background-color: #192159;
                background-image: linear-gradient( to right, #e72410 0%, #192159 25% 75%, #e72410 100% );
                text-decoration: none;
            }

    .dropdown-toggle {
        position: relative;
    }

        .dropdown-toggle::before {
            content: "";
            display: block;
            position: absolute;
            top: 50%;
            right: 1em;
            left: auto;
            margin-left: 0;
            margin-top: -8px;
        }

    .navbar-nav .open .dropdown-menu {
        border-radius: 0;
    }
}

@media (max-width: 768px) {
    /*.navbarの高さと同じサイズ*/
    #page {
        padding-top: 48px;
    }

    .navbar-brand {
        padding: 4px 10px !important;
        height: 48px;
        width: auto;
    }

        .navbar-brand img,
        .navbar-brand img.img-cover {
            width: auto;
            height: 40px;
            margin: 0;
        }

    .navbar-toggle {
        width: 48px;
        height: 48px;
    }

    .navbar-fixed-top .navbar-collapse.in {
        max-height: calc(100vh - 48px);
    }
}

/* FOOTER
=========================================== */

@media (min-width: 768px) {
    footer {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 292px;
    }
}

/* #page-address*/

#page-address {
    color: #fff;
    background-color: #192159;
    background-image: linear-gradient(to right, #192159 70%, #e72410 100%);
    text-decoration: none;
    padding: 60px 0;
}

/*
#float-gotop {
display: none;
position: fixed;
bottom: 0;
left: 50%;
width: 122px;
height: 62px;
margin-left: -61px;
border-color: #fff #fff #192159 #fff;
background-image: url(../img/btn_gotop.png);
border-width: 1px;
outline: none;
z-index: 100;
}
*/

a.footer_link {
    color: #fff;
    text-decoration: underline;
}

.footer_link:hover {
    text-decoration: none;
}

/* copyright */

#page-footer {
    position: relative;
    background-color: #fff;
}

    #page-footer .gotop {
        position: absolute;
        left: 50%;
        top: -62px;
        width: 122px;
        height: 62px;
        margin-left: -61px;
        border-radius: 8px 8px 0 0;
        border-color: #fff #fff #192159 #fff;
        background-image: url(../img/btn_gotop.png);
        border-width: 1px;
    }

    #page-footer .copyright {
        text-align: center;
        font-size: 0.9em;
        color: #192159;
        padding-top: 10px;
    }

/*
LINKS
===========================================
*/

#page-links {
    color: #ccc;
    background-color: #1b2959;
    padding: 40px 0;
}

/*
box
===========================================
*/

.content-box {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0.8);
    border-left: 2px solid #e72410;
    border-right: 2px solid #e72410;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 50px;
}

    .content-box::before,
    .content-box::after {
        content: "";
        display: block;
        height: 2px;
        background: linear-gradient( to right, #e72410 0%, #192159 25% 75%, #e72410 100% );
        border-radius: 8px;
    }

    .content-box::after {
        z-index: 1;
        position: absolute;
        bottom: 0;
        width: 100%;
    }

.content-box-title {
    font-size: 1.4em;
    background: linear-gradient( to right, #e72410 0%, #192159 25% 75%, #e72410 100% );
    padding: 20px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.05em;
}

    .content-box-title h3 {
        font-size: 1.4em;
        line-height: 1.2;
        font-weight: bold;
    }

.content-box-inner {
    padding: 20px;
}

/*
btn-jump
===========================================
*/

a.content-btn {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    background-color: #192159;
    border-left: 4px solid #ffffff;
    border-right: 4px solid #ffffff;
    letter-spacing: 0;
    overflow: hidden;
    font-feature-settings: "palt";
    white-space: nowrap;
    color: #fff;
    padding: 20px 0;
}

    a.content-btn:hover {
        top: 2px;
        opacity: 0.8;
    }

.content-btn::before,
.content-btn::after {
    content: "";
    position: absolute;
    display: block;
    height: 4px;
    width: 100%;
    left: 0;
    background-color: #ffffff;
}

.content-btn::before {
    top: 0;
}

.content-btn::after {
    bottom: 0;
}

/*
TABLE_base
===========================================
*/

.table_base {
    border: 2px solid #fff;
    width: 100%;
    box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
}

    .table_base th {
        border: 2px solid #fff;
        /*padding: 3px;*/
        background-color: #192159;
        color: #fff;
        text-align: center;
        vertical-align: middle;
    }

    .table_base > thead > tr > th {
        border-bottom: 4px solid #fff;
    }

    .table_base td {
        border: 2px solid #fff;
        padding: 15px;
        background-color: #f2e9da;
        color: #222;
    }

.table.table_base > tbody > tr > th,
.table.table_base > tbody > tr > td {
    vertical-align: middle;
}

.table_base td a {
    color: #222;
}

    .table_base td a:hover {
        color: #0033cc;
    }

.table_base tbody {
    color: #fff;
    background-color: #e50012;
    background-image: linear-gradient( to right, #f2b7aa 0%, #e3542b 25% 75%, #f2b7aa 100% );
}

.table_base thead th {
    color: #fff;
    background: #192159;
}

/* Button
=========================================== */

a.btn-panel {
position: relative;
display: block;
width: 100%;
height: 100%;
text-decoration: none;
font-weight: 700;
text-align: center;
/* border-radius: 8px; */
line-height: 1.2;
letter-spacing: 0;
overflow: hidden;
font-feature-settings: "palt";
white-space: nowrap;
color: #493825;
border-radius: 4px;
box-shadow: 5px 5px #192159;
border: 6px solid #f39800;
/*border-style: groove ridge ridge groove;*/
}

a.btn-panel::after {
    z-index: 1;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.btn-panel:active {
    top: 2px;
}

.icon_player,
.icon_entry,
.icon_events {
    position: absolute;
    display: block;
    top: 0;
}

.btn-panel-inner {
position: relative;
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
padding: 10px;
border-radius: 4px;
background-color: rgba(255,255,255,1);
color: #33240e;
}

a.btn-panel:hover {
    opacity: 1;
}

.btn-panel-img {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

    .btn-panel-img:hover,
    .btn-panel-img:focus {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

.btn-panel-text {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 3em;
    padding: 5px;
}

.btn-panel-img {
    padding: 10px 0;
    width: 160px;
    height: 140px;
    /*width: 128px;*/
    /*height: 128px;*/
    margin: 10px auto;
    box-sizing: border-box;
    position: relative;
}

a.link_disabled {
    pointer-events: none;
    position: relative;
    display: block;
    text-decoration: none;
    font-weight: 700;
    white-space: nowrap;
    color: #808080 !important;
}

a.disabled {
    pointer-events: none;
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    letter-spacing: 0;
    overflow: hidden;
    font-feature-settings: "palt";
    white-space: nowrap;
    border-radius: 8px;
    border: 6px solid #999999;
}

@media (max-width: 768px) {
    .btn-panel-img {
        padding: 10px 0;
        width: 130px;
        height: 105px;
        /*width: 128px;*/
        /*height: 128px;*/
        margin: 10px auto;
        box-sizing: border-box;
        position: relative;
    }
}

/* box
*************************************************/

.box {
    margin-bottom: 30px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
    color: #222;
    overflow: hidden;
}

.box-inner {
    padding: 20px 10px;
    text-align: left;
}

.box-title01 {
    margin-top: 0;
    padding: 10px;
    background-repeat: repeat;
    background-color: #f9cc35;
    font-weight: bold;
}

.box-title02 {
    font-size: 20px;
    font-weight: bold;
    padding-bottom: 10px;
}

    .box-title02:after {
        content: "";
        display: block;
        width: 100%;
        height: 2px;
        margin-top: 5px;
        background-color: #192159;
    }

.box-title03 {
    margin: 30px 0 20px 0;
    padding: 10px;
    border-radius: 5px;
    background: #f2f2f2;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
    border: 1px solid #fff;
    font-weight: bold;
}

.mt_0 {
    margin-top: 0;
}

.box-title {
    font-size: 1rem;
}

.box a {
    color: #4e65b8;
}

    .box a:hover,
    .box a:focus {
        color: #223fa6;
    }

@media (min-width: 768px) {
    .box-inner {
        padding: 30px;
    }

    .box-title {
        font-size: 1rem;
    }

    .box-title01 {
        padding: 10px 30px;
    }

    .box-title02 {
        padding-bottom: 20px;
    }
}

/*
Others
=========================================== */

@media (max-width: 767px) {
    .sp-br:after {
        content: "";
        display: block;
    }

    .for-pc {
        display: none;
    }
}

/* .row style */

.row-0 {
    margin-left: 0;
    margin-right: 0;
}

    .row-0 > div {
        padding-right: 0;
        padding-left: 0;
    }

.row-8 {
    margin-left: -4px;
    margin-right: -4px;
}

    .row-8 > div {
        padding-right: 4px;
        padding-left: 4px;
    }

/* margin */

.mb-60px {
    margin-bottom: 60px;
}

.mb-30px {
    margin-bottom: 30px;
}

.mb-10px {
    margin-bottom: 10px;
}

/*
movie(レスポンシブ用)
=========================================== */

.movie {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}

    .movie iframe {
        position: absolute;
        top: 0;
        right: 0;
        width: 100% !important;
        height: 100% !important;
    }

/* 文字
=========================================== */

.text-red {
    color: #e50012;
}

.text-blue {
    color: #19215908b;
}

.bold {
    font-weight: bold;
}

.text-middle {
    font-size: 1.1em;
}

.text-background {
    background-color: #ffd700;
    font-size: 120%;
    font-weight: bold;
}

/*
見出し
=========================================== */

.heading {
    color: #000000;
    font-size: 1.1em;
    font-weight: bold;
}

/*
footerArea フローティングメニュー領域
+=========================================================+ */
#floatingNaviTohyo {
    background: rgba(59 74 82 / 80%);
}

#floatingNaviTohyo {
    position: fixed;
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    bottom: 0;
    z-index: 99;
    width: 240px;
    height: 0;
    box-shadow: 0 1px 2px 0.5px rgb(9 9 11 / 30%);
    transition: height 0.3s;
}

    #floatingNaviTohyo.active::before {
        display: block;
        width: 100%;
        height: 2px;
        content: "";
        background-color: #3b4952;
    }

/* 開閉ボタン */
.btn-toggle-tohyo {
    position: absolute;
    top: -32px;
    left: 8px;
    width: 80px;
    height: 32px;
    background: url("https://www.tachikawakeirin.jp/images/icon_arrow_up.svg") 50% 50% / 28px 16.8px no-repeat #3b4952;
    border: 0;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 0 1px 0.5px rgb(9 9 11 / 30%);
}

    .btn-toggle-tohyo:hover {
        background: url("https://www.tachikawakeirin.jp/images/icon_arrow_up.svg") 50% 50% / 28px 16.8px no-repeat #3b4952;
    }

.active .btn-toggle-tohyo {
    background-image: url("https://www.tachikawakeirin.jp/images/icon_arrow_down.svg");
    background-size: 28px 16.8px;
}

.floating-content {
    padding: 8px;
    text-align: center;
    /*  background-color: rgba(209, 45, 54, 0.8);*/
}

#floatingNaviTohyo.active {
    height: 160px;
}

.justify-content-center {
    justify-content: center !important;
}

/* ソーシャルメディアボタン */
.floating-content .btn-tohyonavi {
    display: block;
    padding: 2px 4px;
    background-color: rgb(255 255 255 / 90%);
    border: 2px solid #fff;
    border-radius: 4px;
    box-shadow: 0 1px 2px 0.5px rgb(9 9 11 / 30%);
}

/* トップへ遷移ボタン */
.btn-top {
    position: fixed;
    right: 20px;
    bottom: 10px;
    z-index: 100;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    padding-top: 7px;
    font-size: 11px;
    color: #fff;
    text-decoration: none;
    background-color: rgb(209 45 54 / 90%);
    border: none;
    border-radius: 4px;
    box-shadow: 0 1px 2px 0.5px rgb(9 9 11 / 30%);
}

    /* ホバー時 */
    .btn-top:hover {
        background-color: #e72410;
    }

#floatingNaviTohyo .a:active,
a:focus,
a:hover {
    color: #fff;
    text-decoration: none;
}

#floatingNaviTohyo a:hover > img {
    opacity: 0.8;
}

@media (max-width: 991px) {
    #floatingNaviTohyo,
    .btn-top {
        z-index: 1031;
    }

    body:has(.navbar-toggle[aria-expanded="true"]) #floatingNaviTohyo {
        z-index: 4;
    }

    body:has(.navbar-toggle[aria-expanded="true"]) .btn-top {
        z-index: 5;
    }
}

@media (min-width: 992px) {
    #floatingNaviTohyo {
        width: 100vw;
    }

        #floatingNaviTohyo.active {
            height: 72px;
        }

    /* 開閉ボタン */
    .btn-toggle-tohyo {
        width: 64px;
    }

    .floating-content {
        justify-content: center;
        padding: 8px 64px;
    }

    /* 投票メニュー開催モード
+=========================================================+ */

    .btn-top {
        background-color: #d12d36;
    }
    /* ソーシャルメディアボタン */
    .floating-content .btn-tohyonavi {
        padding: 2px 8px;
    }

    /* トップへ遷移ボタン */
    .btn-top {
        right: 20px;
        bottom: 14px;
    }
}

@media (min-width: 992px) {
    .col-lg-auto {
        flex: 0 0 auto;
        width: auto;
    }
}

.row2 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-0.5 * var(--bs-gutter-x));
    margin-left: calc(-0.5 * var(--bs-gutter-x));
}

.floating-content {
    padding: 8px;
    text-align: center;
}

.btn-toggle-tohyo,
#floatingNaviTohyo.active::before {
    background-color: #3b4952;
}

#floatingNaviTohyo .img-fluid {
    max-width: 100%;
    height: auto;
}

/* チャットボット
+=========================================================+ */
#chat_banner {
    bottom: 80px !important;
    z-index: 9998 !important;
}

/* #emergency 緊急メッセージ表示領域
+=========================================================+ */
/* #emergencyArea {
display:none;
} */
#emergencyArea,
#emergency02 {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 8.5rem 3.5rem 1.5rem 3.5rem;
    margin-bottom: -88px;
    font-size: 1.25em;
    text-align: center;
    background: #deb425;
}

    #emergencyArea h2::before,
    #emergencyArea02 h2::before {
        display: block;
        width: 36px;
        height: 32px;
        margin: 0 auto 16px auto;
        content: "";
        background: url("https://www.tachikawakeirin.jp/images/home/icon_emergency.svg") no-repeat top center;
    }

    #emergencyArea h2,
    #emergencyArea02 h2 {
        font-size: 1.125em;
        font-weight: bold;
    }

.fixed-top {
    position: sticky;
}

@media (max-width: 768px) {
    #emergencyArea {
        position: relative;
        z-index: 1;
        width: 100%;
        padding: 7.5rem 2.5rem 1.5rem 2.5rem;
        margin-bottom: -48px;
        font-size: 1.25em;
        text-align: center;
        background: #deb425;
    }
}

/*
ページ別背景色、フォントカラー、表カラー
===========================================
*/

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th {
    color: #0e1533;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #e7e9f2;
}

.title {
    text-shadow: 2px 2px #ffffff,-2px 2px #ffffff,2px -2px #ffffff,-2px -2px #ffffff;
}

#body-top {
    background-color: #ffeacc;
}


#body-timetable {
    background-color: #ffe1e1;
}

#body-timetable thead th {
    background-color: #33110f;
}

#body-timetable th {
    background-color: #e5372e;
    color: #ffffff;
}

#body-timetable .title, #body-timetable td {
    color: #33110f;
}

#body-timetable td {
    background-color: #f2e7e7;
}



#body-events {
    background-color: #fff2e1;
}

#body-events thead th {
    background-color: #33240e;
    color: #ffffff;
}

#body-events th {
    background-color: #e59a2e;
    color: #33240e;
}

#body-events td {
    background-color: #f2ede9;
}

#body-events .title, #body-events td {
    color: #33240e;
}

#body-events .content-box .a:active, #body-events .content-box a:focus, #body-events .content-box a:hover, #body-events .table_base td a:hover {
    color: #33240e;
    text-decoration: underline;
}

#body-camp {
    background-color: #edffe1;
}

#body-camp thead th {
    background-color: #1b330e;
    color: #ffffff;
}

#body-camp th {
    background-color: #5d993d;
    color: #1b330e;
}

#body-camp td {
    background-color: #eaf2e7;
}

#body-camp .title, #body-camp td {
    color: #1b330e;
}

.table-reset td {
    background-color: transparent !important;
}

/*
ファーストビューアニメーション
===========================================
*/
/*配置固定*/
.top_z0, .top_z990, .top_title, .top_recer_1, .top_recer_2, .top_recer_3, .top_recer_4, .top_recer_5,
.top_textbox, .top_textbg, .top_text1, .top_text2, .top_text3, .top_text4, .top_text5, .top_text6,
.top_text7, .top_text8, .top_text9, .top_text10, .top_text11, .top_txetbg, .top_test {
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: auto;
}

.top_z0, .top_z990, .top_title, .top_test {
    background-size: cover;
}

.top_recer_1, .top_recer_2, .top_recer_3, .top_recer_4, .top_recer_5,
.top_textbox, .top_textbg, .top_text1, .top_text2, .top_text3, .top_text4, .top_text5, .top_text6,
.top_text7, .top_text8, .top_text9, .top_text10, .top_text11, .top_test {
    background-size: contain;
    opacity: 0;
}

.top_textbox{
    opacity: 1;
}

/*配置テスト用ID*/
/*.top_test {
    background-image: url(../img/index/top_pc.png);
    z-index: -3;
}*/

.top_z0 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_z1.png);
    z-index: -70;
}

.top_z990 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_z999.png);
    z-index: 5;
}

.top_title {
    background-image: url(../img/index/TopAnimetion/top_main_pc_title.png);
    z-index: 4;
}

.top_recer_1 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_recer1.png);
    z-index: -10;
    top: 44.8%;
    left: 75.3%;
    scale: 1.15;
}

.top_recer_2 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_recer2.png);
    z-index: -20;
    top: 45%;
    left: 21%;
    scale: 1.1;
}

.top_recer_3 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_recer3.png);
    z-index: -20;
    top: -8.5%;
    left: 52.7%;
    scale: 0.47;
}

.top_recer_4 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_recer4.png);
    z-index: -30;
    top: 4%;
    left: -16%;
    scale: 0.5;
}

.top_recer_5 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_recer5.png);
    z-index: -30;
    top: -41.5%;
    left: 54%;
    scale: 0.36;
}

.top_textbox {
    background-image: url(../img/index/TopAnimetion/top_main_pc_textbox.png);
    z-index: -5;
    top: -49.1%;
    left: -27.75%;
    scale: 0.392;
}

.top_textbg {
    background-image: url(../img/index/TopAnimetion/top_main_pc_textbg.png);
    z-index: -4;
    top: -50%;
    left: -27.9%;
    scale: 0.255;
}

.top_text1, .top_text2, .top_text3, .top_text4, .top_text5, .top_text6,
.top_text7, .top_text8, .top_text9, .top_text10, .top_text11 {
    z-index: -2;
}

.top_text1 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text1.png);
    top: -64.8%;
    left: -36.8%;
    scale: 0.075;
}

.top_text2 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text2.png);
    top: -64.2%;
    left: -33.75%;
    scale: 0.055;
}

.top_text3 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text3.png);
    top: -66.25%;
    left: -31%;
    scale: 0.053;
}

.top_text4 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text4.png);
    top: -66.75%;
    left: -28.85%;
    scale: 0.039;
}

.top_text5 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text5.png);
    top: -72.5%;
    left: -25.35%;
    scale: 0.0719;
}

.top_text6 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text6.png);
    top: -71%;
    left: -22.77%;
    scale: 0.038;
}

.top_text7 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text7.png);
    top: -72.1%;
    left: -20.6%;
    scale: 0.038;
}

.top_text8 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text8.png);
    top: -73.55%;
    left: -19.4%;
    scale: 0.0392;
}

.top_text9 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text9.png);
    top: -75%;
    left: -17.85%;
    scale: 0.045;
}

.top_text10 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text10.png);
    top: -76.55%;
    left: -16.3%;
    scale: 0.0475;
}

.top_text11 {
    background-image: url(../img/index/TopAnimetion/top_main_pc_text11.png);
    top: -78.3%;
    left: -14.55%;
    scale: 0.0515;
}


@media (max-width: 767px){

    .top_z0 {
        background-image: url(../img/index/TopAnimetion/top_main_sp_z1.png);
        z-index: -70;
    }

    .top_z990 {
        background-image: url(../img/index/TopAnimetion/top_main_sp_z999.png);
        z-index: 5;
    }

    .top_title {
        background-image: url(../img/index/TopAnimetion/top_main_sp_title.png);
        z-index: 4;
    }

    /*配置テスト用ID*/
    /*.top_test {
    background-image: url(../img/index/top_sp.png);
    z-index: -4;
    }*/

    .top_recer_1 {
        top: 66.1%;
        left: 44.65%;
        scale: 1.55;
    }

    .top_recer_2 {
        top: 53%;
        left: 5.75%;
        scale: 1.05;
    }

    .top_recer_3 {
        top: 46.5%;
        left: 47.5%;
        scale: 0.8;
    }

    .top_recer_4 {
        top: 16%;
        left: -28.5%;
        scale: 0.46;
    }

    .top_recer_5 {
        top: 15.5%;
        left: 50%;
        scale: 0.48;
    }

    .top_textbox, .top_textbg, .top_text1, .top_text2, .top_text3, .top_text4,
    .top_text5, .top_text6, .top_text7, .top_text8, .top_text9, .top_text10, .top_text11 {
        transform: rotate(4deg);
    }


    .top_textbox {
        top: 30%;
        left: -3%;
        scale: 0.72;
    }

    .top_textbg {
        top: 24.5%;
        left: -3%;
        scale: 0.465;
    }

    .top_text1 {
        top: 1.8%;
        left: -20.5%;
        scale: 0.085;
    }

    .top_text2 {
        top: 2.1%;
        left: -14.1%;
        scale: 0.063;
    }

    .top_text3 {
        top: 1.8%;
        left: -9%;
        scale: 0.061;
    }

    .top_text4 {
        top: 1.4%;
        left: -4.7%;
        scale: 0.046;
    }

    .top_text5 {
        top: 0.05%;
        left: 0.6%;
        scale: 0.083;
    }

    .top_text6 {
        top: 0.5%;
        left: 6.5%;
        scale: 0.048;
    }

    .top_text7 {
        top: -1.2%;
        left: 9.8%;
        scale: 0.033;
    }

    .top_text8 {
        top: -1.7%;
        left: 12%;
        scale: 0.035;
    }

    .top_text9 {
        top: -1.95%;
        left: 14.4%;
        scale: 0.038;
    }

    .top_text10 {
        top: -2.6%;
        left: 17.2%;
        scale: 0.042;
    }

    .top_text11 {
        top: -3.2%;
        left: 20.2%;
        scale: 0.045;
    }
}

/*アニメーション*/

@keyframes R1zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.8) translateX(-20%) translateY(-20%);
    }

    25% {
        opacity: 0;
        transform: scale(0.8) translateX(-20%) translateY(-20%);
    }

    50%{
        opacity: 1;
    }

    100% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }
}

@keyframes R1ride {
    0% {
        opacity: 1;
        transform: scale(1) translateX(0%) translateY(0%);
    }

    3% {
        transform: scale(1) translateX(0%) translateY(0%);
    }

    50% {
        transform: scale(0.95) translateX(-4%) translateY(-4%);
    }

    53% {
        transform: scale(0.95) translateX(-4%) translateY(-4%);
    }

    95% {
        transform: scale(1.05) translateX(4%) translateY(4%);
    }

    100% {
        opacity: 1;
        transform: scale(1.05) translateX(4%) translateY(4%);
    }
}

.top_recer_1 {
    animation: R1zoomIn 0.8s forwards, 4.5s R1ride 0.8s alternate ease-in-out infinite forwards;
}

@keyframes R2zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.8) translateY(-20%);
    }

    25% {
        opacity: 0;
        transform: scale(0.8) translateY(-20%);
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes R2ride {
    0% {
        opacity: 1;
        transform: scale(1) translateY(0%);
    }

    3% {
        transform: scale(1) translateY(0%);
    }

    45% {
        transform: scale(0.95) translateY(-2%);
    }

    48% {
        transform: scale(0.95) translateY(-2%);
    }

    95% {
        transform: scale(1.05) translateY(7%);
    }

    100% {
        opacity: 1;
        transform: scale(1.05) translateY(7%);
    }
}

.top_recer_2 {
    animation: R2zoomIn 0.8s forwards, 5s R2ride 0.8s alternate ease-in-out infinite forwards;
}

@keyframes R3zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.7) translateX(-35%) translateY(5%);
    }

    25% {
        opacity: 0;
        transform: scale(0.7) translateX(-35%) translateY(5%);
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }
}

@keyframes R3ride {
    0% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }

    3% {
        transform: scale(1) translateX(0) translateY(0);
    }

    45% {
        transform: scale(0.95) translateX(-4%) translateY(2%);
    }

    48% {
        transform: scale(0.95) translateX(-4%) translateY(2%);
    }

    95% {
        transform: scale(1.05) translateX(4%) translateY(-2%);
    }

    100% {
        opacity: 1;
        transform: scale(1.05) translateX(4%) translateY(-2%);
    }
}

.top_recer_3 {
    animation: R3zoomIn 0.81s forwards, 4.8s R3ride 0.8s alternate ease-in-out infinite forwards;
}

@keyframes R4zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.7) translateX(35%) translateY(-5%);
    }

    25% {
        opacity: 0;
        transform: scale(0.7) translateX(35%) translateY(-5%);
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }
}

@keyframes R4ride {
    0% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }

    3% {
        transform: scale(1) translateX(0) translateY(0);
    }

    35% {
        transform: scale(0.95) translateX(4%) translateY(-2%);
    }

    38% {
        transform: scale(0.95) translateX(4%) translateY(-2%);
    }

    95% {
        transform: scale(1.05) translateX(-4%) translateY(2%);
    }

    100% {
        opacity: 1;
        transform: scale(1.05) translateX(-4%) translateY(2%);
    }
}

.top_recer_4 {
    animation: R4zoomIn 0.81s forwards, 4.6s R4ride 0.8s alternate ease-in-out infinite forwards;
}

@keyframes R5zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.6) translateX(-75%) translateY(50%);
    }

    25% {
        opacity: 0;
        transform: scale(0.6) translateX(-75%) translateY(50%);
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }
}

@keyframes R5ride {
    0% {
        opacity: 1;
        transform: scale(1) translateX(0) translateY(0);
    }

    3% {
        transform: scale(1) translateX(0) translateY(0);
    }

    35% {
        transform: scale(0.95) translateX(-6%) translateY(2%);
    }

    38% {
        transform: scale(0.95) translateX(-6%) translateY(2%);
    }

    95% {
        transform: scale(1.05) translateX(6%) translateY(-2%);
    }

    100% {
        opacity: 1;
        transform: scale(1.05) translateX(6%) translateY(-2%);
    }
}

.top_recer_5 {
    animation: R5zoomIn 0.82s forwards, 4.8s R5ride 0.8s alternate ease-in-out infinite forwards;
}

@keyframes textzoomIn {
    0% {
        opacity: 0;
        transform: scale(2.5);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes textbgzoomIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.top_text1, .top_text2, .top_text3, .top_text4,
.top_text5, .top_text6, .top_text7, .top_text8, .top_text9, .top_text10, .top_text11 {
    animation: 0.35s textzoomIn ease-in-out forwards;
    opacity: 0;
}

.top_textbg {
    animation: 0.35s textbgzoomIn 2.3s forwards;
    opacity: 0;
}

.top_text1{
    animation-delay: 1s;
}

.top_text2 {
    animation-delay: 1.12s;
}

.top_text3 {
    animation-delay: 1.24s;
}

.top_text4 {
    animation-delay: 1.36s;
}

.top_text5 {
    animation-delay: 1.48s;
}

.top_text6 {
    animation-delay: 1.60s;
}

.top_text7 {
    animation-delay: 1.72s;
}

.top_text8 {
    animation-delay: 1.84s;
}

.top_text9 {
    animation-delay: 1.96s;
}

.top_text10 {
    animation-delay: 2.08s;
}

.top_text11 {
    animation-delay: 2.2s;
}

@media (max-width: 767px) {

    @keyframes R1zoomIn {
        0% {
            opacity: 0;
            transform: scale(0.9) translateX(-3%) translateY(-15%);
        }

        25% {
            opacity: 0;
            transform: scale(0.9) translateX(-3%) translateY(-15%);
        }

        50% {
            opacity: 1;
        }

        100% {
            opacity: 1;
            transform: scale(1) translateX(0) translateY(0);
        }
    }

    @keyframes R1ride {
        0% {
            opacity: 1;
            transform: scale(1) translateX(0%) translateY(0%);
        }

        3% {
            transform: scale(1) translateX(0%) translateY(0%);
        }

        50% {
            transform: scale(0.95) translateX(-2%) translateY(-5%);
        }

        53% {
            transform: scale(0.95) translateX(-2%) translateY(-5%);
        }

        95% {
            transform: scale(1.05) translateX(2%) translateY(5%);
        }

        100% {
            opacity: 1;
            transform: scale(1.05) translateX(2%) translateY(5%);
        }
    }

    @keyframes R3zoomIn {
        0% {
            opacity: 0;
            transform: scale(0.7) translateX(-25%) translateY(-15%);
        }

        25% {
            opacity: 0;
            transform: scale(0.7) translateX(-25%) translateY(-15%);
        }

        50% {
            opacity: 1;
        }

        100% {
            opacity: 1;
            transform: scale(1) translateX(0) translateY(0);
        }
    }

    @keyframes R3ride {
        0% {
            opacity: 1;
            transform: scale(1) translateX(0) translateY(0);
        }

        3% {
            transform: scale(1) translateX(0) translateY(0);
        }

        45% {
            transform: scale(0.95) translateX(-4%) translateY(-2%);
        }

        48% {
            transform: scale(0.95) translateX(-4%) translateY(-2%);
        }

        95% {
            transform: scale(1.05) translateX(6%) translateY(4%);
        }

        100% {
            opacity: 1;
            transform: scale(1.05) translateX(6%) translateY(4%);
        }
    }

    @keyframes R5zoomIn {
        0% {
            opacity: 0;
            transform: scale(0.6) translateX(-75%) translateY(0%);
        }

        25% {
            opacity: 0;
            transform: scale(0.6) translateX(-75%) translateY(0%);
        }

        50% {
            opacity: 1;
        }

        100% {
            opacity: 1;
            transform: scale(1) translateX(0) translateY(0);
        }
    }

    @keyframes R5ride {
        0% {
            opacity: 1;
            transform: scale(1) translateX(0) translateY(0);
        }

        3% {
            transform: scale(1) translateX(0) translateY(0);
        }

        35% {
            transform: scale(0.95) translateX(-6%) translateY(2%);
        }

        38% {
            transform: scale(0.95) translateX(-6%) translateY(2%);
        }

        95% {
            transform: scale(1.05) translateX(6%) translateY(-2%);
        }

        100% {
            opacity: 1;
            transform: scale(1.05) translateX(6%) translateY(-2%);
        }
    }
}