@charset "utf-8";
@import url('../../../../../fonts.googleapis.com/css2@family=Noto+Sans+JP%253Awght@100%3B300%3B400%3B500%3B700%3B900&display=swap.css');
@import url('../../../../../fonts.googleapis.com/css2@family=Noto+Serif+JP%253Awght@300%3B400%3B500%3B600%3B700%3B900&display=swap.css');
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 4.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    outline: 0;
    font-size: 17px;
}
html {
    font-size: 62.5%;
}
body {
    min-width: 1280px;
    color: #231815;
    font-size: 1.2rem;
    line-height: 1.5;
    -webkit-text-size-adjust: none;
    background-color: #FFF;
    font-family: 'Noto Sans JP', sans-serif;
}
#container {
    text-align: left;
    overflow: hidden;
}

.serif {
    font-family: 'Noto Serif JP', serif;
}
a,
a:link {
    color: #231815;
    text-decoration: none;
}
a img {
    transition: 0.3s ease-in-out;
}
a:visited {
    color: #231815;
}
a:hover {
    color: #231815;
}
a:active {
    color: #231815;
}
a[href^="tel:"] {
    cursor: default;
    pointer-events: none;
}

.entry-content a { color: #308cba !important; }
.entry-content a:hover { opacity: .7; }
.entry-content a:visited { color: #308cba !important; }

@media all and (min-width: 897px) {
    .sp {
        display: none !important;
    }
}

@media all and (max-width: 896px) {
    body {
        min-width: inherit;
        font-size: 1.2rem;
    }
    body.fixed {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    a:hover,
    a:hover img {
        opacity: 1 !important;
    }
    .pc {
        display: none !important;
    }
    a[href^="tel:"] {
        cursor: pointer;
        pointer-events: auto;
    }
}


/*------------------------------------------------------------
        ヘッダー
------------------------------------------------------------*/
#gHeader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    transform: translateY(-125%);
    z-index: 1000;
    /*    height: 154px;*/
    transition: all ease 0.3s;
    /*
        background: url("img/common/h_bg.jpg") no-repeat center bottom #fff;
        background-size: cover;
    */
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
}
.nomainvisaul #gHeader {
    transform: translateY(0);
}
#gHeader.fixed {
    transform: translateY(0);
}
#gHeader .bgBox {
    background-color: white;
    box-shadow : 3.32px 3.32px 15px rgba(0, 0, 0, 0.75);
}
#gHeader .hInner {
    margin: 0 auto;
    max-width: 1049px;
    padding: 0 20px 0 33px;
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#gHeader .rBox {
    padding-top: 5px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
#gHeader .rBox a:hover {
    opacity: 0.7;
}
#gHeader .naviUl {
    display: flex;
    flex-wrap: wrap;
}
#gHeader .naviUl li {
    margin-left: 9px;
}
#gHeader .naviUl li:first-child {
    margin-left: 0;
}
#gHeader .naviUl a {
    font-size: 1.1rem;
    letter-spacing: 0.18em;
    font-style: italic;
    font-weight: bold;
}
#gHeader .link {
    margin-left: 10px;
    width: 183px;
}
#gHeader .link a {
    display: block;
    font-weight: bold;
    text-align: center;
    font-size: 1.2rem;
    color: white;
    padding: 6px 2px 6px;
    letter-spacing: 0.14em;
    background-color: #8C7300;
}
@media all and (max-width: 896px) {
    #gHeader {
        height: auto;
        padding: 0;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
        background: none #fff;
    }
    #gHeader .hInner {
        width: auto;
        height: 50px;
    }
    #gHeader .rBox {
        display: none;
    }
    #gHeader h1 {
        margin-top: -4px;
        box-sizing: border-box;
        width: 250px;
    }
    .menu {
        position: absolute;
        top: 9px;
        right: 18px;
        z-index: 1000;
        transition: all ease 0.5s;
    }
    .menu.on a {
        display: block;
        background: url("img/common/menu02.png") no-repeat center center;
        background-size: 100% auto;
        transition: none;
    }
    .menu.on a img {
        visibility: hidden;
    }
    .menuBox {
        display: none;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 900;
        height: 100%;
        overflow: hidden;
        overflow-y: auto;
        background-color: white;
        font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
    }
    .menuBox.on {
        display: block !important;
    }
    .menuBox .ulBox:after {
        width: 180vw;  
        height: 0;
        background-color: #231815;
        border-radius: 0 0 50% 50%;
        position: absolute;
        top: 0;
        left: 50%;  
        content: ""; 
        z-index: -1;
        transform: translateX(-50%);
    }
    .menuBox.on .ulBox:after {
        animation: bgShow .5s forwards;
    }
    .menuBox .naviUl {
        padding: 120px 10px 150px 45px;
        opacity: 0;
    }
    .menuBox.on .naviUl {
        animation: navishow .5s forwards;
        animation-delay: .5s;
    }
    .menuBox .naviUl li {
        margin-bottom: 16px;
    }
    .menuBox .naviUl li:nth-child(2) {
        margin: 0 0 35px 20px;
    }
    .menuBox .naviUl li:nth-child(3) {
        margin: 0 0 13px 40px;
    }
    .menuBox .naviUl li:nth-child(4) {
        margin: 0 0 23px 60px;
    }
    .menuBox .naviUl li:nth-child(5) {
        margin: 0 0 35px 80px;
    }
    .menuBox .naviUl li:nth-child(6) {
        margin: 0 0 0 95px;
    }
    .menuBox .naviUl li:nth-child(7) {
        margin: 0 0 0 110px;
        padding-top: 18px;
    }
    .menuBox .naviUl a {
        font-style: italic;
        color: white;
        font-size: 2.9rem;
        letter-spacing: 0.1em;
        transform: rotate(-15deg);
        display: inline-block;
    }
}
@keyframes bgShow {
    0% {
        height: 0;
    }
    100% {
        height: 82%;
        height: 650px;
    }
}
@keyframes navishow {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*------------------------------------------------------------
        フッター
------------------------------------------------------------*/
#gFooter {
    position: relative;
    z-index: 1;
    margin-top: 120px;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
    font-feature-settings: "palt";
    -moz-font-feature-settings: "palt";    
}
#gFooter .serif {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}
#gFooter .fInner {
    padding: 107px 0 15px;
    color: white;
    background: url("img/common/f_bg.jpg") no-repeat center center;
    background-size: cover;
}
#gFooter .mainBox {
    width: 1000px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#gFooter .fInner .lBox {
    width: 450px;
}
#gFooter .fInner .lBox p {
    font-size: 1.5rem;
    letter-spacing: 0.08em;
    font-weight: 400;
    line-height: 2.2;
    font-feature-settings: "palt";
    -moz-font-feature-settings: "palt";    
}
#gFooter .fInner .lBox .ttl {
    margin-bottom: 10px;
    font-size: 2.95rem;
    letter-spacing: 0.2em;
}
#gFooter .fInner .lBox p a {
    padding: 2px 0 0 32px;
    display: inline-block;
    color: white;
    font-size: 2.2rem;
    letter-spacing: 0.12em;
    background: url("img/common/icon12.png") no-repeat left center;
    background-size: 17px auto;
}
#gFooter .lBox .list {
    margin-top: 31px;
    display: flex;
    flex-wrap: wrap;
}
#gFooter .lBox .list li {
    margin-right: 30px;
}
#gFooter .lBox .list li a:hover img {
    opacity: 0.7;
}
#gFooter .rBox {
    margin-top: 125px;
    width: 326px;
    color: white;
}
#gFooter .rBox .naviUl {
    border-top: 1px solid #fff;
}
#gFooter .rBox .naviUl a {
    display: block;
    color: white;
    font-size: 1.42rem;
    letter-spacing: 0.2em;
    padding: 12px 0 13px;
    border-bottom: 1px solid #fff;
}
#gFooter .rBox .naviUl a:hover {
    opacity: 0.7;
}
#gFooter address {
    margin: 194px auto 0;
    width: 1000px;
    text-align: right;
    font-style: normal;
    font-size: 0.56rem;
    letter-spacing: 0.15em;
}
#gFooter .fBox {
    padding: 75px 0 40px;
    background-color: #F7F8F8;
}
#gFooter .fBox .mainBox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
#gFooter .fBox .fLogo {
    order: 2;
}
#gFooter .fBox .lBox {
    flex: 1;
}
#gFooter .fBox .lBox p {
    font-size: 1.34rem;
    color: #727171;
    letter-spacing: 0.16em;
    line-height: 2.1;
}
#gFooter .fBox .lBox p a {
    color: #727171;
    text-decoration: underline;
}

#childMain {
    padding-top: 145px;
}
.nomainvisaul #childMain {
    padding-top: 125px;
}
#childMain #content {
    font-size: 140%;
}
#childMain #content h1 {
    font-size: 1.5em;
}
#pagePath {
    margin: 0 auto 93px;
    width: 920px;
    display: flex;
    flex-wrap: wrap;
}
#pagePath li {
    font-weight: 500;
    letter-spacing: 1px;
}
#pagePath li a {
    margin-right: 7px;
    color: #898989;
}


@media all and (max-width: 896px) {
    #childMain {
        padding-top: 60px;
    }
    .nomainvisaul #childMain {
        padding-top: 90px;
    }
    #gFooter {
        margin-top: 84px;
    }
    #gFooter .fInner {
        padding-bottom: 9px;
        background-image: url("img/common/sp_f_bg.jpg");
    }
    #gFooter .mainBox {
        display: block;
        padding: 0 23px;
    }
    #gFooter .fInner .lBox {
        width: auto;
    }
    #gFooter .fInner .lBox .ttl {
        margin-bottom: 2px;
        font-size: 2.82rem;
        font-style: italic;
        letter-spacing: 0.14em;
        font-family: "Helvetica", "Arial", "Hiragino Kaku Gothic ProN", "Hiragino Sans", YuGothic, "Yu Gothic", "メイリオ", Meiryo, sans-serif;
    }
    #gFooter .fInner .lBox p a {
        font-size: 1.9rem;
    }
    #gFooter .lBox .list {
        margin-top: 49px;
        justify-content: center;
    }
    #gFooter .lBox .list li {
        margin: 0 15px;
    }
    #gFooter .rBox {
        width: auto;
        margin-top: 117px;
    }
    #gFooter address {
        width: auto;
        margin: 150px 30px 0;
    }
    #gFooter .fBox {
        padding: 50px 0 85px;
    }
    #gFooter .fBox .mainBox {
        display: block;
    }
    #gFooter .fBox .fLogo {
        text-align: center;
        margin-bottom: 31px;
    }
    #gFooter .fBox .fLogo img {
        width: 35px;
    }
    #gFooter .fBox .lBox p {
        line-height: 1.83;
        letter-spacing: 0.1em;
    }
}



/*------------------------------------------------------------
        blog
------------------------------------------------------------*/
.blog .blogBox .defaultBox {
    margin: 0 auto 154px;
    width: 1000px;
}
.blog .wrap,
.blog .maximg,
.single .blog #inner-content,
.page .blog #inner-content,
.blog .inner-footer {
    width: 100%;
    max-width: 1180px;
}
.blog .maximg {padding: 0 3em;}

.single #breadcrumb,
.page #breadcrumb,
.archive #breadcrumb {
    display: none;
}
.blog #content {
    margin: 2em 2em 0;
}

