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

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

header {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-transition-duration: 0.6s;
          transition-duration: 0.6s;
}
header.is-fixed {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.kv {
  position: relative;
}
@media print, screen and (min-width: 961px) {
  .kv {
    height: 100vh;
  }
}
@media screen and (max-width: 960px) {
  .kv {
    height: 100svh;
    max-height: 195.8974358974vw;
  }
}
.kv video {
  -o-object-fit: cover;
     object-fit: cover;
  position: relative;
}
@media print, screen and (min-width: 961px) {
  .kv video {
    width: 100%;
    height: 100vh;
  }
}
@media screen and (max-width: 960px) {
  .kv video {
    width: 100%;
    height: 100svh;
    max-height: 195.8974358974vw;
  }
}
.kv .logo {
  position: absolute;
  z-index: 2;
}
@media print, screen and (min-width: 961px) {
  .kv .logo {
    width: 250px;
    top: 30px;
    left: 50px;
  }
}
@media screen and (max-width: 960px) {
  .kv .logo {
    width: 51.2820512821vw;
    top: 6.4102564103vw;
    left: 7.6923076923vw;
  }
}
@media screen and (max-width: 960px) and (max-height: 100vw) {
  .kv .logo {
    display: none;
  }
}
.kv .txt {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 2;
  white-space: nowrap;
}
@media print, screen and (min-width: 961px) {
  .kv .txt {
    padding-top: 50px;
    padding-left: 220px;
    top: 50%;
    -webkit-transform: translate(-50%, -54%);
            transform: translate(-50%, -54%);
  }
}
@media print and (max-height: 840px), screen and (min-width: 961px) and (max-height: 840px) {
  .kv .txt {
    padding-top: 6vh;
    padding-left: 25vh;
    -webkit-transform: translate(-50%, -54%);
            transform: translate(-50%, -54%);
  }
}
@media print and (max-width: 1080px), screen and (min-width: 961px) and (max-width: 1080px) {
  .kv .txt {
    padding-left: 0;
    padding-top: 220px;
    text-align: center;
  }
}
@media print and (max-width: 1080px) and (max-height: 840px), screen and (min-width: 961px) and (max-width: 1080px) and (max-height: 840px) {
  .kv .txt {
    padding-top: 24vh;
    top: 50%;
  }
}
@media screen and (max-width: 960px) {
  .kv .txt {
    padding-top: 31.7948717949vw;
    top: 50%;
    -webkit-transform: translate(-50%, -54%);
            transform: translate(-50%, -54%);
  }
}
.kv .txt h1 {
  color: #fff;
  font-weight: 100;
  line-height: 130%;
}
@media print, screen and (min-width: 961px) {
  .kv .txt h1 {
    text-shadow: 0px 0px 20px #000;
    font-size: 100px;
  }
}
@media print and (max-height: 840px), screen and (min-width: 961px) and (max-height: 840px) {
  .kv .txt h1 {
    font-size: 11vh;
  }
}
@media screen and (max-width: 960px) {
  .kv .txt h1 {
    text-align: center;
    text-shadow: 0px 0px 2.0512820513vw #000;
    font-size: 10.2564102564vw;
  }
}
@media print, screen and (min-width: 961px) {
  .kv .txt h1 small {
    font-size: 70%;
  }
}
@media screen and (max-width: 960px) {
  .kv .txt h1 small {
    font-size: 7.1794871795vw;
  }
}
.kv .txt p {
  color: #fff;
  text-shadow: 0px 0px 30px #000;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.5;
}
@media print, screen and (min-width: 961px) {
  .kv .txt p {
    margin-top: 6px;
    margin-left: 6px;
    font-size: 15px;
    letter-spacing: 10.5px;
  }
}
@media print and (max-height: 840px), screen and (min-width: 961px) and (max-height: 840px) {
  .kv .txt p {
    font-size: 1.7vh;
    letter-spacing: 1.1vh;
  }
}
@media screen and (max-width: 960px) {
  .kv .txt p {
    margin-top: 1.5384615385vw;
    text-shadow: 0px 0px 2.8205128205vw #000;
    font-size: 2.5641025641vw;
    letter-spacing: 0.5897435897vw;
  }
}
.kv .corner_lb {
  aspect-ratio: 500/433;
  background-color: rgba(0, 0, 0, 0.3);
  -webkit-backdrop-filter: blur(15px);
          backdrop-filter: blur(15px);
  -webkit-clip-path: polygon(0 0, 100% 100%, 0 100%);
          clip-path: polygon(0 0, 100% 100%, 0 100%);
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
}
@media print, screen and (min-width: 961px) {
  .kv .corner_lb {
    width: 18vw;
  }
}
@media screen and (max-width: 960px) {
  .kv .corner_lb {
    width: 26.4102564103vw;
  }
}
.kv .corner_rt {
  aspect-ratio: 323/280;
  background-color: rgba(0, 0, 0, 0.3);
  -webkit-backdrop-filter: blur(15px);
          backdrop-filter: blur(15px);
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%);
          clip-path: polygon(0 0, 100% 0, 100% 100%);
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}
@media print, screen and (min-width: 961px) {
  .kv .corner_rt {
    width: 11vw;
  }
}
@media screen and (max-width: 960px) {
  .kv .corner_rt {
    width: 24.6153846154vw;
  }
}
.kv .scroll {
  position: absolute;
}
@media print, screen and (min-width: 961px) {
  .kv .scroll {
    right: 10px;
    bottom: 126px;
  }
}
@media screen and (max-width: 960px) {
  .kv .scroll {
    right: 2.0512820513vw;
    bottom: 21.5384615385vw;
  }
}
.kv .scroll::before {
  content: "";
  display: inline-block;
  width: 1px;
  background-color: #000;
  position: absolute;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media print, screen and (min-width: 961px) {
  .kv .scroll::before {
    height: 103px;
    right: 4px;
    bottom: -103px;
  }
}
@media screen and (max-width: 960px) {
  .kv .scroll::before {
    height: 17.9487179487vw;
    right: 0.25em;
    bottom: -17.9487179487vw;
    opacity: 0.5;
  }
}
.kv .scroll::after {
  content: "";
  display: inline-block;
  background-color: #000;
  position: absolute;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
@media print, screen and (min-width: 961px) {
  .kv .scroll::after {
    width: 4px;
    height: 4px;
    right: 3px;
    bottom: -105px;
    -webkit-animation: scroll-attention-anim-pc 2s infinite;
            animation: scroll-attention-anim-pc 2s infinite;
  }
}
@media screen and (max-width: 960px) {
  .kv .scroll::after {
    width: 1.0256410256vw;
    height: 1.0256410256vw;
    right: calc(0.25em - 0.2564102564vw);
    bottom: -26.9230769231vw;
    -webkit-animation: scroll-attention-anim-sp 2s infinite;
            animation: scroll-attention-anim-sp 2s infinite;
  }
}
.kv .scroll span {
  display: inline-block;
  text-align: right;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  -webkit-transform-origin: right top;
          transform-origin: right top;
}
@media print, screen and (min-width: 961px) {
  .kv .scroll span {
    font-size: 9px;
    letter-spacing: 0.9px;
  }
}
@media screen and (max-width: 960px) {
  .kv .scroll span {
    font-size: 2.3076923077vw;
    letter-spacing: 0.2307692308vw;
  }
}

@-webkit-keyframes scroll-attention-anim-pc {
  0% {
    bottom: 0;
    -webkit-transform: scale(0) rotate(0);
            transform: scale(0) rotate(0);
  }
  10% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
  }
  20% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  60% {
    bottom: -105px;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  70% {
    bottom: -105px;
    -webkit-transform: scale(1) rotate(135deg);
            transform: scale(1) rotate(135deg);
  }
  100% {
    bottom: -105px;
    -webkit-transform: scale(0) rotate(135deg);
            transform: scale(0) rotate(135deg);
  }
}

@keyframes scroll-attention-anim-pc {
  0% {
    bottom: 0;
    -webkit-transform: scale(0) rotate(0);
            transform: scale(0) rotate(0);
  }
  10% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
  }
  20% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  60% {
    bottom: -105px;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  70% {
    bottom: -105px;
    -webkit-transform: scale(1) rotate(135deg);
            transform: scale(1) rotate(135deg);
  }
  100% {
    bottom: -105px;
    -webkit-transform: scale(0) rotate(135deg);
            transform: scale(0) rotate(135deg);
  }
}
@-webkit-keyframes scroll-attention-anim-sp {
  0% {
    bottom: 0;
    -webkit-transform: scale(0) rotate(0);
            transform: scale(0) rotate(0);
  }
  10% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
  }
  20% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  60% {
    bottom: -18.2051282051vw;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  70% {
    bottom: -18.2051282051vw;
    -webkit-transform: scale(1) rotate(135deg);
            transform: scale(1) rotate(135deg);
  }
  100% {
    bottom: -18.2051282051vw;
    -webkit-transform: scale(0) rotate(135deg);
            transform: scale(0) rotate(135deg);
  }
}
@keyframes scroll-attention-anim-sp {
  0% {
    bottom: 0;
    -webkit-transform: scale(0) rotate(0);
            transform: scale(0) rotate(0);
  }
  10% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
  }
  20% {
    bottom: 0;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  60% {
    bottom: -18.2051282051vw;
    -webkit-transform: scale(1) rotate(45deg);
            transform: scale(1) rotate(45deg);
  }
  70% {
    bottom: -18.2051282051vw;
    -webkit-transform: scale(1) rotate(135deg);
            transform: scale(1) rotate(135deg);
  }
  100% {
    bottom: -18.2051282051vw;
    -webkit-transform: scale(0) rotate(135deg);
            transform: scale(0) rotate(135deg);
  }
}
.top main {
  background-color: #000;
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
}
.top main section {
  opacity: 0;
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
}
.top main.loadComplete {
  background-color: #fff;
}
.top main.loadComplete section {
  opacity: 1;
}
.top main .kv {
  display: block;
  opacity: 1;
}
.top main .kv video {
  opacity: 0;
  -webkit-transition-duration: 5s;
          transition-duration: 5s;
}
.top main .kv .logo {
  opacity: 0;
  -webkit-transition-duration: 3s;
          transition-duration: 3s;
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
}
.top main .kv .txt {
  opacity: 0;
}
.top main .kv .txt h1 span {
  opacity: 0;
  -webkit-transition-duration: 0.8s;
          transition-duration: 0.8s;
}
.top main .kv .txt h1 span.is-show {
  opacity: 1;
}
.top main .kv .txt p span {
  display: inline-block;
  -webkit-transform: translateY(50px) scale(0);
          transform: translateY(50px) scale(0);
  -webkit-transition-duration: 0.45s;
          transition-duration: 0.45s;
  -webkit-transition-delay: 1.05s;
          transition-delay: 1.05s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
          transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
.top main .kv .txt p span.is-show {
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
}
.top main .kv .scroll {
  opacity: 0;
  -webkit-transition-duration: 1s;
          transition-duration: 1s;
}
.top main .kv.loaded video {
  opacity: 1;
}
.top main .kv.loaded .logo {
  opacity: 1;
}
.top main .kv.loaded .txt {
  opacity: 1;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}
.top main .kv.loaded .scroll {
  opacity: 1;
  -webkit-transition-delay: 3s;
          transition-delay: 3s;
}

header,
footer {
  display: none;
}

header.is-show {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

footer.is-show {
  display: block;
}

@-webkit-keyframes coil {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg) scale(3);
            transform: translate(-50%, -50%) rotate(0deg) scale(3);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg) scale(1);
            transform: translate(-50%, -50%) rotate(360deg) scale(1);
  }
}

@keyframes coil {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg) scale(3);
            transform: translate(-50%, -50%) rotate(0deg) scale(3);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg) scale(1);
            transform: translate(-50%, -50%) rotate(360deg) scale(1);
  }
}
@-webkit-keyframes return1 {
  0% {
    -webkit-transform: translate(-50vw, -50vh) rotate(360deg) scale(5);
            transform: translate(-50vw, -50vh) rotate(360deg) scale(5);
  }
  100% {
    -webkit-transform: translate(0) rotate(0deg) scale(1);
            transform: translate(0) rotate(0deg) scale(1);
  }
}
@keyframes return1 {
  0% {
    -webkit-transform: translate(-50vw, -50vh) rotate(360deg) scale(5);
            transform: translate(-50vw, -50vh) rotate(360deg) scale(5);
  }
  100% {
    -webkit-transform: translate(0) rotate(0deg) scale(1);
            transform: translate(0) rotate(0deg) scale(1);
  }
}
@-webkit-keyframes return2 {
  0% {
    -webkit-transform: translate(50vw, -50vh) rotate(360deg) scale(5);
            transform: translate(50vw, -50vh) rotate(360deg) scale(5);
  }
  100% {
    -webkit-transform: translate(0) rotate(0deg) scale(1);
            transform: translate(0) rotate(0deg) scale(1);
  }
}
@keyframes return2 {
  0% {
    -webkit-transform: translate(50vw, -50vh) rotate(360deg) scale(5);
            transform: translate(50vw, -50vh) rotate(360deg) scale(5);
  }
  100% {
    -webkit-transform: translate(0) rotate(0deg) scale(1);
            transform: translate(0) rotate(0deg) scale(1);
  }
}
@-webkit-keyframes return3 {
  0% {
    -webkit-transform: translate(-50vw, 50vh) rotate(360deg) scale(5);
            transform: translate(-50vw, 50vh) rotate(360deg) scale(5);
  }
  100% {
    -webkit-transform: translate(0) rotate(0deg) scale(1);
            transform: translate(0) rotate(0deg) scale(1);
  }
}
@keyframes return3 {
  0% {
    -webkit-transform: translate(-50vw, 50vh) rotate(360deg) scale(5);
            transform: translate(-50vw, 50vh) rotate(360deg) scale(5);
  }
  100% {
    -webkit-transform: translate(0) rotate(0deg) scale(1);
            transform: translate(0) rotate(0deg) scale(1);
  }
}
.op_logo {
  aspect-ratio: 100/112.0331;
  width: 400px;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-animation: coil 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
          animation: coil 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
  z-index: 2;
  pointer-events: none;
}
@media print, screen and (min-width: 961px) {
  .op_logo {
    width: 21.59vh;
    max-width: 190px;
  }
}
@media screen and (max-width: 960px) {
  .op_logo {
    width: 26.1538461538vw;
  }
}
.op_logo div {
  position: absolute;
}
.op_logo div.part1 {
  aspect-ratio: 100/112.0335;
  width: 51.5386%;
  top: 0;
  left: 0;
  -webkit-animation: return1 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
          animation: return1 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
}
.op_logo div.part1:first-child {
  z-index: 2;
}
.op_logo div.part1 .part1_1 {
  width: 92.6991%;
  top: 0;
  left: 0;
}
.op_logo div.part1 .part1_2 {
  aspect-ratio: 100/201.3984;
  -o-object-fit: cover;
     object-fit: cover;
  width: 26.866%;
  top: 14.75264%;
  right: 0;
}
.op_logo div.part2 {
  width: 51.5386%;
  top: 9.775404%;
  left: 48.4614%;
  -webkit-animation: return2 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
          animation: return2 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
}
.op_logo div.part3 {
  width: 51.5386%;
  top: 48.320859%;
  left: 13.1702%;
  -webkit-animation: return3 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
          animation: return3 3s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0s forwards;
}
.op_logo div img {
  width: 100%;
  position: absolute;
}
.op_logo.scene2 {
  -webkit-transition-duration: 1s;
          transition-duration: 1s;
}
@media print, screen and (min-width: 961px) {
  .op_logo.scene2 {
    left: calc(50% - 430px);
  }
}
@media print and (max-height: 840px), screen and (min-width: 961px) and (max-height: 840px) {
  .op_logo.scene2 {
    left: calc(50% - 48vh);
  }
}
@media print and (max-width: 1080px), screen and (min-width: 961px) and (max-width: 1080px) {
  .op_logo.scene2 {
    left: 50%;
    top: calc(50% - 200px);
  }
}
@media print and (max-width: 1080px) and (max-height: 840px), screen and (min-width: 961px) and (max-width: 1080px) and (max-height: 840px) {
  .op_logo.scene2 {
    top: calc(50% - 20vh);
  }
}
@media screen and (max-width: 960px) {
  .op_logo.scene2 {
    top: calc(50% - 34vw);
  }
}
.op_logo.scene3 {
  opacity: 0;
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

@media print, screen and (min-width: 961px) {
  #news {
    padding: 60px 0;
  }
}
@media screen and (max-width: 960px) {
  #news {
    padding: 15vw 0;
  }
}
#news .news_cont {
  display: none;
  line-height: 1.5;
  border-bottom: 1px solid #EAEAEA;
}
@media print, screen and (min-width: 961px) {
  #news .news_cont {
    margin-top: 40px;
    padding-bottom: 40px;
  }
}
@media screen and (max-width: 960px) {
  #news .news_cont {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-top: 10vw;
    padding-bottom: 10vw;
  }
}
@media print, screen and (min-width: 961px) {
  #news .news_cont .date {
    min-width: 122px;
    max-width: 122px;
    line-height: 1.75;
  }
}
#news .news_cont dl dt {
  font-weight: 700;
}
@media screen and (max-width: 960px) {
  #news .news_cont dl dt {
    margin-top: 2.5641025641vw;
    font-size: 4.6153846154vw;
  }
}
@media print, screen and (min-width: 961px) {
  #news .news_cont dl dd {
    margin-top: 10px;
  }
}
@media screen and (max-width: 960px) {
  #news .news_cont dl dd {
    margin-top: 2.5641025641vw;
  }
}
@media screen and (max-width: 960px) {
  #news h2 + .news_cont {
    margin-top: 12.8205128205vw;
  }
}

