@charset "UTF-8";

/* 全体
---------------------------------------------- */
b {
  /*background: linear-gradient(transparent 50%, yellow 50%); color:#2C0002; font-weight:bold; font-size:15px;*/
}

u {
  text-decoration: none;
  border-bottom: 1px #000000 dotted;
}

hr {
  border-top: 1px dashed #bbb;
  border-bottom: 1px dashed #fff;
  margin: 50px 0;
}

a.links {
  color: #001ba0;
  text-decoration: none;
  border-bottom: 3px dotted #001ba0;
}

.benefit {
  font-size: 2.143em;
  line-height: 1;
}

.tax {
  font-size: 80%;
}

.small {
  font-size: 80%;
}

.h30 {
  margin: 30px 0;
}

.cnt {
  text-align: center;
}

.end {
  text-align: end;
}

.fRed {
  color: #f03838;
}

.bl {
  font-weight: bold;
}

.spc {
  letter-spacing: 0.1em;
}

.orange {
  color: #ff6600;
}

.mgT5{margin-top:5px;}
.mgT10{margin-top:10px;}
.mgT20{margin-top:20px;}
.mgB5{margin-bottom:5px;}
.mgB10{margin-bottom:10px;}
.mgB20{margin-bottom:20px;}
.p-t-5{padding-top:5px;}
.p-t-1{padding-top:10px;}
.p-t-2{padding-top:20px;}
.p-b-5{padding-bottom:5px;}
.p-b-1{padding-bottom:10px;}
.p-b-2{padding-bottom:20px;}


#main h2 {
  font-size: 2.143em;
  line-height: 1;
}

#main h2 img {
  width: auto;
  height: 1.167em;
  vertical-align: text-top;
}

#main h2 span {
  padding: 0.25em 0.5em;
  border-left: solid 6px #0aa0e7;
}

#section h3 {
  font-size: 1.5em;
  font-weight: 100;
  padding: 1.2em;
  letter-spacing: 0.05em;
  border-radius: 0.25em;
  color: #fff;
  background: #11a0e5;
}

.section h3 {
  font-size: 1.5em;
  font-weight: 100;
  padding: 1.2em;
  letter-spacing: 0.05em;
  border-radius: 0.25em;
  color: #fff;
  background: #11a0e5;
}

#main h4 {
  font-size: 1.2em;
  font-weight: 100;
  margin-bottom: 25px;
  position: relative;
  padding: 1.2em;
  background: #e0edff;
}

#main h4:after {
  position: absolute;
  content: "";
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #e0edff;
  width: 0;
  height: 0;
}

.section table {
  width: 100%;
  margin-bottom: 30px;
}

.section table th,
.section table td {
  padding: 10px;
  border: 1px solid #ddd;
}

.section table th {
  width: 30%;
  text-align: left;
}

@media only screen and (max-width: 480px) {
  .section table {
    margin: 0 auto;
  }

  .section table th,
  .section table td {
    width: 100%;
    display: block;
    border-top: none;
  }

  .section table tr:first-child th {
    border-top: 1px solid #ddd;
  }
}

table.main {
  width: 100%;
  margin-bottom: 30px;
}

table.main th,
table.main td {
  padding: 10px;
  border: 1px solid #ddd;
}

table.main th {
  background: #f4f4f4;
  width: 30%;
  text-align: left;
}

@media only screen and (max-width: 480px) {
  table.main {
    margin: 0 auto;
  }

  table.main th,
  table.main td {
    width: 100%;
    display: block;
    border-top: none;
  }

  table.main tr:first-child th {
    border-top: 1px solid #ddd;
  }
}

.acordion,
.acordion :after,
.acordion *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.acordion {
  border-top: 1px solid #d8d8d8;
}

.acordion .acordion_actab {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin-bottom: 1px;
  color: #1b2538;
}

.acordion .acordion_actab input {
  position: absolute;
  opacity: 0;
}

.acordion .acordion_actab label {
  font-weight: bold;
  line-height: 1.6;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 1em;
  cursor: pointer;
  border-bottom: 1px solid #d8d8d8;
  color: #11a0e5;
}

.acordion .acordion_actab label:hover {
  color: #11a0e5;
}

.acordion .acordion_actab .acordion_actab-content {
  overflow: hidden;
  max-height: 0;
  -webkit-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
  background: #f6f4e8;
}

.acordion .acordion_actab .acordion_actab-content p {
  margin: 1em;
}

.acordion .acordion_actab input:checked ~ label {
  color: #11a0e5;
}

.acordion .acordion_actab input:checked ~ .acordion_actab-content {
  max-height: 40em;
}

.acordion .acordion_actab label::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 3em;
  margin-top: -12.5px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-align: center;
}

.acordion .acordion_actab input[type="checkbox"] + label::after {
  content: "\25BC";
}

.acordion .acordion_actab input[type="checkbox"]:checked + label::after {
  -webkit-transform: rotateX(180deg);
  transform: rotateX(180deg);
}

.acordion_2,
.acordion_2 :after,
.acordion_2 *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.acordion_2 {
  border-top: 1px solid #d8d8d8;
}

.acordion_2 .acordion_2_actab {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin-bottom: 1px;
  color: #1b2538;
}

.acordion_2 .acordion_2_actab input {
  position: absolute;
  opacity: 0;
}

.acordion_2 .acordion_2_actab label {
  font-weight: bold;
  line-height: 1.6;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 1em;
  cursor: pointer;
  border-bottom: 1px solid #d8d8d8;
  color: #11a0e5;
}

.acordion_2 .acordion_2_actab label:hover {
  color: #11a0e5;
}

.acordion_2 .acordion_2_actab .acordion_2_actab-content {
  overflow: hidden;
  max-height: 0;
  -webkit-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
  background: #f6f4e8;
}

.acordion_2 .acordion_2_actab .acordion_2_actab-content p {
  margin: 1em;
}

.acordion_2 .acordion_2_actab input:checked ~ label {
  color: #11a0e5;
}

.acordion_2 .acordion_2_actab input:checked ~ .acordion_2_actab-content {
  max-height: 40em;
}

.acordion_2 .acordion_2_actab label::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 3em;
  margin-top: -12.5px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-align: center;
}

.acordion_2 .acordion_2_actab input[type="checkbox"] + label::after {
  content: "\25BC";
}

.acordion_2 .acordion_2_actab input[type="checkbox"]:checked + label::after {
  -webkit-transform: rotateX(180deg);
  transform: rotateX(180deg);
}

.acordion_3,
.acordion_3 :after,
.acordion_3 *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.acordion_3 {
  border-top: 1px solid #d8d8d8;
}

.acordion_3 .acordion_3_actab {
  position: relative;
  overflow: hidden;
  width: 100%;
  margin-bottom: 1px;
  color: #1b2538;
}

.acordion_3 .acordion_3_actab input {
  position: absolute;
  opacity: 0;
}

.acordion_3 .acordion_3_actab label {
  font-weight: bold;
  line-height: 1.6;
  position: relative;
  display: block;
  margin: 0 0 0 0;
  padding: 1em 2em 1em 1em;
  cursor: pointer;
  border-bottom: 1px solid #d8d8d8;
  color: #11a0e5;
}

.acordion_3 .acordion_3_actab label:hover {
  color: #11a0e5;
}

.acordion_3 .acordion_3_actab .acordion_3_actab-content {
  overflow: hidden;
  max-height: 0;
  -webkit-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
  background: #f6f4e8;
}

.acordion_3 .acordion_3_actab .acordion_3_actab-content p {
  margin: 1em;
}

.acordion_3 .acordion_3_actab input:checked ~ label {
  color: #11a0e5;
}

.acordion_3 .acordion_3_actab input:checked ~ .acordion_3_actab-content {
  max-height: 40em;
}

.acordion_3 .acordion_3_actab label::after {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: 3em;
  margin-top: -12.5px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  text-align: center;
}

.acordion_3 .acordion_3_actab input[type="checkbox"] + label::after {
  content: "\25BC";
}

.acordion_3 .acordion_3_actab input[type="checkbox"]:checked + label::after {
  -webkit-transform: rotateX(180deg);
  transform: rotateX(180deg);
}

ul.step {
  padding: 0 10px;
  list-style-type: none;
  border: none;
}

ul.step li {
  position: relative;
  padding: 8px 0 0 30px;
  line-height: 1.5;
}

ul.step li::after,
ul.step li::before {
  content: "";
  position: absolute;
}

ul.step li::after {
  left: -0.2em;
  top: 8px;
  width: 20px;
  height: 20px;
  background-color: #f27398;
  border-radius: 50%;
}

ul.step li::before {
  z-index: 2;
  left: 3px;
  top: 15px;
  width: 4px;
  height: 4px;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

ol.step {
  counter-reset: number;
  list-style-type: none !important;
  padding: 0.5em;
}

ol.step li {
  position: relative;
  padding-left: 30px;
  line-height: 1.5em;
  padding: 0.5em 0.5em 0.5em 30px;
}

ol.step li:before {
  position: absolute;
  counter-increment: number;
  content: counter(number);
  display: inline-block;
  background: #5c9ee7;
  color: white;
  font-family: "Avenir", "Arial Black", "Arial", sans-serif;
  font-weight: bold;
  font-size: 15px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

#main .button {
  width: 60%;
  text-align: center;
  margin: 10px auto;
  padding: 20px 12px;
  background-color: #ffab33;
  color: #fff;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  line-height: 1.4615;
  vertical-align: middle;
}

.btn-accordion,
.order-accordion,
.order-accordion-lodge,
.btn_manten,
.btn_line_attend,
.btn_line_lodge,
.btn_auto {
  display: block;
  text-align: center;
  margin: 20px;
}

.btn-accordion button,
.order-accordion button,
.order-accordion-lodge button,
.btn_manten button,
.btn_line_attend button,
.btn_line_lodge button,
.btn_auto button {
  position: relative;
  display: inline-block;
  color: #fff;
  line-height: 1;
  border: 0;
}

.btn-accordion button:before,
.order-accordion button:before,
.order-accordion-lodge button:before {
  content: "";
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1.85em;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  /*background-image:url(/img/svg/ico-chevron-right.svg);*/
  background-image: url(/img/svg/ico-chevron-bottom-w.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.btn-accordion button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #ffab33;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.btn-accordion button .txt:before {
  content: "詳細ページを表示";
}

.order-accordion button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #fa436e;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.order-accordion button .txt:before {
  content: "申し込みをする(通学)";
}

.order-accordion button:hover {
  opacity: 0.7;
}

.order-accordion-lodge button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #fa436e;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.order-accordion-lodge button .txt:before {
  content: "申し込みをする(合宿)";
}

.order-accordion-lodge button:hover {
  opacity: 0.7;
}

.btn_manten button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #ffab33;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.btn_manten button .txt:before {
  content: "「満点様」画面を開く";
}

.btn_manten button:hover {
  opacity: 0.7;
}

.btn_line_attend button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #ffab33;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.btn_line_attend button .txt:before {
  content: "LINEで問い合わせを始める(通学)";
}

.btn_line_attend button:hover {
  opacity: 0.7;
}

.btn_line_lodge button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #ffab33;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.btn_line_lodge button .txt:before {
  content: "LINEで問い合わせを始める(合宿)";
}

.btn_line_lodge button:hover {
  opacity: 0.7;
}

.btn_auto button {
  font-size: 1.286em;
  min-width: 284px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #ffab33;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.btn_auto button .txt:before {
  content: "ログイン画面を開く";
}

.btn_auto button:hover {
  opacity: 0.7;
}

.pdf {
  text-align: center;
  border-radius: 10px;
}

.pdf li {
  display: inline-block;
  margin-bottom: 10px;
  padding-left: 25px;
  vertical-align: middle;
  background: url(/img/icon_dl.png) 0 center no-repeat;
}

.pdf li:after {
  content: url(/img/icon_pdf.png);
  padding-left: 10px;
  vertical-align: -2px;
}

.pdf li:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  .btn-accordion,
  .order-accordion,
  .order-accordion-lodge,
  .btn_manten,
  .btn_line_attend,
  .btn_line_lodge,
  .btn_auto {
    margin: 20px 0;
  }

  .btn-accordion button,
  .order-accordion button,
  .order-accordion-lodge button,
  .btn_manten button,
  .btn_line_attend button,
  .btn_line_lodge button,
  .btn_auto button {
    width: 100%;
    white-space: normal;
  }
}

.download {
  text-align: center;
  border-radius: 10px;
}

.download li {
  display: inline-block;
  margin-bottom: 10px;
  padding-left: 25px;
  vertical-align: middle;
  background: url(/img/icon_dl.png) 0 center no-repeat;
}

.download li:hover {
  opacity: 0.7;
}

.download.pdf li:after {
  content: url(/img/icon_pdf.png);
  padding-left: 10px;
  vertical-align: -2px;
}

.panel {
  margin: 1em auto;
  padding: 1em 1.5em 1px;
  background: #f6f4e8;
}

.panel_gray {
  margin: 1em auto;
  padding: 1em 1.5em 1px;
  background: #f4f4f4;
}

