@charset "utf-8";

/* -------------------------------------------------------------------------
	LIFE
========================================================================= */
#life {}
#life section { text-align: center; }

#life .pageNavi { padding: 45px 0 65px; }

#life .pageTitle::before,
#life .pageTitle::after {
	width: 30px;
	height: 30px;
	top: -2px;
	}
#life .day .pageTitle::before {
	left: -45px;	
	background: url("../img/icon_fillflower.svg") no-repeat;
	}
#life .day .pageTitle::after {
	right: -40px;	
	background: url("../img/icon_flower.svg") no-repeat;
	}
#life .curriculum .pageTitle::before {
	left: -45px;	
	background: url("../img/icon_star.svg") no-repeat;
	}
#life .curriculum .pageTitle::after {
	right: -35px;
	background: url("../img/icon_triangles.svg") center no-repeat;
	}
#life .event .pageTitle::before,
#life .event .pageTitle::after {
	height: 30px;
	top: -2px;
	}
#life .event .pageTitle::before {
	width: 28px;
	left: -55px;	
	background: url("../img/icon_squaredot.svg") no-repeat;
	}
#life .event .pageTitle::after {
	width: 30px;
	right: -50px;	
	background: url("../img/icon_circles.svg") center no-repeat;
	}
#life .facilities .pageTitle::before {
	left: -45px;	
	background: url("../img/icon_fillflower.svg") no-repeat;
	}
#life .facilities .pageTitle::after {
	right: -40px;	
	background: url("../img/icon_flower.svg") no-repeat;
	}


/*  ---------------------------------------------------------*/
#life .day { padding-top: 50px; }
#life .day .pageTitle { padding-bottom: 40px; }

#life .lifeMainText {
	font-size: var(--font-size-large);
	line-height: 220%;
	}

#life .dayWrapper {
	padding-top: 70px;
	position: relative;
	}
#life .dayWrapper::before,
#life .dayWrapper::after {
	content: "";
	height: 100%;
	margin: auto;
	position: absolute;
	z-index: -10;
	}
#life .dayWrapper::before {
	width: 8.9%;
	top: 41%;
	left: -12%;
	background: url("../life/img/day_bg_01.svg") top left / contain no-repeat;
	}
#life .dayWrapper::after {
	width: 48.3%;
	top: 0;
	right: -10%;
	background: url("../life/img/day_bg_02.svg") top right / contain no-repeat;
	}
@media screen and (max-width: 1250px) { #life .dayWrapper::after { right: -8%; } }
@media screen and (max-width: 1190px) { #life .dayWrapper::after { right: -4%; } }

#life .dayBox {
	width: 64%;
	display: flex;
	}
#life .dayBox > dt {
	width: calc((28% / 64)* 100);
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	color: var(--accent-color);
	font-size: 2rem;
	font-weight: 500;
	font-family: var(--font-family-english);
	word-wrap: break-word;
	}
#life .dayBox:not(:last-of-type) > dt::before {
	content: "";
	width: 1px;
	height: 100%;
	position: absolute;
	z-index: -10;
	background: var(--accent-color);
	}
#life .dayBox > dt .time {
	width: calc((15.6% / 27.5)* 100);
	padding: 8px 0;
	display: block;
	border-radius: 50px;
	background: var(--accent-color);
	color: #FFF;
	letter-spacing: 0.2rem;
	}
#life .dayBox > dt .timeText {
	padding: 10px 0 3px;
	line-height: 160%;
	}
#life .dayBox > dt > span { background: #FFF; }
#life .dayBox > dd {
	width: calc((36% / 64)* 100);
	padding-bottom: 40px;
	text-align: left;
	}
#life .dayBox > dd > p { padding-top: 10px; }

#life .dayBox:nth-of-type(1),
#life .dayBox:nth-of-type(3),
#life .dayBox:nth-of-type(5),
#life .dayBox:nth-of-type(7) {
	flex-direction: row-reverse;
	justify-content: flex-end;
	}
#life .dayBox:nth-of-type(1) dt {
	margin-top: 130px;
	position: relative;
	}
#life .dayBox:nth-of-type(1) dt::after {
	content: "";
	width: 55px;
	height: 52px;
	top: -80px;
	position: absolute;
	background: url("../img/icon_star.svg") no-repeat;
	}
