.main-visual {
	height: auto;
	max-width: 847px;
	width: 100%;
}
.content-width {
	margin: 0 auto;
	max-width: 1100px;
}
section {
	padding: 150px 0;
}
.sp-only {
	display: none;
}

@media screen and (max-width: 767px) {
	.content-width {
		padding: 0 20px;
		width: 100%;
	}
	section {
		padding: 100px 0;
	}
	.pc-only {
		display: none;
	}
	.sp-only {
		display: block;
	}
}

section h2 {
	font-size: 2rem;
	font-weight: 400;
}

@media screen and (max-width: 767px) {
	section h2 {
		font-size: 4rem;
	}
}

section .area-headline {
	align-items: baseline;
	display: flex;
	line-height: 1;
}

section .area-headline h2 {
	flex-basis: auto;
}

section .area-headline h2 span{
	margin-left: .25em;
}

section .area-headline .underline {
	border-bottom: 1px solid #00C67A;
	content: "";
	flex-basis: 100%;
	left: 45px;
	position: relative;
	width: 100%;
}

section .content .title {
	align-items: center;
	display: flex;
	height: 42px;
	gap: 20px;
}

section .content .title h3 {
	font-size: 2.8rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2px;
}

section .content .entry {
	font-size: 7.6rem;
	font-weight: 400;
	margin-top: 80px;
	text-align: center;
}

section .content .request {
	font-size: 2.8rem;
	font-weight: 700;
	letter-spacing: 1px;
	margin-top: 10px;
	text-align: center;
}

section .content .entry-text {
	background-image: url("./images/entry_01.png");
	height: 100%;
	margin-top: 45px;
	padding: 20px;
	width: 100%;
}

section .content .entry-text .wrap-text {
	background-color: rgba(0, 0, 0, 0.8);
	padding: 40px 20px;
	text-align: center;
}

section .content .entry-text .wrap-text p {
	color: #fff;
	font-size: 1.6rem;
	font-weight: 400;
}

section .content .entry-text .wrap-text ul {
	margin: 40px auto 0;
	width: 580px;
}

section .content .entry-text .wrap-text ul li {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
	text-align: left;
}

@media screen and (max-width: 767px) {
	section .content .entry-text .wrap-text ul {
		width: 100%;
	}
	
	section .content .title {
		flex-wrap: wrap;
		height: auto;
	}
	
	section .area-headline .underline {
		flex-basis: auto;
		margin-left: 20px;
		position: static;
		width: 100%;
	}
}

section.section-time-table .content .entry {
	color: #fff;
}

section.section-time-table .content .request {
	color: #fff;
}

section.section-time-table .content .entry-text .wrap-text {
	background-color: rgba(255, 255, 255, 0.7);
}

section.section-time-table .content .entry-text .wrap-text p {
	color: #001215;
}

section.section-time-table .content .entry-text .wrap-text ul li {
	color: #001215;
}

.label {
	background-color: #00C67A;
	display: inline-block;
	font-size: 1.8rem;
	font-weight: 400;
	line-height: 1;
	padding: 10px 30px;
	text-align: center;
}

.aurora {
  position: absolute;
  width: .001vmin;
  height: .001vmin;
  border-radius: 50%;
  opacity: .25;
}

.aurora:nth-child(1) {
  box-shadow: 0 0 var(--diameter) var(--diameter) magenta;
  animation: 
    hue 10s 0s linear infinite,
    move1 19s 0s linear infinite;
}

.aurora:nth-child(2) {
  box-shadow: 0 0 var(--diameter) var(--diameter) white;
  animation: 
    hue 15s 0s linear infinite,
    move2 25s 0s linear infinite;
}

.aurora:nth-child(3) {
  box-shadow: 0 0 var(--diameter) var(--diameter) cyan;
  animation: 
    hue 20s 0s linear infinite,
    move3 15s 0s linear infinite;
  opacity: .2;
}

@keyframes hue {
  0% { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(360deg); }
}

@keyframes move1 {
  0% {
    top: 0vh;
    left: 50vw;
  }
  25% {
    left: 0vw;
  }
  50% {
    top: 100vh;
  }
  75% {
    left: 100vw;
  }
  100% {
    top: 0vh;
    left: 50vw;
  }
}

