@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, main,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
  min-height: 0;
  min-width: 0;
  scroll-behavior: auto;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img, svg {
  max-width: 100%;
  vertical-align: top;
  height: auto;
}

pre {
  white-space: pre-wrap;
}

html {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

body {
  font-family: "LINE Seed JP", "Helvetica", "Arial", "メイリオ", "ヒラギノ丸ゴ ProN W4", "ヒラギノ角ゴ ProN", sans-serif;
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-size: 1.125rem;
  background-color: rgb(253, 248.6, 227);
  color: #191919;
  line-height: 1.4;
  position: relative;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
       text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body.fixed {
  overflow-y: hidden;
}
body.fixed #overlay {
  display: block;
}
body.fixed #sidenav {
  transform: translateY(0);
}

body.noheader header, body.noheader #sidenav {
  display: none;
}
body.noheader .title-tag:nth-of-type(1) {
  margin-top: 0;
}

#fixedbg {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}
#fixedbg img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

#wrap {
  background: white;
  max-width: 500px;
  margin: 0 auto;
}
#wrap > p {
  width: 90%;
}

header {
  height: 64px;
  position: sticky;
  top: 0;
  padding: 8px;
  border-bottom: 1px solid #dfcdca;
  background: white;
  z-index: 10;
}
header #logo {
  max-width: 54%;
  width: 180px;
}
header #logo img {
  height: 100%;
}
header #logo a {
  display: block;
}
header .inner {
  width: 100%;
  height: 100%;
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  justify-content: space-between;
}
header #menubar {
  background: #ed8951;
  height: 100%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: none;
}
@media (max-width: 1140px) {
  header #menubar {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    justify-content: center;
  }
}
header #menubar span {
  width: 64%;
  height: 2px;
  background: white;
  position: relative;
}
header #menubar span::before, header #menubar span::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  background: white;
}
header #menubar span::before {
  top: -8px;
}
header #menubar span::after {
  bottom: -8px;
}

article > p {
  width: 90%;
}

h1 + p, h2 + p, h3 + p {
  margin-top: 16px;
}

p {
  line-height: 1.68;
  margin: 48px auto;
}

a {
  transition: all 0.2s ease-in-out;
  text-decoration: none;
}

sup {
  font-size: 0.68rem;
  font-weight: normal;
  vertical-align: super;
}

footer .logo {
  width: 40%;
  margin: 0 auto;
  padding: 16px 0;
}
footer .inner {
  background: #f5df73;
  padding: 8px 0;
}
footer ul {
  width: 90%;
  margin: 32px auto;
  margin: 16px auto;
}
footer a {
  font-size: 0.875rem;
  color: #352320;
}
footer a::before {
  content: "\f0da";
  font-family: "Font Awesome 5 Free";
  line-height: 1;
  padding: 0 4px;
  font-weight: 900;
}

#copy {
  margin: 32px 0 0;
  text-align: center;
  font-size: 0.75rem;
  padding: 8px;
}

#sidenav {
  width: calc((100% - 500px) / 2);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}
@media (max-width: 1140px) {
  #sidenav {
    width: auto;
    top: 80px;
    left: auto;
    right: 0;
    transition: all 0.2s ease-in-out;
    transform: translateX(110%);
  }
}
#sidenav nav {
  width: 280px;
  position: absolute;
  right: 32px;
  top: 80px;
  background: white;
  border: 2px solid #ed8951;
  border-radius: 16px;
  padding: 16px;
}
@media (max-width: 1140px) {
  #sidenav nav {
    position: static;
    width: 300px;
    border-radius: 16px 0 0 16px;
    border-right: 0;
  }
}
#sidenav ul {
  margin-bottom: 16px;
}
#sidenav li {
  border-bottom: 1px dotted rgb(137.8, 91, 83.2);
}
#sidenav li a {
  color: #352320;
  padding: 12px 24px 12px 8px;
  font-size: 1rem;
  position: relative;
}
#sidenav li a:hover {
  background: rgb(253, 248.6, 227);
}
#sidenav li a::after {
  content: "\f054";
  font-family: "Font Awesome 5 Free";
  line-height: 1;
  padding: 0 4px;
  font-weight: 900;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
