/* モバイルファーストで記述してあります*/
/*↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 共通項目↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/
:root {
    --mainColor: #000144;
    --subColor: #C0C0C0;
    --accentColor: #b09b6e;
    --bgColor: #f4f4f5;
  }


html {
    font-size: 62.5%;
    font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
    height: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: 120px;
}

.noSmooth {
    scroll-behavior: auto;
}

body {
    font-size: 1.6rem;
    line-height: 1.6;
    color: #2d2d2e;
    background-color: #fff;
}


main {
    padding-bottom: 160px;
}

img {
    max-width: 100%;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
    img {
        image-rendering: -webkit-optimize-contrast;
    }
}

video {
    max-width: 100%;
    width: 100%;
}

a {
    text-decoration: none;
    color: var(--mainColor);
    position: relative;
    font-weight: bold;
}

a.op8:hover {
    opacity: 0.8;
}

a::after {
    position: absolute;
    left: 0;
    content: '';
    width: 100%;
    height: 1px;
    background-color: var(--mainColor);
    bottom: -1px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
}

a:hover::after {
    transform: scale(1, 1);
    /*ホバー後、x軸方向に1（相対値）伸長*/
}

a.white::after {
    background-color: #fff;
}

a.none::after {
    content: none;
}

.shadow {
    position: relative;
    top: 0;
    left: 0;
    transition: all .1s;
}

.shadow:hover {
    /* top:-1px;
    left: -1px; */
    box-shadow: 3px 3px 0 0 var(--mainColor);
    opacity: .8;
}

.shadow:active {
    box-shadow: 0 0;
    transform: translate(3px, 3px);
}

.shadow2 {
    position: relative;
    top: 0;
    left: 0;
    transition: all .1s;
}

.shadow2:hover {
    box-shadow: 3px 3px 0 0 var(--subColor);
    opacity: .8;
}

.shadow2:active {
    box-shadow: 0 0;
    transform: translate(3px, 3px);
}

.shadow::after,
.shadow2::after {
    content: none;
}


a.imgShadow img {
    position: relative;
    top: 0;
    left: 0;
    transition: all .1s;
}

a.imgShadow img:hover {
    /* top:-1px;
    left: -1px; */
    box-shadow: 3px 3px 0 0 var(--subColor);
    opacity: .8;
}

a.imgShadow img:active {
    box-shadow: 0 0;
    transform: translate(3px, 3px);
}

a:has(img)::after {
    content: none;
}

.pc {
    display: none;
}

.content {
    width: min(100%, 1400px);
    margin-inline: auto;
}

.content12 {
    width: min(100%, 1200px);
    margin-inline: auto;
}
.content13 {
    width: min(100%, 1300px);
    margin-inline: auto;
}
.content16 {
    width: min(100%, 1600px);
    margin-inline: auto;
}

#home .content {
    width: min(100%, 1500px);
}


.inner {
    padding-left: 5%;
    padding-right: 5%;
}
.inner2{
    padding: 2%;
}

.hidden {
    overflow: hidden;
}

.main_bg {
    background-color: var(--bgColor);
}

.bg {
    background-color: var(--bgColor);
    padding-bottom: 50px;
}

.bg_white {
    background-color: #fff;
    padding-block: 50px;
    margin-top: 70px;
}


/* .bg_yellow {
    background-color: #fff7d1;
} */


ul.list {
    line-height: 1.5;
}

ul.list li {
    padding-bottom: 0.5em;
    text-indent: -1em;
    padding-left: 1em;
}

.stepList li {
    position: relative;
    margin-top: 20px;
}

.stepList li::after {
    content: '';
    display: block;
    height: 20px;
    width: 1px;
    background-color: var(--mainColor);
    position: absolute;
    bottom: -20px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.stepList li:last-of-type::after {
    content: none;
}

.stepList_num {
    font-size: 2rem;
    height: 2em;
    width: 2em;
    border-radius: 50%;
    line-height: 2;
    text-align: center;
    background-color: var(--mainColor);
    font-weight: bold;
    color: #fff;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
}

.stepList_item {
    background-color: #e8e8eb;
    padding: 1.5em 1em 1.5em 2.5em;
    width: calc(100% - 1.75em);
    margin-left: auto;
}

.stepList_num02 {
    width: 4.5em;
    border-radius: 0;
}

.stepList_item02 {
    padding: 1.5em 1em 1.5em 4.5em;
    width: calc(100% - 2.75em);
}


ol.step02 {
    counter-reset: item;
    list-style-type: none;
    padding: 0;
}

ol.step02 li {
    text-indent: -1.7em;
    padding-left: 1.7em;
    padding-top: 20px;
}

ol.step02 li:first-of-type {
    padding-top: 0;
}

ol.step02 li::before {
    counter-increment: item;
    content: counter(item)'.';
    /* 以下装飾 */
    padding-right: .7em;
    font-size: 1.1em;
    font-weight: bold;
    color: var(--mainColor);
}



.title1 {
    border-bottom: solid 3px #dbdbdb;
    position: relative;
    font-weight: bold;
    font-size: 2.6rem;
}

.title1::after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 3px var(--mainColor);
    bottom: -3px;
    width: 25%;
}


.title1 span {
    font-size: 0.4em;
    color: #666;
    margin-left: 1em;
}

.sub .title1 {
    font-size: 2.2rem;
}

.title2 {
    font-size: 1.8rem;
    padding-left: 1em;
    position: relative;
    font-weight: bold;
    vertical-align: top;
    line-height: 1.4; 
}

.title2::before {
    content: '';
    position: absolute;
    top: 0.7em;
    left: 0;
    display: inline-block;
    width: 0.5em;
    height: 2px;
    background-color: var(--mainColor);
}

.title3 {
    font-size: 1.8rem;
    font-weight: bold;
    color: var(--mainColor);
    line-height: 1.2;
    text-align: center;
    border-top: double 3px var(--mainColor);
    border-bottom: double 3px var(--mainColor);
    padding: 0.5em 0;
}

.title4 {
    font-size: 1.8rem;
    font-weight: bold;
    border-left: 4px solid var(--mainColor);
    padding-left: 0.5em;
}

.title5 {
    border-bottom: solid 3px #fff;
    font-size: 2.4rem;
    font-weight: bold;
    color: #fff;
    position: relative;
    padding-right: 1em;
}

.title5::after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 3px var(--subColor);
    bottom: -3px;
    width: 25%;
}
.title5_2{
    color: #2d2d2e;
}
.title5_2::after {
    border-bottom: solid 3px var(--mainColor);
}

