#new-contents #id2605summervisual {
    overflow: hidden
}

#new-contents #id2605summervisual * {
    font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif, serif;
    letter-spacing: inherit
}

#new-contents #id2605summervisual .f-playfair-display {
    font-family: "Playfair Display", serif;
    font-optical-sizing: auto;
    font-style: normal
}

#new-contents #id2605summervisual .f-roboto {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-variation-settings: "wdth" 100
}

#new-contents #id2605summervisual h3 {
    margin: 0;
    letter-spacing: inherit
}

#new-contents #id2605summervisual p {
    font-weight: 600;
    font-size: 20px;
    letter-spacing: 0px;
    line-height: 1.6
}

#new-contents #id2605summervisual .clearfix::after {
    content: "";
    display: block;
    clear: both
}

#new-contents #id2605summervisual img {
    display: inline;
    width: 100%;
    height: auto
}

#new-contents #id2605summervisual video {
    width: 100%;
    height: auto
}

#new-contents #id2605summervisual a {
    color: #000
}

#new-contents #id2605summervisual a:hover img {
    opacity: 1
}

#new-contents #id2605summervisual .hover {
    transition-duration: .2s;
    position: relative
}

#new-contents #id2605summervisual .hover::after {
    content: "";
    position: absolute;
    opacity: 0;
    inset: 0px;
    background: #fcfcfc;
    transition: opacity .3s
}

#new-contents #id2605summervisual .hover:hover:hover::after {
    opacity: .12
}

#new-contents #id2605summervisual .w1024auto {
    max-width: 1024px;
    width: 100%;
    margin: 0 auto;
    display: block
}

@media screen and (max-width: 768px) {
    #new-contents #id2605summervisual .ifPc {
        display: none !important
    }
}

@media screen and (min-width: calc(768px + 1px)) {
    #new-contents #id2605summervisual .ifSp {
        display: none !important
    }
}

#new-contents #id2605summervisual .btn-wrap {
    text-align: center
}

#new-contents #id2605summervisual .btn {
    color: #fff;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    background-color: #000;
    width: 240px;
    height: 64px;
    line-height: 64px;
    display: inline-block;
    transition-duration: .3s;
    transition-property: background-color, color
}

@media screen and (max-width: 768px) {
    #new-contents #id2605summervisual .btn {
        font-size: clamp(1.25rem, 0rem + 5.0890585242vw, 2.4427480916rem);
        width: 224px;
        height: 57px;
        line-height: 57px
    }
}

@media screen and (min-width: calc(768px + 1px)) {
    #new-contents #id2605summervisual .btn:hover {
        background-color: #fff;
        color: #000
    }
}

#new-contents #id2605summervisual .pagetop {
    z-index: 5;
    position: fixed
}

#new-contents #id2605summervisual #info_box_top {
    position: relative;
    z-index: 3
}

