@charset "utf-8";

/*
  Responsive styles for /eria/.
  Load after /sp/css/top2.css and /css/deskstyle-sp-to-pc.css.
*/

.eriaIndex #wrapper {
  background: rgba(255, 255, 255, 0.94);
}

.eriaPage {
  color: #444;
}

.eriaPage .articleTitle {
  margin-bottom: 18px;
}

.eriaPage .eria_wrap {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
}

.eriaPage .marginBottom20,
.eriaPage .marginBottom10,
.eriaPage .moveCenter {
  text-align: center;
}

.eriaPage img {
  max-width: 100%;
  height: auto;
}

.eriaPage .eria_content {
  margin: 0 0 24px;
  padding: 18px 16px;
  border: 3px dotted #6aa56b;
  border-radius: 8px;
  background: #fff;
  line-height: 1.8;
  text-align: center;
}

.eriaPage .eria_content p {
  margin: 0 0 16px;
}

.eriaPage .red {
  color: #e85a4f;
  font-weight: bold;
}

.eriaPage .bg_y {
  background: linear-gradient(transparent 62%, #fff18a 62%);
}

.eriaPage .color_blue {
  color: #239bd2;
  font-weight: bold;
}

.eriaPage .color_green {
  color: #449348;
  font-weight: bold;
}

.eriaPage .maps {
  width: 100%;
  overflow-x: auto;
  margin-top: 10px;
  padding: 8px 0 4px;
  -webkit-overflow-scrolling: touch;
}

.eriaPage .maps img {
  display: block;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
}

.eriaPage .eria_content_02 {
  margin: 0 0 28px;
  padding: 18px 18px 18px 96px;
  min-height: 92px;
  border-radius: 8px;
  background: #fff url("/sp/img/eria/icatchi.png") no-repeat 12px 12px / 78px auto;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  line-height: 1.8;
}

.eriaPage .eria_content_02 p {
  margin: 0;
}

.eriaPage .eria_content_03,
.eriaPage .eria_content_04,
.eriaPage .eria_content_05,
.eriaPage .eria_content_06,
.eriaPage .eria_content_07,
.eriaPage .eria_content_08 {
  position: relative;
  max-width: 720px;
  margin: 0 auto 22px !important;
  padding: 16px;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.eriaPage .eria_content_03,
.eriaPage .eria_content_04,
.eriaPage .eria_content_05,
.eriaPage .eria_content_06,
.eriaPage .eria_content_07,
.eriaPage .eria_content_08 {
  border-top: 5px solid var(--eria-color);
}

.eriaPage #eria_01,
.eriaPage .eria_content_03 {
  --eria-color: #f2a91f;
}

.eriaPage #eria_02,
.eriaPage .eria_content_04 {
  --eria-color: #79b91a;
}

.eriaPage #eria_03,
.eriaPage .eria_content_05 {
  --eria-color: #34aee2;
}

.eriaPage #eria_04,
.eriaPage .eria_content_06 {
  --eria-color: #e989b8;
}

.eriaPage #eria_05,
.eriaPage .eria_content_07 {
  --eria-color: #22a63b;
}

.eriaPage #eria_06,
.eriaPage .eria_content_08 {
  --eria-color: #ba5798;
}

.eriaPage #eria_01::after,
.eriaPage #eria_02::after,
.eriaPage #eria_03::after,
.eriaPage #eria_04::after,
.eriaPage #eria_05::after,
.eriaPage #eria_06::after {
  content: none !important;
}

.eriaPage .ttl_eria_top_box {
  margin: 0 0 14px;
}

.eriaPage .ttl_eria_top_h3 {
  display: block;
  margin: 0;
  padding: 0;
}

.eriaPage .ttl_eria_top_h3 h3 {
  position: relative;
  margin: 0;
  padding: 0 0 8px;
  font-size: 22px;
  line-height: 1.4;
  letter-spacing: 0;
  color: var(--eria-color);
  border-bottom: 1px dashed var(--eria-color);
}

.eriaPage .ttl_eria_top_h3 h3 a {
  display: block;
  color: inherit;
  text-decoration: none;
}

.eriaPage .ttl_eria_top_h3 h3::before {
  content: none !important;
}

.eriaPage .ttl_eria_top_h3 h3::after {
  content: none !important;
}

.eriaPage .ttl_eria_top_h3 p {
  margin: 10px 0 0;
  color: #555;
  line-height: 1.6;
}

.eriaPage .ttl_eria_top_h3 p img {
  display: block;
  width: 150px;
}

.eriaPage .eria_top_ad {
  margin: 10px 0 0;
  color: #555;
  line-height: 1.6;
}

.eriaPage .eria_content_03 .ttl_eria_top_h3 h3::before,
.eriaPage .eria_content_03 .tab_eria {
  background: #f2a91f;
}

.eriaPage .eria_content_04 .ttl_eria_top_h3 h3::before,
.eriaPage .eria_content_04 .tab_eria {
  background: #79b91a;
}

.eriaPage .eria_content_05 .ttl_eria_top_h3 h3::before,
.eriaPage .eria_content_05 .tab_eria {
  background: #34aee2;
}

.eriaPage .eria_content_06 .ttl_eria_top_h3 h3::before,
.eriaPage .eria_content_06 .tab_eria {
  background: #e989b8;
}

.eriaPage .eria_content_07 .ttl_eria_top_h3 h3::before,
.eriaPage .eria_content_07 .tab_eria {
  background: #22a63b;
}

.eriaPage .eria_content_08 .ttl_eria_top_h3 h3::before,
.eriaPage .eria_content_08 .tab_eria {
  background: #ba5798;
}

.eriaPage .ken_list,
.eriaPage .eria_content_03 .ken_list,
.eriaPage .eria_content_04 .ken_list,
.eriaPage .eria_content_05 .ken_list,
.eriaPage .eria_content_06 .ken_list,
.eriaPage .eria_content_07 .ken_list,
.eriaPage .eria_content_08 .ken_list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}

