@charset "UTF-8";
h2 {
  display: flex;
  justify-content: center;
  flex-direction: column;
  margin: 0 auto 30px;
  padding-bottom: 22px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  position: relative; }
  @media screen and (max-width: 550px) {
    h2 {
      margin: 0 auto 20px;
      padding-bottom: 15px;
      font-size: 20px; } }
  h2 span {
    font-size: 16px; }
    @media screen and (max-width: 550px) {
      h2 span {
        font-size: 14px; } }
  h2:after {
    content: '';
    width: 80px;
    height: 10px;
    background-color: #000;
    position: absolute;
    left: calc(50% - 40px);
    bottom: 0px; }
    @media screen and (max-width: 550px) {
      h2:after {
        width: 60px;
        height: 8px;
        left: calc(50% - 30px); } }

section.top {
  max-width: 100%;
  width: 90%;
  margin: 0 auto 120px;
  text-align: center; }
  @media screen and (max-width: 768px) {
    section.top {
      margin: 0 auto 52px; } }

section.hundred {
  max-width: 700px;
  width: 93%;
  margin: 0 auto 60px; }
  @media screen and (max-width: 768px) {
    section.hundred {
      margin: 0 auto 30px; } }
  section.hundred p {
    font-size: 16px;
    line-height: 2; }
    @media screen and (max-width: 768px) {
      section.hundred p {
        font-size: 14px;
        line-height: 1.8; } }
  section.hundred .strong {
    margin: 90px 0 0 0;
    text-align: center; }
    @media screen and (max-width: 768px) {
      section.hundred .strong {
        margin: 40px 0 0 0; } }
    section.hundred .strong .yellow {
      background: url("/qualification/img/employment/emp_backup_bg.gif") repeat-x left bottom;
      display: inline-block;
      font-size: 30px;
      line-height: 1.5;
      letter-spacing: 0.2em;
      margin: 0 auto;
      position: relative; }
      @media screen and (max-width: 768px) {
        section.hundred .strong .yellow {
          font-size: 24px;
          line-height: 1.2;
          letter-spacing: 0.1em;
          margin-top: 10px;
          padding-bottom: 10px; } }
      section.hundred .strong .yellow .side {
        position: absolute;
        width: 115px;
        height: 88px;
        top: -20px;
        right: -130px; }
        @media screen and (max-width: 768px) {
          section.hundred .strong .yellow .side {
            font-size: 18px;
            width: 50px;
            height: 42px;
            right: -25px;
            top: -40px; } }

