@charset "utf-8";

/*-----------------------------
 common
-------------------------------*/
:root{
	--txt       : #222222; /*文字 var(--txt)*/
	--txtsub    : #777777; /*文字薄 var(--txtsub)*/
	--green     : #008D78; /*緑濃 var(--green)*/
	--bg        : #F8F6E4; /*背景色 var(--bg)*/
	--dept_m    : #00A088; /*学科-専修 var(--dept_m)*/
	--dept_msub : #F39800; /*学科-専修サブ var(--dept_msub)*/
	--dept_day  : #EB5E55; /*学科-本科昼 var(--dept_day)*/
	--dept_night: #38566F; /*学科-本科夜 var(--dept_night)*/
	--gray2     : #F7F7F7; /*薄グレーバック var(--gray2)*/
	--border    : #D4D3CC; /*ボーダー var(--border)*/
	--t_pink    : #FFE2DC; /*表組みピンク var(--table_pink)*/
}
/*--------------
 base 18px
 16px  0.8888rem;
 14px  0.7777rem;
 12px  0.6666rem;
----------------*/


/*-----------------------------
mv
-------------------------------*/
@media (width < 767px) {
	section.mv {
		padding: 0;
	}
}

.pg-home .mv .contentWrap {
	padding: 0;
	max-width: 1630px;
}
.mv .swiper {
	width: 100%;
	padding: 0 0 60px;
	@media (768px <= width) {
		padding: 0 40px;
		background: url("/assets/images/slider/scroll.png") no-repeat bottom left;
	}
}
.mv .swiper-wrapper {
	aspect-ratio: 1.7045 / 1;
	overflow: hidden;
	@media (768px <= width) {
		aspect-ratio: 2.335 / 1;
		border: var(--txt) 1px solid;
		border-radius: 20px;
	}
}
.mv .swiper-horizontal > .swiper-pagination-bullets, .mv .swiper-pagination-bullets.swiper-pagination-horizontal,
.mv .swiper-pagination-custom, .mv .swiper-pagination-fraction {
	line-height: 1;
	bottom: var(--swiper-pagination-bottom,14px);
	@media (768px <= width) {
		width: 200px;
		height: 15px;
		transform: rotate(90deg);
		top: calc(100% - 120px); right: 0; bottom: 0; left: calc(100% - 110px);
		z-index: 100;
		text-align: right;
	}
}
@media (width < 767px) {
	.mv .swiper-button-next,
	.mv .swiper-button-prev {
		top: var(--swiper-navigation-top-offset,100%);
		transform: translateY(-50%);
		z-index: 11;
	}
}




/*-----------------------------
HOME
-------------------------------*/
.pg-home section .contentWrap {
	padding: 0 0 200px;
}
.pg-home section.campus::before,
.pg-home section.feature::before,
.pg-home section.course::before,
.pg-home section.sns::before {
	content: "";
	display: block;
	width: 100%;
	aspect-ratio: 1 / 0.07339285714285713;
	background: url("/assets/images/home/sectop_bg1.svg") no-repeat top center / cover;
	position: absolute;
	bottom: 100%;
	right: 0; left: 0;
	margin: auto;
}
.pg-home section.campus,
.pg-home section.feature {
	background: var(--bg);
}
.pg-home section.course,
.pg-home section.sns {
	background: #ffffff;
	&::before {
		background: url("/assets/images/home/sectop_bg2.svg") no-repeat top center / cover;
	}
}


.pg-home h2 {
	font-size: 1rem;
	line-height: 1.25;
	text-align: center;
	margin-top: 0;
	background-color: inherit;
	padding: 0;
	z-index: 1;
	&::before {
		content: none;
	}
	img {
		margin: auto;
	}
	@media (width < 767px) {
		font-size: 1.25rem;
	}
}
@media (768px <= width) {
	.pg-home .news h2 {
		line-height: 2;
		text-align: left;
	}
}

.pg-home .deco {
	position: absolute;
	margin: auto;
	z-index: 0;
	pointer-events: none;
}

.pg-home .news {
	padding: 100px 4% 150px;
	@media (width < 767px) {
		padding: 10% 0;
	}
	& .contentWrap {
		max-width: 1440px;
		padding: 0 0 100px;
		@media (width < 767px) {
			padding: 0 4% 12%;
		}
	}
	& .newswrap {
		justify-content: space-between;
		gap: 60px;
		& .head {
			width: 18.68%;
			min-width: 270px;
		}
		& .postlist {
			width: 65%;
			max-width: 936px;
			li {
				display: flex;
				flex-wrap: wrap;
				gap: 18px;
				align-items: flex-start;
				border-bottom: var(--border) 1px solid;
				padding: 1.5em 0;
				& .day {
					width: 7em;
					font-size: 0.8888rem;
				}
				& .category {
					display: block;
					width: 104px;
					font-size: 0.7777rem;
					text-align: center;
					line-height: 1.4;
					border-radius: 1em;
				}
				&.notice .category {
					color: #ffffff;
					border: var(--dept_day) 1px solid;
					background-color: var(--dept_day);
				}
				&.examination .category {
					color: var(--dept_msub);
					border: var(--dept_msub) 1px solid;
				}
				&.info .category {
					color: var(--green);
					border: var(--green) 1px solid;
				}
				a,
				span {
					width: calc( 100% - 48px - 204px );
					text-decoration: none;
					@media (width < 767px) {
						width: 100%;
					}
					p {
						margin: 0;
						line-height: 1.5;
					}
				}
				a:hover {
					text-decoration: underline;
				}
			}
		}
		@media (width < 767px) {
			display: block;
			& .head {
				width: 100%;
				text-align: center;
				padding-bottom: 4%;
				img {
					width: 45%;
				}
			}
			& .postlist {
				width: 100%;
			}
		}
	}
}

.pg-home .campus {
	padding: 0 4% 100px;
}
@media (width < 767px) {
	.pg-home .campus .contentWrap {
		padding: 45% 0 48%;
	}
	.pg-home .campus .contentWrap h2 + .txt-c {
		text-align: left !important;
	}
}
.pg-home .campus .opencampus_list_wrap {
	margin-top: 56px;
	max-width: 1180px;
}
.pg-home .campus .opencampus_list_wrap .swiper {
	width: 100%;
	padding: 0 20px 60px;
	@media (768px <= width) {
		padding: 0 35px;
	}
	& .swiper-slide {
		height: auto;
	}
}
.pg-home .campus .opencampus_list_wrap .swiper-button-prev,
.pg-home .campus .opencampus_list_wrap .swiper-rtl .swiper-button-next {
  left:var(--swiper-navigation-sides-offset,10px);
	@media (width < 767px) {
		left:var(--swiper-navigation-sides-offset,0);
	}
}
.pg-home .campus .opencampus_list_wrap .swiper-button-next,
.pg-home .campus .opencampus_list_wrap .swiper-rtl .swiper-button-prev {
  right:var(--swiper-navigation-sides-offset,10px);
	@media (width < 767px) {
		right:var(--swiper-navigation-sides-offset,0);
	}
}
@media (768px <= width) {
	.wrap .campus .swiper-pagination {display: none;}
}
.pg-home .campus .opencampus_list {
	width: 100%;
	height: 100%;
	background-image: linear-gradient(180deg, rgba(248, 246, 228, 1) 20%, rgba(255, 255, 255, 1) 20%);
	padding-bottom: 120px;
	border-radius: 0px 0px 8px 8px;
	& .subct {
		/*width: 100%; height: 8px;
		background: #FFC962;
		border-radius: 16px 16px 0px 0px;*/
		width: 100%;
		aspect-ratio: 1 / 0.14893617021276595;
	}
	figure {
		display: block;
		width: 100%;
		aspect-ratio: 1 / 0.6648936170212766;
		overflow: hidden;
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: center;
		}
	}
	ul {
		padding: 0 32px;
		display: flex;
		flex-direction: column;
	}
	& .date {
		width: 100%;
		padding: 24px 0;
		font-size: 0.8888rem;
		text-align: center;
		letter-spacing: 0;
		border-bottom: var(--txt) 2px dashed;
		span {
			font-size: 1.1111rem;
			font-weight: 700;
			color: var(--dept_day);
		}
		em {
			font-size: 2rem;
			letter-spacing: -0.01em;
		}
	}
	& .title {
		font-size: 1.1111rem;
		font-weight: 700;
		line-height: 1.5;
		margin: 24px 0 12px;
	}
	& .copy {
		line-height: 1.75;
	}
	& a.btn {
		width: calc(100% - 64px);
		position: absolute;
		bottom: 32px;
		right: 0; left: 0;
		margin: auto;
	}
}
.pg-home .campus .opencampus_list.handson .subct {
	background: url("/assets/images/campus/subct-handson.png") no-repeat top center / contain;
}
.pg-home .campus .opencampus_list.info .subct {
	background: url("/assets/images/campus/subct-info.png") no-repeat top center / contain;
}
.pg-home .campus .opencampus_list.tours .subct {
	background: url("/assets/images/campus/subct-tours.png") no-repeat top center / contain;
}
.pg-home .campus .deco.img1 {
	width: 431px;
	top: -100px; right: 70%;
	aspect-ratio: 1 / 0.8793503480278422;
	@media (768px <= width <= 1439px) {
		width: 25%;
	}
	@media (width < 767px) {
		width: 56.81%;
		top: 0.3%; right: 36%;
		aspect-ratio: 1 / 0.6326530612244898;
	}
	img {height: auto;}
}
.pg-home .campus .deco.img2 {
	width: 440px;
	top: -100px; left: 70%;
	aspect-ratio: 1 / 0.8272727272727273;
	@media (768px <= width <= 1439px) {
		width: 25%;
	}
	@media (width < 767px) {
		width: 52.26%;
		top: -3%; left: 42%;
		aspect-ratio: 1 / 0.7461928934010152;
	}
	img {height: auto;}
}
.pg-home .campus .deco.img3 {
	width: 430px;
	bottom: 4vw; left: 60%;
	margin: auto;
	aspect-ratio: 1 / 0.6744186046511628;
	@media (width < 767px) {
		width: 83%;
		left: 0; right: 0;
		bottom: 0;
	}
}


