@charset "UTF-8";

/*----------------------------
	変数
----------------------------*/
:root {
	--gf-text: #231815;		/* 本文 */
	--gf-green: #1eaa39;		/* 01 タイトル帯 */
	--gf-green-line: #42b049;	/* 01 タイトル帯の斜線 */
	--gf-green-dk: #009233;		/* 01 キャッチ */
	--gf-teal: #008376;		/* 内定在学生 見出し */
	--gf-teal-name: #008a78;	/* 内定在学生 名前 */
	--gf-mint: #d3e8df;		/* 内定在学生 パネル */
	--gf-pink: #e85377;		/* 02 タイトル帯・枠線・● */
	--gf-pink-line: #e96081;	/* 02 タイトル帯の斜線 */
	--gf-pink-lt: #f6c8d6;		/* 02 体験名の背景 */
	--gf-pink-txt: #e6326e;		/* 02 体験名 */
	--gf-pink-catch: #d8305c;	/* 02 キャッチ */
	--gf-red: #e6222e;		/* 03 タイトル帯 */
	--gf-red-line: #e84737;		/* 03 タイトル帯の斜線 */
	--gf-red-catch: #e5002d;	/* 03 キャッチ */
	--gf-blue: #0099d9;		/* 04 タイトル帯・キャッチ */
	--gf-blue-line: #00aecb;	/* 04 タイトル帯の斜線 */
	--gf-orange: #ea6000;		/* 高校生の声 */
	--gf-orange-lt: #fbd9a8;	/* 高校生の声 ラベル下の斜線 */
	--gf-dot: rgba(35, 24, 21, .35);	/* 点線（カード・声） */
}
@media screen and (max-width: 979px) {
	:root { --u: calc(100vw / 375); }
}


/*----------------------------
	共通
----------------------------*/
.gf-pickup-sec { overflow-x: clip; }
.gf-pickup { color: var(--gf-text); }
.gf-pickup img { display: block; width: 100%; height: auto; }
@media screen and (max-width: 979px) {
	.gf-pc { display: none !important; }
	.gf-pickup { padding: calc(15 * var(--u)) 0 calc(90 * var(--u)); }
}
@media screen and (min-width: 980px) {
	.gf-sp { display: none !important; }
	.gf-pickup { width: 960px; margin: 0 calc((100% - 960px) / 2); padding: 66px 0 150px; }
}

/*----------------------------
	セクション見出し（番号バッジ + キャッチ + 斜線の帯）
----------------------------*/
.gf-sec { position: relative; }
.gf-head { position: relative; }
.gf-head__num { position: absolute; z-index: 1; }