.title6 span{
    font-size: 2.4rem;
    font-weight: bold;
    background: linear-gradient(transparent 70%, #ffff00 70%);
    color: #E00000;
}

.titleSub {
    font-weight: bold;
    font-size: 2.6rem;
    text-align: center;
    color: var(--mainColor);
}

.titleSub span {
    font-size: 0.4em;
    color: #ccc;
    display: block;
}

.btn1 {
    background-color: var(--mainColor);
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    padding: 1em 1.2em;
    line-height: 1.2;
}

.btn1::after {
    content: none;
}


.max200 {
    max-width: 200px;
}

.max400 {
    max-width: 400px;
}

.max500 {
    max-width: 500px;
}

.max600 {
    max-width: 600px;
}

.max700 {
    max-width: 700px;
}

.max1000 {
    max-width: 1000px;
}
.i_block {
    display: inline-block;
}

.flex_boxSP {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.flexSP50 {
    width: 49%;
}

/* テーブル汎用 */
.table01 {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
    overflow-wrap: break-word;
    word-wrap: break-word;
    box-sizing: border-box;
    background-color: #e8e8eb;
    font-size: 1.3rem;
    line-height: 1.2;
}

.table01 th {
    background-color: var(--mainColor);
    color: #fff;
    text-align: center;
    padding: 0.7em 0.2em;
    box-sizing: border-box;
    vertical-align: middle;
    border: 2px solid #fff;
}

.table01 td {
    text-align: center;
    padding: 0.5em 0.2em;
    box-sizing: border-box;
    vertical-align: middle;
    border: 2px solid #fff;
}

.table01 th a {
    color: #fff;
}

.table01 th a::after {
    background-color: #fff;
}

.table01 td.td_textL {
    text-align: left;
    padding-left: 5%;
    padding-right: 5%;
}

.table01 caption {
    font-weight: bold;
    caption-side: bottom;
    font-size: 0.9em;
    margin-top: 5px;
}

/* ホバーでハイライト */
.crossHover {
    overflow: hidden;
}

.crossHover th,
.crossHover td {
    position: relative;
}

.crossHover td:hover::before,
.crossHover td:hover::after {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(100, 100, 100, .2);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    mix-blend-mode: multiply;
    pointer-events: none;
}

.crossHover td:hover::before {
    width: 200vw;
    left: -100vw;
}

.crossHover td:hover::after {
    height: 200vh;
    top: -100vh;
}

/* スマホ時縦並び1列 */
.table01_column1 {
    font-size: 1.6rem;
}

.table01_column1 th,
.table01_column1 td {
    display: block;
    width: 100%;
}

.table01_column1 th {
    border-bottom: none;
}

.table01_column1 td {
    border-top: none;
}

/* スマホ時横スクロールをつけるとき */
.table_wrapper {
    overflow-x: scroll;
    margin-top: 10px;
}

.table_wrapper .table01 {
    width: 600px;
}

.table_wrapper::before {
    content: '\203B\3053\306E\8868\306F\6A2A\306B\30B9\30AF\30ED\30FC\30EB\3067\304D\307E\3059';
}

.outline {
    font-size: 1.8rem;
    font-weight: bold;
}


.mgt10 {
    margin-top: 10px;
}

.mgt20 {
    margin-top: 20px;
}

.mgt30 {
    margin-top: 30px;
}

.mgt50 {
    margin-top: 50px;
}

.mgt70 {
    margin-top: 70px;
}

.mgt100 {
    margin-top: 100px;
}

.mgt150 {
    margin-top: 150px;
}

.mgt200 {
    margin-top: 200px;
}

.mgl10 {
    margin-left: 10px;
}

.mgr10 {
    margin-right: 10px;
}

.mgb10 {
    margin-bottom: 10px;
}

.mg_iAuto {
    margin-inline: auto;
}

.pdt50 {
    padding-top: 50px;
}

.pdt100 {
    padding-top: 100px;
}

.textR {
    text-align: right;
}

.textL {
    text-align: left;
}

.textC {
    text-align: center;
}

.textC_sp {
    text-align: center;
}


.keycolor {
    color: var(--mainColor);
}

.red {
    color: #E00000;
}

.blue {
    color: #0e70d1;
}

.white {
    color: #fff;
}

.large {
    font-size: 1.1em;
}

.large2 {
    font-size: 1.2em;
}

.large5 {
    font-size: 1.5em;
    padding-right: 0.1em;
}

.small {
    font-size: 0.9em;
}

.bold {
    font-weight: bold;
}

.nomal {
    font-weight: normal;
}
.boxShadow{
    box-shadow: 0 0 8px rgba(0, 0, 0, .3);
}

.inview1{
    opacity: 0;
   transition: 0.7s;
   transition-delay: 0.2s;
   transform: translate(-1%, 0);
 }
 .inview1.delay{
   transition-delay: 0.5s; 
 }
 .inview1.show{
    opacity: 1;
    transform: translate(0, 0);
  }
@media screen and (min-width: 600px) {
    .table_wrapper {
        overflow-x: visible;
    }

    .table_wrapper .table01 {
        width: 100%;
    }

    .table_wrapper::before {
        content: none;
    }

    .table01 {
        font-size: 1.4rem;
    }

    .table01_column1 th {
        display: table-cell;
        width: 25%;
    }

    .table01_column1 td {
        display: table-cell;
        width: 75%;
    }
}

@media screen and (min-width: 1024px) {
    .pc {
        display: block;
    }

    .textC_sp {
        text-align: left;
    }

    .title1 {
        font-size: 3.2rem;
    }

    .title2 {
        font-size: 2rem;
        padding-left: 1em;
        position: relative;
        font-weight: bold;
    }

    .info01 .title5,
    .info02 .title5 {
        font-size: 2.2rem;
    }

    .titleSub {
        font-size: 3rem;
    }

    .flex_box {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .flex50 {
        width: 49%;
    }

    .flex30 {
        width: 32%;
    }

    .flex40 {
        width: 40%;
    }

    .flex45 {
        width: 45%;
    }

    .flex60 {
        width: 58%;
    }

    .flex70 {
        width: 66%;
    }

    .flex55 {
        width: 53%;
    }

    .table01 {
        font-size: 1.6rem;
    }

    .outline {
        text-align: center;
        width: 80%;
        margin-inline: auto;
    }

}

@media screen and (min-width: 1280px) {
    .info02 .title5 {
        padding-right: 2.5em;
    }

}


/* ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑共通項目↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ */


/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓   ヘッダー  ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/


/* /////////////////////////////////スマホ版メニュー///////////////////////////////// */
.nav-hidden {
    display: none;
}

.yoyaku {
    display: none;
}

header a {
    text-decoration: none;
    color: #333;
}

header {
    background-color: #fff;
    width: 100%;
    height: 100px;
    position: sticky;
    top: 0;
    left: 0;
    z-index: 300;
    box-sizing: border-box;
    box-shadow: 0 0 5px rgba(0, 0, 0, .1);
}

header a:hover {
    opacity: .8;
}

/* ///////////////////////////////// ヘッダー グループロゴ /////////////////////////////////*/
.dr_golf {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_dr_golf {
    height: 38px;
}

.logo_dr_golf img {
    max-height: 38px;
}

/*///////////////////////////////// ヘッダー グループコース /////////////////////////////////*/

.dr_golf_group {
    position: relative;
}

.dr_golf_group .toggle_group_inner {
    width: 100%;
    height: 38px;
    font-size: 0.8em;
    text-align: center;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    background-color: #fff;
    color: var(--mainColor);
    font-weight: bold;
    transition: 0.3s;
    padding-inline: 0.3em;
}

.dr_golf_group .toggle_group_inner:hover {
    background-color: var(--mainColor);
    color: #fff;
}

.dr_golf_group .toggle_group_inner.toggle_group_inner:hover img {
    filter: brightness(0) invert(100%);
}

#toggle_group {
    display: none;
    cursor: pointer;
}

#dropDown {
    display: none;
}

#toggle_group_text .toggle_group_line {
    background-color: var(--mainColor);
    width: 23px;
    height: 23px;
    margin-left: 3px;
    position: relative;
}


#toggle_group_text .toggle_group_line::before,
#toggle_group_text .toggle_group_line::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 15px;
    background: #fff;
    transition: 0.3s;
}

#toggle_group_text .toggle_group_line::before {
    transform: translate(-50%, -50%);
}

#toggle_group_text .toggle_group_line::after {
    transform: translate(-50%, -50%) rotate(-90deg);
}

#toggle_group_text .toggle_group_inner:hover .toggle_group_line {
    background-color: #fff;
}

#toggle_group_text .toggle_group_inner:hover .toggle_group_line::before,
#toggle_group_text .toggle_group_inner:hover .toggle_group_line::after {
    background-color: var(--mainColor);
}

#toggle_group:checked~#toggle_group_text .toggle_group_inner {
    background-color: var(--mainColor);
    color: #fff;
}