@media (width < 767px) {
	.pg-home .course .contentWrap {
		padding: 50% 0 28%;
	}
	.pg-home .course .contentWrap h2 + .txt-c {
		text-align: left !important;
	}
}
.pg-home .course .flex.senshuka,
.pg-home .course .flex.honka,
.pg-home .course .flex.yakanbu {
	justify-content: space-between;
	align-items: center;
	margin-top: 70px;
	margin-left: 40px;
	padding-right: 64px;
	border-radius: 16px;
	background-color: #f00;
	figure {
		width: 37%;
		overflow: visible;
		img {
			border-radius: 16px;
			transform: translate(-40px,-40px);
		}
	}
	div {
		width: 60%;
		h3 {
			color: #ffffff;
			font-size: 2.2rem;
			line-height: 1.3;
			margin-top: 0;
			strong {
				font-size: 3.2rem;
			}
			span {
				display: inline-block;
				color: var(--txt);
				font-size: 1.3rem;
				font-weight: 400;
				line-height: 1.6;
				padding: 0 0.5em;
				border-radius: 7px;
				margin-left: 1em;
				margin-top: 5px;
				vertical-align: top;
			}
			&::before, &::after {
				display: none;
			}
		}
		p {
			color: #ffffff;
		}
	}
	@media (width < 767px) {
		display: block;
		margin: 20% 0 0;
		padding: 0 4% 4%;
		border-radius: 12px;
		figure {
			width: 100%;
			img {
				border-radius: 12px;
				transform: translate(0,-6%);
			}
		}
		div {
			width: 100%;
			h3 {
				font-size: 2rem;
				strong {
					font-size: 2.6rem;
				}
			}
			p + p {
				text-align: center;
			}
		}
	}
}
.pg-home .course .flex.senshuka {
	background-color: var(--dept_m);
}
.pg-home .course .flex.honka {
	background-color: var(--dept_day);
	flex-direction: row-reverse;
	margin-left: 0;
	margin-right: 40px;
	padding-right: 0;
	padding-left: 64px;
	figure {
		img {
			transform: translate(40px,-40px);
		}
	}
	@media (width < 767px) {
		margin: 20% 0 0;
		padding: 0 4% 4%;
		border-radius: 12px;
		figure img {
			transform: translate(0,-6%);
		}
	}
}
.pg-home .course .flex.yakanbu {
	background-color: var(--dept_night);
}

.pg-home .course .deco.img1 {
	width: 277px;
	top: 20px; right: 78%;
	aspect-ratio: 1 / 0.7472924187725631;
	@media (768px <= width <= 1439px) {
		width: 20%;
	}
	@media (width < 767px) {
		width: 133px;
		top: 2%; right: 68%;
	}
}
.pg-home .course .deco.img2 {
	width: 308px;
	top: -100px; right: 64%;
	aspect-ratio: 1 / 0.7532467532467533;
	@media (768px <= width <= 1439px) {
		width: 20%;
	}
	@media (width < 767px) {
		width: 154px;
		top: 0%; right: 42%;
	}
}
.pg-home .course .deco.img3 {
	width: 300px;
	top: -100px; left: 64%;
	aspect-ratio: 1 / 0.75;
	@media (768px <= width <= 1439px) {
		width: 20%;
	}
	@media (width < 767px) {
		width: 150px;
		top: 2%; left: 45%;
	}
}
.pg-home .course .deco.img4 {
	width: 323px;
	top: 0px; left: 76%;
	aspect-ratio: 1 / 1;
	@media (768px <= width <= 1439px) {
		width: 20%;
	}
	@media (width < 767px) {
		width: 160px;
		top: -1%; left: 65%;
	}
}



.pg-home .feature {
	padding: 0 0 260px;
	@media (width < 767px) {
		padding: 0 0 28%;
	}
}
.pg-home .feature .contentWrap {
	padding: 0 0 120px;
	@media (768px <= width <= 1279px) {
		padding: 0 50px 120px;
	}
	@media (width < 767px) {
		padding: 0 5% 10%;
	}
}
.pg-home .featurenav {
	display: grid;
	grid-template-columns: 1fr 600px;
	/*grid-template-rows: repeat(3, 1fr);*/
	grid-template-rows: 1fr repeat(2, 200px);
	column-gap: 80px;
	row-gap: 40px;
	& .copy { grid-area: 1 / 1 / 2 / 2; }
	& .img { grid-area: 1 / 2 / 4 / 3; }
	& .nav { grid-area: 2 / 1 / 4 / 2; }
	@media (width < 1023px) {
		display: block;
	}
	& .midasi {
		font-size: 2.2222rem;
		line-height: 1.5;
		margin-top: 0.5em;
		@media (width < 767px) {
			font-size: 1.5rem;
		}
	}
	p {
		letter-spacing: 0.01em;
	}
	dl {
		width: 100%;
		display: block;
		dt {
			width: 100%;
			font-size: 1.3333rem;
			font-weight: 700;
			color: var(--green);
			padding-bottom: 1em;
			border-bottom: var(--border) 1px solid;
		}
		dd {
			font-size: 0.8888rem;
			border-bottom: var(--border) 1px solid;
			a {
				display: block;
				padding: 1.5em 0;
				color: var(--txt);
				font-weight: normal;
				text-decoration: none;
				position: relative;
				&::before {
					content: "";
					display: block;
					width: 9px;
					height: 9px;
					background: url("/assets/images/ico-arrw.svg") no-repeat center center / contain;
					filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(298deg) brightness(104%) contrast(103%);
					position: absolute;
					margin: auto;
					top: 0; bottom: 0;
					right: 0.25em;
					z-index: 1;
				}
				&::after {
					content: "";
					display: block;
					width: 18px;
					height: 18px;
					border-radius: 9px;
					background: var(--txt);
					position: absolute;
					margin: auto;
					top: 0; bottom: 0;
					right: 0;
				}
				&:hover {
					opacity: 0.6;
				}
			}
		}
	}
}
.pg-home .featurenav .img .slider {
	margin-right: -44px;
	aspect-ratio: 1 / 1.2701863354037266;
	position: relative;
	& .item {
		position: absolute;
		inset: 0;
		opacity: 0;
		z-index: 0;
		animation: slideShow 25s linear infinite 0s;
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}
	.item:nth-child(2) {animation-delay: 5s;}
	.item:nth-child(3) {animation-delay: 10s;}
	.item:nth-child(4) {animation-delay: 15s;}
	.item:nth-child(5) {animation-delay: 20s;}
	@media (width < 1023px) {
		margin: 4% 4% 4% 8%;
	}
}
@keyframes slideShow {
	0% {
		opacity: 0;
		animation-timing-function: ease-in;
	}
	3% {
		opacity: 1;
		animation-timing-function: ease-in;
	}
	20% {
		opacity: 1;
	}
	23%,
	100% {
		opacity: 0;
	}
}
/*-----*/
.infinite-scroll {
	display: flex;
	width: 100%;
	overflow: hidden;
}
.infinite-scroll__container {
	display: flex;
	gap: 24px;
	padding-right: 24px;
	flex-shrink: 0;
	@media (width < 767px) {
		gap: 20px;
		padding-right: 20px;
	}
}
.infinite-scroll__img-wrap {
	flex-shrink: 0;
	width: 360px;
	height: auto;
	img {
		border-radius: 16px;
	}
	@media (width < 767px) {
		width: 81.6vw;
	}
}
@keyframes loop {
	0% {transform: translateX(100%);}
	to {transform: translateX(-100%);}
}
@keyframes loop2 {
	0% {transform: translateX(0);}
	to {transform: translateX(-200%);}
}
.infinite-scroll__container:first-child {
	animation: loop 80s -40s linear infinite;
}
.infinite-scroll__container:last-child {
	animation: loop2 80s linear infinite;
}
/*-----*/


