@charset "UTF-8";
/* color */
/* archive */
/* -------------------------- */
/* info  お知らせー一覧*/
/* -------------------------- */
#info .info {
  padding: 2rem 0;
}
@media screen and (min-width: 1024px) {
  #info .info {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 3rem 0;
  }
}
#info .info-post {
  padding: 1rem;
}
#info .info-post .row {
  padding: 0 0 3rem;
  position: relative;
}
#info .info-post-box {
  border: 1px solid #ccc;
  padding: 3rem;
  background-color: #fff;
  margin: 0 0 2rem 0;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #info .info-post-box {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    margin: 0 3rem 3rem 0;
    flex: 0 0 30%;
  }
}
#info .info-post-box:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 1px;
  background: #009be4;
  transition-property: width;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#info .info-post-box:after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 0px;
  background: #009be4;
  transition-property: height;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#info .info-post-box a {
  text-decoration: none;
  color: inherit;
}
#info .info-post-box a .ymd {
  padding: 1rem;
}
@media screen and (min-width: 1024px) {
  #info .info-post-box a .ymd {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#info .info-post-box a .cat {
  color: #009be4;
  border: #009be4 1px solid;
  padding: 2px 1.5rem 0;
}
#info .info-post-box h2 {
  padding: 0.5rem 0;
  color: #009be4;
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
}
@media screen and (min-width: 1024px) {
  #info .info-post-box h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    font-size: 2rem;
  }
}
#info .info-post-box p {
  padding-top: 2rem;
}
#info .info-post .active:before {
  width: 3rem;
}
#info .info-post .active:after {
  height: 6rem;
}

/* -------------------------- */
/* result */
/* -------------------------- */
#result .result {
  padding-bottom: 2rem;
}
@media screen and (min-width: 1024px) {
  #result .result {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#result .result .row {
  padding-bottom: 3rem;
}
@media screen and (min-width: 1024px) {
  #result .result .row {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    margin: 0 auto;
    padding: 3rem 0;
    width: 80%;
  }
}
#result .result-post {
  padding: 1rem 0;
  position: relative;
}
#result .result-post .hooper {
  height: 100%;
}
#result .result-post-head {
  padding: 7rem 0 5rem;
}
@media screen and (min-width: 1024px) {
  #result .result-post-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 10rem 0 5rem;
  }
}
#result .result-post-head .mintyou {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
}
@media screen and (min-width: 1024px) {
  #result .result-post-head .mintyou {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    font-size: 3rem;
  }
}
#result .result-post-head .mintyou span {
  color: #009be4;
}
#result .result-post-head .mintyou hr {
  width: 30px;
  color: #009be4;
  margin: 0 2rem 0;
}
#result .result-post-head h2 {
  text-align: center;
  font-size: 1.4rem;
}
@media screen and (min-width: 1024px) {
  #result .result-post-head h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#result .result-post-box {
  border: 2px solid #ccc;
  padding: 1.5rem;
  background-color: #fff;
  margin: 0 0 2rem 0;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    margin: 0 0 3rem 0;
    padding: 3rem;
  }
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:first-child {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    width: 50%;
  }
}
#result .result-post-box-item:first-child h3 {
  padding: 0.5rem 1rem;
  color: #009be4;
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:first-child h3 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 1rem 2rem;
  }
}
#result .result-post-box-item:first-child .result-post-box-item-head {
  padding: 1rem 2rem;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:first-child .result-post-box-item-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#result .result-post-box-item:first-child .result-post-box-item-head .ymd {
  padding-right: 1rem;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:first-child .result-post-box-item-head .ymd {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#result .result-post-box-item:first-child .result-post-box-item-head .cat {
  color: #009be4;
  border: #009be4 1px solid;
  padding: 0 1.5rem;
}
#result .result-post-box-item:first-child figure {
  padding: 2rem;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:first-child figure {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 2rem 0 0;
    width: 70%;
    margin: 0 auto;
  }
}
#result .result-post-box-item:first-child figure img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 250px;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:first-child figure img {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#result .result-post-box-item:nth-child(2) {
  width: 100%;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:nth-child(2) {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    width: 50%;
  }
}
#result .result-post-box-item:nth-child(2) .result-post-txt {
  padding: 1rem 0 5rem 2rem;
}
#result .result-post-box-item:nth-child(2) a {
  position: absolute;
  right: 1rem;
  bottom: 0;
  background-color: #009be4;
  border-left: 2px solid #009be4;
  padding: 0.5rem 3rem 0.7rem;
  color: #fff;
}
@media screen and (min-width: 1024px) {
  #result .result-post-box-item:nth-child(2) a {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    right: 2rem;
    bottom: 0;
  }
}

