@charset "utf-8";
/* CSS Document */

/*
Theme Name: au_be
Theme URI: https://www.au-be.jp/
Author: au-be
Author URI: https://www.au-be.jp/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags:
*/

/* A Modern CSS Reset */
*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role="list"],ol[role="list"]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}table{border-collapse: collapse;border-spacing: 0;width: 100%;}

html {
    font-size: 1rem;
    scroll-behavior: smooth;
    scroll-padding-top:80px;
}

body {
    position: relative;
    font-family: Noto Sans JP,sans-serif;
    font-optical-sizing: auto;
    line-height: 1.5;
    color: #000;
}


::selection {
    background-color: #c6cbcb;
}
a:hover,
a:active,
a:visited {
    text-decoration: none;
}

p {
    word-break: break-all !important;
    word-wrap: break-word !important;
}

img {
    max-width: 100%;
    height: auto;
}

embed,
iframe,
object {
    max-width: 100%;
}

address {
    font-style: normal;
}

a {
    color:#00a7b5;
    text-decoration: none;
}
.hover_opacity:hover {
    opacity: 0.5;
}
.hover_brightness:hover {
    filter:brightness(.75);
}
.hover_underline:hover {
    text-decoration: underline;
}

ul,ol {
    padding-left: 1.5rem;
}

.pc {
    display: none!important;
}

@media only screen and (min-width: 1024px) , print {
    html {
        scroll-padding-top:160px;
        font-size: 16px;
    }
    .pc {
        display: inherit!important;
    }
    .mobile {
        display: none!important;
    }
}

.font_marcellus {
    font-family: "Marcellus", sans-serif;
    font-style: normal;
}

.border01 {
    border: 1px solid;
}
.border_b_01 {
    border-bottom: 1px solid;
}
.border_t_01 {
    border-top: 1px solid;
}
.border_gray {
    border-color: #e5e7eb;
}

.bg_white {
    background-color: #fff!important;
}
.bg_blue {
    background-color: #314663!important;
}
.bg_light_blue {
    background-color: #74aab0!important;
}
.bg_black {
    background-color: #000000!important;
}
.bg_grey_darken {
    background-color: #333333!important;
}

.black {
    color: #000!important;
}
.black2 {
    color: #333!important;
}
.gray {
    color: #727171!important;
}
.gray2 {
    color: #4F4F4F!important;
}
.white:not(.bg.white) {
    color: #fff!important;
}
.red {
    color: #d91c1c!important;
}
.blue {
    color: #00a7b5!important;
}
.blue2 {
    color: #abd1f7!important;
}

.pointer {
    cursor: pointer;
}
.underline {
    text-decoration: underline;
}
.nowrap {
    white-space: nowrap;
}
.fw {
    font-weight: 700;
}
.fw500 {
    font-weight: 500;
}
.small {
    font-size: 0.8em;
}

.f10 {
    font-size: 10px;
}
.f12 {
    font-size: 12px;
}
.f14 {
    font-size: 14px;
}
.f18 {
    font-size: 18px;
}
.f24 {
    font-size: 24px;
}
.fs_16-18 {
    font-size:16px;
}
.fs_20-30 {
    font-size:20px;
}
.fs_24-36 {
    font-size:24px;
}
@media only screen and (min-width: 1024px) , print {
    .fs_16_18 {
        font-size:18px;
    }
    .fs_20-30 {
        font-size:30px;
    }
    .fs_24-36 {
        font-size:36px;
    }
}

.lh_1 {
    line-height: 1;
}
.writing-vertical {
    writing-mode: vertical-rl;
}

.align-middle {
    vertical-align: middle;
}

.object-bottom {
    object-position: bottom!important;
}

.container {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    padding-left: 20px;
    padding-right: 20px;
}
.wrap {
    max-width: 896px;
    margin-left: auto;
    margin-right: auto;
}


/* リキャプチャ表示隠す
---------------------*/
.grecaptcha-badge { visibility: hidden; }