.blog .blogBox .textImg {
    margin-bottom: 107px;
    text-align: center;
}
.comUlBox {
    padding: 39px 0 36px;
    background-color: #F0F0F0;
}
.comUlBox .sub {
    position: relative;
}
.comUlBox .sub:after {
    width: 1px;  
    background-color: #231815;
    position: absolute;  
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    content: ""; 
}
.comUlBox ul {
    max-width: 804px;
    justify-content: space-between;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.comUlBox li {
    width: 296px;
}
.comUlBox li p {
    font-size: 1.2rem;
    font-weight: 500;
    text-align: center;
    line-height: 1.89;
    letter-spacing: 0.96px;
}
.comUlBox li .ttl {
    margin-bottom: 25px;
    font-size: 1.9rem;
    letter-spacing: 2.66px;
    font-weight: bold;
    line-height: 1.8;
}
.comUlBox li .ttl02 {
    margin-bottom: 20px;
    font-size: 2.1rem;
    letter-spacing: 4.62px;
}
.comUlBox li .comLink a {
    font-size: 1.6rem;
    letter-spacing: 3.2px;
}
.comUlBox li .greenLink a {
    padding-top: 13px;
    padding-bottom: 18px;
    font-size: 1.9rem;
    letter-spacing: 3.8px;
}
.flow .blogBox {
    margin-bottom: 156px;
}
.newsBox {
    padding: 111px 0;
}
.newsBox .txt {
    margin-bottom: 33px;
    text-align: center;
    letter-spacing: 2px;
    font-weight: bold;
}
.mainBox {
    margin: 0 auto;
    width: 875px;
}
.headLine01 {
    margin-bottom: 12px;
    text-align: center;
    font-size: 2.6rem;
    font-weight: 500;
    letter-spacing: 5px;
}
.headLine02 {
    margin-bottom: 49px;
    padding-bottom: 48px;
    background: url("img/common/bg.png") no-repeat center bottom;
    background-size: 170px auto;
}
.headLine02 .txtSpan {
    margin-top: 5px;
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
    letter-spacing: 1.92px;
}

.comUl {
    margin-right: -44px;
    display: flex;
    flex-wrap: wrap;
}
.comUl li {
    width: 273px;
    margin: 0 14px 20px;
}
.comUl li a {
    display: block;
}
.comUl li a:hover {
    opacity: 0.7;
}
.comUl li .photo {
    margin-bottom: 8px;
}
.comUl li p {
    letter-spacing: 2px;
    font-weight: 500;
    line-height: 1.67;
}
.comUl li .date {
    margin-bottom: 5px;
    color: #B5B5B6;
    letter-spacing: 0;
    font-weight: bold;
}
.access {
    padding: 87px 0 122px;
}

/* EDIT */
.access > h3 { font-size: 20px; text-align: center; margin: 10px 0 20px;}
.access .accessBox { margin-bottom: 80px; }

.access .accessBox .pBox p {
    letter-spacing: 1.2px;
    line-height: 2.25;
    text-align: center;
}
.access .accessBox .link a {
    padding-right: 20px;
    display: inline-block;
    font-size: 1.4rem;
    letter-spacing: 2.8px;
    font-weight: 500;
    background: url("img/common/icon04.png") no-repeat right center;
    background-size: 14px auto;
}
.access .accessBox .link a:hover {
    opacity: 0.7;
}
.snsBox {
    margin-bottom: 125px;
    position: relative;
}
.snsBox:after {
    width: 1px;  
    background-color: #C9C5C6;
    position: absolute;  
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    content: ""; 
}
.snsUl {
    max-width: 867px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
}
.snsUl li {
    padding: 64px 0 75px;
    width: 50%;
    text-align: center;
}
.snsUl li img {
    vertical-align: top;
}
.snsUl li a:hover {
    opacity: 0.7;
}

/*------------------------------------------------------------
        index
------------------------------------------------------------*/
.index {
    margin-top: -16px;
}
.mainImg {
    height: calc(100vh - 126px);
    position: relative;
    background-color: #150201;
}
.mainImg .fooUl {
    height: 100%;
}
.mainImg .fooUl .slick-track,
.mainImg .fooUl .slick-list {
    height: 100%;
}
.mainImg .fooUl .slick-slide {
    width: 100%;
    float: left;
    height: 100%;
    position: relative;
}
.mainImg .fooUl .slick-slide > div {
    height: 100%;
}
.mainImg .fooUl li {
    height: 100%;
    background: url("img/index/main_img01.jpg") no-repeat center top -11px;
    background-size: 74% auto;    
}
.mainImg .fooUl .liStyle02 {
    background-image: url("img/index/main_img02.jpg");
}
.mainImg .fooUl .liStyle03 {
    background-image: url("img/index/main_img03.jpg");
}
.mainImg h2 {
    position: absolute;
    top: 58px;
    left: 50%;
    transform: translateX(-50%);
}
.mainImg .btmP {
    position: absolute;
    bottom: 47px;
    left: 0;
    width: 100%;
    text-align: center;
    color: white;
    letter-spacing: 6px;
    line-height: 1.5;
    font-size: 2rem;
    font-weight: 500;
}
.mainImg .btmP .txtSpan01 {
    margin-bottom: 8px;
    display: block;
    font-size: 3rem;
    letter-spacing: 9px;
}
.mainImg .btmP .txtSpan02 {
    display: block;
    font-size: 2.16rem;
    letter-spacing: 3.78px;
}
.system .linkBox {
    margin-bottom: 90px;
    background-color: #EFEFEF;
}
.system .mainBox {
    width: 960px;
}
.system .linkBox a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 22px 20px 21px;
    background: url("img/common/icon05.png") no-repeat right 22px center;
    background-size: 13px auto;
}
.system .linkBox a:hover {
    opacity: 0.7;
}
.system .linkBox .date {
    width: 110px;
    font-size: 1.7rem;
    font-weight: bold;
}
.system .linkBox .txtSpan {
    width: calc(100% - 110px);
    box-sizing: border-box;
    padding-left: 8px;
    font-size: 1.4rem;
    color: black;
    letter-spacing: 2.5px;
}
.system h2 {
    margin-bottom: 95px;
    text-align: center;
    font-size: 2.4rem;
    letter-spacing: 4.14px;
    color: black;
    line-height: 2.05;
    font-weight: 500;
}
.system h2 .txtSpan {
    font-size: 2.036rem;
}
.system .inner {
    margin: 0 auto;
    width: 877px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.system .inner .textImg {
    width: 42%;
    text-align: center;
}
.system .inner .textBox {
    width: 442px;
}
.system .inner .textBox p {
    font-size: 1.6rem;
    line-height: 1.89;
    text-align: justify;
    text-justify: inter-ideograph;
}
.system .inner .textBox .ttl {
    margin-bottom: 20px;
    font-size: 1.7rem;
    line-height: 2.12;
    letter-spacing: 3.74px;
}
.service .ttlBox {
    margin-bottom: 67px;
    min-height: 237px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    background: url("img/index/photo01.jpg") no-repeat center top;
    background-size: cover;
}
.service .ttlBox h2 {
    font-size: 2.3rem;
    letter-spacing: 5px;
    color: white;
    text-align: center;
    font-weight: 500;
}
.service .ttlBox h2 .txtSpan {
    display: block;
    font-size: 2.6rem;
    font-weight: 500;
    letter-spacing: 5.72px;
}
.service h3 {
    margin-bottom: 77px;
    text-align: center;
    font-size: 2rem;
    font-weight: 500;
    letter-spacing: 2.8px;
}
.system {
    padding-bottom: 68px;
    border-bottom: 1px solid #231815;
}
.system .banner {
    margin: 0 auto 120px;
    width: 590px;
}
/*
.system .banner a {
    padding: 45px 23px;
    display: flex;
    font-weight: bold;
    flex-wrap: wrap;
    align-items: center;
    letter-spacing: 0.1em;
    border: 2px solid #231815;
    background: url("img/common/icon08.png") no-repeat right 28px center;
    background-size: 25px auto;
}*/
.system .banner a img {
    width: 100%;
}
.system .banner a:hover {
    opacity: 0.7;
}
/*
.system .banner a .txtSpan {
    flex: 1;
    padding-left: 25px;
    font-size: 1.5rem;
    line-height: 1.5;
}
*/
.service .jsBox02 .fooUl .slick-slide {
    margin-right: 20px;
    float: left;
    width: 190px;
}
.service .jsBox02 .fooUl .slick-dots {
    text-align: center;
    margin-top: 27px;
}
.service .jsBox02 .fooUl .slick-dots li {
    margin: 0 8px;
    display: inline-block;
    width: 10px;
    height: 10px;
    cursor: pointer;
    border-radius: 100px;
    background-color: #fff;
    border: 1px solid #231815;
    box-sizing: border-box;
}
.service .jsBox02 .fooUl .slick-dots li button {
    display: none;
}
.service .jsBox02 .fooUl .slick-dots li.slick-active {
    background-color: #221714;
}

.service .fooUl .photo {
    margin-bottom: 13px;
}
.service .fooUl .photo img {
    box-sizing: border-box;
    border: 1px solid #231815;
}
.service .fooUl p {
    font-size: 1.1rem;
    letter-spacing: 0.9px;
    line-height: 1.86;
    font-weight: 500;
}
.service .fooUl .jsTtl {
    margin-bottom: 17px;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
    letter-spacing: 1.4px;
}
.service {
    padding-bottom: 180px;
}
.plan {
    padding: 90px 0 67px;
}
.plan .h2Ttl {
    margin-bottom: 91px;
    line-height: 2.04;
    letter-spacing: 3.6px;
    font-size: 2.0rem;
    padding-bottom: 39px;
    background-size: 114px auto;
}
.plan .indoors {
    padding: 61px 0 14px;
    background-color: #000;
}
.plan .indoors h3 {
    margin-bottom: 38px;
    text-align: center;
    color: white;
    font-size: 4.3rem;
    font-weight: normal;
    letter-spacing: 3.3px;
}
.plan .indoors h3 .txtSpan {
    font-size: 3.4rem;
    display: inline-block;
    vertical-align: 2px;
}
.plan .imgBox {
    margin: 0 auto;
    width: 1070px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
}
.plan .imgBox .photoBox {
    width: 610px;
}
.plan .imgBox .textBox {
    margin: 36px 100px 0 0;
    width: 305px;
    box-sizing: border-box;
    background-color: black;
}
.plan .imgBox .textBox .ttl {
    margin: 0 0 15px;
    font-size: 1.6rem;
    font-weight: 500;
    letter-spacing: 2.88px;
    color: white;
    text-align: center;
    line-height: 2.08;
}
.plan .imgBox .textBox p {
    font-size: 1.4rem;
    color: white;
    line-height: 1.835;
    margin: 0 15px 0 25px;
    text-align: justify;
    text-justify: inter-ideograph;
}
.plan .textList {
    margin-bottom: 26px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.plan .textList li {
    width: 141px;
    height: 141px;
    display: flex;
    flex-wrap: wrap;
    border-radius: 100%;
    background-color: white;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.plan .textList li span {
    font-size: 2rem;
    letter-spacing: 3.2px;
    display: block;
    font-weight: 500;
}
.plan .inner {
    padding: 110px 0 0;
}
.plan .subPlan {
    padding: 111px 0 60px;
    background: url("img/index/bg01.png") no-repeat center top;
    background-size: cover;
}
.plan .inner .headLine02 {
    margin-bottom: 30px;
    padding-bottom: 30px;
    background-size: 114px auto;
}
.plan .inner h3 {
    /*margin-bottom: 6px;
    text-align: center;
    font-size: 3.4rem;
    font-weight: 500;
    letter-spacing: 6.12px;*/

    /* EDIT */
    margin-bottom: 50px;
    text-align: center;
    font-size: 3rem;
    font-weight: 500;
    line-height: 1.8em;
    letter-spacing: 6.12px;

}
.plan .inner .txt {
    margin-bottom: 83px;
    text-align: center;
    font-size: 2rem;
    letter-spacing: 2px;
    line-height: 1.74;
}
.plan .inner .ttl {
    margin: -20px auto 81px;
    width: 434px;
    text-align: center;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    letter-spacing: 2.4px;
    background: url("img/index/bg06.png") no-repeat center center;
    background-size: 100% 100%;
}
.plan .inner .ttl .txtSpan {
    margin: -2px 0 0 20px;
    font-size: 2rem;
    font-weight: bold;
    letter-spacing: 2.2px;
}
.plan .inner .list {
    margin: 0 82px 16px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.plan .inner .list li {
    width: 334px;
    padding: 17px 20px 4px;
    box-sizing: border-box;
    margin-bottom: 20px;
    border: 3px solid #787878;
    background-color: white;
}
.plan .inner .list li .ttl02 {
    font-size: 1.5rem;
    font-weight: bold;
    color: white;
    width: 207px;
    text-align: center;
    box-sizing: border-box;
    padding: 9px 4px 12px;
    margin: -40px auto 9px;
    background-color: #787878;
}
.plan .inner .planDl {
    padding: 7px 0;
    font-weight: 500;
    display: flex;
    flex-wrap: wrap;
    min-height: 62px;
    box-sizing: border-box;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #231815;
}
.plan .inner .planDl:last-child {
    border: none;
}
.plan .inner .planDl dt {
    font-size: 1.357rem;
}
.plan .inner .planDl dd {
    font-size: 1.775rem;
    letter-spacing: 1.7px;
    display: flex;
    align-items: center;
}
.plan .inner .planDl dd .txtSpan01 {
    padding-top: 5px;
    font-size: 1rem;
    color: #4A4A4A;
    font-weight: 500;
    position: relative;
    display: inline-block;
    overflow: hidden;
}
.plan .inner .planDl dd .txtSpan01:after {
    width: 100%;  
    height: 1px;
    background-color: #000000;
    position: absolute;  
    top: 56%;
    left: 0;  
    transform: rotate(16deg);
    content: ""; 
}
.plan .inner .planDl dd .txtSpan01:before {
    width: 100%;  
    height: 1px;
    background-color: #000000;
    position: absolute;  
    top: 56%;
    right: 0;  
    transform: rotate(-16deg);
    content: ""; 
}
.plan .inner .planDl dd .txtSpan01 span {
    font-size: 1.3rem;
}
.plan .inner .planDl dd .redSpan {
    margin-left: 15px;
    position: relative;
}
.plan .inner .planDl dd .txtSpan04 {
    position: absolute;
    top: -15px;
    right: 4px;
    min-width: 61px;
    text-align: center;
    font-size: 0.7rem;
    letter-spacing: 1.12px;
    background-color: #C30813;
    color: white;
    border-radius: 5px;
    padding: 2px 2px 3px;
    box-sizing: border-box;
}
.plan .inner .planDl dd .txtSpan04:after {
    width: 6px;  
    height: 6px;
    background: url("img/index/bg02.png") no-repeat right center;
    background-size: 5.5px auto;
    position: absolute;  
    bottom: -5px;
    right: 7px;  
    content: ""; 
}
.plan .inner .planDl dd .num {
    font-size: 2.246rem;
}
.plan .inner .planDl dd .num02 {
    font-size: 1.8rem;
}
.plan .inner .planDl dd .txtSpan02 {
    font-size: 1.5rem;
}
.plan .inner .planDl dd .txtSpan03 {
    padding-bottom: 4px;
    font-size: 2.4rem;
}
.plan .inner .planDl dd small {
    font-size: 1.432rem;
}
.plan .inner .list .liStyle {
    border-color: #947300;
}
.plan .inner .list .liStyle .ttl02 {
    background-color: #947300;
}
.plan .inner .liStyle .planDl dd {
    color: #947300;
}

/* EDIT */
.plan .mainBox { width: 980px; }
.plan .plan_box { width: 100%; margin-bottom: 90px; }

.plan .receive {
    border: 1px solid #231815;
    background-color: white;
    width: 710px;
    box-sizing: border-box;
    margin: 0 auto 27px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 57px 66px 69px 30px;
}
.plan .receive .textBox {
    margin-left: 38px;
    width: 285px;
    position: relative;
}
.plan .receive:after {
    width: 50%;  
    height: 9px;
    background-color: #787878;
    position: absolute;  
    bottom: -1px;
    right: 0;  
    content: ""; 
}
.plan .receive:before {
    width: 50%;  
    height: 9px;
    background-color: #947300;
    position: absolute;  
    bottom: -1px;
    left: 0;  
    content: ""; 
}
.plan .receive .textBox p {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.84;
    letter-spacing: 0;
}
.plan .receive .textBox .ttl03 {
    margin-bottom: 10px;
    font-size: 1.6rem;
    line-height: 1.94;
    letter-spacing: 1.9px;
}
.plan .receive .textBox .ttl03 .color01 {
    color: #787878;
}
.plan .receive .textBox .ttl03 .color02 {
    color: #947300;
}
.plan .receive .rBox {
    width: 265px;
}
.plan .receive .photoUl {
    margin-bottom: 13px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.plan .receive .photoUl li {
    width: 48.5%;
}
.plan .receive .rBox .link a {
    display: block;
    font-size: 1.4rem;
    letter-spacing: 2px;
    position: relative;
    border: 1px solid #231815;
    padding: 6px 14px 7px;
}
.plan .receive .rBox .link a:hover {
    opacity: 0.7;
}
.plan .receive .rBox .link a:after {
    width: 43px;  
    height: 1px;
    background-color: #231815;
    position: absolute;  
    top: 45%;
    right: -5px;
    transform: translateY(-50%);
    content: ""; 
}
.plan .text {
    margin: 0 auto;
    width: 710px;
    font-size: 1.1rem;
    letter-spacing: 0.88px;
    line-height: 1.88;
}
.official {
    padding: 32px 0 82px;
}
.official h2 {
    margin-bottom: 21px;
    text-align: center;
    font-size: 1.9rem;
    letter-spacing: 2.66px;
    line-height: 1.8;
}
.comLink {
    margin: 0 auto 20px;
    width: 296px;
}
.comLink a {
    padding: 16px 18px 20px;
    display: block;
    font-size: 2.1rem;
    font-weight: bold;
    color: white;
    text-align: center;
    letter-spacing: 4.2px;
    background: url("img/common/icon07.png") no-repeat right 16px center #231815;;
    background-size: 10px auto;
}
.greenLink a {
    background-color: #50A035;
}
.comLink a:hover {
    opacity: 0.7;
}
.official p {
    letter-spacing: 0.96px;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.89;
    text-align: center;
}
.index .blogBox {
    margin-bottom: 58px;
}
.index .comUlBox {
    padding: 0;
    background-color: transparent;
}
.recommend .inner {
    min-height: 750px;
    padding: 92px 0 41px;
    box-sizing: border-box;
    background: url("img/index/bg03.jpg") no-repeat center top / cover;
}
.recommend .inner .mainBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
}
.recommend .inner .lBox {
    width: 36%;
    text-align: center;
    position: relative;
}
.recommend .inner .lBox .textImg {
    margin-bottom: 18px;
}
.recommend .inner .lBox .textImg02 {
    position: absolute;
    bottom: 108px;
    left: 0;
    width: 100%;
    text-align: center;
}
.recommend .inner .lBox p {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.8;
    letter-spacing: 3.08px;
}
.recommend .inner .rBox {
    margin: 7px 37px 0 0;
    width: 287px;
}
.recommend .inner .rBox li {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}
.recommend .inner .rBox li .photoBox {
    width: 65px;
}
.recommend .inner .rBox li .photoBox img {
    border-radius: 100%;
}
.recommend .inner .rBox li .textBox {
    width: 195px;
    min-height: 60px;
    padding: 14px 5px 13px 24px;
    letter-spacing: 2px;
    border-radius: 5px;
    position: relative;
    line-height: 1.56;
    box-sizing: border-box;
    background-color: rgba(255, 255, 255, 0.9);
}
.recommend .inner .rBox li .textBox:after {
    width: 16px;  
    height: 16px;
    background: url("img/index/bg04.png") no-repeat;
    background-size: 16px auto;
    position: absolute;  
    top: 50%;
    transform: translateY(-50%);
    left: -16px;  
    content: ""; 
}
.recommend .inner .rBox li .textBox p {
    font-size: 1.2rem;
    letter-spacing: 1.44px;
    line-height: 1.435;
}
.recommend {
    margin-bottom: 60px;
    border-bottom: 1px solid #231815;
}
.trials {
    padding: 75px 0 82px;
    text-align: center;
}
.trials h2 {
    margin-bottom: 20px;
    font-size: 1.9rem;
    font-weight: 500;
    letter-spacing: 3.42px;
}
.trialsLink {
    margin: 0 auto;
    width: 320px;
}
.trialsLink a {
    padding: 22px 10px 22px 15px;
    display: block;
    font-size: 1.6rem;
    text-align: center;
    color: white;
    background-color: #231815;
    border-radius: 10px;
}
.trialsLink a:hover {
    opacity: 0.7;
}
.trialsLink span {
    padding: 0 0 0 35px;
    letter-spacing: 3px;
    display: inline-block;
    background: url("img/common/icon06.png") no-repeat left center;
    background-size: 21px auto;
}
.index .newsBox {
    padding: 97px 0 110px;
}

@media all and (max-width: 896px) {
    .index {
        margin-top: 0;
    }
    .mainImg {
        padding-bottom: 20px;
        height: calc(100vh - 60px);
        background-color: #150201;
    }
    .mainImg .fooUl {
        margin-bottom: 0;
        height: 284px;
    }
    .mainImg .fooUl li {
        background-size: 100%;
        background-image: url("img/index/sp_main_img01.jpg");
    }
    .mainImg .fooUl .liStyle02 {
        background-image: url("img/index/sp_main_img02.jpg");
    }
    .mainImg .fooUl .liStyle03 {
        background-image: url("img/index/sp_main_img03.jpg");
    }
    .mainImg h2 {
        margin-bottom: 30px;
        text-align: center;
        font-size: 3rem;
        font-weight: 500;
        letter-spacing: 6px;
        color: white;
        position: relative;
        top: auto;
        left: auto;
        transform: none;
    }
    .mainImg .textImg {
        margin: 0 auto 25px;
        /*width: auto;*/
        width: 90px;
        position: relative;
        bottom: auto;
        left: auto;
    }
    .mainImg .textImg img {
        width: 100%;
    }
    .mainImg .btmP {
        margin-bottom: 30px;
        position: relative;
        bottom: auto;
        font-size: 1.58rem;
        letter-spacing: 2.88px;
    }
    .mainImg .btmP .txtSpan01 {
        font-size: 2.4rem;
        letter-spacing: 2.88px;
    }
    .mainImg .btmP .txtSpan02 {
        font-size: 1.7rem;
    }
    .mainBox {
        width: auto !important;
    }
    .system .linkBox a {
        padding: 14px 24px 17px;
        background-size: 9px auto;
    }
    .system .banner {
        width: auto;
        margin: 0 25px 40px;
    }
    .system .banner a {
        padding: 30px 10px 28px;
        background: none;
    }
    .system .banner a .txtImg {
        width: 57px;
    }
    .system .banner a .txtSpan {
        font-size: 1.9rem;
        padding-left: 40px;
        line-height: 1.6;
    }
    .system .banner a .txtSpan img {
        vertical-align: -3px;
    }
    .system .linkBox .date {
        width: 70px;
        font-size: 1.1rem;
        letter-spacing: 1.32px;
    }
    .system .linkBox .txtSpan {
        width: calc(100% - 70px);
        font-size: 1rem;
    }
    .system h2 {
        font-size: 2.05rem;
        margin-bottom: 23px;
        letter-spacing: 3.6px;
        line-height: 2.0365;
    }
    .system h2 .txtSpan {
        font-size: 1.752rem;
    }
    .system .linkBox {
        margin-bottom: 70px;
    }
    .system .inner {
        margin: 0 35px;
        width: auto;
    }
    .system .inner .textImg {
        display: none;
    }
    .system .inner .textBox {
        margin-bottom: 0;
        width: auto;
    }
    .system .inner .textBox p {
        font-size: 1.4rem;
        letter-spacing: 0;
        line-height: 1.98;
    }
    .system .inner .textBox .ttl {
        line-height: 2.01;
        letter-spacing: 1.7px;
    }
    .system {
        padding-bottom: 77px;
    }
    .service .ttlBox {
        margin-bottom: 47px;
        min-height: 118px;
    }
    .service .ttlBox h2 {
        font-size: 1.9rem;
        letter-spacing: 2.2px;
    }
    .service .ttlBox h2 .txtSpan {
        font-size: 2.6rem;
        letter-spacing: 5.72px;
    }
    .service h3 {
        margin-bottom: 36px;
    }
    .service .jsBox02 {
        margin: 0 22px;
    }
    .service .fooUl .photo {
        margin-bottom: 14px;
    }
    .service .fooUl .jsTtl {
        margin-bottom: 17px;
    }
    .service {
        padding-bottom: 109px;
    }
    .plan {
        padding: 63px 0 40px;
    }
    .headLine02 {
        margin-bottom: 36px;
        padding-bottom: 28px;
        background-size: 114px auto;
    }
    .headLine02 .txtSpan {
        letter-spacing: 1.92px;
    }
    .official {
        padding-bottom: 87px;
    }
    .plan .indoors {
        padding: 50px 0 14px;
        background: none;
    }
    .plan .h2Ttl {
        margin-bottom: 56px;
        padding-bottom: 35px;
    }
    .plan .imgBox {
        width: auto;
        margin: -50px auto 0;
        display: block;
    }
    .plan .imgBox .photoBox {
        width: auto;
        margin: 0 3px 28px;
        text-align: center;
    }
    .plan .imgBox .textBox {
        margin: 0;
        width: auto;
        padding: 15px 20px 28px;
        position: relative;
    }
    .plan .imgBox .textBox:after {
        width: 150%;  
        height: 110%;
        background-color: #000000;
        position: absolute;  
        top: -55.4%;
        left: 0; 
        z-index: -1;
        content: ""; 
        transform: skewX(-81.5deg);
    }
    .plan .textList {
        margin: 0 -35px 31px;
        justify-content: center;
    }
    .plan .textList li {
        margin: 0 10px;
    }
    .plan .textList li span {
        line-height: 1.36;
    }
    .plan .indoors h3 {
        font-size: 4.3rem;
        letter-spacing: 3.3px;
        line-height: 1.25;
    }
    .plan .imgBox .textBox p {
        margin: 0 40px;
        line-height: 1.76;
        letter-spacing: -0.5px;
    }
    .plan .inner {
        padding: 26px 0 27px;
        background: url("img/index/sp_bg.png") no-repeat center bottom;
        background-size: cover;
    }
    .plan .inner .ttl {
        margin: 0 30px 78px;
        padding: 11px 11px 16px;
        width: auto;
        display: block;
    }
    .plan .inner .ttl .txtSpan {
        display: block;
        margin: 0;
        letter-spacing: 3.36px;
    }
    .plan .inner .txt {
        margin-bottom: 0;
    }
    /* EDIT */
    .plan .inner h3 {
        margin-bottom: 0px;
        text-align: center;
        font-size:  2.3rem;
        letter-spacing: 5.5px;

    }
    .plan .subPlan {
        /*padding: 89px 0 0;*/
        padding: 0 0;
        background: none;
    }
    .plan .inner .list {
        margin: 0 22px 52px;
        display: block;
    }
    .plan .inner .list li {
        margin-bottom: 47px;
        width: auto;
        padding: 16px 20px 3px;
    }
    .plan .inner .list li:last-child {
        margin-bottom: 0;
    }
    /* EDIT */
    .plan .plan_box { width: 90%; margin: 0 auto 50px; }
    .plan .receive {
        padding: 30px 30px 39px 33px;
        width: auto;
        margin: 0 23px 31px;
        display: block;
    }
    .plan .receive .textBox::before,
    .plan .receive .textBox::after {
        left: -44px;
    }
    .plan .receive .textBox {
        width: auto;
        margin: 0 0 18px;
    }
    .plan .receive .rBox {
        width: auto;
    }
    .plan .receive .photoUl li img {
        width: 100%;
    }
    .plan .receive .textBox p {
        font-size: 1.4rem;
        margin-right: -10px;
        letter-spacing: 0;
        line-height: 1.865;
    }
    .plan .receive .textBox .ttl03 {
        margin-bottom: 7px;
        font-size: 1.6rem;
        letter-spacing: 2px;
        line-height: 1.8;
    }
    .plan .text {
        width: auto;
        margin: 0 20px;
        letter-spacing: 0.5px;
    }
    .comUlBox {
        padding: 32px 0 36px;
    }
    .comUlBox ul{
        max-width: inherit;
        margin: 0 30px;
    }
    .comUlBox li {
        padding: 24px 0 39px;
        width: 100%;
        border-bottom: 1px solid #231815;
    }
    .comUlBox li:last-child {
        border: none;
        padding-bottom: 0;
    }
    .comUlBox li .ttl {
        margin-bottom: 30px;
    }
    .comUlBox .sub::after {
        display: none;
    }
    .index .blogBox {
        margin-bottom: 30px;
    }
    .recommend {
        margin-bottom: 30px;
    }
    .recommend .inner {
        padding: 38px 0 20px;
        min-height: 981px;
        background-image: url("img/index/sp_bg02.jpg");
    }
    .recommend .inner .mainBox {
        display: block;
    }
    .recommend .inner .lBox {
        margin: 0 auto 82px;
        width: auto;
    }
    .recommend .inner .lBox .textImg {
        margin-bottom: 33px;
    }
    .recommend .inner .lBox .textImg img {
        width: 36px;
    }
    .recommend .inner .textImg02 {
        width: 225px;
        margin: 46px auto 0;
    }
    .recommend .inner .rBox {
        margin: 0 auto;
        width: 286px;
    }
    .recommend .inner .rBox li .textBox {
        min-height: inherit;
        border-radius: 5px;
    }
    .trials {
        padding: 72px 10px 60px;
    }
    .trials h2 {
        margin-bottom: 19px;
    }
    .comLink {
        max-width: 296px;
        width: auto;
    }
    .trials .comLink a {
        font-size: 1.6rem;
    }
    .newsBox,
    .index .newsBox {
        padding: 52px 0;
    }
    .newsBox {
        border-bottom: 1px solid #231815;
    }
    .newsBox .txt {
        letter-spacing: 1.92px;
        line-height: 2.0275;
    }
    .comUl {
        margin: 0 22px;
        display: block;
    }
    .comUl li {
        width: auto;
        margin: 0 0 20px;
    }
    .comUl li a {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }
    .comUl li .photo {
        margin: 0;
        width: 50%;
    }
    .comUl li .txtBox {
        width: 43%;
    }
    .access {
        padding: 81px 0 20px;
    }

    /* EDIT */
    .access > h3 { font-size: 17px; }

    .access .accessBox {
        width: auto;
        margin: 0 25px 40px;
        display: block;
    }
    .access .accessBox .pBox {
        margin-bottom: 29px;
        width: auto;
    }
    .access .accessBox .pBox p {
        letter-spacing: 0;
        line-height: 2.29;
        font-size: 1.1rem;
        margin-left: -3px;
        text-align: left;
    }
    .access .accessBox .link {
        width: auto;
        padding: 31px 0;
    }
    .snsBox {
        margin-bottom: 50px;
    }
    .snsUl {
        margin: 0 17px;
        max-width: inherit;
        justify-content: center;
    }
    .snsUl li {
        padding: 27px 20px 41px;
        text-align: center;
        box-sizing: border-box;
    }
    .snsUl li img {
        width: auto;
        height: 74px;
    }
    .service .jsBox02 .fooUl .slick-dots {
        margin-top: 18px;
    }
    .service .jsBox02 .fooUl .slick-dots li {
        width: 11px;
        height: 11px;
    }

}

/*------------------------------------------------------------
        flow
------------------------------------------------------------*/
.flow {
    margin-top: -16px;
}
.mainImg02 {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 264px;
    box-sizing: border-box;
    background: url("img/flow/main_img01.jpg") no-repeat center top / cover;
}
.mainImg02 h2 {
    width: 100%;
    font-size: 1.4rem;
    color: white;
    letter-spacing: 4.2px;
    font-weight: bold;
    text-align: center;
}
.mainImg02 h2 span {
    margin-bottom: 3px;
    display: block;
    font-size: 2.6rem;
    font-weight: 500;
    letter-spacing: 5.72px;
}
.flowBox {
    margin: 0 auto 104px;
    padding-top: 8px;
    width: 766px;
}
.flowBox h2 {
    margin-bottom: 153px;
    font-size: 2.45rem;
    font-weight: 500;
    text-align: center;
    letter-spacing: 3.3px;
}
.flowBox .inner {
    margin-bottom: 84px;
    padding-bottom: 62px;
    border-bottom: 1px solid #918B8B;
    position: relative;
}
.flowBox .inner:after {
    width: 16px;  
    height: 18px;
    background: url("img/flow/arrow.jpg") no-repeat center bottom;
    background-size: 16px auto;
    position: absolute;  
    bottom: -17px;
    left: 50%;
    transform: translateX(-50%);
    content: ""; 
}
.flowBox .innerBox .inner:last-child {
    border: none;
    padding-bottom: 0;
    margin-bottom: 0;
}
.flowBox .innerBox .inner:last-child:after {
    background: none;
}
.flowBox .inner .sub .txtBox01 {
    margin-bottom: 50px;
}
.flowBox .innerBox .txt {
    padding: 29px 0 33px;
    margin: 36px auto 29px;
    width: 445px;
    text-align: center;
    color: #fff;
    font-size: 1.9rem;
    line-height: 1.94;
    letter-spacing: 1.2px;
    background-color: #727071;
    box-sizing: border-box;
    font-weight: 500;
}
.flowBox .inner .sub {
    margin: 0 auto;
    width: 440px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.flowBox .inner .sub .num {
    margin: 8px 0 0 3px;
    padding-top: 3px;
    width: 32px;
    height: 32px;
    color: #fff;
    font-size: 1.5rem;
    letter-spacing: 0.56px;
    text-align: center;
    background: #737172;
    border-radius: 50%;
    font-family: 'Noto Serif JP', serif;
}
.flowBox .inner .sub .txtBox {
    margin: 0 30px 0 0;
    width: 334px;
}
.flowBox .inner .sub .txtBox p {
    margin-bottom: 39px;
    font-size: 1.2rem;
    letter-spacing: 1.44px;
    line-height: 1.96;
    font-weight: 500;
    text-align: justify;
    text-justify: inter-ideograph;
    -ms-text-justify: inter-ideograph;
}
.flowBox .inner .photoUl {
    width: 330px;
}
.flowBox .inner .photoUl li {
    margin-bottom: 20px;
}
.flowBox .inner .photoUl li img {
    width: 100%;
}
.flowBox .inner .photoUl li:last-child {
    margin-bottom: 0;
}
.flowBox .inner .sub .txtBox p:last-child {
    margin-bottom: 0;
}
.flowBox .inner .photo {
    margin-left: -34px;
    width: 355px;
}
.flowBox .inner .sub .txtBox .ttl {
    margin-bottom: 3px;
    font-size: 1.7rem;
    font-weight: bold;
    letter-spacing: 1.7px;
    color: #727272;
}
.flowBox .inner .trialsLink {
    width: auto;
}
.flow .trialsLink a {
    font-size: 1.4rem;
    padding: 20px 10px 21px 15px;
    border-radius: 5px;
}
.flow .trialsLink span {
    background-size: 19px auto;
}
.flowBox h3 {
    margin-bottom: 70px;
    font-size: 1.9rem;
    font-weight: bold;
    color: white;
    text-align: center;
    letter-spacing: 3px;
    position: relative;
}
.flowBox h3:after {
    width: 100%;  
    height: 1px;
    background-color: #231815;
    position: absolute;  
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    content: ""; 
    z-index: -1;
}
.flowBox h3 span {
    margin: 0 auto;
    display: inline-block;
    min-width: 331px;
    text-align: center;
    box-sizing: border-box;
    padding: 27px 5px 30px;
    background-color: #A7ABAC;
}
.flowBox .inner02 .sub .num {
    background-color: #000;
}
.flowBox .inner02 .sub .txtBox .ttl {
    color: #231815;
}
.flowBox .textImg {
    padding-top: 45px;
    text-align: center;
}


@media all and (max-width: 896px) {
    .flow {
        margin-top: 0;
    }
    .flowBox h2 {
        margin-bottom: 63px;
    }
    .mainImg02 {
        margin-bottom: 6px;
        min-height: 122px;
    }
    .mainImg02 h2 {
        font-size: 1.2rem;
        letter-spacing: 3.6px;
    }
    .mainImg02 h2 span {
        font-size: 1.5rem;
        letter-spacing: 1.2px;
    }
    #pagePath {
        margin: 0 25px 20px;
    }
    #pagePath li {
        font-size: 0.9rem;
    }
    .flowBox {
        width: auto;
        margin: 0 40px 86px;
        padding-top: 49px;
    }
    .flowBox .inner {
        margin-bottom: 33px;
        padding: 0 5px 41px;
        border-bottom: 2px solid #BAB7B5;
    }
    .flowBox .inner03 {
        border: none;
        padding-bottom: 20px;
    }
    .flowBox .inner03:after {
        display: none;
    }
    .flowBox .inner::after {
        bottom: -17px;
    }
    .flowBox .inner .sub {
        width: auto;
        display: block;
    }
    .flowBox .inner .sub .num {
        margin: -6px 0 6px 3px;
        padding-top: 4px;
    }
    .flowBox .inner .sub .txtBox {
        width: auto;
        margin-right: 0;
    }
    .flowBox .inner .sub .txtBox p {
        margin-bottom: 18px;
    }
    .flowBox .inner .photo {
        width: auto;
        margin: 0 -15px;
    }
    .flowBox .innerBox .txt {
        margin: 36px -25px 0;
        width: auto;
    }
    .flowBox h3 {
        margin-bottom: 35px;
    }
    .flowBox h3 span {
        min-width: 100%;
    }
    .flowBox h3::after {
        display: none;
    }
    .flowBox .inner .trialsLink {
        margin-bottom: 21px;
    }
    .flowBox .inner .photoUl {
        width: auto;
    }
    .flow .blogBox {
        margin-bottom: 26px;
    }
    .flow .newsBox {
        padding: 94px 0 52px;
    }
}

/*------------------------------------------------------------
        about
------------------------------------------------------------*/
.about {
    margin: -17px 0 100px;
}
.about .mainImg03 {
    margin-bottom: 12px;
}
.about .mainBox {
    width: 800px;
}
.about .headLine {
    margin-bottom: 213px;
    text-align: center;
    font-size: 2.6rem;
    letter-spacing: 5.72px;
    font-weight: 500;
}
.aboutBox {
    padding-top: 48px;
}
.aboutBox .imgBox {
    margin-bottom: 150px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.aboutBox .imgBox .textBox {
    width: 345px;
}
.aboutBox .imgBox .textBox p {
    font-size: 1.3rem;
    letter-spacing: 1.3px;
    line-height: 3.02;
}
.aboutBox .imgBox .textBox .ttl {
    margin-bottom: 30px;
    font-size: 1.7rem;
    font-weight: bold;
    letter-spacing: 2.3px;
    line-height: 2.7;
}
.aboutBox .imgBox .rBox {
    width: 520px;
    margin: 30px 0 0 -80px;
    order: 2;
}
.aboutBox .imgBox .rBox .photo {
    margin: 0 -70px 68px 58px;
}
.aboutBox .imgBox .textImg {
    text-align: center;
    margin: 0 -100px 0 115px;
}
.aboutBox .headLine04 {
    margin-bottom: 43px;
    padding-bottom: 18px;
    text-align: center;
    font-size: 1.5rem;
    letter-spacing: 5.4px;
    line-height: 1.544;
    border-bottom: 1px solid #231815;
}
.aboutBox .shop {
    margin-bottom: 112px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.aboutBox .shop .lBox {
    width: 58%;
}
.aboutBox .shop .rBox {
    width: 39%;
}
.aboutBox .shop p {
    font-size: 1.1rem;
    letter-spacing: 1.32px;
    line-height: 2.38;
    margin-bottom: 26px;
}
.aboutBox .shop p:last-child {
    margin-bottom: 0;
}
.aboutBox .shop p a:hover {
    opacity: 0.7;
}
.aboutBox .list {
    margin-bottom: 75px;
    text-align: center;
}
.aboutBox .list li {
    margin: 0 43px;
    display: inline-block;
    vertical-align: bottom;
}
.aboutBox .list li a:hover {
    opacity: 0.7;
}
.aboutBox .business {
    margin-bottom: 168px;
    padding: 47px 40px 49px;
    border: 1px solid #231815;
}
.aboutBox .business p {
    text-align: center;
    font-size: 1.1rem;
    letter-spacing: 1.32px;
    line-height: 2.38;
}
.aboutBox .business .ttl {
    margin-bottom: 24px;
    font-size: 1.7rem;
    line-height: 1.81;
    letter-spacing: 0.3px;
}
.aboutBox .policy {
    padding-top: 15px;
}
.aboutBox .policy p {
    margin-bottom: 19px;
    font-size: 1rem;
    letter-spacing: 0.5px;
    line-height: 1.839;
    font-weight: 500;
}
.aboutBox .policy p a:hover {
    opacity: 0.7;
}

@media all and (max-width: 896px) {
    .mainImg .fooUl .slick-slide {
        background-size: 154% auto;
    }
    .about {
        margin-top: 0;
    }
    .about .mainImg03 {
        margin-bottom: 6px;
    }
    .about .mainImg03 img {
        width: 100%;
    }
    .aboutBox {
        padding-top: 105px;
    }
    .about .headLine {
        margin-bottom: 70px;
        font-size: 1.9rem;
        letter-spacing: 4.18px;
    }
    .aboutBox .imgBox {
        margin-bottom: 175px;
        display: block;
    }
    .aboutBox .imgBox .rBox {
        width: auto;
        margin: 0 0 70px;
    }
    .aboutBox .imgBox .rBox .photo {
        margin: 0 -27px 0 -56px;
        text-align: center;
    }
    .aboutBox .mainBox {
        margin: 0 25px;
    }
    .aboutBox .imgBox .textImg {
        display: none;
    }
    .aboutBox .imgBox .textBox {
        width: auto;
        margin: 0 0 69px 30px;
    }
    .aboutBox .imgBox .textBox p {
        font-size: 1.1rem;
        letter-spacing: 1.1px;
        line-height: 2.79;
    }
    .aboutBox .imgBox .textBox .ttl {
        font-size: 1.5rem;
        letter-spacing: 2px;
        line-height: 2.43;
        margin-bottom: 13px;
    }
    .aboutBox .imgBox .spTxt {
        text-align: center;
    }
    .aboutBox .headLine04 {
        padding-bottom: 11px;
        margin-bottom: 25px;
    }
    .aboutBox .shop {
        margin-bottom: 66px;
        display: block;
    }
    .aboutBox .shop .lBox {
        margin-bottom: 26px;
        width: auto;
    }
    .aboutBox .shop .rBox {
        width: auto;
    }
    .aboutBox .shop p {
    }
    .aboutBox .list {
        padding-bottom: 14px;
        margin: 0 auto;
        max-width: 285px;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .aboutBox .list li {
        width: 137px;
        margin: 0 0 32px;
        height: 122px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }
    .aboutBox .business {
        margin-bottom: 137px;
        padding: 38px 10px 45px;
    }
    .aboutBox .business .ttl {
        margin-bottom: 50px;
        font-size: 1.5rem;
        line-height: 2.056;
    }
    .aboutBox .business p {
        line-height: 2.15;
    }
    .aboutBox .policy {
        padding: 0;
        margin-top: -7px;
    }
    .aboutBox .policy p {
        line-height: 1.689;
        margin-bottom: 17px;
    }
    .blog .blogBox .defaultBox {
        width: auto;
    }
    .blog #content {
        margin: 2em auto 0;
        width: 92%;
    }
    .blog .maximg { padding: 0; width: 92%; margin: 0 auto;}
}

@media all and (-ms-high-contrast:none){
    .mainImg02:before {
        content:'';
        min-height: inherit;
        font-size: 0;
    }
    .service .ttlBox:before {
        content:'';
        min-height: inherit;
        font-size: 0;
    }
    .plan .inner .ttl:before {
        content:'';
        min-height: inherit;
        font-size: 0;
    }
    .plan .inner .planDl {
        height: 65px;
    }
    #gFooter {
        font-family: 'Noto Sans JP', sans-serif;        
    }
}

.fixedBox {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 901;
    background-color: white;
    /*padding: 5px;*/
    padding: 5px 5px 25px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
.fixedBox .list {
    display: flex;
    align-items: center;
}
.fixedBox .list li {
    margin: 0 12px;
}
.fixedBox .list a {
    white-space: nowrap;
    display: block;
    font-size: 0.9rem;
    text-align: center;
}
.fixedBox .list span {
    display: flex;
    height: 26px;
    justify-content: center;
    align-items: center;
}
.fixedBox .link {
    margin: 3px 8px 0 0;
    width: 142px;
}
.fixedBox .link a {
    display: block;
    font-size: 1.0rem;
    font-weight: bold;
    letter-spacing: 0.1em;
    color: white;
    padding: 7px 5px;
    text-align: center;
    background-color: #8C7300;
}

@media all and (max-height: 700px) {
    .mainImg h2 {
        top: 25px;
    }
}

@media all and (max-height: 500px) {
    .mainImg {
        height: 650px !important;
    }
    .mainImg .fooUl {
        height: 280px !important;
    }
}


/*------------------------------------------------------------
        common
------------------------------------------------------------*/
.comReserve {
    padding: 65px 0;
}
.comReserve h2 {
    margin-bottom: 38px;
    padding-top: 54px;
    text-align: center;
    font-size: 2rem;
    letter-spacing: 0.18em;
    position: relative;
}
.comReserve h2:after {
    width: 1px;  
    height: 44px;
    background-color: #231815;
    position: absolute;  
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    content: ""; 
}
.reserveSub {
    color: white;
    background-color: #0B821C;
}
.reserveSub .mainBox{
    width: 100%;
    max-width: 1080px;
}
.reserveSub .subInner{
    padding: 107px 12px 128px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.reserveSub .lBox {
    margin: 15px 0 0 -35px;
    width: 410px;
}
.reserveSub .lBox h3 {
    margin-bottom: 25px;
    font-size: 3.2rem;
    font-weight: 400;
    letter-spacing: 0.2em;
}
.reserveSub .lBox p {
    font-size: 1.65rem;
    letter-spacing: 0.08em;
    line-height: 2.21;
}
.reserveSub .rBox {
    margin-top: 8px;
    width: 418px;
}
.reserveSub .sub {
    padding: 0 20px 24px;
    border: 1px solid white;
    text-align: center;
    margin-bottom: 20px;
}
.reserveSub .sub p {
    margin-bottom: 39px;
    font-weight: bold;
    font-size: 2.5rem;
    letter-spacing: 0.18em;
    line-height: 1.75;
}
.reserveSub .sub .ttl {
    margin: -17px 0 35px;
    font-size: 1.86rem;
}
.reserveSub .sub .ttl span {
    display: inline-block;
    background-color: #0B821C;
    padding: 0 10px;
}
.greenLink {
    margin: 0 auto;
    width: 310px;
}
.greenLink a {
    padding: 15px 10px;
    display: block;
    font-size: 2rem;
    color: white;
    font-weight: bold;
    text-align: center;
    letter-spacing: 0.18em;
    background: url("img/common/icon09.png") no-repeat right 8px center #4B9736;
    background-size: 22px auto;
}
.greenLink a:hover {
    opacity: 0.7;
}
.reserveUl {
    display: flex;
    flex-wrap: wrap;
}
.reserveUl li {
    width: 33.333%;
}
.reserveUl img {
    width: 100%;
}

.access .mainBox {
    width: 1000px !important;
}
.access {
    padding: 107px 0;
}
.access h2 {
    margin-bottom: 16px;
    text-align: center;
    font-size: 1.9rem;
    font-style: italic;
    letter-spacing: 0.14em;
}
.accessUl {
    margin-bottom: 50px;
    display: flex;
    flex-wrap: wrap;
}
.accessUl li {
    margin-bottom: 20px;
    width: 33.333%;
}
.accessUl li .photo img {
    width: 100%;
}
.accessUl li p {
    margin-bottom: 4px;
    font-size: 1.27rem;
    letter-spacing: 0.1em;
    line-height: 1.73;
}
.mapLink {
    display: flex;
    justify-content: flex-end;
}
.mapLink a {
    display: block;
    padding: 5px 10px 5px 5px;
    width: 128px;
    box-sizing: border-box;
    text-align: center;
    font-size: 1rem;
    letter-spacing: 0.1em;
    background: url("img/common/icon10.png") no-repeat right 14px center #EBEDEC;
    background-size: 10px auto;
    border-radius: 60px;
}
.mapLink a:hover {
    opacity: 0.7;
}
.accessList {
    border-top: 1px solid #000000;
}
.accessList > li > a {
    padding: 20px;
    display: block;
    font-size: 1.525rem;
    letter-spacing: 0.14em;
    color: #898989;
    background: url("img/common/icon13.png") no-repeat right 15px center;
    background-size: 14px auto;
    border-bottom: 1px solid #000000;
}
.accessList .slideBox {
    padding: 20px;
    /*    display: none;*/
    border-bottom: 1px solid #000000;
}
.accessList .slideBox p a:hover {
    opacity: 0.7;
}
.accessList .slideBox p {
    font-size: 1.5rem;
    margin-bottom: 20px;
}
.accessList .slideBox p:last-child {
    margin-bottom: 0;
}

.insBox {
    padding: 30px 0;
    text-align: center;
}
.insBox .ins {
    margin-bottom: 30px;
}
.insBox .ins a:hover img {
    opacity: 0.7;
}
.insBox p {
    font-size: 1.87rem;
    letter-spacing: 0.18em;
    line-height: 1.85;
    font-weight: bold;
}

.blogSec {
    padding: 130px 0 79px; 
}
.blogSec:last-child {
    padding-bottom: 0;
}
.blogSec h2 {
    margin-bottom: 30px;
    text-align: center;
    font-size: 1.9rem;
    font-style: italic;
    letter-spacing: 0.14em;
}
.blogSec .mainBox {
    width: 1030px !important;
}
.blogSec .comUl li {
    width: 21%;
    margin: 0 16px 25px;
}
.blogSec .comUl li p {
    font-size: 1.34rem;
    color: #898989;
    letter-spacing: 0.08em;
}
.blogSec .comUl li .date{
    margin-bottom: 0;
    font-size: 0.9rem;
    color: #898989;
    font-weight: 500;
    font-style: italic;
    letter-spacing: 0.08em;
}
.readLink {
    margin: 0 15px;
    display: flex;
    justify-content: flex-end;
}
.readLink a {
    display: inline-block;
    font-size: 1rem;
    font-weight: bold;
    font-style: italic;
    letter-spacing: .14em;
    border-bottom: 1px solid #231815;
}
.readLink a:hover {
    opacity: 0.7;
}
.freeSec {
    margin: 0 auto;
    width: 635px;
}
.freeSec a {
    padding: 28px 15px 27px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    background-color: #8C7300;
}
.freeSec a:hover {
    opacity: 0.7;
}
.freeSec .lBox {
    width: 312px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.freeSec .lBox .ttl {
    margin-right: 13px;
    width: 85px;
    height: 85px;
    font-size: 3rem;
    color: #8C7300;
    letter-spacing: 0.1em;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: white;
    box-sizing: border-box;
    padding-bottom: 5px;
    border-radius: 100%;
}
.freeSec .lBox .textBox {
    flex: 1;
}
.freeSec .lBox .textBox p {
    font-size: 1rem;
    letter-spacing: 0.14em;
    line-height: 1.74;
    color: white;
}
.freeSec .lBox .textBox .txt {
    font-size: 2.24rem;
    font-weight: bold;
    letter-spacing: 0.2em;
    line-height: 1.2;
    margin-bottom: 10px;
}
.freeSec .rBox {
    margin: 0 5px;
    flex: 1;
}
.freeSec ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.freeSec li {
    width: 48.9%;
}
.freeSec li img {
    width: 100%;
}

@media all and (max-width: 896px) {
    .comReserve h2 {
        margin-bottom: 22px;
    }
    .reserveSub .subInner {
        display: block;
        padding: 94px 0px 58px;
    }
    .reserveSub .lBox {
        width: auto;
        margin: 0 0 58px;
    }
    .reserveSub .rBox{
        margin: 0 5px;
        width: auto;
    }
    .reserveSub .lBox h3 {
        margin-bottom: 18px;
        font-weight: 400;
        font-size: 2.7rem;
    }
    .reserveSub .lBox p {
        font-size: 1.4rem;
        letter-spacing: 0.08em;
        line-height: 2.06;
    }
    .reserveSub .sub p {
        margin-bottom: 17px;
        font-size: 2.24rem;
        line-height: 1.7;
    }
    .reserveSub .sub .ttl {
        margin: -20px 0 45px;
        font-size: 1.8rem;
        color: #4B9736;
    }
    .reserveSub .sub .ttl span {
        background-color: white;
        padding: 5px 35px;
    }
    .greenLink {
        margin: 0;
        width: auto;
    }
    .greenLink a {
        font-size: 2.14rem;
    }
    .reserveSub .sub {
        padding-bottom: 60px;margin-bottom: 40px;
    }
    .reserveSub .greenLink {
        margin: 0 5px;
    }
    .reserveSub .greenLink a {
        font-size: 1.8rem;
        padding: 13px 10px;
        background-size: 19px auto;
    }
    .access {
        padding: 60px 23px;
    }
    .access .mainBox {
        width: auto !important;
    }
    .accessUl {
        margin-bottom: 58px;
        display: block;
    }
    .accessUl li {
        margin: 0 !important;
        width: auto;
    }
    .accessUl li p {
        margin-bottom: -5px;
        font-size: 1.4rem;
        line-height: 1.73;
    }
    .mapLink {
        margin-right: 5px;
    }
    .mapLink a {
        width: 140px;
        font-size: 1.12rem;
        letter-spacing: 0.1em;
    }
    .reserveUl {
        display: block;
    }
    .reserveUl li {
        width: auto;
    }
    .accessList > li > a {
        padding: 11px 0;
    }
    .insBox {
        padding: 85px 0;
    }
    .accessList .slideBox {
        padding: 20px 10px;
    }
    .insBox .ins img {
        width: 33px;
    }
    .insBox .ins {
        margin-bottom: 12px;
    }
    .comUl li a {
        display: block;
    }
    .blogSec .mainBox {
        width: auto !important;
    }
    .insBox p {
        font-size: 1.4rem;
    }
    .blogSec {
        padding: 80px 0 62px;
    }
    .blogSec .comUl li {
        width: auto;
        margin: 0 0 0 0;
    }
    .blogSec h2 {
        margin-bottom: 16px;
    }
    .comUl li .photo {
        margin-bottom: 8px;
        width: auto;
    }
    .comUl li .txtBox {
        width: auto;
    }
    .comUl {
        margin: 0 0 30px 24px;
    }
    .blogJsBox .slick-slide > div {
        margin-right: 28px;
        width: 216px;
    }
    .readLink {
        margin: 0 25px;
    }
    .freeSec {
        margin: 0 24px;
        width: auto;
    }
    .freeSec a {
        display: block;
    }
    .freeSec .lBox {
        width: auto;
    }
    .freeSec .rBox {
        display: none;
    }
    .freeSec .lBox .textBox p {
        margin-right: -10px;
    }
}


.contactBox {
    margin: 0 auto 105px;
    width: 900px;
}
.contactBox h2 {
    margin-bottom: 27px;
    font-weight: 400;
    text-align: center;
    font-size: 3.25rem;
    letter-spacing: 0.14em;
}
.contactBox .inner {
    padding: 13px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    border: 5px solid #AB972F;
    box-sizing: border-box;
}
.contactBox .inner .photoBox {
    width: 50%;
}
.contactBox .inner .rBox {
    padding-left: 15px;
    flex: 1;
    text-align: center;
}
.contactBox .inner .rBox h3 {
    margin-bottom: 15px;
    font-size: 2.4rem;
    letter-spacing: 0.1em;
    color: #AB972F;
    line-height: 1.54;
}
.contactBox .inner .rBox p {
    margin-bottom: 22px;
    font-size: 1.6rem;
    letter-spacing: 0.08em;
    line-height: 1.82;
}
.comLink02 {
    margin: 0 auto;
    max-width: 265px;
}
.comLink02 a {
    display: block;
    color: white;
    font-size: 2.1rem;
    font-weight: bold;
    letter-spacing: 0.18em;
    background-color: #AB972F;
    border-radius: 60px;
    text-align: center;
    padding: 12px 5px;
}
.comLink02 a:hover {
    opacity: 0.7;
}

@media all and (max-width: 896px) {
    .contactBox {
        margin-bottom: 30px;
        width: auto;
    }
    .contactBox h2 {
        margin-bottom: 15px;
        font-size: 2.85rem;
    }
    .contactBox .inner {
        display: block;
        padding: 0;
        border: none;
    }
    .contactBox .inner .photoBox {
        width: auto;
        margin-bottom: 30px;
    }
    .contactBox .inner .photoBox img {
        width: 100%;
    }
    .contactBox .inner .rBox {
        padding: 47px 20px;
        border: 5px solid #AB972F;
        margin: 0 23px;
        position: relative;
    }
    .contactBox .inner .rBox:after {
        width: 23px;  
        height: 14px;
        background: url("img/partner_store/bg.png") no-repeat;
        background-size: 100% auto;
        position: absolute;  
        top: 150px;
        right: -23px;  
        content: ""; 
    }
    .contactBox .inner .rBox h3 {
        font-size: 2.7rem;
        letter-spacing: 0.1em;
        line-height: 1.46;
    }
    .contactBox .inner .rBox p {
        margin-bottom: 28px;
    }
}

@media all and (max-height: 500px) {
    .indexVisual {
        height: 500px !important;
    }
}
.accessList > li > a.on {
    color: #231815 !important;
    background-image: url("img/common/icon11-on.png.html") !important;
}

@media all and (min-width: 897px) {
    #pagePath li a:hover {
        text-decoration: underline;
    }
    .menuBox {
        display: none !important;
    }
    #gFooter .fBox .lBox p a:hover {
        text-decoration: none;
    }
    .accessList > li > a:hover {
        color: #231815;
        background-image: url("img/common/icon11.png");
    }
}

@media all and (max-width: 374px) {
    .system .inner .textBox .ttl {
        letter-spacing: 0;
    }
    .system .banner a .txtSpan {
        font-size: 1.4rem;
    }
    .plan .imgBox .textBox {
        padding-left: 30px;
        padding-right: 30px;
    }
    #gFooter .fNavi li a {
        font-size: 1.1rem;
    }
    #gFooter .lBox .list li {
        margin: 0 7px;
    }
    .service .jsBox02 .fooUl .slick-slide {
        margin-right: 40px;
    }
    .plan .inner .planDl dd {
        font-size: 1.5rem;
    }
    .plan .inner .planDl dd .num {
        font-size: 1.9rem;
    }
    .plan .inner .planDl dd .redSpan {
        margin-left: 5px;
    }
    .plan .inner .planDl dd .redSpan {
        font-size: 1.3rem;
    }
    .mainImg .textImg {
        max-width: 300px;
    }
    .flowBox h3 {
        font-size: 1.6rem;
    }
    .flowBox h2 {
        font-size: 2rem;
    }
    .flowBox .innerBox .txt {
        font-size: 1.7rem;
    }

    .fixedBox .link {
        width: 120px;
    }
    .fixedBox .list li {
        margin: 0 10px;
    }
    #gHeader h1 {
        width: 230px;
    }
    #gFooter .fInner .lBox p {
        font-size: 1.3rem;
    }
    .reserveSub .lBox h3 {
        font-size: 2.5rem;
    }
    .reserveSub .sub p {
        font-size: 1.9rem;
    }
}




@media all and (-ms-high-contrast:none){
    #gFooter,
    #gHeader {
        font-family: 'Noto Sans JP', sans-serif;
    }
    #gFooter .serif {
        font-family: 'Noto Serif JP', serif;
    }
}

