@charset "UTF-8";

#er-top {
  position: relative;
  overflow: hidden;
}

#Contents.page-top #er-l-navF2 {
  display: none;
}

#Contents.page-top #er-l-navF1 {
  background: #fff;
  border-top: none;
}

#er-top .er-top-sectionTitle.er-font-2 {
  padding: 0;
  margin: 0;
  font-size: min(11.5vw, 115px);
  line-height: 1;
  text-transform: uppercase;
  background: transparent;
}

#er-top .er-top-sectionTitle-ja {
  padding: 0;
  margin: 0.5em 0 0 0.2em;
  font-size: min(2.1vw, 21px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.075em;
}

@media screen and (width <= 767px) {
  #er-top .er-top-sectionTitle.er-font-2 {
    font-size: calc(47 / 375 * 100vw);
  }

  #er-top .er-top-sectionTitle-ja {
    margin: 0.6em 0 0 0.1em;
    font-size: calc(10 / 375 * 100vw);
  }
}

@media (hover) {
  #er-top a.er-hov {
    transition: opacity 0.3s;
  }

  #er-top a.er-hov[href]:hover {
    opacity: 0.7;
  }
}

/*
 * Section / About
-------------------------------------------------------------- */
#er-top .er-topSectionAbout {
  position: relative;
  z-index: 5;
}

#er-top .er-topSectionAbout_header {
  position: absolute;
  top: 0;
  left: 50%;
  width: min(100%, 1140px);
  padding: 0 20px;
  padding-block: 0 min(10.5vw, 105px);
  translate: -50% -100%;
}

#er-top .er-topSectionAbout_container {
  position: relative;
  z-index: 1;
}

@media screen and (width <= 767px) {
  #er-top .er-topSectionAbout_header {
    padding: 0 calc(16 / 375 * 100%);
    padding-block: 0 calc(46 / 375 * 100%);
  }
}

/*
 * Section / Hse
-------------------------------------------------------------- */
#er-top .er-topSectionHse {
  position: relative;
  padding-block: min(11vw, 110px) min(8.5vw, 85px);
  margin-block: max(-3.5vw, -35px) 0;
}

#er-top .er-topSectionHse_title {
  position: relative;
  margin-block: 0 min(3.5vw, 35px);
  font-size: min(4.8vw, 48px);
  color: #fff;
  text-align: center;
}

#er-top .er-topSectionHse_container-link {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (width <= 767px) {
  #er-top .er-topSectionHse {
    padding-block: calc(65 / 375 * 100%);
    margin-block: calc(15 / 375 * 100%) 0;
  }

  #er-top .er-topSectionHse_title {
    margin-block: 0 calc(20 / 375 * 100%);
    font-size: calc(26 / 375 * 100vw);
  }
}

/*
 * Section / Works
-------------------------------------------------------------- */
#er-top .er-topSectionWorks {
  position: relative;
  padding-block: min(10vw, 100px) min(15vw, 150px);
  margin-block: min(14vw, 140px) 0;
}

#er-top .er-topSectionWorks_inner {
  position: relative;
  z-index: 2;
}

#er-top .er-topSectionWorks_header {
  margin-block: 0 min(6vw, 60px);
  text-align: center;
}

#er-top .er-topSectionWorks_container {
  width: min(100%, 1040px);
  padding: 0 20px;
  margin-inline: auto;
}

@media screen and (width <= 767px) {
  #er-top .er-topSectionWorks {
    padding-block: 0 calc(60 / 375 * 100%);
    margin-block: calc(50 / 375 * 100%) 0;
  }

  #er-top .er-topSectionWorks_header {
    margin-block: 0 calc(80 / 375 * 100%);
  }

  #er-top .er-topSectionWorks_container {
    padding: 0 calc(16 / 375 * 100%);
  }
}

/*
 * Section / Career
-------------------------------------------------------------- */
#er-top .er-topSectionCareer {
  position: relative;
  margin-block: min(18vw, 180px) 0;
}

#er-top .er-topSectionCareer_header {
  width: min(100%, 1140px);
  padding: 0 20px;
  margin-block: 0 min(8vw, 80px);
  margin-inline: auto;
}

#er-top .er-topSectionCareer_container {
  width: min(100%, 1040px);
  padding: 0 20px;
  margin-inline: auto;
}

#er-top .er-topSectionCareer_container-link {
  position: relative;
  z-index: 1;
  margin-block: min(6vw, 60px) 0;
}