section.backup {
  width: 100%;
  margin-bottom: 40px; }
  @media screen and (max-width: 768px) {
    section.backup {
      margin-bottom: 25px; } }
  section.backup .bkWrap {
    background: #fff; }
    section.backup .bkWrap.col {
      background: #fff2e6; }
    section.backup .bkWrap .bkInner {
      max-width: 1000px;
      width: 93%;
      margin: 0 auto;
      padding: 50px 0;
      display: flex;
      justify-content: space-between;
      flex-wrap: nowrap; }
      @media screen and (max-width: 768px) {
        section.backup .bkWrap .bkInner {
          display: block;
          padding: 20px 0px; } }
      section.backup .bkWrap .bkInner .bkInnerIn {
        width: 48%; }
        @media screen and (max-width: 768px) {
          section.backup .bkWrap .bkInner .bkInnerIn {
            width: 90%;
            margin: 0 auto; } }
        section.backup .bkWrap .bkInner .bkInnerIn .ttl {
          font-size: 22px;
          font-weight: bold;
          line-height: 1;
          color: #9270ef;
          margin-bottom: 20px; }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn .ttl {
              text-align: center;
              font-size: 18px;
              line-height: 1.6;
              margin-bottom: 10px; } }
          section.backup .bkWrap .bkInner .bkInnerIn .ttl span {
            display: inline-block;
            margin-right: 10px;
            width: 48px;
            height: 48px;
            font-size: 20px;
            font-weight: bold;
            color: #fff;
            border-radius: 10px;
            background: #9270ef;
            text-align: center;
            line-height: 48px; }
            @media screen and (max-width: 768px) {
              section.backup .bkWrap .bkInner .bkInnerIn .ttl span {
                display: block;
                width: 35px;
                height: 35px;
                margin: 0 auto 2px auto;
                font-size: 14px;
                border-radius: 7px;
                line-height: 35px; } }
        section.backup .bkWrap .bkInner .bkInnerIn .ttlB {
          font-size: 22px;
          font-weight: bold;
          line-height: 1.2;
          color: #9270ef;
          margin: -70px 0 0 60px;
          padding-bottom: 20px; }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn .ttlB {
              text-align: center;
              margin: 0;
              font-size: 18px;
              line-height: 1.6;
              margin-bottom: -10px; } }
        section.backup .bkWrap .bkInner .bkInnerIn p {
          font-size: 16px;
          line-height: 1.8;
          margin-bottom: 5px; }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn p {
              font-size: 14px; } }
        @media screen and (max-width: 768px) {
          section.backup .bkWrap .bkInner .bkInnerIn img {
            text-align: center;
            width: 80%;
            margin: 10px 10% 0; } }
        section.backup .bkWrap .bkInner .bkInnerIn .msgBtn {
          display: flex;
          justify-content: center;
          align-items: center;
          width: 140px;
          margin: 10px auto 6px;
          padding: 8px 0;
          border: 2px solid #191919;
          border-radius: 30px;
          font-size: 12px; }
          section.backup .bkWrap .bkInner .bkInnerIn .msgBtn::after {
            content: '';
            width: 8px;
            height: 8px;
            margin-left: 10px;
            border-right: 2px solid #191919;
            border-bottom: 2px solid #191919;
            transform: rotate(45deg); }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn .msgBtn ~ div {
              display: none; } }
        section.backup .bkWrap .bkInner .bkInnerIn dl dt {
          font-size: 18px;
          font-weight: bold;
          line-height: 2;
          margin-bottom: 3px; }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn dl dt {
              font-size: 16px; } }
          section.backup .bkWrap .bkInner .bkInnerIn dl dt::before {
            content: '●';
            font-size: 15px;
            color: #9270ef;
            padding-right: 5px; }
            @media screen and (max-width: 768px) {
              section.backup .bkWrap .bkInner .bkInnerIn dl dt::before {
                font-size: 12px; } }
        section.backup .bkWrap .bkInner .bkInnerIn dl dd {
          font-size: 16px;
          line-height: 1.8;
          margin-bottom: 18px; }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn dl dd {
              font-size: 14px;
              margin-bottom: 10px; } }
        section.backup .bkWrap .bkInner .bkInnerIn .linkBtn {
          margin-top: 15px; }
          @media screen and (max-width: 768px) {
            section.backup .bkWrap .bkInner .bkInnerIn .linkBtn {
              text-align: center;
              margin: 15px auto 10px; } }
          section.backup .bkWrap .bkInner .bkInnerIn .linkBtn a {
            background: #191919;
            color: #fff;
            font-weight: bold;
            letter-spacing: 0.15em;
            border-radius: 5px;
            padding: 10px 34px;
            display: inline-block; }

