@charset "utf-8";

body{
	min-width: 1300px;
}
@media (max-width: 480px) {
	body{
		min-width: 100%;
	}
}
@media (min-width: 481px) {
	.nav-section {
		display: none !important;
	}
}
main {
	border-bottom: 0;
	background: none;
}
@media (max-width: 480px) {
	main {
	}
}
.menu_button {
	z-index: 1010;
}

._cf::after {
	content: "";
	display: table;
	clear: both;
}

#pagetop {
	display: none;
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 96px;
	z-index: 100;
}
#pagetop img {
	width: 100%;
	height: auto;
}
#page-top[style*="absolute"] a {
	background-color: rgba(255,255,255,0);
}
@media (max-width: 480px) {
	#page-top {
		right: 8px;
	}
}

/* slick
============================================================================================================ */
.slick-slider{box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:rgba(0,0,0,0)}.slick-list,.slick-slider{position:relative;display:block}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir='rtl'] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}

/* font
============================================================================================================ */
.ff_en {
	font-family: din-condensed, sans-serif;
	font-weight: 400;
	font-style: normal;
}
.ff_enb {
	font-family: din-2014, sans-serif;
	font-weight: 700;
	font-style: normal;
}
.ff_jost {
	font-family: "Jost", sans-serif;
	font-weight: 800;
	font-style: normal;
}
.ff_roboto {
	font-family: "Roboto", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.c_white {
	color: #fff;
}


/* webopencampus
============================================================================================================ */
#webopencampus {
	position: relative;
	overflow: hidden;
	font-size: 18px;
	background: #fff;
	line-height: 1.8;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	color: #000;
	z-index: 1;
}
#webopencampus h1, #webopencampus h2, #webopencampus h3, #webopencampus h4, #webopencampus h5, #webopencampus h6 {
	font-weight: 700;
	font-size: 100%;
}
#webopencampus p {
	margin: 0;
	text-align: inherit;
}
#webopencampus img {
	max-width: 100%;
	height: auto;
}
#webopencampus img.of {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#webopencampus .w {
	position: relative;
}
@media (min-width: 481px) {
	#webopencampus .w {
		width: 1040px;
		margin: auto;
	}
	#webopencampus a {
		transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border 0.2s ease-in-out, opacity 0.2s ease-in-out;
	}
	#webopencampus a.hv_wh,
	#webopencampus a .hv_wh,
	#webopencampus .hv_wh a {
		position: relative;
		display: block;
		overflow: hidden;
	}
	#webopencampus a.hv_wh::after,
	#webopencampus a .hv_wh::after,
	#webopencampus .hv_wh a::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		background-color: rgba(255,255,255,0);
		transition: background 0.2s;
		z-index: 3;
	}
	#webopencampus a.hv_wh:hover::after,
	#webopencampus a:hover .hv_wh::after,
	#webopencampus .hv_wh a:hover::after {
		background-color: rgba(255,255,255,0.3);
	}
}
@media (max-width: 480px) {
	#webopencampus {
		font-size: 13px;
		background-size: 21px;
	}
	#webopencampus .sp_pd {
		padding-right: 5vw !important;
		padding-left: 5vw !important;
	}
	#webopencampus .sp_full {
		margin-right: -5vw !important;
		margin-left: -5vw !important;
	}
}

/* page_header
============================================================================================================ */
#webopencampus {
	.page_header {
		position: relative;
		padding-top: 36px;
		text-align: center;
		z-index: 2;
		&::before,
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: url(../img/2026/head_bg.jpg) no-repeat 50%;
			background-size: cover;
			z-index: -1;
		}
		&::before {
			bottom: 100px;
		}
		&::after {
			opacity: 0.25;
			mix-blend-mode: screen;
		}
		h1 {
			max-width: 1230px;
			margin-inline: auto;
			position: relative;
			.sub {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				pointer-events: none;
				animation: 3s ease-in-out 0s infinite fuki;
			}
		}
		.school {
			position: absolute;
			right: 0;
			left: 0;
			bottom: 54px;
			padding-block: 3px;
			background-color: rgba(255,255,255,.9);
		}
		.ico {
			position: absolute;
			&.-ico1 {
				width: 130px;
				top: 584px;
				right: calc(50% + 436px);
			}
			&.-ico2 {
				width: 160px;
				top: 462px;
				left: calc(50% + 454px);
			}
			&.-txt {
				width: 274px;
				top: 418px;
				right: min(calc(50% + 402px), 100% - 274px + 4px);
			}
		}
		@media (min-width: 481px) {
		}
		@media (max-width: 480px) {
			padding-top: 20px;
			h1 {
				margin-bottom: 10px;
			}
			.school {
				bottom: 15px;
				img {
					width: 60%;
				}
			}
			.ico {
				&.-ico1 {
					width: 50px;
					top: 53%;
					right: auto;
					left: 18px;
				}
				&.-ico2 {
					width: 60px;
					top: 40%;
					left: auto;
					right: -3px;
				}
				&.-txt {
					width: 100px;
					top: 36%;
					right: auto;
					left: -2px;
				}
			}
		}
	}
}
@keyframes fuki {
	0% { opacity: 0; }
	9.9% { opacity: 0; }
	10% { opacity: 1; }
	19.9% { opacity: 1; }
	20% { opacity: 0; }
	29.9% { opacity: 0; }
	30% { opacity: 1; }
}

/* main_contents
============================================================================================================ */
#webopencampus .main_contents {
	position: relative;
	text-align: center;
	z-index: 3;
}
#webopencampus .main_contents > * {
	position: relative;
	z-index: 3;
}
@media (min-width: 481px) {
}
@media (max-width: 480px) {
	#webopencampus .main_contents {
		padding-top: 30px;
	}
}

/* intro_movie_section
============================================================================================================ */
#webopencampus .intro_movie_section {
	position: relative;
	padding-top: 50px;
	padding-bottom: 40px;
	text-align: left;
}
#webopencampus .intro_movie_section > div {
	max-width: 980px;
	margin: 0 auto;
}
/*
#webopencampus .intro_movie_section h2 {
	margin-bottom: 40px;
	color: #000;
	font-size: 30px;
	text-align: center;
	line-height: 1.2;
}
#webopencampus .intro_movie_section h2 .ff_en {
	display: block;
	color: #000000;
	font-size: 80px;
}
*/
#webopencampus .intro_movie_section h2 {
	display: flex;
	align-items: flex-end;
	margin-bottom: 30px;
	color: #000;
	font-size: 23px;
	line-height: 1;
}
#webopencampus .intro_movie_section h2 .ff_en {
	margin-right: 20px;
	color: #000;
	font-size: 66px;
	line-height: 0.6;
}

#webopencampus .intro_movie_section .movie {
	position: relative;
	padding-top: 56.25%;
}
#webopencampus .intro_movie_section .movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 30px;
}

@media (min-width: 481px) {
	#webopencampus .intro_movie_section h2 {
		justify-content: space-between;
	}
}
@media (max-width: 480px) {
	#webopencampus .intro_movie_section {
		padding-top: 10px;
		padding-bottom: 20px;
	}
/*
	#webopencampus .intro_movie_section h2 {
		display: block;
		margin-bottom: 15px;
		font-size: 18px;
		line-height: 1.4;
	}
	#webopencampus .intro_movie_section h2 .ff_en {
		margin-bottom: 2px;
		font-size: 44px;
	}
*/
	#webopencampus .intro_movie_section h2 {
		display: block;
		margin-bottom: 15px;
		font-size: 16px;
	}
	#webopencampus .intro_movie_section h2 .ff_en {
		display: block;
		margin: 0 0 10px;
		font-size: 40px;
	}

	#webopencampus .intro_movie_section .movie iframe {
		border-radius: 10px;
	}
}

/* page_nav
============================================================================================================ */
#webopencampus .page_nav dl {
	max-width: 980px;
	margin: 0 auto;
	text-align: center;
}
#webopencampus .page_nav dt {
	margin-bottom: 30px;
	font-size: 36px;
	line-height: 1.3;
	letter-spacing: 0.1em;
	color: #000;
	font-weight: bold;
}
#webopencampus .page_nav ul {
	overflow: hidden;
	display: flex;
	background: #b5ff44;
	padding-bottom: 10px;
}
#webopencampus .page_nav ul li {
	width: 25%;
}
#webopencampus .page_nav ul a {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 64px;
	text-decoration: none;
	color: #000;
	font-size: 25px;
	font-weight: bold;
	letter-spacing: 0.2em;
}
#webopencampus .page_nav ul li:nth-child(2n + 1) a {
	background-color: #4cecff;
}
@media (min-width: 481px) {
	#webopencampus .page_nav ul {
		border-top-left-radius: 20px;
		border-top-right-radius: 20px;
	}
	#webopencampus .page_nav ul a:hover::after {
		background-color: rgba(255,255,255,0.2);
	}
}
@media (max-width: 480px) {
	#webopencampus .page_nav dt {
		margin-bottom: 15px;
		font-size: 24px;
	}
	#webopencampus .page_nav ul {
		border-bottom-width: 5px;
	}
	#webopencampus .page_nav ul a {
		height: 50px;
		font-size: 15px;
		line-height: 1.3;
	}
}

/* topics_section
============================================================================================================ */
#webopencampus .topics_section {
	position: relative;
	padding: 50px 0 65px;
	z-index: 3;
}
#webopencampus .topics_section h2 {
	margin-bottom: 30px;
	font-size: 28px;
	line-height: 1.3;
	text-align: center;
	color: #000;
}
#webopencampus .topics_section h2 .ff_en {
	display: block;
	color: #969696;
	font-size: 44px;
	line-height: 1.2;
}
#webopencampus .topics_section .swiper {
	position: relative;
	left: 50%;
	width: calc(410px * 5);
	transform: translateX(-50%);
}
#webopencampus .topics_section li {
	display: block;
	width: 410px;
	text-align: center;
}
#webopencampus .topics_section li a img {
	max-width: 380px;
	height: auto;
}
@media (min-width: 481px) {
}
@media (max-width: 480px) {
	#webopencampus .topics_section {
		padding: 30px 0 40px;
	}
	#webopencampus .topics_section h2 {
		margin-bottom: 20px;
		font-size: 20px;
	}
	#webopencampus .topics_section h2 .ff_en {
		font-size: 28px;
	}
	#webopencampus .topics_section .swiper {
		width: calc((70vw + 7px * 2) * 5);
	}
	#webopencampus .topics_section li {
		width: calc(70vw + 7px * 2);
	}
	#webopencampus .topics_section li a img {
		max-width: 70vw;
	}
}

/* person_info
============================================================================================================ */
#webopencampus .person_info {
	position: relative;
	padding: 60px 40px 60px;
	&::before {
		content: "";
		position: absolute;
		inset: 0;
		background: url(../img/2026/head_bg.jpg) no-repeat 50%;
		background-size: cover;
		opacity: 0.65;
		z-index: -1;
	}
}
#webopencampus .person_info > * {
	position: relative;
	z-index: 4;
}
#webopencampus .person_info dt {
	position: relative;
	margin-bottom: 15px;
	font-size: 33px;
	line-height: 1.4;
	font-weight: bold;
	letter-spacing: 0.1em;
}
#webopencampus .person_info dt .img {
	display: flex;
	margin-bottom: 10px;
	gap: 8px;
}
#webopencampus .person_info dt .img img {
	width: 116px;
	border-radius: 100%;
}
#webopencampus .person_info dt .box {
	display: block;
	width: fit-content;
	margin-bottom: 4px;
	padding-inline: 10px;
	color: #fff;
}
#webopencampus .person_info .a dt .box {
	background-color: #dd97c0;
}
#webopencampus .person_info .b dt .box {
	background-color: #32a2dc;
}
#webopencampus .person_info .c dt .box {
	background-color: #ffb400;
}
#webopencampus .person_info dd {
	font-size: 20px;
	line-height: 1.5;
	color: #000;
	font-weight: 500;
}
#webopencampus .person_info p {
	margin-top: 50px;
	padding: 30px;
	background: #ffff00;
	text-align: center;
	color: #000;
	font-size: 40px;
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: 0.15em;
}
@media (min-width: 481px) {
	#webopencampus .person_info > * {
		max-width: 1070px;
		margin-left: auto;
		margin-right: auto;
	}
	#webopencampus .person_info .person {
		display: flex;
		justify-content: space-between;
	}
}
@media (max-width: 480px) {
	#webopencampus .person_info {
		padding: 40px 0 40px;
	}
	#webopencampus .person_info dl + dl {
		margin-top: 30px;
	}
	#webopencampus .person_info dt {
		padding-left: 70px;
		margin-bottom: 10px;
		font-size: 24px;
	}
	#webopencampus .person_info dt .img {
		position: absolute;
		top: 0;
		left: -10px;
		width: 70px;
		flex-direction: column;
		gap: 3px;
	}
	#webopencampus .person_info dd {
		padding-left: 70px;
		font-size: 14px;
	}
	#webopencampus .person_info p {
		margin-top: 40px;
		padding: 10px;
		font-size: 26px;
	}
}


/* bg_block
============================================================================================================ */
.bg_block {
	position: relative;
	background: #ffff56 url(../img/2026/bg.svg) repeat-y 50% -100px;
	background-size: max(1400px, 100%);
	z-index: 1;
	@media (max-width: 480px) {
		background-size: 100%;
	}
}

/* category_section
============================================================================================================ */
#learning {
	--color: #2cb4a0;
}
#life {
	--color: #d994da;
}
#exam {
	--color: #36cbf8;
}
#employment {
	--color: #ffae4c;
}
#consultation {
	--color: #5fd1b3;
}

#webopencampus .category_section {
	position: relative;
	padding-bottom: 120px;
	padding-top: 135px;
}
#webopencampus .category_section .z {
	position: relative;
	z-index: 3;
}
#webopencampus .category_section > section + section {
	margin-top: 150px;
}
@media (max-width: 480px) {
	#webopencampus .category_section {
		padding-bottom: 60px;
		padding-top: 60px;
	}
	#webopencampus .category_section > section + section {
		margin-top: 60px;
	}
}

/* slash-bg
============================================================================================================ */
#webopencampus .slash-bg {
	position: relative;
	&::before {
		content: "";
		position: absolute;
		right: 0;
		left: 0;
		top: -260px;
		height: 620px;
		background-color: var(--color);
		transform: skewY(-17.99deg);
		z-index: -1;
		@media (max-width: 480px) {
			top: -140px;
			height: 360px;
		}
	}
	&.-type1::before {
		top: -200px;
		@media (max-width: 480px) {
			top: -40px;
		}
	}
	&.-type2::before {
		top: -5px;
		height: 440px;
		@media (max-width: 480px) {
			top: -40px;
		}
	}
}
#webopencampus .slash-bg-all {
	position: relative;
	&::before {
		content: "";
		position: absolute;
		right: 0;
		left: 0;
		top: -260px;
		bottom: -260px;
		background-color: var(--color);
		transform: skewY(-17.99deg);
		z-index: -1;
		@media (max-width: 480px) {
			top: -140px;
			bottom: -140px;
		}
	}
}

/* category_title
============================================================================================================ */
#webopencampus .category_title {
	position: relative;
	margin-bottom: 100px;
	z-index: 3;
}
#webopencampus .category_title h2 {
	position: relative;
}
#webopencampus .category_title h2 span {
	display: block;
	position: relative;
	width: 590px;
	margin: 0 auto;
	border: 3px solid #fff;
	color: #fff;
	text-align: center;
	font-size: 62px;
	letter-spacing: 0.4em;
	padding-left: 0.4em;
	font-weight: 900;
}
@media (max-width: 480px) {
	#webopencampus .category_title {
		margin-bottom: 60px;
	}
	#webopencampus .category_title h2 > span {
		width: 260px;
		font-size: 30px;
	}
	#webopencampus .category_title h2.wide {
		width: calc((450 / 320) * 220px);
	}
}

/* point_title
============================================================================================================ */
#webopencampus .point_title {
	position: relative;
	margin-bottom: 40px;
	padding-bottom: 10px;
	font-size: 46px;
	line-height: 1.3;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	&::after {
		content: "";
		position: absolute;
		right: 0;
		left: 0;
		top: 100%;
		height: 5px;
		background: #fff;
	}
	.ff_en {
		position: absolute;
		left: 70px;
		bottom: -20px;
		text-align: center;
		.point {
			display: block;
			font-size: 37px;
			line-height: 1;
		}
		.num {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 92px;
			height: 92px;
			background: #fff;
			border-radius: 100%;
			font-size: 70px;
			line-height: 0.8;
			color: var(--color);
		}
	}
	.title {
		display: block;
		letter-spacing: 0.02em;
		font-feature-settings: "palt";
		.s {
			font-size: calc(33 / 46 * 100%);
		}
		.ss {
			font-size: calc(26 / 33 * 100%);
		}
		.dib {
			display: inline-block;
		}
	}
	@media (min-width: 481px) {
		white-space: nowrap;
	}
	@media (max-width: 480px) {
		margin-bottom: 20px;
		padding-bottom: 10px;
		font-size: 24px;
		line-height: 1.3;
		&::after {
			height: 3px;
		}
		.ff_en {
			left: 10px;
			transform-origin: 0 100%;
			transform: scale(.6);
		}
		.title {
			padding-left: 30px;
			.s {
				display: block;
			}
			&.sp-long {
				padding-left: 50px;
			}
		}
	}
}

#webopencampus .rikejo_pickup {
	padding: 60px 0 60px;
	background-color: #fff;
}
#webopencampus .rikejo_pickup h4 {
	margin-bottom: 40px;
	text-align: center;
	color: #36cbf8;
	border-bottom: 3px solid;
	border-right: 3px solid;
	font-size: 34px;
	letter-spacing: 0.05em;
}
#webopencampus .rikejo_pickup h4 span {
	font-size: 75%;
}
#webopencampus .rikejo_pickup .persons {
	margin-bottom: 60px;
}
#webopencampus .rikejo_pickup .person {
	display: flex;
	line-height: 1.5;
}
#webopencampus .rikejo_pickup .person .ph {
	width: 225px;
	flex-shrink: 0;
	margin-right: 25px;
}
#webopencampus .rikejo_pickup .person .content {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
#webopencampus .rikejo_pickup .person .link {
	margin-top: auto;
}
#webopencampus .rikejo_pickup .person .link a {
	display: block;
	padding: 10px 15px;
	background-color: #36cbf8;
	color: #fff;
	font-size: 18px;
	line-height: 1.4;
	font-weight: 700;
	text-decoration: none;
}

@media (min-width: 481px) {
	#webopencampus .rikejo_pickup .persons {
		display: flex;
		gap: 40px;
		flex-wrap: wrap;
	}
	#webopencampus .rikejo_pickup .person {
		width: calc((100% - 40px) / 2);
	}
}
@media (max-width: 480px) {
	#webopencampus .rikejo_pickup {
		padding: 40px 0 30px;
	}
	#webopencampus .rikejo_pickup h4 {
		margin-bottom: 20px;
		border-bottom: 2px solid;
		border-right: 2px solid;
		font-size: 22px;
	}
	#webopencampus .rikejo_pickup .persons {
		margin-bottom: 30px;
	}
	#webopencampus .rikejo_pickup .person {
		margin-bottom: 20px;
	}
	#webopencampus .rikejo_pickup .person .ph {
		width: 140px;
		flex-shrink: 0;
		margin-right: 20px;
	}
	#webopencampus .rikejo_pickup .person .link a {
		font-size: 13px;
	}
}


/* fukidashi_block
============================================================================================================ */
#learning {
	--fukidashi-color: #46dca0;
}
#life {
	--fukidashi-color: #ff00f9;
}
#exam {
	--fukidashi-color: #00cfff;
}
#employment {
	--fukidashi-color: #db7249;
}
#consultation {
	--fukidashi-color: #46dca0;
}

