@charset "UTF-8";
/*  letter-spacing: tracking(140); */
/*    @include l_h(23, 40.25); */
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: baseline;
  word-break: break-word;
  overflow-wrap: break-word;
  text-align: justify;
}

article.article p,
article.article h2,
article.article h3 {
  margin-top: 14px;
  margin-bottom: 14px;
}

@media screen and (max-width:375px) {
  article.article p,
  article.article  h2,
  article.article  h3{
    margin-top: 10px;
    margin-bottom: 10px;
  }
}

body {
  color: #000;
  font-size: 16px;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: #000;
  text-decoration: none;
  opacity: 1;
  transition: opacity 0.8s ease;
}
a:hover {
  opacity: 0.6;
}

ul {
  list-style: none;
}

input,
button,
select,
textarea {
  -webkit-appearance: none;
}

.db {
  display: block;
}

.flex {
  display: flex;
}

.flex_reverse {
  flex-direction: row-reverse;
}

.justify_center {
  justify-content: center;
}

.justify_end {
  justify-content: flex-end;
}

.space_between {
  justify-content: space-between;
}

.align_items_center {
  align-items: center;
}

.flex_wrap {
  flex-wrap: wrap;
}

.ta-l {
  text-align: left;
}

.ta-c {
  text-align: center;
}

.ta-r {
  text-align: right;
}

.fw_bold {
  font-weight: bold;
}

.green {
  color: #0bb357;
}

.green_bg {
  background-color: #0bb357;
}

.yellow_bg {
  background-color: #fff150;
}

.gray_bg {
  background-color: #f1f1f1;
}

.content {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

.to_form {
  width: 260px;
  height: 54px;
  border-radius: 27px;
}

#header {
  height: 80px;
  position: sticky;
  top: 0;
  left: 0;
  z-index: 100;
  background-color: rgb(255, 255, 255);
}
#header .header_wrap {
  height: 100%;
}
#header .logo_wrap {
  margin-left: 42px;
  margin-right: auto;
}
#header .to_official {
  margin-right: 20px;
}

#appeal {
  padding: 50px 0;
}
#appeal .content {
  padding: 0 30px;
}
#appeal .content > div {
  display: inline-block;
}
#appeal .yellow_bg {
  font-size: 28px;
  padding: 20px;
  line-height: 1;
}
#appeal .point_wrap {
  position: relative;
  margin: 20px 0 24px;
}
#appeal .message {
  font-size: 45px;
  color: #fff;
  line-height: 1.2;
}
#appeal .message span {
  font-size: 38px;
}

#point {
  padding: 30px 0;
}
#point .content > div > div {
  align-items: flex-start;
}

#smooth {
  padding: 80px 0;
}
#smooth .select {
  margin-bottom: 78px;
}
#smooth .select a {
  display: block;
}
#smooth .select a:first-child {
  margin-bottom: 25px;
}
#smooth .select img {
  max-width: 460px;
  width: 100%;
  height: auto;
  display: block;
  margin: auto;
}
#smooth .truck img {
  width: 103px;
  height: 70px;
}
#smooth h2 {
  margin: 10px auto 35px;
}
#smooth p {
  font-size: 17px;
  line-height: 1.8823529412;
}
#smooth .slideshare {
  max-width: 653px;
  width: 100%;
  height: auto;
  position: relative;
}
#smooth .slideshare iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#achievement {
  padding: 52px 0 80px;
  overflow-x: hidden;
}
#achievement .content {
  position: relative;
}
#achievement li {
  margin-bottom: 14px;
}
#achievement li:last-of-type {
  margin-bottom: 0;
}
#achievement .wrap {
  margin-top: 32px;
  padding: 28px 50px 26px 45px;
  display: inline-block;
  background-color: #fff;
}
#achievement .head {
  font-size: 20px;
  line-height: 1.6;
  margin-right: 18px;
  padding: 6px 0;
  border-radius: 5px;
  width: 200px;
  color: #fff;
}

