@media print, screen and (min-width: 780.1px) {
  .sp {
    display: none !important;
  }
}
@media print, screen and (min-width: 1920px) {
  .sp {
    display: none !important;
  }
}

@media screen and (max-width: 780px) {
  .pc {
    display: none !important;
  }
}

:root {
  --font-jp: "Noto Sans", "Noto Sans JP", sans-serif;
  --font-en: "Josefin Sans", sans-serif;
  --font-hb: "Josefin Sans", "Noto Sans", "Noto Sans JP", sans-serif;
}

header {
  background-color: transparent;
}

main {
  padding-top: 0;
  overflow: hidden;
}

#mv {
  overflow: hidden;
  position: relative;
  z-index: 1;
}
@media print, screen and (min-width: 780.1px) {
  #mv {
    height: 900px;
    background: url(../img/common/kv_pc.webp) center top/100% no-repeat;
  }
}
@media screen and (max-width: 780px) {
  #mv {
    height: 100vh;
    background: url(../img/top/kv_sp.webp) center min(16.4102564103vw, 64px)/100% no-repeat;
  }
}
#mv::before {
  content: "";
  display: block;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(26.51%, rgba(255, 255, 255, 0)), color-stop(83.63%, #FFF));
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 26.51%, #FFF 83.63%);
  position: absolute;
  left: 0;
  z-index: -1;
}
@media print, screen and (min-width: 780.1px) {
  #mv::before {
    height: 355px;
    bottom: 0;
  }
}
@media screen and (max-width: 780px) {
  #mv::before {
    height: min(44.6153846154vw, 174px);
  }
}
@media screen and (max-width: 780px) and (max-height: min(205.1282051282vw, 800px)) {
  #mv::before {
    bottom: min(38.2051282051vw, 149px);
  }
}
@media screen and (max-width: 780px) and (min-height: min(205.1282051282vw, 800px)) {
  #mv::before {
    top: min(121.0256410256vw, 472px);
  }
}
#mv::after {
  content: "";
  display: block;
  width: 100%;
  background: #fff;
  position: absolute;
  left: 0;
  z-index: -1;
}
@media print, screen and (min-width: 780.1px) {
  #mv::after {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  #mv::after {
    height: min(38.4615384615vw, 150px);
  }
}
@media screen and (max-width: 780px) and (max-height: min(205.1282051282vw, 800px)) {
  #mv::after {
    bottom: 0;
  }
}
@media screen and (max-width: 780px) and (min-height: min(205.1282051282vw, 800px)) {
  #mv::after {
    top: min(165.641025641vw, 646px);
  }
}
#mv h1 {
  margin: 0;
  font-weight: 700;
  position: absolute;
}
@media print, screen and (min-width: 780.1px) {
  #mv h1 {
    font-size: 64px;
    line-height: 96px;
    letter-spacing: 1.28px;
    left: 130px;
    bottom: 158px;
  }
}
@media screen and (max-width: 780px) {
  #mv h1 {
    font-size: min(8.7179487179vw, 34px);
    line-height: min(13.8461538462vw, 54px);
    letter-spacing: min(0.1743589744vw, 0.68px);
    left: min(8.2051282051vw, 32px);
    bottom: min(22.8205128205vw, 89px);
  }
}