#toggle_group:checked~#toggle_group_text img {
    filter: brightness(0) invert(100%);
    transition: 0.3s;
}

#toggle_group:checked~#dropDown {
    display: grid;
    animation: 0.5s fadeIn1;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    position: fixed;
    width: 100%;
    height: 100vh;
    padding: 5% 5% 80px;
    transition: all 0.5s;
    background-color: var(--mainColor);
    z-index: 200;
    top: 38px;
    left: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

#toggle_group:checked~#toggle_group_text .toggle_group_line {
    background-color: #fff;
}

#toggle_group:checked~#toggle_group_text .toggle_group_line::before,
#toggle_group:checked~#toggle_group_text .toggle_group_line::after {
    background-color: var(--mainColor);
}


#toggle_group:checked~#toggle_group_text .toggle_group_line::before {
    transform: translate(-50%, -50%) rotate(90deg);
}

#dropDown li {
    padding: 5px 5px 10px;
    display: block;
    background-color: #fff;
    line-height: 1.2;
    position: relative;
}

#dropDown li a {
    color: var(--mainColor);
    font-size: 0.8em;
    font-weight: bold;
}

#dropDown li a img {
    padding-bottom: 0.5em;
}

#dropDown li span {
    position: absolute;
    top: 1px;
    left: 1px;
    background-color: var(--mainColor);
    z-index: 1;
    color: #fff;
    padding: 0.5em;
}

/*///////////////////////////////// ヘッダー スタッフ募集 /////////////////////////////////*/
.recruit {
    width: 100%;
    max-width: 150px;
    height: 50px;
}

.recruit a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    flex-wrap: wrap;
    color: var(--mainColor);
}

.recruit img {
    margin-right: 0.2em;
}

.recruit a:hover {
    background-color: var(--mainColor);
    color: #fff;
    transition: 0.3s;
}

.recruit a:hover img {
    filter: brightness(0) invert(100%);
    transition: 0.3s;
}


/*///////////////////////////////// ヘッダー 言語切替 /////////////////////////////////*/

.language {
    max-width: 180px;
    height: 38px;
    margin-left: auto;
}

.language select,
.language ::picker(select) {
    appearance: base-select;
    cursor: pointer;
    color: var(--mainColor);
}

.language ::picker(select) {
    box-shadow: 0 1px 2px 0 hsla(0, 0%, 87%, 0.16), 0 2px 6px 2px rgba(60, 64, 67, 0.15);
}

.language select {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding-inline: 0.3em;
    font-size: 1.1rem;
    font-weight: bold;
}

.language select:hover {
    color: #fff;
    background-color: var(--mainColor);
}

.language select:hover button img {
    filter: brightness(0) invert(100%);
}

.language img.op_img {
    filter: brightness(0) invert(90%);
}

/* option要素のスタイル */
.language option {
    padding: 0 0.5em;
    height: 2.5em;
    /* font-size: 1.6rem; */
    cursor: pointer;
    font-weight: normal;
}

/* 選択されているoption要素のスタイル */
.language option:checked {
    background: var(--mainColor);
    color: #fff;
}

/* 選択されているoption要素のbefore要素（チェックマーク） */
.language option::before {
    display: none;
}

/* ホバー・フォーカスされているoption要素のスタイル */
.language option:hover,
.language option:focus-visible {
    background: var(--mainColor);
    color: #fff;
    outline: none;
}


/*///////////////////////////////// ヘッダー メニュー /////////////////////////////////*/
.header_inner {
    border-top: var(--mainColor) solid 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 10px;
}

header .logo {
    flex: 1;
    padding: 5px 5px 5px 0;
    box-sizing: border-box;
    margin-right: auto;
    text-align: left;
}

header .logo img {
    max-height: 50px;
}

header .logo a img:hover {
    box-shadow: none;
}

nav.menu_wrapper {
    position: fixed;
    width: 100%;
    display: none;
    list-style: none;
    transition: all 0.5s;
    background-color: #fff;
    height: 100vh;
    z-index: 100;
    top: 100px;
    left: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 50px;
}

/*OPEN時の動き*/

#nav-input:checked~nav.menu_wrapper {
    /*チェック入ってるとき ~ メニューが*/
    display: block;
    animation: 0.5s fadeIn1;
}

@keyframes fadeIn1 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

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

#menu {
    text-align: left;
    display: block;
    width: 100%;
    font-weight: bold;
}

#menu li {
    width: 100%;
    height: auto;
}

#menu li:last-child {
    margin-bottom: 50px;
}


#menu li a {
    display: block;
    border-bottom: 1px solid var(--mainColor);
    padding-left: 2em;
    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%;
}

#menu li.sp_tel a {
    background-color: var(--subColor);
    color: var(--mainColor);
    border-bottom: none;
}

.sp_tel img {
    width: 1.3em;
    margin-right: 5px;
}

.sp_menubtn_wrapper {
    /* width: 120px; */
    height: 60px;
}

.sp_web {
    text-align: center;
    line-height: 1.8;
}

.sp_web a {
    background-color: var(--mainColor);
    color: #fff;
    display: block;
    width: 60px;
    height: 60px;
    padding: 10px 1%;
    box-sizing: border-box;
    font-size: 1.2rem;
    font-weight: bold;
    position: sticky;
    right: 60px;
    /* top: 0; */
}

.sp_web img {
    width: 23px;
    /* vertical-align: -5px;
    margin-right: 5px; */
}

#menu_wrapper.fixed-header #menu ul {
    padding: 0;
}

#menu_wrapper.fixed-header #menu ul li a {
    font-size: 1.6rem;
    letter-spacing: 0em;
}

#menu li:first-child a {
    border-top: 1px solid var(--mainColor);
}


.Toggle {
    width: 60px;
    height: 60px;
    cursor: pointer;
    z-index: 150;
    /* position: fixed; */
    /* top: 0; */
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Toggle .menubtn_inner {
    position: relative;
    width: 50px;
    height: 50px;
    text-align: center;
}

.Toggle .menubtn_inner::after {
    content: 'MENU';
    display: block;
    position: absolute;
    width: 100%;
    bottom: 3px;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    font-size: 1.1rem;
    font-weight: bold;
    color: var(--mainColor);
}

.Toggle .menubtn_line,
.Toggle .menubtn_line:before,
.Toggle .menubtn_line:after {
    content: '';
    display: block;
    height: 2px;
    width: 30px;
    background: var(--mainColor);
    transition: 0.3s;
    position: absolute;
}

.Toggle .menubtn_line {
    top: 19px;
    left: 10px;
}

/* 三本線の一番上の棒の位置調整 */
.Toggle .menubtn_line:before {
    bottom: 8px;
}

/* 三本線の一番下の棒の位置調整 */
.Toggle .menubtn_line:after {
    top: 8px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#nav-input:checked~.Toggle .menubtn_line {
    background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#nav-input:checked~.Toggle .menubtn_line::before {
    bottom: 0;
    transform: rotate(35deg);
}

#nav-input:checked~.Toggle .menubtn_line::after {
    top: 0;
    transform: rotate(-35deg);
}

#nav-input:checked~.Toggle .menubtn_inner::after {
    content: 'CLOSE';
}



/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓PC版メニュー↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */

