/* General */
.mobile {
  display: none;
}
section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
}
section.bg-white {
  background-color: #FFF;
}
section.bg-mzv-blue {
  background-color: #14415A;
}
section.bg-light-blue {
  background-color: #E5EAEC;
}
section.bg-light-grey {
  background-color: #F2F2F2;
}

div.inner-1280 {
  width: 100%;
  max-width: 1280px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div.inner-1440 {
  width: 100%;
  max-width: 1440px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

main#salon h2 {
  text-align: center !important;
  font-size: 42px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 42px !important; /* 100% */
  letter-spacing: 0.8px !important;
  border-bottom: 4px solid var(--Dandelion-Yellow, #EEE93A);
  padding-bottom: 16px;
  margin-bottom: 60px;
}
p.sub-head-en {
  text-align: center !important;
  font-size: 22px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 22px !important; /* 100% */
  letter-spacing: 4px !important;
  margin-bottom: 16px;
}
p.sub-copy {
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 30px !important; /* 187.5% */
  letter-spacing: 0.8px !important;
  max-width: 1280px;
}

/* Section 1 */
section#section1 div.inner-1280 {
  margin: 100px auto 100px;
}
section#section1 h2 {
  color: #14415A;
}
section#section1 p {
  color: #14415A;
  text-align: center !important;
  font-size: 28px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 44px !important; /* 157.143% */
  letter-spacing: 1px !important;
}

