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

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

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

h3.pageTitleImg .pageTitleTxt{
  display: none;
}
@media screen and (max-width: 768px) {
  h3.pageTitleImg .pageTitleTxt{
    display: block;
    width: auto;
    position: absolute;
    z-index: 1;
    left: 32px;
    /*タイトル画像の高さ(同一ではない)に合わせてTOP位置の計算が必要です*/
    /* 縦中央の式　top: calc(50% - (画像の高さ/2)); */
  }
  h3.pageTitleImg .pageTitleTxt img{
    width: 100%;
    height: auto;
    vertical-align: bottom;
  }
  h3.pageTitleImg #mainimg01_txt{
    /* 制服について */
    top: calc(50% - (49px/2));
  }
  h3.pageTitleImg #mainimg02_txt{
    /* 給食について */
    top: calc(50% - (55px/2));
  }
  h3.pageTitleImg #mainimg03_txt{
    /* 幼児教室 */
    top: calc(50% - (46px/2));
  }
  h3.pageTitleImg #mainimg04_txt{
    /* 課外授業 */
    top: calc(50% - (46px/2));
  }
  h3.pageTitleImg #mainimg05_txt{
    /* 預かり保育 */
    top: calc(50% - (46px/2));
  }
  h3.pageTitleImg #mainimg06_txt{
    /* 施設・周辺環境 */
    top: calc(50% - (50px/2));
  }
  h3.pageTitleImg #mainimg07_txt{
    /* バスルート */
    top: calc(50% - (44px/2));
  }
}
@media screen and (max-width: 520px) {
  h3.pageTitleImg .pageTitleTxt{
    left: 14px;
    /*タイトル画像の高さ(同一ではない)に合わせてTOP位置の計算が必要です*/
    /* 90％高さの式　元画像の高さ-元画像の高さ*9/100 */
    /* 縦中央の式　top: calc(50% - ((元画像の高さ - 元画像の高さ*9/100)/2)); */
  }
  h3.pageTitleImg .pageTitleTxt img{
    width: 90%;
    height: auto;
    vertical-align: bottom;
  }
  h3.pageTitleImg #mainimg01_txt{
    /* 制服について */
    top: calc(50% - ((49px - 49px*9/100)/2));
  }
  h3.pageTitleImg #mainimg02_txt{
    /* 給食について */
    top: calc(50% - ((55px - 55px*9/100)/2));
  }
  h3.pageTitleImg #mainimg03_txt{
    /* 幼児教室 */
    top: calc(50% - ((46px - 46px*9/100)/2));
  }
  h3.pageTitleImg #mainimg04_txt{
    /* 課外授業 */
    top: calc(50% - ((46px - 46px*9/100)/2));
  }
  h3.pageTitleImg #mainimg05_txt{
    /* 預かり保育 */
    top: calc(50% - ((46px - 46px*9/100)/2));
  }
  h3.pageTitleImg #mainimg06_txt{
    /* 施設・周辺環境 */
    top: calc(50% - ((50px - 50px*9/100)/2));
  }
  h3.pageTitleImg #mainimg07_txt{
    /* バスルート */
    top: calc(50% - ((44px - 44px*9/100)/2));
  }
}


h4.class_f{
	margin: 30px 5px 15px 5px;}

h4.class{
	margin: 50px 5px 15px 5px;}

/*==============================================================================
　　　　　　　　　　　　　　　　　制服について
==============================================================================*/



/*==============================================================================
　　　　　　　　　　　　　　　　　給食について
==============================================================================*/



/*==============================================================================
　　　　　　　　　　　　　　　　　　幼児教室
==============================================================================*/



/*==============================================================================
　　　　　　　　　　　　　　　　　　課外授業
==============================================================================*/

p.intro{
	padding-bottom: 30px;
}
@media screen and (max-width: 768px) {
  p.intro{
    padding-bottom: 0;
    margin-bottom: 58px; /* 40px＋ふたば18px=58px */
  }
}
@media screen and (max-width: 520px) {
  p.intro{
    padding-bottom: 0;
    margin-bottom: 48px; /* 30px＋ふたば18px=48px */
  }
}

