@charset "utf-8";
/*
 * science_common.cssの上書き
 */
.science-sp {
	width: 100%;
	max-width: 996px;
}
.science-sp section {
	padding-top: 110px;
}
.science-sp h3 {
	margin-top: 110px;
	margin-bottom: 42px;
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: 0.04em;
}
.science-sp h4 {
	margin: 50px 0;
	font-size: 20px;
	line-height: 1.35;
	text-align: center;
	letter-spacing: 0.04em;
}
.science-sp p {
	letter-spacing: 1.2px;
}

/* メインビジュアル */
.science-sp #kv {
	background: url(../img/kv_bg.jpg) no-repeat 50% 50% / 244px auto;
}
.science-sp #kv h1 {
	padding-top: 242px;
}

/*
 * ページ個別設定
 */
/* スライド */
#physical-activity .slide-block {
	display: block;
	width: 440px;
	margin: 0 auto;
	text-align: center;
}
#physical-activity .slick-prev,
#physical-activity .slick-next {
	top: 0;
	bottom: 0;
	margin-block: auto;
}
#physical-activity .slick-prev::before,
#physical-activity .slick-next::before {
	font-size: 15px;
	color: #323232;	
}
#physical-activity .slide-sup {
	width: 360px;
	margin: 6px auto 0;
	color: #888;
	font-size: 12px;
	line-height: 1.2;
	text-align: right;
}

/* 運動と美肌の関係に着目 */
#physical-activity #a-activity h4 {
	margin: 42px 0 45px;
}
#physical-activity #a-activity p.science-inner {
	text-align: center;
}
#physical-activity #a-activity .graph {
	width: 360px;
	margin: 46px auto 0;
}
#physical-activity #a-activity .graph p {
	margin: 18px 0 0;
	font-size: 11px;
	line-height: 1.55;
	letter-spacing: 0.07em;
}
#physical-activity #a-activity .met {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 0 40px;
}
#physical-activity #a-activity .met h5 {
	margin-bottom: 8px;
	font-family: "Hiragino Kaku Gothic W6 JIS2004", sans-serif;
	font-weight: bold;
	font-size: 13px;
	line-height: 1.6;
	font-feature-settings: 'halt' on;
}
#physical-activity #a-activity .met p {
	font-size: 13px;
	line-height: 1.55;
}
#physical-activity #a-activity .met > div {
	width: 398px;
}
#physical-activity #a-activity .met table {
	margin-top: 13px;
	border: 1px solid #DCDCDC;
	border-collapse: collapse;
}
#physical-activity #a-activity .met th,
#physical-activity #a-activity .met td {
	padding: 7px 9px;
	border: 1px solid #DCDCDC;
	font-size: 11px;
	line-height: 1.1;
}
#physical-activity #a-activity .met th {
	width: 39%;
	background-color: #F0F0F0;
	font-family: "Hiragino Kaku Gothic W6 JIS2004", sans-serif;
}
#physical-activity #a-activity .met th.met-col {
	width: 45px;
}
#physical-activity #a-activity .met .sup {
	margin-top: 16px;
	font-size: 11px;
	line-height: 1.55;
	letter-spacing: 0.07em;
}
#physical-activity #a-activity .met .met-desc {
	margin: 29px 0 14px;
	padding-bottom: 14px;
	border-bottom: 1px solid rgba(214, 214, 214, 0.3);
}

/* マイオカインとは */
#physical-activity #a-myocaine .lead {
	text-align: center;
}
#physical-activity #a-myocaine .myocaine-about {
	display: block;
	margin: 0 0 31px;
	padding-top: 6px;
	text-align: center;
}
#physical-activity #a-myocaine .graph {
	display: flex;
	justify-content: center;
	gap: 0 32px;
	padding-top: 7px;
}
#physical-activity #a-myocaine h4 {
	margin-top: 42px;
}

/* ハリのある肌の鍵 */
#physical-activity #a-skin {
	padding-bottom: 50px;
	border-bottom: 1px solid rgba(214, 214, 214, 0.3);
}
#physical-activity #a-skin h3 {
	margin-top: 90px;
}
#physical-activity #a-skin h2 + h3 {
	margin-top: 50px;
}
#physical-activity #a-skin h4 {
	margin-bottom: 22px;
}
#physical-activity #a-skin h5 {
	margin: 85px 0 26px;
	font-size: 18px;
	line-height: 1.5;
	text-align: center;
	letter-spacing: 0.01em;
}
#physical-activity #a-skin .slide-block {
	margin-top: 42px;
}
#physical-activity #a-skin .catch {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0 66px;
}

