@import url("https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..700&display=swap");
/*footer*/
.allcontents,
.footer-conversion {
  display: none; }

.txt-link {
  border-top: 1px solid #e9eae6;
  padding-top: 2rem; }

.page-caption .abbreviation {
  color: #333;
  width: 90%;
  max-width: 1100px;
  margin-inline: auto;
  font-size: 1.2rem;
  display: flex;
  flex-wrap: wrap;
  column-gap: 8px; }
.page-caption .legend {
  color: #333;
  width: 90%;
  max-width: 1100px;
  margin-inline: auto;
  font-size: 1.2rem;
  display: flex;
  flex-wrap: wrap;
  column-gap: 10px; }
  .page-caption .legend .list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 10px; }
    .page-caption .legend .list li {
      display: flex;
      align-items: center;
      column-gap: 3px; }

.page-header {
  padding: 8rem 5% 7rem;
  text-align: center; }
  .page-header .jp {
    font-size: 2.2rem;
    letter-spacing: 0.4em;
    line-height: 1.4; }
  .page-header .en {
    font-family: "adobe-garamond-pro", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 2rem;
    color: #a8a082;
    letter-spacing: 0.3em;
    margin-top: 2rem; }

/******************************************************

plan-list

******************************************************/
.page-main .main-name {
  top: 65%; }

.page-header {
  background-color: #fff; }

.plan-list {
  background-color: #f2f1ed; }
  .plan-list .inner {
    max-width: 1000px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6rem; }
  .plan-list .plan {
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.07); }
    .plan-list .plan img {
      transition: filter .3s linear; }
    .plan-list .plan a:hover > img {
      filter: brightness(105%); }

@media screen and (max-width: 768px) {
  .page-main .main-name {
    top: 50%; } }
@media screen and (max-width: 1121px) {
  .plan-list .inner {
    gap: 3rem; } }
@media screen and (max-width: 768px) {
  .plan-list .inner {
    max-width: 420px;
    display: block; }
    .plan-list .inner .plan {
      margin-top: 4rem; } }
/******************************************************

plan-detail

******************************************************/
.plan-detail #allWrapper #container {
  background-color: #3b414c;
  padding-top: 14rem !important; }