@media screen and (width <= 767px) {
  #er-top .er-topSectionCareer {
    margin-block: calc(70 / 375 * 100%) 0;
  }

  #er-top .er-topSectionCareer_header {
    padding: 0 calc(16 / 375 * 100%);
    margin-block: 0 calc(35 / 375 * 100%);
  }

  #er-top .er-topSectionCareer_container {
    padding: 0 calc(16 / 375 * 100%);
  }

  #er-top .er-topSectionCareer_container-link {
    margin-block: calc(30 / 375 * 100%) 0;
  }
}

/*
 * Section / Recruit
-------------------------------------------------------------- */
#er-top .er-topSectionRecruit {
  position: relative;
  padding-block: min(13vw, 130px);
  margin-block: min(12vw, 120px) 0;
}

#er-top .er-topSectionRecruit_inner {
  position: relative;
  z-index: 2;
}

#er-top .er-topSectionRecruit_header {
  margin-block: 0 min(6vw, 60px);
  color: #fff;
  text-align: center;
}

#er-top .er-topSectionRecruit_container {
  width: min(100%, 1040px);
  padding: 0 20px;
  margin-inline: auto;
}

#er-top .er-topSectionRecruit_container-link {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-block: min(5vw, 50px) 0;
}

@media screen and (width <= 767px) {
  #er-top .er-topSectionRecruit {
    padding: calc(50 / 375 * 100%) 0 calc(65 / 375 * 100%);
    margin-block: calc(65 / 375 * 100%) 0;
  }

  #er-top .er-topSectionRecruit_header {
    margin-block: 0 calc(30 / 375 * 100%);
  }

  #er-top .er-topSectionRecruit_container {
    padding: 0 calc(16 / 375 * 100%);
  }

  #er-top .er-topSectionRecruit_container-link {
    margin-block: calc(25 / 375 * 100%) 0;
  }
}

/*
 * Contents / Common / linkPanel
-------------------------------------------------------------- */
#er-top .er-top-linkPanel {
  display: flex;
  flex-flow: column wrap;
  height: 100%;
  background: #fff;
  box-shadow: 3px 3px 5px rgba(0 0 0 / 20%);
}

#er-top .er-top-linkPanel_box {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: flex-start;
  padding: min(2vw, 20px);
}

#er-top .er-top-linkPanel_box p {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: min(4vw, 40px);
  padding-inline: min(1.8vw, 18px) 0;
  font-size: min(1.8vw, 18px);
  line-height: 1.45;
  color: #000;
}

#er-top .er-top-linkPanel_box p::before {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 5px;
  height: 100%;
  content: '';
  background: #e60027;
  clip-path: polygon(0 3%, 100% 0, 100% 97%, 0 100%);
  translate: 0 -50%;
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanel_box {
    padding: calc(10 / 375 * 100vw);
  }

  #er-top .er-top-linkPanel_box p {
    min-height: calc(30 / 375 * 100vw);
    padding-inline: 1em 0;
    font-size: calc(14 / 375 * 100vw);
  }

  #er-top .er-top-linkPanel_box p::before {
    width: 3px;
  }
}

/* comingsoon */
#er-top .er-top-linkPanel.is-comingsoon .er-top-linkPanel_img {
  position: relative;
}

#er-top .er-top-linkPanel.is-comingsoon .er-top-linkPanel_img::before {
  position: absolute;
  inset: 0;
  content: '';
  background: rgba(255 255 255 / 72%);
}

#er-top .er-top-linkPanel.is-comingsoon .er-top-linkPanel_img::after {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: min(2vw, 20px);
  font-weight: bold;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.075em;
  content: 'coming soon';
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanel.is-comingsoon .er-top-linkPanel_img::after {
    font-size: calc(14 / 375 * 100vw);
  }
}

/*
 * Works
-------------------- */
#er-top .er-top-linkPanelWrapper-works {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: min(5vw, 50px) min(1.8vw, 18px);
  width: 80%;
  margin-inline: auto;
}

#er-top .er-top-linkPanelWrapper-works > li:nth-child(3) {
  grid-area: 2/1/3/3;
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelWrapper-works {
    gap: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
    width: 100%;
  }

  #er-top .er-top-linkPanelWrapper-works > li:nth-child(3) {
    grid-area: 2/1/3/3;
  }
}

/*
 * Career
-------------------- */
#er-top .er-top-linkPanelWrapper-career {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: min(1.5vw, 15px);
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelWrapper-career {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
  }
}

