.bg_box,
.main .recruit .slider .list li .img,
.main .recruit .description .block .tab_box .tab_btn,
.main .recruit .flow .block .box .btn span::before,
.main .recruit .flow .block .box::before,
.main .recruit .entry,
.main .recruit .entry .text_box .btn span::before {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.main .recruit .top_text {
  letter-spacing: 0.1em;
}

.main .recruit .top_text h2 {
  line-height: 2;
  margin-bottom: 3%;
}

.main .recruit .top_text h2 span.smoothText {
  overflow: hidden;
  display: block;
}

.main .recruit .top_text h2 span.smoothTrigger {
  -webkit-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  -webkit-transform: translate3d(0, 100%, 0) skewY(12deg);
  transform: translate3d(0, 100%, 0) skewY(12deg);
  -webkit-transform-origin: left;
  transform-origin: left;
  display: block;
}

.main .recruit .top_text h2 span.smoothTrigger.smoothAppear {
  -webkit-transform: translate3d(0, 0, 0) skewY(0);
  transform: translate3d(0, 0, 0) skewY(0);
}

.main .recruit .top_text p.f14 {
  line-height:  1.7;
}

.main .recruit .slider {
  margin-top: 5.49%;
  margin-bottom: 6%;
}

.main .recruit .slider .list li .img {
  padding: 30.9% 0;
}

.main .recruit .description {
  margin-top: 6.25%;
  margin-bottom: 6.9%;
}

.main .recruit .description .block {
  margin-top: 5.11%;
}

.main .recruit .description .block .tab_box .btn_area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
}

.main .recruit .description .block .tab_box .tab_btn {
  background-image: url(../img/recruit/job1.png);
  text-align: center;
  cursor: pointer;
  -webkit-transition: all 0.2s ease 0s;
  transition: all 0.2s ease 0s;
  letter-spacing: 0.1em;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 33.3%;
  flex: 0 0 33.3%;
  color: #fff;
  letter-spacing: 0.1em;
  padding: 7.15% 0;
  position: relative;
}

.main .recruit .description .block .tab_box .tab_btn::before {
  position: absolute;
  content: '';
  background-color: #d3cdc7;
  opacity: 0.9;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.main .recruit .description .block .tab_box .tab_btn span {
  position: relative;
}

.main .recruit .description .block .tab_box .tab_btn:nth-child(2) {
  background-image: url(../img/recruit/job2.png);
}

.main .recruit .description .block .tab_box .tab_btn:last-child {
  background-image: url(../img/recruit/job3.png);
  margin-right: 0;
}

.main .recruit .description .block .tab_box .tab_btn.active {
  color: #333333;
}

.main .recruit .description .block .tab_box .tab_btn.active::before {
  background-color: #cebfae;
  opacity: 0.5;
}

.main .recruit .description .block .tab_box .panel_area {
  margin-top: 5.45%;
}

.main .recruit .description .block .tab_box .tab_panel {
  display: none;
}

.main .recruit .description .block .tab_box .tab_panel.active {
  display: block;
}

.main .recruit .description .block .tab_box .tab_panel.active .list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border: 1px solid #333333;
  border-bottom: transparent;
  line-height: 1.7;
}

.main .recruit .description .block .tab_box .tab_panel.active .list li .left {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 30%;
  flex: 0 0 30%;
  border-right: 1px solid #333333;
  padding: 2.814% 0;
  padding-left: 3.47vw;
}

.main .recruit .description .block .tab_box .tab_panel.active .list li .right {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 70%;
  flex: 0 0 70%;
  padding: 2.814% 0;
  padding-left: 2.2vw;
}

.main .recruit .description .block .tab_box .tab_panel.active .list li:last-child {
  border-bottom: 1px solid #333333;
}

.main .recruit .flow {
  background-color: #d3cdc7;
  padding: 6.3% 17vw;
}

.main .recruit .flow h2.mds {
  line-height: 1.333;
  text-align: center;
  color: #fff;
}

.main .recruit .flow .block {
  margin-top: 6%;
}

.main .recruit .flow .block .box {
  background-color: #f6f2ed;
  text-align: center;
  letter-spacing: 0.1em;
  padding: 4.2% 4.4vw;
  margin-bottom: 5%;
  position: relative;
}

.main .recruit .flow .block .box h3 {
  margin-bottom: 2.79%;
}

.main .recruit .flow .block .box p.f16 {
  line-height: 2;
}

.main .recruit .flow .block .box .btn {
  width: 41%;
  margin: 0 auto;
  margin-top: 2.79%;
  display: block;
  text-align: center;
  border: 1px solid #333333;
  padding: 1.886% 0;
}

.main .recruit .flow .block .box .btn span {
  position: relative;
}

.main .recruit .flow .block .box .btn span::before {
  content: '';
  position: absolute;
  background-image: url(../img/common/arrow_b.png);
  width: 8px;
  height: 12px;
  top: 0;
  bottom: 0;
  right: -20px;
  margin: auto;
}

