@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap");
:root {
  --viewport: 750;
  --container-size: 1120px;
  --color-gold: #bba171;
}

#contents.yag-page {
  /**************************************************************
  * General
  **************************************************************/
}
#contents.yag-page main {
  width: 100%;
  position: relative;
  background-color: #fff;
  font-size: 18px;
}
#contents.yag-page em,
#contents.yag-page small,
#contents.yag-page strong {
  font-style: normal;
}
#contents.yag-page a:hover {
  opacity: 0.8;
  transition: 0.3s ease;
}
#contents.yag-page .container {
  width: 100%;
  margin: 0 auto;
  padding-inline: 4%;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .container {
    width: calc(var(--container-size) + 40px);
    padding-inline: 20px;
  }
}
@media screen and (min-width: 768px) {
  #contents.yag-page .pc-none {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  #contents.yag-page .sp-none {
    display: none;
  }
}
#contents.yag-page .color-gold {
  color: var(--color-gold);
}
#contents.yag-page p {
  font-size: calc(24 / 750 * 100vw);
  line-height: 1.66;
}
@media screen and (min-width: 768px) {
  #contents.yag-page p {
    font-size: 18px;
    line-height: 1.78;
  }
}
#contents.yag-page .text-annotation {
  font-size: calc(19 / 750 * 100vw);
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .text-annotation {
    font-size: 13px;
  }
}
#contents.yag-page {
  /**************************************************************
  * Modules
  **************************************************************/
  /* icons
  *****************************************/
}
#contents.yag-page .icon-arrow {
  display: block;
  background-color: #ffffff;
  width: 100%;
  height: 100%;
  clip-path: polygon(56% 36%, 100% 56%, 0 56%, 0 50%, 56% 50%);
}
#contents.yag-page .icon-arrow--bottom {
  transform: rotate(90deg);
}
#contents.yag-page {
  /* buttons
  *****************************************/
}
#contents.yag-page ._button-01 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  cursor: pointer;
  text-decoration: none;
  width: calc(540 / 750 * 100vw);
  height: calc(110 / 750 * 100vw);
  border-radius: calc(18 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page ._button-01 {
    width: 460px;
    height: 100px;
    border-radius: 18px;
  }
}
#contents.yag-page ._button-01--blue {
  background-color: #026EA8;
  color: #ffffff;
}
#contents.yag-page ._button-01--border-white {
  border: #ffffff solid;
  border-width: calc(6 / 750 * 100vw);
  box-shadow: calc(6 / 750 * 100vw) calc(6 / 750 * 100vw) calc(4 / 750 * 100vw) rgba(0, 0, 0, 0.16);
}
@media screen and (min-width: 768px) {
  #contents.yag-page ._button-01--border-white {
    border-width: 4px;
    box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.16);
  }
}
#contents.yag-page ._button-01__text {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  line-height: 1.4;
  text-align: center;
  font-size: calc(26 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page ._button-01__text {
    font-size: 22px;
    line-height: 1.5;
  }
}
#contents.yag-page ._button-01__arrow {
  position: absolute;
  top: 50%;
  right: calc(37 / 750 * 100vw);
  transform: translateY(-50%);
  width: calc(50 / 750 * 100vw);
  height: calc(50 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page ._button-01__arrow {
    right: 14px;
    width: 44px;
    height: 44px;
  }
}
#contents.yag-page .button-wrap {
  margin-top: calc(70 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .button-wrap {
    margin-top: 70px;
  }
}
#contents.yag-page main > section {
  width: 100%;
  margin-top: calc(70 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page main > section {
    margin-top: 70px;
  }
}
#contents.yag-page .sectionTitle {
  font-size: calc(36 / 750 * 100vw);
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionTitle {
    font-size: 36px;
  }
}
#contents.yag-page .sectionTitle--font-large {
  font-size: calc(40 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionTitle--font-large {
    font-size: 40px;
  }
}
#contents.yag-page .sectionTitle--font-small {
  font-size: calc(30 / 750 * 100vw);
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionTitle--font-small {
    font-size: 30px;
  }
}
#contents.yag-page .sectionContent {
  margin-top: calc(30 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionContent {
    margin-top: 30px;
  }
}
#contents.yag-page .sectionContent__body {
  margin-top: calc(30 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionContent__body {
    margin-top: 30px;
  }
}
#contents.yag-page .sectionBlock {
  display: flex;
  flex-direction: column;
  gap: calc(28 / 750 * 100vw);
  margin-top: calc(28 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionBlock {
    gap: 30px;
    margin-top: 30px;
  }
}
#contents.yag-page .sectionBlock__item {
  display: flex;
  flex-direction: column;
  gap: calc(7 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionBlock__item {
    gap: 8px;
  }
}
#contents.yag-page .sectionBlock__title {
  font-size: calc(28 / 750 * 100vw);
  font-weight: 700;
  line-height: 1.43;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .sectionBlock__title {
    font-size: 28px;
  }
}
#contents.yag-page {
  /**************************************************************
  * Page style
  **************************************************************/
}
#contents.yag-page .mainVisual {
  width: 100%;
  background-color: #000;
  margin-top: 0;
}
#contents.yag-page .mainVisual .container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(518 / 750 * 100vw);
  min-height: auto;
  background-image: url("../img/img_mainvisual01_sp.webp");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .mainVisual .container {
    height: auto;
    min-height: 400px;
    background-image: url("../img/img_mainvisual01.webp");
    background-size: 1120px auto;
  }
}
#contents.yag-page .mainVisual h1 {
  text-align: center;
}
#contents.yag-page .mainVisual h1 em {
  display: block;
  margin: 0;
  color: #bba171;
  font-size: calc(36 / 750 * 100vw);
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .mainVisual h1 em {
    font-size: 29px;
    line-height: normal;
  }
}
#contents.yag-page .mainVisual h1 strong {
  display: block;
  color: #fff;
  font-size: calc(44 / 750 * 100vw);
  font-weight: 500;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .mainVisual h1 strong {
    font-size: 36px;
  }
}
#contents.yag-page .yagIntro {
  width: 100%;
  margin-top: calc(74 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .yagIntro {
    margin-top: 77px;
  }
}
#contents.yag-page .benefitList {
  display: flex;
  flex-wrap: wrap;
  gap: calc(80 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .benefitList {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 38px;
  }
}
#contents.yag-page .benefitList__item {
  width: 100%;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .benefitList__item {
    width: auto;
    min-width: 0;
  }
}
#contents.yag-page .benefitList__content {
  display: flex;
  flex-direction: column;
  gap: calc(8 / 750 * 100vw);
  margin-top: calc(20 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  #contents.yag-page .benefitList__content {
    gap: 15px;
    margin-top: 20px;
  }
}
#contents.yag-page .benefitList__title {
  font-size: calc(28 / 750 * 100vw);
  font-weight: 700;
  line-height: 1.43;
  text-align: center;
}
@media screen and (min-width: 768px) {
  #contents.yag-page .benefitList__title {
    font-size: 28px;
  }
}
@media screen and (min-width: 768px) {
  #contents.yag-page .compareTable {
    margin-left: auto;
    margin-right: auto;
    width: 919px;
    text-align: center;
  }
}