.eriaPage .ken_list li,
.eriaPage .eria_content_03 .ken_list li,
.eriaPage .eria_content_04 .ken_list li,
.eriaPage .eria_content_05 .ken_list li,
.eriaPage .eria_content_06 .ken_list li,
.eriaPage .eria_content_07 .ken_list li,
.eriaPage .eria_content_08 .ken_list li,
.eriaPage .eria_content_03 .ken_list li:nth-child(3n),
.eriaPage .eria_content_04 .ken_list li:nth-child(3n),
.eriaPage .eria_content_05 .ken_list li:nth-child(3n),
.eriaPage .eria_content_06 .ken_list li:nth-child(3n),
.eriaPage .eria_content_07 .ken_list li:nth-child(3n),
.eriaPage .eria_content_08 .ken_list li:nth-child(3n) {
  display: block;
  flex: 0 0 calc((100% - 40px) / 5);
  min-width: 108px;
  margin: 0;
  padding: 0;
  border-radius: 5px;
  background: var(--eria-color);
}

.eriaPage .ken_list li::after,
.eriaPage .ken_list li::before,
.eriaPage .eria_content_03 .ken_list li::after,
.eriaPage .eria_content_04 .ken_list li::after,
.eriaPage .eria_content_05 .ken_list li::after,
.eriaPage .eria_content_06 .ken_list li::after,
.eriaPage .eria_content_07 .ken_list li::after,
.eriaPage .eria_content_08 .ken_list li::after {
  content: none !important;
}

.eriaPage .ken_list li a,
.eriaPage .eria_content_03 .ken_list li a,
.eriaPage .eria_content_04 .ken_list li a,
.eriaPage .eria_content_05 .ken_list li a,
.eriaPage .eria_content_06 .ken_list li a,
.eriaPage .eria_content_07 .ken_list li a,
.eriaPage .eria_content_08 .ken_list li a {
  display: block;
  padding: 8px 14px;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
}

