@charset "UTF-8";
/* padding */
.pt_s {
  padding-top: 2%; }
  @media screen and (min-width: 768px) {
    .pt_s {
      padding-top: 10px; } }

.pt {
  padding-top: 4%; }
  @media screen and (min-width: 768px) {
    .pt {
      padding-top: 30px; } }

.pt_l {
  padding-top: 6%; }
  @media screen and (min-width: 768px) {
    .pt_l {
      padding-top: 50px; } }

.pb_s {
  padding-bottom: 2%; }
  @media screen and (min-width: 768px) {
    .pb_s {
      padding-bottom: 10px; } }

.pb {
  padding-bottom: 4%; }
  @media screen and (min-width: 768px) {
    .pb {
      padding-bottom: 30px; } }

.pb_l {
  padding-bottom: 6%; }
  @media screen and (min-width: 768px) {
    .pb_l {
      padding-bottom: 50px; } }

/* margin */
.mt_s {
  margin-top: 2%; }
  @media screen and (min-width: 768px) {
    .mt_s {
      margin-top: 10px; } }

.mt {
  margin-top: 4%; }
  @media screen and (min-width: 768px) {
    .mt {
      margin-top: 30px; } }

.mt_l {
  margin-top: 6%; }
  @media screen and (min-width: 768px) {
    .mt_l {
      margin-top: 50px; } }

.mb_s {
  margin-bottom: 2%; }
  @media screen and (min-width: 768px) {
    .mb_s {
      margin-bottom: 10px; } }

.mb {
  margin-bottom: 4%; }
  @media screen and (min-width: 768px) {
    .mb {
      margin-bottom: 30px; } }

.mb_l {
  margin-bottom: 6%; }
  @media screen and (min-width: 768px) {
    .mb_l {
      margin-bottom: 50px; } }

/* font-size */
.fsize_xxl {
  font-size: 22px;
  font-size: 2.2rem; }
  @media screen and (min-width: 768px) {
    .fsize_xxl {
      font-size: 32px;
      font-size: 3.2rem; } }

.fsize_xl {
  font-size: 20px;
  font-size: 2rem; }
  @media screen and (min-width: 768px) {
    .fsize_xl {
      font-size: 24px;
      font-size: 2.4rem; } }

.fsize_l {
  font-size: 16px;
  font-size: 1.6rem; }
  @media screen and (min-width: 768px) {
    .fsize_l {
      font-size: 20px;
      font-size: 2rem; } }

.fsize {
  font-size: 14px;
  font-size: 1.4rem; }
  @media screen and (min-width: 768px) {
    .fsize {
      font-size: 16px;
      font-size: 1.6rem; } }

.fsize_s {
  font-size: 12px;
  font-size: 1.2rem; }
  @media screen and (min-width: 768px) {
    .fsize_s {
      font-size: 14px;
      font-size: 1.4rem; } }

.fsize_xs {
  font-size: 10px;
  font-size: 1rem; }
  @media screen and (min-width: 768px) {
    .fsize_xs {
      font-size: 12px;
      font-size: 1.2rem; } }

/************************************************************************************


about


**************************************************************************************/
@media (max-width: 767px) {
  #page_about .headline4 {
    display: grid;
    grid-template-columns: 5vw auto 5vw;
    grid-gap: 5px 15px;
    align-items: center;
    justify-content: center;
    place-content: center; } }