section.elder {
  padding: 100px 0;
  margin: 0 0 90px 0;
  background: url("/entrance/img/society/society_bg.gif") repeat left top; }
  @media screen and (max-width: 768px) {
    section.elder {
      padding: 40px 0 20px 0;
      margin: 0 0 40px 0; } }
  section.elder .inner {
    max-width: 1000px;
    width: 93%;
    margin: 0 auto; }
    section.elder .inner .topMsg {
      max-width: 600px;
      width: 93%;
      margin: 0 auto;
      font-size: 18px;
      line-height: 2.2;
      margin-bottom: 60px; }
      @media screen and (max-width: 768px) {
        section.elder .inner .topMsg {
          font-size: 14px;
          line-height: 1.8;
          margin: 20px 10px; } }
    section.elder .inner .elderBox {
      max-width: 1000px;
      width: 93%;
      margin: 0 auto 60px;
      padding: 0;
      border-radius: 10px;
      display: flex;
      justify-content: space-between;
      flex-wrap: nowrap; }
      @media screen and (max-width: 768px) {
        section.elder .inner .elderBox {
          display: block;
          margin: 10px auto 10px;
          padding: 0px; } }
      section.elder .inner .elderBox .elderPic {
        width: 374px; }
        @media screen and (max-width: 768px) {
          section.elder .inner .elderBox .elderPic {
            width: 60%;
            margin: 0 auto; } }
        @media screen and (max-width: 768px) {
          section.elder .inner .elderBox .elderPic.mg2 {
            margin-top: 40px; } }
      section.elder .inner .elderBox .elderTxt {
        width: 516px; }
        @media screen and (max-width: 768px) {
          section.elder .inner .elderBox .elderTxt {
            width: 100%;
            margin: 0 auto; } }
        @media screen and (max-width: 768px) {
          section.elder .inner .elderBox .elderTxt dl dt {
            text-align: center; } }
        section.elder .inner .elderBox .elderTxt dl dt .ttl {
          font-size: 22px;
          font-weight: bold;
          margin-bottom: 30px; }
          @media screen and (max-width: 768px) {
            section.elder .inner .elderBox .elderTxt dl dt .ttl {
              font-size: 18px;
              margin: 5px 0 10px 0; } }
        section.elder .inner .elderBox .elderTxt dl dt .name {
          font-size: 15px;
          font-weight: bold;
          line-height: 1.6;
          margin-bottom: 25px; }
          @media screen and (max-width: 768px) {
            section.elder .inner .elderBox .elderTxt dl dt .name {
              font-size: 14px;
              margin-bottom: 5px; } }
          section.elder .inner .elderBox .elderTxt dl dt .name span {
            font-size: 18px;
            font-weight: bold; }
            @media screen and (max-width: 768px) {
              section.elder .inner .elderBox .elderTxt dl dt .name span {
                font-size: 16px; } }
        section.elder .inner .elderBox .elderTxt dl dd {
          font-size: 16px;
          line-height: 1.9; }
          @media screen and (max-width: 768px) {
            section.elder .inner .elderBox .elderTxt dl dd.dsh {
              padding-bottom: 30px;
              margin-bottom: 5px;
              border-bottom: dashed #666 1px; } }
          @media screen and (max-width: 768px) {
            section.elder .inner .elderBox .elderTxt dl dd {
              font-size: 14px;
              line-height: 1.8; } }

.mdlTgl {
  display: flex;
  margin: 0 auto; }
  .mdlTgl p {
    background: #191919;
    color: #fff;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 300px;
    height: 50px;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .mdlTgl p {
        margin-bottom: 40px; } }

.mdlWrap {
  width: 100%;
  height: 100%;
  padding: 170px 5% 5vh;
  background-color: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9; }
  @media screen and (max-width: 768px) {
    .mdlWrap {
      padding: 180px 5% 5vh; } }
  .mdlWrap .mdlCls {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 110px;
    right: calc(50% - 600px);
    cursor: pointer; }
    @media screen and (max-width: 1333px) {
      .mdlWrap .mdlCls {
        right: 5%; } }
    @media screen and (max-width: 768px) {
      .mdlWrap .mdlCls {
        top: 130px;
        right: 20px; } }
    .mdlWrap .mdlCls::before, .mdlWrap .mdlCls::after {
      content: '';
      width: 40px;
      height: 3px;
      background-color: #fff;
      position: absolute;
      top: 50%;
      left: 50%; }
    .mdlWrap .mdlCls::before {
      transform: translate(-50%, -50%) rotate(-45deg); }
    .mdlWrap .mdlCls::after {
      transform: translate(-50%, -50%) rotate(45deg); }
  .mdlWrap .mdlBox {
    max-width: 1200px;
    width: 100%;
    max-height: 700px;
    height: 100%;
    overflow-y: scroll;
    margin: 0 auto;
    padding: 5%;
    border-radius: 10px;
    background-color: #fff; }
    @media screen and (max-width: 768px) {
      .mdlWrap .mdlBox {
        max-width: 600px; } }

section.result {
  max-width: 1000px;
  width: 93%;
  margin: 0 auto 120px;
  padding: 70px 30px;
  background: #fff;
  border-radius: 10px; }
  @media screen and (max-width: 768px) {
    section.result {
      margin: 0 auto 30px;
      padding: 40px 20px; } }
  section.result .actBox {
    max-width: 800px;
    margin: 50px auto 0;
    display: flex;
    flex-direction: column;
    align-items: center; }
    @media screen and (max-width: 768px) {
      section.result .actBox {
        margin: 30px auto 0; } }
    section.result .actBox h3 {
      display: inline-block;
      font-size: 18px;
      font-weight: bold;
      text-align: center;
      padding: 8px 25px;
      border-radius: 30px;
      border: 1px solid #000; }
      @media screen and (max-width: 768px) {
        section.result .actBox h3 {
          font-size: 16px; } }
      section.result .actBox h3#hospital {
        position: relative; }
        section.result .actBox h3#hospital .icon {
          position: absolute;
          top: -15px;
          right: -80px;
          width: 51px;
          height: 57px; }
          @media screen and (max-width: 768px) {
            section.result .actBox h3#hospital .icon {
              width: 30px;
              height: 33px;
              right: -36px;
              top: 5px; } }
      section.result .actBox h3#salon {
        position: relative; }
        section.result .actBox h3#salon .icon {
          position: absolute;
          top: 0px;
          left: -80px;
          width: 54px;
          height: 44px; }
          @media screen and (max-width: 768px) {
            section.result .actBox h3#salon .icon {
              width: 30px;
              height: 28px;
              left: -34px;
              top: 10px; } }
      section.result .actBox h3#other {
        position: relative; }
        section.result .actBox h3#other .icon {
          position: absolute;
          top: 0px;
          right: -100px;
          width: 72px;
          height: 38px; }
          @media screen and (max-width: 768px) {
            section.result .actBox h3#other .icon {
              width: 50px;
              height: 33px;
              right: -56px;
              top: 8px; } }
    section.result .actBox .actIn {
      font-size: 16px;
      line-height: 2.2;
      margin-top: 20px; }
      @media screen and (max-width: 768px) {
        section.result .actBox .actIn {
          font-size: 14px;
          line-height: 2; } }

