/*common*/
:root {
  --XsTxt: 2vw;
  --STxt: 2.2vw;
  --MTxt: 2.4vw;
  --LTxt: 2.8vw;
  --STitle: 3.22vw;
  --MTitle: 3.8vw;
  --LTitle: 4.44vw;
  --XlTitle: 13.38vw;
}
@media screen and (min-width: 769px) {
  :root {
    --XsTxt: 1.15vw;
    --STxt: 1.26vw;
    --MTxt: 1.52vw;
    --LTxt: 1.75vw;
    --STitle: 2.28vw;
    --MTitle: 2.62vw;
    --LTitle: 3.41vw;
    --XlTitle: 6.13vw;
  }
}
@media screen and (min-width: 961px) {
  :root {
    --XsTxt: 1.04vw;
    --STxt: 1.15vw;
    --MTxt: 1.35vw;
    --LTxt: 1.56vw;
    --STitle: 2.08vw;
    --MTitle: 2.4vw;
    --LTitle: 3.13vw;
    --XlTitle: 5.63vw;
  }
}

.STxt {
  font-size: clamp(8px, var(--STxt), 11px);
}
.MTxt {
  font-size: clamp(9px, var(--MTxt), 17px);
}
.LTxt {
  font-size: clamp(10px, var(--LTxt), 16px);
}
.STitle {
  font-size: clamp(13px, var(--STitle), 20px);
}
.MTitle {
  font-size: clamp(16px, var(--MTitle), 20px);
}
.LTitle .cntArea {
}
.cntArea + .cntArea {
  margin-top: 20%;
}
.cntArea > .ttlObj {
  text-align: center;
  font-weight: 300;
}
.cntArea > .sttlObj {
}
.cntArea .btnObj.btnBk {
  text-align: center;
  display: flex;
  justify-content: center;
  width: min(60%, 300px);
  margin: 0 auto;
}
.cntArea .btnObj.btnBk a {
  text-decoration: none;
  background: #000;
  color: #fff;
  padding: 0.4em 2em 0.6em;
  line-height: 1;
  width: 100%;
  letter-spacing: 0.15em;
  border: 1px solid #000;
  transition: 0.2s ease;
}
.cntArea .btnObj.btnBk a:hover {
  transition: 0.2s ease;
  background: #fff;
  background: none;
  color: #000;
  /* border: 1px solid #000; */
}

.sc-horizon {
}
.sc-horizon .scSet {
}
.sc-horizon .scSet + .scSet {
}
@media screen and (min-width: 769px) {
  .cntArea {
  }
  .cntArea + .cntArea {
    margin-top: min(10%, 130px);
  }
  .cntArea > .ttlObj {
  }
  .cntArea > .sttlObj {
  }
  .cntArea .btnObj.btnBk {
  }
  .cntArea .btnObj.btnBk a {
    padding: 0.65em 1em 0.85em;
  }
}
@media screen and (min-width: 961px) {
  .cntArea {
  }
  .cntArea + .cntArea {
  }
  .cntArea > .ttlObj {
  }
  .cntArea > .sttlObj {
  }
  .cntArea .btnObj.btnBk {
  }
  .cntArea .btnObj.btnBk a {
  }
}

/*=========================
mainArea
=========================*/

.mainArea {
  margin: 5% auto;
}
.mainArea .ttlGlp {
  text-align: center;
  margin: 0 auto 8%;
}
.mainArea .ttlGlp .ttlObj {
}
.mainArea .ttlGlp .sttlObj {
  font-weight: 300;
  margin: 1.5em auto;
}
.mainArea > .txtObj {
}

.mainArea .benefits {
  display: flex;
  flex-flow: wrap;
  justify-content: center;
  margin: 20% auto 0;
}
.mainArea .benefits .benefit {
  list-style: none;
  width: 47%;
  margin: 0 1.5%;
  position: relative;
  border: 1px solid;
  padding: 0 2% 4%;
  display: flex;
  flex-flow: column;
}
.mainArea .benefits .benefit + .benefit {
}
.mainArea .benefits .benefit:last-of-type {
  margin-top: 15%;
}
.mainArea .benefits .benefit .iconObj {
  justify-content: center;
  background: #efe9e7;
  margin: -20% auto 0;
  padding: 0 10%;
}
.mainArea .benefits .benefit .iconObj img {
  width: auto;
  height: min(12vw, 70px);
}