.scroll-attention {
  color: #3D3736;
  text-align: center;
  font-family: var(--font-en);
  font-weight: 700;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media print, screen and (min-width: 780.1px) {
  .scroll-attention {
    font-size: 18px;
    letter-spacing: -0.36px;
    bottom: 102px;
  }
}
@media screen and (max-width: 780px) {
  .scroll-attention {
    font-size: min(4.1025641026vw, 16px);
    letter-spacing: max(-0.0820512821vw, -0.32px);
    bottom: min(4.1025641026vw, 16px);
  }
}
.scroll-attention::before {
  content: "";
  display: block;
  border-radius: 50%;
  background-color: #ED6B38;
  position: absolute;
  top: max(-3.5897435897vw, -14px);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-animation: bound 0.7s cubic-bezier(0.662, 0.115, 0.88, 0.1) infinite alternate;
          animation: bound 0.7s cubic-bezier(0.662, 0.115, 0.88, 0.1) infinite alternate;
}
@media print, screen and (min-width: 780.1px) {
  .scroll-attention::before {
    width: 12px;
    height: 12px;
  }
}
@media screen and (max-width: 780px) {
  .scroll-attention::before {
    width: min(2.0512820513vw, 8px);
    height: min(2.0512820513vw, 8px);
  }
}

@-webkit-keyframes bound {
  from {
    -webkit-transform: translate(-50%, max(-7.6923076923vw, -30px));
            transform: translate(-50%, max(-7.6923076923vw, -30px));
  }
  10% {
    -webkit-transform: translate(-50%, max(-7.641025641vw, -29.8px));
            transform: translate(-50%, max(-7.641025641vw, -29.8px));
  }
  20% {
    -webkit-transform: translate(-50%, max(-7.5641025641vw, -29.5px));
            transform: translate(-50%, max(-7.5641025641vw, -29.5px));
  }
  96% {
    -webkit-transform: translate(-50%, max(-1.0256410256vw, -4px));
            transform: translate(-50%, max(-1.0256410256vw, -4px));
  }
  97% {
    -webkit-transform: translate(-50%, max(-0.5128205128vw, -2px));
            transform: translate(-50%, max(-0.5128205128vw, -2px));
  }
  98% {
    -webkit-transform: translate(-50%, max(-0.2564102564vw, -1px));
            transform: translate(-50%, max(-0.2564102564vw, -1px));
  }
  99% {
    -webkit-transform: translate(-50%, max(-0.0769230769vw, -0.3px));
            transform: translate(-50%, max(-0.0769230769vw, -0.3px));
  }
  to {
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
}

@keyframes bound {
  from {
    -webkit-transform: translate(-50%, max(-7.6923076923vw, -30px));
            transform: translate(-50%, max(-7.6923076923vw, -30px));
  }
  10% {
    -webkit-transform: translate(-50%, max(-7.641025641vw, -29.8px));
            transform: translate(-50%, max(-7.641025641vw, -29.8px));
  }
  20% {
    -webkit-transform: translate(-50%, max(-7.5641025641vw, -29.5px));
            transform: translate(-50%, max(-7.5641025641vw, -29.5px));
  }
  96% {
    -webkit-transform: translate(-50%, max(-1.0256410256vw, -4px));
            transform: translate(-50%, max(-1.0256410256vw, -4px));
  }
  97% {
    -webkit-transform: translate(-50%, max(-0.5128205128vw, -2px));
            transform: translate(-50%, max(-0.5128205128vw, -2px));
  }
  98% {
    -webkit-transform: translate(-50%, max(-0.2564102564vw, -1px));
            transform: translate(-50%, max(-0.2564102564vw, -1px));
  }
  99% {
    -webkit-transform: translate(-50%, max(-0.0769230769vw, -0.3px));
            transform: translate(-50%, max(-0.0769230769vw, -0.3px));
  }
  to {
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
}
#about {
  position: relative;
}
@media print, screen and (min-width: 780.1px) {
  #about {
    margin: auto;
    margin-top: 100px;
    max-width: 934px;
  }
}
@media screen and (max-width: 780px) {
  #about {
    margin-top: min(24.6153846154vw, 96px);
    padding-bottom: min(16.9230769231vw, 66px);
  }
}
#about .label {
  font-weight: 700;
}
@media print, screen and (min-width: 780.1px) {
  #about .label {
    font-size: 18px;
    letter-spacing: -0.36px;
  }
}
@media screen and (max-width: 780px) {
  #about .label {
    font-size: min(4.1025641026vw, 16px);
    letter-spacing: max(-0.0820512821vw, -0.32px);
  }
}
#about .label::before {
  margin-top: 0;
}
#about .lead {
  -webkit-font-kerning: none;
          font-kerning: none;
  font-weight: 700;
}
@media print, screen and (min-width: 780.1px) {
  #about .lead {
    margin-top: 40px;
    font-size: 24px;
    line-height: 64px;
  }
}
@media screen and (max-width: 780px) {
  #about .lead {
    margin-top: min(6.1538461538vw, 24px);
    font-size: min(4.6153846154vw, 18px);
    line-height: min(11.5384615385vw, 45px);
    letter-spacing: max(-0.0923076923vw, -0.36px);
  }
}
@media print, screen and (min-width: 780.1px) {
  #about .pagelink {
    margin-top: 96px;
  }
}
@media print, screen and (min-width: 780.1px) {
  #about .marquee {
    bottom: -160px;
    margin-left: calc((100vw - 934px) / 2 * -1);
    width: 100vw;
  }
}
.pagelink {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media print, screen and (min-width: 780.1px) {
  .pagelink {
    margin-top: 40px;
  }
}
@media screen and (max-width: 780px) {
  .pagelink {
    margin-top: min(10.2564102564vw, 40px);
  }
}

@media print, screen and (min-width: 780.1px) {
  main .wrapper {
    margin: 336px auto 400px;
    max-width: 1128px;
    position: relative;
  }
  main .wrapper::after {
    content: "";
    display: block;
    width: 720px;
    height: 424px;
    background: url(../img/common/logomark.svg) center/contain no-repeat;
    position: absolute;
    right: -222px;
    bottom: -222px;
    z-index: -1;
  }
}
@media print, screen and (min-width: 780.1px) {
  main .wrapper .nv_image {
    padding: 24px;
    height: 390px;
  }
  main .wrapper .nv_image h2 {
    font-size: 28px;
    letter-spacing: 0.56px;
  }
}
@media screen and (max-width: 780px) {
  #service {
    margin-top: min(15.3846153846vw, 60px);
  }
}
#service .contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media print, screen and (min-width: 780.1px) {
  #service .contents {
    gap: 24px;
    margin-top: 50px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents {
    gap: min(6.6666666667vw, 26px);
    margin-top: min(10.2564102564vw, 40px);
  }
}
#service .contents a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #FFF;
  -webkit-box-shadow: min(0.2564102564vw, 1px) min(0.2564102564vw, 1px) min(0.5128205128vw, 2px) min(0vw, 0px) rgba(255, 255, 255, 0.3) inset, max(-0.2564102564vw, -1px) max(-0.2564102564vw, -1px) min(0.5128205128vw, 2px) min(0vw, 0px) rgba(200, 200, 197, 0.5) inset, max(-2.0512820513vw, -8px) min(2.0512820513vw, 8px) min(4.1025641026vw, 16px) min(0vw, 0px) rgba(200, 200, 197, 0.2), max(-2.0512820513vw, -8px) max(-2.0512820513vw, -8px) min(4.1025641026vw, 16px) min(0vw, 0px) rgba(255, 255, 255, 0.9), min(1.0256410256vw, 4px) max(-1.0256410256vw, -4px) min(2.0512820513vw, 8px) min(0vw, 0px) rgba(200, 200, 197, 0.2), min(1.0256410256vw, 4px) min(1.0256410256vw, 4px) min(2.5641025641vw, 10px) min(0vw, 0px) rgba(200, 200, 197, 0.9);
          box-shadow: min(0.2564102564vw, 1px) min(0.2564102564vw, 1px) min(0.5128205128vw, 2px) min(0vw, 0px) rgba(255, 255, 255, 0.3) inset, max(-0.2564102564vw, -1px) max(-0.2564102564vw, -1px) min(0.5128205128vw, 2px) min(0vw, 0px) rgba(200, 200, 197, 0.5) inset, max(-2.0512820513vw, -8px) min(2.0512820513vw, 8px) min(4.1025641026vw, 16px) min(0vw, 0px) rgba(200, 200, 197, 0.2), max(-2.0512820513vw, -8px) max(-2.0512820513vw, -8px) min(4.1025641026vw, 16px) min(0vw, 0px) rgba(255, 255, 255, 0.9), min(1.0256410256vw, 4px) max(-1.0256410256vw, -4px) min(2.0512820513vw, 8px) min(0vw, 0px) rgba(200, 200, 197, 0.2), min(1.0256410256vw, 4px) min(1.0256410256vw, 4px) min(2.5641025641vw, 10px) min(0vw, 0px) rgba(200, 200, 197, 0.9);
  font-weight: 700;
  line-height: normal;
  position: relative;
  z-index: 1;
}
@media print, screen and (min-width: 780.1px) {
  #service .contents a {
    padding-left: 151px;
    height: 120px;
    border-radius: 20px;
    font-size: 20px;
    letter-spacing: 0.4px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents a {
    padding-left: min(24.6153846154vw, 96px);
    height: min(25.641025641vw, 100px);
    border-radius: min(2.5641025641vw, 10px);
    font-size: min(4.1025641026vw, 16px);
  }
}
#service .contents a small {
  font-weight: 500;
}
@media print, screen and (min-width: 780.1px) {
  #service .contents a small {
    margin-top: 0;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: -0.28px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents a small {
    margin-top: max(-1.2820512821vw, -5px);
    font-size: min(3.0769230769vw, 12px);
    line-height: min(4.6153846154vw, 18px);
    letter-spacing: max(-0.0615384615vw, -0.24px);
  }
}
#service .contents a span {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media print, screen and (min-width: 780.1px) {
  #service .contents a span {
    right: 30px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents a span {
    right: min(4.1025641026vw, 16px);
  }
}
#service .contents a::before {
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  z-index: -1;
}
#service .contents li:nth-child(1) a::before {
  background-image: url(../img/top/nr_01.webp);
}
@media print, screen and (min-width: 780.1px) {
  #service .contents li:nth-child(1) a::before {
    width: 130px;
    height: 150px;
    top: -30px;
    left: 20px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents li:nth-child(1) a::before {
    width: min(22.8205128205vw, 89px);
    height: min(24.8717948718vw, 97px);
    top: max(-2.0512820513vw, -8px);
    left: min(2.0512820513vw, 8px);
  }
}
#service .contents li:nth-child(2) a::before {
  background-image: url(../img/top/nr_02.webp);
}
@media print, screen and (min-width: 780.1px) {
  #service .contents li:nth-child(2) a::before {
    width: 126px;
    height: 120px;
    top: 10px;
    left: 26px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents li:nth-child(2) a::before {
    width: min(22.4358974359vw, 87.5px);
    height: min(18.4615384615vw, 72px);
    top: min(3.5897435897vw, 14px);
    left: min(2.8205128205vw, 11px);
  }
}
#service .contents li:nth-child(3) a::before {
  background-image: url(../img/top/nr_03.webp);
}
@media print, screen and (min-width: 780.1px) {
  #service .contents li:nth-child(3) a::before {
    width: 127px;
    height: 115px;
    top: 8px;
    left: 25px;
  }
}
@media screen and (max-width: 780px) {
  #service .contents li:nth-child(3) a::before {
    width: min(23.9743589744vw, 93.5px);
    height: min(19.7435897436vw, 77px);
    top: min(3.0769230769vw, 12px);
    left: min(2.3076923077vw, 9px);
  }
}