#life .dayBox:nth-of-type(2) { margin: -15% 0 0 auto; }
#life .dayBox:nth-of-type(2) dt { margin-top: 90px; }
#life .dayBox:nth-of-type(3) { margin-top: -16%; }
#life .dayBox:nth-of-type(3) dt { margin-top: 100px; }
#life .dayBox:nth-of-type(4) { margin: -22% 0 0 auto; }
#life .dayBox:nth-of-type(4) dt { margin-top: 100px; }
#life .dayBox:nth-of-type(5) { margin-top: -10%; }
#life .dayBox:nth-of-type(5) dt { margin-top: 100px; }
#life .dayBox:nth-of-type(6) { margin: -12% 0 0 auto; }
#life .dayBox:nth-of-type(6) dt { margin-top: 90px; }
#life .dayBox:nth-of-type(7) { margin-top: -14%; }
#life .dayBox:nth-of-type(7) dt { margin-top: 90px; }
#life .dayBox:nth-of-type(8) { margin: -10% 0 0 auto; }
#life .dayBox:nth-of-type(8) dt { margin-top: 60px; }


#life .pickupList { padding-top: 10px; }
#life .pickupList > li {
	padding: 8px 0;
	display: flex;
	background: linear-gradient(to right, #B3B3B3 4px, transparent 1px) left bottom / 7px 1px repeat-x;
	}

#life .pickupList > li > p:nth-of-type(1) {
	width: calc((12% / 36)* 100);
	color: var(--accent-color);
	}
#life .pickupList > li > p:nth-of-type(2) {}
#life .pulTime {
	font-size: 2rem;
	vertical-align: bottom;
	}

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#life .day { padding-top: 30px; }
#life .day .pageTitle { padding-bottom: 20px; }
#life .lifeMainText {
	font-size: var(--font-size-medium);
	text-align: left;
	}
#life .dayWrapper { padding-top: 40px; }
#life .dayWrapper::before {
	width: calc((33.9% / 33.5)* 100);
	max-width: 500px;
	top: 23px;
	left: -0.5%;
	background: url("../life/img/day_bg_sp.svg") top left / contain no-repeat;
	}
#life .dayWrapper::after { background: none; }

#life .dayBox {
	width: 100%;
	position: relative;
	flex-direction: column!important;
	}
#life .dayBox:not(:last-of-type)::before {
	content: "";
	width: 1px;
	height: 100%;
	position: absolute;
	top: 0;
	left: calc((3.6% / 33.5)* 100);
	z-index: -10;
	background: var(--accent-color);
	}
#life .dayBox > dt {
	width: 100%;
	flex-direction: row;
	font-size: 2rem;
	}
#life .dayBox > dt::before { display: none; }
#life .dayBox > dt .time {
	width: calc((7.3% / 33.5)* 100);
	padding: 5px 0;
	font-size: var(--font-size-xlarge);
	letter-spacing: 0;
	}
#life .dayBox > dt .timeText {
	padding: 0 0 0 calc((1% / 33.5)* 100);
	text-align: left;
	}
#life .dayBox > dd {
	width: calc((25% / 33.5)* 100);
	margin-left: auto;
	padding-top: 5px;
	padding-bottom: 30px;
	}
#life .dayBox {
	margin: 0 0 0 auto!important;
	justify-content: flex-start!important;
	}
#life .dayBox dt {
	margin-top: 0!important;
	padding-bottom: 0!important;
	}
#life .dayBox:nth-of-type(1) dt::after { display: none; }
#life .pickupList > li > p:nth-of-type(1) {  width: calc((12.2% / 33.5)* 100); }
}


/*  ---------------------------------------------------------*/
#life .curriculum { padding: 110px 0 100px; }
#life .curriculum .pageTitle { padding-bottom: 40px; }
#life .curList {
	margin-top: 60px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 50px;
	}
#life .curList > li {
	width: calc((100% - 100px) / 3);
	}
#life .curList > li dl {
	display: flex;
	flex-direction: column;
	text-align: left;
	}
#life .curList dl > dt {
	padding: 0.7em 0 0.5em;
	color: var(--accent-color);
	font-size: 2rem;
	font-weight: 700;
	line-height: 120%;
	}
#life .curList dl > dd:last-of-type { order: -1; }

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#life .curriculum .pageTitle { line-height: 150%; }
#life .curriculum .pageTitle::before,
#life .curriculum .pageTitle::after { top: 8px; }
#life .curriculum .ptEng { line-height: 100%; }
#life .curList {
	margin-top: 20px;
	}
#life .curList > li {
	width: 100%;
	}
#life .curList dl > dt { font-size: var(--font-size-xlarge); }
}

/*  ---------------------------------------------------------*/
#life .event { padding: 110px 0 100px; }
#life .event .pageTitle { padding-bottom: 40px; }