.reason__item,
.teacher__item,
.faq__item {
  margin-top: 10px; }
  .reason__items,
  .teacher__items,
  .faq__items {
    margin-top: 40px; }
    @media (max-width: 767px) {
      .reason__items,
      .teacher__items,
      .faq__items {
        margin-top: 30px; } }
  .reason__item-title,
  .teacher__item-title,
  .faq__item-title {
    cursor: pointer;
    font-weight: 700;
    padding: 0 80px 0 30px; }
    .reason__item-titles,
    .teacher__item-titles,
    .faq__item-titles {
      display: grid;
      grid-template-columns: 60px auto;
      align-items: center;
      position: relative; }
      @media (max-width: 767px) {
        .reason__item-titles,
        .teacher__item-titles,
        .faq__item-titles {
          align-items: flex-start; } }
      .reason__item-titles:before, .reason__item-titles:after,
      .teacher__item-titles:before,
      .teacher__item-titles:after,
      .faq__item-titles:before,
      .faq__item-titles:after {
        top: 0;
        bottom: 0;
        margin: auto;
        content: "";
        position: absolute;
        transition: all 0.3s ease-out; }
      .reason__item-titles:before,
      .teacher__item-titles:before,
      .faq__item-titles:before {
        width: 20px;
        height: 2px;
        right: 31px; }
        @media (max-width: 767px) {
          .reason__item-titles:before,
          .teacher__item-titles:before,
          .faq__item-titles:before {
            width: 3vw;
            right: 6vw; } }
      .reason__item-titles:after,
      .teacher__item-titles:after,
      .faq__item-titles:after {
        width: 2px;
        height: 20px;
        right: 40px; }
        @media (max-width: 767px) {
          .reason__item-titles:after,
          .teacher__item-titles:after,
          .faq__item-titles:after {
            height: 3vw;
            right: 7vw; } }
      .reason__item-titles.active,
      .teacher__item-titles.active,
      .faq__item-titles.active {
        transition: background-color 0.5s 0s ease, color 0.5s 0s ease; }
        .reason__item-titles.active:after,
        .teacher__item-titles.active:after,
        .faq__item-titles.active:after {
          transform: rotate(90deg); }
    @media (max-width: 767px) {
      .reason__item-title,
      .teacher__item-title,
      .faq__item-title {
        font-size: 1.4rem;
        padding: 15px 12vw 15px 0vw;
        line-height: 1.3; } }
    .reason__item-title-icon,
    .teacher__item-title-icon,
    .faq__item-title-icon {
      color: white;
      font-size: 28px;
      width: 60px;
      height: 60px;
      align-items: center;
      justify-content: center;
      display: flex;
      flex-wrap: wrap;
      font-weight: 700; }
      @media (max-width: 767px) {
        .reason__item-title-icon,
        .teacher__item-title-icon,
        .faq__item-title-icon {
          width: 10vw;
          height: 10vw;
          font-size: 1.6rem; } }
  .reason__item-text,
  .teacher__item-text,
  .faq__item-text {
    padding: 30px 50px 50px 120px;
    position: relative;
    display: none; }
    .reason__item-text-icon,
    .teacher__item-text-icon,
    .faq__item-text-icon {
      color: white;
      font-size: 28px;
      width: 60px;
      height: 60px;
      align-items: center;
      justify-content: center;
      display: flex;
      flex-wrap: wrap;
      font-weight: 700;
      top: 30px;
      left: 30px;
      position: absolute; }
      @media (max-width: 767px) {
        .reason__item-text-icon,
        .teacher__item-text-icon,
        .faq__item-text-icon {
          width: 10vw;
          height: 10vw;
          font-size: 1.6rem; } }
    @media (max-width: 767px) {
      .reason__item-text p,
      .teacher__item-text p,
      .faq__item-text p {
        font-size: 1.3rem; } }
    .reason__item-text p + *,
    .teacher__item-text p + *,
    .faq__item-text p + * {
      margin-top: 20px; }
      @media (max-width: 767px) {
        .reason__item-text p + *,
        .teacher__item-text p + *,
        .faq__item-text p + * {
          margin-top: 15px; } }

/************************************************************************************


日本語教師とはどんな仕事？


**************************************************************************************/
.work__photo {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .work__photo {
      margin-top: 0; } }
.work__title {
  background-color: #5fb52f;
  color: white;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  padding: 5px 0; }
  @media (max-width: 767px) {
    .work__title {
      font-size: 1.5rem;
      padding: 15px;
      text-align: left; } }
main .work__subtitle {
  margin: 30px 0; }
  main .work__subtitle p {
    font-weight: 700;
    text-align: center;
    font-size: 20px; }
    @media (max-width: 767px) {
      main .work__subtitle p {
        font-size: 1.4rem;
        text-align: left; } }
.work__list {
  background-color: #EDF2E2;
  border: 1px solid #5FB52F;
  padding: 30px; }
  @media print, screen and (min-width: 1040px) {
    .work__list {
      margin: 0 205px; } }
  .work__list li {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .05em;
    padding-left: 15px;
    position: relative; }
    @media (max-width: 767px) {
      .work__list li {
        font-size: 1.3rem; } }
    .work__list li:before {
      content: "";
      display: block;
      position: absolute;
      width: 5px;
      height: 5px;
      border-radius: 5px;
      background-color: #333333;
      left: 0;
      top: 11px; }