/*タイトル*/
h4.class_f{
	margin: 30px 5px 15px 5px;
}
@media screen and (max-width: 768px) {
  h4.class_f{
    position: relative;
    margin: 0 0 15px 0;
    padding: 13px 20px 13px 11px;
    background-color: #27B7CD;
    border-radius: 16px;
  }
  h4.class_f::after{
    display: block;
    position: absolute;
    content: url("../img/guide/icon_futaba.png");
    width: 21px;
    height: 18px;
    top: -18px;
  }
}
@media screen and (max-width: 520px) {
  h4.class_f{
    padding: 13px 20px 13px 11px;
    border-radius: 16px;
  }
}

/*タイトル*/
h4.class{
	margin: 50px 5px 15px 5px;
}
@media screen and (max-width: 768px) {
  h4.class{
    position: relative;
    margin: 0 0 15px 0;
    padding: 13px 20px 13px 11px;
    background-color: #27B7CD;
    border-radius: 16px;
  }
  h4.class::after{
    display: block;
    position: absolute;
    content: url("../img/guide/icon_futaba.png");
    width: 21px;
    height: 18px;
    top: -18px;
  }
}

@media screen and (max-width: 520px) {
  h4.class{
    position: relative;
    min-height: 48px;
    margin: 0 0 15px 0;
    padding: 13px 20px 13px 11px;
    border-radius: 16px;
  }
  h4.class::after{
    top: -18px;
  }
}

@media screen and (max-width: 325px) {
  h4#jacpa.class{
    display: flex;
    align-items: center;
    width: 100%;
  }
  h4#jacpa.class picture{
    display: flex;
    align-items: center;
    width: 100%;
  }
  h4#jacpa.class picture img{
    width: 65.6547%;
    padding-right: 5px;
  }
}






/*年中・年長*/
.pattern_1{
  background: url("../img/guide/icon_pattern_1.png") no-repeat right 20px center;
}
/*年中・年長・児童*/
.pattern_2{
  background: url("../img/guide/icon_pattern_2.png") no-repeat right 20px center;
}
/*年少・年中・年長*/
.pattern_3{
  background: url("../img/guide/icon_pattern_3.png") no-repeat right 20px center;
}
/*年少・年中・小学生*/
.pattern_4{
  background: url("../img/guide/icon_pattern_4.png") no-repeat right 20px center;
}
@media screen and (max-width: 520px) {
  .pattern_1{
    background: url("../img/guide/icon_pattern_1.png") no-repeat right 10px center;
  }
  .pattern_2{
    background: url("../img/guide/icon_pattern_2.png") no-repeat right 10px center;
  }
  .pattern_3{
    background: url("../img/guide/icon_pattern_3.png") no-repeat right 10px center;
  }
  .pattern_4{
    background: url("../img/guide/icon_pattern_4.png") no-repeat right 10px center;
  }
}
/*ul.class_link{
	background: url(../img/guide/class_link_bg.jpg) no-repeat;
	padding: 5px 0px 0px 11px;
	height: 35px;
	overflow: hidden;
}
ul.class_link:after{
  content: "";
  display: block;
  clear: both;
  height: 1px;
  overflow: hidden;}
ul.class_link li{
	list-style: none;
	float: left;}*/

ul.class_link{
	background: url(../img/guide/class_link_bg.jpg) no-repeat;
	/*margin: 0px 20px;*/
	padding: 5px 0px 0px 11px;
	height: 35px;
	overflow: hidden;
}

ul.class_link:after, ul.class_link_ad:after{
  content: "";
  display: block;
  clear: both;
  height: 1px;
  overflow: hidden;}

/*\*/
* html ul.class_link, * html ul.class_link_ad{
  height: 1em;
  overflow: visible;}