#estimate {
  padding: 70px 0 150px;
}
#estimate .content {
  max-width: 1044px;
}
#estimate .head {
  width: 100%;
  color: #fff;
  font-size: 15px;
  line-height: 1;
  padding: 15px 6px 15px 20px;
  border: 1px solid #7f7f7f;
  border-right: none;
  border-bottom: none;
}
#estimate .req {
  width: 34px;
  height: 20px;
  font-size: 11px;
  border-radius: 5px;
  color: #000;
  background-color: #fff150;
}
#estimate .req.no {
  color: #fff;
  background-color: #7f7f7f;
}
#estimate .text {
  width: 100%;
  border: 1px solid #7f7f7f;
  border-bottom: none;
  padding: 10px 40px 10px 30px;
}
#estimate input[type=text],
#estimate input[type=email],
#estimate textarea {
  width: 100%;
  height: 54px;
  border: 1px solid #a0a0a0;
  padding: 0 10px;
  font-size: 16px;
  line-height: 2.3125;
}
#estimate input[type=text]::placeholder,
#estimate input[type=email]::placeholder,
#estimate textarea::placeholder {
  color: #666666;
}
#estimate textarea {
  height: 160px;
}
#estimate .table_wrap {
  margin-top: 32px;
}
#estimate .table_wrap > div:last-child .head,
#estimate .table_wrap > div:last-child .text {
  border-bottom: 1px solid #7f7f7f;
}
#estimate p {
  font-size: 20px;
  line-height: 1.36;
  margin: 56px 0 25px;
}
#estimate .table_wrap2 .head {
  width: 100%;
  border: 1px solid #7f7f7f;
}
#estimate .table_wrap2 .text {
  border: 1px solid #7f7f7f;
  border-top: none;
  border-bottom: none;
}
#estimate .table_wrap2 > div:last-child .text {
  border-bottom: 1px solid #7f7f7f;
}
#estimate .verification {
  font-size: 17px;
  line-height: 1.8823529412;
  margin-top: 42px;
}
#estimate .verification a {
  color: #009ee7;
  text-decoration: underline;
}
#estimate .agree {
  margin: 30px 0 26px;
}
#estimate .agree .req {
  margin-right: 4px;
}
#estimate .checkbox {
  cursor: pointer;
  display: inline-block;
  padding: 0 0 0 30px;
  position: relative;
  width: auto;
  font-size: 17px;
  line-height: 1.8823529412;
}
#estimate .checkbox:before {
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 50%;
  content: "";
  display: block;
  height: 16px;
  left: 5px;
  margin-top: -9px;
  position: absolute;
  top: 50%;
  width: 16px;
}
#estimate .checkbox:after {
  border-right: 6px solid #0bb357;
  border-bottom: 3px solid #0bb357;
  content: "";
  display: block;
  height: 20px;
  left: 7px;
  margin-top: -16px;
  opacity: 0;
  position: absolute;
  top: 50%;
  transform: rotate(45deg) translate3d(0, 2px, 0) scale3d(0.7, 0.7, 1);
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
  width: 9px;
}
#estimate #agree {
  display: none;
}
#estimate #agree:checked + .checkbox:before {
  border-color: #666;
}
#estimate #agree:checked + .checkbox:after {
  opacity: 1;
  transform: rotate(45deg) scale3d(1, 1, 1);
}
#estimate .submit {
  background-color: #0bb357;
  color: #fff;
  border-radius: 30px;
  width: 250px;
  height: 60px;
  font-size: 16px;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: bold;
  border: none;
  text-align: center;
  cursor: pointer;
  opacity: 1;
  transition: opacity 0.8s ease;
}
#estimate .submit:hover {
  opacity: 0.8;
}
#estimate #result {
  margin-top: 30px;
  border: 1px solid #fff150;
  display: inline-block;
}

#privacy {
  padding: 80px 0;
}
#privacy .content {
  background-color: #fff;
  padding: 50px 98px;
}
#privacy .content > p:nth-of-type(3) {
  margin-bottom: 0;
}
#privacy h2 {
  margin-bottom: 22px;
}
#privacy h3 {
  margin-bottom: 6px;
  font-size: 17px;
  line-height: 1.8823529412;
}
#privacy p {
  margin-bottom: 12px;
  font-weight: 500;
  font-size: 17px;
  line-height: 1.8823529412;
}
#privacy li {
  font-weight: 500;
  font-size: 17px;
  line-height: 1.8823529412;
}

