@charset "utf-8";

/*================================
-アイキャッチ部分
=================================*/

.sub-eyecatch {
	height: 400px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: url("../../src/img/top/top-mv.webp") no-repeat left center / cover var(--color-gray);
	padding: 120px 20px 0;
	position: relative;

	&::before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.4);
	}
}

@media screen and (max-width: 767px) {
	.sub-eyecatch {
		height: 240px;
		padding: 64px 4.26vw 0;
	}
}

/*================================
-パンくずリスト
=================================*/
.sub-breadcrumb {
	font-size: min(3.46vw, 14px);
	line-height: 1.4;
	color: var(--color-text-gray);
	max-width: var(--max-width);
	margin: auto;
	padding: 20px 0 80px;
	display: flex;

	.arrow {
		margin-right: 24px;
		position: relative;

		&::before {
			content: "»";
			position: absolute;
			right: -16px;
			top: 50%;
			transform: translateY(-50%);
			z-index: 1;
			color: var(--color-text-gray);
		}
	}

	p {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
	}

	a {
		color: var(--color-assort);
		text-decoration: underline;
	}
}

@media screen and (max-width: 767px) {
	.sub-breadcrumb {
		padding: 16px 0 40px;
	}
}

/*================================
-サブページ外枠
=================================*/

.sub-wrapper {
	margin: auto;
	overflow: hidden;
	padding: 0 20px 120px;

	>.inner {
		max-width: var(--max-width);
		margin: auto;
		display: grid;
		grid-template-columns: 320px 1fr;
		gap: 56px;
	}
}

@media screen and (max-width: 1024px) {
	.sub-wrapper {
		padding: 0 4.26vw 96px;

		>.inner {
			grid-template-columns: 1fr;
			gap: 80px;
		}
	}
}

.sub-contents {
	order: 2;
}

.sub-sidebar {
	order: 1;
}

@media screen and (max-width: 1024px) {
	.sub-contents {
		order: 1;
	}

	.sub-sidebar {
		order: 2;
	}
}

/*================================
-サイドバー
=================================*/

.sub-sidebar-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	border: .5px solid var(--color-gray);
	background-color: var(--color-white);

	.title {
		height: 56px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-weight: 500;
		color: var(--color-main);
		font-family: var(--font-serif);
		font-size: min(4.26vw, 18px);
		overflow: hidden;
		position: relative;
		background-color: var(--color-gray-dark);
	}

	.link {
		height: 56px;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		border-bottom: .5px dashed var(--color-gray-dark);
		padding: 0 min(3.73vw, 14px) 0 min(calc(4.3vw * 2), 40px);
		position: relative;
		font-size: min(3.73vw, 14px);

		&:last-child {
			border-bottom: 0;
		}

		&::before {
			content: "〉";
			position: absolute;
			left: min(4vw, 20px);
			top: 50%;
			transform: translateY(-50%);
			z-index: 1;
		}
	}

	.home {
		&::before {
			content: "";
			position: absolute;
			background: url("../img/common/icon-home-bk.svg") no-repeat center center / 100%;
			width: 14px;
			height: 14px;
			left: min(2.9vw, 16px);
			top: 50%;
			transform: translateY(-50%);
			z-index: 1;
		}
	}

	.border-none {
		border-bottom: 0;
	}
}

/*================================
-サブページコンテンツ
=================================*/

.sub-section,
.sub-section-no-space {
	margin-bottom: 120px;

	>.inner,
	>.inner02 {
		margin-bottom: 104px;

		p {
			margin-bottom: 24px;
			text-align: justify;

			strong,
			b {
				background: linear-gradient(transparent 70%, var(--color-yellow-light) 70%);
				font-weight: 400;
			}

			strong {
				font-weight: 500;
			}
		}

		p,
		span {
			a {
				text-decoration: underline;
				color: var(--color-assort);
			}
		}
	}

	>.inner02 {
		margin-bottom: 0;
	}
}

.sub-section-no-space {
	margin-bottom: 0;
}

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

	.sub-section,
	.sub-section-no-space {

		>.inner,
		>.inner02 {

			p,
			span {
				a {
					&:hover {
						text-decoration: none;
					}
				}
			}
		}
	}
}

@media screen and (max-width: 767px) {

	.sub-section,
	.sub-section-no-space {

		>.inner,
		>.inner02 {

			p,
			span {
				a {
					&:active {
						text-decoration: none;
					}
				}
			}
		}
	}

	.sub-section {
		margin-bottom: 96px;

		>.inner {
			margin-bottom: 80px;
		}
	}
}

/*================================
-アンカージャンプ
=================================*/

.sub-anchor {
	margin-top: -160px;
	padding-top: 160px;
	pointer-events: none;
}

@media screen and (max-width: 767px) {
	.sub-anchor {
		margin-top: -104px;
		padding-top: 104px;
	}
}

/*================================
-目次
=================================*/

