.topWrap,
.aboutWrap,
.infosWrap,
.linksWrap,
.newsWrap,
.storeWrap {
    position: relative;
    width: 100%;
    overflow: hidden
}

.aboutInner,
.infosInner,
.linksInner,
.newsInner,
.storeInner {
    position: relative;
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center
}

@media (min-width: 1280px) {

    .aboutInner,
    .infosInner,
    .linksInner,
    .newsInner,
    .storeInner {
        width: 76.3888888889%
    }
}

.topWrap {
    margin-top: 90px
}

@media (min-width: 1024px) {
    .topWrap {
        /* margin-top: 99px */
        margin-top: 241px;/*260508上記より数値変更*/
    }
}

@media (min-width: 1380px) {
    .topWrap {
        /* margin-top: 93px */
        margin-top: 221px;/*260508上記より数値変更*/
    }
}

.topWrap .topImgX {
    position: relative;
    width: 100%;
    aspect-ratio: 1270 / 550;
    margin-left: auto;
    min-height: 400px
}

@media (min-width: 768px) {
    .topWrap .topImgX {
        width: 95.1388888889%
    }
}

@media (min-width: 1024px) {
    .topWrap .topImgX {
        width: 88.1944444444%
    }
}

.topWrap .topImgX .sliderControl * {
    position: static !important;
    padding: 0 !important
}

.topWrap .topImgX .sliderControl .carousel-item {
    width: 32%;
    margin: 1.2% 0.6% 0;
    display: block;
    opacity: 1;
    padding: 7px !important
}

.topWrap .topImgX .sliderControl .carousel-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start
}

.topWrap .topImgX .carousel {
    width: 100%;
    height: 100%;
    min-height: 400px;
    max-height: 100vh
}

.topWrap .topImgX .carousel-inner {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    min-height: 400px;
    max-height: 100vh
}

.topWrap .topImgX .carousel-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 400px;
    max-height: 100vh
}

.topWrap .topImgX .carousel-item>img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    vertical-align: top;
    min-height: 400px;
    max-height: 100vh;
    border-radius: 80px 0 0 80px
}

.topWrap .cacheX {
    position: absolute;
    top: 50%;
    left: 2.7777777778%;
    transform: translateY(-50%);
    z-index: 3
}

@media (min-width: 768px) {
    .topWrap .cacheX {
        left: 3.4722222222%
    }
}

@media (min-width: 1024px) {
    .topWrap .cacheX {
        left: 5.5555555556%
    }
}

.topWrap .cacheX h1.tit {
    width: fit-content;
    text-shadow: 2px 2px 4px rgba(255, 255, 255, 0.15);
    font: normal 700 34px/42px "Zen Maru Gothic", serif;
    color: #3A59AC
}

@media (min-width: 768px) {
    .topWrap .cacheX h1.tit {
        font-size: 40px;
        line-height: 59px
    }
}

.aboutWrap {
    padding: 80px 0
}

@media (min-width: 768px) {
    .aboutWrap {
        padding: 90px 0 100px
    }
}

.aboutWrap .h2TitX h2.tit {
    font-size: 24px;
    line-height: 38px
}

@media (min-width: 768px) {
    .aboutWrap .h2TitX h2.tit {
        font-size: 32px;
        line-height: 46px
    }
}

.aboutWrap .rowContentsX {
    width: 100%;
    margin-top: 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    row-gap: 40px
}

@media (min-width: 1024px) {
    .aboutWrap .rowContentsX {
        flex-direction: row;
        align-items: start;
        column-gap: 7.2727272727%
    }
}

@media (min-width: 1280px) {
    .aboutWrap .rowContentsX {
        align-items: center;
        column-gap: 10%
    }
}

.aboutWrap .rowContentsX .imgX {
    position: relative;
    width: 100%;
    border-radius: 15px
}

@media (min-width: 1024px) {
    .aboutWrap .rowContentsX .imgX {
        aspect-ratio: 500 / 375;
        width: 45.4545454545%
    }
}

.aboutWrap .rowContentsX .imgX .commonImg {
    max-width: none;
    width: 100%;
    height: 100%;
    border-radius: 15px
}

.aboutWrap .rowContentsX .imgX:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    background: #3AACC9;
    z-index: -1
}

.aboutWrap .rowContentsX .textContentsX {
    flex: 1
}

