@charset "UTF-8";

/** ベース
-----------------**/
body {
    font-family: 'Noto Sans JP', Hiragino Kaku Gothic ProN, Helvetica Neue, arial, Hiragino Sans, meiryo, sans-serif;
}
img {
    vertical-align: bottom;
}
a img {
    transition: opacity 0.2s ease-in-out;
}
a:hover img {
    opacity: 0.7;
}
p + p {
    margin-top: 20px;
}
a > img[src$="blank.svg"] {
    display: none;
}

@media only screen and (max-width: 900px) {
    body {
        font-size: max(11px, 1.066vw);
    }
    p + p {
        margin-top: 2.222vw;
    }
}

@media only screen and (max-width: 767px) {
    body {
        font-size: max(10px, 4.266vw);
    }
    p + p {
        margin-top: 5.333vw;
    }
}

/** 共通
-----------------**/
.inner {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 25px;
}
.section {
    color: #fff;
    background: #000 url(/mball/yoasobi-sonet_presentcp/img/bg_hd.png) no-repeat top center / 1500px;
    position: relative;
}
.section + .section::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #000;
    z-index: 9999;
}
.str-back-to-top {
    z-index: 9999;
}

@media only screen and (max-width: 900px) {
    .inner {
        padding: 0 2.777vw;
    }
}

/** モジュール
-----------------**/
/* 注釈リスト */
.mod-note li {
    position: relative;
    padding-left: 1em;
    font-size: 1.4rem;
}
.mod-note li::before {
    content: "※";
    position: absolute;
    left: 0;
}

@media only screen and (max-width: 900px) {
    .mod-note li {
        font-size: max(11px, 1.555vw);
    }
}

@media only screen and (max-width: 767px) {
    .mod-note li {
        font-size: max(10px, 3.2vw);
    }
}

/** 複数エリアで使用
-----------------**/
/* ツアー日程 */
.wave-header {
    display: flex;
    width: 100%;
}
.wave-title {
    background-color: #e52a89;
    color: #fff;
    font-size: 1.6rem;
    font-weight: bold;
    padding: 3px 21px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}
.wave-period {
    background-color: #fef4f9;
    color: #e52a89;
    font-size: 1.8rem;
    font-weight: bold;
    padding: 2px 22px 2px 15px;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.wave .box {
    border-bottom: 1px solid #d6d6d6;
    padding: 12px 0;
    display: flex;
    align-items: center;
}
.wave .prefecture-col {
    width: 95px;
    flex-shrink: 0;
}
.wave .venue-col {
    flex: 1 1 auto;
    margin-right: 10px;
}
.wave .dates-col {
    width: 95px;
    flex-shrink: 0;
}
.wave .capacity-col {
    width: 70px;
    flex-shrink: 0;
}
.wave .prefecture {
    font-size: 1.8rem;
    font-weight: bold;
}
.wave .venue {
    font-size: 1.6rem;
    margin-top: 3px;
}
.wave .dates {
    margin-top: 3px;
}
.wave .date-line {
    margin-top: 3px;
}
.wave .day {
    font-size: 1.6rem;
}
.wave .week {
    font-size: 1.4rem;
}
.wave .capacity {
    margin-top: 3px;
}
.wave .capacity-line {
    margin-top: 3px;
}
.wave .num {
    font-size: 1.6rem;
}
.wave .unit {
    font-size: 1.4rem;
}
.wave2 {
    margin-top: 41px;
}
.wave2 .wave-header + .box {
    padding-top: 24px;
}

@media screen and (max-width: 900px) {
    .wave-title {
        font-size: max(11px, 1.777vw);
        padding: 0.333vw 2.333vw;
    }
    .wave-period {
        font-size: max(11px, 2vw);
        padding: 0.222vw 2.444vw 0.222vw 1.666vw;
    }
    .wave .box {
        padding: 1.333vw 0;
    }
    .wave .prefecture-col {
        width: 10.555vw;
    }
    .wave .venue-col {
        margin-right: 1.111vw;
    }
    .wave .dates-col {
        width: 10.555vw;
    }
    .wave .capacity-col {
        width: 7.777vw;
    }
    .wave .prefecture {
        font-size: max(11px, 2vw);
    }
    .wave .venue {
        font-size: max(11px, 1.777vw);
        margin-top: 0.333vw;
    }
    .wave .dates {
        margin-top: 0.333vw;
    }
    .wave .date-line {
        margin-top: 0.333vw;
    }
    .wave .day {
        font-size: max(11px, 1.777vw);
    }
    .wave .week {
        font-size: max(11px, 1.555vw);
    }
    .wave .capacity {
        margin-top: 0.333vw;
    }
    .wave .capacity-line {
        margin-top: 0.333vw;
    }
    .wave .num {
        font-size: max(11px, 1.777vw);
    }
    .wave .unit {
        font-size: max(11px, 1.555vw);
    }
    .wave2 {
        margin-top: 4.555vw;
    }
    .wave2 .wave-header + .box {
        padding-top: 2.666vw;
    }
}

@media screen and (max-width: 767px) {
    .wave-header {
        margin-bottom: 1.333vw;
    }
    .wave-title {
        padding: 8vw 3.2vw;
    }
    .wave-period {
        padding: 0 2.666vw;
    }
    .wave .dates,
    .wave .capacity {
        margin-top: 1px;
    }
    .wave .date-line,
    .wave .capacity-line {
        margin-top: 1px;
    }
    .wave .box {
        display: grid;
        grid-template-columns: auto 24vw 1fr;
        grid-template-rows: auto auto;
        grid-template-areas: 
         "prefecture venue venue"
         "prefecture dates capacity";
         gap: 0;
         align-items: center;
         padding: 3.2vw 0;
    }
    .wave .prefecture-col {
        grid-area: prefecture;
        width: 25.866vw;
        text-align: left;
    }
    .wave .venue-col {
        grid-area: venue;
        width: auto;
        margin-bottom: 1.333vw;
    }
    .wave .dates-col {
        grid-area: dates;
        width: auto;
    }
    .wave .capacity-col {
        grid-area: capacity;
        width: auto;
    }
    .wave-title {
        font-size: max(10px, 4.266vw);
    }
    .wave-period {
        font-size: max(10px, 4.8vw);
    }
    .wave .prefecture {
        font-size: max(10px, 4.8vw);
    }
    .wave .venue {
        font-size: max(10px, 4.266vw);
    }
    .wave .day {
        font-size: max(10px, 4.266vw);
    }
    .wave .week {
        font-size: max(10px, 3.733vw);
    }
    .wave .num {
        font-size: max(10px, 4.266vw);
    }
    .wave .unit {
        font-size: max(10px, 3.733vw);
    }
    
    .wave2 {
        margin-top: 10.666vw;
    }
}

/** kvエリア
-----------------**/
.kv {
    position: relative;
    width: 100%;
}
@media only screen and (max-width: 1500px) {
    .kv {
        padding-bottom: 47.7%;
        height: 0;
        max-height: 716px;
    }
}
@media only screen and (min-width: 1501px) {
    .kv {
        height: 716px;
    }
}
.kv_bg {
    display: flex;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.kv_bg_left {
    flex: 1;
    background: url(/mball/yoasobi-sonet_presentcp/img/img_kv_bg.png);
    background-size: cover;
}
.kv_bg_right {
    flex: 1;
    background: #000;
}
.kv_content {
    position: absolute;
    top: 50%;
    left: calc(50% - 15px);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    max-width: 1500px;
}
.kv_content img {
    height: 100%;
}
@media only screen and (max-width: 767px) {
    .kv {
        height: auto;
        max-height: none;
        padding-bottom: 0;
    }
    .kv_bg {
        display: none;
    }
    .kv_content {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
    }
    .kv_content img {
        height: auto;
        width: 100%;
    }
}

/** リードエリア
-----------------**/
section#lead {
    padding: 75px 0 80px;
    background: #E8E7E7;
}
#lead .container {
display: grid;
width: 100%;
max-width: 975px;
margin: 0 auto;
}
.image-list {
display: grid;
grid-template-columns: 1fr 1fr; /* A~D を左、E を右 */
gap: 15px 38px;
justify-self: center;
}
.image-list > li {
    justify-self: center;
}
.image-list .img-a,
.image-list .img-b,
.image-list .img-c,
.image-list.img-d {
grid-column: 1; /* A, B, C, D を左カラムに配置 */
}
.image-list .img-e {
grid-column: 2; /* E を右カラムに配置 */
grid-row: 1 / span 5; /* 右側で縦に広がる */
justify-self: start;
width: 500.5px;
}
.image-list .img-a {
    width: 438.5px;
}
.image-list .img-b {
    text-align: left;
    font-size: 2.1rem;
    font-weight: bold;
}
.image-list .img-b.txt-apply{
    color: #e52a89;
}
.image-list .img-c {
    width: 382.5px;
    margin-bottom: 27px;
}
.image-list .img-d {
    width: 429.5px;
}
.image-list img {
max-width: 100%;
}

