@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;500;800&display=swap");

/*----------------------------------------------------------------------
mixin
----------------------------------------------------------------------*/


/*----------------------------------------------------------------------
base setting
----------------------------------------------------------------------*/

* {
    transition-property: transform, opacity, top, right, bottom, left;
    box-sizing: border-box;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

p {
    margin: 0;
}

img {
    vertical-align: middle;
    max-width: 100%;
    width: 100%;
}

a {
    text-decoration: none;
    color: #ff7728;
}

.swiper-pagination-bullet {
    background: #fff !important;
}

.el-upload--picture-card {
    width: 340px !important;
    height: 71.62px !important;
    line-height: 85px !important;
}

.el-upload-list__item {
    width: 342px !important;
    height: 72px !important;
}

.el-input__inner {
    background: inherit !important;
}

.dialogNews {
    min-width: 730px;
}

.required>label:before {
    content: "*";
    color: #f56c6c;
    margin-right: 4px;
}

html {
    font-size: 16px;
}

h1,
h2,
h3,
h5,
h6 {
    margin: 0;
}

body {
    margin: 0;
    width: 100%;
    background: #efefef;
    line-height: 1;
    font-weight: 500;
    font-style: normal;
}

@media screen and (max-width: 600px) {
    body {
        min-width: 100%;
    }
}

body img {
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

#app {
    font-weight: 500;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

p {
    margin: 0;
}

img {
    vertical-align: middle;
}

a {
    text-decoration: none;
}

.swiper-pagination-bullet {
    background: #fff !important;
}

.el-upload--picture-card {
    width: 340px !important;
    height: 71.62px !important;
    line-height: 85px !important;
}

.el-upload-list__item {
    width: 342px !important;
    height: 72px !important;
}

.el-input__inner {
    background: inherit !important;
}

.dialogNews {
    min-width: 730px;
}

.required>label::before {
    content: "*";
    color: #f56c6c;
    margin-right: 4px;
}

.bounce-in {
    animation-duration: 1s;
}


/*----------------------------------------------------------------------
start
----------------------------------------------------------------------*/

@font-face {
    font-family: JapanText;
    src: url(../fonts/SourceHanSerifJP-SemiBold.otf);
    font-weight: 400;
    font-style: normal;
  }
body {
    font-weight: 500;
    font-style: normal;
    font-family: JapanText, sans-serif;
    color: #61482f;
    font-weight: 500;
    font-style: normal;
}

main {
    position: relative;
    background: url("../images/bg.png");
    background-size: 100% auto;
}

main::before {
    content: "";
    width: 100lvw;
    height: 100lvh;
    top: 0;
    left: 0;
}

section {
    position: relative;
    padding-top: 0;
    padding-bottom: 8vw;
    z-index: 0;
}

section .wrapper {
    position: relative;
    z-index: 2;
}


/*add*/

.section-head {
    display: block;
    position: relative;
    margin: 0 auto;
    width: 15vw;
    text-align: center;
}

#header {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 30;
}

#header .anniv-logo {
    position: absolute;
    z-index: 1;
    width: 18.48vw;
    left: 1.5vw;
    top: 0vw;
}

#header .nav-container {
    display: flex;
    width: 100%;
    height: 3.125vw;
    background: #285e57;
    align-items: stretch;
    justify-content: flex-end;
    padding: 0 3vw;
    z-index: 30;
    top: 0;
    left: 0;
}

#header .header-left {
    position: absolute;
    width: 1vw;
    top: 0;
    left: 0;
}

#header .header-right {
    position: absolute;
    width: 1vw;
    top: 0;
    right: 0;
}

#header .nav-container #nav {
    position: relative;
    z-index: 1;
}

#header .nav-container #nav .list {
    display: flex;
    align-items: center;
    height: 100%;
    gap: 2.5vw;
}

#header .nav-container #nav .list .item {
    font-size: 1.3vw;
    letter-spacing: 0.1em;
}

#header .nav-container #nav .list .item .nav-link {
    transition: opacity 0.2s;
    font-weight: 500;
    font-style: normal;
    color: #ffffff;
    display: flex;
    align-items: center;
}

#header .nav-container #nav .list .item .nav-link img {
    width: 1.5vw;
    height: 1.5vw;
    display: block;
    /* margin-right: 0.5em; */
}

#header .nav-container #nav .list .item.disable {
    filter: grayscale(1);
    opacity: 0.5;
    pointer-events: none;
}

@media (hover: hover) {
    #header .nav-container #nav .nav-link:hover {
        opacity: 0.5;
    }
}

#header .nav-container .menu-btn {
    display: none;
}
.logo3{
    width: 29vw;
    margin: 2vw auto 0 auto;
}
@media screen and (max-width: 600px) {
    .logo3{
        width: 100%;
        margin-top: 20vw;
    }
    main {
        position: relative;
        /* background: #fff url("../images/ptn-bg.png");
        background-size: 25%; */
    }
    main::before {
        content: "";
        width: 100lvw;
        height: 100lvh;
        top: 0;
        left: 0;
    }
    section {
        padding-top: 0vw;
        padding-bottom: 0vw;
        min-height: auto;
    }
    .section-head {
        margin: 0 auto;
        width:50vw;
    }
    #header {
        background: #0d6265;
        height: 15vw;
    }
    #header .nav-container {
        display: block;
        margin-top: 15vw;
        width: 100%;
        height: 100lvh;
        background: #083e40;
        padding: 3.8461538462vw;
        position: fixed;
        z-index: 30;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s;
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    #header .nav-container.active {
        opacity: 1;
        pointer-events: all;
    }
    #header .nav-container::after {
        display: none;
    }
    #header .anniv-logo {
        position: absolute;
        z-index: 1;
        width: 7.5vw;
        top: 4vw;
        left: 5vw;
    }
    #header .nav-container #nav {
        position: relative;
        z-index: 1;
        width: 100%;
    }
    #header .nav-container #nav .list {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        height: 100%;
        gap: 7.6923076923vw;
        padding: 0 3.8461538462vw;
    }
    #header .nav-container #nav .list .item {
        /* width: 100%; */
        margin: auto;
        text-align: center;
        color: #ebce7f;
        font-size: 5.1282051282vw;
        letter-spacing: 0.1em;
        position: relative;
    }
    #header .nav-container #nav .list .item .nav-link {
        font-weight: 500;
    }
    #header .nav-container #nav .list .item img {
        min-width: 100vw;
        position: absolute;
        transform: translate(-50%, -50%);
        bottom: -4.5vw;
        left: 50%;
    }
    #header .menu-btn {
        width: 14.6794871795vw;
        height: 14.6794871795vw;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 3vw;
        position: fixed;
        top: 0vw;
        right: 0vw;
        z-index: 31;
    }
    #header .menu-btn span {
        display: block;
        width: 10vw;
        height: 3px;
        background-color: #fff;
        transition: translate 0.3s;
    }
    #header.active .nav-container {
        opacity: 1;
        pointer-events: all;
    }
    #header.active .menu-btn span:nth-child(1) {
        rotate: 45deg;
        translate: 0 1.5vw;
    }
    #header.active .menu-btn span:nth-child(2) {
        display: none;
    }
    #header.active .menu-btn span:nth-child(3) {
        rotate: -45deg;
        translate: 0 -2vw;
    }
    #header.active .menu-btn::before {
        opacity: 0;
    }
    #header.active .menu-btn::after {
        rotate: 225deg;
    }
}


