@charset "utf-8";
/* CSS Document */
/*=================================
About Intro
=================================*/
.about-intro {
  padding:80px 0;
}
.about-intro-wrap {
  display:flex;
  align-items:center;
  gap:70px;
}
.about-intro-text {
  flex:1;
}
.about-intro-text .lead {
  font-size:24px;
  font-weight:700;
  line-height:1.8;
  color:var(--main);
  margin-bottom:25px;
}
.about-intro-text p {
  line-height:2;
  color:#555;
}
.about-intro-image {
  width:45%;
  max-width:520px;
}
.about-intro-image img {
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:10px;
  box-shadow:0 15px 35px rgba(0,0,0,.12);
}
@media (max-width:767px) {
  .about-intro {
    padding:60px 0;
  }
  .about-intro-wrap {
    flex-direction:column-reverse;
    gap:35px;
  }
  .about-intro-image {
    width:100%;
  }
  .about-intro-text .lead {
    font-size:20px;
  }
}
/*=================================
About History
=================================*/
.about-history {
  position:relative;
  padding:100px 0 120px;
  background:#f6f8fb;
  overflow:hidden;
}
.about-history::before {
  content:"";
  position:absolute;
  top:-180px;
  right:-180px;
  width:430px;
  height:430px;
  border:1px solid rgba(31,70,115,.08);
  border-radius:50%;
}
.history-heading {
  text-align:center;
}
.history-lead {
  max-width:720px;
  margin:28px auto 55px;
  color:#555;
  line-height:2;
  text-align:center;
}
.history-accordion {
  max-width:980px;
  margin:0 auto;
}
.history-period {
  margin-bottom:16px;
  background:#fff;
  border:1px solid #e2e8ef;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(30,58,91,.05);
  overflow:hidden;
}
.history-period summary {
  position:relative;
  display:flex;
  align-items:center;
  min-height:60px;
  padding:20px 82px 20px 32px;
  cursor:pointer;
  list-style:none;
  transition:background .25s ease;
}
.history-period summary::-webkit-details-marker {
  display:none;
}
.history-period summary:hover {
  background:#f8fafc;
}
.history-period[open] summary {
  background:var(--main);
  color:#fff;
}
.history-period-title {
  display:flex;
  align-items:baseline;
  gap:5px;
  font-size:18px;
  letter-spacing:.08em;
}
.history-period-title b {
  font-family:Georgia,"Times New Roman",serif;
  font-size:38px;
  font-weight:400;
  line-height:1;
  letter-spacing:.03em;
}
.history-period-era {
  margin-left:auto;
  padding-right:15px;
  color:#788493;
  font-size:13px;
  letter-spacing:.08em;
}
.history-period[open] .history-period-era {
  color:rgba(255,255,255,.78);
}
.history-toggle {
  position:absolute;
  top:50%;
  right:32px;
  width:26px;
  height:26px;
  transform:translateY(-50%);
}
.history-toggle::before, .history-toggle::after {
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:18px;
  height:2px;
  background:var(--main);
  transform:translate(-50%,-50%);
  transition:transform .25s ease,background .25s ease;
}
.history-toggle::after {
  transform:translate(-50%,-50%) rotate(90deg);
}
.history-period[open] .history-toggle::before, .history-period[open] .history-toggle::after {
  background:#fff;
}
.history-period[open] .history-toggle::after {
  transform:translate(-50%,-50%) rotate(0);
}
.history-period-body {
  padding:10px 32px 28px;
}
/* 年ごとのまとまり */
.history-year-group {
  display:grid;
  grid-template-columns:150px 1fr;
  gap:28px;
  padding:32px 0;
  border-bottom:1px solid #e3e9ef;
}
.history-year-group:last-child {
  padding-bottom:8px;
  border-bottom:none;
}
.history-year-heading {
  padding:5px 0 0 8px;
}
.history-year-heading .history-year {
  display:block;
  font-size:34px;
}
.history-year-heading .history-jp-year {
  display:block;
  margin-top:8px;
  font-size:13px;
  letter-spacing:.08em;
}
.history-year-events {
  min-width:0;
}
.history-year-events .history-row {
  grid-template-columns:95px 1fr;
  gap:24px;
  padding-top:20px;
  padding-bottom:20px;
}
.history-year-events .history-row:first-child {
  padding-top:10px;
}
.history-year-events .history-row::before {
  top:24px;
}
.history-year-events .history-row:first-child::before {
  top:14px;
}
.history-year-events .history-row-important {
  margin-top:0;
  padding-top:24px;
  padding-bottom:24px;
}
.history-year-events .history-row-important::before {
  top:31px;
}
.history-year-events .history-month {
  width:auto;
  margin-top:0;
}
.history-row {
  position:relative;
  display:grid;
  grid-template-columns:190px 1fr;
  gap:35px;
  padding:28px 18px 28px 26px;
  border-bottom:1px solid #e8edf2;
}
.history-row:last-child {
  border-bottom:none;
}
.history-row::before {
  content:"";
  position:absolute;
  top:36px;
  left:4px;
  width:9px;
  height:9px;
  background:#fff;
  border:3px solid var(--main);
  border-radius:50%;
}
.history-row-important {
  margin:18px 0 8px;
  padding:28px 22px 28px 34px;
  background:#f4f7fa;
  border:1px solid #e0e7ee;
  border-radius:9px;
}
.history-row-important::before {
  left:12px;
  background:var(--main);
}
.history-date {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:5px 10px;
}
.history-year {
  color:var(--main);
  font-family:Georgia,"Times New Roman",serif;
  font-size:28px;
  line-height:1;
}
.history-jp-year {
  color:#89929c;
  font-size:12px;
}
.history-month {
  width:100%;
  margin-top:5px;
  color:#596675;
  font-size:14px;
  font-weight:700;
}
.history-event h3 {
  margin:0 0 8px;
  color:var(--main);
  font-size:20px;
  line-height:1.5;
}
.history-event p {
  margin:0;
  color:#4f5964;
  line-height:1.9;
}
.history-preparing {
  margin:18px 0 0;
  padding:25px;
  color:#7a8490;
  text-align:center;
  background:#f8fafc;
  border-radius:8px;
}
@media (max-width:767px) {
  .about-history {
    padding:70px 0 80px;
  }
  .history-lead {
    margin:22px auto 38px;
    text-align:left;
  }
  .history-lead br {
    display:none;
  }
  .history-period {
    margin-bottom:12px;
    border-radius:9px;
  }
  .history-period summary {
    min-height:45px;
    padding:16px 55px 16px 18px;
  }
  .history-period-title {
    font-size:15px;
  }
  .history-period-title b {
    font-size:30px;
  }
  .history-period-era {
    display:none;
  }
  .history-toggle {
    right:18px;
  }
  .history-period-body {
    padding:8px 16px 18px;
  }
  .history-row {
    display:block;
    padding:22px 8px 22px 24px;
  }
  .history-row::before {
    top:29px;
    left:4px;
  }
  .history-row-important {
    margin:12px 0 5px;
    padding:22px 16px 22px 30px;
  }
  .history-row-important::before {
    left:10px;
  }
  .history-date {
    margin-bottom:13px;
  }
  .history-month {
    width:auto;
    margin-top:0;
  }
  .history-event h3 {
    font-size:18px;
  }
}
@media (max-width:767px) {
  .history-year-group {
    display:block;
    padding:26px 0;
  }
  .history-year-heading {
    display:flex;
    align-items:baseline;
    gap:10px;
    margin-bottom:12px;
    padding-left:2px;
  }
  .history-year-heading .history-year, .history-year-heading .history-jp-year {
    display:inline-block;
    margin-top:0;
  }
  .history-year-heading .history-year {
    font-size:30px;
  }
  .history-year-events .history-row {
    grid-template-columns:1fr;
    gap:8px;
    padding-left:25px;
  }
  .history-row::before {
    width: 6px;
    height: 6px;
  }
  .history-year-events .history-row:first-child::before {
    top: 15px;
  }
  .history-year-events .history-row::before {
    top: 25px;
  }
}
}
/*=================================
About Contact
=================================*/
.about-contact {
  padding:110px 0;
  background:#fff;
}
.contact-heading, .privacy-heading {
  text-align:center;
}
.contact-lead, .privacy-lead {
  max-width:760px;
  margin:28px auto 55px;
  color:#555;
  line-height:2;
  text-align:center;
}
.contact-layout {
  display:grid;
  grid-template-columns:minmax(260px, .72fr) minmax(0, 1.45fr);
  gap:48px;
  align-items:start;
  max-width:1080px;
  margin:0 auto;
}
.contact-guide {
  position:sticky;
  top:110px;
  padding:34px 30px;
  color:#fff;
  background:var(--main);
  border-radius:12px;
  box-shadow:0 14px 34px rgba(25,57,94,.15);
}
.contact-guide-label {
  margin:0 0 15px;
  font-size:14px;
  letter-spacing:.08em;
}
.contact-tel {
  display:flex;
  align-items:center;
  gap:12px;
  color:#fff;
  /*font-family:Georgia,"Times New Roman",serif;*/
  font-weight: 700;
  letter-spacing: .1rem;
  font-size:clamp(25px,3vw,34px);
  line-height:1.2;
  text-decoration:none;
}
.contact-tel i {
  font-size:20px;
}
.contact-hours {
  margin-top:26px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.25);
}
.contact-hours div {
  margin-top:14px;
}
.contact-hours div:first-child {
  margin-top:0;
}
.contact-hours dt {
  margin-bottom:4px;
  color:rgba(255,255,255,.72);
  font-size:12px;
}
.contact-hours dd {
  font-size:14px;
  line-height:1.7;
}
.contact-note {
  margin:22px 0 0;
  color:rgba(255,255,255,.76);
  font-size:12px;
  line-height:1.8;
}
.contact-form-wrap {
  padding:42px;
  background:#f7f9fb;
  border:1px solid #e3e8ee;
  border-radius:12px;
}
.form-row {
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  gap:25px;
  align-items:start;
  padding:20px 0;
  border-bottom:1px solid #e1e7ed;
}
.form-row:first-child {
  padding-top:0;
}
.form-row label {
  padding-top:13px;
  color:#314050;
  font-size:14px;
  font-weight:700;
  line-height:1.6;
}
.required, .optional {
  display:inline-block;
  margin-left:8px;
  padding:2px 7px;
  border-radius:3px;
  font-size:10px;
  line-height:1.5;
  vertical-align:2px;
}
.required {
  color:#fff;
  background:#b84b50;
}
.optional {
  color:#647180;
  background:#e5e9ed;
}
.form-control input, .form-control select, .form-control textarea {
  width:100%;
  color:#333;
  background:#fff;
  border:1px solid #cfd7df;
  border-radius:6px;
  outline:none;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.form-control input, .form-control select {
  height:50px;
  padding:0 15px;
}
.form-control textarea {
  min-height:190px;
  padding:15px;
  resize:vertical;
  line-height:1.8;
}
.form-control input:focus, .form-control select:focus, .form-control textarea:focus {
  border-color:var(--main);
  box-shadow:0 0 0 3px rgba(31,70,115,.1);
}
.select-wrap {
  position:relative;
}
.select-wrap::after {
  content:"";
  position:absolute;
  top:50%;
  right:18px;
  width:8px;
  height:8px;
  border-right:2px solid #65717d;
  border-bottom:2px solid #65717d;
  transform:translateY(-70%) rotate(45deg);
  pointer-events:none;
}
.form-privacy-box {
  max-height:140px;
  margin-top:28px;
  padding:20px 22px;
  overflow-y:auto;
  color:#59636e;
  background:#fff;
  border:1px solid #d8e0e7;
  border-radius:6px;
  font-size:13px;
  line-height:1.8;
}
.form-privacy-box h3 {
  margin:0 0 8px;
  color:#314050;
  font-size:15px;
}
.form-privacy-box p {
  margin:8px 0 0;
}
.privacy-consent {
  display:flex;
  justify-content:center;
  align-items:flex-start;
  gap:11px;
  margin:28px auto 0;
  cursor:pointer;
  font-size:14px;
  line-height:1.7;
}
.privacy-consent input {
  width:18px;
  height:18px;
  margin-top:3px;
  accent-color:var(--main);
}
.privacy-consent a {
  color:var(--main);
  text-decoration:underline;
}
.privacy-consent em {
  margin-left:7px;
  color:#b84b50;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}
.hp-field {
  position:absolute;
  left:-9999px;
  top:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.form-submit {
  text-align:center;
  margin-top:28px;
}
.form-submit button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  min-width:310px;
  min-height:60px;
  padding:14px 30px;
  color:#fff;
  font-weight:700;
  letter-spacing:.08em;
  background:var(--main);
  border:1px solid var(--main);
  border-radius:999px;
  transition:color .25s ease,background .25s ease,transform .2s ease;
}
.form-submit button:hover {
  color:var(--main);
  background:#fff;
  transform:translateY(-2px);
}
/*=================================
About Privacy
=================================*/
.about-privacy {
  padding:100px 0 120px;
  background:#f6f8fb;
}
.privacy-details {
  max-width:980px;
  margin:0 auto;
  background:#fff;
  border:1px solid #dfe6ed;
  border-radius:12px;
  box-shadow:0 8px 24px rgba(30,58,91,.05);
  overflow:hidden;
}
.privacy-details summary {
  position:relative;
  display:flex;
  align-items:center;
  min-height:82px;
  padding:20px 80px 20px 30px;
  color:var(--main);
  font-weight:700;
  letter-spacing:.05em;
  cursor:pointer;
  list-style:none;
}
.privacy-details summary::-webkit-details-marker {
  display:none;
}
.privacy-details[open] summary {
  border-bottom:1px solid #e1e7ed;
}
.privacy-toggle {
  position:absolute;
  top:50%;
  right:30px;
  width:24px;
  height:24px;
  transform:translateY(-50%);
}
.privacy-toggle::before, .privacy-toggle::after {
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:17px;
  height:2px;
  background:var(--main);
  transform:translate(-50%,-50%);
  transition:transform .25s ease;
}
.privacy-toggle::after {
  transform:translate(-50%,-50%) rotate(90deg);
}
.privacy-details[open] .privacy-toggle::after {
  transform:translate(-50%,-50%) rotate(0);
}
.privacy-scroll {
  max-height:520px;
  padding:34px 38px 42px;
  overflow-y:auto;
  scrollbar-color:#9aabba #eef2f5;
  scrollbar-width:thin;
}
.privacy-scroll section {
  margin-top:30px;
  padding:26px 0;
  border-top:1px solid #e5eaf0;
}
.privacy-scroll section:first-child {
  border-top:0px solid #e5eaf0;
}
.privacy-scroll h3 {
  margin:0 0 12px;
  color:var(--main);
  font-size:18px;
}
.privacy-scroll p,.privacy-scroll li {
  color:#505b66;
  line-height:1.95;
}
.privacy-scroll ul {
  margin:12px 0 0;
  padding-left:1.4em;
}
@media (max-width:900px) {
  .contact-layout {
    grid-template-columns:1fr;
  }
  .contact-guide {
    position:static;
  }
}
@media (max-width:767px) {
  .about-contact {
    padding:75px 0;
  }
  .about-privacy {
    padding:75px 0 85px;
  }
  .contact-lead,.privacy-lead {
    margin:22px auto 38px;
    text-align:left;
  }
  .contact-lead br {
    display:none;
  }
  .contact-guide {
    padding:28px 22px;
  }
  .contact-form-wrap {
    padding:25px 18px;
  }
  .form-row {
    display:block;
    padding:18px 0;
  }
  .form-row label {
    display:block;
    padding:0 0 9px;
  }
  .form-submit button {
    width:100%;
    min-width:0;
  }
  .privacy-consent {
    justify-content:flex-start;
  }
  .privacy-details summary {
    min-height:72px;
    padding:16px 60px 16px 20px;
  }
  .privacy-toggle {
    right:20px;
  }
  .privacy-scroll {
    max-height:430px;
    padding:25px 20px 30px;
  }
  .privacy-scroll h3 {
    font-size:17px;
  }
}