@keyframes move2 {
  0% {
    top: 50vh;
    left: 100vw;
  }
  25% {
 	top:  100vh;
  }
  50% {
    left: 0vw;
  }
  75% {
    top: 0vh;
  }
  100% {
    top: 50vh;
    left: 100vw;
  }
}

@keyframes move3 {
  0% {
    top: 100vh;
    left: 50vw;
  }
  25% {
 	left: 100vw;
  }
  50% {
    top: 0vh;
  }
  75% {
    left: 0vw;
  }
  100% {
    top: 100vh;
    left: 50vw;
  }
}

section.section-top {
	background-color: #000;
	/*
	background: rgb(0,0,0);
	background: linear-gradient(45deg, rgba(0,0,0,1) 0%, rgba(29,52,34,1) 65%, rgba(50,85,49,1) 100%);
	*/
	padding-bottom: 325px;
	padding-top: 0;
	position: relative;
}

section.section-top header {
	align-items: center;
	margin-right: 40px;
	padding-top: 40px;
	position: sticky;
	z-index: 10;
}

section.section-top header .nav {
	display: flex;
	gap: 0 35px;
	z-index: 100;
}

section.section-top header .nav a span {
	font-size: 1.6rem;
	font-weight: 700;
}

section.section-top header .link-entry {
	margin-left: unset;
	margin-right: unset;
	margin-top: unset;
}

section.section-top .conten-width {
	margin-top: 140px;
	position: relative;
	z-index: 1;
}

section.section-top h1 {
	color: #fff;
	font-size: 5.6rem;
	font-weight: 700;
	line-height: 1.4;
}

section.section-top h1 span {
	display: block;
}

section.section-top .schedule {
	margin-top: 45px;
}

section.section-top .schedule .wrap-data {
	align-items: center;
	display: flex;
	gap: 10px;
}

section.section-top .schedule .open-data {
	color: #fff;
	font-size: 3.2rem;
	font-weight: 700;
}

section.section-top .schedule .week {
	align-items: center;
	background-color: #001215;
	border: 1px solid #fff;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	height: 50px;
	width: 50px;
}

section.section-top .schedule .week span {
	color: #00C478;
	font-size: 2rem;
}

section.section-top .schedule .place {
	color: #fff;
	font-size: 2.8rem;
	font-weight: 700;
	margin-top: 5px;
}

section.section-top .schedule .sponsor {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 400;
	margin-top: 30px;
}

section.section-top .schedule .co-post {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 400;
	margin-top: 5px;
	padding-left: 3em;
	text-indent: -3em;
}

section.section-top h2 {
	color: #fff;
	margin-top: 100px;
}

section.section-top .message {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 400;
	margin-top: 70px;
}

section.section-top .message p {
	line-height: 2.4;
}

section.section-top .list {
	background-color: #DDE0DE;
	border: 10px solid #BCC4BE;
	margin-top: 60px;
	padding: 40px 35px;
}

section.section-top .list p {
	align-items: center;
	color: #001215;
	display: flex;
	font-size: 1.8rem;
	font-weight: 700;
	gap: 0 20px;
	line-height: 1.4;
}

section.section-top .list p + p {
	margin-top: 25px
}

section.section-top .list p span {
	color: #00C67A;
	font-size: 5.6rem;
}

section.section-top .wrap-images {
	display: flex;
	position: absolute;
	justify-content: center;
	margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
	margin-top: 70px;
	overflow: hidden;
}

section.section-top .wrap-images img {
	flex-basis: 360px;
	height: 360px;
	width: 360px;
}

section.section-top .wrap-images img:nth-child(odd) {
	margin-top: 80px;
}

@media screen and (max-width: 767px) {
	section.section-top {
		padding-bottom: 150px;
	}
	
	section.section-top .wrap-images {
		display: flex;
		position: absolute;
		justify-content: center;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		margin-top: 70px;
	}
	section.section-top .wrap-images img {
		flex-basis: 25%;
		height: 120px;
		width: 120px;
	}
	
	section.section-top .wrap-images img:nth-child(odd) {
		margin-top: 45px;
	}
}

@media screen and (max-width: 767px) {
	section.section-top .conten-width {
	margin-top: 150px;
	}
	
	section.section-top h1 {
		font-size: 4rem;
	}
	section.section-top .schedule .open-data {
		font-size: 2.2rem;
	}
	
	section.section-top .schedule .place {
		font-size: 1.8rem;
	}
	
	section.section-top .schedule .sponsor {
		font-size: 1.6rem;
	}
	
	section.section-top .schedule .co-post {
		font-size: 1.6rem;
	}
}

