@charset "UTF-8";
/* Scss Document */
@import "common.css";
/* Scss Document */
/*例*/
.hoge {
  color: blue;
}
@media screen and (max-width: 750px) {
  .hoge {
    color: yellow;
  }
}
@media screen and (max-width: 479px) {
  .hoge {
    color: red;
  }
}

@media screen and (max-width: 1400px) {
  body {
    /*background: skyblue;*/
  }
}
@media screen and (max-width: 750px) {
  body {
    /*background: pink;*/
  }
}
@media screen and (max-width: 479px) {
  body {
    /*background: silver;*/
  }
}

/**************************/
html {
  font-size: 62.5%; /* 16px x 0.625 = 10px(=1rem) */
}
@media screen and (max-width: 750px) {
  html {
    font-size: 62.5%; /* 16px x 0.625 = 10px(=1rem) */
  }
}
@media screen and (max-width: 479px) {
  html {
    font-size: 63%; /*50*/ /* 16px x 0.625 = 10px(=1rem) */
  }
}

body {
  position: relative;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  line-height: 1.8;
  font-size: min(1.2857142857vw, 18px);
  -webkit-text-size-adjust: 100%;
  background: #191919;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
}
@media screen and (max-width: 750px) {
  body {
    font-size: 3.5897435897vw;
  }
}
body {
  overflow-x: hidden;
}

/*テーマカラー*/
a {
  color: #1a1a1a;
}

a:hover {
  text-decoration: none;
}

a[href^="tel:"] {
  color: #fff;
  text-decoration: none;
}

.colorBlue {
  color: #00a0e9;
}

.colorRed {
  color: #fc8d24 !important;
}

.colorOrange {
  color: #fb7e53;
}

.colorPurple {
  color: #ff7bf7;
}

.colorGray {
  color: #484848;
}

.colorWhite {
  color: #fff;
}

.txtS {
  font-size: 0.8em !important;
}

.txtM {
  font-size: 0.9em !important;
}

.txtL {
  font-size: 1.2em !important;
}

.txtB {
  font-weight: bold !important;
}

.indent {
  padding-left: 1em;
  text-indent: -1em;
}

.indent2 {
  margin-left: 1em;
}

.txtThr {
  text-decoration: line-through;
}

.alignL {
  text-align: left;
}

.fawesome {
  color: #c8ba9e;
  margin: 0 0.3em 0 0;
}

.mt05 {
  margin-top: 0.5em;
}

.mt1 {
  margin-top: 1em;
}

hr {
  max-width: 500px;
  margin: 3.5em auto 0;
  border: 0;
  border-top: 1px solid #bbb;
}

.hr2 {
  max-width: 500px;
  margin: 5em auto !important;
  border: 0;
  border-top: medium double #bbb;
}

.hr3 {
  max-width: 50px;
  margin: 3em auto;
  border: 0;
  border-top: 1px solid #bbb;
}

.pc {
  display: inline-block;
}
@media screen and (max-width: 750px) {
  .pc {
    display: none;
  }
}

.sp {
  display: none;
}
@media screen and (max-width: 750px) {
  .sp {
    display: inline-block;
  }
}

body {
  animation: fadeIn 2s ease 0s 1 normal;
  -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/********************

header

*********************/
.bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 1400/731;
  background: url(../images/mv.webp) no-repeat center top/100% auto;
  z-index: -1;
}
@media screen and (max-width: 750px) {
  .bg {
    aspect-ratio: 390/856;
    background: url(../images/mv_sp.webp) no-repeat center top/100% auto;
  }
}

