/* base
--------------------------- */
a {
  text-decoration: none;
}

/* utility
--------------------------- */
@media screen and (min-width: 841px) {
  .crew-onlySP {
    display: none !important;
  }
}

@media screen and (max-width: 840px) {
  .crew-onlyPC {
    display: none !important;
  }
}

.crew-mont {
  font-family: "Montserrat", sans-serif;
}

.crew-roboto {
  font-family: "Roboto", sans-serif;
}

.crew-top {
  background: url(../png/bg-dot.png) repeat center;
}
@media screen and (min-width: 841px) {
  .crew-top {
    background-size: 30px 30px;
  }
}
@media screen and (max-width: 840px) {
  .crew-top {
    background-size: 5.8666666667vw 5.8666666667vw;
  }
}
.crew-top .crew-top_inner {
  width: 100%;
}
@media screen and (min-width: 841px) {
  .crew-top .crew-top_inner {
    margin: 0 auto;
    max-width: 1200px;
    padding: 70px 10px 123px;
  }
}
@media screen and (max-width: 840px) {
  .crew-top .crew-top_inner {
    padding: 16vw 5.3333333333vw 20.8vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-top .crew-top_title {
    width: 638px;
  }
}
@media screen and (max-width: 840px) {
  .crew-top .crew-top_title {
    width: 78.6666666667vw;
    margin: 0 auto;
  }
}
.crew-top .crew-top_title img {
  width: 100%;
}
.crew-top .crew-top_subtitle {
  color: #005396;
  line-height: 1.5;
}
@media screen and (min-width: 841px) {
  .crew-top .crew-top_subtitle {
    margin-top: 30px;
    font-size: 30px;
  }
}
@media screen and (max-width: 840px) {
  .crew-top .crew-top_subtitle {
    margin-top: 5.3333333333vw;
    font-size: 5.8666666667vw;
  }
}
.crew-top .crew-top_lead {
  color: #005396;
}
@media screen and (min-width: 841px) {
  .crew-top .crew-top_lead {
    margin-top: 20px;
    font-size: 16px;
    line-height: 2.2;
  }
}
@media screen and (max-width: 840px) {
  .crew-top .crew-top_lead {
    margin-top: 5.3333333333vw;
    font-size: 3.7333333333vw;
    line-height: 2.2;
  }
}
.crew-top .crew-top_panelListWrap {
  margin-top: 9.8133333333vw;
}

/* crew-earth
--------------------------- */
.crew-earth {
  position: relative;
}
@media screen and (min-width: 841px) {
  .crew-earth {
    margin-top: 60px;
  }
}
@media screen and (max-width: 840px) {
  .crew-earth {
    margin-top: 40px;
  }
}
.crew-earth .crew-earth_figure {
  margin: 0 auto;
  display: block;
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_figure {
    width: min(81.6666666667vw, 980px);
    padding: min(4.775vw, 57.3px) 0 min(8.8083333333vw, 105.7px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_figure {
    width: 89.3333333333vw;
    padding: 3.7333333333vw 0 8.5333333333vw;
  }
}
.crew-earth .crew-earth_figure img {
  width: 100%;
}
.crew-earth .crew-earth_card {
  position: absolute;
  z-index: 1;
}
.crew-earth .crew-earth_card .crew-earth_card_link {
  display: block;
  background-color: #fff;
  border: 1px solid rgba(0, 83, 150, 0.6);
  text-decoration: none;
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card .crew-earth_card_link {
    padding: min(0.4166666667vw, 5px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card .crew-earth_card_link {
    padding: 1.3333333333vw;
  }
}
@media (any-hover: hover) {
  .crew-earth .crew-earth_card .crew-earth_card_link:hover .crew-earth_card_caption {
    opacity: 1;
  }
}
.crew-earth .crew-earth_card .crew-earth_card_figure {
  position: relative;
}
.crew-earth .crew-earth_card .crew-earth_card_figure img {
  width: 100%;
}
.crew-earth .crew-earth_card .crew-earth_card_caption {
  position: absolute;
  display: block;
  opacity: 0;
  transition: opacity 0.3s ease;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}
.crew-earth .crew-earth_card .crew-earth_card_caption .crew-earth_card_caption_inner {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.crew-earth .crew-earth_card .crew-earth_card_caption .crew-earth_card_caption_inner span {
  color: #ffffff;
}
.crew-earth .crew-earth_card .crew-earth_card_caption .crew-earth_card_caption_inner .crew-job {
  font-size: min(2vw, 24px);
  line-height: 1.0833333333;
}
.crew-earth .crew-earth_card .crew-earth_card_caption .crew-earth_card_caption_inner .crew-country {
  font-size: min(1.3333333333vw, 16px);
  line-height: 1.625;
}
.crew-earth .crew-earth_card .crew-earth_card_caption .crew-earth_card_caption_inner .crew-more {
  display: inline-block;
  position: absolute;
  right: min(0.8333333333vw, 10px);
  bottom: min(0.8333333333vw, 10px);
  font-weight: 600;
  font-size: min(1vw, 12px);
  line-height: 1.2;
  padding-right: min(1.9166666667vw, 23px);
}
.crew-earth .crew-earth_card .crew-earth_card_caption .crew-earth_card_caption_inner .crew-more:after {
  content: "";
  width: min(1.5vw, 18px);
  height: min(0.6666666667vw, 8px);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: url(https://www.mol.co.jp/crew/assets/img/icon-arrow-right-white.svg) no-repeat center;
  background-size: contain;
}
.crew-earth .crew-earth_card .crew-earth_card_text {
  color: #ffffff;
  font-weight: bold;
  -webkit-text-stroke: 1px #005396;
  text-stroke: 1px #005396;
}
.crew-earth .crew-earth_card.crew-nolink .crew-earth_card_link {
  pointer-events: none;
  padding: 0;
  border: none;
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew001 {
    width: min(21.6666666667vw, 260px);
    left: min(24.4166666667vw, 293px);
    top: min(29.8333333333vw, 358px);
  }
  .crew-earth .crew-earth_card.crew001 .crew-earth_card_text {
    font-size: min(3vw, 36px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card.crew001 {
    width: 34.6666666667vw;
    left: 18.6666666667vw;
    top: 10.6666666667vw;
  }
  .crew-earth .crew-earth_card.crew001 .crew-earth_card_text {
    font-size: 6.4vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew002 {
    width: min(21.6666666667vw, 260px);
    left: min(59vw, 708px);
    top: min(25.75vw, 309px);
  }
  .crew-earth .crew-earth_card.crew002 .crew-earth_card_text {
    font-size: min(3vw, 36px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card.crew002 {
    width: 34.6666666667vw;
    left: 8vw;
    top: 60vw;
  }
  .crew-earth .crew-earth_card.crew002 .crew-earth_card_text {
    font-size: 6.4vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew003 {
    width: min(18.3333333333vw, 220px);
    left: min(47.1666666667vw, 566px);
    top: min(48.5vw, 582px);
  }
  .crew-earth .crew-earth_card.crew003 .crew-earth_card_text {
    font-size: min(2.9166666667vw, 35px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card.crew003 {
    width: 34.6666666667vw;
    left: 48vw;
    top: 40vw;
  }
  .crew-earth .crew-earth_card.crew003 .crew-earth_card_text {
    font-size: 6.4vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew004 {
    width: min(18.3333333333vw, 220px);
    left: min(0.75vw, 9px);
    top: min(34.4166666667vw, 413px);
  }
  .crew-earth .crew-earth_card.crew004 .crew-earth_card_text {
    font-size: min(2.9166666667vw, 35px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card.crew004 {
    width: 23.2vw;
    left: 61.3333333333vw;
    top: 77.3333333333vw;
  }
  .crew-earth .crew-earth_card.crew004 .crew-earth_card_text {
    font-size: 6.4vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew005 {
    width: min(16.6666666667vw, 200px);
    left: min(63.3333333333vw, 760px);
    top: min(70.8333333333vw, 850px);
  }
  .crew-earth .crew-earth_card.crew005 .crew-earth_card_text {
    font-size: min(2.25vw, 27px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card.crew005 {
    width: 17.6vw;
    left: 0vw;
    top: 40.8vw;
  }
  .crew-earth .crew-earth_card.crew005 .crew-earth_card_text {
    font-size: 3.7333333333vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew006 {
    width: min(18.9166666667vw, 227px);
    left: min(10.5833333333vw, 127px);
    top: min(70vw, 840px);
  }
  .crew-earth .crew-earth_card.crew006 .crew-earth_card_text {
    font-size: min(2.9166666667vw, 35px);
  }
}
@media screen and (max-width: 840px) {
  .crew-earth .crew-earth_card.crew006 {
    z-index: 0;
    width: 22.9333333333vw;
    left: 61.3333333333vw;
    top: 0vw;
  }
  .crew-earth .crew-earth_card.crew006 .crew-earth_card_text {
    font-size: 6.4vw;
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew007 {
    width: min(13.1666666667vw, 158px);
    left: min(41.4166666667vw, 497px);
    top: min(17.3333333333vw, 208px);
  }
  .crew-earth .crew-earth_card.crew007 .crew-earth_card_text {
    font-size: min(1.9166666667vw, 23px);
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew008 {
    z-index: 0;
    width: min(16.6666666667vw, 200px);
    left: min(9vw, 108px);
    top: min(3.3333333333vw, 40px);
  }
  .crew-earth .crew-earth_card.crew008 .crew-earth_card_text {
    font-size: min(2.25vw, 27px);
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew009 {
    z-index: 0;
    width: min(13.1666666667vw, 158px);
    left: min(84.8333333333vw, 1018px);
    top: min(27.75vw, 333px);
  }
  .crew-earth .crew-earth_card.crew009 .crew-earth_card_text {
    font-size: min(1.8333333333vw, 22px);
  }
}
@media screen and (min-width: 841px) {
  .crew-earth .crew-earth_card.crew010 {
    z-index: 0;
    width: min(18.3333333333vw, 220px);
    left: min(65.25vw, 783px);
    top: min(1.3333333333vw, 16px);
  }
  .crew-earth .crew-earth_card.crew010 .crew-earth_card_text {
    font-size: min(2.9166666667vw, 35px);
  }
}

/* crew-panelList
--------------------------- */
.crew-panelList {
  border-top: 1px solid #005396;
}
.crew-panelList .crew-panelList_item {
  border-bottom: 1px solid #005396;
}
.crew-panelList .crew-panelList_link {
  display: block;
  width: 100%;
  padding: 5.3333333333vw 0;
  display: flex;
  column-gap: 4vw;
}
.crew-panelList .crew-panelList_figure {
  width: 42.6666666667vw;
}
.crew-panelList .crew-panelList_detail {
  width: calc(100% - 46.6666666667vw);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.crew-panelList .crew-panelList_detail span {
  display: block;
  color: #005396;
}
.crew-panelList .crew-panelList_detail span.crew-no {
  color: #ffffff;
  font-weight: bold;
  font-size: 6.4vw;
  line-height: 1.0833333333;
  letter-spacing: 0.2666666667vw;
  -webkit-text-stroke: 1px #005396;
  text-stroke: 1px #005396;
}
.crew-panelList .crew-panelList_detail span.crew-job {
  margin-top: 1px;
  font-size: 5.3333333333vw;
  line-height: 1.4;
}
.crew-panelList .crew-panelList_detail span.crew-country {
  font-size: 3.7333333333vw;
  line-height: 1.3928571429;
}
.crew-panelList .crew-panelList_detail .crew-panelList_detail_link {
  text-align: right;
}
.crew-panelList .crew-panelList_detail .crew-panelList_detail_link span {
  position: relative;
  display: inline-block;
  font-weight: 600;
  font-size: 3.2vw;
  line-height: 1.2;
  padding-right: 6.1333333333vw;
}
.crew-panelList .crew-panelList_detail .crew-panelList_detail_link span:after {
  content: "";
  width: 4.8vw;
  height: 2.1333333333vw;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: url(https://www.mol.co.jp/crew/assets/img/icon-arrow-right-blue.svg) no-repeat center;
  background-size: contain;
}