.container {
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(227,234,246,1) 100%);
}

.crosstalk-kv {
  display: grid;
  background: rgba(160,185,225,.15);
  margin: 0 calc(50% - var(--vw, 1vw)*50);
  padding: 0 calc(min(var(--vw, 1vw), var(--svh, 1vh)) * 32 / 768 * 100);
  gap: min(min(var(--vw,1vw),var(--svh,1vh)) * 20/768 * 100,15px)
}

.crosstalk-kv-body {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

.crosstalk-kv-body__bg {
  background: rgb(3,110,183);
  background: linear-gradient(135deg, rgba(3,110,183,0.95) 0%, rgba(164,194,221,0.95) 100%);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: -1;
  -webkit-clip-path: polygon(100% 0,0 100%,100% 100%);
  clip-path: polygon(0 1%, 0% 100%, 100% 100%);
  aspect-ratio: 848 / 778;
}

.crosstalk-kv-body__kv {

}

.crosstalk-kv-body__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  width: auto;
  margin: 0 calc(min(var(--vw, 1vw), var(--svh, 1vh)) * 32 / 768 * 100);
  z-index: 20;
  height: 100%;
  padding-top: 10%;
}

.crosstalk-kv-body__ttl {
  margin-bottom: calc(var(--vw, 1vw)* 16 / 768 * 100);
}

.crosstalk-kv-body__ttl-txt {
  display: inline-block;
  padding: calc(var(--vw, 1vw)* 10 / 768 * 100) calc(var(--vw, 1vw)* 12 / 768* 100);
  background-color: #fff;
  color: #004196;
}

.crosstalk-kv-body__flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.crosstalk-kv-body__txt-img {
  flex-shrink: 0;
  width: calc(var(--vw, 1vw)* 179 / 768 * 100);
}

.crosstalk-kv-body__crosstalk {}

.crosstalk-topread {
  padding-top: 60px;
}

.crosstalk-topread-top {
}

.crosstalk-topread-top__block {
  margin-bottom: min(min(var(--vw,1vw),var(--svh,1vh)) * 40/768 * 100,30px);
  &:last-child {
    margin-bottom: 0;
  }
}

.crosstalk-topread-top__ttl {}

.crosstalk-topread-top__txt {}

.project-gradient-box {
  position: relative;
  margin-bottom: 60px;
  padding: min(min(var(--vw,1vw),var(--svh,1vh)) * 40/768 * 100,30px);
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(164,194,221,0.2) 0%, rgba(3,110,183,0.2) 100%);
  &::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    display: block;
    content: "";
    width: 32px;
    height: 4px;
    background-color: #3C64AA;
  }
}

.project-gradient-box__ttl {
  margin-bottom: calc(var(--vw, 1vw)* 24 / 1280* 100);
  text-align: center;
  color: #004196;
}

.crosstalk-topread-bottom {
  gap: 0 calc(var(--vw, 1vw)* 64 / 1280* 100);
}

.crosstalk-topread-bottom__block {
  margin-bottom: min(min(var(--vw,1vw),var(--svh,1vh)) * 60/768 * 100,45px);
  &:last-child {
    margin-bottom: 0;
  }
}

.crosstalk-topread-bottom__block-head {
  display: flex;
  margin-bottom: min(min(var(--vw,1vw),var(--svh,1vh)) * 16/768 * 100, 16px);
}

.crosstalk-topread-bottom__img {
  width: min( calc(var(--vw, 1vw)* 240 / 768* 100), 240px );
  height: min( calc(var(--vw, 1vw)* 240 / 768* 100), 240px );
  margin-right: calc(var(--vw, 1vw)* 36/ 768* 100);
  margin-bottom: calc(var(--vw, 1vw)* 36 / 768* 100);
}

.crosstalk-topread-bottom__meta {}

.crosstalk-topread-bottom__meta-name {
  margin-bottom: calc(var(--vw, 1vw)* 36 / 1280* 100);
  color: #004196;
}

.crosstalk-topread-bottom__meta-txt {
  margin-bottom: calc(var(--vw, 1vw)* 36 / 1280* 100);
}

.crosstalk-section {
  display: grid;
  margin-bottom: calc(var(--vw, 1vw)* 100 / 1280* 100);
  padding-top: min(min(var(--vw,1vw),var(--svh,1vh)) * 85/768 * 100,63.75px);
  gap: min(min(var(--vw,1vw),var(--svh,1vh)) * 60/768 * 100,45px)
}