#webopencampus .fukidashi_block {
	max-width: 840px;
	margin: 50px auto 0;
	padding-bottom: 60px;
	text-align: left;
}
#webopencampus .fukidashi_block > * {
	position: relative;
	max-width: 540px;
}
#webopencampus .fukidashi_block > * + * {
	margin-top: 25px;
}
#webopencampus .fukidashi_block dt {
	overflow: hidden;
	position: absolute;
	top: 0;
	border-radius: 100%;
	width: 116px;
}
#webopencampus .fukidashi_block dt img {
	width: 100%;
}
#webopencampus .fukidashi_block dd {
	position: relative;
	padding: 20px 30px;
	background-color: #fff;
	border-radius: 10px;
	color: #000;
}
#webopencampus .fukidashi_block dd::before {
	content: "";
	position: absolute;
	left: 3px;
	top: 3px;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	background-color: #ff0;
	z-index: -1;
}
#webopencampus .fukidashi_block dd::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: 10px;
	background-color: #fff;
	z-index: -1;
}
#webopencampus .fukidashi_block dd .arrow {
	position: absolute;
	top: 24px;
	width: 28px;
	height: 34px;
	z-index: -1;
}
#webopencampus .fukidashi_block dd .arrow::before,
#webopencampus .fukidashi_block dd .arrow::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
}
#webopencampus .fukidashi_block dd .arrow::before {
	left: 3px;
	top: 3px;
	opacity: 0.75;
}
#webopencampus .fukidashi_block .l {
	padding-left: 122px;
}
#webopencampus .fukidashi_block .l dt {
	left: -28px;
}
#webopencampus .fukidashi_block .l dd .arrow {
	right: calc(100% - 2px);
}
#webopencampus .fukidashi_block .l dd .arrow::before,
#webopencampus .fukidashi_block .l dd .arrow::after {
	clip-path: polygon(0 50%, 100% 0, 100% 100%);
}
#webopencampus .fukidashi_block .l dd .arrow::before {
	top: 5px;
	background: var(--fukidashi-color);
}
#webopencampus .fukidashi_block .l dd::before {
	background: var(--fukidashi-color);
}
#webopencampus .fukidashi_block .r {
	margin-left: auto;
	padding-right: 122px;
}
#webopencampus .fukidashi_block .r dt {
	right: -28px;
}
#webopencampus .fukidashi_block .r dd .arrow {
	left: calc(100% - 2px);
}
#webopencampus .fukidashi_block .r dd .arrow::before,
#webopencampus .fukidashi_block .r dd .arrow::after {
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
#webopencampus .fukidashi_block .r dd .arrow::before {
	left: 2px;
	background: var(--fukidashi-color);
}
#webopencampus .fukidashi_block .r dd::before {
	background: var(--fukidashi-color);
}
#webopencampus .fukidashi_block .course_btn {
	display: block;
	margin-top: 8px;
	text-align: center;
	color: #000;
	background-color: #f0e221;
	text-decoration: none;
	font-weight: bold;
}
#webopencampus .fukidashi_block.yellow dd {
	background-color: #f0e221;
}
#webopencampus .fukidashi_block.yellow dd::before {
	border-right-color: #f0e221;
}
#webopencampus .fukidashi_block dd.second {
	left: 245px;
	margin-top: -30px;
	border: 2px solid #fff;
}
@media (min-width: 481px) {
	#webopencampus .fukidashi_block .course_btn:hover {
		background-color: #000;
		color: #fff;
	}
}
@media (max-width: 480px) {
	#webopencampus .fukidashi_block {
		margin-top: 30px;
		padding-bottom: 30px;
	}
	#webopencampus .fukidashi_block > * + * {
		margin-top: 15px;
	}
	#webopencampus .fukidashi_block > * {
		max-width: 95%;
	}
	#webopencampus .fukidashi_block dt {
		width: 58px;
	}
	#webopencampus .fukidashi_block dd {
		padding: 10px 15px;
	}
	#webopencampus .fukidashi_block dd .arrow {
		top: 17px;
		width: 14px;
		height: 17px;
	}
	#webopencampus .fukidashi_block .l {
		padding-left: 60px;
	}
	#webopencampus .fukidashi_block .l dt {
		left: -10px;
	}
	#webopencampus .fukidashi_block .r {
		padding-right: 60px;
	}
	#webopencampus .fukidashi_block .r dt {
		right: -10px;
	}
	#webopencampus .fukidashi_block dd.second {
		left: 6vw;
		margin-top: -5px;
	}
}

/* learning-map
============================================================================================================ */
#webopencampus .learning-map {
	max-width: 1200px;
	margin-inline: auto;
	margin-top: 30px;
	padding-bottom: 30px;
	@media (max-width: 480px) {
		margin-top: 10px;
		padding-bottom: 20px;
	}
}
.pswp__bg {
	background: #ffff56;
}
.pswp__img {
	image-rendering: auto;
	backface-visibility: hidden;
	transform: translateZ(0);
	background: rgba(255, 255, 86, 0.8);
}

/* learning_course_list
============================================================================================================ */
#webopencampus .learning_course_list {
	position: relative;
	z-index: 5;
}
#webopencampus .learning_course_list .plearning_course_title {
	margin-bottom: 25px;
	padding: 3px;
	background-color: #0069aa;
	color: #fff;
	font-weight: 700;
	font-size: 24px;
	text-align: center;
}
#webopencampus .learning_course_list section {
	position: relative;
	padding-bottom: 40px;
	text-align: center;
	font-size: 18px;
	line-height: 1.6;
	z-index: 2;
}
#webopencampus .learning_course_list section h4 {
	margin-bottom: 15px;
	text-align: center;
	font-size: 28px;
	letter-spacing: 0.1em;
}
#webopencampus .learning_course_list section h4 a {
	display: block;
	background-color: #fff;
}
#webopencampus .learning_course_list .chikyu h4 a {
	border: 1px solid #44af35;
	color: #44af35;
}
#webopencampus .learning_course_list .tiiki h4 a {
	border: 1px solid #ef8200;
	color: #ef8200;
}
#webopencampus .learning_course_list section li {
	margin-top: 20px;
}
#webopencampus .learning_course_list section ul a,
#webopencampus .learning_course_list .tiiki-c h4 a {
	display: block;
	color: #fff;
	padding: 8px 0;
	text-decoration: none;
	font-size: 20px;
}
#webopencampus .learning_course_list .chikyu ul a {
	background-color: #44af35;
}
#webopencampus .learning_course_list .tiiki ul a {
	background-color: #ef8200;
}
#webopencampus .learning_course_list .tiiki-c h4 a {
	background-color: #efff00;
	color: #000;
}
#webopencampus .learning_course_list .notes {
	margin-top: 25px;
	font-size: 16px;
}
@media (min-width: 481px) {
	#webopencampus .learning_course_list {
		display: flex;
		flex-wrap: wrap;
		gap: 0 30px;
	}
	#webopencampus .learning_course_list section {
		width: calc(50% - 15px);
	}
	#webopencampus .learning_course_list .plearning_course_title,
	#webopencampus .learning_course_list .tiiki-c {
		width: 100%;
	}
}
@media (max-width: 480px) {
	#webopencampus .learning_course_list section {
		padding-bottom: 30px;
		font-size: 12px;
	}
	#webopencampus .learning_course_list .plearning_course_title {
		font-size: 20px;
	}
	#webopencampus .learning_course_list section h4 {
		margin-bottom: 12px;
		font-size: 22px;
	}
	#webopencampus .learning_course_list section ul {
		margin-top: 20px;
	}
	#webopencampus .learning_course_list section li {
		margin-top: 10px;
	}
	#webopencampus .learning_course_list section ul a,
	#webopencampus .learning_course_list .tiiki-c h4 a {
		font-size: 15px;
	}
	#webopencampus .learning_course_list .notes {
		margin-top: 20px;
		font-size: 10px;
		text-align: left;
	}
}


/* box_btn
============================================================================================================ */
#webopencampus .more_btn {
	margin-top: 50px;
}
#webopencampus .box_btn {
	max-width: 980px;
	display: block;
	margin-inline: auto;
	background-color: var(--color);
	color: #fff;
	font-weight: 700;
	padding: 50px;
	text-align: center;
	font-size: 34px;
	line-height: 1.5;
	text-decoration: underline;
	letter-spacing: 0.1em;
}
#webopencampus .box_btn:hover {
	text-decoration: none;
}
@media (max-width: 480px) {
	#webopencampus .more_btn {
		margin-top: 30px;
	}
	#webopencampus .box_btn {
		padding: 30px;
		font-size: 20px;
	}
}