.eriaPage .tyuui {
  clear: both;
  width: 100%;
  margin: 10px 0 0 !important;
  color: #666;
  font-size: 13px;
  line-height: 1.6;
}

.eriaPage dl {
  margin: 0;
}

.eriaPage .tab_eria {
  position: relative;
  margin: 12px 0 0;
  padding: 11px 42px 11px 16px;
  border-radius: 6px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.45;
  cursor: pointer;
}

.eriaPage .tab_eria::after {
  position: absolute;
  right: 16px;
  top: 50%;
  color: #fff;
  content: "\\f107";
  font-family: FontAwesome;
  font-size: 20px;
  line-height: 1;
  transform: translateY(-50%);
}

.eriaPage .tab_eria + dd {
  display: none;
  margin: 0;
  padding: 14px 0 2px;
}

.eriaPage .eriaDetail,
.eriaPage .eriaDetailListNotDispatch {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.eriaPage .eriaDetail li,
.eriaPage .eriaDetailListNotDispatch li {
  float: none;
  width: auto;
  margin: 0;
  padding: 7px 10px;
  border-radius: 4px;
  background: #f2fcff;
  color: #636363;
  font-size: 14px;
  line-height: 1.35;
}

.eriaPage .eriaDetail li a,
.eriaPage .eriaDetail li span,
.eriaPage .eriaDetailListNotDispatch li a {
  display: block;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #35338e;
  font-size: inherit;
  line-height: 1.35;
  text-decoration: none;
}

.eriaPage .eriaDetail li a::before,
.eriaPage .eriaDetailListNotDispatch li a::before {
  margin-right: 4px;
  color: #33bad2;
  content: "\\f0da";
  font-family: FontAwesome;
}

.eriaPage .eriaNotDispatch {
  margin: 14px 0 0;
  padding: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  background: #f7f7f7;
  color: #666;
  font-size: 13px;
}

.eriaPage .eriaNotDispatch p {
  margin: 0 0 8px;
}

.eriaPage .hikaku_content_04 {
  margin: 28px 0 0;
  padding: 18px;
  border: 2px solid #b9df6c;
  border-radius: 8px;
  background: #fffdf2;
}

.eriaPage .hikaku_content_04 p {
  margin: 0 0 12px;
}

.eriaPage .hikaku_content_04 p:last-child {
  margin-bottom: 0;
}

.eriaPage .pcMainCta {
  display: none;
}

.eriaPage table,
.eriaPage iframe,
.eriaPage object,
.eriaPage embed {
  max-width: 100%;
}

.eriaPage table {
  width: 100%;
}

.eriaPage .ken_main,
.eriaPage .ken_start,
.eriaPage .shi_top_text,
.eriaPage .shi_top_text2,
.eriaPage .balloon,
.eriaPage .balloon_b,
.eriaPage .position_re,
.eriaPage .action {
  max-width: 100%;
}

.eriaPage .position_re,
.eriaPage .action {
  margin-left: auto;
  margin-right: auto;
}

#pagetopButtonBlock {
  width: 100%;
  margin: 24px 0 0;
  text-align: right;
}

