@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*▼色▼*/
/*▼文字▼*/
/*▼サイズ▼*/
/*▼FLEX系▼*/
/*▼グリッド系▼*/
body.cat_manual .main_ctt section {
  margin-top: 10rem;
}
body.cat_manual .main_ctt section:first-of-type {
  margin-top: 0;
}

.tit_gra {
  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;
  width: clamp(100px, 85%, 648px);
  margin: 6px auto 5rem;
  height: 8.2rem;
}
.tit_gra::before,
.tit_gra::after {
  content: "";
  width: 6.4rem;
  aspect-ratio: 64/68;
  display: inline-block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.tit_gra::before {
  background-image: url("../img/naka/tit_m_l.png");
}
.tit_gra::after {
  background-image: url("../img/naka/tit_m_r.png");
}
.tit_gra > span {
  position: relative;
  background-image: -moz-linear-gradient(0deg, #d672b0 0%, #876cbe 100%);
  background-image: -webkit-linear-gradient(0deg, #d672b0 0%, #876cbe 100%);
  background-image: -ms-linear-gradient(0deg, #d672b0 0%, #876cbe 100%);
  border-radius: 1.1em;
  color: white;
  font-family: "Noto Serif JP", serif;
  font-weight: 700 !important;
  font-size: 2.5rem;
  width: calc(100% - (6.4rem * 2));
  line-height: 1.25;
  padding: 0.35em 1em 0.3em;
}
.tit_gra > span::before,
.tit_gra > span::after {
  content: "";
  position: absolute;
  display: block;
  height: 1px;
  width: 88.5%;
  margin: 0 auto;
  background-color: #c4a162;
  z-index: +1;
}
.tit_gra > span::before {
  top: -4px;
  left: 5.75%;
}
.tit_gra > span::after {
  bottom: -4px;
  left: 5.75%;
}
.tit_gra > span > span {
  display: inline-block;
}

.table {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400 !important;
  text-align: center;
  margin-top: 4rem;
}
.table > .box {
  width: clamp(100px, 75%, 480px);
  margin: auto;
}
.table table {
  width: 100%;
  border-collapse: collapse;
}
.table tr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  border-top: 1px solid #c4a162;
}
.table tr:last-child {
  border-bottom: 1px solid #c4a162;
}
.table th,
.table td {
  text-align: left;
  padding: 0.35em 0.75em;
  line-height: 1.35;
  -ms-flex-item-align: stretch;
  align-self: stretch;
}
.table th {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 600 !important;
  width: 13.5em;
  background-color: #cdeed6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.table th img {
  height: 3rem;
  width: auto;
  margin-right: 1rem;
}
.table td {
  width: calc(100% - 13.5em);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400 !important;
}
.table.hai th {
  background-color: #505064;
  color: white;
}

.picframe {
  position: relative;
  padding: 3px;
}
.picframe .pic {
  width: 100%;
  height: auto;
  position: relative;
  z-index: 5;
  line-height: 1;
  border: 2px solid #c4a162;
}
.picframe .pic img {
  width: 100%;
  height: auto;
}
.picframe .pic video {
  max-width: 100%;
  height: auto;
  border: 2px solid #c4a162;
}
.picframe span {
  display: block;
  position: absolute;
  position: absolute;
  width: calc(50% + 1px);
  height: calc(50% + 1px);
  z-index: 3;
  background-repeat: no-repeat;
  background-size: auto;
}
.picframe span:nth-of-type(1) {
  background-image: url("../img/naka/pf_tl.png");
  background-position: top left;
  top: 0;
  left: 0;
}
.picframe span:nth-of-type(2) {
  background-image: url("../img/naka/pf_tr.png");
  background-position: top right;
  top: 0;
  right: 0;
}
.picframe span:nth-of-type(3) {
  background-image: url("../img/naka/pf_bl.png");
  background-position: bottom left;
  bottom: 0;
  left: 0;
}
.picframe span:nth-of-type(4) {
  background-image: url("../img/naka/pf_br.png");
  background-position: bottom right;
  bottom: 0;
  right: 0;
}
.picframe i {
  position: absolute;
  display: block;
  width: 10px;
  height: 10px;
  background-color: #c4a162;
  z-index: 10;
}
.picframe i:nth-of-type(1) {
  top: 0;
  left: 0;
}
.picframe i:nth-of-type(2) {
  top: 0;
  right: 0;
}
.picframe i:nth-of-type(3) {
  bottom: 0;
  left: 0;
}
.picframe i:nth-of-type(4) {
  bottom: 0;
  right: 0;
}

.text {
  margin-top: 2.5rem;
}
.text > .box {
  width: clamp(100px, 75%, 480px);
  margin: auto;
  /* text-align: justify; } */
}

.picl {
  margin-top: 4rem;
}
.picl > .box {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400 !important;
  text-align: justify;
  width: clamp(100px, 85%, 648px);
  margin: auto;
}

.picx {
  margin-top: 4rem;
}
.picx > .box {
  width: clamp(100px, 85%, 810px);
  margin: auto;
}
.picx > .box img {
  width: 100%;
  height: auto;
}

.tit_m {
  width: clamp(100px, 75%, 520px);
  margin: 5.5rem auto 0;
  text-align: justify;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  line-height: 1.35;
}
.tit_m::before,
.tit_m::after {
  content: "";
  display: inline-block;
  width: 4.6rem;
  aspect-ratio: 46/50;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.tit_m::before {
  background-image: url("../img/naka/tit_s_l.png");
}
.tit_m::after {
  background-image: url("../img/naka/tit_s_r.png");
}
.tit_m > span {
  width: calc(100% - (4.6rem * 2));
  font-family: "Noto Serif JP", serif;
  font-weight: 700 !important;
  color: #c4a162;
  padding: 0 1em;
  text-align: center;
  font-size: 2.2rem;
}
.tit_m > span > span {
  display: inline-block;
}

.column {
  margin-top: 6rem;
}
.column > .box {
  width: clamp(100px, 85%, 560px);
  margin: auto;
}

.colframe {
  position: relative;
  padding: 20px;
}
.colframe .dtl {
  width: 100%;
  height: auto;
  position: relative;
  z-index: 5;
  padding: 1.35rem 2rem 2rem;
}
.colframe .dtl .tit {
  line-height: 1.35;
  color: white;
  font-family: "Noto Serif JP", serif;
  font-weight: 700 !important;
  border-bottom: 1px solid #c4a162;
  padding-bottom: 0.75em;
  position: relative;
  padding-bottom: 1.8rem;
  position: relative;
}
.colframe .dtl .tit::before,
.colframe .dtl .tit::after {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  position: absolute;
  bottom: -3px;
  background-color: #c4a162;
  transform: rotate(45deg);
}
.colframe .dtl .tit::before {
  left: 0px;
}
.colframe .dtl .tit::after {
  right: 0px;
}
.colframe .dtl .tx {
  font-size: 1.5rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400 !important;
  color: white;
  /* text-align: justify; */
  margin-top: 2rem;
}
.colframe i {
  display: block;
  position: absolute;
  position: absolute;
  width: calc(50% + 1px);
  height: calc(50% + 1px);
  z-index: 3;
  background-repeat: no-repeat;
  background-size: auto;
}
.colframe i:nth-of-type(1) {
  background-image: url("../img/manual/c_tl.png");
  background-position: top left;
  top: 0;
  left: 0;
}
.colframe i:nth-of-type(2) {
  background-image: url("../img/manual/c_tr.png");
  background-position: top right;
  top: 0;
  right: 0;
}
.colframe i:nth-of-type(3) {
  background-image: url("../img/manual/c_bl.png");
  background-position: bottom left;
  bottom: 0;
  left: 0;
}
.colframe i:nth-of-type(4) {
  background-image: url("../img/manual/c_br.png");
  background-position: bottom right;
  bottom: 0;
  right: 0;
}

.iclist {
  margin-top: 4rem;
}
.iclist > .box {
  width: clamp(100px, 75%, 480px);
  margin: auto;
}
.iclist ol,
.iclist ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.iclist ol li,
.iclist ul li {
  margin: 0;
  padding: 0;
}
.iclist ol li dl,
.iclist ul li dl {
  margin: 3rem 0 0 0;
  padding: 0;
}
.iclist ol li dl dt,
.iclist ul li dl dt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0;
  padding: 0;
  font-size: 1.8rem;
  font-family: "Noto Serif JP", serif;
  font-weight: 700 !important;
  color: #c4a162;
  line-height: 1.35;
  text-align: left;
}
.iclist ol li dl dt span,
.iclist ul li dl dt span {
  width: calc(100% - 5rem - 1rem);
}
.iclist ol li dl dd,
.iclist ul li dl dd {
  margin: 1rem 0 0 0;
  padding: 0.5rem 0 0 0;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400 !important;
  text-align: justify;
  line-height: 1.75;
  border-top: 1px solid #c4a162;
}
.iclist ol li:first-child dl,
.iclist ul li:first-child dl {
  margin-top: 0;
}
.iclist ul li dl dt img {
  width: 6rem;
  height: 6rem;
  margin-right: 1rem;
}
.iclist ul li dl dt span {
  width: calc(100% - 6rem - 1rem);
}
.iclist ul li dl dd {
  margin: -0.75rem 0 0 0;
}
.iclist ol li dl dt::before {
  content: "";
  display: inline-block;
  width: 5rem;
  height: 2.6rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin-right: 1rem;
}
.iclist ol li:nth-child(1) dl dt::before {
  background-image: url("../img/manual/ic/n01.png");
}
.iclist ol li:nth-child(2) dl dt::before {
  background-image: url("../img/manual/ic/n02.png");
}
.iclist ol li:nth-child(3) dl dt::before {
  background-image: url("../img/manual/ic/n03.png");
}
.iclist ol li:nth-child(4) dl dt::before {
  background-image: url("../img/manual/ic/n04.png");
}
.iclist ol li:nth-child(5) dl dt::before {
  background-image: url("../img/manual/ic/n05.png");
}
.iclist ol li:nth-child(6) dl dt::before {
  background-image: url("../img/manual/ic/n06.png");
}
.iclist ol li:nth-child(7) dl dt::before {
  background-image: url("../img/manual/ic/n07.png");
}
.iclist ol li:nth-child(8) dl dt::before {
  background-image: url("../img/manual/ic/n08.png");
}
.iclist ol li:nth-child(9) dl dt::before {
  background-image: url("../img/manual/ic/n09.png");
}
.iclist ol li:nth-child(10) dl dt::before {
  background-image: url("../img/manual/ic/n10.png");
}
.iclist ol li:nth-child(11) dl dt::before {
  background-image: url("../img/manual/ic/n11.png");
}
.iclist ol li:nth-child(12) dl dt::before {
  background-image: url("../img/manual/ic/n12.png");
}
.iclist ol li:nth-child(13) dl dt::before {
  background-image: url("../img/manual/ic/n13.png");
}
.iclist ol li:nth-child(14) dl dt::before {
  background-image: url("../img/manual/ic/n14.png");
}
.iclist ol li:nth-child(15) dl dt::before {
  background-image: url("../img/manual/ic/n15.png");
}

/***演出***/
.tit_gra > span {
  width: 0px;
  padding: 0;
}
.tit_gra > span > span {
  white-space: nowrap;
  overflow: hidden;
  opacity: 0;
}

body.ready .tit_gra.on > span {
  animation: tit_gra 0.2s ease-out 0.2s 1 forwards;
}

body.ready .tit_gra.on > span > span {
  animation: tit_gra2 0.3s ease-out 0.4s 1 forwards;
  padding-bottom: 2px;
}

@keyframes tit_gra {
  0% {
    width: 0px;
    padding: 0 0 0;
  }
  100% {
    width: calc(100% - (6.4rem * 2));
    padding: 0.35em 1em 0.3em;
  }
}
@keyframes tit_gra2 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*---------------------------------------------------------------------------BP1920*/
/*---------------------------------------------------------------------------BP1600*/
/*---------------------------------------------------------------------------BP1280*/
/*---------------------------------------------------------------------------BP1120*/
/*---------------------------------------------------------------------------BP1024*/
@media (max-width: 1024px) {
  .tit_gra {
    height: 7.5rem;
  }

  .tit_gra > span {
    font-size: 2.5rem;
    width: 0;
  }

  .tit_gra::before,
  .tit_gra::after {
    width: 5.8rem;
  }

  @keyframes tit_gra {
    0% {
      width: 0px;
      padding: 0 0 0;
    }
    100% {
      width: calc(100% - (5.8rem * 2));
      padding: 0.35em 1em 0.3em;
    }
  }
}
/*---------------------------------------------------------------------------BP1023*/
/*---------------------------------------------------------------------------BP960*/
/*---------------------------------------------------------------------------BP896*/
/*---------------------------------------------------------------------------BP768*/
@media (max-width: 768px) {
  .tit_gra {
    height: 7rem;
  }

  .tit_gra > span {
    font-size: 2.1rem;
    width: 0;
  }

  .tit_gra::before,
  .tit_gra::after {
    width: 5.5rem;
  }

  .table tr {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .table th,
  .table td {
    width: 100%;
  }

  .table td {
    padding-bottom: 1.25rem;
  }

  .tit_m > span {
    font-size: 2rem;
    width: calc(100% - (3.8rem * 2));
  }

  .tit_m::before,
  .tit_m::after {
    width: 3.8rem;
  }

  @keyframes tit_gra {
    0% {
      width: 0px;
      padding: 0 0 0;
    }
    100% {
      width: calc(100% - (5.5rem * 2));
      padding: 0.35em 1em 0.3em;
    }
  }
}
/*---------------------------------------------------------------------------BP767*/
/*---------------------------------------------------------------------------BP620*/
@media (max-width: 620px) {
  .tit_gra {
    height: 5.5rem;
  }

  .tit_gra > span {
    font-size: 1.8rem;
  }

  .tit_gra::before,
  .tit_gra::after {
    width: 4rem;
  }

  @keyframes tit_gra {
    0% {
      width: 0px;
      padding: 0 0 0;
    }
    100% {
      width: calc(100% - (4rem * 2));
      padding: 0.35em 1em 0.3em;
    }
  }
}
/*---------------------------------------------------------------------------BP480*/