@media screen and (max-width: 1027px) {
    section#lead {
        padding: 7.3vw 0 7.79vw;
    }
    .image-list {
    gap: 1.46vw 3.7vw;
    }
    .image-list .img-e {
    width: 48.73vw;
    }
    .image-list .img-a {
        width: 42.7vw;
    }
    .image-list .img-b {
        font-size: max(11px, 2.04vw);
    }
    .image-list .img-c {
        width: 37.24vw;
        margin-bottom: 2.63vw;
    }
    .image-list .img-d {
        width: 41.82vw;
    }
}
@media screen and (max-width: 767px) {
section#lead {
    padding: 11.466vw 6.666vw 15.2vw;
}
.container {
display: flex;
flex-direction: column;
}
.image-list {
display: flex;
flex-direction: column;
text-align: center;
gap: 5.333vw;
}
.image-list .img-a { order: 1; width: 87.733vw;}
.image-list .img-e { order: 2; width: 87.066vw; text-align: center;}
.image-list .img-b { order: 3; font-size: max(10px, 4.266vw);}
.image-list .img-c { order: 4; width: 81.6vw; margin-bottom: 8vw;}
.image-list .img-d { order: 5; width: 87.2vw;}
.image-list img {
width: 100%;
}
}

/** モーダル調整 **/
.mod-dialog {
    background: #E8E7E7;
    max-inline-size: 800px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    max-width: 800px;
    max-height: 80vh !important;
    display: flex !important;
    flex-direction: column !important;
}
.mod-dialog.is-open {
    overflow: visible;
}
.mod-dialog__inner {
    padding: 30px 65px 42px;
    flex-grow: 1 !important;
    overflow-y: auto !important;
}
.mod-dialog__button {
    position: fixed;
    top: -71px;
    right: 6px;
    background: none;
    block-size: 56px;
    inline-size: 56px;
}
.mod-dialog__button::after,
.mod-dialog__button::before {
    block-size: 2px;
    inline-size: 77.5px;
    background: #E8E7E7;
}
.mod-dialog h2 {
    text-align: center;
    margin: 0 auto -20px;
    margin-bottom: 24px;
    width: 382.5px;
}
.mod-dialog h3 {
    font-weight: bold;
}
.mod-dialog dl + h3 {
    margin-top: 20px;
}
.dialog__contents_schedule {
    text-align: left;
    line-height: 1.5;
    margin-top: 20px;
}
.dialog__contents_schedule > dl {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
}
.dialog__contents_schedule > dl > dd{
    font-size: 1.4rem;
}
.dialog__contents_schedule dl + h3 {
    margin-top: 20px;
}

@media screen and (max-width: 900px) {
    .mod-dialog__inner {
        padding: 3.333vw 7.222vw 4.666vw;
    }
    .mod-dialog__button {
        top: -7.888vw;
        right: 0.666vw;
        block-size: 6.222vw;
        inline-size: 6.222vw;
    }
    .mod-dialog__button::after,
    .mod-dialog__button::before {
        block-size: max(1px, 0.222vw);
        inline-size: 8.611vw;
    }
    .mod-dialog h2 {
        margin: 0 auto -2.222vw;
        margin-bottom: 2.666vw;
        width: 42.5vw;
    }
    .mod-dialog dl + h3 {
        margin-top: 2.222vw;
    }
    .dialog__contents_schedule {
        margin-top: 2.222vw;
    }
}