.accessUl {
    padding-top: 12px;
    margin-bottom: 12px;
}
.mapBox h3 {
    margin-bottom: 27px;
    font-size: 1.87rem;
    letter-spacing: 0.18em;
    line-height: 1.96;
    text-align: center;
    font-feature-settings: "palt";
    -moz-font-feature-settings: "palt";
}
.mapBox .map {
    margin: 0 auto;
    width: 1000px;
    height: 500px;
    overflow: hidden;
}
.mapBox .map iframe {
    margin-top: -70px;
    width: 100%;
    height: 520px;
}

@media all and (max-width: 896px) {
    .accessUl {
        padding-top: 15px;
        margin: 0 -23px 37px;
    }
    .accessUl .slick-list {
        padding-right: 40px;
    }
    .accessUl .slick-slide > div {
        width: 335px;
    }
    .access .map {
        width: auto;
        margin-bottom: 52px;
        height: 53.93vw;
    }
    .access .map iframe {
        height: calc(100% + 70px);
    }
    .access .map img {
        height: 100%;
    }
    .mapBox h3 {
        margin-left: -10px;
        margin-right: -10px;
    }
}

/*------------------------------------------------------------
        shoplist
------------------------------------------------------------*/
.shoplist {
    padding-top: 75px;
}
.shoplist .infoList {
    margin: 0 -5px 205px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.shoplist .infoList > li {
    width: 43%;
}
.shoplist .infoList > li .ttl {
    padding: 8px 10px 9px 35px;
    font-size: 1.93rem;
    color: white;
    letter-spacing: 0.14em;
    background-color: #8C7300;
    border-radius: 11px;
    font-weight: bold;
}
.shoplist .infoList > li .ttl02 {
    background-color: #6F6E6F;
}
.shoplist .infoList .subUl {
    padding: 30px 0 0 32px;
    font-weight: bold;
}
.shoplist .infoList .subUl li{
    margin-bottom: 33px;
}
.shoplist .infoList .subUl li a {
    font-size: 2.13rem;
    letter-spacing: 0.14em;
    text-decoration: underline;
}
.shoplist .infoList .subUl li .new {
    letter-spacing: 0.14em;
    padding: 2px;
    margin-left: 10px;
    vertical-align: 4px;
    display: inline-block;
    font-size: 1.1rem;
    color: white;
    width: 51px;
    border-radius: 3px;
    text-align: center;
    background-color: #D82317;
}
.shoplist .topLink {
    padding-bottom: 68px;
    text-align: center;
}
.shoplist .topLink a {
    padding-top: 70px;
    font-weight: 500;
    display: inline-block;
    font-size: 1.73rem;
    letter-spacing: 0.14em;
    background: url("img/common/img02.png") no-repeat center top;
    background-size: 28px auto;
}
.shoplist .topLink a:hover {
    opacity: 0.7;
}
@media all and (max-width: 896px) {
    .shoplist {
        padding: 4px 0 0;
    }
    .shoplist .infoList > li {
        width: 45.2%;
    }
    .shoplist .infoList > li .ttl {
        font-size: 1.45rem;
        border-radius: 8px;
        padding: 7px 2px 6px 15px;
    }
    .shoplist .infoList .subUl {
        padding: 23px 0 0 14px;
    }
    .shoplist .infoList .subUl li {
        margin-bottom: 25px;
    }
    .shoplist .infoList .subUl li a {
        font-size: 1.6rem;
    }
    .shoplist .infoList .subUl li .new {
        font-size: 0.83rem;
        width: 38px;
        margin-left: 6px;
    }
    .shoplist .infoList {
        margin: 0 17px 45px;
    }
    .shoplist .topLink {
        padding-bottom: 40px;
    }
    .shoplist .topLink a {
        padding-top: 54px;
        font-size: 1.3rem;
        background-size: 21px auto;
    }
}

@media all and (min-width: 897px) {
    .shoplist .infoList .subUl li a:hover {
        text-decoration: none;
    }
}

@media all and (min-width: 897px) and (max-width: 1100px) {
    #gHeader h1 {
        width: 224px;
    }
    #gHeader .naviUl li {
        margin-left: 7px;
    }
    #gHeader .link {
        width: 150px;
    }
    #gHeader .link a {
        font-size: 1rem;
    }
}
.i4ewOd-pzNkMb-haAclf {
    display: none !important;
}


