@charset "UTF-8";
/*
---------------------------------------------------------------------------------------------------------------------
メインビジュアル
---------------------------------------------------------------------------------------------------------------------
*/
.recruit-page {
  width: 90%;
  margin: auto;
  padding-top: 40px;
  position: relative; }
  @media (min-width: 1024px) {
    .recruit-page {
      width: 94%;
      padding-top: 100px; } }
  .recruit-page .main-title {
    margin-bottom: 20px; }
    @media (min-width: 1024px) {
      .recruit-page .main-title {
        position: absolute;
        top: calc(100px + 2%);
        left: 0; } }
    .recruit-page .main-title h1 {
      font-family: "M PLUS 1p", serif;
      font-style: normal;
      font-weight: 800;
      font-size: 10.0vw;
      text-shadow: 4px 4px 10px #fff;
      letter-spacing: 0.06em;
      position: relative;
      z-index: 10; }
      @media (min-width: 1024px) {
        .recruit-page .main-title h1 {
          font-size: 8.0vw;
          letter-spacing: 0.08em; } }
      .recruit-page .main-title h1 .small {
        font-size: 0.8em; }
  .recruit-page .photo {
    border-radius: 10px; }
    @media (min-width: 1024px) {
      .recruit-page .photo {
        border-radius: 20px; } }
    .recruit-page .photo img {
      border-radius: 10px;
      height: 100%;}
      @media (min-width: 1024px) {
        .recruit-page .photo img {
          border-radius: 20px; } }
  .recruit-page .txt .common-title-sab {
    margin-bottom: 15px; }
  .recruit-page .txt p {
    font-size: 0.9em;
    line-height: 1.8em;
    text-align: justify; }
    @media (min-width: 1250px) {
      .recruit-page .txt p {
        font-size: 1.125em; } }
  @media (min-width: 1024px) {
    .recruit-page .contents {
      display: flex; } }
  .recruit-page .contents .contents-type1 {
    margin-top: 40px; }
    @media (min-width: 1024px) {
      .recruit-page .contents .contents-type1 {
        width: 32%;
        margin-top: auto;
        padding-right: 2%; } }
    .recruit-page .contents .contents-type1 .photo {
      margin-top: 10px; }
  .recruit-page .contents .contents-type2 {
    margin-top: 20px; }
    @media (min-width: 1024px) {
      .recruit-page .contents .contents-type2 {
        width: 68%;
        margin-top: 0; } }
    .recruit-page .contents .contents-type2 .txt {
      margin-top: 15px; }
  .recruit-page .contents-type3 {
    margin-top: 60px;
    margin-bottom: 60px; }
    @media (min-width: 1024px) {
      .recruit-page .contents-type3 {
        display: flex; } }
    @media (min-width: 1024px) {
      .recruit-page .contents-type3 .photo {
        width: 68%; } }
    .recruit-page .contents-type3 .txt {
      margin-top: 20px; }
      @media (min-width: 1024px) {
        .recruit-page .contents-type3 .txt {
          width: 32%;
          padding-left: 2%;
          margin-top: auto; } }
.contents-type3{
  .txt{
    .photo{
      width: 100%;
    }
  }
}
.contents-type4{
  p{
    font-size: 0.9em;
    line-height: 1.8em;
    text-align: justify;
  }
}
@media (min-width: 1250px) {
    .contents-type4{
        p{
          font-size: 1.125em;
      }
    }
  }
/*
---------------------------------------------------------------------------------------------------------------------
募集要項
---------------------------------------------------------------------------------------------------------------------
*/
#recruitment {
  width: 90%;
  margin: auto;
  max-width: 1200px;
  padding-top: 80px; }
  @media (min-width: 1024px) {
    #recruitment {
      padding-top: 100px; } }
  #recruitment .middle-copy {
    position: absolute;
    top: 60px;
    right: -5px;
    z-index: 1; }
    @media (min-width: 1024px) {
      #recruitment .middle-copy {
        top: 160px;
        z-index: -1; } }
    #recruitment .middle-copy h4 {
      font-size: 16vw; }
      @media (min-width: 1024px) {
        #recruitment .middle-copy h4 {
          font-size: 10vw; } }
  #recruitment .recruitment-title {
    margin: 0 0 20px 0; }
    #recruitment .recruitment-title h3 {
      font-size: 1.125em;
      margin-bottom: 10px; }
      @media (min-width: 1024px) {
        #recruitment .recruitment-title h3 {
          font-size: 1.25em; } }
  #recruitment ul.tab {
    margin-bottom: 40px; }
    @media (min-width: 1024px) {
      #recruitment ul.tab {
        display: flex;
        flex-wrap: wrap; } }
    #recruitment ul.tab li {
      width: 100%;
      position: relative;
      margin-bottom: 10px; }
      @media (min-width: 1024px) {
        #recruitment ul.tab li {
          width: 25%; }
          #recruitment ul.tab li:first-child {
            padding-right: 10px; }
            #recruitment ul.tab li:first-child svg {
              right: 18px; }
          #recruitment ul.tab li:last-child {
            padding-left: 10px; } }
      #recruitment ul.tab li a {
        display: block;
        background-color: #fff;
        padding: 10px 20px;
        border-radius: 50px;
        color: #9B9B9B; }
        @media (min-width: 1024px) {
          #recruitment ul.tab li a {
            padding: 12px 20px; } }
        #recruitment ul.tab li a p {
          font-size: 0.9em;
          font-weight: bold; }
        #recruitment ul.tab li a svg {
          position: absolute;
          top: 0;
          bottom: 0;
          right: 8px;
          width: 25px;
          margin: auto; }
          @media (min-width: 1024px) {
            #recruitment ul.tab li a svg {
              width: 30px; } }
          #recruitment ul.tab li a svg .st0 {
            fill: #fff; }
          #recruitment ul.tab li a svg .st1 {
            fill: #0b198c; }
      #recruitment ul.tab li.active a {
        background-color: #0b198c;
        color: #fff; }
        #recruitment ul.tab li.active a svg .st0 {
          fill: #0b198c; }
        #recruitment ul.tab li.active a svg .st1 {
          fill: #fff; }
  #recruitment .area {
    display: none;
    opacity: 0; }
    #recruitment .area.is-active {
      display: block;
      animation-name: displayAnime;
      animation-duration: 2s;
      animation-fill-mode: forwards; }
