.page__header {
  margin: 0 0 40px;
}
.page__header .breadcrumb {
  margin: 0 0 0 40px;
  padding: 16px 0;
}
.page__header .breadcrumb ol {
  display: flex;
}
.page__header .breadcrumb ol li {
  font-size: 0.75em;
}
.page__header .breadcrumb ol li a {
  color: #222;
}
.page__header .breadcrumb ol li:before {
  content: "-";
  padding: 0 16px;
}
.page__header .breadcrumb ol li:first-child:before {
  content: none;
}

.page__primary {
  padding: 0 0 96px 0;
  color: #707070;
}
.page__primary--ttl {
  font-size: 1.5em;
  margin: 0 0 24px;
}
.page__primary--ttl.faq {
  font-size: 1.75em;
}
.page__primary--text {
  line-height: 2;
}
.page__primary .caption {
  font-size: 0.875em;
  margin: 16px 0 0;
}

@media screen and (max-width: 767px) {
  .page__header {
    margin: 0;
  }
  .page__header .breadcrumb {
    margin: 0 0 0 16px;
  }
  .page__primary {
    padding: 0 0 40px 0;
  }
  .page__primary--ttl {
    font-size: 1.5em;
    margin: 0 0 24px;
  }
  .page__primary--ttl.faq {
    font-size: 1.5em;
  }
  .page__primary--text {
    font-size: 1em;
  }
  .page__primary--text br {
    display: none;
  }
  .page__primary .caption {
    font-size: 0.75em;
  }
}
.page__link {
  padding: 40px 0;
}
.page__link ul {
  display: flex;
  justify-content: center;
}
.page__link ul li {
  margin: 0 40px;
}
.page__link ul li a {
  color: #707070;
  display: block;
  position: relative;
  padding: 0 24px 0 0;
}
.page__link ul li a:after {
  content: "";
  width: 4px;
  height: 4px;
  border-right: 1px solid #707070;
  border-top: 1px solid #707070;
  position: absolute;
  right: 4px;
  top: 50%;
  margin-top: -2px;
  transform: rotate(45deg);
  top: 45%;
  transform: rotate(135deg);
}

.page__container {
  padding: 64px 0 80px;
}

.about__section {
  color: #707070;
  margin-bottom: 120px;
  position: relative;
}
.about--en {
  font-weight: bold;
  letter-spacing: 2px;
  line-height: 1;
  font-family: "Lato", sans-serif;
  font-size: 7.5em;
  color: #ddd;
  display: block;
  margin: 0 0 24px;
}
.about--ttl {
  font-size: 2em;
  font-weight: bold;
  margin: 0 0 64px;
}
.about--sub-ttl {
  font-size: 1.25em;
  margin: 32px 0;
}
.about p {
  line-height: 2;
  margin-bottom: 16px;
}
.about .photo__layout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 120px;
}
.about .photo__layout figure {
  width: 35%;
}
.about .photo__layout .text {
  width: 60%;
}