.mainArea .benefits .benefit .txtGlp {
}
.mainArea .benefits .benefit .txtGlp .num {
  margin: 0;
  line-height: 1;
}
.mainArea .benefits .benefit .txtGlp .ttlObj {
  line-height: 1.5;
}
.mainArea .benefits .benefit .txtGlp .txtObj {
}
@media screen and (min-width: 769px) {
  .mainArea {
    margin: 5% auto 0;
  }
  .mainArea .ttlGlp {
    margin: 0 auto 5%;
  }
  .mainArea .ttlGlp .ttlObj {
  }
  .mainArea .ttlGlp .sttlObj {
  }
  .mainArea > .txtObj {
  }

  .mainArea .benefits {
    width: min(90%, 1100px);
    margin: 10% auto 0;
  }
  .mainArea .benefits .benefit {
    width: 29%;
    margin: 0 2%;
    padding: 0 1.5% 2%;
  }
  .mainArea .benefits .benefit + .benefit {
    margin-top: 0;
  }
  .mainArea .benefits .benefit .iconObj {
  }
  .mainArea .benefits .benefit .txtGlp {
  }
  .mainArea .benefits .benefit .txtGlp .num {
    font-size: clamp(18.3px, var(--MTitle), 20px);
  }
  .mainArea .benefits .benefit .txtGlp .ttlObj {
    margin: 0.5em auto 0.5em;
    font-size: clamp(15.9px, var(--STitle), 16px);
  }
  .mainArea .benefits .benefit .txtGlp .txtObj {
  }
}
@media screen and (min-width: 961px) {
  .mainArea {
  }
  .mainArea .ttlGlp {
  }
  .mainArea .ttlGlp .ttlObj {
  }
  .mainArea .ttlGlp .sttlObj {
  }
  .mainArea > .txtObj {
  }

  .mainArea .benefits {
  }
  .mainArea .benefits .benefit {
  }
  .mainArea .benefits .benefit + .benefit {
  }
  .mainArea .benefits .benefit .iconObj {
  }
  .mainArea .benefits .benefit .txtGlp {
  }
  .mainArea .benefits .benefit .txtGlp .num {
  }
  .mainArea .benefits .benefit .txtGlp .ttlObj {
  }
  .mainArea .benefits .benefit .txtGlp .txtObj {
  }
}

/*=========================
htRegisterArea
=========================*/
.htRegisterArea {
}
.htRegisterArea .ttlObj {
}
.htRegisterArea .scBlk {
  margin: 10% auto 0;
  display: flex;
  overflow-x: scroll;
  padding: 0 0 5%;
}
.htRegisterArea .scBlk .scSet {
  flex-shrink: 0;
  width: 60%;
  position: relative;
  padding: 0 0 0 10%;
}
.htRegisterArea .scBlk .scSet + .scSet {
  margin: 0 10%;
  padding: 0 0 0 10%;
}
.htRegisterArea .scBlk .scSet + .scSet::before {
  content: "";
  position: absolute;
  width: 1em;
  height: 1em;
  border-right: 1px solid;
  border-bottom: 1px solid;
  left: 0;
  top: 50%;
  transform: rotate(-45deg) translate(0, -50%);
}
.htRegisterArea .scBlk .scSet .scTtl {
  text-align: center;
}
.htRegisterArea .scBlk .scSet .imgObj {
  border: 1px solid;
  margin: 1.5em 0 0;
}
.htRegisterArea .scBlk .scSet .txtObj {
  margin: 0.5em 0 0;
}
@media screen and (min-width: 769px) {
  .htRegisterArea {
  }
  .htRegisterArea .ttlObj {
  }
  .htRegisterArea .scBlk {
    margin-top: min(5%, 80px);
    width: min(80%, 900px);
    justify-content: center;
    overflow: auto;
  }
  .htRegisterArea .scBlk .scSet {
    width: min(45%, 500px);
    padding: 0;
    margin: 0;
    padding: 0 5% 0 0;
  }
  .htRegisterArea .scBlk .scSet + .scSet {
    padding: 0 0 0 5%;
    margin: 0;
  }
  .htRegisterArea .scBlk .scSet + .scSet::before {
    content: "";
    width: 1.5em;
    height: 1.5em;
    left: -2.5%;
  }
  .htRegisterArea .scBlk .scSet .scTtl {
  }
  .htRegisterArea .scBlk .scSet .imgObj {
  }
  .htRegisterArea .scBlk .scSet .txtObj {
  }
}
@media screen and (min-width: 961px) {
  .htRegisterArea {
  }
  .htRegisterArea .ttlObj {
  }
  .htRegisterArea .scBlk {
  }
  .htRegisterArea .scBlk .scSet {
  }
  .htRegisterArea .scBlk .scSet + .scSet {
  }
  .htRegisterArea .scBlk .scSet + .scSet::before {
    content: "";
  }
  .htRegisterArea .scBlk .scSet .scTtl {
  }
  .htRegisterArea .scBlk .scSet .imgObj {
  }
  .htRegisterArea .scBlk .scSet .txtObj {
  }
}