/*----------------------------------------------------------------------
fv
----------------------------------------------------------------------*/

#fv {
    position: relative;
    width: 100%;
    padding: 0;
    z-index: 1;
    /* background: no-repeat top 0 left 0/100% auto url("../images/kv-bg.png"); */
}

#fv .kv {
    display: block;
    position: relative;
    width: 100%;
    height:calc(100vh - 3.125vw);
    overflow: hidden;
    margin: 0 auto;
}

#fv .logo {
    position: absolute;
    width: 35.15625vw;
    bottom: 0.2083333333vw;
    left: 10vw;
    z-index: 2;
}

#fv .date {
    position: absolute;
    width: 55vw;
    left: 22.7291666667vw;
    bottom: 1vw;
    z-index: 2;
}

#fv .role {
    position: relative;
    /* width: auto;
    height: 100%; */
    width: 100%;
    height:auto;
    max-width: none;
    top: 0;
    left: 50%;
    transform: translate(-50%,0);
    z-index: 1;
}

#fv .wrole {
    /* width: auto;
    height: 100%; */
    width: 100%;
    height:auto;
}

#fv .hrole {
    width: auto;
    height: 100%;
}
@media screen and (max-width: 600px) {
    #fv .kv {
        width: 100%;
        margin: 0 auto;
        height:calc(100vh - 15vw);
    }
    #fv .logo {
        position: absolute;
        display: block;
        width: 100vw;
        bottom: 19vw;
        left: 0vw;
        right: 0;
        margin: 0 auto;
        z-index: 2;
    }
    #fv .date {
        position: absolute;
        width: 90vw;
        left: 3.8461538462vw;
        right: auto;
        bottom: 3.5128205128vw;
        z-index: 2;
    }
    #fv .role {
        position: relative;
        width: 100%;
        height: auto;
        transform: none;
        top: 0;
        left: 0;
        z-index: 1;
    }
}


/*----------------------------------------------------------------------
outline
----------------------------------------------------------------------*/

#outline {
    padding-top: 2vw;
    /* margin-top: -2.0833333333vw; */
    width: 100%;
    position: relative;
}

#outline .outline-container {
    display: block;
    gap: 1.25vw;
    /* width: 100vw; */
    margin: 0 auto;
}

#outline .stand-container {
    width: 14%;
    margin: 2vw auto;
}

#outline .desc-container {
    flex-direction: column;
    width: 100%;
    position: relative;
}

#outline .desc-container .catch-text {
    width: 25.8333333333vw;
    translate: -1.3541666667vw 1.3541666667vw;
}

#outline .desc-container .desc {
    text-align: center;
    margin-top: 1.5vw;
    font-size: 2.05vw;
    line-height: 2.6vw;
    letter-spacing: 0.12vw;
}

#outline .desc-container .desc2 {
    text-align: center;
    font-size: 1.6vw;
    line-height: 2.5vw;
    letter-spacing: 0.12vw;
}

#outline .detail-container {
    padding: 5.3vw 6.5vw;
    position: relative;
    text-align: start;
    /* background-color: #fff; */
    width: 65vw;
    margin: 5% auto 0;
    /* border-bottom: solid 8px #e1d4d4; */
    background-image: url("../images/ptn-seigaiha.png");
    background-size: 100% auto;
}
.detail-container2{
    margin-top: 0 !important;
}

#outline .detail-container .item {
    display: flex;
    font-size: 2vw;
    gap: 7vw;
    margin: 0 auto;
}

#outline .detail-container .item>* {
    font-weight: 500;
}

#outline .detail-container .item:not(:last-child) {
    margin-bottom: 2.6666666667vw;
}

#outline .detail-container .item .head {
    color: #ffffff;
    min-width:10vw;
    /* display: flex; */
    align-items: center;
    align-self: flex-start;
}

#outline .detail-container .item .head img {
    width: 0.9895833333vw;
    height: 0.9895833333vw;
    margin-right: 0.5em;
}

#outline .detail-container .item .desc {
    color: #fff;
}

#outline .detail-container .item .desc .link-btn img {
    display: block;
    width: 17vw;
    margin: 1vw 0 2.5vw 0;
}

#outline .detail-container .item .desc .link-btn2 img {
    display: block;
    width: 20vw;
    margin: 0;
}


#outline .detail-container .item .desc .link-btn:hover {
    opacity: 0.75;
}

#outline .detail-container .item .desc .attention {
    display: block;
    font-size: 1.3vw;
    margin-top: 1vw;
    line-height: 1.5vw;
    font-weight: 400;
}

@media screen and (max-width: 600px) {
    #outline {
        padding-top: 0vw;
        margin-top: 16vw;
        width: 100%;
    }
    #outline::before {
        display: none;
    }
    #outline::after {
        display: none;
    }
    #outline .section-head {
        margin-top: 0;
        width: 40vw;
    }
    #outline .outline-container {
        display: flex;
        flex-direction: column;
        gap: 1.25vw;
        /* width: 100%; */
        margin: 0 auto;
    }
    #outline .stand-container {
        width: 70%;
        margin-top: 5vw;
        /* right: 0; */
        /* position: absolute; */
        /* overflow: hidden; */
    }
    #outline .stand-container img {
        /* translate: 10.2564102564vw -5.1282051282vw; */
    }
    #outline .desc-container {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        margin: 0vw auto ;
    }
    #outline .desc-container .catch-text {
        width: 100%;
    }
    #outline .desc-container .desc {
        font-size: 6vw;
        margin-top: 4.5vw;
        width: 75vw;
        line-height:8vw;
    }
    #outline .desc-container .desc2 {
        text-align: left;
        font-size: 4.4vw;
        margin-top: 0vw;
        width: 86vw;
        line-height:8vw;
    }
    #outline .detail-container {
        padding: 8vw 0;
        width: 100%;
        margin: 5% auto 0;
        background-image: none;
    }
    #outline .detail-container .item {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 4.1025641026vw;
        gap: 2.3076923077vw;
    }
    #outline .detail-container .item:not(:last-child) {
        margin-bottom: 23.1538461538vw;
    }
    #outline .detail-container .item:nth-child(2) {
        margin-bottom: 12.1538461538vw;
    }
    #outline .detail-container .item .head {
        /* display: block; */
        color: #54433b;
        text-align: center;
        width: 100%;
        font-size: 9.5vw;
        font-weight: 800;
    }
    #outline .detail-container .item .head img {
        width: 3.5897435897vw;
        height: 3.5897435897vw;
        margin-right: 0.5em;
    }
    #outline .detail-container .item .desc {
        margin-top: 5vw;
        /* display: block; */
        color: #54433b;
        text-align: center;
        line-height: 12vw;
        width: 80%;
        font-size:8vw;
    }
    #outline .detail-container .item .desc .link-btn img {
        display: block;
        width:80%;
        margin: 1vw auto 2.5vw auto;
    }

    #outline .detail-container .item .desc .link-btn2 img {
        display: block;
        width:100%;
    }

    #outline .detail-container .item .desc .link-btn {
        font-size: 3.5897435897vw;
        width: 100%;
        display: inline-block;
        padding:0;
        margin-top: 3vw;
        margin-left: 0;
    }
    #outline .detail-container .item .desc .attention {
        text-align: left;
        display: block;
        font-size: 4.7vw;
        margin-top: 8vw;
        line-height: 8vw;
    }
}