section.section-outline {
	padding-top: 300px;
}

section.section-outline .content .inner {
	margin-top: 60px;
}

section.section-outline .content .inner .list {
	margin-top: 40px;
}

section.section-outline .content .inner .list .row {
	align-items: center;
	border-top: 1px solid #CBCBCB;
	display: flex;
}

section.section-outline .content .inner .list .row:last-child {
	border-bottom: 1px solid #CBCBCB;
}

section.section-outline .content .inner .list .row .name {
	border-right: 1px solid #CBCBCB;
	flex-basis: 155px;
	font-size: 1.6rem;
	font-weight: 700;
	margin: 20px 0;
	padding: 10px 30px;
}

section.section-outline .content .inner .list .row .detail {
	flex-basis: auto;
	font-size: 1.6rem;
	font-weight: 400;
	margin: 20px 0;
	padding: 10px 30px;
}

section.section-outline .content .inner h4 {
	font-size: 2.2rem;
	font-weight: 700;
	margin-top: 40px;
}

section.section-outline .content ul {
	margin-top: 30px;
}

section.section-outline .content ul li {
	font-size: 1.6rem;
	font-weight: 400;
	margin-left: 50px;
	position: relative;
}

section.section-outline .content ul li + li {
	margin-top: 5px;
}

section.section-outline .content ul li span {
	margin-left: 1em;
}
section.section-outline .content ul li:last-child span {
	margin-left: 2em;
}

section.section-outline .content ul li::before {
	background-color: #00C67A;
	content: "";
	display: inline-block;
	height: 2px;
	left: -25px;
	margin: 15px 0;
	position: absolute;
	top: 0;
	width: 10px;
}

section.section-outline .content .border {
	border: 1px solid #001215;
	height: 1px;
	margin-top: 80px;
	position: relative;
	width: 100%;
}

section.section-outline .content .border::before {
	background-image: url("./images/arrow_down.png");
	background-repeat: no-repeat;
	content: "";
	height: 39px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 81px;
}

@media screen and (max-width: 767px) {
	section.section-outline {
		padding-top: 150px;
	}
	section.section-outline .content .inner .list .row .name {
		flex-basis: 130px;
	}
	section.section-outline .content .inner .list .row .detail {
		flex-basis: calc(100% - 130px);
	}
}

section.section-time-table {
	background-color: #001215;
	position: relative;
	z-index: 9;
}

section.section-time-table .area-headline {
	color: #fff;
	
}

section.section-time-table .content .inner {
	color: #fff;
}

section.section-time-table .content .inner h4 {
	font-size: 2.2rem;
	font-weight: 700;
	margin-top: 80px;
}

section.section-time-table .content .inner h4 span {
	font-size: 1.8rem;
}

section.section-time-table .content .inner .schedule {
	align-items: center;
	display: flex;
	gap: 20px;
	margin-top: 60px;
}

section.section-time-table .content .inner .schedule .time {
	border: 1px solid #fff;
	flex-basis: 144px;
	padding: 6px 10px 5px 20px;
	position: relative;
	text-align: center;
	width: 144px;
}

section.section-time-table .content .inner .schedule .time::before {
	background-color: #00C67A;
	content: "";
	height: 2px;
	left: -10px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	z-index: 1;
}

section.section-time-table .content .inner .schedule .session-title {
	flex-basis: calc(100% - 144px);
	position: relative;
}

section.section-time-table .content .inner .schedule .session-title.none-time .main-title {
	margin-left: 20px;
}

section.section-time-table .content .inner .schedule .session-title.none-time::before {
	background-color: #00C67A;
	content: "";
	height: 2px;
	left: -10px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	z-index: 1;
}

section.section-time-table .content .inner .schedule .session-title .sub-title {
	font-size: 1.6rem;
	font-weight: 400;
}

section.section-time-table .content .inner .schedule-description {
	font-size: 1.6rem;
	font-weight: 400;
	margin-top: 25px
}

section.section-time-table .content .inner .schedule .session-title.none-time {
	margin-left: 10px;
}

section.section-time-table .content .inner .schedule .session-title .main-title {
	font-size: 2.2rem;
	font-weight: 400;
}