.yellow_line {
  background: -webkit-linear-gradient(transparent 60%, #ffc926 60%);
  background: -o-linear-gradient(transparent 60%, #ffc926 60%);
  background: linear-gradient(transparent 60%, #ffc926 60%);
}

.line {
  background: linear-gradient(transparent 50%, #ffe4e1 0%);
}

.line2 {
  background: -webkit-linear-gradient(transparent 60%, #ffc926 60%);
  background: -o-linear-gradient(transparent 60%, #ffc926 60%);
  background: linear-gradient(transparent 60%, #ffc926 60%);
}

ol.list {
  counter-reset: number;
  list-style-type: none !important;
  padding: 0.5em;
}

ol.list li {
  position: relative;
  padding-left: 30px;
  line-height: 1.5em;
  padding: 0.5em 0.5em 0.5em 30px;
}

ol.list li:before {
  position: absolute;
  counter-increment: number;
  content: counter(number);
  display: inline-block;
  background: #0aa0e7;
  color: white;
  font-family: "Avenir", "Arial Black", "Arial", sans-serif;
  font-weight: bold;
  font-size: 13px;
  border-radius: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.leftandright .item {
  overflow: hidden;
  list-style-type: none;
}

.leftandright .item:not(:last-child) {
  margin-bottom: 40px;
}

.leftandright .img {
  display: inline-block;
  overflow: hidden;
  box-sizing: border-box;
  margin-right: 24px;
  width: 380px;
  vertical-align: top;
  text-align: left;
  float: left;
}

.leftandright .img a {
  width: 100%;
  height: 100%;
}

.leftandright .text {
  display: inline-block;
  width: calc(100% - 380px - 28px);
  vertical-align: top;
}

.leftandright .text h4 {
  position: relative;
  margin-bottom: 18px;
  color: #333;
}

.leftandright .text h4:not([class])::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  display: block;
  width: 32px;
  height: 2px;
  background-color: #38bdef;
  content: "";
}

.leftandright .text h4:not([class]) a::after {
  display: inline-block;
  margin: 0 4px;
  width: 12px;
  height: 12px;
  background-image: url(/img/svg/arw-text.svg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  content: "";
  vertical-align: 0;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}

@media screen and (max-width: 640px) {
  .leftandright .item:not(:last-child) {
    margin-bottom: 24px;
  }

  .leftandright .img {
    display: block;
    margin-right: 0;
    margin-bottom: 16px;
    width: 100%;
    text-align: center;
  }

  .leftandright .text {
    /*display: block;*/
    width: 100%;
  }

  .leftandright .text h4 {
    font-size: 18px;
  }

  .leftandright .img a img {
    transition: all 0.3s ease;
  }

  .leftandright .img a:hover img {
    opacity: 0.6;
  }
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  grid-gap: 30px;
}

.cards {
  max-width: 960px;
  margin: 0 auto 30px;
}

article {
  position: relative;
}

.article-img {
  height: 200px;
  width: 100%;
  object-fit: cover;
}

.article-title {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 10px;
  background-color: rgba(255, 255, 255, 0.8);
}

.ribbon1 {
  display: block;
  position: relative;
  margin: 15px auto;
  padding: 10px 20px;
  width: 100%;
  background: #f1f1f1;
  box-sizing: border-box;
}

.ribbon1 .star {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 10px;
  margin: 0;
  padding: 10px 0;
  z-index: 2;
  width: 40px;
  text-align: center;
  font-size: 17px;
  color: white;
  background: #f58e7e;
}

.ribbon1 .star:after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-left: 20px solid #f58e7e;
  border-right: 20px solid #f58e7e;
  border-bottom: 10px solid transparent;
}

.ribbon2 {
  display: block;
  position: relative;
  margin: 15px auto;
  padding: 10px 20px;
  width: 100%;
  background: #f1f1f1;
  box-sizing: border-box;
}

.ribbon2 .star {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 10px;
  margin: 0;
  padding: 10px 0;
  z-index: 2;
  width: 40px;
  text-align: center;
  font-size: 17px;
  color: white;
  background: #8dcf3f;
}

.ribbon2 .star:after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-left: 20px solid #8dcf3f;
  border-right: 20px solid #8dcf3f;
  border-bottom: 10px solid transparent;
}

.ribbon3 {
  display: block;
  position: relative;
  margin: 15px auto;
  padding: 10px 20px;
  width: 100%;
  background: #f1f1f1;
  box-sizing: border-box;
}

.ribbon3 .star {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 10px;
  margin: 0;
  padding: 10px 0;
  z-index: 2;
  width: 40px;
  text-align: center;
  font-size: 17px;
  color: white;
  background: #fdc44f;
}

.ribbon3 .star:after {
  content: "";
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-left: 20px solid #fdc44f;
  border-right: 20px solid #fdc44f;
  border-bottom: 10px solid transparent;
}

.ribbon1,
.ribbon2,
.ribbon3 p {
  text-align: right;
}

.flowlist {
  width: 100%;
}

.flowlist .box {
  position: relative;
  padding: 48px 50px 50px 222px;
  background: #f5f5f5;
  min-height: 236px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  color: #000;
}

.flowlist > li:first-child {
  padding-top: 0;
}

.flowlist > li {
  padding-top: 40px;
}

.flowlist .step {
  position: absolute;
  top: 50px;
  left: 50px;
  display: block;
  width: 120px;
  height: 120px;
  background: #0059e9;
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  text-align: center;
}

.flowlist .step > span.text {
  padding-top: 27px;
  font-size: 16px;
  line-height: 1.5;
  text-indent: 0.05em;
  letter-spacing: 0.05em;
}

.flowlist .step > span {
  display: block;
}

.flowlist .step > span.no {
  margin-top: -0.6em;
  font-size: 40px;
  line-height: 1.5;
  letter-spacing: 0;
}

.flowlist .title .area2 {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.flowlist li .box > .textblock {
  margin-top: 13px;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0;
}

.flowlist .box::after {
  content: " ";
  position: absolute;
  top: 190px;
  left: 94px;
  display: block;
  width: 34px;
  height: 17px;
  background: url(/img/svg/flow.svg) no-repeat;
  background-size: auto auto;
  background-size: 34px 17px;
}

.flowlist > li:last-child .box:after {
  display: none;
}

@media screen and (max-width: 799px) {
  .flowlist {
    margin-top: 17px;
    width: auto;
  }

  .flowlist > li {
    padding-top: 37px;
    background: url(/img/svg/flow.svg) no-repeat 50% 10px;
    background-size: 32px 16px;
  }

  .flowlist > li:first-child {
    padding-top: 0;
  }

  .flowlist .box {
    padding: 19px 20px 15px 20px;
    min-height: 0;
    background: #f5f5f5;
  }

  .flowlist .box:after {
    display: none;
  }

  .flowlist .step {
    position: relative;
    top: 0;
    left: 0;
    width: 60px;
    height: 60px;
  }

  .flowlist .step > span.text {
    padding-top: 7px;
    font-size: 12px;
  }

  .flowlist .step > span.no {
    margin-top: -1em;
    font-size: 24px;
  }

  .flowlist .title {
    display: table;
    width: 100%;
  }

  .flowlist .title .area2,
  .flowlist .title .area1 {
    display: table-cell;
    vertical-align: middle;
  }

  .flowlist .title .area1 {
    width: 82px;
  }

  .flowlist li .box > .textblock {
    margin-top: 17px;
  }
}

#stage {
  position: relative;
  max-width: 890px;
  margin: 10px auto;
  overflow: hidden;
}

#photos {
  position: absolute;
  top: 0;
  width: 100%;
  animation: imgPassToLeft0 30s infinite;
  -webkit-animation: imgPassToLeft0 30s infinite;
}

#photo0 {
  left: 0%;
}

#photo1 {
  left: 100%;
}

#photo2 {
  left: 200%;
}

#photo3 {
  left: 300%;
}

#photo4 {
  left: 400%;
}

#photo5 {
  left: 500%;
}

#photo6 {
  left: 600%;
}

.pic {
  position: absolute;
  top: 0;
  width: 100%;
}

.pic img {
  width: 100%;
}

#back1,
#back2,
#back3,
#back4,
#back5,
#next1,
#next2,
#next3,
#next4,
#next5 {
  display: none;
}

.pic:hover > label div span {
  opacity: 1;
  color: #eee;
}

.pic label div span:hover {
  color: #f00;
  cursor: pointer;
}

@keyframes imgPassToLeft0 {
  0% {
    left: -100%;
  }

  16% {
    left: -100%;
  }

  20% {
    left: -200%;
  }

  36% {
    left: -200%;
  }

  40% {
    left: -300%;
  }

  56% {
    left: -300%;
  }

  60% {
    left: -400%;
  }

  76% {
    left: -400%;
  }

  80% {
    left: -500%;
  }

  96% {
    left: -500%;
  }

  100% {
    left: -600%;
  }
}

@-webkit-keyframes imgPassToLeft0 {
  0% {
    left: -100%;
  }

  16% {
    left: -100%;
  }

  20% {
    left: -200%;
  }

  36% {
    left: -200%;
  }

  40% {
    left: -300%;
  }

  56% {
    left: -300%;
  }

  60% {
    left: -400%;
  }

  76% {
    left: -400%;
  }

  80% {
    left: -500%;
  }

  96% {
    left: -500%;
  }

  100% {
    left: -600%;
  }
}

.cssgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgrid > div {
  background: #f6f4e8;
  overflow: auto;
  min-width: 0;
  padding: 1em;
}

#wrap ul li:last-child {
  margin-right: 0;
}

@media all and (-ms-high-contrast: none) {
  #demo-wrap ul.column2 li {
    width: calc((100% - 61px) / 2);
  }
}

@media screen and (max-width: 640px) {
  #wrap ul li {
    float: none;
    width: 100%;
  }
}

.btn {
  margin: 25px 0 0;
  text-align: center;
}

.btn a {
  display: inline-block;
  position: relative;
  background: #e64176;
  border-radius: 25px;
  padding: 7px 60px 7px 40px;
  text-decoration: none;
  color: #fff;
}
.btn2 {
  margin: 25px 0 0;
  text-align: center;
}

.btn2 a {
  display: inline-block;
  position: relative;
  background: #e64176;
  border-radius: 25px;
  padding: 7px 60px 7px 40px;
  text-decoration: none;
  color: #fff;
}

#timetable .flex > div p {
  text-align: center;
}

/* ▼テキスト装飾系 */
/* ----------------------------------------------------- */
.ul_none {
  list-style: none;
}

/* ▼卒業生の声（通学・合宿共通）-voice */
/* ----------------------------------------------------- */
hr.hr1 {
  border: 0;
  height: 1px;
  background-image: -webkit-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -moz-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -ms-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
  background-image: -o-linear-gradient(left, #f0f0f0, #8c8b8b, #f0f0f0);
}

.dl_voice dt {
  height: 1em;
  font-size: 1.5em;
  color: #000000;
  margin: 10px 0 0 0;
  padding: 0;
}

.dl_voice dd {
  border-top: 1px dashed #8c8b8b;
  font-size: 1em;
  color: #181818;
  margin: 0;
}

/* 選べるコース
---------------------------------------------- */

table.plans {
  width: 100%;
}

table.plans th {
  background: #e9727e;
  border: solid 1px #ccc;
  color: #fff;
  padding: 10px;
}

table.plans td {
  background: #fff;
  border: solid 1px #ccc;
  padding: 10px;
}

@media screen and (max-width: 640px) {
  table.plans {
    width: 100%;
  }

  table.plans tr {
    display: block;
    float: left;
  }

  table.plans tr td,
  table.plans tr th {
    border-left: none;
    display: block;
    height: 50px;
  }

  table.plans thead {
    display: block;
    float: left;
    width: 30%;
  }

  table.plans thead tr {
    width: 100%;
  }

  table.plans tbody {
    display: block;
    float: left;
    width: 70%;
  }

  table.plans tbody tr {
    width: 50%;
  }

  table.plans tr td + td {
    border-left: none;
  }

  table.plans tbody td:last-child {
    border-bottom: solid 1px #ccc;
  }
}

/*給付金制度*/
.step_list li {
  margin-left: 10px;
  margin-bottom: 0;
}

.step_list li::before {
  content: "●";
  margin-right: 5px;
}

.step_tit_sub {
  margin-bottom: 0 !important;
  font-weight: bold;
}

/* フォーム
---------------------------------------------- */

/*================ テキストスタイル ================*/
.textRed {
  color: #f2242f !important;
}

.txtSmall {
  font-size: 85.7% !important;
}

.form_title {
  background: #00ab8c;
  color: #fff;
  font-size: 142.9%;
  font-weight: 700;
  padding: 9px 10px;
  margin-bottom: 12px;
  line-height: 1.35;
}

/* ================ 入力フォームスタイル ================ */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

/*changed! */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: none;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: none;
  /*changed*/
  margin: 0;
  /*changed*/
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

.btnMiddle40 > span {
  margin: 0 40px;
}

/* ----------------------------------------

- Stopgap Class
(以下は暫定的、又はイレギュラーな場合のみ使用。通常は使用しない)

---------------------------------------- */
.mgt10 {
  margin-top: 10px !important;
}

.mgt15 {
  margin-top: 15px !important;
}

.mgt20 {
  margin-top: 20px !important;
}

.mgt25 {
  margin-top: 25px !important;
}

.mgt30 {
  margin-top: 30px !important;
}

.mgb0 {
  margin-bottom: 0 !important;
}

.mgb5 {
  margin-bottom: 5px !important;
}

.mgb10 {
  margin-bottom: 10px !important;
}

.mgb15 {
  margin-bottom: 15px !important;
}

.mgb20 {
  margin-bottom: 20px !important;
}

.mgb25 {
  margin-bottom: 25px !important;
}

.mgb30 {
  margin-bottom: 30px !important;
}

.mgb40 {
  margin-bottom: 40px !important;
}

.mgb50 {
  margin-bottom: 50px !important;
}

.s_img {
}

.s_img .s_ttl {
  background: url("/img/school/img-creative.png") no-repeat center 20% / cover;
  position: relative;
  padding: 20px;
  color: #fff;
  text-align: center;
}

.s_img .s_ttl .inr {
  display: block;
  border: 5px solid #fff;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 85px 0 110px;
}

.s_img .s_ttl img {
  width: 365px;
  height: auto;
  opacity: 0;
}

@media screen and (max-width: 600px) {
  .s_img .s_ttl {
    background: url("/img/school/img-creative.png") no-repeat center 20% / cover;
    padding: 18px;
  }

  .s_img .s_ttl .inr {
    border: 5px solid #fff;
    padding: 22px 0 25px;
  }

  .s_img .s_ttl img {
    width: 180px;
  }
}

.dlimg__item {
  overflow: hidden;
  list-style-type: none;
}

.dlimg__item:not(:last-child) {
  margin-bottom: 40px;
}

.dlimg__img {
  display: inline-block;
  overflow: hidden;
  box-sizing: border-box;
  margin-right: 24px;
  width: 50%;
  vertical-align: top;
  text-align: left;
  float: left;
}

.dlimg__img a {
  width: 100%;
  height: 100%;
}

.dlimg__text {
  display: inline-block;
  width: calc(100% - 50% - 28px);
  vertical-align: top;
}

.dlimg__text h3 {
  position: relative;
  margin-bottom: 18px;
  color: #333;
}

.dlimg__text h3:not([class])::after {
  position: absolute;
  bottom: -2px;
  left: 0;
  display: block;
  width: 32px;
  height: 2px;
  background-color: #38bdef;
  content: "";
}

.dlimg__text h3:not([class]) a::after {
  display: inline-block;
  margin: 0 4px;
  width: 12px;
  height: 12px;
  background-image: url(/img/svg/arw-text.svg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  content: "";
  vertical-align: 0;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}

ul.list-ast {
  padding-left: 0;
}

ul.list-ast > li {
  padding-left: 1.25em;
  list-style: none;
}

ul.list-ast > li:before {
  display: inline-block;
  margin-left: -1.25em;
  width: 1.25em;
  content: "※";
  vertical-align: top;
}

.list-ast {
  color: #666;
}

.u-fz-sm {
  font-size: 0.875rem !important;
  line-height: 1.5714 !important;
}

@media screen and (max-width: 640px) {
  .dlimg__item:not(:last-child) {
    margin-bottom: 24px;
  }

  .dlimg__img {
    display: block;
    margin-right: 0;
    margin-bottom: 16px;
    width: 100%;
    text-align: center;
  }

  .dlimg__text {
    display: block;
    width: 100%;
  }

  .dlimg__text h3 {
    font-size: 18px;
  }

  .dlimg__img a img {
    transition: all 0.3s ease;
  }

  .dlimg__img a:hover img {
    opacity: 0.6;
  }
}

/*吹き出し*/
.fukidashi {
  margin-top: 16px;
}

.fukidashi .tit {
  text-align: left;
  font-weight: bold;
  background: url(/img/bg-fukidashi.png) no-repeat left;
  background-size: contain;
  padding: 20px 0 15px 100px;
  position: relative;
  bottom: -15px;
  margin: 0px;
  background-position: left 30px center;
  border: none;
}

.fukidashi .inner {
  margin-top: 0;
  background: #f3f5f7;
  padding: 30px 40px 24px;
  border-radius: 10px;
}

/*お知らせ*/
table.news {
  width: 100%;
  border-collapse: collapse;
}

table.news tr {
  border-bottom: solid 2px white;
}

table.news tr:last-child {
  border-bottom: none;
}

table.news th {
  position: relative;
  text-align: left;
  width: 28%;
  background-color: #0aa0e7;
  color: white;
  text-align: center;
  padding: 10px 0;
  font-size: 90%;
}

table.news td {
  padding-left: 10px;
}

.news {
  padding: 0.5em 10px 0.5em 0;
  background: #d5f4ff;
}

.news ul {
  padding-right: 10px;
}

.news li {
  margin-bottom: 0;
  list-style: none;
  border-top: dotted 1px #34b4e2;
}

.news li:nth-child(1) {
  border: 0;
}

.news li {
  display: block;
  padding: 1.429em 1.429em 1.429em 2.5em;
  background-image: url(/img/svg/ico-triangle.svg);
  background-repeat: no-repeat;
  background-position: 1.5em 1.8em;
  background-size: 7px auto;
}

.news li dl {
  min-height: 3em;
}

.news li dl:after {
  position: absolute;
  display: block;
  clear: both;
  content: "";
}

.news li dt {
  position: relative;
  float: left;
  width: 8.5em;
}

.news li dd {
  margin-left: 9.5em;
}

.news li .date {
  display: inline-block;
  width: 7em;
  letter-spacing: 0;
}

.news li .category {
  display: inline-block;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 8.5em;
  text-align: center;
  vertical-align: text-bottom;
  white-space: nowrap;
  letter-spacing: 0;
  text-overflow: ellipsis;
  border-radius: 0.2em;
  background-color: #00a0e9;
}

.news li .category:before {
  font-size: 0.714em;
  content: attr(data-category);
  color: #fff;
}

.news li .category[data-category="インフォメーション"] {
  background-color: #16b701;
}

.news li .category[data-category="キャンペーン"] {
  background-color: #ff8400;
}

.news li .category[data-category="イベント"] {
  background-color: #fa436e;
}

.news li .category[data-category="お知らせ"] {
  background-color: #a55b9a;
}

/*内部リンク調整*/
.link-t-a {
  position: relative;
  top: -170px;
  display: block;
}

/* ▼通学教習料金 */
/* ----------------------------------------------------- */
@media only screen and (max-width: 480px) {
  section table.attend-fee-table thead {
    display: none;
  }

  section table.attend-fee-table th {
    text-align: center;
  }

  section table.attend-fee-table th.target {
    display: none;
  }

  section table.attend-fee-table td.disc-license:before {
    content: "所持免許：";
  }

  section table.attend-fee-table td.student:before {
    content: "学生の方：";
  }

  section table.attend-fee-table td.general:before {
    content: "一般の方：";
  }

  section table.time-table th {
    width: 100px;
    display: table-cell;
  }

  section table.time-table td {
    width: auto;
    display: table-cell;
    border-top: 1px solid #ddd;
  }
}

/* ▼スタッフ紹介 staff */
/* ----------------------------------------------------- */
section#staff h2 {
  width: 1040px;
  margin: 0 0 2em 0;
}

section#staff {
  margin: 10px auto 60px auto;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

section#staff div.member {
  width: 50%;
  border-bottom: 1px dotted #a9a9a9;
  margin: 0 0 2em 0;
  padding: 0 0 1em 0;
}

