/* =========================================================
   ページごとのスタイル
   ========================================================= */

/* ---------------------------------------------------------
   トップ
   --------------------------------------------------------- */
.ym-home-hero {
	height: 50vw;
	min-height: 200px;
	max-height: 900px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.ym-home-intro {
	margin: 40px 0;
	padding: 0 20px 41px;
}
.ym-home-intro .ym-col35 { background: rgba(255, 255, 255, .76); }
.ym-home-intro__news { padding: 20px 30px; }
.ym-home-intro__notice {
	padding: 15px 15px 35px;
	background: rgba(255, 255, 255, .5);
	border-radius: 50px;
	text-align: center;
}
.ym-home-intro__notice img { display: inline-block; width: 300px; }

.ym-news {
	margin: 10px;
	overflow: hidden;
	word-break: break-all;
}
.ym-news hr {
	height: 0;
	margin: 0;
	border: 1px inset #808080;
}
.ym-news__item {
	display: block;
	padding: 7px 2px;
	color: #333;
}
.ym-news__item:hover { background-color: #f5f5f5; }
.ym-news__new {
	padding: 1px 5px;
	background-color: #ff4500;
	border-radius: 3px;
	color: #fff;
	font-size: 74%;
	vertical-align: middle;
}

.ym-home-intro__catch { padding-bottom: 0; }
.ym-home-intro__catch-img img {
	display: block;
	width: 402px;
	margin: 0 auto 20px;
}
.ym-home-intro__text {
	margin-bottom: 20px;
	color: #000;
	text-align: center;
}

.ym-home-more {
	margin-top: -20px;
	padding-top: 20px;
	background: #03a9f4;
}
.ym-home-more__link {
	position: relative;
	margin-top: -140px;
	padding: 60px 10px 80px;
}
.ym-home-more__link a {
	display: block;
	width: 61.36%;
	max-width: 675px;
	margin: 0 auto;
	transition: transform .3s;
}
.ym-home-more__link a:hover { transform: translateY(-4px); }
.ym-home-more__link img { display: block; width: 100%; }

@media (max-width: 800px) {
	.ym-home-intro__catch-img img { width: 100%; }
	.ym-home-more__link { padding: 80px 10px 100px; }
	.ym-home-more__link a { width: 100%; max-width: none; }
}

/* ---------------------------------------------------------
   教育内容
   --------------------------------------------------------- */
.ym-cur-intro { padding: 20px 10px 0; }
.ym-col35--wide { padding-bottom: 42px; }
.ym-cur-intro__title {
	margin-top: 53px;
	margin-bottom: 20px;
	text-align: center;
}
.ym-cur-intro__title img { display: inline-block; width: 400px; }
.ym-cur-intro__text {
	padding: 70px 30px 30px;
	color: #000;
	font-size: 18px;
}
.ym-cur-intro__text p { margin-bottom: 20px; }

.ym-cur-list { padding: 50px 60px; }
.ym-cur-list__lead {
	margin: -53px 0 40px;
	text-align: center;
}
.ym-cur-list__items {
	display: flex;
	flex-wrap: wrap;
}
.ym-cur-list__items li {
	width: 22%;
	margin: 0 4% 20px 0;
}
.ym-cur-list__items li:nth-child(4) { margin-right: 0; }
.ym-cur-list__items li:nth-child(n+5) { width: 23%; }
.ym-cur-list__items img { display: block; width: 100%; transition: transform .3s; }
.ym-cur-list__items a:hover img,
.ym-cur-list__items a:focus img { transform: scale(1.04); }

@media (max-width: 800px) {
	.ym-cur-intro { padding-top: 41px; }
	.ym-col35--wide { padding-bottom: 63px; }
	.ym-cur-intro__title img { width: 100%; }
	.ym-cur-list__items { display: block; }
	.ym-cur-list__items li,
	.ym-cur-list__items li:nth-child(n+5) { width: 100%; margin-right: 0; }
}

/* ---------------------------------------------------------
   園の概要
   --------------------------------------------------------- */
.ym-gaiyou {
	padding: 60px 20px 0;
	background-position: center center;
}
.ym-gaiyou__logo {
	width: 30.7%;
	margin: 0 auto;
	padding: 20px 20px 20px;
	background: rgba(255, 255, 255, .9);
	text-align: center;
}
.ym-gaiyou__logo p { margin-bottom: 20px; }
.ym-gaiyou__logo img { display: inline-block; }
.ym-gaiyou__table { position: relative; }
.ym-gaiyou__map { padding-top: 20px; }
.ym-map {
	position: relative;
	height: 0;
	padding: 30px 0 56.25%;
	overflow: hidden;
}
.ym-map__inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ym-map iframe {
	display: block;
	width: 100%;
	height: 860px;
	margin-top: -150px;
}
@media (max-width: 800px) {
	.ym-gaiyou { padding-top: 61px; }
	.ym-gaiyou__logo { width: 100%; }
	.ym-gaiyou__logo img { width: 310px; }
	.ym-map iframe { margin-top: -300px; }
}

/* ---------------------------------------------------------
   入園の流れ
   --------------------------------------------------------- */
.ym-flow__loop {
	position: relative;
	z-index: 0;
	margin-top: -30px;
}
.ym-flow { padding: 40px 10px 20px; }
.ym-flow__title {
	width: 61.36%;
	margin: 0 auto;
	padding: 20px 0 60px;
}
.ym-flow__title img,
.ym-flow__chart img,
.ym-flow__what img { display: block; width: 100%; }
.ym-flow__chart { margin-bottom: 40px; }
.ym-flow__what {
	width: 30.64%;
	margin: 0 auto 40px;
}
.ym-flow__text {
	width: 55.2%;
	margin: 0 auto 20px;
	padding: 10px;
	background: rgba(255, 255, 255, .5);
	border-radius: 50px;
	color: #000;
	font-size: 18px;
}
.ym-flow__text p {
	margin: 0 30px;
	text-align: justify;
}

.ym-flow-photos {
	padding: 80px 10px 20px;
}
.ym-flow-photos__box {
	margin-bottom: 20px;
	background: rgba(255, 255, 255, .7);
}
.ym-flow-photos__main { margin-bottom: 10px; }
.ym-flow-photos .ym-gallery { margin-bottom: -10px; }
.ym-flow-photos__main img { display: block; width: 100%; }

@media (max-width: 800px) {
	.ym-flow { padding-top: 60px; }
	.ym-flow__title { width: 100%; padding-bottom: 80px; }
	.ym-flow__chart { margin-bottom: 0; }
	.ym-flow__chart p { margin-bottom: 20px; }
	.ym-flow__chart .ym-flow__chart-start { margin-bottom: 40px; }
	.ym-flow__chart .ym-flow__chart-start img { width: 150px; margin: 0 auto; }
	.ym-flow__chart p:last-child { margin-bottom: 60px; }
	.ym-flow__what { width: 100%; margin-bottom: 80px; }
	.ym-flow__text { width: 100%; margin-bottom: 40px; }
	.ym-flow-photos { padding-top: 120px; }
}

/* ---------------------------------------------------------
   年間行事
   --------------------------------------------------------- */
.ym-year__head {
	padding: 50px 50px 40px;
	background-position: center center;
	text-align: center;
}
.ym-year__head img { display: inline-block; width: 600px; }
.ym-year__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 4%;
	row-gap: 50px;
	padding-bottom: 80px;
}
@media (max-width: 1160px) {
	.ym-year__grid { padding-left: 30px; padding-right: 30px; }
}
@media (max-width: 800px) {
	.ym-year__head img { width: 100%; }
	.ym-year__grid {
		grid-template-columns: 1fr;
		row-gap: 49px;
		padding: 1px 30px 80px;
	}
}

/* ---------------------------------------------------------
   みんなの1日
   --------------------------------------------------------- */
.ym-day { padding: 0 20px; }
.ym-day .ym-col35 { padding-bottom: 20px; }
.ym-day .ym-col35 p { margin-bottom: 20px; }
.ym-day .ym-col35 img { display: block; width: 100%; }
.ym-day__box {
	margin-bottom: 20px;
	padding: 10px 30px !important;
	border: 1px solid #919191;
}
.ym-day__box hr { margin: 8px 0; }
.ym-day .ym-day__box .ym-day__text {
	margin: 27px 0 20px;
}
@media (max-width: 800px) {
	.ym-day { padding-top: 1px; }
}

/* スマホ：旧サイトの空の列（高さ1px）の分だけずらして揃える */
@media (max-width: 800px) {
	.ym-home-intro__news { margin-top: 1px; }
	.ym-home-intro__catch { margin-top: 5px; }
	.ym-gaiyou__logo { margin-top: 0; }
	.ym-gaiyou__table { margin-top: 2px; }
	.ym-gaiyou__map { margin-top: 1px; }
	.ym-year__grid { row-gap: 49.8px; }
	.ym-day__box { margin-top: 2px; }
}
