@charset "utf-8";
#twitter-widget-0 {
    vertical-align: top;
}
/*-------clearfix-------*/
.clearfix:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; overflow: hidden; font-size: 0; }
.hidetxt{ text-indent: 100%; white-space: nowrap; overflow: hidden; }

html{
    overflow-x: hidden;
	scroll-behavior: smooth;
}
body{
    margin: 0;
    padding: 0;
}

a:hover {
	opacity: 0.8;
	transition: 0.2s ease-in-out;
}
a.btn2 { display: block; transition-duration: 0.2s; }
a.btn2:hover {
    opacity: 1;
    transform: scale(1.05);
}

.noto-sans-jp-bold {
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}
.noto-sans-jp-normal {
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

/*-------- フッター --------*/
footer {width: 100%; position: relative;}
footer #box_inner {width: 1200px; margin: 0 auto; position:relative;}
footer #box_inner #footer_sns {position: absolute; top:15px; right:0;}
footer #box_inner #footer_sns .fb-like{ margin: 0 10px 0 0;}
footer #box_inner #footer_sns .fb_iframe_widget > span {vertical-align: baseline !important;}
footer .box {
    position: relative;
}
footer #box_inner #footer_sns {
    position: absolute;
    top: 15px;
    right: 0;
}
/* -------- コンテンツ -------- */
#content {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: #4cb6ff;
    background-image: url(../images/white2.png), url(../images/white.png),url(../images/line.png),url(../images/bgsand.webp),url(../images/bgsand2.webp);
    background-repeat: no-repeat,repeat-x,repeat-x,repeat-x,repeat-x;
    background-position: center top,center top,center top,center bottom, center bottom;
    background-size: 904px auto,226px auto, 490px auto, 1900px auto, 1900px auto;
    min-height: 1303px;
    padding: 0;
}



@keyframes a_bubble {
	0%   { transform: translateY(0); }
    100% { transform: translateY(120%); }
}

@keyframes a_cube {
	0%   { transform: translateY(0); }
    100% { transform: translateY(80%); }
}

@keyframes a_cube_img {
	0%   { transform: rotate(0); }
	100%   { transform: rotate(360deg); }
}

@keyframes a_cube_img2 {
	0%   { transform: rotate(0); }
	100%   { transform: rotate(-360deg); }
}
/*
.bubble {
    animation: a_bubble 2s linear 0s infinite;
}
.cube {
    animation: a_cube 3s ease-out 0s infinite alternate;
}
.cube img {
    animation: a_cube_img 10s linear 0s infinite;
}
*/
#special {
    position: relative;
    width: 790px;
    margin: 0 auto;
    z-index: 2;
}

/* -------- コンテンツ_end -------- */
#lovl {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 10000;
    background: #ffffff;
}
#loadimg {
    position: absolute;
    width: 16px;
    height: 16px;
    left: 50%;
    top: 50%;
    margin-left: -8px;
    margin-top: -8px;
}

/* -------- メインビジュアル -------- */
.rblock { position: relative; }
.cont {
    position: relative;
    margin: 0 auto;
    font-size: 16px;
    font-family: -apple-system, BlinkMacSystemFont, "BIZ UDPGothic", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "Noto Sans CJK JP", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.cont img {
    display: block;
    width: 100%;
    height: auto;
    border: 0;
}
#cont01:before {
    content: "";
    display: block;
    position: relative;
    padding-top: 138.481%;
}
#cont02:before {
    content: "";
    display: block;
    position: relative;
    padding-top: 5%;
}
#cont02:after {
    content: "";
    display: block;
    position: relative;
    padding-bottom: 5%;
}
#bn_lookup {
    width: 55%;
    margin: 0 auto;
}
#bn_lookup a {
    display: block;
    transition-duration: 0.2s;
    box-shadow: 0 0 5px 0 rgba(0,0,0,0.2);
}
#bn_lookup a:hover {
    transform: scale(1.05);
}