section#staff div.member div.img {
  float: left;
  width: 37.03%;
  max-width: 200px;
}

section#staff div.member div.data {
  float: right;
  width: 50%;
  max-width: 260px;
  margin: 0 40px 0 0;
}

section#staff div.member div.data p.name {
  font-size: 22px;
  margin: 0;
}

section#staff div.member div.data p.name span {
  font-size: 13px;
  color: #666666;
  font-weight: normal;
}

section#staff div.member div.data p.comment {
  font-size: 13px;
}

section#staff div.member div.data ul {
  width: 100%;
  padding: 0;
  margin: 0;
}

section#staff div.member div.data ul li {
  border-bottom: 1px solid #dcdcdc;
  list-style: none;
  padding: 3px 0 3px 0;
  margin: 0;
}

section#staff div.member div.data ul li span {
  color: #ff597c;
  font-weight: bold;
}

section#staff div.member div.data ul li :last-child {
  border: none;
}

@media screen and (max-width: 767px) {
  /* ▼スタッフ紹介 */
  /* ----------------------------------------------------- */
  section#staff h2 {
    width: 100%;
    margin: 0 0 2em 0;
  }

  section#staff {
    margin: 0;
  }

  section#staff div.member {
    width: 100%;
    border-bottom: 1px dotted #a9a9a9;
    margin: 0 0 2em 0;
    padding: 0 0 1em 0;
    display: table;
  }

  section#staff div.member div.img {
    display: table-cell;
    width: 30%;
  }

  section#staff div.member div.data {
    display: table-cell;
    width: 60%;
    margin: 0;
    padding: 0 2% 0 2%;
    vertical-align: top;
  }

  section#staff div.member div.data p.name {
    font-size: 20px !important;
    margin: 0;
  }

  section#staff div.member div.data p.name span {
    color: #666666;
    font-weight: normal;
    font-size: 14px !important;
    margin: 0 0 0 10px;
  }

  section#staff div.member div.data p.comment {
    font-size: 13px;
  }

  section#staff div.member div.data ul {
    width: 100%;
    padding: 0;
    margin: 0;
  }

  section#staff div.member div.data ul li {
    border-bottom: 1px solid #dcdcdc;
    list-style: none;
    padding: 3px 0 3px 0;
    margin: 0;
  }

  section#staff div.member div.data ul li span {
    color: #ff597c;
    font-weight: bold;
  }

  section#staff div.member div.data ul li :last-child {
    border: none;
  }
}

/* ▼求人情報  */
/* ----------------------------------------------------- */
.jobFont {
  font-size: 36px;
}

.recruit-order-accordion {
  display: block;
  text-align: center;
  margin: 20px;
}

.recruit-order-accordion button {
  font-size: 1.286em;
  width: 700px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #fa436e;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.recruit-order-accordion button,
[class*="btn-link"] a {
  line-height: 1;
  position: relative;
  display: inline-block;
  color: #fff;
  border: 0;
}

.recruit-order-accordion button::after,
.recruit-order-accordion button::before,
[class*="btn-link"] a::after {
  display: inline-block;
  content: "";
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
}

.recruit-order-accordion button::before {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1.85em;
  width: 1em;
  height: 1em;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  /*background-image: url(/img/svg/ico-chevron-right.svg);*/
  background-image: url(/img/svg/ico-chevron-bottom-w.svg);
  background-size: contain;
}

.recruit-order-accordion button {
  font-size: 1.286em;
  white-space: nowrap;
  letter-spacing: 0.05em;
}

.recruit-order-accordion button,
[class*="btn-link"] a {
  line-height: 1;
  color: #fff;
}

.recruit-order-accordion button:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  .jobFont {
    font-size: 20px;
  }

  .recruit-order-accordion {
    margin: 20px 0;
  }

  .recruit-order-accordion button {
    width: 100%;
    white-space: normal;
  }
}

dl.recruit {
  padding-bottom: 5px;
}

.recruit dt {
  background-color: #e3edf4;
  padding: 5px;
  /*padding-top : 10px;    
  padding-bottom : 10px;
  padding-left : 10px;*/
  width: 210px;
  float: left;
  /* 左に寄せる */
  clear: both;
  /* フロートの解除 */
  border-bottom: dotted 1px #0aa0e7;
}

.recruit dd {
  padding: 5px;
  /*background-color : #9999ff;*/
  /*padding-top : 10px;
  padding-left : 10px;
  padding-right : 10px;
  padding-bottom : 10px;*/
  width: auto;
  margin-left: 210px;
  /* DTの幅分の設定 */
  border-bottom: dotted 1px #0aa0e7;
}

ul.recruit_li {
  font-family: Roboto;
  /*font-size: 12px;*/
  line-height: 1.3em;
  margin: 5px 0 15px;
  padding: 0;
}

ul.recruit_li li {
  list-style: none;
  position: relative;
  padding: 0 0 0 20px;
}

ul.recruit_li li::marker {
  display: none;
}

ul.recruit_li li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 5px;
  width: 3px;
  height: 6px;
  border: solid #ff6600;
  border-top-width: medium;
  border-right-width: medium;
  border-bottom-width: medium;
  border-left-width: medium;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
@media screen and (max-width: 559px) {
  ul.recruit_li li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 2px;
    width: 3px;
    height: 6px;
    border: solid #ff6600;
    border-top-width: medium;
    border-right-width: medium;
    border-bottom-width: medium;
    border-left-width: medium;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}

.recruit_tbl dl {
  font-size: 0.9em;
  display: flex;
  flex-flow: row wrap;
  width: 100%;
}
.recruit_tbl dt {
  flex-basis: 220px;
  padding: 10px;
  background-color: #e3edf4;
  border-bottom: dotted 1px #0aa0e7;
}
.recruit_tbl dd {
  flex-basis: 450px;
  padding: 10px;
  background-color: #fff;
  border-bottom: dotted 1px #0aa0e7;
}
@media screen and (max-width: 559px) {
  .company dl {
    flex-flow: column;
  }
  .recruit_tbl dt {
    flex-basis: 100%;
  }
  .recruit_tbl dd {
    border-bottom: none;
  }
}

/* ▼交通安全教室 -job */
/* ----------------------------------------------------- */
section#safety {
  margin: 10px 0;
  padding: 10px;
}

section#safety div.container h2 {
  font-size: 1.8em;
  padding: 0.25em 0.5em;
  background: transparent;
  border-left: solid 6px #0aa0e7;
  margin: 0 0 1em 0;
}

section#safety .safety {
  display: inline;
  float: left;
  width: 90%;
  max-width: 300px;
}

.new {
  font-size: 75%;
  color: #ff0000;
}

/**-----------------------------------------
    合宿ページ
------------------------------------------*/
/*スライド*/
.lodge-slide {
  padding: 0.5em 10px 0.5em 0;
  background: #d5f4ff;
}

.lodge-slide ul {
  padding-right: 10px;
}

.lodge-slide li {
  margin-bottom: 0;
  list-style: none;
  border-top: dotted 1px #34b4e2;
}

.lodge-slide li:nth-child(1) {
  border: 0;
}

.lodge-slide li {
  display: block;
  padding: 1.429em 1.429em 1.429em 2.5em;
  background-image: url(/img/svg/ico-triangle.svg);
  background-repeat: no-repeat;
  background-position: 1.5em 1.8em;
  background-size: 7px auto;
}

.lodge-slide li dl {
  min-height: 3em;
}

.lodge-slide li dl:after {
  position: absolute;
  display: block;
  clear: both;
  content: "";
}

.lodge-slide li dt {
  position: relative;
  float: left;
  width: 8.5em;
}

.lodge-slide li dd {
  margin-left: 9.5em;
}

.lodge-slide li .date {
  display: inline-block;
  letter-spacing: 0;
  padding-right: 10px;
}

.lodge-slide li .category {
  display: inline-block;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 8.5em;
  text-align: center;
  vertical-align: text-bottom;
  white-space: nowrap;
  letter-spacing: 0;
  text-overflow: ellipsis;
  border-radius: 0.2em;
  background-color: #00a0e9;
}

.lodge-slide li .category:before {
  font-size: 0.714em;
  content: attr(data-category);
  color: #fff;
}

.lodge-slide li .category[data-category="インフォメーション"] {
  background-color: #16b701;
}

.lodge-slide li .category[data-category="キャンペーン"] {
  background-color: #ff8400;
}

.lodge-slide li .category[data-category="イベント"] {
  background-color: #fa436e;
}

.lodge-slide li .category[data-category="お知らせ"] {
  background-color: #a55b9a;
}

@media (min-width: 425px) {
  .lodge-slide li dl {
    min-height: 1em;
  }

  .lodge-slide li dt {
    top: 0;
    width: 15.7em;
  }

  .lodge-slide li dd {
    margin-left: 15.5em;
  }
}

/**-----------------------------------------
    合宿料金プラン(PC)
------------------------------------------*/
.priceTbl {
  width: 95%;
  margin: 20px auto;
}

.priceTbl .color01 {
  font-size: 90%;
  color: #007bb9;
}

.priceTbl .color02 {
  font-size: 90%;
  color: #007bb9;
}

.priceTbl .color03 {
  font-size: 90%;
  color: #007bb9;
}

.priceTbl .color04 {
  font-size: 90%;
  color: #007bb9;
}

.priceTbl th {
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  /*text-align:center;*/
  padding: 10px 15px;
  background: #eee;
  /*font-weight:bold;*/
  font-size: 16px;
}

.priceTbl th.thNone {
  border-left: none;
}

.priceTbl td {
  text-align: center;
  border-left: 1px solid #fff069;
  border-bottom: 1px solid #fff069;
  border-right: 1px solid #fff069;
  font-weight: bold;
  font-size: 20px;
}

.priceTbl td.roomType {
  font-size: 14px;
  width: 200px;
  border-right: 1px solid #fff069;
  color: #555;
}

.priceTbl td.roomType .modalScheduleButton,
.priceTbl td.roomType .modalHotelButton {
  display: block;
  margin: 5px 3px 5px;
  padding: 3px 3px 3px 3px;
  border: 1px solid #f7cb9c;
  background-color: #f8850a;
  color: #fff;
  font-size: 12px;
  text-decoration: none;
}

.priceTbl td.roomType .modalScheduleButton:hover,
.priceTbl td.roomType .modalHotelButton:hover {
  opacity: 0.8;
}

.priceTbl td.fee {
  padding: 0 10px;
  color: #f00000;
}

.priceTbl td.fee .small {
  font-size: 0.8rem;
}

.priceTbl td a {
  background: url(/img/www/common/main/arw02.png) no-repeat 97% 50%;
  /*color:#000000;*/
  display: block;
  padding: 10px 5px;
  /*text-decoration:none;*/
}

.priceTbl td a:hover {
  background: #fce5e5 url(/img/www/common/main/arw03.png) no-repeat 97% 50%;
}

.priceTbl td .tax {
  color: #555;
  font-size: 12px;
  font-weight: normal;
}

/**-----------------------------------------
    料金プラン詳細（合宿）
------------------------------------------*/

#planInfo {
  float: left;
  width: 530px;
  margin: 10px 0 0;
}

#g_planInfo {
  float: left;
  width: 900px;
  margin: 10px 0 0;
}

#groupWari {
  float: right;
  width: 350px;
  margin: 20px 0 0;
  padding: 0 0 20px;
  background: url(/img/www/common/main/bg_point.gif);
  text-align: center;
}

#groupWari h3 {
  margin: 0;
  background: #8ea822;
  color: #fff;
}

#groupWari .groupImg {
  margin: 10px auto;
}

.hotelInfoL {
  width: 440px;
  float: left;
  padding: 10px 0;
}

.hotelInfoR {
  width: 440px;
  float: right;
  padding: 10px 0;
}

.hotelImg {
  text-align: center;
  padding: 20px 0 10px;
}

.gBikou {
  margin: 20px 0 50px;
}

.gBikou dt {
  font-weight: bold;
  background: url(/img/www/gassyuku/bikou.png) no-repeat 0 2px;
  padding: 0 0 0 25px;
  font-size: 16px;
}

.gBikou dd {
  padding: 5px 0 0 25px;
  margin: 0 0 20px;
}

.amenitieImg {
  text-align: center;
}

.amenitieImg > img {
  /*max-width: 500px;*/
}

/**-----------------------------------------
    入卒カレンダー
------------------------------------------*/

.calendar_table {
  margin: 20px 0;
  text-align: center;
}

.calendar_table table td {
  border: none;
  vertical-align: middle;
  font-size: 14px;
  line-height: 18px;
  padding: 0;
  margin: 0;
}

.calendar_table .calendar_inline {
  display: block;
  margin: 5px auto;
}

.calendar_table .calendar_inline table.calendar {
  display: inline-block;
  width: 400px;
}

.calendar_table table.calendar {
  border-collapse: collapse;
  margin: 0 5px 9px 5px;
  vertical-align: top;
  background: #fff none repeat scroll 0% 0%;
}

.calendar_table table.calendar th.calmonth {
  text-align: center;
  padding: 7px 3px;
  font-weight: normal;
  border: #cacaca solid 1px;
  background: #f1eee7;
  vertical-align: middle;
}

