/**********************/
/*  パソコン用CSS開始  */
/**********************/
@charset "UTF-8";

body {
    margin: 0px;
}

/*  ロード画面開始  */

.spinner {
    margin: 300px auto;
    width: 50px;
    height: 40px;
    text-align: center;
    font-size: 10px;
}

.spinner>div {
    background-color: #ffffff;
    height: 100%;
    width: 6px;
    display: inline-block;

    -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
    animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.spinner .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

.spinner .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.spinner .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {

    0%,
    40%,
    100% {
        -webkit-transform: scaleY(0.4)
    }

    20% {
        -webkit-transform: scaleY(1.0)
    }
}

@keyframes sk-stretchdelay {

    0%,
    40%,
    100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }

    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}

#loading {
    width: 100vw;
    height: 100vh;
    background-color: #000000;

    /*  以下のコードを追加  */
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
}

.loaded {
    transition: all 1s;
    opacity: 0;
    visibility: hidden;
}

/*  ロード画面終了  */

/*  ヘッダー開始  */
header::after {
    content: "";
    display: block;
    clear: both;
}

header {
    width: 100%;
    height: auto;
    background-color: #cdf5ff;
    /*ヘッダーカラー変更可*/
    font-family: 'Monomaniac One', sans-serif;
}

header a {
    color: #000000;
}

header a:hover {
    color: #000000;
}

#header-contents {
    width: 80%;
    height: auto;
    margin: 0 auto;
}

#header-logo {
    width: auto;
    height: 50px;
    float: left;
    margin: 5px;
}

#header-logo::after {
    content: " ";
    display: block;
    clear: both;
}

.tsuuchikensuu {
    color: #e00000;
}

/*  ナビ開始  */
.global-nav {
    float: right;
    margin: 10px;
    list-style: none;
}

.global-nav li {
    display: inline;
    margin: 5px;
}

.global-nav p {
    font-size: 20px;
    margin: 0px;
}

.global-nav ul {
    margin: 0px;
}

.sp-nav {
    display: none;
}

/*  ナビリンク開始  */
.global-nav a {
    position: relative;
    display: inline-block;
    text-emphasis: none;
}

.global-nav a::after {
    position: absolute;
    bottom: -4px;
    left: 0;
    content: '';
    width: 100%;
    height: 2px;
    background: #000000;
    transform: scale(0, 1);
    transform-origin: right top;
    transition: transform .2s;
}

.global-nav a:hover::after {
    transform-origin: left top;
    transform: scale(1, 1);
}

.global-nav li a:link {
    color: #000000;
    margin: 10px;
    padding-bottom: 3px;
    text-decoration: none;
}

.global-nav a:visited {
    color: #000000;
    margin: 10px;
    padding-bottom: 3px;
    text-decoration: none;
}

/*  ナビ終了        */
/*  ナビリンク終了  */
/*  ヘッダー終了    */

/*  本文開始      */
/*  本文背景開始  */
/*  本文背景終了  */

.honbun {
    width: 80%;
    height: auto;
    margin: 10px auto;
    font-family: 'Yusei Magic', sans-serif;
}

.honbun p,
h2,
h3 {
    margin: 0px;
}

#slider-contents {
    text-align: center;
}

#slide-img {
    margin: 20px;
    width: 70%;
    height: auto;
}

.sukashi {
    background: rgba(255, 255, 255, 0.5);
    border-radius: 30px;
}

.kekkon {
    font-family: 'Zen Maru Gothic', sans-serif;
}



/*クレーンゲーム開始*/
.cranegame {
    text-align: center;
    border: #0051ff solid 5px;
    border-radius: 30px;
    margin: 10px 20px;
    background-image: url(/kyoutsuu/image/bunkasai_haikei_crane.png);
    background-repeat: repeat;
    background-size: 100px;
}

.crane-margin {
    margin: 10px 5px;
}

.cranegame-button p {
    margin: 10px;
    border: #0051ff solid 3px;
    border-radius: 30px;
    background-color: #ffffff;
}

.cranegame-button a,
a:visited {
    text-decoration: none;
    color: #000000;
}

.cranegame-button a:hover {
    text-decoration: none;
    opacity: 0.5;
}

.cranegame-button {
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding: 10px;
}

.crane-keihin {
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
}

#crane-keihin-menu {
    border: #000000 solid 3px;
    border-radius: 20px;
    cursor: pointer;
    padding: 10px;
}

#crane-setsumei {
    width: 90%;
    height: auto;
    text-align: center;
}

#keihin-all {
    width: 90%;
    height: auto;
}
/*クレーンゲーム終了*/

/*ガチャ開始*/
.gacha {
    text-align: center;
    border: #f2ff00 solid 5px;
    border-radius: 30px;
    margin: 10px 20px;
    background-image: url(/kyoutsuu/image/bunkasai_haikei_gacha.png);
    background-repeat: repeat;
    background-size: 100px;
}