#new-contents #id2605summervisual section.fitfit-official {
    background-color: #f7f6f4;
    position: relative;
    z-index: 2
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item {
    display: flex;
    gap: 16px;
    justify-content: center;
    align-items: center;
    max-width: 870px;
    width: 100%;
    height: auto;
    margin: 0 auto
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-img {
    max-width: 116px;
    width: 100%;
    height: auto;
    aspect-ratio: 116/116
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-img img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text {
    display: flex;
    flex-direction: column;
    gap: 16px
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text-title {
    font-size: 24px;
    font-weight: 700;
    color: #222;
    line-height: 1;
    font-family: "Noto Sans JP", sans-serif
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text-text {
    font-size: 16px;
    font-weight: 400;
    color: #222;
    line-height: 1.7;
    font-family: "Noto Sans JP", sans-serif
}

#new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text-btn a {
    display: block;
    width: 100%;
    height: 100%;
    color: #222;
    font-size: 16px;
    font-weight: 600;
    font-family: "Noto Sans JP", sans-serif;
    text-decoration: underline
}

#new-contents #id2605summervisual #footer-parts {
    background-color: #fff;
    position: relative;
    z-index: 2
}

#new-contents #id2605summervisual .bg-white {
    background-color: #fff;
    position: relative;
    z-index: 2
}

@media screen and (min-width: calc(768px + 1px)) {
    #new-contents #id2605summervisual .fitfit-official {
        padding: 80px 0
    }

    #new-contents #id2605summervisual #share {
        margin: 95px 0 0
    }

    #new-contents #id2605summervisual #share ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }

    #new-contents #id2605summervisual #share ul li {
        width: 24px;
        margin: 0 20px
    }

    #new-contents #id2605summervisual #share ul li img {
        width: 100%
    }

    #new-contents #id2605summervisual .linebtn {
        width: 800px;
        margin: 88px auto 50px
    }

    #new-contents #id2605summervisual .linebtn a:hover {
        opacity: .75
    }

    #new-contents #id2605summervisual #cts-footer {
        max-width: 950px;
        margin: 0 auto;
        background-color: #fff;
        padding: 80px 0 80px
    }

    #new-contents #id2605summervisual #cts-footer ul {
        display: flex;
        justify-content: center;
        flex-wrap: wrap
    }

    #new-contents #id2605summervisual #cts-footer ul+ul {
        margin-top: 50px
    }

    #new-contents #id2605summervisual #cts-footer li {
        list-style: none;
        margin: 0 24px;
        width: 200px;
        text-align: center
    }

    #new-contents #id2605summervisual #cts-footer li img {
        width: 200px;
        margin: 0 auto
    }

    #new-contents #id2605summervisual #cts-footer li div.title {
        margin-top: 16px;
        line-height: 1;
        font-size: 16px;
        font-weight: 700
    }

    #new-contents #id2605summervisual #cts-footer li div.text {
        margin-top: 7px;
        color: #000;
        text-align: center;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.4
    }

    #new-contents #id2605summervisual #cts-footer li a {
        transition: .2s
    }

    #new-contents #id2605summervisual #cts-footer li a:hover:hover * {
        opacity: .5;
        transition-property: opacity;
        transition-duration: .5s
    }

    #new-contents #id2605summervisual #shop,
    #new-contents #id2605summervisual #shop .banner {
        width: 800px
    }
}

@media screen and (max-width: 768px) {
    #new-contents #id2605summervisual section.fitfit-official {
        margin-top: 0;
        padding-top: 75px;
        padding-bottom: 75px;
        background-color: #f7f6f4
    }

    #new-contents #id2605summervisual section.fitfit-official .fitfit-official-inner {
        padding: 0 24px
    }

    #new-contents #id2605summervisual section.fitfit-official .fitfit-official-item {
        display: block
    }

    #new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-img {
        width: 56px;
        height: auto;
        margin: 0 auto
    }

    #new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text {
        gap: 0
    }

    #new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text-title {
        margin: 16px auto 0;
        background-color: #cf0035;
        color: #fff;
        text-align: center;
        max-width: 165px;
        width: 100%;
        height: auto;
        display: block;
        border-radius: 100px;
        padding: 14px;
        white-space: nowrap;
        font-size: 16px;
        line-height: 1;
        font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif
    }

    #new-contents #id2605summervisual section.fitfit-official .fitfit-official-item-text-text {
        font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
        font-size: 16px;
        line-height: 28px;
        text-align: center;
        margin-top: 24px;
        font-weight: 400;
        color: #272727
    }

    #new-contents #id2605summervisual #share {
        margin: 40px 0 36px
    }

    #new-contents #id2605summervisual #share ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin: 0
    }

    #new-contents #id2605summervisual #share ul li {
        width: 24px;
        margin: 0 20px;
        list-style: none
    }

    #new-contents #id2605summervisual #share ul li img {
        width: 100%
    }

    #new-contents #id2605summervisual .linebtn {
        padding: 0 25px;
        margin-bottom: 25px
    }

    #new-contents #id2605summervisual .linebtn a {
        width: 100%;
        max-width: 500px;
        margin: 0 auto
    }

    #new-contents #id2605summervisual #cts-footer {
        background-color: #fff;
        border-bottom: solid 1px #e5e5e5;
        padding: 39px 0px 16px
    }

    #new-contents #id2605summervisual #cts-footer ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin: 0 auto;
        max-width: 400px
    }

    #new-contents #id2605summervisual #cts-footer li {
        list-style: none;
        margin: 0 0 25px;
        width: 50%;
        text-align: center;
        max-width: 200px
    }

    #new-contents #id2605summervisual #cts-footer li img {
        width: 100%;
        margin: 0 auto
    }

    #new-contents #id2605summervisual #cts-footer li div.title {
        margin-top: 11px;
        line-height: 1;
        font-size: 14px;
        font-weight: 700
    }

    #new-contents #id2605summervisual #cts-footer li div.text {
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 1.4;
        margin-top: 8px
    }

    #new-contents #id2605summervisual #shop .banner:nth-child(n+2) {
        padding-bottom: 0
    }

    #new-contents #id2605summervisual #shop .banner .title img {
        width: inherit !important
    }

    #new-contents #id2605summervisual #feature-share {
        padding-bottom: 50px
    }
}

