/*****************************************＿＿＿＿＿＿＿＿＿＿ヘッダー＿＿＿＿＿＿＿＿＿＿＿***************************************************
******************************************＿＿＿＿＿＿＿＿＿＿header＿＿＿＿＿＿＿＿＿＿＿＿**************************************************/
header {
    position: relative;
    width: 100%;
    min-width: 1024px;
    text-align: center;
    /* background-color: tomato; */
    height: fit-content;
    padding: 0;
}
@media screen and (max-width: 480px){
    header{
        min-width: auto;
    }
}

.top {
    display: flex;
    /* background-color: yellowgreen; */
    padding: 0 3%;
    align-items: center;
    height: fit-content;
    
}
@media screen and (min-width: 1265px){
    .top2 {
            display: flex;
}
}
@media screen and (max-width: 480px){
.top{
    display: block;
}}

.top2 {
    /* display: flex; */
    /* background-color: blueviolet; */
    height: fit-content;
    /* align-items: center; */
    margin: 10px 0 10px auto;

}
.counttel{
    /* margin: 0 0 0 15px; */
    height: fit-content;
    text-align: center;
    /* margin-top: 10px; */
    /* background-color: turquoise; */
    /* align-items: center; */
    /* text-align: center; */
}
a.note{
    /* margin: 0 0 0 auto; */
    /* background-color: violet; */
}
img.note{
    width: 230px;
    margin: 0 0 0 auto;
    /* align-items: center; */
    /* background-color: #4007a2; */
    display: flex;
    /* margin: 0 0 0 auto; */
}
@media screen and (min-width: 1265px){
    img.note{
        margin: 0 1px 0 0 ;
    }
}
@media screen and (max-width: 1265px){
    img.note{
        margin: 0 0 10px auto ;
    }
}
@media screen and (max-width: 488px){
    img.note{
        margin: 0 auto 10px auto ;
    }
}
img.note2{
    display: none;
}
.tell_p{
    font-size: 4rem;
    text-decoration: none;
}
@media screen and (max-width: 480px){
    .tell_p{
        font-size: 3.2rem;
    }
    .tellbox{
        margin: 10px 0 0 0;
        text-decoration: underline 1px;
        color: #4007a2;
    }
}
/* ！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！カウンター！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！
！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！カウンター！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！ */


.count_box {
    display: flex;
    align-items: center; /* テキストとカウンターを中央揃え */
    /* gap: 10px; 各要素の間に余白を追加 */
    justify-content: center; /* 中央寄せ */
    background-color: #336699;
    border-radius: 25px; /* サイズ調整 */
    width: fit-content;
    margin: 0 0 10px auto;
    padding: 0 1em; /* 上下左右の余白を調整 */
}
@media screen and (max-width: 480px){
    .count_box{margin: 0 auto;}
}
.count {
    font-size: 1.2rem; /* 見やすいサイズに調整 */
    padding: 0;
    color: #ffffff;
    margin: 0;
    /* background-color: tomato; */
}

.iframe_count {
    width: 100%; /* 幅100% に設定、親要素の幅に合わせる */
    max-width: 70px; /* 最大幅を設定 */
    /* background-color: #7cc08c; */
    color: #ffffff;
    vertical-align:baseline; 
    margin: 0 auto;
    height: 37px; /* 高さを固定（iframe内のカウント内容に合わせる） */
    overflow: hidden; /* 横スクロールを防止 */
    padding: 0;
}

.logo {
    /* margin: 0 3%; */
    text-align: left;
    /* background-color: rgb(106, 106, 199); */
    width: fit-content;
}
@media screen and (max-width: 480px){
    .logo{
        padding: 0.1px 0 0 0;
    }
}

.logo img{
    /* width: 80%; */
    max-width: 620px;
}
@media screen and (max-width: 480px){
    .logo img{
        width: calc(100% - 80px);
        height: auto;
        display: block;
        margin: 0 auto 0 0;
    }
}

/*****************************************＿＿＿＿＿＿＿＿＿＿ナビ＿＿＿＿＿＿＿＿＿＿＿***************************************************
******************************************＿＿＿＿＿＿＿＿＿＿nav＿＿＿＿＿＿＿＿＿＿＿＿**************************************************/