/* new_course
============================================================================================================ */
#webopencampus .new_course {
	position: relative;
	overflow: hidden;
	margin-top: 50px;
	padding: 60px 0 80px;
	background: linear-gradient(to bottom,  #ffffff 0%,#80c8ba 50%,#ffffff 100%);
	z-index: 5;
	.innre_box {
		width: 1280px;
		padding: 60px 0 80px;
		background-color: #fff;
		border: 10px solid #8ca4b1;
		border-radius: 40px;
		box-shadow: 10px 10px 10px rgba(0,0,0,.2), 10px 10px 10px rgba(0,0,0,.2) inset;
	}
	h4 {
		position: relative;
		max-width: 1140px;
		margin-inline: auto;
	}
	.title_lead {
		margin-top: -50px;
		max-width: 1140px;
		margin-inline: auto;
		padding-left: 220px;
	}
	.year_sec {
		position: relative;
		padding-top: 120px;
		& + .year_sec {
			margin-top: 30px;
			&::before {
				content: "";
				position: absolute;
				left: 105px;
				top: 10px;
				width: 74px;
				height: 64px;
				background-color: #dadf00;
				clip-path: polygon(0 0, 100% 0, 50% 100%);
			}
		}
		header {
			position: relative;
			margin-bottom: 20px;
			margin-left: 50px;
			.year {
				position: relative;
				width: 180px;
				z-index: 3;
				.box {
					display: block;
					margin-top: 20px;
					margin-left: -30px;
					margin-right: -20px;
					text-align: center;
					white-space: nowrap;
					font-weight: 700;
					font-size: 28px;
					line-height: 1.2;
				}
			}
			h5 {
				position: relative;
				font-size: 60px;
				line-height: 1.1;
				letter-spacing: 0.1em;
				z-index: 2;
				.box {
					display: flex;
					justify-content: center;
					align-items: center;
					width: 155px;
					height: 46px;
					margin-right: 20px;
					background-color: #fff;
					color: #000;
					font-size: 32px;
					line-height: 1.2;
				}
				.txt {
					position: relative;
					display: block;
					padding: 12px 20px 14px;
					width: fit-content;
					color: #fff;
					&::before {
						content: "";
						position: absolute;
						inset: 0;
						background-color: #8ca4b1;
						z-index: -1;
					}
					& + .txt {
						margin-top: -25px;
					}
				}
			}
			.ico {
				position: absolute;
				width: 180px;
				top: -10px;
				left: 220px;
			}
			.sub {
				margin-top: 10px;
				margin-left: 10px;
				font-size: 30px;
				font-weight: 600;
				line-height: 1.3;
			}
		}
		.desc {
			margin-inline: 60px;
		}
		.illust {
			position: absolute;
			right: 15px;
			top: 0;
			pointer-events: none;
			z-index: 2;
		}
		.y2_list {
			position: relative;
			margin-top: 80px;
			margin-inline: 55px;
			padding: 30px;
			padding-top: 40px;
			background-color: #fff;
			border: 2px solid #8ca4b1;
			border-radius: 16px;
			&::before {
				content: "";
				position: absolute;
				left: 40px;
				bottom: 100%;
				width: 36px;
				height: 30px;
				background-color: #8ca4b1;
				clip-path: polygon(50% 0%, 100% 100%, 0 100%);
			}
			section {
				position: relative;
				padding-left: 120px;
				&:not(:last-child) {
					border-bottom: 2px solid #8ca4b1;
					margin-bottom: 30px;
					padding-bottom: 30px;
				}
				.ico {
					position: absolute;
					top: 0;
					left: 0;
					width: 100px;
				}
				h5 {
					margin-bottom: 10px;
					font-size: 32px;
					line-height: 1.5;
					width: fit-content;
					padding-right: 70px;
					background: no-repeat 100% 60%;
					background-size: 62px;
				}
				&.b1 h5 {
					background-image: url(../img/2026/new_2_arrow1.svg);
					color: #009fe8;
				}
				&.b2 h5 {
					background-image: url(../img/2026/new_2_arrow2.svg);
					color: #f39a16;
				}
				&.b3 h5 {
					background-image: url(../img/2026/new_2_arrow3.svg);
					color: #44af35;
				}
				&.b4 h5 {
					background-image: url(../img/2026/new_2_arrow4.svg);
					color: #e51f83;
				}
			}
		}
		.y3_list {
			position: relative;
			margin-top: 40px;
			margin-inline: 55px;
			padding: 50px;
			border: 2px solid #8ca4b1;
			border-radius: 16px;
			display: flex;
			flex-wrap: wrap;
			gap: 50px 0;
			justify-content: space-between;
			&::before {
				content: "";
				position: absolute;
				left: 40px;
				bottom: 100%;
				width: 36px;
				height: 30px;
				background-color: #8ca4b1;
				clip-path: polygon(50% 0%, 100% 100%, 0 100%);
			}
			section {
				width: 496px;
				background-color: rgba(255,255,255,.34);
				border-radius: 0 0 26px 26px;
				h5 {
					padding: 5px;
					text-align: center;
					color: #fff;
					font-size: 38px;
				}
				&.u1 h5 {
					background-color: #009fe8;
				}
				&.u2 h5 {
					background-color: #44af35;
				}
				&.u3 h5 {
					background-color: #f39a16;
				}
				&.u4 h5 {
					background-color: #e51f83;
				}
				&.u5 h5 {
					background: linear-gradient(to right, #009fe8 0%, #91b682 16%, #f39a16 32%, #aece1b 50%, #44af35 68%, #bb85b8 84%, #e51f83 100%);
				}
				ul {
					display: flex;
					justify-content: center;
					text-align: center;
					gap: 20px;
					padding: 20px 0 40px;
					a {
						color: #000;
					}
					img {
						display: block;
						margin-inline: auto;
						width: 200px;
					}
					.name {
						display: block;
						font-weight: 700;
						font-size: 26px;
						line-height: 1.3;
					}
					@media (hover) {
						img {
							transition: opacity 0.2s ease-in-out;
						}
						a:hover img {
							opacity: 0.5;
						}
					}
				}
				&.-wide {
					width: 100%;
					li {
						width: 40%;
					}
				}
			}
		}

		&.y1 {
			header {
				h5 {
					display: flex;
					align-items: center;
					padding-left: 15px;
					margin-top: 20px;
					.txt::before {
						left: auto;
						width: 999em;
					}
				}
			}
			.illust {
				top: 100px;
			}
		}
		&.y2 {
			header {
				padding-left: 200px;
				padding-top: 60px;
				.year {
					position: absolute;
					left: 0;
					top: 0;
				}
				h5 {
					.txt:nth-child(2) {
						&::before {
							right: auto;
							width: 999em;
						}
					}
				}
			}
			.illust {
				top: -10px;
			}
		}
		&.y3 {
			header {
				padding-left: 200px;
				padding-top: 40px;
				.year {
					position: absolute;
					left: 0;
					top: 0;
				}
				h5 {
					.txt:nth-child(2) {
						&::before {
							right: auto;
							width: 999em;
						}
					}
				}
			}
			.illust {
				top: 10px;
				right: 25px;
			}
		}
		&.y4 {
			header {
				h5 {
					display: flex;
					align-items: center;
					padding-left: 15px;
					margin-top: 10px;
					.box {
						letter-spacing: 0;
					}
					.txt {
						padding-right: 80px;
						&::before {
							left: auto;
							width: 999em;
						}
					}
				}
			}
			.illust {
				top: 20px;
				right: 60px;
			}
		}
	}
	@media (max-width: 480px) {
		margin-top: 30px;
		padding: 0 0 10px;
		background: none;
		.innre_box {
			width: auto;
			padding: 20px 5vw 30px;
			border-width: 5px;
			border-radius: 20px;
			box-shadow: 5px 5px 5px rgba(0,0,0,.2), 5px 5px 5px rgba(0,0,0,.2) inset;
		}
		.title_lead {
			margin-top: 20px;
			padding-left: 0;
		}
		.year_sec {
			margin-top: 40px;
			padding-top: 0;
			& + .year_sec {
				margin-top: 70px;
				&::before {
					left: 15px;
					top: -40px;
					width: 38px;
					height: 32px;
				}
			}
			header {
				margin-bottom: 20px;
				margin-left: 0;
				.year {
					width: 90px;
					.box {
						margin-top: 10px;
						font-size: 16px;
					}
				}
				h5 {
					margin-right: -4vw;
					font-size: 24px;
					letter-spacing: 0.1em;
					.box {
						width: 90px;
						height: 30px;
						margin-right: 0;
						font-size: 16px;
					}
					.txt {
						padding: 10px 15px 12px;
						& + .txt {
							margin-top: -15px;
						}
					}
				}
				.ico {
					width: 90px;
					top: -5px;
					left: 100px;
				}
				.sub {
					margin-top: 10px;
					margin-left: 5px;
					font-size: 18px;
				}
			}
			.desc {
				margin-inline: 0;
			}
			.illust {
				position: static;
				margin: 10px -3vw 0;
				text-align: center;
				/* img {
					width: auto;
					height: 195px;
				} */
			}
			.y2_list {
				margin-top: 30px;
				margin-inline: -2vw;
				padding: 20px;
				padding-top: 30px;
				&::before {
					left: 20px;
					width: 24px;
					height: 20px;
				}
				section {
					padding-left: 0;
					&:not(:last-child) {
						margin-bottom: 20px;
						padding-bottom: 20px;
					}
					.ico {
						width: 40px;
					}
					h5 {
						display: flex;
						align-items: center;
						white-space: nowrap;
						height: 40px;
						margin-left: 50px;
						margin-bottom: 10px;
						font-size: 18px;
						line-height: 1.3;
						width: fit-content;
						padding-right: 35px;
						background-size: 31px;
						background-position: 100%;
					}
				}
			}
			.y3_list {
				margin-top: 30px;
				margin-inline: -2vw;
				margin-bottom: 15px;
				padding: 20px;
				padding-top: 30px;
				display: block;
				&::before {
					left: 20px;
					width: 24px;
					height: 20px;
				}
				section {
					width: auto;
					& + section{
						margin-top: 15px;
					}
					h5 {
						font-size: 20px;
					}
					ul {
						gap: 20px;
						padding: 10px 0 20px;
						img {
							width: 100px;
						}
						.name {
							font-size: 14px;
						}
					}
					&.-wide {
						li {
							width: auto;
						}
					}
				}
			}

			&.y1 {
				header {
					h5 {
						padding-left: 0;
						margin-top: 10px;
						.txt::before {
							left: auto;
							width: 999em;
						}
					}
				}
			}
			&.y2 {
				margin-top: 40px;
				header {
					padding-left: 100px;
					padding-top: 20px;
				}
			}
			&.y3 {
				header {
					padding-left: 100px;
					padding-top: 20px;
				}
			}
			&.y4 {
				header {
					h5 {
						padding-left: 0;
						margin-top: 10px;
						.txt {
							padding-right: 20px;
							&::before {
								left: auto;
								width: 999em;
							}
						}
					}
				}
			}
		}
	}
}


/* learning_keyword
============================================================================================================ */
#webopencampus .learning_keyword {
	position: relative;
	margin-top: 60px;
	padding: 120px 0 120px;
	background-color: #fff;
}
#webopencampus .learning_keyword > * {
	position: relative;
	z-index: 5;
}
#webopencampus .learning_keyword::before,
#webopencampus .learning_keyword::after {
	--border-w: 24px;
	content: "";
	position: absolute;
	right: -1000px;
	left: -1000px;
	max-width: 1280px;
	width: calc(100% - 60px);
	height: 60px;
	margin: 0 auto;
	border: var(--border-w) solid #dbe0db;
	box-sizing: border-box;
}
#webopencampus .learning_keyword::before {
	top: 56px;
	border-bottom-width: 0;
}
#webopencampus .learning_keyword::after {
	bottom: 56px;
	border-top-width: 0;
}
#webopencampus .learning_keyword .fukidashi_block {
	margin-top: 0;
}
#webopencampus .learning_keyword h4 {
	margin-bottom: 30px;
	font-size: 44px;
	line-height: 1.3;
	text-align: center;
	color: #0069aa;
}
#webopencampus .learning_keyword .keyword_cloud {
	position: relative;
	width: 1100px;
	height: 660px;
	margin: auto;
}
#webopencampus .learning_keyword .keyword_cloud a {
	position: absolute;
	line-height: 1.2;
	text-align: center;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	-webkit-animation: mowamowa 1s ease-in-out 0s infinite alternate;
	animation: mowamowa 1s ease-in-out 0s infinite alternate;
}
@-webkit-keyframes mowamowa {
	0% {-webkit-transform: scale(.92);}
	100% {-webkit-transform: scale(1);}
}
@keyframes mowamowa {
	0% {transform: scale(.98);}
	100% {transform: scale(1);}
}
#webopencampus .learning_keyword .keyword_cloud a span {
	display: block;
	font-size: 66.6%;
}
#webopencampus .learning_keyword .keyword_cloud a.type1 {
	color: #36BDEF;
}
#webopencampus .learning_keyword .keyword_cloud a.type2 {
	color: #EC6D45;
}
#webopencampus .learning_keyword .keyword_cloud a.type3 {
	color: #0085CD;
}
#webopencampus .learning_keyword .keyword_cloud a.type4 {
	color: #8F70AE;
}
#webopencampus .learning_keyword .keyword_cloud a.type5 {
	color: #008D4D;
}
#webopencampus .learning_keyword .keyword_cloud a.type6 {
	color: #8DC21F;
}
#webopencampus .learning_keyword .keyword_cloud a.type7 {
	color: #8D8D8D;
}
#webopencampus .learning_keyword .keyword_cloud a.text01 {top: 10px; left: 150px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text02 {top: 5px; left: 455px; font-size: 17px;}
#webopencampus .learning_keyword .keyword_cloud a.text03 {top: 16px; left: 717px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text04 {top: 26px; left: 892px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text05 {top: 48px; left: 34px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text06 {top: 48px; left: 250px; font-size: 46px;}
#webopencampus .learning_keyword .keyword_cloud a.text07 {top: 51px; left: 630px; font-size: 20px;}
#webopencampus .learning_keyword .keyword_cloud a.text08 {top: 51px; left: 704px; font-size: 20px;}
#webopencampus .learning_keyword .keyword_cloud a.text09 {top: 60px; left: 950px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text10 {top: 85px; left: 0; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text11 {top: 80px; left: 126px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text12 {top: 235px; left: 11px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text13 {top: 114px; left: 348px; font-size: 19px;}
#webopencampus .learning_keyword .keyword_cloud a.text14 {top: 110px; left: 500px; font-size: 53px;}
#webopencampus .learning_keyword .keyword_cloud a.text15 {top: 94px; left: 626px; font-size: 50px;}
#webopencampus .learning_keyword .keyword_cloud a.text16 {top: 115px; left: 1001px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text17 {top: 194px; left: 0; font-size: 18px;}
#webopencampus .learning_keyword .keyword_cloud a.text18 {top: 203px; left: 85px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text19 {top: 140px; left: 456px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text20 {top: 450px; left: 1020px; font-size: 26px;}
#webopencampus .learning_keyword .keyword_cloud a.text21 {top: 160px; left: 648px; font-size: 22px;}
#webopencampus .learning_keyword .keyword_cloud a.text22 {top: 155px; left: 860px; font-size: 46px;}
#webopencampus .learning_keyword .keyword_cloud a.text23 {top: 180px; left: 970px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text24 {top: 106px; left: 10px; font-size: 50px;}
#webopencampus .learning_keyword .keyword_cloud a.text25 {top: 442px; left: 170px; font-size: 42px;}
#webopencampus .learning_keyword .keyword_cloud a.text26 {top: 215px; left: 450px; font-size: 60px; font-feature-settings: "palt";}
#webopencampus .learning_keyword .keyword_cloud a.text27 {top: 203px; left: 800px; font-size: 24px;}
#webopencampus .learning_keyword .keyword_cloud a.text28 {top: 211px; left: 1030px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text29 {top: 216px; left: 860px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text30 {top: 246px; left: 814px; font-size: 20px;}
#webopencampus .learning_keyword .keyword_cloud a.text31 {top: 236px; left: 237px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text32 {top: 293px; left: 0; font-size: 25px;}
#webopencampus .learning_keyword .keyword_cloud a.text33 {top: 261px; left: 77px; font-size: 25px;}
#webopencampus .learning_keyword .keyword_cloud a.text34 {top: 276px; left: 295px; font-size: 18px;}
#webopencampus .learning_keyword .keyword_cloud a.text35 {top: 288px; left: 494px; font-size: 32px;}
#webopencampus .learning_keyword .keyword_cloud a.text36 {top: 565px; left: 443px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text37 {top: 292px; left: 578px; font-size: 19px;}
#webopencampus .learning_keyword .keyword_cloud a.text38 {top: 297px; left: 636px; font-size: 19px;}
#webopencampus .learning_keyword .keyword_cloud a.text39 {top: 325px; left: -29px; font-size: 53px;}
#webopencampus .learning_keyword .keyword_cloud a.text40 {top: 305px; left: 198px; font-size: 68px;}
#webopencampus .learning_keyword .keyword_cloud a.text41 {top: 332px; left: 485px; font-size: 35px;}
#webopencampus .learning_keyword .keyword_cloud a.text42 {top: 339px; left: 828px; font-size: 28px;}
#webopencampus .learning_keyword .keyword_cloud a.text43 {top: 411px; left: 40px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text44 {top: 387px; left: 239px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text45 {top: 415px; left: 275px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text46 {top: 409px; left: 375px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text47 {top: 402px; left: 500px; font-size: 21px;}
#webopencampus .learning_keyword .keyword_cloud a.text48 {top: 397px; left: 618px; font-size: 35px;}
#webopencampus .learning_keyword .keyword_cloud a.text49 {top: 376px; left: 1008px; font-size: 25px;}
#webopencampus .learning_keyword .keyword_cloud a.text50 {top: 446px; left: 0; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text51 {top: 235px; left: 130px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text52 {top: 451px; left: 468px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text53 {top: 451px; left: 687px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text54 {top: 443px; left: 872px; font-size: 30px;}
#webopencampus .learning_keyword .keyword_cloud a.text55 {top: 163px; left: 178px; font-size: 53px;}
#webopencampus .learning_keyword .keyword_cloud a.text56 {top: 490px; left: 50px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text57 {top: 505px; left: 166px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text58 {top: 497px; left: 290px; font-size: 46px;}
#webopencampus .learning_keyword .keyword_cloud a.text59 {top: 525px; left: 942px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text60 {top: 488px; left: 1050px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text61 {top: 540px; left: 100px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text62 {top: 481px; left: 630px; font-size: 38px;}
#webopencampus .learning_keyword .keyword_cloud a.text63 {top: 570px; left: 0; font-size: 20px;}
#webopencampus .learning_keyword .keyword_cloud a.text64 {top: 247px; left: 952px; font-size: 52px;}
#webopencampus .learning_keyword .keyword_cloud a.text65 {top: 549px; left: 722px; font-size: 20px;}
#webopencampus .learning_keyword .keyword_cloud a.text66 {top: 558px; left: 922px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text68 {top: 568px; left: 572px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text69 {top: 615px; left: 680px; font-size: 16px;}
#webopencampus .learning_keyword .keyword_cloud a.text70 {top: 595px; left: 243px; font-size: 30px;}
#webopencampus .learning_keyword .keyword_cloud a.text71 {top: 630px; left: 790px; font-size: 17px;}
#webopencampus .learning_keyword .keyword_cloud a.text72 {top: 10px; left: 20px; font-size: 17px;}
@media (min-width: 481px) {
	#webopencampus .learning_keyword .keyword_cloud a div {
		transition: transform .2s, opacity .2s;
	}
	#webopencampus .learning_keyword .keyword_cloud a.hover {
		animation-play-state: paused;
		z-index: 3;
	}
	#webopencampus .learning_keyword .keyword_cloud a.hover div {
		transform: scale(1.2);
	}
	#webopencampus .learning_keyword .keyword_cloud a.hide div {
		opacity: 0.3;
	}
}
@media (max-width: 480px) {
	#webopencampus .learning_keyword {
		margin-top: 20px;
		padding: 60px 0 50px;
	}
	#webopencampus .learning_keyword::before,
	#webopencampus .learning_keyword::after {
		--border-w: 12px;
		right: 2vw;
		left: 2vw;
		width: auto;
		height: 30px;
	}
	#webopencampus .learning_keyword::before {
		top: 25px;
	}
	#webopencampus .learning_keyword::after {
		bottom: 30px;
	}
	#webopencampus .learning_keyword h4 {
		margin-bottom: 30px;
		font-size: 22px;
	}
	#webopencampus .learning_keyword .keyword_cloud_wrap {
		position: relative;
		width: 353px;
		margin: auto;
	}
	#webopencampus .learning_keyword .keyword_cloud {
		height: 580px;
		transform-origin: 0 0;
		transform: scale(.7);
		font-feature-settings: "palt";
	}
	#webopencampus .learning_keyword .keyword_cloud a.text01 {top: -6px; left: 20px;}
	#webopencampus .learning_keyword .keyword_cloud a.text02 {top: -10px; left: 263px;}
	#webopencampus .learning_keyword .keyword_cloud a.text03 {top: 13px; left: 451px;}
	#webopencampus .learning_keyword .keyword_cloud a.text04 {top: 634px; left: 212px;}
	#webopencampus .learning_keyword .keyword_cloud a.text05 {top: 60px; left: 6px;}
	#webopencampus .learning_keyword .keyword_cloud a.text06 {top: 36px; left: 180px;}
	#webopencampus .learning_keyword .keyword_cloud a.text07 {top: 11px; left: 190px;}
	#webopencampus .learning_keyword .keyword_cloud a.text08 {top: 14px; left: 250px;}
	#webopencampus .learning_keyword .keyword_cloud a.text09 {top: 647px; left: 410px;}
	#webopencampus .learning_keyword .keyword_cloud a.text11 {top: 95px; left: 90px;}
	#webopencampus .learning_keyword .keyword_cloud a.text12 {top: 210px; left: -5px;}
	#webopencampus .learning_keyword .keyword_cloud a.text13 {top: 95px; left: 248px;}
	#webopencampus .learning_keyword .keyword_cloud a.text14 {top: 90px; left: 400px;}
	#webopencampus .learning_keyword .keyword_cloud a.text15 {top: 694px; left: 0px;}
	#webopencampus .learning_keyword .keyword_cloud a.text16 {top: 122px; left: 291px;}
	#webopencampus .learning_keyword .keyword_cloud a.text17 {top: 210px; left: 110px;}
	#webopencampus .learning_keyword .keyword_cloud a.text18 {top: 191px; left: 195px;}
	#webopencampus .learning_keyword .keyword_cloud a.text19 {top: 180px; left: 146px;}
	#webopencampus .learning_keyword .keyword_cloud a.text20 {top: 195px; left: 290px;}
	#webopencampus .learning_keyword .keyword_cloud a.text21 {top: 155px; left: 358px;}
	#webopencampus .learning_keyword .keyword_cloud a.text22 {top: 180px; left: 365px;}
	#webopencampus .learning_keyword .keyword_cloud a.text23 {top: 185px; left: 10px;}
	#webopencampus .learning_keyword .keyword_cloud a.text24 {top: 116px; left: -10px; font-size: 45px;}
	#webopencampus .learning_keyword .keyword_cloud a.text25 {top: 460px; left: 248px; font-size: 32px;}
	#webopencampus .learning_keyword .keyword_cloud a.text26 {top: 234px; left: 0px; font-size: 30px;}
	#webopencampus .learning_keyword .keyword_cloud a.text27 {top: 243px; left: 450px;}
	#webopencampus .learning_keyword .keyword_cloud a.text28 {top: 161px; left: 288px;}
	#webopencampus .learning_keyword .keyword_cloud a.text29 {top: 730px; left: 360px;}
	#webopencampus .learning_keyword .keyword_cloud a.text30 {top: 274px; left: 424px;}
	#webopencampus .learning_keyword .keyword_cloud a.text31 {top: 246px; left: 265px;}
	#webopencampus .learning_keyword .keyword_cloud a.text32 {top: 304px; left: -10px;}
	#webopencampus .learning_keyword .keyword_cloud a.text33 {top: 270px; left: 77px;}
	#webopencampus .learning_keyword .keyword_cloud a.text34 {top: 276px; left: 285px;}
	#webopencampus .learning_keyword .keyword_cloud a.text35 {top: 301px; left: 448px;}
	#webopencampus .learning_keyword .keyword_cloud a.text36 {top: 581px; left: 424px;}
	#webopencampus .learning_keyword .keyword_cloud a.text37 {top: 275px; left: 21px;}
	#webopencampus .learning_keyword .keyword_cloud a.text38 {top: 308px; left: 111px;}
	#webopencampus .learning_keyword .keyword_cloud a.text39 {top: 345px; left: -15px; font-size: 40px;}
	#webopencampus .learning_keyword .keyword_cloud a.text40 {top: 334px; left: 147px; font-size: 40px;}
	#webopencampus .learning_keyword .keyword_cloud a.text41 {top: 345px; left: 318px; font-size: 25px;}
	#webopencampus .learning_keyword .keyword_cloud a.text42 {top: 759px; left: 10px;}
	#webopencampus .learning_keyword .keyword_cloud a.text43 {top: 410px; left: 147px;}
	#webopencampus .learning_keyword .keyword_cloud a.text44 {top: 387px; left: 149px;}
	#webopencampus .learning_keyword .keyword_cloud a.text45 {top: 419px; left: 225px;}
	#webopencampus .learning_keyword .keyword_cloud a.text46 {top: 395px; left: 276px;}
	#webopencampus .learning_keyword .keyword_cloud a.text47 {top: 397px; left: 417px;}
	#webopencampus .learning_keyword .keyword_cloud a.text48 {top: 552px; left: -2px;}
	#webopencampus .learning_keyword .keyword_cloud a.text49 {top: 455px; left: 412px;}
	#webopencampus .learning_keyword .keyword_cloud a.text50 {top: 400px; left: 0;}
	#webopencampus .learning_keyword .keyword_cloud a.text51 {top: 243px; left: 166px;}
	#webopencampus .learning_keyword .keyword_cloud a.text52 {top: 425px; left: 338px;}
	#webopencampus .learning_keyword .keyword_cloud a.text53 {top: 669px; left: -3px;}
	#webopencampus .learning_keyword .keyword_cloud a.text54 {top: 17px; left: 42px;}
	#webopencampus .learning_keyword .keyword_cloud a.text55 {top: 429px; left: -10px; font-size: 39px;}
	#webopencampus .learning_keyword .keyword_cloud a.text56 {top: 500px; left: 0px;}
	#webopencampus .learning_keyword .keyword_cloud a.text57 {top: 505px; left: 97px;}
	#webopencampus .learning_keyword .keyword_cloud a.text58 {top: 497px; left: 240px;}
	#webopencampus .learning_keyword .keyword_cloud a.text59 {top: 555px; left: 357px;}
	#webopencampus .learning_keyword .keyword_cloud a.text60 {top: 477px; left: 14px;}
	#webopencampus .learning_keyword .keyword_cloud a.text61 {top: 699px; left: 338px;}
	#webopencampus .learning_keyword .keyword_cloud a.text62 {top: 528px; left: 5px; font-size: 20px;}
	#webopencampus .learning_keyword .keyword_cloud a.text63 {top: 768px; left: 310px;}
	#webopencampus .learning_keyword .keyword_cloud a.text64 {top: 302px; left: 387px; font-size: 20px;}
	#webopencampus .learning_keyword .keyword_cloud a.text65 {top: 595px; left: 205px;}
	#webopencampus .learning_keyword .keyword_cloud a.text66 {top: 605px; left: 22px;}
	#webopencampus .learning_keyword .keyword_cloud a.text68 {top: 613px; left: 372px;}
	#webopencampus .learning_keyword .keyword_cloud a.text69 {top: 489px; left: 172px;}
	#webopencampus .learning_keyword .keyword_cloud a.text70 {top: 663px; left: 162px;}
	#webopencampus .learning_keyword .keyword_cloud a.text71 {top: 637px; left: 10px;}
	#webopencampus .learning_keyword .keyword_cloud a.text72 {top: -20px; left: 170px;}
}

/* learning_keyword_result
============================================================================================================ */
#webopencampus .learning_keyword_result {
	overflow: hidden;
	position: relative;
	height: 0;
	transition: height .4s;
	margin-bottom: 80px;
	background: #fff;
	background-size: cover;
}
#webopencampus .learning_keyword_result.opend {
	height: auto;
}
#webopencampus .learning_keyword_result > * > .w {
	padding: 40px 0 80px;
	text-align: center;
}
#webopencampus .learning_keyword_result h4 {
	margin-bottom: 40px;
	font-size: 45px;
	color: #0069aa;
}
#webopencampus .learning_keyword_result .content li {
	width: 580px;
	margin: 15px auto 0;
	display: none;
}
#webopencampus .learning_keyword_result .content li.show {
	display: block;
}
#webopencampus .learning_keyword_result .content li a {
	display: block;
	color: #fff;
	padding: 5px 0 5px 60px;
	background-position: 10px;
	background-repeat: no-repeat;
	background-size: 60px;
	text-decoration: none;
	font-size: 30px;
	text-align: center;
	font-weight: 500;
}
#webopencampus .learning_keyword_result .content .unit1 a {
	background-color: #df752f;
	background-image: url(../img/2026/keyword_result_ico1.png);
}
#webopencampus .learning_keyword_result .content .unit2 a {
	background-color: #38b5aa;
	background-image: url(../img/2026/keyword_result_ico2.png);
}
#webopencampus .learning_keyword_result .content .unit3 a {
	background-color: #ba79b1;
	background-image: url(../img/2026/keyword_result_ico3.png);
}
#webopencampus .learning_keyword_result .content .unit4 a {
	background-color: #daad00;
	background-image: url(../img/2026/keyword_result_ico4.png);
}
#webopencampus .learning_keyword_result .content .unit5 a {
	background-color: #009ec6;
	background-image: url(../img/2026/keyword_result_ico5.png);
}
#webopencampus .learning_keyword_result .content .unit6 a {
	background-color: #009b63;
	background-image: url(../img/2026/keyword_result_ico6.png);
}
#webopencampus .learning_keyword_result .content .unit7 a {
	background-color: #da5283;
	background-image: url(../img/2026/keyword_result_ico7.png);
}
#webopencampus .learning_keyword_result .content .unit8 a {
	background-color: #fff100;
	background-image: url(../img/2026/keyword_result_ico8.png);
	color: #000;
}
#webopencampus .learning_keyword_result .content .unit9 a {
	background-color: #00c2ed;
	background-image: url(../img/2026/keyword_result_ico9.png);
}
@media (max-width: 480px) {
	#webopencampus .learning_keyword_result {
		margin-bottom: 40px;
	}
	#webopencampus .learning_keyword_result > * > .w {
		padding: 0 0 40px;
	}
	#webopencampus .learning_keyword_result h4 {
		margin-bottom: 20px;
		font-size: 22px;
		line-height: 1.5;
	}
	#webopencampus .learning_keyword_result .content li {
		margin-top: 10px;
		width: auto;
	}
	#webopencampus .learning_keyword_result .content li a {
		background-size: 40px;
		padding-left: 30px;
		font-size: 18px;
	}
}

/* learning_movie
============================================================================================================ */
#webopencampus .learning_movie {
	position: relative;
	padding: 24px 0 30px;
	background-color: #000;
	color: #fff;
	text-align: center;
	z-index: 5;
}
#webopencampus .learning_movie + .learning_movie {
	margin-top: 40px;
}

#webopencampus .learning_movie h5 {
	margin-bottom: 20px;
	font-size: 36px;
	line-height: 1.5;
	text-shadow: 0 0 20px #080059;
}
#webopencampus .learning_movie ul {
	display: flex;
	justify-content: center;
}
#webopencampus .learning_movie ul li {
	position: relative;
	padding: 0 10px;
}
#webopencampus .learning_movie ul li:after {
	position: absolute;
	content: "";
	display: block;
	top: 50%;
	left: 50%;
	width: 74px;
	height: 74px;
	transform: translate(-50%, -50%);
	background: url(../img/2026/play.svg) no-repeat 50%;
	background-size: 100%;
	pointer-events: none;
	z-index: 2;
}
#webopencampus .learning_movie ul li a {
	position: relative;
	display: block;
}
#webopencampus .learning_movie ul li img {
	max-width: 100%;
	height: auto;
}
#webopencampus .learning_movie .bg {
	pointer-events: none;
	user-select: none;
	z-index: -1;
}
@media (min-width: 481px) {
	#webopencampus .learning_movie ul {
		max-width: 1316px;
		margin: auto;
	}
	#webopencampus .learning_movie ul li {
		width: 25%;
	}
}
@media (max-width: 480px) {
	#webopencampus .learning_movie + .learning_movie {
		margin-top: 20px;
	}
	#webopencampus .learning_movie h5 {
		margin-bottom: 10px;
		font-size: 24px;
	}
	/* #webopencampus .learning_movie ul {
		flex-wrap: wrap;
		margin: 0 -5px;
	} */
	#webopencampus .learning_movie ul li {
		width: 60vw;
	}
	#webopencampus .learning_movie ul li:after {
		width: 50px;
		height: 50px;
	}
}


/* learning_bnr
============================================================================================================ */
#webopencampus .learning_bnr_search {
	margin-bottom: 80px;
}
#webopencampus .learning_bnr_search a {
	display: block;
	text-decoration: none;
	color: #fff;
	text-align: center;
}
#webopencampus .learning_bnr_search h4 {
	margin-bottom: 5px;
	font-size: 29px;
	line-height: 1.5;
}
#webopencampus .learning_bnr_search .bnr {
	margin-top: 30px;
}
@media (min-width: 481px) {
	#webopencampus .learning_bnr_search {
		display: flex;
		justify-content: center;
	}
	#webopencampus .learning_bnr_search a:hover h4 {
		text-decoration: underline;
	}
}
@media (max-width: 480px) {
	#webopencampus .learning_bnr_search {
		margin-bottom: 40px;
	}
	#webopencampus .learning_bnr_search h4 {
		margin-bottom: 8px;
		font-size: 20px;
	}
	#webopencampus .learning_bnr_search .bnr {
		margin-top: 20px;
	}
}
#webopencampus .learning_bnr_kougi a {
	display: block;
	text-decoration: none;
	text-align: center;
}
#webopencampus .learning_bnr_kougi a .bnr {
	max-width: 494px;
	margin: 0 auto 20px;
}
#webopencampus .learning_bnr_kougi a img {
	max-width: 100%;
	height: auto;
}
@media (min-width: 481px) {
	#webopencampus .learning_bnr_kougi {
		display: flex;
		justify-content: center;
	}
}
@media (max-width: 480px) {
	#webopencampus .learning_bnr_kougi a .bnr {
		margin-bottom: 15px;
	}
}

