@charset "UTF-8";

/* support ページ (/support) 専用スタイル */

[data-pagename="support"] #gradient-bg-img {
    background-image: none;
    background-color: #fff;
}


.mb0{ margin-bottom:0 !important; }
.mb8{ margin-bottom:2.13vw !important; }
.mb16{ margin-bottom:4.27vw !important; }
.mb24{ margin-bottom:6.40vw !important; }
.mb32{ margin-bottom:8.53vw !important; }
.mb40{ margin-bottom:10.67vw !important; }

.fc-b{ color:#057BA2; }
.fc-m{ color:#F00072; }
.fwm{ font-weight:500; }
.fwb{ font-weight:bold; }




.mv-support{
width:100%;
height:83.20vw;
background:url(../../img/mv-debut-sp.jpg) no-repeat center center;
background-size:cover;
margin:0;
position:relative;
}



.sup-header{
background:#FF9100;
padding:6.40vw 0 10.67vw;
}


.page-anc{
width:87.20vw;
margin:0 auto;
display:flex;
flex-wrap:wrap;
gap:2.13vw;
}
.page-anc li{
width:87.20vw;
border-bottom:0.27vw solid #fff;
position:relative;
}

.page-anc li::after{
content:'';
width:1.87vw;
height:1.87vw;
border-right:0.53vw solid #fff;
border-bottom:0.53vw solid #fff;
transform:rotate(45deg);
position:absolute;
top:calc(50% - 1.87vw);
right:1.87vw;
}

.page-anc li a{
width:87.20vw;
display:block;
padding:2.40vw 2.13vw;
font-size:3.73vw;
line-height:1.2;
color:#fff;
font-weight:normal;
text-decoration:none;
}


.c-container{
width:100%;
margin:0 auto;
padding:10.67vw 0 14.93vw;
font-size:3.20vw;
line-height:1.75;
font-weight:normal;
}

.content-wrap{
width:87.20vw;
margin:0 auto;
}

h2.md01{
font-size:8.00vw;
line-height:1.2;
margin:0 0 6.40vw;
letter-spacing:-.05em;
}
h2.md02{
font-size:6.40vw;
line-height:1.2;
margin:0 0 6.40vw;
}
h2.md03{
text-align:center;
font-size:4.80vw;
line-height:1.5;
margin:0 0 4.27vw;
}

h3.md01{
font-size:4.80vw;
line-height:1.375;
padding-left:1.33vw;
border-left:0.53vw solid #FF5A00;
margin:0 0 4.27vw;
}

h3.md02{
font-size:4.80vw;
line-height:1.5;
margin:0 0 4.8vw;
padding:0;
border:0;
}
h3.md03{
font-size:4.80vw;
line-height:1.375;
padding-left:1.33vw;
border-left:0.53vw solid #00B700;
margin:0 0 4.27vw;
}
h4{
font-size:3.20vw;
line-height:1.75;
}

h4.md01{
font-size:3.73vw;
line-height:1.75;
color:#057BA2;
}

h5{
font-size:3.20vw;
line-height:1.75;
}


.quad-list{
display:grid;
grid-template-columns:1fr 1fr;
grid-template-areas:
"a c"
"b d";
gap:0 2vw;
}
.artist-list:nth-child(1){ grid-area:a; }
.artist-list:nth-child(2){ grid-area:b; }
.artist-list:nth-child(3){ grid-area:c; }
.artist-list:nth-child(4){ grid-area:d; }



.list-disc{
margin-left:1.5em;
font-size:3.20vw;
line-height:1.75;
}
.list-disc li{
list-style:disc;
}

.com-list{
margin-left:1.5em;
font-size:3.20vw;
line-height:1.75;
}
.com-list li{
list-style:disc;
}


.acc{
margin:0 0 6.40vw;
}

.acc > dt{
border:1px solid #057BA2;
font-size:3.2vw;
line-height:1.2;
font-weight:500;
padding:2.13vw 10.67vw 2.13vw 3.20vw;
position:relative;
color:#057BA2;
}

.acc > dt span{
display:block;
font-size:2.67vw;
}

.acc > dt::after{
content:'';
width:6.40vw;
height:6.40vw;
background:url(../../img/icon-plus.svg) no-repeat;
background-size:6.40vw;
position:absolute;
top:calc(50% - 3.2vw);
right:3.20vw;
}

.acc > dt.open{
background:#EBEBEB;
border:1px solid #EBEBEB;
}

.acc > dt.open::after{
content:'';
width:6.40vw;
height:6.40vw;
background:url(../../img/icon-minus.svg) no-repeat;
background-size:6.40vw;
position:absolute;
top:calc(50% - 3.2vw);
right:3.20vw;
}

.acc > dd{
display:none;
padding:3.20vw 0 0;
}


.cap-list li{
padding-left:1.2em;
position:relative;
}
.cap-list li::before{
content:'※';
position:absolute;
top:0;
left:0;
}

.col{
display:flex;
flex-wrap:wrap;
}
.col-3{
width:100%;
margin:0 0 4.27vw;
}
.col-6{
width:100%;
}

@media (max-width: 767px) {
.sp-row{
flex-wrap:nowrap;
align-items:flex-start;
gap:4.27vw;
}
.sp-row > .col-6{
width:55%;
margin:0;
}
.sp-row > .col-3{
padding-top:12vw;
width:40%;
margin:0;
}

.sp-row-5{
flex-wrap:nowrap;
gap:8px;
}
.sp-row-5 > .col-5{
width:calc((100% - 8px) / 2);
}

.rec-web-row{
display:flex;
align-items:center;
gap:4.27vw;
}
.rec-web-row > .rec-site-img{
width:34.13vw;
flex-shrink:0;
margin:0;
}

.glo02{
display:flex;
align-items:center;
gap:4.00vw;
}
.glo02 > div:first-child{ order:2; }
.glo02 > .glo-img{
order:1;
width:42.13vw;
flex-shrink:0;
margin:0;
}
}

.glo01{
display:grid;
grid-template-columns:1fr 1fr;
grid-template-areas:
"a b"
"c c";
gap:4.27vw;
}
.glo01 > div:nth-child(1){ grid-area:a; }
.glo01 > div:nth-child(2){ grid-area:b; }
.glo01 > div:nth-child(3){ grid-area:c; }

.glo-col{
display:flex;
flex-direction:column;
gap:6.40vw;
}



.gbg-box{
background:#f4f4f4;
padding:4.27vw 2.13vw;
}


.contest-ttl{
width:49.60vw;
margin:0 0 4.27vw;
}
.dreamcatcher-ttl{
width:52.27vw;
margin:0 0 4.27vw;
}


.prize{
background:#000;
padding:1.87vw;
margin:0 0 6.40vw;
}
.prize-ttl{
width:39.47vw;
margin:0 auto 1vw;
}
.bands{
display:flex;
justify-content:center;
gap:2.13vw;
}
.bands li{
color:#fff;
font-size:4.27vw;
line-height:1.35;
font-weight:bold;
}
.bands li span{
display:block;
font-size:2.13vw;
line-height:1.4;
font-weight:normal;
}

.gp-wrap{
}

.misc{
font-size:2.67vw;
font-weight:normal;
color:#fff;
text-align:right;
}


.artist-name{
margin:2.13vw 0 0;
}



.artist-list li{
font-size:2.93vw;
padding-left:1em;
position:relative;
letter-spacing:-.05em;
}
.artist-list li::before{
content:'●';
position:absolute;
top:0;
left:0;
}


.andmore{
text-align:center;
font-size:4.27vw;
font-weight:900;
}

.jobi{
width:100%;
margin:0 0 4.27vw;
}

.rec-app{
width:100%;
border:0.27vw solid #FF5A00;
padding:5.33vw 4.27vw;
background:#f4f4f4;
margin:0 0 6.40vw;
}

.rec-ttl{
color:#FF5A00;
font-size:4.8vw;
font-weight:500;
line-height:1;
margin:0 0 3.73vw;
text-align:center;
}
.rec-app-img{
width:62.13vw;
margin:0 0 4.27vw;
}

.rec-app-txt{
margin-bottom:6.40vw;
}



.grad-members{
display:flex;
flex-wrap:wrap;
gap:6.40vw 2.13vw;
margin:0 0 6.40vw;
}
.grad-members li{
width:calc((100% - 2.13vw) / 2);
}

.mem-photo{
}

.mem-name{
font-size:5.6vw;
line-height:1;
margin:4.27vw 0 2.13vw;
}
.mem-name span{
display:inline-block;
margin-left:2.13vw;
font-size:2.67vw;
}

.mem-com{
font-size:2.67vw;
line-height:1.25;
margin:0 0 2.13vw;
}
.mem-job{
text-align:center;
font-size:2.67vw;
line-height:1;
padding:1.60vw;
border:0.27vw solid #057BA2;
color:#057BA2;
margin:0 0 5.33vw;
}










@media (min-width: 768px) {

.mb0{ margin-bottom:0 !important; }
.mb8{ margin-bottom:8px !important; }
.mb16{ margin-bottom:16px !important; }
.mb24{ margin-bottom:24px !important; }
.mb32{ margin-bottom:32px !important; }
.mb40{ margin-bottom:40px !important; }


.fs12{ font-size:12px; }


.mv-support{
width:100%;
height:372px;
background:url(../../img/mv-debut-pc.jpg) no-repeat center center;
background-size:cover;
margin:0;
}


.c-header{
padding:32px 0;
}
.c-header h1{
width:1260px;
font-size:58px;
font-weight:900;
color:#fff;
margin:0 auto 40px;
text-align:left;
}
.c-header h1 span{
display:block;
font-size:24px;
line-height:1.5;
font-weight:normal;
letter-spacing:.2em;
}


.c-container{
width:100%;
margin:0 auto;
padding:40px 0 56px;
font-size:16px;
line-height:1.75;
}

.content-wrap{
width:1260px;
margin:0 auto;
}

.page-anc{
width:1260px;
margin:0 auto;
display:flex;
gap:40px;
}
.page-anc li{
width:283px;
border-bottom:1px solid #fff;
position:relative;
}

.page-anc li::after{
content:'';
width:10px;
height:10px;
border-right:2px solid #fff;
border-bottom:2px solid #fff;
transform:rotate(45deg);
position:absolute;
top:calc(50% - 10px);
right:14px;
}

.page-anc li a{
width:283px;
display:block;
padding:0 8px 12px;
font-size:16px;
line-height:1.5;
color:#fff;
font-weight:normal;
text-decoration:none;
}



h2.md01{
font-size:42px;
line-height:1;
margin:0 0 24px;
}
h2.md02{
font-size:32px;
line-height:1;
margin:0 0 24px;
}
h2.md03{
text-align:center;
font-size:32px;
line-height:1;
margin:0 0 40px;
}

h3.md01{
font-size:24px;
line-height:1.375;
padding-left:11px;
border-left:5px solid #FF5A00;
margin:0 0 24px;
}

h3.md02{
font-size:24px;
line-height:1.5;
margin:0 0 16px;
padding:0;
border:0;
}
h3.md03{
font-size:24px;
line-height:1.375;
padding-left:11px;
border-left:5px solid #00B700;
margin:0 0 24px;
}

h4{
font-size:16px;
line-height:1.75;
}

h4.md01{
font-size:16px;
line-height:1.75;
color:#057BA2;
}

h5{
font-size:16px;
line-height:1.75;
}

.quad-list{
grid-template-columns:repeat(4, 1fr);
grid-template-areas:"a b c d";
gap:0 40px;
}


.sup-header{
background:#FF9100;
padding:32px 0;
}

.col{
display:flex;
flex-wrap:wrap;
gap:40px;
}
.col-3{
width:393px;
margin:0;
}
.col-6{
width:827px;
display:flex;
flex-direction:column;
justify-content:center;
}

.col-5{
width:calc((100% - 40px) / 2);
}

.col-c{
width:calc((100% - 80px) / 3);
}


.gbg-box{
background:#f4f4f4;
padding:16px;
}


.list-disc{
margin-left:24px;
font-size:16px;
line-height:1.75;
}
.list-disc li{
list-style:disc;
}

.com-list{
margin-left:24px;
font-size:12px;
line-height:1.75;
}
.com-list li{
list-style:disc;
}



.acc{
margin:0 0 40px;
}

.acc > dt{
border:1px solid #057BA2;
font-size:20px;
line-height:1;
font-weight:500;
padding:13px 12px;
position:relative;
color:#057BA2;
}
.acc > dt span{
display:inline-block;
font-size:20px;
}


.acc > dt::after{
content:'';
width:30px;
height:30px;
background:url(../../img/icon-plus.svg) no-repeat;
background-size:30px;
position:absolute;
top:8px;
right:12px;
}

.acc > dt.open{
background:#EBEBEB;
border:1px solid #EBEBEB;
}

.acc > dt.open::after{
content:'';
width:30px;
height:30px;
background:url(../../img/icon-minus.svg) no-repeat;
background-size:30px;
position:absolute;
top:8px;
right:12px;
}

.acc > dd{
display:none;
padding:8px 0 0;
}




.debut-lead{
font-size:21px;
line-height:1.7;
}

.glo01{
display:block;
}

.glo-col{
display:flex;
gap:40px;
margin:0 0 40px;
flex-direction:row;
}
.glo02{
width:calc((100% - 40px) / 2);
display:flex;
flex-wrap:wrap;
gap:32px;
}

.glo-img{
width:242px;
margin:0 auto;
}

.prize{
background:#000;
padding:16px;
margin:0 0 40px;
}
.prize-ttl{
width:263px;
margin:0 auto;
}
.bands{
display:flex;
justify-content:center;
gap:40px;
}
.bands li{
color:#fff;
font-size:28px;
line-height:1.35;
font-weight:bold;
}
.bands li span{
display:block;
font-size:14px;
line-height:1.4;
font-weight:normal;
}

.gp-wrap{
display:flex;
justify-content:center;
gap:40px;
align-items:end;
}

.misc{
font-size:18px;
font-weight:normal;
color:#fff;
}

.hoka{
font-size:12px;
}

.contest-ttl{
width:250px;
margin:0 0 24px;
}

.dreamcatcher-ttl{
width:260px;
margin:0 0 24px;
}

.artist-name{
margin:16px 0 0;
}


.artist-list li{
font-size:16px;
padding-left:1.2em;
position:relative;
}
.artist-list li::before{
content:'●';
position:absolute;
top:0;
left:0;
}

.andmore{
text-align:center;
font-size:24px;
font-weight:900;
}

.jobi{
width:392px;
margin:0 0 24px;
}

.alignleft{
justify-content:flex-start;
}

.rec-web-row p{
margin-bottom:24px;
}

.rec-site-img{
width:100%;
}

.rec-site-img img{
width:230px;
display:block;
}

.rec-app{
width:396px;
border:1px solid #FF5A00;
padding:20px 10px;
background:#f4f4f4;
margin:0 0 24px;
}

.rec-ttl{
color:#FF5A00;
font-size:22px;
font-weight:500;
line-height:1;
margin:0 0 14px;
}
.rec-app-img{
width:280px;
margin:0 0 16px;
}

.rec-app-txt{
padding:8px;
margin-bottom:8px;
}

.grad-members{
display:flex;
flex-wrap:wrap;
gap:40px;
margin:0 0 24px;
}
.grad-members li{
width:calc((100% - 80px) / 3);
}

.mem-photo{
}

.mem-name{
font-size:28px;
line-height:1;
margin:16px 0 8px;
}
.mem-name span{
display:inline-block;
margin-left:8px;
font-size:16px;
}

.mem-com{
font-size:16px;
line-ieight:1.75;
min-height:56px;
margin:0 0 8px;
}
.mem-job{
text-align:center;
font-size:16px;
line-height:1;
padding:6px;
border:1px solid #057BA2;
color:#057BA2;
margin:0 0 8px;
}







/* END PC CSS */
}
