@charset "UTF-8";

.index {
}


/*----------------------------
    共通
----------------------------*/


/*----------------------------
    スライダー
----------------------------*/
.index .topSec {
    position: relative;
    margin-bottom: 96px;
}
/*メイン テキスト*/
.index .topSec .imgBox {
    position: relative;
}
.index .topSec .main-txtBox {
    position: absolute;
    top: 10.9%;
    right: 12%;
    width: 38.5%;
    z-index: 2;
}
.index .topSec .main-txtBox .txt-img01 {
    width: 100%;
    margin-bottom: 47px;
}
.index .topSec .main-txtBox .txt-img02 {
    width: 100%;
}
.index .topSec .top-newsBox {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 45px 0 0;
}
.index .topSec .top-newsBox .txt {
    width: 331px;
    margin-right: 98px;
    padding: 15px 0;
    border-top: 1px solid #e97878;
    border-bottom: 1px solid #e97878;
}
.index .topSec .top-newsBox .txt p {
    font-size: 2.1rem;
    font-weight: 600;
    text-align: center;
    color: #e97878;
    letter-spacing: 0.4rem;
}
.index .topSec .top-newsBox .lBtn {
    width: 321px;
}



/*----------------------------
    aboutSec
----------------------------*/
.index .aboutSec {
    margin-bottom: 22px;
}
.index .aboutSec .inBox {
}
.index .aboutSec .headline01 {
    margin-bottom: 30px;
}
.index .aboutSec .headline01 .en {
    width: 58px;
}
.index .aboutSec .txtBox {
    width: 597px;
    margin: 0 auto;
}
.index .aboutSec .txtBox .pTxt {
}
.index .aboutSec .txtBox .aTxt {
    margin-top: 43px;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
}
.index .aboutSec .txtBox .aTxt.open {
    display: none;
}
.index .aboutSec .imgBox {
    width: 610px;
    margin: 51px auto 0;
}
.index .aboutSec .imgBox img {
    border-radius: 30px;
}



/*----------------------------
    preciousSec
----------------------------*/
.index .preciousSec {
    position: relative;
    padding: 108px 0 0;
    background: #f9f4e9;
    z-index: 1;
}
.index .preciousSec:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, transparent, #fff 50%);
    z-index: -1;
}
.index .preciousSec .inBox {
}
.index .preciousSec .headline02 {
    margin-bottom: 42px;
}
.index .preciousSec .flexBox {
    justify-content: center;
    align-items: stretch;
}
.index .preciousSec .flexBox .flexCon {
    width: 300px;
    margin: 0 12px;
    padding: 42px 40px;
    background: #fff;
    border-radius: 28px;
    box-sizing: border-box;
}
.index .preciousSec .flexBox .flexCon .headline03 {
    margin-bottom: 18px;
    color: #6e4d3a;
    text-align: center;
}


/*----------------------------
    serviceSec
----------------------------*/
.index .serviceSec {
    position: relative;
    z-index: 1;
}
.index .serviceSec:before {
    content: "";
    position: absolute;
    top: 138px;
    left: calc(50% - 383px);
    width: 391px;
    height: 491px;
    background: url("../img/common/bg-tulip.svg")no-repeat top left;
    background-size: 100% 100%;
    transform: translateX(-50%);
    mix-blend-mode: multiply;
}
.index .serviceSec .serviceBox {
    padding: 119px 0 136px;
    background: #f9f4e9;
}
.index .serviceSec .serviceBox .headline01 {
    margin-bottom: 38px;
}
.index .serviceSec .serviceBox .headline01 .en {
    width: 70px;
}
.index .serviceSec .serviceBox .headline02 {
    margin-bottom: 55px;
}
.index .serviceSec .serviceBox .flexBox {
    position: relative;
    justify-content: center;
    align-items: stretch;
}
.index .serviceSec .serviceBox .flexBox:before {
    content: "";
    position: absolute;
    bottom: -200px;
    left: calc(50% + 471px);
    width: 243px;
    height: 299px;
    background: url("../img/common/bg-tulip.svg")no-repeat top left;
    background-size: 100% 100%;
    transform: translateX(-50%);
    mix-blend-mode: multiply;
    z-index: 1;
}
.index .serviceSec .serviceBox .flexBox .flexCon {
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    align-items: stretch;
    width: 300px;
    margin: 0 10px;
    background: #fff;
    border: 1px solid #e84746;
    border-radius: 28px;
    box-sizing: border-box;
    z-index: 2;
    overflow: hidden;
}
.index .serviceSec .serviceBox .flexBox .flexCon .txtBox {
    padding: 36px 32px 11px;
}
.index .serviceSec .serviceBox .flexBox .flexCon .headline03 {
    margin-bottom: 23px;
    color: #e84746;
    font-size: 2.1rem;
    text-align: center;
}
.index .serviceSec .serviceBox .flexBox .flexCon .listUl {
    margin-bottom: 19px;
}
.index .serviceSec .serviceBox .flexBox .flexCon .listUl li {
    margin-bottom: 16px;
    line-height: 1.4;
}
.index .serviceSec .serviceBox .flexBox .flexCon .listUl li:last-child {
    margin-bottom: 0;
}