#sidenav a {
  display: block;
}
#sidenav .btn a {
  font-size: 1.125rem;
}

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  z-index: 9;
  display: none;
}

img.icon {
  width: 12px;
  margin: 0 2px;
}

/* text
---------------------------*/
.big {
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.4;
}

small, .small {
  font-size: 0.8em;
}

.bold, em {
  font-weight: bold;
}

.pen {
  background: rgb(249.8, 238.36, 182.2);
  font-weight: bold;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

/* text
---------------------------*/
.big {
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.4;
}

.bold, em {
  font-weight: bold;
}

.pen {
  background: rgb(249.8, 238.36, 182.2);
  font-weight: bold;
}

hr {
  border: 0;
  margin: 64px 0;
}

#bread {
  margin: 16px auto 0;
  font-size: 0.8rem;
  height: 24px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  -moz-column-gap: 2px;
       column-gap: 2px;
}
#bread span {
  height: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  background: rgb(251.4, 231.4, 220.2);
  position: relative;
  padding-left: 16px;
  padding-right: 4px;
}
#bread span::before, #bread span::after {
  content: "";
  display: block;
  width: 8px;
  height: 100%;
  position: absolute;
  top: 0;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
#bread span::after {
  background: rgb(251.4, 231.4, 220.2);
  left: 100%;
  z-index: 3;
}
#bread span::before {
  background: white;
  z-index: 2;
  left: 0;
}
#bread span:first-child {
  padding-left: 8px;
}
#bread span:first-child::before {
  content: none;
}
#bread span:last-child {
  background: none;
  padding-left: 8px;
}
#bread span:last-child::after {
  content: none;
}
#bread a {
  font-size: 0.8rem;
}
#bread a::before {
  content: none;
}

/* align
-----------------------*/
.center {
  text-align: center;
}

.right {
  text-align: right;
}

.left {
  text-align: left;
}

/* weight
-----------------------*/
.bold, em {
  font-weight: bold;
}

.normal {
  font-weight: normal;
}

/* size
-----------------------*/
.big {
  font-size: 1.2em;
  font-weight: bold;
}

.bigger {
  font-size: 1.4em;
  font-weight: bold;
  line-height: 1.3;
}

.biggest {
  font-size: 1.6em;
  font-weight: bold;
  line-height: 1.2;
}

/* color
-----------------------*/
.red {
  font-weight: bold;
  color: #f33;
}

#mainvisual {
  text-align: center;
  position: relative;
}
#mainvisual span {
  display: block;
  width: 90%;
  text-align: left;
  font-weight: bold;
  position: absolute;
  left: 5%;
  top: 36%;
  font-size: 2.4rem;
}

.title-tag {
  margin: 32px auto;
  background: #f5df73;
  padding: 24px;
  padding-right: 32px;
  font-weight: bold;
  font-size: 1.375rem;
  position: relative;
  z-index: 2;
}
@media (max-width: 768px) {
  .title-tag {
    font-size: 1.25rem;
  }
}
.title-tag::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 16px;
  height: 100%;
  background: #ed8951;
  transform: skewY(-32deg);
  transform-origin: right top;
}
.title-tag small {
  display: block;
  font-size: 1rem;
}

.title-dotline {
  font-weight: bold;
  border-bottom: 3px dotted #ed8951;
  width: 90%;
  margin: 32px auto;
  margin: 0 auto 16px;
  font-size: 1.25rem;
}
@media (max-width: 768px) {
  .title-dotline {
    font-size: 1.125rem;
  }
}

.title-sideline {
  width: 90%;
  margin: 32px auto;
  margin-bottom: 16px;
  font-size: 1.25rem;
  font-weight: bold;
  padding-left: 8px;
  border-left: 8px solid #ed8951;
}
@media (max-width: 768px) {
  .title-sideline {
    font-size: 1.125rem;
  }
}
.title-sideline small {
  display: block;
  font-size: 1rem;
}

.title-border {
  width: 90%;
  margin: 32px auto;
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 3px dotted #ed8951;
  line-height: 1.4;
  font-weight: bold;
}
.title-border small {
  display: block;
}