#footer {
    position: relative;
    padding: 170px 0;
    overflow: hidden
}

#footer a {
    color: #fff
}

#footer_overlay {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.footer_bg_image {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.footer_bg_image.mobile {
    display: none
}

#footer_video {
    position: absolute;
    left: 0;
    width: 100vw;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media screen and (max-width:950px) {
    #footer_video {
        width: auto;
        height: 100%;
        left: 50%;
        top: 50%;
        -ms-transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }
}

#footer_logo {
    margin: 0;
    text-align: center;
    position: relative;
    z-index: 2
}

#footer_logo .logo {
    line-height: 1;
    padding: 0;
    font-weight: 500;
    font-size: 30px;
}

#footer_logo img {
    display: block;
    margin: 0 auto;
    -webkit-transition: opacity .35s ease-in-out;
    transition: opacity .35s ease-in-out
}

#footer_logo img:hover {
    opacity: .5
}

#footer_logo .pc_logo_text {
    display: block
}

#footer_logo .mobile_logo_image {
    display: none
}

#footer_logo .mobile_logo_text {
    display: none
}

#footer_logo .desc {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 0 25px
}

.footer_info {
    margin: 20px 0 0;
    line-height: 2;
    font-size: 16px;
    z-index: 20;
    text-align: center;
    position: relative;
    color: #fff;
}