nav {
    height: 100%;
    margin:0px;
    font-size: 2rem;
    position: relative;
    /* border-top: 1px solid #114370;
    border-bottom: 1px solid #114370; */
    padding: 0px;
    background: linear-gradient(#FFFFFF);
}

.nav > ul{
    background-color: #114370;
}

/* .nav_top{
    border: 1px solid #FFFFFF ;
} */

/* @media screen and (max-width: 768px){
    nav{
        font-size: 1.5rem;
    }
} */
@media screen and (max-width: 480px){
    nav{
        width: 60%;
        /* height: fit-content; */
        /* padding: fixed; */
        /* top: 0;
        right: 100%; */
        z-index: 99;
        box-shadow: -10px 10px 10px #00000032;
        position: absolute;
        top: 0px;
        right: 0px;
        padding: 60px 0 0 0;
    }
}
.navbreak{
    display: inline-block;
}
.hamburger_icom{
    width: 1.5rem;
    margin: 0 0 0 auto;
}
@media screen and (min-width: 480px){
    .hamburger_icom{
        display: none;
    }
}

.drawer_hidden{
    display: none;
}

@media screen and (max-width: 480px){
    .drawer_open{
        display: flex;
        height: 60px;
        width: 60px;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index: 100;
        cursor: pointer;
        background-color: rgb(255, 255, 255);
        position: absolute;
        top: 0px;
        right: 0;
    }/*ハンバーガーアイコン*/
    .drawer_open span{       
        height: 3px;
        width: 30px;
    }/*ヨコ棒_真ん中*/
    .drawer_open span::before{
        height: 3px;
        width: 40px;
    }/*ヨコ棒_下*/
    .drawer_open span::after{
        height: 3px;
        width: 20px;
    }/*ヨコ棒_上*/
    .drawer_open span,
    .drawer_open span::before,
    .drawer_open span::after{
        border-radius: 3px;
        background-color:#114370;
        transition: 0.5s;
        position: absolute;
        content: '';
        display: block;
    }

    .drawer_open span::before{
        bottom: 8px;
    }
    .drawer_open span::after{
        top: 8px;
    }
    #drawer_input:checked ~ nav {
        /* left: 0; */
        display: block;
        background-color: white;
    }/*チェックしたら出てくる*/
    #drawer_input ~ nav {
        display: none;
    }/*何もしない時消える*/

    #drawer_input:checked ~ .drawer_open span{
        background: rgba(255, 255, 255, 0)
    }/*ヨコ棒消える*/
    #drawer_input:checked ~ .drawer_open span::before {
        bottom: 0;
        transform: rotate(45deg);
      }/*ヨコ棒45度回転*/
    #drawer_input:checked ~ .drawer_open span::after{
        top: 0;
        transform: rotate(-45deg);
        width: 40px;
    }/*ヨコ棒45度回転*/
    nav li a{
            padding: 10px 0px 10px 0px;
    }
}

nav ul {
    /* padding-left: 0; */
    list-style: none;
    display: flex;
    height: 100%;
    /* height: 70px; */
    /* justify-content: space-between; */
    /* border-bottom: 1px solid #114370; */
    /* border-top:  1px solid #114370; */
    padding: 0.7% 3% 0.7% 3%;
    /* background-color: #ffffff; */
    background-color: #114370;
    border-color: #FFFFFF;
    

}

/* nav a{
    background: linear-gradient(#265995 , #5E91BD);
} */

@media screen and (max-width: 480px){
    nav ul{
        flex-flow: column nowrap;
        padding: 0px;
        border-bottom: none;
        border-top:  none;
        background-color: #FFFFFF;
        }
}

nav li {
    flex: 1;
    border-left: 2px solid #ffffff;
    /* background-color: #ffffff; */
    color: #FFFFFF;
}
@media screen and (max-width: 480px){
    nav li{
        border: 0;
        margin: 0;
        padding: 0 10px 15px 10px;
        box-shadow: -10px 10px 10px #00000032;
        color: #114370;
        background-color: white;
    }
}
@media screen and (max-width: 1100px){
    nav li,
    .nav_contact,
    .nav_access{
        font-size: 1.7rem;
    }
}
nav ul>li>a {
    height: 100%;
    width: auto;
    align-items: center;
    justify-content: center;
    display: flex;
}
@media screen and (max-width: 480px){
    .nav ul>li>a {
    }
}

