@charset "UTF-8";

@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap");

/* floatの解除①（floatの直後に設置） */
.myclear {
  clear: both;
}

/* floatの解除②（floatの親要素に設置） */
.myclearfix {
  min-height: 1px;
}
.float_l {
  float: left;
}
.float_r {
  float: right;
}
img.float_r {
  margin-left: 20px;
}
img.float_l {
  margin-right: 20px;
}

html {
  scroll-behavior: smooth;
}
body {
  font-size: 16px;
  line-height: 1.7;
  font-family: "Noto Sans JP", sans-serif, "Noto Serif JP", serif;
}
a {
  text-decoration: none;
  color: inherit;
  transition: 0.2s ease-in-out;
}
a:hover {
  opacity: 0.7;
}
ul {
  padding: 0;
}
ul li {
  list-style: none;
}
p {
  word-break: break-all;
  margin-top: 20px;
  margin-bottom: 20px;
}
p.photo {
  margin: 0;
  text-align: center;
}
p.photo img {
  width: 100%;
}
.columnbox {
  display: flex;
}
.columnbox.reverse {
  flex-direction: row-reverse;
}
.grid {
  max-width: 1260px;
  width: 100%;
  margin: 0 auto;
}
.grid.small {
  max-width: 980px;
  /* background-color: lime; */
  padding: 80px 0 50px 0;
}
/* 内部余白 */
.inner_blank {
  padding: 30px 20px;
  box-sizing: border-box;
}
header .inner_blank,
header .grid.small.inner_blank {
  padding: 15px 20px;
}

.section.tel .grid.small.inner_blank,
footer .grid.small.inner_blank.nonesection {
  padding: 30px 20px;
}
.pc_view {
  display: block !important;
}
.sp_view {
  display: none !important;
}

/* @media screen and (max-width:1260px) {
  .inner_blank {
    padding: 0 25px;
  }
} */

@media screen and (max-width: 980px) {
}

@media screen and (max-width: 768px) {
  .columnbox {
    display: block;
  }
  /* 内部余白 */
  .inner_blank {
    padding: 5vw 4% 6vw 4%;
  }
  .pc_view {
    display: none !important;
  }
  .pc_view.small {
    display: block !important;
  }
  .sp_view {
    display: block !important;
  }
  .sp_view.small {
    display: none !important;
  }
  .float_l {
    float: none;
  }
  .float_r {
    float: none;
  }
  img.float_r {
    margin-left: 0px;
  }
  img.float_l {
    margin-right: 0px;
  }
}

@media screen and (max-width: 399px) {
  .pc_view.small {
    display: none !important;
  }
  .sp_view.small {
    display: block !important;
  }
}
