@charset "utf-8";


body {
	font-size: 0;
}

main {}

#mv {
	height: 480px;
	width: 100%;
	background: url(../images/campus-life/mv-bg-image.png) no-repeat center bottom / auto 100%, url(../images/campus-life/mv-bg-line.png) repeat center / 20px;
}
#mv .inner {
	margin: 0 auto;
	max-width: 1000px;
	padding: 143px 0 0;
}
#mv h1 {
	width: 420px;
	max-width: 90%;
	aspect-ratio: 2.8 / 1;
	font-size: 0;
	background: url(../images/campus-life/mv-title.png) no-repeat center / cover;
	margin: 0 20px 0;
}
#mv p {
	font-size: 16px;
	line-height: 2.2;
	margin: 24px 0 0;
	text-align: center;
	width: 470px;
	max-width: 100%;
}

#event {}
#event article {
	background: url(../images/campus-life/event-bg01.png) repeat center / 36px;
	padding-bottom: 100px;
	position: relative;
}
#event article:nth-of-type(even) {
	background-image: url(../images/campus-life/event-bg02.png);
}
#event article:nth-of-type(1)::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 20px;
	width: 326px;
	aspect-ratio: 1;
	background: url(../images/campus-life/event01-bottom.png) no-repeat center bottom / contain;
}
#event article:nth-of-type(2)::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0px;
	width: 370px;
	aspect-ratio: 1;
	background: url(../images/campus-life/event02-bottom.png) no-repeat center bottom / contain;
}
#event article .inner {
	margin: 0 auto;
	max-width: 1220px;
}
#event article h2 {
	font-size: 0;
	height: 150px;
	margin: 0 90px;
	background: no-repeat left bottom;
}
#event article:nth-of-type(1) h2 {
	background-image: url(/new_assets/images/campus-life/event01-title.png);
	background-size: auto 106px;
}
#event article:nth-of-type(2) h2 {
	background-image: url(/new_assets/images/campus-life/event02-title.png);
	background-size: auto 106px;
}
#event article:nth-of-type(3) h2 {
	background-image: url(/new_assets/images/campus-life/event03-title.png);
	background-size: auto 148px;
	height: 184px;
}
#event article:nth-of-type(4) h2 {
	background-image: url(/new_assets/images/campus-life/event04-title.png);
	background-size: auto 212px;
	height: 204px;
}
#event article:nth-of-type(5) h2 {
	background-image: url(/new_assets/images/campus-life/event05-title.png);
	background-size: auto 177px;
	height: 204px;
}
#event article p {
	font-size: 16px;
	line-height: 1.8;
	margin: 18px 90px 0;
}
#event article picture {
	display: block;
	margin: -14px 0 0;
}
#event article picture img {}
#event article .movie {
	margin: 20px 0 0;
	text-align: center;
}
#event article .movie::before {
	content: '';
	display: block;
	width: 100%;
	height: 36px;
	background: url(/new_assets/images/campus-life/movie-title.png) no-repeat center / contain;
	margin: 0 0 34px;
}
#event article .movie iframe {
	display: inline-block;
	width: 570px;
	aspect-ratio: 16 / 9;
	max-width: 90%;
	margin: 0 15px 30px;
}
#event article .movie a {
/*
	display: inline-block;
	width: 570px;
	max-width: 90%;
	margin: 0 15px 30px;
	*/
	display: none;
}
#event article .movie a img {}

@media screen and (max-width: 768px) {
main {}
#mv {
	height: 150vw;
	background-image: url(../images/campus-life/mv-bg-sp.png);
	background-size: cover;
}
#mv .inner {
	padding: 25vw 0 0;
}
#mv h1 {
	width: 78vw;
	margin: 0 auto;
}
#mv p {
	font-size: 3.6vw;
	line-height: 2;
}
#event {}
#event article {
	padding-bottom: 25vw;
}
#event article:nth-of-type(even) {}
#event article:nth-of-type(1)::after {
	right: 0;
	width: 57vw;
	background-image: url(../images/campus-life/event01-bottom-sp.png);
}
#event article:nth-of-type(2)::after {
	width: 74vw;
	background-image: url(../images/campus-life/event02-bottom-sp.png);
}
#event article .inner {}
#event article h2 {
	margin: 0 4vw;
}
#event article:nth-of-type(1) h2 {
	background-size: auto 22vw;
	height: 30vw;
}
#event article:nth-of-type(2) h2 {
	background-size: auto 22vw;
	height: 30vw;
}
#event article:nth-of-type(3) h2 {
	background-size: auto 30vw;
	height: 30vw;
}
#event article:nth-of-type(4) h2 {
	background-image: url(/new_assets/images/campus-life/event04-title-sp.png);
	background-size: auto 41vw;
	height: 38vw;
}
#event article:nth-of-type(5) h2 {
	background-image: url(/new_assets/images/campus-life/event05-title-sp.png);
	background-size: auto 38vw;
	height: 40vw;
}
#event article p {
	margin: 3vw 6vw 0;
	font-size: 3.6vw;
}
#event article picture {
	padding: 0 3vw;
}
#event article:nth-of-type(4) picture,
#event article:nth-of-type(5) picture {
	overflow: hidden;
	background: repeat left top / auto 100%;
  animation: event_scroll 20s linear infinite forwards;
}
@keyframes event_scroll {
	0% { background-position: left 0% top; }
	100% { background-position: left 227% top; }
}
#event article:nth-of-type(4) picture {
	background-image: url(../images/campus-life/event04-img-sp.png);
}
#event article:nth-of-type(5) picture {
	background-image: url(../images/campus-life/event05-img-sp.png);
}
#event article picture img {
}
#event article:nth-of-type(4) picture img,
#event article:nth-of-type(5) picture img {
	width: 190%;
	max-width: none;
	opacity: 0;
}
#event article .movie {
	margin: 8.6vw 0 0;
}
#event article .movie::before {
	height: 6.2vw;
	margin: 0 0 8vw;
}
#event article .movie iframe {
	width: 88vw;
	margin: 0 0 9vw;
}
#event article .movie a img {}
}