footer .content {
  padding: 25px 30px 22px;
}
footer .footer_menu {
  flex-direction: column;
  justify-content: end;
}
footer .footer_menu a {
  font-size: 15px;
  display: block;
  margin-top: 14px;
}
footer .credit {
  font-size: 13px;
  color: #fff;
  padding: 18px 20px;
  line-height: 1;
}

#thanx {
  padding-top: 80px;
  padding-bottom: 80px;
}
#thanx .content {
  padding-top: 63px;
  padding-bottom: 100px;
  background-color: #fff;
}
#thanx .mail_icon_wrap {
  margin-top: 16px;
  margin-bottom: 40px;
}
#thanx .to_top_wrap {
  margin-top: 76px;
}
#thanx .to_top_wrap a {
  margin: auto;
}

/****************************/
/**********PC以上************/
/***************************/
@media screen and (min-width: 1200px) {
  .only_sp {
    display: none;
  }
  .content h2 {
    font-size: 32px;
    line-height: 1.40625;
  }
  #appeal .point_wrap > div span:nth-child(2) {
    margin-left: 10px;
    margin-right: 10px;
  }
  #appeal .truck {
    position: absolute;
    right: -312px;
    top: -78px;
  }
  #point .no2 {
    margin: 0 20px 15px;
  }
  #smooth .slideshare {
    margin-left: auto;
  }
  #achievement .photo {
    position: absolute;
    right: -10px;
    bottom: -20px;
    width: 403px;
    height: 303px;
  }
  #estimate .head {
    max-width: 270px;
  }
  #estimate .req {
    margin-top: 8px;
  }
  #estimate .max250 input[type=text] {
    max-width: 250px;
  }
  #estimate .table_wrap2 .head {
    height: 63px;
    max-width: none;
  }
  #estimate .agree .req {
    margin-top: 0;
  }
}
/****************************/
/**********スマホ************/
/***************************/
@media screen and (max-width: 1199px) {
  .only_pc {
    display: none;
  }
  .content {
    padding: 0 15px;
  }
  .content h2 {
    font-size: 25px;
    line-height: 1.2;
  }
  #header {
    height: 60px;
  }
  #header .content {
    padding: 0;
  }
  #header .logo_wrap {
    margin-left: 15px;
    max-width: 142px;
  }
  #header .logo_wrap img {
    width: 100%;
    height: auto;
  }
  #header .to_official {
    width: 65px;
    height: 60px;
    background-color: #325bb4;
    margin: 0;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 11px;
  }
  #header .to_official img {
    width: 18px;
    height: 24px;
  }
  #header .to_form {
    width: 65px;
    height: 60px;
    border-radius: 0;
  }
  #header .to_form img {
    width: 25px;
    height: 18px;
  }
  #appeal {
    padding: 30px 0;
  }
  #appeal img {
    width: 100%;
    height: auto;
    display: block;
  }
  #appeal .content {
    text-align: center;
  }
  #appeal .point_wrap {
    display: flex;
    align-items: center;
  }
  #appeal .point_wrap > .flex {
    flex-direction: column;
    margin-right: 10px;
  }
  #appeal .yellow_bg {
    font-size: 18px;
    padding: 12px;
    text-align: center;
    white-space: nowrap;
  }
  #appeal .yellow_bg:nth-child(2) {
    margin: 6px 0;
  }
  #appeal .message {
    font-size: 29px;
    line-height: 1.275862069;
  }
  #appeal .message span {
    font-size: 29px;
  }
  #appeal .logo {
    max-width: 445px;
  }
  #appeal .truck {
    max-width: 237px;
  }
  #point {
    padding: 30px 0;
  }
  #point .content > div {
    max-width: 690px;
    width: 100%;
    margin: auto;
  }
  #point img {
    width: 100%;
    height: auto;
  }
  #point .no1 {
    margin-right: 10px;
    margin-bottom: 10px;
    max-width: 340px;
    width: 50%;
  }
  #point .no2 {
    max-width: 340px;
    margin-bottom: 10px;
    width: 50%;
  }
  #point .no3 {
    margin-bottom: 10px;
    max-width: 690px;
    width: 100%;
  }
  #point .no4 {
    max-width: 690px;
    width: 100%;
  }
  #smooth {
    padding: 30px 0;
  }
  #smooth .select {
    flex-direction: column;
  }
  #smooth .select a:first-child {
    margin-bottom: 7px;
  }
  #smooth .slideshare {
    margin: 35px auto 0;
    height: 436px;
  }
  #smooth .slideshare iframe {
    max-height: 427px;
  }
  #smooth h2 {
    text-align: left;
    margin: 10px auto 18px;
  }
  #smooth p {
    text-align: left;
    font-size: 17px;
    line-height: 1.4705882353;
  }
  #achievement {
    padding: 30px 0;
  }
  #achievement .wrap {
    margin-top: 18px;
  }
  #achievement .content {
    text-align: center;
  }
  #achievement li {
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 25px;
  }
  #achievement .head {
    font-size: 18px;
    line-height: 1.3888888889;
    margin-bottom: 10px;
  }
  #achievement .text {
    font-size: 17px;
    line-height: 1.4705882353;
  }
  #achievement .photo {
    display: block;
    max-width: 622px;
    width: 100%;
    height: auto;
    margin: 20px auto 0;
    padding: 0 18px;
  }
  #estimate {
    padding: 30px 0 100px;
  }
  #estimate .table_wrap > .flex {
    flex-direction: column;
  }
  #estimate .head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 10px;
  }
  #estimate .text {
    padding: 10px;
  }
  #estimate .req {
    font-size: 12px;
  }
  #estimate p {
    font-size: 18px;
    line-height: 1.3888888889;
    text-align: left;
    margin: 14px 0 12px;
  }
  #estimate .table_wrap2 .head {
    font-size: 15px;
    line-height: 1.6666666667;
  }
  #estimate .verification {
    text-align: left;
    margin-top: 28px;
  }
  #privacy {
    padding: 40px 15px;
  }
  #privacy .content {
    padding: 29px 9px;
  }
  #privacy h2 {
    margin-bottom: 22px;
  }
  #privacy h3 {
    margin-bottom: 6px;
    font-size: 17px;
    line-height: 1.4705882353;
  }
  #privacy p {
    margin-bottom: 12px;
    font-size: 17px;
    line-height: 1.4705882353;
  }
  #privacy li {
    font-size: 17px;
    line-height: 1.4705882353;
  }
  footer .content > div {
    flex-direction: column;
  }
  footer .content > div > div {
    text-align: center;
  }
  footer .content a {
    text-align: center;
  }
  footer .content p {
    text-align: center;
  }
  footer .footer_menu {
    margin-top: 20px;
  }
  #thanx {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  #thanx .content {
    padding-top: 37px;
    padding-bottom: 60px;
  }
  #thanx .mail_icon_wrap {
    margin-top: 27px;
    margin-bottom: 34px;
    width: 77.5px;
    height: 60px;
    margin-left: auto;
    margin-right: auto;
  }
  #thanx .mail_icon_wrap img {
    width: 100%;
    height: auto;
  }
  #thanx .thanx_p {
    text-align: left;
    font-size: 17px;
  }
  #thanx .to_top_wrap {
    margin-top: 61px;
  }
}
@media screen and (max-width: 720px) {
  #smooth .slideshare {
    height: 0;
    padding-top: 62vw;
  }
}
@media screen and (max-width: 400px) {
  #appeal .yellow_bg {
    font-size: 16px;
  }
  #appeal .message {
    font-size: 25px;
    line-height: 1.2;
  }
  #appeal .message span {
    font-size: 25px;
  }
  #smooth .slideshare {
    padding-top: 73.35%;
  }
}/*# sourceMappingURL=style.css.map */