/**/

ul.class_link li, ul.class_link_ad li{
	list-style: none;
	float: left;}
	

/*ショートカットメニュー*/
ul.class_link_ad{
	padding: 5px 0px 0px 0px;
}
@media screen and (max-width: 768px) {
  ul.class_link_ad{
    display: none;
  }
}


/***********クラス＠外枠***********/
.class_wrap{
	/*margin: 0px 20px;*/
	overflow: hidden;
}

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

/*\*/
* html .class_wrap {
  height: 1em;
  overflow: visible;
}
@media screen and (max-width: 768px) {
  .class_wrap{
    overflow: auto;
    padding: 0 5px 68px 10px;
  }
  .class_wrap.last{
    padding-bottom: 0;
  }
}
@media screen and (max-width: 520px) {
  .class_wrap{
    padding-left: 0;
    padding-right: 0;
  }
}


/*クラス＠テキスト*/
.class_wrap .txt{
	width: 400px;
	margin-left: 10px;
	float: left;
}
@media screen and (max-width: 768px) {
  .class_wrap .txt{
    width: calc(100% - 208px);
    margin-left: 0;
    float: left;
    padding-right: 13px;
  }
}
@media screen and (max-width: 520px) {
  .class_wrap .txt{
    float: none;
    width: 100%;
    margin-bottom: 20px;
  }
  .class_wrap .txt .sp{
    display: none;
  }
}


/*クラス＠画像*/
.class_wrap .photo{
	float: right;
  margin-right:5px;
}
@media screen and (max-width: 768px) {
  .class_wrap .photo{
    float: right;
    margin-right:0;
  }
}
@media screen and (max-width: 520px) {
  .class_wrap .photo{
    float: none;
    width: 55.7522%;
    min-width: 252px;
    margin: 0 auto;
    /* 55.7522% 親要素452px 子要素252px */
  }
  .class_wrap .photo img{
    width: 100%;
    height: auto;
  }
}



/***********クラス＠表***********/
table.class{
	width: 400px;
	margin-top: 10px;
}
table.class.tbl_sp{
  display: none;
}
@media screen and (max-width: 768px) {
  table.class{
    display: none;
  }
  table.class.tbl_sp{
    display: table;
    width: 100%;
    padding-right: 6px;
  }
}
@media screen and (max-width: 520px) {
  table.class.tbl_sp{
    margin-top: 31px;
  }
}


table.class.tbl_sp td .sp{
  display: none;
}

/*スマホ時にfloat打ち消し*/
@media screen and (max-width: 768px) {
  .tbl_sp_waku:after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
  }
  .tbl_sp_waku {
    /* display: inline-block;*/
  }
  /* Hides from IE Mac */
  * html .tbl_sp_waku {
    height: 1%;
  }
  .tbl_sp_waku {
    display: block;
  }
}
@media screen and (max-width: 520px) {
  .tbl_sp_waku {
    padding: 0 10px;
  }
}

	
table.class td.box1_1 , table.class td.box1_2{
	background: #B2A58E;
	color: #FFF;
	text-align: center;
	line-height: 1em;
	padding: 8px 8px;
	border-bottom: #FFF 3px solid;
}
@media screen and (max-width: 768px) {
  table.class td.box1_2{
    font-size: 13px;
  }
}


table.class td.box1_1{
	border-right: #FFF 3px solid;
}
@media screen and (max-width: 768px) {
  table.class td.box1_1{
    font-size: 13px;
  }
}