#life .eventWrapper {
	width: 80%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 40px 20px;
	text-align: left;
	}
#life .eventWrapper > dl {
	width: calc((100% - 100px)/ 6);
	max-width: 120px;
	}
#life .eventWrapper::after {
	content: "";
	width: calc((100% - 100px)/ 6);
	display: flex;
	}
#life .emNum {
	padding-right: 2px;
	font-size:  3.3rem;
	}
#life .eveList { padding-top: 10px; }
#life .eveList > li {
	margin-left: 1em;
	font-size: var(--font-size-small);
	text-indent: -1em;
	line-height: 150%;
	}
#life .eveList > li::before {
	content: "●";
	color: var(--accent-color);
	}
#life .evePhoto {
	padding-top: 40px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	}
#life .evePhoto > li { width: calc((49% / 136.6)* 100); }

#life .note {
	padding-bottom: 40px;
	font-size: var(--font-size-small);
	}

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#life .event { padding: 40px 0 60px; }
#life .event .pageTitle { padding-bottom: 30px; }
#life .eventWrapper > dl {
	width: calc((100% - 40px)/ 3);
	max-width: none;
	}
#life .eventWrapper::after { width: calc((100% - 40px)/ 3); }
#life .evePhoto {
	padding-top: 20px;
	gap: 10px;
	}
#life .evePhoto > li { width: 100%; }
}


/*  ---------------------------------------------------------*/
#life .facWrapper {
	text-align: center;
	background: url("../life/img/facilities_bg.svg") calc(50% + 0px) 70px / 1165px auto no-repeat;
	}
#life .facPhotos {
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 40px 2%;
	}
#life .facPhotos { padding-bottom: 100px; }
#life .facPhotos > li:nth-of-type(1) { order: 1; }
#life .facPhotos > li:nth-of-type(2) { order: 2; }
#life .facPhotos > li:nth-of-type(3) { order: 4; }
#life .facPhotos > li:nth-of-type(4) { order: 3; }
#life .facPhotos > li:nth-of-type(5) { order: 5; }
#life .facPhotos > li:nth-of-type(6) { order: 6; }
#life .facPhotos > li:nth-of-type(1) { width: 100%; }
#life .facPhotos > li:nth-of-type(2),
#life .facPhotos > li:nth-of-type(3) { width: 59%; }
#life .facPhotos > li:nth-of-type(4),
#life .facPhotos > li:nth-of-type(5),
#life .facPhotos > li:nth-of-type(6) { width: 31.5%; }
#life .facPhotos > li:nth-of-type(5) { margin-top: -16%; }
#life .facPhotos > li:nth-of-type(6) { margin: -32% 0 auto auto; }

/* SMARTPHONE ONLY */
@media screen and (max-width: 768px) {
#life .facWrapper {
	background: none;
	overflow: hidden;
	}
#life .facPhotos {
	background: none!important;
	}
#life .facPhotos {
	padding: 20px 0 50px;
	gap: 38px 0;
	}
#life .facPhotos::after {
	content: "";
	width: calc((29.5% / 33.5)* 100);
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	right: 10px;
	background: url("../life/img/facilities_bg_sp.svg") center top / 100% auto no-repeat;
	}
#life .facPhotos > li:nth-of-type(1) { order: 1; }
#life .facPhotos > li:nth-of-type(2) { order: 2; }
#life .facPhotos > li:nth-of-type(3) { order: 3; }
#life .facPhotos > li:nth-of-type(4) { order: 4; }
#life .facPhotos > li:nth-of-type(5) { order: 5; }
#life .facPhotos > li:nth-of-type(6) { order: 6; }
#life .facPhotos > li:nth-of-type(1),
#life .facPhotos > li:nth-of-type(2),
#life .facPhotos > li:nth-of-type(3) { width: 100%; }
#life .facPhotos > li:nth-of-type(4),
#life .facPhotos > li:nth-of-type(5),
#life .facPhotos > li:nth-of-type(6) { width: calc((16% / 33.5)* 100); }
#life .facPhotos > li:nth-of-type(5) { margin-top: 0; }
#life .facPhotos > li:nth-of-type(6) { margin: 0 auto auto 0; }
#life .facPhotos > li img { object-fit: cover; }
#life .facPhotos > li:nth-of-type(1) img,
#life .facPhotos > li:nth-of-type(2) img,
#life .facPhotos > li:nth-of-type(3) img { height: 170px; }
#life .facPhotos > li:nth-of-type(4) img,
#life .facPhotos > li:nth-of-type(5) img,
#life .facPhotos > li:nth-of-type(6) img { height: 120px; }
}