.aboutWrap .rowContentsX .textContentsX .descX {
    width: 100%;
    font-size: 0
}

.aboutWrap .rowContentsX .textContentsX .descX p {
    display: inline
}

.aboutWrap .rowContentsX .textContentsX .descX .blackDesc,
.aboutWrap .rowContentsX .textContentsX .descX .blueDesc {
    font: normal 500 16px/28px "Zen Maru Gothic", serif;
    color: #333
}

.aboutWrap .rowContentsX .textContentsX .descX .blueDesc {
    font-weight: 700;
    color: #3A59AC
}

.aboutWrap .rowContentsX:nth-child(odd) .imgX:after {
    top: 10px;
    left: -10px
}

.aboutWrap .rowContentsX:nth-child(odd) .commLink {
    margin: 30px auto 0
}

@media (min-width: 1024px) {
    .aboutWrap .rowContentsX:nth-child(odd) .commLink {
        margin: 30px 0 0
    }
}

@media (min-width: 1024px) {
    .aboutWrap .rowContentsX:nth-child(even) {
        flex-direction: row-reverse
    }
}

.aboutWrap .rowContentsX:nth-child(even) .imgX:after {
    top: 10px;
    left: 10px
}

.aboutWrap .rowContentsX:nth-child(even) .commLink {
    margin: 35px auto 0
}

@media (min-width: 1024px) {
    .aboutWrap .rowContentsX:nth-child(even) .commLink {
        margin: 35px 0 0
    }
}

.aboutWrap .rowContentsX:first-child {
    margin-top: 45px
}

.infosWrap {
    overflow: visible;
    padding: 60px 0;
    background: linear-gradient(180deg, #9BD7E6 0%, #9BD7E6 100%)
}

@media (min-width: 768px) {
    .infosWrap {
        padding: 74px 0
    }
}

.infosWrap:before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    z-index: 3;
    transform: translate(-50%, 90%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 46px 46px 0 46px;
    border-color: #9BD7E6 transparent transparent transparent
}

.infosWrap .h2TitX {
    align-items: start
}

@media (min-width: 768px) {
    .infosWrap .h2TitX {
        align-items: center
    }
}

.infosWrap .h2TitX:before {
    width: 8px;
    height: 8px;
    column-gap: 5px;
    background: #3A59AC;
    margin-top: 17px
}

@media (min-width: 768px) {
    .infosWrap .h2TitX:before {
        margin-top: 0;
        column-gap: 10px
    }
}

.infosWrap .h2TitX h2.tit {
    text-align: center;
    font-size: 24px;
    line-height: 38px
}

@media (min-width: 768px) {
    .infosWrap .h2TitX h2.tit {
        font-size: 32px;
        line-height: 46px
    }
}

.infosWrap .imgContentsX {
    width: 100%;
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    row-gap: 40px
}

@media (min-width: 768px) {
    .infosWrap .imgContentsX {
        column-gap: 3.6363636364%;
        flex-direction: row
    }
}

.infosWrap .imgContentsX .itemX {
    flex: 3;
    border-radius: 15px;
    background: #FFF;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 60px 0 28px;
    row-gap: 34px
}

.infosWrap .imgContentsX .imgX {
    width: 26.4705882353%;
    min-width: 90px
}

.infosWrap .imgContentsX h3.info {
    font: normal 900 22px/28px "Zen Maru Gothic", serif;
    color: #3A59AC
}

.infosWrap .imgContentsX:first-child {
    margin-top: 50px
}

.linksWrap {
    padding: 90px 0 80px
}

@media (min-width: 768px) {
    .linksWrap {
        padding: 100px 0 90px
    }
}

.linksWrap .backBgc {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.linksWrap .backBgc .backImg {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    vertical-align: top;
    transition: all .4s ease-in-out
}

.linksInner {
    z-index: 10
}

.linksWrap .descX {
    font-size: 0;
    text-align: center
}

.linksWrap .descX p {
    display: inline
}

.linksWrap .descX .blueDesc,
.linksWrap .descX .blackDesc {
    font: normal 700 18px/34px "Zen Maru Gothic", serif;
    color: #333
}

.linksWrap .descX .blueDesc {
    font-weight: 900;
    color: #3A59AC;
    background: linear-gradient(transparent 60%, #FFF2AE 60%)
}

.linksWrap .imgContentsX {
    margin-top: 65px;
    display: flex;
    flex-direction: column;
    row-gap: 60px;
    width: 100%
}

@media (min-width: 768px) {
    .linksWrap .imgContentsX {
        flex-direction: row;
        column-gap: 5.4545454545%
    }
}

.linksWrap .imgX {
    position: relative;
    flex: 2;
    border-radius: 15px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    aspect-ratio: 500 / 281
}

.linksWrap .imgX:hover>img {
    transform: scale(1.1)
}

.linksWrap .imgX>img {
    border-radius: 15px
}

.linksWrap .imgX .h2TitX {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center
}

.linksWrap .imgX .h2TitX:before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background: #FFF;
    border-radius: 50%
}

.linksWrap .imgX .h2TitX h2.tit {
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    font: normal 700 26px/38px "Zen Maru Gothic", serif;
    color: #FFF
}

@media (min-width: 768px) {
    .linksWrap .imgX .h2TitX h2.tit {
        font-size: 28px;
        line-height: 42px
    }
}

@media (min-width: 1024px) {
    .linksWrap .imgX .h2TitX h2.tit {
        font-size: 32px;
        line-height: 46px
    }
}

.linksWrap .imgX .circleX {
    position: absolute;
    top: 50%;
    right: 4%;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 2px solid #FFF
}

@media (min-width: 768px) {
    .linksWrap .imgX .circleX {
        width: 35px;
        height: 35px
    }
}

@media (min-width: 1024px) {
    .linksWrap .imgX .circleX {
        width: 45px;
        height: 45px
    }
}

.linksWrap .imgX .circleX:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-70%, -50%) rotate(45deg);
    border-top: 2px solid #FFF;
    border-right: 2px solid #FFF;
    width: 8px;
    height: 8px
}

