@charset "UTF-8";

.ipk {
	container-type: inline-size;
	overflow: hidden;
	background-color: #EEEB5E;
	color: #231815;
	font-family: 'Noto Sans JP', sans-serif;
	line-height: 1;
}

.ipk img {
	display: block;
	width: 100%;
	height: auto;
}

.ipk picture {
	display: block;
}

.ipk h1,
.ipk h2,
.ipk h3 {
	margin: 0;
	font-size: inherit;
	font-weight: inherit;
}

.ipk p {
	margin: 0;
}

.ipk ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ipk-vh {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.ipk-pc {
	display: none;
}

/* ============================================================
   スマホ
   ============================================================ */

.ipk-stage {
	--u: calc(100cqw / 781);
	position: relative;
	width: calc(var(--u) * 781);
	height: calc(var(--u) * 8253);
	margin: calc(var(--u) * -830) auto 0;
}

@supports not (width: 1cqw) {
	.ipk-stage {
		--u: calc(100vw / 781);
	}
}

.ipk-stage > section > *,
.ipk-str {
	position: absolute;
}

/* タイトル */
.ipk-hero__title {
	width: 100%;
}

/* そもそもインターンシップとは */
.ipk-toha__badge {
	top: calc(var(--u) * 844);
	left: calc(var(--u) * 310.5);
	width: calc(var(--u) * 160) !important;
}

.ipk-toha__title {
	top: calc(var(--u) * 1008);
	left: calc(var(--u) * 151);
	width: calc(var(--u) * 479);
}

.ipk-toha__text {
	top: calc(var(--u) * 1071);
	left: 0;
	width: 100%;
	font-size: calc(var(--u) * 28);
	line-height: calc(var(--u) * 38);
	font-weight: 700;
	text-align: center;
	white-space: nowrap;
}

.ipk-toha__text small {
	display: block;
	font-size: calc(var(--u) * 21);
	line-height: calc(var(--u) * 34);
	font-weight: 500;
}

/* 約7割 */
.ipk-s70__img {
	top: calc(var(--u) * 1143);
	left: 0;
	width: calc(var(--u) * 782);
}

.ipk-s70__lead,
.ipk-s80__lead,
.ipk-demo__text {
	left: 0;
	width: 100%;
	font-size: calc(var(--u) * 38);
	font-weight: 700;
	text-align: center;
	white-space: nowrap;
}

.ipk-s70__lead {
	top: calc(var(--u) * 1650.5);
	line-height: calc(var(--u) * 50.5);
}

.ipk-s70__lead small {
	font-size: 0.75em;
}

/* メリット / ポイント */
.ipk-box {
	left: calc(var(--u) * 78);
	width: calc(var(--u) * 625);
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.ipk-box__list {
	position: absolute;
	font-size: calc(var(--u) * 25);
	line-height: calc(var(--u) * 48);
	font-weight: 500;
	white-space: nowrap;
}

.ipk-box__list li::before {
	content: "●";
}

.ipk-box--merit {
	top: calc(var(--u) * 1776);
	height: calc(var(--u) * 220);
	background-image: url(../img/internship_package/sp_merit.png);
}

.ipk-box--merit .ipk-box__list {
	top: calc(var(--u) * 59.5);
	left: calc(var(--u) * 29);
}

/* 8割超 */
.ipk-s80__img {
	top: calc(var(--u) * 2008);
	left: 0;
	width: calc(var(--u) * 782);
}

.ipk-s80__lead {
	top: calc(var(--u) * 2427);
	line-height: calc(var(--u) * 50);
}

.ipk-box--point {
	top: calc(var(--u) * 2546);
	height: calc(var(--u) * 271);
	background-image: url(../img/internship_package/sp_point.png);
}

.ipk-box--point .ipk-box__list {
	top: calc(var(--u) * 65);
	left: calc(var(--u) * 137);
}

/* でも、 */
.ipk-demo__img {
	top: calc(var(--u) * 2862);
	left: calc(var(--u) * 322.5);
	width: calc(var(--u) * 136);
}

.ipk-demo__text {
	top: calc(var(--u) * 2996.5);
	line-height: calc(var(--u) * 49.5);
}

/* おまかせセット */
.ipk-set__img {
	top: calc(var(--u) * 3133);
	left: 0;
	width: calc(var(--u) * 782);
}

/* ソーゴーの強み */
.ipk-strength__title {
	top: calc(var(--u) * 6631);
	left: calc(var(--u) * 269);
	width: calc(var(--u) * 243);
}

.ipk-str {
	left: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: calc(var(--u) * 12);
}

.ipk-str--1 { top: calc(var(--u) * 6897); }
.ipk-str--2 { top: calc(var(--u) * 7167); }
.ipk-str--3 { top: calc(var(--u) * 7533); }

.ipk-str__tag {
	width: calc(var(--u) * 315);
	flex-shrink: 0;
}

.ipk-str__text {
	font-size: calc(var(--u) * 38);
	line-height: calc(var(--u) * 50);
	font-weight: 700;
	text-align: center;
	white-space: nowrap;
}

.ipk-strength__chara {
	top: calc(var(--u) * 7892);
	left: calc(var(--u) * 144);
	width: calc(var(--u) * 493);
}

/* ============================================================
   PC
   ============================================================ */

@media screen and (min-width: 769px) {

	.ipk-sp {
		display: none;
	}

	.ipk-pc {
		display: inline;
	}

	.ipk-stage {
		--u: calc(min(100cqw, 1600px) / 4000);
		width: calc(var(--u) * 4000);
		height: calc(var(--u) * 11757);
		margin-top: calc(var(--u) * -3340);
	}

	@supports not (width: 1cqw) {
		.ipk-stage {
			--u: calc(min(100vw, 1600px) / 4000);
		}
	}

	/* タイトル */
	.ipk .ipk-hero__title {
		width: min(100%, calc((100vh - 160px) * 3056 / 2226));
		margin: 0 auto;
	}

	/* そもそもインターンシップとは */
	.ipk-toha {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	/* 約7割 */
	.ipk-s70__img {
		top: calc(var(--u) * 3400);
		left: calc(var(--u) * 613);
		width: calc(var(--u) * 2909);
	}

	.ipk-s70__lead {
		top: calc(var(--u) * 4016);
		left: calc(var(--u) * 787);
		width: auto;
		font-size: calc(var(--u) * 78);
		line-height: calc(var(--u) * 110);
		text-align: left;
	}

	.ipk-s70__lead small {
		font-size: 0.72em;
	}

	/* メリット / ポイント */
	.ipk-box {
		width: auto;
		height: auto !important;
		background: none !important;
	}

	.ipk-box__list {
		position: static;
		font-size: calc(var(--u) * 56);
	}

	.ipk-box--merit {
		top: calc(var(--u) * 4198.5);
		left: calc(var(--u) * 1382);
	}

	.ipk-box--merit .ipk-box__list {
		line-height: calc(var(--u) * 100);
	}

	/* 8割超 */
	.ipk-s80__img {
		top: calc(var(--u) * 4666);
		left: calc(var(--u) * 613);
		width: calc(var(--u) * 2909);
	}

	.ipk-s80__lead {
		top: calc(var(--u) * 5481);
		left: calc(var(--u) * 1740);
		width: auto;
		font-size: calc(var(--u) * 76);
		line-height: calc(var(--u) * 104.5);
		text-align: left;
	}

	.ipk-box--point {
		top: calc(var(--u) * 5787);
		left: calc(var(--u) * 1422);
	}

	.ipk-box--point .ipk-box__list {
		display: grid;
		grid-template-columns: calc(var(--u) * 846) auto;
		line-height: calc(var(--u) * 99);
	}

	/* でも、 */
	.ipk-demo__img {
		top: calc(var(--u) * 6198);
		left: calc(var(--u) * 782);
		width: calc(var(--u) * 2441);
	}

	.ipk-demo__text {
		position: absolute !important;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	/* おまかせセット */
	.ipk-set__img {
		top: calc(var(--u) * 6737);
		left: calc(var(--u) * 708.5);
		width: calc(var(--u) * 2583);
	}

	/* ソーゴーの強み */
	.ipk-strength__title {
		top: calc(var(--u) * 10270);
		left: calc(var(--u) * 1713);
		width: calc(var(--u) * 506);
	}

	.ipk-str {
		left: calc(var(--u) * 863);
		width: auto;
		flex-direction: row;
		gap: calc(var(--u) * 54);
	}

	.ipk-str--1 { top: calc(var(--u) * 10838); }
	.ipk-str--2 { top: calc(var(--u) * 11080); }
	.ipk-str--3 { top: calc(var(--u) * 11326); }

	.ipk-str__tag {
		width: calc(var(--u) * 582);
	}

	.ipk-str__text {
		font-size: calc(var(--u) * 55);
		line-height: calc(var(--u) * 79);
		text-align: left;
	}

	.ipk-strength__chara {
		top: calc(var(--u) * 11178);
		left: calc(var(--u) * 2593);
		width: calc(var(--u) * 790);
	}
}

/* ============================================================
   スクロール出現
   ============================================================ */

.ipk-anim .ipk-rv {
	opacity: 0;
}

.ipk-anim .ipk-rv.is-in {
	animation: ipkBounceUp .8s cubic-bezier(.22, .9, .3, 1) var(--d, 0s) both;
}

/* 吹き出し・バッジ・キャラクター */
.ipk-anim .ipk-rv--pop.is-in {
	animation-name: ipkPop;
	animation-duration: .75s;
}

/* 文章 */
.ipk-anim .ipk-rv--text.is-in {
	animation-name: ipkTextIn;
	animation-duration: .9s;
	animation-timing-function: cubic-bezier(.25, .6, .3, 1);
}

/* 箇条書き */
.ipk-anim .ipk-rv--item.is-in {
	animation-name: ipkSlideIn;
	animation-duration: .8s;
	animation-timing-function: cubic-bezier(.25, .6, .3, 1);
}

/* 強みの見出し */
.ipk-anim .ipk-rv--side.is-in {
	animation-name: ipkSideIn;
	animation-duration: .7s;
}

@keyframes ipkBounceUp {
	0%   { opacity: 0; transform: translateY(60px) scale(.96); }
	55%  { opacity: 1; transform: translateY(-12px) scale(1.02); }
	75%  { transform: translateY(5px) scale(.995); }
	90%  { transform: translateY(-2px); }
	100% { opacity: 1; transform: none; }
}

@keyframes ipkPop {
	0%   { opacity: 0; transform: scale(.3) rotate(-10deg); }
	50%  { opacity: 1; transform: scale(1.14) rotate(4deg); }
	70%  { transform: scale(.94) rotate(-2deg); }
	85%  { transform: scale(1.03) rotate(1deg); }
	100% { opacity: 1; transform: none; }
}

@keyframes ipkTextIn {
	0%   { opacity: 0; transform: translateY(14px); }
	100% { opacity: 1; transform: none; }
}

@keyframes ipkSlideIn {
	0%   { opacity: 0; transform: translateX(-14px); }
	100% { opacity: 1; transform: none; }
}

@keyframes ipkSideIn {
	0%   { opacity: 0; transform: translateX(-80px) scale(.9); }
	55%  { opacity: 1; transform: translateX(10px) scale(1.06); }
	75%  { transform: translateX(-4px) scale(.98); }
	100% { opacity: 1; transform: none; }
}

@media screen and (min-width: 769px) {
	.ipk-anim .ipk-demo__img.is-in {
		animation-name: ipkBounceUp;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ipk-anim .ipk-rv {
		opacity: 1;
		animation: none !important;
	}
}

/* ============================================================
   お問合せフォーム
   ============================================================ */

#contact_form>div {
	max-width: 1500px;
}

@media (min-width: 768px) {
  #contact_form .contact_form_wrap { padding: 36px 50px 40px; }
  #contact_form .contact_form_ttl { font-size: 36px; line-height: 1.4; margin-bottom: 16px; }
  #contact_form dt.form_head { font-size: 18px; margin-bottom: 6px; }
  #contact_form dd.form_item { font-size: 16px; line-height: 1.5; margin-bottom: 14px; }
  #contact_form .form_input { font-size: 16px; padding: 11px 14px; margin-bottom: 4px; }
  #contact_form .placeholder { font-size: 13px; margin-bottom: 4px; }
  #contact_form .ico_label { font-size: 14px; padding: 0 12px; margin-right: 12px; }
}

/* 電話番号 */
#contact_form .contact_tel_date a { color: inherit; text-decoration: none; }

/* フリーコールアイコン(スマホ) */
@media (max-width: 767px) {
  #contact_form .contact_tel_date { display: flex; align-items: center; justify-content: center; gap: .25em; white-space: nowrap; font-size: clamp(22px, 7.4vw, 30px); }
  #contact_form .contact_tel_date::before { content: ""; flex: 0 0 auto; width: 1.25em; height: 1em; background: url(../img/common/ico_freecall_wh.svg) no-repeat center / contain; }
}
