@media screen and (max-width:768px){
body{
    background-color: #fff8f0;
}
.hidden-sp{
  display: none !important;
}
/* ----------------------*
 * ヘッダー
 * ----------------------*/
header{
    width: 100%;
    height: 60px;
}
#logo{
    display: flex;
}
#logo img{
    width: 40%;
   margin-left: 20px;
}
 .global-nav{
   background: rgba(249,249,249,0.95);
    width: 100%;
    height: 100vh;
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translateY(-100%);
    transition: .4s;
}
 .open .global-nav{
    transform: translateY(0);
 }

 .global-nav ul{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
     width: 100%;
    gap: 35px;
}
.global-nav li{
    display: flex;
    justify-content: center;
    width: 100%;
}
/*　ハンバーガーメニュー */
 #hamburger{
        display: block;
        cursor: pointer;
        position: fixed;
        width: 30px;
        height: 25px;
        right: 20px;
        top: 25px;
        z-index: 1000;       
 }
 #hamburger span{
        display: block;
        width: 25px;
        height: 2px;
        background-color: #4E392D;
        margin-bottom: 5px;
        transition: transform 0.3s, opacity 0.3s;
        transform-origin: center;
 }
 #hamburger span:last-child{
        margin-bottom: 0;
}
/* ×アニメーション */
.open #hamburger span:nth-child(1){
        transform: translateY(7px) rotate(45deg);
}
.open #hamburger span:nth-child(2){
        opacity: 0;
}
.open #hamburger span:nth-child(3){
        transform: translateY(-7px) rotate(-45deg);
}
/* ----------------------*
 * わたしたちについて
 * ----------------------*/
.about{
    background-color: #ecdccc;
    padding: 50px 0;
}
.about h2{
    text-align: center;
    margin: 20px auto;
    font-size: 1.5rem;
}
#aboutdiv{
    width: 100%;
    margin: 0 auto;
}
#aboutdiv img{
    width: 80%;
    margin: 0 auto;
}
#aboutmigidiv{
    text-align: center;
}
#aboutmigidiv h3{
    font-size: 1.2rem;
    padding: 20px 0;
}
#aboutmigidiv p{
    font-size: 14px;
}
#aboutmigidiv p + p{
    margin-top: 20px;
}
.about_more{
    margin-top: 30px;
}
#btn1{
    padding: 10px 20px;
    color: white;
    background-color: #01a651;
    border-radius: 20px;
    font-size: 16px;
}
/* ----------------------*
 * 園でのできごと
 * ----------------------*/
#event{
        padding: 50px 20px;
}

 /* タイトル */
#event_top{
    position: relative;
    width: 100%;
    text-align: center;
}

#event h2{
    margin: 0;
    font-size: 1.4rem;
}

#bee{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

#bee img{
    width: 40px;
}
#bee_line img{ 
    width: 100%; 
    max-width: 350px; 
}
/* イベント一覧 */
#eventgazou{
        width: 100%;
        margin-top: 30px;
 }

#eventgazou ul{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 20px 0;
}

#eventgazou li{
        width: 48%;
}

#eventgazou li img{
        width: 100%;
        display: block;
        border-radius: 10px;
}

#eventgazou li p{
        margin-top: 8px;
        text-align: center;
        font-size: 14px;
        line-height: 1.5;
}

/* ボタン */
    .about_more{
        text-align: center;
        margin-top: 30px;
}

#btn2{
    display: inline-block;
    padding: 10px 20px;
    font-size: 16px;
    color: white;
    background-color: #01a651;
    border-radius: 20px;
}
/* ----------------------*
 * 1日のスケジュール
 * ----------------------*/
 #day{
    width: 90%;
    margin: 0 auto;
    background-color: #ecdccc;
    padding: 30px 0;
    border-radius: 20px;
 }
#daytitle{
    display: flex;
    text-align: center;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
    margin-bottom: 40px;
}
#daytitle img{
    width: 10%;
}
#daytitle h2{
    font-size: 1.5rem;

}
.tokeihaikei{
    display: flex;
    width: 280px;
    margin: 20px auto;
    background-color:#faf49b;
    border-radius: 20px;
    padding: 15px 15px;
}
.tokeihaikei img{
    width: 20%;
}
.tokeihaikei h3{
    font-size: 1.2rem;
    margin-left: 20px;
}
.setumei{
   text-align: center;
}
.setumei img{
    width: 70%;
    margin: 20px auto 50px auto;
}
#entyouhoiku{
    font-size: 15px;
    margin-left: 40px;

}
#text-box{
    display: flex;
    flex-direction: column;
    gap: 20px;
}
 /* ----------------------*
 * お問い合わせ
 * ----------------------*/
 #formbtn img{
    width: 80%;
    margin: 40px auto;
 }
 /* ----------------------*
 * フッター
 * ----------------------*/
 footer{
    width: 100%;
    background-color: white;
    padding: 40px 0;
 }
 #footer-area{
    width: 100%
 }
 #footer-name{
    font-size: 1.5rem;
    text-align: center;
    margin-bottom: 20px;
 }
 #footer-nav{
    display: none;
 }
footer section{
    width: 80%;
    margin: 0 auto;
    text-align: left;
}
 .footer-text{
    font-size: 1.2rem;
    margin-top: 40px;
    text-align: center;
 }
 #policy{
    text-align: center;
    font-size: small;
 }
#copyright{
    display: block;
    margin-top: 40px;
    text-align: center;
}
}