.work__text {
  margin-top: 30px; }
  @media print, screen and (min-width: 1040px) {
    .work__text {
      text-align: center; } }
@media print, screen and (min-width: 1040px) {
  .work .bottom_cont {
    text-align: center; } }
.work .bottom_cont a {
  color: #5FB52F;
  text-decoration: underline; }

/************************************************************************************


目次


**************************************************************************************/
@media (max-width: 767px) {
  .toc {
    margin: 6% 0 8% 0; } }
.toc__item {
  border-bottom: 1px solid #cfd4cd; }
  .toc__items {
    padding: 1.5em;
    font-size: 1.5rem;
    background: #edf2e2;
    border: 1px solid #5fb52f;
    display: none; }
    @media (max-width: 767px) {
      .toc__items {
        padding: 1em;
        font-size: 1.3rem; } }
    .toc__items-title {
      background: #5fb52f;
      color: #fff;
      font-weight: bold;
      letter-spacing: 0.5em;
      text-align: center;
      padding: 0 15px;
      padding: 10px;
      font-size: 20px;
      font-size: 2.0rem;
      height: 50px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      cursor: pointer; }
      @media (max-width: 767px) {
        .toc__items-title {
          font-size: 1.6rem;
          padding: 6px 15px 3px; } }
      .toc__items-title:after {
        content: "";
        display: block;
        position: absolute;
        margin: auto;
        background-color: #000;
        width: 50px;
        height: 50px;
        transform: translate(0, -50%);
        top: 50%;
        right: 0; }
      .toc__items-title-wrapper {
        position: relative; }
      .toc__items-title-wrapper.active .toc__items-title-toggle-icon {
        background: transparent; }
        .toc__items-title-wrapper.active .toc__items-title-toggle-icon:before {
          transform: translateY(-50%) rotate(-45deg);
          top: 50%; }
        .toc__items-title-wrapper.active .toc__items-title-toggle-icon:after {
          transform: translateY(-50%) rotate(45deg);
          top: 50%;
          bottom: auto; }
      .toc__items-title-toggle {
        position: absolute;
        width: 30px;
        height: 40px;
        transform: translate(0, -50%);
        top: 50%;
        right: 10px;
        cursor: pointer; }
        .toc__items-title-toggle-icon {
          display: inline-block;
          transition: all .4s;
          position: absolute;
          height: 3px;
          background: #fff;
          width: 20px;
          transform: translate(-50%, -50%);
          top: 50%;
          left: 50%; }
          .toc__items-title-toggle-icon:before, .toc__items-title-toggle-icon:after {
            content: "";
            display: block;
            position: absolute;
            margin: auto;
            width: 100%;
            height: 2px;
            background: #fff;
            transition: all .4s; }
          .toc__items-title-toggle-icon:before {
            top: -7px; }
          .toc__items-title-toggle-icon:after {
            bottom: -7px; }
  .toc__item:last-child {
    border-bottom: none; }
  .toc__item a {
    text-indent: -1em;
    display: block;
    padding: 10px 1em 8px;
    font-weight: 500; }
    .toc__item a:before {
      content: '・';
      left: 1em; }

/************************************************************************************


日本語教師の仕事内容


**************************************************************************************/
@media (max-width: 767px) {
  .description {
    padding-top: 0 !important; } }
.description__item {
  position: relative; }
  .description__items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 10px;
    margin-top: 50px; }
    @media (max-width: 767px) {
      .description__items {
        margin-top: 30px;
        grid-template-columns: repeat(1, 1fr); } }
  .description__item + *:before {
    content: "";
    display: block;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    background-image: url(../images/about/icon_plus01.svg);
    width: 50px;
    height: 50px;
    transform: translate(0, -50%);
    top: 50%;
    left: -30px;
    z-index: 9; }
    @media (max-width: 767px) {
      .description__item + *:before {
        transform: translate(-50%, 0);
        top: -35px;
        left: 50%;
        width: 30px;
        height: 30px; } }
  @media (max-width: 767px) {
    .description__item + * {
      margin-top: 30px; } }
  .description__item-list {
    background: #FDFCE8;
    padding: 15px 25px;
    min-height: 200px;
    box-sizing: border-box; }
    .description__item-list-title {
      color: white;
      font-weight: 700;
      text-align: center;
      background-color: #5FB52F;
      padding: 10px 15px;
      min-height: 70px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
      box-sizing: border-box;
      line-height: 1.4; }
      @media (max-width: 767px) {
        .description__item-list-title {
          min-height: auto; } }
    @media (max-width: 767px) {
      .description__item-list {
        min-height: auto;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 0 30px; } }
    .description__item-list li {
      position: relative;
      padding-left: 15px;
      line-height: 1.7; }
      @media (max-width: 767px) {
        .description__item-list li {
          font-size: 1.3rem; } }
      .description__item-list li:before {
        content: "";
        display: block;
        position: absolute;
        width: 5px;
        height: 5px;
        border-radius: 5px;
        background-color: #333333;
        left: 0;
        top: 11px; }
  .description__item:last-child .description__item-list {
    background-color: #EDF6F8; }
  .description__item:last-child .description__item-list-title {
    background-color: #47A8BD; }
.description__text {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .description__text {
      margin-top: 30px; } }
  .description__text p + * {
    margin-top: 20px; }
    @media (max-width: 767px) {
      .description__text p + * {
        margin-top: 15px; } }

/************************************************************************************


日本語教師の就職先例


**************************************************************************************/
body #page_about section.location .recruit__item {
  width: 64%; }
  body #page_about section.location .recruit__items {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between; }
    @media (max-width: 767px) {
      body #page_about section.location .recruit__items {
        display: block; } }
  @media (max-width: 767px) {
    body #page_about section.location .recruit__item {
      width: auto; } }
  body #page_about section.location .recruit__item + * {
    width: 32%; }
    @media (max-width: 767px) {
      body #page_about section.location .recruit__item + * {
        width: auto; } }
  body #page_about section.location .recruit__item dd {
    padding: 25px 30px; }
    @media (max-width: 767px) {
      body #page_about section.location .recruit__item dd {
        padding: 15px 30px; } }