.calendar_table table.calendar td {
  border: #cacaca solid 1px;
  text-align: center;
  width: 57px;
  padding: 2px;
}

.calendar_table table.calendar td.calday {
  background: #efefef;
}

.calendar_table table.calendar td.cal {
  height: 30px;
}

.calendar_table table.calendar td.wday {
  background: #e4edff;
}

.calendar_table table.calendar td.sat {
  color: #09c;
  background: #cae6f7;
}

.calendar_table table.calendar td.sun {
  color: #f69;
  background: #fcc;
}

.calendar_table table.calendar .row {
  display: block;
  text-align: center;
  margin: 2px 0;
}

.pcolor01 {
  background: #fadce9;
}

.price_bold {
  color: #ff0000;
  font-weight: bold;
}

.pcolor02 {
  background: #e7d5e8;
}

.pcolor03 {
  background: #d2cce6;
}

.pcolor04 {
  background: #d3def1;
}

.pcolor05 {
  background: #d3edfb;
}

.pcolor06 {
  background: #d4ecea;
}

.pcolor07 {
  background: #d5ead8;
}

.pcolor08 {
  background: #ecf4d9;
}

.pcolor09 {
  background: #fffcdb;
}

.pcolor10 {
  background: #feecd2;
}

/******************　モーダル　*********************/
.remodal {
  border: 1px #ccc solid;
}

.modalSchedule,
.modalHotel {
  display: block;
  padding: 10px;
}

.modalHotel > .hotelBox {
  width: 95%;
  margin: 0 auto 10px;
  background: #fff;
  padding: 20px;
  border-radius: 5px;
}

.modalHotel > .hotelBox > table {
  width: 100%;
}

.modalHotel > .hotelBox h4 {
  font-weight: bold;
  border-bottom: 1px solid #ccc;
  padding: 0 0 3px;
  color: #2d93d3;
  font-size: 16px;
  margin: 0 0 10px 0;
}

.modalHotel > .hotelBox th {
  width: 320px;
  vertical-align: middle;
}

.modalHotel > .hotelBox .hotelBoxBtn {
  margin: 10px auto;
  text-align: center;
}

.modalSchedule > .modalCalendar {
  display: table;
  width: 100%;
  margin: 10px 0;
  text-align: center;
}

.modalSchedule > .modalCalendar > table.calendar {
  display: inline-table;
  margin: 10px 1%;
  text-align: center;
  width: 30%;
}

.modalSchedule > .modalCalendar > table.calendar th.calmonth {
  background: #f1eee7;
  color: #555;
  border: 1px #ccc solid;
  padding: 10px 0;
  font-weight: bold;
  text-align: center;
}

.modalSchedule > .modalCalendar > table.calendar td {
  border: 1px solid #cacaca;
  font-size: 12px;
  vertical-align: middle;
  width: 14%;
  padding: 2px;
  text-align: center;
}

.modalSchedule > .modalCalendar > table.calendar td.wday {
  background: #eee;
}

.modalSchedule > .modalCalendar > table.calendar td.sat {
  background: #d8ebfe;
  color: #109cd1;
}

.modalSchedule > .modalCalendar > table.calendar td.sun {
  background: #ffe1e2;
  color: #f03;
}

.modalSchedule > .modalCalendar > table.calendar td.cal {
  height: 20px;
}

.modalSchedule > .modalCalendar > table.calendar td.calday {
  background: #fffce0;
}

.square_btn {
  display: inline-block;
  padding: 1.5em 3.5em;
  text-decoration: none;
  background: #8da727;
  color: #ffffff;
  border-bottom: solid 4px #667f0a;
  border-radius: 3px;
}

.square_btn:active {
  -ms-transform: translateY(4px);
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  border-bottom: none;
}

.square_btn a {
  color: #ffffff;
}

#gPriceList {
  display: none;
}

.cstmTbl {
  width: 100%;
  margin: 10px 0 30px;
  border-top: 1px solid #ddd;
}

.cstmTbl th {
  background: #eee;
  text-align: left;
  border-bottom: 1px solid #ddd;
  vertical-align: middle;
  padding: 10px;
  font-weight: bold;
}

.cstmTbl td {
  border-bottom: 1px solid #ddd;
  vertical-align: middle;
  padding: 10px;
}

.subTitle {
  font-size: 2.143em;
  line-height: 1;
  padding: 0.25em 0.5em;
  border-left: solid 6px #0aa0e7;
  margin: 30px 0;
}

/*合宿テーブル*/
.cp2_table *,
.cp2_table *:before,
.cp2_table *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.cp2_table {
  margin: 10px auto;
  width: 100%;
  border-collapse: collapse;
}

.cp2_table th,
.cp2_table td {
  text-align: left;
  padding: 10px;
  border: 1px solid #dddddd;
}

.cp2_table th {
  width: 18%;
  text-align: left;
  background: #f4f4f4;
}

.cp2_table td {
  background: #ffffff;
}

@media only screen and (max-width: 799px) {
  .pc_lodge {
    display: none;
  }

  .smart_lodge {
    display: block;
  }

  /**-----------------------------------------
    料金プラン
------------------------------------------*/
  .priceTbl {
    display: none;
  }

  /**-----------------------------------------
    合宿料金プラン(スマホ)
------------------------------------------*/
  #gPriceList h3 {
    background: #ededed;
    font-weight: bold;
    padding: 10px;
    font-size: 18px;
    margin: 0;
  }

  #gPriceList dl dt th {
    font-size: 18px;
    font-weight: bold;
    text-align: left;
    padding: 0 0 0 10px;
    vertical-align: middle;
  }

  #gPriceList dl dt th span {
    font-size: 14px;
    margin: 3px 0;
    display: inline-block;
  }

  /******************　料金　*********************/
  #gPriceList {
    display: block;
  }

  #plan {
    line-height: 1.5;
    margin: 20px 0;
  }

  #plan dl.planAccordion {
    margin: 0 0 20px;
  }

  #plan dl.planAccordion > dt {
    padding: 10px 20px 10px 10px;
    color: #f00000;
    font-weight: bold;
    font-size: 22px;
    border-left: 1px solid #fff069;
    border-bottom: 1px solid #fff069;
    border-right: 1px solid #fff069;
    background: url(/img/close.png) no-repeat 98% 50%, rgb(255, 253, 233);
    -webkit-background-size: 23px 23px, auto auto;
  }

  #plan dl.planAccordion > dt.open {
    background: url(/img/open.png) no-repeat 98% 50%, rgb(255, 253, 233);
    -webkit-background-size: 23px 23px, auto auto;
  }

  #plan dl.planAccordion > dt span {
    font-size: 12px;
    display: inline-block;
    background: #f00000;
    padding: 2px 5px;
    vertical-align: text-top;
    color: #fff;
    margin: 0 5px 0 0;
  }

  #plan dl.planAccordion > dt span.sml {
    display: inline;
    background: none;
    padding: 0;
    color: #f00000;
    vertical-align: baseline;
  }

  #plan dl.planAccordion > dd {
    display: none;
  }

  #plan dl.planAccordion > dd > table.planData {
    width: 100%;
  }

  #plan dl.planAccordion > dd > table.planData tr.feeData {
    background: #d5efff;
    border-top: #fff solid 2px;
  }

  #plan dl.planAccordion > dd > table.planData tr.feeData th {
    padding: 10px;
    font-size: 0.9rem;
    font-weight: bold;
    text-align: left;
    vertical-align: middle;
    border: none;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td {
    color: #f00000;
    font-weight: bold;
    padding: 10px 0;
    font-size: 20px;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td span {
    font-size: 12px;
    font-weight: normal;
    color: #333;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td .fee {
    font-size: 1.2rem;
    font-weight: bold;
    color: #f00000;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td .tax {
    font-size: 0.7rem;
    font-weight: normal;
    color: #333;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td.planCp {
    background: #ffecef;
    padding: 10px;
    color: #333;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td.planCp h4 {
    font-weight: bold;
    font-size: 16px;
    margin: 0 0 5px;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td.planCp .date {
    font-size: 14px;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td.planCp .date span {
    background: #f66076;
    color: #fff;
    padding: 5px 10px;
    margin: 0 0 0 10px;
    font-weight: bold;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
  }

  #plan dl.planAccordion > dd table.planData tr.feeData td.planCp .cpPrice {
    color: #f00000;
    font-weight: bold;
    font-size: 22px;
  }

  #plan dl.planAccordion > dd table.planData tr.scheduleData > td {
    padding: 0;
  }

  #plan dl.planAccordion > dd > table.planData tr.hotelData {
    border-bottom: 1px solid #ccc;
  }

  #plan dl.planAccordion > dd > table.planData tr.hotelData td {
    padding-bottom: 10px;
  }

  #plan dl.scheduleAccordion,
  #plan dl.hotelAccordion {
    margin: 2px 0 15px;
  }

  #plan dl.scheduleAccordion > dt,
  #plan dl.hotelAccordion > dt {
    margin: 0;
    padding: 15px 10px;
    font-size: 16px;
    border: 1px solid #ccc;
    background: url(/img/close.png) no-repeat 98% 50%, #eee;
    -webkit-background-size: 23px 23px, auto auto;
  }

  #plan dl.scheduleAccordion > dt.open,
  #plan dl.hotelAccordion > dt.open {
    background: url(/img/open.png) no-repeat 98% 50%, #eee;
    -webkit-background-size: 23px 23px, auto auto;
  }

  #plan dl.scheduleAccordion > dd,
  #plan dl.hotelAccordion > dd {
    display: none;
  }

  #plan dl.scheduleAccordion > dd #calendar {
    padding: 5px 10px 5px;
  }

  #plan dl.hotelAccordion > dd .hotelBoxBtn {
    width: 100%;
    margin: 0 auto 10px;
    background: #eee;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 3px 0px #939393;
    text-align: center;
  }

  #plan dl.hotelAccordion > dd .hotelBoxBtn a {
    display: block;
    text-decoration: none;
    padding: 8px 0;
    font-weight: bold;
    font-size: 14px;
    color: #333;
  }

  table.calendar {
    width: 100%;
    margin: 5px 0 20px;
  }

  table.calendar th.calmonth {
    text-align: center;
    padding: 10px 0;
    border: #cacaca solid 1px;
    vertical-align: middle;
    background: #eee;
  }

  table.calendar td {
    border: #cacaca solid 1px;
    text-align: center;
    width: 14.5%;
    padding: 2px;
  }

  table.calendar td.calday {
    background: #efefef;
  }

  table.calendar td.cal {
    height: 20px;
  }

  table.calendar td.wday {
    background: #e4edff;
    height: 13px;
  }

  table.calendar td.sat {
    color: #09c;
    background: #cae6f7;
    height: 13px;
  }

  table.calendar td.sun {
    color: #f69;
    background: #fcc;
    height: 13px;
  }

  .pcolor01 {
    background: #fadce9;
  }

  .pcolor02 {
    background: #e7d5e8;
  }

  .pcolor03 {
    background: #d2cce6;
  }

  .pcolor04 {
    background: #d3def1;
  }

  .pcolor05 {
    background: #d3edfb;
  }

  .pcolor06 {
    background: #d4ecea;
  }

  .pcolor07 {
    background: #d5ead8;
  }

  .pcolor08 {
    background: #ecf4d9;
  }

  .pcolor09 {
    background: #fffcdb;
  }

  .pcolor10 {
    background: #feecd2;
  }

  /*宿泊施設*/
  .accordion_hotel {
    /*margin:0 0 30px 0;*/
  }

  .accordion_hotel dt {
    padding: 15px 20px 15px 10px;
    font-weight: bold;
    font-size: 16px;
    border-bottom: 1px solid #ddd;
    background: url(/img/close.png) no-repeat 98% 50%, #eee;
    -webkit-background-size: 35px 35px;
  }

  .accordion_hotel dt.open {
    background: url(/img/open.png) no-repeat 98% 50%, #eee;
    -webkit-background-size: 35px 35px;
  }

  .accordion_hotel dd {
    display: none;
  }

  .accordion_hotel dd.open {
    display: inline;
  }

  .accordion_hotel dd .loan {
    width: 95%;
    line-height: 1.5;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    margin: 10px auto 20px;
  }

  .accordion_hotel dd .loan div {
    background: #eee;
    padding: 10px;
    margin: 10px 0 0 0;
  }

  .accordion_hotel dd .loan div ul {
    border-bottom: 1px solid #ccc;
    padding: 0 0 5px;
    margin: 0 0 5px;
  }

  .accordion_hotel dd .loan div li {
    background: url(/img/smart/common/arw01.png) no-repeat 0 7px;
    -webkit-background-size: 5px 8px;
    font-weight: bold;
    padding: 0 0 0 10px;
  }

  #hotelInfo {
    background: #d5efff;
    padding: 20px 0;
    margin: 2px 0 10px;
  }

  #hotelInfo .hotelInfoBox {
    width: 95%;
    margin: 0 auto;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    background: #fff;
    padding: 15px 10px 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    line-height: 1.5;
    box-shadow: 0px 2px 0px #aaa;
  }

  #hotelInfo .hotelInfoBox + .hotelInfoBox {
    margin-top: 15px;
  }

  #hotelInfo .hotelInfoBox .hotelImg {
    padding: 0;
  }

  #hotelInfo .hotelInfoBox .hotelImg + .hotelImg {
    padding-top: 10px;
  }

  #hotelInfo .hotelInfoBox .hotelTxt {
    padding: 5px 0 0;
  }

  #hotelInfo .hotelInfoBox h3 {
    font-weight: bold;
    border-left: 5px solid #2d93d3;
    padding: 0 0 0 7px;
  }

  #hotelInfo .hotelInfoBox table {
    width: 100%;
    margin: 10px 0 0;
    border-bottom: 1px solid #ddd;
  }

  #hotelInfo .hotelInfoBox table th {
    border-top: 1px solid #ddd;
    padding: 5px;
    font-size: 12px;
    background: #eee;
  }

  #hotelInfo .hotelInfoBox table td {
    border-top: 1px solid #ddd;
    padding: 5px;
  }

  #hotelInfo .hotelInfoBox table td > ul.list {
    padding: 0;
  }

  #hotelInfo .hotelInfoBox table td > ul.list > li {
    display: inline-block;
    padding: 0 5px 0 0;
    margin: 0;
  }
}

/**-----------------------------------------
キャンペーンバナー
------------------------------------------*/
.campaignBanner {
  margin: 0.5rem 0;
}

.campaignBanner img {
  width: 100%;
}

.cpPlan {
  padding: 0.5rem;
  margin: 0;
  color: #333;
  background: url(/img/bg_point.png);
  border-bottom: 1px solid #fff069;
}

.cpPlan:first-child {
  border-top: 1px solid #fff069;
}

.cpPlan a {
  display: block;
  width: 100%;
  height: 100%;
  background: url(/img/arw_red.png) no-repeat 100% 50%;
  background-size: 35px 35px;
}

.cpPlan .cpPlanDate {
  font-size: 1rem;
  font-weight: bold;
  color: #814300;
  line-height: 100%;
}

.cpPlan .cpPrice {
  margin-top: 0.5rem;
  padding-right: 35px;
  width: 100%;
}

.cpPlan .cpPrice .lic {
  text-align: center;
  font-size: 1rem;
  font-weight: bold;
  color: #000;
  line-height: 100%;
}

.cpPlan .cpPrice .fee {
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  color: #ff0000;
  line-height: 100%;
}

.cpPlanCar .fee:before {
  content: "普通車AT";
  background: #fff069;
  margin-right: 0.5rem;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 0.8rem;
  color: #000;
  vertical-align: middle;
}