#about {
  background-color: #EAF5FF;
  position: relative;
  z-index: 1;
}
@media print, screen and (min-width: 961px) {
  #about {
    padding: 80px 0;
  }
}
@media screen and (max-width: 960px) {
  #about {
    padding: 20vw 0;
  }
}
#about::before, #about::after {
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  z-index: -1;
  mix-blend-mode: multiply;
}
#about::before {
  background-image: url(../img/about_corner_lb.png);
  background-position: left bottom;
  left: 0;
  bottom: 0;
}
@media print, screen and (min-width: 961px) {
  #about::before {
    width: 292px;
    height: 106px;
  }
}
@media screen and (max-width: 960px) {
  #about::before {
    width: 45.3846153846vw;
    height: 15.3846153846vw;
  }
}
#about::after {
  background-image: url(../img/about_corner_rt.png);
  background-position: right top;
  right: 0;
  top: 0;
}
@media print, screen and (min-width: 961px) {
  #about::after {
    width: 768px;
    height: 279px;
  }
}
@media screen and (max-width: 960px) {
  #about::after {
    width: 74.358974359vw;
    height: 27.1794871795vw;
  }
}
#about h2 {
  text-align: left;
}
#about h2 span {
  display: inline-block;
  background: -webkit-gradient(linear, left top, right top, from(#0E5099), color-stop(54.5%, #C2E3FF), to(#0E5099));
  background: linear-gradient(90deg, #0E5099 0%, #C2E3FF 54.5%, #0E5099 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "Noto Sans JP", sans-serif;
  font-weight: 300;
}
@media print, screen and (min-width: 961px) {
  #about h2 span {
    font-size: 150px;
    letter-spacing: 15px;
  }
}
@media screen and (max-width: 960px) {
  #about h2 span {
    font-size: 20.5128205128vw;
    letter-spacing: 2.0512820513vw;
  }
}
#about h2 small {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}
@media print, screen and (min-width: 961px) {
  #about h2 small {
    margin-top: 10px;
    font-size: 20px;
    letter-spacing: 2px;
  }
}
@media screen and (max-width: 960px) {
  #about h2 small {
    margin-top: 1.2820512821vw;
    font-size: 5.1282051282vw;
    letter-spacing: 0.5128205128vw;
  }
}
#about p {
  font-weight: 700;
  line-height: 2.7;
}
@media print, screen and (min-width: 961px) {
  #about p {
    margin-top: 50px;
    font-size: 20px;
  }
}
@media screen and (max-width: 960px) {
  #about p {
    margin-top: 12.8205128205vw;
    font-size: 5.1282051282vw;
  }
}

