@charset "utf-8";
/* =========================================== */
/*common*/
/* =========================================== */
/* セクション幅 ~~~~~~~~~~~~~~~ */
section{
    padding: 75px 0;
}

@media screen and (max-width:1023px) {
    section{
        padding: 60px 0;
    }
}

@media screen and (max-width:767px) {
    section{
        padding: 30px 0;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* コンテンツ幅 ~~~~~~~~~~~~~~~ */
.contents-wrapper{
	width: calc(100% - 100px);
	max-width: 1200px;
	margin: 0 auto;
}

.contents-wrapper.min{
    max-width: 1000px;
}

@media screen and (max-width:1023px) {
    .contents-wrapper{
        width: calc(100% - 64px);
    }
}

@media screen and (max-width:767px) {
    .contents-wrapper{
        width: calc(100% - 32px);
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* セクションタイトル ~~~~~~~~~~~~~~~ */
h3{
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.5;
    letter-spacing: 0.05em;
    color: rgb(var(--brown));
}

h3 span.h3-o{
    color: rgb(var(--orange));
}

h3 span.h3-g{
    color: rgb(var(--green));
}

@media screen and (max-width:1023px) {
    h3{
        font-size: 1.8rem;
    }
}

@media screen and (max-width:767px) {
    h3{
        line-height: 1.2;
        font-size: 1.6rem;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* ボタンスタイル ~~~~~~~~~~~~~~~ */
a.btn{
    padding: 16px 30px;
    border-radius: 100px;
    overflow: hidden;
    margin: 0 auto;
    color: rgb(var(--white));
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

a.btn:hover div:last-of-type{
    transform: translateX(5px);
}

a.btn div:first-of-type{
    flex-grow: 1;
    text-align: center;
}

a.btn div:last-of-type{
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
    transition: 0.6s;
	-webkit-transition: 0.6s;
	-moz-transition: 0.6s;
	-ms-transition: 0.6s;
	-o-transition: 0.6s;
}

/* 166px */
a.btn166{
    width: 166px;
    min-width: 166px;
    height: 56px;
    background: url(../images/button-bg166.png) no-repeat center/contain;
}

/* 195px */
a.btn195{
    width: 195px;
    min-width: 195px;
    height: 56px;
    background: url(../images/button-bg195.png) no-repeat center/contain;
}

/* 250px */
a.btn250{
    width: 250px;
    height: 56px;
    min-width: 250px;
    background: url(../images/button-bg250.png) no-repeat center/contain;
}

/* 272px */
a.btn272{
    width: 272px;
    min-width: 272px;
    height: 56px;
    background: url(../images/button-bg272.png) no-repeat center/contain;
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* sec-bg ~~~~~~~~~~~~~~~ */
section{
    position: relative;
    z-index: 3;
}

section .sec-bg{
    position: absolute;
    top: 75px;
    left: 0;
    background-color: rgb(var(--bg-color));
    height: 100%;
    width: 100%;
    overflow: hidden;
    z-index: -1;
}

section .sec-bg .sec-wave,
section .sec-bg .sp-wave{
    position: absolute;
    bottom: 0;
    left: 0;
    transform: scale(-1);
}

section .sec-bg .sp-wave{
    display: none;
}

@media screen and (max-width:767px) {
    section .sec-bg .sec-wave{
        display: none;
    }

    section .sec-bg .sp-wave{
        display: block;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */



/* ============================lo=============== */
/*mv*/
/* =========================================== */
/* TOPページ ~~~~~~~~~~~~~~~ */
section.mv{
    background-color: rgb(var(--bg-color));
    padding-top: 106px;
}

section.mv .contents-wrapper{
    max-width: 100%;
    width: 100%;
    position: relative;
}

section.mv .h-group{
    position: absolute;
    top: 50%;
    left: 50px;
    transform: translateY(-50%);
}

section.mv .mv-image{
    height: 650px;
    width: 85%;
    margin-left: auto;
    border-radius: 90px 0 0 90px;
    overflow: hidden;
}

section.mv .mv-image video{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.mv .h-group h2:nth-of-type(2){
    width: fit-content;
    display: block;
    margin-bottom: 50px;
}

section.mv h2{
    font-size: 2.8125rem;
    letter-spacing: 0.05em;
    padding: 5px 10px;
    background-color: rgb(var(--white));
    display: inline-block;
    border-radius: 10px;
    margin-bottom: 15px;
}

section.mv h2 span.h2-g{
    color: rgb(var(--green));
}

section.mv h2 span.h2-o{
    color: rgb(var(--orange));
}

section.mv p{
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 10px;
    letter-spacing: 0.05em;
    background-color: rgb(var(--white));
    font-size: 1.4375rem;
}

@media screen and (max-width:1023px) {
    section.mv{
        padding-top: 61px;
    }

    section.mv .h-group{
        left: 32px;
    }

    section.mv .mv-image{
        height: 500px;
    }
}

@media screen and (max-width:767px) {
    section.mv .mv-image{
        height: 350px;
        border-radius: 60px 0 0 60px;
    }

    section.mv h2{
        font-size: 2.3rem;
    }

    section.mv .h-group h2:nth-of-type(2){
        margin-bottom: 30px;
    }

    section.mv .h-group{
        left: 16px;
    }

    section.mv p{
        font-size: 1.2rem;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* SUBページ ~~~~~~~~~~~~~~~ */
section.sub-mv{
    height: 545px;
    position: relative;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    color: rgb(var(--brown));
}

section.sub-mv .contents-wrapper{
    height: 100%;
    display: flex;
    align-items: center;
}

section.sub-mv .sec-wave,
section.sub-mv .sp-wave{
    position: absolute;
    left: 0;
    transform: scale(-1);
}

section.sub-mv .sec-wave{
    bottom: -15%;
}

section.sub-mv .sp-wave{
    bottom: -1px;
    display: none;
}

section.sub-mv .h-group{
    line-height: 1.48;
}

section.sub-mv h2{
    font-size: 2.8125rem;
    letter-spacing: 0.05em;
    padding: 5px 10px;
    background-color: rgb(var(--white));
    display: inline-block;
    border-radius: 10px;
    margin-bottom: 15px;
}

section.sub-mv h2 span.h2-g{
    color: rgb(var(--green));
}

section.sub-mv h2 span.h2-o{
    color: rgb(var(--orange));
}

section.sub-mv p{
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 10px;
    letter-spacing: 0.05em;
    background-color: rgb(var(--white));
    font-size: 1.4375rem;
}

section.sub-mv p span.s_h2-o{
    color: rgb(var(--orange));
}

@media screen and (max-width:2169px) {
    section.sub-mv .sec-wave{
        bottom: -10%;
    }
}

@media screen and (max-width:1439px) {
    section.sub-mv .sec-wave{
        bottom: -5%;
    }
}

@media screen and (max-width:1279px) {
    section.sub-mv{
        background-position: right;
    }
}

@media screen and (max-width:1023px) {
    section.sub-mv{
        height: 400px;
    }
}

@media screen and (max-width:767px) {
    section.sub-mv{
        height: 350px;
        background-position: 87%;
    }

    section.sub-mv .sec-wave{
        display: none;
    }

    section.sub-mv .sp-wave{
        display: block;
    }

    section.sub-mv h2{
        font-size: 2.3rem;
    }

    section.sub-mv p{
        font-size: 1.2rem;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* mv-animation ~~~~~~~~~~~~~~~ */
/* MV & sub-MV 共通アニメーション */
.mv .h-group h2,
.mv .h-group p,
.sub-mv .h-group h2,
.sub-mv .h-group p {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s ease, transform 1s ease;
}

.mv .h-group.show h2,
.sub-mv .h-group.show h2 {
    opacity: 1;
    transform: translateY(0);
}

.mv .h-group.show p,
.sub-mv .h-group.show p {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 1s; /* h2が出た1秒後に表示 */
}

/* ~~~~~~~~~~~~~~~~~~~~~ */



/* =========================================== */
/*top*/
/* =========================================== */
/* about-introduction ~~~~~~~~~~~~~~~ */
section.about-intro{
    background-color: rgb(var(--bg-color));
}

section.about-intro .contents-wrapper{
    position: relative;
}

section.about-intro .intro-text{
    max-width: 550px;
    width: 100%;
    padding: 40px 0;
    margin-left: auto;
    position: relative;
    z-index: 3;
}

section.about-intro .intro-text h3,
section.about-intro .intro-text p{
    margin-bottom: 35px;
}

section.about-intro .intro-text .btn{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin: 0;
}

section.about-intro .intro-text .btn div:first-of-type{
    flex-grow: 1;
    text-align: center;
}

section.about-intro .intro-text .btn div:nth-of-type(2){
    width: 10px;
    height: 10px;
}

section.about-intro .contents-wrapper > .ornament-image{
    max-width: 600px;
    width: 100%;
    position: absolute;
    left: 0;
    top: -25%;
    z-index: 2;
}

section.about-intro .intro-text .ornament-image{
    max-width: 265px;
    width: 100%;
    position: absolute;
    top: 75%;
    right: -18%;
    z-index: -1;
}

@media screen and (max-width:1445px) {
    section.about-intro .intro-text .ornament-image{
        right: -10%;
    }
}

@media screen and (max-width:1340px) {
    section.about-intro .intro-text .ornament-image{
        width: 40%;
        right: 0;
        top: 80%;
    }
}

@media screen and (max-width:1279px) {
    section.about-intro .contents-wrapper > .ornament-image{
        width: 47%;
        left: -2%;
    }
}

@media screen and (max-width:1139px) {
    section.about-intro .intro-text{
        width: 50%;
    }

    section.about-intro .contents-wrapper > .ornament-image{
        top: -10%;
    }
}

@media screen and (max-width:1023px) {
    section.about-intro .intro-text{
        width: 100%;
        padding: 0;
    }

    section.about-intro .intro-text span:not(.h3-g,.h3-o){
        display: block;
    }

    section.about-intro .intro-text h3,
    section.about-intro .intro-text p{
        margin-bottom: 20px;
    }

    section.about-intro .contents-wrapper > .ornament-image{
        max-width: 400px;
        width: 45%;
        opacity: 0.4;
        z-index: -1;
        top: -24%;
    }

    section.about-intro .intro-text .ornament-image{
        width: 30%;
        top: 83%;
    }
}

@media screen and (max-width:767px) {
    section.about-intro .contents-wrapper > .ornament-image{
        display: none;
    }

    section.about-intro .intro-text .btn{
        margin: 0 auto;
    }

    section.about-intro .intro-text{
        max-width: 100%;
    }

    section.about-intro .intro-text .ornament-image{
        bottom: auto;
        top: -5%;
        max-width: 100px;
        width: 30%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* charm ~~~~~~~~~~~~~~~ */
section.charm{
    background-color: rgb(var(--bg-color));
}

section.charm h3{
    margin-bottom: 35px;
    text-align: center;
}

section.charm .charm-list{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding-bottom: 80px;
    position: relative;
}

section.charm .charm-list .list-item{
    width: calc((100% - 20px * 2)/ 3);
    background-color: rgb(var(--white));
    overflow: hidden;
    border-radius: 35px;
    position: relative;
}

section.charm .charm-list .list-item a{
    padding: 25px 25px 50px 25px;
    height: 100%;
}

section.charm .charm-list .list-item .icon{
    width: 36px;
    height: 36px;
    margin: 0 auto 15px;
}

section.charm .charm-list .list-item p.title{
    font-size: 1.4375rem;
    text-align: center;
    margin-bottom: 15px;
}

section.charm .charm-list .list-item .circle{
    width: 60px;
    height: 60px;
    border-radius: 50px 0 0 0;
    background-color: rgb(var(--green));
    position: absolute;
    bottom: 0%;
    right: 0%;
    transition: 0.6s;
	-webkit-transition: 0.6s;
	-moz-transition: 0.6s;
	-ms-transition: 0.6s;
	-o-transition: 0.6s;
}

section.charm .charm-list .list-item .circle::before{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
    position: absolute;
    top: 26px;
    left: 28px;
}

section.charm .charm-list .list-item:hover .circle{
    filter: brightness(1.2);
}

section.charm .ornament-image{
    max-width: 190px;
    width: 100%;
    position: absolute;
    bottom: 30%;
    left: -20%;
    z-index: -1;
}

@media screen and (max-width:1439px) {
    section.charm .ornament-image{
        bottom: 0;
        left: -10%;
    }
}

@media screen and (max-width:1279px) {
    section.charm .ornament-image{
        bottom: -8%;
        left: -4%;
    }
}

@media screen and (max-width:1023px) {
    section.charm h3{
        margin-bottom: 20px;
    }

    section.charm .charm-list{
        padding-bottom: 10px;
    }

    section.charm .charm-list .list-item a{
        padding: 20px 16px 40px 16px;
    }

    section.charm .ornament-image{
        display: none;
    }
}

@media screen and (max-width:767px) {
    section.charm .charm-list{
        justify-content: center;
        padding-bottom: 0;
    }

    section.charm .charm-list .list-item{
        width: 80%;
    }

    section.charm .charm-list .list-item .circle{
        width: 55px;
        height: 55px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* look-intro ~~~~~~~~~~~~~~~ */
section.look-intro h3{
    text-align: center;
    margin-bottom: 35px;
    position: relative;
}

section.look-intro .ornament-image{
    max-width: 124px;
    width: 100%;
    position: absolute;
    top: 0;
    right: -10%;
    z-index: -1;
}

section.look-intro .season-list{
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px;
    margin-bottom: 30px;
}

section.look-intro .season-list .list-item{
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    border-radius: 35px;
    overflow: hidden;
    width: calc((100% - 20px * 2)/ 3);
    height: 100%;
}

section.look-intro .season-list .list-item .item-image{
    height: 240px;
}

section.look-intro .season-list .list-item .item-text{
    padding: 15px 20px;
}

section.look-intro .season-list .list-item .item-text p.title{
    font-size: 1.4375rem;
    margin-bottom: 5px;
}

@media screen and (max-width:1279px) {
    section.look-intro .ornament-image{
        right: -3%;
    }

    section.look-intro .season-list .list-item .item-image{
        height: 200px;
    }
}

@media screen and (max-width:1023px) {
    section.look-intro h3{
        margin-bottom: 20px;
    }

    section.look-intro .ornament-image{
        width: 13%;
    }

    section.look-intro .season-list .list-item .item-image{
        height: 150px;
    }
}

@media screen and (max-width:767px) {
    section.look-intro{
        padding-top: 60px;
    }

    section.look-intro .season-list{
        column-gap: 0;
        row-gap: 20px;
    }

    section.look-intro .season-list .list-item{
        width: 100%;
    }

    section.look-intro .ornament-image{
        display: none;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* shop ~~~~~~~~~~~~~~~ */
section.shop .contents-wrapper{
    position: relative;
}

section.shop .contents-wrapper .text{
    max-width: 650px;
    width: 100%;
    padding: 56px 0;
    position: relative;
}

section.shop .text p:first-of-type{
    font-size: 1.4375rem;
    margin-bottom: 25px;
}

section.shop .text p:nth-of-type(2){
    margin-bottom: 25px;
}

section.shop .text h3{
    margin-bottom: 35px;
}

section.shop .text .ornament-image{
    max-width: 200px;
    width: 100%;
    position: absolute;
    right: -15%;
    bottom: -5%;
}

section.shop .contents-wrapper > .ornament-image{
    max-width: 490px;
    width: 100%;
    position: absolute;
    top: -15%;
    right: 0;
    z-index: -1;
}

section.shop .text .btn{
    margin: 0;
}

@media screen and (max-width:1279px) {
    section.shop .contents-wrapper .text{
        width: 60%;
    }

    section.shop .contents-wrapper > .ornament-image {
        width: 43%;
        right: -3%;
    }
}

@media screen and (max-width:1023px) {
    section.shop .contents-wrapper .text{
        width: 100%;
    }

    section.shop .text h3{
        margin-bottom: 20px;
    }

    section.shop .contents-wrapper > .ornament-image{
        top: -10%;
        opacity: 0.4;
    }

    section.shop .text .ornament-image{
        width: 23%;
        right: 0%;
        bottom: -2%;
    }

    section.shop .text p:first-of-type,
    section.shop .text p:nth-of-type(2){
        margin-bottom: 15px;
    }
}

@media screen and (max-width:767px) {
    section.shop .contents-wrapper .text{
        padding: 0;
    }

    section.shop .contents-wrapper > .ornament-image{
        top: -8%;
        right: 0;
        width: 40%;
    }

    section.shop .text .ornament-image{
        display: none;
    }

    section.shop .text .btn{
        margin: 0 auto;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* parallax ~~~~~~~~~~~~~~~ */
.jarallax{
    margin: 75px 0;
    margin-bottom: 0;
}

.jarallax .contents-wrapper{
    height: 500px;
}

@media screen and (max-width:1023px) {
    .jarallax{
        margin: 60px 0;
        margin-bottom: 0;
    }

    .jarallax .contents-wrapper{
        height: 400px;
    }
}

@media screen and (max-width:767px) {
    .jarallax{
        margin: 30px 0;
        margin-bottom: 0;
    }

    .jarallax .contents-wrapper{
        height: 250px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* map ~~~~~~~~~~~~~~~ */
section.map-intro{
    background-color: rgb(var(--bg-color));
    padding-top: 150px;
}

section.map-intro .contents-wrapper{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 50px;
    position: relative;
}

section.map-intro figure{
    width: 42%;
}

section.map-intro .text{
    width: calc(100% - 42% - 50px);
}

section.map-intro .text h3{
    margin-bottom: 35px;
}

section.map-intro .text p{
    margin-bottom: 25px;
}

section.map-intro .text .btn{
    margin: 0;
}

section.map-intro .ornament-image{
    max-width: 250px;
    width: 100%;
    position: absolute;
    bottom: 5%;
    right: -4%;
    z-index: -1;
}

@media screen and (max-width:1279px) {
    section.map-intro .ornament-image{
        bottom: 0;
        right: 0;
        width: 20%;
    }
}

@media screen and (max-width:1023px) {
    section.map-intro{
        padding-top: 120px;
    }

    section.map-intro .text h3{
        margin-bottom: 20px;
    }

    section.map-intro .contents-wrapper{
        gap: 30px;
    }

    section.map-intro .text{
        width: calc(100% - 42% - 30px);
    }

    section.map-intro .ornament-image{
        right: -3%;
    }
}

@media screen and (max-width:767px) {
    section.map-intro{
        padding-top: 60px;
    }

    section.map-intro .contents-wrapper{
        gap: 10px;
    }

    section.map-intro figure{
        width: 100%;
    }

    section.map-intro .text{
        width: 100%;
    }

    section.map-intro .ornament-image{
        display: none;
    }

    section.map-intro .text .btn{
        margin: 0 auto;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* news-blog ~~~~~~~~~~~~~~~ */
section.news-blog{
    background-color: rgb(var(--bg-color));
}

section.news-blog .sec-bg{
    top: 100px;
}

section.news-blog .sec-bg .sec-wave,
section.news-blog .sec-bg .sp-wave{
    bottom: -10%;
    z-index: 2;
}

section.news-blog .contents-wrapper{
    display: flex;
    flex-wrap: wrap;
    column-gap: 50px;
}

section.news-blog .title{
    position: relative;
}

section.news-blog .title h3{
    margin-bottom: 35px;
}

section.news-blog .title .ornament-image{
    max-width: 290px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

section.news-blog .topics-list{
    max-width: 680px;
    flex-grow: 1;
}

section.news-blog .topics-list .list-item{
    border-radius: 30px;
    overflow: hidden;
}

section.news-blog .topics-list .list-item:not(:last-of-type){
    margin-bottom: 20px;
}

section.news-blog .topics-list .list-item a{
    padding: 25px 25px;
    background-color: rgb(var(--white));
}

section.news-blog .topics-list .list-item .date{
    color: rgb(var(--green));
    margin-bottom: 5px;
}

section.news-blog .topics-list .list-item p.title{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

section.news-blog .topics-list + a.btn{
    display: none;
}

@media screen and (max-width:1279px) {
    section.news-blog .sec-bg .sec-wave{
        bottom: -5%;
    }
}

@media screen and (max-width:1023px) {
    section.news-blog .title h3{
        margin-bottom: 20px;
    }

    section.news-blog .sec-bg .sec-wave{
        bottom: -2%;
    }
}

@media screen and (max-width:767px) {
    section.news-blog .title{
        width: 100%;
    }

    section.news-blog .title h3{
        text-align: center;
    }

    section.news-blog .title .ornament-image{
        width: 25%;
        left: auto;
        right: 0;
        bottom: -10%;
    }

    section.news-blog .title h3 + a.btn{
        display: none;
    }

    section.news-blog .topics-list + a.btn{
        display: flex;
    }

    section.news-blog .topics-list{
        margin-bottom: 20px;
        max-width: 100%;
        width: 100%;
    }

    section.news-blog .sec-bg{
        top: 45px;
    }

    section.news-blog .sec-bg .sp-wave{
        bottom: 0;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* company-intro ~~~~~~~~~~~~~~~ */
section.company-intro .contents-wrapper{
    position: relative;
}

section.company-intro .text{
    max-width: 660px;
    width: 100%;
    padding:75px 0;
    position: relative;
}

section.company-intro .text p{
    margin-bottom: 25px;
}

section.company-intro .text a.btn{
    margin: 0;
}

section.company-intro .text .ornament-image{
    max-width: 170px;
    width: 100%;
    position: absolute;
    right: -8%;
    bottom: -5%;
}

section.company-intro .text h3{
    margin-bottom: 35px;
}

section.company-intro .contents-wrapper > .ornament-image{
    max-width: 500px;
    width: 100%;
    position: absolute;
    top: -5%;
    right: 0;
}

@media screen and (max-width:1279px) {
    section.company-intro .text{
        width: 55%;
    }

    section.company-intro .contents-wrapper > .ornament-image{
        width: 47%;
        top: 8%;
        right: -4%;
    }
}

@media screen and (max-width:1023px) {
    section.company-intro .text h3{
        margin-bottom: 20px;
    }

    section.company-intro .text{
        width: 100%;
    }

    section.company-intro .contents-wrapper > .ornament-image{
        z-index: -1;
        opacity: 0.4;
    }

    section.company-intro .text .ornament-image{
        width: 20%;
        right: 0;
    }
}

@media screen and (max-width:767px) {
    section.company-intro .text{
        padding: 50px 0;
    }

    section.company-intro .text a.btn{
        margin: 0 auto;
    }

    section.company-intro .text .ornament-image{
        display: none;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* access ~~~~~~~~~~~~~~~ */
section.access h3{
    margin-bottom: 35px;
    text-align: center;
}

section.access .access-intro{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 35px;
    position: relative;
}

section.access .access-intro .ornament-image{
    max-width: 150px;
    width: 100%;
    position: absolute;
    top: -30%;
    right: -10%;
}

section.access .access-intro .access-way{
    max-width: 490px;
    width: 100%;
}

section.access .access-intro .access-way .list-item:first-of-type{
    padding: 0 5px 15px 5px;
}

section.access .access-intro .access-way .list-item:not(:first-of-type){
    padding: 15px 5px;
}

section.access .access-intro .access-way .list-item{
    background-image : linear-gradient(to right, rgb(var(--yellow-green)) 6px, transparent 6px);
    background-size: 10px 1px;
    background-repeat: repeat-x;
    background-position: left bottom;
}

section.access .access-intro .access-way .list-item p.title{
    margin-bottom: 5px;
}

section.access .access-intro .map{
    width: calc(100% - 490px - 35px);
}

section.access .access-intro .map .map-wrap{
    height: 320px;
    margin-bottom: 25px;
}

section.access a.btn div:last-of-type{
    height: 14px;
    background: none;
}

section.access a.btn:hover{
    filter: brightness(1.2);
}

section.access a.btn:hover div:last-of-type{
    transform: none;
}

section.access a.btn.sp{
    display: none;
}

@media screen and (max-width:1279px) {
    section.access .access-intro .ornament-image{
        right: -2%;
    }
}

@media screen and (max-width:1023px) {
    section.access h3{
        margin-bottom: 20px;
    }

    section.access .access-intro .access-way{
        max-width: 350px;
    }

    section.access .access-intro .map{
        width: calc(100% - 350px - 20px);
    }

    section.access .access-intro{
        column-gap: 20px;
    }

    section.access .access-intro .ornament-image{
        width: 11%;
        top: -25%;
    }
}

@media screen and (max-width:767px) {
    section.access .access-intro .map{
        width: 100%;
    }

    section.access a.btn{
        display: none;
    }

    section.access a.btn.sp{
        display: flex;
    }

    section.access .access-intro .access-way{
        margin-bottom: 25px;
        max-width: 100%;
    }

    section.access .access-intro .access-way .list-item:nth-of-type(4) span.none{
        display: none;
    }

    section.access .access-intro .ornament-image{
        display: none;
    }
}


/* =========================================== */
/*about*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.about-bg{
    background-image: url(../images/about_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* about-introduction ~~~~~~~~~~~~~~~ */
section.about-introduction{
    padding-top: 100px;
}

section.about-introduction .contents-wrapper{
    position: relative;
}

section.about-introduction h3{
    margin-bottom: 50px;
    text-align: center;
}

section.about-introduction h3 + p{
    max-width: 760px;
    width: 100%;
    margin: 0 auto;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.about-introduction .ornament-image{
    max-width: 265px;
    width: 100%;
    position: absolute;
    top: -30%;
    left: 0;
}

@media screen and (max-width:1279px) {
    section.about-introduction .ornament-image{
        max-width: 230px;
        top: -25%;
    }
}

@media screen and (max-width:1023px) {
    section.about-introduction{
        padding-top: 80px;
    }

    section.about-introduction h3{
        margin-bottom: 20px;
    }

    section.about-introduction .ornament-image{
        width: 25%;
    }
}

@media screen and (max-width:767px) {
    section.about-introduction{
        padding-top: 40px;
    }

    section.about-introduction h3 + p{
        line-height: 1.2;
    }

    section.about-introduction .ornament-image{
        max-width: 210px;
        width: 18%;
    }
}

@media screen and (max-width:420px) {
    section.about-introduction .ornament-image{
        top: -13%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* lead-wish ~~~~~~~~~~~~~~~ */
section.lead-wish .contents-wrapper{
    margin-bottom: 70px;
}

section.lead-wish .ornament-image{
    border-radius: 35px;
    overflow: hidden;
}

section.lead-wish .ornament-image:nth-of-type(2){
    max-width: 300px;
    width: 100%;
    margin-left: 150px;
    margin-top: -60px;
}

section.lead-wish .ornament-image:nth-of-type(3){
    max-width: 500px;
    width: 100%;
    margin-left: auto;
    margin-top: -150px;
}

section.lead-wish .text{
    border-radius: 35px;
    background-color: rgb(var(--white));
    padding: 30px 45px;
    position: relative;
    max-width: 700px;
    width: 100%;
    margin-top: -130px;
}

section.lead-wish .text h3{
    margin-bottom: 35px;
}

section.lead-wish .text .ornament-image{
    max-width: 265px;
    width: 100%;
    position: absolute;
    bottom: 4%;
    right: -33%;
}

@media screen and (max-width:1439px) {
    section.lead-wish .contents-wrapper{
        margin-bottom: 0;
    }
}

@media screen and (max-width:1100px) {
    section.lead-wish .ornament-image:nth-of-type(2){
        margin-left: 100px;
    }
}

@media screen and (max-width:1023px) {
    section.lead-wish .ornament-image:nth-of-type(2){
        margin-left: 0;
        max-width: 230px;
        margin-top: -30px;
    }

    section.lead-wish .ornament-image:nth-of-type(3){
        max-width: 400px;
    }

    section.lead-wish .text{
        width: 88%;
        padding: 20px 40px;
        margin-top: -100px;
    }

    section.lead-wish .text h3{
        margin-bottom: 20px;
    }

    section.lead-wish .text .ornament-image{
        max-width: 200px;
        bottom: -9%;
        right: -13%;
    }
}

@media screen and (max-width:767px) {
    section.lead-wish .ornament-image:nth-of-type(2){
        margin-top: -15px;
        max-width: 150px;
    }

    section.lead-wish .ornament-image:nth-of-type(3){
        max-width: 250px;
        margin-top: -80px;
    }

    section.lead-wish .text{
        width: 93%;
        padding: 20px 25px;
        margin-top: -60px;
    }

    section.lead-wish .contents-wrapper{
        margin-bottom: 20px;
    }

    section.lead-wish .text .ornament-image{
        max-width: 130px;
        right: -8%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* greeting ~~~~~~~~~~~~~~~ */
section.greeting{
    padding-top: 150px;
}

section.greeting .flex-box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 50px;
}

section.greeting .text{
    max-width: 650px;
    padding-right: 100px;
}

section.greeting .text-inner .ornament-image{
    max-width: 130px;
    width: 100%;
    position: absolute;
    top: 10%;
    right: 0;
}

section.greeting .text .text-inner{
    max-width: 550px;
    position: relative;
}

section.greeting figure{
    width: calc(100% - 50px - 650px);
    padding-left: 55px;
    flex-grow: 1;
}

section.greeting figure img{
    object-fit: contain;
}

section.greeting h3{
    margin-bottom: 35px;
}

section.greeting .lead-text{
    font-size: 2rem;
    line-height: 1.5;
    letter-spacing: 0.05em;
    color: rgb(var(--brown));
    margin-bottom: 35px;
}

section.greeting .lead-text span.lead-g{
    color: rgb(var(--green));
}

section.greeting .lead-text span:not(.lead-g){
    display: block;
}

@media screen and (max-width:1279px) {
    section.greeting .flex-box{
        gap: 30px;
    }

    section.greeting .text{
        padding-right: 0;
    }

    section.greeting figure{
        padding-left: 0;
        width: calc(100% - 30px - 550px);
    }
}

@media screen and (max-width:1023px) {
    section.greeting{
        padding-top: 80px;
    }

    section.greeting h3,
    section.greeting .lead-text{
        margin-bottom: 20px;
    }

    section.greeting .text{
        max-width: 400px;
    }

    section.greeting .text-inner .ornament-image{
        width: 26%;
    }
}

@media screen and (max-width:767px) {
    section.greeting{
        padding-top: 60px;
    }

    section.greeting .flex-box{
        justify-content: center;
        gap: 20px;
    }

    section.greeting .lead-text{
        line-height: 1.2;
        font-size: 1.8rem;
    }

    section.greeting figure{
        flex-grow: inherit;
        width: 70%;
    }

    section.greeting .text{
        max-width: 100%;
    }

    section.greeting .text-inner .ornament-image{
        max-width: 90px;
        width: 100%;
        top: 5%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* history ~~~~~~~~~~~~~~~ */
section.history h3{
    text-align: center;
    margin-bottom: 50px;
}

section.history .history-list{
    position: relative;
}

section.history .history-list .list-item{
    max-width: 450px;
    width: 100%;
}

section.history .history-list .list-item:first-of-type{
    padding-top: 15px;
}

section.history .history-list .list-item:last-of-type{
    padding-bottom: 15px;
}

section.history .history-list .list-item:not(:last-of-type){
    margin-bottom: 30px;
}

section.history .history-list .list-item:nth-of-type(even){
    margin-left: auto;
}

section.history .history-list .list-item:nth-of-type(odd) .year{
    text-align: right;
}

section.history .history-list .list-item .year{
    font-family: "Montserrat", sans-serif;
    font-size: 1.478rem;
    color: rgb(var(--green));
    margin-bottom: 5px;
}

section.history .history-list .ornament-image{
    max-width: 60px;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

section.history .history-list .ornament-image img{
    object-fit: contain;
}

@media screen and (max-width:1279px) {
    section.history .history-list .list-item{
        width: 45%;
    }

    section.history .history-list .list-item:nth-of-type(even){
        margin-top: -7%;
    }

    section.history .history-list .ornament-image{
        height: 100%;
    }
}

@media screen and (max-width:1023px) {
    section.history h3{
        margin-bottom: 20px;
    }
}

@media screen and (max-width:767px) {
    section.history .history-list .ornament-image{
        width: 55px;
        left: 24px;
    }

    section.history .history-list .ornament-image img{
        object-fit: contain;
    }

    section.history .history-list{
        padding-left: 55px;
    }

    section.history .history-list .list-item{
        max-width: 100%;
        width: 100%;
    }

    section.history .history-list .list-item:nth-of-type(even){
        margin-top: 0;
        margin-left: 0;
    }

    section.history .history-list .list-item:nth-of-type(odd) .year{
        text-align: left;
    }

    section.history .history-list .list-item:nth-of-type(even) .year{
        text-align: right;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* scenery ~~~~~~~~~~~~~~~ */
section.scenery h3{
    margin-bottom: 35px;
    text-align: center;
}

section.scenery .swiper-wrapper{
    border-radius: 35px;
    overflow: hidden;
}

section.scenery p{
    max-width: 790px;
    width: 100%;
    margin: 0 auto;
}

section.scenery .swiper-inner{
    position: relative;margin-bottom: 35px;

}

section.scenery .scenery-list{
    max-width: 1070px;
}

section.scenery .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
    margin: 0 25px;
}

section.scenery span.swiper-pagination-bullet{
    background: rgb(var(--white));
    opacity: 1;
}

section.scenery .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: rgb(var(--orange));
}

section.scenery .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{
    bottom: 25px;
}

section.scenery .swiper-button-next{
    right: 0;
}

section.scenery .swiper-button-prev{
    left: 0;
}

section.scenery .swiper-button-next,
section.scenery .swiper-button-prev{
    width: 50px;
    height: 50px;
    background-color: rgb(var(--green));
    border-radius: 50%;
    transform: translateY(-50%);
    margin-top: 0;
}

section.scenery .swiper-button-next::after,
section.scenery .swiper-button-prev::after{
    content: "";
    display: block;
    width: 15px;
    height: 15px;
}

section.scenery .swiper-button-next::after{
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
}

section.scenery .swiper-button-prev::after{
    background: url(../images/about_slide-arrow-left.png) no-repeat center/cover;
}

@media screen and (max-width:1299px) {
    section.scenery .scenery-list{
        width: 85%;
    }

    section.scenery p{
        width: 75%;
    }
}

@media screen and (max-width:1023px) {
    section.scenery h3,
    section.scenery .swiper-inner{
        margin-bottom: 20px;
    }

    section.scenery .swiper-button-next,
    section.scenery .swiper-button-prev{
        width: 45px;
        height: 45px;
    }

    section.scenery .swiper-horizontal>.swiper-pagination-bullets,
    .swiper-pagination-bullets.swiper-pagination-horizontal{
        bottom: 15px;
    }
}

@media screen and (max-width:767px) {
    section.scenery .scenery-list{
        width: 100%;
    }

    section.scenery .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{
        margin: 0 15px;
    }

    section.scenery .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{
        bottom: 8px;
    }

    section.scenery .swiper-button-next,
    section.scenery .swiper-button-prev{
        width: 30px;
        height: 30px;
    }

    section.scenery .swiper-button-next{
        right: -10px;
    }

    section.scenery .swiper-button-prev{
        left: -10px;
    }

    section.scenery .swiper-button-next::after,
    section.scenery .swiper-button-prev::after{
        width: 13px;
        height: 13px;
    }

    section.scenery p{
        width: 100%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* =========================================== */
/*service*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.service-bg{
    background-image: url(../images/service_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* service-introduction ~~~~~~~~~~~~~~~ */
section.service-introduction{
    padding-top: 100px;
}

section.service-introduction .h-group{
    position: relative;
}

section.service-introduction h3{
    text-align: center;
    margin-bottom: 50px;
}

section.service-introduction p{
    max-width: 760px;
    margin: 0 auto;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.service-introduction .ornament-image{
    max-width: 125px;
    width: 100%;
    position: absolute;
    top: -30%;
    right: 0%;
}

@media screen and (max-width:1023px) {
    section.service-introduction{
        padding-top: 80px;
    }

    section.service-introduction h3{
        font-size: 1.9rem;
        margin-bottom: 20px;
    }

    section.service-introduction .ornament-image{
        max-width: 80px;
        top: -35%;
    }
}

@media screen and (max-width:767px) {
    section.service-introduction{
        padding-top: 40px;
    }

    section.service-introduction h3{
        font-size: 1.6rem;
    }

    section.service-introduction .ornament-image{
        max-width: 50px;
        top: -15%;
    }

    section.service-introduction p{
        line-height: 1.2;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* flowers-view ~~~~~~~~~~~~~~~ */
section.flowers-view .contents-wrapper{
    margin-bottom: 70px;
}

section.flowers-view .contents-wrapper .ornament-image:nth-of-type(2){
    max-width: 300px;
    aspect-ratio: 1/1;
    width: 100%;
    margin-left: calc(100% - 300px - 150px);
    border-radius: 35px;
    overflow: hidden;
    margin-top: -60px;
}

section.flowers-view .contents-wrapper .ornament-image:nth-of-type(3){
    max-width: 500px;
    width: 100%;
    border-radius: 35px;
    overflow: hidden;
    margin-top: -150px;
}

section.flowers-view .text{
    max-width: 700px;
    width: 100%;
    padding: 30px 50px;
    background-color: rgb(var(--white));
    border-radius: 35px;
    margin-left: auto;
    margin-top: -130px;
    position: relative;
    z-index: 3;
}

section.flowers-view .text .ornament-image{
    max-width: 145px;
    width: 100%;
    position: absolute;
    left: -19%;
    bottom: 0;
}

section.flowers-view .text h3{
    margin-bottom: 35px;
}

section.flowers-view .text p{
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.flowers-view .text h3 span:not(.h3-g,.h3-o){
    display: block;
}

@media screen and (max-width:1439px) {
    section.flowers-view .contents-wrapper{
        margin-bottom: 0;
    }
}

@media screen and (max-width:1100px) {
    section.flowers-view .contents-wrapper .ornament-image:nth-of-type(2){
        margin-left: calc(100% - 300px - 100px);
    }
}

@media screen and (max-width:1023px) {
    section .sec-bg{
        top: 60px;
    }

    section.flowers-view .text h3{
        margin-bottom: 20px;
    }

    section.flowers-view .text p{
        line-height: 1.2;
    }

    section.flowers-view .contents-wrapper .ornament-image:nth-of-type(2){
        max-width: 230px;
        margin-left: auto;
        margin-top: -30px;
    }

    section.flowers-view .contents-wrapper .ornament-image:nth-of-type(3){
        max-width: 400px;
    }

    section.flowers-view .text{
        width: 80%;
        padding: 20px 40px;
        margin-top: -100px;
    }

    section.flowers-view .text .ornament-image{
        max-width: 120px;
        left: -17%;
    }
}

@media screen and (max-width:767px) {
    section.flowers-view .contents-wrapper{
        margin-bottom: 20px;
    }

    section .sec-bg{
        top: 30px;
    }

    section.flowers-view .contents-wrapper .ornament-image:nth-of-type(2){
        margin-top: -15px;
        max-width: 150px;
    }

    section.flowers-view .contents-wrapper .ornament-image:nth-of-type(3){
        max-width: 250px;
        margin-top: -80px;
    }

    section.flowers-view .text{
        width: 93%;
        padding: 20px 25px;
        margin-top: -60px;
    }

    section.flowers-view .text .ornament-image{
        max-width: 65px;
        left: -7%;
        bottom: -11%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* event-program ~~~~~~~~~~~~~~~ */
section.event-program{
    padding-top: 150px;
}

section.event-program h3{
    margin-bottom: 35px;
}

section.event-program .event-list .list-item{
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

section.event-program .event-list .list-item:first-of-type{
    margin-bottom: 150px;
}

section.event-program .event-list .list-item .text{
    max-width: 550px;
    width: 100%;
}

section.event-program .event-list .list-item .text p{
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.event-program .event-list .list-item figure{
    max-width: 500px;
    width: 100%;
    position: absolute;
    top: -40%;
}

section.event-program .event-list .list-item.walking{
    padding-left: 100px;
}

section.event-program .event-list .list-item.walking figure{
    right: 0;
}

section.event-program .event-list .list-item.mushrooms{
    padding-right: 100px;
    flex-direction: row-reverse;
}

section.event-program .event-list .list-item.mushrooms figure{
    left: 0;
}

@media screen and (max-width:1300px) {
    section.event-program .event-list .list-item.walking{
        padding-left: 0;
    }

    section.event-program .event-list .list-item.mushrooms{
        padding-right: 0;
    }

    section.event-program .event-list .list-item .text{
        max-width: 512px;
    }

    section.event-program .event-list .list-item figure{
        width: 47%;
        top: -15%;
    }

    section.event-program .event-list .list-item.walking figure{
        right: -5%;
    }

    section.event-program .event-list .list-item.mushrooms figure{
        left: -5%;
    }
}

@media screen and (max-width:1023px) {
    section.event-program{
        padding-top: 100px;
    }

    section.event-program h3{
        margin-bottom: 20px;
    }

    section.event-program .event-list .list-item figure{
        max-width: 350px;
        width: 100%;
        top: -5%;
        opacity: 0.4;
        z-index: -1;
    }

    section.event-program .event-list .list-item.walking figure{
        right: -2%;
    }

    section.event-program .event-list .list-item.mushrooms figure{
        left: -2%;
    }

    section.event-program .event-list .list-item:first-of-type{
        margin-bottom: 70px;
    }
}

@media screen and (max-width:767px) {
    section.event-program{
        padding-top: 50px;
    }

    section.event-program .event-list .list-item .text{
        max-width: 100%;
    }

    section.event-program .event-list .list-item .text p{
        line-height: 1.2;
    }

    section.event-program .event-list .list-item:first-of-type{
        margin-bottom: 40px;
    }

    section.event-program .event-list .list-item figure{
        display: none;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* look-point ~~~~~~~~~~~~~~~ */
section.look-point h3{
    text-align: center;
}

section.look-point .flower-list{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin: 50px 0;
}

section.look-point .flower-list .list-item{
    width: calc((100% - 30px * 2)/ 3);
    border-radius: 35px;
    overflow: hidden;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.look-point .flower-list .list-item .item-text{
    padding: 15px 20px;
}

section.look-point .flower-list .list-item p.season-title{
    font-size: 1.4375rem;
    margin-bottom: 5px;
}

section.look-point a.btn250{
    display: flex;
    align-items: center;
    gap: 10px;
}

section.look-point a.btn250 div:first-of-type{
    flex-grow: 1;
    text-align: center;
}

section.look-point a.btn250 div:last-of-type{
    width: 10px;
    height: 10px;
    transition: 0.6s;
	-webkit-transition: 0.6s;
	-moz-transition: 0.6s;
	-ms-transition: 0.6s;
	-o-transition: 0.6s;
}

section.look-point a.btn250:hover div:last-of-type{
    transform: translateX(5px);
}

@media screen and (max-width:1023px) {
    section.look-point .flower-list{
        gap: 10px;
        margin: 20px 0 30px;
    }

    section.look-point .flower-list .list-item{
        width: calc((100% - 10px * 2)/ 3);
    }

    section.look-point .flower-list .list-item .item-text{
        padding: 10px 15px;
    }

    section.look-point .flower-list .list-item p.season-title{
        text-align: center;
    }
}

@media screen and (max-width:767px) {
    section.look-point .flower-list{
        justify-content: center;
        gap: 20px;
        margin: 20px 0;
    }

    section.look-point .flower-list .list-item{
        width: 90%;
        line-height: 1.2;
    }

    section.look-point .flower-list .list-item .item-text{
        text-align: center;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* =========================================== */
/*look*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.look-bg{
    background-image: url(../images/look_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* look-induction ~~~~~~~~~~~~~~~ */
section.look-induction{
    padding-top: 100px;
}

section.look-induction h3{
    text-align: center;
    margin-bottom: 50px;
    position: relative;
}

section.look-induction h3 .ornament-image{
    width: 145px;
    position: absolute;
    top: -100%;
    left: 0;
}

section.look-induction h3 + p{
    max-width: 760px;
    width: 100%;
    margin: 0 auto 50px;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.look-induction .season-list{
    display: flex;
    flex-wrap: wrap;
    gap: 20px
}

section.look-induction .season-list .list-item{
    width: calc((100% - 20px * 2)/ 3);
    border-radius: 25px;
    overflow: hidden;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    line-height: 1.5;
}

section.look-induction .season-list .list-item .season-image{
    max-height: 200px;
    width: 100%;
}

section.look-induction .season-list .list-item .season-icon{
    width: 60px;
    height: 60px;
    margin: 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid rgb(var(--orange));
    border-radius: 50%;
    background-color: rgb(var(--white));
    font-size: 1.4375rem;
    line-height: 1.5;
    color: rgba(var(--brown));
    margin: -30px auto 5px;
    position: relative;
    z-index: 1;
}

section.look-induction .season-list .list-item .season-text{
    padding: 0 20px 30px;
}

section.look-induction .season-list .list-item .season-text p.title{
    font-family: "Montserrat", sans-serif;
    font-size: 1.4375rem;
    letter-spacing: 0.1em;
    color: rgb(var(--green));
    text-align: center;
}

section.look-induction .season-list .list-item .season-text p.title + p{
    letter-spacing: 0.05em;
}

section.look-induction .season-list .list-item .season-text span{
    text-transform: capitalize;
}

@media screen and (max-width:1023px) {
    section.look-induction{
        padding-top: 80px;
    }

    section.look-induction h3{
        margin-bottom: 20px;
    }

    section.look-induction h3 + p{
        margin-bottom: 40px;
        width: 85%;
    }

    section.look-induction h3 .ornament-image{
        width: 85px;
        top: -30%;
    }
}

@media screen and (max-width:767px) {
    section.look-induction{
        padding-top: 40px;
    }

    section.look-induction h3 + p{
        width: 100%;
        margin-bottom: 30px;
    }

    section.look-induction .season-list{
        justify-content: center;
    }

    section.look-induction .season-list .list-item{
        width: 80%;
        line-height: 1.2;
    }

    section.look-induction .season-list .list-item .season-icon{
        width: 50px;
        height: 50px;
        font-size: 1.3rem;
    }

    section.look-induction .season-list .list-item .season-image{
        max-height: 150px;
        height: 100%;
    }

    section.look-induction .season-list .list-item .season-text{
        padding-bottom: 20px;
    }

    section.look-induction .season-list .list-item .season-text p.title{
        line-height: 1.5;
        margin-bottom: 5px;
    }

    section.look-induction h3 .ornament-image{
        width: 65px;
        top: -65%;
    }

    section.look-induction .season-list .list-item .season-text p.title + p{
        text-align: center;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* season-commons ~~~~~~~~~~~~~~~ */
section.season{
    overflow: hidden;
}

section.season .contents-wrapper{
    position: relative;
}

section.season .sec-bg{
    height: 80%;
}

section.season p.bg-text{
    font-family: "Walter Turncoat", cursive;
    font-size: 6.875rem;
    text-transform: capitalize;
    width: fit-content;
    position: absolute;
    top: -30px;
}

section.season:nth-of-type(odd) p.bg-text{
    right: 0;
}

section.season:nth-of-type(even) p.bg-text{
    left: 0;
}

section.season .contents-wrapper{
    padding-top: 50px;
}

section.season h3{
    margin-bottom: 35px;
}

section.season .introduction{
    margin-bottom: 100px;
}

section.season .introduction-inner{
    position: relative;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
}

section.season .introduction-text{
    max-width: 505px;
    width: 100%;
    position: relative;
}

section.season .introduction-text h3 ~ p{
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.season:nth-of-type(odd) .introduction-text{
    margin-left: auto;
}

section.season .introduction .introduction-image{
    max-width: 450px;
    width: 100%;
    position: absolute;
    top: -100px;
}

section.season:nth-of-type(odd) .introduction .introduction-image{
    left: 0;
}

section.season:nth-of-type(even) .introduction .introduction-image{
    right: 0;
}

section.season .season-list.pc{
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

section.season .season-list .list-item{
    border-radius: 35px;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    background-color: rgb(var(--white));
    overflow: hidden;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.season .season-list.pc .list-item{
    width: calc((100% - 30px * 2)/ 3);
}

section.season .season-list .list-item .item-text{
    padding: 20px;
}

section.season .season-list .list-item .item-text p.title{
    font-weight: 500;
    color: rgb(var(--green));
}

section.season .swiper{
    display: none;
}

@media screen and (max-width:1080px) {
    section.season:nth-of-type(odd) .introduction .introduction-image{
        left: -6%;
    }
}

@media screen and (max-width:1023px) {
    section.season h3{
        margin-bottom: 20px;
    }

    section.season p.bg-text{
        font-size: 5rem;
        top: -15px;
    }

    section.season .sec-bg{
        top: 60px;
    }

    section.season .introduction .introduction-image{
        max-width: 380px;
        top: -20px;
        opacity: 0.4;
    }

    section.season .season-list.pc{
        gap: 20px;
    }

    section.season .season-list.pc .list-item{
        width: calc((100% - 20px * 2)/ 3);
    }
}

@media screen and (max-width:767px) {
    section.season .contents-wrapper{
        padding-top: 30px;
    }

    section.season .sec-bg{
        top: 30px;
        height: 70%;
    }

    section.look-spring .introduction-text{
        max-width: 100%;
    }

    section.season p.bg-text{
        font-size: 3.5rem;
        top: -8px;
    }

    section.season .introduction{
        margin-bottom: 20px;
    }

    section.season .introduction-text h3 ~ p{
        line-height: 1.2;
    }

    section.season .introduction .introduction-image{
        display: none;
    }

    section.season .season-list.pc{
        display: none;
    }

    section.season .swiper{
        display: block;
        width: 90%;
    }

    section.season .swiper.season-list .list-item{
        box-shadow: none;
        line-height: 1.2;
        border: 1px solid rgb(194, 194, 194);
    }

    section.season:nth-of-type(odd) .introduction-text{
        max-width: 100%;
    }

    section.season .season-list .list-item .item-text p.title{
        margin-bottom: 5px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* look-spring ~~~~~~~~~~~~~~~ */
section.look-spring p.bg-text{
    color: rgb(var(--orange)/ 0.6);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* look-summer ~~~~~~~~~~~~~~~ */
section.look-summer p.bg-text{
    color: rgb(var(--green)/ 0.6);
}

section.look-summer .introduction-text{
    max-width: 575px;
}

section.look-summer .introduction-text p:not(.title){
    max-width: 500px;
    width: 100%;
}

@media screen and (max-width:1100px) {
    section.look-summer.season .introduction .introduction-image{
        max-width: 400px;
        right: -5%;
    }
}

@media screen and (max-width:1023px) {
    section.look-summer.season .introduction .introduction-image{
        max-width: 350px;
        right: -3%;
    }
}

@media screen and (max-width:767px) {
    section.look-summer .introduction-text{
        max-width: 100%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* look-autumn ~~~~~~~~~~~~~~~ */
section.look-autumn p.bg-text{
    color: rgb(var(--orange)/ 0.8);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* =========================================== */
/*shopping*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.shopping-bg{
    background-image: url(../images/shopping_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* shopping-induction ~~~~~~~~~~~~~~~ */
section.shopping-induction h3{
    margin-bottom: 50px;
    text-align: center;
}

section.shopping-induction p{
    max-width: 760px;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 35px;
}

section.shopping-induction a.btn272{
    padding: 16px 25px;
}

section.shopping-induction a.btn:hover{
    filter: brightness(1.2);
}

section.shopping-induction a.btn div:last-of-type{
    background: none;
}

section.shopping-induction a.btn:hover div:last-of-type{
    transform: none;
}

section.shopping-induction .contents-wrapper{
    position: relative;
}

section.shopping-induction .contents-wrapper .ornament-image:first-of-type{
    max-width: 55px;
    width: 100%;
    position: absolute;
    top: -8%;
    right: 2%;
}

section.shopping-induction .contents-wrapper .ornament-image:last-of-type{
    max-width: 124px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: -7%;
}

@media screen and (max-width:1279px) {
    section.shopping-induction .contents-wrapper .ornament-image:last-of-type {
        bottom: -25%;
        left: 0;
    }
}

@media screen and (max-width:1023px) {
    section.shopping-induction h3{
        margin-bottom: 30px;
    }

    section.shopping-induction .contents-wrapper .ornament-image:first-of-type{
        width: 7%;
        top: -13%;
        right: 0;
    }

    section.shopping-induction .contents-wrapper .ornament-image:last-of-type{
        bottom: -27%;
        left: 0;
    }
}

@media screen and (max-width:767px) {
    section.shopping-induction h3{
        margin-bottom: 20px;
    }

    section.shopping-induction p{
        margin-bottom: 25px;
    }

    section.shopping-induction h3 span:not(.h3-g,.h3-o){
        display: block;
    }

    section.shopping-induction .contents-wrapper .ornament-image:first-of-type{
        max-width: 35px;
        top: -7%;
    }

    section.shopping-induction .contents-wrapper .ornament-image:last-of-type{
        display: none;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* mv ~~~~~~~~~~~~~~~ */
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* =========================================== */
/*map*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.map-bg{
    background-image: url(../images/map_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* map-induction ~~~~~~~~~~~~~~~ */
section.map-induction{
    padding-top: 100px;
}

section.map-induction .h-group{
    position: relative;
    margin-bottom: 50px;
}

section.map-induction h3{
    text-align: center;
    margin-bottom: 50px;
}

section.map-induction p{
    max-width: 810px;
    width: 100%;
    margin: 0 auto;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.map-induction .h-group .ornament-image:first-of-type{
    width: 40px;
    position: absolute;
    top: 0;
    left: 0;
}

section.map-induction .h-group .ornament-image:last-of-type{
    width: 26px;
    position: absolute;
    bottom: 0;
    right: 0;
}

@media screen and (max-width:1023px) {
    section.map-induction{
        padding-top: 80px;
    }

    section.map-induction .h-group{
        margin-bottom: 40px;
    }

    section.map-induction p{
        width: 80%;
    }

    section.map-induction h3{
        margin-bottom: 20px;
    }
}

@media screen and (max-width:767px) {
    section.map-induction{
        padding-top: 40px;
    }

    section.map-induction .h-group .ornament-image:first-of-type{
        width: 30px;
    }

    section.map-induction .h-group .ornament-image:last-of-type{
        width: 23px;
    }

    section.map-induction p{
        width: 89%;
    }

    section.map-induction .h-group{
        margin-bottom: 30px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* walking-point ~~~~~~~~~~~~~~~ */
section.walking-point h3{
    width: fit-content;
    margin: 0 auto 50px;
    position: relative;
}

section.walking-point h3 .ornament-image{
    width: 42px;
    position: absolute;
    top: 0;
    left: -15%;
}

section.walking-point .walking-list {
    counter-reset: number;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 30px;
}

section.walking-point .walking-list .list-item {
    counter-increment: number;
    position: relative;
    width: calc((100% - 30px * 2)/ 3);
    border-radius: 35px;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    line-height: 1.5;
    letter-spacing: 0.05em;
    display: flex;
    flex-direction: column;
}

section.walking-point .walking-list .list-item .walking-image{
    border-radius: 35px 35px 0 0;
    overflow: hidden;
    max-height: 250px;
    flex-grow: 1;
}

section.walking-point .walking-list .list-item .walking-point{
    width: 65px;
    height: 65px;
    border-radius: 100px;
    font-family: "Montserrat", sans-serif;
    font-size: 2rem;
    line-height: 1.5;
    letter-spacing: 0.1em;
    font-weight: 500;
    color: rgb(var(--white));
    background: url(../images/map_walking-point.png) no-repeat center/contain;
    display: grid;
    place-items: center;
    position: absolute;
    top: 0px;
    left: 0px;
}

section.walking-point .walking-list .list-item .walking-text{
    padding: 20px;
}

section.walking-point .walking-list .list-item .walking-text p.title{
    font-weight: 500;
    color: rgb(var(--green));
}

@media screen and (max-width:1023px) {
    section.walking-point h3{
        margin-bottom: 20px;
    }

    section.walking-point .walking-list{
        gap: 20px;
    }

    section.walking-point .walking-list .list-item{
        width: calc((100% - 20px * 2)/ 3);
    }

    section.walking-point .walking-list .list-item .walking-point{
        width: 55px;
        height: 55px;
        font-size: 1.5rem;
    }

    section.walking-point .walking-list .list-item .walking-text{
        padding: 15px 20px;
    }

    section.walking-point h3 .ornament-image{
        width: 33px;
        left: -12%;
    }
}

@media screen and (max-width:767px) {
    section.walking-point h3{
        text-align: center;
        margin-bottom: 20px;
    }

    section.walking-point h3 span:not(.h3-o){
        display: block;
    }

    section.walking-point h3 .ornament-image{
        width: 30px;
        top: 50%;
        transform: translateY(-50%);
    }

    section.walking-point .walking-list{
        gap: 15px;
    }

    section.walking-point .walking-list .list-item{
        width: 80%;
        line-height: 1.2;
    }

    section.walking-point .walking-list .list-item:nth-of-type(even){
        margin-left: auto;
    }

    section.walking-point .walking-list .list-item .walking-image{
        max-height: 150px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* natural-spot ~~~~~~~~~~~~~~~ */
section.natural-spot h3{
    width: fit-content;
    margin: 0 auto 50px;
    position: relative;
}

section.natural-spot .spot-list{
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}

section.natural-spot .spot-list .list-item{
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 20px;
    border-radius: 35px;
    overflow: hidden;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    width: calc((100% - 30px)/ 2);
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.natural-spot h3 .ornament-image{
    width: 65px;
    position: absolute;
    top: -25%;
    right: -20%;
}

section.natural-spot .spot-list .list-item .spot-text p.title{
    color: rgb(var(--green));
    font-weight: 500;
    margin-bottom: 5px;
}

@media screen and (max-width:1023px) {
    section.natural-spot h3{
        margin-bottom: 20px;
    }

    section.natural-spot .spot-list{
        column-gap: 15px;
        row-gap: 20px;
    }

    section.natural-spot .spot-list .list-item{
        width: calc((100% - 15px)/ 2);
        gap: 10px;
    }

    section.natural-spot h3 .ornament-image{
        width: 50px;
        right: -12%;
    }
}

@media screen and (max-width:767px) {
    section.natural-spot h3{
        text-align: center;
    }

    section.natural-spot h3 span:not(.h3-g){
        display: block;
    }

    section.natural-spot h3 .ornament-image{
        width: 40px;
        transform: scale(-1,1);
        right: -7%;
        top: -10%;
    }

    section.natural-spot .spot-list .list-item{
        width: 100%;
        line-height: 1.2;
        column-gap: 10px;
    }

    section.natural-spot .spot-list .list-item .spot-text{
        padding-right: 5px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* sale ~~~~~~~~~~~~~~~ */
section.sale .contents-wrapper{
    margin-top: 50px;
    margin-bottom: 100px;
}
section.sale h3{
    text-align: center;
    margin-bottom: 50px;
}

section.sale .sale-list{
    display: flex;
    flex-wrap: wrap;
    gap: 50px;
}

section.sale .sale-list .list-item{
    border-radius: 35px;
    overflow: hidden;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    width: calc((100% - 50px)/ 2);
    background-color: rgb(var(--white));
}

section.sale .sale-list .list-item .item-text{
    padding: 15px 20px;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.sale .sale-list .list-item .item-text p.title{
    font-size: 1.4375rem;
    margin-bottom: 5px;
}

@media screen and (max-width:1999px) {
    section.sale .contents-wrapper{
        margin-bottom: 70px;
    }
}

@media screen and (max-width:1500px) {
    section.sale .contents-wrapper{
        margin-bottom: 40px;
    }
}

@media screen and (max-width:1300px) {
    section.sale .contents-wrapper{
        margin-bottom: 0;
    }
}

@media screen and (max-width:1023px) {
    section.sale .contents-wrapper{
        margin-bottom: 0;
        margin-top: 30px;
    }

    section.sale h3{
        margin-bottom: 20px;
    }

    section.sale .sale-list{
        gap: 30px;
    }

    section.sale .sale-list .list-item{
        width: calc((100% - 30px)/ 2);
    }
}

@media screen and (max-width:767px) {
    section.sale .sale-list .list-item{
        width: 100%;
    }

    section.sale .sale-list .list-item .item-text{
        line-height: 1.2;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* =========================================== */
/*company-overview*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.company-bg{
    background-image: url(../images/company_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* company ~~~~~~~~~~~~~~~ */
section.company-overview{
    padding: 100px 0 150px;
}

section.company-overview .explanation-text{
    max-width: 555px;
    width: 100%;
    padding: 30px 50px;
    border-radius: 35px;
    background-color: rgb(var(--white));
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    position: relative;
    z-index: 2;
    margin-top: -30%;
}

section.company-overview .explanation-text h3{
    text-align: center;
    margin-bottom: 25px;
}

section.company-overview .explanation-text .ornament-image{
    width: 61px;
    position: absolute;
    top: -12%;
    left: -5%;
}

section.company-overview .explanation-text .information-list .list-item{
    line-height: 1.5;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

section.company-overview .explanation-text .information-list .list-item:not(:last-of-type){
    margin-bottom: 25px;
}

section.company-overview .explanation-text .information-list .list-item .title,
section.company-overview .explanation-text .information-list .list-item .text{
    background-image : linear-gradient(to right, rgb(var(--yellow-green)) 5px, transparent 5px);
    background-size: 9px 1px;
    background-repeat: repeat-x;
    background-position: left bottom;
}

section.company-overview .explanation-text .information-list .list-item .title{
    width: 21%;
    padding: 10px;
    text-align: center;
}

section.company-overview .explanation-text .information-list .list-item .text{
    flex-grow: 1;
    padding: 10px 0 10px 10px;
}

section.company-overview figure.information-figure{
    max-width: 500px;
    width: 100%;
    margin-left: auto;
    position: relative;
    z-index: 1;
    border-radius: 35px;
    overflow: hidden;
}

@media screen and (max-width:1023px) {
    section.company-overview{
        padding: 80px 0 100px;
    }

    section.company-overview .explanation-text{
        padding: 25px 35px;
    }
}

@media screen and (max-width:767px) {
        section.company-overview{
        padding: 40px 0 40px;
    }

    section.company-overview .explanation-text{
        padding: 20px 30px;
    }

    section.company-overview .explanation-text h3{
        margin-bottom: 20px;
    }

    section.company-overview .explanation-text{
        width: 80%;
    }

    section.company-overview .explanation-text .information-list .list-item{
        gap: 5px;
        line-height: 1.2;
    }

    section.company-overview .explanation-text .information-list .list-item .title{
        width: 100%;
        padding: 5px;
    }

    section.company-overview .explanation-text .information-list .list-item .text{
        padding: 5px;
        text-align: center;
        background-image: none;
    }

    section.company-overview figure.information-figure{
        height: 250px;
        width: 75%;
    }

    section.company-overview .explanation-text .information-list .list-item:not(:last-of-type){
        margin-bottom: 15px;
    }

    section.company-overview .explanation-text .ornament-image{
        width: 45px;
        left: -3%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* company-protect ~~~~~~~~~~~~~~~ */
section.company-overview .protect{
    padding: 150px 0;
    padding-bottom: 0;
}

section.company-overview .protect .contents-wrapper{
    position: relative;
}

section.company-overview .protect .protect-text{
    max-width: 550px;
    width: 100%;
    margin-left: auto;
}

section.company-overview .protect p.title{
    font-weight: 500;
    font-size: 2rem;
    line-height: 1.5;
    letter-spacing: 0.05em;
    margin-bottom: 35px;
}

section.company-overview .protect p.title span.h4-o{
    color: rgb(var(--green));
}

section.company-overview .protect p:not(.title){
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.company-overview .protect .protect-figure{
    width: 48%;
    position: absolute;
    top: -20%;
    left: 0;
}

@media screen and (max-width:1190px) {
    section.company-overview .protect .protect-figure{
        top: 0;
        left: -4%;
    }

    section.company-overview .protect .protect-text{
        max-width: 504px;
    }
}

@media screen and (max-width:1023px) {
    section.company-overview{
        padding: 80px 0 0px;
    }

    section.company-overview .protect{
        padding: 80px 0;
    }

    section.company-overview .protect .protect-figure{
        top: -8%;
        max-width: 470px;
        width: 100%;
        opacity: 0.3;
    }

    section.company-overview .protect .protect-text{
        max-width: 540px;
    }
}

@media screen and (max-width:767px) {
    section.company-overview{
        padding: 30px 0 0px;
    }

    section.company-overview .protect{
        padding: 40px 0;
    }

    section.company-overview .protect .protect-text{
        max-width: 100%;
    }

    section.company-overview .protect p.title,
    section.company-overview .protect p:not(.title){
        line-height: 1.2;
    }

    section.company-overview .protect p.title{
        font-size: 1.9rem;
        margin-bottom: 20px;
    }

    section.company-overview .protect .protect-figure{
        top: auto;
        left: auto;
        bottom: -6%;
        right: 0;
        width: 100%;
        max-width: 240px;

    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* =========================================== */
/*news-blog*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.post-bg{
    background-image: url(../images/post_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* news-post ~~~~~~~~~~~~~~~ */
section.news-post{
    padding-top: 100px;
}

section.news-post .post-filter-nav{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 100px;
}

section.news-post .post-filter-nav .category-list{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    max-width: 445px;
    width: 100%;
}

section.news-post .post-filter-nav .category-list .category-list--item{
    width: calc((100% - 15px * 3)/ 4);
    text-align: center;
    border-radius: 50px;
    overflow: hidden;
}

section.news-post .post-filter-nav .category-list .category-list--item a{
    padding: 8px;
}

section.news-post .post-filter-nav .category-list .category-list--item a:hover{
    color: rgb(var(--white));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-all{
    border: 1px solid rgb(var(--orange));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-all a:hover{
    background-color: rgb(var(--orange));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-all.is-active{
    background-color: rgb(var(--orange));
    color: rgb(var(--white));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-news{
    border: 1px solid rgb(var(--yellow-green));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-news a:hover{
    background-color: rgb(var(--yellow-green));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-news.is-active{
    background-color: rgb(var(--yellow-green));
    color: rgb(var(--white));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-blog{
    border: 1px solid rgb(var(--pink));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-blog a:hover{
    background-color: rgb(var(--pink));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-blog.is-active{
    background-color: rgb(var(--pink));
    color: rgb(var(--white));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-event{
    border: 1px solid rgb(var(--blue));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-event a:hover{
    background-color: rgb(var(--blue));
}

section.news-post .post-filter-nav .category-list .category-list--item.category-event.is-active{
    background-color: rgb(var(--blue));
    color: rgb(var(--white));
}

section.news-post .post-filter-nav .monthly-archive{
    position: relative;
    max-width: 185px;
    width: 100%;
}

section.news-post .post-filter-nav .monthly-archive::before{
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    background-color: rgb(var(--orange));
    clip-path: polygon(100% 0, 0 0, 50% 100%);
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    pointer-events: none;
}

section.news-post .post-filter-nav .monthly-archive select{
    padding: 8px 85px 8px 25px;
    font-family: "Kiwi Maru", serif;
    border: 1px solid rgb(var(--orange));
    border-radius: 50px;
    cursor: pointer;
}

section.news-post .post-filter-nav .monthly-archive select:focus {
    border-color: rgb(var(--orange));
    outline: none;
    box-shadow: none;
}

section.news-post .post-list{
    display: flex;
    flex-wrap: wrap;
    row-gap: 50px;
    column-gap: 30px;
    margin-bottom: 50px;
}

section.news-post .post-list .list-item{
    width: calc((100% - 30px * 2)/ 3);
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.12);
    border-radius: 35px;
    overflow: hidden;
}

section.news-post .post-list .list-item .post-text{
    padding: 35px 20px 20px;
    position: relative;
}

section.news-post .post-list .list-item .post-text .category-type{
    max-width: 100px;
    width: 100%;
    padding: 8px 0;
    text-align: center;
    border-radius: 50px;
    position: absolute;
    left: 20px;
    top: 0;
    transform: translateY(-50%);
    background-color: rgb(var(--white));
}

section.news-post .post-list .list-item .post-text .category-type.news{
    border: 1px solid rgb(var(--yellow-green));
}

section.news-post .post-list .list-item .post-text .category-type.blog{
    border: 1px solid rgb(var(--pink));
}

section.news-post .post-list .list-item .post-text .category-type.event{
    border: 1px solid rgb(var(--blue));
}

section.news-post .post-list .list-item .post-text .date{
    color: rgb(var(--green));
    margin-bottom: 5px;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0.1em;
}

section.news-post .post-list .list-item .post-text .title{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

section.news-post .post-list .list-item .post-text .title-wrap{
    padding-bottom: 10px;
    margin-bottom: 15px;
    background-image : linear-gradient(to right, rgb(var(--green)) 5px, transparent 5px);
    background-size: 10px 1px;
    background-repeat: repeat-x;
    background-position: left bottom;
}

section.news-post .post-list .list-item .post-text .detail-text{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}

section.news-post .post-list .list-item .post-image{
    height: 250px;
    overflow: hidden;
}

section.news-post .post-list .list-item .post-image img{
    transition: 0.6s;
	-webkit-transition: 0.6s;
	-moz-transition: 0.6s;
	-ms-transition: 0.6s;
	-o-transition: 0.6s;
}

section.news-post .post-list .list-item:hover .post-image img{
    transform: scale(1.1);
}

.page-nav{
    font-family: "Montserrat", sans-serif;
}

.page-nav .wp-pagenavi{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 25px;
}

.page-nav .wp-pagenavi a, .wp-pagenavi span{
    padding: 0;
}

.page-nav .wp-pagenavi a,
.page-nav .wp-pagenavi span,
.page-nav .wp-pagenavi span.current{
    margin: 0;
    border: none;
    color: rgb(var(--brown));
}

.page-nav .wp-pagenavi span.current{
    color: rgb(var(--orange));
    font-weight: 400;
}

.page-nav .wp-pagenavi a.nextpostslink,
.page-nav .wp-pagenavi a.previouspostslink{
    width: 30px;
    height: 30px;
    border: 1px solid rgb(var(--green));
    background-color: rgb(var(--green));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-nav .wp-pagenavi a.nextpostslink span,
.page-nav .wp-pagenavi a.previouspostslink span{
    width: 10px;
    height: 10px;
    position: relative;
}

.page-nav .wp-pagenavi a.nextpostslink span{
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
}

.page-nav .wp-pagenavi a.previouspostslink span{
    background: url(../images/about_slide-arrow-left.png) no-repeat center/cover;
}

.page-nav .wp-pagenavi a.nextpostslink:hover,
.page-nav .wp-pagenavi a.previouspostslink:hover{
    filter: brightness(1.2);
}

@media screen and (max-width:1023px) {
    section.news-post{
        padding-top: 80px;
    }

    section.news-post .post-filter-nav{
        margin-bottom: 80px;
    }

    section.news-post .post-list{
        column-gap: 20px;
        row-gap: 30px;
        margin-bottom: 30px;
    }

    section.news-post .post-list .list-item{
        width: calc((100% - 20px)/ 2);
    }
}

@media screen and (max-width:767px) {
    section.news-post{
        padding-top: 40px;
    }

    section.news-post .post-filter-nav{
        flex-direction: column-reverse;
    }

    section.news-post .post-filter-nav{
        gap: 25px;
        margin-bottom: 40px;
    }

    section.news-post .post-filter-nav .category-list{
        max-width: 100%;
    }

    section.news-post .post-filter-nav .category-list .category-list--item{
        max-width: 30%;
        width: 100%;
    }

    section.news-post .post-filter-nav .monthly-archive{
        margin-left: auto;
        max-width: 150px;
    }

    section.news-post .post-filter-nav .monthly-archive select{
        padding: 8px 50px 8px 25px;
        width: 100%;
    }

    section.news-post .post-list .list-item{
        width: 100%;
    }

    section.news-post .post-list .list-item .post-image{
        height: 200px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* post-detail ~~~~~~~~~~~~~~~ */
section.post-detail{
    padding-top: 100px;
}

section.post-detail .title{
    padding: 0 25px;
    padding-bottom: 15px;
    margin-bottom: 50px;
    border-bottom: 1px;
    background-image : linear-gradient(to right, rgb(var(--green)) 5px, transparent 5px);
    background-size: 10px 1px;
    background-repeat: repeat-x;
    background-position: left bottom;
}
section.post-detail .title .date{
    font-size: 1.4375rem;
    color: rgb(var(--green));
}

section.post-detail .title .date-wrap{
    display: flex;
    align-items: center;
    gap: 25px;
    margin-bottom: 15px;
}

section.post-detail .title .category{
    width: 100px;
    text-align: center;
    padding: 8px 0;
    border-radius: 50px;
    overflow: hidden;
}

section.post-detail .title .category.category--news{
    border: 1px solid rgb(var(--yellow-green));
}

section.post-detail .title .category.category--blog{
    border: 1px solid rgb(var(--pink));
}

section.post-detail .title .category.category--event{
    border: 1px solid rgb(var(--blue));
}

section.post-detail .title .title-name{
    font-size: 2rem;
    font-weight: 500;
}

section.post-detail .text{
    padding: 0 25px;
}

section.post-detail .swiper-inner{
    position: relative;
    max-width: 890px;
    width: 100%;
    margin: 0 auto;
}

section.post-detail .post-swiper{
    max-width: 760px;
    width: 100%;
    height: 500px;
    margin-bottom: 25px;
    border-radius: 35px;
    overflow: hidden;
}

section.post-detail .sub-swiper{
    height: 135px;
}

section.post-detail .sub-swiper .swiper-slide{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 35px;
    overflow: hidden;
}

html :where(img[class*="wp-image-"]) {
    width: 100%;
    height: 100%;
}

section.post-detail .sub-swiper .text{
    max-width: 950px;
    width: 100%;
}

section.post-detail .swiper-inner .swiper-button-next,
section.post-detail .swiper-inner .swiper-button-prev{
    width: 40px;
    height: 40px;
    background-color: rgb(var(--green));
    border-radius: 50%;
    overflow: hidden;
}

section.post-detail .swiper-inner .swiper-button-next::after,
section.post-detail .swiper-inner .swiper-button-prev::after{
    font-family: none;
    font-size: 0;
    display: block;
    width: 12px;
    height: 12px;
}

section.post-detail .swiper-inner .swiper-button-next::after{
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
}

section.post-detail .swiper-inner .swiper-button-prev::after{
    background: url(../images/about_slide-arrow-left.png) no-repeat center/cover;
}

section.post-detail .sub-swiper{
    max-width: 950px;
    width: 100%;
    margin-bottom: 50px;
}

section.post-detail .sns-list{
    display: flex;
    align-items: center;
    gap: 15px;
    max-width: 138px;
    width: 100%;
    margin-top: 25px;
    margin-bottom: 50px;
    margin-left: calc(100% - 138px - 25px);
}

.post-nav{
    display: flex;
    justify-content: center;
    gap: 25px;
    color: rgb(var(--orange));
}

.post-nav .post-nav--prev a,
.post-nav .post-nav--next a{
    width: 30px;
    height: 30px;
    background-color: rgb(var(--green));
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.post-nav .post-nav--prev a:hover,
.post-nav .post-nav--next a:hover{
    filter: brightness(1.2);
}

.post-nav .post-nav--prev a::before{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-left.png) no-repeat center/cover;
}

.post-nav .post-nav--next a::before{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
}

.post-nav .post-nav--prev:has(span.disabled),
.post-nav .post-nav--next:has(span.disabled){
    width: 30px;
    height: 30px;
    border-radius: 50px;
    display: grid;
    place-items: center;
    background-color: rgb(var(--bg-color));
}

.post-nav .post-nav--prev span.disabled{
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-left.png) no-repeat center/cover;
}

.post-nav .post-nav--next span.disabled{
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
}

@media screen and (max-width:1023px) {
    section.post-detail{
        padding-top: 80px;
    }

    section.post-detail .post-swiper{
        width: 90%;
        height: 350px;
    }
}

@media screen and (max-width:767px) {
    section.post-detail{
        padding-top: 40px;
    }

    section.post-detail .title{
        margin-bottom: 30px;
    }

    section.post-detail .swiper-inner .swiper-button-next,
    section.post-detail .swiper-inner .swiper-button-prev{
        width: 35px;
        height: 35px;
    }

    .swiper-button-next,
    .swiper-rtl .swiper-button-prev{
        right: 0;
    }

    .swiper-button-prev,
    .swiper-rtl .swiper-button-next{
        left: 0;
    }

    section.post-detail .post-swiper{
        height: 200px;
    }

    section.post-detail .post-swiper{
        margin-bottom: 15px;
    }

    section.post-detail .sub-swiper{
        height: 110px;
        margin-bottom: 30px;
    }

    section.post-detail .title{
        padding: 0 10px 15px 10px;
    }

    section.post-detail .title .category{
        padding: 5px 0;
    }

    section.post-detail .title .date{
        font-size: 14px;
    }

    section.post-detail .title .date-wrap{
        gap: 5px;
    }

    section.post-detail .title .title-name{
        font-size: 1.6rem;
    }

    section.post-detail .text{
        padding: 0;
    }

    section.post-detail .sns-list{
        margin-top: 15px;
        margin-bottom: 30px;
        margin-left: calc(100% - 138px);
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */



/* =========================================== */
/*contact*/
/* =========================================== */
/* mv ~~~~~~~~~~~~~~~ */
section.contact-bg{
    background-image: url(../images/contact_mv.jpg);
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* induction ~~~~~~~~~~~~~~~ */
section.contact{
    background-color: rgb(var(--white));
    padding-top: 0;
    padding-bottom: 150px;
}

section.contact .contact-induction{
    text-align: center;
    padding: 100px 0;
    position: relative;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    z-index: 1;
}

section.contact .contact-induction h3{
    margin-bottom: 35px;
}

section.contact .contact-induction p{
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.contact .contact-induction .ornament-image:first-of-type{
    max-width: 100px;
    position: absolute;
    bottom: 13%;
    left: -20%;
    z-index: -1;
}

section.contact .contact-induction .ornament-image:last-of-type{
    max-width: 145px;
    position: absolute;
    right: -15%;
    bottom: 55%;
    z-index: -1;
}

@media screen and (max-width:1023px) {
    section.contact{
        padding-bottom: 100px;
    }

    section.contact .contact-induction{
        padding: 80px 0;
    }

    section.contact .contact-induction h3{
        margin-bottom: 20px;
    }

    section.contact .contact-induction .ornament-image:first-of-type{
        max-width: 60px;
        bottom: 16%;
        left: -10%;
    }

    section.contact .contact-induction .ornament-image:last-of-type{
        max-width: 120px;
        bottom: 58%;
        right: -8%;
    }
}

@media screen and (max-width:767px) {
    section.contact{
        padding-bottom: 40px;
    }

    section.contact .contact-induction{
        padding: 40px 0;
    }

    section.contact .contact-induction h3 > span:nth-of-type(3){
        display: block;
    }

    section.contact .contact-induction h3 span.no-display{
        display: none;
    }

    section.contact .contact-induction .ornament-image:first-of-type{
        width: 50px;
        bottom: 38%;
        left: 0%;
    }

    section.contact .contact-induction .ornament-image:last-of-type{
        width: 100px;
        right: -3%;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* contact-action ~~~~~~~~~~~~~~~ */
section.contact .contact-action{
    background-color: rgb(var(--bg-color));
    padding: 50px 0;
    margin-bottom: 50px;
    border-radius: 45px;
}

section.contact .contact-action .action-list{
    display: flex;
    flex-wrap: wrap;
    -moz-column-gap: 40px;
        column-gap: 40px;
}

section.contact .contact-action .action-list .list-item{
    width: calc((100% - 40px)/ 2);
    text-align: center;
}

section.contact .contact-action .action-list .list-item .icon{
    width: 40px;
    height: 40px;
    margin: 0 auto 20px;
}

section.contact .contact-action .action-list .list-item p.title{
    font-size: 1.4375rem;
    letter-spacing: 0.05em;
    line-height: 1.5;
    margin-bottom: 10px;
}

section.contact .contact-action .action-list .list-item p.title span,section.contact .contact-action .action-list .list-item p span{
    font-family: "Montserrat", sans-serif;
}

section.contact .contact-action .action-list .list-item.tel a{
    font-family: "Montserrat", sans-serif;
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.1em;
    color: rgb(var(--green));
    margin-bottom: 5px;
}

section.contact .contact-action .action-list .list-item p{
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.contact .contact-action .action-list .list-item.line p{
    margin-bottom: 10px;
}

section.contact .contact-action .action-list .list-item.line a.btn250{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

section.contact .contact-action .action-list .list-item.line a.btn250:hover{
    -webkit-filter: brightness(1.2);
            filter: brightness(1.2);
}

section.contact .contact-action .action-list .list-item.line a.btn250 div:first-of-type{
    flex-grow: 1;
    line-height: 1.5;
}

section.contact .contact-action .action-list .list-item.line a.btn250 div:last-of-type{
    width: 13px;
    height: 13px;
    background: url(../images/icon_need.png) no-repeat center/contain;
}

@media screen and (max-width:1023px) {
    section.contact .contact-action .action-list{
        -moz-column-gap: 15px;
            column-gap: 15px;
    }

    section.contact .contact-action .action-list .list-item{
        width: calc((100% - 15px)/ 2);
    }
}

@media screen and (max-width:767px) {
    section.contact .contact-action{
        padding: 30px 0;
        width: calc(100% - 32px);
        margin: 0 auto;
        margin-bottom: 30px;
    }

    section.contact .contact-action .action-list{
        row-gap: 15px;
    }

    section.contact .contact-action .action-list .list-item{
        width: 100%;
    }

    section.contact .contact-action .action-list .list-item .icon{
        margin-bottom: 15px;
    }

    section.contact .contact-action .action-list .list-item p.title,
    section.contact .contact-action .action-list .list-item p,
    section.contact .contact-action .action-list .list-item.tel a{
        line-height: 1.2;
    }

    section.contact .contact-action .action-list .list-item.tel a{
        margin-bottom: 0;
    }

    section.contact .contact-action .action-list .list-item.tel{
        padding-bottom: 20px;
        border-bottom: 2px solid #d2d2d2;
    }

    section.contact .contact-action .action-list .list-item p.title,
    section.contact .contact-action .action-list .list-item p,
    section.contact .contact-action .action-list .list-item.tel a,
    section.contact .contact-action .action-list .list-item.line a.btn250 div:first-of-type{
        line-height: 1.2;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */


/* contact-form ~~~~~~~~~~~~~~~ */
section.contact .contact-form{
    background-color: rgb(var(--bg-color));
    padding: 75px 0;
    border-radius: 45px;
}

section.contact .contact-form .h-title{
    margin-bottom: 25px;
    background-image : linear-gradient(to right, rgb(var(--green)) 10px, transparent 10px);
    background-size: 20px 2px;
    background-repeat: repeat-x;
    background-position: left bottom;
    width: 36%;
    margin: 0 auto 35px;
    padding-bottom: 25px;
}

section.contact .contact-form .h-title .icon{
    width: 40px;
    height: 30px;
    margin: 0 auto 10px;
}

section.contact .contact-form .h-title p{
    text-align: center;
    font-size: 1.4375rem;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.contact .contact-form .input-list .list-item .item-title:has(.required){
    display: flex;
    align-items: center;
    gap: 15px;
}

section.contact .contact-form .input-list .list-item .item-title{
    margin-bottom: 10px;
}

section.contact .contact-form .input-list .list-item .item-title p{
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.contact .contact-form .input-list .list-item .item-title .required{
    padding: 3px 10px;
    border-radius: 10px;
    line-height: 1.1;
    background-color: rgb(var(--orange));
    color: rgb(var(--white));
}

section.contact .contact-form p.policy a{
    display: inline-block;
    position: relative;
    font-weight: 500;
}

section.contact .contact-form p.policy a::before{
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: rgb(var(--text-black));
    position: absolute;
    bottom: 1px;
    left: 0;
}

section.contact .contact-form .input-list{
    width: calc(100% - 100px);
    margin: 0 auto;
}

section.contact .contact-form .input-list .list-item{
    margin-bottom: 35px;
}

section.contact .contact-form .input-list .item-input.select{
    width: 45%;
    position: relative;
}

section.contact .contact-form .input-list .item-input.select::after{
    content:"";
    display: block;
    width: 15px;
    height: 15px;
    background-color: rgb(var(--text-black));
    -webkit-clip-path: polygon(100% 0, 0 0, 50% 100%);
            clip-path: polygon(100% 0, 0 0, 50% 100%);
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    pointer-events: none;
}

section.contact .contact-form .consent{
    text-align: center;
    line-height: 1.5;
    letter-spacing: 0.05em;
}

section.contact .contact-form .consent .acceptance{
    margin-right: 10px;
}

section.contact .contact-form .input-list .item-input input,
section.contact .contact-form .input-list .item-input select,
section.contact .contact-form .input-list .item-input textarea{
    padding: 15px 30px;
    border-radius: 15px;
    border: 1px solid rgb(var(--brown));
    line-height: 1.5;
    text-align: left;
}

section.contact .contact-form .input-list .item-input .user-name::-webkit-input-placeholder, section.contact .contact-form .input-list .item-input textarea::-webkit-input-placeholder{
    font-family: "Kiwi Maru", serif;
}

section.contact .contact-form .input-list .item-input .user-name::-moz-placeholder, section.contact .contact-form .input-list .item-input textarea::-moz-placeholder{
    font-family: "Kiwi Maru", serif;
}

section.contact .contact-form .input-list .item-input .user-name:-ms-input-placeholder, section.contact .contact-form .input-list .item-input textarea:-ms-input-placeholder{
    font-family: "Kiwi Maru", serif;
}

section.contact .contact-form .input-list .item-input .user-name::-ms-input-placeholder, section.contact .contact-form .input-list .item-input textarea::-ms-input-placeholder{
    font-family: "Kiwi Maru", serif;
}

section.contact .contact-form .input-list .item-input .user-name::placeholder,
section.contact .contact-form .input-list .item-input textarea::placeholder{
    font-family: "Kiwi Maru", serif;
}

section.contact .contact-form .input-list .item-input .user-mail::-webkit-input-placeholder, section.contact .contact-form .input-list .item-input .telephone-number::-webkit-input-placeholder{
    font-family: "Montserrat", sans-serif;
}

section.contact .contact-form .input-list .item-input .user-mail::-moz-placeholder, section.contact .contact-form .input-list .item-input .telephone-number::-moz-placeholder{
    font-family: "Montserrat", sans-serif;
}

section.contact .contact-form .input-list .item-input .user-mail:-ms-input-placeholder, section.contact .contact-form .input-list .item-input .telephone-number:-ms-input-placeholder{
    font-family: "Montserrat", sans-serif;
}

section.contact .contact-form .input-list .item-input .user-mail::-ms-input-placeholder, section.contact .contact-form .input-list .item-input .telephone-number::-ms-input-placeholder{
    font-family: "Montserrat", sans-serif;
}

section.contact .contact-form .input-list .item-input .user-mail::placeholder,
section.contact .contact-form .input-list .item-input .telephone-number::placeholder{
    font-family: "Montserrat", sans-serif;
}

input[type="checkbox"]{
	position: relative;
	margin: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 20px;
	height: 20px;
	border: 1px solid rgba(var(--text-black));
    background-color: rgb(var(--white));
	vertical-align: text-bottom;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 0px;
}

input[type="checkbox"]:checked:before {
    content: '';
    display: block;
    position: absolute;
    width: 7px;
    height: 13px;
    top: -1px;
    left: 5px;
    transform: rotate(50deg);
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0px;
}

section.contact .contact-form .wpcf7-form-control-wrap,
section.contact .contact-form .wpcf7-form-control{
    width: 100%;
}

section.contact .contact-form button{
    width: 250px;
    padding: 15px 50px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: rgb(var(--white));
    gap: 10px;
    margin: 35px auto;
}

input.wpcf7-submit {
    display: none;
}

section.contact .contact-form button.submit-button[disabled]{
    background: url(../images/button-bg250-disabled.png) no-repeat center/contain;
    pointer-events: none;
    cursor: not-allowed;
}

section.contact .contact-form button.submit-button:not([disabled]){
    background: url(../images/button-bg250.png) no-repeat center/contain;
    cursor: pointer;
}

section.contact .contact-form button span{
    flex-grow: 1;
}

section.contact .contact-form button::after{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: url(../images/about_slide-arrow-right.png) no-repeat center/cover;
    pointer-events: none;
}

section.contact .contact-form .policy{
    text-align: center;
    letter-spacing: 0.05em;
    line-height: 1.5;
}

@media screen and (max-width:1024px) {
    section.contact .contact-form{
        padding: 50px 0;
    }

    section.contact .contact-form .h-title{
        width: 45%;
    }
}

@media screen and (max-width:767px) {
    section.contact .contact-form{
        width: calc(100% - 32px);
        margin: 0 auto;
    }

    section.contact .contact-form .h-title{
        width: 80%;
        line-height: 1.2;
        padding-bottom: 10px;
    }

    section.contact .contact-form .h-title .icon{
        margin-bottom: 5px;
    }

    section.contact .contact-form .input-list{
        width: 100%;
    }

    section.contact .contact-form .input-list .list-item .item-title p{
        line-height: 1.2;
    }

    section.contact .contact-form .input-list .item-input input,
    section.contact .contact-form .input-list .item-input select, section.contact .contact-form .input-list .item-input textarea{
        padding: 10px 20px;
        text-align: left;
    }

    section.contact .contact-form .input-list .list-item .item-title:has(.required){
        gap: 5px;
    }

    section.contact .contact-form .input-list .list-item{
        margin-bottom: 25px;
    }

    section.contact .contact-form button{
        margin: 20px auto;
    }

    section.contact .contact-form .policy{
        text-align: left;
        line-height: 1.2;
    }

    section.contact .contact-form .policy span{
        display: inline;
    }

    section.contact .contact-form .input-list .item-input.select::after{
        width: 10px;
        height: 10px;
    }
}
/* ~~~~~~~~~~~~~~~~~~~~~ */