
  /* Gift for you */
 #giftforyou{
    width: 100%;
    padding:var(--section-margin) 0;
 }
 #giftforyou .main_wrap{
    max-width: var(--page-max-width);
    width: 100%;
    min-width: var(--page-min-width);
    margin: auto;
    padding:0 var(--page-padding);
 }
ul.giftforyou_thumb{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: var(--section-margin8);
    gap: var(--section-margin6);
}
ul.giftforyou_thumb li{
    width: calc((100% - (2 * var(--section-margin6)))/3);
}
ul.giftforyou_thumb li img{
    width: 100%;
    height: auto;
}
@media screen and (max-width: 768px) {
    ul.giftforyou_thumb{

        gap: var(--section-margin2);
    }
    ul.giftforyou_thumb li{
        width: calc((100% - (2 * var(--section-margin2)))/3);
    }

}
#giftforyou .giftforyou_text{
    width: 80%;
    margin: var(--section-margin8) auto 0;
}
#giftforyou .giftforyou_text p{
    width: 100%;
    font-size: var(--font-m);
    line-height: 180%;
    font-weight: 500;
    margin-bottom: var(--section-margin4);
}
#giftforyou .giftforyou_text p:last-child{
    margin-bottom: 0;
}

/*service*/
#service{
    width: 100%;
    background-color: var(--gray-color);
}
#service .title_wrap{
    width: 100%;
    padding:var(--section-margin8) var(--page-padding);
    background-color: var(--mos-green-color);
}
#service .title_wrap h3.sub {
    color: #FFF;
    text-shadow:
      1px 1px 14px rgba(0, 0, 0, 0.4),   /* 下影（濃い） */
     -1px -1px 2px rgba(255, 255, 255, 0.3); /* 上光（明るい） */
  }
#service .main_wrap{
    max-width: var(--page-max-width);
    width: 100%;
    min-width: var(--page-min-width);
    padding: var(--section-margin) 0;
}
#service .service_wrap{
    margin-bottom: var(--section-margin6);
}
#service .service_wrap:last-child{
    margin-bottom: 0;
}
#service .head_title{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding:var(--section-margin6) var(--page-padding) 0;
    position: relative;
    z-index: 1;
}
#service .head_title .number{
    width: 300px;
    font-family: var(--font-number);
    color: #FFF;
    font-size: var(--font-number-size);
    font-weight: 700;
}
#service .head_title h3.sub{
    width: 100%;
    padding-top: var(--section-margin3);
    text-align: left
}
#service img.service_thumb{
    width: 100%;
    height: auto;
    margin-top: calc((var(--section-margin)) * -1.0);
}
#service img.service_thumb.service03{
    margin-top: calc((var(--section-margin)) * -0.5);
}
@media screen and (max-width: 768px) {
    #service .head_title{
        padding: 0 var(--page-padding);
        align-items: center;
        margin-bottom: var(--section-margin2);
    }
    #service .head_title .number{
        width: 80px;
        font-family: var(--font-number);
        color: #FFF;
        font-size: var(--font-number-size);
        font-weight: 700;
    }
    #service .head_title h3.sub{
        width: 100%;
        padding-top: 0;
        text-align: left
    }
    #service img.service_thumb{
        width: 100%;
        height: auto;
        margin-top: 0;
    }
    #service img.service_thumb.service03{
        margin-top: 0;
    }
}