@media screen and (max-width: 767px) {
    .mod-dialog {
        width: 93.6vw;
    }
    .mod-dialog__inner {
        padding: 6.666vw 3.2vw 9.6vw;
    }
    .mod-dialog__button {
        top: -55px;
        right: 6px;
        block-size: 45.5px;
        inline-size: 45.5px;
    }
    .mod-dialog__button::after,
    .mod-dialog__button::before {
        block-size: 2px;
        inline-size: 62.5px;
    }
    .mod-dialog h2 {
        margin-bottom: 5.333vw;
        width: 81.6vw;
    }
    .mod-dialog h3 {
        font-size: max(10px, 3.466vw);
        margin-bottom: 12px;
    }
    .mod-dialog dl + h3 {
        margin-top: 5.333vw;
    }
    .dialog__contents_schedule {
        font-size: max(10px, 3.466vw);
        margin-top: 5.333vw;
    }
    .dialog__contents_schedule > dl {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .dialog__contents_schedule > dl > dd:not(:last-child) {
        margin-bottom: 10px;
    }
    .dialog__contents_schedule > dl > dt {
        font-size: 1.2rem;
    }
    .dialog__contents_schedule > dl > dd {
        font-size: 1rem;
    }
}

/** 概要エリア
-----------------**/
section#overview {
    padding: 90px 0;
}
.overview_hd {
    width: 690.5px;
    margin: 0 auto 22px;
}
.overview_period {
    width: 756.5px;
    margin: 0 auto 24px;
}
.overview_catch {
    width: 713.5px;
    margin: 0 auto 58px;
}
.overview_catch_note {
    margin-top: 30.5px;
}
.overview_catch_note .mod-note li {
    text-decoration: underline;
}
.overview_target {
    margin-bottom: 80px;
}
.overview_target_hd {
    color: #ececec;
    font-size: 2.4rem;
    font-weight: bold;
    padding-bottom: 3px;
    border-bottom: 2px solid #ececec;
    margin-bottom: 23px;
    text-align: center;
}
.overview_target_desc {
    font-size: 2rem;
}
.overview_service {
    background: #fff;
}
.overview_service_hd {
    color: #000;
    font-size: 2.1rem;
    font-weight: bold;
    text-align: center;
    padding: 4.75px 10px 1.75px;
    border-bottom: 2px solid #787878;
}
.overview_service_lead {
    width: 547px;
    margin: 35px auto 0;
}
.overview_service_panel {
    padding: 44px 28px 40px;
}
.overview_service_panel > ul {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.overview_service_panel > ul > li.overview_rcmd {
    position: relative;
}
.overview_service_panel > ul > li.overview_rcmd::before {
    content: '';
    display: inline-block;
    width: 73px;
    height: 72.5px;
    background-image: url(/mball/yoasobi-sonet_presentcp/img/img_overview_rcmd.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: -17px;
    left: -9px;
    opacity: 1;
    z-index: 999;
}
.overview_service_panel > ul > li + li {
    margin-left: 35px;
}
.overview_service_panel > ul > li > a {
    display: block;
    border-radius: 23px;
    box-shadow: 4.82px 4.82px 5.41px rgba(0, 0, 0, 0.15);
    transition: box-shadow 0.2s ease-in-out;
}
.overview_service_panel > ul > li > a:hover {
    box-shadow: none;
}

@media screen and (max-width: 900px) {
    section#overview {
        padding: 10vw 0;
        
    }
    .overview_hd {
        width: 76.722vw;
        margin-bottom: 2.444vw;
    }
    .overview_period {
        width: 84.055vw;
        margin-bottom: 2.666vw;
    }
    .overview_catch {
        width: 79.277vw;
        margin-bottom: 6.444vw;
    }
    .overview_catch_note {
        margin-top: 3.388vw;
    }
    .overview_target {
        margin-bottom: 8.888vw;
    }
    .overview_target_hd {
        font-size: max(11px, 2.666vw);
        padding-bottom: 0.333vw;
        border-bottom: max(1px, 0.222vw) solid #ececec;
        margin-bottom: 2.555vw;
    }
    .overview_target_desc {
        font-size: max(11px, 2.222vw);
    }
    .overview_service_hd {
        font-size: max(11px, 2.333vw);
        padding: 0.527vw 1.111vw 0.194vw;
        border-bottom: max(1px, 0.222vw) solid #787878;
    }
    .overview_service_lead {
        width: 60.777vw;
        margin: 3.888vw auto 0;
    }
    .overview_service_panel {
        padding: 2.666vw 3.111vw 4.444vw;
    }
    .overview_service_panel > ul > li.overview_rcmd::before {
        width: 8.111vw;
        height: 8.055vw;
        top: -1.888vw;
        left: -1vw;
    }
    .overview_service_panel > ul > li + li {
        margin-left: 3.888vw;
    }
    .overview_service_panel > ul > li > a {
        border-radius: 2.555vw;
        box-shadow: 0.535vw 0.535vw 0.601vw rgba(0, 0, 0, 0.15);
    }
}

@media screen and (max-width: 767px) {
    section#overview {
        padding: 13.333vw 0;
    }
    section#overview > .inner {
        padding: 0 4vw;
    }
    .overview_hd {
        width: 84.933vw;
        margin: 0 auto 6.266vw;
    }
    .overview_period {
        width: 90.133vw;
        margin: 0 auto 8vw;
    }
    .overview_catch {
        width: 76.266vw;
        margin: 0 auto 12vw;
    }
    .overview_catch_note {
        margin-top: 4.533vw;
        font-size: max(10px, 3.2vw);
    }
    .overview_target {
        margin-bottom: 9.6vw;
    }
    .overview_target_hd {
        color: #ebebeb;
        font-size: max(10px, 4.8vw);
        padding-bottom: 0.4vw;
        border-bottom: max(1px, 0.533vw) solid #ebebeb;
        margin-bottom: 3.466vw;
    }
    .overview_target_desc {
        font-size: max(10px, 4.266vw);
    }
    .overview_service_hd {
        font-size: max(10px, 5.333vw);
        padding: 1.333vw 2.666vw 0.8vw;
        border-bottom: max(1px, 0.533vw) solid #787878;
    }
    .overview_service_lead {
        width: 87.466vw;
        margin: 8vw auto 0;
    }
    .overview_service_panel {
        padding: 9.333vw 4vw 8vw;
    }
    .overview_service_panel > ul {
        flex-direction: column;
    }
    .overview_service_panel > ul > li.overview_rcmd::before {
        width: 16.133vw;
        height: 16.133vw;
        background-image: url(/mball/yoasobi-sonet_presentcp/img/img_overview_rcmd_sp.png);
        top: -3.733vw;
        left: -1.866vw;
    }
    .overview_service_panel > ul > li + li {
        margin-left: 0;
        margin-top: 7.466vw;
    }
    .overview_service_panel > ul > li > a {
        border-radius: 23px;
        box-shadow: 4.82px 4.82px 5.41px rgba(0, 0, 0, 0.15);
    }
}

/** 応募フローエリア
-----------------**/
section#flow.section {
    color: #000;
    padding: 90px 0 0;
}
.step_content_inner {
    padding: 0 35px;
}
.flow_hd {
    width: 850.5px;
    margin: 0 auto 69px;
}
.flow_lead {
    color: #e52a89;
    font-size: 2rem;
    font-weight: bold;
    margin: 0 auto 45px;
    padding: 0 25px;
}
section#flow .overview_service {
    border: 1px solid #787878;
    margin-bottom: 17.75px;
}
section#flow .overview_service_hd {
    color: #505050;
    font-size: 3rem;
    font-weight: bold;
    font-style: italic;
    padding: 4.5px 10px;
    text-align: center;
    border-bottom: 1px solid #787878;
}
section#flow .overview_service_panel {
    padding: 15.5px 26px 26px;
}
section#flow .overview_service_panel ul {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
section#flow .overview_service_panel_hd h4 {
    color: #E52A89;
    font-size: 2.2rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: 15.5px;
    text-align: center;
}
.overview_service_panel_lead {
    width: 333px;
    margin: 27px auto 20px;
}
section#flow .overview_service_panel > ul > li + li {
    margin-left: 32px;
}
section#flow .overview_service_panel_note {
    font-size: 1.7rem;
    margin-bottom: 34.5px;
}
.flow_apply_hd {
    color: #E52A89;
    font-size: 2.2rem;
    font-weight: bold;
    margin-bottom: 14.5px;
    text-align: center;
    border-top: 1px solid #787878;
    padding-top: 30px;
    margin-top: 40px;
}
.flow_apply_btn {
    text-align: center;
}
.step_content_inner p.flow_apply_btn > a {
    color: #fff;
    background: #E52A89;
    display: inline-block;
    font-size: 2.34rem;
    font-weight: bold;
    padding: 14.15px 52px 14.15px 56px;
    position: relative;
    margin: 0 auto;
    border-radius: 50px;
    text-decoration: none;
    transition: opacity 0.2s;
}
.flow_apply_btn > a:hover {
    opacity: 0.7;
}
.flow_apply_btn > a::after {
    content: '';
    display: inline-block;
    width: 13.5px;
    height: 13.5px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(-45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 25px;
}
.flow_apply_cont + .flow_apply_hd {
    margin-top: 30.5px;
}
.flow_apply_note {
    color: #E52A89;
    font-size: 1.4rem;
    font-weight: bold;
    margin-bottom: 16.5px;
    text-align: center;
}
.flow_apply_tel {
    margin-bottom: 38.5px;
    font-size: 1.4rem;
    text-align: center;
}
.flow_apply_tel img {
    width: 382.5px;
}
.flow_apply_tel_note {
    margin-top: 18.5px;
}
section#flow .mod-accordion__trigger {
    color: #000;
    background-color: #D6D6D6;
    padding: 5.5px 44px 5.5px 20px;
    font-size: 1.8rem;
    border-radius: 0;
    justify-content: center;
    transition: opacity 0.2s;
    cursor: pointer;
}
section#flow .mod-accordion__trigger:hover {
    opacity: 0.7;
}
section#flow .mod-accordion__trigger::after,
section#flow .mod-accordion__trigger::before {
    background-color: #000;
}
section#flow .mod-accordion__content {
    font-size: 1.4rem;
    border: 1px solid #D6D6D6;
    border-top: none;
}
section#flow .mod-accordion__content-inner {
    padding: 15.5px 20px 20.5px;
}
section#flow .mod-accordion__content ul > li + li {
    margin-top: 5px;
}
.step_content_ttl h3 {
    color: #505050;
    font-size: 3rem;
    font-weight: bold;
    font-style: italic;
    margin: 27px 0 19.5px;
    text-align: center;
}
.step_content_inner p {
    font-size: 1.7rem;
}
.step_content_inner p + p {
    margin-top: 20px;
}
.step_content_inner p > a {
    color: #0066bc;
    font-size: 1.5rem;
    text-decoration: underline;
    transition: opacity 0.2s;
}
.step_content_inner p > a:hover {
    opacity: 0.7;
}
.step_content_inner p b {
    font-weight: bold;
}
.step_content_note {
    margin: 20px 0;
}
.step_content_note > ul > li {
    font-size: 1.3rem;
    padding-left: 1em;
    text-indent: -1em;
}
.step_content_inner > *:last-child {
    margin-bottom: 0;
}