.gf-head__line { display: block; padding: 0 .27em; background: repeating-linear-gradient(45deg, var(--gf-band) 0 8.6px, var(--gf-band-line) 8.6px 11.45px); font-family: var(--gf-ff-pop); font-weight: 700; color: #fff; line-height: 1.265; white-space: nowrap; }
.gf-head__line sup { font-size: .55em; line-height: 1; vertical-align: .75em; }
.gf-sec--01 { --gf-band: var(--gf-green); --gf-band-line: var(--gf-green-line); }
.gf-sec--02 { --gf-band: var(--gf-pink); --gf-band-line: var(--gf-pink-line); }
.gf-sec--03 { --gf-band: var(--gf-red); --gf-band-line: var(--gf-red-line); }
.gf-sec--04 { --gf-band: var(--gf-blue); --gf-band-line: var(--gf-blue-line); }
@media screen and (max-width: 979px) {
	.gf-sec:not(:last-child) { margin-bottom: calc(50 * var(--u)); }
	.gf-head__num { top: 0; right: 0; width: calc(160 * var(--u)); }
	.gf-head__line { font-size: calc(40 * var(--u)); }
	.gf-head__line + .gf-head__line { margin-top: calc(5.4 * var(--u)); }
}
@media screen and (min-width: 980px) {
	.gf-sec:not(:last-child) { margin-bottom: 125px; }
	.gf-head {  }
	.gf-head__num { top: -25px; left: -15px; width: 170px; }
	.gf-head__line { font-size: 4.0rem; }
	.gf-head__line + .gf-head__line { margin-top: 5.4px; }
}

/*----------------------------
	01 特別講演
----------------------------*/
.gf-sec01__ph { position: relative; }
.gf-sec01__photo img { aspect-ratio: 335/199; object-fit: cover; }
.gf-sec01__circle { position: absolute; border-radius: 50%; box-shadow: 0 0 0 3px var(--gf-green), 4px 4px 0 3px rgba(0, 0, 0, .18); overflow: hidden; z-index: 1; }
.gf-sec01__circle img { aspect-ratio: 1/1; object-fit: cover; }
.gf-sec01__txt { text-align: justify; }
@media screen and (max-width: 979px) {
	.gf-sec01__body { margin-top: calc(42 * var(--u)); }
	.gf-sec01__circle--01 { top: calc(-25 * var(--u)); right: calc(9 * var(--u)); width: calc(104 * var(--u)); }
	.gf-sec01__circle--02 { top: calc(148 * var(--u)); left: calc(8 * var(--u)); width: calc(90 * var(--u)); }
	.gf-sec01__txt { margin-top: calc(50 * var(--u)); font-size: calc(14 * var(--u)); line-height: 1.75; letter-spacing: .04em; }
}
@media screen and (min-width: 980px) {
	.gf-sec--01 { display: flex; justify-content: space-between; align-items: flex-end; }
	.gf-sec01__main { width: 623px; }
	.gf-sec01__body { display: flex; justify-content: space-between; align-items: flex-start; margin-top: 38px; }
	.gf-sec01__ph { width: 310px; }
	.gf-sec01__photo img { aspect-ratio: 310/182; }
	.gf-sec01__circle--01 { top: -34px; right: -13px; width: 102px; }
	.gf-sec01__circle--02 { top: 111px; left: -17px; width: 90px; }
	.gf-sec01__txt { width: 283px; font-size: 1.4rem; line-height: 1.75; letter-spacing: .04em; }
	.gf-sec--02 .gf-head { width: 600px; margin-left: -20px; }
	.gf-sec--03 .gf-head { width: 530px; }
}

/* 内定在学生パネル */
.gf-senpai { background: var(--gf-mint); }
.gf-senpai__ttl { display: flex; justify-content: center; align-items: center; background: var(--gf-teal); box-shadow: inset 0 0 0 var(--gf-senpai-inset) var(--gf-teal), inset 0 0 0 calc(var(--gf-senpai-inset) + .8px) var(--gf-mint); font-weight: 700; color: #fff; line-height: 1.3; text-align: center; }
.gf-senpai__item { display: flex; align-items: center; }
.gf-senpai__item + .gf-senpai__item { position: relative; }
.gf-senpai__item + .gf-senpai__item::before { position: absolute; top: 0; height: 2.3px; background: radial-gradient(circle, var(--gf-text) 1.1px, transparent 1.3px) left center / 9px 2.3px repeat-x; content: ""; }
.gf-senpai__ph { flex: 0 0 auto; border-radius: 50%; background: #fff; overflow: hidden; }
.gf-senpai__ph img { aspect-ratio: 1/1; object-fit: contain; }
.gf-senpai__name { display: flex; align-items: baseline; line-height: 1.3; }
.gf-senpai__name::before { display: inline-block; flex: 0 0 auto; width: .6em; height: .7em; margin-right: .1em; background: #000; clip-path: polygon(0 0, 100% 50%, 0 100%); content: ""; }
.gf-senpai__name-main { margin-right: .35em; font-weight: 700; color: var(--gf-teal-name); letter-spacing: .03em; }
.gf-senpai__san { font-size: .77em; }
.gf-senpai__dept { line-height: 1.4; }
@media screen and (max-width: 979px) {
	.gf-senpai { margin-top: calc(16 * var(--u)); padding: calc(11.6 * var(--u)) calc(11.6 * var(--u)) calc(23 * var(--u)); }
	.gf-senpai__ttl { --gf-senpai-inset: calc(5.7 * var(--u)); height: calc(80.9 * var(--u)); font-size: calc(23.8 * var(--u)); }
	.gf-senpai__list { margin-top: calc(16 * var(--u)); }
	.gf-senpai__item { padding-left: calc(17.4 * var(--u)); }
	.gf-senpai__item + .gf-senpai__item { margin-top: calc(19 * var(--u)); padding-top: calc(19 * var(--u)); }
	.gf-senpai__item + .gf-senpai__item::before { left: calc(29.4 * var(--u)); width: calc(254 * var(--u)); }
	.gf-senpai__ph { width: calc(92 * var(--u)); margin-right: calc(15 * var(--u)); }
	.gf-senpai__name { font-size: calc(22 * var(--u)); }
	.gf-senpai__dept { margin-top: calc(3 * var(--u)); font-size: calc(13.5 * var(--u)); }
}
@media screen and (min-width: 980px) {
	.gf-senpai { flex: 0 0 auto; width: 309px; margin-top: 25px; padding: 10.7px 10.7px 20px; }
	.gf-senpai__ttl { --gf-senpai-inset: 5.3px; height: 74.6px; font-size: 2.2rem; }
	.gf-senpai__list { margin-top: 15.3px; }
	.gf-senpai__item { padding-left: 15.3px; }
	.gf-senpai__item + .gf-senpai__item { margin-top: 16px; padding-top: 18px; }
	.gf-senpai__item + .gf-senpai__item::before { left: 27px; width: 234px; }
	.gf-senpai__ph { width: 86px; margin-right: 13.6px; }
	.gf-senpai__name { font-size: 2.03rem; }
	.gf-senpai__dept { margin-top: 2px; font-size: 1.25rem; }
}

/*----------------------------
	02 選べる体験
----------------------------*/

.gf-exp__ttl { position: relative; display: flex; justify-content: center; align-items: center; background: var(--gf-pink-lt); font-family: var(--gf-ff-pop); font-weight: 700; color: var(--gf-pink-txt); line-height: 1.265; text-align: center; }
.gf-exp__ttl::after { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: var(--gf-pink-lt); clip-path: polygon(0 0, 100% 0, 50% 100%); content: ""; }
.gf-exp__ph img { aspect-ratio: 335/173; object-fit: cover; }
.gf-exp__txt { font-weight: 700; text-align: center; }
.gf-exp__rec { display: flex; align-items: center; background: radial-gradient(circle, var(--gf-dot) 1px, transparent 1.2px) left top / 6.5px 2px repeat-x; }
.gf-exp__rec-ttl { display: flex; flex: 0 0 auto; justify-content: center; align-items: center; box-shadow: inset 0 0 0 2px var(--gf-pink); font-family: var(--gf-ff-pop); font-weight: 700; line-height: 1.3; }
.gf-exp__rec-list li { display: flex; align-items: center; white-space: nowrap; }
.gf-exp__rec-list li::before { flex: 0 0 auto; width: .6em; height: .6em; margin-right: .2em; border-radius: 50%; background: var(--gf-pink); content: ""; }
@media screen and (max-width: 979px) {
	.gf-exp::before { display: none; }
	.gf-exp { margin-top: calc(41 * var(--u)); }
	.gf-exp__item + .gf-exp__item { margin-top: calc(40 * var(--u)); }
	.gf-exp__ttl { height: calc(77.8 * var(--u)); font-size: calc(22.4 * var(--u)); }
	.gf-exp__ttl::after { width: calc(13 * var(--u)); height: calc(11 * var(--u)); }
	.gf-exp__ph { margin-top: calc(16 * var(--u)); }
	.gf-exp__txt { margin-top: calc(20 * var(--u)); font-size: calc(18 * var(--u)); line-height: 1.415; }
	.gf-exp__rec { margin-top: calc(11 * var(--u)); padding-top: calc(21 * var(--u)); }
	.gf-exp__rec-ttl { width: calc(149.6 * var(--u)); height: calc(59.8 * var(--u)); font-size: calc(13.5 * var(--u)); }
	.gf-exp__rec-list { margin-left: calc(12 * var(--u)); font-size: calc(13.5 * var(--u)); line-height: 1.67; }
}
@media screen and (min-width: 980px) {
	.gf-sec02__deco { top: -56px; right: -5px; width: 495px; }
	.gf-exp { position: relative; display: flex; justify-content: space-between; }
	.gf-exp::before { position: absolute; bottom: 100%; right: -10px; display: block; width: 428px; aspect-ratio: 428/230; background: url("../img/ph_evt_2_main.png") no-repeat 50% 100%/contain; content: ""; }
	.gf-exp__item { width: 298.7px; }
	.gf-exp__ttl { height: 69.3px; font-size: 2.0rem; }
	.gf-exp__ttl::after { width: 14px; height: 9px; }
	.gf-exp__ph { margin-top: 14.5px; }
	.gf-exp__ph img { aspect-ratio: 299/155; }
	.gf-exp__txt { margin-top: 18px; font-size: 1.6rem; line-height: 1.42; }
	.gf-exp__rec { margin-top: 10px; padding-top: 18px; }
	.gf-exp__rec-ttl { width: 133.3px; height: 53.3px; font-size: 1.2rem; }
	.gf-exp__rec-list { margin-left: 10.7px; font-size: 1.2rem; line-height: 1.67; }
}

/*----------------------------
	03 OIC生ゲーム作品プレイコーナー
----------------------------*/
.gf-games__monitor { position: relative; aspect-ratio: 300/248; }
.gf-games__name { font-weight: 700; text-align: center; }
@media screen and (max-width: 979px) {
	.gf-games::before { display: none; }
	.gf-games { margin-top: calc(40 * var(--u)); padding: 0 calc(17.5 * var(--u)); }
	.gf-games__item + .gf-games__item { margin-top: calc(35 * var(--u)); }
	.gf-games__name { margin-top: calc(26 * var(--u)); font-size: calc(15 * var(--u)); line-height: 1.5; }
}
@media screen and (min-width: 980px) {
	.gf-games { position: relative; display: flex; justify-content: space-between; margin-top: 43px; }
	.gf-games::before { position: absolute; bottom: 100%; right: 10px; display: block; width: 406px; aspect-ratio: 406/210; background: url("../img/ph_evt_3_deco.png") no-repeat center/contain; content: ""; }
	.gf-games__item { width: 273px; }
	.gf-games__name { margin-top: 24px; font-size: 1.37rem; line-height: 1.5; }
}

/*----------------------------
	04 PlayStation®5 争奪戦
----------------------------*/
.gf-sec04__ph { position: relative; }
.gf-sec04__photo img { aspect-ratio: 335/217; object-fit: cover; }
.gf-sec04__deco { position: absolute; z-index: 1; }
.gf-sec04__txt { font-weight: 700; }
@media screen and (max-width: 979px) {
	.gf-sec04__txt { width: calc(200 * var(--u)); margin-top: calc(20 * var(--u)); font-size: calc(14 * var(--u)); line-height: 1.75; }
	.gf-sec04__ph { margin-top: calc(11 * var(--u)); }
	.gf-sec04__deco { top: calc(-165 * var(--u)); right: calc(-1 * var(--u)); width: calc(133 * var(--u));  }
}
@media screen and (min-width: 980px) {
	.gf-sec--04 { display: flex; justify-content: space-between; align-items: flex-start; }
	.gf-sec04__main { width: 500px; }
	.gf-sec04__txt { width: 390px; margin-top: 37.5px; font-size: 1.6rem; line-height: 1.75; }
	.gf-sec04__ph { width: 324px; margin: 11px 122px 0 0; }
	.gf-sec04__photo img { aspect-ratio: 324/206; }
	.gf-sec04__deco { top: 90px; right: -120px; width: 177px; }
}

/*----------------------------
	去年のゲームフェスタに参加した高校生の声
----------------------------*/
.gf-voice__ttl { position: relative; display: inline-block; font-family: var(--gf-ff-pop); font-weight: 700; color: var(--gf-orange); text-shadow: 4px 0 0 #fff, -4px 0 0 #fff, 0 4px 0 #fff, 0 -4px 0 #fff, 3px 3px 0 #fff, -3px 3px 0 #fff, 3px -3px 0 #fff, -3px -3px 0 #fff, 4px 2px 0 #fff, -4px 2px 0 #fff, 4px -2px 0 #fff, -4px -2px 0 #fff, 2px 4px 0 #fff, -2px 4px 0 #fff, 2px -4px 0 #fff, -2px -4px 0 #fff; z-index: 1; }
.gf-voice__box { background: #fff; border-radius: 6px; }
.gf-voice__item { display: flex; align-items: flex-start; }
.gf-voice__person { flex: 0 0 auto; }
.gf-voice__thumb { background-color: #fbe47b; border: 2px solid var(--gf-orange); border-radius: 50%; overflow: hidden; }
.gf-voice__person img { aspect-ratio: 1/1; object-fit: contain; }

.gf-voice__attr { font-weight: 700; color: var(--gf-orange); line-height: 1.3; text-align: center; }
.gf-voice__body { flex: 1 1 auto; min-width: 0; }
.gf-voice__label {  }
.gf-voice__txt { line-height: 1.6; text-align: justify; }
@media screen and (max-width: 979px) {
	.gf-voice { position: relative; margin-top: calc(70 * var(--u)); }
	.gf-voice__ttl { margin: 0 0 calc(-28 * var(--u)) calc(12 * var(--u)); font-size: calc(22.8 * var(--u)); line-height: 1.335; }
	.gf-voice__box { padding: calc(35 * var(--u)) calc(28 * var(--u)) calc(17 * var(--u)) calc(30 * var(--u)); }
	.gf-voice__item { flex-wrap: nowrap; }
	.gf-voice__item + .gf-voice__item { margin-top: calc(10 * var(--u)); padding-top: calc(21 * var(--u)); background: radial-gradient(circle, var(--gf-dot) 1px, transparent 1.2px) left top / 6.3px 2px repeat-x; }
	.gf-voice__person { width: calc(96 * var(--u)); margin-right: calc(12 * var(--u)); }
	.gf-voice__attr { margin-top: calc(6 * var(--u)); font-size: calc(11.5 * var(--u)); }
	.gf-voice__label { font-size: calc(17.9 * var(--u)); }
	.gf-voice__txt { margin-top: calc(10 * var(--u)); font-size: calc(12 * var(--u)); }
}
@media screen and (min-width: 980px) {
	.gf-voice__ttl { margin: 0 0 -23px 32px; font-size: 2.55rem; line-height: 1.33; }
	.gf-voice__box { padding: 35px 30px 30px; }
	.gf-voice__list { display: flex; }
	.gf-voice__item { flex: 1 1 0; min-width: 0; }
	.gf-voice__item + .gf-voice__item { margin-left: 17px; padding-left: 17px; background: radial-gradient(circle, var(--gf-dot) 1px, transparent 1.2px) left top / 2px 5px repeat-y; }
	.gf-voice__person { width: 96px; margin-right: 12px; }
	.gf-voice__attr { margin-top: 11px; font-size: 1.15rem; }
	.gf-voice__label { font-size: 1.79rem; }
	.gf-voice__txt { margin-top: 12px; font-size: 1.28rem; }
}