@media (min-width: 768px) {
    .linksWrap .imgX .circleX:before {
        transform: translate(-50%, -50%) rotate(45deg)
    }
}

.newsWrap {
    padding: 80px 0;
    background: linear-gradient(180deg, rgba(223, 249, 255, 0.36) 0%, rgba(223, 249, 255, 0.36) 100%)
}

@media (min-width: 768px) {
    .newsWrap {
        padding: 90px 0
    }
}

.newsInner {
    margin-top: 45px
}

.newsWrap .smooth_news {
    position: relative;
    width: 100%
}

.newsWrap .smooth_news .content section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
    row-gap: 30px
}

@media (min-width: 1024px) {
    .newsWrap .smooth_news .content section {
        flex-direction: row;
        justify-content: center;
        column-gap: 3.6363636364%
    }
}

.newsWrap .smooth_news .content section .news.cf {
    width: 95%;
    margin: 0 auto
}

@media (min-width: 1024px) {
    .newsWrap .smooth_news .content section .news.cf {
        margin: 0;
        width: 30.9090909091%
    }
}

.newsWrap .smooth_news .content section .news.cf:hover .webgene-item-main-image {
    transform: scale(1.1);
    margin: 0 auto;
    transition: all .4s ease-in-out;
    text-decoration: none;
    overflow: hidden;
    border-radius: 15px
}

.newsWrap .smooth_news .content section .news.cf .news_img {
    position: relative;
    overflow: hidden;
    transition: all .4s ease-in-out;
    width: 100%;
    aspect-ratio: 340 / 240;
    border-radius: 15px;
    z-index: 1
}

.newsWrap .smooth_news .content section .news.cf .news_img .webgene-item-main-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    vertical-align: top;
    overflow: hidden;
    transition: all .4s ease-in-out;
    border-radius: 15px
}

.newsWrap .smooth_news .content section .news.cf .contents .news_detail.mt-2 {
    margin-top: 0 !important
}

.newsWrap .smooth_news .content section .news.cf .contents .news_detail.mt-2 .news_inner {
    display: block;
    padding: 20px 0 0
}

.newsWrap .smooth_news .content section .news.cf .contents .news_detail.mt-2 .news_inner .newsTit {
    font: normal 700 16px/28px "Zen Maru Gothic", serif;
    color: #333;
    z-index: 10
}

.newsWrap .smooth_news .content section .news.cf .contents .news_detail.mt-2 .news_inner .newsDate {
    font: normal 500 14px/28px "Zen Maru Gothic", serif;
    color: #333;
    z-index: 10
}

