@charset "utf-8";
/* CSS Document */
/* 入園のご案内 */

/**************************************/

/*ページタイトル*/
h2.pageTitleImg{
  margin:0px 0px 25px 0px;
}
@media screen and (max-width: 768px) {
  h2.pageTitleImg{
    position: relative;
    margin:0px 0px 50px 0px;
  }
  h2.pageTitleImg img{
     width: 100%;
    height: auto;
    vertical-align: bottom;
  }
}
@media screen and (max-width: 520px) {
  h2.pageTitleImg{
    position: relative;
    margin:0px 0px 30px 0px;
  }
}
@media screen and (max-width: 520px) {
  h2.pageTitleImg{
    position: relative;
    margin:0px 0px 30px 0px;
  }
}

h2.pageTitleImg .pageTitleTxt{
  display: none;
}
@media screen and (max-width: 768px) {
  h2.pageTitleImg .pageTitleTxt{
    display: block;
    width: auto;
    position: absolute;
    z-index: 1;
    left: 32px;
    /*タイトル画像の高さ(同一ではない)に合わせてTOP位置の計算が必要です*/
    /* 縦中央の式　top: calc(50% - (画像の高さ/2)); */
  }
  h2.pageTitleImg .pageTitleTxt img{
    width: 100%;
    height: auto;
    vertical-align: bottom;
  }
  h2.pageTitleImg #mainimg01_txt{
    /* 幼児教室 */
    top: calc(50% - (46px/2));
  }
  h2.pageTitleImg #mainimg02_txt{
    /* 幼児教室の1日 */
    top: calc(50% - (47px/2));
  }
}
@media screen and (max-width: 520px) {
  h2.pageTitleImg .pageTitleTxt{
    left: 14px;
    /*タイトル画像の高さ(同一ではない)に合わせてTOP位置の計算が必要です*/
    /* 90％高さの式　元画像の高さ-元画像の高さ*9/100 */
    /* 縦中央の式　top: calc(50% - ((元画像の高さ - 元画像の高さ*9/100)/2)); */
  }
  h2.pageTitleImg .pageTitleTxt img{
    width: 90%;
    height: auto;
    vertical-align: bottom;
  }
  h2.pageTitleImg #　{
    /* 幼児教室 */
    top: calc(50% - ((46px - 46px*9/100)/2));
  }
  h2.pageTitleImg #mainimg02_txt{
    /* 幼児教室の1日 */
    top: calc(50% - ((47px - 47px*9/100)/2));
  }
}

/*==============================================================================
                 幼児教室
==============================================================================*/
.infant{
  width:670px;
  padding:0px 20px 0px 20px;
}
@media screen and (max-width: 768px) {
  .infant{
    width: 100%;
    padding: 0 10px;
  }
}

.infant_line{
  display:block;
}
.infantClass{
  width:630px;
  padding:0px 0px 40px 0px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .infantClass{
    width: 100%;
  }
}
@media screen and (max-width: 520px) {
  .infantClass{
    padding:0px 0px 30px 0px;
  }
}

.infantClass:after {
  content: "";
  display: block;
  clear: both;
  height: 1px;
  overflow: hidden;}

/*\*/
* html .infantClass {
  height: 1em;
  overflow: visible;}
/**/

.infantClass img.ohisama{
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .infantClass img.ohisama{
    display: block;
    margin: 0 auto 20px auto;
    max-width: 600px;
    width: 100%;
  }
}

.infantClassLeft{
  width:343px;
  float: left;
}
.infantClassLeft .ohisama_photo{
  display: none;
}
@media screen and (max-width: 768px) {
  .infantClassLeft{
    width:100%;
    float: none;
  }
  .infantClassLeft .ohisama_photo{
    display: block;
    float: right;
    width: 38.8418%;
    /* 38.8418% 親要素708px 子要素275px */
  }
  .infantClassLeft .ohisama_txt{
    float: left;
    width: 413px;
    width: 58.3333%;
    /* 58.3333% 親要素708px 子要素413px */
    text-align: justify;
  }
  .infantClassLeft .ohisama_txt .sp{
    display: none;
  }
}
@media screen and (max-width: 520px) {
  .infantClassLeft .ohisama_txt{
    float: none;
    width: 100%;
    margin-bottom: 28px;
  }
  .infantClassLeft .ohisama_photo{
    float: none;
    width: 100%;
    max-width: 275px;
    margin: 0 auto;
  }
}


.infantClassRight{
  /*width:343px;*/
  float: right;
}
@media screen and (max-width: 768px) {
  .infantClassRight{
    display: none;
  }
}


.infantClassDetail{
  margin:0px 0px 30px 0px;
  width:630px;
}

.small{
  font-size:12px;
}