.attention__header {
  background: url(../../images/about/attention.jpg) no-repeat 0 50%;
  background-size: 50% auto;
}
.attention__header .text {
  width: 35%;
  margin-left: 55%;
  padding: 10% 0;
}
.attention__body {
  padding: 120px 0 0;
}
.attention--block {
  margin: 40px 0 0;
  padding: 40px 24px 0;
  border-top: 1px solid #A0A0A0;
}
.attention--block:first-child {
  margin: 0;
}
.attention--block .ttl {
  font-size: 1.25em;
  margin: 0 0 24px;
}
.attention--block .lst {
  margin: 24px 0 0;
}
.attention--block .lst li {
  padding-left: 1em;
  text-indent: -1em;
}
.attention--group {
  margin: 0 0 24px;
}
.attention--group h4 {
  margin: 0 0 8px;
}
@media screen and (max-width: 767px) {
  .page__link {
    padding: 24px 0;
    margin: 0 16px;
  }
  .page__link ul {
    justify-content: space-between;
  }
  .page__link ul li {
    margin: 0;
    width: 30%;
  }
  .page__link ul li a {
    display: block;
    font-size: 0.75em;
    padding: 8px 0;
    border-bottom: 1px solid #A0A0A0;
  }
  .page__container {
    padding: 40px 0 0;
  }
  .about__section {
    color: #707070;
    margin-bottom: 80px;
    position: relative;
  }
  .about--en {
    font-size: 2.5em;
    margin: 0 0 8px;
  }
  .about--ttl {
    font-size: 2em;
    font-weight: bold;
    margin: 0 0 40px;
  }
  .about--sub-ttl {
    font-size: 1.25em;
    margin: 32px 0;
  }
  .about--sub-ttl span {
    display: block;
  }
  .about p {
    font-size: 0.875em;
  }
  .about .photo__layout {
    display: block;
    margin-bottom: 40px;
  }
  .about .photo__layout figure {
    width: auto;
  }
  .about .photo__layout .text {
    width: auto;
  }
  .attention__header {
    background: url(../../images/about/attention.jpg) no-repeat 50% 0;
    background-size: 100% auto;
    padding-top: 100%;
  }
  .attention__header .text {
    width: auto;
    margin: 0 16px;
    padding: 10% 0 0 0;
  }
  .attention__header .text p {
    font-size: 0.875em;
  }
  .attention__body {
    padding: 40px 0 0;
  }
  .attention--block {
    margin: 40px 0 0;
    padding: 40px 0 0;
  }
  .attention--block .ttl {
    font-size: 1em;
    margin: 0 0 16px;
  }
  .attention--block .lst {
    margin: 16px 0 0;
  }
  .attention--block .lst li {
    font-size: 0.875em;
    margin: 0 0 8px;
  }
}
.course__container {
  padding: 80px 0;
}

.course_page_nolink {
  display: none;
}

.course__body {
  margin: 48px 0;
}
.course__body .ttl {
  font-size: 1.75em;
  border-bottom: 1px solid #A0A0A0;
  margin: 0 0 24px;
  padding: 0 0 8px;
}
.course__body .description {
  padding: 48px 5% 96px;
  display: flex;
  justify-content: space-between;
}
.course__body .description .figure {
  width: 35%;
}
.course__body .description .figure ol li {
  background: #484848;
  color: #fff;
  text-align: center;
  padding: 8px 0;
  font-size: 1em;
  margin: 40px 0 0;
  position: relative;
}
.course__body .description .figure ol li:before {
  position: absolute;
  top: -28px;
  left: 50%;
  content: "";
  width: 10px;
  height: 16px;
  margin-left: -5px;
  background: url(../../images/course/arrow.png) no-repeat 50% 50%;
  background-size: 100% auto;
}
.course__body .description .figure ol li:first-child {
  margin: 0 0 0;
}
.course__body .description .figure ol li:first-child:before {
  content: none;
}
.course__body .description .text {
  width: 57.5%;
  line-height: 2;
  color: #707070;
}

.course__footer p {
  text-align: center;
  color: #707070;
  border-top: 1px solid #484848;
  border-bottom: 1px solid #484848;
  font-size: 1.5em;
  padding: 48px 0;
}

