@charset "utf-8";



/*=========================================================================================================
  Mobile
===========================================================================================================*/
@media only screen and (max-width: 767px) {

  img {
    max-width: 100%;
  }

  ul,ol {
    padding: 0;
    margin: 0;
  }
/*------------------------
  main
-------------------------- */
/******* main_section *********/
  main > section {
    padding: 15vw 0;
  }

  main section .section_title_wrap {
    margin: 0 0 3rem;
  }

  main section .section_title_wrap h2 {
    font-size: 6vw;
    text-align: center;
  }

  main section .section_title_wrap h2 span {
    border-bottom: 1px solid;
    display: inline-block;
    padding: 0.2em .5em;
  }

  main section .section_text span {
    display: block;
    font-size: 5vw;
    padding: 1em 0;
    text-align: center;
  }

  main section .section_text p {
    font-size: 4vw;
    margin: 1em auto;
    width: 90%;
  }

  main section section.sub_section {
    margin: 15vw auto;
    width: 95%;
  }

/******* signboard *******/
  #signboard h2 {
    color: #02b7ff;
    font-size: 6vw;
    margin: 1em auto;
    text-align: center;
  }

/******** summary ********/
  #summary .section_image {
    background: url(../images/recruit/recruit.jpg) center center/100vw no-repeat;
    height: 49vw;
    margin: 0 auto;
    width: 90vw;
  }

  #summary .sub_section .sub_title h4 {
    border-left: .3em solid;
    font-size: 6vw;
    margin: 5vw 0;
    padding: 0 0 0 .5em;
  }

  #summary .sub_section dl dt {
    background: #e9fbff;
    border-top: 1px solid #83e2ff;
    font-size: 4.4vw;
    font-weight: 300;
    padding: .3em 0;
    text-align: center;
  }

  #summary .sub_section dl dd {
    font-size: 4.4vw;
    font-weight: 300;
    margin: 0;
    padding: 1em;
  }

  #summary .sub_section dd a span {
    background: #80dcff;
    border-radius: .2em;
    color: #fff;
    display: inline-block;
    margin: 1vw 0;
    padding: .1em 1em;
  }

/********* method ********/
  #method .section_text div {
    height: 3em;
    margin: 10vw auto;
    position: relative;
  }
  #method .section_text div a {
    background: #009ece;
    border: none;
    border-radius: .2em;
    color: #fff;
    display: inline-block;
    font-size: 4.5vw;
    left: 50%;
    padding: .5em 1.5em;
    position: absolute;
    transform: translateX(-50%);
  }
}

/*=========================================================================================================
  PC
===========================================================================================================*/
@media only screen and (min-width: 768px) {
/*------------------------
  main
-------------------------- */
/***** main_section ******/
  main section .section_title_wrap {
    margin: 0 0 3rem;
  }

  main section .section_title_wrap h2 {
    font-size: 3rem;
    text-align: center;
  }

  main section .section_title_wrap h2 span {
    display: inline-block;
    padding: 0.2em 1.5em;
  }

  main section .section_title_wrap h2 span:first-of-type {
    border-bottom: 1px solid;
  }

  main section .section_text p {
    font-size: 1.8rem;
    line-height: 2em;
    text-align: center;
  }

  main section .section_text span {
    display: block;
    font-size: 2rem;
    letter-spacing: .1em;
    padding: 2em 0;
    text-align: center;
  }

/******* signboard *******/
  #signboard h2 {
    color: #02b7ff;
    font-size: 3rem;
    margin: 5em auto;
    text-align: center;
  }

/******** summary ********/
  #summary .section_text p {
    margin: 1em 0 4em;
  }

  #summary .section_image {
    background: url(../images/recruit/recruit.jpg) center center/contain no-repeat;
    height: 280px;
    margin: 0 auto;
    max-width: 600px;
  }

  #summary .sub_section {
    margin: 100px auto;
    width: 800px;
  }

  #summary .sub_section .sub_title h4 {
    border-bottom: 1px solid;
    font-size: 2.3rem;
    margin: 0 0 2em;
    padding: 0 0 .2em 1em;
  }

  #summary .sub_section dl {
    display: flex;
    flex-wrap: wrap;
    font-size: 1.5rem;
    margin: 0 auto;
    width: 700px;
  }

  #summary .sub_section dt {
    font-weight: 300;
    padding: 0 0 0 1.5em;
    position: relative;
    width: 25%;
  }

  #summary .sub_section dd {
    line-height: 2em;
    margin: 0;
    padding: 1em 0 1em 1.5em;
    width: 75%;
  }

  #summary .sub_section dt:not(:last-of-type),
  #summary .sub_section dd:not(:last-of-type) {
    border-bottom: 1px solid rgba(2, 183, 255, .3);
  }

  #summary .sub_section dt div {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
  }

  #summary .sub_section dd a span {
    background: #80dcff;
    border-radius: .2em;
    color: #fff;
    display: inline-block;
    margin: 0 0 0 4em;
    padding: .1em 1em;
    transition: .2s;
  }

  #summary .sub_section dd a span:hover {
    background: #5ac2e2;
  }

/******** method ********/
  #method .section_text div {
    height: 3em;
    margin: 50px auto;
    position: relative;
  }

  #method .section_text div a {
    background: #009ece;
    border: none;
    border-radius: .2em;
    color: #fff;
    display: inline-block;
    font-size: 1.4rem;
    left: 50%;
    padding: .5em 1.5em;
    position: absolute;
    transform: translateX(-50%);
    transition: .2s;
  }

  #method .section_text div a:hover {
    background: #0abded;
  }
}