.footer_info.mobile {
    display: none
}

#footer_sns {
    margin: 20px 0 0;
    font-size: 0;
    z-index: 20;
    text-align: center;
    position: relative
}

#footer_sns li {
    display: inline-block;
    margin: 0 10px;
    position: relative
}

#footer_sns li a {
    display: block;
    overflow: hidden;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    position: relative
}

#footer_sns li a span {
    display: none
}

#footer_sns li a:before {
    font-family: 'design_plus';
    font-size: 15px;
    display: block;
    position: absolute;
    top: 1px;
    left: 0;
    right: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

#footer_sns li.twitter a:before {
    content: '\e904'
}

#footer_sns li.facebook a:before {
    content: '\e902'
}

#footer_sns li.insta a:before {
    content: '\ea92'
}

#footer_sns li.pinterest a:before {
    content: '\e905'
}

#footer_sns li.google a:before {
    content: '\e900'
}

#footer_sns li.youtube a {
    width: 45px
}

#footer_sns li.youtube a:before {
    content: '\ea9e'
}

#footer_sns li.contact a:before {
    content: '\f003'
}

#footer_sns li.rss a:before {
    content: '\e90b'
}

#footer_menu {
    position: absolute;
    bottom: 60px;
    width: 100%;
    height: 60px;
    border-top: 1px solid rgba(255, 255, 255, .4);
    z-index: 10
}

