@charset "UTF-8";
/********************************
リクルート
　メッセージ
********************************/
.main img {
  display: block;
  width: 100%;
  height: auto; }

/* 01 02 共通 */
.messFirstview {
  position: relative; }
  @media (max-width: 767px) {
    .messFirstview {
      margin-top: 111px;
      padding-bottom: 80px; } }
  @media (min-width: 768px) {
    .messFirstview {
      margin-top: 55px;
      margin-left: 25px;
      padding-left: 70px; } }
  .messFirstview-head {
    position: absolute; }
    @media (max-width: 767px) {
      .messFirstview-head {
        left: 25px;
        right: 25px;
        bottom: 0; } }
    @media (min-width: 768px) {
      .messFirstview-head {
        left: 0;
        top: 50px;
        width: 323px; } }
  .messFirstview--scroll {
    position: absolute;
    left: 25px;
    bottom: 160px;
    width: 190px;
    font-size: 10px;
    font-weight: 700;
    transform: rotate(90deg);
    transform-origin: 0 0; }
    .messFirstview--scroll::after {
      position: absolute;
      top: 50%;
      margin-left: 15px;
      display: inline-block;
      width: 125px;
      height: 1px;
      background-color: #010101;
      content: ""; }
    @media (min-width: 768px) and (max-width: 1200px) {
      .messFirstview--scroll {
        left: -5px; } }

.messSection {
  position: relative; }
  @media (max-width: 767px) {
    .messSection {
      padding: 35px 8% 0; } }
  @media (min-width: 768px) {
    .messSection {
      margin: 55px 0 100px; } }
  @media (max-width: 767px) {
    .messSection-head {
      max-width: 300px;
      margin-bottom: 15px; } }
  @media (min-width: 768px) {
    .messSection-head {
      position: absolute;
      width: 404px;
      left: 0;
      top: 0; } }

@media (min-width: 768px) {
  .messSection_qa {
    margin-top: 115px; } }

.messSection_qa dt {
  position: relative;
  padding-bottom: 28px;
  margin-bottom: 30px;
  font-size: 20px;
  line-height: 1.5; }
  .messSection_qa dt::after {
    position: absolute;
    left: 0;
    bottom: 0;
    display: inline-block;
    width: 74px;
    height: 3px;
    background-color: #010101;
    content: ""; }
  .messSection_qa dt ~ dt {
    margin-top: 60px; }

.messSection_qa dd {
  line-height: 3; }

/* 01 */
.mess01Section_container {
  position: relative; }
  @media (min-width: 768px) {
    .mess01Section_container {
      display: flex;
      max-width: 1400px;
      margin: 0 auto;
      padding: 0 4%; } }

.mess01Section_img {
  width: 161px; }
  @media (max-width: 767px) {
    .mess01Section_img {
      overflow: hidden;
      height: 330px;
      margin: 55px 0 0 auto; } }
  @media (min-width: 768px) {
    .mess01Section_img {
      flex-shrink: 0;
      margin: 55px 0 0 60px; } }

/* 02 */
.mess02Section_container {
  position: relative; }
  @media (max-width: 767px) {
    .mess02Section_container {
      margin-bottom: 30px; } }
  @media (min-width: 768px) {
    .mess02Section_container {
      display: flex;
      max-width: 1400px;
      margin: 0 auto;
      padding-left: 4%; } }

@media (max-width: 767px) {
  .mess02Section_img {
    width: 75%;
    margin: 30px auto 0; } }

@media (min-width: 768px) {
  .mess02Section_img {
    flex-shrink: 0;
    width: 40%;
    max-width: 454px;
    margin: 55px 0 0 60px; } }

/* 03 */
@media (min-width: 768px) {
  .mess03 {
    /*
    background: url(../img/recruit/pc.jpg)no-repeat top -30px center;
    */ } }

@media (max-width: 767px) {
  .mess03 {
    /*
    background: url(../img/recruit/sp3.jpg)no-repeat top 4779px center;
    background-size: 100%;
    */ } }

@media (min-width: 768px) {
  .mess03 .messFirstview {
    margin-bottom: 102px; } }

@media (max-width: 767px) {
  .mess03 .messFirstview {
    margin-bottom: 12%; } }

.mess03 .messFirstview-head {
  z-index: 9; }
  .mess03 .messFirstview-head img {
    z-index: 9; }

.mess03__content {
  margin: 0 auto;
  position: relative; }
  @media (min-width: 768px) {
    .mess03__content {
      max-width: 1385px; } }
  @media (min-width: 768px) {
    .mess03__content:last-child {
      margin-bottom: 124px; } }
  @media (max-width: 767px) {
    .mess03__content:last-child {
      margin-bottom: 13%; } }
  @media (min-width: 768px) {
    .mess03__content:not(:last-child) {
      margin-bottom: 204px; } }
  @media (max-width: 767px) {
    .mess03__content:not(:last-child) {
      margin-bottom: 20%; } }

.mess03__slidebox {
  position: relative;
  z-index: 1; }