body #page_about section.location .recruit__item-list li {
  position: relative;
  text-align: left;
  padding-left: 20px;
  padding-top: 5px;
  font-size: 15px;
  line-height: 1.4;
  margin-top: 5px; }
  @media (max-width: 767px) {
    body #page_about section.location .recruit__item-list li {
      font-size: 1.3rem; } }
  body #page_about section.location .recruit__item-list li:before {
    content: "";
    display: block;
    position: absolute;
    width: 15px;
    height: 15px;
    border-radius: 15px;
    background-color: #333333;
    left: 0;
    top: 8px; }
body #page_about section.location .recruit__item-list-etc {
  margin-top: 15px;
  position: relative;
  left: -20px; }
body #page_about section.location .recruit__item-domestic {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0 10px; }
  @media (max-width: 767px) {
    body #page_about section.location .recruit__item-domestic {
      grid-template-columns: repeat(1, 1fr); } }
.recruit__text {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .recruit__text {
      margin-top: 30px; } }
  .recruit__text p + * {
    margin-top: 20px; }
    @media (max-width: 767px) {
      .recruit__text p + * {
        margin-top: 15px; } }

/************************************************************************************


日本語教師の年齢層や性別


**************************************************************************************/
.age-sex__img {
  border: 1px solid #DEE4D8;
  padding: 20px;
  box-sizing: border-box; }
  .age-sex__imgs {
    display: grid;
    grid-template-columns: 435px 435px;
    grid-gap: 0 20px;
    justify-content: center; }
    @media (max-width: 767px) {
      .age-sex__imgs {
        display: block; } }
  @media (max-width: 767px) {
    .age-sex__img {
      padding: 10px; } }
  @media (max-width: 767px) {
    .age-sex__img + * {
      margin-top: 15px; } }
.age-sex__text {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .age-sex__text {
      margin-top: 30px; } }
  .age-sex__text p {
    text-align: left; }
    .age-sex__text p + * {
      margin-top: 20px; }
      @media (max-width: 767px) {
        .age-sex__text p + * {
          margin-top: 15px; } }