/* international_student_interview_box
============================================================================================================ */
#webopencampus .international_student_interview_box {
	position: relative;
	margin-top: 60px;
	padding: 30px 60px 50px;
	background-color: #fff;
	h4 {
		text-align: center;
		border-bottom: 1px solid;
		font-size: 34px;
		line-height: 1.5;
		padding-bottom: 15px;
		margin-bottom: 15px;
		letter-spacing: 0.1em;
	}
	.name {
		text-align: center;
		font-size: 21px;
		line-height: 1.5;
		letter-spacing: 0.1em;
		font-weight: 500;
		.l {
			font-size: calc(31 / 21 * 100%);
		}
		.s {
			font-size: calc(18 / 21 * 100%);
		}
	}
	.meta {
		display: flex;
		justify-content: center;
		gap: 20px;
		margin-block: 10px 20px;
		font-weight: 700;
		font-size: 24px;
		li {
			position: relative;
			padding-left: 24px;
			&::before {
				content: "";
				position: absolute;
				left: 0;
				top: 0;
				bottom: 0;
				width: 16px;
				height: 24px;
				margin-block: auto;
				background-color: #ffd900;
				clip-path: polygon(0 0, 100% 50%, 0 100%);
			}
			.s {
				font-weight: 400;
				font-size: 18px;
			}
		}
	}
	.txt {
		text-indent: 1em;
	}
	@media (min-width: 481px) {
		.content {
			display: flex;
			flex-direction: row-reverse;
			gap: 40px;
		}
		.txt {
			flex-grow: 1;
			font-size: 19px;
			line-height: 1.75;
		}
		.ph {
			width: 300px;
			flex-shrink: 0;
			display: flex;
			flex-direction: column;
			gap: 24px;
		}
	}
	@media (max-width: 480px) {
		position: relative;
		margin-top: 30px;
		padding: 20px 5vw 30px;
		h4 {
			font-size: 20px;
			padding-bottom: 10px;
			margin-bottom: 10px;
		}
		.name {
			font-size: 16px;
			line-height: 1.4;
		}
		.meta {
			flex-direction: column;
			gap: 0;
			align-items: center;
			font-size: 16px;
			li {
				padding-left: 20px;
				&::before {
					width: 12px;
					height: 18px;
				}
				.s {
					font-size: 12px;
				}
			}
		}
		.ph {
			margin-bottom: 20px;
			display: flex;
			gap: 5px;
		}
	}
}


/* life_slide_section
============================================================================================================ */
#webopencampus .life_slide_section {
	position: relative;
	max-width: 980px;
	text-align: center;
}
#webopencampus .life_slide_section h3 {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	margin-bottom: 30px;
	color: #000;
	font-size: 23px;
	line-height: 1;
}
#webopencampus .life_slide_section h3 .ff_en {
	margin-right: 20px;
	color: #fff;
	font-size: 66px;
	line-height: 0.6;
}
#webopencampus .life_slide_section .slide {
	overflow: hidden;
	position: relative;
	margin-top: 25px;
	border-radius: 30px;
	background-color: #fff;
}
@media (max-width: 480px) {
	#webopencampus .life_slide_section h3 {
		display: block;
		margin-bottom: 15px;
		font-size: 16px;
	}
	#webopencampus .life_slide_section h3 .ff_en {
		display: block;
		margin: 0 0 15px;
		font-size: 40px;
	}
	#webopencampus .life_slide_section .slide {
		margin-top: 15px;
		border-radius: 15px;
	}
	#webopencampus .life_slide_section p {
		text-align: left;
	}
}

/* student_interview
============================================================================================================ */
#webopencampus .student_interview {
	max-width: 980px;
	margin-top: 130px;
	margin-bottom: 200px;
	header {
		margin-bottom: 40px;
		text-align: center;
		.en {
			position: relative;
			overflow: hidden;
			margin-bottom: 15px;
			background-color: #fff;
			color: #d994da;
			font-size: 43px;
			font-weight: 600;
			letter-spacing: 0.05em;
			&::before,
			&::after {
				content: "";
				position: absolute;
				height: 110%;
				width: 104px;
			}
			&::before {
				left: 0;
				top: 0;
				transform-origin: 100% 0;
				transform: skewX(-20deg);
				background: linear-gradient(to right, #00a5cb 49%,#8bbe68 49%,#8bbe68 66%,#db748d 66%,#db748d 83%,#e8a548 83%);
			}
			&::after {
				right: 0;
				bottom: 0;
				transform-origin: 0 100%;
				transform: skewX(-20deg);
				background: linear-gradient(to right, #00a5cb 17%,#8bbe68 17%,#8bbe68 34%,#db748d 34%,#db748d 51%,#e8a548 51%);
			}
		}
		h3 {
			color: #fff;
			font-size: 28px;
			letter-spacing: 0.1em;
			line-height: 1.5;
			font-weight: 600;
		}
	}
	.bnrs {
		display: flex;
		justify-content: space-between;
		section {
			width: 302px;
			&.-interview1 {
				--color: #c186b9;
			}
			&.-interview2 {
				--color: #ddab26;
			}
			&.-interview3 {
				--color: #33af82;
			}
			a {
				position: relative;
				display: block;
				cursor: pointer;
				text-decoration: none;
				height: 100%;
				padding-bottom: 20px;
				background-color: #fff;
				box-shadow: 4px 4px 0 rgba(0,0,0,0.75);
				.num {
					position: absolute;
					right: 15px;
					bottom: 18px;
					width: 75px;
					height: 75px;
					display: flex;
					justify-content: center;
					align-items: center;
					background-color: var(--color);
					border-radius: 100%;
					color: #fff;
					font-size: 38px;
					line-height: 1;
					font-weight: 600;
				}
				h4 {
					display: flex;
					flex-direction: column;
					gap: 4px;
					margin-top: -20px;
					margin-left: -1px;
					font-feature-settings: "palt";
					span {
						padding: 6px 20px;
						background-color: var(--color);
						font-size: 18px;
						line-height: 1.5;
						font-weight: 500;
						color: #fff;
						width: fit-content;
						letter-spacing: 0.1em;
					}
				}
				.name {
					margin-top: 50px;
					margin-left: 25px;
					line-height: 1;
					font-size: 32px;
					color: var(--color);
					letter-spacing: 0.1em;
					span {
						font-size: 50%;
					}
				}
			}
		}
	}
	@media (max-width: 480px) {
		margin-top: 60px;
		margin-bottom: 100px;
		header {
			margin-bottom: 20px;
			.en {
				margin-bottom: 10px;
				font-size: 20px;
				&::before,
				&::after {
					width: 52px;
				}
				&::before {
					left: -10px;
				}
				&::after {
					right: -10px;
				}
			}
			h3 {
				font-size: 18px;
			}
		}
		.bnrs {
			flex-wrap: wrap;
			gap: 10px 0;
			section {
				width: calc(50% - 5px);
				a {
					padding-bottom: 15px;
					.num {
						right: 10px;
						bottom: 10px;
						transform-origin: 100% 100%;
						transform: scale(.5);
					}
					h4 {
						gap: 2px;
						margin-top: -15px;
						margin-left: -2px;
						span {
							padding: 3px 12px;
							font-size: 12px;
						}
					}
					.name {
						margin-top: 20px;
						margin-left: 10px;
						font-size: 20px;
					}
				}
			}
		}
	}
}

.student_interview_modal_contents {
	position: relative;
	background-color: #fff;
	padding: 80px 40px 90px;
	line-height: 1.5;
	&.-interview1 {
		--color: #c186b9;
	}
	&.-interview2 {
		--color: #ddab26;
	}
	&.-interview3 {
		--color: #33af82;
	}
	img {
		max-width: 100%;
		height: auto;
	}
	.number {
		position: absolute;
		left: 60px;
		top: 20px;
		width: 198px;
		height: 198px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: var(--color);
		border-radius: 100%;
		font-size: 28px;
		font-weight: 600;
		line-height: 0.9;
		color: #fff;
		z-index: 2;
		.num {
			display: block;
			width: fit-content;
			margin-top: 10px;
			font-size: 38px;
			border-bottom: 2px solid;
		}
	}
	h4 {
		display: flex;
		flex-direction: column;
		gap: 8px;
		margin-top: -38px;
		font-feature-settings: "palt";
		&.r {
			align-items: end;
		}
		span {
			padding: 6px 20px;
			background-color: var(--color);
			font-size: 32px;
			line-height: 1.5;
			font-weight: 400;
			color: #fff;
			width: fit-content;
			letter-spacing: 0.1em;
		}
	}
	.name {
		margin-top: 20px;
		line-height: 1;
		font-size: 42px;
		color: var(--color);
		letter-spacing: 0.1em;
		span {
			font-size: 50%;
		}
	}
	.info {
		margin-top: 10px;
		line-height: 1.5;
		font-size: 16px;
		color: var(--color);
		letter-spacing: 0.1em;
	}
	.txt {
		margin-top: 20px;
	}
	@media (min-width: 481px) {
		font-size: 18px;
	}
	@media (max-width: 480px) {
		padding: 40px 15px 40px;
		.number {
			left: 25px;
			top: 10px;
			transform-origin: 0 0;
			transform: scale(.5);
		}
		h4 {
			gap: 4px;
			margin-top: -20px;
			span {
				padding: 6px 15px;
				background-color: var(--color);
				font-size: 18px;
			}
		}
		.name {
			margin-top: 20px;
			font-size: 22px;
		}
		.info {
			font-size: 12px;
		}
		.txt {
			margin-top: 20px;
		}
	}
}

.modaal-container:has(.student_interview_modal_contents) {
	max-width: 800px;
	@media (max-width: 480px) {
		max-width: calc(100vw - 20px);
	}
}
.modaal-wrapper .modaal-close {
	background-color: #000;
	border-radius: 100%;
}


/* life_faq
============================================================================================================ */
#webopencampus .life_faq {
	position: relative;
	margin-top: 50px;
	padding-bottom: 50px;
}
#webopencampus .life_faq .content dl {
	position: relative;
	height: 280px;
	color: #000;
	text-align: center;
	cursor: pointer;
}
#webopencampus .life_faq .content dl::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 5px;
	width: 100%;
	height: 100%;
	background: #d994da;
	z-index: -1;
}
#webopencampus .life_faq .content :where(dt, dd) {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 60px;
	background-color: #fff;
}
#webopencampus .life_faq .content :where(dt, dd)::before {
	position: absolute;
	right: 0;
	left: 0;
	top: 20px;
	font-size: 66px;
	line-height: 1;
	font-weight: bold;
	color: #d994da;
	text-align: center;
}
#webopencampus .life_faq .content dl > dt::before {
	content: "Q";
}
#webopencampus .life_faq .content dl > dd::before {
	content: "A";
}
#webopencampus .life_faq .content dt {
	font-size: 24px;
	line-height: 1.6;
	font-weight: bold;
}
#webopencampus .life_faq .content dd {
	opacity: 0;
	transition: opacity .3s;
	text-align: left;
	justify-content: start;
	align-items: start;
	padding-inline: 40px;
	padding-top: 120px;
	line-height: 1.5;
	z-index: 3;
}
#webopencampus .life_faq .content dd.-many {
	line-height: 1.3;
}
#webopencampus .life_faq .content .show dd {
	opacity: 1;
}
#webopencampus .life_faq .content dd .ico {
	position: absolute;
	top: 12px;
	width: 90px;
	border-radius: 100%;
}
#webopencampus .life_faq .content dd .ico.-l {
	left: 40px;
}
#webopencampus .life_faq .content dd .ico.-r {
	right: 40px;
}
@media (min-width: 481px) {
	#webopencampus .life_faq .title {
		position: absolute;
		right: 0;
		left: 0;
		top: 50%;
		margin-top: -120px;
		text-align: center;
		pointer-events: none;
		z-index: 5;
	}
	#webopencampus .life_faq .content {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#webopencampus .life_faq .content dl {
		width: 460px;
	}
	#webopencampus .life_faq .content dl:nth-child(3),
	#webopencampus .life_faq .content dl:nth-child(4) {
		width: 340px;
	}
	#webopencampus .life_faq .content dl:nth-child(n + 3) {
		margin-top: 45px;
	}
	#webopencampus .life_faq .content dl .arrow {
		position: absolute;
		width: 68px;
		height: 48px;
	}
	#webopencampus .life_faq .content dl .arrow::before,
	#webopencampus .life_faq .content dl .arrow::after {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: #fff;
	}
	#webopencampus .life_faq .content dl .arrow::before {
		top: 5px;
		left: 5px;
	}
	#webopencampus .life_faq .content dl:nth-child(1) .arrow {
		right: 12px;
		top: calc(100% - 2px);
	}
	#webopencampus .life_faq .content dl:nth-child(1) .arrow::before,
	#webopencampus .life_faq .content dl:nth-child(1) .arrow::after {
		clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 100%);
	}
	#webopencampus .life_faq .content dl:nth-child(1) .arrow::before {
		background-color: #d994da;
	}
	#webopencampus .life_faq .content dl:nth-child(2) .arrow {
		left: 12px;
		top: calc(100% - 2px);
	}
	#webopencampus .life_faq .content dl:nth-child(2) .arrow::before,
	#webopencampus .life_faq .content dl:nth-child(2) .arrow::after {
		clip-path: polygon(30px 0, 100% 0, 0 100%);
	}
	#webopencampus .life_faq .content dl:nth-child(2) .arrow::before {
		background-color: #d994da;
	}
	#webopencampus .life_faq .content dl:nth-child(5) .arrow {
		right: 12px;
		bottom: calc(100% - 2px);
	}
	#webopencampus .life_faq .content dl:nth-child(5) .arrow::before,
	#webopencampus .life_faq .content dl:nth-child(5) .arrow::after {
		clip-path: polygon(100% 0, calc(100% - 30px) 100%, 0 100%);
	}
	#webopencampus .life_faq .content dl:nth-child(5) .arrow::before {
		background-color: #d994da;
	}
	#webopencampus .life_faq .content dl:nth-child(6) .arrow {
		left: 12px;
		bottom: calc(100% - 2px);
	}
	#webopencampus .life_faq .content dl:nth-child(6) .arrow::before,
	#webopencampus .life_faq .content dl:nth-child(6) .arrow::after {
		clip-path: polygon(0 0, 100% 100%, 30px 100%);
	}
	#webopencampus .life_faq .content dl:nth-child(6) .arrow::before {
		background-color: #d994da;
	}
	#webopencampus .life_faq .content dl:nth-child(3) .arrow,
	#webopencampus .life_faq .content dl:nth-child(4) .arrow {
		width: 60px;
		height: 28px;
	}
	#webopencampus .life_faq .content dl:nth-child(3) .arrow {
		top: calc(50% - 14px);
		left: calc(100% - 2px);
	}
	#webopencampus .life_faq .content dl:nth-child(3) .arrow::before,
	#webopencampus .life_faq .content dl:nth-child(3) .arrow::after {
		clip-path: polygon(0 0, 100% 50%, 0 100%);
	}
	#webopencampus .life_faq .content dl:nth-child(3) .arrow::before {
		background-color: #d994da;
	}
	#webopencampus .life_faq .content dl:nth-child(4) .arrow {
		top: calc(50% - 14px);
		right: calc(100% - 2px);
	}
	#webopencampus .life_faq .content dl:nth-child(4) .arrow::before,
	#webopencampus .life_faq .content dl:nth-child(4) .arrow::after {
		clip-path: polygon(0 50%, 100% 0, 100% 100%);
	}
	#webopencampus .life_faq .content dl:nth-child(4) .arrow::before {
		background-color: #d994da;
	}
	#webopencampus .life_faq .content dl:hover dt span {
		text-decoration: underline;
	}
}
@media (max-width: 480px) {
	#webopencampus .life_faq {
		margin-top: 30px;
	}
	#webopencampus .life_faq .title {
		width: 150px;
		margin: auto;
	}
	#webopencampus .life_faq .content dl {
		margin-top: 25px;
		height: 180px;
	}
	#webopencampus .life_faq .content :where(dt, dd) {
		padding-top: 45px;
	}
	#webopencampus .life_faq .content :where(dt, dd)::before {
		top: 15px;
		font-size: 40px;
	}
	#webopencampus .life_faq .content dt {
		font-size: 18px;
	}
	#webopencampus .life_faq .content dl .arrow {
		display: none;
		position: absolute;
		top: -25px;
		left: 20%;
		border-style: solid;
		border-color: transparent;
		transform-origin: 50% 100%;
		border-width: 0 10px 25px 10px;
		border-bottom-color: #ecabcb;
		transform-origin: 50% 0;
		transform: skewX(-45deg);
		z-index: -1;
	}
	#webopencampus .life_faq .content dl .arrow::after {
		content: "";
		position: absolute;
		top: 0;
		left: -14px;
		border-style: solid;
		border-color: transparent;
		transform-origin: 50% 100%;
		border-width: 0 10px 25px 10px;
		border-bottom-color: #fff;
		transform-origin: 50% 0;
	}
	#webopencampus .life_faq .content dd {
		padding: 70px 20px 20px;
	}
	#webopencampus .life_faq .content dd .ico {
		top: 10px;
		width: 50px;
	}
	#webopencampus .life_faq .content dd .ico.-l {
		left: 20px;
	}
	#webopencampus .life_faq .content dd .ico.-r {
		right: 20px;
	}
}


