/* ==================================================
	base
================================================== */

.main_content {
	line-height: 1.374;
}
.main_content img {
	height: auto;
}
.main_content p + p {
	margin-top: 1em;
}



/* ----------------------------------------
	root
---------------------------------------- */

:root {
	--Electric-Blue: #024ad8;
	--Power-Storm: #568393;
	--Orange-Bloom: #ff5050;
	--Standard-gray: #e6e6e6;
	--Light-gray: #f2f2f2;
}



/* ----------------------------------------
	breadcrumbs, title
---------------------------------------- */

.page_title_area_aem {
	display: none;
}

@media screen and (max-width: 1023px) {
	.breadcrumbs.for_mobile {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.breadcrumbs.for_pc {
		display: none;
	}
}



/* ----------------------------------------
	page_top
---------------------------------------- */

@media screen and (min-width: 1024px) {
	.page_top {
		margin-top: 40px;
	}
}





/* ==================================================
	common
================================================== */

/* ----------------------------------------
	cont_wrap
---------------------------------------- */

.cont_wrap {
	padding: 40px 20px;
}

@media screen and (min-width: 768px) {
	.cont_wrap {
		padding: 60px 30px;
	}
}





/* ==================================================
	main
================================================== */

.main .media img {
	object-fit: cover;
	min-height: 300px;
}
.main .cont {
	color: #fff;
	background: #000;
}
.main .cont .title,
.main .cont .description {
	padding: 15px 20px;
	border-top: 1px solid #fff;
}

@media screen and (min-width: 768px) {
	.main .cont .title,
	.main .cont .description {
		padding-right: 30px;
		padding-left: 30px;
	}
}

@media screen and (min-width: 1024px) {
	.main {
		position: relative;
	}
	.main .media {
		text-align: center;
	}
	.main .media img {
		min-height: 600px;
		max-height: 750px;
	}
	.main .cont {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		background: rgb(0 0 0 / .3);
	}
}





/* ==================================================
	overview
================================================== */

.overview_table {
	table-layout: fixed;
	width: 100%;
	margin-top: 30px;
	border-top: 1px solid #ccc;
}
.overview_table th,
.overview_table td {
	padding: 1em;
	overflow-wrap: break-word;
	border-bottom: 1px solid #ccc;
}
.overview_table th {
	width: 160px;
	font-weight: normal;
	text-align: center;
	background: var(--Light-gray);
}

@media screen and (max-width: 767px) {
	.overview_table th,
	.overview_table td {
		font-size: 14px;
	}
	.overview_table th {
		width: 6em;
	}
	.overview_table td dt:nth-child(n+2) {
		margin-top: .5em;
	}
}

@media screen and (min-width: 768px) {
	.overview_table td dl {
		display: grid;
		grid-template-columns: 5em 1fr;
		row-gap: .5em;
	}
}





/* ==================================================
	program
================================================== */

.program_list {
	margin-top: 30px;
}
.program_list > div {
	padding: 20px 15px;
}
.program_list .item {
	display: grid;
	row-gap: 15px;
}
.program_list > div:nth-child(even) {
	background: var(--Light-gray);
}
.program_list .title {
	font-size: 20px;
}
.program_list .speaker {
	display: grid;
	row-gap: 10px;
}
.program_list .speaker + .speaker {
	margin-top: 20px;
}
.program_list .speaker .photo img {
	border-radius: 50%;
}
.program_list .profile .position {
	font-size: 14px;
}
.program_list .profile .name {
	margin-bottom: 5px;
	font-size: 18px;
}
.program_list .profile .c-button-link-with-arrow {
	padding-left: 0;
	margin-top: 5px;
}
.program_list .theme {
	color: #fff;
	font-size: 20px;
	background: var(--Electric-Blue);
}

@media screen and (min-width: 480px) {
	.program_list .speaker {
		grid-template-columns: 100px 1fr;
		column-gap: 20px;
	}
}

@media screen and (min-width: 1024px) {
	.program_list > div {
		padding: 20px;
	}
	.program_list .item {
		grid-template-columns: 100px 1fr 32%;
		column-gap: 20px;
	}
}

@media screen and (min-width: 1280px) {
	.program_list .item {
		grid-template-columns: 100px 1fr 340px;
	}
}