.mission {
  background-color: #0E5099;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  text-align: center;
}
@media print, screen and (min-width: 961px) {
  .mission {
    padding: 80px 0;
    background-image: url(../img/mission_bg_pc.png);
  }
}
@media screen and (max-width: 960px) {
  .mission {
    padding: 20vw 0;
    background-image: url(../img/mission_bg_sp.png);
  }
}
.mission h2 {
  display: inline-block;
  background: -webkit-gradient(linear, left top, right top, from(#0E5099), color-stop(#C2E3FF), to(#0E5099));
  background: linear-gradient(to right, #0E5099, #C2E3FF, #0E5099);
  -webkit-background-clip: text;
  color: transparent;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "Noto Sans JP", sans-serif;
  font-weight: 300;
  text-align: center;
}
@media print, screen and (min-width: 961px) {
  .mission h2 {
    font-size: 150px;
    letter-spacing: 15px;
    -webkit-transform: translateY(-21px);
            transform: translateY(-21px);
  }
}
@media screen and (max-width: 960px) {
  .mission h2 {
    font-size: 20.5128205128vw;
    letter-spacing: 2.0512820513vw;
    -webkit-transform: translateY(-3.0769230769vw);
            transform: translateY(-3.0769230769vw);
  }
}
.mission h3 {
  color: #fff;
  font-weight: 700;
}
@media print, screen and (min-width: 961px) {
  .mission h3 {
    font-size: 48px;
  }
}
@media screen and (max-width: 960px) {
  .mission h3 {
    margin-top: 5.1282051282vw;
    font-size: 9.2307692308vw;
    line-height: 270%;
    letter-spacing: 0.9230769231vw;
  }
}
.mission p {
  color: #fff;
  font-weight: 700;
}
@media print, screen and (min-width: 961px) {
  .mission p {
    margin-top: 50px;
    font-size: 20px;
    line-height: 2.7;
  }
}
@media screen and (max-width: 960px) {
  .mission p {
    font-size: 3.8461538462vw;
    line-height: 200%;
    letter-spacing: 0.3846153846vw;
  }
}

@media print, screen and (min-width: 961px) {
  .company {
    padding: 80px 0;
  }
}
@media screen and (max-width: 960px) {
  .company {
    padding: 20vw 0;
  }
}
@media print, screen and (min-width: 961px) {
  .company .company-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 50px;
    margin-top: 50px;
    max-width: 1240px;
  }
}
@media screen and (max-width: 960px) {
  .company .company-info {
    margin-top: 12.8205128205vw;
  }
}
.company .company-info > div {
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
}
@media screen and (max-width: 960px) {
  .company .company-info > div:first-child > dl:first-child {
    border-top: 1px solid #EAEAEA;
  }
}
.company .company-info > div > dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid #EAEAEA;
  line-height: 1.5;
}
@media print, screen and (min-width: 961px) {
  .company .company-info > div > dl {
    padding: 20px 0 20px 20px;
  }
  .company .company-info > div > dl:first-child {
    border-bottom: 1px solid #EAEAEA;
  }
}
@media screen and (max-width: 960px) {
  .company .company-info > div > dl {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 5.1282051282vw;
  }
}
.company .company-info > div > dl dt {
  font-weight: 700;
}
@media print, screen and (min-width: 961px) {
  .company .company-info > div > dl dt {
    min-width: 180px;
    max-width: 180px;
    font-size: 15px;
  }
}
@media screen and (max-width: 960px) {
  .company .company-info > div > dl dt {
    font-size: 3.8461538462vw;
  }
}
@media screen and (max-width: 960px) {
  .company .company-info > div > dl dd {
    margin-top: 2.5641025641vw;
  }
  .company .company-info > div > dl dd dd {
    margin-top: 0;
  }
}
.company .company-info > div > dl dd dl + dl {
  margin-top: 1em;
}

.organigram {
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
@media print, screen and (min-width: 961px) {
  .organigram {
    padding: 100px 0;
    background-image: url(../img/organigram_bg_pc.png);
  }
}
@media screen and (max-width: 960px) {
  .organigram {
    padding: 25.641025641vw 0;
    background-image: url(../img/organigram_bg_sp.png);
  }
}
.organigram .organization-chart {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin: auto;
  font-weight: 700;
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart {
    gap: 70px;
    margin-top: 50px;
    width: 600px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart {
    gap: 10.2564102564vw;
    margin: 12.8205128205vw 6.4102564103vw 0;
  }
}
.organigram .organization-chart dt {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #fff;
  position: relative;
  white-space: nowrap;
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart dt {
    padding: 10px 50px;
    height: 62px;
    font-size: 18px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart dt {
    padding: 3.8461538462vw 5.1282051282vw;
    height: 10.2564102564vw;
    font-size: 3.0769230769vw;
  }
}
.organigram .organization-chart dt::after {
  content: "";
  background-color: #fff;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart dt::after {
    width: 35px;
    height: 2px;
    right: -35px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart dt::after {
    width: 5.1282051282vw;
    height: 1px;
    right: -5.1282051282vw;
  }
}
.organigram .organization-chart dd {
  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;
  position: relative;
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart dd {
    gap: 10px;
    font-size: 18px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart dd {
    gap: 1.5384615385vw;
    font-size: 3.0769230769vw;
  }
}
.organigram .organization-chart dd::before {
  content: "";
  background-color: #fff;
  position: absolute;
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart dd::before {
    width: 2px;
    height: calc(100% - 60px);
    top: 30px;
    left: -35px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart dd::before {
    width: 1px;
    height: calc(100% - 10.2564102564vw);
    top: 5.1282051282vw;
    left: -5.1282051282vw;
  }
}
.organigram .organization-chart dd span {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #fff;
  position: relative;
  white-space: nowrap;
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart dd span {
    padding: 10px 50px;
    height: 62px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart dd span {
    padding: 3.8461538462vw 5.1282051282vw;
    height: 10.2564102564vw;
  }
}
.organigram .organization-chart dd span::before {
  content: "";
  background-color: #fff;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media print, screen and (min-width: 961px) {
  .organigram .organization-chart dd span::before {
    width: 35px;
    height: 2px;
    left: -35px;
  }
}
@media screen and (max-width: 960px) {
  .organigram .organization-chart dd span::before {
    width: 5.1282051282vw;
    height: 1px;
    left: -5.1282051282vw;
  }
}

#message {
  background-color: #EAF5FF;
  background-image: url(../img/message_president.png);
  background-repeat: no-repeat;
}
@media print, screen and (min-width: 961px) {
  #message {
    padding: 100px 0;
    background-position: calc(50% + 420px) bottom;
    background-size: 420px;
  }
}
@media screen and (max-width: 960px) {
  #message {
    padding: 25.641025641vw 0 103.8461538462vw;
    background-position: 16.6666666667vw bottom;
    background-size: 74.358974359vw;
  }
}
#message h2 span {
  background: -webkit-gradient(linear, left top, right top, from(#0E5099), color-stop(#C2E3FF), to(#0E5099));
  background: linear-gradient(to right, #0E5099, #C2E3FF, #0E5099);
  -webkit-background-clip: text;
  color: transparent;
  font-family: "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "Noto Sans JP", sans-serif;
  font-weight: 300;
  text-align: left;
}
@media print, screen and (min-width: 961px) {
  #message h2 span {
    font-size: 150px;
    letter-spacing: 15px;
  }
}
@media screen and (max-width: 960px) {
  #message h2 span {
    font-size: 15.3846153846vw;
    letter-spacing: 1.5384615385vw;
  }
}
#message h2 small {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}
@media print, screen and (min-width: 961px) {
  #message h2 small {
    margin-top: 10px;
    font-size: 20px;
    letter-spacing: 2px;
  }
}
@media screen and (max-width: 960px) {
  #message h2 small {
    margin-top: 1.2820512821vw;
    font-size: 5.1282051282vw;
    letter-spacing: 0.5128205128vw;
  }
}
#message p {
  font-weight: 700;
  line-height: 2;
}
@media print, screen and (min-width: 961px) {
  #message p {
    margin-top: 50px;
    font-size: 20px;
    letter-spacing: 2px;
  }
}
@media screen and (max-width: 960px) {
  #message p {
    margin-top: 12.8205128205vw;
    font-size: 5.1282051282vw;
    letter-spacing: 0.5128205128vw;
  }
}
#message p + p {
  margin-top: 1.5em;
}
#message .signature {
  text-align: right;
}
@media print, screen and (min-width: 961px) {
  #message .signature {
    margin-top: 20px;
    width: 725px;
  }
}
@media screen and (max-width: 960px) {
  #message .signature {
    margin-top: 5.1282051282vw;
  }
}
@media print, screen and (min-width: 961px) {
  #message .signature dt {
    font-size: 18px;
  }
}
@media screen and (max-width: 960px) {
  #message .signature dt {
    font-size: 4.6153846154vw;
  }
}
#message .signature dd {
  font-weight: 700;
}
@media print, screen and (min-width: 961px) {
  #message .signature dd {
    font-size: 27px;
  }
}
@media screen and (max-width: 960px) {
  #message .signature dd {
    font-size: 6.9230769231vw;
  }
}

