@charset "utf-8";
/* CSS Document */



a{
    text-decoration: none;
    transform: 0.5;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

a{
    opacity: 1;
}

a:hover{
    opacity: 0.8;
}

a,
p,
span,
li{
    font-family: heisei-maru-gothic-std, sans-serif;
    font-weight: 400;
    color: #5D5D5D;
    letter-spacing: 0.1em;
}

h1,
h2,
h3,
h4{
    font-family: heisei-maru-gothic-std, sans-serif;
    font-weight: 800;
    color: #000;
}


.flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}


.sp_header,
.tbbr,
.spbr,
#tb_header{
    display: none;
}

body{
    position: relative;
}

#pc_header{
    width: 100%;
    height: auto;
    background: #FFF;
}

#pc_header .inner{
    width: 95%;
    max-width: 1200px;
    margin: 42px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#pc_header a.logo{
    display: block;
    width: 22%;
    max-width: 264px;
    height: auto;
}

ul.menu{
    width: 31%;
    display: flex;
    justify-content: space-between;
}

ul.menu li{
    width: 33%;
    text-align: center;
    padding: 5px 2%;
}

ul.menu li+ li {
  border-left: 1px dashed #755E2F;
}

ul.menu li a{
    color: #787878;
    font-size: clamp(14px, 0.9vw, 18px);
    line-height: 1;
}

ul.menu li a img{
    height: 40px;
    width: 100%;
    object-fit: contain;
    margin-bottom: 12px;
}

.wrap{
   
}

/*********************
ここからTOP共通
*********************/
.sp_img{
    display: none;
}


.top_cts{
    width: 100%;
    padding: 100px 0px;
    text-align: center;
}

.top_cts h2{
    color: #EC5D5D;
    font-size: clamp(24px, 1.7vw, 34px);
    line-height: 1.2em;
    margin-bottom: 50px;
}

.top_cts h2 span{
    display: block; 
    color: #EC5D5D;
    font-weight: 800;
    font-size: clamp(16px, 1.1vw, 20px);
}

.top_cts h2::after{
    content: url("img/h2.svg");
    display: block;
}






.top_event{
    background: url("img/yel_bg.jpg"); 
    position: relative;
}

