@charset "UTF-8";

/* seasonsの設定 */

body {
  background-image: url(../img/seasons/body/body.png);
  background-repeat: repeat-y;
  background-size: contain;
  background-position: right top;
}

/* ---------------------------------------------
四季のたのしみページ情報
---------------------------------------------*/
#about {
  width: 100%;
  padding-top: 250px;
}

#about img {
  width: 13.85%;
  margin: 0 auto 100px;
}

#child-rearing{
  width: 100%;
  padding-top: 80px;
}

#child-rearing img{
  width: 35.7%;
  margin: 0 auto 100px;
}

.main_facility #container1,
.main_facility #container2,
.main_facility #container3,
.main_facility #container4,
.main_facility #container5 {
  width: 100%;
  margin-bottom: 10vw;
  position: relative;
}

.main_facility #container5 {
  margin-bottom: 20vw;
}

.main_facility main .Text_box {
  width: 69%;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  #about {
    width: 100%;
    padding-top: 150px;
  }

  #about img {
    width: 22%;
    margin: 0 auto 50px;
  }

  #child-rearing{
    width: 100%;
    padding-top: -20px;
  }
  
  #child-rearing img{
    width: 50%;
    margin: 0 auto 50px;
  }

  .main_facility #container5 {
    margin-bottom: 35vw;
  }

  .main_facility main .Text_box {
    width: 82%;
    margin: 0 auto;
  }
}

.tanzaku img {
  filter: drop-shadow(6px 6px 3.56px rgba(100, 100, 100, 0.5));
}

/* ---------------------------------------------
#container1
---------------------------------------------*/
.main_facility #container1 .Text_box .tanzaku {
  width: 10%;
  position: absolute;
  top: -1vw;
  right: 5px;
}

.main_facility #container2 .Text_box .tanzaku {
  width: 11%;
  position: absolute;
  top: -1vw;
  right: -2.5%;
}

.main_facility #container3 .Text_box .tanzaku {
  width: 11%;
  position: absolute;
  top: -1vw;
  right: -2.5%;
}

.main_facility #container4 .Text_box .tanzaku {
  width: 12%;
  position: absolute;
  top: -1vw;
  right: -2.5%;
}

.main_facility #container5 .Text_box .tanzaku {
  width: 12%;
  position: absolute;
  top: -1vw;
  right: -2.5%;
}

@media screen and (max-width: 767px) {
  .main_facility #container1 .Text_box .tanzaku {
    width: 22%;
    position: absolute;
    top: -1vw;
    right: 3px;
  }

  .main_facility #container2 .Text_box .tanzaku {
    width: 25%;
    position: absolute;
    top: -1vw;
    left: -2.5%;
  }

  .main_facility #container3 .Text_box .tanzaku {
    width: 25%;
    position: absolute;
    top: -1vw;
    right: -2.5%;
  }

  .main_facility #container4 .Text_box .tanzaku {
    width: 26%;
    position: absolute;
    top: -1vw;
    right: -2.5%;
  }

  .main_facility #container5 .Text_box .tanzaku {
    width: 26%;
    position: absolute;
    top: -1vw;
    right: -2.5%;
  }
}