.sub-menu {
	margin-bottom: 96px;
	background-color: var(--color-white);
	padding: min(8.53vw, 40px) min(5.33vw, 56px);
	overflow: hidden;
	position: relative;
	line-height: 1.6;

	&::before,
	&:after {
		content: "";
		position: absolute;
		z-index: 0;
		pointer-events: none;
	}

	.title {
		font-size: min(4.8vw, 19px);
		line-height: 1.6;
		font-family: var(--font-serif);
		font-weight: bold;
		line-height: 1.4;
		padding-bottom: 8px;
		border-bottom: .5px solid var(--color-text);
		position: relative;

		>span {
			position: relative;
			z-index: 5;
		}

		&::before {
			content: "";
			position: absolute;
			left: -8px;
			top: 0;
			width: min(3.73vw, 16px);
			height: min(3.73vw, 16px);
			background-color: var(--color-assort);
			opacity: .1;
			z-index: 1;
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-menu {
		margin-bottom: 80px;
		margin-left: -4.26vw;
		width: calc(100% + 4.26vw * 2);
	}
}

.sub-menu-box-item {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 8px;

	.link {
		font-size: min(3.73vw, 14px);
		line-height: 1.4;
		height: 56px;
		padding: 0 min(4.26vw, 20px);
		position: relative;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		border-bottom: .5px dashed var(--color-gray-dark);

		&::before {
			content: "〉";
			position: absolute;
			left: 0;
			top: 50%;
			transform: translateY(-50%);
			z-index: 1;
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-menu-box-item {
		grid-template-columns: repeat(1, 1fr);

		.link {
			height: 64px;

			&:last-child {
				border-bottom: 0;
			}
		}
	}
}

@media screen and (min-width: 768px) {
	.sub-menu-box-item-no-border-pc {
		.link {
			border-bottom: 0;
		}
	}
}

/*================================
-見出し（サブページ）
=================================*/

.sub-headline01 {
	color: var(--color-main);
	line-height: 1.6;
	font-weight: 600;
	font-family: var(--font-serif);
	letter-spacing: var(--letter-spacing-large);
	font-size: min(5.86vw, 38px);
	line-height: 1.4;
	padding: min(4.26vw, 16px) min(5.33vw, 24px);
	text-align: center;
	position: relative;
	z-index: 10;

	span {
		text-align: center;
	}
}

.sub-headline02 {
	font-size: min(5.33vw, 24px);
	line-height: 1.6;
	font-weight: 600;
	text-align: left;
	letter-spacing: var(--letter-spacing-large);
	margin-bottom: min(10.66vw, 40px);
	padding: min(2.13vw, 8px) min(4.26vw, 16px);
	font-family: var(--font-serif);
	background-color: var(--color-gray-dark);
	color: var(--color-white);
	min-height: min(18.3vw, 80px);
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
	z-index: 0;

	&::before {
		content: "";
		position: absolute;
		z-index: 1;
		left: 0;
		top: 0;
		width: min(10.66vw, 40px);
		height: min(10.66vw, 40px);
		background-color: var(--color-black);
		opacity: .2;
		z-index: -1;

	}

	.small {
		font-size: min(4.26vw, 16px);
	}

	.small-fill {
		font-size: min(3.73vw, 16px);
		background-color: var(--color-assort);
		color: var(--color-main);
		line-height: 32px;
		height: 32px;
		display: inline-flex;
		align-items: center;
		padding: 2px 16px;
		margin-bottom: 8px;
	}
}

.sub-headline03 {
	font-size: min(5.06vw, 23px);
	line-height: 1.6;
	font-weight: 600;
	text-align: left;
	letter-spacing: var(--letter-spacing);
	margin-bottom: min(5.33vw, 32px);
	font-family: var(--font-serif);
	padding: 0 0 min(2.13vw, 8px) min(4.26vw, 16px);
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
	border-bottom: 2px solid var(--color-assort);
	z-index: 0;

	&::before {
		content: "";
		position: absolute;
		left: 0;
		bottom: max(-2.13vw, -8px);
		width: 30%;
		height: 2px;
		background-color: var(--color-assort);
	}

	&::after {
		content: "";
		position: absolute;
		left: 0;
		top: -4px;
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: min(8.53vw, 40px) min(8.53vw, 40px) 0px 0px;
		border-color: var(--color-assort) transparent transparent transparent;
		opacity: .08;
		z-index: -1;
	}
}

.sub-headline03-b {
	font-size: min(5.06vw, 23px);
	line-height: 1.6;
	font-weight: 600;
	text-align: left;
	letter-spacing: var(--letter-spacing);
	margin-bottom: min(5.33vw, 32px);
	font-family: var(--font-serif);
	padding-left: min(4.26vw, 16px);
	position: relative;
	z-index: 0;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--color-gray-dark);

	&::after {
		content: "";
		position: absolute;
		left: 0;
		top: -4px;
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: min(8.53vw, 40px) min(8.53vw, 40px) 0px 0px;
		border-color: var(--color-gray-light) transparent transparent transparent;
		z-index: -1;
	}
}

.sub-headline03-b.color01 {
	border-bottom: 2px solid rgba(29, 150, 212, .6);

	&::after {
		border-color: rgba(29, 150, 212, .1) transparent transparent transparent;
	}
}

.sub-headline03-b.color02 {
	border-bottom: 2px solid rgba(26, 41, 116, .6);

	&::after {
		border-color: rgba(26, 41, 116, .1) transparent transparent transparent;
	}
}

.sub-headline03-b.color03 {
	border-bottom: 2px solid rgba(216, 20, 25, .6);

	&::after {
		border-color: rgba(216, 20, 25, .1) transparent transparent transparent;
	}
}

.sub-headline03-b.color04 {
	border-bottom: 2px solid rgba(207, 213, 35, .6);

	&::after {
		border-color: rgba(207, 213, 35, .2) transparent transparent transparent;
	}
}

.sub-headline04 {
	font-size: min(4.8vw, 20px);
	line-height: 1.6;
	font-weight: 600;
	text-align: left;
	letter-spacing: var(--letter-spacing);
	margin-bottom: 16px;
	padding-left: min(4.26vw, 16px);
	font-family: var(--font-serif);
	color: var(--color-black);
	position: relative;
	border-left: min(1.06vw, 4px) solid var(--color-assort);
}

.sub-headline04-box {
	font-size: min(4.8vw, 20px);
	font-weight: 400;
	background-color: var(--color-assort);
	letter-spacing: var(--letter-spacing);
	color: var(--color-main);
	padding: 8px min(4.26vw, 16px);
	line-height: 1.6;
	margin-bottom: 24px;
	font-weight: 400;
}

/*================================
-サブページ画像
=================================*/

.sub-post-image,
.sub-post-image-border {
	margin: 40px auto;
	width: 100%;
	height: auto;
	display: block;
	max-width: 400px;

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

.sub-post-image-border {
	>img {
		border: .5px solid rgba(0, 0, 0, 0.2);
		padding: 16px;
	}
}

@media screen and (max-width: 767px) {

	.sub-post-image,
	.sub-post-image-border {
		margin: 24px auto;
	}
}

/*================================
-サブページボタン
=================================*/

.sub-banner-button,
.sub-banner-button-confit {
	margin: 40px auto;
	max-width: 240px;
	width: 100%;
	border: 4px solid var(--color-gray);
	background-color: var(--color-main);
	height: 72px;
	position: relative;

	.link {
		display: flex;
	}
}

.sub-banner-button-confit {
	border: 4px solid var(--color-green);

	span {
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
		font-size: min(3.46vw, 12px);
		width: 100%;
		margin: auto;
		text-align: center;
	}
}

@media screen and (max-width: 767px) {
	.sub-banner-button-confit {
		span {
			top: 4px;
		}
	}
}

.sub-banner-button-image {
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;

	.image {
		width: 50%;
		height: auto;
		display: block;
		margin-top: 16px;

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

.sub-border-box02 {
	.sub-banner-button-confit {
		margin: 0 auto 40px;
	}
}

.sub-banner-button-confit.common-button-comming-soon {
	opacity: .5;
}

/*================================
-枠線ボックス
=================================*/

.sub-border-box,
.sub-border-box02 {
	border: 1px solid var(--color-gray02);
	padding: min(8.53vw, 40px) min(4.26vw, 56px);
	background-color: var(--color-main);

	>.inner {
		p {
			margin-bottom: 24px;

			&:last-child {
				margin-bottom: 0;
			}

			+.sub-headline02,
			+.sub-headline03,
			+.sub-headline04,
			+.sub-headline04-box {
				margin-top: 80px;
			}
		}

		.common-text-att-small {
			margin-bottom: 16px !important;
		}
	}
}

.sub-border-box02 {
	border: .5px solid var(--color-assort);
}

.sub-border-box+.sub-border-box,
.sub-schedule-table+.sub-border-box,
.sub-border-box+.sub-schedule-table {
	margin-top: min(4.26vw, 16px);
}

/*================================
-背景指示ボックス
=================================*/

.sub-background-notice,
.sub-background-notice02,
.sub-background-notice03 {
	background-color: var(--color-yellow-light);
	padding: min(4.26vw, 16px);
	margin-bottom: min(10.66vw, 40px);
	position: relative;

	&::before {
		content: "";
		position: absolute;
		left: 50%;
		bottom: max(-2.66vw, -10px);
		transform: translateX(-50%);
		display: block;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: min(5.33vw, 20px) min(10.66vw, 40px) 0px min(10.66vw, 40px);
		border-color: var(--color-yellow-light) transparent transparent transparent;
	}

	p {
		font-size: min(3.46vw, 14px);
		font-weight: 600;
		text-align: center !important;

		&:last-child {
			margin-bottom: 0;
		}
	}

	.sub-headline04 {
		border-left: min(1.06vw, 4px) solid var(--color-yellow-dark);
	}
}

.sub-background-notice02 {
	background-color: var(--color-white);
	border: 1px solid var(--color-red);
	margin-bottom: min(12.8vw, 48px);

	&::before {
		bottom: max(-8.53vw, -32px);
		border-color: var(--color-yellow) transparent transparent transparent;
	}
}

.sub-background-notice03 {
	margin: min(10.66vw, 40px) auto;
	padding: min(6.4vw, 24px) min(5.33vw, 20px);

	p {
		text-align: left !important;
		font-weight: 400;
	}

	&::before {
		content: none;
	}
}

/*================================
-表（テーブル）
=================================*/

/*================================
-日時表記テーブル
=================================*/

.sub-schedule-table,
.sub-schedule-table-1fr {
	width: 100%;
	margin: 24px auto;
	padding: min(8.53vw, 40px) min(4.26vw, 56px);
	border: 1px solid var(--color-gray02);
	background-color: var(--color-white);

	table {
		border-collapse: collapse;
		margin-bottom: min(10.66vw, 40px);
		background-color: var(--color-gray-light-very);
		padding: min(4.8vw, 24px) min(5.33vw, 40px);
		display: block;
	}

	table+table {
		margin-top: max(-8.53vw, -32px);
	}

	th,
	td {
		border-collapse: collapse;
		border-spacing: 0;
		font-size: min(4vw, 18px);
		font-weight: 500;
		line-height: 1.6;
		vertical-align: middle;
		padding: 0;
		color: var(--color-red);
	}

	th {
		font-weight: 500;
		background-color: initial;
	}

	td {
		font-weight: 400;
		font-size: min(4.26vw, 18px);
		line-height: 1.6;
		display: block;
		vertical-align: middle;

		b {
			display: inline-block;
			margin-right: 6px;
			font-size: min(7.46vw, 28px);
			font-family: var(--font-serif);
			font-weight: bold;
			line-height: 1.4;
			background: initial !important;
			font-weight: 600 !important;
		}
	}

	.att-box {
		border: .5px solid var(--color-red);
		color: var(--color-red);
		line-height: min(10.66vw, 40px);
		font-size: min(3.46vw, 14px);
		line-height: min(5.33vw, 20px);
		padding: 0 min(2.13vw, 8px);
		margin-left: min(2.13vw, 8px);
		text-align: center;
		position: relative;
		display: inline-block;
	}
}

.sub-schedule-table-1fr {

	th,
	td {
		display: block;
	}
}

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

	.sub-schedule-table,
	.sub-schedule-table-1fr {

		th {
			border-right: 1px solid var(--color-gray-dark);
			padding-right: min(5.33vw, 20px);
		}

		td {
			padding-left: min(5.33vw, 20px);
		}
	}

	.sub-schedule-table {
		th {
			margin-right: 8px;
			width: 25%;
		}
	}
}

@media screen and (max-width: 767px) {

	.sub-schedule-table {

		th,
		td {
			width: 100%;
			display: block;
			padding-left: min(5.33vw, 20px);
		}

		tr {
			border-left: 2px solid var(--color-gray-dark);
		}

		tr+tr {
			th {
				margin-top: 24px;
			}
		}
	}
}

.sub-schedule-table-inner-box {
	padding-left: min(4.26vw, 16px);
	margin-top: 24px;
}

/*================================
-費用一覧テーブル
=================================*/

.sub-price-table {
	width: 100%;
	margin: 40px auto;
	border: .5px solid var(--color-gray-dark);
	background-color: var(--color-main);

	table {
		border-collapse: collapse;
	}

	th,
	td {
		border-collapse: collapse;
		border-spacing: 0;
		font-size: min(3.2vw, 15px);
		font-weight: 400;
		line-height: 1.6;
		vertical-align: middle;
		padding: min(3.2vw, 16px);
	}

	th {
		background-color: var(--color-gray-light);
		color: var(--color-text);
		font-weight: 400;
		border-bottom: .5px solid var(--color-gray-dark);
	}

	td {
		border-bottom: .5px solid var(--color-gray-dark);
		border-left: .5px solid var(--color-gray-dark);
	}

	tr {
		&:last-child {

			th,
			td {
				border-bottom: 0;
			}
		}
	}

	.th-top {
		background-color: var(--color-assort);
		color: var(--color-main);
		font-weight: 500;
		border-right: .5px solid var(--color-main);
		border-bottom: 0;
		text-align: center;

		span {
			text-align: center;
		}

		&:nth-of-type(2),
		&:nth-of-type(3) {
			width: min(24vw, 250px);
		}

		&:last-child {
			border-right: 0;
		}
	}
}

@media screen and (min-width: 768px) {
	.sub-price-table {
		td {
			text-align: right;
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-price-table {

		th,
		td {
			height: 64px;
		}
	}
}

/*================================
-ダウンロードファイルリスト用テーブル
=================================*/

.sub-download-table,
.sub-download-table-simple {
	background-color: var(--color-white);

	.link-download {
		&::after {
			content: "";
			background: url("../img/common/download-icon01.svg") no-repeat center center / 100%;
			width: min(3.2vw, 12px);
			height: min(3.2vw, 12px);
			display: inline-block;
			vertical-align: middle;
			margin-left: min(1.06vw, 8px);
		}
	}
}

.sub-download-table {
	table {
		border-collapse: collapse;
		border: .5px solid var(--color-gray-dark);
	}

	th,
	td {
		border-collapse: collapse;
		border-spacing: 0;
		font-size: min(3.46vw, 15px);
		font-weight: 400;
		line-height: 1.6;
		vertical-align: middle;
		padding: 12px min(2.13vw, 16px);
	}

	th {
		background-color: var(--color-gray-light);
		color: var(--color-text);
		font-weight: 400;
		border-bottom: .5px solid var(--color-gray-dark);
		width: min(23.8vw, 300px);
	}

	td {
		border-bottom: .5px solid var(--color-gray-dark);
		border-left: .5px solid var(--color-gray-dark);
	}

	tr {
		/* &:nth-child(5)>th {
			border-bottom: 0;
		} */

		&:last-child {

			th,
			td {
				border-bottom: 0;
			}
		}
	}

	.border-right {
		border-right: .5px solid var(--color-gray-dark);
	}
}

.sub-download-table-simple {
	table {
		border-collapse: collapse;
		border: .5px solid var(--color-gray-dark);
	}

	th,
	td {
		border-collapse: collapse;
		border-spacing: 0;
		font-size: min(3.73vw, 15px);
		font-weight: 400;
		line-height: 1.6;
		vertical-align: middle;

		p {
			margin-bottom: 0 !important;
		}
	}

	th {
		background-color: var(--color-gray-light);
		color: var(--color-text);
		font-weight: 400;
		border-bottom: .5px solid var(--color-gray-dark);
		padding: 16px min(4.26vw, 16px);
	}

	td {
		border-bottom: .5px solid var(--color-gray-dark);
		padding: 16px min(4.26vw, 16px);
	}
}

@media screen and (min-width: 768px) {
	.sub-download-table-simple {
		th {
			width: 67%;
		}

		tr {
			&:last-child {

				th,
				td {
					border-bottom: 0;
				}
			}
		}

		td {
			border-left: .5px solid var(--color-gray-dark);
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-download-table-simple {

		th,
		td {
			display: block;
		}

		tr {
			&:last-child {
				td {
					border-bottom: 0;
				}
			}
		}
	}
}

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

	.sub-download-table,
	.sub-download-table-simple {
		a {
			color: var(--color-assort);
			text-decoration: underline;

			&:hover {
				text-decoration: none;
			}
		}
	}
}

@media screen and (max-width: 767px) {

	.sub-download-table,
	.sub-download-table-simple {
		a {
			color: var(--color-assort);
			text-decoration: underline;

			&:active {
				text-decoration: none;
			}
		}
	}
}

/*================================
-装飾
=================================*/

.sub-border-bottom {
	margin-bottom: 40px !important;
	padding-bottom: 40px !important;
	border-bottom: .5px solid var(--color-gray-dark);
}


/*================================
-注意書き
=================================*/

.sub-notice {
	border: .5px solid var(--color-red);
	padding: 48px min(4.26vw, 48px);
	background-color: var(--color-main);
	margin-bottom: 80px;

	.title {
		background-color: var(--color-red);
		letter-spacing: var(--letter-spacing);
		color: var(--color-main);
		padding: 8px min(4.26vw, 16px);
		margin-bottom: 24px;

		>span {
			font-size: min(4.26vw, 18px);
			font-weight: 400;
			line-height: 1.6;
			text-align: center;
		}
	}

	.text {
		margin-bottom: 24px;
	}

	.text-date {
		margin-top: 24px;
		padding-left: 16px;
		border-left: 2px solid var(--color-gray-dark);
		font-weight: 600;
		color: var(--color-red);
	}

	.text-en {
		margin-top: 24px;
	}
}

/*================================
-大会挨拶
=================================*/

.sub-greet-readmore {
	label {
		background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
		bottom: 0;
	}

	.sub-greet-box {
		height: 600px;
	}
}

.sub-greet-box {
	font-size: min(3.73vw, 15px);

	.image {
		width: 100%;
		height: auto;
		display: grid;
		grid-template-columns: 1fr;
		gap: 16px;
		margin: 0 auto 40px;
		padding-bottom: 40px;
		border-bottom: .5px dashed var(--color-gray-dark);

		>img {
			width: 100%;
			height: auto;
			display: block;
			max-width: min(50vw, 200px);
			margin: auto;
		}

		>figcaption {
			font-weight: 600;
			font-family: var(--font-serif);
			text-align: center;
			background-color: var(--color-white);
			color: var(--color-assort);
			margin-bottom: min(4.26vw, 16px);
			font-size: min(4.26vw, 20px);
			display: inline-block;

			>span {
				margin-right: min(2.13vw, 8px);
				font-size: min(3.2vw, 14px);
			}
		}
	}
}

/*================================
-common-text-listの入れ子
=================================*/

.sub-list-flow,
.sub-list-flow-indent {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 16px;
	margin: 0 auto;

	>li {
		position: relative;
		padding-left: min(calc(4vw + 2px), calc(16px + 2px));
		line-height: 1.6;
		font-size: min(3.73vw, 16px);
		line-height: 1.6;
		text-align: justify;

		p {
			margin-bottom: 0 !important;
		}

		.number {
			position: absolute;
			content: "";
			color: var(--color-assort);
			left: 0;
			top: 0;
			font-weight: bold;
		}
	}
}

@media screen and (max-width: 767px) {

	.sub-list-flow,
	.sub-list-flow-indent {
		>li {
			.number {
				top: 0.4vw;
			}
		}
	}
}

.sub-list-flow-indent {
	padding-left: min(calc(4vw + 2px), calc(16px + 2px));
}

.sub-list-flow-indent-child {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 16px;
	padding-left: min(calc(8vw + 2px), calc(32px + 2px));
	margin: 16px auto;

	>li {
		position: relative;
		padding-left: min(calc(4vw + 2px), calc(16px + 2px));
		line-height: 1.6;

		&::before {
			position: absolute;
			content: "-";
			color: var(--color-gray-dark);
			left: 3px;
			top: min(0.4vw, 2px);
		}

		span {
			font-size: min(3.73vw, 14px);
			line-height: 1.6;
			text-align: justify;
		}
	}
}

/*================================
-実行委員
=================================*/

.sub-management-list,
.sub-management-list-4fr {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px 16px;

	p {
		margin-bottom: 0 !important;
	}
}

.sub-management-list {
	grid-template-columns: repeat(3, 1fr);
}

@media screen and (max-width: 767px) {

	.sub-management-list,
	.sub-management-list-4fr {
		grid-template-columns: repeat(2, 1fr);
		gap: 40px 2.13vw;
	}
}

.sub-management-list-item {

	.image {
		width: 100%;
		height: auto;
		display: block;
		margin: 0 auto 16px;

		>img {
			width: 100%;
			height: auto;
			display: block;
			background-color: var(--color-gray-dark);
		}
	}
}

.sub-management-list-item-title {
	>span {
		font-size: min(3.2vw, 13px);
		line-height: 1.4;
		display: block;
		border: .5px solid var(--color-assort);
		color: var(--color-assort);
		margin-bottom: 8px;
		padding: 4px 8px;
		text-align: center;
		font-weight: 500;
	}
}

.sub-management-list-item-name {

	>span {
		font-size: min(4.26vw, 16px);
		line-height: 1.4;
		display: block;
		text-align: center;
	}
}

/*================================
-ボタン
=================================*/

.sub-button {
	margin: 40px auto;
	display: flex;
	justify-content: center;

	.link {
		max-width: 240px;
		width: 100%;
		border: 4px solid var(--color-assort);
		background-color: var(--color-main);
		color: var(--color-assort);
		height: 72px;
		position: relative;
		display: flex;
		font-weight: 600;
		justify-content: center;
		align-items: center;
		transition: ease .3s;
		font-size: min(3.46vw, 15px);

		&::before {
			content: "";
			position: absolute;
			right: 0;
			bottom: 0;
			display: block;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 0px 0px min(8vw, 40px) min(8vw, 40px);
			border-color: transparent transparent var(--color-accent) transparent;
			opacity: .1;
			z-index: 1;
			transition: ease .3s;
		}

		>span {
			position: relative;
			padding-left: min(4.5vw, 20px);
			z-index: 2;

			&::before {
				content: "〉";
				position: absolute;
				left: 0;
				top: 50%;
				transform: translateY(-50%);
				z-index: 1;
			}
		}
	}
}

@media (min-width: 768px) {

	.sub-button {
		>.link {
			&:hover {
				transition: ease .3s;
				opacity: .7;
			}
		}
	}
}

@media (max-width: 767px) {

	.sub-button {
		>.link {
			&:hover {
				transition: ease .3s;
				opacity: .7;

				&::before {
					transition: ease .3s;
					border-color: transparent transparent var(--color-yellow) transparent;
				}
			}
		}
	}
}

.sub-button-text {
	margin: 40px auto;

	.button {
		width: 100%;
		border: 4px solid var(--color-assort);
		background-color: var(--color-main);
		color: var(--color-assort);
		height: 72px;
		position: relative;
		display: flex;
		font-weight: 600;
		justify-content: center;
		align-items: center;
		transition: ease .3s;
		font-size: min(3.46vw, 15px);

		&::before {
			content: "";
			position: absolute;
			right: 0;
			bottom: 0;
			display: block;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 0px 0px min(8vw, 40px) min(8vw, 40px);
			border-color: transparent transparent var(--color-accent) transparent;
			opacity: .1;
			z-index: 1;
			transition: ease .3s;
		}

		>span {
			position: relative;
			padding-left: min(4.5vw, 20px);
			text-align: center;

			&::before {
				content: "〉";
				position: absolute;
				left: 0;
				top: 50%;
				transform: translateY(-50%);
				z-index: 1;
			}
		}
	}
}

/*================================
-ボタン横並び
=================================*/

.sub-button-2fr {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: min(2.13vw, 16px);
	margin: 40px auto;
	max-width: 500px;

	.sub-banner-button-confit,
	.sub-banner-button,
	.sub-button {
		margin: 0 auto;
		width: 100%;
		display: flex;
		justify-content: center;
	}
}

@media screen and (max-width: 767px) {
	.sub-button-2fr {
		grid-template-columns: repeat(1, 1fr);
	}
}

/*================================
-注意書きボックス
=================================*/

.sub-att-box {
	background-color: var(--color-gray-light);
	padding: min(8.53vw, 40px) min(4.26vw, 56px);
	margin: 40px auto;

	p {
		margin-bottom: 16px;

		&:last-child {
			margin-bottom: 0;
		}
	}

	.common-text-list {
		font-size: min(3.73vw, 15px);
	}
}

.sub-headline02,
.sub-headline03,
.sub-headline04 {
	+.sub-att-box {
		margin-top: 0;
	}
}

.sub-att-box>.sub-list-flow {
	padding-left: 0;
}

.sub-att-box-large {
	padding: min(8.53vw, 40px) min(4.26vw, 56px);
	margin: 0 auto 40px;
	border: .5px solid var(--color-red);
	background-color: var(--color-white);

	.title {
		font-size: min(4.26vw, 20px);
		font-weight: 500;
		color: var(--color-red);
		letter-spacing: var(--letter-spacing);
		line-height: 1.6;
		margin-bottom: 24px;
		text-align: center;
		display: flex;
		justify-content: center;
		position: relative;
	}

	.date {
		background-color: var(--color-gray-light-very);
		padding: min(4.8vw, 24px) min(5.33vw, 40px);
		font-size: min(4.8vw, 18px);
		color: var(--color-red);
		margin-bottom: min(5.33vw, 24px);
	}

	p {
		font-size: min(3.73vw, 15px);
		margin-bottom: 24px;
	}
}

/*================================
-講演・発表ページの募集ボタン
=================================*/

.sub-lecture-menu,
.sub-lecture-menu-single,
.sub-lecture-menu-single02 {
	margin: 80px auto 96px;
	width: 100%;

	.title {
		font-size: min(5.33vw, 22px);
		font-weight: 500;
		color: var(--color-assort);
		letter-spacing: var(--letter-spacing);
		line-height: 1.6;
		margin-bottom: 40px;
		text-align: center;
		display: flex;
		justify-content: center;
		position: relative;

		&::before {
			content: "";
			position: absolute;
			left: 50%;
			bottom: -20px;
			z-index: 1;
			width: 0;
			height: 0;
			transform: translateX(-50%);
			border-style: solid;
			border-color: var(--color-yellow) transparent transparent transparent;
			border-width: 8px 20px 0px 20px;
			z-index: 1;
		}
	}

	.list {
		display: flex;

		>li {
			a {
				display: flex;
				align-items: center;
				flex-direction: column;
				justify-content: center;
				background-color: var(--color-accent);
				color: var(--color-main);
				line-height: 1.4;
				font-weight: 500;
				height: 64px;
				position: relative;

				&::before {
					content: "";
					position: absolute;
					left: 4px;
					top: 4px;
					width: calc(100% - 8px);
					height: calc(100% - 8px);
					z-index: 1;
					user-select: none;
					pointer-events: none;
					border: .5px solid rgba(255, 255, 255, 0.7);
				}

				.arrow {
					text-align: left;
					position: relative;
				}

				.small {
					font-size: min(3.2vw, 12px);
					font-weight: 400;
				}
			}

		}
	}
}

.sub-lecture-menu {
	.list {
		>li {
			a {
				.arrow {
					padding-left: min(5.33vw, 32px);

					&::before {
						content: "─";
						position: absolute;
						left: 0;
						top: 50%;
						transform: translateY(-50%);
						z-index: 1;
					}
				}
			}
		}
	}
}

.sub-lecture-menu-single,
.sub-lecture-menu-single02 {
	.list {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 0;
	}
}

.sub-lecture-menu-single02 {
	margin: 0 auto 80px;
}

@media screen and (min-width: 768px) {
	.sub-lecture-menu {

		.list {
			justify-content: space-between;

			>li {
				width: calc(100% / 2 - 4px);
			}
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-lecture-menu {
		.list {
			display: grid;
			grid-template-columns: repeat(1, 1fr);
			gap: 16px;
		}
	}

	.sub-lecture-menu-single02 {
		margin: 0 auto 40px;
	}
}

/*================================
-AI翻訳 251009 add
=================================*/

.sub-speark-information {
	padding: 40px 32px;
	background-color: var(--color-main);
	margin: 0 auto 80px;
	border: .5px solid var(--color-gray02);
}

@media screen and (max-width: 767px) {
	.sub-speark-information {
		padding: 40px min(4.26vw, 16px);
	}
}

.sub-speark-information-box {

	.title {
		font-size: min(5.33vw, 22px);
		font-weight: 500;
		color: var(--color-assort);
		letter-spacing: var(--letter-spacing);
		line-height: 1.6;
		margin-bottom: 24px;
		padding-top: min(calc(10.66vw * 1.3), calc(56px * 1.3));
		text-align: center;
		display: flex;
		justify-content: center;
		position: relative;

		>span {
			position: relative;
			z-index: 2;
		}

		&::before {
			content: "";
			position: absolute;
			transform: translateX(-50%);
			left: 50%;
			top: 0;
			width: min(10.66vw, 56px);
			height: min(10.66vw, 56px);
			background: url("../img/common/icon-translate.svg") no-repeat center center / 100%;
			opacity: .1;
			z-index: 1;
		}
	}

	.text {
		margin-bottom: 24px;
	}

	.text02 {
		margin-bottom: 0;
	}

	.list {
		margin: 40px auto;
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 16px;
		padding: 40px 16px;
		border-top: .5px dashed var(--color-gray-dark);
		border-bottom: .5px dashed var(--color-gray-dark);

		>li {
			padding-left: min(calc(4.26vw * 2), calc(16px * 2));
			position: relative;

			&::before,
			&::after {
				content: "";
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
			}

			&::before {
				left: min(calc(2.66vw / 2), calc(10px / 2));
				top: calc(50% - 3px);
				width: min(2.66vw, 10px);
				height: min(1.33vw, 5px);
				border-left: 2px solid var(--color-accent);
				border-bottom: 2px solid var(--color-accent);
				transform: rotate(-45deg);
				z-index: 2;
			}

			&::after {
				left: 0;
				width: min(5.33vw, 20px);
				height: min(5.33vw, 20px);
				border-radius: min(5.33vw, 20px);
				border: .5px solid var(--color-gray-dark);
				z-index: 1;
			}
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-speark-information-box {
		.list {
			padding: 40px 0;
		}
	}
}

/*================================
-住所ボックス
=================================*/

.sub-address {
	padding-bottom: min(10.66vw, 40px);
	margin-bottom: min(10.66vw, 40px);
	border-bottom: 1px solid var(--color-gray-dark);

	p {
		font-size: min(3.73vw, 14px);
		margin-bottom: 16px !important;
		line-height: 1.4;

		&:last-child {
			margin-bottom: 0 !important;
		}
	}

	.title {
		margin-bottom: 24px !important;
		background-color: var(--color-gray-dark);
		color: var(--color-white);
		padding: 0 min(4.26vw, 16px);
		line-height: min(8.53vw, 40px);
		display: inline-block;
	}
}

/*================================
-コピー用ボックス
=================================*/

.sub-copy-box {
	background-color: var(--color-gray-dark);
	color: var(--color-white);
	border-radius: min(2.13vw, 8px);
	padding: min(10.66vw, 40px) min(4.26vw, 20px) min(8.53vw, 32px);
	font-size: min(3.2vw, 14px);
	line-height: 1.4;
	cursor: pointer;
	position: relative;
	overflow: hidden;

	&:before {
		position: absolute;
		left: min(4.26vw, 20px);
		top: min(2.66vw, 12px);
		font-size: min(2.66vw, 11px);
		line-height: min(5.33vw, 20px);
		padding: 0 min(4.26vw, 16px);
		border-radius: min(3.46vw, 14px);
		background-color: var(--color-white);
		color: var(--color-black);
		font-weight: 600;
		pointer-events: none;
	}

	&:active {
		opacity: .7;
	}
}

.sub-copy-box.title-text {
	&:before {
		content: "件名";
	}
}

.sub-copy-box.read-text {
	&:before {
		content: "本文";
	}
}

.sub-copy-box+.sub-copy-box {
	margin-top: min(2.13vw, 8px);
}

/*================================
-ホテル情報
=================================*/

.sub-hotel-data {}

.sub-hotel-data-image {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: min(2.13vw, 8px);
	margin: min(8.53vw, 32px) auto;

	.image {
		display: block;

		img {
			display: block;
			width: 100%;
			height: auto;
			aspect-ratio: 1/1;
			object-fit: cover;
			background-color: var(--color-gray-light);
		}
	}
}

.sub-hotel-data-read {
	margin-bottom: min(10.66vw, 40px);

	p {
		&:last-child {
			margin-bottom: 0;
		}
	}

	.date {
		line-height: 1.4;
		background-color: var(--color-yellow-light);
		padding: min(4.26vw, 16px) min(4.26vw, 24px);
		margin: min(10.66vw, 40px) auto min(21.3vw, 80px);

		span {
			display: inline-block;
			margin-right: min(2.13vw, 8px);
			padding-right: min(2.13vw, 8px);
			border-right: .5px solid var(--color-black);
		}
	}
}

.sub-hotel-data-table {
	margin-bottom: min(4.26vw, 16px);
	border-bottom: .5px solid var(--color-gray-dark);

	th,
	td {
		border-collapse: collapse;
		border-spacing: 0;
		font-size: min(3.2vw, 15px);
		font-weight: 400;
		line-height: 1.6;
		vertical-align: middle;
		padding: min(3.2vw, 16px);
	}

	th {
		background-color: var(--color-assort);
		color: var(--color-main);
		font-weight: 500;
		border: .5px solid var(--color-assort);
		border-right: .5px solid var(--color-main);
		border-bottom: 0;
		text-align: center;
	}

	td {
		border: .5px solid var(--color-gray-dark);
	}

	.td-left {
		background-color: var(--color-gray-light);
		text-align: left;
	}
}

@media screen and (min-width: 768px) {
	.sub-hotel-data-table {

		th {

			&:nth-of-type(2),
			&:nth-of-type(3),
			&:nth-of-type(5) {
				width: 23.333%;
			}
		}

		td {
			text-align: right;
		}

		.td-left {
			width: 30%;
			text-align: left;
		}
	}
}


.sub-hotel-scroll-sp-text {
	display: none;
}

@media screen and (max-width: 767px) {
	.sub-hotel-scroll-sp {
		overflow-y: auto;
		width: calc(100% + min(4.26vw, 16px));
	}

	.sub-hotel-scroll-sp-text {
		display: flex;
		justify-content: center;
		text-align: center;
		font-size: min(3.46vw, 13px);
	}

	.sub-hotel-data-table {
		width: 150%;
	}
}

.sub-hotel-data-access {
	border: .5px solid var(--color-gray-dark);

	th,
	td {
		border-collapse: collapse;
		border-spacing: 0;
		font-size: min(3.2vw, 15px);
		font-weight: 400;
		line-height: 1.6;
		vertical-align: middle;
		padding: min(3.2vw, 16px);

		p {
			font-size: min(3.2vw, 15px) !important;
		}
	}

	th {
		background-color: var(--color-gray-light);
		color: var(--color-text);
		font-weight: 400;
		border-bottom: .5px solid var(--color-gray-dark);
	}

	a {
		color: var(--color-assort);
		text-decoration: underline;
	}

	.map {
		display: inline-block;
		margin-top: min(2.13vw, 8px);
		padding-right: min(7.46vw, 28px);
		position: relative;

		&::before {
			content: "";
			position: absolute;
			background: url(../../src/img/common/icon-map.svg) no-repeat center center / 100%;
			width: min(5.33vw, 20px);
			height: min(5.33vw, 20px);
			top: 50%;
			right: 0;
			transform: translateY(-50%);
			z-index: 1;
			pointer-events: none;
			transition: ease .3s;
		}
	}
}

@media screen and (min-width: 768px) {
	.sub-hotel-data-access {
		th {
			width: 30%;
		}

		td {
			border: .5px solid var(--color-gray-dark);
		}

		a {
			&:hover {
				text-decoration: none;
			}
		}
	}
}

@media screen and (max-width: 767px) {
	.sub-hotel-data-access {

		th,
		td {
			display: block;
			width: 100%;
		}

		td {
			border-bottom: .5px solid var(--color-gray-dark);
		}

		a {
			&:active {
				text-decoration: none;
			}
		}
	}

	tr:last-child {
		td {
			border-bottom: 0;
		}
	}
}

/*================================
-続きを読む（下層ページ）
=================================*/

.sub-hotel-readmore,
.sub-long-readmore {
	margin-bottom: min(14.93vw, 56px);

	label {
		height: min(32vw, 120px);
	}
}

.sub-hotel-readmore input:checked+label,
.sub-long-readmore input:checked+label {
	height: min(2.13vw, 8px);
}

.sub-long-readmore {
	.common-readmore-item {
		height: min(53.3vw, 200px);
	}
}

/*================================
-MVスケジュール
=================================*/

.sub-box-mv {
	.sub-schedule-table {
		margin-top: 0;
		border: 0;
		padding: min(5.33vw, 40px) min(5.33vw, 56px);
		position: relative;
		z-index: 3;
		overflow: hidden;

		&::before {
			content: "";
			position: absolute;
			width: 100%;
			height: 100%;
			left: 0;
			top: 0;
			background: url(../../src/img/common/sub-mv.webp) no-repeat center right / cover var(--color-gray);
			filter: blur(4px);
			transform: scale(1.4, 1.4);
			z-index: 1;
		}

		&::after {
			content: "";
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			background-color: rgba(255, 255, 255, .4);
			z-index: 2;
		}

		table {
			position: relative;
			z-index: 5;
			background-color: var(--color-white);
		}
	}
}

@media screen and (min-width: 768px) {
	.sub-box-mv {
		.sub-schedule-table {
			table {
				th {
					width: 220px;
				}
			}
		}
	}
}

/*================================
-リストボックス
=================================*/

.sub-list-box {
	border: .5px solid var(--color-gray-dark);
	margin: min(10.66vw, 40px) auto;
    padding: min(4.26vw, 20px) min(5.33vw, 40px);

	.list {
		margin: auto;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0 min(2.13vw, 8px);

		li {
			line-height: 1.6;
			min-height: min(19.2vw, 72px);
			padding-left: min(10.66vw, 40px);
			position: relative;
			display: flex;
			justify-content: flex-start;
			align-items: center;

			&::before {
				content: "";
				position: absolute;
				left: min(2.13vw, 8px);
				top: calc(50% - min(1.06vw, 4px));
				width: min(4.26vw, 16px);
				height: min(2.13vw, 8px);
				border-left: 2px solid var(--color-assort);
				border-bottom: 2px solid var(--color-assort);
				transform: rotate(-45deg) translateY(-50%);
			}
		}
	}
}

@media screen and (max-width: 1280px) {
	.sub-list-box {
		.list {
			grid-template-columns: repeat(2, 1fr);

		}
	}
}

@media screen and (max-width: 767px) {
	.sub-list-box {
		padding: 0 min(5.33vw, 40px);

		.list {
			grid-template-columns: repeat(1, 1fr);

			li {
				border-bottom: .5px dashed var(--color-gray-dark);

				&:last-child {
					border-bottom: 0;
				}
			}
		}
	}
}