.cpPlanCarNenmatsu .fee:before {
  content: "普通車AT";
  background: #fff069;
  margin-right: 0.5rem;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 0.8rem;
  color: #000;
  vertical-align: middle;
}

.cpPlanCarShinsyun .fee:before {
  content: "普通車AT";
  background: #fff069;
  margin-right: 0.5rem;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 0.8rem;
  color: #000;
  vertical-align: middle;
}

.cpPlanBike .fee:before {
  content: "普通二輪MT";
  background: #fff069;
  margin-right: 0.5rem;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 0.8rem;
  color: #000;
  vertical-align: middle;
}

.cpPlanPro .fee:before {
  content: "大型一種";
  background: #fff069;
  margin-right: 0.5rem;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 0.8rem;
  color: #000;
  vertical-align: middle;
}

.cpPlan .cpPrice .fee .smallFont {
  font-size: 0.5em;
}

.cpPlan .cpPrice .tax {
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  color: #a10100;
  line-height: 100%;
}

.cpPlan .cpPrice .tax .smallFont {
  font-size: 0.6em;
}

.cpPlan .detail {
  font-size: 1rem;
  color: #00aeed;
  text-align: right;
  font-weight: bold;
}

.cpPlan .junchumtshoji {
  display: none;
}

@media (max-width: 879px) {
  .cpPlan .junchumtshoji {
    display: block;
    background: #fff069;
    margin-right: 0.5rem;
    padding: 0.5rem;
    font-weight: bold;
    font-size: 0.7rem;
    color: #000;
    vertical-align: middle;
    width: 110px;
  }
}

@media (min-width: 880px) {
  .cpPlan {
    margin: 0.5rem 0;
    padding: 1rem;
    width: 100%;
  }

  .cpPlan,
  .cpPlan:first-child {
    border: none;
  }

  .cpPlan:hover {
    opacity: 0.7;
  }

  .cpPlan a {
    background: none;
    text-decoration: none;
  }

  .cpPlan .cpPlanDate {
    position: absolute;
    vertical-align: top;
    font-size: 1.3rem;
    font-weight: bold;
    color: #814300;
    line-height: 100%;
  }

  .cpPlan .cpPrice {
    position: absolute;
    margin-top: 10px;
    width: 100%;
    text-align: center;
    padding-right: 0;
  }

  .cpPlan .cpPrice .lic {
    font-size: 1.3rem;
    font-weight: bold;
    color: #000;
    line-height: 100%;
  }

  .cpPlan .cpPrice .fee {
    font-size: 3rem;
    font-weight: bold;
    color: #ff0000;
    line-height: 100%;
  }

  .cpPlan .cpPrice .fee:before {
    display: none;
  }

  .cpPlan .cpPrice .fee .smallFont {
    font-size: 0.5em;
  }

  .cpPlan .cpPrice .tax {
    font-size: 1.5rem;
    font-weight: bold;
    color: #a10100;
    line-height: 100%;
  }

  .cpPlan .cpPrice .tax .smallFont {
    font-size: 0.6em;
  }

  .cpPlan .detail {
    display: none;
  }
}

@media only screen and (min-width: 800px) {
  .fac_txt,
  .fac_bg {
    width: 50%;
    float: left;
    display: table;
    height: 333px;
    /*background: #f6f6f6;*/
  }

  .fac_txt {
    text-align: center;
  }

  #sec02_02 {
    height: 500px;
  }

  #sec02_02 .fac_txt,
  #sec02_02 .fac_bg {
    float: right;
    margin-top: -15px;
  }

  .vMid {
    display: table-cell;
    padding: 0 50px;
    vertical-align: middle;
  }
}

/**-----------------------------------------
普通車免許キャンペーン
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanCar {
    background: url(/img/campaign/cp_car.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

/**-----------------------------------------
二輪免許キャンペーン
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanBike {
    background: url(/img/campaign/cp_bike.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

/**-----------------------------------------
プロ免許キャンペーン
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanPro {
    background: url(/img/campaign/cp_pro.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

/**-----------------------------------------
普通車免許キャンペーン（年末）
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanCarNenmatsu {
    background: url(/img/campaign/cp_car_nenmatsu.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

/**-----------------------------------------
二輪免許キャンペーン（年末年始&新春）
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanBikeNenmatsu {
    background: url(/img/campaign/cp_bike_nenmatsu.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

/**-----------------------------------------
プロ免許キャンペーン（年末年始&新春）
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanProNenmatsu {
    background: url(/img/campaign/cp_pro_nenmatsu.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

/**-----------------------------------------
普通車免許キャンペーン（新春）
------------------------------------------*/
@media (min-width: 880px) {
  .cpPlanCarShinsyun {
    background: url(/img/campaign/cp_car_shinsyun.png) no-repeat;
    height: 130px;
    background-size: contain;
  }
}

.infobox {
  width: 100%;
  position: relative;
  padding: 2.5em;
  margin-bottom: 30px;
  background: #f5f3e7;
}

.infobox p {
  font-size: 150%;
  margin: 0;
  padding: 0;
}

.blockB {
  overflow: hidden;
  zoom: 1;
  margin: 20px;
}

.blockB li {
  list-style: disc;
  margin-left: 18px;
}

.flow_box {
  background: #88c7ea;
  display: table;
  width: 100%;
  padding: 5px;
}

.flow_box .day {
  background-color: #fff;
  display: table-cell;
  width: 110px;
  vertical-align: middle;
  text-align: center;
  height: 100px;
}

.flow_box .day p {
  font-size: 20px;
  font-weight: bold;
  color: #008fd5;
  margin-bottom: 0;
  line-height: 1;
}

.flow_box .description {
  display: table-cell;
  vertical-align: middle;
  padding: 10px 20px;
}

.flow_box span {
  background: none;
  border: none;
  padding: 0;
  font-weight: bold;
  color: #173b7d !important;
  font-size: 20px;
  margin-bottom: 5px;
}

.flow_box .text {
  color: #fff;
  margin-bottom: 0;
  font-weight: bold;
  line-height: 18px;
}

.flow_box .notice {
  color: #ed1c24;
}

.flow_arrow {
  text-align: center;
  padding: 10px 0;
}

.flow_arrow img {
  display: inline;
}

.attention {
  position: relative;
  padding: 1rem 2rem;
  text-align: center;
  border: 3px solid #ff6565;
}

.attention:before {
  position: absolute;
  top: -24px;
  left: -3px;
  height: 26px;
  padding: 0 1em;
  content: "お知らせ";
  color: #fff;
  background: #ff6565;
}

.attention2 {
  position: relative;
  padding: 1rem 2rem;
  text-align: left;
  border: 3px solid #ff6565;
}

.attention2:before {
  position: absolute;
  top: -24px;
  left: -3px;
  height: 26px;
  padding: 0 1em;
  content: "お知らせ";
  color: #fff;
  background: #ff6565;
}

.notice {
  position: relative;
  padding: 20px;
}

.notice:before,
.notice:after {
  content: "";
  width: 20px;
  height: 30px;
  position: absolute;
  display: inline-block;
}

.notice:before {
  border-left: solid 1px #5767bf;
  border-top: solid 1px #5767bf;
  top: 0;
  left: 0;
}

.notice:after {
  border-right: solid 1px #5767bf;
  border-bottom: solid 1px #5767bf;
  bottom: 0;
  right: 0;
}

.notice p {
  margin: 5px 0;
  padding: 0;
}

table.bustime {
  width: 100%;
  margin-bottom: 30px;
}

table.bustime th,
table.bustime td {
  padding: 10px;
  border: 1px solid #ddd;
}

table.bustime th {
  background: #f4f4f4;
  width: auto;
  text-align: left;
}

table.bustime th.one {
  width: 50%;
}

table.bustime th.four {
  width: 20%;
}

@media only screen and (max-width: 480px) {
  table.bustime {
    margin: 0 auto;
  }

  table.bustime th,
  table.bustime td {
    width: 100%;
    display: block;
    border-top: none;
  }

  table.bustime tr:first-child th {
    border-top: 1px solid #ddd;
  }

  table.bustime th.one {
    width: 100%;
  }

  table.bustime th.four {
    width: 100%;
  }
}

/*TOP-PCR検査結果のお知らせ*/
ul.top_ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

ul.top_ul li {
  position: relative;
  padding: 0 0 0 2em;
  margin: 0;
}

ul.top_ul li::before {
  position: absolute;
  left: 0;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f00c";
  color: #00acdb;
}

.l-inner-sm {
  width: 100%;
  padding-right: 20px;
  padding-left: 20px;
}

.l-sec-t-md {
  margin-top: 10px;
}