@media screen and (max-width: 767px) {
  .course__container {
    padding: 40px 0;
  }
  .course__body {
    margin: 40px 0;
  }
  .course__body .ttl {
    font-size: 1.5em;
    margin: 0 0 8px;
  }
  .course__body .description {
    padding: 24px 0;
  }
  .course__body .description .figure {
    width: 42.5%;
  }
  .course__body .description .figure ol li {
    background: #484848;
    color: #fff;
    text-align: center;
    padding: 8px 0;
    font-size: 0.875em;
    margin: 15% 0 0;
    position: relative;
  }
  .course__body .description .figure ol li:before {
    position: absolute;
    top: -55%;
    left: 50%;
    content: "";
    width: 10px;
    height: 16px;
    margin-left: -5px;
    background: url(../../images/course/arrow.png) no-repeat 50% 50%;
    background-size: 100% auto;
  }
  .course__body .description .figure ol li:first-child {
    margin: 0 0 0;
  }
  .course__body .description .figure ol li:first-child:before {
    content: none;
  }
  .course__body .description .text {
    width: 52.5%;
    font-size: 0.875em;
  }
  .course__body .description .text br {
    display: none;
  }
  .course__footer p {
    font-size: 1em;
    padding: 24px 0;
  }
}
.price--block {
  margin: 80px 0 0;
}
.price--ttl {
  color: #707070;
  display: block;
  font-size: 1.25em;
  border-bottom: 1px solid #A0A0A0;
  margin: 0 0 32px;
  padding: 0 0 16px;
}
.price--table table {
  width: 100%;
}
.price--table table tr th, .price--table table tr td {
  border: 1px solid #999;
  text-align: center;
  vertical-align: middle;
}
.price--table table tr th {
  background: #5E5E5E;
  color: #fff;
  padding: 8px 0;
  font-size: 0.75em;
}
.price--table table tr td {
  background: #fff;
  padding: 8px 0;
  font-size: 0.875em;
}
.price--table table tr td.gray {
  background: #F7F7F7;
}
.price--table table tr td.blank {
  background: #D1D1D1;
}

.division {
  padding: 120px 0 80px;
}
.division .ttl {
  font-size: 1.75em;
  color: #707070;
  margin: 0 0 84px;
  padding: 0 0 8px;
}
.division_block {
  padding: 0 0 80px;
}
.division_block--ttl {
  font-size: 1.25em;
  color: #707070;
  border-bottom: 1px solid #A0A0A0;
  margin: 0 0 24px;
  padding: 0 0 8px;
}
.division_layout {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: center;
  padding: 48px 0;
}
.division--table {
  width: 50%;
}
.division .illust {
  width: 45%;
}
.division .caption-lst li {
  margin-top: 8px;
  font-size: 0.875em;
}
.division .caption-lst li:first-child {
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  .price--block {
    margin: 64px 0 0;
  }
  .price--ttl {
    font-size: 1em;
    margin: 0 0 40px;
    padding: 0 0 16px;
  }
  .price--table {
    padding: 10% 0 0 0;
    background: url(../../images/price/arrow.png) no-repeat 0 0;
    background-size: 100% auto;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .price--table::-webkit-scrollbar {
    height: 3px;
  }
  .price--table::-webkit-scrollbar-track {
    background: #ddd;
  }
  .price--table::-webkit-scrollbar-thumb {
    border-radius: 3px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.85);
  }
  .price--table table {
    width: 940px;
  }
  .price--table table tr th, .price--table table tr td {
    border: 1px solid #999;
    text-align: center;
    vertical-align: middle;
  }
  .price--table table tr th {
    background: #5E5E5E;
    color: #fff;
    padding: 8px 0;
    font-size: 0.75em;
  }
  .price--table table tr td {
    background: #fff;
    padding: 16px 0;
    font-size: 0.875em;
  }
  .price--table table tr td.gray {
    background: #F7F7F7;
  }
  .price--table table tr td.blank {
    background: #D1D1D1;
  }
  .price--table.not-scroll {
    width: auto;
    overflow-x: visible;
    padding: 0;
    background: none;
  }
  .price--table.not-scroll table {
    width: 100%;
  }
  .division {
    padding: 80px 0 40px;
  }
  .division .ttl {
    font-size: 1.5em;
    margin: 0;
    padding: 0 0 8px;
  }
  .division_block {
    padding: 40px 0 0;
  }
  .division_block--ttl {
    font-size: 1.25em;
    color: #707070;
    border-bottom: 1px solid #A0A0A0;
    margin: 0;
    padding: 0 0 8px;
  }
  .division_layout {
    display: block;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
    padding: 48px 0;
  }
  .division--table {
    width: auto;
    overflow-x: visible;
    padding: 0;
    background: none;
  }
  .division--table table {
    width: 100%;
  }
  .division .illust {
    width: auto;
    margin: 0 0 40px;
  }
  .division .caption-lst li {
    margin-top: 8px;
  }
  .division .caption-lst li:first-child {
    margin-top: 0;
  }
}
.faq--block {
  color: #707070;
}
.faq--block details {
  border-top: 1px solid #A0A0A0;
  padding: 48px 64px;
}
.faq--block details summary {
  font-size: 1.5em;
  cursor: pointer;
  position: relative;
}
.faq--block details summary:before {
  content: "Q";
  font-size: 1.25em;
  position: absolute;
  top: -8px;
  left: -40px;
  color: #BCBCBC;
}
.faq--block details .answer {
  padding: 24px 0 0;
}
.faq--block details .answer h3 {
  font-weight: bold;
  font-size: 1.25em;
  padding: 0 0 16px;
  position: relative;
}
.faq--block details .answer h3:before {
  content: "A";
  font-size: 1.5em;
  position: absolute;
  top: -8px;
  left: -38px;
  color: #BCBCBC;
  font-weight: normal;
}
.faq--block details .answer p {
  line-height: 2.25;
}
.faq--block details .answer ul {
  margin: 24px 0;
}
.faq--block details .answer ul li {
  font-size: 0.875em;
  margin: 8px 0 0;
}
.faq--block details .answer ul li:first-child {
  margin: 0;
}