@media screen and (min-width: 1024px) {
    html {
        scroll-padding-top: 130px;
    }

    .sp {
        display: none;
    }

    .sp_menubtn_wrapper,
    .sp_web,
    .sp_tel {
        display: none;
    }

    header {
        font-size: 1.25rem;
        height: 121px;
        padding: 0;
        border-top: none;
        border-bottom: 1px solid rgba(200, 200, 200, 0.2);
        box-sizing: content-box;
    }

    .logo_dr_golf {
        height: 50px;
        padding-left: 20px;
    }

    .logo_dr_golf img {
        max-height: 50px;
    }

    .dr_golf_group {
        width: 100%;
        max-width: 200px;
    }

    #toggle_group:checked~#dropDown {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
        height: auto;
        padding: 5% 5% 80px;
        top: 50px;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    .dr_golf_group .toggle_group_inner {
        height: 50px;
        font-size: 0.9em;
    }

    #toggle_group_text .toggle_group_line {
        width: 30px;
        height: 30px;
        margin-left: 10px;
    }

    #dropDown li a {
        font-size: 1em;
    }

    .language {
        height: 50px;
    }

    .language select {
        font-size: 1.5rem;
        padding-inline: 1em;
    }

    header .logo {
        max-width: 260px;
        flex: auto;
        margin-right: auto;
        padding-left: 20px;
    }

    nav.menu_wrapper {
        flex: 1;
        display: block;
        position: initial;
        height: auto;
        padding-bottom: 0;
        overflow: visible;
    }


    #menu {
        max-width: 1000px;
        display: flex;
        justify-content: center;
        align-items: center;
        box-sizing: border-box;
        margin: 0 auto;
    }

    #menu li {
        text-align: center;
        /* width: 12.5%; */
        line-height: 1.4;
        height: 68px;
    }


    #menu li a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 100%;
        flex-wrap: wrap;
        padding: 0;
        border: none;
        position: relative;
    }

    #menu li:first-child a {
        border: none;
    }


    #menu li a:hover {
        color: var(--mainColor);
    }

    #menu li a::after {
        position: absolute;
        right: 0;
        left: 0;
        bottom: 0;
        margin: 0 auto;
        content: '';
        width: 50%;
        height: 3px;
        background: var(--mainColor);
        transform: scale(0, 1);
        transform-origin: left top;
        transition: transform 0.3s;
    }

    #menu li a:hover::after {
        transform: scale(1, 1);
    }

    #menu li a.current {
        color: var(--mainColor);
    }

    #menu li a.current::after {
        transform: scale(1, 1);
    }


    header .yoyaku {
        display: flex;
        font-weight: bold;
        box-sizing: border-box;
        width: 200px;
        font-size: 1.4rem;
        line-height: 1.2;
    }


    header .yoyaku .tel {
        height: 69px;
        width: 50%;
        text-align: center;
    }

    header .yoyaku .tel a {
        display: block;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        position: relative;
        color: var(--mainColor);
        background-color: var(--subColor) ;
    }

    header .yoyaku .tel a p {
        position: absolute;
        width: 100%;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        margin-top: -3px;
    }

    header .yoyaku .tel p::after {
        content: '(\53D7\4ED8 8:00~16:00)';
        display: block;
        position: absolute;
        bottom: -1em;
        left: 50%;
        transform: translateX(-50%);
        font-size: 0.8em;
        white-space: nowrap;
    }

    header .yoyaku .tel img {
        padding-bottom: 5px;
        width: 1.2em;
    }

    header .yoyaku .header_reservation {
        height: 69px;
        width: 50%;
        text-align: center;
    }

    header .yoyaku .header_reservation a {
        display: block;
        width: 100%;
        height: 100%;
        color: #fff;
        background-color: var(--mainColor);
        position: relative;
        box-sizing: border-box;
    }

    header .yoyaku .header_reservation a p {
        position: absolute;
        width: 100%;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        margin-top: -3px;
    }

    header .yoyaku .header_reservation img {
        padding-bottom: 5px;
        width: 1.6em;
    }

    .Toggle {
        display: none;
    }
}

@media screen and (min-width: 1280px) {
    header {
        font-size: 1.5rem;
    }


    header .logo {
        max-width: 300px;
    }

    header .yoyaku {
        width: 260px;
        font-size: 1.6rem;
    }


}




/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓フッター ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/

footer {
    background-color: var(--mainColor);
    font-size: 1.4rem;
    width: 100%;
    position: sticky;
    top: 100vh;
}

.footer_group {
    background-color: #F3F3F5;
    width: 100%;
    padding: 5% 3% 7%;
    box-sizing: border-box;
    border-top: 3px solid var(--mainColor);
}


.title1_3 {
    font-weight: bold;
    font-size: 2.6rem;
}

.title1_3 span {
    font-size: 0.4em;
    color: #666;
    padding-left: 1em;
}

.group_list li {
    padding-left: 1em;
    position: relative;
    margin-top: 10px;
}

.group_list a {
    color: #333;
    text-decoration: none;
    font-weight: bold;
}

.group_list a:hover {
    color: var(--mainColor);
}

.group_list li::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: inline-block;
    width: 0.5em;
    height: 2px;
    background-color: #333;
}

.footer_wrapper {
    color: #fff;
    padding: 5% 3%;
    box-sizing: border-box;
}

.footer_wrapper a {
    color: #fff;
    opacity: 1;
}

.footer_wrapper a::after {
    background-color: #fff;
}

.footer_right {
    margin-top: 20px;
}

.footer_nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.footer_nav li {
    padding-left: 1em;
    position: relative;
    margin-top: 10px;
    font-weight: bold;
    width: 48%;
}

.footer_nav li::before {
    content: '';
    position: absolute;
    top: 0.7em;
    left: 0;
    display: inline-block;
    width: 0.5em;
    height: 2px;
    background-color: #fff;
    line-height: 1.4;
}

.gaibu {
    padding-top: 10px;
    margin-top: 20px;
    border-top: 1px solid rgba(200, 200, 200, 0.5);
}

.copyright {
    background-color: var(--subColor);
    text-align: center;
    padding: 5px;
    font-size: 1.3rem;
    font-weight: bold;
}


@media screen and (min-width: 1024px) {

    .footer_group {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .title1_3 {
        font-size: 3rem;
        width: 15%;
        max-width: 230px;
    }

    .title1_3 span {
        padding: 0;
        display: block;
    }

    .group_list {
        display: flex;
        flex-wrap: wrap;
        width: 75%;
    }

    .group_list li {
        width: 48%;
    }

    .footer_wrapper {
        display: flex;
        justify-content: space-between;
    }

    .footer_left {
        width: 25%;
    }

    .footer_right {
        width: 75%;
        margin-top: 0;
        display: flex;
    }

    .footer_right>ul.footer_nav {
        width: 60%;
    }

    .gaibu {
        border-top: none;
        border-left: 1px solid rgba(200, 200, 200, 0.5);
        width: 40%;
        margin: 0;
        padding: 0 0 0 20px;
        box-sizing: border-box;
    }

    .gaibu .footer_nav li {
        width: 100%;
    }
}

@media screen and (min-width: 1280px) {
    .group_list li {
        width: 32%;
    }
}


/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓トップページ ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/


/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓オープニングシャッター↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */
.loader {
    position: fixed;
    width: 100%;
    height: 100vh;
    background-color: #fff;
    z-index: 500;
    top: 0;
    left: 0;
    padding: 0 2%;
    box-sizing: border-box;
    text-align: center;
}

.loader::before {
    content: '';
    position: absolute;
    /* top: 0; */
    left: 0;
    bottom: 0;
    margin: auto;
    background-color: var(--mainColor);
    width: 0;
    height: 5px;
    z-index: 1;
}

.loader {
    -webkit-animation: byeShutter 2.6s forwards;
    animation: byeShutter 2.6s forwards;
}

.loader::before {
    -webkit-animation: shutterOpen 2.6s forwards;
    animation: shutterOpen 2.6s forwards;
}

.mainContainer {
    -webkit-animation: contentScale 2.7s forwards;
    animation: contentScale 2.7s forwards;
    background-color: #fff;
}

@keyframes byeShutter {
    90% {
        opacity: 1;
    }

    100% {
        opacity: 1;
        display: none;
        z-index: -1;
    }
}

@keyframes shutterOpen {
    0% {
        width: 0;
        height: 5px;
    }

    78% {
        width: 100%;
        height: 5px;
    }

    90% {
        width: 100%;
        height: 100%;
    }

    100% {
        width: 100%;
        height: 100%;
        display: none;
    }
}

@keyframes contentScale {
    88% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.loader_text {
    line-height: 2.5;
    font-size: 1.8rem;
    font-weight: bold;
    text-align: center;
    color: var(--mainColor);
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 98%;
}

.loader_text img {
    max-width: 400px;
    width: 90%;
    height: auto;
}

/* ↑↑↑↑↑↑↑↑↑↑↑↑オープニングシャッター↑↑↑↑↑↑↑↑↑↑↑ */


/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓トップ スクロール↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ */

/* 
.scrolldown1 {
    position: absolute;
    left: 50%;
    bottom: 10px;
    height: 50px;
    z-index: 1;
}

.scrolldown1 span {
    position: absolute;
    left: -2em;
    top: -1.5em;
    color: #eee;
    font-size: 1.1em;
    letter-spacing: 0.05em;
    font-weight: bold;
}

.scrolldown1::after {
    content: "";
    position: absolute;
    top: 0;
    width: 1px;
    height: 30px;
    background: #eee;
    animation: pathmove 1.7s ease-in-out infinite;
    opacity: 0;
}

@keyframes pathmove {
    0% {
        height: 0;
        top: 0;
        opacity: 0;
    }

    30% {
        height: 30px;
        opacity: 1;
    }

    100% {
        height: 0;
        top: 50px;
        opacity: 0;
    }
} */

/* ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑トップ スクロール↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ */

#home .title1 {
    padding-top: 50px;
}
#home .title1.pdt0 {
    padding-top: 0;
}

