body {
  min-height: 100vh;
  background-attachment: fixed;
  background-size: cover;
  background-image: url("../images/pc-top_bg.jpg");
  background-repeat: no-repeat;
}

@media screen and (max-width: 768px) {
  body::before {
    background: url("../images/pc-top_bg.jpg") no-repeat center;
    background-size: cover;
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
  }
}

.first-view {
  background-image: url("../images/top/pc-top_fv.jpg");
  background-repeat: no-repeat;
  padding-top: 260px;
  padding-bottom: 300px;
}

.first-view h1 {
  font-size: 65px;
  letter-spacing: 0;
  color: #4c4b4c;
  font-weight: normal;
}

.first-view .m-text {
  display: block;
  color: #040000;
  letter-spacing: 0.1em;
}

.first-view .orange {
  font-weight: bold;
}

.first-view p {
  font-size: 64px;
  letter-spacing: -0.05rem;
  color: #040000;
}

@media screen and (max-width: 768px) {
  .first-view {
    background-image: url("../images/top/sp-top_fv.jpg");
    padding: 90px 0 200px 5.3vw;
    background-size: cover;
  }
  .first-view h1 {
    font-size: 36px;
  }
  .first-view .m-text {
    font-size: 15px;
  }
  .first-view p {
    font-size: 44px;
    line-height: 1.3;
  }
}

@media screen and (max-width: 400px) {
  .first-view {
    background-size: contain;
  }
}

/*--------------top-about*/
.top-about {
  margin: 210px 0 204px auto;
  background-image: url("../images/top/pc-top-about.jpg");
  background-position: top 0 right 0;
  background-size: 61.53846%;
  background-repeat: no-repeat;
}

.top-about .title {
  padding-top: 28px;
  padding-bottom: 38px;
}

.top-about .m-text {
  color: #040000;
}

.top-about .m-text .orange {
  background-image: url("../images/top/pc-text_bg.png");
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
  padding: 8px 24px;
  margin-right: 14px;
  font-weight: bold;
}

.top-about .text {
  margin-top: 60px;
  padding-bottom: 60px;
}

.top-about .more {
  padding-bottom: 38px;
  display: inline-block;
}

.top-about .more a {
  border-bottom: 2px solid #d34e15;
  padding: 10px 40px 10px 20px;
  position: relative;
}

.top-about .more a:after {
  position: absolute;
  top: 50%;
  right: 14px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-image: url("../images/top/pc-arrow.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 14px;
  height: 14px;
  content: "";
}

@media screen and (max-width: 768px) {
  .top-about {
    margin: 42px 0 46px;
    background-image: inherit;
  }
  .top-about .title {
    padding: 0 5.3vw 20px;
  }
  .top-about .m-text {
    padding: 0 5.3vw 34px;
    font-size: 18px;
  }
  .top-about .m-text .orange {
    padding: 4px 0;
    background-size: 130px;
    position: relative;
    background-image: none;
    margin-top: 4px;
    margin-bottom: 4px;
  }
  .top-about .m-text .orange:after, .top-about .m-text .orange:before {
    position: absolute;
    content: "";
    width: 8px;
    height: 9px;
    top: 0;
  }
  .top-about .m-text .orange:after {
    border-top: 1px solid #c74d1b;
    border-right: 1px solid #c74d1b;
    right: 0;
  }
  .top-about .m-text .orange:before {
    border-top: 1px solid #c74d1b;
    border-left: 1px solid #c74d1b;
    left: 0;
  }
  .top-about .m-text .orange .square {
    padding: 4px 14px 8px;
    position: relative;
  }
  .top-about .m-text .orange .square:after, .top-about .m-text .orange .square:before {
    position: absolute;
    content: "";
    width: 8px;
    height: 9px;
    bottom: 0;
  }
  .top-about .m-text .orange .square:after {
    border-bottom: 1px solid #c74d1b;
    border-right: 1px solid #c74d1b;
    right: 0;
  }
  .top-about .m-text .orange .square:before {
    border-bottom: 1px solid #c74d1b;
    border-left: 1px solid #c74d1b;
    left: 0;
  }
  .top-about .text {
    margin-top: 30px;
    padding: 0 5.3vw;
  }
  .top-about .more {
    display: block;
    max-width: 280px;
    width: 37.33333%;
    margin: 20px auto 0;
  }
  .top-about .more a {
    padding: 6px 10px;
    font-size: 14px;
  }
  .top-about .more a:after {
    right: 0;
    background-image: url("../images/top/sp-arrow.png");
  }
}

@media screen and (min-width: 300px) and (max-width: 374px) {
  .top-about .m-text .orange {
    font-size: 15px;
  }
  .top-about .more {
    width: 50%;
  }
}

/*--------------top-menu*/
.top-menu {
  background-image: url("../images/top/pc-top_bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
}

.top-menu li {
  width: 50%;
  padding-top: 150px;
  padding-bottom: 150px;
}

.top-menu dl {
  width: 480px;
  height: 364px;
  background-color: rgba(255, 255, 255, 0.6);
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
  padding-top: 58px;
  position: relative;
}

.top-menu .more {
  position: absolute;
  bottom: 36px;
  right: 16px;
}

.top-menu a.orange {
  font-weight: bold;
  padding: 10px 48px 10px 38px;
  border-bottom: 2px solid #c74d1b;
  position: relative;
}

.top-menu a.orange:after {
  position: absolute;
  top: 50%;
  right: 14px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-image: url("../images/top/pc-arrow.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 14px;
  height: 14px;
  content: "";
}

.top-menu span.orange {
  vertical-align: middle;
}

.top-menu dt {
  font-size: 26px;
  padding-left: 48px;
  padding-bottom: 28px;
}

.top-menu .text {
  padding-left: 54px;
  padding-right: 36px;
}

.top-menu .office dl {
  margin: 0 0 0 auto;
}

.top-menu .case dl {
  margin: 0 auto 0 0;
}

@media screen and (max-width: 768px) {
  .top-menu li {
    width: auto;
    padding: 35px 26px;
  }
  .top-menu dl {
    width: 320px;
    height: 320px;
    margin: 0 auto;
    padding-top: 45px;
  }
  .top-menu dt {
    font-size: 15px;
    text-align: center;
    padding-left: 0;
    padding-bottom: 24px;
  }
  .top-menu .text {
    padding: 0 26px;
  }
  .top-menu {
    background-image: inherit;
  }
  .top-menu .case {
    background-image: url("../images/top/sp-top_bg01.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }
  .top-menu .office {
    background-image: url("../images/top/sp-top_bg02.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }
  .top-menu .more {
    display: block;
    max-width: 280px;
    width: 37.33333%;
    margin: 20px auto 0;
    bottom: 66px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    margin: 0;
  }
  .top-menu .more a {
    padding: 6px 10px;
    font-size: 14px;
  }
  .top-menu .more a:after {
    right: 0;
    background-image: url("../images/top/sp-arrow.png");
  }
}

.news2023 {
  /*線の種類（二重線）太さ 色*/
  border-bottom: double 5px #FFC778;
    width: 70%;
    margin: auto;
    padding-bottom: 10px;
    margin-bottom: 30px;
}

@media screen and (min-width: 300px) and (max-width: 400px) {
  .top-menu li {
    padding: 35px 10px;
  }
  .top-menu dl {
    width: 98%;
    padding-top: 20px;
  }
  .top-menu .more {
    bottom: 20px;
  }
  .top-menu .case dl, .top-menu .office dl {
    margin: 0 auto;
  }
  .top-menu .more a {
    padding: 6px;
  }
}
/*# sourceMappingURL=top.css.map */