@media (width < 767px) {
	.pg-home .sns .contentWrap {
		padding: 14% 0 28%;
	}
	.pg-home .sns .contentWrap h2 + .txt-c {
		text-align: left !important;
	}
}
.pg-home .sns .snswrap {
	justify-content: space-between;
	margin-top: 48px;
	&> div {
		width: calc((100% - 48px * 1) / 2);
		background-color: var(--bg);
		border-radius: 16px;
		padding: 24px;
	}
	& .head {
		padding: 8px 8px 24px;
		align-items: center;
		flex-wrap: wrap;
		& .icon {
			width: 40px;
			margin-right: 15px;
		}
		& .btn {
			margin-left: auto;
		}
		@media (width < 767px) {
			justify-content: center;
			& .btn {
				width: 70%;
				margin: 3% auto 0;
			}
		}
	}
	@media (width < 767px) {
		.flex.item2 {
			gap: 24px;
		}
		&> div {
			width: 100%
		}
	}
}
.pg-home .sns .deco {
	width: 631px;
	top: -260px;
	right: 0; left: 0;
	aspect-ratio: 1 / 0.5752773375594294;
	@media (width < 767px) {
		width: 80%;
		top: -8%;
	}
}

.pg-home .sns .bnrslide {
	max-width: 1076px;
	margin: 120px auto 0;
	padding: 0 72px;
	position: relative;
	#nbtn {
		position: absolute;
		margin: auto;
		top: 0; right: 0; bottom: 0;
	}
	#pbtn {
		position: absolute;
		margin: auto;
		top: 0; left: 0; bottom: 0;
	}
	@media (width < 767px) {
		width: 72%;
		margin: 64px auto 0;
		padding: 0;
		#nbtn {
			display: none;
		}
		#pbtn {
			display: none;
		}
		.swiper {
			padding: 0;
			overflow: inherit;
		}
		.swiper-wrapper {
			flex-direction: column;
			row-gap: 16px;
		}
	}
}



/*-----------------------------
NEWS
-------------------------------*/
.pg-news section.news,
.pg-career section.graduates {
	padding: 0 4% 200px;
	@media (width < 767px) {
		padding: 0 0 10%;
	}
	& .contentWrap {
		max-width: 1000px;
		@media (width < 767px) {
			padding: 0 4% 10%;
		}
	}
	& .newswrap {
		border: var(--border) 1px solid;
		border-radius: 16px;
		overflow: hidden;
		@media (width < 767px) {
			border-radius: 8px;
		}
	}
	& .head {
		background: var(--bg);
		padding: 46px 80px;
		h2 {
			margin: 0;
			padding: 0;
			word-break: break-all;
			line-height: 1.5;
			color: var(--txtsub);
			background: var(--bg);
			&::before {
				content: none;
			}
		}
		& .postlist li {
			border: none;
			padding: 1.5em 0 0;
		}
		@media (width < 767px) {
			padding: 32px 24px;
		}
	}
	& .body {
		padding: 68px 80px 80px;
		figure {
			max-width: 640px;
			max-height: 640px;
			margin: 80px auto 0;
			img {
				margin: auto;
			}
		}
		@media (width < 767px) {
			padding: 24px 24px 32px;
			figure {
				margin: 16% auto 0;
			}
		}
	}
	& .postlist {
		width: 100%;
		li {
			display: flex;
			flex-wrap: wrap;
			gap: 18px;
			align-items: flex-start;
			border-bottom: var(--border) 1px solid;
			padding: 1.5em 0;
			& .day {
				width: 7em;
				font-size: 0.8888rem;
			}
			& .category {
				display: block;
				width: 104px;
				font-size: 0.7777rem;
				text-align: center;
				line-height: 1.4;
				border-radius: 1em;
			}
			&.notice .category {
				color: #ffffff;
				border: var(--dept_day) 1px solid;
				background-color: var(--dept_day);
			}
			&.examination .category {
				color: var(--dept_msub);
				border: var(--dept_msub) 1px solid;
			}
			&.info .category {
				color: var(--green);
				border: var(--green) 1px solid;
			}
			a,
			span {
				width: calc( 100% - 48px - 204px );
				text-decoration: none;
				@media (width < 767px) {
					width: 100%;
				}
				p {
					margin: 0;
					line-height: 1.5;
				}
			}
			a:hover {
				text-decoration: underline;
			}
		}
	}
	@media (width < 767px) {
		display: block;
		& .head {
			width: 100%;
			text-align: left;
			padding-bottom: 4%;
			img {
				width: 45%;
			}
		}
	}
}

.archive-pagination {
	text-align: center;
	margin-top: 80px;
	@media (width < 767px) {
		margin-top: 64px;
	}
}
.archive-pagination .page-numbers {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	@media (width < 767px) {
		gap: 8px;
	}
	li {
		padding: 0;
		display: grid;
		place-items: center;
		width: 56px;
		height: 56px;
		text-align: center;
		@media (width < 767px) {
			width: 40px;
			height: 40px;
		}
	}
	a {
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		text-align: center;
		display: grid;
		place-items: center;
		background:#ffffff;
		color: var(--txt);
		text-decoration: none;
		border-radius: 50%;
		border: var(--txt) 1px solid;
	}
	span {
		width: 100%;
		height: 100%;
		display: grid;
		place-items: center;
		border-radius: 50%;
		border: var(--txt) 1px solid;
		background: var(--txt);
		color: #ffffff;
	}
}
.archive-pagination .page-numbers li a.prev,
.archive-pagination .page-numbers li a.next {
	background: var(--txt);
	img {
		filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(298deg) brightness(104%) contrast(103%);
	}
	&:hover {
		background: var(--txtsub);
	}
}
.archive-pagination .page-numbers li a.prev img {
	transform: rotate(180deg);
}
.archive-pagination .page-numbers li a:hover,
.archive-pagination .page-numbers li a.current {
  color: #ffffff;
  background: var(--txt);
}

.pagination {
	text-align: center;
	margin-top: 64px;
	@media (width < 767px) {
		margin-top: 64px;
	}
	& .pager {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		li {
			width: 50%;
			img {
				vertical-align: middle;
				display: inline-block;
				margin: 0 8px;
			}
			&.prev {
				text-align: left;
				img {
					transform: rotate(180deg);
				}
			}
			&.next {
				text-align: right;
				@media (768px <= width) {
					order: 3;
				}
			}
			@media (768px <= width) {
				width: 30%;
			}
			&.prev a, &.next a {
				text-decoration: none;
				&:hover {
					text-decoration: underline;
				}
			}
		}
		@media (width < 767px) {
			justify-content: center;
			gap: 32px 0;
		}
	}
}



/*-----------------------------
OPEN CAMPUS
-------------------------------*/
.pg-opencampus {
	main, #footer {
		background: var(--bg);
		position: relative;
	}
}
.pg-opencampus main .contentWrap {
	padding-bottom: 120px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
}
.pg-opencampus main .deco.img1 {
	position: absolute;
	width: 431px;
	top: 66px; right: 70%;
	aspect-ratio: 1 / 0.8793503480278422;
	pointer-events: none;
	@media (768px <= width <= 1439px) {
		width: 25%;
	}
	@media (width < 767px) {
		width: 52.1%;
		top: 93vw; right: 40%;
		aspect-ratio: 1 / 0.6326530612244898;
	}
	img {height: auto;}
}
.pg-opencampus main .deco.img2 {
	position: absolute;
	width: 440px;
	top: 56px; left: 70%;
	aspect-ratio: 1 / 0.8272727272727273;
	pointer-events: none;
	@media (768px <= width <= 1439px) {
		width: 25%;
	}
	@media (width < 767px) {
		width: 52.53%;
		top: 79vw; left: 42%;
		aspect-ratio: 1 / 0.7461928934010152;
	}
	img {height: auto;}
}
.pg-opencampus h1 + p {
	width: 46%;
	max-width: 690px;
	text-align: center;
	margin: 1.5em auto 0;
	line-height: 2;
	@media (width < 767px) {
		width: 92%;
		text-align: left;
	}
}

.pg-opencampus .btnnav {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	li {
		width: calc((100% - 20px * 4) / 5);
		& .btn {
			width: 100%;
			&.current {
				background: var(--txt);
				color: #ffffff;
			}
		}
	}
	@media (768px <= width <= 1279px) {
		li {
			width: calc((100% - 20px * 2) / 3);
		}
	}
	@media (width < 767px) {
		gap: 17px;
		margin-top: 68% !important;
		li {
			width: calc((100% - 17px) / 2);
			& a.btn {
				line-height: 3;
				font-size: 0.7777rem;
			}
		}
	}
}