section.section-time-table .content ul {
	margin-top: 15px;
}

section.section-time-table .content ul li {
	font-size: 1.6rem;
	font-weight: 400;
	margin-left: 50px;
	position: relative;
}

section.section-time-table .content ul li + li {
	margin-top: 5px;
}

section.section-time-table .content ul li span {
	margin-left: 1em;
}

section.section-time-table .content ul li::before {
	background-color: #00C67A;
	content: "";
	display: inline-block;
	height: 2px;
	left: -25px;
	margin: 15px 0;
	position: absolute;
	top: 0;
	width: 10px;
}


section.section-time-table .content .border {
	border: 1px solid #fff;
	height: 1px;
	margin-top: 140px;
	position: relative;
	width: 100%;
}

section.section-time-table .content .border::before {
	background-image: url("./images/arrow_down_white.png");
	background-repeat: no-repeat;
	content: "";
	height: 44px;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 81px;
}

section.section-time-table .content .inner .wrap-speaker {
	display: flex;
	flex-wrap: wrap;
	gap: 45px;
	margin-top: 35px;
}

section.section-time-table .content .inner .wrap-speaker .speaker {
	display: grid;
	flex-basis: 50%;
	gap: 25px 15px;
	grid-template-columns: 100px 1fr;
	grid-template-areas:
		"speakerImage speakerName"
		"speakerImage speakerInfo";
	max-width: 420px;
	position: relative;
	z-index: 1;
}

section.section-time-table .content .inner .speaker::before {
	background-color: #fff;
	content: "";
	height: 1px;
	left: 0;
	position: absolute;
	top: 48px;
	width: 100%;
	z-index: -1;
}

section.section-time-table .content .inner .speaker img {
	grid-area: speakerImage;
}

section.section-time-table .content .inner .speaker .speaker-name {
	align-items: center;
	display: flex;
	grid-area: speakerName;
	justify-content: space-between;
	margin-top: 5px;
}

section.section-time-table .content .inner .speaker .speaker-name p {
	font-size: 2rem;
	font-weight: 600;
}

section.section-time-table .content .inner .speaker .speaker-name span {
	font-size: 1.6rem;
	font-weight: 600;
	margin-left: .3rem;
}

section.section-time-table .content .inner .speaker  .speaker-name button {
	border: 1px solid #fff;
	border-radius: 30px;
	font-size: 1rem;
	font-weight: 400;
	height: 20px;
	line-height: 1;
	padding: 0 8px;
}

section.section-time-table .content .inner .speaker .speaker-info {
	font-size: 1.4rem;
	font-weight: 400;
	grid-area: speakerInfo;
}

section.section-time-table .content .inner .schedule-description {
	font-size: 1.6rem;
	font-weight: 400;
	margin-top: 30px;
}

section.section-time-table .content .inner .schedule-list {
	margin-top: 15px;
}

section.section-time-table .content .inner .schedule-list li {
	font-size: 1.6rem;
	font-weight: 400;
}

section.section-time-table .content .inner .schedule-list li + li {
	margin-top: 5px;
}

section.section-time-table .content .inner .schedule-list li span {
	margin-right: 3em;
}

section.section-time-table .content .inner h5 {
	font-size: 1.8rem;
	font-weight: 700;
	margin-top: 30px;
}

section.section-time-table .content .inner .wrap-speaker-noimage {
	display: flex;
	flex-wrap: wrap;
	gap: 30px 50px;
	margin-top: 35px;
}

section.section-time-table .content .inner .wrap-speaker-noimage .speaker {
	display: grid;
	flex-basis: 30%;
	gap: 30px 15px;
	grid-template-columns: 1fr;
	grid-template-areas:
		"speakerName"
		"speakerInfo";
	max-width: 420px;
	position: relative;
	z-index: 1;
}

