@charset "UTF-8";

.pageImage {
	margin-bottom: 5rem;
}

.coursesOfferd {
	margin-bottom: 5rem;
}

.sectionTitle {
	margin-bottom: 5rem;
}


/*  テーブル  */

.subjectList {
	
}

.tableScroll {
	overflow-x: auto;
	width: 95%;
	margin: 0 0 1.3rem auto;
}

.curriculumTable {
	width: 100rem;   /* これ */
	font-size: 1.4rem;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 400;
}

.curriculumTable thead th {
	font-weight: 500;
	height: 5.5rem;
	background: #00693E;
	color: #fff;
	border-right: 1px solid #fff;
}

.curriculumTable thead th:last-of-type {
	border-right: none;
}

.curriculumTable tbody tr:nth-child(odd) {
	background: #fff;
}

.curriculumTable tbody tr:nth-child(even) {
	background: #CCF7E5;
}

.curriculumTable tbody th {
	font-weight: 500;
	line-height: 1.8em;
}

.curriculumTable tbody td {
	padding: 1.7rem 0 1.7rem 1.4rem ;
	line-height: 1.8em;
	border-left: 1px solid #00693E;
}

.curriculumTable tbody td .required {
	font-weight: 500;
}

.curriculumTable tbody td .blue {
	color: #00B9EF;
}

.curriculumTable tbody td .orange {
	color: #F8B62D;
}

.subjectList .caption {
	font-family: "Zen Kaku Gothic New", sans-serif; 
	font-size: 1.3rem;
	display: flex;
	width: 90%;
	margin: 0 auto;
}

.subjectList .caption li:first-of-type {
	margin-right: 1em;
}

.subjectList .caption li .blue {
	color: #00B9EF;
}

.subjectList .caption li .orange {
	color: #F8B62D;
}

.lecture {
	margin-bottom: 5rem;
}

.lecture .bottomMain {
	margin-bottom: 5rem;
}

.lecture .bottomMain:last-of-type {
	margin-bottom: 0;
}

.remark {
	margin-bottom: 1.5rem;
	font-size: 1.1rem;
	display: flex;
	border: 1px solid #00693E;
	width: fit-content;
	    font-family: "Zen Kaku Gothic New", sans-serif;
    font-weight: 500;
}

.remark dt {
	padding: .3em 0.6em;
    background: #00693E;
    color: #fff;
	min-width: 4.2em;
	border-right: 1px solid #00693E;
}

.remark dd {
	padding: .3em 0.6em;
    background: #fff;
    color: #00693E;
	min-width: 4.2em;
	text-align: center;
}

.remark.right {
	margin: 0 0 1.5rem auto;
}


.professor {
	margin-top: 2rem;
	font-size: 1.4rem;
}

.professor.right {
	text-align: right;
}

.practicalTraning {
	margin-bottom: 5rem;
}

.practicalTraning .bottomMain {
	margin-bottom: 5rem;
}

.otherTraining {
	margin-bottom: 5rem;
	background: #E5F0EC;
	padding: 5rem 0;
}



/* FOS MOVIE */
/* PC */
.fosMovie .fosMovie__icon {
	  width: 15.5rem;
      margin: 0 auto 2.5rem;
}

.fosMovie .txt {
	font-size: 2.2rem;
	text-align: center;
	margin-bottom: 3rem;
	letter-spacing: 0.04em;
}

/* スライダー */
/* PC */
.fosSlider {
	padding: 6rem 0;
	background: #E5F0EC;
}

.movieSlider {
	max-width: 156.5rem;
	margin: 0 auto;
}

.movieSlider__inner {
	position: relative;
	width: min(100%, 192rem);
	margin: 0 auto;
	padding: 0 8rem;
}

/* 見切り管理 */
.movieSlider__viewport {
	overflow: hidden;
	
}

/* スライド */
.movieSlider .swiper-slide {
	height: auto;
}

/* カード */
.movieCard {
	display: block;
	/*height: 100%;*/
	text-decoration: none;
	color: inherit;
}

.movieCard__thumb {
	aspect-ratio: 16 / 9;
	overflow: hidden;

}

.movieCard__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: 0.3s;
}

.movieCard__thumb img:hover {
	transform: scale(1.1);
}

