@charset "UTF-8";

/* ====================================
	共通スタイル
==================================== */

/* メインビジュアル */
.main-visual {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	block-size: 40rem;
	background: url(images/main-visual_sp.jpg) no-repeat bottom / cover;
}

.main-visual-title-wrap {
	inline-size: fit-content;
	padding-bottom: 5%;
	padding-right: 5%;
}

.main-visual__about {
	line-height: 1;
	color: #fff;
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3), 0px 0px 10px rgba(0, 0, 0, 0.5);
}

.main-visual-logo {
	inline-size: 20rem;
}

.main-visual-year {
	margin-bottom: 0.5em;
	font-size: 1.6rem;
}

.main-visual-date {
	font-size: 1.5rem;

	span {
		font-size: 2.2rem;
	}
}

.main-visual-place {
	margin-top: 0.5em;
	font-size: 3rem;
}

/* イントロ */
.intro {
	padding: 5rem 0;
}

.intro-title {
	max-inline-size: 48rem;
}

.intro-sub-title {
	margin-bottom: 5rem;
	font-size: 1.6rem;
}

.intro-text {
	margin-top: 4rem;
	font-size: 1.8rem;
}

/* NEWS */
.news {
	padding: 3rem 0;
	border-top: solid 1px #DFDFDF;
	border-bottom: solid 1px #DFDFDF;
}

.list-news {
	display: grid;
	gap: 1em;
	margin-top: 0.5em;
}

.news-title {
	font-size: 1.6rem;
}

.news-date {
	min-inline-size: 6.7em;
	color: #59574B;
}

/* セクション */
.section {
	padding-top: 5rem;
}

.section-title {
	font-size: 4rem;
}

.section-title-jp {
	font-size: 1.6rem;
}