@keyframes displayAnime {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
  #recruitment .recruitment-chart {
    margin: 20px 0 0 0; }
    @media (min-width: 1024px) {
      #recruitment .recruitment-chart {
        margin: 40px 0 0 0; } }
  #recruitment .item {
    background-color: #fff;
    border-radius: 20px;
    padding: 20px 25px;
    margin-bottom: 10px; }
    @media (min-width: 1024px) {
      #recruitment .item {
        padding: 20px 35px;
        border-radius: 30px;
        margin-bottom: 20px; } }
    @media (min-width: 1250px) {
      #recruitment .item {
        padding: 30px 45px; } }
    #recruitment .item h3 {
      font-size: 1.45em;
      border-bottom: 1px solid #000;
      padding-bottom: 5px; }
      @media (min-width: 768px) {
        #recruitment .item h3 {
          font-size: 1.75em;
          padding-bottom: 10px; } }
    #recruitment .item .txt {
      display: flex;
      justify-content: space-between;
      margin-top: 10px; }
      @media (min-width: 768px) {
        #recruitment .item .txt {
          margin-top: 20px;
          justify-content: normal; } }
      #recruitment .item .txt p {
        font-size: 0.85em;
        line-height: 1.6em; }
        @media (min-width: 768px) {
          #recruitment .item .txt p {
            margin-right: 20px; } }
        @media (min-width: 1250px) {
          #recruitment .item .txt p {
            font-size: 1.0em; } }
    #recruitment .item ul.type1 {
      margin-top: 10px; }
      @media (min-width: 768px) {
        #recruitment .item ul.type1 {
          margin-top: 20px; } }
    #recruitment .item ul li {
      font-size: 0.85em;
      line-height: 1.4em;
      margin-bottom: 10px; }
      @media (min-width: 1250px) {
        #recruitment .item ul li {
          font-size: 1.0em; } }
  #recruitment .overview table {
    border-collapse: collapse;
    width: 100%; }
    #recruitment .overview table th, #recruitment .overview table td {
      display: block; }
      @media (min-width: 768px) {
        #recruitment .overview table th, #recruitment .overview table td {
          display: table-cell; } }
    #recruitment .overview table th {
      font-size: 1.125em;
      text-align: left;
      line-height: 1.8em;
      vertical-align: top;
      padding: 10px 0 0; }
      @media (min-width: 768px) {
        #recruitment .overview table th {
          padding: 15px 0;
          width: 130px; } }
      @media (min-width: 1250px) {
        #recruitment .overview table th {
          width: 200px; } }
    #recruitment .overview table td {
      font-size: 0.85em;
      line-height: 1.8em;
      padding: 0 0 5px 0;
      font-feature-settings: "palt";
      letter-spacing: 0.08em; }
      @media (min-width: 768px) {
        #recruitment .overview table td {
          padding: 15px 0;
          min-width: 210px; } }
      @media (min-width: 1250px) {
        #recruitment .overview table td {
          font-size: 1.0em; }
          #recruitment .overview table td:last-child {
            padding-left: 40px; } }
      #recruitment .overview table td.just {
        text-align: justify; }
      #recruitment .overview table td ul {
        margin-bottom: 30px; }
        #recruitment .overview table td ul.tumenasi {
          font-feature-settings: normal; }
        #recruitment .overview table td ul:last-child {
          margin-bottom: 0; }
        #recruitment .overview table td ul li {
          font-size: 1.0em;
          line-height: 1.6em;
          margin-bottom: 5px; }
          #recruitment .overview table td ul li:last-child {
            margin-bottom: 0; }
  #recruitment .common-btn {
    text-align: center;
    margin: 40px auto 0; }