/*----------------------------------------------------------------------
cast
----------------------------------------------------------------------*/

#cast {
    background: url("../images/ptn-asanoha.jpg");
}

#cast .section-head {
    margin-bottom: 0;
}

#cast .sort-attention {
    font-size: 0.9375vw;
    text-align: center;
    color: #fff;
}

#cast .cast-container {
    margin-top: 4.1666666667vw;
}

#cast .cast-container.cosplayer .list .item .name-container {
    font-size: 0.9375vw;
}

#cast .cast-container .head {
    font-size: 1.6666666667vw;
    color: #7f1515;
    width: 25vw;
    height: 2.9166666667vw;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    position: relative;
    background: #fff;
    border-radius: 2.9166666667vw;
}

#cast .cast-container .sub-class {
    font-size: 1.0416666667vw;
    text-align: center;
    color: #fff;
    margin-top: 1.75em;
}

#cast .cast-container .list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 62.5vw;
    margin: 1.6666666667vw auto 0;
    gap: 3.3333333333vw 5%;
}

#cast .cast-container .list.small {
    gap: 1.25vw 2%;
}

#cast .cast-container .list .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
}

#cast .cast-container .list .item .image-container {
    width: 100%;
}

#cast .cast-container .list .item .image-container img {
    width: 100%;
}

#cast .cast-container .list .item .name-container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5em 0;
    font-size: 1.25vw;
    color: #fff;
}

#cast .cast-container .list .item.large {
    width: 9.375vw;
}

#cast .cast-container .list .item.small {
    width: 12.5%;
}

#cast .sd {
    position: absolute;
}

#cast .sd img {
    width: 100%;
}

#cast .sd.sd-01 {
    top: -1.6666666667vw;
    right: 16.6666666667vw;
    width: 14.6875vw;
}

#cast .sd.sd-02 {
    top: 14.4791666667vw;
    left: 10.9375vw;
    width: 13.1770833333vw;
}

@media screen and (max-width: 600px) {
    #cast {
        background-size: 25%;
    }
    #cast .section-head {
        margin-bottom: 0.5em;
    }
    #cast .sort-attention {
        font-size: 3.5897435897vw;
    }
    #cast .cast-container {
        margin-top: 16.4102564103vw;
    }
    #cast .cast-container.cosplayer .list .item .name-container {
        font-size: 4.1025641026vw;
    }
    #cast .cast-container .head {
        font-size: 4.6153846154vw;
        width: 84.6153846154vw;
        height: 9.2307692308vw;
        border-radius: 9.2307692308vw;
    }
    #cast .cast-container .sub-class {
        font-size: 3.5897435897vw;
        text-align: center;
        color: #fff;
        margin-top: 1.75em;
    }
    #cast .cast-container .list {
        width: 92.3076923077vw;
        margin: 8.2051282051vw auto 0;
        gap: 8.2051282051vw 2.0512820513vw;
        justify-content: flex-start;
    }
    #cast .cast-container .list.small {
        gap: 8.2051282051vw 2.0512820513vw;
    }
    #cast .cast-container .list .item {
        display: flex;
        flex-direction: column;
        align-items: center;
        box-sizing: border-box;
    }
    #cast .cast-container .list .item .image-container {
        width: 100%;
    }
    #cast .cast-container .list .item .image-container img {
        width: 100%;
    }
    #cast .cast-container .list .item .name-container {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0.75em;
        font-size: 4.1025641026vw;
    }
    #cast .cast-container .list .item.large {
        width: 48%;
    }
    #cast .cast-container .list .item.small {
        width: 48%;
    }
    #cast .cast-container.other .list {
        justify-content: center;
    }
}


/*----------------------------------------------------------------------
stage
----------------------------------------------------------------------*/

#stage {
    background: repeat top left/3.2291666667vw auto url("../images/bg-ptnoverlay.png");
}

#stage .timetable {
    color: #fff;
    width: 62.5vw;
    margin: 3.75vw auto 0;
    font-size: 1.4583333333vw;
    display: flex;
    flex-direction: column;
    gap: 1em;
}

#stage .timetable .item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 0.25rem;
    align-items: baseline;
}

#stage .timetable .item .time {
    background: rgba(160, 5, 4, 0.9);
    padding: 1em;
    text-align: center;
    width: 27%;
    height: 3em;
}

#stage .timetable .item .program {
    width: 71%;
}

#stage .timetable .item .program .program-title {
    background: rgba(160, 5, 4, 0.9);
    height: 3em;
    text-align: start;
    padding: 0 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: color 0.5s;
    cursor: pointer;
}

#stage .timetable .item .program .program-title .icon {
    width: 2.0833333333vw;
    height: 2.0833333333vw;
    display: block;
    background: #fff;
    border-radius: 2.0833333333vw;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: rotate 0.5s;
}

#stage .timetable .item .program .program-title .icon::after {
    content: "";
    width: 40%;
    height: 40%;
    border-top: solid 3px #65211f;
    border-right: solid 3px #65211f;
    position: absolute;
    transform: rotate(135deg);
    top: 25%;
}

#stage .timetable .item .program .detail-container {
    font-size: 0.8333333333vw;
    line-height: 1.5em;
    color: #61482f;
    background: rgba(255, 255, 255, 0.9);
    display: grid;
    transition: grid-template-rows 0.5s;
    grid-template-rows: 0fr;
}

#stage .timetable .item .program .detail-container .inner {
    overflow: hidden;
}

#stage .timetable .item .program .detail-container .inner .text {
    margin: 1em;
}

#stage .timetable .item .program.active .program-title {
    color: #ffea00;
}

#stage .timetable .item .program.active .program-title .icon {
    rotate: 180deg;
    background: #ffea00;
}

#stage .timetable .item .program.active .detail-container {
    grid-template-rows: 1fr;
}

@media screen and (max-width: 600px) {
    #stage {
        background: repeat top left/15.8974358974vw auto url("../images/bg-ptnoverlay.png");
    }
    #stage .timetable {
        color: #fff;
        width: 92.3076923077vw;
        margin: 8.2051282051vw auto 0;
        font-size: 4.1025641026vw;
        display: flex;
        flex-direction: column;
        gap: 0.75em;
    }
    #stage .timetable .item {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        margin-bottom: 0.25rem;
        align-items: baseline;
    }
    #stage .timetable .item .time {
        font-size: 3.5897435897vw;
        background: rgba(160, 5, 4, 0.9);
        padding: 1em;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        text-align: start;
        width: 100%;
        height: 2em;
        margin-bottom: 1px;
    }
    #stage .timetable .item .program {
        width: 100%;
    }
    #stage .timetable .item .program .program-title {
        background: rgba(160, 5, 4, 0.9);
        height: 3em;
        text-align: start;
        padding: 0 3.8461538462vw 0 3.8461538462vw;
        display: flex;
        align-items: center;
        justify-content: space-between;
        transition: color 0.5s;
        cursor: pointer;
    }
    #stage .timetable .item .program .program-title .icon {
        width: 5.1282051282vw;
        height: 5.1282051282vw;
        display: block;
        background: #fff;
        border-radius: 6.1538461538vw;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: rotate 0.5s;
    }
    #stage .timetable .item .program .program-title .icon::after {
        content: "";
        width: 33%;
        height: 33%;
        border-top: solid 2px #65211f;
        border-right: solid 2px #65211f;
        position: absolute;
        transform: rotate(135deg);
        top: 28%;
    }
    #stage .timetable .item .program .detail-container {
        font-size: 3.5897435897vw;
        line-height: 1.25em;
        color: #61482f;
        background: rgba(255, 255, 255, 0.9);
        display: grid;
        transition: grid-template-rows 0.5s;
        grid-template-rows: 0fr;
    }
    #stage .timetable .item .program .detail-container .inner {
        overflow: hidden;
    }
    #stage .timetable .item .program .detail-container .inner .text {
        margin: 1em;
    }
    #stage .timetable .item .program.active .program-title {
        color: #ffea00;
    }
    #stage .timetable .item .program.active .program-title .icon {
        rotate: 180deg;
        background: #ffea00;
    }
    #stage .timetable .item .program.active .detail-container {
        grid-template-rows: 1fr;
    }
}