#footer_menu ul {
    text-align: center;
    font-size: 0;
    z-index: 2;
    width: 1160px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

#footer_menu li {
    font-size: 14px;
    display: inline-block;
    border-left: 1px solid rgba(255, 255, 255, .4);
    -ms-flex: 1 1 0%;
    -webkit-flex: 1 1 0%;
    flex: 1 1 0%
}

#footer_menu li:last-of-type {
    border-right: 1px solid rgba(255, 255, 255, .4)
}

#footer_menu li a {
    height: 60px;
    display: block
}

#footer_menu a span.title {
    max-height: 21px;
    position: relative;
    overflow: hidden;
    display: block;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

#footer_menu a span.title_inner {
    display: block;
    position: relative;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s
}

#footer_menu a span.main {
    display: block
}

#footer_menu a span.sub {
    display: block
}

#footer_menu a:hover span.title_inner,
.global_menu>ul>li.active_button>a span.title_inner,
.global_menu>ul>li.active>a span.title_inner {
    -webkit-transform: translate3d(0, -16px, 0);
    transform: translate3d(0, -21px, 0)
}

#footer_menu a:hover span.no_sub_title span.title_inner {
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important
}

#copyright {
    position: absolute;
    bottom: 0;
    width: 100%;
    line-height: 60px;
    height: 60px;
    font-size: 12px;
    z-index: 10;
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, .4);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#return_top {
    display: block
}