/* Section 2 */
section#section2 div.inner-1440 {
  margin: 100px auto 120px;
}
section#section2 p.sub-head-en {
  color: white;
}
section#section2 h2 {
  color: white;
}
p.sub-copy {
  color: white;
  margin-bottom: 48px;
  padding: 0 20px;
}
ul.about-points {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 24px;
}
ul.about-points li {
  display: flex;
  align-self: stretch;
  width: 440px;
  min-width: 360px;
  max-width: 440px;
  padding: 40px 40px 48px 52px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  border-radius: 8px;
  background: #FFF;
}
ul.about-points span.num {
  color: var(--Accent-Blue, #7DA0BE);
  text-align: center;
  font-size: 38px;
  font-style: normal;
  font-weight: 700;
  line-height: 38px; /* 100% */
  letter-spacing: 0.8px;
}
ul.about-points span.title {
  color: var(--MZV-Blue, #14415A);
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px; /* 128.571% */
  letter-spacing: 0.8px;
}
ul.about-points span.body {
  color: var(--MZV-Blue, #14415A);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 30px; /* 187.5% */
  letter-spacing: 0.8px;
}

/* Section 3 */
section#section3 div.inner-1440 {
  margin: 100px auto 120px;
}
section#section3 p.sub-head-en {
  color: #14415A;
}
section#section3 h2 {
  color: #14415A;
}
section#section3 ul.company-logo-list {
  display: flex;
  max-width: 1440px;
  padding: 0px 80px 48px 80px;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 32px;
  align-self: stretch;
  flex-wrap: wrap;
}
section#section3 ul.company-logo-list li {
  height: 164px;
  width: 286px;
  padding: 40px;
  border-radius: 8px;
  background: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
  /* overflow: hidden; */
}
section#section3 ul.company-logo-list img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
}
section#section3 ul.company-name-list {
  display: flex;
  width: 1440px;
  max-width: 1440px;
  padding: 0px 80px 80px 80px;
  justify-content: center;
  align-items: center;
  gap: 24px;
}
section#section3 ul.company-name-list li {
  color: var(--MZV-Blue, #14415A);
  text-align: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 44px; /* 157.143% */
  letter-spacing: 1px;
}
.testimonial-container {
  display: flex;
  max-width: 1440px;
  padding: 0px 80px;
  justify-content: center;
  align-items: center;
  gap: 24px;
  align-self: stretch;
}
.testimonial-block {
  display: flex;
min-width: 360px;
max-width: 440px;
padding: 52px 40px 52px 52px;
flex-direction: column;
align-items: flex-start;
gap: 24px;
flex: 1 0 0;
align-self: stretch;
border-radius: 40px;
background: #FFF;
align-self: stretch;
position: relative;
}
.quotation-mark {
  color: var(--Light-Blue, #E5EAEC);
text-align: center;
font-family: "Noto Sans JP";
font-size: 80px;
font-style: normal;
font-weight: 700;
line-height: 38px; /* 47.5% */
letter-spacing: 0.8px;
position: absolute;
left: 13px;
top: 28px;
}
.testimonial-block h3 {
  color: var(--MZV-Blue, #14415A);
font-family: "Noto Sans JP";
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 30px; /* 166.667% */
letter-spacing: 0.8px;
align-self: stretch;
}
.testimonial-block p.testimonial-content {
  color: var(--MZV-Blue, #14415A);
font-family: "Noto Sans JP";
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 30px; /* 187.5% */
letter-spacing: 0.8px;
align-self: stretch;
}
.testimonial-block p.testimonial-person {
  color: var(--MZV-Blue, #14415A);
font-family: "Noto Sans JP";
font-size: 15px;
font-style: normal;
font-weight: 800;
line-height: 16px; /* 106.667% */
letter-spacing: 0.8px;
align-self: stretch;
}

/* Section 4 */
section#section4 div.inner-1440 {
  margin: 100px auto 180px;
}
section#section4 p.sub-head-en {
  color: #14415A;
}
section#section4 h2 {
  color: #14415A;
}
section#section4 p.sub-copy {
  color: #14415A;
  margin-bottom: 100px;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 28px !important; /* 155.556% */
  letter-spacing: 0.8px !important;
}
.events-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 1280px;
}
.events-container h3 {
  color: var(--MZV-Blue, #14415A);
  font-size: 34px;
  font-style: normal;
  font-weight: 700;
  line-height: 44px; /* 129.412% */
  letter-spacing: 0.8px;
  margin-bottom: 16px;
}
.events-by-year {
  display: flex;
  width: 1440px;
  max-width: 1440px;
  padding: 24px 0px 48px 0px;
  align-items: center;
  align-content: center;
  gap: 40px 80px;
  flex-wrap: wrap;
}
li.event-card {
  display: flex;
width: 360px;
min-height: 228px;
min-width: 360px;
max-width: 440px;
padding: 32px 32px 32px 44px;
flex-direction: column;
align-items: flex-start;
gap: 16px;
flex-shrink: 0;
border-radius: 0px 40px 40px 0px;
border-left: 6px solid var(--Accent-Blue, #7DA0BE);
background: #FFF;
box-shadow: 8px 8px 32px 5px rgba(85, 124, 170, 0.12);
}
li.event-card .event-date {
  color: var(--Accent-Blue, #7DA0BE);
text-align: center;
font-family: "Noto Sans JP";
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 24px; /* 100% */
letter-spacing: 0.8px;
}
li.event-card .event-title {
color: var(--MZV-Blue, #14415A);
font-family: "Noto Sans JP";
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: 36px; /* 128.571% */
letter-spacing: 0.8px;
}
li.event-card a.event-title {
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: none;
text-decoration-thickness: auto;
text-underline-offset: auto;
text-underline-position: from-font;
}
li.event-card svg  {
  width: 24px;
  height: 24px;
  fill: #B63580;
}
li.event-card .event-location, li.event-card .event-time {
display: flex;
align-items: center;
gap: 6px;
color: var(--MZV-Blue, #14415A);
font-family: "Noto Sans JP";
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 28px; /* 155.556% */
letter-spacing: 0.8px;
}
li.event-card.upcoming-event {
border-left: 10px solid var(--Accent-Pink, #EB95B6);
}
li.event-card.upcoming-event .event-date{
color: var(--Pink, #B63580);
}

/* Contact */
section#contact div.inner-1280 {
  margin: 100px auto 80px;
}
section#contact p.sub-head-en {
  color: white;
}
section#contact h2 {
  color: white;
}
section#contact a {
  display: flex;
padding: 14px 28px;
justify-content: center;
align-items: center;
border-radius: 27px;
background: var(--Bright-Yellow, #FF0);
color: var(--MZV-Blue, #14415A);
text-align: center;

font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 26px; /* 144.444% */
letter-spacing: 0.6px;
}

/* Section FAQ */
section#faq div.inner-1280 {
  margin: 100px auto 120px;
}
section#faq p.sub-head-en {
  color: #14415A;
}
section#faq h2 {
  color: #14415A;
}
.faq-container {
  display: flex;
width: 1000px;
min-width: 800px;
max-width: 1000px;
padding: 0px 80px 0px 80px;
flex-direction: column;
align-items: flex-start;
gap: 38px;
}
.faq-item {
  display: flex;
padding: 8px 0px 24px 0px;
flex-direction: column;
align-items: flex-start;
gap: 4px;
align-self: stretch;
border-bottom: 2px solid var(--Accent-Blue, #7DA0BE);
}
section#faq .faq-item h4 {
  color: var(--MZV-Blue, #14415A);
font-size: 21px;
font-style: normal;
font-weight: 700;
line-height: 30px; /* 142.857% */
letter-spacing: 0.8px;
}
section#faq .faq-item p {
  color: var(--MZV-Blue, #14415A);
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 30px; /* 187.5% */
letter-spacing: 0.8px;
}

@media (max-width: 1279px) {
/* General */
p.sub-head-en {
  font-size: 16px !important;
  line-height: 16px !important; /* 100% */
}
main#salon h2 {
  font-size: 21px !important;
  line-height: 28px !important; /* 133.333% */
  letter-spacing: 0.6px !important;
  padding-bottom: 6px !important;
  margin-bottom: 24px !important;
}
p.sub-copy {
font-size: 14px !important;
font-weight: 400 !important;
line-height: 24px !important; /* 171.429% */
letter-spacing: 0.6px !important;
}
/* Section 1 */
section#section1 div.inner-1280 {
  margin: 48px auto 32px;
}
section#section1 p {
  padding: 0 20px;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  letter-spacing: 0.6px !important;
  text-align: left !important;
}
/* Section 2 */
ul.about-points li {
  width: 300px;
  min-width: 300px;
}
ul.about-points span.title {
  font-size: 22px;
  line-height: 22px; /* 128.571% */
}
ul.about-points span.body {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px; /* 187.5% */
  letter-spacing: 0.6px;
}
section#section2 div.inner-1440 {
  margin: 80px auto 40px;
}