.index .serviceSec .featuresBox {
    position: relative;
    background: transparent;
}
.index .serviceSec .featuresBox:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 8%;
    background: linear-gradient(0deg, transparent, #f9f4e9 100%);
}
.index .serviceSec .featuresBox .bgBox {
    position: relative;
    background: url("../img/index/img-features01.jpg")no-repeat bottom left 50%;
    background-size: cover;
    margin-top: 82px;
    padding: 0 0 941px;
}
.index .serviceSec .featuresBox .bgBox .flexBox {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: flex-start;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 312px;
    height: 312px;
    margin: 0 24px;
    background: url("../img/index/features-bg.svg")no-repeat top left;
    background-size: 100% 100%;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon:before {
    content: "";
    position: absolute;
    top: -21px;
    left: calc(50% - 54px);
    width: 44px;
    height: 31px;
    background: url("../img/index/txt-point.svg")no-repeat top left;
    background-size: 100% 100%;
    transform: translateX(-50%);
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon .no {
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon .headline03 {
    margin-bottom: 13px;
    color: #6e4d3a;
    font-size: 2rem;
    text-align: center;
    line-height: 1.4;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon .pTxt {
    width: 210px;
    margin: 0 auto;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con01 {
    margin-top: 86px;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con03 {
    margin-top: 86px;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con01 .no {
    width: 25px;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con02 .no {
    width: 35px;
}
.index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con03 .no {
    width: 33px;
}


.index .serviceSec .featuresBox .mapBox {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: -193px 0 53px;
}
.index .serviceSec .featuresBox .mapBox .mapWrap {
    width: 670px;
    margin-left: -205px;
}
.index .serviceSec .featuresBox .mapBox .lBtn {
    width: 284px;
    margin: 0 0 0 121px;
}


/*----------------------------
    useSec
----------------------------*/
.index .useSec {
}
.index .useSec .headline01 {
    margin-bottom: 66px;
}
.index .useSec .headline01 .en {
    width: 108px;
}
.index .useSec .flexBox {
    justify-content: center;
    align-items: stretch;
    margin-bottom: 78px;
}
.index .useSec .flexBox .flexCon {
    position: relative;
    width: 210px;
    margin: 0 14px;
    padding: 19px 19px 32px;
    background: #fff;
    border: 2px solid #dfbe46;
    border-radius: 28px;
    box-sizing:border-box;
}
.index .useSec .flexBox .flexCon .no {
    position: absolute;
    top: -16px;
    left: 50%;
    width: 30px;
    transform: translateX(-50%);
}
.index .useSec .flexBox .flexCon .iconBox {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 165px;
}
.index .useSec .flexBox .flexCon.con01 .iconBox img {
    width: 110px;
}
.index .useSec .flexBox .flexCon.con02 .iconBox img {
    width: 109px;
}
.index .useSec .flexBox .flexCon.con03 .iconBox img {
    width: 71px;
}
.index .useSec .flexBox .flexCon.con04 .iconBox img {
    width: 101px;
}

.index .useSec .flexBox .flexCon .pTxt {
}
.index .useSec .lBtn {
    width: 284px;
    margin: 0 auto;
}



/*----------------------------
    symbolSec
----------------------------*/
.index .symbolSec {
    position: relative;
    padding: 121px 0 164px;
    background: #f9f4e9;
    z-index: 1;
}
.index .symbolSec:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 43%;
    background: linear-gradient(0deg, transparent, #fff 100%);
    z-index: -1;
}
.index .symbolSec:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 43%;
    background: linear-gradient(0deg,#fff , transparent 100%);
    z-index: -1;
}
.index .symbolSec .inBox {
    max-width: 931px;
    margin: 0 auto;
    padding: 49px 101px 58px;
    background: #fff;
    border-radius: 28px;
    box-sizing: border-box;
}
.index .symbolSec .headline02 {
    margin-bottom: 49px;
}
.index .symbolSec .flexBox {
    justify-content: space-between;
    align-items: center;
}
.index .symbolSec .txtBox {
    margin-top: 9px;
}
.index .symbolSec .txtBox .headline03 {
    margin-bottom: 24px;
    font-weight: 600;
}
.index .symbolSec .symbolBox {
    width: 235px;
    margin-right: 25px;
}



/*----------------------------
    corporationSec
----------------------------*/
.index .corporationSec {
    position: relative;
    margin-bottom: 40px;
    z-index: 1;
}
.index .corporationSec:before {
    content: "";
    position: absolute;
    top: -120px;
    left: calc(50% - 383px);
    width: 391px;
    height: 491px;
    background: url("../img/common/bg-tulip.svg")no-repeat top left;
    background-size: 100% 100%;
    transform: translateX(-50%);
    mix-blend-mode: multiply;
    z-index: -1;
}
.index .corporationSec:after {
    content: "";
    position: absolute;
    bottom: 138px;
    left: calc(50% + 471px);
    width: 243px;
    height: 299px;
    background: url("../img/common/bg-tulip.svg")no-repeat top left;
    background-size: 100% 100%;
    transform: translateX(-50%);
    mix-blend-mode: multiply;
    z-index: -1;
}
.index .corporationSec .headline01 {
    margin-bottom: 75px;
}
.index .corporationSec .headline01 .en {
    width: 248px;
}
.index .corporationSec .headline02 {
    margin-bottom: 75px;
}
.index .corporationSec .flexBox {
    justify-content: center;
    align-items: flex-start;
    margin-bottom: 68px;
}
.index .corporationSec .flexBox .txtBox {
    width: 544px;
    margin-right: 57px;
}
.index .corporationSec .flexBox .imgBox {
}
.index .corporationSec .flexBox .imgBox img {
    display: block;
    width: 378px;
    border-radius: 28px;
}
.index .corporationSec .flexBox .imgBox .img01 {
    margin-bottom: 44px;
    margin-left: 88px;
}
.index .corporationSec .lBtn {
    width: 321px;
    margin: 0 auto 49px;
}
.index .corporationSec .aTxt {
    text-align: center;
}
.index .corporationSec .aTxt a {
    text-decoration: underline;
}





@media all and (max-width: 834px){

    /*----------------------------
        スライダー
    ----------------------------*/
    .index .topSec {
        margin-bottom: 68px;
    }
    /*メイン テキスト*/
    .index .topSec .main-txtBox {
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }
    .index .topSec .main-txtBox .txt-img01 {
        position: absolute;
        bottom: 4.8%;
        left: 4.5%;
        width: 52.3%;
        margin-bottom: 0;
    }
    .index .topSec .main-txtBox .txt-img02 {
        position: absolute;
        top: 3.7%;
        left: 50%;
        width: 64.5%;
        transform: translateX(-50%);
    }
    .index .topSec .top-newsBox {
        flex-flow: column;
        width: 70%;
        margin: 23px auto 0;
    }
    .index .topSec .top-newsBox .txt {
        width: 100%;
        margin: 0 0 30px;
        padding: 15px 0;
    }
    .index .topSec .top-newsBox .txt p {
        font-size: 1.5rem;
    }
    .index .topSec .top-newsBox .lBtn {
        width: 100%;
    }



    /*----------------------------
        aboutSec
    ----------------------------*/
    .index .aboutSec {
        margin-bottom: 30px;
    }
    .index .aboutSec .headline01 {
        margin-bottom: 29px;
    }
    .index .aboutSec .headline01 .en {
        width: 58px;
    }
    .index .aboutSec .txtBox {
        width: 80%;
    }
    .index .aboutSec .txtBox .aTxt {
        margin-top: 43px;
    }
    .index .aboutSec .imgBox {
        width: 92%;
        margin: 51px auto 0;
    }
    .index .aboutSec .imgBox img {
        border-radius: 17px;
    }



    /*----------------------------
        preciousSec
    ----------------------------*/
    .index .preciousSec {
        padding: 64px 0 0;
    }
    .index .preciousSec:before {
        height: 16%;
        background: linear-gradient(0deg, transparent, #fff 100%);
    }
    .index .preciousSec .headline02 {
        margin-bottom: 42px;
    }
    .index .preciousSec .flexBox {
        flex-flow: column;
    }
    .index .preciousSec .flexBox .flexCon {
        width: 92%;
        margin: 0 auto 16px;
        padding: 30px 6% 28px;
        border-radius: 14px;
    }
    .index .preciousSec .flexBox .flexCon .headline03 {
        margin-bottom: 16px;
    }


    /*----------------------------
        serviceSec
    ----------------------------*/
    .index .serviceSec:before {
        top: 22px;
        left: calc(50% - 107px);
        width: 258px;
        height: 321px;
    }
    .index .serviceSec .serviceBox .headline01 {
        margin-bottom: 28px;
    }
    .index .serviceSec .serviceBox {
        padding: 78px 0 84px;
    }
    .index .serviceSec .serviceBox .headline01 .en {
        width: 70px;
    }
    .index .serviceSec .serviceBox .headline02 {
        margin-bottom: 46px;
    }
    .index .serviceSec .serviceBox .flexBox {
        flex-flow: column;
        justify-content: center;
        align-items: stretch;
    }
    .index .serviceSec .serviceBox .flexBox:before {
        left: calc(50% + 120px);
        width: 166px;
        height: 206px;
    }
    .index .serviceSec .serviceBox .flexBox .flexCon {
        width: 92%;
        margin: 0 auto 18px;
        border-radius: 14px;
    }
    .index .serviceSec .serviceBox .flexBox .flexCon .txtBox {
        padding: 29px 6% 15px;
    }
    .index .serviceSec .serviceBox .flexBox .flexCon:last-child {
        margin-bottom: 0;
    }
    .index .serviceSec .serviceBox .flexBox .flexCon .headline03 {
        margin-bottom: 18px;
    }
    .index .serviceSec .serviceBox .flexBox .flexCon .listUl {
        margin-bottom: 19px;
    }
    .index .serviceSec .serviceBox .flexBox .flexCon .listUl li {
        margin-bottom: 13px;
        line-height: 1.4;
    }

    .index .serviceSec .featuresBox:before {
        top: 0;
        left: 0;
        width: 100%;
        height: 8%;
        background: linear-gradient(0deg, transparent, #f9f4e9 100%);
    }
    .index .serviceSec .featuresBox .headline02 {
        margin-bottom: 59px;
    }
    .index .serviceSec .featuresBox .bgBox {
        background: url("../img/index/sp-img-features01.jpg")no-repeat bottom left 50%;
        background-size: 100%;
        margin-top: 0;
        padding: 0 0 470px;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox {
        position: relative;
        top: 0;
        left: 0;
        transform: translateX(0);
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon {
        width: 330px;
        height: 330px;
        margin: 0;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon:before {
        top: 11px;
        left: calc(50% - 46px);
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon .no {
        top: -25px;
        left: 50%;
        transform: translateX(-50%);
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon .headline03 {
        margin-bottom: 11px;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon .pTxt {
        width: 225px;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con01 {
        margin: 0 auto 10px -5%;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con02 {
        margin: 0 -5% 10px auto;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con03 {
        margin: 0 auto 0 -5%;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con01 .no {
        width: 25px;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con02 .no {
        width: 35px;
    }
    .index .serviceSec .featuresBox .bgBox .flexBox .flexCon.con03 .no {
        width: 33px;
    }


    .index .serviceSec .featuresBox .mapBox {
        flex-flow: column;
        margin: -200px 0 88px;
    }
    .index .serviceSec .featuresBox .mapBox .mapWrap {
        width: 115%;
        margin-left: 0;
    }
    .index .serviceSec .featuresBox .mapBox .lBtn {
        width: 70%;
        margin: 0 auto;
    }


    /*----------------------------
        useSec
    ----------------------------*/
    .index .useSec .headline01 {
        margin-bottom: 45px;
    }
    .index .useSec .headline01 .en {
        width: 108px;
    }
    .index .useSec .flexBox {
        flex-flow: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 43px;
    }
    .index .useSec .flexBox .flexCon {
        width: 90%;
        margin: 0 0 34px;
        padding: 15px 6% 27px;
        border-radius: 14px;
    }
    .index .useSec .flexBox .flexCon:last-child {
        margin-bottom: 0;
    }
    .index .useSec .flexBox .flexCon .no {
        top: -16px;
        width: 35px;
    }
    .index .useSec .flexBox .flexCon .iconBox {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 135px;
    }
    .index .useSec .flexBox .flexCon.con01 .iconBox img {
        width: 100px;
    }
    .index .useSec .flexBox .flexCon.con02 .iconBox img {
        width: 99px;
    }
    .index .useSec .flexBox .flexCon.con03 .iconBox img {
        width: 61px;
    }
    .index .useSec .flexBox .flexCon.con04 .iconBox img {
        width: 91px;
    }
    .index .useSec .flexBox .flexCon .pTxt {
        font-size: 1.5rem;
        line-height: 1.6;
        text-align: center;
    }
    .index .useSec .lBtn {
        width: 70%;
    }



    /*----------------------------
        symbolSec
    ----------------------------*/
    .index .symbolSec {
        padding: 75px 0 94px;
    }
    .index .symbolSec:before {
        top: 0;
        left: 0;
        width: 100%;
        height: 43%;
        background: linear-gradient(0deg, transparent, #fff 100%);
    }
    .index .symbolSec:after {
        bottom: 0;
        left: 0;
        width: 100%;
        height: 43%;
        background: linear-gradient(0deg,#fff , transparent 100%);
    }
    .index .symbolSec .inBox {
        width: 90%;
        padding: 41px 6% 38px;
        border-radius: 14px;
    }
    .index .symbolSec .headline02 {
        margin-bottom: 67px;
    }
    .index .symbolSec .flexBox {
        flex-flow: column;
        justify-content: center;
        align-items: center;
    }
    .index .symbolSec .txtBox {
        order: 2;
        margin-top: 9px;
    }
    .index .symbolSec .txtBox .headline03 {
        margin-bottom: 24px;
        text-align: center;
    }
    .index .symbolSec .symbolBox {
        order: 1;
        width: 66%;
        margin: 0 0 41px 28px;
    }



    /*----------------------------
        corporationSec
    ----------------------------*/
    .index .corporationSec {
        margin-bottom: 55px;
    }
    .index .corporationSec:before {
        top: 3px;
        left: calc(50% - 109px);
        width: 258px;
        height: 321px;
    }
    .index .corporationSec:after {
        left: calc(50% + 120px);
        width: 166px;
        height: 206px;
    }
    .index .corporationSec .headline01 {
        margin-bottom: 47px;
    }
    .index .corporationSec .headline01 .en {
        width: 248px;
    }
    .index .corporationSec .headline02 {
        margin-bottom: 28px;
    }
    .index .corporationSec .flexBox {
        flex-flow: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 46px;
    }
    .index .corporationSec .flexBox .txtBox {
        width: 80%;
        margin: 0 auto 48px;
    }
    .index .corporationSec .flexBox .imgBox {
        width: 92%;
        margin: 0 auto;
    }
    .index .corporationSec .flexBox .imgBox img {
        width: 70%;
        border-radius: 14px;
    }
    .index .corporationSec .flexBox .imgBox .img01 {
        margin-bottom: 20px;
        margin-left: auto;
    }
    .index .corporationSec .lBtn {
        width: 70%;
        margin: 0 auto 37px;
    }

}