@charset "UTF-8";
/* ===================================================================
CSS information

file name  : anniversary.css
author     : Abilive
style info : コピー
=================================================================== */
/* ===================================================================
CSS information

file name  : _settings.scss
author     : Abilive
style info : 汎用設定
=================================================================== */
.p-intro .inner, .p-surprise .inner, .p-contact .inner {
  margin-right: auto;
  margin-left: auto;
}
@media only screen and (min-width: 1025px) {
  .p-intro .inner, .p-surprise .inner, .p-contact .inner {
    width: calc(1200 / 1440 * 100%);
    max-width: calc(1200px);
  }
}
@media only screen and (min-width: 1025px) and (min-width: 1441px) {
  .p-intro .inner, .p-surprise .inner, .p-contact .inner {
    max-width: calc(1200px * ((14 + 0) / 14));
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-intro .inner, .p-surprise .inner, .p-contact .inner {
    width: calc(1200 / 1440 * 100%);
  }
}
@media only screen and (max-width: 767px) {
  .p-intro .inner, .p-surprise .inner, .p-contact .inner {
    width: calc(700 / 768 * 100%);
  }
}

html.lower #anniversary #contents {
  --color-txt-content: #010101;
  --color-title: #4f695a;
  --color-title-sub: #010101;
  background: #fffdf9;
  color: var(--color-txt-content);
}
html.lower #anniversary #contents .topicpath li::before {
  color: var(--color-txt-content) !important;
}
html.lower #anniversary #contents .topicpath span {
  color: var(--color-txt-content) !important;
}
html.lower #anniversary #contents .ttl1::before,
html.lower #anniversary #contents .ttl1::after {
  background-color: transparent;
}
html.lower #anniversary #contents .ttl1.inline::before {
  background-color: var(--color-title);
}
html.lower #anniversary #contents .ttl1.inline::after {
  background-color: #cfcecd;
}
html.lower #anniversary #contents .txt {
  color: var(--color-txt-content);
}

@media only screen and (max-width: 767px) {
  #anniversary .box_mv h2 .jp {
    max-width: 17.5rem;
    margin: 0 auto;
  }
}
@media only screen and (max-width: 400px) {
  #anniversary .box_mv h2 .jp {
    max-width: 16.25rem;
  }
}