@media screen and (max-width: 767px) {
	section.section-time-table .content .inner .schedule {
		flex-wrap: wrap;
	}
	
	section.section-time-table .content .inner .schedule .time {
		margin-left: 10px;
	}
	
	section.section-time-table .content .inner .schedule .session-title {
		flex-basis: 100%;
	}
	
	section.section-time-table .content .inner .schedule .session-title .sub-title {
		font-size: 1.4rem;
	}
	
	section.section-time-table .content .inner .schedule-description {
		font-size: 1.4rem;
	}
	
	section.section-time-table .content .inner .schedule .session-title .main-title {
		font-size: 1.8rem;
	}
	
	section.section-time-table .content .inner .speaker .speaker-name {
		font-size: 1.6rem;
	}
	
	section.section-time-table .content .inner .speaker .speaker-name span {
		font-size: 1.2rem;
	}
	
	
	section.section-time-table .content .inner .schedule-list {
		margin-top: 15px;
		padding-left: 1.5em;
		text-indent: -1.5em;
	}

	section.section-time-table .content .inner .schedule-list li {
		font-size: 1.4rem;
	}
	
	section.section-time-table .content .inner .schedule-list li span {
		margin-right: .5em;
	}
	
	section.section-time-table .content .inner .speaker::before {
		
	}
	
	section.section-time-table .content .inner .wrap-speaker-noimage .speaker {
		flex-basis: 100%;
		gap: 15px;
	}
	
	section.section-time-table .content .inner .wrap-speaker-noimage .speaker::before {
		top: 30px;
	}
}

section.section-sponsor h2 {
	font-size: 2.8rem;
	font-weight: 400;
	position: relative;
	text-align: center;
}

section.section-sponsor h2::before {
	background-color: #00C67A;
	content: "";
	height: 1px;
	left: 50%;
	position: absolute;
	top: calc(100% + 5px);
	transform: translateX(-50%);
	width: 20px;
	z-index: 1;
}

section.section-sponsor .group-sponsor {
	padding: 30px 0 45px;
}

section.section-sponsor .group-sponsor + .group-sponsor {
	border-top: 1px solid #D8D8D8;
}

section.section-sponsor .wrap-sponsor {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 45px;
	margin-top: 40px;
}

section.section-sponsor .wrap-sponsor img {
	flex-basis: auto;
	height: auto;
	width: auto;
}


@media screen and (max-width: 767px) {
	section.section-sponsor .wrap-sponsor {
		flex-direction: column;
	}
}

footer {
	background-color: #001215;
	padding: 120px 0 100px;
}

footer .content-width {
	align-items: flex-end;
	display: flex;
	gap: 40px 0;
	justify-content: space-between;
}

footer p {
	color: #fff;
	font-size: 1.6rem;
	padding-bottom: 10px;
}

@media screen and (max-width: 767px) {
	footer .content-width {
		justify-content: center;
		flex-wrap: wrap;
	}
	
	footer img {
		flex-basis: auto;
	}
	
	footer .copyright {
		flex-basis: 100%;
	}
	
	footer p {
		font-size: 1.4rem;
		text-align: center;
	}
}

.link-entry {
	align-items: center;
	background-color: rgba(0, 18, 21, 1);
	border: 1px solid #fff;
	border-radius: 90px;
	display: flex;
	font-size: 1.6rem;
	font-weight: 400;
	height: 60px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	max-width: 300px;
	padding: 20px 25px;
	position: relative;
	transition: all .2s;
	width: 100%;
}

.link-entry:hover {
	background-color: rgba(255, 255, 255, 1);
	border: 1px solid #00C67A;
	opacity: 1;
}

.link-entry:hover span {
	color: #001215;
	font-weight: 700;
}

.link-entry::before {
	background-image: url("./images/arrow_green.svg");
	background-repeat: no-repeat;
	content: "";
	height: 15px;
	position: absolute;
	right: 25px;
	width: 12px;
}

.link-entry span {
	color: #fff;
	font-size: 1.6rem;
	font-weight: 400;
}

.blur {
	--blur-color: 0, 49, 46;
	aspect-ratio: 1 / 1;
	background: radial-gradient(circle, rgb(var(--blur-color)), rgba(var(--blur-color), 0));
	border-radius: 50%;
	filter: blur(37px);
	position: absolute;
	width: min(100%, 240px);
	z-index: -1;
}

.blur-01 {
	left: 930px;
	top: 0;
}

.blur-02 {
	left: 10px;
	top: 100px;
}

.blur-03 {
	left: -50px;
	top: 980px;
}

.blur-04 {
	left: 900px;
	top: 2150px;
}

.blur-05 {
	left: -40px;
	top: 3250px;
}

@media screen and (max-width: 767px) {
	section.section-time-table .content .inner .wrap-speaker .speaker {
		flex-basis: 100%;
	}
	
	.blur {
		display: none;
	}
}