@media screen and (min-width: calc(768px + 1px)) {
    #new-contents #id2605summervisual .inner {
        max-width: 810px;
        margin: 0 auto;
        padding: 0 56px
    }

    #new-contents #id2605summervisual .bg-area {
        width: 100%;
        overflow: hidden;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        background-size: cover;
        background-position: center
    }

    #new-contents #id2605summervisual .bg-area .movie {
        position: relative;
        z-index: 4;
        width: clamp(15.625rem, -10.9982174688rem + 40.9982174688vw, 30rem);
        height: clamp(15.625rem, -10.9982174688rem + 40.9982174688vw, 30rem)
    }
}

@media screen and (min-width: calc(768px + 1px))and (min-width: calc(1600px + 1px)) {
    #new-contents #id2605summervisual .bg-area .movie {
        width: 30vw;
        height: 30vw
    }
}

@media screen and (min-width: calc(768px + 1px)) {
    #new-contents #id2605summervisual .bg-area .bg-logo {
        position: absolute;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between
    }

    #new-contents #id2605summervisual .bg-area .bg-logo::before {
        content: "";
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

    #new-contents #id2605summervisual .bg-area .bg-logo::after {
        content: "";
        position: absolute;
        z-index: 2;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center
    }

    #new-contents #id2605summervisual .bg-area#mv {
        height: 43vw
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo h1,
    #new-contents #id2605summervisual .bg-area#mv .bg-logo .feature-name {
        position: relative;
        z-index: 3
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo h1 {
        width: 90px;
        margin-top: 40px
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo .feature-name {
        color: #c8bf9e;
        text-align: center;
        font-size: 27px;
        font-style: normal;
        font-weight: 500;
        line-height: 140%;
        letter-spacing: 1.1px;
        margin-bottom: 43px
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo::before {
        background-color: #eef3f6
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo::after {
        background-image: url(../img/bg-logo.png)
    }

    #new-contents #id2605summervisual .bg-area#centerBG {
        height: 43vw
    }

    #new-contents #id2605summervisual .bg-area#centerBG .bg-logo::before {
        background-color: #ede8e0
    }

    #new-contents #id2605summervisual .bg-area#centerBG .bg-logo::after {
        background-image: url(../img/bg-logo2.png)
    }

    #new-contents #id2605summervisual .btn-wrap {
        width: 100%;
        display: flex;
        justify-content: center;
        margin-top: 59px;
        margin-bottom: 80px
    }

    #new-contents #id2605summervisual .btn-wrap .item-btn {
        border: 1px solid #fff;
        background-color: #bcb18c;
        line-height: 1;
        display: inline-block;
        padding: 22px 16px;
        transition-duration: .3s;
        width: 400px
    }

    #new-contents #id2605summervisual .btn-wrap .item-btn span {
        color: #fff;
        text-align: center;
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: .4px;
        text-transform: uppercase
    }

    #new-contents #id2605summervisual .btn-wrap .item-btn:hover {
        border: 1px solid #bcb18c;
        background-color: #fff
    }

    #new-contents #id2605summervisual .btn-wrap .item-btn:hover span {
        color: #bcb18c
    }

    #new-contents #id2605summervisual .main-contents .inner .photo {
        display: block;
        position: relative
    }

    #new-contents #id2605summervisual .main-contents .inner .photo .catch {
        color: #fff;
        text-align: center;
        font-feature-settings: "case" on;
        font-size: 66px;
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        position: absolute;
        z-index: 2;
        display: flex;
        top: 0;
        width: 100%;
        height: 100%;
        justify-content: center;
        align-items: center
    }

    #new-contents #id2605summervisual .main-contents#main-contents1 {
        padding: 120px 0 0
    }
}

