@charset "UTF-8";

/* CSS Document */
@media screen and (max-width: 599px) {
body { font-size: 13px; }
.drawer { display: block; }
.spbr { display: block; margin-left: 0 !important; }
.sp_logo { display: block; width: 80%; min-width: auto; margin-left: auto; margin-right: auto; margin-top: 3em; margin-bottom: 3em; }
.sp_logo2 { display: block; width: 26%; min-width: auto; margin-left: auto; margin-right: auto; margin-top: 2em; margin-bottom: 1.5em; }
.title { font-size: 1.2em; font-weight: 500; }
.caption { font-size: 0.8em; line-height: 2em; }
.rl { -webkit-writing-mode: horizontal-tb; -moz-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; }
.top_clear { clear: both; margin-bottom: 2em; }

/* map */
iframe { width: 100%; height: 300px; }

/* wrapper */
#wrapper { min-width: 300px; position: relative; width: 100%; margin-right: auto; margin-left: auto; }

/* side */
#side { display: none; }

/* side */
.drawer-menu li i { font-size: 0.8em; display: inline-block; vertical-align: middle; margin-left: 0.6em; margin-bottom: 0.7em; }
.drawer-menu li i img { width: 1.15em; vertical-align: middle; }

/* contents */
#contents { width: 100%; float: none; }

/* top_main */
#top_main { margin-bottom: 2em; }
#top_main .fade { height: 25em; overflow: hidden; position: relative; margin-bottom: 0; }
#top_main .fade li img { position:absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: auto; height: auto; min-width: 100%; min-height: 100%; max-width: 160%; }

/* top */
#top { width: 90%; margin-left: auto; margin-right: auto; }
#top_news { width: 100%; float: none; }
#top_news h2 { display: inline-block; width: auto; margin-right: 0; margin-bottom: 1.5em; font-size: 1.6em; letter-spacing: 0.15em; background-image: none; padding-top:0; }
#top_news ul { display: inline-block; width: 100%; border-top: 1px solid #000; border-bottom: 1px solid #000; text-align: left; }
#top_news ul li { font-size: 0.85em; line-height: 1.75em; border-bottom: 1px solid #000; padding-top: 0.85em; padding-bottom: 0.85em; }
#top_zousan { width: 100%; float: none; margin-top: 2em; }
#top_zousan h2 { display: inline-block; width: auto; margin-right: 0; margin-bottom: 1.5em; font-size: 1.6em; letter-spacing: 0.15em; background-image: none; padding-top:0; }
#top_zousan ul { display: inline-block; width: 100%; text-align: left; }
#top_zousan ul li { width: 48%; float: left; display: inline-block; position: relative; }
#top_zousan ul li:nth-child(2) { float: right; }
#top_banner { width: 100%; float: none; margin-top: 0; overflow: hidden; }
#top_banner li { display: block; width: 100%; margin-right: 0; float: none; margin-bottom:1em; border: 1.2px solid #000 !important; }
#top_banner li:last-child { margin-right: 0; margin-bottom:0; }
#top_map { width: 100%; float: none; margin-top: 2em; }

/* 下層共通 */
#layer_main { height: auto; overflow: hidden; position: relative; margin-bottom: 3em; }
#layer_main .fade { height: 20em; overflow: hidden; position: relative; margin-bottom: 0; }
#layer_main .fade li img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: auto; height: auto; min-width: 100%; min-height: 100%; max-width: 160%; }
#layer_nav { width: 90%; text-align: center; margin-left: auto; margin-right: auto; margin-top: 2em; margin-bottom: 2em; }
#layer_nav h2 { display: block; font-size: 1.6em; vertical-align: middle; margin-right: 0; margin-bottom: 1em; letter-spacing: 0.1em; }
#layer_nav ul { display:none; }
#layer_nav .album_nav { display:block; text-align: center; margin-left: auto; margin-right: auto; width:100%; }
#layer_nav .album_nav li { font-size: 1em; display: block; margin-bottom: 1.2em; }
#layer_nav .album_nav li a { border: 1px solid #000 !important; border-radius: 22px; padding: 0.6em 1em 0.6em 1em; margin-right: auto; margin-left:auto; width:100%; display:block; }
#layer { width: 90%; text-align: justify; margin-left: auto; margin-right: auto; }
#layer .block { margin-bottom: 3em; overflow: hidden; clear: both; }
#layer .block:last-child { margin-bottom: 0; }
#layer .block h3 { float: none; font-size: 1.6em; letter-spacing: 0.15em; text-align: center; margin-bottom: 1.5em; -webkit-writing-mode: horizontal-tb; -moz-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; }
#layer .block p { float: none; width: 100%; }
#layer .block ul { float: none; width: 100%; }

/* 園のこと */
#layer #gaiyo li { display: inline-block; margin-right: 4%; vertical-align: top; width: 100%; }
#layer #gaiyo li:nth-child(2) { width: 100%; margin-right: 0; margin-top: 1em; }
#layer #gaiyo li dt { display: inline-block; width: 5em; margin-right: 1em; vertical-align: top; }
#layer #gaiyo li dd { display: inline-block; vertical-align: top; }
#layer #ayumi li { display: inline-block; vertical-align: top; width: 100%; font-size:0.85em; line-height:1.85em; }
#layer #ayumi li:nth-child(2) { width: 100%; }
#layer #ayumi li dt { display: inline-block; width: 5em; margin-right: 1em; vertical-align: top; }
#layer #ayumi li dd { display: inline-block; vertical-align: top; }
#layer #ayumi .photo { width: 100% !important; margin-top: 2em; }
#layer #ayumi .photo li { display: block; width: 100% !important; margin-bottom: 0.7em; margin-right: 0; }
#layer #ayumi .photo li:nth-child(2) { display: block; width: 100% !important; margin-bottom: 0; margin-right: 0; }
#layer #ensya li { display: block; width: 100%; margin-right: 0; margin-bottom: 1.5em; }
#layer #ensya li:nth-child(2) { width: 100%; }
#layer #access { padding-top: 3em; margin-top: -6em; }
#layer #access ul { margin-bottom: 2em; }
#layer #access ul:nth-child(3) { margin-bottom: 0; }
#layer #access li { display: block; width: 100%; margin-right: 0; margin-bottom: 2em; }
#layer #access li:nth-child(2) { width: 100%; margin-right: 0; }
#layer #mokuhyo li:first-child { width: 100%; display: block; margin-right: 0; margin-bottom: 2em; }
#layer #mokuhyo li:nth-child(2) { width: 100%; display: block; }

/* 教育保育 */
#layer #rinen h4 { font-size: 1.2em; margin-bottom: 1em; letter-spacing: 0.1em; }
#layer #rinen p { float: none; width: 100%; }
#layer #rinen #rinen1 { margin-bottom: 3em; }
#layer #rinen #rinen1 li:first-child { width: 100%; float: none; margin-bottom: 1em; }
#layer #rinen #rinen1 li:nth-child(2) { width: 100%; float: none; }
#layer #rinen #rinen2 li:first-child { width: 100%; float: none; margin-bottom: 1em; }
#layer #rinen #rinen2 li:nth-child(2) { width: 100%; float: none; }
#layer #youtien { margin-bottom: 4em; }
#layer .schedule { margin-bottom: 6em; }
#layer .timeline li { overflow: hidden; margin: 0; position: relative; }
#layer .timeline-date {width: 18%;font-size: 1.4em;text-align: right;margin-right: 5%;float: left;line-height: 1em;}
#layer .timeline-date:after {content: '';width: 0.6em;height: 0.6em;background: #000;position: absolute;left: 21%;border-radius: 100%;}
#layer .timeline-content {width: 77%;float: left;padding-left: 5%;padding-bottom: 4em;border-left: 1px #000 solid;}
#layer .timeline-content li:first-child { width: 100%; display: block; margin-right: 0; margin-bottom: 1em; }
#layer .timeline-content li:nth-child(2) { width: 100%; display: block; margin-right: 0; }
#layer .timeline li:last-child .timeline-content { border-left: none; }
#layer .timeline-content li dt { font-size: 1.2em; margin-bottom: 1em; }
#layer .timeline li:last-child .timeline-content { padding-bottom: 0; }
#layer .timeline-content li dt span { display: block; margin-top: 0.5em; font-size: 0.75em; }
#layer .timeline-content ul:nth-child(2) { margin-top: 2em; }
#layer #hoikuen .timeline li:last-child .timeline-content { padding-bottom: 0; }
#layer #hoikuen .timeline li:last-child .timeline-date:after { bottom: auto; }
#layer #year .year_1 { overflow: hidden; clear: both; margin-bottom: 3em; }
#layer #year .year_1 .event_photo { float: none; width: 100%; margin-bottom: 1em; }
#layer #year .year_1 .event_contents { float: none; width: 100%; padding-top: 1em; }
#layer #year .year_2 { overflow: hidden; clear: both; margin-bottom: 3em; }
#layer #year .year_2 .event_photo { float: none; width: 100%; margin-bottom: 1.5em; }
#layer #year .year_2 .event_contents { float: none; width: 100%; padding-top: 1em; }
#layer #year .event_contents .event_month { font-weight: bold; font-size: 4em; margin-bottom: 0.5em; float: none; color: #e63700; text-align:center; }
#layer #year .event_contents .event_month span { margin-left: 1em; font-size: 0.3em; vertical-align: middle; }
#layer #year .event_contents .event_name { margin-bottom: 1em; }
#layer #year .event_contents .event_name p { font-size: 1.2em; margin-bottom: 0.5em; margin-left: 0; width: auto; float: none; }
#layer #year .event_contents ul { float: none; width: 100%; }
#layer #year .event_contents li { font-size: 0.85em; line-height: 1.2em; margin-bottom: 0.75em; width: 23%; padding: 0.6em 0.4em 0.6em 0.4em; border: 1px solid #ccc !important; color: #ccc; border-radius: 22px; display: inline-block; text-align: center; }
#layer #year .event_contents .on { border: 1px solid #000 !important; color: #000; }
#layer #lunch li { width: 100%; margin-right: 0; margin-bottom: 2em; display: block; }
#layer #lunch li:nth-child(2) { margin-right: 0; }
#layer #lunch li dt { margin-bottom: 1em; }
#layer #lunch li dd { margin-bottom: 0.5em; }
#layer #bus li { width: 100%; margin-right: 0; margin-bottom: 2em; display: block; }
#layer #bus li p { width: 100%; float: none; margin-bottom: 2em; }
#layer #bus li .box { border: 1px solid #000; padding: 1em; text-align: center; }
#layer #bus li:nth-child(2) { margin-right: 0; }

/* 入園 */
#layer #bosyu div { width: 100%; float: none; margin-bottom: 2em; }
#layer #bosyu p { width: 100%; float: none; margin-bottom: 1em; }
#layer #bosyu ul { width: 100%; float: none; }
#layer #bosyu li { width: 100%; margin-right: 0; margin-bottom: 2em; display: block; }
#layer #bosyu li p { width: 100%; float: none; margin-bottom: 2em; overflow: hidden; clear: both; }
#layer #bosyu li .box { border: 1px solid #000; padding: 1em; text-align: center; }
#layer #bosyu li:nth-child(2) { margin-right: 0; }
#layer #price div { width: 100%; float: none; margin-bottom: 2em; }
#layer #price p { width: 100%; float: none; margin-bottom: 1em; }
#layer #price ul { width: 100%; float: none; }
#layer #price table { border: 1px solid #000; border-collapse: collapse; text-align: center; width: 100%; margin-bottom: 2em; font-size: 0.45em !important; line-height: 1.75em; }
#layer #price td, th { border: 1px solid #000; border-collapse: collapse; padding: 1em; }
#layer #price table td:first-child { width: 20% !important; }
#layer #question { margin-top: 3em; }
#layer #question div { width: 100%; float: none; margin-bottom: 2em; }
#layer #question dt { margin-bottom: 1em; border-left: 4px solid #e63700; padding-left: 0.7em; font-size: 1.4em; }
#layer #question dd { margin-bottom: 3em; }
#layer #sien { margin-top: 3em; }
#layer #sien div { width: 100%; float: none; margin-bottom: 2em; }
#layer #sien p { width: 100%; float: none; margin-bottom: 1em; }
#layer #sien .title { border-left: 4px solid #e63700; padding-left: 0.7em; font-size: 1.2em; line-height:1.75em; }

/* アルバム */
#album { width: 90%; text-align: justify; margin-left: auto; margin-right: auto; }
#album .list { margin-bottom: 3em; overflow: hidden; }
#album .list .title { margin-bottom: 0.5em; }
#album .list li { float: none; width: 100%; margin-right: 0; margin-bottom: 1em; }
#album .list li:nth-child(3n) { margin-right: 0; }
#album .list li:nth-child(4n) { margin-right: 0; }
#album .other ul li { width: 100%; float: none; display: inline-block; position: relative; margin-right: 0; margin-bottom: 2em; }
#album .other ul li:nth-child(3n) { margin-right: 0; }
#album .other ul li:nth-child(4n) { margin-right: 2%; }
#album .other ul li dt { font-size: 0.8em; line-height: 1em; background-color: #FFF; padding-left: 0.6em; padding-top: 0.6em; position: absolute; right: -1px; bottom: -1px; white-space: nowrap; }
#album .other ul li dd { font-size: 0.8em; line-height: 1em; position: absolute; top: -1px; left: 0px; white-space: nowrap; }
#album .other ul li dd .class { margin-right: 0; width: auto; color: #FFF; background-color: #e63700; padding-right: 0.5em; padding-top: 0.5em; padding-left: 0.5em; padding-bottom: 0.6em; }
#album .other ul li dd .date { margin-right: 0; float: none; width: auto; background-color: #FFF; padding-right: 0.5em; padding-left: 0.5em; padding-top: 0.5em; padding-bottom: 0.6em; }

/* ドキュメンテーション */
#potfolio { width: 90%; text-align: justify; margin-left: auto; margin-right: auto; }
#potfolio .class_select { margin-bottom: 5em; overflow: hidden; }
#potfolio .class_select #youtien { width: 50%; float: left; border-right: 1px solid #000; padding-right: 5%; }
#potfolio .class_select #hoikuen { width: 50%; float: right; padding-left: 5%; }
#potfolio .class_select .title { margin-bottom: 1.5em; }
#potfolio .class_select li a { display: block; border: 1px solid #000 !important; border-radius: 30px; padding: 0.6em 1em 0.6em 1em; margin-bottom: 1.5em; text-align: center; }
#potfolio .class_select li:last-child { margin-bottom: 0; }
#potfolio .class_select li a:hover { border: 1px solid #e63700 !important; color: #e63700 !important; border-radius: 30px; padding: 0.6em 1em 0.6em 1em; text-align: center; }
#potfolio .portfolio_entry { width: 90%; margin-right: auto; margin-left: auto; margin-top: 5em; margin-bottom: 5em; }
#potfolio .portfolio_entry p { margin-bottom: 1.5em; }
#potfolio .portfolio_entry li { margin-bottom: 3.5em; border-bottom: 1px solid #000; padding-bottom: 3.5em; }
#potfolio .portfolio_entry li:last-child { border-bottom: none; }

/* ぞうさんだより */
#zousan { min-height:auto; width: 90%; text-align: justify; margin-left: auto; margin-right: auto; margin-top: 5em; }
#zousan .entrybody { width: 90%; margin-right: auto; margin-left: auto; margin-bottom: 8em; text-align: justify; }
#zousan .other ul li { width: 100%; float: none; display: inline-block; position: relative; margin-right: 0; margin-bottom: 2em; }
#zousan .other ul li:nth-child(3n) { margin-right: 0; }
#zousan .other ul li:nth-child(4n) { margin-right: 2%; }
#zousan .other ul li dt { font-size: 0.8em; line-height: 1em; background-color: #FFF; padding-left: 0.6em; padding-top: 0.6em; position: absolute; right: -1px; bottom: -1px; white-space: nowrap; }
#zousan .other ul li dd { font-size: 0.8em; line-height: 1em; position: absolute; top: -1px; left: 0px; white-space: nowrap; }
#zousan .other ul li dd .class { margin-right: 0; width: auto; color: #FFF; background-color: #e63700; padding-right: 0.5em; padding-top: 0.5em; padding-left: 0.5em; padding-bottom: 0.6em; }
#zousan .other ul li dd .date { margin-right: 0; float: none; width: auto; background-color: #FFF; padding-right: 0.5em; padding-left: 0.5em; padding-top: 0.5em; padding-bottom: 0.6em; }

/* recruit */
.pcbr { display:inline; }
.spbr { display:block; }
#layer #recruit_massage h4 { font-size: 1.4em; line-height: 2em; letter-spacing: 0.15em; color: #e63700; margin:2.5em auto 3em auto; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }
#layer #recruit_massage .lead { border-left:solid 1px #e63700; padding:0 0 0 10%; margin:0 auto 3em auto; width:90%; }
#layer #recruit_massage .lead p { float: none; margin:0 0 1.6em 0; line-height: 2em; }
#layer #recruit_voice .voice_ex { width:100%; float:right; overflow: hidden; padding:0 0 8em 0; }
#layer #recruit_voice .voice_ex .thumb { float:none; width:100%; }
#layer #recruit_voice .voice_ex .txt { position: relative; float:none; width:90%; border-bottom: solid 1px #e63700; padding:2em 0 2em 0; margin:0 auto 0 auto; }
#layer #recruit_voice .voice_ex .txt .title { font-size: 1.2em; font-weight: normal; line-height: 1.8em; letter-spacing: 0.1em; color: #e63700; margin:0 0 0.75em 0; }
#layer #recruit_voice .voice_ex .txt .ex { font-size: 0.9em; line-height: 2em; margin:0 0 1em 0; }
#layer #recruit_voice .voice_ex .txt .profile { font-size: 0.7em; line-height: 1.6em; color: #e63700; }
#layer #recruit_voice .voice_ex .txt::after { position: absolute; bottom:-11px; right:20%; z-index: 99; transform: rotate(-45deg); content:""; background-color: #fff; border-left:solid 1px #e63700; border-bottom:solid 1px #e63700; width:20px; height:20px; }
#layer #recruit_voice .voice_ex:nth-child(odd) .thumb { float:none; }
#layer #recruit_voice .voice_ex:nth-child(odd) .txt { float:none; }
#layer #recruit_voice .voice_ex:last-child { padding:0 0 2em 0; }
#layer #recruit_bosyu .bosyu_ex { width:100%; float:right; border:solid 1px #e63700; margin:0 0 3em 0; padding:2.5em 2em; }
#layer #recruit_bosyu .bosyu_ex dl { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: space-between; align-items: stretch; margin:0 0 1em 0; }
#layer #recruit_bosyu .bosyu_ex dt { line-height: 1.6em; color: #e63700; border-bottom:none; width:100%; padding:0; }
#layer #recruit_bosyu .bosyu_ex dd { line-height: 1.6em; border-bottom:solid 1px #e63700; width:100%; padding:0 0 1em 0; margin:0 0 1em 0; }
#layer #recruit_bosyu .bosyu_ex .bosyu_bn a { font-size: 1.2em; display:block; border:solid 1px #e63700 !important; background-color:#e63700; padding:0.5em; text-align:center; color:#fff; width:100%; border-radius: 2em; -webkit-border-radius: 2em; -moz-border-radius: 2em; margin:0 0 0 0; }
#layer #recruit_bosyu .bosyu_ex .bosyu_bn a:hover { background-color: #fff; color:#e63700; }

/* contact */
#layer #attention { width: 100%; float: none; }
#layer #attention p { margin-bottom: 2em; }
#layer #form { width: 100%; float: none; }
#layer #form .data { text-align: left; }
#layer #form .data dt { margin-bottom: 0.25em; }
#layer #form .data dd { margin-bottom: 1em; }
#layer #form .data input { width: 100%; line-height: 2.2em; border: 1px solid #000; padding: 1%; font-size: 1em; }
#layer #form .data select { width: 100%; height: 40px; line-height: 2.2em; border: 1px solid #000; padding: 6px; font-size: 1em; background-color: #fff; }
#layer #form .data textarea { width: 100%; line-height: 2.2em; border: 1px solid #000; padding: 1%; font-size: 1em; }
#layer #form .data .submit { text-align: center; }
#layer #form .data .submit input { width: 100%; background-color: #000; border-style: none; font-size: 100%; padding: 15px 25px; color: #FFF; }

/* footer */
#footer { width: 90%; margin-top: 2em; margin-bottom: 2em; margin-left: auto; margin-right: auto; text-align: left; }
#footer li { display: inline-block; margin-left: 0; font-size: 0.7em; line-height: 1.75em; text-align: left; vertical-align: top; }
#footer #ft_logo { display: none; }
#footer .sp_footer_nav { display:block; }
#footer .sp_footer_nav:nth-child(3) { margin-bottom:1em; }
#footer .sp_footer_nav li { margin-right:1em; margin-bottom:0.5em; font-size: 1em !important; }

}