/*==================================================================== unique
*/
.buttonArea .inr ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }
  .buttonArea .inr ul li {
    width: 32%; }
    @media only screen and (max-width: 768px) {
      .buttonArea .inr ul li {
        width: 49%; } }
    .buttonArea .inr ul li a {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      background-color: #6190B8;
      color: #fff;
      text-align: center;
      position: relative; }
      .buttonArea .inr ul li a::before {
        content: '';
        display: inline-block;
        width: 0;
        height: 0;
        border: 35px solid transparent;
        border-top: 35px solid rgba(255, 255, 255, 0.2);
        border-left: 35px solid rgba(255, 255, 255, 0.2);
        position: absolute;
        right: 0;
        bottom: 0;
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg); }
      .buttonArea .inr ul li a::after {
        content: '';
        display: inline-block;
        width: 0;
        height: 0;
        border: 10px solid transparent;
        border-top: 10px solid #fff;
        border-left: 10px solid #fff;
        position: absolute;
        right: 10px;
        bottom: 10px;
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg); }
      .buttonArea .inr ul li a:hover::after {
        border: 35px solid transparent;
        border-top: 35px solid #fff;
        border-left: 35px solid #fff;
        position: absolute;
        right: 1px;
        bottom: 1px; }
      .buttonArea .inr ul li a p {
        padding: 30px 0;
        font-size: 1.15em;
        font-weight: bold;
        letter-spacing: .2em;
        width: 99%;
        margin: 0 auto; }
        .buttonArea .inr ul li a p span {
          display: block;
          font-size: .6em;
          font-weight: normal;
          letter-spacing: .1em; }
    @media only screen and (max-width: 768px) {
      .buttonArea .inr ul li:last-child {
        width: 100%;
        margin-top: 10px; } }