article > section {
  margin: 80px auto;
}

section {
  margin: 64px auto;
}
section > p {
  width: 90%;
}

h1 + section {
  margin-top: 32px;
}

#content > p {
  width: 90%;
}

.bnr {
  width: 90%;
  margin: 32px auto;
  margin: 32px auto;
  text-align: center;
}

[class^=box-], [class*=" box-"] {
  padding: 32px 0;
}
[class^=box-] *:first-child, [class*=" box-"] *:first-child {
  margin-top: 0;
}
[class^=box-] *:last-child, [class*=" box-"] *:last-child {
  margin-bottom: 0;
}
[class^=box-] p, [class*=" box-"] p {
  width: 90%;
  margin: 32px auto;
}

.box-orange {
  background: rgb(251.4, 231.4, 220.2);
}

.box-yellow {
  background: rgb(253, 248.6, 227);
}

.box-blue {
  background: rgb(231.34, 240.44, 245.06);
}

.img-right {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
}
@media (max-width: 768px) {
  .img-right {
    display: block;
  }
}
.img-right .img {
  max-width: 40%;
}
@media (max-width: 768px) {
  .img-right .img {
    max-width: unset;
  }
}
.img-right .txt, .img-right > p {
  flex: 1;
}
.img-right p {
  margin: 16px 0;
}

.flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  width: 90%;
  margin: 32px auto;
  gap: 16px;
}

.faqbox {
  width: 90%;
  margin: 32px auto;
}
.faqbox > div {
  margin-bottom: 64px;
}
.faqbox dt {
  border: 2px solid #352320;
  border-radius: 16px;
  padding: 16px;
  padding-left: 48px;
  font-weight: bold;
  position: relative;
}
.faqbox dt::before {
  content: "Q.";
  margin-right: 8px;
  font-size: 1.2em;
  position: absolute;
  top: 10px;
  left: 16px;
}
.faqbox dd {
  padding: 16px;
  padding-left: 48px;
  position: relative;
}
.faqbox dd::before {
  content: "A.";
  position: absolute;
  top: 10px;
  left: 16px;
  font-size: 1.4em;
  font-weight: bold;
}

.ctabtn {
  margin: 32px auto;
  text-align: center;
}
.ctabtn.notxt .addtxt {
  display: none;
}
.ctabtn a {
  display: block;
  margin: 0 auto;
  width: 80%;
  background: #f5df73;
  border-radius: 16px;
  padding: 32px 32px 32px 100px;
  font-weight: bold;
  color: #352320;
  font-size: 1.25rem;
  position: relative;
  border: 2px solid #352320;
  line-height: 1.4;
  box-shadow: 0 2px 0 #352320;
}
.ctabtn a:hover {
  transform: translateY(2px);
  box-shadow: 0 0 0 #352320;
}
@media (max-width: 768px) {
  .ctabtn a {
    font-size: 1.125rem;
  }
}
.ctabtn a::before {
  content: "0円";
  display: inline-block;
  background: #f33;
  color: white;
  border-radius: 4px;
  padding: 2px 6px;
  margin-right: 8px;
  font-size: 1rem;
  transform: translateY(-2px);
}
.ctabtn a::after {
  content: url(/img/parts/cta/icon.webp);
  position: absolute;
  bottom: 0;
  left: 4px;
  font-size: 0;
}

.addtxt {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  line-height: 1.4;
  margin: 16px auto;
  text-align: center;
}
.addtxt::before, .addtxt::after {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background: no-repeat center/contain;
}
.addtxt::before {
  background-image: url(/img/parts/cta/bg_l.svg);
}
.addtxt::after {
  background-image: url(/img/parts/cta/bg_r.svg);
}

.tri {
  width: 90%;
  margin: 32px auto;
  text-align: right;
}
.tri a::before {
  content: "\f0a9";
  font-family: "Font Awesome 5 Free";
  line-height: 1;
  padding: 0 4px;
  font-weight: 900;
}

