/* =========================================================
   ページごとのレイアウト（位置・大きさは旧サイトに合わせています）
   PC：801px〜 / スマホ：〜800px
   ========================================================= */

/* ---------------------------------------------------------
   トップ
   --------------------------------------------------------- */
.ym-hero {
	height: 0;
	padding-top: 62.5%;          /* 横:縦 = 1920:1200 */
	background-position: center center;
	background-size: cover;
}

.ym-home-intro { padding-bottom: 170px; }
.ym-home-intro__catch { position: relative; margin-top: -160px; }
.ym-home-intro__catch img { display: block; width: 100%; }
.ym-home-intro__news {
	position: relative;
	max-width: 644px;
	margin: -68px auto 0;
}

.ym-home-facility { min-height: 309px; background-position: center top; }
.ym-home-facility .ym-container { position: relative; min-height: 309px; }
.ym-home-facility__balloon {
	position: absolute;
	top: -40px;
	left: 66px;
	width: 250px;
	text-align: center;
}
.ym-home-facility__balloon img,
.ym-home-education__balloon img { display: block; width: 250px; }
.ym-home-facility__balloon .ym-btn {
	position: absolute;
	top: 156px;
	left: 50px;
}
.ym-home-facility__catch {
	position: absolute;
	top: 54px;
	right: 90px;
	width: 262px;
}

.ym-home-education { padding: 84px 0 201px; background-position: center top; }
.ym-home-education__inner { max-width: 640px; position: relative; }
.ym-home-education__balloon {
	position: relative;
	z-index: 2;
	width: 250px;
	height: 182px;
}
.ym-home-education__balloon .ym-btn {
	position: absolute;
	top: 156px;
	left: 0;
}
.ym-home-education__photo { position: relative; z-index: 1; }
.ym-home-education__photo img { display: block; width: 100%; }
.ym-home-education__text {
	margin-top: 41px;
	font-size: 16px;
	font-weight: 700;
	line-height: 40px;
}

@media (max-width: 800px) {
	.ym-home-intro { padding-bottom: 61px; }
	.ym-home-intro__catch { margin-top: -80px; }
	.ym-home-intro__news { margin-top: 54px; }
	.ym-home-intro__contact { margin-top: 20px; text-align: center; }

	.ym-home-facility { min-height: 0; padding-bottom: 40px; }
	.ym-home-facility .ym-container { min-height: 0; }
	.ym-home-facility__balloon {
		position: relative;
		top: auto;
		left: auto;
		margin: -40px auto 0;
	}
	.ym-home-facility__catch {
		position: static;
		width: 270px;
		margin-top: -9px;
	}

	.ym-home-education { padding: 28px 0 221px; }
	.ym-home-education__balloon { height: 260px; }
	.ym-home-education__text { margin-top: 124px; }
}

/* ---------------------------------------------------------
   教育内容
   --------------------------------------------------------- */
.ym-narrow { max-width: 640px; }
.ym-edu { padding: 60px 0 141px; }
.ym-edu__title img { display: block; width: 400px; margin: 0 auto; }
.ym-edu .ym-text { margin-top: 20px; }
.ym-edu__lead { margin: 60px 0 40px; }
.ym-edu__lead img { display: block; width: 100%; }
.ym-edu__list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 40px 42px;
	max-width: 1050px;
	margin: 0 auto;
}
.ym-edu__list li { text-align: center; }
.ym-edu__list img { width: 200px; transition: transform .3s ease; }
.ym-modal-link:hover img,
.ym-modal-link:focus img { transform: scale(1.05); }

@media (max-width: 1000px) {
	.ym-edu__list { grid-template-columns: repeat(2, 1fr); padding: 0 30px; }
}
@media (max-width: 800px) {
	.ym-edu { padding: 81px 0 140px; }
	.ym-edu__title img { width: 100%; }
	.ym-edu__lead { margin-bottom: 60px; }
	.ym-edu__list { grid-template-columns: 1fr; gap: 40px; }
}

/* ---------------------------------------------------------
   施設案内
   --------------------------------------------------------- */
.ym-facility { padding-bottom: 40px; }
.ym-facility__image img { display: block; width: 100%; }

/* ---------------------------------------------------------
   入園の流れ
   --------------------------------------------------------- */
.ym-admission { padding: 80px 0 90px; }
.ym-admission__visual img { display: block; width: 100%; }
.ym-admission__body { max-width: 644px; margin: 120px auto 0; }
.ym-admission__title {
	margin-bottom: 0;
	font-size: 35px;
	font-weight: 600;
	line-height: 52.5px;
	text-align: center;
}
.ym-admission__target {
	margin: 0;
	font-size: 20px;
	line-height: 52.5px;
	text-align: center;
}
.ym-flow-table { width: 100%; margin: 20px 0; }
.ym-flow-table th {
	padding: 10px;
	color: #fff;
	font-size: 14.6667px;
	font-weight: 400;
	line-height: 22px;
	text-align: center;
	background: rgba(0, 128, 255, .51);
	border: 1px solid #ccc;
}
.ym-flow-table td {
	padding: 20px 60px;
	font-size: 18px;
	line-height: 27px;
	background: #fff;
	border: 1px solid #ccc;
}
.ym-admission__note { font-size: 16px; font-weight: 700; line-height: 24px; }