/* icons
******************************************************/
.icon-accordinon-oc {
  position: relative;
}
.icon-accordinon-oc:before {
  position: absolute;
  background-color: #fff;
  transform: rotate(0deg);
  content: "";
  pointer-events: none;
  top: calc(50% - 0.4vw);
  right: 2.8vw;
  width: calc(34 / 750 * 100vw);
  height: calc(4 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  .icon-accordinon-oc:before {
    top: calc(50% - 4px);
    right: 34px;
    width: 29px;
    height: 4px;
  }
}
.icon-accordinon-oc:after {
  position: absolute;
  background-color: #fff;
  transform: rotate(90deg);
  content: "";
  pointer-events: none;
  transition: 0.2s;
  top: calc(50% - 0.4vw);
  right: 2.8vw;
  width: calc(34 / 750 * 100vw);
  height: calc(4 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  .icon-accordinon-oc:after {
    top: calc(50% - 4px);
    right: 34px;
    width: 29px;
    height: 4px;
  }
}

/*  _accordion
***************************************************/
.accordion-wrap:nth-of-type(n+2) {
  margin: calc(34 / 750 * 100vw) 0;
}
@media screen and (min-width: 768px) {
  .accordion-wrap:nth-of-type(n+2) {
    margin: 50px 0;
  }
}

.accordion-wrap:last-of-type {
  margin-bottom: 0;
}

._accordion__head {
  background: #3C3A39;
  cursor: pointer;
  position: relative;
  transition-delay: 0.3s;
  padding: 0 calc(76 / 750 * 100vw) 0 calc(90 / 750 * 100vw);
  min-height: calc(104 / 750 * 100vw);
}
@media screen and (max-width: 767px) {
  ._accordion__head {
    display: flex;
    align-items: center;
  }
}
@media screen and (min-width: 768px) {
  ._accordion__head {
    min-height: auto;
    padding: 25px 82px 30px 86px;
  }
}
._accordion__head::before {
  content: "Q";
  font-family: "Helvetica", "Helvetica Neue", Arial, sans-serif;
  font-size: calc(71 / 750 * 100vw);
  color: #fff;
  position: absolute;
  left: calc(17 / 750 * 100vw);
}
@media screen and (max-width: 767px) {
  ._accordion__head::before {
    top: 50%;
    transform: translateY(-50%);
  }
}
@media screen and (min-width: 768px) {
  ._accordion__head::before {
    font-size: 62px;
    top: 12px;
    left: 18px;
  }
}
._accordion__head .icon-accordinon-oc__wrap {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
}
._accordion__head.open .icon-accordinon-oc::after {
  transform: rotate(0deg);
}
._accordion__head__title {
  color: #fff;
  font-weight: 500;
  line-height: 1.4;
  font-size: calc(28 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  ._accordion__head__title {
    font-size: 28px;
  }
}
._accordion__body {
  position: relative;
}
._accordion__body__inner {
  line-height: 1.6;
  padding: calc(18 / 750 * 100vw) 0 0;
}
@media screen and (min-width: 768px) {
  ._accordion__body__inner {
    padding: 10px 0 0;
  }
}
._accordion__body__title {
  padding: 0 0 0 calc(22 / 750 * 100vw);
  font-size: calc(28 / 750 * 100vw);
  line-height: 1.286;
  color: #BBA171;
  font-weight: 500;
  display: flex;
  width: 100%;
  align-items: center;
  gap: calc(20 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  ._accordion__body__title {
    padding: 0 0 0 24px;
    font-size: 28px;
    gap: 20px;
  }
}
._accordion__body__title::before {
  content: "A";
  font-family: "Helvetica", "Helvetica Neue", Arial, sans-serif;
  font-size: calc(71 / 750 * 100vw);
  color: #BBA171;
}
@media screen and (min-width: 768px) {
  ._accordion__body__title::before {
    font-size: 62px;
  }
}
._accordion__body__content {
  font-size: calc(24 / 750 * 100vw);
}
@media screen and (min-width: 768px) {
  ._accordion__body__content {
    font-size: 18px;
  }
}/*# sourceMappingURL=yag.css.map */