.disc {
  width: 90%;
  margin: 32px auto;
  padding-left: 32px;
}
.disc li {
  padding: 8px 0;
}
.disc li:first-child {
  padding-top: 0;
}
.disc p {
  margin: 16px auto;
}
.disc {
  list-style: disc;
}

.decimal {
  width: 90%;
  margin: 32px auto;
  padding-left: 32px;
}
.decimal li {
  padding: 8px 0;
}
.decimal li:first-child {
  padding-top: 0;
}
.decimal p {
  margin: 16px auto;
}
.decimal {
  list-style: decimal;
}

.list-check {
  width: 90%;
  margin: 32px auto;
  padding-left: 32px;
}
.list-check li {
  position: relative;
  padding-bottom: 16px;
}
.list-check li::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background: url(/img/icon/check.svg) no-repeat center/contain;
  position: absolute;
  top: 0;
  right: 100%;
  transform: translateX(-8px);
}
.list-check li:last-child {
  padding-bottom: 0;
}
.list-check li p {
  margin: 8px 0;
}

.list-dl {
  max-width: 640px;
  margin: 0 auto;
}
.list-dl > div {
  width: 90%;
  margin: 32px auto;
  background: #dfcdca;
  border-radius: 16px;
  padding: 32px 16px 16px;
  position: relative;
}
.list-dl > div::before {
  content: attr(data-title);
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  background: #352320;
  color: white;
  padding: 8px 32px;
  border-radius: 8px;
}
@media (max-width: 768px) {
  .list-dl > div::before {
    transform: translateX(0);
    left: 8%;
  }
}
.list-dl dt {
  font-size: 1.375rem;
  font-weight: bold;
}
@media (max-width: 768px) {
  .list-dl dt {
    font-size: 1.25rem;
  }
}
.list-dl .img {
  text-align: center;
  padding: 16px 0 0;
}

[class^=list-tag], [class*=" list-tag"] {
  width: 90%;
  margin: 32px auto;
}
[class^=list-tag] li, [class*=" list-tag"] li {
  margin: 8px 0;
  border-left: 8px solid transparent;
  padding: 16px 8px;
}

.list-tag-blue li {
  background: rgb(231.34, 240.44, 245.06);
  border-color: #5697B8;
}

.list-tag-yellow li {
  background: rgb(253, 248.6, 227);
  border-color: #f5df73;
}

.list-img {
  margin: 32px auto;
}
.list-img li {
  text-align: center;
  margin: 16px 0;
}

dl.list-card > div {
  width: 90%;
  margin: 32px auto;
}
dl.list-card dt {
  font-size: 1.5rem;
  font-weight: bold;
  padding-left: 8px;
  margin-bottom: 16px;
  border-left: 8px solid #ed8951;
}
dl.list-card dd {
  border: 2px solid #352320;
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 16px;
}
dl.list-card p {
  margin: 16px 0;
}
dl.list-card p.title {
  margin-top: 0;
  font-weight: bold;
  border-bottom: 3px dashed #ed8951;
}

.list-title {
  width: 90%;
  margin: 32px auto;
}
.list-title > div {
  margin: 48px 0 32px;
  background: white;
  border: 2px solid #352320;
  border-radius: 16px;
  padding: 0 16px 16px;
  text-align: center;
}
.list-title dt {
  display: inline-block;
  border: 1px solid #352320;
  box-shadow: 0 2px 0 #352320;
  background: white;
  border-radius: 8px;
  padding: 8px 32px;
  transform: translateY(-16px);
  font-weight: bold;
}
.list-title dd {
  text-align: left;
}
.list-title dd .img {
  text-align: center;
}
.list-title.price {
  max-width: 480px;
  line-height: 1;
}
.list-title.price > div:nth-of-type(1) dt {
  background: rgb(219.2, 243.8, 224);
}
.list-title.price > div:nth-of-type(2) dt {
  background: rgb(255, 226.44, 226.44);
}
.list-title.price > div:nth-of-type(3) dt {
  background: rgb(231.34, 240.44, 245.06);
}
.list-title.price dd {
  font-weight: bold;
  text-align: center;
  font-size: 1.625rem;
}
.list-title.price dd small {
  font-size: 1rem;
}