@media screen and (max-width: 780px) {
  #profile {
    margin-top: min(30.7692307692vw, 120px);
    padding-bottom: min(21.5384615385vw, 84px);
    background: url(../img/common/bg_logomark.svg) min(8.2051282051vw, 32px) bottom/min(92.3076923077vw, 360px) no-repeat;
  }
}
@media screen and (max-width: 780px) {
  #profile p {
    margin-top: min(8.2051282051vw, 32px);
  }
}
#profile .contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media print, screen and (min-width: 780.1px) {
  #profile .contents {
    margin-top: 80px;
    border-top: 1px solid #d9d9d9;
  }
}
@media screen and (max-width: 780px) {
  #profile .contents {
    margin-top: min(7.9487179487vw, 31px);
    border-top: min(0.2564102564vw, 1px) solid #d9d9d9;
  }
}
@media print, screen and (min-width: 780.1px) {
  #profile .contents li {
    border-bottom: 1px solid #d9d9d9;
  }
}
@media screen and (max-width: 780px) {
  #profile .contents li {
    border-bottom: min(0.2564102564vw, 1px) solid #d9d9d9;
  }
}
#profile .contents li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-weight: 700;
  line-height: normal;
}
@media print, screen and (min-width: 780.1px) {
  #profile .contents li a {
    padding: 26px 24px;
    font-size: 20px;
  }
}
@media screen and (max-width: 780px) {
  #profile .contents li a {
    padding: min(5vw, 19.5px) min(3.3333333333vw, 13px);
    font-size: min(4.1025641026vw, 16px);
  }
}
@media print, screen and (min-width: 780.1px) {
  #sustainability .inner,
  #recruit .inner {
    max-width: 936px;
  }
}
#sustainability h3,
#recruit h3 {
  position: relative;
  z-index: 2;
}
@media print, screen and (min-width: 780.1px) {
  #sustainability h3,
  #recruit h3 {
    margin-top: -36px;
  }
}
@media screen and (max-width: 780px) {
  #sustainability h3,
  #recruit h3 {
    margin-top: min(4.1025641026vw, 16px);
  }
}
#sustainability h3 .label,
#recruit h3 .label {
  font-weight: 700;
  line-height: normal;
}
@media print, screen and (min-width: 780.1px) {
  #sustainability h3 .label,
  #recruit h3 .label {
    margin-bottom: 8px;
    font-size: 18px;
    letter-spacing: -0.36px;
  }
}
@media screen and (max-width: 780px) {
  #sustainability h3 .label,
  #recruit h3 .label {
    margin-bottom: min(1.2820512821vw, 5px);
    font-size: min(4.1025641026vw, 16px);
    letter-spacing: max(-0.0820512821vw, -0.32px);
  }
}
@media print, screen and (min-width: 780.1px) {
  #sustainability p,
  #recruit p {
    margin-top: 24px;
  }
}
@media screen and (max-width: 780px) {
  #sustainability p,
  #recruit p {
    margin-top: min(4.1025641026vw, 16px);
  }
}
#sustainability .img_gradientL img,
#recruit .img_gradientL img {
  -o-object-position: center top;
     object-position: center top;
}

@media screen and (max-width: 780px) {
  #sustainability {
    margin-top: min(16.4102564103vw, 64px);
  }
}

@media print, screen and (min-width: 780.1px) {
  #recruit {
    margin-top: 160px;
  }
}
@media screen and (max-width: 780px) {
  #recruit {
    margin-top: min(30.7692307692vw, 120px);
  }
}