@media print, screen and (min-width: 961px) {
  #business {
    padding: 80px 0;
  }
}
@media screen and (max-width: 960px) {
  #business {
    padding: 20vw 0;
  }
}
#business .business-conts {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media print, screen and (min-width: 961px) {
  #business .business-conts {
    gap: 40px;
    margin-top: 40px;
    max-width: 1240px;
  }
}
@media screen and (max-width: 960px) {
  #business .business-conts {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 10vw;
    margin-top: 10vw;
  }
}
#business .business-conts .business-conts__cont {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
}
#business .business-conts picture img {
  width: 100%;
}
#business .business-conts h3 {
  font-weight: 700;
  line-height: 1.5;
}
@media print, screen and (min-width: 961px) {
  #business .business-conts h3 {
    margin-top: 20px;
    font-size: 18px;
  }
}
@media screen and (max-width: 960px) {
  #business .business-conts h3 {
    margin-top: 6.4102564103vw;
    font-size: 4.6153846154vw;
  }
}
@media print, screen and (min-width: 961px) {
  #business .business-conts p {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 960px) {
  #business .business-conts p {
    margin-top: 5.1282051282vw;
  }
}
@media print, screen and (min-width: 961px) {
  #business .business-conts .btn-wrap {
    margin-top: auto;
  }
}
@media screen and (max-width: 960px) {
  #business .business-conts .btn-wrap {
    margin-top: 6.4102564103vw;
  }
}
@media print, screen and (min-width: 961px) {
  #business .business-conts .btn-wrap .btn {
    min-width: 200px;
    max-width: 200px;
  }
}
@media screen and (max-width: 960px) {
  #business .business-conts .btn-wrap .btn {
    width: 51.2820512821vw;
  }
}
/* ===== CONTACT｜两列企业风 ===== */
#contact .contact-form{
  margin-top:24px;
  max-width:860px;
}