/*----------------------------------------------------------------------
activities ennichi
----------------------------------------------------------------------*/

#activities,
#ennichi {
    /* background: url("../images/ptn-asanoha.jpg"); */
    padding-top: 6vw;
}

#activities .act-list,
#ennichi .act-list {
    display: flex;
    flex-wrap: wrap;
    /* width: 100vw; */
    margin: 0 auto;
    gap: 6.25vw 2.0833333333vw;
}

#activities .act-list .act-item,
#ennichi .act-list .act-item {
    width: 100%;
    padding: 1.6666666667vw 1.6666666667vw 0;
    /* background: #fff; */
    position: relative;
    /* border: solid 6px #f0d2c7; */
    /* background: url("../images/ptn-container-bg.png"); */
}

#activities .act-list .act-item .img-title1,
#ennichi .act-list .act-item .img-title1 {
    display: block;
    width: 15.5vw;
    margin: 1vw auto;
}

#activities .act-list .act-item .img-title2,
#ennichi .act-list .act-item .img-title2 {
    display: block;
    width: 15.5vw;
    margin: 5vw auto 3.8vw auto;
}

#activities .act-list .act-item .img-title3,
#ennichi .act-list .act-item .img-title3 {
    display: block;
    width: 20vw;
    margin: 9vw auto 2vw auto;
}

#activities .act-list .act-item .img-title4,
#ennichi .act-list .act-item .img-title4 {
    display: block;
    width: 15.5vw;
    margin: 5vw auto 2vw auto;
}

#activities .act-list .act-item .img-title5,
#ennichi .act-list .act-item .img-title5 {
    display: block;
    width: 17vw;
    margin: 2vw auto 1.2vw auto;
}

#activities .act-list .act-item .sd,
#ennichi .act-list .act-item .sd {
    width: 12.9166666667vw;
    position: absolute;
    z-index: 1;
    top: -9.375vw;
    left: 1.6666666667vw;
}

#activities .act-list .act-item .act-title,
#ennichi .act-list .act-item .act-title {
    font-size: 1.6vw;
    line-height: 1.98vw;
    color: rgb(84, 67, 58);
    min-width: 30.2083333333vw;
    width: -moz-fit-content;
    width: fit-content;
    letter-spacing: 0.3vw;
    /* padding: 1em; */
    /* height: 2.9166666667vw; */
    /* display: flex; */
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    position: relative;
    /* background: url("../images/ptn-seigaiha.png"); */
    /* border-radius: 2.9166666667vw; */
}

#activities .act-list .act-item .act-title .text2,
#ennichi .act-list .act-item .act-title .text2 {
    font-size: 1.7vw;
    line-height: 2.5vw;
}

#activities .act-list .act-item .act-title .text3,
#ennichi .act-list .act-item .act-title .text3 {
    font-size: 1.25vw;
    line-height: 1.8vw;
}

#activities .act-list .act-item .detail-block,
#ennichi .act-list .act-item .detail-block {
    position: relative;
    text-align: center;
    margin: 2.5vw 0 3.3333333333vw;
    z-index: 1;
}

#activities .act-list .act-item .detail-block .head,
#ennichi .act-list .act-item .detail-block .head {
    font-size: 1.0416666667vw;
    color: #dc1812;
    margin-bottom: 0.75em;
}

#activities .act-list .act-item .detail-block .head .attention,
#ennichi .act-list .act-item .detail-block .head .attention {
    font-size: 0.6em;
}

#activities .act-list .act-item .detail-block .text,
#ennichi .act-list .act-item .detail-block .text {
    font-size: 1.0416666667vw;
    line-height: 2em;
    display: block;
}

#activities .act-list .act-item .detail-block .text.catch,
#ennichi .act-list .act-item .detail-block .text.catch {
    font-size: 1.25vw;
    font-weight: 900;
}

#activities .act-list .act-item .detail-block .text.cast,
#ennichi .act-list .act-item .detail-block .text.cast {
    word-break: keep-all;
    line-break: strict;
}

#activities .act-list .act-item .detail-block .text .attention,
#ennichi .act-list .act-item .detail-block .text .attention {
    font-size: 0.7291666667vw;
    display: block;
    line-height: 1.25em;
    margin-top: 1em;
    font-weight: 400;
    line-height: 1.5em;
}

#activities .act-list .act-item .detail-block .link-btn,
#ennichi .act-list .act-item .detail-block .link-btn {
    display: inline-block;
    position: relative;
    align-items: center;
    color: #fff;
    background: #c51916;
    padding: 0.75em 3em;
    margin: 0.75em 0;
    font-size: 1.25vw;
    font-weight: 900;
}

#activities .act-list .act-item .detail-block .link-btn::before,
#ennichi .act-list .act-item .detail-block .link-btn::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 4px;
    background: rgba(78, 78, 78, 0.25);
    bottom: 0;
    left: 0;
}

#activities .act-list .act-item .detail-block .link-btn::after,
#ennichi .act-list .act-item .detail-block .link-btn::after {
    content: "";
    width: 0.5em;
    height: 0.5em;
    display: block;
    position: absolute;
    right: 0.5em;
    top: 50%;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
    margin-left: 1em;
    rotate: 45deg;
    translate: 0 -50%;
}

#activities .act-list .act-item .detail-block .link-btn.end,
#ennichi .act-list .act-item .detail-block .link-btn.end {
    background-color: #a9a9a9;
    color: #fff;
    pointer-events: none;
}

#activities .act-list .act-item .detail-block .link-btn:hover,
#ennichi .act-list .act-item .detail-block .link-btn:hover {
    opacity: 0.75;
}

#activities .act-list .act-item .detail-block .leader-list,
#ennichi .act-list .act-item .detail-block .leader-list {
    display: flex;
    justify-content: center;
    margin: 1.25vw 0 2.5vw;
    gap: 0.8333333333vw;
}

#activities .act-list .act-item .detail-block .leader-list .leader-item,
#ennichi .act-list .act-item .detail-block .leader-list .leader-item {
    width: 15.5vw;
    position: relative;
}

#activities .act-list .act-item .detail-block .food-logo,
#ennichi .act-list .act-item .detail-block .food-logo {
    display: block;
    width: 19.7916666667vw;
    margin: 0 auto 1.6666666667vw;
}

#activities .act-list .act-item .detail-block .company-list,
#ennichi .act-list .act-item .detail-block .company-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.4166666667vw;
    margin-top: 1.6666666667vw;
}