.main_slide {
    width: 100%;
    background-color: var(--bgColor);
}

/* 
.main_slide .slide {
    width: 100%;
    height: calc(100vh - 60px);
    position: relative;
}
.main_slide .slide img{
  object-fit: cover;
  width: 100%;
  height: 100%
}

.main_slide .slide p.center {
    font-size: 2rem;
    font-weight: bold;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    z-index: 2;
}

.main_slide .slide p.top {
    font-size: 2rem;
    font-weight: bold;
    color: #fff;
    position: absolute;
    top: 20px;
    left: 10px;
    z-index: 2;
}

.main_slide .slide::before {
    content: '';
    display: block;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 10, 20, 0.1);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
} */

.splide {
    padding-top: 50px;
    margin-bottom: 1em;
}

.splide__slide {
    box-shadow: 2px 2px 0 0 #e9e9e9;
    font-size: 0.9em;
    background-color: #fff;
    padding: 1em;
}

.splide__slide .title2 {
    font-size: 1.5rem;
    margin-top: 10px;
}

.splide__pagination {
    bottom: -2em;
}

.topNews {
    margin-top: 20px;
}

.topNews .post_wrapper {
    border-bottom: 1px dotted #cfcfcf;
    padding: 1em 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.topNews .post_none{
    padding: 1em ;
    border-bottom: 1px dotted #cfcfcf;
}

.topNews .post {
    width: 100%;
}

.topNews .post_c {
    width: 100%;
    font-weight: bold;
}

.topNews .post_c img {
    max-height: 400px;
}

.topNews #youtube_iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

.title1_2 {
    font-weight: bold;
    font-size: 3.8rem;
    line-height: 100%;
    text-align: center;
    color: #fff;
    z-index: 2;
}

.title1_2 span {
    display: block;
    font-size: 0.4em;
    margin-left: 1em;
}

.title1_2_2 {
    color: #2d2d2e;
}
.title1_2_2 span{
    color: #666;
}
.about_bg {
    min-height: 500px;
    background-image: url(../images/zenkei.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}


.about_bg::before {
    content: '';
    display: block;
    width: 100%;
    min-height: 500px;
    background-color: rgba(0, 10, 20, 0.4);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.about_bg2 {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: var(--mainColor);
}

.about_intro {
    font-weight: bold;
    padding-block: 70px;
}

.about_box {
    color: #fff;
    background-image: url(../images/about_01.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    margin-right: auto;
    padding-block: 2em;
}

.about_box:nth-of-type(2) {
    background-image: url(../images/about_02.jpg);
    margin-left: auto;
    margin-right: 0;
    text-align: right;
}

.about_box:nth-of-type(3) {
    background-image: url(../images/about_03.jpg);
}

.about_text {
    background-color: rgba(0, 0, 0, .5);
    padding: 1em;
}

.about_title {
    font-size: 1.8rem;
    font-weight: bold;
}

.about_title span {
    display: block;
    font-size: 5rem;
    color: var(--accentColor);
    /* color: var(--subColor); */
}


.info_bg {
    margin-top: 50px;
    padding: 50px 3%;
    background-image: url(../images/info_bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}


.info_wrapper {
margin-block: 70px;
}

.info_box {
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr;
    margin-top: 30px;
    word-break: break-all;
}

.info_box .title3 {
    text-align: center;
}

.info_content {
    background-color: #fff;
    box-sizing: border-box;
    padding: 1.5em 5%;
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
    row-gap: 15px;
    box-shadow: 2px 2px 0 0 rgba(0, 0, 0, .2);
}
.info_content .title2::before,
.info_content_flex .title2::before {
    background-color: var(--subColor);
}

.info_row_content4 {
    grid-row: span 4;
}

.info01,
.info02 {
    /* border-top: 2px solid #dbdbdb; */
    display: grid;
    padding: 10px 3% 50px;
    position: relative;
    z-index: 0;
}
.info02 {
    font-size: 0.9em;
    line-height: 1.4;
}


.info01::after,
.info02::after {
    content: '';
    display: block;
    background-color: #E0E0E0;
    position: absolute;
    left:0;
    height: 100%;
    z-index: -1;
    transition:0.6s;
}
.info02::after {
    background-color: var(--mainColor);
}

.inview1 .info01::after,
.inview1 .info02::after {
    width:0;
}

.inview1.show .info01::after,
.inview1.show .info02::after{
   width:100%;
}

.info_title {
    margin-top: 50px;
}

.al_self_end {
    align-self: end;
}
.al_self_center {
    align-self: center;
}

.info_content_flex {
    background-color: #fff;
    box-sizing: border-box;
    padding: 1.5em 5%;
    display: flex;
    flex-direction: column;
    box-shadow: 2px 2px 0 0 rgba(0, 0, 0, .2);
}

.info_text {
    flex-grow: 1;
    padding-block: 1em;
}

.icon_wrapper {
    text-align: center;
    padding: 2% 2% 5%;
}

.info_icon {
    width: 30%;
    text-align: center;
}

.info_img {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.bn_wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

.club_info dt {
    color: var(--mainColor);
    font-weight: bold;
    padding: 1em 0 0.5em;
}

.club_info dd {
    border-bottom: 1px dotted #cfcfcf;
    padding: 0.5em 0;
}

.top_reserve a::after {
    content: none;
}

.top_tel,
.top_reservation {
    font-size: 1.8rem;
    margin-top: 20px;
    text-align: center;
}

.top_tel p,
.top_reservation p {
    text-align: left;
    display: inline-block;
    position: relative;
    padding-left: 2em;
}

.top_tel p {
    margin-left: -1em;
}

.top_reservation p {
    margin-left: 1.5em;
}

.top_tel a {
    background-color: var(--subColor);
    color: var(--mainColor);
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding: 0.5em 1em;
    line-height: 1.4;
    width: 100%;
}

.top_tel p::before {
    content: '';
    display: block;
    position: absolute;
    background-image: url(../images/tel.svg);
    width: 2em;
    height: 2em;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0;
    margin-top: 0.5em;
    margin-left: -1em;
}

.top_reservation a {
    background-color: var(--mainColor);
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding: 0.5em 1em;
    line-height: 1.4;
    width: 100%;
}

.top_reservation p::before {
    content: '';
    display: block;
    position: absolute;
    background-image: url(../images/online.svg);
    width: 2em;
    height: 2em;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0;
    margin-top: 0.5em;
    margin-left: -1em;
}

.top_gmap {
    margin-top: 100px;
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 40%;
}

.top_gmap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media screen and (min-width: 800px) {

    .info_box {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .info_box5 {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .about_box {
        padding-block: 2em;
        box-shadow: 5px 5px var(--subColor);
        width: 80%;
    }

    .about_text {
        display: inline-block;
        margin-right: auto;
        min-width: 50%;
    }

    .about_box:nth-of-type(2) {
        margin-top: 50px;
        text-align: right;
        box-shadow: -5px 5px var(--subColor);
    }

    .about_box:nth-of-type(2) .about_text {
        text-align: left;
    }

    .about_box:nth-of-type(3) {
        margin-top: 50px;
    }

}

@media screen and (min-width: 1024px) {

    #home .title1 {
        padding-top: 70px;
    }
    /* .main_slide .slide {
        height: calc(100vh - 80px);
    } */
    .main_slide {
        margin-top: -121px;
    }

    .loader_text {
        font-size: 2rem;
    }

    .topNews {
        width: 75%;
        margin-left: auto;
    }

    .topNews .post {
        max-width: 100px;
        width: 20%;
    }

    .topNews .post_c {
        width: 80%;
    }

    .title1_2 {
        font-size: 5.4rem;
    }
    .title1_2_2 {
        font-size: 5rem;
    }

    .about_bg {
        background-attachment: fixed;
    }

    .about_intro {
        text-align: center;
        font-size: 1.7rem;
    }

    .about_box {
        padding-block: 3em;
        width: 80%;
    }

    .about_title {
        font-size: 2rem;
    }

    .about_title span {
        font-size: 5.4rem;
    }

    .info_bg {
        background-attachment: fixed;
    }

    .info_content .title2,
    .info_content_flex .title2 {
        font-size: 1.8rem;
    }

    .info01 {
        display: grid;
        grid-template-columns: 1fr auto;
        column-gap: 20px;
    }

    .info02 {
        display: grid;
        grid-template-columns: auto 1fr;
        column-gap: 20px;
    }

    .info_title {
        max-width: 200px;
    }

    .info01 .info_title {
        order: 1;
    }

    .bn_wrapper {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 10px;
    }

    .club_info {
        display: flex;
        flex-wrap: wrap;
    }

    .club_info dt {
        width: 20%;
        border-bottom: 1px #DBDBDB solid;
        padding: 1em 0;
    }

    .club_info dd {
        width: 80%;
        padding: 1em 0;
    }

    .top_reserve {
        display: flex;
        justify-content: space-between;
    }

    .top_tel,
    .top_reservation {
        width: 49%;
        font-size: 2rem;
    }
}

@media screen and (min-width: 1250px) {

    .info_box4 {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    .info_box5 {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }

    .about_box {
        width: 70%;
        font-size: 1.1em;
    }

    .about_text {
        padding: 3em;
    }

    .about_title {
        font-size: 2.2rem;
    }

    .about_title span {
        font-size: 5.6rem;
    }

    .info_bg {
        padding: 50px 5%;
    }

    .info01 {
        padding-inline: 5%;
    }

    .info02 {
        padding-inline: 5%;
    }

    .info_title {
        max-width: 350px;
    }

}


/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓下層ページ共通 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/



.top_img_wrapper {
    background-color: var(--mainColor);
    position: relative;
    margin-bottom: 70px;
    padding-bottom: 1em;
}

.top_img {
    width: 100%;
    height: 40vh;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.top_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pdb0 main {
    padding-bottom: 0;
}

.top_img_wrapper .sub_menu {
    margin-top: 20px;
    padding-bottom: 10px;
    text-align: center;
}

.sub_menu_list {
    display: inline-block;
    text-align: left;
    margin: 20px 10px;
}

.sub_menu_list li {
    padding-left: 25px;
    position: relative;
    margin-top: 15px;
}

.sub_menu_list li::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 20px;
    height: 20px;
    margin: auto;
    border-radius: 20px;
    background-color: #f2f2f2;
}

.sub_menu_list li::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 6px;
    width: 8px;
    height: 8px;
    margin: auto;
    border-top: 2px solid var(--mainColor);
    border-right: 2px solid var(--mainColor);
    transform: translateY(-2px) rotate(135deg);
    box-sizing: border-box;
}

.sub_menu_list a {
    color: #666;
    text-decoration: none;
    font-weight: bold;
}

/*  */
.titleSub {
    color: #fff;
}

.sub_menu_list a {
    color: #f2f2f2;
}

.sub_menu_list a::after {
    background-color: #fff;
}

/*  */

@media screen and (min-width: 1024px) {

    .top_img_wrapper {
        min-height: 320px;
        margin-bottom: 100px;
        background-color: var(--mainColor);
    }

    .top_img_wrapper .sub_menu {
        text-align: left;
        z-index: 1;
        padding: 3% 1% 2% 4%;
        position: sticky;
        top: 0;
        bottom: 0;
        left: 0;
        margin-block: auto;
    }

    .top_img {
        position: absolute;
        bottom: -25px;
        right: 0;
        width: 75%;
        height: 320px;
    }

    .top_img_short {
        width: 63%;
    }


    .titleSub {
        text-align: left;
        color: #fff;
    }

    .sub_menu_list li {
        margin-top: 5px;
    }

    .sub_menu_none {
        margin-top: 50px;
    }

    .sub_menu_list a {
        color: #f2f2f2;
    }

}


/*↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓  予約  ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/



/* 3種別用登録・予約エリアここから */
.btnwrapper {
    margin-bottom: 20px;
}

.btn_rsv a::after {
    content: none;
}

.btnMember {
    margin-top: 20px;
    text-align: center;
    background-color: #fff;
    border: 1px solid var(--mainColor);
    color: var(--mainColor);
}

.btnTomo {
    margin-top: 20px;
    text-align: center;
    background-color: #fff;
    border: 2px solid #195900;
    color: #195900;
}

.btnVisitor {
    margin-top: 20px;
    text-align: center;
    background-color: #fff;
    border: 1px solid var(--mainColor);
    color: var(--mainColor);
}

.btn_title {
    font-size: 1.8rem;
    line-height: 1.2;
    font-weight: bold;
    padding-block: 1em;
    position: relative;
}

.btn_title::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -20px;
    left: 0;
    width: 0px;
    height: 0px;
    margin: auto;
    border-style: solid;
    border-color: var(--accentColor) transparent transparent transparent;
    border-width: 20px 20px 0 20px;
}

.btnMember .btn_title {
    background: var(--accentColor);
}

.btnTomo .btn_title {
    background: #c5e6b8;
}

.btnVisitor .btn_title {
    background: #c5d7eb;
}

.btnVisitor .btn_title::after {
    border-color: #c5d7eb transparent transparent transparent;
}

.btn_rsv {
    margin: 40px 10px 20px;
}
.btn_rsv.mgt0 {
    margin-top: 0;
}

.btn_rsv.touroku {
    margin-top: 0;
    margin-bottom: 30px;
}

.btn_rsv a {
    display: block;
    width: 100%;
    padding: 0.8em;
    font-size: 1.8rem;
    border-radius: 50px;
    box-sizing: border-box;
    font-weight: bold;
    text-decoration: none;
    background: #f2f2f2;
}

.btn_rsv a:hover {
    opacity: 1;
    background: #fff;
}

.btnMember .btn_rsv a {
    color: var(--mainColor);
    border: 2px solid #7c6531;
}

.btnTomo .btn_rsv a {
    color: #195900;
    border: 1px solid #195900;
}

.btnVisitor .btn_rsv a {
    color: var(--mainColor);
    border: 2px solid var(--mainColor);
}

.touroku_text {
    margin-bottom: 10px;
    color: #333;
}

.touroku_textV a {
    color: var(--mainColor);
}


/* 3種別用登録・予約エリアここまで */

#mobile {
    padding-bottom: 20px;
    background-color: #f2f2f2;
    border: 1px solid #878787;
}

.mobile_title {
    background-color: #878787;
    padding: 10px;
    color: #fff;
    font-weight: bold;
    font-size: 1.2em;
    border-bottom: none;
}

#mobile img {
    max-width: 100px;
}

#mobile p {
    padding: 2%;
}

ol.step {
    counter-reset: item;
    list-style-type: none;
    line-height: 1.7;
    padding: 0;
}

ol.step li {
    text-indent: -2.4em;
    padding-left: 2.4em;
    border-bottom: 1px dotted var(--mainColor);
    padding-top: 20px;
}

ol.step li:first-of-type {
    padding-top: 0;
}

ol.step li::before {
    counter-increment: item;
    content: counter(item)'.';
    /* 以下装飾 */
    padding-right: .7em;
    font-size: 1.5em;
    font-weight: bold;
    color: var(--mainColor);
}

.present {
    color: #444;
    margin: 50px 0 0;
    font-weight: bold;
    font-size: 1.8rem;
    border-bottom: none;
}

.gift {
    fill: var(--mainColor);
    width: 2em;
    height: 2em;
    vertical-align: -5px;
}

.point_exmple {
    margin: 20px 0;
    padding: 3%;
    font-size: 0.9em;
    background-color: #f2f2f2;
}

.point_exmple ul li {
    padding-bottom: 0.5em;
}

.point_exmple .exmple {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}


table.pointProducts {
    table-layout: fixed;
    width: 100%;
    font-size: 0.9em;
    border: #f2f2f2 1px solid;
    border-collapse: collapse;
    background-color: #fff;
}

table.pointProducts caption {
    padding-bottom: 10px;
    font-size: 1.2em;
    font-weight: bold;
}

table.pointProducts th {
    height: auto;
    background-color: rgba(211, 211, 211, 0.5);
    border: #999 1px solid;
    padding-bottom: 8px;
    padding-top: 8px;
    line-height: 2;
    text-align: center;
}

table.pointProducts td {
    height: auto;
    border: #999 1px solid;
    padding-bottom: 8px;
    padding-top: 8px;
    line-height: 1.2;
    text-align: center;
    padding-right: 1%;
    padding-left: 1%;
    box-sizing: border-box;
}

table.pointProducts td.point {
    text-align: right;
    padding-right: 5%;
}

table.pointProducts td.productName {
    text-align: left;
    padding-left: 3%;
}

#point {
    margin: 20px 0;
    padding: 15px;
    background-color: #f2f2f2;
    border: #CCCCCC 1px solid;
}

#point ul li {
    padding-bottom: 10px;
}

.arrow:before {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    margin: 0 0.5em 0 0;
    border: 5px solid transparent;
    border-right: 0 solid transparent;
    border-left: 8px solid #ff0000;
}


#loginPopup {
    position: fixed;
    display: block;
    content: '';
    background: rgba(0, 0, 0, .5);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
}