#contact .form-row{
  display:flex;
  align-items:flex-start;
  gap:24px;
  padding:14px 0;
  border-bottom:1px solid #e5e7eb;
}
#contact .form-row:last-of-type{ border-bottom:none; }

#contact .form-row dt{
  width:220px;                 /* 左列统一宽度 */
  font-weight:600;
  line-height:1.6;
  display:flex;
  gap:8px;
  align-items:center;
  color:#111827;
}

#contact .form-row dd{ flex:1; }

#contact .required{
  display:inline-block;
  font-size:12px;
  color:#1d4ed8;
  background:#e0ecff;
  padding:2px 6px;
  border-radius:999px;
}

/* 输入控件 */
#contact input[type="text"],
#contact input[type="email"],
#contact textarea{
  width:100%;
  max-width:100%;
  padding:10px 12px;
  border:1px solid #d1d5db;
  border-radius:8px;
  font-size:16px;
  line-height:1.6;
  background:#fff;
  outline:none;
}
#contact textarea{
  min-height:160px;
  resize:vertical;
}
#contact input:focus,
#contact textarea:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.15);
}

/* 按钮排布 */
#contact .btn-wrap{
  margin-top:24px;
  display:flex;
  gap:12px;
}
#contact .btn-wrap.align-right{ justify-content:flex-end; }
#contact .btn-wrap.align-center{ justify-content:center; }
#contact .btn-wrap.between{ justify-content:space-between; }
#contact .btn.ghost{
  background:#fff;
  color:#1f2937;
  border:1px solid #d1d5db;
}