header {
  position: relative;
}
header .mainttl {
  padding: 6vw 0 0 0;
  width: 48.1428571429vw;
  max-width: 674px;
  margin: 0 auto 0;
}
@media screen and (max-width: 750px) {
  header .mainttl {
    width: 87.1794871795vw;
    padding: 10.2564102564vw 0 0 0;
  }
}
header .catch {
  margin-top: min(3.2142857143vw, 45px);
  font-family: "Noto Serif JP", serif;
  text-align: center;
  font-size: min(3.2142857143vw, 45px);
  font-weight: 700;
}
@media screen and (max-width: 750px) {
  header .catch {
    font-size: 7.1794871795vw;
    line-height: 1.4em;
  }
}
header .catch2 {
  color: #cccccc;
  font-size: min(1.7142857143vw, 24px);
}
@media screen and (max-width: 750px) {
  header .catch2 {
    margin-top: 5.1282051282vw;
    font-size: 4.1025641026vw;
  }
}
header nav {
  margin-top: min(3.2142857143vw, 45px);
}
@media screen and (max-width: 750px) {
  header nav {
    margin-top: 41.0256410256vw;
  }
}
header nav ul {
  display: flex;
  justify-content: center;
  gap: min(2.8571428571vw, 40px);
}
@media screen and (max-width: 750px) {
  header nav ul {
    display: block;
    text-align: center;
  }
}
@media screen and (max-width: 750px) {
  header nav ul li {
    display: block;
  }
}
@media screen and (max-width: 750px) {
  header nav ul li + li {
    margin-top: 7.1794871795vw;
  }
}
header nav ul li a {
  position: relative;
  color: #fff;
  display: block;
  font-family: "Sawarabi Mincho", serif;
  font-size: min(2.2857142857vw, 32px);
  text-decoration: none;
  line-height: 1em;
}
@media screen and (max-width: 750px) {
  header nav ul li a {
    display: inline-block;
    font-size: 6.1538461538vw;
  }
}
header nav ul li a::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: #b6d0ff;
  bottom: -5px;
  left: 0;
  transition: all 0.3s ease;
}
header nav ul li a::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: #b6d0ff;
  bottom: -10px;
  left: 0;
  transition: all 0.3s ease;
}
header nav ul li a:hover::before, header nav ul li a:hover::after {
  opacity: 0;
}
header .btn {
  position: fixed;
  top: min(-3.2142857143vw, -4%);
  right: -0.7142857143vw;
  border-radius: 100%;
  width: min(12.2857142857vw, 172px);
  height: min(12.2857142857vw, 172px);
  background: #fbb03b;
  text-decoration: none;
  z-index: 100;
}
@media screen and (max-width: 750px) {
  header .btn {
    position: absolute;
    top: 79.4871794872vw;
    left: -2.0512820513vw;
    right: auto;
    width: 28.7179487179vw;
    height: 28.7179487179vw;
  }
}
header .btn:hover {
  opacity: 0.8;
  transition: all 0.3s ease;
}
header .btn .txt1 {
  padding: min(4.2857142857vw, 60px) 0 0 0;
  font-size: min(1.7142857143vw, 24px);
  line-height: 1em;
  margin: 0 auto;
  color: #fff;
  font-weight: 700;
  line-height: 1.2em;
}
@media screen and (max-width: 750px) {
  header .btn .txt1 {
    padding: 7.6923076923vw 0 0 0;
    font-size: 3.8461538462vw;
  }
}
header .btn .txt2 {
  font-size: min(1.3571428571vw, 19px);
  line-height: 1em;
  margin: 0.3em auto 0;
  color: #d4145a;
  font-weight: 700;
}
@media screen and (max-width: 750px) {
  header .btn .txt2 {
    font-size: 3.0769230769vw;
  }
}
header .btn .txt2 span {
  font-size: min(0.9285714286vw, 13px);
}
@media screen and (max-width: 750px) {
  header .btn .txt2 span {
    font-size: 2.0512820513vw;
  }
}

/*alllll*/
h2.mainttl {
  text-align: center;
  padding: min(4.2857142857vw, 60px) 0 0 0;
  color: #000;
}
h2.mainttl span:nth-of-type(1) {
  display: block;
  font-family: "Sawarabi Mincho", serif;
  font-size: min(3vw, 42px);
  line-height: 1em;
}
@media screen and (max-width: 750px) {
  h2.mainttl span:nth-of-type(1) {
    font-size: 7.6923076923vw;
  }
}
h2.mainttl span:nth-of-type(2) {
  display: block;
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: min(1.7142857143vw, 24px);
  line-height: 1em;
  margin-top: 0.5em;
}
@media screen and (max-width: 750px) {
  h2.mainttl span:nth-of-type(2) {
    font-size: 4.6153846154vw;
  }
}