.main .recruit .flow .block .box::before {
  position: absolute;
  content: '';
  background-image: url(../img/common/flow_arrow.svg);
  width: 19px;
  height: 17px;
  left: 0;
  right: 0;
  top: 106%;
  margin: auto;
}

.main .recruit .flow .block .box:last-child {
  margin-bottom: 0;
}

.main .recruit .flow .block .box:last-child::before {
  display: none;
}

.main .recruit .entry {
  background-image: url(../img/recruit/entry_bg.jpg);
}

.main .recruit .entry .text_box {
  width: 50%;
  background-color: #c6c0b9e0;
  padding-top: 12%;
  padding-bottom: 12%;
  padding-left: 7vw;
  padding-right: 7.76vw;
  color: #fff;
  letter-spacing: 0.1em;
}

.main .recruit .entry .text_box p.f30 {
  line-height: 1.5;
}

.main .recruit .entry .text_box .btn {
  display: block;
  border: 1px solid #fff;
  text-align: center;
  color: #fff;
  margin-top: 11%;
  padding: 7.8% 0;
}

.main .recruit .entry .text_box .btn span {
  position: relative;
}

.main .recruit .entry .text_box .btn span::before {
  position: absolute;
  content: '';
  background-image: url(../img/common/arrow_w.png);
  width: 12px;
  height: 19px;
  top: 0;
  bottom: 0;
  right: -4vw;
  margin: auto;
}

.main .recruit .entry .text_box .btn:hover {
  opacity: 1;
  background-color: #ab9f91;
  border: 1px solid #ab9f91;
}

.main .recruit .top_text h2 span.underline {
  text-decoration: underline;
  text-decoration-color: #988666;
  text-underline-offset: 8px;
  font-weight: bold;
}

@media screen and (max-width: 768px) {
  .main .recruit .top_text {
    padding-right: 20vw;
  }
  .main .recruit .top_text h2 {
    font-size: 22px;
  }
  .main .recruit .description .block .tab_box .tab_panel.active .list li {
    font-size: 14px;
  }
  .main .recruit .flow {
    padding: 6.3% 10vw;
  }
  .main .recruit .flow .block .box::before {
    width: 16px;
    height: 13px;
    top: 107%;
  }
  .main .recruit .flow .block .box p.f16 {
    font-size: 14px;
  }
  .main .recruit .flow .block .box h3 {
    margin-bottom: 4%;
    font-size: 20px;
  }
  .main .recruit .flow .block .box .btn {
    width: 50%;
    margin-top: 4%;
    padding: 1.886% 0;
  }
}

@media screen and (max-width: 480px) {
  .main .recruit .top_text {
    padding-right: 2.8vw;
  }
  .main .recruit .top_text h2 {
    font-size: 16px;
    line-height: 2;
    margin-bottom: 5%;
  }
  .main .recruit .top_text p.f14 {
    line-height: 2;
  }
  .main .recruit .slider {
    margin-top: 12%;
    margin-bottom: 12%;
  }
  .main .recruit .description {
    margin-top: 12%;
    margin-bottom: 12%;
  }
  .main .recruit .description .block .tab_box .tab_btn {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
  }
  .main .recruit .description .block,
  .main .recruit .description .block .tab_box .panel_area {
    margin-top: 8%;
  }
  .main .recruit .description .block .tab_box .tab_panel.active .list li {
    display: block;
    font-size: 12px;
  }
  .main .recruit .description .block .tab_box .tab_panel.active .list li .left {
    padding-left: 2.8vw;
    border-right: transparent;
    border-bottom: 1px solid #333333;
    font-size: 14px;
  }
  .main .recruit .description .block .tab_box .tab_panel.active .list li .right {
    padding: 6% 2.8vw;
  }
  .main .recruit .description .block .tab_box .btn_area {
    font-size: 16px;
  }
  .main .recruit .description .block .tab_box .tab_btn {
    padding: 8% 0;
  }
  .main .recruit .flow {
    padding: 12% 2.8vw;
  }
  .main .recruit .flow .block {
    margin-top: 8%;
  }
  .main .recruit .flow .block .box h3 {
    font-size: 18px;
    margin-bottom: 5%;
  }
  .main .recruit .flow .block .box p.f16 {
    font-size: 13px;
    line-height: 1.7;
  }
  .main .recruit .flow .block .box {
    margin-bottom: 8%;
  }
  .main .recruit .flow .block .box::before {
    width: 12px;
    height: 11px;
  }
  .main .recruit .flow .block .box .btn {
    width: 60%;
    margin-top: 6%;
    padding: 4% 0;
  }
  .main .recruit .flow .block .box .btn span::before {
    width: 5px;
    height: 8px;
  }
  .main .recruit .entry .text_box {
    width: 75%;
    padding-left: 2.8vw;
    padding-right: 2.8vw;
  }
  .main .recruit .entry .text_box .btn {
    font-size: 14px;
    padding: 6% 0;
    margin-top: 8%;
  }
  .main .recruit .entry .text_box .btn span::before {
    width: 5px;
    height: 10px;
    right: -6vw;
  }
  .main .recruit .entry .text_box p.f30 {
    font-size: 16px;
  }
}