/* ==========================================================================
コースページ (page-course.php)
========================================================================== */

/* 背景グラデーション無効化 */
[data-pagename^="course/artist/"] #gradient-bg-img,
[data-pagename^="course/soundcreator/"] #gradient-bg-img,
[data-pagename^="course/staff/"] #gradient-bg-img,
[data-pagename^="course/tuning/"] #gradient-bg-img,
[data-pagename^="course/repair/"] #gradient-bg-img,
[data-pagename^="course/craft/"] #gradient-bg-img {
background-image: none;
background-color: #fff;
}


/* --------------------------------------------------------------------------
① MV
PC画像実寸 W3840 x H744 / SP画像実寸 W750 x H628
-------------------------------------------------------------------------- */
.l-course-mv {
position: relative;
width: 100%;
background-repeat: no-repeat;
background-position: center;
}

@media (min-width: 768px) {
.l-course-mv {
height: 372px;
background-size: auto 100%;
}
}

@media (max-width: 767.98px) {
.l-course-mv {
width: 100.00vw;
height: 83.73vw;
background-size: 100% 100%;
}
}


/* --------------------------------------------------------------------------
ラッパー / 学科カラー変数
-------------------------------------------------------------------------- */
.l-course {
}

.l-course[data-department="artist"]       { --dept-color: #005CD4; }
.l-course[data-department="soundcreator"] { --dept-color: #00B6AB; }
.l-course[data-department="staff"]        { --dept-color: #FF5A00; }
.l-course[data-department="tuning"]       { --dept-color: #FF9100; }
.l-course[data-department="repair"]       { --dept-color: #8D67CF; }
.l-course[data-department="craft"]        { --dept-color: #00B700; }


/* --------------------------------------------------------------------------
③ 動画
-------------------------------------------------------------------------- */


.l-course[data-department="artist"] .l-course-video       { background-image:url(../../img/mov-bg-artist.jpg); }
.l-course[data-department="soundcreator"] .l-course-video { background-image:url(../../img/mov-bg-soundcreator.jpg); }
.l-course[data-department="staff"] .l-course-video        { background-image:url(../../img/mov-bg-staff.jpg); }
.l-course[data-department="tuning"] .l-course-video       { background-image:url(../../img/mov-bg-tuning.jpg); }
.l-course[data-department="repair"] .l-course-video       { background-image:url(../../img/mov-bg-repair.jpg); }
.l-course[data-department="craft"] .l-course-video        { background-image:url(../../img/mov-bg-craft.jpg); }



.l-course-video {
background-repeat:no-repeat;
background-size:cover;
width:100%;
padding:6.40vw 0 8.00vw;
}


.course-video-inner{
width:82.93vw;
margin:0 auto;
}

.course-video-ttl{
width:33.87vw;
height:8.80vw;
margin:0 0 4.27vw;
}

.course-video-wrap {
width:82.93vw;
margin:0 auto;
border-radius:4.27vw;
overflow:hidden;
position: relative;
aspect-ratio: 16 / 9;
}

.course-video-wrap iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}



/* --------------------------------------------------------------------------
④ 在校生の声
-------------------------------------------------------------------------- */
.course-content{
background:#f4f4f4;
padding:13.60vw 0 11.73vw;
}
.course-message{
background:#fff;
width:86.93vw;
margin:0 auto 15.20vw;
position:relative;
padding:16.53vw 6.40vw 4.27vw;
}

.course-message-ttl-svg{
width:56.53vw;
height:19.20vw;
position:absolute;
left:6.40vw;
top:-5.33vw;
background-color:var(--dept-color);
-webkit-mask-image:url(../../img/txt-students-message.svg);
mask-image:url(../../img/txt-students-message.svg);
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:contain;
mask-size:contain;
}
.course-message-ttl{
font-size:4.80vw;
font-weight:normal;
line-height:1;
margin:0 0 4.27vw;
}

.course-message-inner{
width:74.13vw;
margin:0 auto;
}


.course-cont-col{
width:74.13vw;
display:flex;
flex-wrap:wrap;
gap:5.87vw;
margin:0 auto 8.00vw;
}
.course-cont-photo{
width:74.13vw;
height:49.07vw;
border-radius:4.27vw;
overflow:hidden;
}
.course-cont-txt{
width:74.13vw;
display:flex;
flex-direction:column;
justify-content:center;
font-size:3.20vw;
line-height:1.75;
font-weight:normal;
}

.course-tt-ttl{
font-size:5.07vw;
line-height:1;
font-weight:normal;
margin:0 0 2.67vw;
}
.course-tt-ttl span{
display:inline-block;
margin-left:5.07vw;
font-size:3.73vw;
font-weight:500;
}

/* SP: 時間割は画像で表示、テーブルはPCのみ */
.course-tt{
display:block;
}
.course-tt-img img{
display:none;
width:100%;
height:auto;
}

.course-tt{
display:table;
width:100%;
table-layout:fixed;
}
.course-tt-img{
display:none;
}
.course-tt thead th:nth-child(1){ background:#fff !important; }

.course-tt thead th{
height:3.73vw;
background:color-mix(in srgb, var(--dept-color) 15%, white);
font-size:2.13vw;
line-height:1;
border:0.27vw solid #fff;
}
.course-tt tbody th{
background:var(--dept-color);
border-bottom:0.27vw solid #fff;
color:#fff;
font-size:2.13vw;
line-height:1;
height:7.73vw;
font-weight:normal;
}
.course-tt tbody td{
font-size:1.87vw;
line-height:1.2;
text-align:center;
font-weight:normal;
border:0.27vw solid var(--dept-color);
}

.sche-md{
margin-bottom:1vw;
}

.sche-list{
}

.sche-list li{
font-size:1.60vw;
position:relative;
text-align:left;
}
.sche-list li::before{
content:'・';
}




.course-teacher{
background:#fff;
width:86.93vw;
margin:0 auto 4.27vw;
position:relative;
padding:6.40vw;
}

.course-teacher-ttl-svg{
width:47.73vw;
height:8.80vw;
position:absolute;
left:6.40vw;
top:-4.53vw;
background-color:var(--dept-color);
-webkit-mask-image:url(../../img/txt-teacher.svg);
mask-image:url(../../img/txt-teacher.svg);
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:contain;
mask-size:contain;
}
.course-teacher-ttl{
font-size:4.80vw;
font-weight:normal;
line-height:1;
margin:0 0 4.00vw;
}

.course-teacher-name{
font-size:4.80vw;
line-height:1.5;
font-weight:bold;
}


/* --------------------------------------------------------------------------
⑤ 学科共通
-------------------------------------------------------------------------- */
.course-common{
padding:10.67vw 0 14.93vw;
}

.common-wrapper{
position: relative;
z-index: 1;
width:86.93vw;
margin:0 auto;
}

.common-artist-cont01,
.common-artist-cont02,
.common-sc-cont01{
margin:0 0 10.67vw;
}

.common-tuning-cont01{ margin:0 0 12.80vw; }
.common-tuning-cont02{ margin:0 0 18.67vw; }
.common-tuning-cont03{ margin:0 0 10.67vw; }
.common-tuning-cont04{ margin:0 0 6.40vw; }

.common-repair-cont01{ margin:0; }
.common-repair-cont02{ margin:0 0 10.67vw; }
.common-repair-cont03{ margin:0 0 10.67vw; }

.common-craft-cont01,
.common-craft-cont02{ margin:0 0 10.67vw; }
.common-craft-cont03{ margin:0 0 10.67vw; }

.common-sc-cont02{
margin:0 0 24.80vw;
}
.common-sc-cont03{
margin:0 0 10.67vw;
}


.common-artist-cont01 .common-wrapper,
.common-artist-cont03 .common-wrapper,
.common-sc-cont01 .common-wrapper,
.common-sc-cont03 .common-wrapper,
.common-staff-cont01 .common-wrapper,
.common-tuning-cont01 .common-wrapper,
.common-tuning-cont03 .common-wrapper,
.common-repair-cont01 .common-wrapper,
.common-repair-cont03 .common-wrapper,
.common-craft-cont01 .common-wrapper,
.common-craft-cont03 .common-wrapper{
padding:6.40vw 0 6.4vw 6.4vw;
}



.common-artist-cont02 .common-wrapper,
.common-sc-cont02 .common-wrapper,
.common-sc-cont04 .common-wrapper,
.common-staff-cont02 .common-wrapper,
.common-tuning-cont02 .common-wrapper,
.common-tuning-cont04 .common-wrapper{
padding:6.40vw 6.4vw 6.4vw 0;
}

.common-repair-cont02 .common-wrapper{
padding:16.53vw 6.4vw 6.4vw 0;
}


.common-craft-cont01 .common-wrapper,
.common-craft-cont03 .common-wrapper{
padding:14vw 0 6.4vw 6.4vw;
}

.common-craft-cont02 .common-wrapper{
padding:14vw 6.4vw 6.4vw 0;
}


.common-wrapper::before{
content: "";
position: absolute;
top: 0;
height: 100%;
z-index: -1;
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
}

/* cont01・03共通: 左端=コンテンツ左端で固定、右端は画面端まで伸びる */
.common-artist-cont01 .common-wrapper::before,
.common-artist-cont03 .common-wrapper::before,
.common-sc-cont01 .common-wrapper::before,
.common-sc-cont03 .common-wrapper::before,
.common-staff-cont01 .common-wrapper::before,
.common-tuning-cont01 .common-wrapper::before,
.common-tuning-cont03 .common-wrapper::before,
.common-repair-cont01 .common-wrapper::before,
.common-repair-cont03 .common-wrapper::before,
.common-craft-cont01 .common-wrapper::before,
.common-craft-cont03 .common-wrapper::before  {
left: 0;
width: calc(50vw + 43.47vw);
background-position: center top;
}

/* cont02共通: 右端=コンテンツ右端で固定、左端は画面端まで伸びる */
.common-artist-cont02 .common-wrapper::before,
.common-sc-cont02 .common-wrapper::before,
.common-sc-cont04 .common-wrapper::before,
.common-staff-cont02 .common-wrapper::before,
.common-tuning-cont02 .common-wrapper::before,
.common-tuning-cont04 .common-wrapper::before,
.common-repair-cont02 .common-wrapper::before,
.common-craft-cont02 .common-wrapper::before{
right: 0;
width: calc(50vw + 43.47vw);
background-position: center top;
}

/* staff cont02のみ背景幅を固定値にする */
.common-staff-cont02 .common-wrapper::before {
top:-7vw;
height: 67.2vw;
}

.common-craft-cont01 .common-wrapper{
margin-bottom:14.40vw;
}
.common-craft-cont03 .common-wrapper{
margin-bottom: 6.4vw;
}


/* 背景画像(学科ごと) */
.common-artist-cont01 .common-wrapper::before,
.common-artist-cont02 .common-wrapper::before {
background-image: url(../../img/common-artist-bg01.jpg);
}
.common-artist-cont03 .common-wrapper::before {
background-image: url(../../img/common-artist-bg03.jpg);
}
.common-sc-cont01 .common-wrapper::before,
.common-sc-cont02 .common-wrapper::before,
.common-sc-cont03 .common-wrapper::before,
.common-sc-cont04 .common-wrapper::before{
background-image: url(../../img/common-sc-bg.jpg);
}
.common-staff-cont01 .common-wrapper::before,
.common-staff-cont02 .common-wrapper::before {
background-image: url(../../img/mov-bg-staff.jpg);
}
.common-tuning-cont01 .common-wrapper::before,
.common-tuning-cont02 .common-wrapper::before,
.common-tuning-cont03 .common-wrapper::before,
.common-tuning-cont04 .common-wrapper::before {
background-image: url(../../img/common-tuning-bg.jpg);
}
.common-repair-cont01 .common-wrapper::before,
.common-repair-cont02 .common-wrapper::before,
.common-repair-cont03 .common-wrapper::before{
background-image: url(../../img/common-repair-bg.jpg);
}

.common-craft-cont01 .common-wrapper::before,
.common-craft-cont02 .common-wrapper::before,
.common-craft-cont03 .common-wrapper::before{
background-image: url(../../img/common-craft-bg.jpg);
}


/* cont03: 右寄りに固定サイズで配置する装飾背景(画面端まで伸ばすbleedとは別方式) */
.common-staff-cont03 .common-wrapper::before {
content: "";
position: absolute;
z-index: -1;
background-image: url(../../img/mov-bg-staff.jpg);
background-repeat: no-repeat;
background-size: cover;
left: 51.73vw;
top: -8vw;
height: 39.47vw;
width: calc(100vw - 58.265vw);
}

/* MVも背景の伸びる方向と連動
※MVはwrapperのpadding(6.4vw)込みのcontent-box内に流れるうえ、wrapper自体が86.93vwで中央寄せ(画面端まで届かない)なので、
「コンテンツ側の固定端 → 画面端」の実距離をそのままvwで指定する */
.common-mv img {
width: 87.07vw;
max-width: none;
}

.mv-lo02 img {
width: 87.07vw;
max-width: none;
margin-left: -6.54vw;
}

.course-common h3{
font-size:10vw;
font-weight:900;
line-height:1.05;
width:93.60vw;
position:relative;
z-index:10;
white-space:nowrap;
}
.course-common h3 span{
display:block;
font-size:2.13vw;
line-height:1;
font-weight:normal;
}
.common-artist-cont01 h3,
.common-artist-cont03 h3,
.common-sc-cont01 h3,
.common-sc-cont03 h3,
.common-staff-cont01 h3,
.common-staff-cont03 h3,
.common-tuning-cont01 h3,
.common-tuning-cont03 h3,
.common-repair-cont01 h3,
.common-repair-cont02 h3,
.common-repair-cont03 h3,
.common-craft-cont01 h3,
.common-craft-cont03 h3{
margin:0 0 0 6.40vw;
}
.common-artist-cont02 h3,
.common-sc-cont02 h3,
.common-sc-cont04 h3,
.common-staff-cont02 h3,
.common-tuning-cont02 h3{
width:fit-content;
max-width:86.93vw;
margin:0 calc(50vw - 43.47vw) 0 auto;
text-align:left;
}

.common-sc-cont04 h3{
font-size:8.53vw;
}


.common-craft-cont01 h3,
.common-craft-cont02 h3,
.common-craft-cont03 h3{
font-size:9.6vw;
position:relative;
max-width:86.93vw;
bottom:-1em;
margin-left:6.4vw;
}

.common-tuning-cont04 h3{
text-align:right;
}

.common-repair-cont02 h3{
position:relative;
bottom:-1em;
}


.common-lead{
font-size:3.73vw;
line-height:1.928;
font-weight:normal;
margin:0 0 6.40vw;
}



.common-mv{
margin:0 0 4.27vw;
}
.mv-spml{
margin:0 0 4.27vw 13vw;
}

.common-mv img {
display: block;
height: auto;
}

.artist-case-col{
gap:2.67vw;
}


.artist-debut-col{
gap:4.7vw;
}

.common-artist-debut{
width:37.87vw;
display:flex;
flex-direction:column;
gap:1.33vw;
}

.common-artist-debut-thumb{
width:37.87vw;
}


.craft-common-adj{
margin:0;
}

.common-andmore{
text-align:center;
font-size:4.27vw;
font-weight:900;
margin:4.27vw 0;
}

.course-inner{
width:86.93vw;
margin:0 auto;
}

.stack-btn{
width:80.80vw;
position:absolute;
bottom:-8vw;
left:50%;
transform:translate(-50%, 0);
}

.sc-adj h3{
font-size:9vw;
line-height:1.15;
font-weight:900;
font-feature-settings:'palt';
}

.common-avid-logo{
margin:0 0 2.13vw;
}
.common-avid-logo-att{
font-size:2.93vw;
line-height:1.75;
font-weight:normal;
}

.common-sc-cont01 .feature-col3{
gap:4.7vw;
}
.common-sc-cont02 .feature-col2{
gap:3.9vw;
}

.mv-caption{
text-align:right;
font-size:2.67vw;
line-height:1.2;
margin:1vw 0 0;
}

.common-staff-cont01 .common-wrapper{
margin-bottom:6.4vw;
}

.common-course-inner{
width:87.20vw;
margin:0 auto;
}


.staff-circle{
width:73.87vw;
margin:0 0 0 6.4vw;
}



.course-common h3.staff-art-md{
width:100%;
position: relative;
display: block;
height: 7.47vw;
line-height: 7.47vw;
text-align: center;
font-size: 3.73vw;
font-weight: bold;
color: #FFF11E;
background: #FF5A00;
margin: 0 auto 4.27vw;
}

.course-common h3.cr-art-md{
width:100%;
position: relative;
display: block;
height: 7.47vw;
line-height: 7.47vw;
text-align: center;
font-size: 3.73vw;
font-weight: bold;
color: #FFF;
background: #00B700;
margin: 0 auto 4.27vw;
}

.staff-org-md{
text-align:center;
}

.common-staff-cont02{
margin-bottom:9.6vw;
}
.common-staff-cont02 .features-col4{
gap:2.13vw;
}


.staff-photo-card4{
width:42.40vw;
}

.staff-photo-card3,
.staff-col2-photo li{
width:42.4vw;
}

.common-staff-cont03 .staff-md{
padding-top:6.4vw;
}

.staff-cont03-lead{
font-size:3.20vw;
line-height:1.65;
margin:0 0 4.27vw;
}

.staff-cont3-img{
margin:0 0 6.4vw;
}


.zeropro{
width:51.73vw;
height:51.73vw;
background:url(../../img/zeropro.png) no-repeat;
background-size:51.73vw;
position:absolute;
bottom:-14.40vw;
left:0;
}

.common-craft-cont02 .features-col3{
gap:4.27vw;
}

.common-craft-cont03 .features-col3{
gap:2.4vw;
}
.common-craft-cont02 .cr-photo-card{
width:38.13vw;
}

.common-craft-cont03 .cr-photo-card{
width:42.4vw;
}
.common-tuning-cont02 .tu-p2i-caption,
.common-tuning-cont03 .tu-p2i-caption{
text-align:left !important;
font-weight:bold;
margin:0 0 1vw;
}



@media (min-width: 768px) {

/* --------------------------------------------------------------------------
③ 動画
-------------------------------------------------------------------------- */
.l-course-video {
background-repeat:no-repeat;
background-size:cover;
width:100%;
padding:56px 0;
}

.course-video-inner{
width:1200px;
max-width:100%;
margin:0 auto;
}

.course-video-ttl{
width:270px;
height:63px;
margin:0 0 24px;
}

.course-video-wrap {
width:800px;
margin:0 auto;
border-radius:24px;
overflow:hidden;
position: relative;
aspect-ratio: 16 / 9;
}

.course-video-wrap iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
}



/* --------------------------------------------------------------------------
④ 在校生の声
-------------------------------------------------------------------------- */
.course-content{
background:#f4f4f4;
padding:103px 0 70px;
}
.course-message{
background:#fff;
width:1260px;
margin:0 auto 80px;
position:relative;
padding:120px 30px 40px;
}

.course-message-ttl-svg{
width:442px;
height:134px;
position:absolute;
left:30px;
top:-39px;
background-color:var(--dept-color);
-webkit-mask-image:url(../../img/txt-students-message.svg);
mask-image:url(../../img/txt-students-message.svg);
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:contain;
mask-size:contain;
}
.course-message-ttl{
font-size:32px;
font-weight:normal;
line-height:1;
margin:0 0 40px;
}

.course-message-inner{
width:1130px;
margin:0 auto;
}

.course-cont-col{
width:1130px;
display:flex;
gap:90px;
margin:0 auto 40px;
}
.course-cont-photo{
width:520px;
height:345px;
border-radius:24px;
overflow:hidden;
}
.course-cont-txt{
width:520px;
display:flex;
flex-direction:column;
justify-content:center;
font-size:16px;
line-height:1.75;
font-weight:normal;
}

.course-tt-ttl{
font-size:32px;
line-height:1;
font-weight:normal;
margin:0 0 16px;
}
.course-tt-ttl span{
display:inline-block;
margin-left:26px;
font-size:24px;
font-weight:500;
}


.course-tt{
display:table;
width:100%;
table-layout:fixed;
}
.course-tt-img{
display:none;
}
.course-tt thead th:nth-child(1){ background:#fff !important; }

.course-tt thead th{
height:31px;
background:color-mix(in srgb, var(--dept-color) 15%, white);
font-size:13px;
line-height:1;
border:1px solid #fff;
}
.course-tt tbody th{
background:var(--dept-color);
border-bottom:1px solid #fff;
color:#fff;
font-size:13px;
line-height:1;
height:43px;
font-weight:normal;
}
.course-tt tbody td{
font-size:13px;
line-height:1.2;
text-align:center;
font-weight:normal;
border:1px solid var(--dept-color);
}


.sche-md{
margin-bottom:5px;
font-weight:500;
}

.sche-list{
margin:0 0 .25em 3em
}

.sche-list li{
font-size:13px;
position:relative;
text-align:left;
}
.sche-list li::before{
content:'・';
}





.course-teacher{
background:#fff;
width:1260px;
margin:0 auto 40px;
position:relative;
padding:48px 30px;
}

.course-teacher-ttl-svg{
width:371px;
height:63px;
position:absolute;
left:30px;
top:-39px;
background-color:var(--dept-color);
-webkit-mask-image:url(../../img/txt-teacher.svg);
mask-image:url(../../img/txt-teacher.svg);
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:contain;
mask-size:contain;
}
.course-teacher-ttl{
font-size:32px;
font-weight:normal;
line-height:1;
margin:0 0 40px;
}

.course-teacher-name{
font-size:32px;
line-height:1.5;
font-weight:bold;
}


/* --------------------------------------------------------------------------
⑤ 学科共通 - 音楽アーティスト科（common-artist.php）
背景・MVは1260pxセンタリング位置から画面端まで伸びる（cont01/03=右、cont02=左）
-------------------------------------------------------------------------- */
.course-common{
padding:64px 0;
}

.common-wrapper {
position: relative;
z-index: 1;
}

.common-artist-cont01,
.common-artist-cont02,
.common-sc-cont01,
.common-staff-cont01,
.common-tuning-cont01{
margin:0 0 64px;
}

.common-sc-cont02{
margin:0 0 210px;
}
.common-tuning-cont02{ margin:0 0 92px; }
.common-tuning-cont03{ margin:0 0 40px; }
.common-tuning-cont04{ margin:0 0 24px; }

.common-repair-cont01,
.common-repair-cont02{ margin:0 0 64px; }
.common-repair-cont03{ margin:0 0 24px; }

.common-craft-cont01,
.common-craft-cont02{ margin:0 0 56px; }
.common-craft-cont03{ margin:0 0 24px; }

.common-artist-cont01 .common-wrapper,
.common-artist-cont03 .common-wrapper,
.common-sc-cont01 .common-wrapper,
.common-staff-cont01 .common-wrapper,
.common-staff-cont02 .common-wrapper,
.common-tuning-cont01 .common-wrapper,
.common-tuning-cont02 .common-wrapper,
.common-tuning-cont03 .common-wrapper,
.common-tuning-cont04 .common-wrapper,
.common-repair-cont01 .common-wrapper,
.common-repair-cont02 .common-wrapper,
.common-repair-cont03 .common-wrapper,
.common-craft-cont01 .common-wrapper,
.common-craft-cont02 .common-wrapper,
.common-craft-cont03 .common-wrapper{
padding:40px 30px 30px;
}

.common-sc-cont03 .common-wrapper{
padding:104px 30px 30px;
}

.common-artist-cont02 .common-wrapper,
.common-sc-cont02 .common-wrapper,
.common-sc-cont04 .common-wrapper{
padding:40px 30px 30px;
}
.common-craft-cont01 .common-wrapper{
margin-bottom:94px;
}
.common-craft-cont03 .common-wrapper{
margin-bottom: 40px;
}

.course-common h3{
font-size:56px;
font-weight:900;
line-height:1.25;
width:1260px;
max-width:100%;
margin:0 auto;
}

.common-repair-cont02 h3{
position:relative;
bottom:0;
}

.course-common h3 span{
display:block;
font-size:16px;
line-height:1;
font-weight:normal;
}

.common-artist-cont02 h3,
.common-sc-cont02 h3,
.common-staff-cont02 h3{
text-align:right;
}

.sc-f-ttl{
position:absolute;
top:-119px;
left:30px;
}



.common-lead{
font-size:22px;
line-height:1.7;
font-weight:normal;
margin:0 0 16px;
}

.common-mv{
margin:0 0 40px;
}
.mv-spml{
margin:0 0 40px;
}


/* 768px以上を1本の式に統一。.common-wrapperのpadding(30px)を飛び越えて、
   コンテンツ側の固定端(cont01=左端／cont02=右端)を基準に反対側を画面端までブリードさせる。
   wrapperの右半分オフセットは前述の背景ブリードと同じ max(0px, (100vw - 1260px) / 2) を使う */
.common-mv img {
display: block;
width: calc(100vw - 30px - max(0px, (100vw - 1260px) / 2));
max-width: none;
height: auto;
}

/* cont02: 左端は画面端までブリード、右端はcommon-wrapperのコンテンツ右端(=wrapper自体からpadding分30px内側)に固定。
   1260px以上でwrapperが中央寄せになると、右の余白は画面端からではなくwrapperの右端から30pxになる
   （wrapper自体が画面端から離れていくので、画面端から見た余白はそのぶん一緒に広がるのが正しい動き）。
   100vwはスクロールバー幅を含み誤差が出るため、header.phpで実測した--vw-safeを優先的に使う */
.mv-lo02 img {
width: calc(var(--vw-safe, 100vw) - 30px - max(0px, (var(--vw-safe, 100vw) - 1260px) / 2));
max-width: none;
margin-left: calc(-30px - max(0px, (var(--vw-safe, 100vw) - 1260px) / 2));
}

.common-wrapper{
width: 1260px;
max-width: 100%;
margin: 0 auto;
}

/* 768px以上を1本の式に統一 */
.common-artist-cont01 .common-wrapper::before,
.common-artist-cont03 .common-wrapper::before,
.common-sc-cont01 .common-wrapper::before,
.common-sc-cont03 .common-wrapper::before,
.common-staff-cont01 .common-wrapper::before,
.common-tuning-cont01 .common-wrapper::before,
.common-tuning-cont03 .common-wrapper::before,
.common-repair-cont01 .common-wrapper::before,
.common-repair-cont03 .common-wrapper::before,
.common-craft-cont01 .common-wrapper::before,
.common-craft-cont03 .common-wrapper::before{
left: 0;
width: calc(100vw - max(0px, (100vw - 1260px) / 2));
}

.common-artist-cont02 .common-wrapper::before,
.common-sc-cont02 .common-wrapper::before,
.common-sc-cont04 .common-wrapper::before,
.common-staff-cont02 .common-wrapper::before,
.common-tuning-cont02 .common-wrapper::before,
.common-tuning-cont04 .common-wrapper::before,
.common-repair-cont02 .common-wrapper::before,
.common-craft-cont02 .common-wrapper::before{
right: 0;
width: calc(100vw - max(0px, (100vw - 1260px) / 2));
}

.common-staff-cont02 .common-wrapper::before{
top: 0;
height: 343px;
}

/* 768px以上で統一。ラッパー幅=画像幅で、コンテナに収まる範囲で可変（913pxを超えない） */
.common-tuning-cont02 .feature-col2,
.common-tuning-cont03 .feature-col2{
width:100%;
max-width:913px;
margin-left:auto;
margin-right:auto;
gap:167px;
}

.tu-p2-l,
.tu-p2-r{
flex:1 1 0;
min-width:0;
text-align:left;
}

.tu-p2i img{
display:block;
width:100%;
height:auto;
}


/* cont03: left:340pxを起点に画面右端までbleedさせる
   768〜1259pxはwrapperがmax-width:100%で画面幅ぴったり(左端0)になるため、
   100vw - 340pxで直接画面右端に届く。1260px以上はmin-width:1260px側でcalc(50vw+290px)に上書きする */
.common-staff-cont03 .common-wrapper::before {
content: "";
position: absolute;
z-index: -1;
background-image: url(../../img/mov-bg-staff.jpg);
background-repeat: no-repeat;
background-size: cover;
left: 290px;
top: -40px;
height: 335px;
width: calc(100vw - 290px);
}


.artist-case-col{
gap:40px;
}

.artist-debut-col {
gap: 40px;
}

.common-artist-debut{
width:calc((100% - 40px) / 2);
display:flex;
flex-direction:column;
gap:16px;
}

.common-artist-debut-thumb{
width:100%;
}
.common-artist-debut-thumb img{
display:block;
width:100%;
height:auto;
}


.common-andmore{
text-align:center;
font-size:24px;
font-weight:900;
margin:32px 0 48px;
}

.common-avid-logo{
width:373px;
height:50px;
margin:0 0 16px;
}
.common-avid-logo-att{
font-size:16px;
line-height:1.75;
font-weight:normal;
}

.common-staff-cont01 .common-wrapper{
margin:0 auto 40px;
}

/* cont02見出し: wrapperの右端(::beforeのcalc(50vw + 630px)と対になる位置)に正確に揃える */
.common-artist-cont02 h3,
.common-sc-cont02 h3,
.common-sc-cont04 h3,
.common-staff-cont02 h3,
.common-craft-cont02 h3{
width:fit-content;
max-width:1260px;
margin:0 calc(50vw - 630px) 0 auto;
text-align:left;
}
.common-craft-cont01 h3,
.common-craft-cont02 h3,
.common-craft-cont03 h3{
position:relative;
bottom:0;
}



.common-sc-cont01 .feature-col3{
gap:40px;
}
.common-sc-cont02 .feature-col2{
gap:40px;
}


.stack-btn{
width:447px;
position:absolute;
bottom:-37px;
left:50%;
transform:translate(-50%, 0);
}


/* STAFF */

.mv-caption{
text-align:right;
font-size:16px;
line-height:1.75;
margin:5px 0 0;
}


.common-course-inner{
width:1260px;
max-width:100%;
margin:0 auto;
padding:0 30px;
}

.logos-ttl{
font-size:24px;
font-weight:bold;
line-height:1;
margin:0 0 16px;
}

.staff-circle{
width:480px;
margin:0 auto 40px;
}

.course-common h3.staff-art-md{
width:100%;
position: relative;
display: block;
height: 60px;
line-height: 60px;
text-align: center;
font-size: 40px;
font-weight: bold;
color: #FFF11E;
background: #FF5A00;
margin: 0 auto 32px;
}


.course-common h3.cr-art-md{
width:100%;
position: relative;
display: block;
height: 60px;
line-height: 60px;
text-align: center;
font-size: 40px;
font-weight: bold;
color: #FFF;
background: #00B700;
margin: 0 auto 32px;
}

.common-staff-cont03 .staff-md{
padding-top:40px;
}

.common-staff-cont03 .common-wrapper{
height:400px;
}

.staff-cont03-lead{
width:672px;
font-size:18px;
line-height:1.55;
margin:0;
}

.staff-cont3-img{
width:600px;
height:412px;
position:absolute;
top:-15px;
left:50%;
margin:0;
}

.common-staff-cont02{
margin-bottom:128px;
}

.common-staff-cont02 .features-col4{
gap:40px;
}



.staff-photo-card3{
width:373px;
}

.staff-photo-card4{
width:270px;
}
.staff-col2-photo li{
width:270px;
}


/* TUNING */
.common-tuning-cont02 .tu-p2i-caption,
.common-tuning-cont03 .tu-p2i-caption{
font-size:18px;
line-height:1.5;
font-weight:500;
text-align:left;
margin:0 0 8px;
}

.tu-p1-l{
flex-wrap:wrap;
gap:20px;
}

.zeropro{
width:329px;
height:329px;
background:url(../../img/zeropro.png) no-repeat;
background-size:329px;
position:absolute;
bottom:-114px;
left:30px;
}

.common-craft-cont02 .features-col3{
gap:40px;
}

.common-craft-cont03 .features-col3{
gap:40px;
}
.common-craft-cont02 .cr-photo-card{
width:373px;
}

.common-craft-cont03 .cr-photo-card{
width:373px;
}


.craft-common-adj{
margin-bottom:40px;
}


}
@media (min-width: 1260px) {


/* staff cont03: 1260px以上はwrapperが中央寄せになるためcalc(50vw+400px)に切り替える */
.common-staff-cont03 .common-wrapper::before {
width: calc(50vw + 400px);
}

}