/* life_facility
============================================================================================================ */
#webopencampus .life_facility {
	position: relative;
}
#webopencampus .life_facility .white_box {
	position: relative;
	padding: 15px 20px;
	background-color: #fff;
	box-shadow: 3px 3px 0 rgba(100, 200, 185, 0.75);
}
#webopencampus .life_facility .group {
	position: relative;
}
#webopencampus .life_facility .movie {
	position: relative;
	z-index: 2;
}
#webopencampus .life_facility .movie dt {
	display: table;
	width: 368px;
	margin: 0 auto 20px;
	padding: 10px;
	background-color: #6e6e6e;
	font-size: 28px;
	line-height: 1.5;
	font-weight: bold;
	text-align: center;
	color: #fff;
	letter-spacing: 0.2em;
}
#webopencampus .life_facility .movie dt .fuki {
	position: absolute;
	top: -125px;
	width: 175px;
	height: 196px;
	padding-top: 45px;
	padding-left: 0.1em;
	background-position: 50%;
	background-size: 100%;
	text-align: center;
	color: #64c8b9;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: 0.1em;
	z-index: -1;
}
#webopencampus .life_facility .group1 .movie dt .fuki {
	right: -10px;
	background-image: url(../img/2026/life_facility_fuki01.svg);
}
#webopencampus .life_facility .group2 .movie dt .fuki {
	left: -10px;
	background-image: url(../img/2026/life_facility_fuki02.svg);
}
#webopencampus .life_facility .movie dd {
	position: relative;
	padding-top: 56.25%;
}
#webopencampus .life_facility .movie dd iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 18px;
}
#webopencampus .life_facility .text {
	margin-bottom: 40px;
}
#webopencampus .life_facility .people {
	position: relative;
	z-index: 2;
}
#webopencampus .life_facility .people .fuki {
	position: relative;
	padding: 20px 30px;
	background-color: #fff;
	color: #000;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
}
#webopencampus .life_facility .people .img {
	position: relative;
	text-align: center;
	z-index: 2;
}
#webopencampus .life_facility .line1 {
	position: absolute;
	top: -40px;
	bottom: 0;
	border-left: 20px solid #fff;
	z-index: -1;
}
#webopencampus .life_facility .line2 {
	position: absolute;
	right: 0;
	left: 0;
	border-bottom: 20px solid #fff;
	z-index: -1;
}
#webopencampus .life_facility .group1 {
	padding: 30px 0 0 110px;
}
#webopencampus .life_facility .group1 .line1 {
	left: 104px;
}
#webopencampus .life_facility .group1 .people {
	margin-left: -120px;
}
#webopencampus .life_facility .group1 .people .img {
	margin-top: -22px;
	padding-left: 150px;
}
#webopencampus .life_facility .group2 .line1 {
	right: 40px;
}
#webopencampus .life_facility .group2 .people .img {
	margin-top: -42px;
}
#webopencampus .life_facility .link {
	max-width: 474px;
	margin: -10px 0 40px auto;
}
#webopencampus .life_facility .link a {
	display: block;
	padding: 10px;
	background-color: #fff;
	font-weight: bold;
	font-size: 25px;
	text-align: center;
	border: 2px solid #64c8b9;
	color: #64c8b9;
	box-shadow: 2px 2px 0px #64c8b9;
}
@media (min-width: 481px) {
	#webopencampus .life_facility .column {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
	}
	#webopencampus .life_facility .movie {
		width: 614px;
	}
	#webopencampus .life_facility .people .fuki::after {
		content: "";
		position: absolute;
		top: 100%;
		width: 32px;
		height: 28px;
		background: url(../img/2026/fuki_point.svg) no-repeat 50%;
	}
	#webopencampus .life_facility .people01 .fuki::after {
		left: 172px;
	}
	#webopencampus .life_facility .people .fuki_group {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
	}
	#webopencampus .life_facility .group1 .line1 {
		bottom: 50px;
	}
	#webopencampus .life_facility .group1 .line2 {
		bottom: 50px;
		left: 104px;
		right: 50px;
	}
	#webopencampus .life_facility .group1 .text {
		width: 400px;
		margin-left: 40px;
	}
	#webopencampus .life_facility .group1 .people {
		width: 415px;
		margin-bottom: 42px;
	}
	#webopencampus .life_facility .group2 {
		padding-top: 50px;
	}
	#webopencampus .life_facility .group2 .line1 {
		bottom: 140px;
	}
	#webopencampus .life_facility .group2 .line2 {
		bottom: 140px;
		left: 40px;
		right: 40px;
	}
	#webopencampus .life_facility .group2 .text {
		width: 410px;
		margin: 0 80px 50px auto;
	}
	#webopencampus .life_facility .group2 .people {
		width: 190px;
		margin-right: 140px;
		margin-bottom: 142px;
	}
	#webopencampus .life_facility .group2 .people .fuki_group {
		margin-left: -230px;
		margin-right: -160px;
	}
	#webopencampus .life_facility .group2 .people .fuki:first-child {
		width: 290px;
	}
	#webopencampus .life_facility .group2 .people .fuki:first-child::after {
		left: 172px;
	}
	#webopencampus .life_facility .group2 .people .fuki:last-child {
		width: calc(100% - 320px);
		border-left: 0;
		border-right: 1px solid #000;
		margin-bottom: 20px;
	}
	#webopencampus .life_facility .group2 .people .fuki:last-child::after {
		left: 72px;
		transform: scaleX(-1);
	}
	#webopencampus .life_facility .group2 .column {
		flex-direction: row-reverse;
	}
}
@media (max-width: 480px) {
	#webopencampus .life_facility .movie dt {
		width: 60%;
		margin: 0 auto 20px;
		border-width: 3px;
		font-size: 20px;
	}
	#webopencampus .life_facility .movie dt .fuki {
		transform-origin: 50% 100%;
		transform: scale(.5);
	}
	#webopencampus .life_facility .group1 .movie dt .fuki {
		right: -20px;
		transform-origin: 100% 100%;
	}
	#webopencampus .life_facility .group2 .movie dt .fuki {
		left: -20px;
		transform-origin: 0 100%;
	}
	#webopencampus .life_facility .movie dd iframe {
		border-radius: 10px;
	}
	#webopencampus .life_facility .text {
		margin-bottom: 20px;
	}
	#webopencampus .life_facility .people {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-bottom: 20px;
	}
	#webopencampus .life_facility .people .fuki {
		width: calc(100% - 100px);
		padding: 12px 15px;
	}
	#webopencampus .life_facility .people .fuki::after {
		content: "";
		position: absolute;
		left: 100%;
		top: 20px;
		width: 16px;
		height: 14px;
		background: url(../img/2026/fuki_point.svg) no-repeat 50%;
		background-size: 100%;
		transform-origin: 0 0;
		transform: rotate(-90deg) scaleX(-1);
	}
	#webopencampus .life_facility .people .fuki_group {
		width: calc(100% - 100px);
	}
	#webopencampus .life_facility .people .fuki_group .fuki {
		width: 100%;
	}
	#webopencampus .life_facility .people01 .img {
		width: 90px;
		margin-right: -10px;
	}
	#webopencampus .life_facility .people02 .img {
		width: 100px;
		margin-left: -10px;
		margin-top: 0 !important;
	}
	#webopencampus .life_facility .line1 {
		border-left-width: 10px;
	}
	#webopencampus .life_facility .line2 {
		border-bottom-width: 10px;
	}
	#webopencampus .life_facility .group1 {
		padding: 15px 0 0 30px;
	}
	#webopencampus .life_facility .group1 .line1 {
		left: 13px;
		top: -15px;
		bottom: 50px;
	}
	#webopencampus .life_facility .group1 .line2 {
		bottom: 50px;
		left: 13px;
	}
	#webopencampus .life_facility .group1 .people {
		margin-left: -40px;
	}
	#webopencampus .life_facility .group1 .people .img {
		margin-top: 0;
		padding-left: 0;
	}
	#webopencampus .life_facility .group1 .people .fuki {
		border-right: 1px solid #000;
		border-left-width: 0;
	}
	#webopencampus .life_facility .group2 {
		padding: 25px 30px 0 0;
	}
	#webopencampus .life_facility .group2 .people {
		margin-right: -40px;
		flex-direction: row-reverse;
	}
	#webopencampus .life_facility .group2 .people .fuki::after {
		top: 30px;
		right: 100%;
		left: auto;
		transform-origin: 100% 0;
		transform: rotate(90deg);
	}
	#webopencampus .life_facility .group2 .people .fuki + .fuki {
		margin-top: 10px;
	}
	#webopencampus .life_facility .group2 .people .fuki + .fuki::after {
		top: 10px;
		transform: rotate(90deg) scaleX(-1);
	}
	#webopencampus .life_facility .group2 .line1 {
		right: 5px;
		bottom: 80px;
	}
	#webopencampus .life_facility .group2 .line2 {
		right: 5px;
		bottom: 80px;
	}
	#webopencampus .life_facility .link {
		max-width: none;
		margin: -5px -2px 30px 0;
	}
	#webopencampus .life_facility .link a {
		font-size: 15px;
	}
}

/* food_simulator
============================================================================================================ */
#webopencampus .simulator_title {
	margin-bottom: 20px;
	text-align: center;
	background-color: #cc8bcd;
	color: #fff;
	padding: 6px;
	font-size: 46px;
	line-height: 1.5;
	letter-spacing: 0.1em;
}
#webopencampus .food_simulator_people {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	margin-left: 12px;
	z-index: 2;
}
#webopencampus .food_simulator_people .fuki {
	position: relative;
	margin-bottom: 20px;
	padding: 20px 30px;
	background-color: #fff;
	color: #000;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
}
#webopencampus .food_simulator {
	padding-bottom: 80px;
}
#webopencampus .food_simulator .food {
	display: flex;
	flex-wrap: wrap;
}
#webopencampus .food_simulator .food a {
	position: relative;
	display: block;
	height: 100%;
	padding: 9px;
	background-color: #fce7cc;
	color: #000;
	text-decoration: none;
	font-size: 16px;
	line-height: 1.1;
	font-weight: bold;
}
#webopencampus .food_simulator .food a::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background-color: #f0e221;
	mix-blend-mode: multiply;
	opacity: 0;
	transition: opacity .3s;
}
#webopencampus .food_simulator .food a.selected::after {
	opacity: 1;
}
_:-ms-lang(x)::-ms-backdrop, #webopencampus .food_simulator .food a::after {
	opacity: 0.3;
}
#webopencampus .food_simulator .food a > span {
	display: block;
}
#webopencampus .food_simulator .food a .img {
	position: relative;
	margin-bottom: 8px;
}
#webopencampus .food_simulator .food a .calorie {
	position: absolute;
	left: 0;
	bottom: 0;
	padding: 2px 10px;
	background-color: #fff;
	color: #000;
	font-size: 14px;
	line-height: 1.3;
	font-weight: 600;
}
#webopencampus .food_simulator .food a .price {
	text-align: right;
	font-size: 22px;
	line-height: 1;
	color: #f47416;
	margin-top: 5px;
}
#webopencampus .food_simulator .food a .price span {
	font-size: 28px;
	line-height: 0.8;
	font-weight: 600;
}
@media (min-width: 481px) {
	#webopencampus .food_simulator_people .fuki::after {
		content: "";
		position: absolute;
		top: 100%;
		left: 40px;
		width: 32px;
		height: 28px;
		background: url(../img/2026/fuki_point.svg) no-repeat 50%;
		transform: scaleX(-1);
	}
	#webopencampus .food_simulator .food {
		margin-left: -25px;
		margin-right: -25px;
	}
	#webopencampus .food_simulator .food li {
		width: 20%;
	}
}
@media (max-width: 480px) {
	#webopencampus .food_simulator {
		padding-bottom: 20px;
	}
	#webopencampus .simulator_title {
		padding: 10px 0;
		font-size: 22px;
	}
	#webopencampus .food_simulator_people {
		gap: 10px;
		margin-left: 0;
	}
	#webopencampus .food_simulator_people .img {
		width: 70px;
		flex-shrink: 0;
	}
	#webopencampus .food_simulator_people .fuki {
		margin-top: 0;
		padding: 10px 15px;
	}
	#webopencampus .food_simulator_people .fuki::after {
		content: "";
		position: absolute;
		top: 30px;
		right: 100%;
		width: 16px;
		height: 14px;
		background: url(../img/2026/fuki_point.svg) no-repeat 50%;
		background-size: 100%;
		transform-origin: 100% 0;
		transform: rotate(90deg);
	}
	#webopencampus .food_simulator .food {
		margin-left: -3vw;
		margin-right: -3vw;
	}
	#webopencampus .food_simulator .food li {
		width: 33.33%;
	}
	#webopencampus .food_simulator .food a {
		padding: 5px;
		font-size: 12px;
	}
	#webopencampus .food_simulator .food a .img {
		position: relative;
		margin-bottom: 5px;
	}
	#webopencampus .food_simulator .food a .calorie {
		padding: 2px 5px;
		font-size: 10px;
	}
	#webopencampus .food_simulator .food a .price {
		font-size: 12px;
		margin-top: 5px;
	}
	#webopencampus .food_simulator .food a .price span {
		font-size: 16px;
	}
}
#webopencampus .food_simulator .result {
	margin-top: 40px;
	color: #000;
}
#webopencampus .food_simulator .result dt {
	margin-bottom: 40px;
	text-align: center;
	font-size: 30px;
	line-height: 1.5;
	font-weight: bold;
}
#webopencampus .food_simulator .result ul {
	background-color: #fff;
	padding: 10px;
	display: flex;
	justify-content: center;
	font-size: 48px;
	line-height: 1.2;
	font-weight: 700;
}
#webopencampus .food_simulator .result .ff_enb {
	font-weight: 600;
	font-size: 140px;
	line-height: 0.8;
}
@media (min-width: 481px) {
	#webopencampus .food_simulator .result ul {
		padding: 10px 40px;
	}
	#webopencampus .food_simulator .result li {
		width: 50%;
		text-align: center;
	}
}
@media (max-width: 480px) {
	#webopencampus .food_simulator .result {
		margin-top: 20px;
	}
	#webopencampus .food_simulator .result dt {
		margin-bottom: 20px;
		font-size: 20px;
	}
	#webopencampus .food_simulator .result ul {
		font-size: 22px;
		flex-wrap: wrap;
		margin-inline: 5vw;
	}
	#webopencampus .food_simulator .result li {
		padding: 5px;
	}
	#webopencampus .food_simulator .result .ff_enb {
		font-size: 58px;
	}
}
#simulator_sound {
	position: absolute;
	left: -1000px;
	top: -1000px;
	visibility: hidden;
}


/* dormitory
============================================================================================================ */
#webopencampus .dormitory {
	background-color: #fff;
	margin-top: 100px;
	margin-bottom: 160px;
	padding: 55px;
	line-height: 1.66;
	section {
		margin-bottom: 60px;
		&.-blue {
			--color: #0094d7;
		}
		&.-pink {
			--color: #ed86b3;
		}
		h4 {
			padding: 8px 20px;
			background-color: var(--color);
			color: #fff;
			font-size: 40px;
			line-height: 1.5;
			letter-spacing: 0.1em;
		}
		.lead {
			margin: 40px 0 30px;
			text-align: center;
			font-size: 28px;
			line-height: 1.6;
			font-weight: 700;
			letter-spacing: 0.1em;
		}
		.txt {
			dl {
				margin-top: 30px;
				dt {
					margin-bottom: 10px;
					width: 140px;
					padding-block: 8px;
					text-align: center;
					background-color: var(--color);
					color: #fff;
					font-size: 20px;
					font-weight: 700;
					line-height: 1.6;
				}
				dd {
					line-height: 1.4;
				}
			}
		}
		.plan {
			dl {
				& + dl {
					margin-top: 50px;
				}
				dt {
					position: relative;
					margin-bottom: 20px;
					padding-block: 10px;
					text-align: center;
					background-color: var(--color);
					color: #fff;
					font-size: 28px;
					font-weight: 700;
					line-height: 1.6;
					letter-spacing: 0.1em;
					&::after {
						content: "";
						position: absolute;
						top: calc(100% - 2px);
						right: 0;
						left: 0;
						width: 22px;
						height: 12px;
						margin-inline: auto;
						background-color: var(--color);
						clip-path: polygon(0 0, 100% 0, 50% 100%);
					}
				}
				.fee {
					padding-top: 5px;
					text-align: center;
					line-height: 1.2;
					font-size: 28px;
					.ff_enb {
						margin-right: 0.1em;
						font-size: 76px;
						line-height: 1;
						font-weight: 500;
					}
					.s {
						display: inline-block;
						font-size: 18px;
					}
				}
			}
		}
	}
	@media (min-width: 481px) {
		section {
			.content {
				display: flex;
				gap: 40px;
				.plan {
					flex-shrink: 0;
					width: 510px;
					img {
						max-width: none;
					}
				}
			}
		}
	}
	@media (max-width: 480px) {
		margin-top: 40px;
		margin-inline: 5vw;
		padding: 20px;
		section {
			margin-bottom: 40px;
			h4 {
				padding: 8px 15px;
				font-size: 22px;
			}
			.lead {
				margin: 20px 0 10px;
				font-size: 18px;
			}
			.txt {
				dl {
					margin-top: 20px;
					dt {
						margin-bottom: 10px;
						width: 120px;
						padding-block: 2px;
						text-align: center;
						font-size: 14px;
					}
				}
			}
			.plan {
				margin-top: 30px;
				dl {
					& + dl {
						margin-top: 30px;
					}
					dt {
						margin-bottom: 20px;
						padding-block: 5px;
						font-size: 16px;
					}
					.fee {
						padding-top: 0;
						font-size: 18px;
						.ff_enb {
							font-size: 40px;
						}
						.s {
							font-size: 12px;
						}
					}
				}
			}
		}
	}
}


/* life_bnr
============================================================================================================ */
#webopencampus .life_oc_bnr {
	position: relative;
	width: 640px;
	margin: 0 auto 0;
}
@media (max-width: 480px) {
	#webopencampus .life_oc_bnr {
		width: auto;
	}
}
#webopencampus .life_bnr {
	margin-top: 80px;
	padding-bottom: 30px;
}
#webopencampus .life_bnr .lead {
	padding: 10px;
	background-color: #fff;
	margin-bottom: 40px;
	text-align: center;
	font-weight: bold;
	font-size: 33px;
	line-height: 1.6;
	color: #d994da;
}
#webopencampus .life_bnr section {
	text-align: center;
}
#webopencampus .life_bnr section + section {
	margin-top: 60px;
}
#webopencampus .life_bnr a {
	display: block;
	text-decoration: none;
	color: #000;
	text-align: center;
}
#webopencampus .life_bnr h4 {
	padding-bottom: 8px;
	border-bottom: 3px solid #d994da;
	margin-bottom: 8px;
	font-size: 24px;
	line-height: 1.5;
}
#webopencampus .life_bnr .bnr {
	margin-top: 20px;
}
#webopencampus .life_bnr .guide {
	text-align: left;
}
#webopencampus .life_bnr .guide .arrow {
	margin-top: 70px;
	text-align: center;
	background-color: #d994da;
	color: #fff;
	font-weight: 700;
	font-size: 26px;
	padding: 10px;
}
#webopencampus .life_bnr .embed {
	margin-top: 20px;
	max-width: 614px;
	margin-inline: auto;
	iframe {
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 9;
	}
}

@media (min-width: 481px) {
	#webopencampus .life_bnr > * {
		width: 980px;
	}
	#webopencampus .life_bnr .guide {
		display: flex;
		margin-top: 30px;
	}
	#webopencampus .life_bnr .guide .ph {
		flex-shrink: 0;
		width: 336px;
		border: 1px solid #000;
		margin-left: 60px;
	}
	#webopencampus .life_bnr .guide .arrow {
		margin-right: -20px;
		clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%);
	}
}
@media (max-width: 480px) {
	#webopencampus .life_bnr {
		margin-top: 40px;
		padding-bottom: 0;
	}
	#webopencampus .life_bnr .lead {
		margin-bottom: 20px;
		font-size: 20px;
		line-height: 1.5;
	}
	#webopencampus .life_bnr section + section {
		margin-top: 30px;
	}
	#webopencampus .life_bnr h4 {
		margin-bottom: 8px;
		font-size: 20px;
	}
	#webopencampus .life_bnr a {
		padding-top: 15px;
	}
	#webopencampus .life_bnr .bnr {
		margin-top: 15px;
	}
	#webopencampus .life_bnr .guide .arrow {
		position: relative;
		padding: 10px 10px 20px;
		margin: 15px 0 2px;
		font-size: 15px;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px));
		z-index: 3;
	}
	#webopencampus .life_bnr .guide .ph {
		width: 70%;
		border: 1px solid #000;
		margin-inline: auto;
	}
}


/* life_circle_pickup
============================================================================================================ */
#webopencampus .life_circle_pickup {
	margin: 50px auto 0;
}
#webopencampus .life_circle_pickup h4 {
	margin-bottom: 40px;
	text-align: center;
	font-size: 46px;
	line-height: 1.2;
}
#webopencampus .life_circle_wrap {
	background-color: #fff;
}
#webopencampus .life_circle_pickup section + section {
	margin-top: 20px;
}
#webopencampus .life_circle_pickup section {
	padding: 50px 80px;
	background-color: #fff;
	line-height: 1.75;
}
#webopencampus .life_circle_pickup section .img {
	position: relative;
	overflow: hidden;
	border-radius: 10px;
	background-color: #fff;
}
#webopencampus .life_circle_pickup section .img img {
	max-width: 100%;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}
/* #webopencampus .life_circle_pickup section .img.fit img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
} */
#webopencampus .life_circle_pickup section .img div {
	position: relative;
}
#webopencampus .life_circle_pickup section .img .caption {
	position: absolute;
	right: 10px;
	bottom: 10px;
	font-size: 14px;
	color: #fff;
}
#webopencampus .life_circle_pickup section .flyer {
	margin-top: 15px;
}
#webopencampus .life_circle_pickup section .category {
	width: fit-content;
	margin-bottom: 5px;
	color: #fff;
	font-weight: 700;
	background-color: #00acff;
	font-size: 26px;
	line-height: 1.5;
	padding: 0 .6em;
}
#webopencampus .life_circle_pickup section h5 {
	margin-bottom: 30px;
	padding-bottom: 12px;
	border-bottom: 10px solid #00acff;
	font-size: 43px;
	color: #000;
	line-height: 1.5;
	letter-spacing: 0.06em;
}
#webopencampus .life_circle_pickup section .category.-purple {
	background-color: #e466cc;
}
#webopencampus .life_circle_pickup section h5.-purple {
	border-color: #e466cc;
}
#webopencampus .life_circle_pickup section .category.-green {
	background-color: #4bbccc;
}
#webopencampus .life_circle_pickup section h5.-green {
	border-color: #4bbccc;
}
#webopencampus .life_circle_pickup section .txt > * + * {
	margin-top: 1.3em;
}
#webopencampus .life_circle_pickup section a {
	color: #00a5d5;
	text-decoration: underline;
}
#webopencampus .life_circle_pickup section .sns {
	display: flex;
	align-items: center;
	gap: 15px;
}
#webopencampus .life_circle_pickup section .sns .hp {
	display: flex;
	align-items: center;
	font-size: 16px;
	gap: 10px;
	margin-right: 10px;
}
#webopencampus .life_circle_pickup section .robocon_info .flex {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
}
#webopencampus .life_circle_pickup section .robocon_info .flex .logo {
	flex-shrink: 0;
	width: 216px;
}
#webopencampus .life_circle_pickup section .robocon_info .more {
	margin-top: 10px;
	font-size: 16px;
}
@media (min-width: 481px) {
	#webopencampus .life_circle_pickup section .right_side {
		float: right;
		width: 408px;
	}
	#webopencampus .life_circle_pickup section .right_side + * {
		margin-right: 435px;
	}
	#webopencampus .life_circle_pickup section a:hover {
		text-decoration: none;
	}
}
@media (max-width: 480px) {
	#webopencampus .life_circle_pickup {
		margin-top: 0;
	}
	#webopencampus .life_circle_pickup h4 {
		margin-bottom: 20px;
		font-size: 28px;
	}
	#webopencampus .life_circle_pickup section {
		padding: 15px 5vw;
	}
	#webopencampus .life_circle_pickup section + section {
		margin-top: 10px;
	}
	#webopencampus .life_circle_pickup section .category {
		font-size: 18px;
	}
	#webopencampus .life_circle_pickup section h5 {
		margin-bottom: 15px;
		padding-bottom: 8px;
		border-bottom-width: 5px;
		font-size: 24px;
	}
	#webopencampus .life_circle_pickup section .img {
		margin-bottom: 15px;
	}
	#webopencampus .life_circle_pickup section .img .caption {
		font-size: 12px;
	}
	#webopencampus .life_circle_pickup section .flyer {
		margin: 10px 0 15px;
		width: 50%;
	}
	#webopencampus .life_circle_pickup section .sns {
		gap: 10px;
	}
	#webopencampus .life_circle_pickup section .sns li img {
		width: auto;
		height: 30px;
	}
	#webopencampus .life_circle_pickup section .sns .hp {
		font-size: 12px;
	}
	#webopencampus .life_circle_pickup section .robocon_info .flex {
		gap: 10px;
		font-size: 12px;
	}
	#webopencampus .life_circle_pickup section .robocon_info .flex .logo {
		width: 32%;
	}
	#webopencampus .life_circle_pickup section .robocon_info .more {
		margin-top: 10px;
		font-size: 12px;
	}
}