#activities .act-list .act-item .detail-block .company-list .company-item,
#ennichi .act-list .act-item .detail-block .company-list .company-item {
    width: 7.7083333333vw;
}

#activities .act-list .act-item .detail-block .company-list .company-logo,
#ennichi .act-list .act-item .detail-block .company-list .company-logo {
    width: 100%;
}

#activities .act-list .act-item.small,
#ennichi .act-list .act-item.small {
    width: 30.2083333333vw;
    padding: 1.6666666667vw 0.78125vw 0;
}

#activities .act-list .act-item.small .sd,
#ennichi .act-list .act-item.small .sd {
    width: 6.875vw;
    top: -5.2083333333vw;
    left: 0vw;
    z-index: -1;
}

#activities .act-list .act-item.small .act-title,
#ennichi .act-list .act-item.small .act-title {
    font-size: 1.25vw;
    letter-spacing: -0.05em;
    max-width: 100%;
    min-width: 17.7083333333vw;
    width: -moz-fit-content;
    width: fit-content;
    padding: 1em;
}

#ennichi .section-head {
    width: 47.9166666667vw;
}

@media screen and (max-width: 600px) {
    #activities,
    #ennichi {
        margin-top: 13vw;
    }
    #activities .section-head,
    #ennichi .section-head{
        width: 38vw;
    }
    #activities .act-list,
    #ennichi .act-list {
        display: flex;
        flex-wrap: wrap;
        width: 92.3076923077vw;
        margin: 0 auto;
        gap: 16.4102564103vw;
    }
    #activities .act-list .act-item,
    #ennichi .act-list .act-item {
        width: 100%;
        margin: 0 auto;
        padding: 0;
        position: relative;
    }
    #activities .act-list .act-item:first-child,
    #ennichi .act-list .act-item:first-child {
        margin-top: 8.2051282051vw;
    }
    #activities .act-list .act-item .sd,
    #ennichi .act-list .act-item .sd {
        width: 35.8974358974vw;
        position: absolute;
        z-index: -1;
        top: auto;
        bottom: -12.3076923077vw;
        left: auto;
        right: 0;
    }
    #activities .act-list .act-item .act-title,
    #ennichi .act-list .act-item .act-title {
        font-size: 7.5vw;
        width: 100%;
        margin: 13.2051282051vw auto 0 auto;
        line-height: 11vw;
        letter-spacing: 0.8vw;
    }
    
    #activities .act-list .act-item .act-title-top,
    #ennichi .act-list .act-item .act-title-top {
        font-size: 7.5vw;
        width: 100%;
        margin: 5.2051282051vw auto 0 auto;
        line-height: 11vw;
        letter-spacing: 0.8vw;
    }
    #activities .act-list .act-item .act-title2,
    #ennichi .act-list .act-item .act-title2 {
        font-size: 4.3vw;
        width: 89%;
        margin: 13.2051282051vw auto 0 auto;
        line-height: 7.8vw;
        letter-spacing: 0.8vw;
    }
        
    #activities .act-list .act-item .act-title .text2,
    #ennichi .act-list .act-item .act-title .text2 {
        width: 90%;
        margin: auto;
        padding-top: 5vw;
        text-align: center;
        font-size: 6vw;
        line-height: 7.5vw;
        letter-spacing: 0.8vw;
    }
    
    #activities .act-list .act-item .act-title .text3,
    #ennichi .act-list .act-item .act-title .text3 {
        width: 90%;
        margin: auto;
        text-align: left;
        font-size: 4vw;
        line-height: 5vw;
        letter-spacing: 0.8vw;
    }
    #activities .act-list .act-item .img-title1,
    #ennichi .act-list .act-item .img-title1 {
        display: block;
        width: 77vw;
        margin: auto;
    }

    #activities .act-list .act-item .img-title2,
    #ennichi .act-list .act-item .img-title2 {
        display: block;
        width: 77vw;
        margin: 22vw auto 3.8vw auto;
    }

    #activities .act-list .act-item .img-title3,
    #ennichi .act-list .act-item .img-title3 {
        display: block;
        width: 77vw;
        margin: 20vw auto 2vw auto;
    }

    #activities .act-list .act-item .img-title4,
    #ennichi .act-list .act-item .img-title4 {
        display: block;
        width: 77vw;
        margin: 28vw auto 2vw auto;
    }

    #activities .act-list .act-item .img-title5,
    #ennichi .act-list .act-item .img-title5 {
        display: block;
        width: 80vw;
        margin: 2vw auto 1.2vw auto;
    }

    #activities .act-list .act-item .act-title .text,
    #ennichi .act-list .act-item .act-title .text {
        position: relative;
        z-index: 1;
    }
    #activities .act-list .act-item .act-title img,
    #ennichi .act-list .act-item .act-title img {
        display: block;
        width: 3.5897435897vw;
        height: 3.5897435897vw;
    }
    #activities .act-list .act-item .act-title img:first-of-type,
    #ennichi .act-list .act-item .act-title img:first-of-type {
        margin-right: 1em;
    }
    #activities .act-list .act-item .act-title img:last-of-type,
    #ennichi .act-list .act-item .act-title img:last-of-type {
        margin-left: 1em;
    }
    #activities .act-list .act-item .detail,
    #ennichi .act-list .act-item .detail {
        width: 100%;
        margin: 0 auto;
    }
    #activities .act-list .act-item .detail-block,
    #ennichi .act-list .act-item .detail-block {
        position: relative;
        text-align: center;
        margin: 5.1282051282vw 0 8.2051282051vw;
        z-index: 1;
    }
    #activities .act-list .act-item .detail-block .head,
    #ennichi .act-list .act-item .detail-block .head {
        font-size: 4.1025641026vw;
        color: #dc1812;
        margin: 0.75em 0;
    }
    #activities .act-list .act-item .detail-block .head .attention,
    #ennichi .act-list .act-item .detail-block .head .attention {
        font-size: 0.6em;
    }
    #activities .act-list .act-item .detail-block .text,
    #ennichi .act-list .act-item .detail-block .text {
        font-size: 4.1025641026vw;
        line-height: 2em;
        display: block;
        letter-spacing: -0.05em;
    }
    #activities .act-list .act-item .detail-block .text.catch,
    #ennichi .act-list .act-item .detail-block .text.catch {
        font-size: 5.1282051282vw;
        font-weight: 900;
    }
    #activities .act-list .act-item .detail-block .text .attention,
    #ennichi .act-list .act-item .detail-block .text .attention {
        font-size: 3.5897435897vw;
    }
    #activities .act-list .act-item .detail-block .link-btn,
    #ennichi .act-list .act-item .detail-block .link-btn {
        font-size: 4.1025641026vw;
        font-weight: 900;
        padding: 1em 1em;
        width: 100%;
    }
    #activities .act-list .act-item .detail-block .link-btn.end,
    #ennichi .act-list .act-item .detail-block .link-btn.end {
        background-color: #a9a9a9;
        color: #fff;
        pointer-events: none;
    }
    #activities .act-list .act-item .detail-block .link-btn:hover,
    #ennichi .act-list .act-item .detail-block .link-btn:hover {
        opacity: 0.75;
    }
    #activities .act-list .act-item .detail-block .leader-list,
    #ennichi .act-list .act-item .detail-block .leader-list {
        display: flex;
        justify-content: center;
        margin: 20.4102564103vw 0 8.2051282051vw;
        flex-wrap: wrap;
        gap: 5.2564102564vw 2.5641025641vw;
    }
    #activities .act-list .act-item .detail-block .leader-list .leader-item,
    #ennichi .act-list .act-item .detail-block .leader-list .leader-item {
        width: 40vw;
        position: relative;
        filter: drop-shadow(0 0 16px #e6e6e6);
    }
    #activities .act-list .act-item .detail-block .leader-list .leader-item img,
    #ennichi .act-list .act-item .detail-block .leader-list .leader-item img {
        max-width: 100%;
    }
    #activities .act-list .act-item .detail-block .food-logo,
    #ennichi .act-list .act-item .detail-block .food-logo {
        display: block;
        width: 71.7948717949vw;
        margin: 8.2051282051vw auto 8.2051282051vw;
    }
    #activities .act-list .act-item .detail-block .company-list,
    #ennichi .act-list .act-item .detail-block .company-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 2.0512820513vw 2%;
        margin-top: 8.2051282051vw;
    }
    #activities .act-list .act-item .detail-block .company-list .company-item,
    #ennichi .act-list .act-item .detail-block .company-list .company-item {
        width: 48%;
    }
    #activities .act-list .act-item.small,
    #ennichi .act-list .act-item.small {
        width: 100%;
        margin: 0 auto;
        padding: 5.1282051282vw 3.8461538462vw 35.8974358974vw;
        position: relative;
    }
    #activities .act-list .act-item.small .sd,
    #ennichi .act-list .act-item.small .sd {
        width: 35.8974358974vw;
        position: absolute;
        z-index: -1;
        top: auto;
        bottom: -12.3076923077vw;
        left: auto;
        right: 0;
    }
    #activities .act-list .act-item.small .act-title,
    #ennichi .act-list .act-item.small .act-title {
        font-size: 5.1282051282vw;
    }
    #ennichi .section-head {
        width: 100%;
    }
}