@media print, screen and (min-width: 768px) {
  .l-inner,
  .l-inner-sm {
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  /*.l-inner-sm{max-width:800px}*/
  .l-sec-t-md {
    margin-top: 10px;
  }
}

@media print, screen and (min-width: 768px) {
  .l-inner,
  .l-inner-sm {
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  .l-inner-sm {
    max-width: 800px;
  }

  .l-sec-t-md {
    margin-top: 20px;
  }
}

.service-merit-wrap {
  padding-top: 3px;
  padding-bottom: 3px;
}

.service-merit {
  position: relative;
  margin: 30px 8px 5px;
  -webkit-box-shadow: 0 0 0 1px #33b3d1, 0 0 0 5px #fff, 0 0 0 8px #33b3d1;
  box-shadow: 0 0 0 1px #33b3d1, 0 0 0 5px #fff, 0 0 0 8px #33b3d1;
}

.service-merit:before {
  position: absolute;
  top: -33px;
  display: inline-block;
  width: 59px;
  height: 25px;
  margin-left: -30px;
}

.service-meritInfo {
  padding: 10px 15px 20px 15px;
}

.service-meritInfo_list li {
  font-size: 100%;
  line-height: 1.55;
  position: relative;
  padding-left: 2rem;
}

/*.service-meritInfo_list li:not(:last-child){margin-bottom:5px}*/
/*.service-meritInfo_list li:before{font-family:"Font Awesome 5 Free";position:absolute;left:0;content:'\f14a';color:#33B3D1}*/

@media print, screen and (min-width: 768px) {
  .service-merit {
    margin: 35px 0 10px 0;
  }

  .service-merit:before {
    top: -38px;
    width: 68px;
    height: 30px;
    margin-left: -34px;
    background-size: 68px 30px;
  }

  .service-meritInfo {
    max-width: 90%;
    margin: 0 auto;
    padding: 10px 0 20px;
    padding-bottom: 50px;
  }

  .service-meritInfo_list li {
    font-size: 95%;
    line-height: 1.55;
    padding-left: 1.5rem;
  }

  .service-meritInfo_list li:not(:last-child) {
    margin-bottom: 15px;
  }
}

.service-meritInfo_heading {
  margin-bottom: 15px;
  text-align: center;
}

.service-meritInfo_heading_text {
  font-size: 120%;
  font-weight: 700;
  line-height: 1.75;
  color: #33b3d1;
}

.service-meritInfo_heading_text:after,
.service-meritInfo_heading_text:before {
  font-size: 110%;
  font-weight: 400;
  display: inline-block;
  margin-left: 5px;
  content: "/";
}

.service-meritInfo_heading_text:before {
  margin-right: 5px;
  margin-left: 0;
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

.service-meritInfo_heading_title {
  font-size: 190%;
  font-weight: 700;
  line-height: 1.4;
  display: inline-block;
}

.service-meritInfo_heading_title span {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(70%, transparent),
    color-stop(70%, #ffff00)
  );
  background: -o-linear-gradient(transparent 70%, #ffff00 70%);
  background: linear-gradient(transparent 70%, #ffff00 70%);
}

@media print, screen and (max-width: 767.98px) {
  .service-meritInfo_heading {
    margin-bottom: 10px;
  }

  .service-meritInfo_heading_text {
    font-size: 110%;
    line-height: 1.4;
  }

  .service-meritInfo_heading_text:before {
    margin-right: 12px;
  }

  .service-meritInfo_heading_text:after {
    margin-left: 12px;
  }

  .service-meritInfo_heading_title {
    font-size: 180%;
  }
}

/*ワンデーサポートページ*/
.qr {
  float: left;
  width: 400px;
  max-width: 400px;
}

.qr_img {
  width: 185px;
  max-width: 185px;
  /*margin: 0 30px 0 100px;*/
  font-size: 80%;
}

.qr_img2 {
  width: 200px;
  max-width: 200px;
  font-size: 90%;
}

.oneday-order-accordion {
  display: block;
  text-align: center;
  margin: 20px;
}

.oneday-order-accordion button {
  font-size: 1.286em;
  width: 700px;
  height: 2.666em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #fa436e;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.oneday-order-accordion button,
[class*="btn-link"] a {
  line-height: 1;
  position: relative;
  display: inline-block;
  color: #fff;
  border: 0;
}

.oneday-order-accordion button::after,
.oneday-order-accordion button::before,
[class*="btn-link"] a::after {
  display: inline-block;
  content: "";
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
}

.oneday-order-accordion button::before {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1.85em;
  width: 1em;
  height: 1em;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  background-image: url(/img/svg/ico-chevron-right.svg);
  background-size: contain;
}

.oneday-order-accordion button {
  font-size: 1.286em;
  white-space: nowrap;
  letter-spacing: 0.05em;
}

.oneday-order-accordion button,
[class*="btn-link"] a {
  line-height: 1;
  color: #fff;
}

.oneday-order-accordion button:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  .jobFont {
    font-size: 20px;
  }

  .oneday-order-accordion {
    margin: 20px 0;
  }

  .oneday-order-accordion button {
    width: 100%;
    white-space: normal;
  }
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc_img {
  display: block !important;
}

.sp_img {
  display: none !important;
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
  .pc_img {
    display: none !important;
  }

  .sp_img {
    display: block !important;
  }
}

/* LINE */
.qr_line {
  width: 200px;
}

.line_info::before {
  position: relative;
  top: 0.2em;
  left: -0.5em;
  display: inline-block;
  width: 1px;
  height: 1.125em;
  content: "";
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  background: #000;
}

.line_info::after {
  position: relative;
  top: 0.2em;
  left: 0.5em;
  display: inline-block;
  width: 1px;
  height: 1.125em;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #000;
}

.btn_line {
  display: flex;
  margin: 0 auto;
  width: 770px;
}

@media only screen and (max-width: 480px) {
  .btn_line {
    display: block;
    width: 100%;
  }
}

.order-line_attend {
  display: block;
  text-align: center;
  margin: 0 20px 20px;
}

.order-line_attend button,
[class*="btn-link"] a {
  line-height: 1;
  position: relative;
  display: inline-block;
  color: #fff;
  border: 0;
}

.order-line_attend button {
  font-size: 1.1em;
  min-width: 240px;
  height: 2.3em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #f58e7e;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.order-line_attend button:before {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1.85em;
  width: 1em;
  height: 1em;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  background-image: url(/img/svg/ico-chevron-bottom-w.svg);
  background-size: contain;
}

.order-line_attend button:after,
.order-accordion button:before,
[class*="btn-link"] a:after {
  display: inline-block;
  content: "";
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
}

.order-line_lodge {
  display: block;
  text-align: center;
  margin: 0 20px 20px;
}

.order-line_lodge button,
[class*="btn-link"] a {
  line-height: 1;
  position: relative;
  display: inline-block;
  color: #fff;
  border: 0;
}

.order-line_lodge button {
  font-size: 1.1em;
  min-width: 240px;
  height: 2.3em;
  white-space: nowrap;
  letter-spacing: 0.05em;
  background: #8dcf3f;
  padding: 0.3em 3.5em;
  border-radius: 10em;
}

.order-line_lodge button:before {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1.85em;
  width: 1em;
  height: 1em;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  background-image: url(/img/svg/ico-chevron-bottom-w.svg);
  background-size: contain;
}

.order-line_lodge button:after,
.order-accordion button:before,
[class*="btn-link"] a:after {
  display: inline-block;
  content: "";
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
}

.order-line_lodge button:hover {
  cursor: pointer;
  opacity: 0.7;
}

.order-line_attend button:hover {
  cursor: pointer;
  opacity: 0.7;
}

/*フォトギャラリーボタン*/
.button_pg {
  max-width: 300px;
  margin: 0 auto;
  padding: 5px 0;
}
a.btn_pg {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40px;
  position: relative;
  background: #fff;
  border: 1px solid #000;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #000;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
}
a.btn_pg:before {
  content: "";
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 25px;
  margin-top: -6px;
}
a.btn_pg:hover {
  background: #000;
  color: #fff;
}
a.btn_pg:hover:before {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

/* ギャラリー */
.gallery-list {
  max-width: 1000px;
  width: 100%;
  margin-inline: auto;
  /* 以下gridレイアウト用 */
  display: grid;
  gap: 5px; /* 画像間の余白 */
  grid-auto-flow: dense; /* 隙間を埋めながら配置 */
  grid-template-columns: repeat(7, 1fr); /* カラム数を設定 */
}

.gallery-list img:nth-child(7n + 1) {
  grid-column: span 3;
  grid-row: span 2;
}
.gallery-list img:nth-child(7n + 2),
.gallery-list img:nth-child(7n + 3) {
  grid-column: span 4;
  grid-row: span 1;
}
.gallery-list img:nth-child(7n + 4) {
  grid-column: span 4;
  grid-row: span 2;
}
.gallery-list img:nth-child(7n + 5) {
  grid-column: span 4;
  grid-row: span 2;
}
.gallery-list img:nth-child(7n + 6) {
  grid-column: span 3;
  grid-row: span 1;
}
.gallery-list img:nth-child(7n + 7) {
  grid-column: span 3;
  grid-row: span 3;
}

/* アスペクト比設定 */
.gallery-list img {
  display: block;
  aspect-ratio: 300/200;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gallery-list img:first-child {
  aspect-ratio: 200/400;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gallery-list img:nth-child(7) {
  aspect-ratio: 200/300;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*----------------------------------------------------------------------

エポス特典　Level Style

----------------------------------------------------------------------*/
.level {
  width: 100%;
  margin: 0 auto 42px;
  border: 4px solid #11a0e5;
}

@media screen and (max-width: 960px) {
  .level {
    width: 96%;
    margin: 0 auto 42px;
  }
}

@media screen and (max-width: 480px) {
  .level {
    margin: 0 auto 32px;
  }
}

.level h3 {
  text-align: center;
  color: #ffffff;
  background: #11a0e5;
  padding: 16px 0 12px;
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 0;
}

@media screen and (max-width: 480px) {
  .level h3 {
    font-size: 20px;
  }
}

.level h3 span {
  background: #ffff00;
  color: #11a0e5;
  font-weight: normal;
  font-size: 16px;
  padding: 4px;
  position: relative;
  top: -3px;
  margin-right: 8px;
  line-height: 1;
}

.level h3 span.no_bg_color {
  background: none;
  color: white;
}

@media screen and (max-width: 480px) {
  .level h3 span {
    font-size: 14px;
    margin-right: 0;
    line-height: 1;
    margin-bottom: 12px;
  }
}

.level .level_inner {
  padding: 24px;
}

@media screen and (max-width: 480px) {
  .level .level_inner {
    padding: 20px;
  }
}

.level .level_inner h2 {
  background: #11a0e5;
  font-size: 16px;
  font-weight: normal;
  margin-bottom: 24px;
}

.level .level_inner .level_fee_box {
  background: #f2f2f2;
  margin-bottom: 20px;
}

.level .level_inner .level_fee_box h3 {
  background: #2f7db2;
  padding: 8px 0;
  margin-bottom: 0;
  color: #ffffff;
  text-align: center;
}

.level .level_inner .level_fee_box .fee_flexbox {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 480px) {
  .level .level_inner .level_fee_box .fee_flexbox {
    display: block;
  }
}

.level .level_inner .level_fee_box .fee_flexbox.padding_20px {
  padding: 20px;
}

.level .level_inner .level_fee_box .fee_flexbox div {
  width: 80%;
  padding: 4%;
  font-size: 1.3rem;
  font-weight: bold;
}

.level .level_inner .level_fee_box .fee_flexbox div.double_width {
  width: 66.6%;
}

@media screen and (max-width: 480px) {
  .level .level_inner .level_fee_box .fee_flexbox div.double_width {
    width: 100%;
    padding-bottom: 0;
  }
}

@media screen and (max-width: 480px) {
  .level .level_inner .level_fee_box .fee_flexbox div {
    width: 100%;
    padding: 5%;
  }
}

.level .level_inner .level_fee_box h4 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 0;
}

@media screen and (max-width: 700px) {
  .level .level_inner .level_fee_box h4 {
    font-size: 15px;
  }
}

.level .level_inner .level_fee_box h4.display_inline_block {
  display: inline-block;
}

.level .level_inner .level_fee_box h4.small {
  font-size: 16px;
}

.level .level_inner .level_fee_box h4 span {
  vertical-align: middle;
  font-size: 18px;
  font-weight: normal;
}

.level .level_inner .level_fee_box p {
  margin-bottom: 0;
}

.level .level_inner .level_fee_box p.fee {
  font-size: 38px;
  font-weight: bold;
  line-height: 1;
}

.level .level_inner .level_fee_box p.fee span {
  font-size: 16px;
  vertical-align: middle;
}

@media screen and (max-width: 700px) {
  .level .level_inner .level_fee_box p.fee {
    font-size: 32px;
    text-align: left;
  }

  .level .level_inner .level_fee_box p.fee span {
    font-size: 18px;
  }
}

.level .level_inner .level_fee_box p.display_inline_block {
  display: inline-block;
}

.level .level_inner .level_fee_box.margin_bottom_zero {
  margin-bottom: 0;
}

.level .level_inner h4.detail_title {
  border-top: 2px solid #11a0e5;
  border-bottom: 2px solid #11a0e5;
  padding: 8px 0;
  margin-bottom: 12px;
}

@media screen and (max-width: 700px) {
  .level {
    width: 94%;
  }
}

ol.epos {
  counter-reset: item;
  list-style-type: none;
  padding-left: 15px;
}

ol.epos ol {
  padding-left: 1em;
}

li.epos {
  text-indent: -1.3em;
  padding-left: 1.3em;
}

li.epos:before {
  counter-increment: item;
  content: counter(item) ".";
  /* 以下は自由に装飾... */
  padding-right: 0.5em;
  font-weight: bold;
  color: #b40000;
}

.epos img {
  width: 300px;
}

/*改行-PCで無効*/
.pc_hid {
  display: none;
}

/*改行-スマートフォンで有効*/
@media screen and (max-width: 768px) {
  .pc_hid {
    display: block;
  }

  .epos img {
    width: 95%;
  }
}

table.ep_tb01 {
  border-collapse: collapse;
  width: 100%;
}

.ep_tb01 th,
.ep_tb01 td {
  /*padding: 10px;
  border: solid 1px #ccc;*/
  text-align: left;
  box-sizing: border-box;
}

@media screen and (max-width: 640px) {
  .ep_tb01 {
    width: 100%;
  }

  table.ep_tb01 th,
  table.ep_tb01 td {
    display: block;
    width: 100%;
    border-bottom: none;
  }

  /*
  .ep_tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }
*/
}

/* 入校条件内部リンクボタン */
.carLink {
  font-size: 0.875em;
  max-width: 1024px;
  margin: 0 auto;
}

.carLink ul {
  text-align: center;
  letter-spacing: -0.4em;
}

.carLink ul li {
  display: inline-block;
  width: 50%;
  max-width: 311px;
  padding: 0 0.722em 0.3em;
  list-style: none;
  vertical-align: top;
  letter-spacing: 0;
}

.carLink ul li a {
  line-height: 1.2;
  display: block;
  padding: 0.66em;
  text-align: left;
  vertical-align: middle;
  border-radius: 0.3em;
  background: #d4f3fe;
  -webkit-box-shadow: 4px 4px 0 #7fd6f6;
  box-shadow: 4px 4px 0 #7fd6f6;
}

.carLink ul li a:before {
  font-size: 1.125em;
  position: relative;
  top: 0.15em;
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.25em;
  content: "";
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  border-radius: 10em;
  background-image: url(/img/svg/ico-arrow-right-outline.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

@media screen and (min-width: 768px) {
  .carLink ul li {
    width: 16%;
  }

  .carLink ul li a {
    text-align: center;
  }

  .carLink ul li a:hover {
    opacity: 0.8;
  }
}

/*ご注意ください！*/
.main_att01 {
  margin-top: 30px;
  padding: 30px 35px;
  border-radius: 10px;
  background: #fff98a;
  border: solid 5px #11a0e5;
  -webkit-box-shadow: inset 5px 5px 0 0 #fff, inset -5px -5px 0 0 #fff;
  /* Safari, Chrome用 */
  /* Firefox用 */
  box-shadow: inset 5px 5px 0 0 #fff, inset -5px -5px 0 0 #fff;
  /* CSS3 */
}

.main_att01 p {
  margin-bottom: 20px;
  text-align: center;
  color: #11a0e5;
  font-weight: bold;
  font-size: 1.5em;
}

.main_att01 ul li {
  list-style: none;
  text-indent: -1em;
  margin-left: 1em;
}

.main_att01 ul li:before {
  content: "";
  margin-right: 7px;
  width: 10px;
  /* 幅指定 */
  height: 10px;
  /* 高さ指定 */
  display: inline-block;
  /* インラインブロックにする */
  background-color: #11a0e5;
  /* 背景色指定 */
  border-radius: 50%;
  /* 要素を丸くする */
}
/* エポスの運転免許クレジット */
.epos_credit {
  width: 500px;
  margin: 0 auto;
}

.epos_credit_info::before {
  position: relative;
  top: 0.2em;
  left: -0.5em;
  display: inline-block;
  width: 1px;
  height: 1.125em;
  content: "";
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  background: #000;
}

.epos_credit_info::after {
  position: relative;
  top: 0.2em;
  left: 0.5em;
  display: inline-block;
  width: 1px;
  height: 1.125em;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #000;
}

@media screen and (max-width: 768px) {
  .epos_credit {
    width: 100%;
  }
}

/*初めての方へページの左右交互レイアウト*/
.imagebox {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-bottom: 40px;
}

.imagebox_text {
}

/*
h3 {
  font-size: 21px;
  margin: 0;
}
*/
.imagebox .pict {
  width: 80% !important;
  margin-left: 3%;
}

.pict img {
  width: 100%;
  height: auto;
}

.pict2 img {
  width: 32%;
  height: auto;
}

.imagebox:nth-child(even) {
  flex-direction: row-reverse;
}

.imagebox:nth-child(even) .imagebox_text {
  text-align: left;
}

.imagebox:nth-child(even) .pict {
  margin-left: 0;
  margin-right: 3%;
  width: 80% !important;
}

@media (max-width: 768px) {
  .imagebox {
    flex-direction: column;
  }

  .imagebox:nth-child(even) {
    flex-direction: column;
  }

  .imagebox_text {
    text-align: left;
  }

  .imagebox:nth-child(even) .imagebox_text {
    text-align: left;
  }

  .imagebox .pict {
    width: 100% !important;
    margin-left: 0;
    text-align: center;
  }

  .imagebox:nth-child(even) .pict {
    margin-left: 0;
    margin-right: 0%;
    width: 100% !important;
  }

  .pict img {
    width: 100%;
    height: auto;
  }

  .pict2 img {
    width: 100%;
    height: auto;
  }
}

/**-----------------------------------------
    出光特典
------------------------------------------*/
.noteList {
  margin: 15px;
}

.noteList li {
  padding-left: 1em;
}

.noteList li::marker {
  content: "※";
}

.noteList li .pointList {
  margin: 0;
}

.pointList li {
  padding-left: 1em;
}

.pointList li::marker {
  content: "・";
}

.infobox2 {
	margin: 2em auto;
	padding:1em 2em 1.5em;
	background-color: #EFE3DF;
	border-radius:1px;
}

.infobox2 .box-title {
	color:#AA8276;
	font-size: 1.4em;
	font-weight: bold;
}

.infobox2 .box-title:before {
	font-family: "Font Awesome 5 Free";
	content: "\f06a";
	font-size: 1em;
	margin: 0 3px 0 0;
	font-weight: bold;
}

/* 0223FV変更 */
@media (max-width: 768px) {
  #fv {
    margin: 45px 0 13% 0;
  }

  .main-swiper .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.5;
    margin: 0 4% !important;
	border: 1px solid #01aded;
    width: 8px;
    height: 8px;
  }

  .main-swiper .swiper-pagination-bullet-active {
    opacity: 1;
  }

  .main-swiper .swiper-pagination {
    bottom: 2% !important;
  }
  .campaign {
    background: #01aded;
    padding: 3% 2% 3%;
    text-align: center;
    color: white;
  }

  .campaign-school {
    font-size: 4.2vw;
    color: #333333;
    letter-spacing: 0.1em;
    background: white;
    display: inline-block;
    padding: 0 6% 0;
    border-radius: 4px;
  }

  .campaign-title {
    font-size: 7.8vw;
    font-weight: bold;
    line-height: 1.3;
    margin: 2% 0 0;
    text-shadow: 0px 3px 0px rgba(51, 51, 51, 0.2);
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }
  .campaign-title::before,
  .campaign-title::after {
    content: "";
    display: block;
    width: 1px;
    height: 3em;
    background: #fff;
    transform: rotate(-15deg);
  }

  .campaign-title::after {
    transform: rotate(15deg);
  }
  .campaign-date {
    font-size: 5.5vw;
    margin-bottom: 1%;
  }
  .campaign-date span {
    font-size: 6.5vw;
  }
  .cv {
    display: flex;
    justify-content: center;
    gap: 3%;
    padding: 3% 4%;
  }
  .cv-fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    display: none;
    background: white;
  }

  .cv-fixed.show {
    display: block;
  }
}

@media (min-width: 769px) {
  #fv {
    margin: 140px 0 60px;
  }
  .fv-main {
    position: relative;
    height: 29vw;
    background: #01aded;
  }
  .fv-main .fv-title {
    position: absolute;
    top: 1.5vw;
    left: 52%;
    transform: translateX(-100%);
    margin-left: -15%;
    width: 26%;
    z-index: 10;
  }

  .main-swiper {
    position: absolute;
    right: 11%;
    width: 56%;
  }
  .main-swiper .swiper-pagination-bullet {
    background: #fff;
    opacity: 0.5;
    margin: 0 15px !important;
	border: 1px solid #01aded;
	width: 12px;
	height: 12px;
  }

  .main-swiper .swiper-pagination-bullet-active {
    opacity: 1;
  }

  .main-swiper .swiper-pagination {
    bottom: 2% !important;
  }
  .campaign {
    background: #01aded;
    text-align: center;
    color: white;
    padding-bottom: 30px;
  }

  .campaign-school {
    font-size: 20px;
    color: #333333;
    letter-spacing: 0.1em;
    background: white;
    border-radius: 4px;
    width: 210px;
    margin: auto;
  }

  .campaign-title {
    font-size: 37px;
    font-weight: bold;
    margin: 5px 0 0;
    text-shadow: 0px 3px 0px rgba(51, 51, 51, 0.2);
    display: inline-flex;
    align-items: center;
    gap: 20px;
  }
  .campaign-title::before,
  .campaign-title::after {
    content: "";
    display: block;
    width: 1px;
    height: 70px;
    background: #fff;
    transform: rotate(-15deg);
  }

  .campaign-title::after {
    transform: rotate(15deg);
  }
  .campaign-date {
    font-size: 24px;
    margin: -10px 0 10px 0;
  }
  .campaign-date span {
    font-size: 34px;
  }
  .campaign img {
    width: 770px;
    height: auto;
  }
  .cv {
    display: flex;
    justify-content: center;
    gap: 50px;
    padding: 15px 0;
    width: 440px;
    margin: auto;
  }
  .cv-fixed {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    display: none;
    background: white;
  }
	
  .cv-fixed.show {
    /*display: flex;*/
  }
}

@media (min-width: 769px) {
  #navigation {
    /* 非表示状態のスタイル */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
    position: fixed;
    width: 100%;
    top: 72px;
    left: 0;
    z-index: 100;
    background: rgba(255, 255, 255, 0.9);
  }

  body.menu-fixed #navigation {
    /* 表示状態のスタイル */
    opacity: 1;
    visibility: visible;
  }

  #fv {
    margin: 0 0 60px;
	padding: 72px 0 0;
  }
}

/* PDGボタン */
.button_pdf {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 70%;
    margin: 0 auto;
    padding: .9em 2em .8em 45px;
    border: none;
    border-radius: 25px;
    box-shadow: 0 2px 3px rgb(0 0 0 / 30%), 0 2px 3px -2px rgb(0 0 0 / 20%);
    background-color: #FF570D;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    transition: transform .3s ease-in-out, box-shadow .3s ease-in-out;
}
@media screen and (max-width: 480px) {
	.button_pdf {
	    width: 90%;
	}
}

.button_pdf:hover {
	opacity: 0.8;
    /*transform: translateY(-1px);
    box-shadow: 0 15px 30px -5px rgb(0 0 0 / 20%), 0 0 5px rgb(0 0 0 / 10%);*/
}

.button_pdf::before {
    position: absolute;
    top: 0;
    left: 15px;
    width: 30px;
    height: 85%;
    background-color: #fff;
    clip-path: polygon(0 0, 0 100%, 50% 75%, 100% 100%, 100% 0);
    content: '';
}

.button_pdf::after {
    position: absolute;
    top: 33%;
    left: 30px;
    transform: translate(-50%, -50%);
    color: #FF570D;
    font-size: 1.2em;
    content: '★';
}

/* 250311追加 */
@media screen and (max-width: 768px) {
  .inner {
    width: 92%;
    margin: 0 auto;
  }
  #study {
    font-family: "Noto Sans JP", sans-serif;
    padding-top: 50px;
  }
  #study .study-list li {
    list-style: none;
    margin-bottom: 65px;
  }
  #study .study-list li .study-box {
    width: 84%;
    padding: 10px 20px;
    border: 1px solid #01aded;
    position: relative;
    line-height: 1.5;
    margin: 0 auto 12px;
    text-align: center;
  }
  #study .study-list li .study-box .type {
    background: #01aded;
    color: #fff;
    font-size: 16px;
    padding: 0 20px 1px;
    border-radius: 4px 4px 0 0;
    font-weight: 500;
    position: absolute;
    top: -26px;
    left: -1px;
  }
  #study .study-list li .study-box .title {
    font-size: 20px;
    font-weight: 400;
  }
  #study .study-list li .study-box::after {
    content: "";
    position: absolute;
    right: 60px;
    bottom: -18px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 18px 10px 0 10px;
    border-color: #ffffff transparent transparent transparent;
    z-index: 2;
  }
  #study .study-list li .study-box::before {
    content: "";
    position: absolute;
    right: 59px;
    bottom: -18px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 18px 10px 0 10px;
    border-color: #01aded transparent transparent transparent;
    z-index: 1;
  }
  #flow {
    font-family: "Noto Sans JP", sans-serif;
    background: #fffce1;
    padding: 40px 0 10px;
  }
  #flow .title {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
  }
  #flow .image {
    margin-top: 20px;
  }
  #flow .image img {
    width: 100%;
    margin-bottom: 10px;
  }
  #reason {
    font-family: "Noto Sans JP", sans-serif;
    padding: 50px 0 20px;
  }
  #reason .title {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
  }
  #reason .title .large {
    font-size: 38px;
  }
  #reason .reason-list li {
    list-style: none;
    margin-bottom: 40px;
  }
  #reason .reason-list li .reason-box {
    width: 100%;
    padding: 10px 0 7px;
    background: #01aded;
    color: #fff;
    border-radius: 4px;
    text-align: center;
  }
  #reason .reason-list li .reason-box .reason-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 10px;
  }
  #reason .reason-list li .reason-box .reason-title .number {
    font-family: "Helvetica Neue", sans-serif;
    font-size: 24px;
    color: #000;
    width: 32px;
    height: 32px;
    background: #fffd03;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #reason .reason-list li .reason-box .reason-title .type {
    font-size: 16px;
  }
  #reason .reason-list li .reason-box .reason-text {
    font-size: 22px;
    font-weight: bold;
  }
  #reason .reason-list li .reason-box .reason-text .large {
    font-size: 32px;
    margin: 0 5px;
    line-height: 1;
  }
  #reason .reason-list li p {
    font-size: 4.2vw;
    line-height: 2;
    padding: 12px 0 0 10%;
  }
  #reason .reason-list li p .blue {
    color: #01aded;
    font-weight: bold;
    position: relative;
  }
  #reason .reason-list li p .blue::before {
    content: url(/img/top/check.png);
    font-weight: 900;
    position: absolute;
    left: -1.5em;
    color: #01aded;
  }
  #reason .reason-list li .image.second {
    margin-top: -51vw;
  }
  #reason .reason-list li .image.third {
    width: 80%;
    margin: auto;
  }
  #reason .reason-list li .btn {
    font-size: 18px;
    font-weight: 500;
	color: #01aded;
    padding: 7px 0;
    border: 1px solid #01aded;
    border-radius: 30px;
    position: relative;
    width: 230px;
    margin: 20px auto 0;
	-webkit-box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
	box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
  }
  #reason .reason-list li .btn::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: #01aded;
    border-radius: 50%;
  }
  #reason .reason-list li .btn::before {
    content: "→";
    position: absolute;
    top: 50%;
    right: 22px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    color: #fff;
    font-size: 12px;
    z-index: 1;
  }
  #reason .reason-list li .btn2 {
    font-size: 1rem;
    font-weight: 500;
	color: #01aded;
    padding: 7px 0;
    border: 1px solid #01aded;
    border-radius: 30px;
    position: relative;
    width: 240px;
    margin: 20px auto 0;
	-webkit-box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
	box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
  }
  #reason .reason-list li .btn2::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: #01aded;
    border-radius: 50%;
  }
  #reason .reason-list li .btn2::before {
    content: "→";
    position: absolute;
    top: 50%;
    right: 22px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    color: #fff;
    font-size: 12px;
    z-index: 1;
  }
  #reason .reason-list li:first-child .box .reason-title .icon {
    width: 40px;
  }
  #reason .reason-list li:nth-child(2) .box .reason-title .icon {
    width: 25px;
  }
  #reason .reason-list li:last-child .box .reason-title .icon {
    width: 24px;
  }
  #school {
    font-family: "Noto Sans JP", sans-serif;
    text-align: center;
    background: #d5f4ff;
    padding: 30px 0 15px;
  }
  #school .title {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  #school .bg {
    background: #fff;
    padding: 25px 6% 15px;
  }
  #school .bg .name {
    font-size: 17px;
    font-weight: bold;
  }
  #school .bg .parking {
    font-size: 16px;
    font-weight: 500;
    color: #01aded;
	margin: 10px 0 20px;
  }
  #school .bg .car-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 6%;
    margin: 15px 0;
  }
  #school .bg .car-type li {
    list-style: none;
    width: 29%;
    font-size: 15px;
    color: #000;
    background: #d5f4ff;
    padding: 3px 0;
    border-radius: 4px;
    font-weight: 400;
    text-align: center;
  }
  #school .bg .evaluation-title {
    font-size: 18px;
    font-weight: 500;
  }
  #school .bg .evaluation {
  	display: block;
    margin: 5px 0 12px;
  }
  #school .bg .evaluation .star .material-symbols-sharp {
    color: #ebbf5a;
    font-size: 16px;
    margin-right: -6px;
    margin-top: 4px;
  }
  #school .bg .reviews-average {
	display: block;
  }
  #school .bg .reviews {
  	text-align: left;
  	padding-bottom: 10px;
  }
  #school .bg .reviews .reviews-img img {
  	width: 24%;
  }
  #school .bg .school-comment {
  	text-align: left;
  	background-color: #ffefcc;
    padding: 10px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
  }
  #school .bg .evaluation .number {
    font-size: 24px;
    font-weight: 500;
  }
  #school .bg .evaluation .number .small {
    font-size: 16px;
    font-weight: 400;
    margin-left: 5px;
  }
  #school .bg .baloon {
    font-size: 13px;
    background: #eff4f6;
    padding: 10px;
    position: relative;
    width: 90%;
    margin: auto;
  }
  #school .bg .baloon::after {
    content: "";
    position: absolute;
    bottom: -16px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 10px 0 10px;
    border-color: #eff4f6 transparent transparent transparent;
  }
  #school .bg .btn {
    font-size: 14px;
    font-weight: bold;
    padding: 20px 0;
    color: #01aded;
    border-radius: 30px;
    border: 1px solid #01aded;
    width: 90%;
    margin: 20px auto 30px;
    -webkit-box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
            box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
  }
  #school .bg .address-title {
    font-size: 14px;
    font-weight: 700;
    background: #01aded;
    color: #fff;
    border-radius: 4px;
    padding: 2px 0;
  }
  #school .bg .address {
    font-size: 14px;
    margin: 5px 0 10px;
    text-align: left;
  }
  #school .bg iframe {
    width: 100%;
    height: 275px;
    margin-top: 10px;
  }
  #school .bg .tel-text {
    font-size: 16px;
    margin: 20px 0 5px;
  }
  #school .bg .tel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 8px;
  }
  #school .bg .tel .tel-icon {
    width: 15px;
  }
  #school .bg .tel .tel-number {
    font-size: 30px;
    font-weight: bold;
  }
  #school .bg .tel-time {
    font-size: 16px;
    margin-top:15px;
  }
  #tv {
    font-family: "Noto Sans JP", sans-serif;
    padding: 60px 0;
  }
  #tv .title {
    width: 254px;
    margin: auto;
  }
  #tv .video-text {
    font-size: 22px;
    margin: 10px 0 5px;
    font-weight: bold;
    color: #01aded;
    text-align: center;
  }
  #tv video {
    width: 100%;
  }
  #license {
    font-family: "Noto Sans JP", sans-serif;
    text-align: center;
    padding-bottom: 40px;
  }
  #license .title {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 20px;
  }
  #license .license-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
  #license .license-list li {
    text-decoration: none;
    width: 48%;
    list-style: none;
  }
  #license .license-list li .license-title {
    font-size: 20px;
    margin-bottom: 5px;
  }
  #license .license-list li a .license-btn {
    font-size: 16px;
    background: #d5f4ff;
    padding: 10px 0;
    position: relative;
    border-bottom: 2px solid #01aded;
    margin-bottom: 10px;
  }
  #license .license-list li a .license-btn.camp {
    background: #fff;
    border-top: 1px solid #01aded;
    border-left: 1px solid #01aded;
    border-right: 1px solid #01aded;
    color: #01aded;
    font-weight: 500;
  }
  #license .license-list li a .license-btn::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 8px;
    border-color: transparent transparent transparent #01aded;
  }
}
@media screen and (min-width: 769px) {
  .inner {
    width: 770px;
    margin: 0 auto;
  }
  #study {
    font-family: "Noto Sans JP", sans-serif;
    padding: 80px 0 30px;
  }
  #study .inner {
    width: 728.5px;
  }
  #study .study-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 40px;
  }
  #study .study-list li {
    list-style: none;
    margin-bottom: 40px;
  }
  #study .study-list li .study-box {
    padding: 10px 20px;
    border: 1px solid #01aded;
    position: relative;
    line-height: 1.5;
    margin: 0 auto 12px;
    text-align: center;
  }
  #study .study-list li .study-box .type {
    background: #01aded;
    color: #fff;
    font-size: 16px;
    padding: 0 20px 1px;
    border-radius: 4px 4px 0 0;
    font-weight: 500;
    position: absolute;
    top: -26px;
    left: -1px;
  }
  #study .study-list li .study-box .title {
    font-size: 20px;
    font-weight: 400;
  }
  #study .study-list li .study-box::after {
    content: "";
    position: absolute;
    right: 60px;
    bottom: -18px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 18px 10px 0 10px;
    border-color: #ffffff transparent transparent transparent;
    z-index: 2;
  }
  #study .study-list li .study-box::before {
    content: "";
    position: absolute;
    right: 59px;
    bottom: -18px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 18px 10px 0 10px;
    border-color: #01aded transparent transparent transparent;
    z-index: 1;
  }
  #flow {
    font-family: "Noto Sans JP", sans-serif;
    background: #fffce1;
    padding: 40px 0;
  }
  #flow .inner {
    width: 740px;
  }
  #flow .title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
  }
  #flow .flow-image {
    width: 640px;
    margin: auto;
  }
  #flow .image {
    margin-top: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 20px;
  }
  #flow .image img {
    width: 360px;
  }
  #reason {
    font-family: "Noto Sans JP", sans-serif;
    padding: 80px 0 50px;
  }
  #reason .title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
  }
  #reason .title .large {
    font-size: 56px;
  }
  #reason .reason-list li {
    list-style: none;
    margin-bottom: 50px;
  }
  #reason .reason-list li .reason-box {
    width: 100%;
    padding: 15px 20px;
    background: #01aded;
    color: #fff;
    border-radius: 4px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #reason .reason-list li .reason-box .reason-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 10px;
    margin-right: 30px;
  }
  #reason .reason-list li .reason-box .reason-title .number {
    font-family: "Helvetica Neue", sans-serif;
    font-size: 24px;
    color: #000;
    width: 32px;
    height: 32px;
    background: #fffd03;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  #reason .reason-list li .reason-box .reason-title .type {
    font-size: 18px;
  }
  #reason .reason-list li .reason-box .reason-text {
    font-size: 26px;
    font-weight: bold;
    margin: 5px 0;
  }
  #reason .reason-list li .reason-box .reason-text .large {
    font-size: 40px;
    margin: 0 4px;
    line-height: 1;
  }
  #reason .reason-list li .reason-content {
    padding: 20px 0 0 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  #reason .reason-list li .reason-content p {
    font-size: 20px;
    line-height: 1.7;
  }
  #reason .reason-list li .reason-content p .blue {
    color: #01aded;
    font-weight: bold;
    position: relative;
  }
  #reason .reason-list li .reason-content p .blue::before {
    content: url(/img/top/check.png);
    font-weight: 900;
    position: absolute;
    left: -1.5em;
    color: #01aded;
  }
  #reason .reason-list li .reason-content .image {
    width: 315px;
  }
  #reason .reason-list li .reason-content .image.second {
    width: 344px;
    margin-top: -80px;
  }
  #reason .reason-list li .reason-content .image.third {
    width: 254px;
  }
  #reason .reason-list li .btn {
    font-size: 15px;
    font-weight: 500;
	color: #01aded;
    padding: 10px 0;
    border: 1px solid #01aded;
    border-radius: 30px;
    position: relative;
    width: 260px;
    margin: 20px auto 0;
    text-align: left;
    padding-left: 60px;
	-webkit-box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
	box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
  }
  #reason .reason-list li .btn::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 45px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: #01aded;
    border-radius: 50%;
  }
  #reason .reason-list li .btn::before {
    content: "→";
    position: absolute;
    top: 50%;
    right: 50px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    color: #fff;
    font-size: 12px;
    z-index: 1;
  }
  #reason .reason-list li .btn2 {
    font-size: 1rem;
    font-weight: 500;
	color: #01aded;
    padding: 10px 0;
    border: 1px solid #01aded;
    border-radius: 30px;
    position: relative;
    width: 260px;
    margin: 20px auto 0;
    text-align: left;
    padding-left: 50px;
	-webkit-box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
	box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
  }
  #reason .reason-list li .btn2::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 45px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: #01aded;
    border-radius: 50%;
  }
  #reason .reason-list li .btn2::before {
    content: "→";
    position: absolute;
    top: 50%;
    right: 50px;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    color: #fff;
    font-size: 12px;
    z-index: 1;
  }
  #reason .reason-list li:first-child .box .reason-title .icon {
    width: 40px;
  }
  #reason .reason-list li:nth-child(2) .box .reason-title .icon {
    width: 25px;
  }
  #reason .reason-list li:last-child .box .reason-title .icon {
    width: 24px;
  }
  #school {
    font-family: "Noto Sans JP", sans-serif;
    text-align: center;
    background: #d5f4ff;
    padding: 30px 0 50px;
  }
  #school .title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 10px;
  }
  #school .bg {
    background: #fff;
    padding: 30px 65px;
  }
  #school .bg .name {
    font-size: 24px;
    font-weight: bold;
  }
  #school .bg .parking {
    font-size: 20px;
    font-weight: 500;
    color: #01aded;
    margin: 10px 0 20px;
  }
  #school .bg .car-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    margin: 15px 0;
  }
  #school .bg .car-type li {
    width: 116px;
    list-style: none;
    font-size: 15px;
    color: #000;
    background: #d5f4ff;
    padding: 3px 0;
    border-radius: 4px;
    font-weight: 400;
    text-align: center;
  }
  #school .bg .evaluation-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 530px;
    margin: 0 auto 40px;
  }
  #school .bg .evaluation-title {
    font-size: 24px;
    font-weight: 500;
  }
  #school .bg .evaluation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: block;
    text-align: left;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 10px;
    margin: 5px 0 0;
  }
  #school .bg .reviews-average {
	display: flex;
  }
  #school .bg .reviews-average .star {
	width: 90px;
  }
  #school .bg .evaluation .star .material-symbols-sharp {
    color: #ebbf5a;
    font-size: 16px;
    margin-right: -6px;
    margin-top: 4px;
  }
  #school .bg .reviews {
  	text-align: left;
  	padding-bottom: 10px;
  }
  #school .bg .school-comment {
  	text-align: left;
  	background-color: #ffefcc;
    padding: 10px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
  }
  #school .bg .reviews .reviews-img img {
  	width: 24%;
  }
  #school .bg .evaluation .number {
    font-size: 24px;
    font-weight: 500;
  }
  #school .bg .evaluation .number .small {
    font-size: 16px;
    font-weight: 400;
    margin-left: 5px;
  }
  #school .bg .evaluation-block .evaluation-right {
    width: 280px;
  }
  #school .bg .baloon {
    font-size: 13px;
    background: #eff4f6;
    padding: 10px;
    position: relative;
  }
  #school .bg .baloon::after {
    content: "";
    position: absolute;
    bottom: -16px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 10px 0 10px;
    border-color: #eff4f6 transparent transparent transparent;
  }
  #school .bg .btn {
    font-size: 14px;
    font-weight: bold;
    padding: 20px 0;
    color: #01aded;
    border-radius: 35px;
    border: 1px solid #01aded;
    margin: 20px 0;
    -webkit-box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
            box-shadow: 0 4px 0 0 rgba(51, 51, 51, 0.2);
  }
  #school .bg .address-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  #school .bg .address-list .address-block {
    width: 300px;
  }
  #school .bg .address-list .address-block .address-title {
    font-size: 14px;
    font-weight: 700;
    background: #01aded;
    color: #fff;
    border-radius: 4px;
    padding: 2px 0;
  }
  #school .bg .address-list .address-block .address {
    font-size: 16px;
    margin: 5px 0 10px;
    text-align: left;
  }
  #school .bg iframe {
    width: 100%;
    height: 354px;
    margin: 5px 0 10px;
  }
  #school .bg .tel-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 500px;
    margin: auto;
  }
  #school .bg .tel-block .tel-text {
    font-size: 18px;
    text-align: left;
  }
  #school .bg .tel-block .tel-info .tel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 8px;
    padding-top: 20px;
  }
  #school .bg .tel-block .tel-info .tel .tel-icon {
    width: 15px;
  }
  #school .bg .tel-block .tel-info .tel .tel-number {
    font-size: 30px;
    font-weight: bold;
    line-height: 1.2;
  }
  #school .bg .tel-block .tel-info .tel-time {
    font-size: 16px;
	letter-spacing: 2px;
   margin-top:15px;
	margin-left: 30px
  }
  #tv {
    font-family: "Noto Sans JP", sans-serif;
    padding: 120px 0;
  }
  #tv .inner {
    width: 930px;
  }
  #tv .title {
    width: 830px;
    margin: auto;
  }
  #tv .video-text {
    font-size: 40px;
    margin: 20px 0;
    font-weight: bold;
    color: #01aded;
    text-align: center;
  }
  #tv video {
    width: 100%;
  }
  #license {
    font-family: "Noto Sans JP", sans-serif;
    text-align: center;
    padding-bottom: 60px;
  }
  #license .inner {
    width: 900px;
  }
  #license .title {
    font-size: 48px;
    font-weight: bold;
    margin-bottom: 20px;
  }
  #license .license-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 30px;
  }
  #license .license-list li {
    text-decoration: none;
    width: 280px;
    list-style: none;
    margin-bottom: 0;
  }
  #license .license-list li .license-title {
    font-size: 28px;
    margin-bottom: 5px;
  }
  #license .license-list li a .license-btn {
    font-size: 20px;
    background: #d5f4ff;
    padding: 10px 0;
    position: relative;
    border-bottom: 2px solid #01aded;
    margin-bottom: 10px;

  }
  #license .license-list li a .license-btn.camp {
    background: #fff;
    border-top: 1px solid #01aded;
    border-left: 1px solid #01aded;
    border-right: 1px solid #01aded;
    color: #01aded;
    font-weight: 500;
  }
  #license .license-list li a .license-btn::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 9px 0 9px 10px;
    border-color: transparent transparent transparent #01aded;
  }
  #license .license-list li a:hover {
    color: #000;
  }
}