.list-box {
  width: 90%;
  margin: 32px auto;
}
.list-box > div {
  margin: 32px 0;
  border: 2px solid rgb(98.6, 98.6, 98.6);
  border-radius: 16px;
  padding: 16px;
}
.list-box dt {
  font-weight: bold;
  border-bottom: 3px dashed #ed8951;
  margin-bottom: 16px;
  font-size: 1.3rem;
}
.list-box dt small {
  display: block;
}
.list-box dt.icon {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
.list-box dt.icon img {
  margin-right: 8px;
}
.list-box dd .img {
  margin: 16px 0;
  text-align: center;
}
.list-box dd p {
  margin: 16px 0;
  font-size: 1rem;
}
.list-box dd p:last-child {
  margin-bottom: 0;
}

.link-block {
  width: 90%;
  margin: 32px auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 16px;
}
.link-block li {
  width: 100%;
}
.link-block a {
  color: #352320;
  display: block;
  border: 1px solid #352320;
  border-radius: 8px;
  padding: 16px;
  box-shadow: 0 2px 0 #352320;
  background: rgb(253, 248.6, 227);
  font-weight: bold;
}
.link-block a:hover {
  background: rgb(251.4, 231.4, 220.2);
  transform: translateY(2px);
  box-shadow: 0 0 0 #352320;
}
.link-block.block03 li {
  width: calc(33.3333333333% - 10.6666666667px);
}

.list-titlebox {
  width: 90%;
  margin: 32px auto;
}
.list-titlebox > div {
  margin: 32px 0;
  border-radius: 16px;
  border: 2px solid #ed8951;
  overflow: hidden;
}
.list-titlebox dt {
  background: #ed8951;
  color: white;
  font-weight: bold;
  padding: 8px 16px;
}
.list-titlebox dd {
  padding: 16px;
}
.list-titlebox dd *:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}
.list-titlebox .img {
  text-align: center;
}
.list-titlebox p {
  line-height: 1.4;
}

.list-kome {
  width: 90%;
  margin: 32px auto;
  padding-left: 32px;
}
.list-kome li {
  padding: 8px 0;
}
.list-kome li:first-child {
  padding-top: 0;
}
.list-kome p {
  margin: 16px auto;
}
.list-kome {
  font-size: 0.86rem;
}
.list-kome li {
  padding: 4px 0;
}
.list-kome li::marker {
  content: "※";
}

input[type=text], input[type=tel], input[type=email], input[type=date], textarea, select {
  width: 100%;
  padding: 16px;
  border-radius: 8px;
  border: 1px solid rgb(98.6, 98.6, 98.6);
  outline: none;
  font-size: 1.125rem;
  box-sizing: border-box;
  transition: all 0.2s ease-in-out;
}
input[type=text]:focus, input[type=tel]:focus, input[type=email]:focus, input[type=date]:focus, textarea:focus, select:focus {
  background: rgb(253, 248.6, 227);
  border-color: #ed8951;
}
input[type=text].err, input[type=tel].err, input[type=email].err, input[type=date].err, textarea.err, select.err {
  background: rgb(255, 226.44, 226.44);
  border-color: #ed8951;
}

textarea {
  height: 12em;
}

label {
  display: block;
  border: 1px solid rgb(98.6, 98.6, 98.6);
  cursor: pointer;
  border-radius: 8px;
  padding: 12px 16px;
  color: #352320;
  transition: all 0.2s ease-in-out;
  position: relative;
}
label:hover {
  background: rgb(253, 248.6, 227);
  border-color: rgb(255, 148.92, 148.92);
  transform: translateY(2px);
}
label.on {
  background: rgb(253, 248.6, 227);
  border-color: #ed8951;
  transform: translateY(2px);
}

input[type=checkbox], input[type=radio] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.must::after {
  content: "*";
  color: #f33;
  display: inline-block;
  padding: 0 4px;
  font-size: 1rem;
  font-weight: normal;
  color: #f33;
}

.select {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 16px 8px;
}

.time label {
  width: calc(50% - 4px);
}