/*----------------------------------------------------------------------
movie
----------------------------------------------------------------------*/

#movie .section-head {
    width: 57.5520833333vw;
}

#movie .youtube {
    width: 62.5vw;
    aspect-ratio: 16/9;
    margin: 0 auto;
}

#movie .youtube iframe {
    width: 100%;
    height: 100%;
}

@media screen and (max-width: 600px) {
    #movie .section-head {
        width: 92.3076923077vw;
    }
    #movie .youtube {
        width: 92.3076923077vw;
        aspect-ratio: 16/9;
        margin: 0 auto;
    }
    #movie .youtube iframe {
        width: 100%;
        height: 100%;
    }
}


/*----------------------------------------------------------------------
comingsoon
----------------------------------------------------------------------*/

#comingsoon .sd {
    width: 12.8125vw;
    margin: 0 auto;
    display: block;
}

#comingsoon .comingsoon-text {
    display: block;
    width: 35.5208333333vw;
    margin: 4.1666666667vw auto;
}

@media screen and (max-width: 600px) {
    #comingsoon .sd {
        width: 41.0256410256vw;
        margin: 0 auto;
        display: block;
    }
    #comingsoon .comingsoon-text {
        display: block;
        width: 92.3076923077vw;
        margin: 8.2051282051vw auto;
    }
}


/*----------------------------------------------------------------------
goods
----------------------------------------------------------------------*/

#goods .desc-container .desc {
    text-align: center;
    font-size: 1.25vw;
    line-height: 1.5em;
    font-weight: 600;
}

#goods .desc-container .comingsoon {
    display: block;
    margin: 0 auto;
    width: 24.7395833333vw;
    margin-top: 1.6666666667vw;
}

#goods .content {
    width: 62.5vw;
    margin: 0 auto;
}

#goods .goods-list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 3.125vw;
    margin-top: 4.4270833333vw;
}

#goods .goods-list .item {
    width: 18.2291666667vw;
    text-align: center;
    align-items: stretch;
    box-sizing: border-box;
    background: url("../images/ptn-seigaiha.png");
    padding: 0.5208333333vw;
    display: flex;
    flex-direction: column;
}

#goods .goods-list .item .image-container {
    width: 100%;
    margin-bottom: 0.8333333333vw;
}

#goods .goods-list .item .text-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
}

#goods .goods-list .item .name {
    font-size: 1.0416666667vw;
    color: #fff;
    font-weight: 700;
    display: block;
    line-height: 1.5em;
    margin-bottom: 1em;
}

#goods .goods-list .item .name span {
    font-size: 0.9em;
}

#goods .goods-list .item .price {
    margin-top: auto;
    font-size: 0.9375vw;
    color: #d8be7e;
    font-weight: 700;
}

@media screen and (max-width: 600px) {
    #goods .content {
        width: 92.3076923077vw;
        margin: 0 auto;
    }
    #goods .desc-container .desc {
        text-align: center;
        font-size: 4.6153846154vw;
    }
    #goods .desc-container .comingsoon {
        display: block;
        margin: 0 auto;
        width: 92.3076923077vw;
        margin-top: 8.2051282051vw;
    }
    #goods .goods-list {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        margin: 10.2564102564vw auto 0;
        justify-content: space-between;
        gap: 5.1282051282vw 0;
    }
    #goods .goods-list .item {
        width: 43.5897435897vw;
        text-align: center;
        align-items: stretch;
        box-sizing: border-box;
        background: url("../images/ptn-seigaiha.png");
        padding: 2.0512820513vw;
        display: flex;
        flex-direction: column;
    }
    #goods .goods-list .item .image-container {
        width: 100%;
        height: 43.5897435897vw;
    }
    #goods .goods-list .item .text-container {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        flex-grow: 1;
        flex-shrink: 1;
        flex-basis: 0;
    }
    #goods .goods-list .item .name {
        font-size: 3.5897435897vw;
        color: #fff;
        font-weight: 700;
        display: block;
        line-height: 1.5em;
        margin-bottom: 1em;
    }
    #goods .goods-list .item .name span {
        font-size: 0.9em;
    }
    #goods .goods-list .item .price {
        font-size: 3.5897435897vw;
    }
}


/*----------------------------------------------------------------------
challenge
----------------------------------------------------------------------*/

#challenge {
    background: url("../images/ptn-asanoha.jpg");
}

#challenge .section-head {
    width: 47.9166666667vw;
}

#challenge .challenge-list {
    display: flex;
    flex-wrap: wrap;
    width: 62.5vw;
    margin: 2.0833333333vw auto 0;
    gap: 3.3333333333vw;
}

#challenge .challenge-list .challenge-item {
    width: 100%;
    padding: 1.6666666667vw;
    background-image: url("../images/ptn-container-bg.png");
    border: solid 6px #f0d2c7;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2.0833333333vw;
}

#challenge .challenge-list .challenge-item .challenge-title {
    font-size: 1.6666666667vw;
    color: #fff;
    min-width: 30.2083333333vw;
    width: -moz-fit-content;
    width: fit-content;
    padding: 1em;
    height: 2.9166666667vw;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    position: relative;
    background: url("../images/ptn-seigaiha.png");
    border-radius: 2.9166666667vw;
}

#challenge .challenge-list .challenge-item .detail-container {
    position: relative;
    width: 100%;
    z-index: 1;
    display: flex;
    gap: 1.0416666667vw;
}