/* パンフレットボタン */
.button_pamphlet {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 70%;
    margin: 0 auto;
    padding: .9em 2em .8em 45px;
    border: none;
    border-radius: 25px;
    box-shadow: 0 2px 3px rgb(0 0 0 / 30%), 0 2px 3px -2px rgb(0 0 0 / 20%);
    background-color: #1c96d4;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    transition: transform .3s ease-in-out, box-shadow .3s ease-in-out;
}
@media screen and (max-width: 480px) {
	.button_pamphlet {
	    width: 90%;
	}
}

.button_pamphlet:hover {
	opacity: 0.8;
    /*transform: translateY(-1px);
    box-shadow: 0 15px 30px -5px rgb(0 0 0 / 20%), 0 0 5px rgb(0 0 0 / 10%);*/
}

.button_pamphlet::before {
    position: absolute;
    top: 0;
    left: 15px;
    width: 30px;
    height: 85%;
    background-color: #fff;
    clip-path: polygon(0 0, 0 100%, 50% 75%, 100% 100%, 100% 0);
    content: '';
}

.button_pamphlet::after {
    position: absolute;
    top: 33%;
    left: 30px;
    transform: translate(-50%, -50%);
    color: #1c96d4;
    font-size: 1.2em;
    content: '★';
}

.min_sp {
	display: none;
}