.pg-opencampus .postlist {
	display: flex;
	flex-wrap: wrap;
	gap: 38px;
}
.pg-opencampus .postlist + .txt-c a.btn {
	width: 376px;
	@media (width < 767px) {
		width: 100%;
		line-height: 3;
		font-size: 0.7777rem;
	}
}
.pg-opencampus .opencampus_list {
	position: relative;
	width: calc((100% - 38px * 2) / 3);
	background-image: linear-gradient(180deg, rgba(248, 246, 228, 1) 20%, rgba(255, 255, 255, 1) 20%);
	padding-bottom: 120px;
	border-radius: 0px 0px 8px 8px;
	& .subct {
		width: 100%; height: 8px;
		background: #FFC962;
		border-radius: 16px 16px 0px 0px;
	}
	figure {
		display: block;
		width: 100%;
		aspect-ratio: 1 / 0.6648936170212766;
		overflow: hidden;
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: center;
		}
	}
	ul {
		padding: 0 32px;
		display: flex;
		flex-direction: column;
	}
	& .date {
		width: 100%;
		padding: 24px 0;
		font-size: 0.8888rem;
		text-align: center;
		letter-spacing: 0;
		border-bottom: var(--txt) 2px dashed;
		span {
			font-size: 1.1111rem;
			font-weight: 700;
			color: var(--dept_day);
		}
		em {
			font-size: 2rem;
			letter-spacing: -0.01em;
		}
	}
	& .title {
		font-size: 1.1111rem;
		font-weight: 700;
		line-height: 1.5;
		margin: 24px 0 12px;
	}
	& .copy {
		line-height: 1.75;
	}
	& a.btn {
		width: calc(100% - 64px);
		position: absolute;
		bottom: 32px;
		right: 0; left: 0;
		margin: auto;
	}
	@media (768px <= width <= 1023px) {
		width: calc((100% - 38px * 1) / 2);
	}
	@media (width < 767px) {
		width: 100%;
	}
}
.pg-opencampus .opencampus_list.handson .subct {
	background: #FFC962;
}
.pg-opencampus .opencampus_list.info .subct {
	background: #00A088;
}
.pg-opencampus .opencampus_list.tours .subct {
	background: #6086A5;
}
.pg-opencampus .all .opencampus_list .subct {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 0.14893617021276595;
}
.pg-opencampus .all .opencampus_list.handson .subct {
	background: url("/assets/images/campus/subct-handson.png") no-repeat top center / contain;
}
.pg-opencampus .all .opencampus_list.tours .subct {
	background: url("/assets/images/campus/subct-tours.png") no-repeat top center / contain;
}
.pg-opencampus .all .opencampus_list.info .subct {
	background: url("/assets/images/campus/subct-info.png") no-repeat top center / contain;
}
.pg-opencampus .trial {
	& .opencampus_list.info, & .opencampus_list.tours {display:none;}
}
.pg-opencampus .night {
	& .opencampus_list.handson, & .opencampus_list.info {display:none;}
}
.pg-opencampus .visit {
	& .opencampus_list.handson, & .opencampus_list.tours {display:none;}
}
.pg-opencampus .ringnote {
	background: #ffffff;
	border-radius: 16px;
	padding: 87px 64px 64px;
	margin-top: 80px;
	position: relative;
	@media (width < 767px) {
		padding: 12% 7% 7%;
		margin-top: 20%;
	}
	&::before {
		content: "";
		display: block;
		aspect-ratio: 1 / 0.04665492957746479;
		width: 94%;
		position: absolute;
		margin: auto;
		right: 0; left: 0;
		top: -25px;
		background: url("/assets/images/campus/ring.png") center center / contain;
		@media (width < 767px) {
			aspect-ratio: 1 / 0.10684474123539232;
			width: 86.6%;
			top: -18px;
			background: url("/assets/images/campus/ring_sp.png") center center / contain;
		}
	}
	dl {
		display: flex;
		align-items: center;
		gap: 53px;
		dt {
			width: 28%;
			max-width: 300px;
		}
		dd p {
			margin-top: 0;
			& + p {
				margin-top: 0.5em;
			}
			strong {
				line-height: 1.2;
			}
		}
		@media (width < 767px) {
			display: block;
			dt {
				width: 100%;
				max-width: 100%;
			}
			dd {
				margin-top: 8%;
			}
		}
	}
	figure {
		text-align: center;
		margin-top: 48px;
		img {
			margin: auto;
		}
	}
}
.pg-opencampus .online .ringnote {
	h3 {
		color: #63A1DC;
		text-align: center;
		&::before {
			display: none;
		}
	}
	ul {
		width: 46%;
		max-width: 340px;
		margin: 24px auto 0;
		@media (768px <= width) {
			display: flex;
		}
	}
	& a.btn {
		width: 100%;
		max-width: 480px;
		font-size: 177%;
		line-height: 2.8;
		margin-top: 48px;
		@media (width < 767px) {
			font-size: 110%;
			line-height: 3;
			margin-top: 3%;
		}
	}
	@media (width < 767px) {
		p.txt-c {
			text-align: left !important;
		}
	}
}

.pg-opencampus .telinfo {
	background: #ffffff;
	border-radius: 16px;
	text-align: center;
	max-width: 520px;
	padding: 32px;
	margin: 90px auto 0;
	h4 {
		margin-top: 0;
	}
	p {
		margin-top: 0;
		em {
			color: var(--green);
			font-size: 2.2222rem;
			letter-spacing: -0.01em;
			line-height: 1.3;
		}
		a {
			text-decoration: none;
		}
	}
}



/*-----------------------------
本校の特長
-------------------------------*/
.pg-features .catch {
	@media (width < 767px) {
		& .copy img {
			height: 53px;
		}
		& .copy2 img {
			height: 148px;
		}
	}
}
.pg-features .instrutor {
	display: grid;
	grid-template-columns: 282px repeat(2, 1fr);
	grid-template-rows: 100px 1fr;
	column-gap: 48px;
	row-gap: 24px;
	padding: 40px 0;
	& li:nth-child(1) { grid-area: 1 / 1 / 4 / 2; }
	& li:nth-child(2) { grid-area: 1 / 2 / 2 / 4; }
	& li:nth-child(3) { grid-area: 2 / 2 / 4 / 4; }
	@media (width < 767px) {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(1, 1fr);
		column-gap: 17px;
		row-gap: 24px;
		padding: 24px 0;
		align-items: center;
		& li:nth-child(1) { grid-area: 1 / 1 / 2 / 2; }
		& li:nth-child(2) { grid-area: 1 / 2 / 2 / 3; }
		& li:nth-child(3) { grid-area: 2 / 1 / 4 / 3; }
	}
	border-bottom: var(--border) 1px solid;
}
.pg-features .instrutor,
.pg-features .instrutor2 {
	& li.ob {
		position: relative;
		&::before {
			content: "";
			display: block;
			background: url("/assets/images/features/mark-ob.svg") no-repeat center / contain;
			aspect-ratio: 1 / 1;
			width: 64px;
			position: absolute;
			top: -8px; left: -8px;
		}
	}
	figure img {
		border-radius: 16px;
	}
	span {
		display: inline-block;
		padding: 0 0.6em;
		border: var(--dept_msub) 1px solid;
		border-radius: 2em;
		color: var(--dept_msub);
		font-weight: bold;
		line-height: 1.6;
		letter-spacing: 0;
		margin-bottom: 0.8em;
	}
}
.pg-features .instrutor2 figure {
	margin-bottom: 1em;
}

.pg-features #interview {
	margin-top: 12%;
	background: var(--bg);
	padding: 0 5% 200px;
	&::before, &::after {
		content: "";
		display: block;
		width: 100%;
		aspect-ratio: 1 / 0.07339285714285713;
		background: url("/assets/images/home/sectop_bg1.svg") no-repeat top center / cover;
		position: absolute;
		bottom: 100%;
		right: 0; left: 0;
		margin: auto;
	}
	&::after {
		background: url("/assets/images/home/sectop_bg2.svg") no-repeat top center / cover;
		top: auto;
		bottom: 0;
	}
	& .contentWrap {
		max-width: 1000px;
	}
	h2 {
		font-size: 1rem;
		line-height: 1.25;
		text-align: center;
		margin-top: 0;
		background-color: inherit;
		padding: 0;
		z-index: 1;
		&::before {
			content: none;
		}
		img {
			margin: auto;
		}
		@media (width < 767px) {
			font-size: 1.25rem;
			padding: 0 8%;
		}
	}
	@media (width < 767px) {
		padding: 10% 5% 20%;
	}
}
.pg-features #interview .titlebox {
	margin: 72px auto 130px;
	position: relative;
	figure img {
		border-radius: 16px;
	}
	div {
		padding: 36px 48px;
		background: url("/assets/images/features/interview_titlebg.svg") no-repeat center / contain;
		width: 540px;
		aspect-ratio: 1 / 0.37037037037037035;
		position: absolute;
		left: 40px; bottom: -60px;
		& .title {
			color: var(--dept_night);
			margin-top: 0;
			line-height: 1.4;
		}
		& .name {
			margin-top: 0.5em;
		}
	}
	@media (width < 767px) {
		margin-top: 10%;
		margin: 10% auto 40%;
		figure {
			width: 100%;
			overflow: hidden;
			border-radius: 8px;
		}
		figure img {
			transform: scale(1.3) translateX(8%);
			border-radius: 0;
		}
		div {
			padding: 5% 5% 5% 10%;
			width: 105%;
			left: -10%; bottom: auto; top: 70%;
			& .title {
				font-size: 90%;
			}
		}
	}
}
.pg-features #interview .imgbox-txt-right figure img {
	border-radius: 8px;
}
.pg-features #interview .profile {
	padding: 40px;
	display: flex;
	gap: 40px;
	align-items: center;
	background: #ffffff;
	border-radius: 16px;
	figure {
		min-width: 320px;
	}
	img {
		border-radius: 8px;
	}
	p {
		margin: 0;
	}
	@media (width < 767px) {
		padding: 8%;
		display: block;
		border-radius: 8px;
		figure {
			min-width: 100%;
		}
		p {
			margin-top: 1.5em;
		}
	}
}