#challenge .challenge-list .challenge-item .detail-container .image-container {
    position: relative;
    width: 22.7083333333vw;
    z-index: 1;
}

#challenge .challenge-list .challenge-item .detail-container .text-container {
    width: 35.4166666667vw;
    color: #61482f;
}

#challenge .challenge-list .challenge-item .detail-container .text-container .text {
    font-size: 0.9375vw;
    line-height: 1.5em;
    font-weight: 500;
}

#challenge .challenge-list .challenge-item .detail-container .text-container .text.table {
    display: flex;
    margin-top: 1em;
}

#challenge .challenge-list .challenge-item .detail-container .text-container .text.table .head {
    word-break: keep-all;
    line-break: strict;
}

#challenge .challenge-list .challenge-item .detail-container .text-container .text.table .attention {
    margin-top: 0;
    display: inline;
    letter-spacing: -0.05em;
    margin-left: 1em;
}

#challenge .challenge-list .challenge-item .detail-container .text-container .text .attention {
    display: block;
    font-size: 0.75em;
    line-height: 1.5em;
    margin-top: 1.5em;
}

@media screen and (max-width: 600px) {
    #challenge .section-head {
        width: 100%;
    }
    #challenge .challenge-list {
        display: flex;
        flex-wrap: wrap;
        width: 92.3076923077vw;
        margin: 5.1282051282vw auto 0;
        gap: 8.2051282051vw;
    }
    #challenge .challenge-list .challenge-item {
        width: 100%;
        padding: 3.8461538462vw;
        background-image: url("../images/ptn-container-bg.png");
        border: solid 4px #f0d2c7;
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 3.8461538462vw;
    }
    #challenge .challenge-list .challenge-item .challenge-title {
        font-size: 5.1282051282vw;
        color: #fff;
        min-width: inherit;
        width: -moz-fit-content;
        width: fit-content;
        padding: 1em;
        height: 8.2051282051vw;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
        position: relative;
        background: url("../images/ptn-seigaiha.png");
        border-radius: 10.2564102564vw;
    }
    #challenge .challenge-list .challenge-item .detail-container {
        position: relative;
        width: 100%;
        z-index: 1;
        display: flex;
        gap: 5.1282051282vw;
        flex-direction: column;
    }
    #challenge .challenge-list .challenge-item .detail-container .image-container {
        position: relative;
        width: 100%;
        z-index: 1;
    }
    #challenge .challenge-list .challenge-item .detail-container .text-container {
        width: 100%;
        color: #61482f;
    }
    #challenge .challenge-list .challenge-item .detail-container .text-container .text {
        font-size: 4.1025641026vw;
        line-height: 1.5em;
        font-weight: 500;
    }
    #challenge .challenge-list .challenge-item .detail-container .text-container .text.table {
        display: flex;
        margin-top: 1em;
    }
    #challenge .challenge-list .challenge-item .detail-container .text-container .text.table .head {
        word-break: keep-all;
        line-break: strict;
    }
    #challenge .challenge-list .challenge-item .detail-container .text-container .text.table .attention {
        margin-top: 0;
        display: inline;
        letter-spacing: -0.05em;
        margin-left: 1em;
    }
    #challenge .challenge-list .challenge-item .detail-container .text-container .text .attention {
        display: block;
        font-size: 0.75em;
        line-height: 1.5em;
        margin-top: 1.5em;
    }
}


/*----------------------------------------------------------------------
live
----------------------------------------------------------------------*/

#live .desc-container {
    text-align: center;
    margin-top: 1.6666666667vw;
}

#live .desc-container .desc-head {
    font-size: 1.25vw;
    color: #dc1812;
    margin-bottom: 0.5em;
}

#live .desc-container .desc {
    text-align: center;
    font-size: 1.25vw;
    line-height: 1.5em;
    font-weight: 500;
}

#live .desc-container .desc.attention {
    font-size: 0.8333333333vw;
    font-weight: 400;
}

#live .desc-container .comingsoon {
    display: block;
    margin: 0 auto;
    width: 24.7395833333vw;
    margin-top: 1.6666666667vw;
}

#live .desc-container .youtube {
    width: 62.5vw;
    margin: 0 auto;
    margin-top: 1.6666666667vw;
}

#live .desc-container .youtube iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
}

@media screen and (max-width: 600px) {
    #live .content {
        width: 92.3076923077vw;
        margin: 0 auto;
    }
    #live .desc-container {
        text-align: center;
        margin: 8.2051282051vw 0;
    }
    #live .desc-container .desc-head {
        font-size: 4.6153846154vw;
        color: #dc1812;
        margin-bottom: 0.5em;
    }
    #live .desc-container .desc {
        text-align: center;
        font-size: 3.5897435897vw;
        line-height: 1.5em;
    }
    #live .desc-container .desc.attention {
        font-size: 0.75em;
        font-weight: 400;
    }
    #live .desc-container .comingsoon {
        display: block;
        margin: 0 auto;
        width: 92.3076923077vw;
        margin-top: 8.2051282051vw;
    }
    #live .desc-container .youtube {
        width: 100%;
        margin: 0 auto;
        margin-top: 8.2051282051vw;
    }
}


/*----------------------------------------------------------------------
repost-cp
----------------------------------------------------------------------*/

#repost-cp {
    background: url("../images/ptn-asanoha.jpg");
}

#repost-cp .section-head {
    width: 57.5520833333vw;
}

#repost-cp .repost-cp-list {
    display: flex;
    flex-wrap: wrap;
    width: 62.5vw;
    margin: 2.0833333333vw auto 0;
    gap: 3.3333333333vw;
}

#repost-cp .repost-cp-list .repost-cp-item {
    width: 100%;
    padding: 1.6666666667vw;
    background-image: url("../images/ptn-container-bg.png");
    border: solid 6px #f0d2c7;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2.0833333333vw;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container {
    position: relative;
    width: 100%;
    z-index: 1;
    display: flex;
    gap: 1.0416666667vw;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .image-container {
    position: relative;
    width: 22.7083333333vw;
    z-index: 1;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container {
    width: 35.4166666667vw;
    color: #61482f;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text {
    font-size: 0.9375vw;
    line-height: 1.5em;
    font-weight: 500;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text.table {
    display: flex;
    margin-top: 1em;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text.table .head {
    word-break: keep-all;
    line-break: strict;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text.table .attention {
    margin-top: 0;
    display: inline;
    letter-spacing: -0.05em;
    margin-left: 1em;
}

#repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text .attention {
    display: block;
    font-size: 0.75em;
    line-height: 1.5em;
    margin-top: 1.5em;
}

@media screen and (max-width: 600px) {
    #repost-cp {
        background: url("../images/ptn-asanoha.jpg");
    }
    #repost-cp .section-head {
        width: 100%;
    }
    #repost-cp .repost-cp-list {
        display: flex;
        flex-wrap: wrap;
        width: 92.3076923077vw;
        margin: 5.1282051282vw auto 0;
        gap: 8.2051282051vw;
    }
    #repost-cp .repost-cp-list .repost-cp-item {
        width: 100%;
        padding: 3.8461538462vw;
        background-image: url("../images/ptn-container-bg.png");
        border: solid 4px #f0d2c7;
        position: relative;
        display: flex;
        flex-direction: column;
        gap: 3.8461538462vw;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container {
        position: relative;
        width: 100%;
        z-index: 1;
        display: flex;
        gap: 5.1282051282vw;
        flex-direction: column;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .image-container {
        position: relative;
        width: 100%;
        z-index: 1;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container {
        width: 100%;
        color: #61482f;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text {
        font-size: 4.1025641026vw;
        line-height: 1.5em;
        font-weight: 500;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text.table {
        display: flex;
        margin-top: 1em;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text.table .head {
        word-break: keep-all;
        line-break: strict;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text.table .attention {
        margin-top: 0;
        display: inline;
        letter-spacing: -0.05em;
        margin-left: 1em;
    }
    #repost-cp .repost-cp-list .repost-cp-item .detail-container .text-container .text .attention {
        display: block;
        font-size: 0.75em;
        line-height: 1.5em;
        margin-top: 1.5em;
    }
}


/*----------------------------------------------------------------------
fast-track
----------------------------------------------------------------------*/

#fast-track {
    text-align: center;
}

#fast-track .content {
    width: 62.5vw;
    margin: 0 auto;
}

#fast-track .head {
    font-size: 1.6666666667vw;
    font-weight: 600;
    color: #dc1812;
    max-width: 100%;
    margin-bottom: 1em;
}

#fast-track .text {
    font-size: 0.8333333333vw;
    line-height: 2em;
    max-width: 100%;
}

