@charset "UTF-8";
.contents { overflow: hidden; }
/*img{width: 100%;}*/

figure{position: relative;}

.f-50{font-size: 50%;}
.f-60{font-size: 60%;}
.f-70{font-size: 70%;}
.f-80{font-size: 80%;}
.f-90{font-size: 90%;}
.f-110{font-size: 110%;}
.f-120{font-size: 120%;}
.f-130{font-size: 130%;}
.f-140{font-size: 140%;}
.f-150{font-size: 150%;}
.f-160{font-size: 160%;}
.f-170{font-size: 170%;}
.f-180{font-size: 180%;}
.f-190{font-size: 190%;}
.f-200{font-size: 200%;}
.f-210{font-size: 210%;}
.f-220{font-size: 220%;}
.f-230{font-size: 230%;}
.f-240{font-size: 240%;}


#main_Wrap {
    position: relative;
    background-color: #0c252e;
    padding: 60px 0;
    text-align: center;
}
#main_Wrap h2 {
    /* position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); */
    font-size: clamp(20px,3.333333333333333vw,40px);
    color: #fff;
    text-shadow: 0px 0px 12px #000000;;
    letter-spacing: 0.12em;
    font-family: "Cinzel", serif;
}

.page_head {
    position: relative;
    width: 94%;
    margin: 0 auto;
    padding: 80px 0 70px;
    text-align: center;
}
.page_head h3 {
    font-size: clamp(18px,2.166666666666667vw,26px);
    line-height: 1.8;
    letter-spacing: 0.12em;
    color: #162e3a;
}
.page_head p{
    font-size: clamp(14px,1.142857142857143vw,16px);
    line-height: 2;
    padding: 50px 0 0;
}


.map_box {
    margin: 80px auto 100px;
}
.map_box a.gm_btn {
    display: block;
    margin: 60px auto 0;
    color: #0c252e;
    border: 1px solid #0c252e;
    width: 320px;
    padding: 20px;
    box-sizing: border-box;
    transition: .3s;
}
.map_box a.gm_btn span {
    display: flex;
    align-items: center;
    justify-content: center;
}
.map_box a.gm_btn span::before {
    content: "";
    width: 0.75em;
    aspect-ratio: 4/5;
    background: url(../img/icon_map.png) no-repeat center center;
    background-size: contain;
    margin-right: 1em;
    transition: .3s;
}

/*hover*/
.map_box a.gm_btn:hover {
    color: #fff;
    border: 1px solid #0c252e;
    background: #0c252e;
}
.map_box a.gm_btn:hover span::before {
    background: url(../img/icon_map_w.png) no-repeat center center;
    background-size: contain;
}

.gallery_Area {
    justify-content: space-between;
    max-width: 1000px;
    margin: 40px auto 100px;
    background: #fff;
    border: 1px solid #0d242e;
    box-sizing: content-box;
}

.gallery_Area h3 {
    text-align: center;
    font-size: clamp(18px, 1.714285714285714vw, 24px);
    letter-spacing: 0.16em;
    color: #fff;
    padding: 5% 0;
    background: #153b4c;
    border-bottom: 1px solid #0d242e;
}

.gallery_Area figure {
    width: 51%;
    max-width: 510px;
    margin: 0;
}
.gallery_Area > div {
    width: 49%;
    border-left: 1px solid #0d242e;
}

.gallery_Area .addres_inner {
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    padding: 4% 0;
}

.gallery_Area .addres_inner p {
    font-size: clamp(16px, 1.428571428571429vw, 20px);
    letter-spacing: 0.1em;
    line-height: 1.6;
    color: #0c252e;
    padding: 0 0 3%;
}
.gallery_Area .addres_inner p.addnote {
            padding: 0 0 20px;
}
.gallery_Area .addres_inner p span {
    display: inline-block;
    width: 65.439672801635992%;
    max-width: 320px;
    color: #fff;
    background: #153b4c;
    padding: 0.5em 0;
}
.gallery_Area .addres_inner p.addnote {
font-size: 10px;
}


.gallery_Area .addres_inner .gmap_btn {
    display: flex;
    justify-content: center;
    transition: 0.3s;
}
.gallery_Area .addres_inner .gmap_btn .gmap_btn_inner {
    border: 1px solid #fff;
    padding: 20px 0;
    color: #0c252e;
    width: 65.439672801635992%;
    max-width: 320px;
    border: 1px solid #0c252e;
    transition: .3s;
}
.gallery_Area .addres_inner .gmap_btn .gmap_btn_inner:hover {
    color: #fff;
    border: 1px solid #0c252e;
    background: #0c252e;
}

.gallery_Area .addres_inner .gmap_btn .gmap_btn_inner span::before {
    content: "";
    width: 0.75em;
    aspect-ratio: 4/5;
    background: url(../img/icon_map.png) no-repeat center center;
    background-size: contain;
    margin-right: 1em;
    transition: .3s;
}
.gallery_Area .addres_inner .gmap_btn .gmap_btn_inner:hover span::before {
    background: url(../img/icon_map_w.png) no-repeat center center;
    background-size: contain;
}

#notes_Area {
    background: unset;
}
/*=========================================================================================================
tab
=========================================================================================================*/
@media screen and (min-width: 768px) and (max-width: 1024px) {






}

/*=========================================================================================================
sp
=========================================================================================================*/
@media screen and (max-width: 767px) {
    .contents {
        padding: 0;
    }
    .page_head {
        padding: 60px 0 50px;
    }
    .page_head p {
        padding: 30px 0 0;
        text-align: left;
    }
    .map_box {
    margin: 80px auto 70px;
}
    .map_box a.gm_btn {
    margin: 40px auto 0;
}

    .gallery_Area {
        width: 94%;
        margin: 40px auto 50px;
        flex-direction: column;
    }
    .gallery_Area figure {
        width: 100%;
        max-width: 100%;
    }
    .gallery_Area > div {
        width: 100%;
        border-left: none;
    }
    .gallery_Area .addres_inner {
        padding: 5% 5% 8%;
    }
    .gallery_Area .addres_inner p {
        padding: 10px 0;
        line-height: 1.4;
    }
    .gallery_Area .addres_inner p.addnote {
    letter-spacing: 0.01em;
            padding: 0 0 20px;
}
    .gallery_Area .addres_inner p span {
    width: 98%;
}
    .gallery_Area .addres_inner .gmap_btn .gmap_btn_inner {
    width: 98%;
}
}