@media (max-width: 640px) {
	.ym-admission { padding-bottom: 23px; }
	.ym-admission__body { margin-top: 118px; }
	/* 旧サイトのスマホ表示にある点線（上下） */
	.ym-admission__body::before,
	.ym-admission__body::after {
		content: "";
		display: block;
		height: 4px;
		border-top: 1px dashed #e0dede;
		border-bottom: 1px dashed #e0dede;
	}
	.ym-admission__body::before { margin-bottom: 28px; }
	.ym-admission__body::after { margin-top: 96px; }
	.ym-flow-table th,
	.ym-flow-table td { display: block; width: 100%; border-bottom: 0; }
	.ym-flow-table tr:last-child td { border-bottom: 1px solid #ccc; }
}

/* ---------------------------------------------------------
   年間行事
   --------------------------------------------------------- */
.ym-year { padding: 80px 0; }
.ym-year__title img { display: block; width: 350px; margin: 0 auto; }
.ym-year__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 80px 42px;
	margin-top: 80px;
}
@media (max-width: 800px) {
	.ym-year__title img { width: 100%; }
	.ym-year__grid { grid-template-columns: 1fr; gap: 80px; }
}

/* ---------------------------------------------------------
   園の日常
   --------------------------------------------------------- */
.ym-day { display: flow-root; text-align: center; }
.ym-day .ym-container { max-width: 1170px; padding: 0 70px; }
:where(.ym-day) p,
:where(.ym-day) h2 { margin: 0; }
.ym-day img { display: block; margin: 0 auto; }
.ym-day__center,
.ym-day__music-text,
.ym-day__narrow,
.ym-day__lunch-text {
	font-size: 16px;
	font-weight: 700;
	line-height: 24px;
}
.ym-day__music-text,
.ym-day__narrow,
.ym-day__lunch-text { text-align: justify; }

.ym-day--morning { padding: 80px 0 100px; }
.ym-day__sun img { width: 150px; transform: translateX(173px); }
.ym-day__time { margin-top: 20px; }
.ym-day__time img { width: 300px; }
.ym-day--morning .ym-day__center { margin-top: 20px; }
.ym-day__wide img { width: 900px; }
.ym-day__music {
	position: relative;
	left: -28px;
	width: 571px;
	margin: -120px auto 0;
	min-height: 288px;
}
.ym-day__music-image { position: absolute; top: 0; left: 0; }
.ym-day__music-image img { width: 200px; }
.ym-day__music-text { padding: 128px 0 0 211px; }
.ym-day__mid { margin-top: 53px; }
.ym-day__mid img { width: 700px; }
.ym-day__narrow { max-width: 580px; margin: 40px auto 0 !important; }

.ym-day--lunch { padding: 0 0 20px; background: #fff; }
.ym-day__lunch-time { position: relative; margin-top: -80px !important; }
.ym-day__lunch-time img { width: 150px; }
.ym-day__lunch {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	margin-top: 40px;
	padding-left: 100px;
}
.ym-day__lunch-text { width: 322px; margin-right: 15px !important; }
.ym-day__lunch-image img { width: 450px; margin: 0; }

.ym-day--afternoon { padding: 40px 0; }
.ym-day--afternoon .ym-day__time { margin-top: 0; }
.ym-day--afternoon .ym-day__center { margin-top: 20px; }
.ym-day__six { margin-top: 26px !important; }
.ym-day__six img { width: 600px; }
.ym-day__six--last { margin-top: 40px !important; }

@media (max-width: 800px) {
	.ym-day .ym-container { padding: 0 30px; }
	.ym-day--morning { padding: 100px 0 121px; }
	.ym-day__sun { display: none; }
	.ym-day__time { margin-top: 0; }
	.ym-day__time img,
	.ym-day__wide img,
	.ym-day__six img { width: 270px; }
	.ym-day__center { padding: 0 10px; }
	.ym-day__center br { display: none; }
	.ym-day__music { left: auto; width: auto; margin: 20px auto 0; min-height: 0; }
	.ym-day__music-image { position: static; }
	.ym-day__music-image img { width: 160px; }
	.ym-day__music-text { padding: 20px 0 0; }
	.ym-day__wide { margin-top: 10px; }
	.ym-day__mid { margin-top: 40px; }
	.ym-day__mid img { width: 100%; }
	.ym-day__lunch { display: block; margin-top: 61px; padding-left: 0; }
	.ym-day__lunch-text { width: auto; margin: 0 !important; }
	.ym-day__lunch-image { margin-top: 20px !important; }
	.ym-day__lunch-image img { width: 100%; }
}