/* Section 3 */
section#section3 div.inner-1440 {
  margin: 80px auto 48px;
}
section#section3 ul.company-logo-list {
  padding: 0px 0px 48px 0px;
  align-content: center;
  gap: 32px;
  align-self: stretch;
  flex-wrap: wrap;
}
section#section3 ul.company-logo-list li {
  padding: 32px 24px;
}
section#section3 ul.company-name-list {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0px 24px 80px;
  justify-content: center;
  align-items: center;
  gap: 0px;
}
section#section3 ul.company-name-list li {
  font-size: 18px;
  line-height: 28px;
}
.testimonial-container {
  padding: 0px;
  margin: auto 10px;
  flex-wrap: wrap;
}
.testimonial-block {
  position: relative;
  width: 100%;
  max-width: 440px;
/* flex: 1 0 0; */
}
.quotation-mark {
}
.testimonial-block h3 {
font-size: 16px;
line-height: 24px; /* 166.667% */
}
.testimonial-block p.testimonial-content {
font-size: 14px;
font-weight: 400;
line-height: 24px; /* 187.5% */
letter-spacing: 0.6px;
}
.testimonial-block p.testimonial-person {
font-size: 14px;
line-height: 14px; /* 106.667% */
}

/* Section 4 */
section#section4 p.sub-copy {
  margin-bottom: 32px;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 24px !important; /* 155.556% */
  letter-spacing: 0.6px !important;
}
.events-container {
  width: 100%;
  padding: 0 10px;
}
.events-container h3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 28px; /* 129.412% */
}
.events-by-year {
  max-width: 100%;
  padding: 24px 0px 48px 0px;
  gap: 40px;
}
li.event-card {
  width: 100%;
  max-width: 360px;
  min-height: 189px;
padding: 32px 24px 32px 32px;
border-radius: 0px 40px 40px 0px;
}
li.event-card .event-date {
font-size: 18px;
line-height: 18px; /* 100% */
}
li.event-card .event-title {
font-size: 24px;
line-height: 24px; /* 128.571% */
}
li.event-card svg  {
  width: 24px;
  height: 24px;
  fill: #B63580;
}
li.event-card .event-location, li.event-card .event-time {
font-size: 16px;
line-height: 16px; /* 155.556% */
}
li.event-card.upcoming-event {
border-left: 6px solid var(--Accent-Pink, #EB95B6);
}
li.event-card.upcoming-event .event-date{
color: var(--Pink, #B63580);
}

/* FAQ */
section#faq div.inner-1280 {
  margin: 80px auto 80px;
}
.faq-container {
  display: flex;
width: 100%;
max-width: 1000px;
padding: 0px 10px;
min-width: 300px;
}
.faq-item {
} 
section#faq .faq-item h4 {
font-size: 16px;
line-height: 24px; /* 142.857% */
}
section#faq .faq-item p {
font-size: 14px;
font-weight: 400;
line-height: 24px; /* 187.5% */
letter-spacing: 0.6px;
}
}

@media (max-width: 599px) {
.mobile {
  display: block;
}
.desktop {
  display: none;
}
}