.pg-features .guidance_step {
	display: flex;
	gap: 24px;
	margin-top: 39px;
	li {
		display: block;
		width: calc((100% - 24px * 3) / 4);
		text-align: center;
		padding: 48px 0 46px;
		border: var(--border) 1px solid;
		border-radius: 16px;
		position: relative;
		& + li:before {
			content: "";
			display: inline-block;
			width: 24px;
			height: 16px;
			background: var(--green);
			clip-path: polygon(0 0, 100% 0%, 50% 100%);
			transform: rotate(-90deg);
			position: absolute;
			margin: auto;
			top: 0; bottom: 0;
			left: -23px;
		}
		strong {
			color: var(--green);
		}
	}
	@media (width < 767px) {
		display: block;
		li {
			width: 100%;
			padding: 6% 4%;
			border-radius: 8px;
			& + li {
				margin-top: 10%;
				&:before {
					transform: rotate(0deg);
					top: -28px; bottom: auto;
					left: 0; right: 0;
				}
			}
		}
	}
}

.pg-features .borderbox,
.pg-course .borderbox {
	border: var(--border) 1px solid;
	border-radius: 16px;
	padding: 58px 56px 56px;
	position: relative;
	h4 {
		margin: 0;
		position: absolute;
		top: -25px; left: 56px;
	}
	& .deco {
		position: absolute;
		top: -12px; right: 56px;
	}
	& .imgbox-txt-right {
		margin: 0;
		grid-template-columns: 1fr 320px;
		@media (width < 767px) {
			grid-template-columns: 1fr;
			row-gap: 36px;
		}
		&.dot {
			margin-top: 1.5rem;
			padding-top: 1.5rem;
			border-top: var(--border) 1px solid;
		}
	}
	p {
		margin: 0;
	}
	@media (width < 767px) {
		border-radius: 8px;
		padding: 10% 5% 10%;
		h4 {
			top: -17px; left: 5%;
			img {
				height: 34px;
				width: auto;
			}
		}
		& .deco {
			top: auto; bottom: -12px; right: 5%;
			img {
				height: 26px;
				width: auto;
			}
		}
	}
	&.point {
		background: var(--bg);
		border: none;
		@media (width < 767px) {
			padding: 12% 5% 5%;
		}
		& .deco {
			top: -24px; right: auto; left: -8px;
			@media (width < 767px) {
				top: -30px;
				img {
					height: 60px;
				}
			}
		}
	}
	& .flex {
		gap: 40px;
		align-items: center;
		& .img {
			width: 184px;
		}
		& .txt {
			width: calc(100% - 40px - 184px);
		}
		@media (width < 767px) {
			flex-direction: column;
			gap: 20px;
			& .img {
				width: 100%;
				padding: 0 20%;
			}
			& .txt {
				width: 100%;
			}
		}
	}
}
.pg-features .way {
	color: #002B68;
	text-align: center;
	span {
		display: inline-block;
		margin: auto;
		font-size: 24px;
		&::before, &::after {
			content: "";
			display: inline-block;
			width: 21px;
			aspect-ratio: 1 / 1.6666666666666667;
			vertical-align: middle;
		}
		&::before {
			background: url("/assets/images/features/mark-way1.svg") no-repeat center / contain;
			margin-right: 0.8em;
		}
		&::after {
			background: url("/assets/images/features/mark-way2.svg") no-repeat center / contain;
			margin-left: 0.8em;
		}
		@media (width < 767px) {
			font-size: 1.1rem;
		}
	}
	@media (768px <= width) {
		&.big span {
			font-size: 40px;
			&::before {margin-right: 0.4em;}
			&::after {margin-left: 0.4em;}
		}
	}
}
.pg-features .timetable,
.pg-expense .timetable,
.pg-admission .timetable {
	position: relative;
	& > div {
		background: #F8F6E4;
		position: relative;
		padding: 40px 40px 40px 140px;
		@media (width < 767px) {
			padding: 6% 6% 6% 56px;
		}
	}
	& > div:nth-child(2n) {
		background: #FCFCF5;
	}
	&::before {
		content: "";
		display: block;
		background: var(--green);
		width: 3px;
		height: 92%;
		margin: auto;
		position: absolute;
		top: 0; bottom: 0; left: 70px;
		z-index: 1;
		@media (width < 767px) {
			height: 98%;
			left: 26px;
		}
	}
	num {
		display: grid;
		place-items: center;
		color: #ffffff;
		width: 64px; height: 64px;
		border-radius: 50%;
		background: var(--green);
		position: absolute;
		top: 40px; left: 40px;
		z-index: 1;
		strong {
			display: block;
			line-height: 1;
			text-align: center;
			place-content: center;
			span {
				font-size: 50%;
			}
		}
		@media (width < 767px) {
			width: 32px; height: 32px;
			top: 24px; left: 12px;
			strong.m-el {
				font-size: 1rem;
			}
		}
		&:empty {
			width: 18px; height: 18px;
			top: 48px; left: 63px;
			@media (width < 767px) {
				width: 11px; height: 11px;
				top: 33px; left: 22px;
			}
		}
	}
	& .imgbox-txt-right {
		margin: 0;
		figure img {
			width: 100%;
			max-width: 100%;
		}
	}
	& .label {
		width: 100%;
		border-bottom: var(--txt) 1px dotted;
		padding-bottom: 1rem;
		margin-bottom: 1rem;
		@media (width < 767px) {
			padding-bottom: 0.8rem;
			margin-bottom: 0.8rem;
		}
	}
}
.pg-features .timetable.resto .imgbox-txt-right {
	grid-template-columns: 1fr 224px;
	@media (width < 767px) {
		grid-template-columns: 1fr;
		row-gap: 36px;
	}
}
.pg-features .flex.scene figure img {
	border-radius: 16px;
	@media (width < 767px) {
		border-radius: 8px;
	}
}



/*-----------------------------
学校案内
-------------------------------*/
.pg-outline main .contentWrap {
	padding-bottom: 200px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
	&.narrow {
		max-width: 1000px;
	}
}
.pg-outline .imgbox-txt-left {
	margin: 1em auto 0;
	column-gap: 72px;
	@media (width < 767px) {
		grid-template-columns: 1fr;
		row-gap: 16px;
		figure {
			padding: 0 20%;
		}
	}
	p {
		margin-top: 1em;
	}
}
.pg-outline .fitimg img {
	@media (width < 767px) {
		object-fit: cover;
		aspect-ratio: 1 / 0.6666666666666666;
		width: 120%;
	}
}
.pg-outline .histry,
.pg-outline .document {
	width: 100%;
	line-height: 1.5;
	dt {
		font-weight: 700;
		color: var(--green);
		padding-top: 1em;
	}
	dd {
		padding: 1em 0;
		border-bottom: var(--border) 1px solid;
	}
	@media (768px <= width) {
		dt {
			padding-top: 1.4em;
			float: left;
			clear: both;
			max-width: 200px;
		}
		dd {
			padding: 1.4em 0;
			padding-left: 240px;
		}
	}
}
.pg-outline .document {
	border-top: var(--border) 1px solid;
	@media (768px <= width) {
		dt {
			max-width: 285px;
		}
		dd {
			padding-left: 320px;
		}
	}
	dd {
		position: relative;
		padding: 1em 140px 1em 0;
		@media (768px <= width) {
			padding: 1.4em 140px 1.4em 320px;
		}
		a {
			position: absolute;
			right: 0; bottom: 10px;
			@media (768px <= width) {
				bottom: 16px;
			}
		}
		div {
			position: relative;
			padding: 0 140px 1em 0;
			margin-right: -140px;
			margin-bottom: 1em;
			border-bottom: var(--border) 1px solid;
			@media (768px <= width) {
				padding: 0 140px 1.4em 0;
				margin-bottom: 1.4em;
			}
			a {
				bottom: 10px;
				@media (768px <= width) {
					bottom: auto; top: -6px;
				}
			}
		}
	}
}
.pg-outline .map iframe {
	border: 1px var(--border) solid;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 1;
	max-width: 1000px;
	display: block;
	margin: auto;
	@media (width < 767px) {
		aspect-ratio: 1 / 1;
	}
}
.pg-outline .maproute {
	display: block;
	li {
		padding-bottom: 1em;
	}
	li + li {
		padding-top: 1em;
		border-top: var(--border) 1px solid;
	}
	@media (1280px <= width) {
		display: flex;
		justify-content: space-between;
		li {
			width: 40%;
		}
		li + li {
			width: 60%;
			border-top: none;
			border-left: var(--border) 1px solid;
			padding-left: 4em;
		}
	}
	span {
		display: inline-block;
		margin-left: 1em;
		text-indent: -1em;
	}
}