table.class td.box2 , table.class td.box3 , table.class td.box4 , table.class td.box5{
	background: #EEEEEF;
	line-height: 1em;
	padding: 8px 8px;
	border-bottom: #FFF 3px solid;}

/*対象*/	
table.class td.box2{
	width: 112px;/*128px*/
	border-right: #FFF 3px solid;
}
@media screen and (max-width: 768px) {
  table.class td.box2{
    width: 27.1676%;
    /* 27.1676% 親要素692px 子要素188px */
    padding: 13px;
    font-size: 13px;
    line-height: 1.3em;
    vertical-align: middle;
  }
  table.class td.box2 br{
    display: none;
  }
}
@media screen and (max-width: 374px) {
  table.class td.box2{
    padding-left: 4.0625%;
    padding-right: 4.0625%;
    /* 4.0625% 親要素320px 子要素13px */
  }
}

/*クラス*/
table.class td.box3{
	width: 70px;/*86px*/
	text-align: center;
  border-right: #FFF 3px solid;
}
@media screen and (max-width: 768px) {
  table.class td.box3{
    width: 21.0983%;
    min-width: 62px;
    /* 21.0983% 親要素692px 子要素146px */
    font-size: 13px;
    line-height: 1.3em;
    vertical-align: middle;
    padding: 13px;
  }
}
@media screen and (max-width: 520px) {
  table.class td.box3{
    min-width: 69px;
  }
}
	
	
/*曜日*/	
table.class td.box4{
	width: 44px;/*60px*/
	text-align: center;
	border-right: #FFF 3px solid;
}
@media screen and (max-width: 768px) {
  table.class td.box4{
    width: 18.2081%;
    min-width: 62px;
    /* 18.2081% 親要素692px 子要素126px */
    font-size: 13px;
    line-height: 1.3em;
    vertical-align: middle;
    padding: 13px;
  }
}

/*時間*/	
table.class td.box5{
	width: 101px;/*117psx*/
}
@media screen and (max-width: 768px) {
  table.class td.box5{
    width: 31.6474%;
    /* 31.6474% 親要素692px 子要素219px */
    text-align: center;
    font-size: 13px;
    line-height: 1.3em;
    vertical-align: middle;
    padding: 13px;
  }
}
@media screen and (max-width: 520px) {
  table.class td.box5{
  }
}
	

@media screen and (max-width: 768px) {
  table.class td.line_2{
    height: 63px;
  }
}
@media screen and (max-width: 520px) {
  table.class td.space_0{
    padding-left: 0;
    padding-right: 0;
  }
}



p.last_t{
	margin: 20px 0px 0px 10px;
}
@media screen and (max-width: 768px) {
  p.last_t{
    margin: 30px 0px 0px 10px;
  }
}


/*==============================================================================
　　　　　　　　　　　　　　　　　　延長保育
==============================================================================*/



/*==============================================================================
　　　　　　　　　　　　　　　　施設・周辺環境
==============================================================================*/



/*==============================================================================
　　　　　　　　　　　　　　　　　　バスルート
==============================================================================*/
#busRoot {
  padding: 0px 20px;
}
@media screen and (max-width: 768px) {
  #busRoot{
    padding:0px 10px;
  }
}
@media screen and (max-width: 520px) {
  #busRoot{
    padding:0px 14px;
  }
}

/*************************
*時刻表　時刻無
**************************/
#busRoot {
  padding: 0px 20px;
}

