#top_main .main_visual {
  position: relative;
}
#top_main h1.mv_text {
  position: absolute;
  line-height: 1.8;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  aspect-ratio: 735/460;
}
@media screen and (min-width: 768px) {
  #top_main h1.mv_text {
    width: 51.04166666666667vw;
    max-width: 735px;
    top: calc(50% + 38px);
    background: rgba(255,255,255,0.9);
    padding: 30px 75px 38px 84px;
  }
}
@media screen and (max-width: 1280px) {
  #top_main h1.mv_text {
    width: auto;
    padding: 2.34375vw 5.859375vw 2.96875vw 6.5625vw;
  }
}
@media screen and (max-width: 767px) {
  #top_main h1.mv_text {
    top: calc(50% + 21px);
    background: rgba(255,255,255,0.65);
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: calc((337 / 375) * 100vw);
    aspect-ratio: 337/247;
    padding: 4.615384615384615vw 3.846153846153846vw 4.615384615384615vw 7.692307692307692vw;
  }
}
#top_main h1.mv_text .strong {
  background-repeat: no-repeat;
  background-image: url("/cms/alpen-recruit-career/img/common/mv_toggle.png");
  background-size: auto 11px;
  background-position: right bottom;
  font-weight: 900;
  font-size: 52px;
  letter-spacing: 0.2em;
  margin-bottom: 16px;
  white-space: nowrap;
}
#top_main h1.mv_text .strong span {
  color: #009fdf;
}
@media screen and (max-width: 1280px) {
  #top_main h1.mv_text .strong {
    font-size: 4.0625vw;
  }
}
@media screen and (max-width: 767px) {
  #top_main h1.mv_text .strong {
    font-size: calc((28 / 375) * 100vw);
    padding-bottom: 12px;
    margin-bottom: 8px;
  }
}
#top_main h1.mv_text .text {
  letter-spacing: 0.1em;
  font-size: 24px;
}
@media screen and (max-width: 1280px) {
  #top_main h1.mv_text .text {
    font-size: 1.875vw;
  }
}
@media screen and (max-width: 767px) {
  #top_main h1.mv_text .text {
    letter-spacing: 0;
    font-size: calc((15 / 375) * 100vw);
  }
}
#top_main .c_inner {
  max-width: 1092px;
}
#top_main .topic_flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-column-gap: 86px;
     -moz-column-gap: 86px;
          column-gap: 86px;
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex + .topic_flex {
    margin-top: 40px;
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex + .topic_flex {
    margin-top: 56px;
  }
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex {
    padding: 90px 0;
  }
}
@media screen and (max-width: 1280px) {
  #top_main .topic_flex {
    -webkit-column-gap: calc((86 / 1280) * 100vw);
       -moz-column-gap: calc((86 / 1280) * 100vw);
            column-gap: calc((86 / 1280) * 100vw);
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex {
    padding: 0 0 54px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    row-gap: 16px;
  }
}
#top_main .topic_flex .img {
  position: relative;
  line-height: 1;
}
#top_main .topic_flex .img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#top_main .topic_flex .img:before {
  position: absolute;
  content: attr(title);
  color: #fff;
  letter-spacing: 0.1em;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  bottom: 0;
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex .img:before {
    padding: 10px;
    font-size: 28px;
    width: 241px;
    height: 124px;
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex .img:before {
    padding: 10px 13px;
    font-size: 22px;
    width: 182px;
    height: 110px;
  }
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex .img {
    min-width: 400px;
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex .img {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex.ver1 .topic:before {
    left: -200px;
  }
}
#top_main .topic_flex.ver1 .img:before {
  left: 0;
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex.ver1 .img:before {
    background: linear-gradient(27deg, #0e3d87 0%, #0e3d87 50%, transparent 50%, transparent 100%);
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex.ver1 .img:before {
    background: linear-gradient(31deg, #0e3d87 0%, #0e3d87 50%, transparent 50%, transparent 100%);
  }
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex.ver2 .topic:before {
    right: -250px;
  }
}
#top_main .topic_flex.ver2 .img:before {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  right: 0;
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex.ver2 .img:before {
    background: linear-gradient(-27deg, #0e3d87 0%, #0e3d87 50%, transparent 50%, transparent 100%);
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex.ver2 .img:before {
    background: linear-gradient(-31deg, #0e3d87 0%, #0e3d87 50%, transparent 50%, transparent 100%);
  }
}
#top_main .topic_flex .topic {
  position: relative;
  z-index: 0;
}
#top_main .topic_flex .topic:before {
  position: absolute;
  z-index: -1;
  content: "";
  background: #0e3d87;
  width: 100vw;
  opacity: 0.05;
  top: -90px;
}
@media screen and (min-width: 768px) {
  #top_main .topic_flex .topic:before {
    height: calc(100% + 180px);
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex .topic:before {
    height: calc(100% + 144px);
    left: -15px;
  }
}
@media screen and (max-width: 767px) {
  #top_main .topic_flex .topic {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
#top_main .c_section {
  padding: 140px 0;
}
@media screen and (max-width: 767px) {
  #top_main .c_section {
    padding: 77px 0 120px;
  }
}
#top_main .more_btn {
  display: block;
  font-weight: bold;
  text-align: center;
  background: #0e3d87;
  color: #fff;
  letter-spacing: 0.12em;
  line-height: 1.5;
  background-position: bottom 3px right 3px;
  background-image: url("/cms/alpen-recruit-career/img/top/btn_triangle.png");
  background-repeat: no-repeat;
  width: 186px;
  padding: 10px 0;
  background-size: 16px auto;
}
#top_main .more_btn:hover {
  opacity: 0.8;
}
@media screen and (min-width: 768px) {
  #top_main .more_btn {
    margin: 40px 0 0 auto;
  }
}
@media screen and (max-width: 767px) {
  #top_main .more_btn {
    margin: 28px 0 0 auto;
  }
}