@charset "UTF-8";

#contents #topInfo {
  padding: 0px;
  height: 427px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 20px;
  margin-left: 0px;
  background-image: url(/kiyosumishirakawa/02/image/topback.png);
  position: relative;
}
#topInfo .cap {
  height: 60px;
  width: 660px;
  position: absolute;
  left: 30px;
  top: 132px;
  text-align: left; /*background-image: url(image/toptxt.png);*/
  font-size: 13px;
  font-weight: bold;
}
#topInfo .point {
  height: 350px;
  width: 234px;
  position: absolute;
  left: 712px;
  top: 61px;
  background-image: url(/kiyosumishirakawa/02/image/toppoint.png);
}
#spot {
  padding: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 30px;
  margin-left: 0px;
  background-image: url(/kiyosumishirakawa/02/image/spotback.jpg);
  position: relative;
  height: 3350px;
}
#spot p {
  text-align: justify;
}
#spot .spot1 {
  background-image: url(/kiyosumishirakawa/02/image/spot1.png);
  height: 1050px;
  position: relative;
  left: 0px;
  top: 0px;
}
#spot .spot1 .t1,
#spot .spot1 .t2,
#spot .spot1 .t3 {
  font-size: 13px;
  line-height: 170%;
  text-align: left;
}
#spot .spot1 .t4,
#spot .spot1 .t5 {
  font-size: 12px;
  line-height: 150%;
  text-align: left;
}
#spot .spot1 .t5 {
  padding-top: 20px;
}
#spot .spot1 .t1 {
  position: absolute;
  left: 54px;
  top: 400px;
  width: 430px;
  text-align: justify;
}
#spot .spot1 .t2 {
  position: absolute;
  left: 54px;
  top: 830px;
}
#spot .spot1 .t3 {
  position: absolute;
  left: 54px;
  top: 910px;
}
#spot .spot1 .t4 {
  position: absolute;
  left: 540px;
  top: 90px;
  width: 180px;
  text-align: justify;
}
#spot .spot1 .t5 {
  position: absolute;
  left: 540px;
  top: 290px;
  width: 180px;
  text-align: justify;
}
#spot .spot2 {
  height: 400px;
  background-image: url(/kiyosumishirakawa/02/image/spot2.png);
  position: relative;
}
#spot .spot2 .t1 {
  position: absolute;
  left: 54px;
  top: 150px;
  height: 85px;
  width: 420px;
}
#spot .spot2 .t2 {
  position: absolute;
  left: 54px;
  top: 275px;
}
#spot .spot2 p {
  font-size: 13px;
  line-height: 170%;
  text-align: left;
}
#spot .spot3 {
  height: 380px;
  position: relative;
  background-image: url(/kiyosumishirakawa/02/image/spot3.png);
}
#spot .spot3 p {
  font-size: 13px;
  line-height: 170%;
  text-align: left;
}
#spot .spot3 .t1 {
  position: absolute;
  left: 505px;
  top: 120px;
  width: 420px;
}
#spot .spot3 .t2 {
  position: absolute;
  left: 54px;
  left: 505px;
  top: 265px;
}
#spot .spot4 {
  height: 360px;
  position: relative;
  background-image: url(/kiyosumishirakawa/02/image/spot4.png);
}
#spot .spot4 p {
  font-size: 13px;
  line-height: 170%;
  text-align: left;
  width: 420px;
}
#spot .spot4 .t1 {
  position: absolute;
  left: 54px;
  top: 130px;
}
#spot .spot4 .t2 {
  position: absolute;
  left: 54px;
  top: 260px;
}
#spot .spot5 {
  height: 360px;
  position: relative;
  background-image: url(/kiyosumishirakawa/02/image/spot5.png);
}
#spot .spot5 p {
  font-size: 13px;
  line-height: 170%;
  text-align: left;
  width: 420px;
}
#spot .spot5 .t1 {
  position: absolute;
  left: 505px;
  top: 120px;
}
#spot .spot5 .t2 {
  position: absolute;
  left: 505px;
  top: 260px;
}
#spot .spot6 {
  width: 960px;
  height: 722px;
  position: relative;
  background-image: url(/kiyosumishirakawa/02/image/spot6.png);
}
#spot .spot6 p {
  text-align: justify;
  width: 810px;
  font-size: 12px;
}
#spot .spot6 p.t1 {
  position: absolute;
  left: 75px;
  top: 85px;
}
#spot .spot6 p.t2 {
  position: absolute;
  left: 75px;
  top: 200px;
}
#spot .spot6 ul {
  overflow: hidden;
  position: absolute;
  left: 40px;
  top: 460px;
  text-align: justify;
}
#spot .spot6 li {
  float: left;
  width: 230px;
  margin-right: 50px;
  font-size: 12px;
}

/*===================*/

#contents #point2 {
  height: 710px;
  margin-bottom: 30px;
  background-image: url(/kiyosumishirakawa/02/image/point2.jpg);
  position: relative;
}
#point2 p {
  font-size: 13px;
  line-height: 170%;
  text-align: left;
  position: absolute;
  left: 169px;
  top: 114px;
}
.color {
  color: #4bc3c8;
}
#spot a {
  color: #4bc3c8;
}