img.achichi{
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  img.achichi{
    width: 100%;
    margin-bottom: 70px;
  }
}
@media screen and (max-width: 520px) {
  img.achichi{
    width: 100%;
    margin-bottom: 50px;
  }
}

table.class{
  margin-top: 8px;
  background: #EEEEEF;
}
@media screen and (max-width: 768px) {
  table.class{
    width: 100%;
    display: none;
  }
}

/*上段＠項目*/
table.class td.block1{
  text-align:center;
  color: #FFF;
  background: #B2A58E;
  border-bottom: #FFF 3px solid;
  padding: 5px 0px;
}

table.class td.block1{
  border-right: #FFF 3px solid;
  width: 100px;
}
/*＠内容*/
table.class td.block2,
table.class td.block3{
  text-align:center;
  border-bottom: #FFF 3px solid;
  padding: 5px 0px;
}

table.class td.block2{
  border-right: #FFF 3px solid;
  width: 140px;
}

table.class td.block3{
  width: 300px;
}

#class26{
  margin-bottom: 0;
}

@media screen and (max-width: 768px) {
  #class26{
    margin-bottom: 16px;
  }
}

.target_sp{
  display: none;
}
@media screen and (max-width: 768px) {
  .target_sp{
    width: 100%;
    display: table;
    margin-bottom: 10px;
  }
  .target_sp:last-of-type{
    margin-bottom: 0;
  }
  .target_sp th{
    text-align:center;
    color: #FFF;
    background: #B2A58E;
    border-bottom: #FFF 3px solid;
    padding: 5px 0px;
  }
  .target_sp td{
    background-color: #EEEEEF;
    padding: 13px 10px;
    border-bottom: #ffffff solid 3px;
    border-right: #ffffff solid 3px;
    font-size: 13px;
    vertical-align: middle;
  }
  .target_sp td.birthday{
    border-right: none;
    border-bottom: none;
  }
  .target_sp tr:last-child td{
    border-bottom: none;
  }
}




/*==============================================================================
                 幼児教室の1日
==============================================================================*/

.timetable{
  margin:0px 0px 0px 5px;
}
@media screen and (max-width: 768px) {
  .timetable{
    margin: 0 10px;
    padding: 10px;
    background: #FAFAFA;
    box-shadow: 3px 3px 5px #00000033;
  }
}

/*ノート上部*/
.noteTop{
  background:url(../img/infant/note_top.gif);
  background-repeat:no-repeat;
  height:13px;
  width:665px;
}
@media screen and (max-width: 768px) {
  .noteTop{
    display: none;
  }
}

/*ノート繰り返し部分*/
.noteCenter{
  background:url(../img/infant/note_repeat.gif);
  background-repeat:repeat-y;
  padding:17px 20px 17px 29px;
  width:616px;
}
@media screen and (max-width: 768px) {
  .noteCenter{
    width: 100%;
    padding: 30px 25px 41px 25px;
    background: url("../img/life/masume.png") top left repeat-y;
    border: solid 1px #E4E4E4;
  }
}
@media screen and (max-width: 520px) {
  .noteCenter{
    width: 100%;
    padding: 15px 20px 20px 5px;
  }
}
@media screen and (max-width: 375px) {
  .noteCenter{
    width: 100%;
    padding: 15px 15px 20px 5px;
  }
}

/*ノート下部*/
.noteBottom{
  background:url(../img/infant/note_bottom.gif);
  background-repeat:no-repeat;
  height:22px;
  width:665px;
  margin:0px 0px 10px 0px;
}
@media screen and (max-width: 768px) {
  .noteBottom{
    display: none;
  }
}

/***************/
/*タイムテーブル枠*/
/***************/

.photo_sp{
  display: none;
}

/*08:45～*/
.box_0845{
  position:relative;
  padding:0px 0px 18px 0px;
  background-position:344px 14px;
  background-repeat:no-repeat;
  width:616px;
}
@media screen and (max-width: 768px) {
  .box_0845{
    width: 100%;
    background-image: none;
    padding-bottom: 0;
  }
}
.box_0845 .photo_sp{
  display: none;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .box_0845 .photo_sp{
    display: block;
  }
}
/*08:45～写真*/
.photo_0845{
  position:absolute;
  left:344px;
  top:14px;
  z-index:10005;
}
@media screen and (max-width: 768px) {
  .photo_0845{
    display: none;
  }
}


/*09:30～*/
.box_0930{
  padding:0px 0px 18px 0px;
  background-image:url(../img/infant/photo_0930_2.png);
  background-position:70px 135px;
  background-repeat:no-repeat;
  width:616px;
}
@media screen and (max-width: 768px) {
  .box_0930{
    background-image: none;
    width: 100%;
  }
}
.box_0930 .photo_sp{
  display: none;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .box_0930 .photo_sp{
    display: block;
  }
}
@media screen and (max-width: 400px) {
  .box_0930 .photo_sp{
    width: 100%;
  }
  .box_0930 .photo_sp img{
    width: 100%;
  }
}