/* 确认页保留换行 */
#contact .prewrap{ white-space:pre-wrap; }

/* 必須标签更显眼 */
#contact .required {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #b91c1c;
  background: #fee2e2;
  border: 1px solid #fecaca;
  padding: 2px 8px;
  border-radius: 999px;
}

/* プライバシーポリシー 同意区域 */
#contact .policy-consent {
  margin: 20px 0 12px;
  padding: 12px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
#contact .policy-consent label {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 14px;
  line-height: 1.6;
}
#contact .policy-consent a {
  color: #0E5099;
  text-decoration: underline;
}

/* 禁用按钮的状态 */
#contact button[disabled] {
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}
/* === CONTACT：统一中栏 + 稳定步骤条（唯一版本） === */

/* 统一中栏：步骤条与表单同宽同中心 */
#contact .contact-inner{
  max-width: 860px;
  margin: 0 auto;
  padding: 0 12px;            /* 窄屏两侧留白 */
}
/* 表单跟随容器宽度 */
#contact .contact-form{ max-width: 100%; }

/* 步骤条：等分、底线一条、圆点贴线、文本不被遮 */
#contact .contact-inner > .status{
  list-style: none !important;
  margin: 12px 0 24px !important;
  padding: 0 0 22px !important;          /* 给底线/圆点留空间 */
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  position: relative !important;
  width: 100% !important;                /* 使用全宽 */
  max-width: 600px !important;           /* 限制最大宽度 */
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 0 !important;                     /* 覆盖common.css的gap */
}

