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

/* ------------------------------ PC ------------------------------ */
html, body {
	overflow-x: hidden;
}
body {
	min-width: auto;
}

/* -------------------- メイン -------------------- */
.main {
	position: relative;
	margin: 0 auto;
	width: 730px;
	background-color: #fff;
}

/* メインタイトル */
.mainContents__Sec-episode {
	position: relative;

	.wrapper {
		position: relative;
		width: 730px;
		padding: 0 25px 48px;
		display: flex;
		flex-direction: column;
		align-items: center;

		.Sec-episode-headArea {
			position: relative;
			width: 100%;
			padding: 39px 25px 51px;
			background-color: #fbe0ec;
			border-radius: 0 0 9px 9px;
			display: flex;
			flex-direction: column;
			align-items: center;

			.Sec-episode-headArea-category {
				font-size: calc(25rem / 16);
				line-height: calc(36 / 25);
				font-weight: 600; /* SemiBold */
				letter-spacing: 0.040em;
				text-align: center;
	
				.light {
					font-weight: 400; /* Regular */
				}
				i {
					margin: 0;
					padding: 0;
					letter-spacing: 0.240em;
					color: #cfa533;
				}
			}
			.Sec-episode-headArea-title {
				margin-top: 12px;
				font-size: calc(43rem / 16);
				line-height: calc(57 / 43);
				font-weight: 700; /* Bold */
				letter-spacing: 0.040em;
				text-align: center;

				.small {
					font-size: calc(28rem / 16);
				}
				.light {
					font-weight: 400; /* Regular */
				}
			}
			/* 作者 */
			.Sec-episode-headArea-creator-box {
				margin: calc(18px * 0.75) 0 calc(9px * 0.75);
				display: flex;
				flex-direction: column;
				align-items: stretch;
				gap: calc(12px * 0.75) 0;

				.Sec-episode-headArea-creator-list {
					display: flex;
					justify-content: flex-start;

					.Sec-episode-headArea-creator-title {
						font-size: calc(22px * 0.75);
						line-height: calc(33 / 22);
						font-weight: 600; /* SemiBold */
						letter-spacing: 0.040em;
						text-align: center;
						color: #70b3ff;
						background-color: #fff;
						border: #70b3ff calc(1.5px * 0.75) solid;
						border-radius: calc(18px * 0.75);

						&.episode {
							width: calc(205px * 0.75);
						}
					}
					.Sec-episode-headArea-creator-name {
						margin-left: calc(20px * 0.75);
						font-size: calc(28px * 0.75);
						line-height: calc(36 / 28);
						font-weight: 600; /* SemiBold */
						letter-spacing: 0.040em;
					}
				}
			}
			.Sec-episode-headArea-subTitle {
				position: absolute;
				left: 50%;
				bottom: -24px;
				padding: 0 25px;
				transform: translateX(-50%); /* 中央寄せ */
				font-size: calc(22rem / 16);
				line-height: calc(42 / 22);
				font-weight: 700; /* Bold */
				letter-spacing: 0.040em;
				text-align: center;
				background-color: #fff;
				border: 3px solid #fbe0ec;
				border-radius: 24px;
			}
		}
		/* 受賞エピソード */
		.Sec-episode-textArea {
			position: relative;
			margin-top: 36px;

			.Sec-episode-text {
				margin-top: 24px;
				font-size: calc(19rem / 16);
				line-height: calc(33 / 19);
				font-weight: 400; /* Regular */
				letter-spacing: 0.040em;
			}
			.Sec-episode-note {
				margin-top: 24px;
				padding-left: 1.040em;
				font-size: calc(14rem / 16);
				line-height: calc(24 / 14);
				font-weight: 400; /* Regular */
				letter-spacing: 0.040em;
				text-indent: -1.040em;
			}
		}
		/* 閉じるボタン */
		.Sec-episode-closeBtn {
			margin-top: 48px;
			display: flex;
			flex-direction: column;
			align-items: center;

			.close {
				padding: 15px 70px;
				font-size: calc(23rem / 16);
				line-height: calc(24 / 23);
				font-weight: 700; /* Bold */
				letter-spacing: 0.015em;
				color: #f7bdd5;
				background-color: #fff;
				border: 3px solid #f9ccdf;
				border-radius: 30px;
				cursor: pointer;
				transition: all 0.35s ease;

				i {
					margin: 0 0.650em 0 0;
				}
				&:hover {
					opacity: 0.35;
				}
			}
		}
	}
}