/*
 * Recruit
-------------------- */
#er-top .er-top-linkPanelWrapper-recruit {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: min(5vw, 50px) min(1.8vw, 18px);
  width: 80%;
  margin-inline: auto;
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelWrapper-recruit {
    grid-template-columns: repeat(2, 1fr);
    gap: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
    width: 100%;
  }
}

/*
 * Contents / About / linkPanel
-------------------------------------------------------------- */
#er-top .er-top-linkPanelAbout_wrapper {
  position: relative;
  display: flex;
  width: min(100%, 1440px);
  margin-inline: auto;
}

#er-top .er-top-linkPanelAbout_wrapper::after {
  position: absolute;
  top: -15.27vw;
  left: 0;
  display: block;
  width: 100vw;
  height: 15.27vw;
  content: '';
  background: #fff;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

#er-top .er-top-linkPanelAbout_wrapper > li {
  position: relative;
  z-index: 1;
  width: 25%;
}

#er-top .er-top-linkPanelAbout_wrapper > li:nth-child(1) {
  margin-top: -3.82vw;
}

#er-top .er-top-linkPanelAbout_wrapper > li:nth-child(2) {
  margin-top: calc(-3.82vw * 2);
}

#er-top .er-top-linkPanelAbout_wrapper > li:nth-child(3) {
  margin-top: calc(-3.82vw * 3);
}

#er-top .er-top-linkPanelAbout_wrapper > li:nth-child(4) {
  margin-top: calc(-3.82vw * 4);
}

@media screen and (width > 1440px) {
  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(1) {
    margin-top: -55px;
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(2) {
    margin-top: calc(-55px * 2);
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(3) {
    margin-top: calc(-55px * 3);
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(4) {
    margin-top: calc(-55px * 4);
  }
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelAbout_wrapper::after {
    top: -15.2vw;
    height: 15.2vw;
  }

  #er-top .er-top-linkPanelAbout_wrapper {
    flex-flow: row wrap;
  }

  #er-top .er-top-linkPanelAbout_wrapper > li {
    width: 50%;
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(1) {
    margin-top: -7.6vw;
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(2) {
    margin-top: calc(-7.6vw * 2);
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(3) {
    margin-top: 0;
  }

  #er-top .er-top-linkPanelAbout_wrapper > li:nth-child(4) {
    margin-top: -7.6vw;
  }
}

#er-top .er-top-linkPanelAbout {
  display: block;
  background: #fff;
  clip-path: polygon(0% 3.82vw, 100% 0%, 100% 100%, 0% 100%);
}

@media screen and (width > 1440px) {
  #er-top .er-top-linkPanelAbout {
    clip-path: polygon(0% 55px, 100% 0%, 100% 100%, 0% 100%);
  }
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelAbout {
    aspect-ratio: 188/195;
    clip-path: polygon(0% 7.6vw, 100% 0%, 100% 100%, 0% 100%);
  }
}

#er-top .er-top-linkPanelAbout_img {
  width: 100%;
  aspect-ratio: 360/316;
  overflow: hidden;
  clip-path: polygon(0% 3.82vw, 100% 0%, 100% calc(100% - 3.82vw), 0% 100%);
}

#er-top .er-top-linkPanelAbout_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (hover) {
  #er-top .er-top-linkPanelAbout_img {
    transition: opacity 0.3s;
  }

  #er-top .er-top-linkPanelAbout[href]:hover .er-top-linkPanelAbout_img {
    opacity: 0.7;
  }
}

@media screen and (width > 1440px) {
  #er-top .er-top-linkPanelAbout_img {
    clip-path: polygon(0% 55px, 100% 0%, 100% calc(100% - 55px), 0% 100%);
  }
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelAbout_img {
    aspect-ratio: 188/195;
    clip-path: polygon(0% 7.6vw, 100% 0%, 100% calc(100% - 7.6vw), 0% 100%);
  }
}

#er-top .er-top-linkPanelAbout_box {
  padding: min(2vw, 20px);
}

#er-top .er-top-linkPanelAbout_box p {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: min(4vw, 40px);
  padding-inline: min(1.8vw, 18px) 0;
  font-size: min(1.8vw, 18px);
  line-height: 1.45;
  color: #000;
}

#er-top .er-top-linkPanelAbout_box p::before {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 5px;
  height: 100%;
  content: '';
  background: #e60027;
  clip-path: polygon(0 3%, 100% 0, 100% 97%, 0 100%);
  translate: 0 -50%;
}