@media screen and (max-width: 900px) {
    section#flow {
        padding: 10vw 0 0;
    }
    .flow_hd {
        width: 94.5vw;
        margin: 0 auto 7.666vw;
    }
    .flow_lead {
        font-size: max(11px, 2.222vw);
        margin: 0 auto 5vw;
        padding: 0 2.777vw;
    }
    section#flow.section {
        padding: 10vw 0 0;
    }
    .step_content_inner {
        padding: 0 3.888vw;
    }
    section#flow .overview_service {
        margin-bottom: 1.972vw;
    }
    section#flow .overview_service_hd {
        font-size: max(11px, 3.333vw);
        padding: 0.5vw 1.111vw;
    }
    section#flow .overview_service_panel {
        padding: 1.722vw 2.888vw 2.888vw;
    }
    section#flow .overview_service_panel_hd h4 {
        font-size: max(11px, 2.444vw);
        margin-bottom: 1.722vw;
    }
    .overview_service_panel_lead {
        width: 37vw;
        margin: 3vw auto 2.222vw;
    }
    section#flow .overview_service_panel > ul > li + li {
        margin-left: 3.555vw;
    }
    section#flow .overview_service_panel_note {
        font-size: max(11px, 1.888vw);
        margin-bottom: 3.833vw;
    }
    .flow_apply_hd {
        font-size: max(11px, 2.444vw);
        margin-bottom: 1.611vw;
        padding-top: 3.333vw;
        margin-top: 4.444vw;
    }
    .step_content_inner p.flow_apply_btn > a {
        font-size: max(11px, 2.6vw);
        padding: 1.572vw 5.777vw 1.572vw 6.222vw;
        border-radius: 5.555vw;
    }
    .flow_apply_btn > a::after {
        width: 1.5vw;
        height: 1.5vw;
        border-right: max(1px, 0.222vw) solid #fff;
        border-bottom: max(1px, 0.222vw) solid #fff;
        right: 2.777vw;
    }
    .flow_apply_cont + .flow_apply_hd {
        margin-top: 3.388vw;
    }
    .flow_apply_note {
        font-size: max(11px, 1.555vw);
        margin-bottom: 1.833vw;
    }
    .flow_apply_tel {
        margin-bottom: 4.277vw;
        font-size: max(11px, 1.555vw);
    }
    .flow_apply_tel img {
        width: 42.5vw;
    }
    .flow_apply_tel_note {
        margin-top: 2.055vw;
    }
    section#flow .mod-accordion__trigger {
        padding: 0.611vw 4.888vw 0.611vw 2.222vw;
        font-size: max(11px, 2vw);
    }
    section#flow .mod-accordion__content {
        font-size: max(11px, 1.555vw);
    }
    section#flow .mod-accordion__content-inner {
        padding: 1.722vw 2.222vw 2.277vw;
    }
    section#flow .mod-accordion__content ul > li + li {
        margin-top: 0.555vw;
    }
    .step_content_ttl h3 {
        font-size: max(11px, 3.333vw);
        margin: 3vw 0 2.166vw;
    }
    .step_content_inner p {
        font-size: max(11px, 1.888vw);
    }
    .step_content_inner p + p {
        margin-top: 2.222vw;
    }
    .step_content_inner p > a {
        font-size: max(11px, 1.666vw);
    }
    .step_content_note {
        margin: 2.222vw 0;
    }
    .step_content_note > ul > li {
        font-size: max(11px, 1.444vw);
        padding-left: 1em;
        text-indent: -1em;
    }
}

@media screen and (max-width: 767px) {
    section#flow {
        padding: 13.333vw 0 0;
    }
    .flow_hd {
        width: 77.466vw;
        margin: 0 auto 8.799vw;
    }
    .flow_lead {
        font-size: max(10px, 4.266vw);
        padding: 0 3.2vw;
        margin-bottom: 5.866vw;
    }
    section#flow.section {
        padding: 12vw 0 0;
    }
    section#flow .overview_service {
        margin-bottom: 7.266vw;
    }
    section#flow .overview_service_hd {
        font-size: max(10px, 5.866vw);
        padding: 2.613vw 2.666vw;
        line-height: 1.2;
    }
    section#flow .overview_service_panel {
        padding: 2.266vw 3.2vw 6.4vw;
    }
    section#flow .overview_service_panel_hd h4 {
        font-size: max(10px, 4.8vw);
        margin-bottom: 3.0666vw;
    }
    .overview_service_panel_lead {
        width: 74.666vw;
        margin: 5.333vw auto 8vw;
    }
    section#flow .overview_service_panel > ul > li + li {
        margin-left: 0;
        margin-top: 6.4vw;
    }
    section#flow .overview_service_panel_note {
        font-size: max(10px, 4vw);
        margin-bottom: 6.733vw;
    }
    .flow_apply_hd {
        font-size: max(10px, 4.8vw);
        margin-bottom: 3.599vw;
        padding-top: 8vw;
        margin-top: 10.666vw;
    }
    .step_content_inner {
        padding: 0;
    }
    .step_content_inner p.flow_apply_btn > a {
        font-size: max(10px, 4.981vw);
        padding: 2.853vw 10.666vw;
        border-radius: 13.333vw;
    }
    .flow_apply_btn > a::after {
        width: 2.8477vw;
        height: 2.8477vw;
        border-right: max(1px, 0.8vw) solid #fff;
        border-bottom: max(1px, 0.8vw) solid #fff;
        right: 5.6vw;
    }
    .flow_apply_cont + .flow_apply_hd {
        margin-top: 8.4vw;
    }
    .step_content_inner p.flow_apply_note {
        font-size: max(10px, 3.2vw);
        margin-bottom: 7.733vw;
    }
    .flow_apply_tel img {
        width: 85.466vw;
    }
    .step_content_inner p.flow_apply_tel_note {
        font-size: max(10px, 3.466vw);
        margin-bottom: 6.6vw;
    }
    section#flow .mod-accordion__trigger {
        font-size: max(10px, 4vw);
        padding: 1.133vw 2.666vw 0.866vw;
    }
    .mod-accordion__trigger::before {
        block-size: 0.533vw;
        inline-size: 2.133vw;
        inset-inline-end: 3.466vw;
    }
    .mod-accordion__trigger::after {
        block-size: 2.133vw;
        inline-size: 0.533vw;
        inset-inline-end: 4.399vw;
    }
    section#flow .mod-accordion__content {
        font-size: max(10px, 3.466vw);
    }
    section#flow .mod-accordion__content-inner {
        padding: 2.333vw 3.466vw 4.466vw;
    }
    section#flow .mod-accordion__content ul > li + li {
        margin-top: 2.866vw;
    }
    .step_content_ttl h3 {
        font-size: max(10px, 5.866vw);
        margin: -2.133vw 0 2vw;
    }
    .step_content_inner p {
        font-size: max(10px, 4vw);
    }
    .step_content_inner p + p {
        margin-top: 5.333vw;
    }
    .step_content_note {
        margin: 5.333vw 0;
    }
    .step_content_note > ul > li {
        font-size: max(10px, 3.733vw);
    }
    .step_content_inner p > a {
        font-size: max(10px, 3.733vw);
    }
}