#bubble14 { position: absolute; width: 0.759%; left: 160.379%; top: 0; margin-top: 31.898%; }
#bubble13 { position: absolute; width: 1.898%; left: 157.215%; top: 0; margin-top: 35.569%; }
#cube08 { position: absolute; width: 5.822%; left: 152.658%; top: 0; margin-top: 40.379%; }
#cube07 { position: absolute; width: 8.481%; left: 126.455%; top: 0; margin-top: 22.784%; }
#bubble12 { position: absolute; width: 0.886%; left: 122.405%; top: 0; margin-top: 19.493%; }
#bubble11 { position: absolute; width: 2.531%; left: 121.139%; top: 0; margin-top: 7.974%; }
#bubble10 { position: absolute; width: 1.265%; left: 118.734%; top: 0; margin-top: 11.772%; }
#cube06 { position: absolute; width: 2.911%; left: 92.658%; top: 0; margin-top: 27.594%; }
#cube05 { position: absolute; width: 7.974%; left: 87.594%; top: 0; margin-top: 35.696%; }
#bubble09 { position: absolute; width: 0.506%; left: 89.24%; top: 0; margin-top: 19.873%; }
#bubble08 { position: absolute; width: 1.012%; left: 88.354%; top: 0; margin-top: 17.088%; }
#bubble07 { position: absolute; width: 2.531%; left: 85.949%; top: 0; margin-top: 22.405%; }
#cube04 { position: absolute; width: 8.354%; left: 17.594%; top: 0; margin-top: 6.455%; }
#cube03 { position: absolute; width: 3.67%; left: 5.443%; top: 0; margin-top: 27.721%; }
#bubble06 { position: absolute; width: 2.911%; left: 8.227%; top: 0; margin-top: 15.949%; }
#bubble05 { position: absolute; width: 0.759%; left: 6.962%; top: 0; margin-top: 8.481%; }
#bubble04 { position: absolute; width: 1.518%; left: 4.43%; top: 0; margin-top: 11.265%; }
#cube02 { position: absolute; width: 18.354%; left: -37.469%; top: 0; margin-top: 13.291%; }
#cube01 { position: absolute; width: 7.468%; left: -47.089%; top: 0; margin-top: 40.126%; }
#bubble03 { position: absolute; width: 2.531%; left: -46.709%; top: 0; margin-top: 8.481%; }
#bubble02 { position: absolute; width: 0.886%; left: -53.925%; top: 0; margin-top: 33.037%; }
#bubble01 { position: absolute; width: 1.645%; left: -58.355%; top: 0; margin-top: 36.455%; }

#bgsand { position: absolute; width: 223.67%; left: -61.773%; top: 0; margin-top: 135.316%; }
#bgline { position: absolute; width: 240.632%; left: -70.254%; top: 0; margin-top: 57.721%; }

#logo { position: absolute; width: 84.43%; left: 6.202%; top: 0; margin-top: 35.696%; z-index: 2;}
#circle { position: absolute; width: 94.81%; left: 2.658%; top: 0; margin-top: 18.987%; }

#tx1 { position: absolute; width: 62.025%; left: 18.607%; top: 0; margin-top: 90.632%; }
#kira1 { position: absolute; width: 5.063%; left: 82.151%; top: 0; margin-top: 102.784%; }
#kira2 { position: absolute; width: 2.911%; left: 80.253%; top: 0; margin-top: 108.354%; }
#comingsoon { position: absolute; width: 115.822%; left: -7.216%; top: 0; margin-top: 120.632%; }

@media screen and (min-width: 1901px) {
    /*
    #content {
        width: 100%;
        left: auto;
        margin: 0;
        background-size: 100% auto;
        min-height: 68.1vw;
    }
    #special {
        width: 41.578%;
    }
    */
}
.pc { display: inline-block; }
.sp { display: none; }
.map_pc { display: block; }
.map_sp { display: none; }

@media screen and (max-width:767px) {
    .pc { display: none; }
    .sp { display: inline-block; }

    body #wrap footer .box {
        width: 100%;
    }
    footer {
        padding: 3% 0;
        box-sizing: border-box;        
    }
    footer #box_inner {width: 100%;}
    footer #box_inner #footer_sns {
        position: relative;
        top: auto;
        left: auto;
        padding-top: 2%;
    }
    #content {
        width: 100%;
        left: auto;
        margin: 0;
        background-size: 117.7% auto,29.427% auto, 63.802% auto, 247.395% auto, 247.395% auto;
        min-height: 165.661vw;
    }

    #special { min-width: initial; min-width: auto; width: 100%; }
}