.nav_access,
.nav_contact {
    display: grid;
    place-content: center;
    place-items: center;
    border-color: #FFFFFF;
    /* background: linear-gradient(#265995 , #5E91BD); */

}
@media screen and (max-width: 480px){
    .nav_access_icom,
    .nav_contact_icom{
        width: 3rem;
        margin: 0 10px 0 0;
    }
    .nav_access,
    .nav_contact{
        font-size: 1.2rem;
    }
}
@media screen and (max-width: 480px){
    .nav_access_icom,
    .nav_contact_icom{
        width: 2.5rem;
    }
    .nav_access,
    .nav_contact{
        font-size: 1.5rem;
        display: flex;
        justify-content: left;
    }
    .nav_contact,
    .nav_top
    {
        border-top: 1px solid #114370 ;
        background: #FFFFFF;
    }
}
    
.nav_li_right {
    /* border-right: 1px solid #114370; */
    border-right: 2px solid #FFFFFF;
}
@media screen and (max-width: 480px){
    .nav_li_right{
        border-right: 0;
    }
}
/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓以下共通↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */

/*待ち人数*/

.people_waiting{
    width: 25px;
    height: fit-content;
    background-color: #114370;
    opacity: 0.9;
    position: fixed;
    bottom: 10%;
    text-align: center;
    padding: 2% 0.5% ;
    border-radius: 0 20px 20px 0;
}

.people_waiting img{
    margin: 12px 0 ;
    width: 2rem;
}

.people_waiting p{
    margin: auto;
    writing-mode: vertical-rl;
    color: #ffffff;
    font-size: 1.5rem;
}

/*トップに戻る*/
.pagetop{
    position: fixed;
    bottom: 3%;
    right: 10px;
    text-align: center;
}

/*****************************************＿＿＿＿＿＿＿＿＿＿フッター＿＿＿＿＿＿＿＿＿＿＿***************************************************
******************************************＿＿＿＿＿＿＿＿＿__footer＿＿＿＿＿＿＿＿＿＿＿_*************************************************/
footer {

    min-width: 1024px;
}
@media screen and (max-width: 480px){
    footer{
        min-width: auto;
    }
}

.footer_content {
    border-top: 2px solid #114370;
    margin: 6% 4% 6% 4%;
    padding: 30px 0 0 15px;
    display: flex;
    font-size: 1.7rem;
    text-align: left;

}
@media screen and (max-width: 1110px){
    .footer_content{
        flex-wrap: wrap;
        padding: 40px 0 0 25px;
    }
}

.footer_img_box {
    width: 50%;
    height: 100%;
    margin: 15px auto 0 0;
    display: flex;
}
@media screen and (max-width: 1780px){
    .footer_img_box {
        flex-direction: column;
    }
}
.footer_img_p{
    margin-right: auto;
}
.footer_p_big{
    font-size: 2em;
    margin-block-end: 1em;
}
.footer_img_box img{
    width: 100%;
}
footer p{
    margin-right: auto;
}
@media screen and (max-width: 1110px){
    .footer_img_box{
        width: 100%;
        padding:  0 3% 0 0 ;
    }
    footer p{
        width: 100%;
    }
}
@media screen and (max-width: 480px){
    .footer_img_box{
        width:100%;
        padding:  0 3% 0 0 ;
    }
    footer p{
        width: 100%;
        padding: 0;
    }
}
@media (min-width: 751px) {
    a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    }
    }

    .footer_ul_big {
        list-style: '>';
        display: grid;
        grid-template-columns: repeat(
                /*横並びの数*/
                4,
                /*要素の横幅*/
                auto);
        width: 50%;
        margin: 0 0 0 auto;
        padding-left: 0;
        /* background-color: violet; */
        height: fit-content;
}
@media screen and (max-width: 1110px){
    .footer_ul_big{
        width: 100%;
    }
}
@media screen and (max-width: 480px){
    .footer_ul_big{
        width: 100%;
        margin: 0 auto;
        grid-template-columns: repeat(
            /*横並びの数*/
            2,
            /*要素の横幅*/
            auto);
        column-gap: 2rem;
    }
    .footer_content {
        font-size: 1.5rem;
    }
}

.footer_ul_big li {
    
    padding: 1rem;
    
}  

.footer_li_details{
    list-style: '+';
}

.footer_ul_big ul{
    list-style: '>';
    padding-left: 0;
    margin: 10px 0 0 0;
    /* background-color: yellowgreen; */
}

.footer_ul_big ul li{
    height: fit-content;
    line-height: 2rem;
    /* background-color: yellowgreen; */
}