.hamburger {
	display: none;
}

.hamburger_bar {
  display: block;
  width: 100%;
  height: 4px;
  position: absolute;
  left: 0;
  background: #fff;
  transition: top 0.24s, transform 0.24s, opacity 0.24s;
}

.hamburger_bar:nth-child(1) {
  top: 0;
}

.hamburger_bar:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}

.hamburger_bar:nth-child(3) {
  top: 100%;
  transform: translateY(-100%);
}

.hamburger_bar.is_active:nth-child(1) {
  top: 50%;
  transform: translateY(-50%) rotate(135deg);
}

.hamburger_bar.is_active:nth-child(2) {
  transform: translate(50%, -50%);
  opacity: 0;
}

.hamburger_bar.is_active:nth-child(3) {
  top: 50%;
  transform: translateY(-50%) rotate(-135deg);
}

.nav {
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 99;
  display: flex;
  justify-content: flex-end;
  opacity: 1;
  transition: opacity 0.24s;
}

.nav.is_active {
  opacity: 1;
  pointer-events: auto;
}

.nav-list {
	align-items: center;
  display: flex;
  flex-direction: row;
	justify-content: flex-end;
	margin-top: 40px;
  gap: 30px;
	width: 100%;
}

.nav-list .nav-item {
	flex-basis: auto;
	display: none;
}

.nav-list .nav-item a {
	color: #fff;
	font-size: 1.6rem;
	font-weight: 700;
}

@media screen and (max-width: 767px) {
	section.section-top header {
		margin-right: 0;
	}
	
	.nav-list {
		justify-content: center;
	}
}

.modal__trigger {
  cursor: pointer;
}

.modal-bg {
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0, 0.6);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
	transition: .3s;
}

.modal__wrapper {
	border: 1px solid #707070;
	display: none;
  position: fixed;
  top: 50%;
	transform: translate(-50%, -50%);
  left: 50%;
	max-width: 1100px;
  width: 100%;
	max-height: 610px;
  height: 100%;
  z-index: 10;
}

.modal__wrapper::before {
	background-color: rgba(0, 0, 0, 0.6);
	content: "";
	display: block;
	height: 200%;
	margin: -230px;
	top: 0;
	position: relative;
}

@media screen and (max-width: 767px) {
	.modal__wrapper {
		height: 80%;
	}
	
	.modal__wrapper::before {
		top: -50%;
	}
}

.modal__layer {
  height: 100%;
  cursor: pointer;
}

.modal__container {
  background-color: #FFFFFF;
  height: 100%;
  left: 50%;
  padding: 20px 0 20px 40px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

.modal__inner {
  position: relative;
  overflow-y: auto;
  height: 100%;
  padding: 0 40px 0 0;
}

/* モーダルを閉じるボタン */
.modal__close {
  position: absolute;
  top: -9px;
  right: 12px;
  width: 44px;
  height: 44px;
  background-color: transparent;
  cursor: pointer;
  transition: opacity .6s;
	z-index: 9;
}

.modal__close:hover {
  opacity: .6;
}

.modal__close:before,
.modal__close:after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 25px;
  height: 3px;
  background-color: #00C67A;
  content: '';
}

.modal__close:before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.modal__close:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* モーダル内のコンテンツ */
.modal__content {
}

.modal__speaker {
	color: #fff;
	margin-top: 20px;
}

.modal__speaker {
	display: grid;
	flex-basis: 50%;
	gap: 30px 15px;
	grid-template-columns: 100px 1fr;
	grid-template-areas:
		"speakerImage speakerInfo"
		"speakerImage speakerName";
	max-width: 420px;
	position: relative;
	z-index: 1;
}

.modal__speaker img {
	grid-area: speakerImage;
}

.modal__speaker .speaker-name {
	font-size: 2rem;
	font-weight: 600;
	grid-area: speakerName;
	
}

.modal__speaker .speaker-name span {
	font-size: 1.6rem;
	font-weight: 600;
	margin-left: .3rem;
}

.modal__speaker .speaker-info {
	font-size: 1.4rem;
	font-weight: 400;
	grid-area: speakerInfo;
}

.modal__text {
	color: #fff;
	font-size: 1.4rem;
	font-weight: 400;
  margin-top: 30px;
  line-height: 1.6;
}

.modal-bg {
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  transition: .3s;
}