section.system {
  max-width: 1000px;
  width: 93%;
  margin: 100px auto;
  padding: 30px 60px;
  background: #fff;
  border-radius: 10px;
  border: 5px solid #191919;
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap; }
  @media screen and (max-width: 768px) {
    section.system {
      border: 3px solid #191919;
      display: block;
      margin: 0px auto 50px;
      padding: 20px; } }
  section.system .systemTxt {
    width: 630px;
    text-align: left; }
    @media screen and (max-width: 768px) {
      section.system .systemTxt {
        width: 100%;
        text-align: center; } }
    section.system .systemTxt .ttl {
      display: inline-block;
      margin: 10px 0 20px;
      font-size: 24px;
      line-height: 1.5;
      font-weight: bold;
      text-align: left;
      letter-spacing: 0.1em;
      background: url("/qualification/img/employment/emp_system_bg.gif") repeat-x left bottom; }
      @media screen and (max-width: 768px) {
        section.system .systemTxt .ttl {
          font-size: 20px; } }
    section.system .systemTxt .explanation {
      font-size: 16px;
      line-height: 1.8; }
      @media screen and (max-width: 768px) {
        section.system .systemTxt .explanation {
          font-size: 14px;
          text-align: left; } }
  section.system .systemPic {
    width: 180px; }
    @media screen and (max-width: 768px) {
      section.system .systemPic {
        width: 30%;
        text-align: center;
        margin: 0 auto; } }