.plan-detail .page-header {
  background-color: #f2f1ed; }
.plan-detail .section {
  background-color: #fff; }
  .plan-detail .section .inner {
    max-width: 1000px;
    display: grid;
    grid-template-columns: 40% 60%; }
.plan-detail .spec {
  color: #8a7e6e;
  --spec-padding: 5rem;
  line-height: 1; }
  .plan-detail .spec .type-name {
    font-family: "adobe-garamond-pro", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 3.1rem;
    padding-right: var(--spec-padding);
    letter-spacing: 0.1em; }
    .plan-detail .spec .type-name .alphabet {
      font-family: "adobe-garamond-pro", serif;
      font-weight: 400;
      font-style: normal;
      font-size: 200%;
      margin-right: 1rem; }
  .plan-detail .spec .scale {
    padding-right: var(--spec-padding);
    font-size: 1.8rem;
    margin-top: 1.5rem; }
    .plan-detail .spec .scale .number {
      font-size: 225%; }
  .plan-detail .spec .other-scale {
    padding-right: var(--spec-padding);
    font-size: 1.8rem;
    margin-top: 2rem; }
    .plan-detail .spec .other-scale li {
      margin-top: 0.5rem; }
  .plan-detail .spec .layout {
    font-family: "adobe-garamond-pro", serif;
    font-weight: 400;
    font-style: normal;
    padding-right: var(--spec-padding);
    border-top: 1px solid #b4a898;
    font-feature-settings: "palt";
    font-size: 2.2rem;
    letter-spacing: 0em;
    padding-top: 2.5rem;
    margin-top: 3.5rem; }
    .plan-detail .spec .layout .number {
      font-size: 200%; }
    .plan-detail .spec .layout .aw.small {
      text-align: center;
      font-size: 1.5rem;
      transform: translateY(20%); }
  .plan-detail .spec .point-list {
    background: #e7e3d3;
    margin-right: var(--spec-padding);
    margin-top: 3.5rem;
    box-sizing: border-box;
    padding-bottom: 2rem; }
    .plan-detail .spec .point-list h5 {
      display: block;
      text-align: center;
      box-sizing: border-box;
      color: #fff;
      background: #60574b;
      font-size: 1.6rem;
      line-height: 1.4;
      padding: 1rem 0.5rem; }
    .plan-detail .spec .point-list ul {
      display: grid;
      grid-template-columns: 1fr;
      gap: 6px;
      margin: 2rem 2rem 0rem; }
      .plan-detail .spec .point-list ul li {
        font-feature-settings: "palt";
        background-color: #fff;
        font-size: 1.8rem;
        text-align: center;
        padding: 1.2rem 10px;
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15);
        position: relative;
        overflow: hidden;
        font-weight: bold; }
        .plan-detail .spec .point-list ul li .num {
          position: absolute;
          white-space: nowrap;
          font-family: "adobe-garamond-pro", serif;
          font-weight: 400;
          font-style: normal;
          left: 8%;
          top: 55%;
          font-size: 4rem;
          transform: translate(-50%, -50%);
          z-index: 0;
          color: #d7dce8;
          display: none; }
.plan-detail .figure {
  border-left: 1px solid #b4a898;
  text-align: center;
  padding: 0 5rem; }
  .plan-detail .figure img {
    width: 100%;
    height: auto; }
.plan-detail .return-plan-list {
  grid-column: span 2;
  max-width: 410px;
  width: 100%;
  margin-inline: auto;
  margin-top: 7rem; }
  .plan-detail .return-plan-list a {
    background-color: #8a909b;
    border-radius: 0.5rem;
    display: block;
    font-size: 1.8rem;
    color: #fff;
    width: 100%;
    padding: 1.5rem 1rem;
    position: relative;
    text-align: center;
    transition: filter 0.3s linear; }
    .plan-detail .return-plan-list a::before {
      position: absolute;
      left: 2rem;
      top: 50%;
      translate: 0 -50%;
      content: '';
      width: 20px;
      height: 4px;
      border-bottom: solid 1px currentColor;
      border-left: solid 1px currentColor;
      transform: skewX(-35deg); }
    .plan-detail .return-plan-list a:hover {
      filter: brightness(110%); }
.plan-detail .section .inner.wide-inner {
  display: block !important;
  text-align: center !important; }
  .plan-detail .section .inner.wide-inner .point-list ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0px;
    margin-top: 1.4rem; }
    .plan-detail .section .inner.wide-inner .point-list ul li {
      width: 33%;
      margin-top: 6px; }
  .plan-detail .section .inner.wide-inner .figure {
    margin-top: 7rem;
    width: 86%;
    margin-left: 7%;
    margin-right: 7%;
    border-left: none; }
  @media screen and (max-width: 600px) {
    .plan-detail .section .inner.wide-inner .point-list ul li {
      width: 49%; } }
  @media screen and (max-width: 500px) {
    .plan-detail .section .inner.wide-inner .point-list ul li {
      width: 100%; }
    .plan-detail .section .inner.wide-inner .figure {
      width: 100%;
      margin-left: 0%;
      margin-right: 0%; } }

@media screen and (max-width: 768px) {
  .plan-detail #allWrapper #container {
    padding-top: 0 !important; }

  .plan-detail .section .inner {
    grid-template-columns: 1fr; }
  .plan-detail .spec {
    --spec-padding: 0;
    text-align: center; }
    .plan-detail .spec .point-list {
      grid-template-columns: repeat(2, 1fr); }
      .plan-detail .spec .point-list li {
        display: grid;
        place-content: center; }
  .plan-detail .figure {
    width: 80%;
    border-left: 0;
    padding: 0;
    margin-top: 7rem;
    margin-inline: auto; }
  .plan-detail .return-plan-list {
    grid-column: span 1; } }
@media screen and (max-width: 600px) {
  .txt-link {
    padding-top: 0; } }
.arrow-sec {
  position: relative; }
  .arrow-sec .a-left,
  .arrow-sec .a-right {
    position: absolute;
    top: 40%;
    display: block;
    width: 0;
    height: 0;
    border-left: 2rem solid transparent;
    border-right: 2rem solid transparent;
    border-bottom: 2rem solid #000; }
  .arrow-sec .a-left {
    left: 0;
    transform: translateX(-150%) translateY(-50%) rotate(-90deg); }
  .arrow-sec .a-right {
    right: 0;
    transform: translateX(150%) translateY(-50%) rotate(90deg); }
  @media screen and (max-width: 600px) {
    .arrow-sec {
      width: 80%; } }