.intro .inr .head01 {
  text-align: center;
  color: #6190B8; }

.intro .inr > p {
  text-align: center; }
  @media only screen and (max-width: 768px) {
    .intro .inr > p {
      text-align: left; } }

.intro .inr .note {
  text-align: left; }

.intro ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 40px; }
  @media only screen and (max-width: 768px) {
    .intro ul {
      margin-top: 10px; } }
  .intro ul li {
    width: 49%;
    border: 1px solid;
    margin-top: 20px;
    overflow: hidden; }
    @media only screen and (max-width: 768px) {
      .intro ul li {
        margin-top: 10px;
        width: 100%; } }
    .intro ul li h4 {
      font-size: 1.2em;
      padding: 5px 0;
      text-align: center;
      color: #fff;
      letter-spacing: .1em; }
    .intro ul li .occupation {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      height: 100%; }
      .intro ul li .occupation .pic {
        width: 50%; }
      .intro ul li .occupation .txt {
        width: 50%;
        padding: 30px 0; }
        .intro ul li .occupation .txt .txtInr {
          width: 90%;
          margin: 0 auto;
          font-size: .9em; }
    .intro ul li:first-child {
      border-color: #D06C49; }
      .intro ul li:first-child h4 {
        background-color: #D06C49; }
      .intro ul li:first-child .pic {
        background: url(../images/occupation01.jpg) no-repeat 50% 50%/cover; }
    .intro ul li:nth-child(2) {
      border-color: #C6A4C6; }
      .intro ul li:nth-child(2) h4 {
        background-color: #C6A4C6; }
      .intro ul li:nth-child(2) .pic {
        background: url(../images/occupation02.jpg) no-repeat 50% 50%/cover; }
    .intro ul li:nth-child(3) {
      border-color: #6190B8; }
      .intro ul li:nth-child(3) h4 {
        background-color: #6190B8; }
      .intro ul li:nth-child(3) .pic {
        background: url(../images/occupation03.jpg) no-repeat 50% 50%/cover; }
    .intro ul li:nth-child(4) {
      border-color: #8CB9CF; }
      .intro ul li:nth-child(4) h4 {
        background-color: #8CB9CF; }
      .intro ul li:nth-child(4) .pic {
        background: url(../images/occupation04.jpg) no-repeat 50% 50%/cover; }
    .intro ul li:nth-child(5) {
      width: 32%;
      border-color: #8CBC92; }
      @media only screen and (max-width: 768px) {
        .intro ul li:nth-child(5) {
          width: 100%; } }
      .intro ul li:nth-child(5) h4 {
        background-color: #8CBC92; }
      .intro ul li:nth-child(5) .txt {
        width: 100%; }
    .intro ul li:nth-child(6) {
      width: 32%;
      border-color: #F3994F; }
      @media only screen and (max-width: 768px) {
        .intro ul li:nth-child(6) {
          width: 100%; } }
      .intro ul li:nth-child(6) h4 {
        background-color: #F3994F; }
      .intro ul li:nth-child(6) .txt {
        width: 100%; }
    .intro ul li:last-child {
      width: 32%;
      border-color: #E1C950; }
      @media only screen and (max-width: 768px) {
        .intro ul li:last-child {
          width: 100%; } }
      .intro ul li:last-child h4 {
        background-color: #E1C950; }
      .intro ul li:last-child .txt {
        width: 100%; }

.flow {
  background-color: rgba(230, 170, 19, 0.1); }
  .flow .inr .head01 {
    text-align: center;
    color: #6190B8; }
  .flow .inr ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 60px; }
    @media only screen and (max-width: 768px) {
      .flow .inr ul {
        margin-top: 0; } }
    .flow .inr ul li {
      width: 22%;
      background-color: #fff;
      text-align: center;
      color: #6190B8;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      font-weight: bold;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      padding: 40px 5px;
      position: relative;
      font-size: 1.1em; }
      @media only screen and (max-width: 768px) {
        .flow .inr ul li {
          width: 100%;
          margin-top: 30px; } }
      .flow .inr ul li::before {
        content: '';
        display: inline-block;
        width: 0;
        height: 0;
        border: 40px solid transparent;
        border-right: 20px solid #6190B8;
        position: absolute;
        right: -28%;
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg); }
        @media only screen and (max-width: 1280px) {
          .flow .inr ul li::before {
            right: -33%; } }
        @media only screen and (max-width: 980px) {
          .flow .inr ul li::before {
            right: -38%; } }
        @media only screen and (max-width: 768px) {
          .flow .inr ul li::before {
            right: 0;
            left: 0;
            bottom: -60px;
            margin: auto;
            border-right: 40px solid transparent;
            border-bottom: 10px solid #6190B8; } }
      .flow .inr ul li span {
        display: block;
        font-size: .7em;
        line-height: 1.2em; }
      .flow .inr ul li:last-child {
        background-color: #6190B8 !important;
        color: #fff !important;
        padding: 10px !important;
        font-size: 1.4em; }
        .flow .inr ul li:last-child::before {
          display: none; }
        .flow .inr ul li:last-child .border {
          border: 1px solid #fff;
          padding: 30px 5px;
          display: block;
          width: 100%;
          height: 100%;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -ms-flex-direction: column;
          flex-direction: column;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          font-weight: bold;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center; }

.requirements .inr .head01 {
  text-align: center;
  color: #6190B8; }

.requirements .inr table {
  width: 100%;
  margin-top: 60px;
  border: 2px solid rgba(97, 144, 184, 0.2); }
  @media only screen and (max-width: 768px) {
    .requirements .inr table {
      margin-top: 20px; } }
  .requirements .inr table thead th {
    padding: 5px 0;
    background-color: rgba(97, 144, 184, 0.2);
    border: none; }
  .requirements .inr table tbody th {
    padding: 5px 0;
    text-align: center;
    color: #6190B8;
    border-bottom: 1px solid rgba(97, 144, 184, 0.2);
    border-top: none;
    border-right: none;
    border-left: none;
    background-color: rgba(230, 170, 19, 0.1);
    letter-spacing: .2em;
    width: 20%; }
    @media only screen and (max-width: 768px) {
      .requirements .inr table tbody th {
        display: block;
        width: 100%;
        border-bottom: none;
        border-right: 2px solid rgba(97, 144, 184, 0.2);
        text-align: left;
        padding: 5px 20px; } }
  .requirements .inr table tbody td {
    padding: 5px 20px;
    border-bottom: 1px solid rgba(97, 144, 184, 0.2);
    border-top: none;
    border-right: none;
    border-left: none;
    width: 80%; }
    @media only screen and (max-width: 768px) {
      .requirements .inr table tbody td {
        display: block;
        width: 100%;
        border-bottom: none;
        border-right: 2px solid rgba(97, 144, 184, 0.2); } }
    .requirements .inr table tbody td span {
      color: rgba(97, 144, 184, 0.2);
      margin-left: 10px; }
      .requirements .inr table tbody td span:first-child {
        margin-left: 0; }