/* -------------------------- */
/* voice お客様の声一覧*/
/* -------------------------- */
#voice .voice {
  padding-bottom: 2rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#voice .voice-post {
  padding: 1rem 0;
  position: relative;
}
#voice .voice-post-head {
  padding: 2rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 2rem 0 5rem;
  }
}
#voice .voice-post-head .teko {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
  margin-bottom: -1.5rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-head .teko {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    font-size: 4rem;
  }
}
#voice .voice-post-head .teko span {
  color: #009be4;
}
#voice .voice-post-head .teko hr {
  width: 30px;
  color: #009be4;
  margin: 0 2rem 0;
}
#voice .voice-post-head h2 {
  text-align: center;
  font-size: 1.4rem;
  margin-bottom: 1rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-head h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#voice .voice-post-head p {
  text-align: center;
}
#voice .voice-post .row {
  padding-bottom: 3rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post .row {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 3rem 0;
  }
}
#voice .voice-post-box {
  border: 1px solid #ccc;
  padding: 0;
  background-color: #fff;
  margin: 0 0 2rem 0;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-box {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    margin: 0 3rem 3rem 0;
    flex: 0 0 30%;
  }
}
#voice .voice-post-box:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 1px;
  background: #009be4;
  transition-property: width;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#voice .voice-post-box:after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 0px;
  background: #009be4;
  transition-property: height;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#voice .voice-post-box-head {
  padding: 1rem 2rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-box-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#voice .voice-post-box-head .ymd {
  padding-right: 1rem;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-box-head .ymd {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#voice .voice-post-box-head .cat {
  color: #009be4;
  border: #009be4 1px solid;
  padding: 0 1.5rem;
}
#voice .voice-post-box-head h2 {
  padding: 0.5rem 2rem;
  color: #009be4;
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-box-head h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#voice .voice-post-box figure {
  width: 100%;
}
#voice .voice-post-box figure img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 250px;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-box figure img {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#voice .voice-post-box h3 {
  padding: 0.5rem 2rem;
  /*color: $main;*/
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
}
@media screen and (min-width: 1024px) {
  #voice .voice-post-box h3 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 1rem 2rem;
  }
}
#voice .voice-post-box .voice-post-txt {
  padding: 1rem 2rem 5rem 2rem;
}
#voice .voice-post-box a {
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  background-color: #000;
  padding: 0.5rem 2rem;
  color: #fff;
}
#voice .voice-post .active:before {
  width: 3rem;
}
#voice .voice-post .active:after {
  height: 6rem;
}

/* -------------------------- */
/* スタッフ一覧*/
/* -------------------------- */
#staff .staff {
  padding-bottom: 2rem;
}
@media screen and (min-width: 1024px) {
  #staff .staff {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#staff .staff-post {
  padding: 1rem;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 1rem 0;
  }
}
#staff .staff-post-head {
  padding-bottom: 1.5rem;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding-bottom: 3rem;
  }
}
#staff .staff-post-head .teko {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
  margin-bottom: -1.5rem;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-head .teko {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    font-size: 4rem;
  }
}
#staff .staff-post-head .teko span {
  color: #009be4;
}
#staff .staff-post-head .teko hr {
  width: 30px;
  color: #009be4;
  margin: 0 2rem 0;
}
#staff .staff-post-head h2 {
  text-align: center;
  font-size: 1.4rem;
  margin-bottom: 1rem;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-head h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#staff .staff-post-head p {
  text-align: center;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-head p {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#staff .staff-post .row {
  padding-bottom: 3rem;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post .row {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 3rem 0;
  }
}
#staff .staff-post-box {
  border: 1px solid #ccc;
  padding: 0 0 4rem 0;
  background-color: #fff;
  margin: 0 0 2rem 0;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-box {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    margin: 0 3rem 3rem 0;
    flex: 0 0 30%;
  }
}
#staff .staff-post-box:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 1px;
  background: #009be4;
  transition-property: width;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#staff .staff-post-box:after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 0px;
  background: #009be4;
  transition-property: height;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#staff .staff-post-box figure {
  width: 100%;
  /*padding-top: 1.5rem;*/
}
#staff .staff-post-box figure img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 200px;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-box figure img {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#staff .staff-post-box .staff-post-item {
  padding: 1rem;
}
#staff .staff-post-box .staff-post-item span {
  /*
  color: #fff;
  background-color: $main;
  padding: 0 1.5rem;
  margin: 1rem 0;
  */
}
#staff .staff-post-box .staff-post-item h3 {
  padding: 0.5rem 0;
  font-size: 2rem;
  border-bottom: 2px solid #ec6c00;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
}
@media screen and (min-width: 1024px) {
  #staff .staff-post-box .staff-post-item h3 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#staff .staff-post-box .staff-post-item p {
  padding: 1rem 0;
}
#staff .staff-post-box .staff-post-item a {
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  background-color: #000;
  padding: 0.5rem 2rem;
  color: #fff;
}
#staff .staff-post .active:before {
  width: 3rem;
}
#staff .staff-post .active:after {
  height: 6rem;
}