/************************************************************************************


日本語教師に向いている人


**************************************************************************************/
.suitable {
  background-color: #FAFADE; }
  .suitable__items {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-gap: 15px; }
    @media (max-width: 767px) {
      .suitable__items {
        grid-template-columns: repeat(2, 1fr); } }
  .suitable__item-text {
    text-align: center;
    font-weight: 700;
    font-size: 14px;
    margin-top: 10px; }
    @media (max-width: 767px) {
      .suitable__item-text {
        text-align: left;
        line-height: 1.5;
        font-size: 1.3rem; } }
    @media (max-width: 767px) {
      .suitable__item-text br {
        display: none; } }
  .suitable__text {
    background-color: white;
    padding: 50px;
    margin-top: 50px; }
    @media (max-width: 767px) {
      .suitable__text {
        padding: 30px;
        margin-top: 30px;
        font-size: 1.3rem; } }

/************************************************************************************


contact


**************************************************************************************/
.contact_link {
  background: url(https://www.rn-ac.jp/images/contact_link.jpg) no-repeat center center;
  background-size: cover; }
  #page_entry .contact_link {
    display: none; }
    #page_entry .contact_link .wrapper_l {
      max-width: 1100px; }
  @media print, screen and (min-width: 1040px) {
    .contact_link .wrapper {
      padding: 0; } }
  .contact_link ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .contact_link ul li {
      width: 48.5%; }
      @media (max-width: 767px) {
        .contact_link ul li {
          width: 100%; } }
      @media (max-width: 767px) {
        .contact_link ul li:first-of-type {
          margin-bottom: 4%; } }
      .contact_link ul li a {
        position: relative;
        width: 100%;
        display: block;
        text-decoration: none;
        text-align: center;
        font-weight: 500;
        padding: 22px 40px 20px;
        letter-spacing: 0.1em;
        background: #ccda00;
        font-size: 14px;
        font-size: 1.4rem;
        transition: 0.4s;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease; }
        @media print, screen and (min-width: 768px) {
          .contact_link ul li a {
            font-size: 16px;
            font-size: 1.6rem; } }
        @media print, screen and (min-width: 1040px) {
          .contact_link ul li a {
            font-size: 18px;
            font-size: 1.8rem; } }
        .contact_link ul li a:hover {
          background: #dfed15; }
        .contact_link ul li a:after {
          content: '';
          display: inline-block;
          background-image: url(https://www.rn-ac.jp/images/linkbtn_arrow.svg);
          background-size: contain;
          vertical-align: middle;
          position: absolute;
          right: 0;
          top: 0;
          width: 50px;
          height: 66px; }
          @media print, screen and (min-width: 768px) {
            .contact_link ul li a:after {
              width: 55px;
              height: 70px; } }
          @media print, screen and (min-width: 1040px) {
            .contact_link ul li a:after {
              width: 56px;
              height: 73px; } }
  .contact_link .bottom_tel {
    background: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 6%;
    color: #5fb52f;
    font-weight: bold; }
    @media print, screen and (min-width: 768px) {
      .contact_link .bottom_tel {
        padding: 35px 40px 30px; } }
    @media print, screen and (min-width: 1040px) {
      .contact_link .bottom_tel {
        padding: 25px 40px 20px; } }
    .contact_link .bottom_tel .left {
      width: 100%;
      display: flex;
      align-items: center; }
      @media (max-width: 767px) {
        .contact_link .bottom_tel .left {
          text-align: center;
          margin: 0 auto;
          display: block; } }
      @media (min-width: 768px) and (max-width: 1040px) {
        .contact_link .bottom_tel .left {
          text-align: center;
          margin: 0 auto;
          display: block; } }
      @media print, screen and (min-width: 1040px) {
        .contact_link .bottom_tel .left {
          border-right: 1px solid #5fb52f;
          width: 58%;
          padding-right: 4%; } }
      .contact_link .bottom_tel .left h4,
      .contact_link .bottom_tel .left h2 {
        line-height: 1.2;
        font-weight: bold;
        font-size: 14px;
        font-size: 1.4rem; }
        @media screen and (min-width: 480px) {
          .contact_link .bottom_tel .left h4,
          .contact_link .bottom_tel .left h2 {
            font-size: 18px;
            font-size: 1.8rem; } }
        @media print, screen and (min-width: 768px) {
          .contact_link .bottom_tel .left h4,
          .contact_link .bottom_tel .left h2 {
            font-size: 20px;
            font-size: 2.0rem; } }
        @media print, screen and (min-width: 1040px) {
          .contact_link .bottom_tel .left h4,
          .contact_link .bottom_tel .left h2 {
            font-size: 22px;
            font-size: 2.2rem; } }
      .contact_link .bottom_tel .left h5 {
        font-weight: bold; }
    .contact_link .bottom_tel .right {
      width: 100%; }
      @media (max-width: 767px) {
        .contact_link .bottom_tel .right {
          text-align: center;
          line-height: 1.2; } }
      @media (min-width: 768px) and (max-width: 1040px) {
        .contact_link .bottom_tel .right {
          text-align: center;
          line-height: 1.2; } }
      @media print, screen and (min-width: 1040px) {
        .contact_link .bottom_tel .right {
          width: 42%;
          padding-left: 6%; } }
      .contact_link .bottom_tel .right a {
        color: #5fb52f;
        font-weight: bold;
        font-size: 32px;
        font-size: 3.2rem; }
        @media screen and (min-width: 480px) {
          .contact_link .bottom_tel .right a {
            font-size: 34px;
            font-size: 3.4rem; } }
        @media print, screen and (min-width: 768px) {
          .contact_link .bottom_tel .right a {
            font-size: 36px;
            font-size: 3.6rem; } }
        @media print, screen and (min-width: 1040px) {
          .contact_link .bottom_tel .right a {
            font-size: 38px;
            font-size: 3.8rem; } }

/************************************************************************************


しかし、日本語教師は不足している...


**************************************************************************************/
.shortage {
  background-color: #EDF2E2; }
  .shortage__sub-title {
    background-color: #B5D100;
    color: white;
    font-weight: 700;
    text-align: center;
    font-size: 20px;
    padding: 5px 10px; }
    @media (max-width: 767px) {
      .shortage__sub-title {
        font-size: 1.4rem; } }
    .shortage__sub-title + * {
      margin-top: 30px; }
      @media (max-width: 767px) {
        .shortage__sub-title + * {
          margin-top: 15px; } }
    * + .shortage__sub-title {
      margin-top: 50px; }
      @media (max-width: 767px) {
        * + .shortage__sub-title {
          margin-top: 30px; } }
  .shortage__img {
    margin-top: 50px;
    display: block; }
    @media (max-width: 767px) {
      .shortage__img {
        margin-top: 30px; } }
    .shortage__img + * {
      margin-top: 50px; }
      @media (max-width: 767px) {
        .shortage__img + * {
          margin-top: 30px; } }
  .shortage__text p {
    text-align: left; }
    @media (max-width: 767px) {
      .shortage__text p {
        font-size: 1.3rem; } }
    .shortage__text p + * {
      margin-top: 20px; }
      @media (max-width: 767px) {
        .shortage__text p + * {
          margin-top: 15px; } }
  .shortage__text-small {
    font-size: 14px; }
    @media (max-width: 767px) {
      .shortage__text-small {
        display: grid;
        grid-template-columns: auto auto;
        grid-gap: 15px;
        font-size: 1.2rem; } }
    .shortage__text-small a {
      color: #5fb52f;
      text-decoration: underline;
      position: relative;
      padding-right: 30px;
      display: inline-block; }
      @media (max-width: 767px) {
        .shortage__text-small a {
          padding-right: 40px; } }
      .shortage__text-small a:before, .shortage__text-small a:after {
        content: "";
        display: block;
        position: absolute;
        width: 10px;
        height: 10px;
        border: 1px solid black;
        transform: translate(0, -50%); }
      .shortage__text-small a:before {
        right: 13px;
        top: calc(47% + 3px); }
      .shortage__text-small a:after {
        right: 10px;
        top: 47%;
        background-color: #EDF2E2;
        box-shadow: -1px 1px 0 #EDF2E2; }

/************************************************************************************


日本語教師の魅力とは


**************************************************************************************/
.charm__sub-title {
  text-align: center;
  font-weight: 700;
  font-size: 20px; }
  @media (max-width: 767px) {
    .charm__sub-title {
      font-size: 1.5rem;
      text-align: left; } }
.charm__items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 20px;
  margin-top: 50px; }
  @media (max-width: 767px) {
    .charm__items {
      margin-top: 30px;
      grid-gap: 15px; } }
.charm__item-text {
  text-align: center;
  font-weight: 700;
  margin-top: 10px; }
  @media (max-width: 767px) {
    .charm__item-text {
      text-align: left; } }
.charm__text {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .charm__text {
      margin-top: 30px; } }
  .charm__text p {
    text-align: left; }

/************************************************************************************


日本語教師の将来性


**************************************************************************************/
.future {
  background-color: #FAFADE; }
  .future__sub-title {
    background-color: #5fb52f;
    color: white;
    font-weight: 700;
    text-align: center;
    padding: 5px 0;
    margin-top: 50px; }
    @media (max-width: 767px) {
      .future__sub-title {
        margin-top: 30px; } }
  .future__text {
    margin-top: 50px; }
    @media (max-width: 767px) {
      .future__text {
        margin-top: 30px; } }
    .future__text p {
      text-align: left; }
      @media (max-width: 767px) {
        .future__text p {
          font-size: 1.3rem; } }
      .future__text p + * {
        margin-top: 20px; }
        @media (max-width: 767px) {
          .future__text p + * {
            margin-top: 15px; } }
    .future__text a {
      color: #5FB52F;
      text-decoration: underline; }
  .future__inner {
    background-color: white;
    padding: 50px; }
    @media (max-width: 767px) {
      .future__inner {
        padding: 30px; } }
  .future__img {
    margin-top: 50px;
    display: block; }
    @media (max-width: 767px) {
      .future__img {
        margin-top: 30px; } }

/************************************************************************************


日本語教師になるには？


**************************************************************************************/
@media (max-width: 767px) {
  body #page_about .conditions .route {
    display: block; } }
body #page_about .conditions .route li {
  width: 48.5%; }
  @media (max-width: 767px) {
    body #page_about .conditions .route li {
      width: auto; } }
  @media (max-width: 767px) {
    body #page_about .conditions .route li .outer {
      height: auto !important; } }