.newsWrap .smooth_news .content section .news.cf .contents .news_detail.mt-2 .news_inner .newsTag {
    text-align: center;
    font: normal 500 14px/28px "Zen Maru Gothic", serif;
    color: #333;
    background: #1b1464;
    padding: 5px 15px;
    z-index: 50
}

.newsWrap .commLink {
    margin: 65px auto 0
}

.storeWrap {
    padding: 80px 0;
    background: linear-gradient(180deg, #FFF 0%, #FFF 100%)
}

@media (min-width: 768px) {
    .storeWrap {
        padding: 90px 0
    }
}

.storeWrap .rowContentsX {
    margin-top: 40px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    row-gap: 40px
}

@media (min-width: 1024px) {
    .storeWrap .rowContentsX {
        flex-direction: row;
        align-items: start;
        column-gap: 7.2727272727%
    }
}

@media (min-width: 1280px) {
    .storeWrap .rowContentsX {
        align-items: center;
        column-gap: 10%
    }
}

.storeWrap .rowContentsX .mapContent {
    margin-top: 0;
    width: 100%
}

@media (min-width: 1024px) {
    .storeWrap .rowContentsX .mapContent {
        width: 45.4545454545%
    }
}

.storeWrap .rowContentsX .mapContent .mapBox {
    width: 100%;
    aspect-ratio: 1.3333333333;
    min-height: 300px
}

.storeWrap .rowContentsX .mapContent .mapBox .mapInfoImg {
    width: 100%;
    height: 100%;
    min-height: 300px
}

.storeWrap .rowContentsX .mapContent .mapBox .mapInfoImg iframe {
    width: 100%;
    height: 100%
}

.storeWrap .rowContentsX .mapContent {
    border-radius: 15px;
    overflow: hidden
}

.storeWrap .rowContentsX .textContentsX {
    flex: 1
}

.storeWrap .rowContentsX .textContentsX .logoTxt {
    text-shadow: #FFF 1px 0 0, #FFF 0 1px 0, #FFF -1px 0 0, #FFF 0 -1px 0;
    background: linear-gradient(180deg, #F2A35A 0%, #F2A35A 100%);
    -webkit-background-clip: text;
    font: normal 900 23px/33px "Zen Maru Gothic", serif;
    color: #F2A35A
}

.storeWrap .rowContentsX .textContentsX .tbX {
    width: 100%;
    margin-top: 9px
}

@media (min-width: 1024px) {
    .storeWrap .rowContentsX .textContentsX .tbX {
        max-width: 438px
    }
}

@media (min-width: 1441px) {
    .storeWrap .rowContentsX .textContentsX .tbX {
        max-width: initial
    }
}

.storeWrap .rowContentsX .textContentsX .trX {
    width: 100%;
    display: flex;
    column-gap: 6.8493150685%;
    padding: 16px 0;
    border-bottom: 1px dotted #888
}

@media (min-width: 768px) {
    .storeWrap .rowContentsX .textContentsX .trX {
        column-gap: 9.1324200913%
    }
}

.storeWrap .rowContentsX .textContentsX .th {
    min-width: 70px;
    font: normal 700 16px/23px "Zen Maru Gothic", serif;
    color: #3A59AC
}

.storeWrap .rowContentsX .textContentsX .telLink {
    display: block;
    width: fit-content
}

.storeWrap .rowContentsX .textContentsX .td {
    letter-spacing: 0.03em;
    font: normal 500 16px/23px "Zen Maru Gothic", serif;
    color: #333
}

.storeWrap .commLink {
    margin: 50px auto 0
}

.itemX_inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 34px;
}

/*# sourceMappingURL=top.css.map */

.itemX.justify_start {
    justify-content: flex-start !important;
}

.carousel_catchcopy {
    position: absolute;
    z-index: 1;
    font: normal 700 25px/46px "Zen Maru Gothic", serif;
    color: white;
    background-color: rgba(0, 0, 0,0.4);
    padding: 12px;
    right: 2%;
    bottom: 2%;
}

@media (max-width: 1024px){
    .c5703.carousel_catchcopy {
        max-width: 50%;
        font-size: 18px;
        line-height: 1.7;
    }
}

@media (max-width: 768px){
    .c5703.carousel_catchcopy {
        max-width: 85%;
        font-size: 15px;
    }
}