.crosstalk-section+.crosstalk-section {
  padding-top: min(min(var(--vw,1vw),var(--svh,1vh)) * 48/768 * 100,72px)
}

.crosstalk-section-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: min(min(var(--vw,1vw),var(--svh,1vh)) * 12/768 * 100,9px)
}

.crosstalk-section-title.is-active .crosstalk-section-title__text {
  transform: scaleX(1)
}

.crosstalk-section-title.is-active .crosstalk-section-title__inner>* {
  transform: translateY(0)
}

.crosstalk-section-title__text {
  padding: min(min(var(--vw,1vw),var(--svh,1vh)) * 16/768 * 100,12px) min(min(var(--vw,1vw),var(--svh,1vh)) * 20/768 * 100,15px);
  transform: scaleX(0);
  transition: transform .5s cubic-bezier(.23,1,.32,1);
  transform-origin: left center
}

.crosstalk-section-title__inner {
  display: inline-block;
  overflow: hidden
}

.crosstalk-section-title__inner>* {
  display: block;
  transform: translateY(101%);
  transition: .3s linear .4s
}

.crosstalk-section-title__text--bg {
  background: linear-gradient(253.673deg,#a0b9e1,#64aadc);
  color: #fff
}

.crosstalk-section-title__text--border {
  border: 1px solid #00196e;
  color: #00196e
}

.crosstalk-section-content {
  display: flex;
  margin-bottom: calc(var(--vw, 1vw)* 32 / 768* 100);
}

.crosstalk-section__body {
  display: grid;
}

.crosstalk-section-visual {}

.crosstalk-section-visual-right {
  width: 100%;
  margin: min(min(var(--vw, 1vw), var(--svh, 1vh))* 36 / 768* 100, 27px) 0 0;
  grid-row: 9 / 9;
}

.crosstalk-section-visual-left {
  width: 100%;
  margin: min(min(var(--vw, 1vw), var(--svh, 1vh))* 36 / 768* 100, 27px) 0 0;
  grid-row: 5 / 5;
}

.crosstalk-section-visual__inner {}

.project-content__tmb {
  flex-shrink: 0;
  width: min( calc(var(--vw, 1vw)* 92 / 768* 100), 92px );
  margin-right: calc(var(--vw, 1vw)* 32 / 768* 100);
}

.project-content__tmb-name {
  margin-top: calc(var(--vw, 1vw)* 8 / 1280* 100);
  text-align: center;
  color: #004196;
}

.project-content-text {
  margin-top: min(min(var(--vw,1vw),var(--svh,1vh)) * 18/768 * 100, 18px)
}

.crosstalk-section-visual-full {
  margin-top: 64px;
}

.crosstalk-section-visual-full__inner {
  margin: 0 calc(50% - var(--vw, 1vw)* 50);
}

@media screen and (min-width: 960px) {
  .anim-fade-in {
    transform:translateY(calc(min(var(--vw, 1vw) * 40 / 1280 * 100 , 50px) * (1 - var(--progress, 0))))
  }

  .crosstalk-kv-body {
    aspect-ratio: 1280 / 438;
  }

  .crosstalk-kv {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    margin: 0 calc(50% - var(--vw, 1vw)*50);
    padding: 0 calc(var(--vw, 1vw)*50 - 50%);
    z-index: 0;
    aspect-ratio: 1280/760;
    gap: 0
  }

  .crosstalk-kv-body {
    aspect-ratio: 768 / 508;
  }

  .crosstalk-kv-body__bg {
    top: auto;
    bottom: 0;
    left: 0;
    right: auto;
    height: calc(var(--vw, 1vw) * 438 / 1280 * 100);
    z-index: 10;
  }

  .crosstalk-kv-body__kv {
    position: absolute;
    bottom: calc(var(--vw, 1vw)* 91 / 1280* 100);
    right: calc(var(--vw, 1vw)* 96 / 1280* 100);
    width: calc(var(--vw, 1vw)* 833 / 1280* 100);
    z-index: -1;
  }

  .crosstalk-kv-body__content {
    justify-content: flex-end;
    width: calc(var(--vw, 1vw)* 1216 / 1280* 100);
    margin: auto;
    padding-top: 0;
    padding-bottom: 3%;
  }

  .crosstalk-kv-body__ttl {
    margin-bottom: calc(var(--vw, 1vw)* 20 / 1280 * 100);
    padding-left: calc(var(--vw, 1vw)* 32 / 1280 * 100);
  }

  .crosstalk-kv-body__ttl-txt {
    padding: calc(var(--vw, 1vw)* 10 / 1280* 100) calc(var(--vw, 1vw)* 10 / 1280* 100);
  }

  .crosstalk-kv-body__flex {
    align-items: center;
  }

  .crosstalk-kv-body__txt-img {
    width: calc(var(--vw, 1vw)* 291 / 1280 * 100);
    padding-left: calc(var(--vw, 1vw)* 32 / 768* 100);
  }

  .crosstalk-kv-body__crosstalk {
    width: calc(var(--vw, 1vw)* 476 / 1280 * 100);
    padding-right: calc( calc(var(--vw, 1vw)* 32 / 1280* 100) + calc(var(--vw, 1vw)* 96 / 1280* 100) );
  }

  .crosstalk-topread {
    padding-top: 130px;
  }

  .crosstalk-topread-top__block {
    margin-bottom: calc(var(--vw, 1vw)* 40 / 1280* 100);
    &:last-child {
      margin-bottom: 0;
    }
  }

  .project-gradient-box {
    margin-bottom: 120px;
    padding: calc(var(--vw, 1vw)* 40 / 1280* 100);
  }

  .crosstalk-topread-bottom {
    display: flex;
  }

  .crosstalk-topread-bottom__block {
    width: 50%;
    margin-bottom: 0;
  }

  .crosstalk-topread-bottom__block-head {
    margin-bottom: 0;
  }

  .crosstalk-topread-bottom__img {
    width: min( calc(var(--vw, 1vw)* 240 / 1280* 100), 240px );
    height: min( calc(var(--vw, 1vw)* 240 / 1280* 100), 240px );
    margin-right: calc(var(--vw, 1vw)* 24 / 1280* 100);
    margin-bottom: calc(var(--vw, 1vw)* 24 / 1280* 100);
  }

  .crosstalk-topread-bottom__meta-name {
    margin-bottom: calc(var(--vw, 1vw)* 24 / 1280* 100);
  }

  .crosstalk-topread-bottom__meta-txt {
    margin-bottom: calc(var(--vw, 1vw)* 24 / 1280* 100);
  }

  .crosstalk-section {
    padding-top: min(var(--vw,1vw) * 110/1280 * 100,137.5px);
    gap: min(var(--vw,1vw) * 64/1280 * 100,80px)
  }

  .crosstalk-section + .crosstalk-section {
    padding-top: 0;
  }

  .crosstalk-section-title {
    gap: min(var(--vw,1vw) * 10/1280 * 100,12.5px);
  }

  .crosstalk-section-title__text {
    padding: min(var(--vw,1vw) * 10/1280 * 100,12.5px) min(var(--vw,1vw) * 20/1280 * 100,25px)
  }

  .project-content-text {
    margin-top: min(var(--vw,1vw) * 24/1280 * 100,30px)
  }

  .project-content__tmb {
    width: min( calc(var(--vw, 1vw)* 92 / 1280* 100), 92px );
    margin-right: min(var(--vw,1vw) * 32/1280 * 100, 32px);
  }

  .project-content-text {
    margin-top: min(min(var(--vw,1vw),var(--svh,1vh)) * 18/768 * 100,18px)
  }

  .crosstalk-section__body {
    display: block
  }

  .crosstalk-section-content {
    margin-bottom: 0;
  }

  .crosstalk-section-content + .crosstalk-section-content {
    margin-top: min(var(--vw,1vw) * 48/1280 * 100,80px);
  }

  .crosstalk-section-visual-full {
    margin-top: 60px;
  }

  .crosstalk-section-visual-right {
    width: min(var(--vw, 1vw)* 392 / 1280* 100, 392px);
    margin: 0 0 min(var(--vw, 1vw)* 30 / 1280* 100, 37.5px) min(var(--vw, 1vw)* 50 / 1280* 100, 62.5px);
    float: right;
  }

  .crosstalk-section-visual-left {
    width: min(var(--vw, 1vw)* 392 / 1280* 100, 392px);
    margin: 0 min(var(--vw, 1vw)* 50 / 1280* 100, 62.5px) min(var(--vw, 1vw)* 30 / 1280* 100, 37.5px) 0;
    float: left;
  }

  .crosstalk-section-visual-right .crosstalk-section-visual__inner {
    width: min(var(--vw, 1vw)* 520 / 1280* 100, 520px);
    aspect-ratio: 520 / 640;
  }

  .crosstalk-section-visual-left .crosstalk-section-visual__inner {
    margin-left: calc((min(var(--vw, 1vw)* 520 / 1280* 100, 520px) - min(var(--vw, 1vw)* 392 / 1280* 100, 392px))* -1);
  }

}