@media screen and (max-width: 767px) {
  .faq--block details {
    padding: 24px 24px;
  }
  .faq--block details summary {
    font-size: 1.25em;
    cursor: pointer;
    position: relative;
  }
  .faq--block details summary:before {
    content: "Q";
    font-size: 1.25em;
    position: absolute;
    top: -17.5%;
    left: -6.75%;
  }
  .faq--block details .answer {
    padding: 24px 0 0;
  }
  .faq--block details .answer h3 {
    font-size: 1.125em;
  }
  .faq--block details .answer h3:before {
    content: "A";
    font-size: 1.25em;
    top: -4.5%;
    left: -6%;
  }
  .faq--block details .answer p {
    line-height: 2.25;
    font-size: 0.875em;
  }
  .faq--block details .answer ul li {
    margin: 16px 0 0;
  }
  .faq--block details .answer ul li:first-child {
    margin: 0;
  }
}
.flow {
  margin: 80px 0 0 0;
}
.flow--step {
  box-shadow: 0 3px 3px #ddd;
  background: #fff;
  margin: 80px 0 0;
  position: relative;
}
.flow--step .ttl {
  text-align: center;
  background: #5E5E5E;
  color: #fff;
  font-size: 1.25em;
  padding: 24px 0;
}
.flow--step::before {
  content: "";
  width: 10px;
  height: 10px;
  border-top: 1px solid #707070;
  border-right: 1px solid #707070;
  position: absolute;
  top: -48px;
  left: 50%;
  margin-left: -5px;
  transform: rotate(135deg);
}
.flow--button {
  text-align: center;
  margin-top: 80px;
}
.flow--button a {
  max-width: 320px;
  margin: auto;
  transition: all 0.4s;
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  font-weight: bold;
  font-size: 0.875em;
  position: relative;
  display: block;
  padding: 16px 0;
  color: #fff;
  background: #3A3A3A;
}
.flow--button a:hover {
  opacity: 0.4;
}
.flow--contents {
  padding: 48px 120px;
}
.flow--contents p {
  text-align: center;
  padding: 0 24px;
}

@media screen and (max-width: 767px) {
  .flow {
    margin: 40px 0 0 0;
  }
  .flow--step {
    margin: 40px 0 0;
  }
  .flow--step .ttl {
    text-align: center;
    background: #5E5E5E;
    color: #fff;
    font-size: 1.25em;
    padding: 24px 0;
  }
  .flow--step::before {
    content: "";
    width: 10px;
    height: 10px;
    border-top: 1px solid #707070;
    border-right: 1px solid #707070;
    position: absolute;
    top: -48px;
    left: 50%;
    margin-left: -5px;
    transform: rotate(135deg);
  }
  .flow--contents {
    padding: 48px 0;
  }
  .flow--contents p {
    text-align: left;
  }
}
/*# sourceMappingURL=page.css.map */