/* タブ */
.mod-tab_yoasobi .tabs {
    display: flex;
    justify-content: center;
    align-items: self-end;
    cursor: pointer;
    gap: 25px;
    max-width: 971px;
    margin: 0 auto;
}
.mod-tab_yoasobi .tab {
    display: inline-block;
}
.mod-tab_yoasobi .tab img {
    width: 448.5px;
    height: auto;
    transition: opacity 0.2s;
}
.mod-tab_yoasobi .tab:hover img {
    opacity: 0.7;
}
.mod-tab_yoasobi .contents {
    margin-top: 4px;
    background: #e8e7e7;
}
.mod-tab_yoasobi .content {
    display: none;
    padding: 50px 0 105px;
    border-right: 4px solid transparent;
    position: relative;
}
.mod-tab_yoasobi .content.active {
    display: block;
}
.mod-tab_yoasobi .content.new-border {
    border-top: 4px solid #E52A89;
}
.mod-tab_yoasobi .content.new-border::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-245px);
    width: 0;
    height: 0;
    border-right: 14px solid transparent;
    border-left: 14px solid transparent;
    border-top: 14px solid #E52A89;
}
.mod-tab_yoasobi .content.existing-border {
    border-top: 4px solid #1E96E6;
}
.mod-tab_yoasobi .content.existing-border::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(222px);
    width: 0;
    height: 0;
    border-right: 14px solid transparent;
    border-left: 14px solid transparent;
    border-top: 14px solid #1E96E6;
}
.mod-tab_yoasobi .content_inner {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 25px;
}

@media screen and (max-width: 921px) {
    .mod-tab_yoasobi .tabs {
        gap: 2.714vw;
        padding: 0 2.714vw;
    }
    .mod-tab_yoasobi .tab img {
        width: 48.697vw;
    }
    .mod-tab_yoasobi .contents {
        margin-top: 0.434vw;
    }
    .mod-tab_yoasobi .content {
        border-right: 0.434vw solid transparent;
    }
    .mod-tab_yoasobi .content.new-border {
        border-top: 0.434vw solid #E52A89;
    }
    .mod-tab_yoasobi .content.new-border::before {
        top: -0.108vw;
        transform: translateX(-26.601vw);
        border-right: 1.52vw solid transparent;
        border-left: 1.52vw solid transparent;
        border-top: 1.52vw solid #E52A89;
    }
    .mod-tab_yoasobi .content.existing-border {
        border-top: 0.434vw solid #1E96E6;
    }
    .mod-tab_yoasobi .content.existing-border::before {
        top: -0.108vw;
        transform: translateX(24.104vw);
        border-right: 1.52vw solid transparent;
        border-left: 1.52vw solid transparent;
        border-top: 1.52vw solid #1E96E6;
    }
}

@media screen and (max-width: 900px) {
    .mod-tab_yoasobi .content {
        padding: 5.555vw 0 11.666vw;
    }
    .mod-tab_yoasobi .content_inner {
        padding: 0 2.777vw;
    }
}

@media screen and (max-width: 767px) {
    .mod-tab_yoasobi.tabs {
        gap: 2.637vw;
        padding: 0 4vw;
    }
    .mod-tab_yoasobi .tab img {
        width: 45.466vw;
    }
    .mod-tab_yoasobi .contents {
        margin-top: 0.5vw;
    }
    .mod-tab_yoasobi .content {
        padding: 8.533vw 0 11.733vw;
    }
    .mod-tab_yoasobi .content.new-border {
        border-top: 0.75vw solid #E52A89;
    }
    .mod-tab_yoasobi .content.existing-border {
        border-top: 0.75vw solid #1E96E6;
    }
    .mod-tab_yoasobi .content.new-border::before {
        border-right: 2.5vw solid transparent;
        border-left: 2.5vw solid transparent;
        border-top: 2.5vw solid #E52A89;
    }
    .mod-tab_yoasobi .content.existing-border::before {
        border-right: 2.5vw solid transparent;
        border-left: 2.5vw solid transparent;
        border-top: 2.5vw solid #1E96E6;
        transform: translateX(21.104vw);
    }
    .mod-tab_yoasobi .content_inner {
        padding: 0 3.2vw;
    }
}

/* ステップボックス */
.mod-step_box_yoasobi .step_inner {
    width: 100%;
    max-width: 850px;
    border: 1px solid #787878;
}
.step_head {
    font-weight: bold;
    font-style: italic;
    text-align: center;
    margin-bottom: 25.5px;
    text-indent: 10px;
}
.step_head h3 {
    font-size: 4.4rem;
    position: relative;
    display: inline-block;
    text-decoration: underline;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}
.step_head h3::before {
    content: '';
    position: absolute;
    left: -98px;
    top: 56%;
    transform: translateY(-50%);
}
#contentA .step_icon_write.step_head h3::before {
    width: 80px;
    height: 75px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_01_pink.png);
    background-size: cover;
}
#contentA .step_icon_push.step_head h3::before {
    width: 78px;
    height: 72px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_02_pink.png);
    background-size: cover;
}
#contentA .step_icon_mail.step_head h3::before {
    width: 82px;
    height: 55px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_03_pink.png);
    background-size: cover;
}
#contentA .step_icon_ticket.step_head h3::before {
    width: 95px;
    height: 70px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_04_pink.png);
    background-size: cover;
    left: -109px;
    top: 46%;
}
#contentB .step_icon_push.step_head h3::before {
    width: 78px;
    height: 72px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_02_blue.png);
    background-size: cover;
}
#contentB .step_icon_mail.step_head h3::before {
    width: 82px;
    height: 55px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_03_blue.png);
    background-size: cover;
}
#contentB .step_icon_ticket.step_head h3::before {
    width: 95px;
    height: 70px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_04_blue.png);
    background-size: cover;
    left: -109px;
    top: 46%;
}
.step_head h3 span {
    font-size: 3.8rem;
}
#contentA .step_head {
    color: #E52A89;
}
#contentB .step_head {
    color: #1E96E6;
}
.step_content {
    background: #fff;
    padding: 118.5px 35px 35.75px;
    position: relative;
}
.step_content:first-child {
    padding-top: 43.5px;
}
.step_content:last-child {
    padding-bottom: 55.75px;
}
#contentA .step_content:nth-child(even) {
    background: #FEF4F9;
}
#contentB .step_content:nth-child(even) {
    background: #EFF8FD;
}
.step_content + .step_content::before {
    content: '';
    background: url(/mball/yoasobi-sonet_presentcp/img/step-box_after.png) no-repeat top center / contain;
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 92px;
}
#contentA .step_content + .step_content:nth-child(odd)::before {
    background: url(/mball/yoasobi-sonet_presentcp/img/step-box_after_pink.png) no-repeat top center / contain;
}
#contentB .step_content + .step_content:nth-child(odd)::before {
    background: url(/mball/yoasobi-sonet_presentcp/img/step-box_after_blue.png) no-repeat top center / contain;
}