#service .service_text{
    width: 100%;
    padding:0 var(--page-padding);
    margin: var(--section-margin8) auto 0;
}
#service .service_text p{
    width: 80%;
    font-size: var(--font-m);
    line-height: 180%;
    font-weight: 500;
    margin: 0 auto var(--section-margin4);
}
#service .service_text p:last-child{
    margin-bottom: 0;
}
#service .service_text a.btn{
    width: 100%;
    display: flex;
    align-items: center;
    background-color: #FFF;
    padding:30px 40px;
    border:5px solid var(--sub-title-color);
    margin-top: var(--section-margin8);
}
#service .service_text a.btn.service01{
    justify-content: space-between;
}
#service .service_text a.btn.service02{
    justify-content: center;
}
#service .service_text a.btn .btn__icon {
    width: 10%;
}
#service .service_text a.btn .btn__text {
    width: 60%;
    text-align: center;
}
#service .service_text a.btn .btn__anniversary {
    width: 15%;
}
#service .service_text a.btn img {
    width: 100%;
    height: auto;
}
#service .service_text a.btn .btn__text .view_more{
    font-size: var(--font-xx);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-xs);
    color: #000;
    line-height: var(--line-height-s);
    text-align: center;
    margin-bottom: 0;
}
#service .service_text a.btn .btn__text .sub{
    width: 100%;
    font-size: var(--font-xx);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-xs);
    color: var(--sub-title-color);
    line-height: var(--line-height-s);
    text-align: center;
}
@media screen and (max-width: 768px) {
    #service .service_text a.btn{
       width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        background-color: #FFF;
        padding: 10px 5px;
        border: 5px solid var(--sub-title-color);
        margin-top: var(--section-margin8);
    }
    #service .service_text a.btn .btn__icon {
        width: 10%;
    }
    #service .service_text a.btn .btn__text {
        width: 80%;
        text-align: center;
    }
    #service .service_text a.btn .btn__anniversary {
        width: 10%;
        display:block;
        margin: 0 auto;
        position: relative;
    }
    #service .service_text a.btn .btn__anniversary img{
        width: 80px;
        position: absolute;
        transform: translate(-55%, -120%);
    }
    #service .service_text a.btn .btn__text .sub{
        font-size: var(--font-x);
    }
}
#service .service_text ul.service_thumb{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin: var(--section-margin8) auto var(--section-margin8);
    gap: var(--section-margin6);
}
#service .service_text ul.service_thumb li{
    width: calc((100% - (2 * var(--section-margin6)))/3);
    background-color: var(--sub-title-color);
    font-size: var(--font-x);
    color: #FFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    aspect-ratio: 1 / 1;
    font-weight: 700;
    padding: 1rem;
    box-sizing: border-box;
    line-height: 1.5;
}
@media screen and (max-width: 768px) {
    #service .service_text ul.service_thumb li{
        width: 60%;
        margin: 0 auto;
    }
}
#service .service_text a.btn .btn__text .announcement{
    width: 100%;
    font-size: var(--font-m);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-xs);
    line-height: var(--line-height-s);
    text-align: center;
    margin-bottom: 0;
}
#service .service_text a.btn .btn__text .tel{
    width: 100%;
    font-size: var(--font-xxx);
    font-family: var(--font-number);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-xs);
    line-height: var(--line-height-xs);
    margin-bottom: 0;
}
#service .service_text a.btn .btn__text .announcement02{
    width: 100%;
    font-size: var(--font-s);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-xs);
    line-height: var(--line-height-s);
    text-align: center;
    margin-bottom: 0;
}
@media screen and (max-width: 768px) {
    #service .service_text a.btn .btn__text .tel{
        width: 100%;
        font-size: var(--font-xx);
        font-family: var(--font-number);
    }
}
/*document*/
#document{
    width: 100%;
    padding-bottom: var(--section-margin);
}
#document .title_wrap{
    width: 100%;
    padding:var(--section-margin6) var(--page-padding);
    background-color: var(--sub-title-color);
}
#document .title_wrap h3.sub{
    color: #FFF;
}
#document .main_wrap{
    width: 100%;
    padding:0 var(--page-padding);
    margin: var(--section-margin8) auto 0;
}
#document .main_wrap .document_text{
    width: 100%;
    padding:0 var(--page-padding);
    margin: var(--section-margin8) auto 0;
}
#document .main_wrap .document_text p{
    width: 80%;
    font-size: var(--font-m);
    line-height: 180%;
    font-weight: 500;
    margin: 0 auto var(--section-margin4);
}
#document .main_wrap ul.document_thumb{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: var(--section-margin8);
    gap: var(--section-margin2);
}
#document .main_wrap ul.document_thumb li{
    width: calc((100% - (5 * var(--section-margin2)))/6);
}
#document .main_wrap ul.document_thumb li img{
    width: 100%;
    height: auto;
    margin-bottom: var(--section-margin1);
}
#document .main_wrap ul.document_thumb li .document_thumb_text{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
#document .main_wrap ul.document_thumb li .document_thumb_text .icon_pdf{
    width: 40px;
    padding-right: var(--section-margin1);
    box-sizing: border-box;
}
#document .main_wrap ul.document_thumb li .document_thumb_text .icon_pdf img{
    width: 100%;
    height: auto;
}
#document .main_wrap ul.document_thumb li .document_thumb_text p{
    width: auto;
    font-size: var(--font-s);
    font-weight: 500;

}
@media screen and (max-width: 768px) {
    #document .main_wrap ul.document_thumb{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin-top: var(--section-margin8);
        gap: var(--section-margin6);
    }
    #document .main_wrap ul.document_thumb li{
        width: calc((100% - (1 * var(--section-margin6)))/2);
    }
}
/*INSTAGRAM*/
#instagram{
    width: 100%;
}
#instagram .title_wrap{
    width: 100%;
    padding:var(--section-margin8) var(--page-padding);
    background-color: var(--mos-green-color);
}
#instagram .title_wrap h3.sub {
    color: #2E3231;
    align-items: center;
    display: flex;
    justify-content: center;
}
#instagram .title_wrap h3.sub img.icon_instagram{
    width: 60px;
    margin-right: var(--section-margin1);
}
@media screen and (max-width: 768px) {
    #instagram .title_wrap h3.sub img.icon_instagram{
        width: 20px;
        margin-right: var(--section-margin1);
    }
}
#instagram .main_wrap{
    width: 100%;
    background-color: var(--gray-color);
}
#instagram .main_wrap .instagram_thumb{
    max-width: var(--page-max-width);
    width: 100%;
    min-width: var(--page-min-width);
    padding:var(--section-margin8) var(--page-padding);
    margin: 0 auto;
}