/* life_circle_other
============================================================================================================ */
#webopencampus .life_circle_other {
	margin-top: 50px;
	margin-bottom: 100px;
	text-align: center;
}
#webopencampus .life_circle_other h4 {
	font-weight: normal;
}
#webopencampus .life_circle_other .bnr a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 190px;
	color: #fff;
	text-decoration: underline;
	font-size: 22px;
}
#webopencampus .life_circle_other .bnr a > span {
	position: relative;
	z-index: 2;
}
@media (min-width: 481px) {
	#webopencampus .life_circle_other {
		width: 446px;
		margin-left: auto;
		margin-right: auto;
	}
	#webopencampus .life_circle_other .bnr {
		width: 446px;
		margin: 20px auto;
	}
}
@media (max-width: 480px) {
	#webopencampus .life_circle_other {
		margin-top: 30px;
		margin-bottom: 20px;
	}
	#webopencampus .life_circle_other .bnr {
		margin: 15px 0;
	}
	#webopencampus .life_circle_other .bnr a {
		height: 120px;
		font-size: 18px;
	}
	#webopencampus .life_circle_other .bnr + p {
		text-align: left;
	}
}

/* life_circle_robocon
============================================================================================================ */
#webopencampus .life_circle_robocon {
	margin-top: 20px;
	margin-bottom: 60px;
	position: relative;
}
#webopencampus .life_circle_robocon .site {
	text-align: center;
	font-size: 17px;
	letter-spacing: 0;
}
#webopencampus .life_circle_robocon .site a {
	display: block;
	color: #00a5d5;
	font-size: 15px;
	line-height: 1.5;
	text-decoration: underline;
}
#webopencampus .life_circle_robocon .site a span {
	display: block;
}
#webopencampus .life_circle_robocon .site a span + span {
	margin-top: 10px;
}
@media (min-width: 481px) {
	#webopencampus .life_circle_robocon .flex {
		width: 880px;
		margin: 40px auto 0;
		display: flex;
		justify-content: space-between;
	}
	#webopencampus .life_circle_robocon .img {
		width: 510px;
	}
	#webopencampus .life_circle_robocon .site {
		width: 350px;
	}
	#webopencampus .life_circle_robocon .site a:hover {
		text-decoration: none;
	}
}
@media (max-width: 480px) {
	#webopencampus .life_circle_robocon {
		margin-top: 10px;
		margin-bottom: 30px;
	}
	#webopencampus .life_circle_robocon .img {
		margin-top: 20px;
		margin-bottom: 15px;
	}
	#webopencampus .life_circle_robocon .site {
		margin-top: 15px;
		font-size: 14px;
	}
	#webopencampus .life_circle_robocon .site a {
		margin-bottom: 5px;
		font-size: 12px;
	}
}

/* life_circle_movie
============================================================================================================ */
.life_circle_movie {
	margin-top: 10px;
	text-align: center;
}
.life_circle_movie iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 10px;
}
@media (max-width: 480px) {
}

/* life_circle_skip
============================================================================================================ */
#webopencampus .life_circle_skip {
	max-width: 480px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
#webopencampus .life_circle_skip a {
	color: #3692f8;
	text-decoration: none;
	font-weight: 700;
	font-size: 28px;
}
#webopencampus .life_circle_skip a span {
	display: block;
	margin-top: 5px;
}
#webopencampus .life_circle_skip .btn {
	margin-top: 10px;
}
@media (max-width: 480px) {
	#webopencampus .life_circle_skip a {
		font-size: 16px;
	}
}

/* exam_main
============================================================================================================ */
#webopencampus .exam_main {
	margin-top: -70px;
	margin-bottom: 60px;
	text-align: center;
}
#webopencampus .exam_main .lead {
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 33px;
	line-height: 1.5;
	color: #fff;
}
@media (max-width: 480px) {
	#webopencampus .exam_main {
		margin-top: -30px;
		margin-bottom: 30px;
	}
	#webopencampus .exam_main .lead {
		margin-bottom: 5px;
		font-size: 24px;
	}
}



/* exam_types
============================================================================================================ */
#webopencampus .exam_types {
	margin-bottom: 90px;
}
#webopencampus .exam_types h3 {
	margin-bottom: 15px;
	background-color: #fff;
	border: 1px solid;
	text-align: center;
	font-size: 28px;
	color: #36cbf8;
	letter-spacing: 0.1em;
}
#webopencampus .exam_types .lead {
	text-align: center;
	font-weight: 700;
	font-size: 24px;
	margin-bottom: 10px;
}
#webopencampus .sogo_waku {
	position: relative;
	margin-top: 40px;
	line-height: calc(24 / 18);
}
#webopencampus .sogo_waku .waku1 {
	--color: #f5ab18;
}
#webopencampus .sogo_waku .waku2 {
	--color: #33b495;
}
#webopencampus .sogo_waku .waku3 {
	--color: #4593d0;
}
#webopencampus .sogo_waku .box {
	margin-bottom: 20px;
	padding: 0 8px 8px;
	background-color: var(--color);
	border: 2px solid #fff;
}
#webopencampus .sogo_waku h4 {
	text-align: center;
	padding: 40px 0;
	font-size: 30px;
	letter-spacing: 0.1em;
	color: #fff;
}
#webopencampus .sogo_waku .notes {
	margin-top: 3px;
	font-size: 12px;
	color: #fff;
}
@media (min-width: 481px) {
	#webopencampus .exam_types {
		width: calc(100% - 30px * 2);
		max-width: 1110px;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 50px;
	}
	#webopencampus .exam_types > section {
		width: calc((100% - 50px) / 2);
	}
	#webopencampus .exam_types .sogo {
		width: 100%;
	}
	#webopencampus .sogo_wrap {
		display: contents;
	}
	#webopencampus .sogo_waku {
		display: flex;
		justify-content: space-between;
		padding-bottom: 50px;
	}
	#webopencampus .sogo_waku section {
		width: 350px;
	}
	#webopencampus .sogo_waku::before {
		content: "";
		position: absolute;
	}
}
@media (max-width: 480px) {
	#webopencampus .exam_types {
		margin-bottom: 50px;
	}
	#webopencampus .exam_types > section {
		margin-bottom: 30px;
	}
	#webopencampus .exam_types h3 {
		margin-bottom: 12px;
		font-size: 22px;
	}
	#webopencampus .exam_types .lead {
		font-size: 16px;
		margin-bottom: 10px;
		line-height: 1.5;
	}
	#webopencampus .sogo_wrap {
		display: flex;
		flex-direction: column;
		margin-bottom: 10px;
		margin-top: 20px;
	}
	#webopencampus .sogo_waku {
		display: contents;
	}
	#webopencampus .sogo_waku section {
		order: 3;
	}
	#webopencampus .sogo_waku .waku1 {
		order: 1;
	}
	#webopencampus .waku_plus {
		order: 2;
	}
	#webopencampus .sogo_waku .box {
		margin-bottom: 15px;
	}
	#webopencampus .sogo_waku h4 {
		padding: 24px 0;
		font-size: 22px;
	}
	#webopencampus .sogo_waku section {
		margin-bottom: 20px;
	}
	#webopencampus .sogo_waku .notes {
		font-size: 10px;
	}
}
#webopencampus .waku_plus {
	margin-bottom: 40px;
}
#webopencampus .waku_plus .box {
	position: relative;
	background-color: #fff;
	border: 2px solid #fff;
}
#webopencampus .waku_plus .box::before,
#webopencampus .waku_plus .box::after {
	content: "";
	position: absolute;
	left: 150px;
	bottom: calc(100% + 20px);
	width: 52px;
	height: 28px;
	background-color: #fff;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
#webopencampus .waku_plus .box::after {
	background-color: #f5ab18;
	transform: scale(.8);
	transform-origin: 50% 30%;
}
#webopencampus .waku_plus .left {
	background-color: #f5ab18;
	color: #fff;
}
#webopencampus .waku_plus .left .txt {
	padding: 20px;
	font-size: 15px;
	line-height: calc(23 / 15);
}
#webopencampus .waku_plus .title {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	gap: 10px;
	background-color: #f5ab18;
	color: #fff;
	font-size: 26px;
	line-height: 1.3;
}
#webopencampus .waku_plus .title span {
	padding: 10px 15px;
	border: 1px solid #fff;
	border-radius: 10px;
	font-size: 110%;
	line-height: 1;
}
#webopencampus .waku_plus .main {
	padding: 16px;
	line-height: 1.55;
}
#webopencampus .waku_plus .main strong {
	margin-inline: .2em;
	padding: 0 .2em;
	background-color: #ef8200;
	color: #fff;
}
#webopencampus .waku_plus .main .img {
	margin-top: 30px;
}
#webopencampus .waku_foreigner {
	padding: 20px 30px;
	background-color: #fff;
}
@media (min-width: 481px) {
	#webopencampus .waku_plus .box {
		display: flex;
		flex-direction: row-reverse;
	}
	#webopencampus .waku_plus .right {
		width: 616px;
	}
	#webopencampus .waku_plus .left {
		width: calc((100% - 616px));
	}
}
@media (max-width: 480px) {
	#webopencampus .waku_plus {
		margin-top: 30px;
		margin-bottom: 30px;
	}
	#webopencampus .waku_plus .box {
		position: relative;
	}
	#webopencampus .waku_plus .box::before,
	#webopencampus .waku_plus .box::after {
		left: calc(50% - 52px / 2);
		bottom: calc(100% + 10px);
	}
	#webopencampus .waku_plus .title {
		padding: 10px;
		gap: 10px;
		font-size: 15px;
	}
	#webopencampus .waku_plus .title span {
		padding: 6px 10px;
		border-radius: 6px;
	}
	#webopencampus .waku_plus .main {
		padding: 10px;
		line-height: 1.5;
	}
	#webopencampus .waku_plus .main .img {
		margin-top: 10px;
		margin-bottom: 20px;
	}
	#webopencampus .waku_plus .left .txt {
		padding: 10px;
		font-size: 12px;
	}
}


#webopencampus .waku_pamphlet {
	margin-top: 40px;
	max-width: 980px;
	margin-inline: auto;
}
#webopencampus .waku_pamphlet a {
	display: block;
	text-decoration: none;
	color: #000;
	text-align: center;
}
#webopencampus .waku_pamphlet {
	text-align: left;
}
#webopencampus .waku_pamphlet .arrow {
	text-align: center;
	background-color: #fff;
	color: #36cbf8;
	font-weight: 700;
	font-size: 26px;
	padding: 10px;
}
@media (min-width: 481px) {
	#webopencampus .waku_pamphlet a {
		display: flex;
		gap: 10px;
		align-items: center;
	}
	#webopencampus .waku_pamphlet .ph {
		flex-shrink: 0;
		width: 336px;
		border: 1px solid #000;
	}
	#webopencampus .waku_pamphlet .txt  {
		flex-grow: 1;
	}
	#webopencampus .waku_pamphlet .arrow {
		clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%);
	}
}
@media (max-width: 480px) {
	#webopencampus .waku_pamphlet {
		margin-top: 30px;
	}
	#webopencampus .waku_pamphlet .arrow {
		position: relative;
		padding: 10px 10px 20px;
		margin: 15px 0 2px;
		font-size: 16px;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px));
		z-index: 3;
	}
	#webopencampus .waku_pamphlet .ph {
		width: 70%;
		border: 1px solid #000;
		margin-inline: auto;
	}
}



/* movie_section
============================================================================================================ */
#webopencampus .movie_section {
	position: relative;
	max-width: 980px;
}
#webopencampus .movie_section h3 {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	margin-bottom: 30px;
	color: #000;
	font-size: 23px;
	line-height: 1;
}
#webopencampus .movie_section h3 .ff_en {
	margin-right: 20px;
	color: #969696;
	font-size: 66px;
	line-height: 0.6;
}
#webopencampus .movie_section .movie {
	position: relative;
	padding-top: 56.25%;
}
#webopencampus .movie_section .movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 30px;
}
#webopencampus .movie_section .movie + p {
	margin-top: 10px;
	text-align: center;
}
@media (max-width: 480px) {
	#webopencampus .movie_section h3 {
		display: block;
		margin-bottom: 15px;
		font-size: 16px;
	}
	#webopencampus .movie_section h3 .ff_en {
		display: block;
		margin: 0 0 10px;
		font-size: 40px;
	}
	#webopencampus .movie_section .movie iframe {
		border-radius: 15px;
	}
}

/* exam_leaflet
============================================================================================================ */
#webopencampus .exam_leaflet {
	line-height: 1.75;
}
#webopencampus .exam_leaflet .lead {
	margin-bottom: 30px;
	padding: 5px;
	background-color: #fff;
	text-align: center;
	font-weight: 700;
	color: #64c8b9;
	letter-spacing: 0.1em;
	font-size: 37px;
}
#webopencampus .exam_leaflet .leaflet p {
	margin-bottom: 1.5em;
}
#webopencampus .exam_leaflet .leaflet .fuki {
	position: relative;
	width: fit-content;
	margin-bottom: 30px;
	padding: 8px 15px;
	background-color: #fff;
	border-radius: 20px;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.4;
	letter-spacing: 0.1em;
}
#webopencampus .exam_leaflet .leaflet .fuki::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 45px;
	border-style: solid;
	border-width: 0 20px 20px 0;
	border-color: transparent #fff transparent transparent;
	transform-origin: 0 0;
	transform: skewX(20deg);
}
#webopencampus .exam_leaflet .leaflet .a {
	overflow: hidden;
	position: relative;
	padding: 15px;
	margin-bottom: 0;
	background: linear-gradient(to right,  #ecabcb 0%,#0275ff 100%);
	color: #fff;
	font-weight: bold;
	font-size: 25px;
	text-align: center;
	clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%);
	letter-spacing: 0.1em;
}
#webopencampus .exam_leaflet .leaflet .img {
	position: relative;
	margin: 0;
}
#webopencampus .exam_leaflet .leaflet .img a {
	display: block;
	position: relative;
}
#webopencampus .exam_leaflet .leaflet .img a::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #000;
}
@media (min-width: 481px) {
	#webopencampus .exam_leaflet {
		padding-inline: 25px;
	}
	#webopencampus .exam_leaflet .leaflet {
		position: relative;
		padding-right: 380px;
	}
	#webopencampus .exam_leaflet .leaflet .a {
		margin-right: -30px;
	}
	#webopencampus .exam_leaflet .leaflet .img {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 335px;
	}
	#webopencampus .exam_leaflet .leaflet .img a:hover {
		opacity: 0.7;
	}
}
@media (max-width: 480px) {
	#webopencampus .exam_leaflet .lead {
		margin-top: 30px;
		margin-bottom: 20px;
		font-size: 20px;
	}
	#webopencampus .exam_leaflet .bnr a .img {
		width: 30%;
	}
	#webopencampus .exam_leaflet .bnr a .img + div {
		width: 65%;
		font-size: 12px;
	}
	#webopencampus .exam_leaflet .leaflet .a {
		position: relative;
		padding: 10px 10px 20px;
		margin: 15px 0 2px;
		font-size: 15px;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px));
		z-index: 3;
	}
	#webopencampus .exam_leaflet .leaflet .fuki {
		width: auto;
		margin-bottom: 15px;
		padding: 5px 10px;
		border-radius: 10px;
		font-weight: 700;
		font-size: 13px;
	}
	#webopencampus .exam_leaflet .leaflet .fuki::after {
		border-width: 0 10px 10px 0;
	}
	#webopencampus .exam_leaflet .leaflet .img {
		width: 70%;
		margin-inline: auto;
	}
}

/* winter_sports
============================================================================================================ */
#webopencampus .winter_sports h4 {
	margin-bottom: 20px;
	text-align: center;
	font-size: 27px;
	line-height: 1.6;
}
#webopencampus .winter_sports .content {
	position: relative;
	padding: 40px 0;
	background-color: #008ac5;
	z-index: 5;
}
#webopencampus .winter_sports .content dt {
	margin-bottom: 30px;
	font-size: 27px;
	font-weight: bold;
	line-height: 1.6;
}
#webopencampus .winter_sports .content li {
	position: relative;
	padding-left: 1em;
}
#webopencampus .winter_sports .content li + li {
	margin-top: 10px;
}
#webopencampus .winter_sports .content li::before {
	content: "・";
	position: absolute;
	top: 0;
	left: 0;
}
#webopencampus .winter_sports .content li a {
	color: #fff;
	text-decoration: underline;
}
@media (min-width: 481px) {
	#webopencampus .winter_sports .content .w {
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
	}
	#webopencampus .winter_sports .content li {
		font-size: 19px;
	}
	#webopencampus .winter_sports .content li a:hover {
		text-decoration: none;
	}
}
@media (max-width: 480px) {
	#webopencampus .winter_sports h4 {
		margin-bottom: 15px;
		font-size: 17px;
	}
	#webopencampus .winter_sports .content {
		padding: 30px 0;
	}
	#webopencampus .winter_sports .content dt {
		margin-top: 10px;
		margin-bottom: 10px;
		font-size: 18px;
	}
	#webopencampus .winter_sports .content li + li {
		margin-top: 5px;
	}
}


/* reason_choosing
============================================================================================================ */
#webopencampus .reason_choosing {
	position: relative;
	margin-top: 50px;
}
#webopencampus .reason_choosing .people li {
	position: relative;
	padding-bottom: 240px;
}
#webopencampus .reason_choosing .people .fuki::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 40px;
	width: 32px;
	height: 28px;
	background: url(../img/2026/fuki_point.svg) no-repeat 50%;
}
#webopencampus .reason_choosing .people .fuki {
	position: relative;
	height: 100%;
	padding: 10px 20px 40px;
	background-color: #fff;
	color: #000;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
	font-size: 16px;
	line-height: 1.75;
}
#webopencampus .reason_choosing .people .img {
	position: absolute;
	bottom: 0;
	left: 20px;
	width: 300px;
}
@media (min-width: 481px) {
	#webopencampus .reason_choosing_lead {
		margin: 0 20px 20px;
	}
	#webopencampus .reason_choosing .people {
		display: flex;
		justify-content: center;
		gap: 40px;
		margin-bottom: 60px;
	}
	#webopencampus .reason_choosing .people li.people1 {
		width: 264px;
	}
	#webopencampus .reason_choosing .people li.people2 {
		width: 280px;
	}
	#webopencampus .reason_choosing .people li.people3 {
		width: 280px;
	}
	#webopencampus .reason_choosing .bnr a {
		display: block;
		width: 614px;
		margin: 0 auto;
	}
}
@media (max-width: 480px) {
	#webopencampus .reason_choosing {
		margin-top: 20px;
		margin-bottom: 50px;
	}
	#webopencampus .reason_choosing .people {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px 0;
		margin-bottom: 30px;
	}
	#webopencampus .reason_choosing .people li {
		width: 50%;
		padding-bottom: 35vw;
	}
	#webopencampus .reason_choosing .people li:nth-child(1) {
		width: 40%;
		margin-right: 10%;
	}
	#webopencampus .reason_choosing .people .fuki {
		padding: 10px 10px 30px;
		font-size: 12px;
	}
	#webopencampus .reason_choosing .people .fuki::after {
		left: 20px;
		transform-origin: 0 0;
		transform: scale(.6);
	}
	#webopencampus .reason_choosing .people .img {
		left: 20px;
		width: 44vw;
	}
	#webopencampus .reason_choosing .bnr {
		margin-top: 15px;
	}
}
#webopencampus .reason_youtube {
	margin-top: 100px;
	text-align: center;
	max-width: 614px;
	margin-inline: auto;
}
#webopencampus .reason_youtube iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border-radius: 30px;
}
@media (max-width: 480px) {
	#webopencampus .reason_youtube {
		margin-top: 30px;
	}
	#webopencampus .reason_youtube iframe {
		border-radius: 10px;
	}
}