/* 展示ブース */
.exhibition__category {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.exhibition__category-text {
	padding-top: 2rem;
	padding-bottom: 4rem;
}

.exhibition-title {
	margin-bottom: 0.5em;
	font-size: 2.8rem;
}

.exhibition-text {
	font-size: 1.5rem;
}

/* 展示ブース：展示ブースイメージ */
.exhibition__booth {
	padding: 3rem 0 5rem;
}

.exhibition__booth-title {
	font-size: 1.6rem;
}

.exhibition__booth-img-container {
	margin-top: 2rem;
}

/* ステージ */
.stage__visual {
	margin-top: 5rem;
	block-size: 54.5vw;
	background: url(/ceatec/assets/index/images/stage-img.jpg) no-repeat bottom / cover;
}

.stage__detail {
	padding-top: 6rem;
}

/* 開催概要 */
.about__table {
	margin-top: 6rem;
}

.about-img {
	margin-top: 6rem;
}

.table-base {
	inline-size: 100%;
}

.table-base__row {
	border-top: solid 2px var(--border-gray);
	border-bottom: solid 2px var(--border-gray);
	--table-cell-padding-tb: 1rem;
	--table-cell-padding-lr: 1rem;
	font-size: 1.4rem;

	>th {
		inline-size: 22%;
		padding: var(--table-cell-padding-tb);
		background-color: var(--table-bg-gray);
		font-size: 1.6rem;
	}

	>td {
		padding: var(--table-cell-padding-tb);
	}
}

.list-period {
	font-size: 1.5rem;
}

.list-period-end {
	display: inline-block;
}

.list-place-text {
	font-size: 1.5rem;
}

.list-place-map {
	display: block;
}

/* ====================================
	ホバー、マウスポインタが有効なデバイス
==================================== */
@media (hover:hover) and (pointer: fine) {}

/* ====================================
	768px未満専用スタイル
==================================== */
@media screen and (width <768px) {

	/* 展示ブース */
	.exhibition__category-text {
		padding-inline: 5%;
	}
}

/* ====================================
	768px以上専用スタイル
==================================== */
@media screen and (width >=768px) {

	/* メインビジュアル */
	.main-visual {
		justify-content: center;
		block-size: 40rem;
		background: url(images/main-visual.jpg) no-repeat bottom / cover;
	}

	.main-visual-title-wrap {
		margin-left: 50%;
		padding-bottom: 2.5%;
		padding-right: 0;
	}

	.main-visual-logo {
		inline-size: 20rem;
	}

	.main-visual-year {
		margin-bottom: 0.5em;
		font-size: 1.6rem;
	}

	.main-visual-date {
		font-size: 1.5rem;

		span {
			font-size: 2.2rem;
		}
	}

	.main-visual-place {
		margin-top: 0.8em;
		font-size: 3.2rem;
	}

	/* 展示ブース */
	.flex__item:first-child .exhibition__category-text-wrap {
		padding-left: 3%;
	}

	.flex__item:last-child .exhibition__category-text-wrap {
		padding-right: 3%;
	}
}

/* ====================================
	768px以上1080px未満専用スタイル
==================================== */
@media screen and (768px <=width < 1080px) {}

/* ====================================
	1080px未満専用スタイル
==================================== */
@media screen and (width <1080px) {

	/* 展示ブース：展示ブースイメージ */
	.exhibition__booth-text-wrap,
	.exhibition__booth-cursor {
		display: none;
	}
}

/* ====================================
	1080px以上専用スタイル
==================================== */
@media print,
screen and (1080px <=width) {

	/* メインビジュアル */
	.main-visual {
		block-size: 63rem;
		background: url(images/main-visual.jpg) no-repeat bottom / cover;
	}

	.main-visual-title-wrap {
		margin-left: 50%;
		padding-bottom: 2.5%;
	}

	.main-visual-logo {
		inline-size: 28rem;
	}

	.main-visual-date {
		font-size: 2.4rem;

		span {
			font-size: 4.2rem;
		}
	}

	.main-visual-place {
		font-size: 3.8rem;
	}

	/* イントロ */
	.intro {
		padding: 10rem 0 12rem;
	}

	.intro-title {
		max-inline-size: 60rem;
	}

	.intro-sub-title {
		margin-bottom: 5rem;
		font-size: 1.6rem;
	}

	.intro-text {
		margin-top: 8rem;
		font-size: 2rem;
	}

	/* NEWS */
	.news {
		padding: 3rem 0;
	}

	.news-wrap {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 7rem;
		font-size: 1.6rem;
	}

	.list-news {
		margin-top: 0;
	}

	.list-news>.list-item {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 3rem;
	}

	.news-title {
		font-size: 1.6rem;
	}

	/* セクション */
	.section {
		padding-top: 15rem;
	}

	.section-title {
		font-size: 6.4rem;
		line-height: 1.2;
	}

	.section-title-jp {
		font-size: 2rem;
	}

	/* 展示ブース */
	.exhibition__category {
		padding-top: 5rem;
		padding-bottom: 10rem;

		.flex__item {
			display: flex;
			flex-wrap: wrap;
			align-content: start;
			flex-basis: 50%;
		}

		.flex__item:first-child .exhibition__category-text {
			padding: 5rem 5% 0 0;
		}
	}

	.exhibition__category-text {
		padding: 5rem 0 0 5%;
	}

	.exhibition__category-img {
		inline-size: 100%;
	}

	.exhibition__category-text {
		max-inline-size: 60rem;
	}

	.exhibition-title {
		font-size: 4rem;
	}

	.exhibition-text {
		font-size: 2rem;
	}

	/* 展示ブース：展示ブースイメージ */
	.exhibition__booth {
		padding: 4rem 0 8rem;
	}

	.exhibition__booth-title {
		font-size: 2rem;
	}

	.exhibition__booth-img-container {
		padding-bottom: 7rem;
		position: relative;
	}

	.exhibition__booth-cursor {
		display: inline-grid;
		grid-template-columns: auto 1fr;
		gap: 1rem;
		align-items: center;
		padding: 1rem 1.5rem 1rem 1rem;
		background-color: var(--light-gray);
		border-radius: 5rem;
		position: absolute;
		right: 0;
		bottom: 0;

		.icon-cursor {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			inline-size: 3.5rem;
			aspect-ratio: 1;
			background-color: #fff;
			border-radius: 5rem;

			img {
				display: inline-block;
				inline-size: 1.2rem;
			}
		}
	}

	.exhibition__booth-cursor-text {
		font-size: 1.4rem;
	}

	.exhibition__booth-text-wrap {
		min-block-size: 11lh;
		padding: 1em 1em;
		border-bottom: solid 1px #000;
	}

	.exhibition__booth-default {
		font-size: 1.6rem;
		font-weight: 400;
	}

	.exhibition__booth-zone {
		margin-bottom: 0.5em;
	}

	.exhibition__booth-zone-title {
		font-size: 2rem;
	}

	.exhibition__booth-zone-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-content: center;
		min-block-size: 6lh;
		margin-top: 1.5em;

		li {
			inline-size: 100%;
			margin-top: 0.25em;
			display: none;
		}
	}

	/* ステージ */
	.stage__visual {
		block-size: 32.4vw;
	}

	/* 開催概要 */
	.about__table {
		margin-top: 6rem;
	}

	.table-base__row {
		--table-cell-padding-tb: 2rem;
		--table-cell-padding-lr: 4rem;
		font-size: 1.6rem;

		>th {
			padding: var(--table-cell-padding-tb);
			font-size: 2rem;
		}

		>td {
			padding: var(--table-cell-padding-tb) var(--table-cell-padding-lr);
		}
	}

	.list-period {
		font-size: 2rem;
	}

	.list-place-text {
		font-size: 1.8rem;
	}

	.list-place-map {
		display: inline-block;
		margin-left: 0.5em;
	}

}

/* ====================================
	1600px以上専用スタイル
==================================== */
@media screen and (width >=1600px) {
	.main-visual {
		inline-size: 100%;
		block-size: 39.4vw;
	}
}