/* useful */

.useful {
  text-align: center;
  padding: 52px 0;
  }

  @media screen and (max-width:1199px) {
    .useful{
      padding: 30px 0;
    }
  }
  
  .black.ta-c {
  position: relative;
  padding-bottom: 24px;
  font-size: 25px;
  font-weight: bold;
  line-height: 1.2;
  text-align: center;
  }
  
  .black.ta-c::after{
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 4%;
  height: 4px;
  transform: translateX(-50%);
  background-color: #c9211e;
  border-radius: 8px;
  }
  
  .useful-news.useful {
  margin-top: 64px;
  }
  
  .useful__list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
  }

@media screen and (max-width:1199px) {
.useful__list{
grid-template-columns: 1fr 1fr;
}
}
  
  @media screen and (max-width:785px) {
  .useful__list{
  grid-template-columns: 1fr;
  }
  }
  
  @media screen and (max-width:785px) {
  .useful__item{
  justify-self: center;
  }    
  }
  
  .useful__image {
  display: block;
  width: 100%;
  height: 200px;
  }
  
  .useful__title {
  margin-top: 16px;
  font-weight: bold;
  }
  
  .date {
  display: block;
  color: #ccc;
  margin-top: 8px;
  }

  .button{
    display: flex;
    justify-content: center;
  }
  
  .button__link{
  display: inline-block;
  margin-top: 64px;
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  padding: 12px 86px 12px 86px;
  background-color: #c9211e;
  border-radius: 4px;
  position: relative;
  }
  
  .useful__content__button::after{
  content: '';
  width: 7px;
  height: 7px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: rotate(-45deg);
  position: absolute;
  top: calc(50% - 3px);
  right: 16px;
  }
  
  .article__pagination-wrapper{
      display: flex;
      justify-content: space-between;
      margin-top: 40px;
  }
  
  .pagination-wrapper__link-prev{
  position: relative;
  color: #fff;
  border-radius: 4px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: bold;
  background-color: #6985B2;
  }
  
  .pagination-wrapper__link-next{
  position: relative;
  color: #fff;
  border-radius: 4px;
  padding: 12px 35px 12px 24px;
  font-size: 14px;
  font-weight: bold;
  background-color: #6985B2;
  }
  
  .pagination-wrapper__link-prev::after{
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  left: 16px;
  width: 6px;
  height: 6px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(135deg);
  }
  .pagination-wrapper__link-next::after{
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  right: 16px;
  width: 6px;
  height: 6px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(-45deg);
  }
  
  /* 個別ページ */