/* exam_preparation
============================================================================================================ */
#webopencampus .exam_preparation {
	position: relative;
	padding: 0 25px;
	margin-top: 60px;
}
#webopencampus .exam_preparation > section {
	position: relative;
}
#webopencampus .exam_preparation > section + section {
	margin-top: 120px;
}
#webopencampus .exam_preparation h4 {
	position: relative;
	margin-bottom: 55px;
	padding: 10px;
	border-bottom: 3px solid;
	border-right: 3px solid;
	font-size: 33px;
	line-height: 1.5;
	color: #36cbf8;
	background-color: #fff;
	text-align: center;
	letter-spacing: 0.1em;
}
#webopencampus .exam_preparation h4::after {
	content: "";
	position: absolute;
	width: 40px;
	height: 30px;
	left: calc(50% - 20px);
	top: calc(100%);
	background-color: #36cbf8;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
}
#webopencampus .exam_preparation .btn a {
	display: block;
	padding: 50px;
	background-color: #36cbf8;
	color: #fff;
	font-size: 34px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-decoration: underline;
	text-align: center;
}
#webopencampus .exam_preparation h5 {
	margin-bottom: 40px;
	font-size: 24px;
	text-align: center;
	border-bottom: 3px solid #fff;
}
#webopencampus .exam_preparation .pamphlet {
	position: relative;
}
#webopencampus .exam_preparation .pamphlet .title {
	position: relative;
	padding: 15px;
	margin-top: 80px;
	background: #36cbf8;
	color: #fff;
	font-weight: bold;
	font-size: 25px;
	text-align: center;
	clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 50%, calc(100% - 30px) 100%, 0 100%);
	letter-spacing: 0.1em;
}
#webopencampus .exam_preparation .pamphlet .img a {
	display: block;
	position: relative;
}
#webopencampus .exam_preparation .pamphlet .img a::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #000;
}
#webopencampus .exam_preparation .pamphlet .img img {
	width: 100%;
}
#webopencampus .exam_preparation .pamphlet .request a {
	display: block;
	padding: 10px;
	background-color: #fff;
	font-weight: bold;
	font-size: 25px;
	text-align: center;
	border: 2px solid #36cbf8;
	color: #36cbf8;
	box-shadow: 2px 2px 0px #36cbf8;
}
#webopencampus .exam_preparation .step2 section + section {
	margin-top: 60px;
}
@media (min-width: 481px) {
	#webopencampus .exam_preparation .btn a:hover {
		opacity: 0.7;
	}
	#webopencampus .exam_preparation .pamphlet {
		display: flex;
		align-items: start;
		gap: 50px;
	}
	#webopencampus .exam_preparation .pamphlet .title {
		margin-right: -40px;
	}
	#webopencampus .exam_preparation .pamphlet .img {
		width: 335px;
		flex-shrink: 0;
	}
	#webopencampus .exam_preparation .pamphlet .img a:hover {
		opacity: 0.7;
	}
	#webopencampus .exam_preparation .pamphlet .request {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 610px;
	}
}
@media (max-width: 480px) {
	#webopencampus .exam_preparation {
		padding: 0;
		margin-top: 0;
	}
	#webopencampus .exam_preparation > section + section {
		margin-top: 60px;
	}
	#webopencampus .exam_preparation h4 {
		margin-bottom: 35px;
		font-size: 20px;
	}
	#webopencampus .exam_preparation h4::after {
		width: 30px;
		height: 20px;
		left: calc(50% - 15px);
	}
	#webopencampus .exam_preparation .btn a {
		padding: 30px;
		font-size: 20px;
	}
	#webopencampus .exam_preparation h5 {
		padding-bottom: 3px;
		margin-bottom: 15px;
		font-size: 18px;
	}
	#webopencampus .exam_preparation .pamphlet .title {
		position: relative;
		padding: 10px 10px 20px;
		margin: 15px 0 2px;
		font-size: 15px;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px));
		z-index: 3;
	}
	#webopencampus .exam_preparation .pamphlet .img {
		width: 70%;
		margin-inline: auto;
	}
	#webopencampus .exam_preparation .step2 section + section {
		margin-top: 40px;
	}
	#webopencampus .exam_preparation .pamphlet .request {
		margin: 20px auto 0;
		width: 70%;
	}
	#webopencampus .exam_preparation .pamphlet .request a {
		padding: 10px;
		font-size: 16px;
	}
}

/* employment_data
============================================================================================================ */
#webopencampus .employment_data_white_box {
	padding: 10px 15px;
	background-color: #fff;
}
#webopencampus .employment_data {
	position: relative;
	margin-top: 70px;
}
#webopencampus .employment_data .img {
	position: absolute;
}
#webopencampus .employment_data .img01 {
	top: -80px;
	left: 100px;
}
#webopencampus .employment_data .img02 {
	top: -80px;
	right: 100px;
}
#webopencampus .employment_data h4 {
	display: table;
	margin: 0 auto 160px;
	padding-bottom: 12px;
	border-bottom: 5px solid #3692f8;
	letter-spacing: .1em;
	font-size: 24px;
	line-height: 1.5;
}
@media (max-width: 480px) {
	#webopencampus .employment_data {
		margin-top: 50px;
	}
	#webopencampus .employment_data .img {
		width: 70px;
	}
	#webopencampus .employment_data .img01 {
		top: -50px;
		left: auto;
		right: 50%;
		margin-right: 110px;
	}
	#webopencampus .employment_data .img02 {
		top: -50px;
		right: 100px;
		right: auto;
		left: 50%;
		margin-left: 110px;
	}
	#webopencampus .employment_data h4 {
		margin-bottom: 30px;
		padding-bottom: 8px;
		border-bottom-width: 4px;
		font-size: 17px;
	}
}
#webopencampus .employment_data .c_yellow {
	color: #ffae4c;
}
#webopencampus .employment_data .number {
	position: relative;
	max-width: 860px;
	margin: 0 auto 80px;
}
#webopencampus .employment_data .number h5 {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	font-size: 46px;
	line-height: 1.3;
	letter-spacing: 0.1em;
}
#webopencampus .employment_data .number h5 .s {
	margin-left: 1.2em;
	font-size: 16px;
}
#webopencampus .employment_data .number .mov_num {
	position: relative;
	overflow: hidden;
	height: 0.8em;
	display: flex;
	align-items: flex-start;
}
#webopencampus .employment_data .number .mov_num > * {
	position: relative;
	transform: translateY(-100%);
}
#webopencampus .employment_data .number.showed .mov_num > * {
	transition: transform 1.5s cubic-bezier(0.33, 1, 0.68, 1);
	transform: translateY(0);
}
#webopencampus .employment_data .number.showed .mov_num > * > * {
	display: block;
}


#webopencampus .employment_data .number01 .main {
	display: flex;
	align-items: flex-end;
	margin-bottom: 10px;
	font-size: 232px;
	line-height: 0.8;
}
#webopencampus .employment_data .number01 .main .s {
	font-size: 70%;
}
#webopencampus .employment_data .number01 .zenkoku {
	font-size: 24px;
	line-height: 1.5;
	font-weight: bold;
}
#webopencampus .employment_data .number01 .zenkoku .ff_enb {
	margin-left: 5px;
	font-size: 200%;
	line-height: 1.2;
}
#webopencampus .employment_data .number01 .zenkoku .ff_enb span {
	font-size: 70%;
}
#webopencampus .employment_data .number01 .notes {
	font-size: 13px;
	line-height: 1.5;
}
#webopencampus .employment_data .number02 .main {
	display: flex;
	align-items: flex-end;
	font-size: 88px;
	line-height: 0.8;
}
#webopencampus .employment_data .number02 .main .ff_enb {
	font-size: 226px;
}
#webopencampus .employment_data .number02 .main .ff_enb + * {
	padding-bottom: 20px;
}
@media (min-width: 481px) {
	#webopencampus .employment_data .number {
		padding-left: 310px;
	}
	#webopencampus .employment_data .number .ico {
		position: absolute;
		top: 0;
		left: 0;
	}
	#webopencampus .employment_data .number02 .ico::before,
	#webopencampus .employment_data .number02 .ico::after {
		content: "";
		position: absolute;
		width: 52px;
		height: 12px;
		background-color: #000000;
		right: 10px;
		top: 156px;
	}
	#webopencampus .employment_data .number02 .ico::after {
		top: 182px;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_data .number {
		margin-bottom: 40px;
	}
	#webopencampus .employment_data .number .ico {
		width: 140px;
		margin: 0 auto 10px;
	}
	#webopencampus .employment_data .number h5 {
		justify-content: center;
		margin-bottom: 20px;
		font-size: 26px;
	}
	#webopencampus .employment_data .number h5 .s {
		margin-left: 0.8em;
		font-size: 12px;
	}
	#webopencampus .employment_data .number01 .main {
		justify-content: center;
		margin-bottom: 10px;
		font-size: 140px;
	}
	#webopencampus .employment_data .number01 .zenkoku {
		text-align: center;
		font-size: 20px;
	}
	#webopencampus .employment_data .number01 .notes {
		font-size: 11px;
	}
	#webopencampus .employment_data .number02 .main {
		justify-content: center;
		font-size: 60px;
	}
	#webopencampus .employment_data .number02 .main .ff_enb {
		font-size: 140px;
	}
	#webopencampus .employment_data .number02 .main .ff_enb + * {
		padding-bottom: 10px;
	}
}


#webopencampus .employment_data .graph_contents {
	position: relative;
	margin-top: 130px;
	padding-left: 175px;
	z-index: 2;
}
#webopencampus .employment_data .graph_contents .graph {
	position: relative;
}
#webopencampus .employment_data .graph_contents .graph .n {
	position: absolute;
	right: 0;
	bottom: 0;
	max-width: none;
}
#webopencampus .employment_data .graph_contents ul {
	font-size: 19px;
	font-weight: bold;
	line-height: 1.5;
}
#webopencampus .employment_data .graph_contents li {
	position: relative;
	padding-left: 36px;
}
#webopencampus .employment_data .graph_contents li + li {
	margin-top: 3px;
}
#webopencampus .employment_data .graph_contents li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.25em;
	width: 28px;
	height: 20px;
	background-color: #900000;
}
#webopencampus .employment_data .graph_contents .item01::before {background-color: #e5002d;}
#webopencampus .employment_data .graph_contents .item02::before {background-color: #eb6d80;}
#webopencampus .employment_data .graph_contents .item03::before {background-color: #be7cb1;}
#webopencampus .employment_data .graph_contents .item04::before {background-color: #a586bc;}
#webopencampus .employment_data .graph_contents .item05::before {background-color: #597dbe;}
#webopencampus .employment_data .graph_contents .item06::before {background-color: #00ade8;}
#webopencampus .employment_data .graph_contents .item07::before {background-color: #00a699;}
#webopencampus .employment_data .graph_contents .item08::before {background-color: #6bb840;}
#webopencampus .employment_data .graph_contents .item09::before {background-color: #87c796;}
#webopencampus .employment_data .graph_contents .item10::before {background-color: #adcd00;}
#webopencampus .employment_data .graph_contents .item11::before {background-color: #fbc82f;}
#webopencampus .employment_data .graph_contents .item12::before {background-color: #f2972e;}
#webopencampus .employment_data .graph_contents .item13::before {background-color: #ad602c;}
#webopencampus .employment_data .graph_contents .item14::before {background-color: #133769;}
#webopencampus .employment_data .graph_contents .item15::before {background-color: #ba0045;}
#webopencampus .employment_data .graph_contents .item16::before {background-color: #536346;}
#webopencampus .employment_data .img03 {
	top: 30px;
	left: -30px;
}
#webopencampus .employment_data .img04 {
	top: 30px;
	right: -30px;
}
@media (min-width: 481px) {
	#webopencampus .employment_data .graph_contents {
		display: flex;
		align-items: flex-start;
	}
	#webopencampus .employment_data .graph_contents .graph {
		margin-top: 120px;
	}
	#webopencampus .employment_data .graph_contents ul {
		margin-left: 60px;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_data .graph_contents {
		position: relative;
		margin-top: 60px;
		padding-left: 0;
		padding-top: 50px;
	}
	#webopencampus .employment_data .graph_contents .graph {
		position: relative;
		width: 200px;
		margin: 0 auto 20px;
	}
	#webopencampus .employment_data .graph_contents .graph .n {
		max-width: none;
		width: calc(385 / 354 * 100%);
	}
	#webopencampus .employment_data .graph_contents ul {
		display: table;
		margin: 0 auto;
		font-size: 15px;
	}
	#webopencampus .employment_data .graph_contents li::before {
		top: 0.1em;
	}
	#webopencampus .employment_data .img03 {
		top: -70px;
		left: -10px;
	}
	#webopencampus .employment_data .img04 {
		top: -20px;
		right: -20px;
	}
}

#webopencampus .employment_data .line_contents section {
	display: flex;
	flex-direction: column-reverse;
	margin-top: 170px;
}
#webopencampus .employment_data .line_contents section h5 {
	margin-top: 30px;
	padding: 3px;
	font-size: 16px;
	text-align: center;
	background-color: #fff;
	color: #969696;
}
#webopencampus .employment_data .line_contents section ul {
	display: flex;
	justify-content: space-between;
	height: 190px;
}
#webopencampus .employment_data .line_contents section li {
	position: relative;
	width: calc((100% - 75px) / 6);
	display: flex;
	align-items: flex-end;
}
#webopencampus .employment_data .line_contents section li .line {
	position: relative;
	width: 100%;
	background-color: #969696;
}
#webopencampus .employment_data .line_contents section li .cap {
	position: absolute;
	bottom: 100%;
	left: 50%;
	margin-bottom: 10px;
	white-space: nowrap;
	text-align: center;
	transform: translateX(-50%);
	font-weight: bold;
	font-size: 18px;
	line-height: 1.2;
	color: #969696;
}
#webopencampus .employment_data .line_contents section li .cap span {
	display: block;
}
#webopencampus .employment_data .line_contents section li .cap .ff_enb {
	margin-top: 0.1em;
	font-size: 156%;
	line-height: 1;
}
#webopencampus .employment_data .line_contents section li .cap .nin {
	font-size: 21.2px;
	line-height: 1;
}
#webopencampus .employment_data .line_contents section .yellow .line {
	background-color: #64c8b9;
}
#webopencampus .employment_data .line_contents section .yellow .cap {
	font-size: 20px;
}
#webopencampus .employment_data .line_contents section .yellow .cap .ff_enb {
	font-size: 180%;
}
#webopencampus .employment_data .line_contents .notes {
	margin-top: 30px;
	text-align: right;
	font-size: 14px;
}
@media (min-width: 481px) {
	#webopencampus .employment_data .line_contents {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 820px;
		margin: 0 auto;
	}
	#webopencampus .employment_data .line_contents section {
		width: 365px;
	}
	#webopencampus .employment_data .line_contents .notes {
		width: 100%;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_data .line_contents section {
		margin: 100px 30px 0;
	}
	#webopencampus .employment_data .line_contents section h5 {
		margin-top: 20px;
		font-size: 14px;
	}
	#webopencampus .employment_data .line_contents section ul {
		height: 170px;
	}
	#webopencampus .employment_data .line_contents section li .cap {
		font-size: 14px;
	}
	#webopencampus .employment_data .line_contents section li .cap .nin {
		font-size: 15px;
	}
	#webopencampus .employment_data .line_contents section .yellow .cap {
		font-size: 16px;
	}
	#webopencampus .employment_data .line_contents .notes {
		margin-top: 20px;
		font-size: 12px;
	}
}



#webopencampus .employment_data .map_contents {
	position: relative;
	margin-top: 40px;
	z-index: 2;
	.map {
		position: relative;
		width: 660px;
		margin-inline: auto;
		@media (max-width: 480px) {
			width: auto;
		}
		.t {
			position: absolute;
			top: 0;
			left: 0;
			width: calc(760 / 660 * 100%);
			max-width: none;
		}
	}
	@media (max-width: 480px) {
		.map {
			width: 90%;
			right: 5%;
		}
	}
}


#webopencampus .employment_data .bar_contents {
	margin-top: 40px;
	text-align: center;
	@media (max-width: 480px) {
		margin-top: 10px;
		margin-inline: -3vw;
	}
}


/* employment_support
============================================================================================================ */
#webopencampus .employment_support h4 {
	padding: 30px;
	font-size: 40px;
	line-height: 1.5;
	text-align: center;
	color: #fff;
	background-color: #3692f8;
	letter-spacing: 0.1em;
}
#webopencampus .employment_support ul {
	display: flex;
	gap: 1em;
	font-weight: 700;
	margin-top: 0.6em;
	font-size: 20px;
}
#webopencampus .employment_support a {
	color: #3692f8;
	text-decoration: underline;
}
@media (min-width: 481px) {
	#webopencampus .employment_support .flex {
		display: flex;
		align-items: start;
	}
	#webopencampus .employment_support .img {
		width: 500px;
		flex-shrink: 0;
		margin-top: -45px;
	}
	#webopencampus .employment_support .img + div {
		padding: 40px 0 0 30px;
	}
	#webopencampus .employment_support a:hover {
		text-decoration: none;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_support_bg_white {
		padding: 40px 0 30px;
	}
	#webopencampus .employment_support h4 {
		padding: 20px 0;
		font-size: 20px;
	}
	#webopencampus .employment_support .img {
		width: 280px;
		margin: -10px auto 10px;
	}
	#webopencampus .employment_support ul {
		font-size: 15px;
	}
}

/* employment_skillup
============================================================================================================ */
#webopencampus .employment_skillup {
	margin-top: 160px;
	margin-bottom: 140px;
}
#webopencampus .employment_skillup h4 {
	margin-bottom: 20px;
	color: #3692f8;
	font-size: 128px;
	line-height: 0.8;
}
#webopencampus .employment_skillup .content > * {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #3692f8;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.7;
}
#webopencampus .employment_skillup .content .s {
	display: block;
	font-size: 80%;
}
#webopencampus .employment_skillup .content > *::before {
	content: "";
	position: absolute;
	top: 0;
	left: -2px;
	right: 0;
	bottom: 0;
	background-color: #fff;
	border: 2px solid #3692f8;
}
#webopencampus .employment_skillup .content ul {
	position: relative;
	z-index: 2;
}
#webopencampus .employment_skillup .content ul li {
	position: relative;
	padding-left: 1em;
}
#webopencampus .employment_skillup .content ul li::before {
	content: "・";
	position: absolute;
	top: 0;
	left: 0;
}
#webopencampus .employment_skillup .content .title {
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(100% + 10px);
	color: #3692f8;
	font-size: 21px;
	font-weight: 700;
	text-align: center;
}
#webopencampus .employment_skillup .content .title .num {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	margin-right: 8px;
	border: 3px solid;
	width: 32px;
	height: 32px;
	font-size: 23px;
}
#webopencampus .employment_skillup .notes {
	margin-top: 20px;
	font-size: 15px;
}
@media (min-width: 481px) {
	#webopencampus .employment_skillup .content {
		display: flex;
		align-items: flex-end;
	}
	#webopencampus .employment_skillup .content > * {
		width: calc(25%);
		padding-right: 0.5em;
	}
	#webopencampus .employment_skillup .content .step1 {
		height: 92px;
	}
	#webopencampus .employment_skillup .content .step2 {
		height: 168px;
	}
	#webopencampus .employment_skillup .content .step3 {
		height: 273px;
	}
	#webopencampus .employment_skillup .content .step4 {
		height: 378px;
	}
	#webopencampus .employment_skillup .content .arrow {
		position: absolute;
		top: -260px;
		left: 80px;
	}
	#webopencampus .employment_skillup .content .arrow img {
		width: 270px;
		max-width: none;
		height: auto;
	}
	#webopencampus .employment_skillup .content .step2 .arrow {
		top: -290px;
		left: 130px;
	}
	#webopencampus .employment_skillup .content .step3 .arrow {
		left: 140px;
	}
	#webopencampus .employment_skillup .content .success {
		position: absolute;
		top: -270px;
		left: 50px;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_skillup {
		margin-top: 70px;
		margin-bottom: 40px;
	}
	#webopencampus .employment_skillup h4 {
		margin-bottom: 40px;
		font-size: 60px;
	}
	/*
	#webopencampus .employment_skillup .content > * {
		height: 70px;
		font-size: 14px;
	}
	#webopencampus .employment_skillup .content > * + * {
		margin-top: 2px;
	}
	#webopencampus .employment_skillup .content .step1 {
		width: 50%;
	}
	#webopencampus .employment_skillup .content .step2 {
		width: 60%;
	}
	#webopencampus .employment_skillup .content .step3 {
		width: 70%;
	}
	#webopencampus .employment_skillup .content .step4 {
		width: 80%;
	}
	#webopencampus .employment_skillup .content .arrow {
		position: absolute;
		top: 40px;
		right: -80px;
		width: 60px;
		transform: rotate(76deg);
	}
	#webopencampus .employment_skillup .content .success {
		position: absolute;
		top: 50%;
		right: -26%;
		width: 24%;
		transform: translateY(-50%);
		margin-top: -5px;
	}*/
	#webopencampus .employment_skillup .content {
		display: flex;
		align-items: flex-end;
	}
	#webopencampus .employment_skillup .content > * {
		width: 25%;
		font-size: 11px;
		line-height: 1.5;
	}
	#webopencampus .employment_skillup .content ul {
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
	}
	#webopencampus .employment_skillup .content ul li {
		padding: 1em 0 0;
	}
	#webopencampus .employment_skillup .content ul li::before {
		left: auto;
		right: 0;
	}
	#webopencampus .employment_skillup .content .step1 {
		height: 162px;
	}
	#webopencampus .employment_skillup .content .step2 {
		height: 198px;
		line-height: 1.2;
	}
	#webopencampus .employment_skillup .content .step3 {
		height: 254px;
	}
	#webopencampus .employment_skillup .content .step4 {
		height: 306px;
	}
	#webopencampus .employment_skillup .content .arrow {
		position: absolute;
		top: -125px;
		left: 30%;
		width: 100px;
	}
	#webopencampus .employment_skillup .content .step2 .arrow {
		top: -145px;
		left: 50%;
	}
	#webopencampus .employment_skillup .content .step3 .arrow {
		left: 40px;
	}
	#webopencampus .employment_skillup .content .success {
		position: absolute;
		top: -150px;
		left: 0;
		width: 100%;
	}
	#webopencampus .employment_skillup .content .title {
		display: flex;
		align-items: center;
		text-align: left;
		bottom: calc(100% + 5px);
		font-size: 12px;
		line-height: 1.2;
	}
	#webopencampus .employment_skillup .content .title .num {
		display: flex;
		border: 2px solid;
		width: 24px;
		height: 24px;
		font-size: 16px;
		margin-right: 4px;
	}
	#webopencampus .employment_skillup .notes {
		font-size: 12px;
	}
}