@media screen and (width <= 767px) {
  #er-top .er-top-linkPanelAbout_box {
    padding: calc(10 / 375 * 100vw) 0 0 calc(10 / 375 * 100vw);
  }

  #er-top .er-top-linkPanelAbout_box p {
    min-height: calc(30 / 375 * 100vw);
    padding-inline: 1em 0;
    font-size: calc(14 / 375 * 100vw);
  }

  #er-top .er-top-linkPanelAbout_box p::before {
    width: 3px;
  }
}

/*
 * Contents / Hse / btn
-------------------------------------------------------------- */
#er-top .er-top_linkBtn-hse {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(32.3vw, 323px);
  height: min(6vw, 60px);
  font-size: min(2vw, 20px);
  color: #000;
  background: #fff;
  border-radius: 100vh;
  box-shadow: 3px 3px 5px rgba(0 0 0 / 20%);
}

#er-top .er-top_linkBtn-hse::after {
  position: absolute;
  top: 0;
  right: 6%;
  display: block;
  width: min(2.2vw, 22px);
  height: 100%;
  content: '';
  background: url('/recruitment/assets/images/common/arrow_01.png') no-repeat center center / contain;
}

@media screen and (width <= 767px) {
  #er-top .er-top_linkBtn-hse {
    width: calc(220 / 375 * 100vw);
    height: calc(40 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }

  #er-top .er-top_linkBtn-hse::after {
    right: 6%;
    width: calc(16 / 375 * 100vw);
  }
}

/*
 * Contents / Career / btn
-------------------------------------------------------------- */
#er-top .er-top_linkBtn-talk {
  position: relative;
  display: block;
  width: min(92vw, 920px);
  height: min(25.3vw, 253px);
  margin: 0 auto;
  color: #fff;
  text-align: center;
  background: url('/recruitment/assets/images/top/thumb_career_05.jpg') no-repeat center center / contain;
}

#er-top .er-top_linkBtn-talk > * {
  position: absolute;
  inset: min(2vw, 20px);
  display: flex;
  flex-flow: column wrap;
  align-items: center;
  justify-content: center;
}

#er-top .er-top_linkBtn-talk .er-top_linkBtn_title.er-font-2 {
  padding: 0;
  margin: 0;
  font-size: min(11.5vw, 115px);
  line-height: 1;
  text-transform: uppercase;
  background: transparent;
}

#er-top .er-top_linkBtn-talk .er-top_linkBtn_title-ja {
  padding: 0;
  margin: 0.5em 0 0 0.2em;
  font-size: min(2.1vw, 21px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.075em;
}

@media screen and (width <= 767px) {
  #er-top .er-top_linkBtn-talk {
    width: calc(343 / 375 * 100vw);
    height: calc(143 / 375 * 100vw);
    background: url('/recruitment/assets/images/top/thumb_career_05_sp.jpg') no-repeat center center / contain;
  }

  #er-top .er-top_linkBtn-talk > * {
    inset: calc(10 / 375 * 100vw);
  }

  #er-top .er-top_linkBtn-talk .er-top_linkBtn_title.er-font-2 {
    font-size: calc(46 / 375 * 100vw);
  }

  #er-top .er-top_linkBtn-talk .er-top_linkBtn_title-ja {
    margin: 0.3em 0 0;
    font-size: calc(16 / 375 * 100vw);
  }
}

/* comingsoon */
#er-top .er-top_linkBtn-talk.is-comingsoon::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: '';
  background: rgba(255 255 255 / 72%);
}

#er-top .er-top_linkBtn-talk.is-comingsoon::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: min(2vw, 20px);
  font-weight: bold;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.075em;
  content: 'coming soon';
}

@media screen and (width <= 767px) {
  #er-top .er-top_linkBtn-talk.is-comingsoon::after {
    font-size: calc(14 / 375 * 100vw);
  }
}

/*
 * Contents / Recruit / btn
-------------------------------------------------------------- */
#er-top .er-top_linkBtn-recruit {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(68.2vw, 682px);
  height: min(10vw, 100px);
  font-size: min(2vw, 20px);
  color: #fff;
  border: 2px solid #fff;
}

#er-top .er-top_linkBtn-recruit::after {
  position: absolute;
  top: 0;
  right: 6%;
  display: block;
  width: min(2.2vw, 22px);
  height: 100%;
  content: '';
  background: url('/recruitment/assets/images/common/arrow_01_w.png') no-repeat center center / contain;
}

