@charset "utf-8";
/********** INTRO SECTION - KE✓ **********/

#introSection p.wspl {min-width: 320px;}

.toggleContainer {
  display: flex; flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
}

.menuPanel {
  display: flex; flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  gap: 0.25rem;
  width: 100%;
}
.introTogBtn {
  padding: 0.5rem 0.75rem;
  border: 1px solid #e3e5e7;
  border-radius: 24px 24px 0 24px;
  text-align: center;
  box-shadow: 2px 2px 6px rgb(0 0 0 / 8%);
  background: #FFF;
  transition: background 0.2s;
  cursor: pointer;
}
.introTogBtn.active, .introTogBtn:hover {
  border: 1px solid var(--c-primary);
  background: var(--c-primary);
  font-weight: 500; color: #FFF;
  box-shadow: 2px 2px 5.25px rgb(0 0 0 / 20%);
}

.contentPanel {
  width: 100%; max-width: 800px;
  min-height: 360px;
  border: 1px solid #e3e5e7;
  border-radius: 12px;
  padding: 1rem;
  background: #fff;
  box-shadow: 2px 4px 8px rgb(0 0 0 / 8%);
}

.introToggle {display: none;}
.introToggle.active {display: block;}
.introToggle.tBox {margin-bottom: 0;}
  .introToggle table {width: 100%;}
  .introToggle h3 {margin-top: 0.5rem;}
  .introToggle p.infoTit {margin: 0.25rem auto 1rem; line-height: 1;}
  .introToggle h4 {margin-bottom: 0.5rem;}
  .introToggle table.tBor_1 {border-top: 0; border-bottom: 0;}
  .introToggle table.tBor_1 tr {background: none;}
  .introToggle table.tBor_1 tr:last-child {border-bottom: 0;}
  .introToggle table.tBor_1 th, .introToggle table.tBor_1 td {border: 0;}


/* Media Queries: Small to Large - KE✓ */
@media screen and (min-width: 375px) {
  .menuPanel {gap: 0.5rem;}
}

@media screen and (min-width: 520px) {
}

@media screen and (min-width: 768px) {
  .toggleContainer {
    flex-direction: row; align-items: flex-start;
  }
  .menuPanel {
    flex-direction: column;
    gap: 1rem;
    width: calc(20% - 1rem); max-width: 120px;
    padding-top: 1rem;
  }
    .introTogBtn {padding: 0.75rem 1rem; border-radius: 10px 12px 0 12px;}
      .mo_none {display: inline-block;}

  .contentPanel {width: 80%; border-radius: 16px;}
    .introToggle table {margin-top: 0.5rem;}
}

@media screen and (min-width: 1024px) {
}

@media screen and (min-width: 1440px) {
  .menuPanel {padding-top: 2rem;}
  .introToggle table {margin-top: 1rem;}

}

@media screen and (min-width: 1600px) {

}