@media screen and (max-width: 900px) {
    .step_head {
        margin-bottom: 2.833vw;
        text-indent: 1.111vw;
    }
    .step_head h3 {
        font-size: max(11px, 4.888vw);
        text-decoration-thickness: max(1px, 0.222vw);
        text-underline-offset: max(1px, 0.444vw);
    }
    .step_head h3::before {
        left: -10.888vw;
    }
    #contentA .step_icon_write.step_head h3::before {
        width: 8.888vw;
        height: 8.333vw;
    }
    #contentA .step_icon_push.step_head h3::before {
        width: 8.666vw;
        height: 8vw;
    }
    #contentA .step_icon_mail.step_head h3::before {
        width: 9.111vw;
        height: 6.111vw;
    }
    #contentA .step_icon_ticket.step_head h3::before {
        width: 10.4vw;
        height: 7.777vw;
        left: -12.111vw;
    }
    #contentB .step_icon_push.step_head h3::before {
        width: 8.666vw;
        height: 8vw;
    }
    #contentB .step_icon_mail.step_head h3::before {
        width: 9.111vw;
        height: 6.111vw;
    }
    #contentB .step_icon_ticket.step_head h3::before {
        width: 10.4vw;
        height: 7.777vw;
        left: -12.111vw;
    }
    .step_head h3 span {
        font-size: max(11px, 4.222vw);
    }
    .step_content {
        padding: 13.166vw 3.888vw 3.972vw;
    }
    .step_content:first-child {
        padding-top: 4.833vw;
    }
    .step_content:last-child {
        padding-bottom: 6.194vw;
    }
    .step_content + .step_content::before {
        height: 10.222vw;
    }
}

@media screen and (max-width: 767px) {
    .step_content {
        padding: 16.133vw 3.2vw 7.733vw;
    }
    .step_content:first-child {
        padding-top: 6vw;
    }
    .step_content:last-child {
        padding-bottom: 9.333vw;
    }
    .step_head {
        margin-bottom: 19.2vw;
        text-indent: 0;
    }
    .step_head h3 {
        font-size: max(10px, 9.333vw);
        text-decoration-thickness: max(2px, 0.533vw);
        text-underline-offset: max(2.5px, 0.666vw);
    }
    .step_head h3 span {
        font-size: max(10px, 8vw);
    }
    .step_head h3::before {
        left: 50%;
        transform: translateX(-50%);
        top: auto;
        bottom: -15.2vw;
    }
    #contentA .step_icon_write.step_head h3::before {
        width: 13.333vw;
        height: 12.533vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_01_pink_sp.png);
        background-size: cover;
    }
    #contentA .step_icon_push.step_head h3::before {
        width: 12.933vw;
        height: 11.733vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_02_pink_sp.png);
        background-size: cover;
    }
    #contentA .step_icon_mail.step_head h3::before {
        width: 13.6vw;
        height: 9.066vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_03_pink_sp.png);
        background-size: cover;
        bottom: -13.5vw;
    }
    #contentA .step_icon_ticket.step_head h3::before {
        width: 15.733vw;
        height: 11.466vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_04_pink_sp.png);
        background-size: cover;
        left: 50%;
        top: auto;
    }
    #contentB .step_icon_push.step_head h3::before {
        width: 12.933vw;
        height: 11.733vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_02_blue_sp.png);
        background-size: cover;
    }
    #contentB .step_icon_mail.step_head h3::before {
        width: 13.6vw;
        height: 9.066vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_03_blue_sp.png);
        background-size: cover;
        bottom: -13.5vw;
    }
    #contentB .step_icon_ticket.step_head h3::before {
        width: 15.733vw;
        height: 11.466vw;
        background: url(/mball/yoasobi-sonet_presentcp/img/icon-step_04_blue_sp.png);
        background-size: cover;
        left: 50%;
        top: auto;
    }
}

/** 応募規約エリア
-----------------**/
section#terms.section {
    padding: 90px 0;
}
.section + .section#terms::before {
    content: none;
}
.terms_hd {
    width: 850.5px;
    margin: 0 auto 50px;
}
section#terms .mod-accordion {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 25px;
}
section#terms .mod-accordion__trigger {
    font-size: 2.4rem;
    font-weight: bold;
    background-color: #505050;
    padding: 6px 10px 10px;
    text-align: center;
    justify-content: center;
    border-radius: 0;
    transition: filter 0.2s ease-in-out;
}
section#terms .mod-accordion__trigger:hover {
    filter: brightness(0.8);
}
section#terms .mod-accordion__trigger::after,
section#terms .mod-accordion__trigger::before {
    background-color: #fff;
}
section#terms .mod-accordion__trigger::before {
    block-size: 2px;
    inline-size: 14px;
    inset-inline-end: 20px;
}
section#terms .mod-accordion__trigger::after {
    block-size: 14px;
    inline-size: 2px;
    inset-inline-end: 26px;
}
section#terms .mod-accordion.is-opened > .mod-accordion__trigger::after {
    block-size: 2px;
}
section#terms .mod-accordion__content-inner {
    padding: 0;
}
section#terms .mod-accordion__content-inner :is(h2, h3, h4, h5, h6):first-child,
section#terms .mod-accordion__content-inner [class^=mod-accordion__heading-lv]:first-child {
    margin-block-start: 0 !important;
}
.terms_content {
    color: #000;
    background: #fff;
    padding: 20px 20px 23px;
    line-height: 1.75;
}
.terms_content_hd3 > h3 {
    font-size: 2rem;
    background: #E7E6E6;
    padding: 3px 10px 5px;
    text-align: center;
}
.terms_content_hd4 > h4 {
    font-size: 2rem;
    font-weight: bold;
    margin: 0 0 11px -3px;
}
.terms_content_lead {
    font-size: 1.6rem;
    padding: 12px 20px 35px;
    border-bottom: 1px solid rgba(0, 0, 0, .5);
}
.terms_content_item {
    padding: 30px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, .5);
}
.terms_content_block.type-column .terms_content_item:last-child {
    border-bottom: none;
}
.terms_content_item > dl {
    display: flex;
    gap: 38px;
}
.terms_content_item > dl > dt {
    flex: 0 0 82px;
    font-size: 2rem;
    font-weight: bold;
}
.terms_content_item > dl > dd {
    flex: 1;
    font-size: 1.6rem;
}
.terms_content_item p + p {
    margin-top: 10px;
}
.terms_content_item a {
    color: #0066BC;
    transition: opacity 0.2s;
}
.terms_content_item a:hover {
    opacity: 0.7;
}
.terms_content_block + .terms_content_block {
    margin-top: 32px;
}
.terms_content_block.type-column .terms_content_item {
    padding: 27px;
}
.terms_content_item_hd {
    margin-bottom: 20px;
}
.terms_content_item .dialog__contents_schedule {
    margin-bottom: 20px;
}
.terms_content_item .dialog__contents_schedule h3 {
    margin-top: 20px;
}
.terms_content_item_paragraph + .terms_content_item_paragraph {
    margin-top: 30px;
}
.terms_content_item_paragraph + .terms_content_item_paragraph > .terms_content_item_hd {
    margin-bottom: 10px;
}
.terms_content_item ol {
    margin: 15px 0;
    padding-left: 15px;
}
.terms_content_item ol > li + li {
    margin-top: 15px;
}
.terms_apply {
    width: 100%;
    max-width: 650px;
    margin: 36px auto 0;
    padding: 0 25px;
}
.terms_apply_btn > a + a {
    margin-top: 36px;
}
.get_apply_btn > p {
    font-size: 1.8rem;
    margin: 37.5px 0 22.5px;
    text-align: center;
}