.formblock {
  margin-bottom: 128px;
}
.formblock dl {
  width: 90%;
  margin: 32px auto;
}
.formblock dl > div {
  padding-bottom: 16px;
}
.formblock dt {
  background: rgb(253, 248.6, 227);
  border-radius: 4px;
  padding: 8px;
  font-size: 1rem;
}
.formblock dd {
  padding: 16px 8px;
}
.formblock dd.address > small, .formblock dd.contact > small {
  display: block;
  padding-bottom: 4px;
}
.formblock dd.address > div, .formblock dd.contact > div {
  padding-bottom: 16px;
}
.formblock dd.address > div:last-child, .formblock dd.contact > div:last-child {
  padding-bottom: 0;
}
.formblock dd.address > div > i, .formblock dd.address > div > em, .formblock dd.contact > div > i, .formblock dd.contact > div > em {
  color: red;
  font-size: 0.875rem;
  font-weight: normal;
  display: none;
}
.formblock dd.address > div > i.show, .formblock dd.address > div > em.show, .formblock dd.contact > div > i.show, .formblock dd.contact > div > em.show {
  display: block;
}
.formblock dd > i, .formblock dd > em {
  color: red;
  font-size: 0.875rem;
  font-weight: normal;
  display: none;
}
.formblock dd > i.show, .formblock dd > em.show {
  display: block;
}
.formblock #zip {
  width: 7em;
}
.formblock .list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.formblock .list li {
  width: calc(50% - 4px);
}

.notice {
  margin: 16px auto 0;
  font-size: 0.9rem;
}

.stepform {
  display: block;
  overflow: hidden;
}

#stepbox {
  padding-bottom: 32px;
}
#stepbox p {
  margin: 8px 0;
  font-size: 1rem;
  line-height: 1.4;
}
#stepbox i, #stepbox em {
  display: none;
  font-size: 0.875rem;
  color: #f33;
  padding: 4px;
  font-weight: normal;
}
#stepbox i.show, #stepbox em.show {
  display: inline-block;
}
#stepbox .must::after {
  vertical-align: super;
}
#stepbox > section {
  float: left;
  margin: 0;
  padding: 32px 16px;
}
#stepbox > section h2, #stepbox > section h3 {
  width: 100%;
}
#stepbox > section.chkd .btn .next {
  pointer-events: auto;
  background: #f5df73;
  border-color: #352320;
  color: #352320;
  transform: translateY(0);
  box-shadow: 0 2px 0 #352320;
}
#stepbox > section.chkd .btn .next:hover {
  transform: translateY(2px);
  box-shadow: 0 0 0 #352320;
}
#stepbox label.el {
  display: none;
}
#stepbox .btn button {
  cursor: pointer;
}
#stepbox .btn button.next {
  pointer-events: none;
  border-color: #dfcdca;
  background: #d1d1d1;
  color: white;
  transform: translateY(2px);
  box-shadow: 0 0 0 #352320;
}
#stepbox .btn button.back {
  margin-top: 32px;
  background: #5697B8;
  width: auto;
  box-shadow: 0 0 0 #352320;
  border-color: #5697B8;
  color: white;
}
#stepbox #school label, #stepbox #grade label {
  text-align: center;
  width: calc(33.3333333333% - 5.3333333333px);
  font-weight: bold;
}
#stepbox #school label span, #stepbox #grade label span {
  display: block;
  line-height: 1;
}
#stepbox #school label {
  padding: 8px 0 0;
}
#stepbox #grade label {
  padding: 8px 0;
}
#stepbox #grade label span {
  font-size: 3rem;
}
#stepbox #zip {
  width: 8em;
}
#stepbox dl dt {
  font-size: 1rem;
}
#stepbox dl dd {
  margin: 4px 0 16px;
}
#stepbox dl dd:last-child {
  margin-bottom: 0;
}

.fancybox-content {
  width: 86%;
  max-width: 720px;
  max-height: 90vh;
  padding: 32px;
}

#policy, #promise {
  display: none;
  font-size: 1rem;
}
#policy p, #promise p {
  width: auto;
  margin: 0;
}