/*-----------------------------
学科紹介
-------------------------------*/
.pg-course main .contentWrap {
	padding-bottom: 200px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
}
.pg-course .catch {
	ul {
		border-top: var(--border) 1px solid;
		li {
			position: relative;
			padding: 1em 0 1em 3em;
			border-bottom: var(--border) 1px solid;
			&::before {
				content: "";
				display: block;
				width: 9px;
				height: 9px;
				background: url("/assets/images/ico-check.svg") no-repeat center center / contain;
				position: absolute;
				margin: auto;
				top: 0; bottom: 0;
				left: 1.4em;
				z-index: 1;
			}
			&::after {
				content: "";
				display: block;
				width: 24px;
				height: 24px;
				border-radius: 50%;
				background: var(--green);
				position: absolute;
				margin: auto;
				top: 0; bottom: 0;
				left: 1em;
			}
		}
	}
}
.pg-course .point {
	background: var(--bg);
	border-radius: 16px;
	padding: 0 72px 56px;
	h2 {
		text-align: center;
		color: var(--green);
		font-size: 1rem;
		background: none;
		padding: 0; margin: 0;
		transform: translateY(-20px);
		&::before {display:none;}
		img {margin:0 auto 0.5em;}
	}
	ul {
		display: flex;
		padding-top: 20px;
		margin: auto;
		flex-wrap: wrap;
		justify-content: center;
		gap: 24px;
		li {
			width: calc((100% - 24px * 2) / 3);
			background: #ffffff;
			border-radius: 16px;
			flex-direction: column;
			gap: 24px;
			text-align: center;
			padding: 36px 20px;
			figure {
				display: block;
				width: 200px;
				aspect-ratio: 1 / 1;
				margin: auto auto 16px;
			}
			strong {
				color: var(--green);
				font-size: 1.2em;
				font-weight: 800;
			}
		}
		&.yakan {
			max-width: 700px;
			li {
			width: calc((100% - 24px * 1) / 2);
				@media (width < 767px) {
					width: 100%;
				}
			}
		}
		@media (width < 767px) {
			flex-direction: column;
			gap: 16px;
			display: block;
			li {
				display: flex;
				width: 100%;
				border-radius: 8px;
				flex-direction: row;
				align-items: center;
				gap: 16px;
				text-align: left;
				padding: 1.5em 1em;
				figure {
					width: 31%;
					margin: auto;
				}
				p {
					width: 66%;
				}
				& + li {
					margin-top: 16px;
				}
			}
		}
	}
	@media (width < 767px) {
		padding: 0 24px 32px;
	}
}
.pg-course .curriculum {
	border: var(--border) 1px solid;
	border-radius: 16px;
	padding: 56px;
	@media (width < 767px) {
		padding: 6%;
	}
	h4 {
		background: var(--green);
		border-radius: 8px;
		color: #ffffff;
		font-size: 1.3em;
		line-height: 1;
		padding: 14px 24px;
		margin: 0;
	}
	h5 {
		color: var(--green);
	}
	& .coursewrap {
		border-bottom: var(--border) 1px solid;
		padding-bottom: 32px;
		@media (768px <= width) {
			display: flex;
			justify-content: space-between;
			padding-bottom: 40px;
			h5 {
				width: 190px;
			}
			& .indent {
				width: calc(100% - 190px - 18px);
			}
		}
		& .imgbox-txt-right {
			grid-template-columns: 1fr 275px;
			@media (width < 767px) {
				grid-template-columns: 1fr;
				row-gap: 36px;
			}
		}
		&:last-child {
			border-bottom: none;
			padding-bottom: 0;
		}
	}
}
.pg-course .imgbox-txt-left {
	grid-template-columns: 282px 1fr;
	@media (width < 767px) {
		grid-template-columns: 1fr;
		row-gap: 36px;
	}
	& + .imgbox-txt-left {
		border-top: var(--border) 1px solid;
		padding-top: 36px;
	}
}
.pg-course table td {
	width: 16%;
	min-width: 130px;
}
.pg-course table.night td {
	width: 20%;
	min-width: 190px;
}



/*-----------------------------
学費・各種サポート
-------------------------------*/
.pg-expense main .contentWrap {
	max-width: 1000px;
	padding-bottom: 200px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
}
.pg-expense .btnnav {
	width: 100%;
	max-width: 900px;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 18px;
	@media (width < 767px) {
		gap: 17px;
		li {
			width: 100%;
			& a.btn {
				line-height: 3;
				font-size: 0.7777rem;
				width: 100%;
			}
		}
	}
}
.pg-expense table div {
	background: #D7EEEB;
}
.pg-expense table p {
	margin: 0;
	& + div {
		margin-top: 0.5em;
	}
}
.pg-expense .schedule .midashi {
	line-height: 1.4;
	font-weight: 700;
	background: var(--bg);
	padding: 0.5em;
}
.pg-expense .schedule table {
	display: table;
	width: 100%;
	min-width: auto;
	border: none;
	& th, & td {
		border: none;
		background-color: #F6F2D9;
		font-weight: 700;
		width: 24%;
	}
	& td {
		background-color: #FCFCF5;
		line-height: 2.6;
		width: 76%;
	}
	& tr:nth-child(even) {
		& th {
			background-color: #D7EEEB;
		}
		& td {
			background-color: #F0F9F8;
		}
	}
	span {
		display: inline-block;
		vertical-align: middle;
		line-height: 1.2;
	}
	num {
		display: inline-block;
		color: #ffffff;
		line-height: 40px;
		text-align: center;
		width: 40px; height: 40px;
		border-radius: 50%;
		background: var(--green);
		vertical-align: middle;
		margin-right: 10px;
		strong {
			text-align: center;
		}
		@media (width < 767px) {
			line-height: 32px;
			width: 32px; height: 32px;
			strong.m-el {
				font-size: 0.8rem;
			}
		}
	}
}
.pg-expense .caution {
	border: var(--border) 1px solid;
	border-radius: 16px;
	padding: 3em;
	@media (width < 767px) {
		padding: 5%;
	}
	strong {
		color: var(--dept_day);
	}
}
.pg-expense .caution.green {
	padding: 2em;
	text-align: center;
	border: var(--green) 6px solid;
	strong {
		color: var(--txt);
		&.m-el {
			color: var(--green);
		}
	}
	@media (width < 767px) {
		text-align: left;
		padding: 5%;
	}
}
.pg-expense .caution.contact {
	border: var(--bg) 1px solid;
	background: var(--bg);
	text-align: center;
	padding: 40px 60px;
	@media (width < 767px) {
		text-align: left;
		padding: 5%;
	}
	strong {
		color: var(--green);
	}
	& .flex {
		li {
			background: #ffffff;
			border-radius: 16px;
			align-content: center;
			padding: 1.4em 0.5em;
		}
		@media (width < 767px) {
			gap: 24px;
			li {
				padding: 1em;
			}
		}
	}
	a.online {
		display: block;
		padding: 1em 0;
		color: var(--green);
		position: relative;
		text-decoration: none;
		white-space: nowrap;
		&::before {
			content: "";
			display: inline-block;
			width: 42px;
			height: 42px;
			border-radius: 50%;
			background: var(--green);
			vertical-align: middle;
		}
		strong {
			display: inline-block;
			vertical-align: middle;
			&::before {
				content: "";
				display: inline-block;
				width: 24px;
				height: 24px;
				background: url("/assets/images/ico-arrw.svg") no-repeat center center / contain;
				filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(298deg) brightness(104%) contrast(103%);
				vertical-align: middle;
				margin-left: -32px;
				margin-right: 14px;
			}
		}
		&:hover {
			opacity: 0.6;
		}
	}
	a.tel {
		color: var(--green);
		text-decoration: none;
	}
}
.pg-expense h4 {
	margin-top: 2em;
	padding-bottom: 0.5em;
	border-bottom: var(--border) 1px solid;
}
.pg-expense .grant_max {
	display: flex;
	justify-content: space-between;
	position: relative;
	div {
		width: 45%;
		background: var(--bg);
		padding: 5px 40px 20px;
		text-align: center;
		strong {
			display: block;
			border-bottom: var(--txt) 1px solid;
		}
		& .note {
			text-align: center;
		}
	}
	&::before {
		content: "+";
		display: block;
		text-align: center;
		width: 64px;
		height: 64px;
		font-size: 64px;
		font-weight: 700;
		line-height: 1;
		margin: auto;
		position: absolute;
		top: 0; right: 0; bottom: 0; left: 0;
	}
	@media (width < 767px) {
		display: block;
		div {
			width: 100%;
			& + div {
				margin-top: 16%;
			}
		}
	}
}