@media screen and (max-width: 900px) {
    section#terms.section {
        padding: 10vw 0;
    }
    .terms_hd {
        width: 94.5vw;
        margin: 0 auto 5.555vw;
    }
    section#terms .mod-accordion {
        padding: 0 2.777vw;
    }
    section#terms .mod-accordion__trigger {
        font-size: max(11px, 2.666vw);
        padding: 0.666vw 1.111vw 1.111vw;
    }
    section#terms .mod-accordion__trigger::before {
        block-size: max(1px, 0.222vw);
        inline-size: 1.555vw;
        inset-inline-end: 2.222vw;
    }
    section#terms .mod-accordion__trigger::after {
        block-size: 1.555vw;
        inline-size: max(1px, 0.222vw);
        inset-inline-end: 2.888vw;
    }
    section#terms .mod-accordion.is-opened > .mod-accordion__trigger::after {
        block-size: max(1px, 0.222vw);
    }
    .terms_content {
        padding: 2.222vw 2.222vw 2.555vw;
    }
    .terms_content_hd3 > h3 {
        font-size: max(11px, 2.222vw);
        padding: 0.333vw 1.111vw 0.555vw;
    }
    .terms_content_hd4 > h4 {
        font-size: max(11px, 2.222vw);
        margin: 0 0 1.222vw -0.333vw;
    }
    .terms_content_lead {
        font-size: max(11px, 1.777vw);
        padding: 1.333vw 2.222vw 3.888vw;
    }
    .terms_content_item {
        font-size: max(11px, 1.777vw);
        padding: 3.333vw 2.222vw;
    }
    .terms_content_item > dl {
        gap: 4.222vw;
    }
    .terms_content_item > dl > dt {
        flex: 0 0 9.111vw;
        font-size: max(11px, 2.222vw);
    }
    .terms_content_item > dl > dd {
        font-size: max(11px, 1.777vw);
    }
    .terms_content_item p + p {
        margin-top: 1.111vw;
    }
    .terms_content_block + .terms_content_block {
        margin-top: 3.555vw;
    }
    .terms_content_block.type-column .terms_content_item {
        padding: 3vw;
    }
    .terms_content_item_hd {
        margin-bottom: 2.222vw;
    }
    .terms_content_item .dialog__contents_schedule {
        margin-bottom: 2.222vw;
    }
    .terms_content_item .dialog__contents_schedule h3 {
        margin-top: 2.222vw;
    }
    .terms_content_item_paragraph + .terms_content_item_paragraph {
        margin-top: 3.333vw;
    }
    .terms_content_item_paragraph + .terms_content_item_paragraph > .terms_content_item_hd {
        margin-bottom: 1.111vw;
    }
    .terms_content_item ol {
        margin: 1.666vw 0;
        padding-left: 1.666vw;
    }
    .terms_content_item ol > li + li {
        margin-top: 1.666vw;
    }
    .terms_apply {
        margin: 4vw auto 0;
        padding: 0 2.777vw;
    }
    .terms_apply_btn > a + a {
        margin-top: 4vw;
    }
    .get_apply_btn > p {
        font-size: max(1.1rem, 2vw);
        margin: 4.166vw 0 2.5vw;
    }
}

@media screen and (max-width: 767px) {
    section#terms.section {
        padding: 13.333vw 0;
    }
    .terms_hd {
        width: 77.466vw;
        margin: 0 auto 8vw;
    }
    section#terms .mod-accordion {
        padding: 0 3.2vw;
    }
    section#terms .mod-accordion__trigger {
        font-size: max(10px, 4.8vw);
        padding: 1.733vw 2.666vw;
    }
    section#terms .mod-accordion__trigger::before {
        block-size: max(1px, 0.533vw);
        inline-size: 2.666vw;
        inset-inline-end: 4.8vw;
    }
    section#terms .mod-accordion__trigger::after {
        block-size: 2.666vw;
        inline-size: max(1px, 0.533vw);
        inset-inline-end: 5.866vw;
    }
    section#terms .mod-accordion.is-opened > .mod-accordion__trigger::after {
        block-size: max(1px, 0.533vw);
    }
    .terms_content {
        padding: 4vw 3.2vw 4.8vw;
    }
    .terms_content_hd3 > h3 {
        font-size: max(10px, 4.266vw);
        padding: 1.6vw 2.666vw;
    }
    .terms_content_lead {
        font-size: max(10px, 3.733vw);
        padding: 2.666vw 0 5.333vw;
    }
    .terms_content_item {
        font-size: max(10px, 3.733vw);
        padding: 5.333vw 0;
    }
    .terms_content_block.type-column .terms_content_item {
        padding: 5.333vw 0;
    }
    .terms_content_item_hd {
        margin-bottom: 4vw;
    }
    .terms_content_item .dialog__contents_schedule {
        margin-bottom: 5.333vw;
    }
    .terms_content_item .dialog__contents_schedule h3 {
        margin-top: 5.333vw;
    }
    .terms_content_item_paragraph + .terms_content_item_paragraph {
        margin-top: 6.666vw;
    }
    .terms_content_item_paragraph + .terms_content_item_paragraph > .terms_content_item_hd {
        margin-bottom: 2.666vw;
    }
    .terms_content_item ol {
        margin: 4vw 0;
        padding-left: 4vw;
    }
    .terms_content_item ol > li + li {
        margin-top: 4vw;
    }
    .terms_content_item > dl {
        flex-direction: column;
        gap: 2.133vw;
    }
    .terms_content_item > dl > dt {
        flex: initial;
        font-size: max(10px, 4.266vw);
    }
    .terms_content_item > dl > dd {
        flex: initial;
        font-size: max(10px, 3.733vw);
    }
    .terms_content_item p + p {
        margin-top: 2.666vw;
    }
    .terms_content_block + .terms_content_block {
        margin-top: 5.333vw;
    }
    .terms_content_hd4 > h4 {
        font-size: max(10px, 4.266vw);
        margin: 0 0 2.133vw;
    }
    .terms_apply {
        margin: 9.333vw auto 0;
        padding: 0 3.2vw;
    }
    .terms_apply_btn > a + a {
        margin-top: 9.333vw;
    }
    .get_apply_btn > p {
        font-size: max(1rem, 4.8vw);
        margin: 8.133vw 0 5.466vw;
    }
}

/* チェックボックス */
.custom-checkbox {
    appearance: none;
    width: 32px;
    height: 32px;
    background-color: #fff;
    display: inline-block;
    margin-right: 26px;
    position: relative;
    pointer-events: none;
}
.checkbox-label input[type="checkbox"]:checked ~ .custom-checkbox {
    background-color: #fff;
}
.checkbox-label input[type="checkbox"]:checked ~ .custom-checkbox::before {
    content: '';
    position: absolute;
    width: 10px;
    height: 16px;
    border: solid #000;
    border-width: 0 3px 3px 0;
    top: 7px;
    left: 11px;
    transform: rotate(45deg);
    display: block;
}
.checkbox-container {
    margin-bottom: 36px;
}
.checkbox-label {
    display: flex;
    align-items: center;
    background: #505050;
    padding: 16px 0;
    justify-content: center;
    cursor: pointer;
}
.checkbox-label input[type="checkbox"] {
    display: none;
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
}
.checkbox-text {
    font-size: 2.4rem;
    color: white;
}
.submit-button {
    display: block;
    text-align: center;
    pointer-events: none;
}
.submit-button picture {
    display: block;
    max-width: 100%;
}
.submit-button img {
    width: 100%;
}