@media screen and (max-width: 350px) {
	.min_sp {
		display: block;
	}
}

.star-large {
	font-size: 24px !important;
}

/* 普通車MTカリキュラム変更 */
.flow_design05 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flow05 {
  padding-left: 0;
}

.flow05 > li {
  list-style-type: none;
  position: relative;
  padding-left: 50px;
}

.flow05 > li:not(:last-child) {
  padding-bottom: 10px;
}

.flow05 > li .icon05 {
  width: 2em;
  height: 2em;
  line-height: 2em;
  text-align: center;
  border-radius: 100vh;
  display: inline-block;
  background: #4D9BC1;
  color: #fff;
  position: absolute;
  left: 0;
}

.flow05 > li:not(:last-child)::before {
  content: '';
  background: #c3c3c3;
  width: 4px;
  height: 100%;
  position: absolute;
  top: calc(50% - -30px);
  left: 24px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}

.flow05 > li dl dt {
  font-size: 1.3em;
  font-weight: 600;
  color: #4D9BC1;
  padding-left: 20px;
}

.flow05 > li dl dd {
  margin-left: 0;
}

@media screen and (max-width:768px) {
	.flow05 > li:not(:last-child)::before {
	  left: 6%;
	}
}

/* 福生駅ルート */
.reason-map {
	padding-top: 20px;
}

.reason-timetable {
	padding-top: 20px;
}

.reason-timetable table {
	width: 100%;
    table-layout: fixed;
}

.reason-timetable table th {
  background: #f4f4f4;
  width: 30%;
  text-align: left;
}
.reason-timetable table th, .reason-timetable table td {
  padding: 10px;
  border: 1px solid #ddd;
}

/* スライド(main) */
.slider-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 1000px;
  margin: 30px auto;
  background: white;
}

.slider {
  display: flex;
  transition: transform 0.5s ease;
  gap: 20px;
  padding: 20px;
}

.card {
  flex: 0 0 80%;
  box-sizing: border-box;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  text-align: center;
  overflow: hidden;
}

.card img {
  width: 100%;
  height: 700px;
  object-fit: cover;
}

.text {
  padding: 20px;
}

.text h3 {
  margin-top: 0;
}

.arrow {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  font-size: 30px;
  background: rgba(0,0,0,0.6);
  color: white;
  border: none;
  padding: 10px;
  cursor: pointer;
  z-index: 10;
  border-radius: 50%;
}

.arrow.left {
  left: 10px;
}

.arrow.right {
  right: 10px;
}

.dots {
  text-align: center;
  margin: 10px 0;
}

.dot {
  display: inline-block;
  height: 12px;
  width: 12px;
  margin: 0 4px;
  background-color: #bbb;
  border-radius: 50%;
  cursor: pointer;
}

.dot.active {
  background-color: #f90;
}

@media screen and (max-width: 768px) {
  .card {
    flex: 0 0 90%;
  }

  .card img {
    height: 60%;
  }
}

@media screen and (max-width: 480px) {
  .card {
    flex: 0 0 95%;
  }
}

.more-info-section {
  background-color: #f5f5f5;
  padding: 60px 0;
  width: 100%;
}

.more-info-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px; /* モバイルでもはみ出さない余白 */
  text-align: center;
}

.more-info-container h2 {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 40px;

}

.more-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}

.info-card {
  background-color: #fff;
  border-radius: 16px;
  padding: 24px 16px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: transform 0.2s ease;
}

.info-card:hover {
  transform: translateY(-4px);
}

.info-card img {
  width: 64px;
  height: 64px;
  margin-bottom: 16px;
}

.info-card p {
  font-size: 1rem;
  font-weight: bold;
  color: #333;
  margin-bottom: 12px;

}

.arrow {
  font-size: 1.2rem;
  color: #333;

}

@media (max-width: 480px) {
  .more-info-grid {
    grid-template-columns: 1fr; /* モバイルは1列で強制 */
  }

  .more-info-container {
    padding: 0 12px; /* さらに内側の余白を縮めると安心 */
  }
}

/* 教習料金アコーディオン */
.plans-accordion-container {
  max-width: 600px;
  margin: 0 auto;
}

.plans-accordion-item {
  margin-bottom: 10px;
}

.plans-accordion-toggle {
  display: none;
}

.plans-accordion-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #00A3E0;
  color: #fff;
  padding: 15px 20px;
  font-size: 1.1rem;
  font-weight: bold;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s;
  position: relative;
}

.plans-accordion-label::after {
  content: "▶";
  font-size: 1rem;
  margin-left: 10px;
  transition: transform 0.3s;
}

.plans-accordion-toggle:checked + .plans-accordion-label::after {
  content: "▼";
}

.plans-accordion-label:hover {
  background-color: #00A3E0;
}

.plans-accordion-content {
  max-height: 0;
  overflow: hidden;
  background-color: #fffaf0;
  border: 1px solid #B3E5F6;
  border-radius: 5px;
  padding: 0 15px;
  transition: max-height 0.4s ease, padding 0.4s ease;
  box-sizing: border-box;
}

.plans-accordion-toggle:checked + .plans-accordion-label + .plans-accordion-content {
  max-height: 1000px;
  padding: 10px 15px;
}

.plans-accordion-content .fee-box {
  margin-bottom: 15px;
  padding: 10px;
  background-color: #fef7e0;
  border-radius: 5px;
  border-left: 5px solid #d4a017;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.plans-accordion-content .license-type {
  font-weight: 600;
  margin-bottom: 5px;
  color: #5b4a00;
}

.plans-accordion-content .fee-info .fee {
  font-size: 1.2rem;
  font-weight: bold;
  color: #d9534f;
  margin-right: 10px;
}

.plans-accordion-content .fee-info .tax {
  font-size: 0.9rem;
  color: #777;
  margin-left: 5px;
}

.plans-accordion-content .fee-info .detail-link {
  padding: 5px 10px;
  background-color: #6d5900;
  color: #fff;
  text-decoration: none;
  font-size: 0.85rem;
  border-radius: 5px;
  transition: background-color 0.3s;
  white-space: nowrap;
}

.plans-accordion-content .fee-info .detail-link:hover {
  background-color: #8c7200;
}

@media (max-width: 480px) {
  .plans-accordion-content .fee-box {
    flex-direction: column;
    align-items: flex-start;
  }

  .plans-accordion-content .fee-info .fee {
    margin-bottom: 5px;
  }

  .plans-accordion-content .fee-info .detail-link {
    margin-top: 5px;
  }
}

@media (max-width: 325px) {
	.plans-accordion-content .fee-box {
		padding: 5px;
	}
}

/* 通学・合宿タブ切り替え */
.tab-container {
  max-width: 1024px;
  margin: 0 auto;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.tab-container input[type="radio"] {
  display: none;
}

.tab-container .tab-labels {
  display: flex;
  background: #e6f5ff;
}

.tab-container .tab-labels label {
  flex: 1;
  text-align: center;
  padding: 12px;
  font-weight: bold;
  cursor: pointer;
  color: #007dc4;
  background: #e6f5ff;
  transition: all 0.3s ease;
}

/* ✅ 選択中のタブを青背景＋白文字に */
#tab1:checked ~ .tab-labels label[for="tab1"],
#tab2:checked ~ .tab-labels label[for="tab2"] {
  background: #00a1e9;
  color: white;
  border-bottom: none;
}

.tab-container .tab-content {
  display: none;
  padding: 10px;
  background: #ffffff;
}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2 {
  display: block;
}