.gacha-margin {
    margin: 10px 5px;
}

.gacha-button p {
    margin: 10px;
    border: #f2ff00 solid 3px;
    border-radius: 30px;
    background-color: #ffffff;
}

.gacha-button a,
a:visited {
    text-decoration: none;
    color: #000000;
}

.gacha-button a:hover {
    text-decoration: none;
    opacity: 0.5;
}

.gacha-button {
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding: 10px;
}

#gacha-image {
    width: 200px;
    height: auto;
    margin: 10px 0px;
}

.gacha-keihin {
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
    padding: 10px;
}

/*景品説明開始*/
.keihin-setsumei-box {
    width: 50%;
    height: auto;
    display: flex;
    justify-content: space-between;
    border: #000000 solid 3px;
    border-radius: 30px;
    margin: 0 auto;
    padding: 10px;
}

.keihin-title {
    font-size: large;
    font-weight: bold;
}

.keihin-setsumei-box p {
    width: 49%;
    text-align: left;
    margin: auto;
}

.keihin-setsumei-box img {
    width: 100%;
    height: auto;
}

.keihin-syashin>img {
    width: 100px;
}

#keihin-sp {
    display: none;
}
/*景品説明終了*/

.gacha-keihin {
    font-family: 'Kiwi Maru', serif;
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
    background-color: #ffffff;
}

.gacha-keihin-menu {
    cursor: pointer;
    padding: 10px;
}

/*ガチャ終了*/


/*VRゲーム開始*/
.vr {
    text-align: center;
    border: #b8ffa2 solid 5px;
    border-radius: 30px;
    margin: 10px 20px;
    background-image: url(/kyoutsuu/image/vr.png);
    background-repeat: repeat;
    background-size: 100px;
}

.vr-margin {
    margin: 10px 5px;
}

.vr-button p {
    margin: 10px;
    border: #b8ffa2 solid 3px;
    border-radius: 30px;
    background-color: #ffffff;
}

.vr-button a,
a:visited {
    text-decoration: none;
    color: #000000;
}

.vr-button a:hover {
    text-decoration: none;
    opacity: 0.5;
}

.vr-button {
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding: 10px;
}

#vr-image {
    width: 200px;
    height: auto;
}

.vr-keihin {
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
}

.vr-keihin {
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
}

#vr-keihin-menu {
    border: #000000 solid 3px;
    border-radius: 20px;
    cursor: pointer;
    padding: 10px;
}

.search-box {
    margin-top: 5px;
    border-bottom: #777777 solid 2px;
    font-family: 'Noto Sans JP', sans-serif;
}

.vr-margin>p {
    font-size: 13vw;
}

.kensakuyou>a {
    text-decoration: none;
}

.kensakuyou {
    border: #000000 2px solid;
    border-radius: 5px;
    padding: 2px;
    width: fit-content;
}

.kensakuyou :hover {
    opacity: 0.5;
}

#analog-ryoukin {
    width: 80%;
    height: auto;
}

/*VRゲーム終了*/


/*アナログゲーム開始*/
.analoggame {
    text-align: center;
    border: #ff7575 solid 5px;
    border-radius: 30px;
    margin: 10px 20px;
    background-image: url(/kyoutsuu/image/bunkasai_haikei_analoggame.png);
    background-repeat: repeat;
    background-size: 100px;
}

.analoggame-margin {
    margin: 10px 5px;
}

.analoggame-button p {
    margin: 10px;
    border: #ff7575 solid 3px;
    border-radius: 30px;
    background-color: #ffffff;
}

.analoggame-button a,
a:visited {
    text-decoration: none;
    color: #000000;
}

.analoggame-button a:hover {
    text-decoration: none;
    opacity: 0.5;
}

.analoggame-button {
    width: 90%;
    height: auto;
    margin: 0 auto;
    padding: 10px;
}

#analoggame-image {
    width: 200px;
    height: auto;
}

.analoggame-keihin {
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
}

.analoggame-keihin {
    border: #000000 solid 5px;
    border-radius: 20px;
    margin: 10px;
}

#analoggame-keihin-menu {
    border: #000000 solid 3px;
    border-radius: 20px;
    cursor: pointer;
    padding: 10px;
}

/*アナログゲーム終了*/

/*生産者開始*/
.seisansya {
    text-align: center;
}

.seisansya-image {
    width: 70%;
    height: auto;
}

.seisansya-h2 {
    font-family: 'Yuji Boku', serif;
}

.seisansya a {
    text-decoration: none;
    color: #000000;
}

/*生産者終了*/

.soushinbotan-omedetou {
    margin: 0px auto;
}

.soushinbotan-omedetou {
    border: #000000 solid 3px;
    border-radius: 10px;
    width: fit-content;
}

.soushinbotan-omedetou a:hover {
    opacity: 0.5;
}

