/*
Theme Name: Kindergarten Education Child
Theme URI: https://www.buywptemplates.com/products/free-education-wordpress-theme
Template: kindergarten-education
Author: Buywptemplates
Author URI: https://www.buywptemplates.com
Description: The Kindergarten Education is a beautiful and minimal kids school theme. It is a kids school theme with plenty of features, user-friendly customization and personalization options. This theme is perfect for Elementary Schools, babysitting, summer camps, day nursery, online learning for kidds, playschool activity kit, teaching language arts, Literacy, Preschool Activities, educational institutions, secondary schools, joy center, Private Tutoring Service, Test Prep Tutoring Service, playschool kit, child care center, universities, academics childcare, day care center, preschool, Online Classes, College, Academy, University or School, tuition, babysitter, nursery school, playgroup, pre-K, pre-school, Childcare services course hub, Daycare, e-learning, tutor, tuitions, Primary Schools, Courses Listing Platform, Training Center, eLearning Business, kid friendly, children art &amp; craft, school children activities website. It includes features such as quick page speed, mobile friendly design, one-column layout, cross browser compatibility, SEO friendly, multiple menu location, cross-browser compatible, translation ready and has a left-sidebar &amp; right-sidebar etc. It shows a large slider with a banner that has a Call to Action Button (CTA) to attract the visitors. It is compatible with WooCommerce and features layouts for products, posts and pages. It has secure and clean codes that do not allow you to write even a single line of code. It offers a bunch of shortcodes that helps in incorporating functional features. This kindergarten theme is based on Bootstrap framework which enhances the speed of development. Also, it has an interactive demo for easy understanding. It supports different languages such as ARABIC, GERMAN, SPANISH, FRENCH, ITALIAN, RUSSIAN, CHINESE, and TURKISH. View full demo here: https://demos.buywptemplates.com/kindergarten-education-pro/
Tags: left-sidebar,right-sidebar,one-column,two-columns,three-columns,four-columns,grid-layout,flexible-header,wide-blocks,block-styles,custom-background,custom-logo,custom-menu,custom-header,editor-style,featured-images,footer-widgets,sticky-post,full-width-template,theme-options,threaded-comments,translation-ready,post-formats,rtl-language-support,blog,education,e-commerce
Version: 1.6.1752060093
Updated: 2025-07-09 20:21:33

*/


/* アドビのフォント */
html, body {
  font-family: "uddigikyokasho-pro", sans-serif;
}
h1, h2, h3, h4, h5, h6, p, span, a, li, input, textarea, button {
  font-family: "uddigikyokasho-pro", sans-serif;
}



/* 教科書フォントH5Pコンテンツ全体に適用 */
/*
.h5p-content {
    font-family: "uddigikyokasho-pro", sans-serif !important;
    /* または、Adobe Fontsで指定したフォント名 */
}
*/

.h5p-container * {
    font-family: "uddigikyokasho-pro", sans-serif !important;
}





/* フッターの上にあった線を消す */
.copyright-wrapper {
  border-top: none !important;
  box-shadow: none !important; /* 念のため影も消します */
  margin-top: 0 !important;     /* 余白が線に見えてる場合にも対応 */
}


/* メニューをトグルに変える */
@media (max-width: 1000px) {
  .toggle-menu {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 9999;
    margin: 0 !important;
  }

  .toggle-menu .mobiletoggle {
    background-color: #ccffff; /* optional: 雲の色に合わせて */
    padding: 0.5rem 0.75rem;
    border-radius: 4px;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
  }

  .toggle-menu i {
    font-size: 1.5rem;
    color: #333; /* アイコン色（お好みで） */
  }
}


/* 携帯サイト用雲なしヘッダ */
@media (max-width: 768px) {
  #header {
    background-image: none !important;
    background-color: #ccffff !important; /* 好きな背景色に変更可能 */
    background-size: cover;
    background-repeat: no-repeat;
  }
}






/*
@media (max-width: 768px) {
  .main-menu {
    display: none;
  }

  .responsive-menu-toggle {
    display: block;
  }
}
*/





/*

@media (max-width: 768px) {
  #header {
    min-height: 150px; /* 必要に応じて数値を調整（例：180pxや200px） */
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}

*/


/*
ヘッダーの雲画像
#header {
  background: url(cloud-pale-blue.png) no-repeat;
  background-size: 100% 100%;
}

/* フッターの色設定 */
footer {
  background-color: #f0f8ff;
}

.footer-wp {
  background-color: #e0f7fa;
}

.copyright-wrapper {
  background-color: #b2ebf2;
}
*/





/* まず、ヘッダー全体か、トグルメニューの直接の親要素に position: relative; を設定します */
/* これも @media クエリ内に記述するか、モバイル表示全体に適用されるCSSに記述します */
/* 
@media (max-width: 991px) { /* モバイル全般のブレイクポイント */
    .toggle-menu { /* あなたのHTMLにある親要素のクラス */
        position: relative;
    }
}

@media (max-width: 991px) and (orientation: landscape) {
    .toggle-menu .mobiletoggle {
        position: absolute; /* 親要素 .toggle-menu を基準に配置される */
        top: 10px;
        right: 15px;
        left: auto;
        transform: none;
        margin: 0;
    }
}

*/