.fixed_scroll_area {
  transform: translateY(calc( -1 * ( var(--space5) + var(--space4) ) )); }

#head .logo_wrap {
  transition: var(--animationDuration) top;
  position: relative; }

body:not(.scrolled) #head .logo_wrap {
  top: calc( -1 * var(--headHeight ) ); }
body:not(.scrolled) #sub_head nav .btns .btn:not(.here) .a {
  color: #FFF; }

#mv {
  height: 100vw; }
  #mv .bg_wrap {
    height: 100%; }
    #mv .bg_wrap picture {
      width: 100%;
      height: 100%; }
      #mv .bg_wrap picture img,
      #mv .bg_wrap picture sourch {
        width: 100%;
        height: 100%;
        object-fit: cover; }
    #mv .bg_wrap .video {
      width: 100%;
      height: 100%;
      overflow: hidden; }
    #mv .bg_wrap::after {
      mix-blend-mode: multiply;
      width: 100%;
      height: 100%;
      background: #333;
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0.33;
      filter: Alpha(opacity=33); }
  #mv > .box_wrap {
    height: 100%;
    position: relative;
    z-index: 2;
    box-sizing: border-box;
    padding: calc( var(--headHeight) + var(--space4) ) 0 var(--space5) 0;
    color: #FFF;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    grid-gap: var(--space5); }
    #mv > .box_wrap .copy_wrap {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      grid-gap: var(--space4); }
      #mv > .box_wrap .copy_wrap .logo {
        width: 180px; }
    #mv > .box_wrap .sub_copy {
      position: absolute;
      bottom: var(--space4);
      width: 100%;
      letter-spacing: 0.1rem; }
  @media (max-width: 520px) {
    #mv {
      margin-bottom: calc( var(--space5) + var(--space4 ) ); }
      #mv .box_wrap {
        padding-bottom: var(--space4); }
        #mv .box_wrap .copy_wrap {
          height: 100%;
          justify-content: flex-end; }
          #mv .box_wrap .copy_wrap .copy {
            font-size: 1.5rem; }
          #mv .box_wrap .copy_wrap .logo {
            position: absolute;
            top: 0;
            bottom: 0;
            right: 0;
            left: 0;
            margin: auto;
            height: 165px;
            width: 115px; }
        #mv .box_wrap .sub_copy {
          color: var(--textColor);
          bottom: auto;
          top: calc( 100% + var(--space4) + var(--space2) ); } }
  @media (min-width: 521px) {
    #mv {
      height: 100dvh; } }
  @media (min-width: 768px) {
    #mv > .box_wrap .copy_wrap {
      margin-right: auto; }
      #mv > .box_wrap .copy_wrap .logo {
        width: 210px; } }
  @media (min-width: 1280px) {
    #mv > .box_wrap {
      box-sizing: border-box; } }

#concept {
  background: url("../images/home/bg_concept_sp.jpg") no-repeat center center;
  background-size: auto 100%;
  border-bottom: 1px solid var(--primaryColor); }
  #concept .logo {
    width: 126px;
    margin: 0 auto var(--space3) auto; }
  #concept .text {
    font-size: 1.2rem;
    line-height: 2;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    letter-spacing: 0.1rem; }
  @media (min-width: 521px) {
    #concept {
      background-image: url("../images/home/bg_concept.jpg"); }
      #concept .text {
        font-size: var(--fontSize_l); } }

@media (min-width: 768px) {
  #solution .section_title_wrap {
    margin-bottom: calc( var(--space4) * 1.5 ); } }
@media (min-width: 768px) {
  #solution .block_wrap {
    align-items: flex-start; }
    #solution .block_wrap .block {
      padding-top: var(--space2); } }

#news .section_title_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  grid-gap: var(--space1); }
@media (min-width: 1280px) {
  #news {
    --sideWidth:260px; }
    #news > .box_wrap {
      display: flex;
      flex-direction: row;
      grid-gap: var(--space5); }
      #news > .box_wrap > .section_title_wrap {
        margin-bottom: 0;
        width: var(--sideWidth);
        max-width: var(--sideWidth);
        min-width: var(--sideWidth);
        align-items: flex-start;
        justify-content: flex-start;
        grid-gap: var(--space5);
        flex-direction: column; }
      #news > .box_wrap > .section_body_wrap {
        width: 100%; } }