.mess03__slide-img {
  opacity: 0;
  transition-duration: 1.5s;
  width: 100%;
  z-index: 1; }
  .mess03__slide-img:not(:first-child) {
    left: 0;
    position: absolute;
    top: 0; }
  .mess03__slide-img_act {
    /*
      transition-delay: 1s;
      */
    opacity: 1; }

@media (min-width: 768px) {
  .mess03__imgbox {
    height: 100%;
    max-width: 550px;
    right: 0;
    top: 0;
    position: absolute;
    width: 45%; } }

@media (max-width: 767px) {
  .mess03__imgbox {
    margin: 0 auto;
    width: 86%; } }

.mess03 .mess03__content-img {
  display: block; }

.mess03 .sec {
  margin: 0 auto; }
  @media (min-width: 768px) {
    .mess03 .sec {
      max-width: 936px;
      padding-right: 420px;
      width: 90%; } }
  @media (min-width: 767px) and (max-width: 980px) {
    .mess03 .sec {
      padding-right: 43%; } }
  @media (max-width: 767px) {
    .mess03 .sec {
      margin-bottom: 4.5%;
      padding-left: 8.5%;
      width: 100%; } }
  .mess03 .sec__head {
    font-size: 22px;
    line-height: 30px;
    overflow: visible;
    position: relative; }
    @media (min-width: 768px) {
      .mess03 .sec__head {
        margin-bottom: 64px;
        padding-left: 156px; } }
    @media (max-width: 767px) {
      .mess03 .sec__head {
        margin-bottom: 10%; } }
  @media (min-width: 768px) {
    .mess03 .sec__title-img {
      left: 2px;
      position: absolute;
      top: -30px; } }
  @media (max-width: 767px) {
    .mess03 .sec__title-img {
      opacity: 0.5;
      margin-bottom: 3%; } }
  @media (min-width: 768px) {
    .mess03 .sec__title-img_1 {
      width: 102px; } }
  @media (max-width: 767px) {
    .mess03 .sec__title-img_1 {
      width: 75px; } }
  @media (min-width: 768px) {
    .mess03 .sec__title-img_2 {
      width: 117px; } }
  @media (max-width: 767px) {
    .mess03 .sec__title-img_2 {
      width: 86px; } }
  @media (min-width: 768px) {
    .mess03 .sec__title-img_3 {
      width: 114px; } }
  @media (max-width: 767px) {
    .mess03 .sec__title-img_3 {
      width: 83px; } }
  @media (min-width: 768px) {
    .mess03 .sec__block:not(:last-child) {
      margin-bottom: 68px; } }
  @media (max-width: 767px) {
    .mess03 .sec__block:not(:last-child) {
      margin-bottom: 16.5%; } }
  .mess03 .sec__subhead {
    font-size: 22px;
    font-weight: normal;
    line-height: 38.5px;
    padding-bottom: 19px;
    position: relative; }
    @media (min-width: 768px) {
      .mess03 .sec__subhead {
        margin-bottom: 40px; } }
    @media (max-width: 767px) {
      .mess03 .sec__subhead {
        margin-bottom: 13%; } }
    .mess03 .sec__subhead:after {
      background-color: #000;
      bottom: 0;
      content: "";
      display: block;
      height: 3px;
      left: 0;
      position: absolute;
      width: 74px; }
  .mess03 .sec__p {
    font-size: 16px; }
    @media (min-width: 768px) {
      .mess03 .sec__p {
        line-height: 52.5px; } }
    @media (min-width: 767px) and (max-width: 999px) {
      .mess03 .sec__p {
        line-height: 32px; } }
    @media (max-width: 767px) {
      .mess03 .sec__p {
        letter-spacing: -0.5px;
        line-height: 39px;
        padding-right: 7%; } }
  .mess03 .sec__listbox {
    background-color: #eceae9; }
    @media (min-width: 768px) {
      .mess03 .sec__listbox {
        display: flex;
        justify-content: center;
        margin-bottom: 29px;
        width: 100%; } }
    @media (max-width: 767px) {
      .mess03 .sec__listbox {
        margin-bottom: 9%;
        padding: 6.6% 4% 6%;
        width: 93%; } }
  .mess03 .sec__ul {
    font-size: 16px;
    line-height: 22px;
    list-style-type: none; }
    @media (min-width: 768px) {
      .mess03 .sec__ul {
        padding: 44px 0;
        width: 50%; } }
    @media (min-width: 768px) {
      .mess03 .sec__ul:first-child {
        width: 35%; } }
    @media (min-width: 767px) and (max-width: 890px) {
      .mess03 .sec__ul:first-child {
        margin-right: 5%; } }
  .mess03 .sec__li {
    text-indent: -17px; }
    @media (min-width: 768px) {
      .mess03 .sec__li {
        padding: 13px 0 13px 17px; } }
    @media (max-width: 767px) {
      .mess03 .sec__li {
        padding: 0px 0 8.5px 17px; } }
    .mess03 .sec__li:before {
      content: "●";
      color: #f6a700; }

/*# sourceMappingURL=message.css.map */