#promise dl {
  margin-bottom: 32px;
}
#promise dd {
  padding: 8px 0 32px;
}
#promise > div {
  text-align: center;
  padding: 16px 0;
}

#policy li {
  margin: 8px 0 8px 24px;
  font-weight: normal;
}
#policy ol > li {
  list-style: decimal;
  padding-bottom: 1em;
}
#policy ul > li {
  list-style: lower-alpha;
}
#policy p {
  max-width: unset;
}
@media (max-width: 768px) {
  #policy p {
    padding: 8px;
  }
}
#policy dl {
  border: 1px solid #ccc;
  padding: 16px;
  margin-bottom: 32px;
}
#policy dt {
  text-align: center;
  font-weight: bold;
  padding: 8px 0;
}

.sp {
  display: none;
}
@media (max-width: 768px) {
  .sp {
    display: block;
  }
}

.pc {
  display: block;
}
@media (max-width: 768px) {
  .pc {
    display: none;
  }
}

#cta {
  background: #ed8951;
  padding-bottom: 16px;
  max-width: 640px;
  margin: 64px auto 0;
}

#popup {
  display: none;
}

.cta_select {
  background: #ed8951;
  padding: 32px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
}
.cta_select > div {
  border-radius: 16px;
  background: white;
  width: 100%;
}
.cta_select > div.form a::before {
  content: "\f022";
}
.cta_select dt {
  background: rgb(137.8, 91, 83.2);
  color: white;
  position: relative;
  font-weight: bold;
  padding: 8px;
  padding-left: 72px;
  border-radius: 16px 16px 0 0;
}
.cta_select dt img {
  position: absolute;
  left: 0;
  bottom: 0;
}
.cta_select dd {
  padding: 16px;
}
.cta_select dd p {
  margin: 0;
  line-height: 1.4;
}
.cta_select .title {
  font-weight: bold;
  border-bottom: 2px dashed #ed8951;
  padding-bottom: 4px;
}

.fancybox-content.fancybox-content {
  padding: 0;
  max-width: 540px;
}

.btn {
  margin: 32px 0 16px;
}
.btn a, .btn button {
  display: block;
  width: 80%;
  margin: 0 auto;
  background: #f5df73;
  text-align: center;
  color: #352320;
  font-size: 1.25rem;
  font-weight: bold;
  padding: 16px;
  border-radius: 16px;
  border: 2px solid #352320;
  box-shadow: 0 2px 0 #352320;
  transition: all 0.2s ease-in-out;
}
.btn a::before, .btn button::before {
  font-family: "Font Awesome 5 Free";
  line-height: 1;
  padding: 0 4px;
  font-weight: 900;
  display: inline-block;
  margin-right: 8px;
}
.btn a:hover, .btn button:hover {
  transform: translateY(2px);
  box-shadow: 0 0 0 #352320;
}
.btn.tel img {
  width: 64%;
}

.merit_price {
  width: 90%;
  margin: 32px auto;
}
.merit_price ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  gap: 16px;
}
.merit_price li {
  width: calc(50% - 8px);
  border: 1px solid #ed8951;
  border-radius: 16px;
  padding: 16px;
  background: rgb(253, 248.6, 227);
}
@media (max-width: 768px) {
  .merit_price li {
    width: calc(50% - 8px);
    font-size: 1rem;
  }
}
.merit_price p {
  line-height: 1.4;
  margin: 16px 0 0;
  font-size: 1rem;
}
.merit_price .img {
  text-align: center;
}

.time-flow {
  width: 90%;
  margin: 32px auto;
}
.time-flow li {
  border-bottom: 3px dotted #ed8951;
  padding-bottom: 32px;
  margin-bottom: 32px;
}
.time-flow .text {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  align-items: flex-start;
}
.time-flow .text i {
  display: block;
  width: 80px;
  background: rgb(255, 226.44, 226.44);
  padding: 8px;
  border-radius: 8px;
  text-align: center;
  font-size: 1rem;
}
.time-flow .text p {
  flex: 1;
  margin: 0;
  line-height: 1.4;
  padding: 4px 0 16px 16px;
}
.time-flow .img {
  text-align: center;
}/*# sourceMappingURL=base.css.map */