.pg-expense .timetable .label {
	display: flex;
	justify-content: space-between;
	span {
		display: inline-block;
		background: var(--green);
		border-radius: 1em;
		line-height: 1;
		text-align: center;
		color: #ffffff;
		/*font-weight: 700;*/
		width: 40%;
		padding-top: 0.3em;
	}
	@media (width < 767px) {
		display: block;
		span {
			width: 100%;
			margin-top: 0.5em;
			padding: 0.3em;
		}
	}
}
.pg-expense .blanklink a {
	display: block;
	border: var(--txt) 1px solid;
	border-radius: 16px;
	padding: 20px 40px;
	line-height: 1.5;
	text-decoration: none;
	background: #ffffff;
	position: relative;
	@media (width < 767px) {
		font-size: 88%;
		padding: 20px 20px;
	}
	&::before {
		content: "";
		display: inline-block;
		width: 24px;
		height: 24px;
		background: url("/assets/images/ico-blank.svg") no-repeat center center/contain;
		filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(298deg) brightness(104%) contrast(103%);
		margin: auto;
		position: absolute;
		top: 0; bottom: 0;
		right: 34px;
		z-index: 1;
		@media (width < 767px) {
			right: 28px;
		}
	}
	&::after {
		content: "";
		display: block;
		width: 56px; height: 56px;
		background: var(--txt);
		border-radius: 50%;
		margin: auto;
		position: absolute;
		top: 0; bottom: 0;
		right: 20px;
		@media (width < 767px) {
			width: 46px; height: 46px;
			right: 18px;
		}
	}
	&:hover {
		background-color: var(--border);
		opacity: 0.8;
	}
}



/*-----------------------------
資格・就職情報
-------------------------------*/
.pg-career main .contentWrap {
	max-width: 1000px;
	padding-bottom: 200px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
	&.graduatesindex {
		max-width: 1200px;
	}
}
.pg-career .storebox {
	display: grid;
	grid-template-columns: repeat(auto-fill,minmax(245px, 1fr));
	column-gap: 6px;
	row-gap: 18px;
	div {
		text-align: center;
		display: grid;
		grid-row: span 3;
		grid-template-rows: subgrid;
		row-gap: 6px;
		p {
			margin: 0;
		}
	}
}
.pg-career h4 {
	margin-top: 2em;
	padding-bottom: 0.5em;
	border-bottom: var(--border) 1px solid;
}
.pg-career .trainingstep,
.pg-career .jobstep {
	gap: 17px;
	& > li {
		background: var(--bg);
    width: calc((100% - 17px * 2) / 3);
		padding: 20px;
	}
	strong {
		color: var(--green);
		display: inline-block;
		vertical-align: middle;
	}
	num {
		display: inline-block;
		color: #ffffff;
		font-weight: 700;
		line-height: 40px;
		text-align: center;
		width: 40px; height: 40px;
		border-radius: 50%;
		background: var(--green);
		vertical-align: middle;
		margin-right: 10px;
		@media (width < 767px) {
			width: 32px; height: 32px;
			line-height: 32px;
			strong.m-el {
				font-size: 0.8rem;
			}
		}
	}
}
.pg-career .jobstep {
	gap: 64px;
	& > li {
		background: var(--bg);
    width: calc((100% - 64px * 3 - 110px) / 3);
		padding: 20px;
		padding-right: 0;
		position: relative;
		&::after {
			content: "";
			background: var(--bg);
			height: 100%;
			width: 50px;
			clip-path: polygon(0 0, 100% 50%, 0 100%);
			position: absolute;
			margin: auto;
			top: 0; bottom: 0;
			left: 99%;
		}
		&.offer {
			width: 100px;
			padding: 20px;
			display: grid;
			place-content: center;
			background: #FFE2DC;
			strong {color: var(--txt);}
			&::after {display:none;}
		}
	}
	@media (width <= 1023px) {
		& > li {
			width: 100%;
			padding: 3% 5% 2%x;
			&::after {
				height: 50px;
				width: 98%;
				clip-path: polygon(0 0, 100% 0, 50% 100%);
				top: 99%; bottom: auto;
				left: 0; right: 0;
			}
			&.offer {
				width: 100%;
				padding: 3%;
			}
		}
	}
}
.pg-career .flex.store {
	gap: 10px;
	line-height: 1.2;
	font-size: 90%;
	letter-spacing: 0.01em;
}

.pg-career .graduatesindex {
	padding: 0;
	& .list {
		display: grid;
		grid-template-columns: repeat(auto-fill,minmax(450px, 1fr));
		column-gap: 48px;
		row-gap: 48px;
		& .item a {
			text-decoration: none;
			display: grid;
			grid-template-columns: 35% 1fr;
			grid-template-rows: 120px 1fr;
			column-gap: 30px;
			& .catch { grid-area: 1 / 2 / 2 / 3; }
			& figure { grid-area: 1 / 1 / 3 / 2; }
			& .body  { grid-area: 2 / 2 / 3 / 3; }
			& .catch {
				color: var(--green);
			}
			figure {
				border-radius: 16px;
				overflow: hidden;
				img {border-radius: 16px;}
			}
			p {
				margin: 0;
			}
			&:hover {
				& .body {
					opacity: 0.7;
				}
				figure img {
					scale: 1.05;
				}
			}
			@media (width < 767px) {
				display: grid;
				grid-template-columns: 35% 1fr;
				grid-template-rows: max-content 1fr;
				column-gap: 20px;
				row-gap: 20px;
				& .catch { grid-area: 1 / 1 / 2 / 3; }
				& figure { grid-area: 2 / 1 / 3 / 2; }
				& .body  { grid-area: 2 / 2 / 3 / 3; }
			}
		}
		@media (width < 767px) {
			grid-template-columns: repeat(auto-fill,minmax(320px, 1fr));
		}
	}
}
.pg-career section.graduates {
	& .contentWrap {
		padding: 0 5%;
	}
	& .head {
		padding: 48px 56px;
		display: grid;
		grid-template-columns: 31.83% 1fr;
		grid-template-rows: max-content 1fr;
		column-gap: 48px;
		row-gap: 24px;
		& h2     { grid-area: 1 / 2 / 2 / 3; }
		& figure { grid-area: 1 / 1 / 3 / 2; }
		& .body  { grid-area: 2 / 2 / 3 / 3; }
		figure {
			border-radius: 16px;
			overflow: hidden;
			img {border-radius: 16px;}
		}
		& .postlist li {
      padding: 0;
			flex-direction: column;
    }
		p {
			margin: 0;
		}
		@media (width < 767px) {
			padding: 6% 8%;
			display: grid;
			grid-template-columns: 35% 1fr;
			grid-template-rows: max-content 1fr;
			column-gap: 24px;
			row-gap: 24px;
			& h2     { grid-area: 1 / 1 / 2 / 3; }
			& figure { grid-area: 2 / 1 / 3 / 2; }
			& .body  { grid-area: 2 / 2 / 3 / 3; }
			& img {
        width: 100%;
      }
		}
	}
	& .body {
		h3:first-child {
			margin-top: 0;
		}
  }
}



/*-----------------------------
資格・就職情報
-------------------------------*/
.pg-campuslife main .contentWrap {
	padding-bottom: 200px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
	&.faq {
		max-width: 1000px;
	}
}
.pg-campuslife .eventbox {
	display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	& > li {
		padding: 30px;
		background: var(--bg);
		&:nth-of-type(even) {
			background: #D7EEEB;
		}
		display: grid;
		grid-template-rows: subgrid;
		grid-row: span 3;
	}
	li ul {
		margin: 18px 0;
	}
	small {
		font-size: 50%;
	}
	figure {
		border-radius: 16px;
	}
}
.pg-campuslife .imgbox.img3 figure {
	margin: 10px 0;
}
.pg-campuslife .btnnav {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	@media (width < 767px) {
		gap: 17px;
		li {
			width: calc((100% - 17px) / 2);
			& a.btn {
				line-height: 3;
				font-size: 0.7777rem;
				width: 100%;
			}
		}
	}
}
.pg-campuslife .faq dt {
	margin-top: 40px;
	text-indent: -2.7em;
	margin-left: 2.7em;
}