h3.ttl {
  position: relative;
  isolation: isolate;
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: min(2vw, 28px);
  line-height: 1em;
  margin: min(6.4285714286vw, 90px) 0 0.8em;
  color: #000;
}
@media screen and (max-width: 750px) {
  h3.ttl {
    font-size: 5.3846153846vw;
    margin: 15.3846153846vw 0 0.8em;
  }
}
h3.ttl::before {
  content: "";
  position: absolute;
  width: min(2.9285714286vw, 41px);
  height: auto;
  bottom: min(-0.5714285714vw, -8px);
  left: min(-1.4285714286vw, -20px);
  aspect-ratio: 41/75;
  background: url(../images/icon_ttl_black.svg) no-repeat center center/100% auto;
  z-index: -1;
}
@media screen and (max-width: 750px) {
  h3.ttl::before {
    width: 8.2051282051vw;
    height: auto;
    bottom: -2.5641025641vw;
    left: -4.358974359vw;
  }
}

.contents {
  position: relative;
  container-type: inline-size;
  --pad-x: min(5vw, 70px);
  color: #1a1a1a;
  width: min(57.1428571429vw, 800px, 100% - min(2.8571428571vw, 40px));
  margin: 0 auto;
  padding: 0 var(--pad-x) min(7.1428571429vw, 100px);
  text-align: left;
  font-weight: 400;
  background: #e6e6e6;
  border-radius: 0 0 30px 30px;
}
@media screen and (max-width: 750px) {
  .contents {
    width: 84.6153846154vw;
    --pad-x: 7.6923076923vw;
    padding: 0 var(--pad-x) 17.9487179487vw;
  }
}

.contents2 {
  position: relative;
  color: #fff;
  width: min(57.1428571429vw, 800px, 100% - min(2.8571428571vw, 40px));
  margin: 0 auto;
  padding: 0 min(3.5714285714vw, 50px) min(7.1428571429vw, 100px);
  text-align: left;
  font-weight: 400;
}
@media screen and (max-width: 750px) {
  .contents2 {
    width: 84.6153846154vw;
    --pad-x: 7.6923076923vw;
    padding: 0 var(--pad-x) 25.641025641vw;
  }
}

.list li {
  position: relative;
  padding-left: 0.8em;
  line-height: 1.4em;
  margin: 0 0 0.6em;
}
.list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.9em;
  width: 0.3em;
  height: 0.3em;
  border-radius: 50%;
  background: currentColor;
  transform: translateY(-50%);
}

.noticeList {
  font-size: min(1.1428571429vw, 16px);
  font-weight: 300;
  margin: 1em 0 0 0;
}
@media screen and (max-width: 750px) {
  .noticeList {
    font-size: 3.0769230769vw;
  }
}
.noticeList li {
  line-height: 1.4em;
  margin-top: 0.3em;
  padding-left: 1em;
  text-indent: -1em;
}

#messageWrap {
  margin: min(12.1428571429vw, 170px) auto 0;
  max-width: 800px;
  width: min(57.1428571429vw, 800px);
  padding: min(7.1428571429vw, 100px) 0 0;
}
@media screen and (max-width: 750px) {
  #messageWrap {
    width: 84.6153846154vw;
  }
}
#messageWrap p.ttl {
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: min(2.7142857143vw, 38px);
  text-align: center;
  line-height: 1.2em;
}
@media screen and (max-width: 750px) {
  #messageWrap p.ttl {
    font-size: 4.6153846154vw;
  }
}
#messageWrap .messageBox {
  margin-top: min(2.6428571429vw, 37px);
}
#messageWrap .messageBox p {
  margin-top: min(2.6428571429vw, 37px);
  text-align: left;
}
@media screen and (max-width: 750px) {
  #messageWrap .messageBox p {
    margin-top: 1.5em;
  }
}
#messageWrap .messageBox .sign {
  font-family: "Noto Serif JP", serif;
  font-weight: 700;
  font-size: min(1.5vw, 21px);
  text-align: right;
}
@media screen and (max-width: 750px) {
  #messageWrap .messageBox .sign {
    font-size: 4.6153846154vw;
  }
}
#messageWrap .textBox {
  margin-top: min(7.8571428571vw, 110px);
}
@media screen and (max-width: 750px) {
  #messageWrap .textBox {
    margin-top: 6em;
  }
}
#messageWrap .textBox p {
  margin-top: min(2.6428571429vw, 37px);
  text-align: left;
  color: #cccccc;
}