@media screen and (max-width: 640px) {
  #contents #topInfo {
    background-color: #fdf8ea;
    padding: 0px;
    padding-top: 20%;
    padding-bottom: 30px;
    height: 80%;
    width: 100%;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 20px;
    margin-left: 0px;
    background-image: url(./image/topback-sp.png);
    background-size: 100%;
    position: relative;
  }
  #topInfo .cap {
    height: auto;
    width: 90%;
    margin: 0 auto;
    position: static;
    text-align: left; /*background-image: url(image/toptxt.png);*/
    font-size: 15px;
    font-weight: bold;
  }
  #topInfo .point {
    height: 350px;
    width: 234px;
    position: static;
    left: 712px;
    top: 61px;
    background-image: none;
    display: none;
  }
  #spot {
    padding: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 30px;
    margin-left: 0px;
    background-image: url(/kiyosumishirakawa/02/image/spotback.jpg);
    position: relative;
    height: auto;
    width: 100%;
    padding: 30px 0;
    background-repeat: repeat;
  }
  #spot p {
    text-align: justify;
  }

  #spot img.sp-disp {
    width: 100%;
    margin: 0 auto;
  }
  #spot .spot1 {
    background-image: none;
    height: auto;
    width: 90%;
    margin: 0 auto;
    position: relative;
    left: 0px;
    top: 0px;
  }
  #spot .spot1 .t1,
  #spot .spot1 .t2,
  #spot .spot1 .t3 {
    font-size: 13px;
    line-height: 170%;
    text-align: left;
  }
  #spot .spot1 .t4,
  #spot .spot1 .t5 {
    font-size: 12px;
    line-height: 150%;
    text-align: left;
  }
  #spot .spot1 .t5 {
    padding-top: 20px;
  }
  #spot .spot1 .t1 {
    position: static;
    left: 54px;
    top: 400px;
    width: 100%;
    text-align: justify;
  }
  #spot .spot1 .t2 {
    position: static;
    left: 54px;
    top: 830px;
  }
  #spot .spot1 .t3 {
    position: static;
    left: 54px;
    top: 910px;
  }
  #spot .spot1 .t4 {
    position: static;
    left: 540px;
    top: 90px;
    width: 100%;
    text-align: justify;
  }
  #spot .spot1 .t5 {
    position: static;
    left: 540px;
    top: 290px;
    width: 100%;
    text-align: justify;
  }
  #spot .spot2 {
    height: auto;
    background-image: none;
    position: relative;
    width: 90%;
    margin: 0 auto;
  }
  #spot .spot2 .t1 {
    position: static;
    left: 54px;
    top: 150px;
    height: auto;
    width: 100%;
  }
  #spot .spot2 .t2 {
    position: static;
    left: 54px;
    top: 275px;
  }
  #spot .spot2 p {
    font-size: 13px;
    line-height: 170%;
    text-align: left;
  }
  #spot .spot3 {
    height: auto;
    position: relative;
    background-image: none;
    width: 90%;
    margin: 0 auto;
  }
  #spot .spot3 p {
    font-size: 13px;
    line-height: 170%;
    text-align: left;
  }
  #spot .spot3 .t1 {
    position: static;
    left: 505px;
    top: 120px;
    width: 100%;
  }
  #spot .spot3 .t2 {
    position: static;
    left: 54px;
    left: 505px;
    top: 265px;
  }
  #spot .spot4 {
    height: auto;
    width: 90%;
    margin: 0 auto;
    position: relative;
    background-image: none;
  }
  #spot .spot4 p {
    font-size: 13px;
    line-height: 170%;
    text-align: left;
    width: 100%;
  }
  #spot .spot4 .t1 {
    position: static;
    left: 54px;
    top: 130px;
    width: 100%;
  }
  #spot .spot4 .t2 {
    position: static;
    left: 54px;
    top: 260px;
    width: 100%;
  }
  #spot .spot5 {
    height: auto;
    width: 90%;
    margin: 0 auto;
    position: relative;
    background-image: none;
  }
  #spot .spot5 p {
    font-size: 13px;
    line-height: 170%;
    text-align: left;
    width: 100%;
  }
  #spot .spot5 .t1 {
    position: static;
    left: 505px;
    width: 100%;
    top: 120px;
  }
  #spot .spot5 .t2 {
    position: static;
    left: 505px;
    top: 260px;
    width: 100%;
  }
  #spot .spot6 {
    width: 90%;
    margin: 0 auto;
    height: auto;
    position: relative;
    background-image: none;
  }
  #spot .spot6 p {
    text-align: justify;
    width: 100%;
    font-size: 12px;
  }
  #spot .spot6 p.t1 {
    position: static;
    left: 75px;
    top: 85px;
  }
  #spot .spot6 p.t2 {
    position: static;
    left: 75px;
    top: 200px;
  }
  #spot .spot6 ul {
    overflow: hidden;
    position: static;
    left: 40px;
    top: 460px;
    text-align: justify;
    padding: 0;
  }
  #spot .spot6 li {
    float: left;
    width: 100%;
    margin-right: 0px;
    font-size: 12px;
    margin-top: 20px;
    margin-bottom: 40px;
  }

  /*===================*/

  .point2_wrap {
    width: 90%;
    margin: 0 auto;
    overflow: scroll;
  }

  #contents #point2 {
    width: 960px;
    height: 710px;
    margin-bottom: 30px;
    background-image: url(/kiyosumishirakawa/02/image/point2.jpg);
    position: relative;
  }
  #point2 p {
    font-size: 13px;
    line-height: 170%;
    text-align: left;
    position: absolute;
    left: 169px;
    top: 114px;
    width: 544px;
  }
  .color {
    color: #4bc3c8;
  }
  #spot a {
    color: #4bc3c8;
  }

  .info-y {
    color: #fff;
    background: #f2bc17;
    width: 40% !important;
    font-size: 18px;
    padding: 8px 5px;
    margin-left: 0;
    text-align: center;
  }

  .bold {
    font-weight: bold;
    font-size: 18px;
  }
  .bold.pink {
    color: #f789ae;
  }
}