/* header
-------------------------------*/
.head_menu_btn {
    position: fixed;
    top: 8px;
    right: 8px;
    background-color: rgb(255 255 255 / 50%);
    aspect-ratio: 1 / 1;
    z-index: 30;
    transition: 0.5s;
}
.head_menu_btn button {
    background: none;
    border: 0;
    line-height: 1;
    padding: 0;
}
.head_menu_btn button span {
    display: block;
    width: 32px;
    height: 1px;
}
.head_menu_btn.is-open button span:nth-child(1) {
    transform:translateY(9px) rotate(45deg);
}
.head_menu_btn.is-open button span:nth-child(2) {
    opacity: 0;
}
.head_menu_btn.is-open button span:nth-child(3) {
    transform:translateY(-9px) rotate(-45deg) ;
}

#head_nav_bg,
#head_nav {
    display: none;
    transition: all;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 20;
    transition: opacity 0.5s, display 0.5s, translate 0.7s;
    transition-behavior: allow-discrete;
    translate: 60% 0;
    opacity: 0;
}
#head_nav_bg {
    background: rgb(0 0 0 / 85%);
    width: 60%;
}
#head_nav {
    transition-delay: 300ms;
    width: 60%;
    overflow: auto;
}
#head_nav.is-closing {
    transition-delay: 0s !important;
}
#head_nav_bg.is-open,
#head_nav.is-open {
    display: block!important;
    opacity: 1;
    translate: 0;
    @starting-style {
        opacity: 0;
        translate: 10% 0;
    }
}
#head_nav a {
    padding: 8px;
    border-bottom:1px solid #777777;
}
#head_nav a:last-child {
    border-bottom: 0;
}

.head_pc_top a {
    padding: 0 8px;
    border-right: 1px solid;
}
.head_pc_top a:first-child {
    border-left: 1px solid;
}
.head_pc_menu {
    border-top: 2px solid;
    border-bottom: 2px solid;
}
.head_pc_menu > ul {
    border-top: 1px solid;
    border-bottom: 1px solid;
    list-style: none;
    margin: 5px 0;
    padding: 8px 0;
}

/* main
-------------------------------*/
.content {
    padding-bottom: 32px;
}
@media only screen and (min-width: 1024px) , print {
    .content {
        padding-bottom: 96px;
    }
}

/* footer
-------------------------------*/
.footer {
    padding-bottom: 64px;
}
.footer_app_bg {
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}
.footer_app_content {
    max-width: 896px;
}
.footer_app_img {
    width: 66.666667%;
}
.footer_app_link {
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 66.666667%;
    padding: 12px;
    display: grid;
    gap: 12px;
}
.footer_reserve_btn {
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.footer_reserve_btn svg {
    position: absolute;
    right: 10px;
}
.footer_link_mobile {
    display: flex;
    justify-content: center;
    align-self: center;
}
.footer_link_mobile a {
    border-left: 1px solid;
    padding: 0 4px;
}
.footer_link_mobile a:first-child {
    border-left: 0;
}
.copy {
    color: #111;
    font-size: 12px;
}
.footer_fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 4px 16px;
    width: 100%;
    background-color: rgb(255 255 255 / 80%);
    z-index: 30;
}
@media only screen and (min-width: 768px) , print {
    .footer_app_img {
        width: 50%;
    }
}
@media only screen and (min-width: 1024px) , print {
    .footer {
        padding-bottom: 12px;
    }
    .footer_app {
        border-bottom: 2px solid;
    }
    .footer_app_img {
        padding-right: 56px;
    }
    .footer_app_link {
        padding: 44px;
        width: 50%;
        gap: 20px;
    }
    .footer_app_link h3 {
        font-size: 24px;
    }
    .footer_link > div {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .footer_link a {
        border-left: 1px solid;
        padding: 0 8px;
    }
    .footer_link a:last-child {
        border-right: 1px solid;
    }
    .copy {
        font-size: 10px;
    }
}





/* movie
-------------------------------*/
.movie_list {
    display: grid;
    gap: 32px;
}
.video iframe {
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 16/9;
}
@media only screen and (min-width: 1024px) , print {
    .movie_list {
        gap: 56px;
    }
}