/* employment_bnr
============================================================================================================ */
#webopencampus .employment_bnr {
	position: relative;
	z-index: 3;
}
#webopencampus .employment_bnr h3 {
	margin-bottom: 20px;
	text-align: center;
	font-size: 26px;
	line-height: 1.5;
}
#webopencampus .employment_bnr .content {
	padding: 40px 0;
	background: linear-gradient(to right, #64c8b9 0%, #0275ff 100%);
}
#webopencampus .employment_bnr .content a {
	max-width: 880px;
	display: flex;
	margin: auto;
	color: #fff;
	text-decoration: none;
	text-align: center;
}
#webopencampus .employment_bnr .content a .l {
	font-size: 27px;
	font-weight: bold;
	line-height: 1.6;
}
#webopencampus .employment_bnr .content a .a {
	overflow: hidden;
	position: relative;
	padding: 18px;
	margin: 25px 0 15px;
	background-color: #fff;
	color: #000;
	font-weight: bold;
	font-size: 27px;
	line-height: 1.5;
	clip-path: polygon(32px 0, 100% 0, 100% 100%, 32px 100%, 0 50%);
}
#webopencampus .employment_bnr .content a .a span {
	display: inline-block;
}
@media (min-width: 481px) {
	#webopencampus .employment_bnr .content a > div {
		width: 640px;
		margin-left: auto;
		padding-top: 20px;
	}
	#webopencampus .employment_bnr .content a:hover {
		opacity: 0.7;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_bnr h3 {
		font-size: 18px;
	}
	#webopencampus .employment_bnr .content {
		padding: 20px 0;
		background-color: #008ac5;
	}
	#webopencampus .employment_bnr .content a .img {
		width: 32%;
	}
	#webopencampus .employment_bnr .content a > div {
		width: 65%;
		margin-left: auto;
		font-size: 12px;
	}
	#webopencampus .employment_bnr .content a .l {
		font-size: 16px;
		font-weight: bold;
		line-height: 1.6;
	}
	#webopencampus .employment_bnr .content a .a {
		padding: 10px 0 10px 10px;
		margin: 15px 0 10px;
		font-size: 15px;
		clip-path: polygon(16px 0, 100% 0, 100% 100%, 16px 100%, 0 50%);
	}
}

/* employment_interview
============================================================================================================ */
#webopencampus .employment_interview {
	position: relative;
	padding-top: 30px;
}
#webopencampus .employment_interview header {
	margin-bottom: 60px;
	color: #000;
	font-size: 38px;
	line-height: 1.3;
	text-align: center;
}
#webopencampus .employment_interview header .ff_en {
	margin-bottom: 20px;
	font-size: 148px;
	line-height: 0.9;
	color: #ffae4c;
	font-style: italic;
}
#webopencampus .employment_interview .thumbs {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 50px 0;
}
#webopencampus .employment_interview .thumbs a {
	display: block;
	position: relative;
	cursor: pointer;
	padding: 40px 0;
	text-decoration: none;
	z-index: 1;
}
#webopencampus .employment_interview .thumbs a::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: calc(336 / 510 * 100%);
	background-color: var(--color);
	z-index: -1;
}
#webopencampus .employment_interview .thumbs a .num {
	position: absolute;
	font-size: 100px;
	line-height: 1;
	top: 10px;
	color: #fff;
	z-index: 3;
}
#webopencampus .employment_interview .thumbs a .ph_wrap {
	position: relative;
}
#webopencampus .employment_interview .thumbs a .job {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 84px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	font-size: 22px;
	font-weight: 500;
	text-align: center;
	line-height: 1.2;
	z-index: 2;
}
#webopencampus .employment_interview .thumbs a .job::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: var(--color);
	z-index: -1;
	opacity: 0.8;
}
#webopencampus .employment_interview .thumbs a .job dt {
	position: absolute;
	left: 30px;
	top: -30px;
	width: 78px;
	height: 44px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	color: var(--color);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0.1em;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 1),
#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) {
	padding-right: 20px;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 1) a,
#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) a {
	padding-left: 50px;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 1) a::before,
#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) a::before {
	left: 0;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 1) a .num,
#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) a .num {
	left: 18px;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 3),
#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) {
	padding-left: 20px;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 3) a,
#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) a {
	padding-right: 50px;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 3) a::before,
#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) a::before {
	right: 0;
}
#webopencampus .employment_interview .thumbs li:nth-child(4n + 3) a .num,
#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) a .num {
	right: 18px;
}
@media (min-width: 481px) {
	#webopencampus .employment_interview .w {
		width: 1100px;
	}
	#webopencampus .employment_interview .thumbs li {
		width: 530px;
	}
}
@media (max-width: 480px) {
	#webopencampus .employment_interview::before {
		top: -990px;
	}
	#webopencampus .employment_interview header {
		margin-bottom: 40px;
		font-size: 18px;
	}
	#webopencampus .employment_interview header .ff_en {
		margin-bottom: 15px;
		font-size: 60px;
	}
	#webopencampus .employment_interview .thumbs {
		gap: 10px 0;
		margin: 0 -10px;
	}
	#webopencampus .employment_interview .thumbs li {
		width: 50%;
	}
	#webopencampus .employment_interview .thumbs a {
		padding: 20px 0;
	}
	#webopencampus .employment_interview .thumbs a .num {
		font-size: 40px;
		top: 5px;
	}
	#webopencampus .employment_interview .thumbs a .job {
		height: 40px;
		font-size: 10px;
	}
	#webopencampus .employment_interview .thumbs a .job dt {
		left: 5px;
		top: -10px;
		width: 40px;
		height: 16px;
		font-size: 8px;
	}
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 1),
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) {
		padding-right: 10px;
	}
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 1) a,
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) a {
		padding-left: 10px;
	}
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 1) a .num,
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 2) a .num {
		left: 3px;
	}
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 3),
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) {
		padding-left: 10px;
	}
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 3) a,
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) a {
		padding-right: 10px;
	}
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 3) a .num,
	#webopencampus .employment_interview .thumbs li:nth-child(4n + 4) a .num {
		right: 3px;
	}
}


/* online_soudankai_bnr
============================================================================================================ */
#webopencampus .online_soudankai_bnr {
	max-width: 580px;
	margin-inline: auto;
}

/* page_other
============================================================================================================ */
#webopencampus .page_other {
	padding-bottom: 100px;
	text-align: center;
}
#webopencampus .page_other h2 {
	margin-bottom: 80px;
	padding: 25px;
	background-color: #64c8b9;
	font-size: 36px;
	line-height: 1.5;
	color: #fff;
}
@media (min-width: 481px) {
	#webopencampus .page_other ul {
		display: flex;
		justify-content: center;
		width: 980px;
		margin: 0 auto;
	}
	#webopencampus .page_other li {
		width: 580px;
	}
}
@media (max-width: 480px) {
	#webopencampus .page_other {
		padding-bottom: 80px;
	}
	#webopencampus .page_other h2 {
		margin-bottom: 40px;
		padding: 20px 0;
		font-size: 20px;
		line-height: 1.5;
	}
	#webopencampus .page_other li {
		margin-top: 15px;
	}
	#webopencampus .page_other li a {
		height: 120px;
		font-size: 18px;
	}
}


/* last_section
============================================================================================================ */
#webopencampus .last_section {
	margin-top: -80px;
	text-align: center;
}
#webopencampus .last_section h2 {
	margin-bottom: 200px;
	font-size: 32px;
	line-height: 1.5;
	letter-spacing: 0.08em;
}
#webopencampus .last_section .last_contents {
	position: relative;
	padding-bottom: 730px;
}
#webopencampus .last_section .bnr {
	max-width: 500px;
	margin: 0 auto;
}
#webopencampus .last_section .bnr a {
	text-decoration: none;
	font-size: 28px;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #3692f8;
}
#webopencampus .last_section .bnr a span {
	display: block;
}
#webopencampus .last_section .bnr a .title {
	margin-top: 10px;
}
#webopencampus .last_section .img {
	position: absolute;
	pointer-events: none;
	right: 0;
	left: 0;
	top: -140px;
	max-width: 1070px;
	margin-inline: auto;
	text-align: center;
}
@media (max-width: 480px) {
	#webopencampus .last_section {
		margin-top: -20px;
	}
	#webopencampus .last_section h2 {
		margin-bottom: 30px;
		font-size: 18px;
	}
	#webopencampus .last_section .last_contents {
		padding-bottom: 0;
	}
	#webopencampus .last_section .bnr a {
		font-size: 18px;
	}
	#webopencampus .last_section .bnr a .title {
		margin-top: 5px;
	}
	#webopencampus .last_section .img {
		position: static;
		margin-top: 20px;
	}
}



/* modal_contents
============================================================================================================ */
.modal_contents {
	position: relative;
	width: 720px;
	margin-inline: auto;
	padding: 55px 0 60px 70px;
	z-index: 2;
}
.modal_contents p {
	margin-left: 0;
}
.modal_contents img {
	max-width: 100%;
	height: auto;
}
.interview01 {
	--color: #ec7e8f;
}
.interview02 {
	--color: #567bbd;
}
.interview03 {
	--color: #38b79c;
}
.interview04 {
	--color: #df752f;
}
.interview05 {
	--color: #00a9ce;
}
.interview06 {
	--color: #d9ad1c;
}
.interview07 {
	--color: #8bbf47;
}
.interview08 {
	--color: #f5aa00;
}
.modal_contents::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: calc(420 / 720 * 100%);
	background-color: var(--color);
	z-index: -1;
}
.modal_contents .ph {
	position: relative;
}
.modal_contents .info {
	position: relative;
	min-height: 80px;
	padding: 10px 10px 10px 0;
	align-items: center;
	display: flex;
	color: #fff;
	font-size: 14px;
	line-height: 1.4;
	padding-left: 45px;
	&::before {
		content: "";
		position: absolute;
		inset: 0;
		background-color: #fff;
		z-index: -2;
	}
}
.modal_contents .name {
	font-size: 18px;
	width: 320px;
	flex-shrink: 0;
}
.modal_contents .name b {
	font-size: 22px;
}
.modal_contents .name .from {
	display: block;
	font-size: 14px;
	line-height: 1.2;
}
.modal_contents .graduation {
	color: #000;
}
.modal_contents .job {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 118px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	font-size: 34px;
	font-weight: 700;
	text-align: center;
	line-height: 1.1;
	z-index: 2;
}
.modal_contents .job::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: var(--color);
	z-index: -1;
	opacity: 0.8;
}
.modal_contents .job dt {
	position: absolute;
	left: 40px;
	top: -40px;
	width: 110px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	color: var(--color);
	font-size: 24px;
	font-weight: 700;
}
.modal_contents .contents_box {
	padding: 40px;
	background-color: #fff;
	font-size: 18px;
	line-height: calc(26 / 18);
}
.modal_contents .contents_box .lead {
	margin-bottom: 30px !important;
	color: var(--color);
	font-weight: 700;
	font-size: 38px;
	line-height: 1.6;
}
@media (max-width: 480px) {
	.modal_contents {
		width: calc(100vw - 20px);
		padding: 20px 0 20px 20px;
	}
	.modal_contents::before {
		width: calc(520 / 720 * 100%);
	}
	.modal_contents .info {
		min-height: 0;
		display: block;
		font-size: 10px;
		padding-left: 10px;
		&::before {
			background-color: var(--color);
		}
	}
	.modal_contents .name {
		font-size: 11px;
		width: auto;
	}
	.modal_contents .name b {
		font-size: 15px;
	}
	.modal_contents .name .from {
		display: inline-block;
		font-size: 10px;
	}
	.modal_contents .graduation {
		color: #fff;
	}
	.modal_contents .job {
		height: 70px;
		font-size: 20px;
	}
	.modal_contents .job dt {
		left: 20px;
		top: -20px;
		width: 70px;
		height: 30px;
		font-size: 14px;
	}
	.modal_contents .contents_box {
		padding: 20px;
		font-size: 13px;
	}
	.modal_contents .contents_box .lead {
		margin-bottom: 20px !important;
		font-size: 18px;
	}
}

.modal_hide {
	display: none;
}

.modaal-container {
	background-color: transparent;
	box-shadow: none;
}
.modaal-content-container {
	padding-left: 0;
	padding-right: 0;
}
.modaal-inner-wrapper {
	padding-left: 0;
	padding-right: 0;
}
.modaal-close {
	z-index: 1000;
}

/* mov_show
============================================================================================================ */
@media screen {
	.mov_show.fade {
		opacity: 0;
	}
	.mov_show.fade.showed {
		-webkit-transition: opacity 1.5s;
		-o-transition: opacity 1.5s;
		transition: opacity 1.5s;
		opacity: 1;
	}

	.mov_show.fade_up {
		transform: translateY(30px);
	}
	.mov_show.fade_up.showed {
		transition: all .5s;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}

	.mov_show.fade_left {
		transform: translateX(30px);
	}
	.mov_show.fade_left.showed {
		transition: all .6s;
		transform: translateX(0);
	}

	.mov_show.fade_right {
		transform: translateX(-30px);
	}
	.mov_show.fade_right.showed {
		transition: all .6s;
		transform: translateX(0);
	}

	.mov_show.fade_delay01.showed {
		transition-delay: .1s;
	}
	.mov_show.fade_delay02.showed {
		transition-delay: .2s;
	}
	.mov_show.fade_delay03.showed {
		transition-delay: .3s;
	}
	.mov_show.fade_delay04.showed {
		transition-delay: .4s;
	}
	.mov_show.fade_delay05.showed {
		transition-delay: .5s;
	}

	#webopencampus .category_title h2 span {
		position: relative;
		overflow: hidden;
		transform-origin: 0;
		transform: scaleX(0);
		opacity: 0;
	}
	#webopencampus .category_title h2 span::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: #fff;
	}
	#webopencampus .category_title.showed h2 span {
		transition: transform .5s 0s cubic-bezier(.77,.04,.41,.99), opacity .4s 0s linear;
		transform: scaleX(1);
		opacity: 1;
	}
	#webopencampus .category_title.showed h2 span::after {
		transition: transform .8s 0.4s cubic-bezier(1,0,.47,1);
		transform: translateX(100%);
	}

	#webopencampus .category_title img {
		opacity: 0;
		transform: translateY(10px);
	}
	#webopencampus .category_title.showed img {
		transition: all .5s 0.4s;
		opacity: 1;
		transform: translateY(0);
	}
	#webopencampus .category_title::after {
		opacity: 0;
		transform: translateY(-20px);
	}
	#webopencampus .category_title.showed::after {
		transition: all .5s 0.8s;
		opacity: 1;
		transform: translateY(0);
	}


	#webopencampus .fukidashi_block dt {
		transform: scale(.5);
		opacity: 0;
	}
	#webopencampus .fukidashi_block dd {
		opacity: 0;
	}
	#webopencampus .fukidashi_block .l dd {
		transform: translateX(-10px);
	}
	#webopencampus .fukidashi_block .r dd {
		transform: translateX(10px);
	}
	#webopencampus .fukidashi_block .showed dt {
		transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), opacity .4s;
		transform: scale(1);
		opacity: 1;
	}
	#webopencampus .fukidashi_block .showed dd {
		transition: all .5s 0.2s;
		transform: translateX(0) !important;
		opacity: 1;
	}
	#webopencampus .fukidashi_block .showed .second {
		transition-delay: .5s;
	}

	#webopencampus .employment_data .graph_contents .graph .en {
		position: absolute;
		left: -1px;
		top: -1px;
		right: -1px;
		bottom: -1px;
		border-radius: 100%;
		overflow: hidden;
		z-index: 2;
	}
	#webopencampus .employment_data .graph_contents .graph .en > * {
		overflow: hidden;
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		width: 50.1%;
	}
	#webopencampus .employment_data .graph_contents .graph .en > *:last-child {
		transform-origin: 0 50%;
		transform: rotate(180deg);
	}
	#webopencampus .employment_data .graph_contents .graph .en > *::before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		width: 100%;
		background-color: #1acfd7;
		transform-origin: 0;
	}
	#webopencampus .employment_data .graph_contents.showed .graph .en > *::before {
		transition: transform 0.3s .2s linear;
		transform: rotate(180deg);
	}
	#webopencampus .employment_data .graph_contents.showed .graph .en > *:last-child::before {
		transition: transform 0.7s 0.5s cubic-bezier(0.33, 1, 0.68, 1);
	}
	#webopencampus .employment_data .graph_contents .n {
		opacity: 0;
	}
	#webopencampus .employment_data .graph_contents.showed .n {
		transition: opacity 0.3s 1s;
		opacity: 1;
	}
	#webopencampus .employment_data .graph_contents li {
		opacity: 0;
		transform: translateX(20px);
	}
	#webopencampus .employment_data .graph_contents.showed li {
		transition: all 0.3s 1.3s;
		opacity: 1;
		transform: translateX(0);
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(2) {
		transition-delay: 1.33s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(3) {
		transition-delay: 1.36s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(4) {
		transition-delay: 1.39s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(5) {
		transition-delay: 1.42s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(6) {
		transition-delay: 1.45s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(7) {
		transition-delay: 1.48s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(8) {
		transition-delay: 1.51s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(9) {
		transition-delay: 1.54s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(10) {
		transition-delay: 1.57s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(11) {
		transition-delay: 1.6s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(12) {
		transition-delay: 1.63s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(13) {
		transition-delay: 1.66s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(14) {
		transition-delay: 1.69s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(15) {
		transition-delay: 1.72s;
	}
	#webopencampus .employment_data .graph_contents.showed li:nth-child(16) {
		transition-delay: 1.75s;
	}


	#webopencampus .employment_data .line_contents section li .line {
		transform-origin: 50% 100%;
		transform: scaleY(0);
	}
	#webopencampus .employment_data .line_contents section li .line .cap {
		opacity: 0;
		transform: translate(-50%, 10px);
	}
	#webopencampus .employment_data .line_contents section.showed li .line {
		transition: transform 0.7s 0s cubic-bezier(0.33, 1, 0.68, 1);
		transform: scaleY(1);
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(2) .line {
		transition-delay: 0.1s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(3) .line {
		transition-delay: 0.2s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(4) .line {
		transition-delay: 0.3s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(5) .line {
		transition-delay: 0.4s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(6) .line {
		transition-delay: 0.5s;
	}
	#webopencampus .employment_data .line_contents section.showed li .line .cap {
		transition: all 0.3s 0.7s;
		transform: translate(-50%, 0);
		opacity: 1;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(2) .line .cap {
		transition-delay: 0.8s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(3) .line .cap {
		transition-delay: 0.9s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(4) .line .cap {
		transition-delay: 1s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(5) .line .cap {
		transition-delay: 1.1s;
	}
	#webopencampus .employment_data .line_contents section.showed li:nth-child(6) .line .cap {
		transition-delay: 1.2s;
	}

	#webopencampus .employment_skillup .content > *::before {
		transform-origin: 50% 100%;
		transform: scaleY(0);
	}
	#webopencampus .employment_skillup .content .title {
		opacity: 0;
	}
	#webopencampus .employment_skillup .content ul {
		opacity: 0;
	}
	#webopencampus .employment_skillup .content .arrow {
		opacity: 0;
	}
	#webopencampus .employment_skillup .content .success {
		opacity: 0;
	}
	#webopencampus .employment_skillup .content.showed > *::before {
		transition: transform 0.7s 0s cubic-bezier(0.33, 1, 0.68, 1);
		transform: scaleY(1);
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(2):before {
		transition-delay: 0.2s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(3):before {
		transition-delay: 0.4s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(4):before {
		transition-delay: 0.6s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(5):before {
		transition-delay: 0.8s;
	}
	#webopencampus .employment_skillup .content.showed .title {
		transition: all 0.3s 0.7s;
		opacity: 1;
	}
	#webopencampus .employment_skillup .content.showed ul {
		transition: all 0.3s 0.5s;
		opacity: 1;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(2) ul {
		transition-delay: 0.7s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(3) ul {
		transition-delay: 0.9s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(4) ul {
		transition-delay: 1.1s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(5) ul {
		transition-delay: 1.3s;
	}
	#webopencampus .employment_skillup .content.showed .arrow {
		transition: all 0.3s 0.8s;
		opacity: 1;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(2) .arrow {
		transition-delay: 1s;
	}
	#webopencampus .employment_skillup .content.showed > *:nth-child(3) .arrow {
		transition-delay: 1.2s;
	}
	#webopencampus .employment_skillup .content.showed .success {
		transition: all 0.3s 1.5s;
		opacity: 1;
	}

	#webopencampus .employment_data .map_contents .t {
		opacity: 0;
	}
	#webopencampus .employment_data .map_contents.showed .t {
		opacity: 1;
		transition: opacity .5s linear .5s;
	}
}