/*=========================
switchCntsArea
=========================*/
.switchCntsArea {
}
.switchCntsArea .cntLists {
  display: flex;
  justify-content: center;
  flex-flow: row;
  width: 90%;
  margin: 0 auto 5%;
  padding: 0 0 5%;
}
.switchCntsArea .cntLists .cntList {
  list-style: none;
  opacity: 0.5;
  width: 48%;
  text-align: center;
  position: relative;
}
.switchCntsArea .cntLists .cntList.active {
  opacity: 1;
}
.switchCntsArea .cntLists .cntList.active::after {
  content: "";
  width: 6px;
  height: 6px;
  position: absolute;
  left: 0;
  right: 0;
  top: 120%;
  background: #000;
  margin: 0 auto;
  border-radius: 100px;
}
.switchCntsArea .cntLists .cntList + .cntList {
}
.switchCntsArea .scBlk {
  display: flex;
  flex-flow: row;
  overflow-x: auto;
  align-items: flex-start;
  width: 95%;
  margin: 0 0 10% auto;
}
.switchCntsArea .scBlk.sc-active {
}
.switchCntsArea .scBlk .scSet {
  flex-shrink: 0;
  width: 50%;
  margin: 0 7.5% 0 0;
}
.switchCntsArea .scBlk .scSet .imgObj {
  width: 100%;
  /* height: min(43vh, 400px); */
}
.switchCntsArea .scBlk .scSet .txtObj {
  margin: 1em auto 0;
}
.switchCntsArea .scBlk .scSet .txtObj:first-child {
  margin: 0 0 1em;
}

.switchCntsArea .scBlk .scSet .imgObj img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right;
}
.switchCntsArea .scBlk .scSet .txtObj + .txtObj {
}
.switchCntsArea .btnObj {
}

@media screen and (min-width: 769px) {
  .switchCntsArea {
  }
  .switchCntsArea .cntLists {
    margin: 0 auto;
    width: min(60%, 600px);
  }
  .switchCntsArea .cntLists .cntList {
  }
  .switchCntsArea .cntLists .cntList.active {
  }
  .switchCntsArea .cntLists .cntList + .cntList {
  }
  .switchCntsArea .scBlk {
    margin: 0 0 6% auto;
  }
  .switchCntsArea .scBlk.sc-active {
  }
  .switchCntsArea .scBlk .scSet {
    width: min(30%, 340px);
    margin: 0 3% 0 0;
  }
  .switchCntsArea .scBlk .scSet .imgObj {
    height: min(57vh, 670px);
    height: auto;
  }
  .switchCntsArea .scBlk .scSet .txtObj {
  }
  .switchCntsArea .scBlk .scSet .txtObj:first-child {
    margin: 0 0 1em;
  }
  .switchCntsArea .scBlk .scSet .txtObj + .txtObj {
  }
  .switchCntsArea .btnObj {
  }
}
@media screen and (min-width: 961px) {
  .switchCntsArea {
  }
  .switchCntsArea .cntLists {
  }
  .switchCntsArea .cntLists .cntList {
  }
  .switchCntsArea .cntLists .cntList.active {
  }
  .switchCntsArea .cntLists .cntList + .cntList {
  }
  .switchCntsArea .scBlk {
  }
  .switchCntsArea .scBlk.sc-active {
  }
  .switchCntsArea .scBlk .scSet {
  }
  .switchCntsArea .scBlk .scSet .imgObj {
  }
  .switchCntsArea .scBlk .scSet .txtObj {
  }
  .switchCntsArea .scBlk .scSet .txtObj + .txtObj {
  }
  .switchCntsArea .btnObj {
  }
}

.switchCntsArea .scBlk {
  display: none;
  opacity: 0;
}