/*  本文終了  */

/*  フッター開始  */
footer {
    width: 100%;
    height: auto;
    text-align: center;
    background-color: #000000;
    /*フッターカラー変更可*/
    padding: 10px 0px;
    font-family: 'Monomaniac One', sans-serif;
    font-family: 'Zen Maru Gothic', sans-serif;
}

footer small {
    color: #ffffff;
    margin: 0px;
    font-size: 10px;
}

footer h2 {
    color: #ffffff;
    margin: 0px;
    font-size: 21px;
}

footer p {
    color: #ffffff;
    margin: 0px;
    font-size: 21px;
}

footer a {
    text-decoration: none;
    color: #ffffff;
}

.meigaku-p {
    font-family: 'Tsukimi Rounded', sans-serif;
}

#bunkanohi {
    color: #ffffff;
    padding: 3px 7px;
    border: #cf0000 solid 1px;
    border-radius: 5px;
    background-color: #cf0000;
    font-size: 10px;
}

#sp-map {
    display: none;
}

#pc-map {
    display: inline;
}


.soushinbotan-toiawase {
    margin: 0px auto;
}

.soushinbotan-toiawase {
    border: #ffffff solid 3px;
    border-radius: 10px;
    width: fit-content;
}

.soushinbotan-toiawase a:hover {
    opacity: 0.5;
}

/*  フッター終了  */
/**********************/
/*  パソコン用CSS終了  */
/**********************/



/************************/
/*  タブレット用CSS開始  */
/*  最大幅850px         */
/************************/
@media screen and (max-width:850px) {

    .pc-nav ul>li {
        white-space: nowrap;
    }

    .honbun {
        width: 80%;
        height: auto;
        margin: 0px auto;
    }

    #pc-map {
        display: none;
    }

    #sp-map {
        display: inline;
    }

    #keihin-pc {
        display: none;
    }

    #keihin-sp {
        display: inline;
    }

    .keihin-setsumei-box-sp {
        margin-bottom: 10px;
        border: #000000 2px solid;
        border-radius: 10px;
        padding: 5px;
    }

    .keihin-setsumei-box-sp p{
        width: 95%;
        height: auto;
    }

    .keihin-setsumei-box-sp img{
        width: 100%;
        height: auto;

    }

}

/************************/
/*  タブレット用CSS終了  */
/************************/



/****************************/
/*  スマートフォン用CSS開始  */
/*  最大幅480px             */
/****************************/
@media screen and (max-width:480px) {
    body {
        margin: 0px;
    }

    header {
        height: 80px;
    }

    .pc-nav {
        display: none;
    }

    #header-logo {
        width: 40px;
        height: auto;
        margin: 5px;
    }

    /*  ハンバーガーメニュー開始  */
    .sp-nav {
        display: block;
    }

    .hamburger-menu-input {
        display: none;
    }

    .hamburger-menu-label {
        color: #000000;
        font-size: 30px;
        vertical-align: 3px;
        margin-right: 10px;
    }

    .hamburger-menu-label-hei {
        color: #ffffff;
        font-size: 20px;
        margin-right: 10px;
    }

    header {
        text-align: right;
    }

    /*  ナビ開始  */
    nav {
        margin-left: 4%;
        position: fixed;
        top: 10px;
        text-align: center;
        width: 90%;
        height: auto;
        color: #ffffff;
        border: solid 5px #525252;
        border-radius: 15px;
        background-color: #000000;
        transform: translateY(-110%);
    }

    #hamburger-menu:checked~nav {
        animation-name: fadeDownAnime;
        animation-duration: 0.5s;
        animation-fill-mode: forwards;
        opacity: 0;
    }

    @keyframes fadeDownAnime {
        from {
            opacity: 0;
            transform: translateY(-110%);
        }

        to {
            opacity: 1;
            transform: translateY(0%);
        }


    }

    #hamburger-menu:not(:checked)~nav {
        animation-name: fadeUpAnime;
        animation-duration: 0.5s;
        animation-fill-mode: forwards;
        opacity: 1;
    }

    @keyframes fadeUpAnime {
        from {
            opacity: 1;
            transform: translateY(0%);
        }

        to {
            opacity: 0;
            transform: translateY(-110%);
        }
    }

    .sp-nav ul {
        list-style: none;
    }

    .sp-nav li,
    .sp-nav a {
        text-decoration: none;
    }

    .sp-nav a,
    .sp-nav a:hover,
    .sp-nav a:link {
        color: #ffffff;
        font-family: 'Yusei Magic', sans-serif;
    }

    /*  ナビ終了  */
    /*  ハンバーガーメニュー終了  */

    /*  本文開始  */
    .honbun {
        width: 95%;
        height: auto;
        margin: 0px auto;
        border-radius: 20px;
    }

    /*  本文終了  */
}

/****************************/
/*  スマートフォン用CSS終了  */
/****************************/