.movieCard__body {
	padding-top: 1.6rem;
	text-align: center;
}

.movieCard__title {
	font-size: 2.4rem;
	line-height: 1.4;
	font-weight: 500;
	letter-spacing: 0.05em;
}

.movieCard__body .remark {
	margin: 1rem auto 0;
}


/* 矢印 */
.movieSlider__prev,
.movieSlider__next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 4.8rem;
	height: 4.8rem;
	border: none;
	background: #00693E;
	cursor: pointer;
	z-index: 10;
}

.movieSlider__prev {
	left: 0;
}

.movieSlider__next {
	right: 0;
}

.movieSlider__prev::before,
.movieSlider__next::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1rem;
	height: 1rem;
	border-top: 0.2rem solid #fff;
	border-right: 0.2rem solid #fff;
}

.movieSlider__prev::before {
	transform: translate(-35%, -50%) rotate(-135deg);
}

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

.movieSlider__pagination {
	margin-top: 2.5rem;
	text-align: center;
}

.swiper-pagination-bullet {
	width: 0.8rem;
	height: 0.8rem;
	background: #ccc;
	opacity: 1;
}

.swiper-pagination-bullet-active {
	background: #00693E;
}

/* SP */
@media screen and (max-width: 768px) {
	.fosMovie .fosMovie__icon {
		margin-bottom: 1.5rem;
	}
	
	.fosMovie .txt {
		font-size: 1.6rem;
		margin-bottom: 2rem;
	}

	.fosSlider {
		padding: 3rem 0;
	}
	
	.movieCard__title {
		font-size: 1.8rem;
	}
	
	.movieCard__body {
		padding-top: 1rem;
	}
	
	.movieSlider__inner {
		padding: 0;
	}
	
	.movieSlider__viewport {
		width: 28rem;
		margin: 0 auto;
		overflow: hidden;
	}
	
	.movieSlider__prev,
	.movieSlider__next {
		width: 3.6rem;
		height: 3.6rem;
	}
}


/*. YOUTUBEモーダル */
.youtubeModal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: none;
}

.youtubeModal.is-open {
	display: block;
}

.youtubeModal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.7);
}

.youtubeModal__body {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(90vw, 96rem);
}

.youtubeModal__close {
	position: absolute;
	top: -4rem;
	right: 0;
	background: none;
	border: 0;
	color: #fff;
	font-size: 3rem;
	line-height: 1;
	cursor: pointer;
}

.youtubeModal__frame {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: #000;
}

.youtubeModal__frame iframe {
	width: 100%;
	height: 100%;
	display: block;
	border: none;
}



@media screen and (min-width: 769px) {
	.coursesOfferd {
		margin-bottom: 8rem;
	}
	
	.tableScroll {
		width: 100%;
		max-width: 118rem;
		margin: 0 auto 1.3rem;
	}
	
	.curriculumTable {
		width: 108rem;
		margin: 0 auto;
		font-size: 1.5rem;
	}
	
	.subjectList .caption {
		width: 118rem;
		margin: 0 auto;
		padding-left: 5rem;
		font-size: 1.4rem;
	}
	
	.sectionTitle {
		margin-bottom: 8rem;
	}
	
	.lecture {
		margin-bottom: 8rem;
	}
	
	.lecture .bottomMain {
		margin-bottom: 8rem;
	}
	
	.bottomMain.left .bottomMain__left h2 {
		margin-bottom: 1.5rem;
	}
	
	.remark {
		    font-size: 1.2rem;
	}
	
	.professor {
		width: 52.5rem;
		text-align: right;
	}
	
	.bottomMain.right .bottomMain__left h2 {
		margin-bottom: 1.5rem;
	}
	
	.remark.right {
		margin: 0 auto 1.5rem 44rem;
	}
	
	.professor.right {
		margin: 2rem 0 0 auto;
		text-align: left;
		width: 51rem;
	}
	
	.practicalTraning {
		margin-bottom: 8rem;
	}
	
	.practicalTraning .bottomMain {
		margin-bottom: 8rem;
	}
	
	.fosMovie .fosMovie--inner .fosMovie--left img.fosMovie__icon {
		margin: 0 auto 2.5rem 0;
	}
	
	.otherTraining {
		margin-bottom: 8rem;
		padding: 8rem 0;
	}
	
}