[data-target] {
  cursor: pointer;
}

img {
  display: block;
}

p {
  color: var(--color-mute);
  line-height: 1.6;
}

/*main*/

/*sub*/

/*--------------------------*/
.content-title {
  margin-bottom: 95px;
}

.content-title h3 {
  font-weight: 300;
  margin-bottom: 40px;
}

.content-title h4 {
  font-weight: 300;
  margin-bottom: 30px;
}

.content-title h3 > span,
h4 > span {
  font-weight: 700;
}

.content-title h3 > span > span,
h4 > span > span {
  font-weight: 700;
  box-shadow: inset 0 -15px 0 0 var(--color-little);
}

.helper-text {
  font-size: 14px;
  color: var(--color-primary);
}

/* Desktop ( 1024px ~)*/
@media all and (min-width: 1024px) {
}

/* Tablet ( 768px ~ 1023px)*/
@media all and (min-width: 768px) and (max-width: 1023px) {
}

/* Moble ( ~ 767px)*/
@media all and (max-width: 767px) {
  .content-title h3,
  .content-title h4 {
    margin-bottom: 20px;
  }

  .content-title h3,
  .content-title h4,
  .content-title p {
    text-align: center;
  }
}

/*--------------------------*/

/*btn*/
.btn {
  font-size: 15px;
  min-height: 45px;
  white-space: nowrap;
}

.btn:hover {
  background: #ffc700;
}

.tab .tab-nav {
  gap: 0;
  margin-bottom: 50px;
}

.tab .tab-nav > div {
  flex: 1;
  padding: 25px 0;
  font-size: 17px;
  border-bottom: 1px solid var(--color-text);
}

.tab .tab-nav > div:hover {
  color: var(--color-text);
}

.tab .tab-nav > div.active {
  border-radius: 0;
  border: 1px solid var(--color-text);
  border-bottom: 0;
  color: var(--color-text);
}

/* Desktop ( 1024px ~)*/
@media all and (min-width: 1024px) {
  /*tab*/
  .tab > div {
    font-size: 17px;
  }
}

/* Laptop ( 1024px ~ 1300px)*/
@media all and (min-width: 1024px) and (max-width: 1300px) {
}

/* Tablet ( 768px ~ 1023px)*/
@media all and (min-width: 768px) and (max-width: 1023px) {
}

/* Moble ( ~ 767px)*/
@media all and (max-width: 767px) {
  /*tab*/
  .tab > div {
    font-size: 14px;
    padding: 15px 0;
  }

  .tab .tab-nav {
    margin-bottom: 20px;
  }

  .tab .tab-nav > div {
    padding: 15px 0;
    font-size: 14px;
  }

  .content-title {
    margin-bottom: 55px;
  }

  .helper-text {
    font-size: 13px;
  }
}

/*popup*/
.s-close-button {
  width: 25px;
  position: initial;
}

.dashed-line {
  margin: 50px 0;
  border-top: 1pt dashed #ccc;
}

.contact-form {
  padding-bottom: 50px;
}

.popup-title h2 {
  padding-bottom: 25px;
  border-bottom: 1px solid #eee;
  margin-bottom: 25px;
}

.popup-content h3 {
  margin-bottom: 30px;
}

.popup-title p {
  margin: 0;
}

.popup-content .terms-box p {
  color: var(--color-mute);
}

.terms input[type="checkbox"] ~ label p {
  white-space: unset;
}

.terms .input-helper {
  margin-top: 15px;
}

.input-helper {
  font-size: 14px;
  margin-top: 12px;
}

#boardBox {
  padding-bottom: 100px;
}

/* Laptop ( 1024px ~ 1300px)*/
@media all and (min-width: 1024px) and (max-width: 1300px) {
  .popup-content .grid-211 {
    --grid-num: 1;
  }

  .popup-content .grid-column-2 {
    grid-column: auto;
  }
}

/* Tablet ( 768px ~ 1023px)*/
@media all and (min-width: 768px) and (max-width: 1023px) {
  .popup-content .grid-column-2 {
    grid-column: auto;
  }
}

/* Moble ( ~ 767px)*/
@media screen and (max-width: 767px) {
  .popup-content .grid-column-2 {
    grid-column: auto;
  }
}