@media screen and (max-width: 768px) {
    #new-contents #id2605summervisual .inner {
        margin: 0 auto;
        padding: 0
    }

    #new-contents #id2605summervisual .breadcrumbs {
        display: none
    }

    #new-contents #id2605summervisual .bg-area {
        width: 100%;
        overflow: hidden;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        background-size: cover;
        background-position: center
    }

    #new-contents #id2605summervisual .bg-area .movie {
        position: relative;
        z-index: 4;
        width: clamp(18.3125rem, 0rem + 74.5547073791vw, 35.786259542rem);
        height: clamp(18.3125rem, 0rem + 74.5547073791vw, 35.786259542rem)
    }

    #new-contents #id2605summervisual .bg-area .bg-logo {
        position: absolute;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between
    }

    #new-contents #id2605summervisual .bg-area .bg-logo::before {
        content: "";
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

    #new-contents #id2605summervisual .bg-area .bg-logo::after {
        content: "";
        position: absolute;
        z-index: 2;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-position: center
    }

    #new-contents #id2605summervisual .bg-area#mv {
        height: 128vw
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo h1,
    #new-contents #id2605summervisual .bg-area#mv .bg-logo .feature-name {
        position: relative;
        z-index: 3
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo h1 {
        width: clamp(3.375rem, 0rem + 13.7404580153vw, 6.5954198473rem);
        margin-top: clamp(1.75rem, 0rem + 7.1246819338vw, 3.4198473282rem)
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo .feature-name {
        color: #c8bf9e;
        text-align: center;
        font-size: clamp(1.125rem, 0rem + 4.5801526718vw, 2.1984732824rem);
        font-style: normal;
        font-weight: 500;
        line-height: 140%;
        letter-spacing: .06em;
        margin-bottom: clamp(1.25rem, 0rem + 5.0890585242vw, 2.4427480916rem)
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo::before {
        background-color: #eef3f6
    }

    #new-contents #id2605summervisual .bg-area#mv .bg-logo::after {
        background-image: url(../img/bg-logo_sp.png)
    }

    #new-contents #id2605summervisual .bg-area#centerBG {
        height: 106.6vw
    }

    #new-contents #id2605summervisual .bg-area#centerBG .bg-logo::before {
        background-color: #ede8e0
    }

    #new-contents #id2605summervisual .bg-area#centerBG .bg-logo::after {
        background-image: url(../img/bg-logo2_sp.png)
    }

    #new-contents #id2605summervisual .btn-wrap {
        width: 100%;
        display: flex;
        justify-content: center;
        margin-top: 50px;
        margin-bottom: 90px
    }

    #new-contents #id2605summervisual .btn-wrap .item-btn {
        border: 1px solid #fff;
        background-color: #bcb18c;
        line-height: 1;
        display: inline-block;
        padding: 17px 16px;
        transition-duration: .3s;
        width: 316px
    }

    #new-contents #id2605summervisual .btn-wrap .item-btn span {
        color: #fff;
        text-align: center;
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%;
        letter-spacing: .4px;
        text-transform: uppercase
    }

    #new-contents #id2605summervisual .main-contents .inner .photo {
        position: relative;
        display: block
    }

    #new-contents #id2605summervisual .main-contents .inner .photo .catch {
        color: #fff;
        text-align: center;
        font-feature-settings: "case" on;
        font-size: clamp(2.3125rem, 0rem + 9.4147582697vw, 4.5190839695rem);
        font-style: normal;
        font-weight: 600;
        line-height: 100%;
        position: absolute;
        z-index: 2;
        display: flex;
        top: 0;
        width: 100%;
        height: 100%;
        justify-content: center;
        align-items: center
    }

    #new-contents #id2605summervisual .main-contents#main-contents1 {
        padding: 50px 0 0
    }
}