ul.busroot_txt{
  list-style: none;
  margin-bottom: 2em;
}
@media screen and (max-width: 768px) {
  ul.busroot_txt{
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 520px) {
  ul.busroot_txt{
    margin-bottom: 30px;
  }
}
ul.busroot_txt li{
  text-indent: -1em;
  margin-left: 1em;
}

.course_bg01, .course_bg02, 
.course_bg03, .course_bg04, 
.course_bg05, .course_bg06, 
.course_bg07, .course_bg08, 
.course_bg06_t, .course_bg08_t, 
.course_bg04_t, .course_bg03_t {
  box-sizing: border-box;
  width: 631px;
  padding: 17px 23px 0px 23px;
  margin-top: 5px;
  margin-bottom: 17px;
  clear: both;
}
@media screen and (max-width: 768px) {
  .course_bg01, .course_bg02, 
  .course_bg03, .course_bg04, 
  .course_bg05, .course_bg06, 
  .course_bg07, .course_bg08, 
  .course_bg06_t, .course_bg08_t, 
  .course_bg04_t, .course_bg03_t {
    box-sizing: border-box;
    width: 100%;
    padding: 17px 23px 0px 23px;
    margin-top: 5px;
    margin-bottom: 17px;
    clear: both;
  }
}


.course_bg01 {
  /*みどり*/
  background: url(../img/guide/course_bg01_2.gif) no-repeat;
  height: 171px;
}
.course_bg02 {
  /*きみどり*/
  background: url(../img/guide/course_bg02_2.gif) no-repeat;
  height: 208px;
}
.course_bg03 {
  /*あお*/
  background: url(../img/guide/course_bg03_3.gif) no-repeat;
  height: 104px;
}
.course_bg04 {
  /*ピンク*/
  background: url(../img/guide/course_bg04_3.gif) no-repeat;
  height: 140px;
}
.course_bg05 {
  /*きいろ*/
  background: url(../img/guide/course_bg05_2.gif) no-repeat;
  height: 138px;
}
.course_bg06 {
  /*あか*/
  background: url(../img/guide/course_bg06_3.gif) no-repeat;
  height: 104px;
}
.course_bg07 {
  /*オレンジ*/
  background: url(../img/guide/course_bg07_2.gif) no-repeat;
  height: 208px;
}
.course_bg08 {
  /*むらさき*/
  background: url(../img/guide/course_bg08_3.gif) no-repeat;
  height: 140px;
}
ul.name, ul.name_last {
  height: 28px;
  margin-bottom: 7px;
  padding: 0px;
  float: left;
}
ul.name {
  background: url(../img/guide/arrow.png) no-repeat right;
}
ul.name li.text {
  height: 20px; /*28px*/
  margin-right: 26px;
  padding: 4px 12px 4px 12px;
  line-height: 20px;
  list-style: none;
  background: #FFF;
}
ul.name_last li.text_last {
  height: 20px; /*28px*/
  padding: 4px 12px 4px 12px;
  line-height: 20px;
  list-style: none;
  background: #FFF;
}

ul.name li.text01, ul.name li.text02, 
ul.name li.text03, ul.name li.text04, 
ul.name li.text05, ul.name li.text06, 
ul.name li.text07, ul.name li.text08, 
ul.name li.text09, ul.name li.text10, 
ul.name li.text11, ul.name li.text12, 
ul.name li.text13 {
  height: 20px; /*28px*/
  margin-right: 26px;
  padding: 4px 12px 4px 37px;
  line-height: 20px;
  list-style: none;
}

ul.name li.text01 {
  background: url(../img/guide/1.gif) no-repeat left #FFF;
}
ul.name li.text02 {
  background: url(../img/guide/2.gif) no-repeat left #FFF;
}
ul.name li.text03 {
  background: url(../img/guide/3.gif) no-repeat left #FFF;
}
ul.name li.text04 {
  background: url(../img/guide/4.gif) no-repeat left #FFF;
}
ul.name li.text05 {
  background: url(../img/guide/5.gif) no-repeat left #FFF;
}
ul.name li.text06 {
  background: url(../img/guide/6.gif) no-repeat left #FFF;
}
ul.name li.text07 {
  background: url(../img/guide/7.gif) no-repeat left #FFF;
}
ul.name li.text08 {
  background: url(../img/guide/8.gif) no-repeat left #FFF;
}
ul.name li.text09 {
  background: url(../img/guide/9.gif) no-repeat left #FFF;
}
ul.name li.text10 {
  background: url(../img/guide/10.gif) no-repeat left #FFF;
}
ul.name li.text11 {
  background: url(../img/guide/11.gif) no-repeat left #FFF;
}
ul.name li.text12 {
  background: url(../img/guide/12.gif) no-repeat left #FFF;
}
ul.name li.text13 {
  background: url(../img/guide/13.gif) no-repeat left #FFF;
}
/*************************
*時刻表2
**************************/
.new_course {}
.new_course.course_bg01, 
.new_course.course_bg02, 
.new_course.course_bg03, 
.new_course.course_bg04, 
.new_course.course_bg05, 
.new_course.course_bg06, 
.new_course.course_bg07, 
.new_course.course_bg08 {
  padding: 17px 23px 0px 23px;
  margin-top: 5px;
  clear: both;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg01, 
  .new_course.course_bg02, 
  .new_course.course_bg03, 
  .new_course.course_bg04, 
  .new_course.course_bg05, 
  .new_course.course_bg06, 
  .new_course.course_bg07, 
  .new_course.course_bg08{
    border-radius: 20px;
    padding: 25px 20px;
    margin: 10px 0 30px 0;
    font-size: 0;
  }
}

/*みどり*/
.new_course.course_bg01 {
  background: url(../img/guide/new_course_bg01_l2.png) no-repeat;
  height: 102px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg01 {
    background-image: none;
    background-color: #3EB370;
    height: auto;
  }
}
/*むらさき*/
.new_course.course_bg02 {
  background: url(../img/guide/new_course_bg02_l1.png) no-repeat;
  height: 65px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg02 {
    background-image: none;
    background-color: #9983BB;
    height: auto;
  }
}
/*あお*/
.new_course.course_bg03 {
  background: url(../img/guide/new_course_bg03_l1.png) no-repeat;
  height: 65px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg03 {
    background-image: none;
    background-color: #4294D0;
    height: auto;
  }
}
/*あか*/
.new_course.course_bg04 {
  background: url(../img/guide/new_course_bg04_l2.png) no-repeat;
  height: 102px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg04 {
    background-image: none;
    background-color: #EB6D73;
    height: auto;
  }
}
/*こん*/
.new_course.course_bg05 {
  background: url(../img/guide/new_course_bg05_l2.png) no-repeat;
  height: 102px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg05 {
    background-image: none;
    background-color: #445798;
    height: auto;
  }
}
/*みずいろ*/
.new_course.course_bg06 {
  background: url(../img/guide/new_course_bg06_l2.png) no-repeat;
  height: 102px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg06 {
    background-image: none;
    background-color: #00B7DE;
    height: auto;
  }
}
/*おれんじ*/
.new_course.course_bg07 {
  background: url(../img/guide/new_course_bg07_l1.png) no-repeat;
  height: 65px;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg07 {
    background-image: none;
    background-color: #F3982C;
    height: auto;
  }
}
/*きいろ*/
.new_course.course_bg08 {
  background: url(../img/guide/new_course_bg08_l1.png) no-repeat;
  height: 65px;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .new_course.course_bg08 {
    background-image: none;
    background-color: #fcd12b;
    height: auto;
  }
}


.new_course ul.name, .new_course ul.name_last {
  height: 28px;
  margin-bottom: 7px;
  padding: 0px;
  float: left;
  color: #ffffff;
  background-image: none;
  background-color: transparent;
}
@media screen and (max-width: 768px) {
  .new_course ul.name, .new_course ul.name_last {
    display: inline-block;
    height: auto;
    margin-bottom: 0;
    /* line-height: 35px; */
    margin-right: 29px;
    font-size: 0;
    vertical-align: bottom;
  }
}

.new_course ul.name li.text {
  color: #ffffff;
  height: 20px; /*28px*/
  margin-right: 26px;
  padding: 4px 12px 4px 0px;
  line-height: 20px;
  list-style: none;
  background-image: none;
  background-color: transparent;
}
@media screen and (max-width: 768px) {
  .new_course ul.name li.text{
    display: inline;
    padding: 0;
    margin-right: 0;
    font-size: 14px;
    line-height: 35px;
  }
}

/*最終行もしくは改行のタイミング*/
.new_course ul.name:last-of-type li.text, 
.new_course ul.name li.text.margin_r0 {
  margin-right: 0;
  padding-right: 0;
}