#return_top a {
    background: #222;
    display: block;
    height: 126px;
    width: 300px;
    line-height: 60px;
    text-decoration: none;
    z-index: 100;
    position: relative;
    background: url(img/ball-02.png) center center no-repeat;
    background-size: contain;
    opacity: 1;
}

/*#return_top span {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    display: block
}

#return_top a:before {
    color: #fff;
    font-family: 'design_plus';
    content: '\e911';
    font-size: 12px;
    display: block;
    width: 12px;
    height: 12px;
    position: absolute;
    left: 0;
    right: 0;
    top: 4px;
    margin: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}*/

#return_top {
    position: fixed;
    right: 15px;
    bottom: 15px;
    z-index: 999;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-transition: -webkit-transform .35s;
    transition: all .35s
}

#return_top.active {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

#fixed_footer_content {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 120px;
    color: #fff;
    padding: 40px;
    z-index: 9999;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-transition: -webkit-transform .35s;
    transition: transform .35s
}

#fixed_footer_content.active {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

#fixed_footer_content a {
    color: #fff;
    text-decoration: none
}

#fixed_footer_content .content_left {
    position: absolute;
    left: 40px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: -webkit-calc(100% - 530px);
    width: calc(100% - 530px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#fixed_footer_content .has_image .content_left {
    width: -webkit-calc(100% - 840px);
    width: calc(100% - 840px)
}

#fixed_footer_content .button {
    position: absolute;
    right: 55px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    min-width: 300px;
    height: 55px;
    line-height: 55px;
    text-align: center;
    display: inline-block;
    padding: 0 40px 0 10px;
    font-size: 16px
}

#fixed_footer_content .button:after {
    font-family: 'design_plus';
    content: '\e910';
    color: #fff;
    font-size: 14px;
    display: block;
    position: absolute;
    top: 1px;
    right: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

#fixed_footer_content .image {
    position: absolute;
    right: 55px;
    max-width: 728px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

#fixed_footer_content .image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block
}

#fixed_footer_content .close {
    position: absolute;
    right: 5px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 100%
}

#fixed_footer_content span {
    display: none
}

#fixed_footer_content .close:before {
    font-family: 'design_plus';
    color: #fff;
    font-size: 20px;
    display: block;
    content: '\e91a';
    position: absolute;
    top: 10px;
    left: 10px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

#fixed_footer_content .close:hover {
    background: rgba(255, 255, 255, .1)
}

#fixed_footer_content .catch {
    font-size: 21px;
    margin: 0;
    line-height: 1.5
}

#fixed_footer_content .desc {
    font-size: 14px;
    margin: 5px 0 0;
    line-height: 2
}

#fixed_footer_content .pr {
    background: #fff;
    color: #333;
    display: inline;
    font-size: 12px;
    margin: 5px 15px 0 0;
    padding: 0 12px;
    border-radius: 2px;
    height: 20px;
    line-height: 20px;
    float: left
}

#fixed_footer_content .pr1 {
    display: none
}

#fixed_footer_content .free {
    width: 100%;
    padding-right: 100px;
    position: absolute;
    left: 40px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

#fixed_footer_content .post_content p {
    margin: 0;
    line-height: 1.6
}

.l-shop-plan {
    text-align: center;
    padding: 24px 12px 0;
    margin: 0 auto;
    max-width: 1080px;
    letter-spacing: 1px;
}
.migi-sankaku {
    width: 20px;
    display: inline-block;
    padding-bottom: 2px;
}


.home-plan .c-table__save {
    margin-bottom: 100px;
}
.home-plan .c-table__save dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
    margin-bottom: 4px;
}
.home-plan .c-table__save dl.two-child {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}
.home-plan .c-table__save dl:first-child {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
.home-plan .c-table__save dl dt {
    padding: 18px 15px;
    font-size: 16px;
}
.home-plan .c-table__save dl dd {
    font-size: 12px;
    font-weight: 400;
    background: #eaeaea;
    padding: 8px 2px;
}
.home-plan .c-table__save dl dt {
    width: 24%;
    color: #fff;
    /* background: #14a745; */
    background: #118E3B;
    text-align: center;
    font-weight: 700;
    line-height: 27px;
    margin-right: 0px;
	display: flex;
  align-items: center;
  justify-content: center;
}
.home-plan .c-table__save dl:first-child dt {
    display: none;
}
.home-plan .c-table__save dl dd {
    margin-left: 3px;
    max-width: calc(76% - 3px);
    width: 100%;
    text-align: center;
    background: #eaeaea;
    font-weight: 700;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.home-plan .c-table__save dl:first-child dd {
    color: #fff;
    background: #838282;
    text-align: center;
    font-weight: 700;
    line-height: 24px;
    width: 100%;
    max-width: calc(22% - 3px);
}
.home-plan .c-table__save dl dd.sm-only {
    display: none;
}
.home-plan .c-table__save dl.five-child dd {
    max-width: 15.79%;
}
.home-plan .c-table__save dl.four-child dd {
    max-width: 33.333333%;
}
.home-plan .c-table__save span.normal-price {
    display: inline-block;
    margin-top: 0px;
}
.home-plan .c-table__save span.campaign-price {
    color: #b93a2c;
    display: inline-block;
    margin-left: 10px;
    font-weight: 600;
    margin: 0px;
    font-size: 18px;
}

.home-plan .c-table__save span {
    display: block;
    text-align: left;
    margin-top: 15px;
    line-height: 24px;

    font-weight: 700;
}
.home-plan .c-table__save dl.top_row dd.col2{
	background:url(img/index/bg_box.png) no-repeat #A23831;
	color:#fff;
}
.home-plan .c-table__save dl.top_row dd.col3{
	background:url(img/index/bg_box.png) no-repeat #56644E;color:#fff;
}
.home-plan .c-table__save dl.top_row dd.col4{
	background:#AB9B4F;color:#fff;
}
.home-plan .c-table__save dl.top_row dd.col5{
	background:#E3BD53;color:#fff;
}
@media (min-width: 560px){
    .home-plan .l-shop-plan .c-table__save dl:first-of-type dt {
        display: block;
        font-size: 0;
        background-color: #118E3B;
    }
    .home-plan .l-shop-plan .c-table__save dl:first-of-type dd:first-child {
        color: #838282;
        text-indent: -10000px;font-size: 0;
    }

    .home-plan .c-table__save dl.four-child dd{
        max-width: 24%;
        margin-right: 1%;
    }

    .home-plan .c-table__save dl.four-child dd:last-child{
        margin-right: 0;
    }
}
@media (min-width: 768px){
    .home-plan .l-shop-plan .c-table__save dl {
        justify-content: flex-start;
        margin-bottom: 2px;
    }
    .home-plan .c-table__save dl.four-child dd{
        max-width: 22%;
    }
}
@media (min-width: 960px){
    .home-plan .l-shop-plan .c-table__save dl dd {
        font-size: 17px;
        padding: 20px 12px;
    }
    .home-plan .c-table__save dl.four-child dd{
        max-width: calc(22% - 3px);
        margin-right: 0;
    }
}
@media screen and (max-width: 959px){
    .home-plan .c-table__save dl dt {
        width: 31%;
        margin-right: 1%;
    }
    .home-plan .c-table__save dl.five-child dt {
        margin-right: 1%;
    }
    .home-plan .c-table__save dl dd {
        max-width: 68%;
        margin-left: 0;
    }
    .home-plan .c-table__save dl.five-child dd:not(:last-child) {
        margin-right: 1%;
    }
    .home-plan .c-table__save dl:first-child dd:not(:last-child) {
        margin-right: 1%;
    }
    .home-plan .c-table__save dl:first-child dd {
        font-size: 1.2rem;
        margin-left: 0;
        max-width: 22%;
    }
}
@media screen and (max-width: 768px){
    .home-plan .c-table__save dl{
        width: calc(100% - 20px);
        margin-left: auto;
        margin-right: auto;
    }
    .home-plan .c-table__save dl dt {
        width: 25%;
        margin-right: 1%;
    }
    .home-plan .c-table__save dl dd {
        max-width: 74%;
    }
    .home-plan .c-table__save dl:first-child dd {
        max-width: 24%;
    }
    .home-plan .l-shop-plan .c-table__save dl{
        flex-wrap: wrap;
    }
    .home-plan .l-shop-plan .c-table__save dl dt,.home-plan .l-shop-plan .c-table__save dl dd{
        width: 100%;
        max-width: 100%;
        font-size: 18px;
        margin-left: 0;
    }
    .home-plan .c-table__save span.normal-price{
        display: inline-block;
        margin-top: 0px;
        font-weight: 700;
        font-size: 18px;
    }
}
@media screen and (max-width: 559px){
    .home-plan .c-table__save dl:first-child {
        display: none;
    }
    .home-plan .c-table__save dl {
        margin-bottom: 1px;
    }
    .home-plan .c-table__save dl dt {
        margin-right: 0;
        width: 100%;
    }
    .home-plan .c-table__save dl dd {
        max-width: 100%;
    }
    .home-plan .c-table__save dl.five-child dt {
        margin-right: 0;
    }
    .home-plan .c-table__save dl dd.sm-only {
        display: block;
        max-width: 33.3333333%;
        background: #b93a2c;
        color: #fff;
        border-top: 1px solid #fff;
        border-bottom: 1px solid #fff;
    }
    .home-plan .c-table__save dl.five-child dd {
        max-width: 33.333333%;
    }
    .home-plan .c-table__save dl.five-child dd:not(:last-child) {
        margin-right: 0;
        border-right: 1px solid #fff;
    }
}
/*=============================*/
#ixchildMain{
    padding-top: 83px;
}
@media (max-width: 896px){
    #ixchildMain{
        padding-top: 50px;
    }
}
.c-wrapper {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 30px;
}
.hero {
    position: relative;
    height: 55.40625vw;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("img/1.jpg");
}
.topPage .hero {
    position: relative;
    height: calc(100vh - 82px);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("img/index/top-banner.jpg");
}
.topPage .top_btn {
  position: absolute;
  bottom: 120px;
  right: 80px;
  height: auto;
  max-width: 20%;
}
@media screen and (max-width: 960px) {
    .hero {
        height: 150vw;
    }
}
@media screen and (max-width: 767px) {
    .hero {
        height: 200vw;
        background-image: url("img/sp_top_banner.jpg");
        background-size:100% 100%;
    }
}
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.3);
}
.hero > * {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
}