#new-contents #id2605summervisual .framein.fadein {
    opacity: 0;
    transition-duration: 1.5s;
    transition-timing-function: ease;
    transition-property: opacity
}

#new-contents #id2605summervisual .framein.fadein.in {
    opacity: 1
}

#new-contents #id2605summervisual .framein.slideupfadein {
    opacity: 0;
    transition-property: opacity, transform;
    transform: translateY(40px);
    transition-duration: 1s
}

#new-contents #id2605summervisual .framein.slideupfadein.in {
    opacity: 1;
    transform: translateY(0px)
}

#new-contents #id2605summervisual .fuwa {
    animation: fuwa 10s linear infinite
}

@keyframes fuwa {
    0% {
        transform: translateY(0px)
    }

    25% {
        transform: translateY(20px)
    }

    50% {
        transform: translateY(0px)
    }

    75% {
        transform: translateY(-20px)
    }

    100% {
        transform: translateY(0px)
    }
}

#new-contents #id2605summervisual .bg-area#mv .bg-logo h1,
#new-contents #id2605summervisual .bg-area#mv .bg-logo .feature-name,
#new-contents #id2605summervisual .bg-area#mv .bg-logo::after {
    opacity: 0;
    transition-delay: 1.3s;
    transition-duration: .8s
}

#new-contents #id2605summervisual .bg-area#mv .movie video {
    opacity: 0;
    transform: translateY(40px);
    transition-timing-function: ease;
    transition-delay: 1.9s;
    transition-duration: 1s
}

#new-contents #id2605summervisual .bg-area#mv .movie.fuwa {
    animation-delay: 3.1s
}

#new-contents #id2605summervisual .bg-area#mv .bg-logo::before {
    clip-path: inset(0 100% 0 0 round 0px)
}

#new-contents #id2605summervisual .bg-area#mv.in .bg-logo::before {
    animation-name: bgAnime;
    animation-fill-mode: forwards;
    animation-duration: .8s;
    animation-iteration-count: 1;
    animation-timing-function: ease;
    animation-delay: .5s;
    animation-direction: normal
}

#new-contents #id2605summervisual .bg-area#mv.in .bg-logo h1,
#new-contents #id2605summervisual .bg-area#mv.in .bg-logo .feature-name,
#new-contents #id2605summervisual .bg-area#mv.in .bg-logo::after {
    opacity: 1
}

#new-contents #id2605summervisual .bg-area#mv.in .movie video {
    opacity: 1;
    transform: translateY(0px)
}

#new-contents #id2605summervisual .bg-area#centerBG .bg-logo::after {
    opacity: 0;
    transition-delay: 1.3s;
    transition-duration: .8s
}

#new-contents #id2605summervisual .bg-area#centerBG .movie video {
    opacity: 0;
    transform: translateY(40px);
    transition-timing-function: ease;
    transition-delay: 1.9s;
    transition-duration: 1s
}

#new-contents #id2605summervisual .bg-area#centerBG .movie.fuwa {
    animation-delay: 3.1s
}

#new-contents #id2605summervisual .bg-area#centerBG .bg-logo::before {
    clip-path: inset(0 100% 0 0 round 0px)
}

#new-contents #id2605summervisual .bg-area#centerBG.in .movie video {
    opacity: 1;
    transform: translateY(0px)
}

#new-contents #id2605summervisual .bg-area#centerBG.in .bg-logo::before {
    animation-name: bgAnime;
    animation-fill-mode: forwards;
    animation-duration: .8s;
    animation-iteration-count: 1;
    animation-timing-function: ease;
    animation-delay: .5s;
    animation-direction: normal
}

#new-contents #id2605summervisual .bg-area#centerBG.in .bg-logo::after {
    opacity: 1
}

@keyframes bgAnime {
    0% {
        clip-path: inset(0 100% 0 0 round 0px)
    }

    100% {
        clip-path: inset(0 0 0 0 round 0px)
    }
}

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