.loginPopup_box {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    border: 2px solid var(--mainColor);
    padding: 30px;
    z-index: 1000;
    box-shadow: 0 0 5px rgba(0, 0, 0, .3);
    width: 90%;
    text-align: center;
    font-weight: bold;
}

.loginPopup_box>div {
    margin-top: 1em;
}

#loginPopup input {
    border-radius: .25rem;
    border: 1px solid #707070;
    outline: none;
    padding: 0.375em 0.75em;
    text-align: left;
}

#loginPopup input:focus {
    border-color: var(--mainColor);
}

.btn_login {
    background-color: var(--mainColor);
    color: #fff;
    padding: 0.375em 1.3em;
    font-size: 1em;
}

.btn_login:hover {
    opacity: .8;
}

.btn_cancel {
    background-color: #666;
    color: #fff;
    padding: 0.375em 0.75em;
    font-size: 1em;
}

.btn_cancel:hover {
    opacity: .8;
}

@media screen and (min-width: 1024px) {
    .btnwrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .btnwrapper .btnMember,
    .btnwrapper .btnTomo,
    .btnwrapper .btnVisitor {
        display: flex;
        flex-direction: column;
    }

    .btnwrapper .btn_title {
        flex-grow: 1;
    }

    /* .btnVisitor .btn_title {
    padding-top: 1.8em;
} */
    .btnMember {
        width: 48%;
    }

    .btnTomo {
        width: 31%;
    }

    .btnVisitor {
        width: 48%;
    }

    .btnwrapper .syubetsu1 {
        flex-direction: row;
        width: 100%;
        flex-wrap: wrap;
        justify-content: center;
    }

    /* 1種別しかない場合 */
    .btnwrapper .syubetsu1 .btn_title {
        width: 100%;
        padding-block: 1.8em;
    }

    .syubetsu1 .btn_rsv {
        width: 48%;
        margin: 40px 1% 30px;
    }

    .btn_rsv.touroku {
        margin-top: 0;
    }
    /* 1種別しかない場合ここまで */

    .loginPopup_box {
        width: 60%;
    }
}