/*-----------------------------
入試情報
-------------------------------*/
.pg-admission main .contentWrap {
	padding-bottom: 200px;
	max-width: 1000px;
	@media (width < 767px) {
		padding-bottom: 17%;
	}
}
.pg-admission .btnnav {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	@media (width < 767px) {
		gap: 17px;
		li {
			width: calc((100% - 17px) / 2);
			& a.btn {
				line-height: 3;
				font-size: 0.7777rem;
				width: 100%;
			}
		}
	}
}
.pg-admission h4 {
	margin-top: 2em;
	padding-bottom: 0.5em;
	border-bottom: var(--border) 1px solid;
}
.pg-admission .flex.item3 li {
	text-align: center;
	background: var(--bg);
	padding: 30px 10px;
	figure {
		display: inline-block;
		margin: 18px auto;
	}
}
.pg-admission .boxbg {
	background: var(--bg);
	padding: 2.5em;
}
.pg-admission .caution.green {
	padding: 2em;
	border: var(--green) 6px solid;
	border-radius: 16px;
	@media (width < 767px) {
		text-align: left;
		padding: 5%;
	}
	& .box {
		padding: 1em 2em;
		background: #D7EEEB;
	}
}
.pg-admission .timetable {
	ul {
		line-height: 1.5;
	}
	div.em {
		background: #FFE2DC;
		color: var(--dept_day);
	}
}



/*-----------------------------
訪問者別
-------------------------------*/
.pg-visitor {
	& main .contentWrap {
		max-width: 1000px;
		padding-bottom: 200px;
		@media (width < 767px) {
			padding-bottom: 17%;
		}
	}
	& .course {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 24px;
		li {
			display: grid;
			grid-template-rows: subgrid;
			grid-row: span 3;
			row-gap: 18px;
			p {
				margin: 0;
			}
		}
		@media (width < 767px) {
			grid-template-columns: 1fr;
			grid-template-rows: max-content;
			column-gap: 0;
			row-gap: 6%;
			li {
				display: block;
				& .btn {
					margin-top: 3%;
				}
			}
		}
	}
	& .course1 {
		color: var(--dept_m);
	}
	& .course2 {
		color: var(--dept_day);
	}
	& .course3 {
		color: var(--dept_night);
	}
	& .course1, & .course2, & .course3 {
		& .m-el {
			-webkit-text-stroke: 1px var(--txt);
			text-stroke: 1px var(--txt);
			paint-order: stroke;
		}
		span {
			display: inline-block;
			background: var(--bg);
			border-radius: 8px;
			line-height: 30px;
			padding: 0 0.5em;
			margin-left: 0.6em;
			font-size: 90%;
			font-weight: normal;
			color: var(--txt);
			vertical-align: text-bottom;
		}
	}
}
.pg-visitor h4 {
	margin-top: 2em;
	padding-bottom: 0.5em;
	border-bottom: var(--border) 1px solid;
}
.pg-visitor .flex.graduates {
	li:first-child strong {
		color: var(--dept_day);
	}
	li:last-child strong {
		color: var(--dept_night);
	}
	div {
		display: inline-block;
		background-color: var(--dept_msub);
		border-radius: 8px;
		line-height: 40px;
		color: #ffffff;
		font-weight: 700;
		padding: 0 0.5em;
		margin-top: 1em;
	}
}
.pg-visitor .caution.green {
	padding: 2em;
	text-align: center;
	border: var(--green) 6px solid;
	border-radius: 16px;
	strong {
		color: var(--txt);
		&.m-el {
			color: var(--green);
		}
	}
	@media (width < 767px) {
		text-align: left;
		padding: 5%;
	}
}
.pg-visitor .imgbox-txt-left {
	grid-template-columns: 282px 1fr;
	@media (width < 767px) {
		grid-template-columns: 1fr;
		row-gap: 36px;
	}
}
.pg-visitor .link_op {
	display: block;
	margin: 80px auto 0;
	max-width: 810px;
	background-color: var(--bg);
	border-radius: 24px;
	padding: 38px 68px 24px;
	text-align: center;
	text-decoration: none;
	img {
		margin-bottom: 18px;
	}
	&:hover {
		opacity: 0.7;
	}
	@media (width < 767px) {
		margin: 10% auto 0;
		padding: 6%;
	}
}
.pg-visitor .link_doc {
	display: block;
	margin: 80px auto 0;
	max-width: 810px;
	background-color: var(--dept_day);
	border: var(--txt) 1px solid;
	border-radius: 24px;
	padding: 20px 70px;
	text-align: center;
	text-decoration: none;
	color: #ffffff;
	font-weight: 700;
	font-size: 2rem;
	span {
		display: block;
		border-bottom: #ffffff 2px solid;
		font-size: 0.6em;
		padding-bottom: 4px;
	}
	img {
		display: inline-block;
		vertical-align: baseline;
		width: 30px;
		margin-right: 9px;
		filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(298deg) brightness(104%) contrast(103%);
	}
	&:hover {
		opacity: 0.7;
	}
	@media (width < 767px) {
		margin: 10% auto 0;
		padding: 4% 6%;
		font-size: 1.5rem;
	}
}
.pg-visitor .mv {
	padding: 0 1.5%;
	& .contentWrap {
		max-width: 100%;
		border-radius: 24px;
		padding: 0;
		overflow: hidden;
		img {
			margin: auto;
		}
		h1 {
			background: none;
			border-radius: 0;
			margin: auto;
			line-height: 1;
			width: 72%;
			height: 100%;
			max-width: 1046px;
			position: absolute;
			top: 0; right: 0; left: 0;
			padding-top: 3%;
			&::after {
				left: -14%;
			}
		}
	}
	@media (width < 767px) {
		padding: 0;
		& .contentWrap {
			border-radius: 0;
			h1 {
				display: none;
			}
		}
	}
}
.pg-visitor h2.none {
	font-size: 1rem;
	line-height: 1.25;
	text-align: center;
	margin-top: 0;
	background-color: inherit;
	padding: 0;
	z-index: 1;
	&::before {
		content: none;
	}
	img {
		margin: auto;
	}
}
.pg-visitor .sec_reason {
	background-color: var(--bg);
	& .contentWrap {
		max-width: 1200px;
		padding: 90px 0;
	}
	& .imgbox-txt-right {
		background-color: #ffffff;
		border-radius: 24px;
		padding: 40px;
	}
}
.pg-visitor .sec_location {
	& .contentWrap {
		max-width: 1200px;
		padding: 90px 0;
	}
}
.pg-visitor .sec_voice {
	background-color: var(--bg);
	& .contentWrap {
		max-width: 1200px;
		padding: 90px 0;
	}
}
.pg-visitor .sec_campus {
	
	& .contentWrap {
		padding: 90px 0;
	}
	& a.btn {
		width: 100%;
		max-width: 420px;
		font-size: 160%;
		line-height: 2.8;
		margin-top: 40px;
		@media (width < 767px) {
			font-size: 110%;
			line-height: 3;
			margin-top: 3%;
		}
	}
	& a.btn {
		color: #ffffff;
		font-weight: 700;
		background-color: var(--dept_day);
		&::before {
			width: 41px;
			height: 41px;
			border-radius: 50%;
			background: url("/assets/images/ico-arrw.svg") no-repeat center center/contain #fff;
		}
		&:hover {
			color: var(--dept_day);
			background-color: #ffffff;
			border: var(--dept_day) 1px solid;
			&::before {
				filter: invert(98%) sepia(100%) saturate(0%) hue-rotate(298deg) brightness(104%) contrast(103%);
			}
		}
	}
}
.pg-visitor .sec_line {
	background-color: #F0F9F8;
	margin-bottom: 3%;
	& .contentWrap {
		padding: 90px 0;
	}
	& a.btn {
		width: 100%;
		max-width: 420px;
		font-size: 177%;
		line-height: 2.8;
		margin-top: 40px;
		@media (width < 767px) {
			font-size: 110%;
			line-height: 3;
			margin-top: 3%;
		}
	}
}






/*-----------------------------
サイトポリシー
-------------------------------*/
.pg-policy {
	& main .contentWrap {
		max-width: 1000px;
		padding-bottom: 200px;
		@media (width < 767px) {
			padding-bottom: 17%;
		}
	}
	& .index {
		background-color: var(--bg);
		padding: 1em;
		p {
			margin: 0;
		}
		dl {
			margin-top: 0.5em;
			line-height: 1.5;
			dd {
				margin-left: 1.5em;
			}
		}
	}
	ol {
		padding: 40px 0 80px 2em;
		margin-bottom: 40px;
		list-style: decimal;
		ul {
			margin-top: 0.5em;
		}
		& > li {
			line-height: 1.75;
			&::marker {
				font-weight: 700;
				font-size: 1.1em;
				color: var(--txt);
			}
			& + li {
				margin-top: 2em;
			}
			p {
				display: block;
				padding: 1em;
				margin-top: 0.5em;
				border: var(--border) 1px solid;
			}
		}
		
	}
}









/* ----------------------------------------------------------------------------------------------------- */
/*
@media (1280px <= width <= 1439px) {}
@media (1024px <= width <= 1279px) {}
@media (768px <= width <= 1023px) {}
@media (width < 767px) {}
@media (768px <= width) {}
*/