.con_anniversary {
  background: url(../../allinclusive/images/bg_ptn.jpg) center bottom/cover no-repeat;
}
@media only screen and (min-width: 1025px) {
  .con_anniversary {
    padding-bottom: 6.25rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .con_anniversary {
    padding-bottom: 5rem;
  }
}
@media only screen and (max-width: 767px) {
  .con_anniversary {
    padding-bottom: 3.75rem;
  }
}
.con_anniversary .ttl1 span {
  color: var(--color-txt-content);
}
.con_anniversary .ttl1 span.txt-small {
  display: inline;
  font-size: 0.9375rem;
  margin-left: 1.25rem;
}

@media only screen and (min-width: 1025px) {
  .p-intro {
    padding: 3.125rem 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-intro {
    padding: 2.5rem 0;
  }
}
@media only screen and (max-width: 767px) {
  .p-intro {
    padding: 1.25rem 0;
  }
}
@media only screen and (min-width: 768px) {
  .p-intro .inner {
    max-width: 1024px;
    width: calc(1024 / 1440 * 100%);
    margin-right: auto;
    margin-left: auto;
  }
}
@media only screen and (min-width: 768px) and (min-width: 1441px) {
  .p-intro .inner {
    max-width: calc(1024px * ((14 + 1) / 14));
  }
}

.p-intro .ttl1 {
  margin-bottom: 1.25rem;
}
@media only screen and (max-width: 767px) {
  .p-intro .ttl1 {
    padding-top: 0;
  }
}
.p-intro .ttl1 span {
  color: var(--color-txt-content);
}
@media only screen and (max-width: 767px) {
  .p-intro .ttl1:before, .p-intro .ttl1:after {
    display: none;
  }
}
.p-intro p {
  text-align: center;
}

@media only screen and (min-width: 1025px) {
  .p-surprise {
    padding: 6.25rem 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-surprise {
    padding: 5rem 0;
  }
}
@media only screen and (max-width: 767px) {
  .p-surprise {
    padding: 2.5rem 0;
  }
}
@media only screen and (min-width: 768px) {
  .p-surprise .inner {
    max-width: 1024px;
    width: calc(1024 / 1440 * 100%);
    margin-right: auto;
    margin-left: auto;
  }
}
@media only screen and (min-width: 768px) and (min-width: 1441px) {
  .p-surprise .inner {
    max-width: calc(1024px * ((14 + 1) / 14));
  }
}

.p-surprise .ttl1 .en {
  color: var(--color-title);
}
.p-surprise .ttl1 .jp {
  color: var(--color-title-sub);
}
.p-surprise--items {
  margin-top: 1.25rem;
}
.p-surprise--item .tbl_basic {
  margin: 1.25rem 0;
}
@media only screen and (min-width: 768px) {
  .p-surprise--item .tbl_basic table tr th {
    width: auto;
    text-align: left;
  }
}
@media only screen and (min-width: 768px) {
  .p-surprise--item .tbl_basic table tr td {
    width: auto;
    text-align: right;
  }
}
@media only screen and (min-width: 1025px) {
  .p-surprise--item p {
    padding: 0 1.25rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-surprise--item p {
    padding: 0 1.25rem;
  }
}
@media only screen and (max-width: 767px) {
  .p-surprise--item p {
    padding: 0 0.8em;
  }
}
.p-surprise:not(.p-surprise2) .p-surprise--item {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media only screen and (min-width: 768px) {
  .p-surprise:not(.p-surprise2) .p-surprise--item {
    grid-template-columns: 42% 55%;
    gap: 3%;
  }
}

.p-surprise2 .p-surprise--items {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media only screen and (min-width: 768px) {
  .p-surprise2 .p-surprise--items {
    grid-template-columns: repeat(2, 1fr);
  }
}

.p-contact {
  color: #fff;
}
@media only screen and (min-width: 1025px) {
  .p-contact {
    padding: 3.125rem 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-contact {
    padding: 2.5rem 0;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact {
    padding: 1.25rem 0;
  }
}
.p-contact .inner {
  background: rgba(0, 0, 0, 0.6);
}
@media only screen and (min-width: 1025px) {
  .p-contact .inner {
    padding: 3.125rem 3.125rem 4.6875rem 3.125rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-contact .inner {
    padding: 2.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact .inner {
    padding: 1.25rem 0.625rem;
  }
}
@media only screen and (min-width: 768px) {
  .p-contact .inner {
    max-width: 1024px;
    width: calc(1024 / 1440 * 100%);
    margin-right: auto;
    margin-left: auto;
  }
}
@media only screen and (min-width: 768px) and (min-width: 1441px) {
  .p-contact .inner {
    max-width: calc(1024px * ((14 + 1) / 14));
  }
}

.p-contact a {
  color: #fff;
}
.p-contact .c-title {
  text-align: center;
  font-size: 1rem;
}
.p-contact .c-tel {
  font-size: 1.375rem;
  font-family: 'EB Garamond', serif;
}
.p-contact .tel-num {
  text-decoration: none;
}
@media only screen and (min-width: 1025px) {
  .p-contact .tel-num {
    font-size: 2.5625rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .p-contact .tel-num {
    font-size: 1.875rem;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact .tel-num {
    font-size: 1.875rem;
  }
}
.p-contact .box_lnk {
  text-align: center;
  margin-bottom: 1.875rem;
}
.p-contact .box_lnk a {
  text-decoration: underline;
  color: #fff;
  font-size: 1.375rem;
}
.p-contact .btn_cv a {
  width: auto;
}
.p-contact--item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 5rem;
}
@media only screen and (min-width: 1025px) {
  .p-contact--item {
    gap: 9.375rem;
  }
}
@media only screen and (max-width: 767px) {
  .p-contact--item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 1.25rem;
  }
}