/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 施設案内 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/
.gallery_box:not(:first-of-type) {
    margin-top: 50px;
}

.gallery_img {
    margin: 2%;
    box-shadow: 0 0 5px rgba(0, 0, 0, .1);
    position: relative;
    overflow: hidden;
}

.gallery_img span {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 0.2em 0.5em;
    color: #fff;
    background-color: #2d2d2e;
    z-index: 1;
}

.gallery_img a img:hover {
    transform: scale(1.1);
    transition: 1s;
}

.gallery_text {
    background-color: #fff;
    padding: 3em 2em 2em;
    box-sizing: border-box;
    /* margin-left: 2em; */
    margin-top: -2em;
}

a.lb-close::after {
    content: none;
}

@media screen and (min-width: 1024px) {
    .gallery_wrapper {
        max-width: 1500px;
        width: 100%;
        margin-inline: auto;
    }

    .gallery_box:not(:first-of-type) {
        margin-top: 120px;
    }

    .gallery_box {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        position: relative;
        z-index: 1;
        gap: 10px;
    }

    .gallery_box::after {
        content: '';
        background-color: #fff;
        width: 120%;
        height: 100%;
        position: absolute;
        bottom: -2em;
        left: 2em;
    }

    .gallery_box:last-of-type {
        margin-bottom: 2em;
    }

    .gallery_img {
        width: 48%;
        margin: 0;
        /* box-shadow: 0 3em 0 -1em var(--mainColor); */
        z-index: 1;
    }

    .gallery_img3 {
        width: 32%;
    }

    .gallery_text {
        padding: 3em 2em 3em 5em;
        width: 50%;
        margin: 0 0 -2em -2em;
        z-index: 1;
        background-color: initial;
    }

    .gallery_text2 {
        width: 100%;
        padding-left: 6em;
    }
}

/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ アクセス ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/

.gmap iframe {
    width: 100%;
    aspect-ratio: 16/9;
}

/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 最新情報 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/

.news_box {
    background-color: #f2f2f2;
    margin-top: 50px;
    padding: 1.5em 1em;
}