@media screen and (max-width: 600px) {
    #fast-track {
        text-align: center;
    }
    #fast-track .content {
        width: 92.3076923077vw;
        margin: 0 auto;
    }
    #fast-track .head {
        font-size: 5.1282051282vw;
        font-weight: 600;
        color: #dc1812;
        max-width: 100%;
        margin-bottom: 1em;
        line-height: 1.5em;
    }
    #fast-track .text {
        font-size: 3.5897435897vw;
        line-height: 2em;
        max-width: 100%;
    }
}


/*----------------------------------------------------------------------
attention
----------------------------------------------------------------------*/

#attention .content {
    width: 62.5vw;
    margin: 0 auto;
}

#attention .content .attention-container {
    width: 100%;
    padding: 3.125vw 2.0833333333vw;
    background-image: url("../images/ptn-container-bg.png");
    border: solid 6px #f0d2c7;
    position: relative;
    display: flex;
    gap: 2.0833333333vw;
    font-size: 1.0416666667vw;
    line-height: 2em;
}

@media screen and (max-width: 600px) {
    #attention .content {
        width: 92.3076923077vw;
        margin: 0 auto;
    }
    #attention .content .attention-container {
        width: 100%;
        padding: 8.2051282051vw 3.8461538462vw;
        position: relative;
        display: flex;
        gap: 10.2564102564vw;
        font-size: 3.5897435897vw;
        line-height: 1.5em;
        border: solid 4px #f0d2c7;
    }
}


/*----------------------------------------------------------------------
footer
----------------------------------------------------------------------*/

.dl-container {
    width: 100%;
    height: 7.2916666667vw;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 1.6666666667vw;
    gap: 0.8333333333vw;
    z-index: 1;
    margin-top: 12.5vw;
}

.dl-container::before {
    content: "";
    position: absolute;
    width: 100%;
    z-index: -1;
    bottom: 0;
}

.dl-container .badge {
    width: 13.5416666667vw;
    max-height: 3.75vw;
}

.dl-container .badge:hover {
    opacity: 0.75;
}

.dl-container .badge .ios,
.dl-container .badge .android,
.dl-container .badge .windows {
    width: 100%;
    display: block;
}

.dl-container .badge .ios img,
.dl-container .badge .android img,
.dl-container .badge .windows img {
    width: 100%;
}

.dl-container .dl-head {
    width: 12.5vw;
    margin: 0 0.4166666667vw;
}

#footer {
    width: 100%;
    background: #000;
    position: relative;
    padding: 2.9166666667vw 0 2.9166666667vw;
    color: #fff;
    font-size: 0.8333333333vw;
}

#footer .container {
    width: 72.9166666667vw;
    display: flex;
    margin: 0 auto;
    gap: 2%;
}

#footer .container .logo-container {
    width: 32.5%;
    display: flex;
    align-items: center;
    gap: 1.6666666667vw;
}

#footer .container .logo-container .logo.yostar {
    width: 9.6875vw;
}

#footer .container .logo-container .logo.yostar img {
    display: block;
    width: 100%;
}

#footer .container .logo-container .logo.maoliang {
    width: 8.3333333333vw;
}

#footer .container .logo-container .logo.maoliang img {
    display: block;
    width: 100%;
}

#footer .container .text-container {
    width: 65.5%;
}

#footer .container .text-container .links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.8333333333vw 0;
}

#footer .container .text-container .links .link-item {
    padding: 0 1em;
    border-right: solid 1px #fff;
    color: #fff;
}

#footer .container .text-container .copyright {
    text-align: center;
    font-size: 0.7291666667vw;
    margin-top: 1.6666666667vw;
}

@media screen and (max-width: 600px) {
    .dl-container {
        width: 100%;
        height: 18.4615384615vw;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        padding: 3.8461538462vw;
        gap: 2.5641025641vw;
        z-index: 1;
        margin-top: 30.7692307692vw;
    }
    .dl-container::before {
        content: "";
        position: absolute;
        width: 100%;
        z-index: -1;
        bottom: 0;
    }
    .dl-container .badge {
        width: 28.2051282051vw;
        max-height: 18.4615384615vw;
    }
    .dl-container .dl-head {
        width: 25.641025641vw;
    }
    .dl-container .badge.windows {
        display: none;
    }
    #footer {
        width: 100%;
        background: #000;
        position: relative;
        padding: 14.358974359vw 0 14.358974359vw;
        color: #fff;
        font-size: 3.0769230769vw;
    }
    #footer .container {
        width: 92.3076923077vw;
        display: flex;
        flex-direction: column;
        margin: 0 auto;
        gap: 2%;
    }
    #footer .container .logo-container {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 8.2051282051vw;
    }
    #footer .container .logo-container .logo.yostar {
        width: 47.6923076923vw;
    }
    #footer .container .logo-container .logo.yostar img {
        display: block;
        width: 100%;
    }
    #footer .container .logo-container .logo.maoliang {
        width: 41.0256410256vw;
    }
    #footer .container .logo-container .logo.maoliang img {
        display: block;
        width: 100%;
    }
    #footer .container .text-container {
        width: 100%;
    }
    #footer .container .text-container .links {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 3.5897435897vw 0vw;
        margin-top: 8.2051282051vw;
    }
    #footer .container .text-container .links .link-item {
        padding: 0 1em;
        border-right: solid 1px #fff;
    }
    #footer .container .text-container .links .link-item:last-child {
        border: none;
    }
    #footer .container .text-container .copyright {
        text-align: center;
        font-size: 2.5641025641vw;
        margin-top: 8.2051282051vw;
    }
}


/*----------------------------------------------------------------------
animation setting
----------------------------------------------------------------------*/

.fadein {
    opacity: 0;
    transform: translate(0, 10px);
    transition-duration: 0.6s;
}

.fadein.scrollin {
    opacity: 1;
    transform: translate(0, 0);
}

.is-sp {
    display: none;
}

@media screen and (max-width: 600px) {
    .is-pc {
        display: none;
    }
    .is-sp {
        display: block;
    }
}


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