/* 覆盖common.css中的固定宽度设置 */
#contact .status {
  width: auto !important;
  max-width: 600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#contact .contact-inner > .status::before{
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: 6px;
  height: 2px;
  background: #e5e7eb;        /* 未完成的灰色背景 */
  opacity: 1;
  z-index: 1;                 /* 线条在中间层 */
}

/* 动态进度条 */
#contact .contact-inner > .status::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 6px;
  height: 2px;
  background: #0E5099;        /* 已完成的蓝色 */
  opacity: 1;
  z-index: 2;                 /* 进度条在上层 */
  transition: width 0.3s ease;
}

/* 第一步完成：点亮1/3 */
#contact .contact-inner > .status.step1::after{
  width: 33.33%;
}

/* 第二步完成：点亮2/3 */
#contact .contact-inner > .status.step2::after{
  width: 66.66%;
}

/* 第三步完成：点亮全部 */
#contact .contact-inner > .status.step3::after{
  width: 100%;
}
#contact .contact-inner > .status li{
  flex: 1 1 0;
  text-align: center;
  font-weight: 700;
  color: #374151;
  position: relative;
  z-index: 2;                 /* 文字在最上层 */
}
#contact .contact-inner > .status li::before{
  content: none;              /* 删除圆点 */
}
/* 清掉任何遗留装饰 */
#contact .contact-inner > .status li::after{ content: none !important; }

/* 激活态 */
#contact .contact-inner > .status li.active{ color: #0E5099; }

/* 当前步骤的文字样式 */
#contact .contact-inner > .status li.current{ color: #0E5099; font-weight: 800; }

/* 窄屏 */
@media (max-width: 768px){
  #contact .contact-inner{ padding: 0 12px; }
  #contact .contact-inner > .status{ 
    padding-bottom: 20px !important; 
    max-width: 100% !important;          /* 移动端使用全宽 */
  }
  
  /* 移动端覆盖common.css的固定宽度 */
  #contact .status {
    width: auto !important;
    max-width: 100% !important;
  }
}