/* -------------------------- */
/* blog  ブログ一覧*/
/* -------------------------- */
#blog .blog {
  padding: 5rem 0 3rem;
}
@media screen and (min-width: 1024px) {
  #blog .blog {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 3rem 0;
  }
}
#blog .blog-post {
  padding: 3rem 1.5rem;
  position: relative;
}
#blog .blog-post ul {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (min-width: 1024px) {
  #blog .blog-post ul {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#blog .blog-post ul li {
  border: 1px solid #ccc;
  padding: 3rem 1.5rem;
  background-color: #fff;
  margin: 0 0 2rem 0;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #blog .blog-post ul li {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    margin: 0 3rem 3rem 0;
    flex: 0 0 30%;
  }
}
#blog .blog-post ul li:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 1px;
  background: #009be4;
  transition-property: width;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#blog .blog-post ul li:after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 0px;
  background: #009be4;
  transition-property: height;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#blog .blog-post ul li a {
  text-decoration: none;
  color: inherit;
}
#blog .blog-post ul li a .ymd {
  padding: 1rem;
}
@media screen and (min-width: 1024px) {
  #blog .blog-post ul li a .ymd {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#blog .blog-post ul li a .cat {
  color: #009be4;
  border: #009be4 1px solid;
  padding: 0 1.5rem;
}
#blog .blog-post ul li a h2 {
  padding: 0.5rem 0;
  color: #009be4;
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
}
@media screen and (min-width: 1024px) {
  #blog .blog-post ul li a h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#blog .blog-post ul li a p {
  padding-top: 2rem;
}
#blog .blog-post ul li a figure {
  width: 100%;
  padding-top: 1.5rem;
}
#blog .blog-post ul li a figure img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 200px;
}
@media screen and (min-width: 1024px) {
  #blog .blog-post ul li a figure img {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#blog .blog-post ul .active:before {
  width: 3rem;
}
#blog .blog-post ul .active:after {
  height: 6rem;
}

/* -------------------------- */
/* home_photo 湘南の家写真*/
/* -------------------------- */
#home_photo .home_photo {
  padding-bottom: 2rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#home_photo .home_photo-post {
  padding: 1rem 0;
  position: relative;
}
#home_photo .home_photo-post-head {
  padding: 2rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 2rem 0 5rem;
  }
}
#home_photo .home_photo-post-head .teko {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
  margin-bottom: -1.5rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-head .teko {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    font-size: 4rem;
  }
}
#home_photo .home_photo-post-head .teko span {
  color: #009be4;
}
#home_photo .home_photo-post-head .teko hr {
  width: 30px;
  color: #009be4;
  margin: 0 2rem 0;
}
#home_photo .home_photo-post-head h2 {
  text-align: center;
  font-size: 1.4rem;
  margin-bottom: 1rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-head h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#home_photo .home_photo-post-head p {
  text-align: center;
}
#home_photo .home_photo-post .row {
  padding-bottom: 3rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post .row {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 3rem 0;
  }
}
#home_photo .home_photo-post-box {
  border: 1px solid #ccc;
  padding: 0;
  background-color: #fff;
  margin: 0 0 2rem 0;
  position: relative;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-box {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    margin: 0 3rem 3rem 0;
    flex: 0 0 30%;
  }
}
#home_photo .home_photo-post-box:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 1px;
  background: #009be4;
  transition-property: width;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#home_photo .home_photo-post-box:after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 0px;
  background: #009be4;
  transition-property: height;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.04, 0.435, 0.315, 0.9);
  transition-delay: 0.5s;
}
#home_photo .home_photo-post-box-head {
  padding: 1rem 2rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-box-head {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#home_photo .home_photo-post-box-head .ymd {
  padding-right: 1rem;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-box-head .ymd {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#home_photo .home_photo-post-box-head .cat {
  color: #009be4;
  border: #009be4 1px solid;
  padding: 0 1.5rem;
}
#home_photo .home_photo-post-box-head h2 {
  padding: 0.5rem 2rem;
  color: #009be4;
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-box-head h2 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#home_photo .home_photo-post-box figure {
  width: 100%;
}
#home_photo .home_photo-post-box figure img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 250px;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-box figure img {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
  }
}
#home_photo .home_photo-post-box h3 {
  padding: 0.5rem 2rem;
  /*color: $main;*/
  font-size: 1.7rem;
  font-weight: bold;
  border-bottom: 2px solid #009be4;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
}
@media screen and (min-width: 1024px) {
  #home_photo .home_photo-post-box h3 {
    /* タブレット用レイアウト 1,025px以上の範囲に収めるデザインはこの中に記述 */
    padding: 1rem 2rem;
  }
}
#home_photo .home_photo-post-box .home_photo-post-txt {
  padding: 1rem 2rem 5rem 2rem;
}
#home_photo .home_photo-post-box a {
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  background-color: #000;
  padding: 0.5rem 2rem;
  color: #fff;
}
#home_photo .home_photo-post .active:before {
  width: 3rem;
}
#home_photo .home_photo-post .active:after {
  height: 6rem;
}/*# sourceMappingURL=archive.css.map */