.switchCntsArea .scBlk.sc-active {
  display: flex;
  animation: fadeIn 0.4s ease forwards;
}

.switchCntsArea .scBlk.sc-hide {
  animation: fadeOut 0.3s ease forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/*=========================
cautionArea
=========================*/
.cautionArea {
}
.cautionArea .ttlObj {
}
.cautionArea .cautionLists {
  margin: 10% auto 0;
}
.cautionArea .cautionLists .cautionList {
  list-style: none;
  width: 90%;
  margin: 0 auto;
}
.cautionArea .cautionLists .cautionList + .cautionList {
  margin: 10% auto 0;
}
.cautionArea .cautionLists .cautionList .ttlGlp {
  display: flex;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
}
.cautionArea .cautionLists .cautionList .ttlGlp .icon {
  width: auto;
  height: 2.2em;
  margin: 0 1em 0 0;
}
.cautionArea .cautionLists .cautionList .ttlGlp .icon img {
  width: auto;
  height: 100%;
  object-fit: cover;
}
.cautionArea .cautionLists .cautionList .ttlGlp .sttlObj {
  font-weight: 300;
}
.cautionArea .cautionLists .cautionList .txtObj {
  margin: 1.5em 0 0;
}
@media screen and (min-width: 769px) {
  .cautionArea {
  }
  .cautionArea .ttlObj {
  }
  .cautionArea .cautionLists {
    display: flex;
    flex-flow: wrap;
    margin: 5% auto 0;
    width: min(90%, 1100px);
  }
  .cautionArea .cautionLists .cautionList {
    width: 32%;
    margin: 0;
  }
  .cautionArea .cautionLists .cautionList + .cautionList {
    margin-top: 0;
  }
  .cautionArea .cautionLists .cautionList .ttlGlp {
  }
  .cautionArea .cautionLists .cautionList .ttlGlp .icon {
  }
  .cautionArea .cautionLists .cautionList .ttlGlp .sttlObj {
  }
  .cautionArea .cautionLists .cautionList .txtObj {
  }
}
@media screen and (min-width: 961px) {
  .cautionArea {
  }
  .cautionArea .ttlObj {
  }
  .cautionArea .cautionLists {
  }
  .cautionArea .cautionLists .cautionList {
  }
  .cautionArea .cautionLists .cautionList + .cautionList {
  }
  .cautionArea .cautionLists .cautionList .ttlGlp {
  }
  .cautionArea .cautionLists .cautionList .ttlGlp .icon {
  }
  .cautionArea .cautionLists .cautionList .ttlGlp .sttlObj {
  }
  .cautionArea .cautionLists .cautionList .txtObj {
  }
}

/*=========================
qaArea
=========================*/
.qaArea {
}
.qaArea .ttlObj {
  font-weight: 300;
}
.qaArea .qaSet {
}
.qaArea .qaSet {
  margin: 10% auto 0;
  width: 90%;
}
.qaArea .qaSet .ttlObj {
}
.qaArea .qaSet .ttlObj::before {
  content: "Q.";
}
.qaArea .qaSet .txtObj {
  width: 100%;
  margin: 1em 0 0;
}
.qaArea .qaSet .txtObj::before {
  content: "A.";
}
.qaArea .qaSet dd + dt {
  margin-top: 2em;
}
@media screen and (min-width: 769px) {
  .qaArea {
  }
  .qaArea .ttlObj {
  }
  .qaArea .qaSet {
  }
  .qaArea .qaSet {
    width: min(80%, 900px);
    margin: 5% auto 0;
  }
  .qaArea .qaSet .ttlObj {
  }
  .qaArea .qaSet .ttlObj::before {
    content: "Q.";
  }
  .qaArea .qaSet .txtObj {
  }
  .qaArea .qaSet .txtObj::before {
    content: "A.";
  }
  .qaArea .qaSet .txtObj + .ttlOBj {
  }
}
@media screen and (min-width: 961px) {
  .qaArea {
  }
  .qaArea .ttlObj {
  }
  .qaArea .qaSet {
  }
  .qaArea .qaSet {
  }
  .qaArea .qaSet .ttlObj {
  }
  .qaArea .qaSet .ttlObj::before {
    content: "Q.";
  }
  .qaArea .qaSet .txtObj {
  }
  .qaArea .qaSet .txtObj::before {
    content: "A.";
  }
  .qaArea .qaSet .txtObj + .ttlOBj {
  }
}