.photo_0930{
  display: none;
  text-align: center;
}

@media screen and (max-width: 768px) {
  .photo_0930{
    display: none;
  }
}

/*11:30～*/
.box_1130{
  padding:0px 0px 18px 0px;
  background-image:url(../img/infant/photo_1130.png);
  background-position:101px 145px;
  background-repeat:no-repeat;
  width:616px;
}
@media screen and (max-width: 768px) {
  .box_1130{
    width: 100%;
    background-image: none;
  }
}
.box_1130 .photo_sp{
  display: none;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .box_1130 .photo_sp{
    display: block;
  }
}
@media screen and (max-width: 450px) {
  .box_1130 .photo_sp{
    width: 100%;
  }
  .box_1130 .photo_sp img{
    width: 100%;
  }
}

/*12:30～*/
.box_1230{
  padding:0px 0px 18px 0px;
  background-image:url(../img/infant/photo_1230.png);
  background-position:56px 90px;
  background-repeat:no-repeat;
  width:616px;
}
@media screen and (max-width: 768px) {
  .box_1230{
    width: 100%;
    background-image: none;
  }
}
.box_1230 .photo_sp{
  display: none;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .box_1230 .photo_sp{
    display: block;
  }
}
@media screen and (max-width: 395px) {
  .box_1230 .photo_sp{
    width: 100%;
  }
  .box_1230 .photo_sp img{
    width: 100%;
  }
}

/*13:20～*/
.box_1320{
  position:relative;
  padding:0px 0px 18px 0px;
  background-image:url(../img/infant/photo_1320.png);
  background-position:230px -5px;
  background-repeat:no-repeat;
  width:616px;
}
@media screen and (max-width: 768px) {
  .box_1320{
    width: 100%;
    background-image: none;
  }
}

.photo_1320{
  position:absolute;
  left:221px;
  top:-7px;
  z-index:10000;
}

.box_1320 .photo_sp{
  display: none;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .box_1320 .photo_sp{
    display: block;
  }
}
@media screen and (max-width: 410px) {
  .box_1320 .photo_sp{
    width: 100%;
  }
  .box_1320 .photo_sp img{
    width: 100%;
  }
}

/*14:00～*/
.box_1400{
  padding:0px 0px 40px 0px;
  background-image:url(../img/infant/photo_1400.png);
  background-position:352px -5px;
  background-repeat:no-repeat;
  width:616px;
}
@media screen and (max-width: 768px) {
  .box_1400{
    width: 100%;
    background-image: none;
    padding-bottom: 0;
  }
}
.box_1400 .photo_sp{
  display: none;
  text-align: center;
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .box_1400 .photo_sp{
    display: block;
  }
}

/***************/
/*タイムテーブル内の要素*/
/***************/
/*時間*/
.time{
  margin:0px 0px 10px 0px;
}

/*時間横テキストあり*/
.time2{
  margin:0px 0px 10px 0px;
  display:flex;
  align-items: center;
}
.time_txt{
  margin: 0 0 0 10px;
}
@media screen and (max-width: 420px) {
  .time2{
    margin:0px 0px 10px 0px;
    display:block;
    align-items: center;
  }
}

/*↓矢印*/
.arrow{
  float:left;
  width:25px;
  margin:0px 0px 0px 30px;
}
@media screen and (max-width: 768px) {
  .arrow{
    float: none;
    display: none;
  }
}

/*タイトル・説明文エリア*/
.titleTxt{
  float:left;
  width:535px;
  margin:0px 0px 0px 8px;
  line-height: 0;
}
@media screen and (max-width: 768px) {
  .titleTxt{
    width: auto;
    float: none;
    margin: 0px 0px 0px 10px;
  }
}

/*説明*/
.txt{
  margin:10px 0px 0px 0px;
  line-height:1.5em;
  width:100%;
}
@media screen and (max-width: 768px) {
  .txt{
    width: auto;
    margin: 6px 0 0 0;
  }
  .txt .sp{
    display: none;
  }
}

/**************************************/
/*タイムテーブル内の要素　説明のサイズ*/
/**************************************/
.w310{
  width:310px;
}
.w290{
  width:290px;
}
.w250{
  width:255px;
}
@media screen and (max-width: 768px) {
  .w310, .w290, .w250{
    width: 100%;
  }
}

.event_txt{
  display: block;
}
@media screen and (max-width: 768px) {
  .event_txt{
    display: none;
  }
}

.event_txt_sp{
  display: none;
}
@media screen and (max-width: 768px) {
  .event_txt_sp{
    display: block;
    margin: 0;
    padding: 10px 10px 0 10px;
  }
}