@media screen and (max-width: 767px) {
  .eriaPage .eria_wrap {
    max-width: 100%;
  }

  .eriaPage .articleTitle {
    font-size: 23px;
  }

  .eriaPage .eria_content {
    padding: 14px 12px;
    text-align: left;
  }

  .eriaPage .eria_content br {
    display: none;
  }

  .eriaPage .maps {
    display: none;
  }

  .eriaPage .maps img {
    width: auto;
    margin: 0 auto;
  }

  .eriaPage .eria_content_02 {
    padding: 84px 12px 14px;
    background-position: 12px 12px;
  }

  .eriaPage .ttl_eria_top_h3 {
    display: block;
  }

  .eriaPage .ttl_eria_top_h3 h3 {
    font-size: 20px;
  }

  .eriaPage .ttl_eria_top_h3 p {
    margin: 10px 0 0;
  }

  .eriaPage .ttl_eria_top_h3 p img {
    width: min(100%, 210px);
  }

  .eriaPage .eria_top_ad {
    margin-left: 0;
    font-size: 14px;
  }

  .eriaPage .ken_list li,
  .eriaPage .eria_content_03 .ken_list li,
  .eriaPage .eria_content_04 .ken_list li,
  .eriaPage .eria_content_05 .ken_list li,
  .eriaPage .eria_content_06 .ken_list li,
  .eriaPage .eria_content_07 .ken_list li,
  .eriaPage .eria_content_08 .ken_list li,
  .eriaPage .eria_content_03 .ken_list li:nth-child(3n),
  .eriaPage .eria_content_04 .ken_list li:nth-child(3n),
  .eriaPage .eria_content_05 .ken_list li:nth-child(3n),
  .eriaPage .eria_content_06 .ken_list li:nth-child(3n),
  .eriaPage .eria_content_07 .ken_list li:nth-child(3n),
  .eriaPage .eria_content_08 .ken_list li:nth-child(3n) {
    flex: 0 0 calc((100% - 20px) / 3);  
    min-width: 0;
  }

  .eriaPage .tab_eria {
    font-size: 15px;
  }

  .eriaPage .eriaDetail li,
  .eriaPage .eriaDetailListNotDispatch li {
    width: calc(50% - 4px);
    font-size: 13px;
  }

  .eriaPage .eriaDetail li a,
  .eriaPage .eriaDetail li span,
  .eriaPage .eriaDetailListNotDispatch li a {
    padding: 0;
    font-size: 13px;
  }
}

@media screen and (min-width: 1024px) {

  .eriaArticleLayout > #main {
    grid-column: 1;
    grid-row: 2;
  }

  .eriaArticleLayout > .pcSidebar {
    grid-column: 2;
    grid-row: 2;
  }

  .eriaArticleLayout > #pagetopButtonBlock {
    grid-column: 1 / -1;
    grid-row: 3;
  }

  .eriaPage .eria_content {
    padding: 20px;
  }

  .eriaPage .maps img {
    width: auto;
    max-width: 100%;
  }

  .eriaPage .ap {
    display: block;
    max-width: 720px;
    margin: 32px auto 0;
  }

  .eriaPage .ap p {
    margin: 0 0 14px;
    text-align: center;
  }

  .eriaPage .ap p:last-child {
    margin-bottom: 0;
  }

  .eriaPage .ap img {
    display: block;
    width: 80%;
    height: auto;
    margin: 0 auto;
  }

  .eriaPage .ap .pco {
    display: block !important;
  }

  .eriaPage .ap a {
    color: #0894cf;
    font-weight: bold;
  }
}


/* School pages */
.eriaPage .school_wrap { max-width: 720px; }

.eriaPage .school_01,
.eriaPage .school_02,
.eriaPage .school_03,
.eriaPage .school_04 { margin: 0 0 30px; }

.eriaPage .school_01 {
  display: grid;
  grid-template-columns: minmax(220px, 300px) 1fr;
  gap: 20px;
  align-items: center;
  padding: 18px;
  border: 1px solid #e8e8e8;
  border-top: 5px solid #f2a91f;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.eriaPage .school_ttl {
  grid-column: 1 / -1;
  width: fit-content;
  margin: 0 0 2px;
  padding: 4px 14px;
  border-radius: 999px;
  background: #f2a91f;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
}

.eriaPage .school_left,
.eriaPage .school_right { min-width: 0; }

.eriaPage .school_right h2,
.eriaPage .school_02 h2,
.eriaPage .school_03 h2,
.eriaPage .school_04 h2 {
  margin: 0 0 14px;
  padding: 0 0 8px;
  border-bottom: 2px dotted #6aa56b;
  color: #444;
  font-size: 24px;
  line-height: 1.45;
  letter-spacing: 0;
}