@media screen and (width <= 767px) {
  #er-top .er-top_linkBtn-recruit {
    width: calc(315 / 375 * 100vw);
    height: calc(78 / 375 * 100vw);
    padding: 0 7% 0 0;
    font-size: calc(16 / 375 * 100vw);
  }

  #er-top .er-top_linkBtn-recruit::after {
    right: 6%;
    width: calc(16 / 375 * 100vw);
  }
}

/*
 * Bg / Hse
-------------------------------------------------------------- */
#er-top .er-topBg-hse::before {
  position: absolute;
  top: calc(-110 / 1440 * 100vw);
  bottom: calc(-110 / 1440 * 100vw);
  left: 0;
  z-index: 0;
  display: block;
  width: 100%;
  pointer-events: none;
  content: '';
  background: url('/recruitment/assets/images/top/bg_whs_01.jpg') no-repeat center bottom / cover;
  clip-path: polygon(0 15.27vw, 100% 0, 100% calc(100% - 15.27vw), 0% 100%);
}

@media screen and (width <= 767px) {
  #er-top .er-topBg-hse::before {
    top: calc(-29 / 375 * 100vw);
    bottom: calc(-29 / 375 * 100vw);
    background-image: url('/recruitment/assets/images/top/bg_whs_01_sp.jpg');
    clip-path: polygon(0 15.2vw, 100% 0, 100% calc(100% - 15.2vw), 0% 100%);
  }
}

/*
 * Bg / Works
-------------------------------------------------------------- */
#er-top .er-topBg-works::before {
  position: absolute;
  right: 0;
  bottom: max(calc(-390 / 1440 * 100vw), -390px);
  z-index: 0;
  display: block;
  width: min(100vw, 1440px);
  height: min(100vw, 1440px);
  content: '';
  background: url('/recruitment/assets/images/top/bg_01.png') no-repeat right bottom / 100% auto;
}

#er-top .er-topBg-works::after {
  position: absolute;
  top: calc(-110 / 1440 * 100vw);
  bottom: calc(-110 / 1440 * 100vw);
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  content: '';
  background: url('/recruitment/assets/images/top/bg_works_01.jpg') no-repeat center center / cover;
  clip-path: polygon(0 15.27vw, 100% 0, 100% calc(100% - 15.27vw), 0% 100%);
}

@media screen and (width <= 767px) {
  #er-top .er-topBg-works::before {
    bottom: calc(-70 / 375 * 100vw);
    width: 100vw;
    height: 100vw;
    background-image: url('/recruitment/assets/images/top/bg_01_sp.png');
  }

  #er-top .er-topBg-works::after {
    top: calc(70 / 375 * 100vw);
    bottom: calc(-29 / 375 * 100vw);
    background-image: url('/recruitment/assets/images/top/bg_works_01_sp.jpg');
    clip-path: polygon(0 15.2vw, 100% 0, 100% calc(100% - 15.2vw), 0% 100%);
  }
}

/*
 * Bg / Recruit
-------------------------------------------------------------- */
#er-top .er-topBg-recruit::before {
  position: absolute;
  top: max(calc(-350 / 1440 * 100vw), -350px);
  left: 0;
  z-index: 0;
  display: block;
  width: min(100vw, 1440px);
  height: min(100vw, 1440px);
  content: '';
  background: url('/recruitment/assets/images/top/bg_02.png') no-repeat top left / 100% auto;
}

#er-top .er-topBg-recruit::after {
  position: absolute;
  top: calc(-110 / 1440 * 100vw);
  bottom: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 100%;
  content: '';
  background: url('/recruitment/assets/images/top/bg_recruit_01.jpg') no-repeat center center / cover;
  clip-path: polygon(0 15.27vw, 100% 0, 100% 100%, 0% 100%);
}

@media screen and (width <= 767px) {
  #er-top .er-topBg-recruit::before {
    top: calc(-90 / 375 * 100vw);
    width: 100vw;
    height: 100vw;
    background-image: url('/recruitment/assets/images/top/bg_02_sp.png');
  }

  #er-top .er-topBg-recruit::after {
    top: calc(-29 / 375 * 100vw);
    background-image: url('/recruitment/assets/images/top/bg_recruit_01_sp.jpg');
    clip-path: polygon(0 15.2vw, 100% 0, 100% 100%, 0% 100%);
  }
}