@media screen and (max-width: 768px) {
	/*
	 * science_common.cssの上書き
	 */
	.science-sp {
		max-width: none;
		padding: 0 4.11vw;
	}
	.science-sp .science-nav ul {
		margin-inline: 0;
	}
	.science-sp .science-nav li {
		padding-inline: 0;
	}
	.science-sp section {
		margin-top: -2.42vw;
		padding-top: 19.32367vw;
		padding-inline: 0;
	}
	.science-sp h2 {
		margin-bottom: 5.80vw;
		margin-inline: -4.11vw;
		padding: 4.533vw 0;
		font-size: 4.27vw;
		letter-spacing: 0.4267vw;
	}
	.science-sp h3 {
		margin-top: 18.84vw;
		margin-bottom: 7.25vw;
		font-size: 18px;
		font-size: 4.35vw;
		line-height: 1.5;
		letter-spacing: 0.01em;
	}
	.science-sp h4 {
		margin: 13.29vw 0 7.25vw;
		font-size: 18px;
		font-size: 4.35vw;
		line-height: 1.5;
		letter-spacing: 0;
		font-feature-settings: 'pkna' on;
	}
	.science-sp p {
		font-size: 15px;
		font-size: 3.62vw;
		letter-spacing: 0.02em;
	}
	
	/* メインビジュアル */
	.science-sp #kv {
		background-image: url(../img/sp_kv_bg.jpg);
		background-size: 47.83vw auto;
		height: 88.4vw;
		margin-inline: -4.11vw;
	}
	.science-sp #kv h1 {
		padding-top: 36.71vw;
		line-height: 1.55;
	}
	.science-sp .science-nav li {
		margin-bottom: 2.4vw;
	}
	
	/*
	 * ページ個別設定
	 */
	/* スライド */
	#physical-activity .slide-block {
		width: 100%;
	}
	#physical-activity .slide-block img {
		width: 100%;
	}
	#physical-activity .slick-prev,
	#physical-activity .slick-next {
		width: 50px;
		padding: 30px 0;
		opacity: 1 !important;
	}
	#physical-activity .slick-prev::before,
	#physical-activity .slick-next::before {
		font-size: 15px;
		font-size: 3.62vw;
		opacity: 1 !important;
	}
	#physical-activity .slick-prev::before {
		float: left;
	}
	#physical-activity .slick-next::before {
		float: right;
	}
	#physical-activity .slide-sup {
		width: 100%;
		margin-top: 1.45vw;
		font-size: 12px;
		font-size: 2.90vw;
	}
	
	/* 運動と美肌の関係に着目 */
	#physical-activity #a-activity h4 {
		margin: 10.15vw 0 8.45vw;
	}
	#physical-activity #a-activity p.science-inner {
		text-align: left;
	}
	#physical-activity #a-activity .graph {
		width: 100%;
		margin-top: 9.66vw;
	}
	#physical-activity #a-activity .graph img {
		width: 100%;
	}
	#physical-activity #a-activity .graph p {
		margin-top: 3.62vw;
		font-size: 10px;
		font-size: 2.42vw;
		line-height: 1.5;
		letter-spacing: 0;
	}
	#physical-activity #a-activity .met {
		flex-direction: column;
		gap: 6.03vw 0;
	}
	#physical-activity #a-activity .met h5 {
		margin-bottom: 1.93vw;
		font-size: 13px;
		font-size: 3.14vw;
	}
	#physical-activity #a-activity .met p {
		font-size: 13px;
		font-size: 3.14vw;
		line-height: 1.46;
	}
	#physical-activity #a-activity .met > div {
		width: 100%;
	}
	#physical-activity #a-activity .met table {
		margin-top: 3.14vw;
	}
	#physical-activity #a-activity .met th,
	#physical-activity #a-activity .met td {
		padding: 1.69vw 2.17vw;
		font-size: 11px;
		font-size: 2.66vw;
	}
	#physical-activity #a-activity .met th.met-col {
		width: 4em;
	}
	#physical-activity #a-activity .met .sup {
		margin-top: 3.86vw;
		font-size: 10px;
		font-size: 2.42vw;
	}
	#physical-activity #a-activity .met .met-desc {
		margin: 0 0 5.80vw;
		padding-top: 5.80vw;
		padding-bottom: 5.80vw;
		border-top: 1px solid rgba(214, 214, 214, 0.3);
	}
	
	/* マイオカインとは */
	#physical-activity #a-myocaine .lead {
		text-align: left;
	}
	#physical-activity #a-myocaine .myocaine-about {
		margin-bottom: 7.49vw;
		padding-top: 1.45vw;
	}
	#physical-activity #a-myocaine .myocaine-about img {
		width: 100%;
	}
	#physical-activity #a-myocaine .graph {
		flex-direction: column;
		gap: 7.25vw 0;
		padding-top: 1.69vw;
		padding: 0vw 5.19vw 0;
	}
	#physical-activity #a-myocaine .graph img {
		width: 100%;
	}
	#physical-activity #a-myocaine h4 {
		margin-top: 12.56vw;
	}
	
	/* ハリのある肌の鍵 */
	#physical-activity #a-skin {
		margin-top: -4.83vw;
		padding-bottom: 12.08vw;
		border-bottom: none;
	}
	#physical-activity #a-skin h3 {
		margin-top: 19.32vw
	}
	#physical-activity #a-skin h2 + h3 {
		margin-top: 7.25vw;
	}
	#physical-activity #a-skin h4 {
		margin-top: 7.97vw;
		margin-bottom: 6.52vw;
	}
	#physical-activity #a-skin h5 {
		margin: 13.29vw 0 8.21vw;
		font-size: 18px;
		font-size: 4.35vw;
		font-feature-settings: 'pkna' on;
	}
	#physical-activity #a-skin .slide-block {
		margin-top: 13.04vw;
	}
	#physical-activity #a-skin .catch {
		flex-direction: column;
		gap: 12.08vw 0;
	}
	#physical-activity #a-skin .catch img {
		width: 100%;
	}
	
	/* outro */
	.science-sp .outro {
		margin-block: 0 18.12vw;
		padding-inline: 0;
	}
	.science-sp .outro p {
		margin-bottom: 13.29vw;
	}
	.science-sp .outro ul.btn {
		margin-inline: 0.97vw;
	}
	.science-sp .outro li {
		margin-bottom: 2.667vw;
	}
}