.eriaPage .school_right p { margin: 0 0 14px; line-height: 1.8; }
.eriaPage .right_btn { margin-bottom: 0 !important; }
.eriaPage .right_btn a { display: inline-block; }

.eriaPage .school_staff_list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.eriaPage .school_staff_list li { margin: 0; padding: 0; }

.eriaPage .t_box,
.eriaPage .t_boxR {
  height: 100%;
  padding: 14px;
  border: 1px solid #e7e7e7;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.eriaPage .t_box h3,
.eriaPage .t_boxR h3 {
  margin: 0 0 10px;
  color: #f2a91f;
  font-size: 18px;
  line-height: 1.4;
}

.eriaPage .img_div {
  float: left;
  width: 92px;
  margin: 0 12px 8px 0;
}

.eriaPage .img_div img { display: block; width: 100%; height: auto; }
.eriaPage .t_box p,
.eriaPage .t_boxR p { margin: 0; line-height: 1.75; }

.eriaPage .school_link { margin: 18px 0 0; text-align: center; }
.eriaPage .school_link a {
  display: inline-block;
  max-width: 100%;
  padding: 12px 22px;
  border-radius: 999px;
  background: #34aee2;
  color: #fff;
  font-weight: bold;
  line-height: 1.5;
  text-decoration: none;
}

.eriaPage .school_address { margin: 0 0 12px; font-weight: bold; }
.eriaPage .school_03 table { margin: 0 0 16px; border-collapse: collapse; background: #fff; }
.eriaPage .school_03 th,
.eriaPage .school_03 td {
  padding: 12px;
  border: 1px solid #dedede;
  line-height: 1.7;
  vertical-align: top;
}
.eriaPage .school_03 th {
  width: 34%;
  background: #f8fbef;
  color: #4d8a3f;
  font-weight: bold;
}

.eriaPage .school_map { margin: 18px 0 0; }
.eriaPage .school_map iframe {
  display: block;
  width: 100%;
  height: 420px;
  border-radius: 8px;
}

.eriaPage .schoolPrefectureLinks { --eria-color: #f2a91f; }

@media screen and (max-width: 767px) {
  .eriaPage .school_01 { display: block; padding: 14px; }
  .eriaPage .school_ttl { margin-bottom: 12px; }
  .eriaPage .school_left { margin-bottom: 14px; text-align: center; }
  .eriaPage .school_right h2,
  .eriaPage .school_02 h2,
  .eriaPage .school_03 h2,
  .eriaPage .school_04 h2 { font-size: 21px; }
  .eriaPage .school_staff_list { display: block; }
  .eriaPage .school_staff_list li { margin-bottom: 14px; }
  .eriaPage .img_div { width: 86px; }
  .eriaPage .school_03 table,
  .eriaPage .school_03 tbody,
  .eriaPage .school_03 tr,
  .eriaPage .school_03 th,
  .eriaPage .school_03 td { display: block; width: 100%; }
  .eriaPage .school_03 th { border-bottom: 0; }
  .eriaPage .school_map iframe { height: 280px; }
}


@media screen and (max-width: 767px) {
  .eriaPage .school_left {
    text-align: center;
  }

  .eriaPage .school_left img {
    width: min(72%, 260px);
    max-width: 260px;
    margin: 0 auto;
  }
}

.eriaPage .school_wrap {
  --school-color: #f2a91f;
}

.eriaPage .t_box h3,
.eriaPage .t_boxR h3 {
  display: inline-block;
  margin: 0 0 12px;
  padding: 0 0 6px;
  border-bottom: 4px solid var(--school-color);
  color: var(--school-color);
  
}/* School pages: let each school page change color with --school-color. */
.eriaPage .school_01 {
  border-top-color: var(--school-color, #f2a91f);
}

.eriaPage .school_ttl {
  background: var(--school-color, #f2a91f);
}

.eriaPage .schoolPrefectureLinks {
  --eria-color: var(--school-color, #f2a91f);
}