@charset "UTF-8";
/* CSS Document */

/*************************************************************************************************************************
* reset
*************************************************************************************************************************/
html{ height: 100%; font-size: 62.5%;}
body{ height: 100%; margin: 0; padding: 0; text-align: justify; text-justify: inter-ideograph; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
img{ max-width: 100%; border: 0; vertical-align: bottom;}
svg{ vertical-align: bottom;}
p{ margin: 0; padding: 0;}
a, a:hover{ text-decoration: none; outline: none;}
h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0; font-size: 0; line-height: 0;}
ul, dl, dt, dd{ margin: 0; padding: 0;}
li, ol{ margin: 0; padding: 0; list-style: none;}
header, nav, main, article, aside, section, footer{ display: block;}
*{ box-sizing: border-box;}
button{ cursor: pointer;}

@media screen and (max-width: 840px) {
	:root { --u: calc(100vw / 375); }
}

/**********************************************************
*　追加ベース
**********************************************************/
body{ font-family: YakuHanJP_Noto, "Noto Sans JP", sans-serif; font-weight: 500; color: #111; background: #fff;}
body.is-fixed{ overflow: hidden;}
img{ display: block;}
a{ color: #0068ff;}
a:hover{ color: #fe7c24;}

.sp-only { display: none !important; }
.pc-only { display: block !important; }

@media screen and (max-width: 840px) {
	.sp-only { display: block !important; }
	.pc-only { display: none !important; }
}

.page-wrap{ position: relative; }

/*	object-fit	*/
.ofi-cover{ width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover';}

/**********************************************************
*　スクロール出現アニメーション
**********************************************************/
.rv{ opacity: 0; transform: translateY(30px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1);}
.rv.is-in{ opacity: 1; transform: none;}
.rv-d80{ transition-delay: .08s;}
.rv-d100{ transition-delay: .1s;}
.rv-d120{ transition-delay: .12s;}
.rv-d140{ transition-delay: .14s;}
.rv-d200{ transition-delay: .2s;}

/**********************************************************
*　Header（スクロール時固定ヘッダー）
**********************************************************/
.header{ position: fixed; top: 0; left: 0; display: flex; justify-content: space-between; align-items: center; width: 100%; height: 90px; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.05); padding: 0 clamp(14px, 1.74vw, 32px); transform: translateY(-110%); transition: transform .35s ease; z-index: 1000;}
.header.is-shown{ transform: translateY(0);}

.header__left{ display: flex; align-items: center; gap: clamp(10px, 1.25vw, 24px); min-width: 0;}
.header__logo{ flex: 0 0 auto;}
.header__logo a{ display: block;}
.header__logo img{ height: 32px; width: auto;}
.header__note{ font-size: clamp(1rem, .75vw, 1.3rem); font-weight: 700; letter-spacing: .02em; white-space: nowrap; color: #000;}
.header__ttl{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block;}
.header__ttl img{ height: clamp(26px, 2.01vw, 36px); width: auto;}
.header__btns{ display: flex; align-items: center; gap: clamp(8px, .82vw, 15px); flex: 0 0 auto;}
.header__btns__item a{ display: block; width: clamp(28px, 2.09vw, 38px); height: clamp(28px, 2.09vw, 38px);}
.header__btns__item img{ width: 100%; height: 100%;}

@media screen and (max-width: 840px) {
	.header{ height: 64px;}
	.header__note{ display: none;}
	.header__logo img{ height: 24px;}
	.header__ttl img{ height: 18px;}
}

/**********************************************************
*　mv（ファーストビュー）
**********************************************************/
.mv{ position: relative; width: 100%; height: 100vh; min-height: 420px; background: #fff; overflow: hidden;}

/*	背景スライドショー（slick / fade）	*/
.mv__bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.mv__bg .slick-list,
.mv__bg .slick-track{ height: 100%;}
.mv__bg__item{ height: 100vh;}
.mv__dim{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.3); z-index: 1; pointer-events: none;}

/*	PC: 写真コラージュ	*/
.mv__cllg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; transform: scale(.95); transform-origin: 50% 50%;}
.mv__cllg__item{ position: absolute; width: 30.46%; aspect-ratio: 1080/608;}
.mv__cllg__item--1{ left: 5.7%; top: 15.2%; z-index: 2;}
.mv__cllg__item--2{ left: 38.4%; top: 4%; z-index: 4;}
.mv__cllg__item--3{ left: 62.8%; top: 13.9%; z-index: 3;}
.mv__cllg__item--4{ left: 65%; top: 54.6%; z-index: 2;}
.mv__cllg__item--5{ left: 4.6%; top: 55.3%; z-index: 3;}
.mv__cllg__item--6{ left: 31.8%; top: 62.5%; z-index: 4;}

/*	SP: 人物写真スライダー（slick / 押し出し）	*/
.mv__gal{ position: absolute; left: 0; top: 25.9%; width: 100%; z-index: 2;}
.mv__gal__item img{ width: 100%;}

/*	タイトル	*/
.mv__ttl{ position: absolute; left: 50%; top: 34%; transform: translateX(-50%); width: min(60%, 1032px); z-index: 5; pointer-events: none;}
.mv__ttl img{ width: 100%; filter: drop-shadow(0 0 30px rgba(0,0,0,.3));}

/*	左上ブランド表記	*/
.mv__brand{ position: absolute; top: 0; left: 0; right: 0; display: flex; align-items: center; gap: clamp(10px, 1.2vw, 20px); padding: clamp(12px, 1.5vw, 24px) clamp(14px, 2vw, 30px); z-index: 6;}
.mv__brand__logo{ height: clamp(22px, 2vw, 34px); width: auto; filter: drop-shadow(0 1px 6px rgba(0,0,0,.25));}
.mv__brand__note{ color: #fff; font-size: clamp(1rem, .82vw, 1.4rem); font-weight: 700; letter-spacing: .04em; white-space: nowrap; text-shadow: 0 1px 8px rgba(0,0,0,.35);}

/*	SP: 資料請求ピルボタン	*/
.mv__cta{ position: absolute; left: 5%; right: 5%; bottom: 2.4%; justify-content: center; align-items: center; background: #f4661c; border-radius: 100px; padding: 3.2vw 0; font-size: 1.5rem; font-weight: 700; letter-spacing: .04em; line-height: 1; color: #fff; z-index: 4;}
.mv__cta:before{ width: 4.6vw; height: 5.5vw; background: url("../img/icon_paper.svg") no-repeat 50% 50%/100% auto; margin-right: 2.4vw; content: "";}
.mv__cta:hover{ color: #fff;}

@media screen and (max-width: 840px) {
	.mv{ height: 100svh; min-height: 568px;}
	.mv__bg__item{ height: 100svh;}
	.mv__cta{ display: flex !important;}
	.mv__ttl{ left: 2%; transform: none; width: 96%; top: calc(25.9% + 66.8vw - 47px); z-index: 3;}
	.mv__brand{ gap: 3.4vw; padding: 4vw 4.3%;}
	.mv__brand__logo{ height: 26px; filter: none;}
	.mv__brand__note{ font-size: 1.2rem; letter-spacing: .03em; text-shadow: 0 1px 6px rgba(0,0,0,.3);}
}

/**********************************************************
*　mv 登場アニメーション（PCのみ）
*　背景 → 学生写真（中央上から時計回り） → タイトル
**********************************************************/
@media screen and (min-width: 841px) {
	.mv__bg,
	.mv__dim{ opacity: 0; transition: opacity 1s ease;}
	.mv.is-loaded .mv__bg,
	.mv.is-loaded .mv__dim{ opacity: 1;}

	.mv__cllg__item{ opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1);}
	.mv.is-loaded .mv__cllg__item{ opacity: 1; transform: none;}
	.mv__cllg__item--2{ transition-delay: .9s;}
	.mv__cllg__item--3{ transition-delay: 1.15s;}
	.mv__cllg__item--4{ transition-delay: 1.4s;}
	.mv__cllg__item--6{ transition-delay: 1.65s;}
	.mv__cllg__item--5{ transition-delay: 1.9s;}
	.mv__cllg__item--1{ transition-delay: 2.15s;}

	.mv__ttl{ opacity: 0; transform: translateX(-50%) scale(.96); transition: opacity .8s ease 2.6s, transform .8s cubic-bezier(.2, .7, .2, 1) 2.6s;}
	.mv.is-loaded .mv__ttl{ opacity: 1; transform: translateX(-50%) scale(1);}
}

/**********************************************************
*　イントロ
**********************************************************/
.intro{ position: relative; background: #fff; padding: clamp(110px, 9vw, 160px) 20px clamp(46px, 5.5vw, 100px); text-align: center; z-index: 1;}
.intro__ttl{ display: flex; justify-content: center;}
.intro__ttl img{ width: min(29.6vw, 511px); height: auto;}
.intro__txt{ margin: clamp(26px, 3vw, 43px) auto 0; max-width: 860px; font-size: clamp(1.3rem, 1.02vw, 1.6rem); font-weight: 500; line-height: 2; text-align: center; text-wrap: pretty;}
.intro__note{ margin-top: clamp(24px, 2.8vw, 27px); font-size: clamp(1rem, .74vw, 1.1rem); font-weight: 500; text-align: center; color: #222;}

@media screen and (max-width: 840px) {
	.intro__ttl{ margin-bottom: 28px;}
	.intro__ttl img{ width: auto; height: 56px;}
	.intro__txt{ font-size: 1.4rem; line-height: 2.3;}
	.intro__note{ font-size: 1rem;}
}
@media screen and (min-width: 841px) {
	.intro__txt{ font-weight: 400; letter-spacing: -0.03em; }
}

/**********************************************************
*　動画再生ボタン（共通）
**********************************************************/
.movie-btn{ display: block; position: relative; width: 100%; aspect-ratio: 1600/901; background: #1a1a1a; border: clamp(3px, .32vw, 6px) solid #fff; padding: 0; overflow: hidden;}
.movie-btn__img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border: none;}
.movie-btn__play{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); height: 40px; width: auto; filter: drop-shadow(0 6px 18px rgba(0,0,0,.3));}

@media screen and (min-width: 841px) {
	.movie-btn:hover{ filter: brightness(1.06);}
	.movie-btn__img{ transition: transform .5s ease;}
	.movie-btn:hover .movie-btn__img{ transform: scale(1.05);}
}
@media screen and (max-width: 840px) {
	.movie-btn{ border-width: 2px 0 2px; border-style: solid; border-color: #fff; }
	.movie-btn__play{ left: 48%; top: 46%; height: auto; width: calc(43 * var(--u)); filter: drop-shadow(0 4px 14px rgba(0,0,0,.3));}
}

/*	コンセプト: COMING SOON（非インタラクティブ）	*/
div.movie-btn{ cursor: default;}
@media screen and (min-width: 841px) {
	div.movie-btn:hover{ filter: none;}
	div.movie-btn:hover .movie-btn__img{ transform: none;}
}

.skew { clip-path: polygon(0 28.66%, 100% 0, 100% 71.34%, 0 100% ); }
.skew img { width: 100%; height: 100%; object-fit: cover; }
.skew--dept { aspect-ratio: 375 / 667; clip-path: polygon(0 20.39%, 100% 0, 100% 79.61%, 0 100%); }
@media screen and (min-width: 841px) {
	.skew { aspect-ratio: 1728 / 1227.2711; clip-path: polygon(0 51.26%, 100% 0, 100% 48.74%, 0 100%); }
}
/**********************************************************
*　コンセプトムービー
**********************************************************/
.concept{ position: relative; width: 100%; aspect-ratio: 1728/1227; z-index: 0;}
.concept__bg{ position: absolute; top: 0; left: 0; }

.concept .movie-btn{ position: absolute; left: 26.9%; top: 20%; width: 46.3%;}

@media screen and (max-width: 840px) {
	.concept{ aspect-ratio: 750/930;}
	.concept__bg{  }
	.concept .movie-btn{ left: 0; top: 50%; transform: translateY(-70%); width: 100%;}
}
@media screen and (min-width: 841px) {
	.concept { margin-top: -10vw; margin-bottom: 285px; z-index: 10; }
}

/*	SCROLLガイド（線に沿って丸が下降・文字が同期して点滅）	*/
.scroll-guide{ position: absolute; left: 50%; top: 46.1vw; width: 1px; height: 13.4vw; background: #000; pointer-events: none;}
.scroll-guide__dot{ position: absolute; left: 50%; top: 0; width: .64vw; aspect-ratio: 1/1; border-radius: 50%; background: #000; transform: translate(-50%, -50%); animation: scrollDot 2.4s cubic-bezier(.45,0,.55,1) infinite;}
.scroll-guide__txt{ position: absolute; left: 1.25vw; top: 69%; width: 6.8vw; max-width: none; transform: translateY(-50%);}
@keyframes scrollDot{
	0%{ top: 0; opacity: 0;}
	10%{ opacity: 1;}
	85%{ top: 100%; opacity: 1;}
	100%{ top: 100%; opacity: 0;}
}
@media screen and (max-width: 840px) {
	.scroll-guide{ top: 91.4vw; width: 1px; height: 38.4vw;}
	.scroll-guide__dot{ width: 2.1vw;}
	.scroll-guide__txt{ left: 3.5vw; width: 19.7vw;}
}

/**********************************************************
*　学科セクション
*　学科ごとの差分（見出しSVGの寸法・位置・引用幅）はカスタムプロパティで管理
**********************************************************/
.dept{ position: relative;  z-index: 1; }/*	padding: clamp(46px, 7vw, 168px) 0 clamp(26px, 4vw, 120px);	*/
.dept__bg{ position: absolute; left: 0; top: calc(50% - 157px); transform: translateY(-50%); z-index: 0;}

.dept--1 .dept__bg { background-color: #ff7b00; }
.dept--2 .dept__bg { background-color: #0067ff; }
.dept--3 .dept__bg { background-color: #ff2f2f; }
.dept--4 .dept__bg { background-color: #ec5390; }
.dept--5 .dept__bg { background-color: #009611; }
.dept--6 .dept__bg { background-color: #ae10de; }

.dept__bg img { mix-blend-mode: overlay; opacity: .5; }
.dept__inner{ position: relative; max-width: 1728px; margin: 0 auto;}
.dept__body{ position: relative; display: flex; align-items: flex-start; margin-top: calc(min(9.25vw, 160px) + clamp(-52px, -3vw, -20px));}
.dept__media{ position: relative; flex: 0 0 46.2%; width: 46.2%; margin-left: 18.2%;}



/*	見出し（差の絶対値・乗算の2層合成）	*/
.blend-ttl{ position: absolute; display: block;}
.blend-ttl img{ width: 100%; height: 100%;}
.blend-ttl--diff .blend-ttl__box{ mix-blend-mode: difference;}
.blend-ttl--multi .blend-ttl__box{ mix-blend-mode: multiply;}
.blend-ttl__txt{ position: absolute; top: 0; left: 0;}

.dept__ttl1,
.dept__ttl2 { pointer-events: none; }
.dept__ttl1{ left: calc(-27.3% + 105px); top: calc(clamp(20px, 3vw, 42px) - min(9.25vw, 160px)); width: var(--ttl1-w); aspect-ratio: var(--ttl1-ar);}
.dept__ttl2{ left: 69.2%; top: calc(100% + clamp(-58px, -3.4vw, -22px) - 20px); width: var(--ttl2-w); aspect-ratio: var(--ttl2-ar);}
/*	right: calc(-62.34% + var(--ttl2-right));  	*/
.dept__label{ position: absolute; left: -7%; top: calc(70% - 45px); width: 30.063%; z-index: 3;}
.dept__fire{ position: absolute; left: calc(90.04% + 11px); top: calc(31.52% - 367px); width: 18.79%;}
.dept__voice{ position: relative; top: -20px; margin: 8.2% 0 0 -5.6%; width: var(--voice-w);}
.dept__voice img{ position: relative; width: 100%; z-index: 1;}
.dept__thumb{ position: relative; top: -60px; width: calc(88.5% - 200px); margin-left: calc(8.4% + 70px); margin-top: calc(clamp(-58px, -3.4vw, -22px) + min(9.25vw, 160px) + clamp(10px, 1.2vw, 20px));}
.dept__thumb img{ width: 100%;}

@media screen and (max-width: 840px) {
	.dept{ padding: 0; overflow-x: clip;}
	.dept--first{ margin-top: 32vw;}
	.dept__bg{ top: -30px; transform: none; height: auto; object-fit: unset;}
	.dept__inner{ padding: 8vw 0 12vw;}
	.dept__body{ display: block; margin-top: 0;}
	.dept__media{ width: 100%; margin: 6.9vw 0 0;}
	.dept__ttl1{ left: calc(20 * var(--u)); top: -6.9vw; width: auto; height: calc(48 * var(--u)); }
	.dept__ttl2{ left: calc(142 * var(--u)); top: auto; bottom: -5.7vw; width: auto; height: calc(48 * var(--u));}
	/* 出現アニメの transform と競合するため translateY は使わない（ラベルは正方形: はみ出し量 = 幅×比率） */
	.dept__label{ left: calc(20 * var(--u)); top: auto; bottom: calc(-43 * var(--u)); transform: none; width: calc(110 * var(--u));}
	.dept__fire{ left: auto; right: calc(21 * var(--u)); top: calc(100% - 6vw - 110px); width: calc(60 * var(--u));}
	.dept__voice{ top: calc(32 * var(--u)); width: auto; margin: 0 calc(20 * var(--u)) 0; z-index: 9;}
	.dept__voice img { width: auto; height: calc(134 * var(--u)); }
	.dept__thumb{ top: 0; width: 100%; margin: calc(42 * var(--u)) 0 0;}
}
@media screen and (min-width: 841px) {
	.dept+.dept { margin-top: 380px; }
}

/*	学科別差分	*/
.dept--1{ --ttl1-w: min(47.5vw, 821px); --ttl1-ar: 821.21/160; --ttl2-w: min(33.8vw, 585px); --ttl2-ar: 584.85/160; --ttl2-right: 170px; --voice-w: 25.511%;}
.dept--2{ --ttl1-w: min(41.9vw, 725px); --ttl1-ar: 724.59/160; --ttl2-w: min(39.7vw, 685px); --ttl2-ar: 685.3/160; --ttl2-right: 60px; --voice-w: 23.9%;}
.dept--3{ --ttl1-w: min(43vw, 744px); --ttl1-ar: 743.93/160; --ttl2-w: min(29.2vw, 505px); --ttl2-ar: 505.14/160; --ttl2-right: 250px; --voice-w: 22.8%;}
.dept--4{ --ttl1-w: min(47.5vw, 821px); --ttl1-ar: 821.21/160; --ttl2-w: min(35vw, 605px); --ttl2-ar: 605.38/160; --ttl2-right: 150px; --voice-w: 21.528%;}
.dept--5{ --ttl1-w: min(40.1vw, 693px); --ttl1-ar: 692.89/160; --ttl2-w: min(34.9vw, 603px); --ttl2-ar: 603.09/160; --ttl2-right: 150px; --voice-w: 22.9%;}
.dept--6{ --ttl1-w: min(44.7vw, 773px); --ttl1-ar: 772.73/160; --ttl2-w: min(41.2vw, 712px); --ttl2-ar: 711.7/160; --ttl2-right: 20px; --voice-w: 23%;}

@media screen and (min-width: 841px) {
	.skew.dept__bg { aspect-ratio: 1728 / 1422; clip-path: polygon(0 44.23%, 100% 0, 100% 55.77%, 0 100%); }
}


/**********************************************************
*　Footer（関連リンク・ロゴ）
**********************************************************/
.fband{ position: relative; display: flex; justify-content: center; align-items: center; width: 100%; aspect-ratio: 3456/730; background: #0b3a5e; margin-top: clamp(30px, 5vw, 90px); overflow: hidden;}
.fband__bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

.bnr-list{ position: relative; display: flex; justify-content: center; align-items: center; gap: 2.7%; width: 100%; z-index: 1;}
.bnr-list__item{ position: relative; width: 18.519%;}
.bnr-list__item a{ position: relative; display: block; box-shadow: 0 6px 24px rgba(0, 10, 30, .35);}
.bnr-list__item__frame{ display: block; overflow: hidden;}
.bnr-list__item__img{ width: 100%; aspect-ratio: 640/401; object-fit: cover;}
@media screen and (min-width: 841px) {
	.bnr-list__item a:hover{ filter: brightness(1.08);}
	.bnr-list__item__img{ transition: transform .5s ease;}
	.bnr-list__item a:hover .bnr-list__item__img{ transform: scale(1.05);}
}
.bnr-list__item__txt{ position: absolute; left: 50%; bottom: -7%; transform: translateX(-50%); display: flex; justify-content: center; align-items: center; background: #000; padding: .55em .7em; font-size: clamp(1rem, .85vw, 1.45rem); font-weight: 700; line-height: 1; letter-spacing: .04em; white-space: nowrap; color: #fff;}

.footer__logo{ display: flex; justify-content: center; padding: clamp(30px, 3.6vw, 60px) 20px;}
.footer__logo a{ display: block;}
.footer__logo img{ height: 36px; width: auto;}

.copyright{ display: flex; justify-content: center; align-items: center; height: 50px; background: #000; font-size: clamp(1rem, .72vw, 1.25rem); font-weight: 500; letter-spacing: .14em; color: #fff;}

@media screen and (max-width: 840px) {
	.fband{ aspect-ratio: 750/446; margin-top: calc(33 * var(--u)); }
	.fband__bg{ height: auto; object-fit: unset;}
	.bnr-list{ display: block; width: 100%;}
	.bnr-list .slick-list{ padding: 0 19.5vw 4vw !important;}
	.bnr-list__item{ width: auto; margin: 0 2.5vw;}
	.bnr-list__item__txt{ bottom: 0; transform: translate(-50%, 50%); height: 30px; padding: 0 .7em; font-size: 1.3rem;}
	.footer__logo{ padding: 12vw 20px;}
	.copyright{ font-size: 1rem; height: auto; min-height: calc(40 * var(--u)); padding-bottom: ; padding: calc(10 * var(--u)) 10px calc(74 * var(--u));}
}

@media screen and (min-width: 841px) {
	.fband { margin-top: 9.318vw; }
	.footer__logo img { height: 50px; }
}
@media screen and (min-width: 1921px) {
	.footer { position: relative; z-index: 10; }
}

/**********************************************************
*　常時固定ボタン（資料請求）
**********************************************************/
.fixed-button{ position: fixed; left: 0; right: 0; bottom: 14px; transform: translateY(calc(100% + 20px)); opacity: 0; z-index: 100;}
.fixed-button__btn a{ display: flex; justify-content: center; align-items: center; width: 90%; background-color: #f4661c; border-radius: 100px; margin-left: auto; margin-right: auto; padding: 3.2vw 0; transition: .4s; font-size: 1.5rem; font-weight: 700; line-height: 1; letter-spacing: .04em; color: #fff;}
.fixed-button__btn a:before{ width: 4.6vw; height: 5.5vw; background: url("../img/icon_paper.svg") no-repeat 50% 50%/100% auto; margin-right: 2.4vw; content: "";}
.fixed-button__btn a span:nth-of-type(2){ margin-left: 0;}
.fixed-button__btn a:visited,
.fixed-button__btn a:active{ color: #fff;}

.fixed-button.is-visible{ animation: fbshow .4s ease 0s forwards;}
.fixed-button.is-default{ animation: fbhide .4s ease 0s forwards;}
.fixed-button.is-first{ animation: none;}

@keyframes fbshow{
	0%{ opacity: 1; transform: translateY(calc(100% + 20px));}
	100%{ opacity: 1; transform: translateY(0%);}
}
@keyframes fbhide{
	0%{ opacity: 1; transform: translateY(0%);}
	100%{ opacity: 1; transform: translateY(calc(100% + 20px));}
}

@media screen and (min-width: 841px) {
	.fixed-button{ left: auto; right: clamp(14px, 2vw, 42px); bottom: clamp(14px, 2vw, 42px); transform: none; opacity: 1; animation: none !important;}
	.fixed-button__btn a{ flex-direction: column; gap: 2px; width: clamp(86px, 7.2vw, 120px); aspect-ratio: 1/1; border-radius: 50%; padding: 0; font-size: clamp(1rem, .85vw, 1.4rem); line-height: 1.2; text-align: center; transition: transform .2s ease, background-color .4s ease;}
	.fixed-button__btn a:before{ width: 17%; height: 20%; margin: 0 0 6px 0;}
	.fixed-button__btn a:hover{ transform: scale(1.06); background-color: #00507e;}
	/* フッターロゴの中心軸で停止（.page-wrap 基準の絶対配置に切替） */
	.fixed-button.is-abs{ position: absolute; bottom: calc(clamp(30px, 3.6vw, 60px) + 18px - clamp(43px, 3.6vw, 59px));}
}

/**********************************************************
*　動画モーダル
**********************************************************/
.modal{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.9); display: none; padding: 4vmin; z-index: 5000;}
.modal__inner{ width: 100%; height: 100%;}
.modal__content{ width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.modal__box{ position: relative; width: clamp(560px, 46.3vw, 925px);}
.modal__close{ position: absolute; right: -8px; top: -56px; width: 44px; height: 44px; border-radius: 50%; border: none; background: rgba(45,45,45,.92); font-size: 1.8rem; line-height: 1; color: #fff; z-index: 2;}

.youtube-wrap{ position: relative; width: 100%; aspect-ratio: 16/9; background: #000;}
.youtube-wrap div[id],
.youtube-wrap iframe{ display: none;}
.youtube-wrap iframe.is-playing{ position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; border: 0;}
.youtube-wrap__blank{ display: none;}
.youtube-wrap.is-blank .youtube-wrap__blank{ position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: #fff;}
.youtube-wrap__blank img{ width: 78px;}

@media screen and (max-width: 840px) {
	.modal{ padding: 0;}
	.modal__box{ width: 100%; padding: 0;}
	.modal__close{ right: auto; left: 50%; top: auto; bottom: -77px; transform: translateX(-50%); width: 54px; height: 54px; background: rgba(40,40,40,.92); font-size: 2rem;}
}