.conditions__text {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .conditions__text {
      margin-top: 5px; } }
  @media (max-width: 767px) {
    .conditions__text p {
      font-size: 1.3rem; } }

/************************************************************************************


ルネサンス日本語学院が選ばれる7つの理由


**************************************************************************************/
.reason__title-num {
  font-size: 55px; }
  @media (max-width: 767px) {
    .reason__title-num {
      font-size: 4rem; } }
.reason__title-inner {
  font-size: 45px;
  line-height: 1; }
  @media (max-width: 767px) {
    .reason__title-inner {
      font-size: 3rem;
      width: 100%;
      grid-row: 2 / 3;
      grid-column: 1 / 4; } }
.reason__title-small {
  font-size: 35px; }
  @media (max-width: 767px) {
    .reason__title-small {
      font-size: 2rem; } }
.reason__sub-title {
  font-weight: 700;
  text-align: center;
  color: #5FB52F;
  line-height: 1.3; }
.reason__item-titles {
  background-color: #EDF2E2; }
  .reason__item-titles:before, .reason__item-titles:after {
    background-color: #5FB52F; }
.reason__item-title-icon {
  background-color: #5FB52F; }
.reason__item-text {
  border: 1px solid #EDF2E2;
  padding: 50px; }

/************************************************************************************


実際に日本語教師として働いている方の声


**************************************************************************************/
.teacher__catch {
  font-size: 14px;
  text-align: center;
  margin-top: 30px; }
  @media (max-width: 767px) {
    .teacher__catch {
      text-align: left;
      font-size: 1.3rem; } }
.teacher__inner {
  display: grid;
  grid-template-columns: 285px auto;
  grid-template-rows: 60px auto auto;
  grid-gap: 0;
  margin-top: 30px; }
  @media (max-width: 767px) {
    .teacher__inner {
      margin-top: 15px;
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      grid-template-rows: auto auto auto auto auto auto; } }
.teacher__name {
  background-color: #5fb52f;
  color: white;
  font-weight: 700;
  text-align: center;
  padding: 5px 0;
  margin-top: 20px;
  grid-row: 1 / 2;
  grid-column: 1 / 3; }
  @media (max-width: 767px) {
    .teacher__name {
      grid-column: 1 / 2; } }
.teacher__img {
  grid-row: 1 / 4;
  grid-column: 1 / 2; }
  @media (max-width: 767px) {
    .teacher__img {
      grid-row: 2 / 3;
      grid-column: 1 / 2;
      margin-top: 15px; } }
  .teacher__img img {
    margin-left: 10px;
    width: calc(100% - 50px);
    height: 100%;
    object-fit: contain; }
    @media (max-width: 767px) {
      .teacher__img img {
        width: 38%;
        display: block;
        margin: 0 auto; } }
.teacher__message {
  grid-row: 2 / 3;
  grid-column: 2/ 3;
  margin: 50px 0 20px; }
  @media (max-width: 767px) {
    .teacher__message {
      margin-top: 15px;
      grid-row: 3 / 4;
      grid-column: 1/ 2;
      font-size: 1.3rem; } }
.teacher__btn {
  grid-row: 3 / 4;
  grid-column: 1/ 3;
  text-align: right; }
  @media (max-width: 767px) {
    .teacher__btn {
      grid-row: 4 / 5;
      grid-column: 1/ 2;
      text-align: center; } }
  .teacher__btn a {
    margin-left: auto; }
.teacher__item-titles {
  background-color: #FAFADE; }
  .teacher__item-titles:before, .teacher__item-titles:after {
    background-color: #5FB52F; }
.teacher__item-title-icon {
  background-color: #CFE21B; }
.teacher__item-text {
  border: 1px solid #FAFADE; }
  .teacher__item-text-icon {
    background-color: #5FB52F; }
.teacher a {
  background: #82BF24;
  color: white; }
  .teacher a:hover {
    color: #1a1a1a; }

/************************************************************************************


日本語教師を目指す方のよくある質問


**************************************************************************************/
.faq {
  background-color: #FAFADE; }
  .faq__item-titles {
    background-color: #EDF2E2; }
    .faq__item-titles:before, .faq__item-titles:after {
      background-color: #5FB52F; }
  .faq__item-title-icon {
    background-color: #5FB52F; }
  .faq__item-text {
    border: 1px solid #EDF2E2; }
    .faq__item-text-icon {
      background-color: #CCDA00; }

/************************************************************************************


ルネサンス日本語学院の思い(まとめ)


**************************************************************************************/
.thoughts__text {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .thoughts__text {
      margin-top: 30px; } }
  @media (max-width: 767px) {
    .thoughts__text p {
      font-size: 1.3rem; } }
  .thoughts__text p + * {
    margin-top: 20px; }
    @media (max-width: 767px) {
      .thoughts__text p + * {
        margin-top: 15px; } }
.thoughts__inner {
  background-color: #EDF2E2;
  padding: 50px;
  margin-top: 50px; }
  @media (max-width: 767px) {
    .thoughts__inner {
      margin-top: 30px;
      padding: 30px; } }
.thoughts__sub-title {
  font-size: 18px;
  font-weight: 700;
  text-align: center; }
  @media (max-width: 767px) {
    .thoughts__sub-title {
      font-size: 1.5rem; } }
.thoughts__logo {
  text-align: center;
  margin-top: 20px; }
  @media (max-width: 767px) {
    .thoughts__logo {
      margin: 10px auto 0;
      width: 62%; } }
.thoughts__img {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .thoughts__img {
      margin-top: 30px; } }

.column__items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 30px;
  margin-top: 50px; }
  @media (max-width: 767px) {
    .column__items {
      margin-top: 30px;
      grid-gap: 15px; } }
.column__item-title {
  font-weight: 700;
  margin: 20px 0; }
  @media (max-width: 767px) {
    .column__item-title {
      margin: 10px 0;
      font-size: 1.3rem; } }
@media (max-width: 767px) {
  .column__item-date {
    font-size: 1.3rem; } }
.column__btn {
  margin-top: 50px;
  text-align: center; }
  @media (max-width: 767px) {
    .column__btn {
      margin-top: 30px; } }
  .column__btn a {
    background: #82BF24;
    color: white; }
    .column__btn a:hover {
      color: #1a1a1a; }