.top_event::before{
    display: inline-block;
    width: 20%;
    height: 250px;
    content: '';
    background-image: url("img/flour.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 3%;
    left: 3%;
}

.top_event::after{
    display: inline-block;
    width: 10%;
    height: 250px;
    content: '';
    background-image: url("img/balloon.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -10%;
    right: 3%;
}


.top_event .flex{
    width: 90%;
    max-width: 1000px;
    margin: 0 auto 50px auto;
    display: flex;
    justify-content: space-between;
}

.top_event .flex img{
    width: 45%;
    height: auto;
    object-fit: contain;
}

div.txt_box{
    width: 50%;
    text-align: left;
}

div.txt_box h3{
    color: #787878;
    font-size: clamp(20px, 1.25vw, 24px);
    margin-bottom: 42px;
}

div.txt_box p.txt{
    color: #787878;
    font-size: clamp(14px, 0.9vw, 18px);
}

a.viewmore{
    display: inline-block;
    padding: 10px 3%;
    background: #F8AA6E;
    border-radius: 40px;
    border: 4px solid #FFF;
    color: #FFF;
    font-size: clamp(16px, 1.1vw, 20px);
}



.top_news{
    background: url("img/org_bg.jpg");  
    position: relative;
}


.top_news::before{
    display: inline-block;
    width: 20%;
    height: 250px;
    content: '';
    background-image: url("img/tree.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: -15%;
    left: 5%;
}

.top_news::after{
    display: inline-block;
    width: 10%;
    height: 135px;
    content: '';
    background-image: url("img/bird.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 5%;
    right: 1%;
}



.top_news h2{
    display: block;
    width: 30%;
    text-align: center;
    color: #EC5D5D;
    font-size: clamp(24px, 1.7vw, 34px);
    line-height: 1.2em;
    margin-bottom: 50px;
}


.top_news .flex{
    width: 90%;
    max-width: 1000px;
    margin: 0 auto 50px auto;
    align-items: center;
}

ul.news{
    width: 70%;
}

ul.news li{
    width: 100%;
    margin-bottom: 20px;
    position: relative;
}

ul.news li a{
    display: flex;
    align-items: center;
    background: #FFF;
    border-radius: 20px;
    padding: 32px 5%;
}

ul.news li a p.date{
    color: #EC9B5D;
    font-size: clamp(14px, 0.83vw, 16px);
    margin-right: 20px;
    line-height: 1em;
}

ul.news li a h4{
    color: #787878;
    font-size: clamp(15px, 0.9vw, 18px);
    line-height: 1em;
}

ul.news li::after{
    content: url("img/arrow_r.svg");
    position: absolute;
    top: 50%;
    right: 3%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.top_land{
    background: url("img/red_bg.jpg"); 
    position: relative;
}

.top_land .wht_box{
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    background: #FFF;
    border-radius: 40px;
    padding: 50px 3%;
}

.top_land h2{
    color: #EC9B5D;
    font-size: clamp(24px, 1.7vw, 34px);
}

.top_land h2 span{
    color: #EC9B5D;
    font-size: clamp(16px, 1.1vw, 20px);
}

.top_land h2::after{
    display: none;
}

.top_land h2::before{
    display: block;
    content: url("img/land.svg");
    margin-bottom: 20px;
}

.top_land .wht_box p.txt{
    color: #787878;
    font-size: clamp(14px, 0.9vw, 18px);
}

.top_land .wht_box span.date{
    display: inline-block;
    padding: 28px 7%;
    background: #EC6C5D;
    border-radius: 80px;
    color: #FFF;
    font-size: clamp(16px, 1.1vw, 20px);
    margin: 20px 0 50px 0px;
}

.top_land::after{
    display: inline-block;
    width: 20%;
    height: 175px;
    content: '';
    background-image: url("img/cloud.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 5%;
    right: 1%;
}



footer{
    width: 100%;
    background: #FFF4D1;
    text-align: center;
}

footer a{
    display: block;
    width: 30%;
    max-width: 240px;
    margin: 100px auto 0 auto;
}

footer p.adress{
    margin-top: 30px;
    color: #787878;
    font-size: clamp(14px, 0.9vw, 18px);
}

footer p.copy{
    margin-top: 100px;
    color: #787878;
    font-size: clamp(10px, 0.72vw, 14px);
}

a.totop{
    display: block;
    width: 70px;
    position: fixed;
    right: 2%;
    bottom: 30px;
}


/******************
下層ページ共通
******************/

.page_title{
    width: 100%;
    position: relative;
    text-align: center;
}

.page_title img{
}

.page_title h1{
    display: inline-block;
    padding: 20px 5%;
    background: #FFF;
    border-radius: 40px;
    color: #EC9B5D;
    font-size: clamp(24px, 1.7vw, 34px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    line-height: 1.2;
}

.page_title h1 span{
    display: block;
    color: #EC9B5D;
    font-size: clamp(16px, 1.1vw, 20px);
    line-height: 1;
}

.page_cts{
    width: 100%;
    padding: 100px 0px;
}

.page_cts section {
    width: 90%;
    width: 1000px;
    margin: 0 auto 150px auto;
}

section h2{
    color: #EC9B5D;
    font-size: clamp(25px, 1.56vw, 30px);
    display: flex;
    align-items: center;
    margin-bottom: 35px;
}

section h2::before{
    content: url("img/page_h2.svg");
    margin-right: 10px;
}

/******************
保育所概要
******************/


table.about{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0px 10px;
    margin-bottom: 30px;
}


table.about th{
    width: 20%;
    background: #FBBF91;
    border-radius: 40px;
    color: #FFF;
    padding: 20px 0px;
    text-align: center;
}

table.about td{
    width: 80%;
    color: #4E4E4E;
    padding: 20px 5%;
    text-align: left;
}

table.about th,
table.about td{
    font-size: clamp(16px, 0.9vw, 18px);
    font-family: heisei-maru-gothic-std, sans-serif;
    font-weight: 400;
    vertical-align: middle;
}

.page_cts iframe{
    width: 100%;
    height: 350px;
    margin-bottom: 30px;
}

.about2 div{
    width: 48%;
}

.about2 div img{
    width: 100%;
    border-radius: 40px;
    margin-bottom: 20px;
}

.about2 div p{
    width: 100%;
    text-align: center;
    font-size: clamp(14px, 0.9vw, 18px);
    color: #4E4E4E;
}

.red_bld{
    color: #EC5D5D;
    font-size: clamp(20px, 1.25vw, 24px);
    margin-bottom: 30px;
    font-weight: 800;
}

.about3 div{
    width: 30%;
}

.about3 div p{
    width: 100%;
    background: #FFE99F;
    padding: 19px 0px;
    text-align: center;
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
    border-radius: 20px 20px 0 0;
}

.about3 div img{
    width: 100%;
    border-radius: 0 0 20px 20px;
}

.about4{
    align-items: flex-start;
}

.about4 img{
    width: 30%;
    height: auto;
    object-fit: contain;
}

.about4 p{
    width: 65%;
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
}

/******************
保育内容
******************/

ul.feature li{
    background: #FFE99F;
    border-radius: 10px;
    padding: 20px 3%;
    margin-bottom: 15px;
}

ul.feature li p{
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
}

ul.feature li p span{
    display: inline-block;
    color: #EC5D5D;
    font-size: clamp(14px, 0.9vw, 18px);
}

p.txt{
    width: 100%;
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
}

h3.nyuji{
    display: block;
    width: 50%;
    max-width: 475px;
    padding: 10px 0px;
    text-align: center;
    background: #94BE94;
    color: #FFF;
    border-radius: 20px;
    font-size: clamp(20px, 1.45vw, 28px);
    font-weight: 400;
    margin-top: 30px;
}

img.timetable{
    width: 90%;
    max-width: 700px;
    margin: 40px 0;
}

h3.youji{
    display: block;
    width: 50%;
    max-width: 475px;
    padding: 10px 0px;
    text-align: center;
    background: #94A9BE;
    color: #FFF;
    border-radius: 20px;
    font-size: clamp(20px, 1.45vw, 28px);
    font-weight: 400;
    margin-top: 30px;
}

h4.org_tape{
    display: inline-block;
    padding: 15px 5%;
    background: #EC9B5D;
    border-radius: 40px;
    color: #FFF;
    font-size: clamp(14px, 0.9vw, 18px);
    font-weight: 400;
}

table.yel{
    margin-top: 20px;
    border-collapse: separate;
    margin-bottom: 50px;
}

table.yel th{
    background: #FFE99F;
}

table.yel th,
table.yel td{
    padding: 20px 0px;
    text-align: center;
    color: #4E4E4E;
    font-size: clamp(15px, 0.88vw, 17px);
    font-family: heisei-maru-gothic-std, sans-serif;
    font-weight: 400;
    border: 1px solid #4E4E4E;
}

table.honen_yel th,
table.honen_yel td{
    width : calc(100% / 7);
}


h4.grn_tape{
    display: inline-block;
    padding: 15px 5%;
    background: #94BE94;
    border-radius: 40px;
    color: #FFF;
    font-size: clamp(14px, 0.9vw, 18px);
    font-weight: 400;
}

table.grn{
    margin-top: 20px;
    border-collapse: separate;
    margin-bottom: 50px;
}

table.grn th{
    background: #C6E2C6;
}

table.grn th,
table.grn td{
    padding: 20px 0px;
    text-align: center;
    color: #4E4E4E;
    font-size: clamp(15px, 0.88vw, 17px);
    font-family: heisei-maru-gothic-std, sans-serif;
    font-weight: 400;
    border: 1px solid #4E4E4E;
}

table.honen_grn th,
table.honen_grn td{
    width : calc(100% / 6);
}


table.koubunen_yel th,
table.koubunen_yel td{
    width : calc(100% / 4);
}

table.koubunen_grn th,
table.koubunen_grn td{
    width : calc(100% / 6);
}

h4.red_tape{
    display: inline-block;
    padding: 15px 5%;
    background: #EC5D5D;
    color: #FFF;
    font-size: clamp(14px, 0.9vw, 18px);
    border-radius: 40px;
    margin: 50px 0 20px 0;
    font-weight: 400;
}

table.price{
    width: 90%;
    max-width: 750px;
}

table.price{
    border-collapse: separate;
    margin-bottom: 20px;
}

table.price th.grn{
    background: #C6E2C6;
}

table.price th.yel{
    background: #FFE99F;
}

table.price th,
table.price td{
    width : calc(100% / 3);
    padding: 20px 0px;
    text-align: center;
    color: #4E4E4E;
    font-size: clamp(15px, 0.88vw, 17px);
    font-family: heisei-maru-gothic-std, sans-serif;
    font-weight: 400;
    border: 1px solid #4E4E4E;
}


/******************
年間行事
******************/
ul.schedule li{
    background: #FFE99F;
    border-radius: 10px;
    padding: 20px 3%;
    margin-bottom: 15px;
}

ul.schedule li p{
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
    margin: 0;
}

ul.schedule li p.red_bld{
    color: #EC5D5D;
    font-size: clamp(20px, 1.1vw, 22px);
}

p.covid{
    text-align: center;
    color: #EC5D5D;
    font-size: clamp(14px, 0.9vw, 18px);
    margin-top: 30px;
    font-weight: 800;
}

ul.month{
    width: 100%;
    margin-top: 100px;
}

ul.month li{
    width: 100%;
    padding: 44px 3%;
    border-radius: 20px;
    margin-bottom: 20px;
}


ul.month li .top{
    width: 100%;
    display: flex;
    grid-column-gap: 2%;
    align-items: flex-start;
}

ul.month li .top img{
    display: block;
    width: 15%;
    height: auto;
    object-fit: contain;
}

ul.month ul.program{
    width: 40%;
}

ul.month ul.program li{
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
    line-height: 1.2em;
    padding: 0;
    margin: 0;
}

ul.month ul.program li::before{
    content: '●';
    display: inline-block;
    font-size: clamp(16px, 1.1vw, 20px);
}


ul.month li .photo{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
}

ul.month li .photo img{
    width: 23%;
    height: auto;
    object-fit: contain;
}




/*ピンク*/
li.pnk{
    background: #FFE9F6;
}

ul.month li.pnk ul.program li::before{
    color: #E5A0C9;
}

/*グリーン*/
li.grn{
    background: #DCEFDC;
}

ul.month li.grn ul.program li::before{
    color: #94BE94;
}

/*ブルー*/
li.blu{
    background: #EBF1F6;
}

ul.month li.blu ul.program li::before{
    color: #94A9BE;
}

/*オレンジ*/
li.org{
    background: #FFEEE1;
}

ul.month li.org ul.program li::before{
    color: #EC9B5D;
}

/*ブラウン*/
li.brw{
    background: #FFF0E4;
}

ul.month li.brw ul.program li::before{
    color: #806D5E;
}

/*レッド*/
li.red{
    background: #FFE5E5;
}

ul.month li.red ul.program li::before{
    color: #EC5D5D;
}

/*パープル*/
li.ppl{
    background: #EAE5FF;
}

ul.month li.ppl ul.program li::before{
    color: #9C94BE;
}


.beg_box{
    width: 100%;
    background: #FFEEE1;
    padding: 30px 3%;
    border-radius: 10px;
}

.beg_box .top{
    display: flex;
    grid-column-gap: 2%;
}

.beg_box .top ul.list{
    width: 36%;
}

.beg_box .top ul.list li{
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
    line-height: 1.2em;
    padding: 0;
    margin: 0;
}

.beg_box .top ul.list li::before{
    content: '●';
    display: inline-block;
    font-size: clamp(16px, 1.1vw, 20px);
    color: #9C94BE;
}

.beg_box .photo{
    width: 100%;
    display: flex;
    grid-column-gap: 2.6%;
    margin-top: 24px;
}

.beg_box .photo img{
    width: 23%;
    height: auto;
    object-fit: contain;
}

.beg_box p{
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
    margin-top: 24px;
}


/******************
年間行事
******************/

.album{
    width: 100%;
    margin-bottom: 50px;
}

.album h3{
    width: 100%;
    padding: 20px 0px;
    text-align: center;
    border-radius: 20px 20px 0 0;
    font-size: clamp(20px, 1.25vw, 24px);
    color: #FFF;
    font-weight: 400;
}

.album div{
    width: 100%;
    padding: 30px 0px;
    border-radius: 0 0 20px 20px;
}

.album div img{
    display: block;
    width: 80%;
    height: auto;
    object-fit: contain;
    margin: 0 auto;
}

.al_ppl div img:first-of-type{
    margin-bottom: 10px;
}


p.red_txt{
    text-align: center;
    color: #EC5D5D;
    font-size: clamp(20px, 1.25vw, 24px);
    margin-bottom: 20px;
}


/*ピンク*/
.al_pnk h3{
    background: #E5A0C9;
}

.al_pnk div{
    background: #FFE9F6;
}

/*ブルー*/
.al_blu h3{
    background: #94A9BE;
}

.al_blu div{
    background: #EBF1F6;
}

/*グリーン*/
.al_grn h3{
    background: #94BE94;
}

.al_grn div{
    background: #DCEFDC;
}

/*パープル*/
.al_ppl h3{
    background: #9C94BE;
}

.al_ppl div{
    background: #EAE5FF;
}

/******************
おたより
******************/
.topics_flex{
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.topics_flex section {
    width: 47%;
    margin: 0;
    padding: 0;
}

ul.topics{
    width: 100%;   
}

ul.topics li{
    width: 100%;   
    margin-bottom: 20px;
}

ul.topics li a{
    display: flex;
    align-items: flex-end;
    border-radius: 20px;
    padding: 20px 5%;
    color: #000;
    font-size: clamp(14px, 0.9vw, 18px);
}

/*オレンジ*/
ul.org li a{
    background: #FFEEE1;
}

ul.org li a::before{
    display: block;
    content: url("img/topics/month.svg");
    margin-right: 10px;
}

/*ピンク*/
ul.pnk li a{
    background: #FFE1E1;
}

ul.pnk li a::before{
    display: block;
    content: url("img/topics/home.svg");
    margin-right: 10px;
}


/******************
広分園
******************/
.hirobunen{
    margin-top: 50px;
}

.hirobunen img{
    width: 48%;
    border-radius: 40px;
    margin-bottom: 20px;
}

table.hiro_yel th,
table.hiro_yel td{
    width : calc(100% / 4);
}

p.txt span{
    color: #EC5D5D;
    font-weight: 800;
}

/******************
イベント
******************/
ul.event{
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
}

ul.event li{
    width: 100%;
    background: #FFEEE1;
    padding: 50px 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 50px;
    border-radius: 40px;
}

ul.event li img{
    width: 45%;
    object-fit: contain;
}

ul.event li div{
    width: 50%;
}

ul.event li div p.date{
    color: #4E4E4E;
    font-size: clamp(14px, 0.83vw, 16px);
    margin-bottom: 10px;
}

ul.event li div h3{
    color: #EC9B5D;
    font-size: clamp(20px, 1.25vw, 24px);
    margin-bottom: 35px;
}

ul.event li div p.txt{
    color: #4E4E4E;
    font-size: clamp(14px, 0.9vw, 18px);
}

.pagenavi{
    text-align: center;
}

.wp-pagenavi {
    margin: 20px 0;
}
.wp-pagenavi a {/* フォント色 */
    color: #EC9B5D;
}
.pages {/* 左の表記 */
    margin-right: 20px;
}
.wp-pagenavi .current,
.wp-pagenavi a.page {/* ボタン */
    margin: 0 6px 6px 0;
    display: inline-block;
    border: solid 2px #EC9B5D;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-family: heisei-maru-gothic-std, sans-serif;
    font-size: 14px;
    border-radius: 5px;
}
.wp-pagenavi .current {/* カレント数字 */
    background: #EC9B5D;
    color: #FFF;
}
.wp-pagenavi a.page:hover {/* マウスオーバー */
    background: #EC9B5D;
    color: #FFF;
}
.wp-pagenavi .first,
.wp-pagenavi .extend {/* ... */
    margin-right: 10px;
}
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {/* 記号の削除 */
    margin: 0 6px 6px 0;
    display: inline-block;
    border: solid 2px #EC9B5D;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-family: heisei-maru-gothic-std, sans-serif;
    font-size: 14px;
    border-radius: 5px;
}


/******************
お知らせ
******************/

.page_cts ul.news{
    width: 100%;
}

.page_cts ul.news li a{
    display: flex;
    align-items: center;
    background: #FFEEE1;
    border-radius: 20px;
    padding: 32px 5%;
}

.page_cts ul.news li a h4{
    color: #4E4E4E;
    font-size: clamp(15px, 0.9vw, 18px);
    line-height: 1em;
}

.post_box{
    width: 90%;
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
    
}

.post_box p.date{
    color: #EC9B5D;
    font-size: clamp(14px, 0.9vw, 18px);
    font-weight: 400;
    margin-bottom: 20px;
    text-align: left;
}

.post_box h1{
    color: #4E4E4E;
    font-size: clamp(20px, 1.25vw, 24px);
    font-weight: 800;
    margin-bottom: 50px;
    text-align: left;
}


.post_box .cts p{
    color: #4E4E4E;
    font-size: clamp(14px, 0.83vw, 16px);
    text-align: left;
}


.post_box a.back{
    display: inline-block;
    padding: 10px 10%;
    background: #F8AA6E;
    border-radius: 40px;
    color: #FFF;
    font-size: clamp(16px, 1.1vw, 20px);
    margin-top: 100px;
}