.content__inner{
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-inline: 25px;
width:100%;
  }
  
  .content__useful{
  display: flex;
  justify-content: space-between;
  gap: 48px;
  padding: 100px 0 120px;
  }
  
  @media screen and (max-width:980px) {
  .content__useful{
      flex-direction: column;
      align-items: center;
  }
  }
  
  .article {
  width: 62%;
  }
  
  @media screen and (max-width:700px) {
  .article{
      width: 100%;
  }    
  }
  
  .article__category {
  padding: 4px 8px;
  color: #fff;
  background-color: #6985B2;
  border-radius: 4px;
  }
  
  .time {
  color: #ccc;
  margin-left: 16px;
  }
  
  @media screen and (max-width:375px) {
  .time{
  display: block;
  margin-left: 0;
  margin-top: 8px;
  } 
  }
  
  .article__title {
  margin-top: 24px;
  font-size: 32px;
  border-bottom: 2px solid #c9211e;
  }
  
  @media screen and (max-width:1200px) {
  .article__title{
  font-size: 25px;
  }
  }
  
  .article__image {
  width: 100%;
  height: 500px;
  margin-top: 24px;
  aspect-ratio: 780/380;
  }
  
  @media screen and (max-width:780px) {
  .article__image{
      aspect-ratio: 315/176;
	max-height:300px;
  }
  }
  
  .article__content{
  margin-top: 104px;
  }
  
  .sidebar {
  flex: 1;
  width: 100%;
  }
  
  .sidebar__search.search{
  margin-top: 8px;
  display: flex;
  gap: 8px;
  }
  
  .search__input[type="text"]{
  padding: 4px 8px;
  border: none;
  flex: 1;
  background-color: #f0f0f0;
  }
  
  input[type="submit"]{
  padding: 4px;
  cursor: pointer;
  }
  
  .sidebar__title.category {
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  background-color: #6985B2;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 18px;
  margin-top: 32px;
  text-align: center;
  }
  
  .category__list {
  margin-top: 18px;
  }
  
  .category__item {
  padding-bottom: 18px;
  margin-top: 18px;
  padding-left: 18px;
  border-bottom: 1px solid #e4e4e4;
  }
  
  .category__link {
  font-size: 14px;
  font-weight: 300;
  color: #000;
  }