@media screen and (max-width: 900px) {
    .custom-checkbox {
        width: 3.555vw;
        height: 3.555vw;
        margin-right: 2.888vw;
    }
    .checkbox-label input[type="checkbox"]:checked ~ .custom-checkbox::before {
        width: 1.111vw;
        height: 1.777vw;
        border-width: 0 max(1px, 0.333vw) max(1px, 0.333vw) 0;
        top: 0.777vw;
        left: 1.222vw;
    }
    .checkbox-container {
        margin-bottom: 4vw;
    }
    .checkbox-label {
        padding: 1.777vw 0;
    }
    .checkbox-text {
        font-size: max(11px, 2.666vw);
    }
}

@media screen and (max-width: 767px) {
    .custom-checkbox {
        width: 8.533vw;
        height: 8.533vw;
        margin-right: 4.266vw;
    }
    .checkbox-label input[type="checkbox"]:checked ~ .custom-checkbox::before {
        width: 2.666vw;
        height: 4.266vw;
        border-width: 0 0.8vw 0.8vw 0;
        top: 1.866vw;
        left: 2.933vw;
    }
    .checkbox-container {
        margin-bottom: 9.333vw;
    }
    .checkbox-text {
        font-size: max(10px, 5.333vw);
        padding: 1.866vw;
        line-height: 1.3;
    }
}

/** よくある質問エリア
-----------------**/
section#faq.section {
    padding: 90px 0;
}
.faq_hd {
    width: 850.5px;
    margin: 0 auto 70px;
}
.faq_inner {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 25px;
}
.faq_content {
    color: #000;
    background: #fff;
    padding: 44px 50px 50px;
}
.faq_content_hd3 > h3 {
    color: #fff;
    background: #e52a89;
    font-size: 2rem;
    padding: 5px 10px;
    margin-bottom: 20px;
    text-align: center;
}
.faq_content_block + .faq_content_block {
    margin-top: 30px;
}
.faq_content_block_qa > dl > dt,
.faq_content_block_qa > dl > dd {
    font-size: 1.6rem;
    padding: 16px 0 16px 50px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.5);
    position: relative;
    min-height: 76px;
    display: flex;
    align-items: center;
}
.faq_content_block_qa > dl > dt {
    font-weight: bold;
}
.faq_content_block_qa > dl > dt:first-child {
    border-top: 1px solid rgba(0, 0, 0, 0.5);
}
.faq_content_block_qa > dl > dt::before {
    content: '';
    width: 36px;
    height: 36px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-faq_q.png) no-repeat top left / cover;
    position: absolute;
    top: min(22px, calc(50% - 18px));
    left: 4px;
}
.faq_content_block_qa > dl > dd::before {
    content: '';
    width: 36px;
    height: 36px;
    background: url(/mball/yoasobi-sonet_presentcp/img/icon-faq_a.png) no-repeat top left / cover;
    position: absolute;
    top: min(22px, calc(50% - 18px));
    left: 4px;
}
.faq_content_block_qa a {
    color: #0066BC;
    transition: opacity 0.2s;
}
.faq_content_block_qa a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 900px) {
    section#faq.section {
        padding: 10vw 0;
    }
    .faq_hd {
        width: 94.5vw;
        margin: 0 auto 7.777vw;
    }
    .faq_inner {
        padding: 0 2.777vw;
    }
    .faq_content {
        padding: 4.888vw 5.555vw 5.555vw;
    }
    .faq_content_hd3 > h3 {
        font-size: max(11px, 2.222vw);
        padding: 0.555vw 1.111vw;
        margin-bottom: 2.222vw;
    }
    .faq_content_block + .faq_content_block {
        margin-top: 3.333vw;
    }
    .faq_content_block_qa > dl > dt,
    .faq_content_block_qa > dl > dd {
        font-size: max(11px, 1.777vw);
        padding: 1.777vw 0 1.777vw 5.555vw;
        min-height: 8.444vw;
    }
    .faq_content_block_qa > dl > dt::before {
        width: 4vw;
        height: 4vw;
        top: min(2.444vw, calc(50% - 2vw));
        left: 0.444vw;
    }
    .faq_content_block_qa > dl > dd::before {
        width: 4vw;
        height: 4vw;
        top: min(2.444vw, calc(50% - 2vw));
        left: 0.444vw;
    }
}

@media screen and (max-width: 767px) {
    section#faq.section {
        padding: 12vw 0 13.333vw;
    }
    .faq_hd {
        width: 77.466vw;
        margin: 0 auto 12vw;
    }
    .faq_content {
        padding: 6.133vw 3.2vw 10.666vw;
    }
    .faq_content_hd3 > h3 {
        font-size: max(10px, 4.533vw);
        padding: 1vw 2.666vw;
        margin-bottom: 4.8vw;
    }
    .faq_content_block_qa > dl > dt,
    .faq_content_block_qa > dl > dd {
        font-size: max(10px, 4vw);
        min-height: 16vw;
    }
    .faq_content_block_qa > dl > dt {
        padding: 2.666vw 0 2.666vw 13.333vw;
    }
    .faq_content_block_qa > dl > dd {
        padding: 4vw 0 5.866vw 13.333vw;
    }
    .faq_content_block_qa > dl > dt::before {
        width: 9.6vw;
        height: 9.6vw;
        top: min(2.666vw, calc(50% - 4.8vw));
        left: 1.066vw;
    }
    .faq_content_block_qa > dl > dd::before {
        width: 9.6vw;
        height: 9.6vw;
        top: min(2.666vw, calc(50% - 4.8vw));
        left: 1.066vw;
    }
    .faq_content_block + .faq_content_block {
        margin-top: 8vw;
    }
}

/** 追従ボタンエリア
-----------------**/
#fix-btn {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(73, 16, 41, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease-in-out, visibility 0.2s;
    z-index: 9999;
}
.fix-btn_content {
    display: flex;
    gap: 38px;
    width: 684px;
    max-width: 90%;
    justify-content: center;
    padding: 16px 0 19px;
}
.fix-btn_content img {
    width: 100%;
    height: auto;
    max-width: 323px;
}
.fix-btn_content a img {
    transition: filter 0.2s ease-in-out;
    opacity: 1;
}
.fix-btn_content a:hover img {
    filter: brightness(0.8);
    opacity: 1;
}
.str-footer__information {
    padding-bottom: 100px;
}

@media screen and (max-width: 767px) {
    .fix-btn_content {
        gap: 1.6vw;
        width: 100%;
        max-width: none;
        padding: 1.333vw 1.2vw;
    }
    .fix-btn_content img {
      max-width: 100%;
    }
    .str-footer__information {
        padding-bottom: 21.333vw;
    }
    .str-back-to-top {
        inset-block-end: -5.333vw;
    }
    .str-back-to-top__link {
        margin-block-start: -31.266vw;
    }
    .str-back-to-top.is-reached .str-back-to-top__link {
        position: fixed;
    }
}

.impt{
  color: #E60119!important;
}

.fs21{
  font-size: 2.1rem;
}

.fwb{
  font-weight: bold;
}