.news_content {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

@media screen and (min-width: 800px) {
    .news_wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .news_box {
        width: 100%;
        padding: 2em;
    }

    .news_content {
        margin-top: 15px;
    }

    .news_box_half {
        width: 49%;
    }

    .news_inner30 {
        width: 32%;
    }

    .news_inner40 {
        width: 40%;
    }

    .news_inner50 {
        width: 49%;
    }

    .news_inner60 {
        width: 58%;
    }

    .news_inner70 {
        width: 67%;
    }

    .news_inner100 {
        width: 100%;
    }

    .news_innerGrow {
        flex: 1;
        padding-left: 1em;
    }
}

@media screen and (min-width: 1024px) {
    .news_content {
        font-size: 1.7rem;
    }
}

/* ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 料金 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓*/


.table_cal {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background-color: #fff;
    border: 1px solid #ccc;
    font-size: 1.1rem;
    word-wrap: break-word;
    line-height: 1.2;
}

.table_cal caption {
    font-weight: bold;
    caption-side: top;
    text-align: right;
    font-size: 0.9em;
    padding-bottom: 10px;
}

.table_cal th {
    background-color: #F3F3F3;
    color: #595959;
    padding: 1%;
    border: 1px solid #ccc;
    text-align: center;
    vertical-align: middle;
}

.table_cal td {
    border-right: 1px solid #ccc;
    padding: 0.5em 0.2em;
    text-align: center;
    vertical-align: middle;
}


.table_cal .day td {
    padding: 0.2em;
    font-weight: bold;
    background-color: #f2f2f2;
    color: #595959;
    border-bottom: 1px dotted #ccc;
    border-top: 1px solid #ccc;
}

.table_cal .fee_content td {
    font-weight: bold;
    vertical-align: bottom;
    height: 4em;
}

.table_cal .fee_content td p.lunch::before {
    content: '';
    display: block;
    background-image: url(../images/ic_lunch.gif);
    width: 15px;
    height: 15px;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: auto;
    margin-left: auto;
}

.table_cal th:first-child,
.day td:first-child {
    background-color: #FAE7EF;
}

.table_cal th:last-child,
.day td:last-child {
    background-color: #DCEEFC;
}

.table_cal td.sun {
    background-color: #FAE7EF;
}

.table_cal td.close {
    background-color: #e0e0e0;
}

.teble_box .table01 p.lunch::before {
    content: '';
    background-image: url(../images/ic_lunch.gif);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 15px;
    height: 15px;
    margin-right: 3px;
    margin-top: -5px;
}

.teble_box>.title3 {
    margin-top: 20px;
}

.teble_box>.table_cal {
    margin-top: 20px;
}

.table_cal .td_red {
    background-color: var(--mainColor);
    color: #fff;
    padding: 0.2em;
    font-size: 0.9em;
    margin-block: 5px;
}

.table_cal .fee {
    margin-top: 0.5em;
}

.table_cal .text {
    color: #555;
    font-size: 0.9em;
    margin-block: 5px;
}


/* ///////////// カレンダータブ切り替え設定 ///////////////// */
.fee_wrapper {
    display: flex;
    flex-wrap: wrap;
    margin-top: 50px;
}

.fee_wrapper::after {
    content: '';
    width: 100%;
    height: 3px;
    order: -1;
    display: block;
    background: var(--mainColor);
}

.fee_wrapper .tabLabel {
    /* タブ */
    margin-right: 2px;
    padding: 10px 5px;
    flex: 1;
    order: -1;
    color: #3d3d3d;
    background: var(--subColor);
    transition: .5s;
    cursor: pointer;
    font-weight: bold;
    font-size: 1.2rem;
}

.fee_wrapper .tabLabel:hover {
    color: #fff;
    background: var(--mainColor);
}

.fee_wrapper .tabLabel:nth-last-of-type(1) {
    margin-right: 0;
}

.fee_wrapper input {
    /* ラジオボタン非表示 */
    display: none;
}

.fee_wrapper .teble_box {
    /* カレンダー */
    width: 100%;
    height: 0;
    overflow: hidden;
    opacity: 0;
}

/*アクティブ設定*/
.fee_wrapper input:checked+.tabLabel {
    color: #fff;
    background: var(--mainColor);
}

.fee_wrapper input:checked+.tabLabel+.teble_box {
    padding: 0 10px 30px 10px;
    height: auto;
    overflow: auto;
    transition: .5s opacity;
    box-shadow: 0 0 5px rgba(0, 0, 0, .2);
    opacity: 1;
    background-color: #fff;
}

/* //////// カレンダータブ切り替え設定ここまで /////////////// */


@media screen and (min-width: 600px) {
    .fee_wrapper input:checked+.tabLabel+.teble_box {
        padding: 0 20px 20px;
    }

    .fee_wrapper .tabLabel {
        font-size: 1.5rem;
        padding: 10px;
    }

    .table_cal {
        font-size: 1.5rem;
    }

    .table_cal .fee::after {
        content: '\5186';
        font-size: 1.2rem;
    }
}

@media screen and (min-width: 1024px) {
    .fee_wrapper .tabLabel {
        font-size: 1.6rem;
    }

    .fee_wrapper input:checked+.tabLabel+.teble_box {
        padding: 0 40px 40px;
    }

    .table_cal {
        font-size: 1.7rem;
    }

    .table_cal .fee_content td p.lunch::before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        width: 20px;
        height: 20px;
        margin-right: 3px;
        margin-top: -5px;
    }

    .teble_box .table01 p.lunch::before {
        width: 20px;
        height: 20px;
    }

}


/* コース */
.tab_nav_wrapper {
    margin-top: 160px;
    position: sticky;
    left: 0;
    bottom: 0;
    background-color: #e0e0e2;
    padding: 1px 10px 15px;
    font-size: 0.9em;
}

.tab_nav_wrapper .title2 {
    font-size: 1.7rem;
}

.tab {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.tab li {
    width: 9%;
    text-align: center;
    box-sizing: border-box;
}

.tab li a {
    background-color: #fff;
    color: #696969;
    display: block;
    padding: 0.3em 0.1em;
}

.tab li a:hover {
    text-decoration: none;
    background-color: var(--mainColor);
    color: #fff;
}

@keyframes displayAnime {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media screen and (min-width: 1024px) {
    .tab_nav_wrapper {
        font-size: 1em;
    }

    .tab_nav {
        max-width: 1200px;
        margin-inline: auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding-left: 5%;
        padding-right: 5%;
    }


    .tab_nav>div {
        width: 49%;
    }
}


/* よくある質問 */
.faq_content {
    transition: .5s;
    margin-top: 20px;
}

.faq_q {
    cursor: pointer;
    font-weight: bold;
    padding: 1em 2em 1em 60px;
    background-color: #e8e8eb;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.faq_q:hover {
    opacity: .8;
}

.faq_q::before {
    content: "Q";
    background: #2d2d2e;
    color: #fff;
    display: inline-block;
    position: absolute;
    width: 40px;
    height: 40px;
    line-height: 40px;
    left: 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 50%;
    text-align: center;
}

.faq_q::-webkit-details-marker {
    display: none;
}

.faq_q .plus {
    position: relative;
    margin-left: 2em;
}

.faq_q .plus::before,
.faq_q .plus::after {
    position: absolute;
    content: "";
    display: block;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 15px;
    background: var(--mainColor);
    transition: 0.3s;
}

.faq_q .plus::before {
    transform: translate(-50%, -50%);
}

.faq_q .plus::after {
    transform: translate(-50%, -50%) rotate(-90deg);
}

.faq_content[open] .faq_q .plus::before {
    transform: translate(-50%, -50%) rotate(90deg);
}

.faq_a {
    padding: 1em 2em 1em 60px;
    position: relative;
    border: 1px solid #e8e8eb;
}

.faq_a::before {
    content: "A";
    background: var(--mainColor);
    color: #fff;
    display: inline-block;
    position: absolute;
    width: 40px;
    height: 40px;
    line-height: 40px;
    left: 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 50%;
    text-align: center;
}