.hero-message {
    color: #fff;
}
@media screen and (max-width: 767px) {
    .hero-message {
        width: 100%;
        text-align: center;
    }
}
.hero-message p {
    font-size: 4rem;
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: 0.1em;
}
.hero-message .des{margin-top:20px;}
.hero-message .des p {
    font-size: 23px;
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: 0.1em;
}
@media screen and (max-width: 1279px) {

}
@media screen and (max-width: 767px) {
    .hero-message p {
        font-size: 4.8vw;
        letter-spacing: 0.05em;
    }
}
.hero-message span {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 25px;
    font-size: 2rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.1em;
    border: 2px solid #fff;
    border-radius: 30px;
}
@media screen and (max-width: 1279px) {
    .hero-message span {
        font-size: 1.6vw;
    }
}
@media screen and (max-width: 767px) {
    .hero-message span {
        margin-top: 25px;
        font-size: 1.6rem;
    }
}
@media screen and (max-width: 350px) {
    .hero-message span {
        font-size: 1.6rem;
    }
}

.hero-scroll {
    position: absolute;
    bottom: 48px;
    right: 0;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    color: #fff;
    /*下からの距離が変化して丸の全体が上から下に動く*/
    /*上から下にかけて丸が透過→不透明→透過する*/
}
@media screen and (max-width: 1279px) {
    .hero-scroll {
        right: 25px;
    }
}
@media screen and (max-width: 767px) {
    .hero-scroll {
        bottom: 22px;
        right: 51%;
    }
}
.hero-scroll::before {
    content: "";
    position: absolute;
    top: 0;
    left: -4px;
    width: 1px;
    height: calc(100% + 48px);
    background-color: #fff;
}
@media screen and (max-width: 767px) {
    .hero-scroll::before {
        left: -6px;
        height: calc(100% + 22px);
    }
}
.hero-scroll::after {
    content: "";
    position: absolute;
    bottom: -30px;
    left: -9px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff;
    -webkit-animation: circlemove 3.6s ease-in-out infinite, cirlemovehide 3.6s ease-out infinite;
    animation: circlemove 3.6s ease-in-out infinite, cirlemovehide 3.6s ease-out infinite;
}
@media screen and (max-width: 767px) {
    .hero-scroll::after {
        bottom: -12px;
        left: -8px;
        width: 6px;
        height: 6px;
        -webkit-animation: circlemove_sp 2.6s ease-in-out infinite, cirlemovehide 2.6s ease-out infinite;
        animation: circlemove_sp 2.6s ease-in-out infinite, cirlemovehide 2.6s ease-out infinite;
    }
}
@-webkit-keyframes circlemove {
    0% {
        bottom: 65px;
    }
    40% {
        bottom: 65px;
    }
    100% {
        bottom: -70px;
    }
}
@keyframes circlemove {
    0% {
        bottom: 65px;
    }
    40% {
        bottom: 65px;
    }
    100% {
        bottom: -70px;
    }
}
@-webkit-keyframes circlemove_sp {
    0% {
        bottom: 47px;
    }
    40% {
        bottom: 47px;
    }
    100% {
        bottom: -30px;
    }
}
@keyframes circlemove_sp {
    0% {
        bottom: 47px;
    }
    40% {
        bottom: 47px;
    }
    100% {
        bottom: -30px;
    }
}
@-webkit-keyframes cirlemovehide {
    0% {
        opacity: 0;
    }
    30% {
        opacity: 0;
    }
    60% {
        opacity: 1;
    }
    80% {
        opacity: 0.9;
    }
    100% {
        opacity: 0;
    }
}
@keyframes cirlemovehide {
    0% {
        opacity: 0;
    }
    30% {
        opacity: 0;
    }
    60% {
        opacity: 1;
    }
    80% {
        opacity: 0.9;
    }
    100% {
        opacity: 0;
    }
}
.hero-scroll span {
    font-family: "Times New Roman", "Helvetica Neue", Helvetica, "Hiragino Mincho Pro", "游明朝", "Yu Mincho", YuMincho, serif;
    font-weight: bold;
    letter-spacing: 0.1em;
}
@media screen and (max-width: 1279px) {
    .hero-scroll span {
        font-size: 1.4rem;
        letter-spacing: 0.05em;
    }
}
@media screen and (max-width: 767px) {
    .hero-scroll span {
        display: block;
        font-size: 1.2rem;
    }
}

.hero-sns {
    position: absolute;
    right: -20px;
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    display: flex;
    align-items: center;
}
@media screen and (min-width: 1600px) {
    .hero-sns {
        right: -10vw;
    }
}
@media screen and (max-width: 1279px) {
    .hero-sns {
        right: 20px;
    }
}
@media screen and (max-width: 767px) {
    .hero-sns {
        display: none;
    }
}
.hero-sns .hero-sns__label {
    padding-bottom: 10px;
    margin-bottom: 10px;
    font-family: "Times New Roman", "Helvetica Neue", Helvetica, "Hiragino Mincho Pro", "游明朝", "Yu Mincho", YuMincho, serif;
    font-size: 1.8rem;
    line-height: 1.2;
    font-weight: bold;
    color: #fff;
    border-bottom: 1px solid #fff;
}
.hero-sns > div + div {
    margin-top: 10px;
}
.hero-sns > div a {
    display: flex;
    transition: -webkit-filter 0.3s;
    transition: filter 0.3s;
    transition: filter 0.3s, -webkit-filter 0.3s;
}
.hero-sns > div a:hover {
    -webkit-filter: brightness(85%);
    filter: brightness(85%);
}
.privacy {
    text-align: center;
}
@media screen and (min-width: 768px) {
    .home-plan .l-shop-plan .c-table__save dl dd.hafl{width: calc(19% - 3px);}

}	
@media screen and (max-width: 767px) {
    .hero-message .des p {text-align: left;font-size: 18px;}	
    .home-plan .c-table__save {margin-bottom: 0;}
    .sphidetext{font-size:0;text-indent:-100000px;}
    .home-plan .c-table__save dl.four-child dd.hafl {max-width: 50%;}
    .home-plan .c-table__save dl.four-child dd.hafl {max-width: 50%;}
    .border-right{border-right:1px solid #fff;}
    #return_top a {height: 90px;width: 90px;}
}	

span .sm{
    font-size: 14px!important;
    display: inline-block;
}

small .sm{
    font-size: 14px!important;
    display: inline-block;
}

@media screen and (min-width: 768px){
    .pcbr { display:block; }
    .spbr { display:none; }
}
@media screen and (max-width: 767px){
    .pcbr { display:none; }
    .spbr { display:block; }
}

.position-relative{
    position: relative;
}
.reserveSub .subInner{
    position: relative;
}
.box--link-comreserve{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.box--link-comreserve .btn01{
    width: 100%;
    height: 60%;
}
.box--link-comreserve .btn02,.box--link-comreserve .btn03{
    width: 50%;
    height: 40%;
}
@media (max-width: 767px){
    .box--link-comreserve .btn01{
        height: 44%;
    }
    .box--link-comreserve .btn02,.box--link-comreserve .btn03{
        height: 28%;
        width: 100%;
    }
}
.center{text-align:center;}
.yellow{color:#F7B52C;}
a:hover{opacity:0.7;}
.topPage .hero .c-wrapper {
  justify-content: center;
}
.hero-des {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #fff;
  max-width: 600px;
}
.top_img{max-width:500px;}
.btns {
  display: flex;
  gap: 50px;
  margin-top: 50px;
}
.golf_row .container{max-width:1270px;margin:0 auto;padding:0 15px;}
.golf_row1 .container{max-width:900px;padding:50px 15px;}
.golf_row1 .container .top{display:flex;gap: 40px;}
.golf_row1 .container h4{font-size:30px;color:#56644E}
.golf_row1 .container h3{font-size:35px;color:#56644E}
.golf_row1 .container h2{font-size:55px;color:#A23831}
.golf_row1 .container p {
  font-size: 20px;margin-top: 30px;
}
.golf_row2 {
  background: #56644E;
  color: #fff;
  padding: 40px 0;
}

.golf_row2 h2.title{font-size:35px;text-align:center;}
.golf_row2 h2.title span{font-size:45px;}
ul.list{display:flex;margin-top:60px;}
ul.list li{width:33%;position:relative;font-size:12px; text-align:center;}
ul.list li h3{position:absolute;top:-20px;left:0;width:100%;text-align:center;}
ul.list li h3 span{font-size:22px;font-weight: 700;color:#56644E;background:#F7B52C;padding:5px;border-radius:20px;width: 220px;display: block;margin: 0 auto;}
ul.list li img{margin-bottom:30px;border-radius:20px;width: 277px;}
.golf_row3 .container{padding:60px 15px;}
.golf_row3 .container .top {position: relative;display: flex;justify-content: center;align-items: center;}
.golf_row3 .container .top img{margin-right:-60px;}
.golf_row3 .container h2.title{display: flex;flex-direction: column;align-items: center;}
.golf_row3 .container h2.title span.jp{font-size:38px;color:#56644E}
.golf_row3 .container h2.title span.en{font-size:18px;color:#56644E}
ul.list1{display:flex;gap:50px;}
ul.list1 li{width:50%;}
ul.list1 li .des{position:relative;padding: 35px 0 0 100px;margin-bottom: 40px;}
ul.list1 li .des .text {position: relative;z-index: 2;}
ul.list1 li .des .number{position: absolute;top: 0;left: 0;z-index: -1;}
ul.list1 li .des h3{font-size:26px;color:#56644E;margin-bottom: 15px;}
ul.list1 li .des p{font-size:16px;color:#56644E}
ul.list1 li.img{padding-top:100px;}
.membership_campaign {
  margin-bottom: 20px;
}
.membership_campaign img{
  width:100%;
}
@media (max-width: 767px){
	.hero-des {max-width: 100%;margin-bottom: 0;}
	.top_img {max-width: 200px;}
	.hero-des p {font-size: 11px;}
	.btns {
	  gap: 20px;
	  margin-top: 10px;
	  margin-bottom: 40px;
	}
	.topPage .top_btn {
	  position: absolute;
	  bottom: 5px;
	  right: 20px;
	  height: auto;
	  max-width: 100px;
	}
	.golf_row1 .container {
	  max-width: 100%;
	  padding: 50px 15px;
	}
	.golf_row1 .container .top {
	  gap: 20px;
	}
	.golf_row1 .container .top .img {
	  width: 50px;
	}
	.golf_row1 .container h4 {
	  font-size: 18px;
	}
	.golf_row1 .container h3 {
	  font-size: 22px;;
	}
	.golf_row1 .container h2 {
	  font-size: 28px;
	}
	.golf_row1 .container p {
	  font-size: 16px;
	  margin-top: 20px;
	}
	.golf_row2 h2.title {
	  font-size: 20px;
	}
	.golf_row2 h2.title span {
	  font-size: 28px;
	}
	ul.list {
	  flex-direction: column;
	}
	ul.list li {
	  width: 100%;margin-bottom: 50px;
	}
	.golf_row3 .container {
	  padding: 30px 15px;
	}
	.golf_row3 .container .top img {
	  margin-right: -20px;
	  width: 100px;
	}
	.golf_row3 .container h2.title span.jp {
	  font-size: 28px;
	}
	ul.list1 {
	  flex-direction: column;
	}
	ul.list1 li {
	  width: 100%;
	}
	ul.list1 li.img {
	  padding-top: 30px;
	  order: -1;
	}
	ul.list1 li .des {
	  position: relative;
	  padding: 25px 0 0 65px;
	  margin-bottom: 40px;
	}
	ul.list1 li .des .number {
	  width: 70px;
	}
	ul.list1 li .des h3 {
	  font-size: 18px;line-height: 1;margin-bottom:15px;
	}
}