#curriculumWrap,
#requirementsWrap,
#screeningWrap {
  margin: min(11.4285714286vw, 160px) auto 0;
}
@media screen and (max-width: 750px) {
  #curriculumWrap,
  #requirementsWrap,
  #screeningWrap {
    margin-top: 23.0769230769vw;
  }
}

.deco .contents::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translateX(-50%);
  width: max(1400px, 100vw);
  height: max(90px, 6.4285714286vw);
  margin-bottom: -1px;
  background: #e6e6e6;
  pointer-events: none;
  clip-path: polygon(100% 0, 100% 20%, calc(50% + 50cqw + var(--pad-x)) 100%, calc(50% - 50cqw - var(--pad-x)) 100%);
}
@media screen and (max-width: 750px) {
  .deco .contents::before {
    width: 100vw;
    height: 8.9743589744vw;
    clip-path: polygon(100% 0, 100% 50%, calc(50% + 50cqw + var(--pad-x)) 100%, calc(50% - 50cqw - var(--pad-x)) 100%);
  }
}
.deco:nth-child(even of .deco) .contents::before {
  clip-path: polygon(0 0, 0 20%, calc(50% - 50cqw - var(--pad-x)) 100%, calc(50% + 50cqw + var(--pad-x)) 100%);
}

#curriculumWrap h3.ttl::before {
  background: url(../images/icon_ttl_pink.svg) no-repeat center center/100% auto;
}

#requirementsWrap h3.ttl::before {
  background: url(../images/icon_ttl_blue.svg) no-repeat center center/100% auto;
}
@media screen and (max-width: 750px) {
  #requirementsWrap .box {
    max-width: 100%;
    min-width: 0;
  }
}
#requirementsWrap .priceTableWrap {
  margin-top: min(1.4285714286vw, 20px);
}
@media screen and (max-width: 750px) {
  #requirementsWrap .priceTableWrap {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}
#requirementsWrap .priceTable {
  width: 100%;
  font-size: min(1.1428571429vw, 16px);
  text-align: center;
}
@media screen and (max-width: 750px) {
  #requirementsWrap .priceTable {
    font-size: 3.0769230769vw;
    width: max-content;
    min-width: 100%;
  }
  #requirementsWrap .priceTable th,
  #requirementsWrap .priceTable td {
    white-space: nowrap;
  }
}
#requirementsWrap .priceTable tr {
  border-bottom: 1px solid #999999;
}
#requirementsWrap .priceTable th {
  padding: 0.3em 1.5em;
}
@media screen and (max-width: 750px) {
  #requirementsWrap .priceTable th {
    padding: 0.3em 1em;
  }
}
#requirementsWrap .priceTable td {
  text-align: right;
  padding: 0.3em 3em;
}
@media screen and (max-width: 750px) {
  #requirementsWrap .priceTable td {
    padding: 0.3em 1em;
  }
}

#screeningWrap h3.ttl::before {
  background: url(../images/icon_ttl_yellow.svg) no-repeat center center/100% auto;
}
#screeningWrap .box.deco2 {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
}
#screeningWrap .box.deco2 a {
  width: min(11.1428571429vw, 156px);
  display: block;
  margin: 0 min(2.1428571429vw, 30px) 0 0;
}
@media screen and (max-width: 750px) {
  #screeningWrap .box.deco2 a {
    width: 25.641025641vw;
    margin: 0 2.5641025641vw 0 0;
  }
}

#otherWrap h3.ttl,
#otherWrap a {
  color: #fff;
  text-decoration: none;
}

/********************

footer wrap

*********************/
footer {
  padding: 0 0 min(1.4285714286vw, 20px);
}
footer p a {
  color: #b3b3b3;
  font-size: min(1vw, 14px);
}
@media screen and (max-width: 750px) {
  footer p a {
    font-size: 2.5641025641vw;
  }
}/*# sourceMappingURL=style.css.map */