@charset "UTF-8";

*, *::before, *::after {
box-sizing: border-box;
}
body, h1, h2, h3, h4, p, ul, ol, figure {
margin: 0;
padding: 0;
}
ul, ol {
list-style: none;
}
a {
color: inherit;
text-decoration: none;
}
img {
display: block;
max-width: 100%;
height: auto;
}
html {
font-size: 16px;
}
body {
background-color: #faf8f6;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 1rem;
line-height: 1.6;
}
h1,
h2,
h3,
h4 {
color: #603f00;
font-family: "Noto Serif JP", serif;
}
.l-container {
margin-inline: auto;
padding-inline: 20px;
width: 100%;
max-width: 1200px;
}
@media (min-width: 768px) and (max-width: 991px) {
.l-container {
padding-inline: 24px;
}
}
@media (max-width: 767px) {
.l-container {
padding-inline: 16px;
}
}
.l-hero-gradient {
z-index: 49;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 200px;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
opacity: 1;
pointer-events: none;
transition: opacity 0.6s ease;
}
body.is-header-solid .l-hero-gradient,
body.is-menu-open .l-hero-gradient {
opacity: 0;
}
@media (prefers-reduced-motion: reduce) {
.l-hero-gradient {
transition: none;
}
}
.p-hero.p-page-hero {
flex: none;
width: 100%;
height: 400px;
min-height: 0;
overflow: hidden;
}
.p-hero.p-page-hero .p-hero__image {
-o-object-position: top;
object-position: top;
}
.p-page-hero__overlay {
inset: 0;
display: flex;
z-index: 2;
position: absolute;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 24px;
text-align: center;
pointer-events: auto;
}
.p-page-hero__overlay-inner {
pointer-events: none;
}
.p-page-hero__breadcrumb {
margin-top: 14px;
}
.p-page-hero__label {
margin: 0 0 12px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.2em;
line-height: 1.4;
text-transform: uppercase;
}
.p-page-hero__title {
margin: 0;
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 2.5rem;
font-weight: 400;
letter-spacing: 0.08em;
line-height: 1.4;
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8), 0 10px 30px rgba(0, 0, 0, 0.28);
}
.p-page-hero .c-breadcrumb {
border: none;
background-color: transparent;
}
.p-page-hero .c-breadcrumb__inner {
padding: 0;
}
.p-page-hero .c-breadcrumb__list {
justify-content: center;
}
.p-page-hero .c-breadcrumb__item + .c-breadcrumb__item::before {
color: rgba(255, 255, 255, 0.72);
}
.p-page-hero .c-breadcrumb__link,
.p-page-hero .c-breadcrumb__current {
color: rgba(255, 255, 255, 0.85);
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.p-page-hero .c-breadcrumb__link:hover {
color: #fff;
}
.p-page-hero .c-breadcrumb__current {
color: #fff;
}
@media (max-width: 991px) {
.p-page-hero__title {
font-size: 2rem;
}
}
@media (max-width: 767px) {
.p-page-hero__label {
margin-bottom: 8px;
font-size: 0.75rem;
}
.p-page-hero__title {
font-size: 1.625rem;
white-space: nowrap;
}
.p-page-hero__breadcrumb {
margin-top: 10px;
}
}
.l-site-header {
display: flex;
z-index: 50;
position: fixed;
top: 0;
left: 0;
align-items: flex-start;
justify-content: space-between;
width: 100%;
padding: 24px;
pointer-events: none;
transition: background-color 0.6s ease, box-shadow 0.6s ease;
}
.l-site-header__logo {
display: block;
position: relative;
line-height: 0;
pointer-events: auto;
}
.l-site-header__logo-img {
width: 150px;
height: auto;
transition: opacity 0.6s ease;
}
.l-site-header__logo-img--solid {
position: absolute;
top: 0;
left: 0;
opacity: 0;
}
.l-site-header__logo-img--light {
opacity: 1;
}
.l-site-header__controls {
gap: 24px;
display: flex;
align-items: center;
pointer-events: auto;
}
@media (max-width: 767px) {
.l-site-header {
padding: 16px;
}
.l-site-header__logo-img {
width: 120px;
}
.l-site-header__controls {
gap: 12px;
}
}
body.is-header-solid .l-site-header {
background-color: #fff;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}
body.is-header-solid .l-site-header__logo-img--light {
opacity: 0;
}
body.is-header-solid .l-site-header__logo-img--solid {
opacity: 1;
}
body.is-menu-open {
overflow: hidden;
}
body.is-menu-open .l-site-header {
z-index: 110;
background-color: transparent;
box-shadow: none;
}
body.is-menu-open .l-site-header__logo {
visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
.l-site-header,
.l-site-header__logo-img {
transition: none;
}
}
.l-header {
padding: 20px 0;
border-bottom: 1px solid #eaeaea;
background-color: #fff;
}
.l-header__inner {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
.l-header__logo a {
color: #c9a96e;
font-size: 1.5rem;
font-weight: 700;
}
.l-header__nav ul {
gap: 20px;
display: flex;
}
.l-header__nav ul a {
font-weight: 500;
transition: color 0.3s ease;
}
.l-header__nav ul a:hover {
color: #c9a96e;
}
.l-main {
margin-bottom: 80px;
}
@media (max-width: 767px) {
.l-main {
margin-bottom: 56px;
}
}
.l-footer {
padding: 56px 0 32px;
background-color: #1e3a2f;
color: #fff;
}
.l-footer__main {
gap: 48px 56px;
display: grid;
grid-template-columns: 224px 1fr;
padding-bottom: 40px;
}
.l-footer__brand {
min-width: 0;
}
.l-footer__logo {
display: inline-block;
margin-bottom: 20px;
line-height: 0;
}
.l-footer__logo img {
width: 180px;
height: auto;
}
.l-footer__lead {
margin: 0 0 24px;
color: rgba(255, 255, 255, 0.8);
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.8;
}
.l-footer__social {
gap: 12px;
display: flex;
align-items: center;
margin: 0;
padding: 0;
}
.l-footer__social-item {
list-style: none;
}
.l-footer__social-link {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.1);
transition: background-color 0.3s ease;
}
.l-footer__social-link img {
display: block;
width: 22px;
height: auto;
}
.l-footer__social-link:hover {
background-color: rgba(255, 255, 255, 0.2);
}
.l-footer__nav {
gap: 32px;
display: grid;
grid-template-columns: repeat(4, 1fr);
min-width: 0;
}
.l-footer__col-title {
margin: 0 0 16px;
padding-bottom: 10px;
border-bottom: 1px solid rgba(201, 169, 110, 0.45);
color: #c9a96e;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 600;
letter-spacing: 0.08em;
line-height: 1.4;
}
.l-footer__block {
margin-bottom: 20px;
}
.l-footer__block:last-child {
margin-bottom: 0;
}
.l-footer__block-title {
gap: 8px;
display: flex;
align-items: center;
margin: 0 0 10px;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.4;
}
.l-footer__bullet {
flex-shrink: 0;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #c9a96e;
}
.l-footer__list {
margin: 0;
padding: 0 0 0 14px;
}
.l-footer__list-item {
margin-bottom: 6px;
list-style: none;
}
.l-footer__list-item:last-child {
margin-bottom: 0;
}
.l-footer__link {
color: rgba(255, 255, 255, 0.75);
font-size: 0.8125rem;
line-height: 1.55;
transition: color 0.2s ease;
}
.l-footer__link:hover {
color: #c9a96e;
}
.l-footer__col--contact .l-footer__col-title {
margin-bottom: 20px;
}
.l-footer__contact {
display: flex;
flex-direction: column;
align-items: flex-start;
font-size: 0.8125rem;
line-height: 1.7;
}
.l-footer__contact .c-menu-cta {
align-self: center;
}
.l-footer__contact-nav {
width: 100%;
margin: 0 0 20px;
padding: 0;
}
.l-footer__contact-nav-item {
margin-bottom: 6px;
list-style: none;
}
.l-footer__contact-nav-item:last-child {
margin-bottom: 0;
}
.l-footer__contact-nav-link {
color: rgba(255, 255, 255, 0.75);
font-size: 0.8125rem;
line-height: 1.55;
transition: color 0.2s ease;
}
.l-footer__contact-nav-link:hover {
color: #c9a96e;
}
.l-footer__address {
margin: 0 0 12px;
}
.l-footer__tel, .l-footer__fax {
margin: 0 0 4px;
}
.l-footer__fax {
margin-bottom: 20px;
}
.l-footer__license {
margin: 0;
color: rgba(255, 255, 255, 0.5);
font-size: 0.75rem;
line-height: 1.6;
}
.l-footer__bottom {
gap: 16px;
display: flex;
flex-direction: column;
padding-top: 24px;
border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.l-footer__quick-nav {
gap: 8px 20px;
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0;
padding: 0;
}
.l-footer__quick-item {
list-style: none;
}
.l-footer__quick-link {
color: rgba(255, 255, 255, 0.65);
font-size: 0.75rem;
transition: color 0.2s ease;
}
.l-footer__quick-link:hover {
color: #c9a96e;
}
.l-footer__bottom-meta {
gap: 24px;
display: flex;
align-items: center;
justify-content: space-between;
}
.l-footer__copyright, .l-footer__tagline {
margin: 0;
color: rgba(255, 255, 255, 0.5);
font-size: 0.75rem;
}
.l-footer__tagline {
white-space: nowrap;
}
@media (max-width: 991px) {
.l-footer {
padding: 48px 0 28px;
}
.l-footer__main {
gap: 40px;
grid-template-columns: 1fr;
padding-bottom: 32px;
}
.l-footer__nav {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 767px) {
.l-footer {
padding: 40px 0 24px;
}
.l-footer__logo img {
width: 160px;
}
.l-footer__nav {
gap: 28px;
grid-template-columns: 1fr;
}
.l-footer__bottom {
gap: 12px;
}
.l-footer__bottom-meta {
gap: 12px;
flex-direction: column;
align-items: flex-start;
}
.l-footer__tagline {
white-space: normal;
}
}
.l-gnav {
z-index: 10;
position: relative;
flex-shrink: 0;
height: var(--gnav-height, 56px);
border-bottom: 1px solid #eaeaea;
background-color: #fff;
}
.l-gnav__inner {
height: 100%;
}
.l-gnav__list {
gap: 0;
display: flex;
align-items: stretch;
justify-content: center;
height: 100%;
}
.l-gnav__item {
display: flex;
position: relative;
align-items: center;
}
.l-gnav__item--has-dropdown:hover .l-gnav__dropdown, .l-gnav__item--has-dropdown:focus-within .l-gnav__dropdown {
visibility: visible;
opacity: 1;
pointer-events: auto;
}
.l-gnav__item--has-dropdown:hover .l-gnav__chevron, .l-gnav__item--has-dropdown:focus-within .l-gnav__chevron {
transform: rotate(180deg);
}
.l-gnav__link, .l-gnav__trigger {
gap: 2px;
display: inline-flex;
align-items: center;
height: 100%;
padding: 0 20px;
border: none;
background: none;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
white-space: nowrap;
cursor: pointer;
transition: background-color 0.2s ease, color 0.2s ease;
}
.l-gnav__link:hover, .l-gnav__trigger:hover {
background-color: rgba(93, 67, 7, 0.06);
}
.l-gnav__chevron {
font-size: 18px;
line-height: 1;
transition: transform 0.2s ease;
}
.l-gnav__dropdown {
visibility: hidden;
z-index: 20;
position: absolute;
top: 100%;
left: 50%;
min-width: 240px;
padding: 12px 0;
transform: translateX(-50%);
background-color: #968b70;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
opacity: 0;
pointer-events: none;
transition: opacity 0.2s ease, visibility 0.2s ease;
}
.l-gnav__dropdown-list {
margin: 0;
padding: 0;
}
.l-gnav__dropdown-item {
list-style: none;
}
.l-gnav__dropdown-link {
display: block;
padding: 8px 20px;
color: #fff;
font-size: 0.8125rem;
line-height: 1.5;
transition: background-color 0.2s ease;
}
.l-gnav__dropdown-link:hover {
background-color: rgba(255, 255, 255, 0.12);
color: #fff;
}
.l-nav-overlay {
inset: 0;
display: flex;
visibility: hidden;
z-index: 100;
position: fixed;
flex-direction: column;
background-color: #1e3a2f;
opacity: 0;
pointer-events: none;
transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.4s;
}
.l-nav-overlay[hidden] {
display: flex;
}
body.is-menu-open .l-nav-overlay {
visibility: visible;
opacity: 1;
pointer-events: auto;
}
.l-nav-overlay__header {
flex-shrink: 0;
padding: 24px 24px 0;
}
.l-nav-overlay__logo {
display: inline-block;
line-height: 0;
}
.l-nav-overlay__logo img {
width: 200px;
height: auto;
}
.l-nav-overlay__body {
flex: 1;
padding: 28px 0 24px;
overflow-y: auto;
}
.l-nav-overlay__inner {
max-width: 1200px;
}
.l-nav-overlay__cols {
gap: 32px 40px;
display: grid;
grid-template-columns: repeat(4, 1fr);
}
.l-nav-overlay__col {
min-width: 0;
}
.l-nav-overlay__title {
margin: 0 0 16px;
padding-bottom: 10px;
border-bottom: 1px solid rgba(201, 169, 110, 0.45);
color: #c9a96e;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 600;
letter-spacing: 0.08em;
line-height: 1.4;
}
.l-nav-overlay__block {
margin-bottom: 20px;
}
.l-nav-overlay__block:last-child {
margin-bottom: 0;
}
.l-nav-overlay__block-title {
gap: 8px;
display: flex;
align-items: center;
margin: 0 0 10px;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.4;
}
.l-nav-overlay__bullet {
flex-shrink: 0;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #c9a96e;
}
.l-nav-overlay__list {
margin: 0;
padding: 0 0 0 14px;
}
.l-nav-overlay__list-item {
margin-bottom: 6px;
list-style: none;
}
.l-nav-overlay__list-item:last-child {
margin-bottom: 0;
}
.l-nav-overlay__link {
color: rgba(255, 255, 255, 0.75);
font-size: 0.8125rem;
line-height: 1.55;
transition: color 0.2s ease;
}
.l-nav-overlay__link:hover {
color: #c9a96e;
}
.l-nav-overlay__col--contact .l-nav-overlay__title {
margin-bottom: 20px;
}
.l-nav-overlay__contact {
color: #fff;
font-size: 0.8125rem;
line-height: 1.7;
}
.l-nav-overlay__contact-nav {
width: 100%;
margin: 0 0 20px;
padding: 0;
}
.l-nav-overlay__contact-nav-item {
margin-bottom: 6px;
list-style: none;
}
.l-nav-overlay__contact-nav-item:last-child {
margin-bottom: 0;
}
.l-nav-overlay__contact-nav-link {
color: rgba(255, 255, 255, 0.75);
font-size: 0.8125rem;
line-height: 1.55;
transition: color 0.2s ease;
}
.l-nav-overlay__contact-nav-link:hover {
color: #c9a96e;
}
.l-nav-overlay__address {
margin: 0 0 12px;
}
.l-nav-overlay__tel, .l-nav-overlay__fax {
margin: 0 0 4px;
}
.l-nav-overlay__fax {
margin-bottom: 20px;
}
.l-nav-overlay__license {
flex-basis: 100%;
margin: 0;
color: rgba(255, 255, 255, 0.5);
font-size: 0.75rem;
line-height: 1.6;
}
.l-nav-overlay__footer {
flex-shrink: 0;
padding: 16px 0 24px;
border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.l-nav-overlay__footer-inner {
gap: 24px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.l-nav-overlay__footer-nav {
gap: 8px 20px;
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0;
padding: 0;
}
.l-nav-overlay__footer-item {
list-style: none;
}
.l-nav-overlay__footer-link {
color: rgba(255, 255, 255, 0.65);
font-size: 0.75rem;
transition: color 0.2s ease;
}
.l-nav-overlay__footer-link:hover {
color: #c9a96e;
}
.l-nav-overlay__copyright {
margin: 0;
color: rgba(255, 255, 255, 0.5);
font-size: 0.75rem;
white-space: nowrap;
}
@media (max-width: 991px) {
.l-nav-overlay__cols {
gap: 28px 32px;
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 767px) {
.l-nav-overlay__header {
padding: 16px 16px 0;
}
.l-nav-overlay__logo img {
width: 160px;
}
.l-nav-overlay__body {
padding: 20px 0 16px;
}
.l-nav-overlay__cols {
gap: 24px;
grid-template-columns: 1fr;
}
.l-nav-overlay__footer-inner {
gap: 16px;
flex-direction: column;
align-items: flex-start;
}
.l-nav-overlay__copyright {
white-space: normal;
}
}
.c-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 160px;
height: 44px;
padding: 0 32px;
border-radius: 22px;
font-size: 0.9375rem;
font-weight: 500;
line-height: 1;
transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.c-btn--outline {
border: 1px solid #968b70;
background-color: transparent;
color: #968b70;
}
.c-btn--outline:hover {
background-color: rgba(150, 139, 112, 0.08);
}
.c-btn--primary {
border: 1px solid #e57e25;
background-color: #e57e25;
color: #fff;
}
.c-btn--primary:hover {
border-color: rgb(210.3163934426, 110.9467213115, 25.0836065574);
background-color: rgb(210.3163934426, 110.9467213115, 25.0836065574);
}
.c-btn--dark {
border: 1px solid #1a1a1a;
background-color: #1a1a1a;
color: #fff;
}
.c-btn--dark:hover {
border-color: rgb(46.4, 46.4, 46.4);
background-color: rgb(46.4, 46.4, 46.4);
}
.c-btn--rect {
min-width: 140px;
height: 40px;
padding: 0 24px;
border-radius: 4px;
font-size: 0.875rem;
}
.c-btn .material-icons {
margin-right: 8px;
font-size: 1.25rem;
}
.c-news-tag {
display: inline-flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
min-width: 72px;
height: 24px;
padding: 0 10px;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 500;
line-height: 1;
}
.c-news-tag--new {
background-color: rgba(229, 126, 37, 0.15);
color: #c45c00;
}
.c-news-tag--event {
background-color: rgba(42, 122, 110, 0.12);
color: #2a7a6e;
}
.c-news-tag--notice {
background-color: rgba(74, 111, 165, 0.12);
color: #4a6fa5;
}
.c-news-tag--column {
background-color: rgba(201, 169, 110, 0.2);
color: #5d4307;
}
.c-service-card {
display: block;
overflow: hidden;
border-radius: 12px;
background-color: #f9f7f5;
color: #707070;
transition: opacity 0.2s ease;
}
.c-service-card:hover {
opacity: 1;
}
.c-service-card:hover .c-service-card__image {
transform: scale(1.06);
}
.c-service-card__media {
aspect-ratio: 3/2;
position: relative;
overflow: hidden;
border-radius: 12px 12px 0 0;
}
.c-service-card__image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.c-service-card__title {
inset: 0;
display: flex;
z-index: 1;
position: absolute;
align-items: center;
justify-content: center;
padding: 16px;
pointer-events: none;
}
.c-service-card__title-text {
display: inline-block;
padding: 10px 24px;
background-color: rgba(0, 0, 0, 0.75);
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 600;
letter-spacing: 0.2em;
line-height: 1.4;
text-align: center;
}
.c-service-card__text {
min-height: 5.0625rem;
margin: 0;
padding: 20px 20px 24px;
font-size: 0.9375rem;
line-height: 1.8;
}
.c-service-card--split {
display: block;
color: #707070;
}
.c-service-card--split .c-service-card__text {
min-height: 0;
padding-bottom: 16px;
}
.c-service-card--split .c-service-card__media-link:hover {
opacity: 1;
}
.c-service-card--split .c-service-card__media-link:hover .c-service-card__image {
transform: scale(1.06);
}
.c-service-card__media-link {
display: block;
color: inherit;
text-decoration: none;
transition: opacity 0.2s ease;
}
.c-service-card__actions {
gap: 8px;
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 0 16px 24px;
list-style: none;
}
.c-service-card__actions-item {
flex: 1 1 calc(50% - 4px);
min-width: 0;
}
.c-service-card__action-btn {
gap: 0;
justify-content: center;
width: 100%;
min-width: 0;
padding-right: 10px;
padding-left: 10px;
white-space: nowrap;
}
.c-service-card__action-btn-icon {
margin-right: 0;
font-size: 1.125rem;
line-height: 1;
}
@media (max-width: 767px) {
.c-service-card__title-text {
padding: 8px 16px;
font-size: 1.0625rem;
letter-spacing: 0.14em;
}
.c-service-card__text {
min-height: 0;
padding: 16px 16px 20px;
}
.c-service-card__actions {
gap: 10px;
flex-direction: column;
padding: 0 16px 20px;
}
.c-service-card__actions-item {
flex: 1 1 auto;
}
}
@media (prefers-reduced-motion: reduce) {
.c-service-card__image {
transition: none;
}
.c-service-card:hover .c-service-card__image {
transform: none;
}
}
.c-parts-crosslink {
padding: 0 0 40px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.c-parts-crosslink {
padding: 0 0 24px;
}
}
.c-parts-crosslink__inner {
max-width: 900px;
margin: 0 auto;
}
.c-parts-crosslink__box {
gap: 24px;
display: flex;
align-items: center;
padding: 28px 32px;
border: 1px solid rgba(30, 58, 47, 0.15);
border-radius: 8px;
background-color: #fff;
}
@media (max-width: 767px) {
.c-parts-crosslink__box {
gap: 16px;
flex-direction: column;
align-items: stretch;
padding: 24px 20px;
text-align: center;
}
}
.c-parts-crosslink__icon {
flex-shrink: 0;
color: #1e3a2f;
font-size: 2.5rem;
}
@media (max-width: 767px) {
.c-parts-crosslink__icon {
margin: 0 auto;
}
}
.c-parts-crosslink__body {
flex: 1;
min-width: 0;
}
.c-parts-crosslink__title {
margin: 0 0 8px;
color: #1e3a2f;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.06em;
line-height: 1.5;
}
@media (max-width: 767px) {
.c-parts-crosslink__title {
font-size: 1.125rem;
}
}
.c-parts-crosslink__lead {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
text-align: left;
}
@media (max-width: 767px) {
.c-parts-crosslink__lead {
text-align: center;
}
}
.c-parts-crosslink__action {
flex-shrink: 0;
}
@media (max-width: 767px) {
.c-parts-crosslink__action {
display: flex;
justify-content: center;
}
}
.c-parts-crosslink--in-group {
display: flex;
flex-direction: column;
min-width: 0;
height: 100%;
padding: 0;
background-color: transparent;
}
.c-parts-crosslink--in-group .c-parts-crosslink__inner {
display: flex;
flex: 1;
flex-direction: column;
width: 100%;
max-width: none;
margin: 0;
}
.c-parts-crosslink--in-group .c-parts-crosslink__box {
gap: 12px;
flex: 1;
flex-direction: row;
align-items: flex-start;
padding: 20px 16px;
text-align: left;
}
.c-parts-crosslink--in-group .c-parts-crosslink__icon {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
margin: 0;
font-size: 2rem;
line-height: 1;
}
.c-parts-crosslink--in-group .c-parts-crosslink__body {
flex: 1;
min-width: 0;
}
.c-parts-crosslink--in-group .c-parts-crosslink__lead {
font-size: 0.8125rem;
line-height: 1.7;
text-align: left;
}
.c-parts-crosslink--in-group .c-parts-crosslink__action {
display: flex;
flex-shrink: 0;
align-items: center;
align-self: stretch;
justify-content: flex-end;
width: auto;
margin-top: 0;
}
@media (max-width: 991px) {
.c-parts-crosslink--in-group .c-parts-crosslink__box {
gap: 16px;
flex-direction: column;
align-items: center;
padding: 24px 20px;
text-align: center;
}
.c-parts-crosslink--in-group .c-parts-crosslink__icon {
width: auto;
height: auto;
margin: 0 auto;
}
.c-parts-crosslink--in-group .c-parts-crosslink__lead {
font-size: 0.9375rem;
text-align: center;
}
.c-parts-crosslink--in-group .c-parts-crosslink__action {
align-self: auto;
justify-content: center;
width: 100%;
}
}
.c-parts-crosslink-group {
padding: 0 0 120px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.c-parts-crosslink-group {
padding: 0 0 64px;
}
}
.c-parts-crosslink-group__inner {
margin-inline: auto;
gap: 24px;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: stretch;
width: 100%;
max-width: 900px;
}
@media (max-width: 991px) {
.c-parts-crosslink-group__inner {
gap: 16px;
}
}
@media (max-width: 767px) {
.c-parts-crosslink-group__inner {
grid-template-columns: 1fr;
}
}
.p-string__price + .c-parts-crosslink-group {
padding-top: 0;
}
.c-breadcrumb {
background-color: transparent;
}
.c-breadcrumb__inner {
padding-block: 10px 0;
}
@media (max-width: 767px) {
.c-breadcrumb__inner {
padding-block: 8px 0;
}
}
.c-breadcrumb__list {
gap: 6px 0;
display: flex;
flex-wrap: wrap;
align-items: center;
margin: 0;
padding: 0;
list-style: none;
}
.c-breadcrumb__item {
display: inline-flex;
align-items: center;
min-width: 0;
}
.c-breadcrumb__item + .c-breadcrumb__item::before {
margin-inline: 10px;
color: #968b70;
font-size: 0.75rem;
line-height: 1;
content: "›";
}
@media (max-width: 767px) {
.c-breadcrumb__item + .c-breadcrumb__item::before {
margin-inline: 8px;
}
}
.c-breadcrumb__link,
.c-breadcrumb__current {
min-width: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
line-height: 1.4;
}
.c-breadcrumb__link {
text-decoration: none;
transition: color 0.2s ease, -webkit-text-decoration-color 0.2s ease;
transition: color 0.2s ease, text-decoration-color 0.2s ease;
transition: color 0.2s ease, text-decoration-color 0.2s ease, -webkit-text-decoration-color 0.2s ease;
}
.c-breadcrumb__link:hover {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
}
.c-breadcrumb__current {
color: #5d4307;
font-weight: 500;
}
.c-contact-btn {
gap: 6px;
display: inline-flex;
align-items: center;
justify-content: center;
height: 36px;
padding: 0 30px;
border: 1px solid #fff;
border-radius: 22px;
background-color: transparent;
color: #fff;
font-size: 1rem;
font-weight: 500;
transition: background-color 0.6s ease, border-color 0.6s ease, color 0.6s ease, opacity 0.6s ease, visibility 0.6s ease;
}
.c-contact-btn:hover {
background-color: rgba(255, 255, 255, 0.1);
}
body.is-header-solid .c-contact-btn {
border-color: #968b70;
color: #968b70;
}
body.is-header-solid .c-contact-btn:hover {
background-color: rgba(150, 139, 112, 0.1);
}
.c-contact-btn__icon {
font-size: 18px;
line-height: 1;
}
.c-contact-btn__text {
line-height: 1;
}
body.is-menu-open .c-contact-btn {
visibility: hidden;
opacity: 0;
pointer-events: none;
}
@media (max-width: 767px) {
.c-contact-btn {
height: 32px;
padding: 0 16px;
font-size: 0.875rem;
}
.c-contact-btn__text {
display: none;
}
}
.c-cart-link {
display: inline-flex;
position: relative;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
color: #fff;
transition: color 0.6s ease, opacity 0.6s ease, visibility 0.6s ease;
}
.c-cart-link:hover {
opacity: 0.85;
}
body.is-header-solid .c-cart-link {
color: #968b70;
}
body.is-menu-open .c-cart-link {
visibility: hidden;
opacity: 0;
pointer-events: none;
}
.c-cart-link__icon {
font-size: 22px;
line-height: 1;
}
.c-cart-link__badge {
display: inline-flex;
position: absolute;
top: -2px;
right: -4px;
align-items: center;
justify-content: center;
min-width: 18px;
height: 18px;
padding: 0 4px;
border-radius: 999px;
background-color: #968b70;
color: #fff;
font-size: 0.6875rem;
font-weight: 700;
line-height: 1;
}
.c-cart-link__badge[hidden] {
display: none;
}
.c-cart-toast {
z-index: 120;
position: fixed;
right: 24px;
bottom: 24px;
max-width: min(320px, 100vw - 48px);
padding: 12px 20px;
transform: translateY(8px);
border-radius: 4px;
background-color: rgba(60, 50, 40, 0.92);
color: #fff;
font-size: 0.9375rem;
opacity: 0;
pointer-events: none;
transition: opacity 0.25s ease, transform 0.25s ease;
}
.c-cart-toast.is-visible {
transform: translateY(0);
opacity: 1;
}
.c-cart-toast[hidden] {
display: block;
visibility: hidden;
}
.p-harp-camac__product-action,
.p-aoyama__product-action {
gap: 8px;
display: flex;
flex-direction: column;
}
.p-harp-camac__product-cart-btn,
.p-aoyama__product-cart-btn {
width: 100%;
}
.p-harp-camac-detail__cart-btn-icon {
font-size: 20px;
}
.c-btn.is-added {
opacity: 0.85;
}
@media (max-width: 767px) {
.c-cart-toast {
right: 16px;
bottom: 16px;
}
}
.c-product-detail-actions {
gap: 12px;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
@media (max-width: 767px) {
.c-product-detail-actions {
flex-direction: column;
width: 100%;
}
}
@media (max-width: 767px) {
.c-product-detail-actions .c-btn {
width: 100%;
min-width: 0;
}
}
.c-product-gallery {
position: relative;
width: 100%;
max-width: 400px;
}
.c-product-gallery__viewport {
position: relative;
overflow: hidden;
}
.c-product-gallery__slides {
display: flex;
transition: transform 0.45s ease;
will-change: transform;
}
.c-product-gallery__slide {
display: flex;
flex: 0 0 100%;
align-items: center;
justify-content: center;
}
.c-product-gallery__nav {
display: flex;
z-index: 2;
position: absolute;
top: 50%;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
padding: 0;
transform: translateY(-50%);
border: 1px solid rgba(93, 67, 7, 0.15);
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.92);
color: #5d4307;
cursor: pointer;
transition: background-color 0.2s ease, border-color 0.2s ease;
}
.c-product-gallery__nav:hover {
border-color: rgba(93, 67, 7, 0.3);
background-color: #fff;
}
.c-product-gallery__nav:disabled {
cursor: default;
opacity: 0.35;
}
.c-product-gallery__nav .material-icons {
font-size: 22px;
line-height: 1;
}
.c-product-gallery__nav--prev {
left: 0;
}
.c-product-gallery__nav--next {
right: 0;
}
.c-product-gallery__thumbs {
gap: 8px;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
display: flex;
flex-wrap: wrap;
justify-content: center;
max-width: 100%;
margin-top: 16px;
overflow-x: auto;
}
.c-product-gallery__thumbs::-webkit-scrollbar {
display: none;
}
.c-product-gallery__thumb {
flex-shrink: 0;
width: 64px;
height: 64px;
padding: 0;
overflow: hidden;
border: 2px solid rgba(93, 67, 7, 0.15);
border-radius: 4px;
background-color: #fff;
cursor: pointer;
transition: border-color 0.2s ease;
}
.c-product-gallery__thumb img {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.c-product-gallery__thumb:hover {
border-color: rgba(93, 67, 7, 0.3);
}
.c-product-gallery__thumb.is-active {
border-color: #c9a96e;
}
.p-harp-camac-detail__product-media .c-product-gallery,
.p-accessory-detail__product-media .c-product-gallery,
.p-cd-detail__product-media .c-product-gallery {
margin: 0 auto;
}
@media (prefers-reduced-motion: reduce) {
.c-product-gallery__slides {
transition: none;
}
}
.c-product-media-stock-mark {
position: relative;
}
.c-product-stock-mark {
z-index: 2;
position: absolute;
top: 12px;
left: 12px;
padding: 7px 16px;
border: 1px solid rgba(255, 255, 255, 0.35);
background-color: #e57e25;
box-shadow: 0 2px 10px rgba(26, 26, 26, 0.18);
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 700;
letter-spacing: 0.06em;
line-height: 1.4;
pointer-events: none;
}
.entry-content a:not(.c-btn):not(.seminar-download__link):not(.seminar-qa-toc__link):not(.p-string__order-link) {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.entry-content a:not(.c-btn):not(.seminar-download__link):not(.seminar-qa-toc__link):not(.p-string__order-link):hover {
color: #c9a96e;
}
.p-accessory-detail__product-description.entry-content p,
.p-cd-detail__product-description.entry-content p,
.p-harp-camac-detail__product-description.entry-content p {
margin: 0 0 1em;
}
.p-accessory-detail__product-description.entry-content p:last-child,
.p-cd-detail__product-description.entry-content p:last-child,
.p-harp-camac-detail__product-description.entry-content p:last-child {
margin-bottom: 0;
}
.p-accessory-detail__product-description.entry-content ul,
.p-accessory-detail__product-description.entry-content ol,
.p-cd-detail__product-description.entry-content ul,
.p-cd-detail__product-description.entry-content ol,
.p-harp-camac-detail__product-description.entry-content ul,
.p-harp-camac-detail__product-description.entry-content ol {
margin: 0 0 1em;
padding-left: 1.25em;
}
.p-accessory-detail__product-description.entry-content ul,
.p-cd-detail__product-description.entry-content ul,
.p-harp-camac-detail__product-description.entry-content ul {
list-style: disc;
}
.p-accessory-detail__product-description.entry-content ol,
.p-cd-detail__product-description.entry-content ol,
.p-harp-camac-detail__product-description.entry-content ol {
list-style: decimal;
}
.p-accessory-detail__product-description.entry-content li + li,
.p-cd-detail__product-description.entry-content li + li,
.p-harp-camac-detail__product-description.entry-content li + li {
margin-top: 0.25em;
}
.c-hamburger {
display: flex;
z-index: 1;
position: relative;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0;
border: none;
background: none;
cursor: pointer;
}
.c-hamburger__lines {
gap: 6px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 44px;
height: 32px;
}
.c-hamburger__lines span {
display: block;
width: 30px;
height: 2px;
background-color: #fff;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.6s ease, background-color 0.6s ease;
}
.c-hamburger__label {
display: block;
margin-top: 2px;
color: #fff;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.05em;
line-height: 1;
transition: opacity 0.6s ease, color 0.6s ease;
}
body.is-header-solid .c-hamburger__lines span {
background-color: #968b70;
}
body.is-header-solid .c-hamburger__label {
color: #968b70;
}
body.is-menu-open .c-hamburger__lines span {
background-color: #fff;
}
body.is-menu-open .c-hamburger__lines span:nth-child(1) {
transform: translateY(8px) rotate(45deg);
}
body.is-menu-open .c-hamburger__lines span:nth-child(2) {
opacity: 0;
}
body.is-menu-open .c-hamburger__lines span:nth-child(3) {
transform: translateY(-8px) rotate(-45deg);
}
body.is-menu-open .c-hamburger__label {
opacity: 0;
}
body.is-menu-open.is-header-solid .c-hamburger__lines span {
background-color: #fff;
}
.c-menu-cta {
gap: 8px;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 200px;
height: 44px;
padding: 0 24px;
border-radius: 22px;
background-color: #c9a96e;
color: #603f00;
font-size: 0.875rem;
font-weight: 700;
transition: background-color 0.2s ease, opacity 0.2s ease;
}
.c-menu-cta:hover {
background-color: rgb(209.3035175879, 182.224120603, 132.2964824121);
}
.c-menu-cta__icon {
font-size: 20px;
line-height: 1;
}
.c-menu-cta__text {
line-height: 1;
}
.c-page-top {
gap: 2px;
display: inline-flex;
visibility: hidden;
z-index: 45;
position: fixed;
right: 24px;
bottom: 24px;
flex-direction: column;
align-items: center;
justify-content: center;
min-width: 72px;
padding: 12px 16px 10px;
border: 1px solid #c9a96e;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
line-height: 1;
cursor: pointer;
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease, visibility 0.3s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.c-page-top.is-visible {
visibility: visible;
opacity: 1;
pointer-events: auto;
}
.c-page-top:hover {
border-color: #5d4307;
background-color: #c9a96e;
color: #fff;
}
@media (max-width: 767px) {
.c-page-top {
right: 16px;
bottom: 16px;
min-width: 64px;
padding: 10px 12px 8px;
}
}
.c-page-top__icon {
font-size: 1.5rem;
line-height: 1;
}
.c-page-top__label {
font-size: 0.625rem;
font-weight: 500;
letter-spacing: 0.12em;
}
body.is-menu-open .c-page-top {
visibility: hidden;
opacity: 0;
pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
.c-page-top {
transition: none;
}
}
.fplant-confirmation .fplant-turnstile-container {
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: center !important;
margin-bottom: 16px !important;
}
.fplant-confirmation .fplant-turnstile-container::after {
margin-top: 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 400;
line-height: 1.6;
text-align: center;
content: "セキュリティ確認です。送信はまだ完了していません。";
}
.p-top {
--gnav-height: 56px;
}
.p-top__first-view {
display: flex;
position: relative;
flex-direction: column;
min-height: 768px;
max-height: 768px;
}
@media (max-width: 991px) {
.p-top {
--gnav-height: 0px;
}
.p-top .l-gnav {
display: none;
}
.p-top__first-view {
min-height: 33dvh;
max-height: none;
}
}
@media (max-width: 767px) {
.p-top .l-site-header {
padding: 16px;
}
}
.p-top .l-main {
padding: 0;
}
body.is-menu-open .l-gnav {
visibility: hidden;
}
.p-hero {
position: relative;
flex: 1 1 auto;
width: 100%;
min-height: calc(768px - var(--gnav-height));
overflow: hidden;
}
.p-hero__slider {
inset: 0;
z-index: 0;
position: absolute;
width: 100%;
}
.p-hero__slide {
inset: 0;
position: absolute;
opacity: 0;
pointer-events: none;
transition: opacity 0.8s ease;
}
.p-hero__slide.is-active {
z-index: 1;
opacity: 1;
pointer-events: auto;
}
.p-hero__image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.p-hero picture {
display: block;
width: 100%;
height: 100%;
}
@media (max-width: 991px) {
.p-hero {
min-height: 33dvh;
}
}
@media (prefers-reduced-motion: reduce) {
.p-hero__slide {
transition: none;
}
}
.p-news {
padding: 80px 0 88px;
background-color: #f9f7f5;
}
.p-news__layout {
gap: 48px 64px;
display: grid;
grid-template-columns: 350px 1fr;
align-items: start;
}
.p-news__label {
margin: 0 0 12px;
color: #e57e25;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.14em;
line-height: 1.4;
text-transform: uppercase;
}
.p-news__title {
margin: 0 0 20px;
color: #603f00;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 600;
line-height: 1.4;
}
.p-news__lead {
margin: 0 0 32px;
color: #707070;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-news__list {
margin: 0;
padding: 0;
border-top: 1px solid rgba(150, 139, 112, 0.25);
}
.p-news__item {
border-bottom: 1px solid rgba(150, 139, 112, 0.25);
list-style: none;
}
.p-news__link {
gap: 16px 20px;
display: grid;
grid-template-columns: 100px 80px 1fr 24px;
align-items: center;
padding: 20px 8px 20px 0;
color: #707070;
transition: opacity 0.2s ease;
}
.p-news__link:hover {
opacity: 0.75;
}
.p-news__link:hover .p-news__arrow {
transform: translateX(2px);
}
.p-news__date {
font-size: 0.875rem;
line-height: 1.4;
white-space: nowrap;
}
.p-news__item-title {
font-size: 0.9375rem;
line-height: 1.6;
}
.p-news__arrow {
justify-self: end;
color: #968b70;
font-size: 20px;
line-height: 1;
transition: transform 0.2s ease;
}
@media (max-width: 991px) {
.p-news {
padding: 48px 0 56px;
}
.p-news__layout {
gap: 32px;
grid-template-columns: 1fr;
}
.p-news__title {
font-size: 1.625rem;
}
.p-news__link {
gap: 12px 16px;
grid-template-columns: 96px 72px 1fr 24px;
}
}
@media (max-width: 767px) {
.p-news {
padding: 40px 0 48px;
}
.p-news__lead {
margin-bottom: 24px;
}
.p-news__link {
gap: 8px 12px;
grid-template-columns: 88px 1fr 24px;
grid-template-rows: auto auto;
padding: 16px 0;
}
.p-news__date {
grid-column: 1;
grid-row: 1;
}
.p-news .c-news-tag {
grid-column: 1;
grid-row: 2;
justify-self: start;
min-width: 0;
}
.p-news__item-title {
grid-column: 2/4;
grid-row: 1/3;
align-self: center;
}
.p-news__arrow {
grid-column: 3;
grid-row: 1/3;
align-self: center;
}
}
.p-information {
background-color: #fff;
}
@media (max-width: 991px) {
.p-information .l-gnav {
display: none;
}
}
.p-information__main {
padding: 56px 0 88px;
}
@media (max-width: 767px) {
.p-information__main {
padding: 40px 0 64px;
}
}
.p-information__inner {
max-width: 1080px;
}
.p-information__section-header {
margin-bottom: 48px;
text-align: center;
}
@media (max-width: 767px) {
.p-information__section-header {
margin-bottom: 28px;
}
}
.p-information__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-information__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-information__section-title {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-information__section-title {
font-size: 1.5rem;
}
}
.p-information__section-lead {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-information__layout {
gap: 28px 72px;
display: grid;
grid-template-columns: 1fr 280px;
align-items: start;
}
@media (max-width: 991px) {
.p-information__layout {
gap: 28px;
grid-template-columns: 1fr;
}
}
.p-information__list {
gap: 48px;
display: grid;
}
.p-information__post {
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 12px;
background-color: #fff;
}
.p-information__post-link {
gap: 18px;
display: grid;
grid-template-columns: 160px 1fr;
color: #707070;
transition: opacity 0.2s ease;
}
.p-information__post-link:hover {
opacity: 0.78;
}
.p-information__post-link:hover .p-information__more-icon {
transform: translateX(2px);
}
.p-information__post.is-no-thumb .p-information__post-link {
grid-template-columns: 1fr;
}
@media (max-width: 767px) {
.p-information__post-link {
gap: 12px;
grid-template-columns: 1fr;
}
}
.p-information__thumb {
width: 100%;
height: 100%;
margin: 0;
background-color: #fff;
}
@media (max-width: 767px) {
.p-information__thumb {
aspect-ratio: 16/9;
}
}
.p-information__thumb-img {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.p-information__post-body {
padding: 22px 18px 20px 0;
}
.p-information__post.is-no-thumb .p-information__post-body {
padding-left: 18px;
}
@media (max-width: 767px) {
.p-information__post-body {
padding: 0 16px 16px;
}
}
.p-information__meta {
gap: 10px 12px;
display: flex;
flex-wrap: wrap;
align-items: center;
margin-bottom: 12px;
}
.p-information__date {
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.4;
white-space: nowrap;
}
.p-information__post-title {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.0625rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-information__excerpt {
margin: 0 0 16px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-information__more {
gap: 6px;
display: inline-flex;
align-items: center;
color: #e57e25;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.02em;
}
.p-information__more-icon {
font-size: 18px;
line-height: 1;
transition: transform 0.2s ease;
}
.p-information__pagination {
margin-top: 64px;
}
.p-information__pagination-list {
gap: 8px;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0;
padding: 0;
list-style: none;
}
.p-information__pagination-link,
.p-information__pagination-current {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
padding: 0 12px;
border: 1px solid rgba(150, 139, 112, 0.22);
border-radius: 8px;
background-color: #fff;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1;
text-decoration: none;
}
.p-information__pagination-current {
border-color: rgba(201, 169, 110, 0.32);
background-color: rgba(201, 169, 110, 0.18);
color: #5d4307;
}
.p-information__pagination-link {
transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.p-information__pagination-link:hover {
border-color: rgba(201, 169, 110, 0.25);
background-color: rgba(201, 169, 110, 0.1);
color: #5d4307;
}
.p-information__sidebar {
gap: 28px;
display: grid;
}
.p-information__widget {
padding: 22px 16px 20px;
border-radius: 12px;
background-color: #fff;
}
.p-information__widget-title {
margin: 0 0 14px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.05rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-information__widget-list {
margin: 0;
padding: 0;
list-style: none;
}
.p-information__widget-item + .p-information__widget-item {
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid rgba(150, 139, 112, 0.18);
}
.p-information__widget-link {
gap: 8px;
display: inline-flex;
align-items: center;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.7;
text-decoration: none;
}
.p-information__widget-link::before {
flex-shrink: 0;
width: 6px;
height: 6px;
border-radius: 999px;
background-color: #c9a96e;
content: "";
}
.p-information__widget-link:hover {
text-underline-offset: 4px;
text-decoration: underline;
}
.p-information--detail .p-information__section-header {
display: none;
}
.p-information__article {
padding: 0;
}
.p-information__article-header {
margin-bottom: 20px;
}
.p-information__article-title {
margin: 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 1.5rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-information__article-title {
font-size: 1.25rem;
}
}
.p-information__eyecatch {
height: 420px;
margin: 0 0 24px;
overflow: hidden;
border-radius: 14px;
background-color: #fff;
}
@media (max-width: 991px) {
.p-information__eyecatch {
height: 360px;
}
}
@media (max-width: 767px) {
.p-information__eyecatch {
height: 260px;
}
}
.p-information__eyecatch-img {
-o-object-fit: contain;
display: block;
width: 100%;
height: 100%;
object-fit: contain;
}
.p-information__article-body {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.98rem;
line-height: 1.95;
}
.p-information__article-body a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-information__article-body a:hover {
color: #c9a96e;
}
.p-information__article-body h3 {
margin: 28px 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-information__article-body ul {
margin: 0 0 16px;
padding-left: 1.2em;
}
.p-information__article-body p {
margin: 0 0 16px;
}
.p-information__callout {
margin-top: 24px;
padding: 18px 16px 16px;
border: 1px solid rgba(150, 139, 112, 0.22);
border-radius: 12px;
background-color: #fff;
}
.p-information__callout-title {
margin: 0 0 6px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-information__callout-text {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.85;
}
.p-information__article-footer {
margin-top: 96px;
padding-top: 0;
border-top: 0;
}
.p-information__pager {
gap: 16px;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-bottom: 20px;
}
@media (max-width: 767px) {
.p-information__pager {
grid-template-columns: 1fr;
}
}
.p-information__pager-link {
gap: 6px;
display: grid;
padding: 12px 16px;
border: 1px solid #968b70;
border-radius: 12px;
background-color: #fff;
color: #5d4307;
text-decoration: none;
transition: background-color 0.2s ease, opacity 0.2s ease;
}
.p-information__pager-link:hover {
opacity: 0.8;
}
.p-information__pager-link.is-prev:hover,
.p-information__pager-link.is-next:hover {
background-color: rgba(150, 139, 112, 0.05);
opacity: 1;
}
.p-information__pager-label {
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.85rem;
line-height: 1.4;
}
.p-information__pager-title {
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
font-weight: 500;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-information__back {
display: flex;
justify-content: center;
margin-top: 24px;
}
.p-information .c-news-tag {
border: 1px solid rgba(150, 139, 112, 0.22);
background-color: #fff;
}
.p-information .c-news-tag--new {
border-color: rgba(196, 92, 0, 0.35);
}
.p-information .c-news-tag--event {
border-color: rgba(42, 122, 110, 0.35);
}
.p-information .c-news-tag--notice {
border-color: rgba(74, 111, 165, 0.35);
}
.p-information .c-news-tag--column {
border-color: rgba(201, 169, 110, 0.45);
}
.p-services {
padding: 70px 0;
background-color: #fff;
}
.p-services__list {
gap: 32px;
display: grid;
grid-template-columns: repeat(3, 1fr);
margin: 0;
padding: 0;
}
.p-services__item {
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-services {
padding: 56px 0;
}
.p-services__list {
gap: 24px;
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 767px) {
.p-services {
padding: 48px 0;
}
.p-services__list {
gap: 20px;
grid-template-columns: 1fr;
}
}
.p-online-lesson {
padding: 60px 0;
background-color: #f0ece3;
}
.p-online-lesson__layout {
display: grid;
grid-template-columns: 1fr 1fr;
overflow: hidden;
border-radius: 12px;
background-color: #fff;
}
.p-online-lesson__content {
padding: 36px;
}
.p-online-lesson__label {
display: inline-block;
margin: 0 0 12px;
padding: 4px 12px;
border-radius: 999px;
background-color: #e8f5e9;
color: #448a47;
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
font-weight: 500;
line-height: 1.5;
}
.p-online-lesson__title {
margin: 0 0 20px;
color: #603f00;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 600;
line-height: 1.45;
}
.p-online-lesson__lead {
margin: 0 0 28px;
color: #707070;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-online-lesson__features {
margin: 0 0 32px;
padding: 0;
}
.p-online-lesson__feature {
gap: 14px;
display: flex;
align-items: center;
list-style: none;
}
.p-online-lesson__feature:not(:last-child) {
margin-bottom: 16px;
}
.p-online-lesson__feature-icon {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border-radius: 50%;
background-color: rgba(229, 126, 37, 0.12);
}
.p-online-lesson__feature-icon img {
display: block;
width: 24px;
height: auto;
}
.p-online-lesson__feature-text {
color: #707070;
font-size: 0.9375rem;
line-height: 1.6;
}
.p-online-lesson__btn {
gap: 2px;
padding-right: 20px;
padding-left: 24px;
}
.p-online-lesson__btn-icon {
font-size: 1.125rem;
line-height: 1;
}
.p-online-lesson__visual {
line-height: 0;
}
.p-online-lesson__image {
-o-object-fit: cover;
display: block;
width: 100%;
height: auto;
object-fit: cover;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-online-lesson {
padding: 48px 0;
}
.p-online-lesson__layout {
align-items: center;
}
.p-online-lesson__content {
padding: 28px 24px 32px;
}
.p-online-lesson__title {
font-size: 1.625rem;
white-space: nowrap;
}
}
@media (max-width: 767px) {
.p-online-lesson {
padding: 40px 0;
}
.p-online-lesson__layout {
grid-template-columns: 1fr;
border-radius: 8px;
}
.p-online-lesson__visual {
order: -1;
}
.p-online-lesson__content {
padding: 24px 20px 28px;
}
.p-online-lesson__title {
font-size: 1.375rem;
}
}
.p-about {
padding: 60px 0;
background-color: #faf8f6;
}
.p-about__layout {
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
}
.p-about__content {
padding: 36px 0 36px 72px;
}
.p-about__label {
margin: 0 0 12px;
color: #603f00;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.08em;
line-height: 1.4;
text-transform: uppercase;
}
.p-about__title {
margin: 0 0 20px;
color: #000;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
line-height: 1.6;
}
.p-about__lead {
margin: 0 0 28px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-about__note {
gap: 20px;
display: flex;
position: relative;
align-items: flex-end;
padding: 20px;
color: inherit;
text-decoration: none;
transition: opacity 0.3s ease;
}
.p-about__note::before, .p-about__note::after {
position: absolute;
color: #000;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 300;
line-height: 1;
pointer-events: none;
}
.p-about__note::before {
top: 4px;
left: -18px;
content: "「";
}
.p-about__note::after {
right: -18px;
bottom: 4px;
content: "」";
}
.p-about__note:hover {
opacity: 0.85;
}
.p-about__note-body {
gap: 8px;
display: flex;
flex: 1;
flex-direction: column;
min-width: 0;
}
.p-about__note-title {
color: #000;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 400;
line-height: 1.5;
}
.p-about__note-text {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.7;
}
.p-about__note-logo {
display: block;
flex-shrink: 0;
width: auto;
height: 48px;
}
.p-about__visual {
height: 50%;
overflow: hidden;
line-height: 0;
}
.p-about__image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
@media (max-width: 991px) {
.p-about {
padding: 48px 0;
}
.p-about__layout {
grid-template-columns: 1fr;
}
.p-about__visual {
aspect-ratio: 2/1;
order: -1;
height: auto;
}
.p-about__content {
padding: 32px 24px 36px;
}
.p-about__title {
font-size: 1.5rem;
}
}
@media (max-width: 767px) {
.p-about {
padding: 40px 0;
}
.p-about__content {
padding: 24px 20px 32px;
}
.p-about__title {
font-size: 1.25rem;
}
.p-about__note {
gap: 16px;
flex-direction: column;
align-items: flex-start;
padding: 16px;
}
.p-about__note::before {
left: -28px;
}
.p-about__note::after {
right: -28px;
}
.p-about__note-logo {
height: 40px;
}
}
.p-harp-knowledge {
padding: 60px 0;
background-color: #faf8f6;
}
.p-harp-knowledge__box {
padding: 48px 40px 56px;
border-radius: 12px;
background-color: #fff;
text-align: center;
}
.p-harp-knowledge__header {
margin-bottom: 40px;
}
.p-harp-knowledge__label {
margin: 0 0 12px;
color: #c9a96e;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
}
.p-harp-knowledge__title {
margin: 0;
color: #000;
font-family: "Noto Serif JP", serif;
font-size: 1.5rem;
font-weight: 400;
line-height: 1.5;
}
.p-harp-knowledge__list {
gap: 20px 16px;
display: grid;
grid-template-columns: repeat(8, 1fr);
margin: 0;
padding: 0;
}
.p-harp-knowledge__item {
list-style: none;
}
.p-harp-knowledge__link {
display: block;
color: #707070;
transition: opacity 0.3s ease;
}
.p-harp-knowledge__link, .p-harp-knowledge__link:link, .p-harp-knowledge__link:visited, .p-harp-knowledge__link:hover, .p-harp-knowledge__link:focus, .p-harp-knowledge__link:active {
text-decoration: none;
}
.p-harp-knowledge__link:hover {
opacity: 0.8;
}
.p-harp-knowledge__link.is-current {
cursor: default;
pointer-events: none;
}
.p-harp-knowledge__link.is-current .p-harp-knowledge__name {
color: #c9a96e;
}
.p-harp-knowledge__item.is-current .p-harp-knowledge__thumb {
outline: 2px solid #c9a96e;
outline-offset: 2px;
}
.p-harp-knowledge__thumb {
aspect-ratio: 1;
display: block;
margin-bottom: 12px;
overflow: hidden;
line-height: 0;
}
.p-harp-knowledge__thumb img {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.p-harp-knowledge__name {
display: block;
color: #603f00;
font-family: "Noto Serif JP", serif;
font-size: 0.8125rem;
font-weight: 700;
line-height: 1.5;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-harp-knowledge {
padding: 48px 0;
}
.p-harp-knowledge__box {
padding: 40px 28px 48px;
}
.p-harp-knowledge__header {
margin-bottom: 32px;
}
.p-harp-knowledge__list {
gap: 20px 16px;
grid-template-columns: repeat(4, 1fr);
}
}
@media (max-width: 767px) {
.p-harp-knowledge {
padding: 40px 0;
}
.p-harp-knowledge__box {
padding: 32px 20px 40px;
border-radius: 8px;
}
.p-harp-knowledge__header {
margin-bottom: 24px;
}
.p-harp-knowledge__title {
font-size: 1.25rem;
}
.p-harp-knowledge__list {
gap: 20px 12px;
grid-template-columns: repeat(2, 1fr);
}
.p-harp-knowledge__name {
font-size: 0.75rem;
}
}
.p-harp {
--gnav-height: 56px;
background-color: #fff;
}
.p-harp .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-harp .l-gnav {
display: none;
}
}
body.is-menu-open .p-harp .l-gnav {
visibility: hidden;
}
.p-harp__section {
padding: 72px 0;
}
.p-harp__section--main-brand {
background-color: #faf8f6;
}
.p-harp__section--also-available {
padding-top: 48px;
padding-bottom: 180px;
background-color: #fff;
}
.p-harp__section--also-available .p-harp__section-label {
color: #968b70;
}
.p-harp__section--also-available .p-harp__section-label::before {
color: #968b70;
}
@media (max-width: 991px) {
.p-harp__section {
padding: 56px 0;
}
.p-harp__section--also-available {
padding-top: 40px;
padding-bottom: 64px;
}
}
@media (max-width: 767px) {
.p-harp__section {
padding: 48px 0;
}
.p-harp__section--also-available {
padding-top: 32px;
padding-bottom: 56px;
}
}
.p-harp__section-header {
margin-bottom: 48px;
text-align: center;
}
@media (max-width: 767px) {
.p-harp__section-header {
margin-bottom: 32px;
}
}
.p-harp__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-harp__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-harp__section-title {
margin: 0 0 20px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-harp__section-title {
font-size: 1.625rem;
}
}
.p-harp__section-lead {
max-width: 720px;
margin: 0 auto;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
text-align: left;
}
.p-harp__brand-cards {
gap: 32px;
display: grid;
grid-template-columns: repeat(2, 1fr);
margin: 0;
padding: 0;
list-style: none;
}
@media (max-width: 991px) {
.p-harp__brand-cards {
gap: 24px;
grid-template-columns: 1fr;
}
}
.p-harp__brand-card {
overflow: hidden;
border-radius: 8px;
background-color: #fff;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.p-harp__brand-card-media {
aspect-ratio: 16/10;
display: block;
position: relative;
overflow: hidden;
color: inherit;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-harp__brand-card-media:hover {
opacity: 1;
}
.p-harp__brand-card-media:hover .p-harp__brand-card-image {
transform: scale(1.04);
}
.p-harp__brand-card-badge {
z-index: 2;
position: absolute;
top: 16px;
left: 16px;
padding: 6px 14px;
background-color: #c9a96e;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.08em;
line-height: 1.4;
}
.p-harp__brand-card-image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.p-harp__brand-card-caption {
inset: 0;
display: flex;
z-index: 1;
position: absolute;
flex-direction: column;
align-items: flex-start;
justify-content: flex-end;
padding: 24px 28px;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.55) 100%);
text-align: left;
}
@media (max-width: 767px) {
.p-harp__brand-card-caption {
padding: 20px;
}
}
.p-harp__brand-card-label-en {
margin: 0 0 8px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.16em;
line-height: 1.4;
}
.p-harp__brand-card-title {
margin: 0;
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 1.5rem;
font-weight: 400;
letter-spacing: 0.06em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-harp__brand-card-title {
font-size: 1.25rem;
}
}
.p-harp__brand-card-body {
padding: 24px 28px 28px;
}
@media (max-width: 767px) {
.p-harp__brand-card-body {
padding: 20px;
}
}
.p-harp__brand-card-text {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-harp__brand-card-action {
display: flex;
justify-content: flex-end;
}
.p-harp__brand-list {
gap: 24px;
display: flex;
flex-direction: column;
margin: 0;
padding: 0;
list-style: none;
}
.p-harp__brand-item {
display: grid;
grid-template-columns: 280px 1fr;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 8px;
background-color: #fff;
}
@media (max-width: 991px) {
.p-harp__brand-item {
grid-template-columns: 220px 1fr;
}
}
@media (max-width: 767px) {
.p-harp__brand-item {
grid-template-columns: 1fr;
}
}
.p-harp__brand-item-media {
display: block;
overflow: hidden;
color: inherit;
line-height: 0;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-harp__brand-item-media:hover .p-harp__brand-item-image {
transform: scale(1.04);
}
.p-harp__brand-item-image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
min-height: 200px;
object-fit: cover;
transition: transform 0.5s ease;
}
@media (max-width: 767px) {
.p-harp__brand-item-image {
aspect-ratio: 16/10;
min-height: 180px;
}
}
.p-harp__brand-item-body {
display: flex;
flex-direction: column;
padding: 28px 32px;
}
@media (max-width: 767px) {
.p-harp__brand-item-body {
padding: 20px;
}
}
.p-harp__brand-item-label-en {
margin: 0 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.16em;
line-height: 1.4;
}
.p-harp__brand-item-title {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.375rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-harp__brand-item-title {
font-size: 1.25rem;
}
}
.p-harp__brand-item-text {
flex: 1;
margin: 0 0 20px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-harp__brand-item-action {
display: flex;
justify-content: flex-end;
}
.p-harp-camac {
--gnav-height: 56px;
--filter-sticky-top: 101px;
--camac-category-scroll-margin: 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac {
--filter-sticky-top: 85px;
--camac-category-scroll-margin: 72px;
}
}
.p-harp-camac .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-harp-camac .l-gnav {
display: none;
}
}
body.is-menu-open .p-harp-camac .l-gnav {
visibility: hidden;
}
.p-harp-camac__intro {
padding: 56px 0 40px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-harp-camac__intro {
padding: 40px 0 32px;
}
}
.p-harp-camac__intro-box {
max-width: 900px;
margin: 0 auto;
padding: 40px 48px;
border-radius: 4px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac__intro-box {
padding: 28px 20px;
}
}
.p-harp-camac__intro-box p,
.p-harp-camac__intro-box .p-harp-camac__intro-text {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-harp-camac__intro-box a,
.p-harp-camac__intro-box .p-harp-camac__intro-link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac__intro-box a:hover,
.p-harp-camac__intro-box .p-harp-camac__intro-link:hover {
color: #c9a96e;
}
.p-harp-camac__intro-text {
margin: 0 0 1.5em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-harp-camac__intro-text:last-child {
margin-bottom: 0;
}
.p-harp-camac__intro-link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac__intro-link:hover {
color: #c9a96e;
}
.p-harp-camac__category-nav {
scroll-margin-top: var(--camac-category-scroll-margin);
padding: 32px 0;
border-bottom: 1px solid #eaeaea;
background-color: #faf8f6;
}
.p-harp-camac__category-nav-list {
gap: clamp(10px, 1.2vw, 16px);
display: flex;
flex-wrap: nowrap;
margin: 0;
padding: 0;
list-style: none;
}
@media (max-width: 767px) {
.p-harp-camac__category-nav-list {
gap: 12px;
display: grid;
grid-template-columns: repeat(2, 1fr);
}
}
.p-harp-camac__category-nav-item {
flex: 1 1 0;
min-width: 0;
}
@media (max-width: 767px) {
.p-harp-camac__category-nav-item {
flex: initial;
min-width: initial;
}
}
.p-harp-camac__category-nav-link {
gap: 8px;
display: flex;
flex-direction: column;
align-items: center;
padding: clamp(14px, 1.6vw, 20px) clamp(8px, 1vw, 12px);
border-radius: 4px;
color: inherit;
text-align: center;
text-decoration: none;
transition: background-color 0.2s ease;
}
.p-harp-camac__category-nav-link:not(.is-disabled):hover {
background-color: rgba(201, 169, 110, 0.08);
}
.p-harp-camac__category-nav-link.is-active {
background-color: rgba(201, 169, 110, 0.12);
}
.p-harp-camac__category-nav-link.is-active .p-harp-camac__category-nav-label-en,
.p-harp-camac__category-nav-link.is-active .p-harp-camac__category-nav-label-ja {
color: #5d4307;
}
.p-harp-camac__category-nav-link.is-disabled {
cursor: default;
opacity: 0.45;
}
.p-harp-camac__category-nav-icon-wrap {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: clamp(36px, 3.5vw, 48px);
height: clamp(34px, 3.2vw, 42px);
}
.p-harp-camac__category-nav-icon {
-o-object-fit: contain;
-o-object-position: center;
display: block;
width: auto;
max-width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
}
.p-harp-camac__category-nav-label-en {
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: clamp(0.625rem, 0.9vw, 0.6875rem);
font-weight: 500;
letter-spacing: 0.14em;
line-height: 1.4;
}
.p-harp-camac__category-nav-label-ja {
color: #968b70;
font-family: "Noto Serif JP", serif;
font-size: clamp(0.875rem, 1.2vw, 1rem);
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-harp-camac__section-header {
margin-bottom: 32px;
text-align: center;
}
.p-harp-camac__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 12px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-harp-camac__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-harp-camac__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-harp-camac__section-title {
font-size: 1.625rem;
}
}
.p-harp-camac__lineup {
padding-bottom: 120px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac__lineup {
padding-bottom: 64px;
}
}
.p-harp-camac__lineup-header {
padding-top: 56px;
padding-bottom: 24px;
}
@media (max-width: 767px) {
.p-harp-camac__lineup-header {
padding-top: 40px;
padding-bottom: 16px;
}
}
.p-harp-camac__filters-float {
z-index: 30;
position: sticky;
top: var(--filter-sticky-top);
padding: 12px 0;
border-bottom: 1px solid #eaeaea;
backdrop-filter: blur(8px);
background-color: rgba(255, 255, 255, 0.96);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}
@media (max-width: 767px) {
.p-harp-camac__filters-float {
padding: 10px 0;
}
}
@media (max-width: 767px) {
.p-harp-camac__filters-float-inner {
padding-inline: 0;
}
}
.p-harp-camac__filters-bar {
gap: 12px 20px;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: start;
}
@media (max-width: 767px) {
.p-harp-camac__filters-bar {
gap: 10px;
padding-inline: 16px;
grid-template-columns: 1fr;
}
}
.p-harp-camac__layout-toggle {
gap: 4px;
display: inline-flex;
grid-column: 2;
grid-row: 1;
flex-shrink: 0;
justify-self: end;
padding: 4px;
border: 1px solid #eaeaea;
border-radius: 999px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-harp-camac__layout-toggle {
grid-column: 1;
justify-self: end;
}
}
.p-harp-camac__layout-toggle-btn {
gap: 4px;
display: inline-flex;
align-items: center;
padding: 8px 14px;
border: 0;
border-radius: 999px;
background-color: transparent;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
line-height: 1;
cursor: pointer;
transition: background-color 0.2s ease, color 0.2s ease;
}
.p-harp-camac__layout-toggle-btn .material-icons {
font-size: 1.125rem;
}
.p-harp-camac__layout-toggle-btn:hover {
color: #5d4307;
}
.p-harp-camac__layout-toggle-btn.is-active {
background-color: #c9a96e;
color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac__layout-toggle-label {
display: none;
}
}
.p-harp-camac__filters {
gap: 10px;
display: flex;
grid-column: 1;
flex-wrap: wrap;
justify-content: flex-start;
}
@media (max-width: 767px) {
.p-harp-camac__filters {
padding-inline: 16px;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
flex-wrap: nowrap;
justify-content: flex-start;
overflow-x: auto;
}
.p-harp-camac__filters::-webkit-scrollbar {
display: none;
}
}
.p-harp-camac__filter {
flex-shrink: 0;
padding: 10px 20px;
border: 1px solid #968b70;
border-radius: 999px;
background-color: transparent;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1.4;
cursor: pointer;
transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.p-harp-camac__filter:hover {
border-color: #c9a96e;
color: #5d4307;
}
.p-harp-camac__filter.is-active {
border-color: #c9a96e;
background-color: #c9a96e;
color: #fff;
}
.p-harp-camac__product-list {
gap: 0;
display: grid;
grid-template-columns: 1fr;
margin: 0;
padding: 0;
list-style: none;
}
.p-harp-camac__product-list[hidden] {
display: none !important;
}
.p-harp-camac__product {
min-width: 0;
}
.p-harp-camac__product[hidden] {
display: none;
}
.p-harp-camac__product-inner {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: stretch;
min-width: 0;
}
.p-harp-camac__product:nth-child(even) .p-harp-camac__product-inner .p-harp-camac__product-media {
order: 2;
}
.p-harp-camac__product:nth-child(even) .p-harp-camac__product-inner .p-harp-camac__product-body {
order: 1;
}
.p-harp-camac__product-media {
display: flex;
align-items: center;
justify-content: center;
min-width: 0;
padding: 32px 20px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac__product-media {
padding: 28px 16px;
}
}
.p-harp-camac__product-body {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
padding: 32px 24px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-harp-camac__product-body {
padding: 28px 20px;
}
}
.p-harp-camac__product-media-inner,
.p-harp-camac__product-body-inner {
width: 100%;
min-width: 0;
}
.p-harp-camac__product-media-link {
display: block;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-harp-camac__product-media-link:hover {
opacity: 0.85;
}
.p-harp-camac__product-image {
margin-inline: auto;
-o-object-fit: contain;
display: block;
width: 100%;
max-width: 220px;
height: auto;
object-fit: contain;
}
@media (max-width: 767px) {
.p-harp-camac__product-image {
max-width: 180px;
}
}
.p-harp-camac__product-body-label {
margin: 0 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-harp-camac__product-name {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-harp-camac__product-name {
font-size: 1.125rem;
}
}
.p-harp-camac__product-description {
margin: 0 0 12px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-harp-camac__product-content {
margin: 8px 0;
padding: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-harp-camac__product-content > :first-child {
margin-top: 0;
}
.p-harp-camac__product-content > :last-child {
margin-bottom: 0;
}
.p-harp-camac__product-specs {
margin: 0 0 12px;
padding: 0;
list-style: none;
}
.p-harp-camac__product-spec {
gap: 8px;
display: flex;
align-items: center;
margin-bottom: 8px;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-harp-camac__product-spec:last-child {
margin-bottom: 0;
}
.p-harp-camac__spec-icon {
flex-shrink: 0;
color: #c9a96e;
font-size: 1.25rem;
}
.p-harp-camac__product-price {
margin: 0 0 12px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.6;
}
.p-harp-camac__product-price-incl {
display: block;
margin-bottom: 4px;
color: #5d4307;
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.02em;
}
.p-harp-camac__product-price-excl {
color: #707070;
font-size: 0.8125rem;
}
.p-harp-camac__product-action {
display: inline-flex;
justify-content: flex-start;
}
.p-harp-camac__product-btn.c-btn--dark,
.p-harp-camac__product-btn.c-btn--primary {
gap: 4px;
display: inline-flex;
padding-right: 16px;
padding-left: 24px;
border-color: #1a1a1a;
background-color: #1a1a1a;
color: #fff;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.p-harp-camac__product-btn.c-btn--dark:hover,
.p-harp-camac__product-btn.c-btn--primary:hover {
transform: translateY(-2px);
border-color: #525252;
background-color: #525252;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.p-harp-camac__product-btn.c-btn--dark:active,
.p-harp-camac__product-btn.c-btn--primary:active {
transform: translateY(0);
border-color: #333;
background-color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
.p-harp-camac__product-btn-icon {
font-size: 1.25rem;
}
.p-harp-camac__lineup-grid {
display: block;
max-width: 100%;
margin: 0;
padding: 0;
}
.p-harp-camac__lineup-grid[hidden] {
display: none !important;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-list {
-moz-column-gap: 20px;
row-gap: 20px;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin: 0;
padding: 0;
column-gap: 20px;
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-list {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (max-width: 767px) {
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-product {
min-width: 0;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-product[hidden] {
display: none;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-card {
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
border-radius: 14px;
background-color: #faf8f6;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-media-link {
display: block;
text-decoration: none;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-media {
position: relative;
height: 350px;
padding: 30px 30px 0;
overflow: hidden;
background-color: #fff;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-image {
-o-object-fit: cover;
-o-object-position: center top;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center top;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-body {
gap: 8px;
display: flex;
flex: 1;
flex-direction: column;
padding: 16px;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-category {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.6875rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.4;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-name {
margin: 0;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.02em;
line-height: 1.45;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-specs {
gap: 8px 12px;
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 0;
list-style: none;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-spec {
gap: 4px;
display: inline-flex;
align-items: center;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
line-height: 1.4;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-spec-icon {
color: #c9a96e;
font-size: 1rem;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-footer {
gap: 12px;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: auto;
padding-top: 4px;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-price {
margin: 0;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
font-weight: 700;
letter-spacing: 0.02em;
line-height: 1.3;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-btn {
display: inline-flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
min-width: 72px;
padding: 8px 18px;
border-radius: 999px;
background-color: #1a1a1a;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1;
text-decoration: none;
transition: background-color 0.2s ease;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-btn:hover {
background-color: rgb(51.5, 51.5, 51.5);
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-cart {
margin-top: 4px;
}
.p-harp-camac__lineup-grid .p-harp-camac__lineup-grid-cart .p-harp-camac__product-cart-btn {
width: 100%;
min-height: 34px;
font-size: 0.8125rem;
}
.p-harp-camac-detail .l-main {
padding: 0;
}
.p-harp-camac-detail__product {
padding: 48px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac-detail__product {
padding: 32px 0 48px;
}
}
.p-harp-camac-detail__product-inner {
gap: 48px;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: center;
margin-bottom: 48px;
}
@media (max-width: 991px) {
.p-harp-camac-detail__product-inner {
gap: 32px;
grid-template-columns: 1fr;
margin-bottom: 40px;
}
}
.p-harp-camac-detail__product-media {
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}
.p-harp-camac-detail__product-image {
-o-object-fit: contain;
display: block;
width: 100%;
max-width: 400px;
height: auto;
max-height: 600px;
object-fit: contain;
}
.p-harp-camac-detail__product-body-label {
margin: 0 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-harp-camac-detail__product-name {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-harp-camac-detail__product-name {
font-size: 1.625rem;
}
}
.p-harp-camac-detail__product-origin {
margin: 0 0 16px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-harp-camac-detail__product-description {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-harp-camac-detail__product-price {
margin: 0 0 24px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.6;
}
.p-harp-camac-detail__product-price-incl {
display: block;
margin-bottom: 4px;
color: #c9a96e;
font-size: 1.375rem;
font-weight: 500;
letter-spacing: 0.02em;
}
@media (max-width: 767px) {
.p-harp-camac-detail__product-price-incl {
font-size: 1.25rem;
}
}
.p-harp-camac-detail__product-price-excl {
color: #707070;
font-size: 0.875rem;
}
.p-harp-camac-detail__product-note {
margin: -14px 0 20px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.7;
}
.p-harp-camac-detail__purchase-btn,
.p-harp-camac-detail__quote-btn {
min-width: 280px;
padding: 16px 32px;
font-size: 0.9375rem;
}
@media (max-width: 767px) {
.p-harp-camac-detail__purchase-btn,
.p-harp-camac-detail__quote-btn {
width: 100%;
min-width: 0;
}
}
.p-harp-camac-detail__tabs-wrap {
max-width: 900px;
}
.p-harp-camac-detail__tab-list {
gap: 0;
display: grid;
grid-template-columns: repeat(3, 1fr);
margin-bottom: 0;
}
.p-harp-camac-detail__tab {
padding: 14px 16px;
border: none;
border-bottom: 1px solid #eaeaea;
background-color: #faf8f6;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.4;
text-align: center;
cursor: pointer;
transition: background-color 0.2s ease, color 0.2s ease;
}
.p-harp-camac-detail__tab:hover:not(.is-active) {
background-color: rgba(201, 169, 110, 0.08);
color: #5d4307;
}
.p-harp-camac-detail__tab.is-active {
border-bottom-color: #5d4307;
background-color: #5d4307;
color: #fff;
}
.p-harp-camac-detail__tab-pane[hidden] {
display: none;
}
.p-harp-camac-detail__tab-pane:not([hidden]) {
display: block;
}
.p-harp-camac-detail__spec-list {
margin: 0;
padding: 0;
}
.p-harp-camac-detail__spec-row {
gap: 16px;
display: grid;
grid-template-columns: 160px 1fr;
padding: 16px 0;
border-bottom: 1px solid #eaeaea;
}
@media (max-width: 767px) {
.p-harp-camac-detail__spec-row {
gap: 4px;
grid-template-columns: 1fr;
padding: 14px 0;
}
}
.p-harp-camac-detail__spec-row:last-child {
border-bottom: none;
}
.p-harp-camac-detail__spec-label {
margin: 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.6;
}
.p-harp-camac-detail__spec-label a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac-detail__spec-label a:hover {
color: #c9a96e;
}
.p-harp-camac-detail__spec-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-harp-camac-detail__spec-note {
display: block;
margin-top: 4px;
color: #968b70;
font-size: 0.8125rem;
}
.p-harp-camac-detail__spec-note a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac-detail__spec-note a:hover {
color: #c9a96e;
}
.p-harp-camac-detail__tab-remark {
margin: 16px 0 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.7;
}
.p-harp-camac-detail__tab-remark a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac-detail__tab-remark a:hover {
color: #c9a96e;
}
.p-harp-camac-detail__related {
padding: 64px 0 120px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-harp-camac-detail__related {
padding: 48px 0 64px;
}
}
.p-harp-camac-detail__related .p-harp-camac__section-header {
margin-bottom: 40px;
}
.p-harp-camac-detail__related-slider {
gap: 12px;
display: flex;
position: relative;
align-items: center;
width: 100%;
}
.p-harp-camac-detail__related-slider:not(.is-slider) .p-harp-camac-detail__related-nav {
display: none;
}
.p-harp-camac-detail__related-slider.is-single .p-harp-camac-detail__related-viewport {
overflow: visible;
}
.p-harp-camac-detail__related-slider.is-single .p-harp-camac-detail__related-track {
justify-content: center;
overflow-x: visible;
}
.p-harp-camac-detail__related-slider.is-single .p-harp-camac-detail__related-item {
flex: 0 0 calc((100% - 48px) / 3);
max-width: calc((100% - 48px) / 3);
}
@media (max-width: 991px) {
.p-harp-camac-detail__related-slider.is-single .p-harp-camac-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
max-width: calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-harp-camac-detail__related-slider.is-single .p-harp-camac-detail__related-item {
flex: 0 0 100%;
max-width: 280px;
}
}
.p-harp-camac-detail__related-slider.is-pair .p-harp-camac-detail__related-track {
justify-content: center;
}
.p-harp-camac-detail__related-slider.is-pair .p-harp-camac-detail__related-item {
flex: 0 0 calc((100% - 24px) / 3);
max-width: calc((100% - 24px) / 3);
}
@media (max-width: 991px) {
.p-harp-camac-detail__related-slider.is-pair .p-harp-camac-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
max-width: calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-harp-camac-detail__related-slider.is-pair .p-harp-camac-detail__related-item {
flex: 0 0 calc(100% - 32px);
max-width: 280px;
}
}
@media (min-width: 992px) {
.p-harp-camac-detail__related-slider.is-triple .p-harp-camac-detail__related-viewport {
overflow: visible;
}
.p-harp-camac-detail__related-slider.is-triple .p-harp-camac-detail__related-track {
overflow-x: visible;
}
.p-harp-camac-detail__related-slider.is-triple .p-harp-camac-detail__related-item {
flex: 0 0 calc((100% - 48px) / 3);
max-width: calc((100% - 48px) / 3);
}
}
.p-harp-camac-detail__related-slider.is-slider .p-harp-camac-detail__related-viewport {
overflow: hidden;
}
.p-harp-camac-detail__related-slider.is-slider .p-harp-camac-detail__related-track {
overflow-x: auto;
}
.p-harp-camac-detail__related-slider.is-slider .p-harp-camac-detail__related-item {
flex: 0 0 calc((100cqw - 48px) / 3);
width: calc((100cqw - 48px) / 3);
}
@media (max-width: 991px) {
.p-harp-camac-detail__related-slider.is-slider .p-harp-camac-detail__related-item {
flex: 0 0 calc((100cqw - 24px) / 2);
width: calc((100cqw - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-harp-camac-detail__related-slider.is-slider .p-harp-camac-detail__related-item {
flex: 0 0 calc(100cqw - 32px);
width: calc(100cqw - 32px);
}
}
.p-harp-camac-detail__related-nav {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 0;
border: 1px solid #eaeaea;
border-radius: 50%;
background-color: #fff;
color: #968b70;
cursor: pointer;
transition: border-color 0.2s ease, color 0.2s ease;
}
.p-harp-camac-detail__related-nav .material-icons {
font-size: 1.5rem;
}
.p-harp-camac-detail__related-nav:hover:not(:disabled) {
border-color: #c9a96e;
color: #5d4307;
}
.p-harp-camac-detail__related-nav:disabled {
cursor: default;
opacity: 0.35;
}
@media (max-width: 767px) {
.p-harp-camac-detail__related-nav {
width: 32px;
height: 32px;
}
.p-harp-camac-detail__related-nav .material-icons {
font-size: 1.25rem;
}
}
.p-harp-camac-detail__related-viewport {
container-type: inline-size;
flex: 1;
min-width: 0;
overflow: hidden;
}
.p-harp-camac-detail__related-track {
gap: 24px;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
display: flex;
margin: 0;
padding: 0;
overflow-x: auto;
list-style: none;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
}
.p-harp-camac-detail__related-track::-webkit-scrollbar {
display: none;
}
@media (max-width: 767px) {
.p-harp-camac-detail__related-track {
gap: 16px;
}
}
.p-harp-camac-detail__related-item {
scroll-snap-align: start;
flex: 0 0 calc((100% - 48px) / 3);
min-width: 0;
}
@media (max-width: 991px) {
.p-harp-camac-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-harp-camac-detail__related-item {
flex: 0 0 calc(100% - 32px);
}
}
.p-harp-camac-detail__related-card {
height: 100%;
padding: 24px 20px;
border-radius: 4px;
background-color: #fff;
text-align: center;
}
.p-harp-camac-detail__related-media {
display: flex;
justify-content: center;
margin-bottom: 16px;
}
.p-harp-camac-detail__related-media-link {
display: flex;
align-items: center;
justify-content: center;
width: 180px;
height: 180px;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-harp-camac-detail__related-media-link:hover {
opacity: 0.85;
}
.p-harp-camac-detail__related-image {
-o-object-fit: contain;
display: block;
width: auto;
max-width: 100%;
height: auto;
max-height: 100%;
object-fit: contain;
}
.p-harp-camac-detail__related-body-label {
margin: 0 0 6px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-harp-camac-detail__related-name {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-harp-camac-detail__related-price {
margin: 0 0 12px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.5;
}
.p-harp-camac-detail__related-price-incl {
display: block;
margin-bottom: 2px;
color: #5d4307;
font-size: 0.9375rem;
font-weight: 500;
}
.p-harp-camac-detail__related-price-excl {
color: #707070;
font-size: 0.75rem;
}
.p-harp-camac-detail__related-link {
gap: 2px;
display: inline-flex;
align-items: center;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
text-decoration: none;
transition: color 0.2s ease;
}
.p-harp-camac-detail__related-link .material-icons {
font-size: 1.125rem;
}
.p-harp-camac-detail__related-link:hover {
color: #c9a96e;
}
.p-harp-camac-detail__related-current {
display: inline-block;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
}
.p-harp-camac-detail__related-item.is-current .p-harp-camac-detail__related-card {
border: 1px solid rgba(201, 169, 110, 0.4);
}
.l-main .p-harp-camac-features {
padding: 48px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-features {
padding: 36px 0 48px;
}
}
.l-main .p-harp-camac-features__inner {
max-width: 900px;
margin: 0 auto;
}
.l-main .p-harp-camac-features__header {
margin-bottom: 40px;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-features__header {
margin-bottom: 32px;
}
}
.l-main .p-harp-camac-features__title {
margin: 0 0 24px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
text-align: center;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-features__title {
margin-bottom: 18px;
font-size: 1.5rem;
}
}
.l-main .p-harp-camac-features__lead-text {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.l-main .p-harp-camac-features__lead-text:last-child {
margin-bottom: 0;
}
.l-main .p-harp-camac-features__section {
margin-bottom: 40px;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-features__section {
margin-bottom: 32px;
}
}
.l-main .p-harp-camac-features .wp-block-lazyblock-harp-feature-section {
margin: 0 0 40px !important;
margin-block-end: 40px !important;
}
.l-main .p-harp-camac-features .wp-block-lazyblock-harp-feature-section > .p-harp-camac-features__section {
margin-bottom: 0;
}
.l-main .p-harp-camac-features .wp-block-lazyblock-harp-feature-section:last-child {
margin-bottom: 0 !important;
margin-block-end: 0 !important;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-features .wp-block-lazyblock-harp-feature-section {
margin-bottom: 32px !important;
margin-block-end: 32px !important;
}
}
.l-main .p-harp-camac-features__inner > .l-main .p-harp-camac-features__section:last-child {
margin-bottom: 0;
}
.l-main .p-harp-camac-features__section-title {
margin: 0 0 16px;
padding-bottom: 10px;
border-bottom: 1px solid #eaeaea;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.375rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-features__section-title {
font-size: 1.25rem;
}
}
.l-main .p-harp-camac-features__text {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.l-main .p-harp-camac-features__text:last-child {
margin-bottom: 0;
}
.l-main .p-harp-camac-features__section-body:not(.l-main .p-harp-camac-features__section-body--side):not(.l-main .p-harp-camac-features__section-body--float) .l-main .p-harp-camac-features__text:last-of-type {
margin-bottom: 1em;
}
.l-main .p-harp-camac-features__section-body--float::after {
display: table;
clear: both;
content: "";
}
.l-main .p-harp-camac-features__float-media {
max-width: 100%;
margin: 0 0 12px 28px;
float: right;
}
.l-main .p-harp-camac-features__float-media.is-float-start {
margin: 0 28px 12px 0;
float: left;
}
@media (max-width: 991px) {
.l-main .p-harp-camac-features__float-media {
margin: 0 auto 16px;
float: none;
text-align: center;
}
}
.l-main .p-harp-camac-features__section-row {
gap: 24px 40px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.l-main .p-harp-camac-features__section-row.is-media-start {
flex-direction: row-reverse;
}
@media (max-width: 991px) {
.l-main .p-harp-camac-features__section-row {
gap: 20px;
flex-direction: column;
}
.l-main .p-harp-camac-features__section-row.is-media-start {
flex-direction: column;
}
}
.l-main .p-harp-camac-features__section-content {
flex: 1 1 280px;
min-width: 0;
}
.l-main .p-harp-camac-features__section-media {
flex: 0 0 auto;
margin: 0;
line-height: 0;
text-align: center;
}
.l-main .p-harp-camac-features__section-media .p-harp-camac-features__caption {
line-height: 1.5;
}
.l-main .p-harp-camac-features__compare {
margin: 0;
text-align: center;
}
.l-main .p-harp-camac-features__compare-grid {
gap: 12px 20px;
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: center;
max-width: 100%;
margin: 0;
}
.l-main .p-harp-camac-features__compare-item {
display: flex;
flex: 0 0 auto;
flex-direction: column;
max-width: 100%;
margin: 0;
}
.l-main .p-harp-camac-features__compare-media {
line-height: 0;
}
.l-main .p-harp-camac-features__compare-image {
display: block;
width: auto;
max-width: 100%;
height: auto;
}
.l-main .p-harp-camac-features__compare-caption, .l-main .p-harp-camac-features__caption {
margin: 10px 0 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
font-weight: 500;
line-height: 1.5;
text-align: center;
}
.l-main .p-harp-camac-features__figure {
margin: 0;
line-height: 0;
text-align: center;
}
.l-main .p-harp-camac-features__image {
display: inline-block;
width: auto;
max-width: 100%;
height: auto;
border-radius: 4px;
vertical-align: top;
}
.l-main .p-harp-camac-price {
padding: 48px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-price {
padding: 36px 0 48px;
}
}
.l-main .p-harp-camac-price__inner {
max-width: 960px;
margin: 0 auto;
}
.l-main .p-harp-camac-price__header {
margin-bottom: 28px;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-price__header {
margin-bottom: 20px;
}
}
.l-main .p-harp-camac-price__title {
margin: 0 0 8px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
text-align: center;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-price__title {
font-size: 1.375rem;
}
}
.l-main .p-harp-camac-price__lead {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
text-align: center;
}
.l-main .p-harp-camac-price__table-scroll {
-webkit-overflow-scrolling: touch;
margin-bottom: 24px;
overflow-x: auto;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #faf8f6;
box-shadow: 0 1px 3px rgba(93, 67, 7, 0.04);
}
.l-main .p-harp-camac-price__table {
width: 100%;
min-width: 680px;
border-collapse: separate;
border-spacing: 0;
background-color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.l-main .p-harp-camac-price__table--celtic {
min-width: 720px;
}
.l-main .p-harp-camac-price__table thead th {
z-index: 2;
padding: 16px 18px;
border-bottom: 2px solid rgba(93, 67, 7, 0.12);
background-color: #f0ece3;
color: #5d4307;
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.04em;
white-space: nowrap;
}
.l-main .p-harp-camac-price__col-model {
z-index: 3;
position: sticky;
left: 0;
min-width: 200px;
box-shadow: 1px 0 0 rgba(93, 67, 7, 0.1);
text-align: left;
}
.l-main .p-harp-camac-price__table tbody tr {
transition: background-color 0.15s ease;
}
.l-main .p-harp-camac-price__table tbody tr:nth-child(even) {
background-color: #faf8f6;
}
.l-main .p-harp-camac-price__table tbody tr:nth-child(even) .p-harp-camac-price__model {
background-color: #faf8f6;
}
.l-main .p-harp-camac-price__table tbody tr:hover {
background-color: rgba(240, 236, 227, 0.45);
}
.l-main .p-harp-camac-price__table tbody tr:hover .p-harp-camac-price__model {
background-color: rgba(240, 236, 227, 0.45);
}
.l-main .p-harp-camac-price__table tbody th, .l-main .p-harp-camac-price__table tbody td {
padding: 15px 18px;
border-bottom: 1px solid #eaeaea;
color: #707070;
vertical-align: middle;
}
.l-main .p-harp-camac-price__table tbody tr:last-child th, .l-main .p-harp-camac-price__table tbody tr:last-child td {
border-bottom: none;
}
.l-main .p-harp-camac-price__col-strings {
min-width: 72px;
text-align: center;
}
.l-main .p-harp-camac-price__col-string-type {
min-width: 96px;
text-align: center;
}
.l-main .p-harp-camac-price__col-string-count {
min-width: 72px;
text-align: center;
}
.l-main .p-harp-camac-price__col-soundboard {
min-width: 120px;
text-align: center;
}
.l-main .p-harp-camac-price__col-price-incl, .l-main .p-harp-camac-price__col-price-excl {
min-width: 128px;
text-align: right;
}
.l-main .p-harp-camac-price__col-price-incl {
border-left: 1px solid rgba(93, 67, 7, 0.1);
}
.l-main .p-harp-camac-price__model {
z-index: 1;
position: sticky;
left: 0;
min-width: 200px;
background-color: #fff;
box-shadow: 1px 0 0 #eaeaea;
color: #5d4307;
font-weight: 500;
text-align: left;
white-space: nowrap;
}
.l-main .p-harp-camac-price__model-link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.l-main .p-harp-camac-price__model-link:hover {
color: #c9a96e;
}
.l-main .p-harp-camac-price__cell {
text-align: center;
white-space: nowrap;
}
.l-main .p-harp-camac-price__cell--strings, .l-main .p-harp-camac-price__cell--soundboard, .l-main .p-harp-camac-price__cell--string-type, .l-main .p-harp-camac-price__cell--string-count {
color: #968b70;
font-size: 0.8125rem;
}
.l-main .p-harp-camac-price__cell--price-incl {
border-left: 1px solid rgba(93, 67, 7, 0.1);
color: #5d4307;
font-size: 0.9375rem;
font-variant-numeric: tabular-nums;
font-weight: 500;
text-align: right;
}
.l-main .p-harp-camac-price__cell--price-excl {
color: #968b70;
font-size: 0.8125rem;
font-variant-numeric: tabular-nums;
text-align: right;
}
.l-main .p-harp-camac-price__note {
margin: 0;
padding: 16px 20px;
border-radius: 4px;
background-color: #faf8f6;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.8;
text-align: center;
}
.l-main .p-harp-camac-testimony {
padding: 48px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony {
padding: 36px 0 48px;
}
}
.l-main .p-harp-camac-testimony__inner {
max-width: 900px;
margin: 0 auto;
}
.l-main .p-harp-camac-testimony__header {
margin-bottom: 40px;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__header {
margin-bottom: 32px;
}
}
.l-main .p-harp-camac-testimony__title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
text-align: center;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__title {
font-size: 1.5rem;
}
}
.l-main .p-harp-camac-testimony__list {
gap: 32px;
display: flex;
flex-direction: column;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__list {
gap: 24px;
}
}
.l-main .p-harp-camac-testimony__card {
margin: 0;
padding: 32px 36px 36px;
border: 1px solid #eaeaea;
border-left: 3px solid #c9a96e;
border-radius: 4px;
background-color: #fff;
}
.l-main .p-harp-camac-testimony__card.is-alt {
background-color: #faf8f6;
}
.l-main .p-harp-camac-testimony__card.is-featured {
padding: 36px 40px 40px;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__card {
padding: 24px 20px 28px;
}
.l-main .p-harp-camac-testimony__card.is-featured {
padding: 28px 20px 32px;
}
}
.l-main .p-harp-camac-testimony__card-header {
margin-bottom: 20px;
padding-bottom: 16px;
border-bottom: 1px solid #eaeaea;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__card-header {
margin-bottom: 16px;
padding-bottom: 12px;
}
}
.l-main .p-harp-camac-testimony__name {
margin: 0 0 8px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__name {
font-size: 1.125rem;
}
}
.l-main .p-harp-camac-testimony__meta {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.l-main .p-harp-camac-testimony__card-body {
gap: 24px 36px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
@media (max-width: 991px) {
.l-main .p-harp-camac-testimony__card-body {
gap: 20px;
flex-direction: column;
}
}
.l-main .p-harp-camac-testimony__media {
flex: 0 0 auto;
margin: 0;
line-height: 0;
text-align: center;
}
.l-main .p-harp-camac-testimony__image {
display: block;
width: auto;
max-width: 100%;
height: auto;
border-radius: 4px;
}
.l-main .p-harp-camac-testimony__content {
flex: 1 1 280px;
min-width: 0;
}
.l-main .p-harp-camac-testimony__content p {
margin: 0 0 1.25em;
padding: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.l-main .p-harp-camac-testimony__content p:last-child {
margin-bottom: 0;
}
.l-main .p-harp-camac-testimony__text {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.l-main .p-harp-camac-testimony__text:last-child {
margin-bottom: 0;
}
.l-main .p-harp-camac-testimony__subheading {
margin: 1.5em 0 0.75em;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.0625rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.l-main .p-harp-camac-testimony__subheading:first-child {
margin-top: 0;
}
.l-main .p-harp-camac-testimony__link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.l-main .p-harp-camac-testimony__link:hover {
color: #c9a96e;
}
.l-main .p-harp-camac-testimony__inline-media {
margin: 0 0 12px 12px;
float: right;
line-height: 0;
}
@media (max-width: 767px) {
.l-main .p-harp-camac-testimony__inline-media {
margin: 0 auto 16px;
float: none;
text-align: center;
}
}
.p-harp-camac-celtic .l-main {
padding: 0;
}
.p-harp-camac-celtic__content {
padding: 56px 0 72px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-harp-camac-celtic__content {
padding: 40px 0 52px;
}
}
.p-harp-camac-celtic__content-inner {
max-width: 1000px;
margin: 0 auto;
}
.p-harp-camac-celtic__header {
margin-bottom: 28px;
text-align: center;
}
@media (max-width: 767px) {
.p-harp-camac-celtic__header {
margin-bottom: 22px;
}
}
.p-harp-camac-celtic__lead {
max-width: 840px;
margin: 14px auto 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-harp-camac-celtic__lead a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac-celtic__lead a:hover {
color: #c9a96e;
}
.p-harp-camac-celtic__blocks {
gap: 16px;
display: grid;
grid-template-columns: repeat(2, 1fr);
margin-top: 28px;
}
@media (max-width: 991px) {
.p-harp-camac-celtic__blocks {
grid-template-columns: 1fr;
}
}
.p-harp-camac-celtic__block {
display: flex;
flex-direction: column;
padding: 22px 22px 20px;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
}
.p-harp-camac-celtic__block-title {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-harp-camac-celtic__text {
margin: 0 0 12px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-harp-camac-celtic__audio {
margin-top: auto;
}
.p-harp-camac-celtic__audio audio {
width: 100%;
}
.p-harp-camac-celtic__cta {
display: flex;
justify-content: center;
margin-top: 28px;
}
.p-harp-camac-celtic__color-grid {
gap: 16px;
display: grid;
grid-template-columns: repeat(3, 1fr);
margin: 24px 0 0;
padding: 0;
list-style: none;
}
@media (max-width: 991px) {
.p-harp-camac-celtic__color-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 767px) {
.p-harp-camac-celtic__color-grid {
grid-template-columns: 1fr;
}
}
.p-harp-camac-celtic__subsection {
margin-top: 48px;
}
@media (max-width: 767px) {
.p-harp-camac-celtic__subsection {
margin-top: 40px;
}
}
.p-harp-camac-celtic__subsection-title {
margin: 0 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
text-align: center;
}
.p-harp-camac-celtic__examples-title {
margin: 32px 0 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.0625rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
text-align: center;
}
.p-harp-camac-celtic__link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-harp-camac-celtic__link:hover {
color: #c9a96e;
}
.p-harp-camac-celtic__color-figure {
margin: 0;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
}
.p-harp-camac-celtic__color-image {
display: block;
width: 100%;
height: auto;
}
.p-harp-camac-celtic__color-caption {
padding: 10px 12px;
border-top: 1px solid #eaeaea;
background-color: #faf8f6;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
text-align: center;
}
.p-harp-camac-celtic__color-caption--standard {
color: #707070;
font-weight: 700;
}
.p-harp-camac-celtic__pdf-list {
max-width: 760px;
margin: 22px auto 0;
padding: 0;
list-style: none;
}
.p-harp-camac-celtic__pdf-item {
padding: 14px 16px;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #faf8f6;
}
.p-harp-camac-celtic__pdf-link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
}
.p-harp-camac-celtic__pdf-link:hover {
color: #c9a96e;
}
.p-aoyama {
--aoyama-quote-sticky-top: 101px;
}
@media (max-width: 767px) {
.p-aoyama {
--aoyama-quote-sticky-top: 85px;
}
}
.p-aoyama .p-aoyama__lineup {
padding-bottom: 120px;
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__lineup {
padding-bottom: 64px;
}
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__lineup:has(.p-aoyama__quote-panel.is-visible) {
padding-bottom: 200px;
}
}
.p-aoyama .p-aoyama__product-list-wrap {
padding-top: 8px;
padding-bottom: 0;
}
.p-aoyama .p-aoyama__lineup-layout {
gap: 32px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: center;
}
@media (min-width: 992px) {
.p-aoyama .p-aoyama__lineup-layout {
flex-wrap: nowrap;
}
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__lineup-layout {
gap: 0;
}
}
.p-aoyama .p-aoyama__list {
margin-inline: auto;
flex: 1 1 720px;
max-width: 720px;
}
.p-aoyama .p-aoyama__quote-panel {
flex: 0 0 240px;
width: 240px;
}
@media (min-width: 992px) {
.p-aoyama .p-aoyama__quote-panel {
position: sticky;
top: var(--aoyama-quote-sticky-top);
align-self: flex-start;
}
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__quote-panel {
z-index: 50;
position: fixed;
right: 0;
bottom: 0;
left: 0;
flex: none;
width: auto;
max-height: min(50vh, 320px);
border-top: 1px solid #eaeaea;
box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1);
}
}
.p-aoyama .p-aoyama__quote-panel[hidden] {
display: none;
}
.p-aoyama .p-aoyama__quote-panel-inner {
gap: 12px;
display: flex;
flex-direction: column;
padding: 20px 16px;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__quote-panel-inner {
gap: 10px;
max-height: inherit;
padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0));
border: 0;
border-radius: 0;
box-shadow: none;
}
}
.p-aoyama .p-aoyama__quote-panel-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 0.9375rem;
font-weight: 600;
letter-spacing: 0.06em;
line-height: 1.5;
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__quote-panel-title {
font-size: 0.875rem;
}
}
.p-aoyama .p-aoyama__quote-panel-empty {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-aoyama .p-aoyama__quote-panel-empty[hidden] {
display: none;
}
.p-aoyama .p-aoyama__quote-list {
gap: 8px;
display: flex;
flex-direction: column;
max-height: 240px;
margin: 0;
padding: 0;
overflow-y: auto;
list-style: none;
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__quote-list {
max-height: 120px;
}
}
.p-aoyama .p-aoyama__quote-list:empty {
display: none;
}
.p-aoyama .p-aoyama__quote-item {
gap: 8px;
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.p-aoyama .p-aoyama__quote-item-name {
flex: 1 1 auto;
min-width: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.5;
word-break: break-word;
}
.p-aoyama .p-aoyama__quote-item-remove {
display: inline-flex;
flex: 0 0 auto;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
padding: 0;
border: 0;
border-radius: 50%;
background: transparent;
color: #968b70;
cursor: pointer;
transition: background-color 0.2s ease;
}
.p-aoyama .p-aoyama__quote-item-remove .material-icons {
font-size: 18px;
line-height: 1;
}
.p-aoyama .p-aoyama__quote-item-remove:hover {
background-color: #faf8f6;
}
.p-aoyama .p-aoyama__quote-request-btn {
width: 100%;
min-height: 40px;
font-size: 0.875rem;
letter-spacing: 0.04em;
}
.p-aoyama .p-aoyama__quote-request-btn:disabled {
cursor: not-allowed;
opacity: 0.45;
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__quote-request-btn {
min-height: 44px;
}
}
.p-aoyama .p-aoyama__row {
position: relative;
margin-bottom: 28px;
padding-bottom: 28px;
}
.p-aoyama .p-aoyama__row::after {
display: block;
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 1px;
background-image: repeating-linear-gradient(90deg, #eaeaea 0, #eaeaea 2px, transparent 2px, transparent 6px);
content: "";
}
.p-aoyama .p-aoyama__row.is-last {
margin-bottom: 0;
padding-bottom: 0;
}
.p-aoyama .p-aoyama__row.is-last::after {
display: none;
}
.p-aoyama .p-aoyama__row-list {
gap: 20px;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0;
padding: 0;
list-style: none;
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__row-list {
gap: 16px 12px;
}
}
.p-aoyama .p-aoyama__row--cols-3 .p-aoyama__product {
flex: 0 1 190px;
width: 190px;
max-width: calc(33.333% - 14px);
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__row--cols-3 .p-aoyama__product {
flex: 0 1 calc(50% - 8px);
width: calc(50% - 8px);
max-width: none;
}
}
.p-aoyama .p-aoyama__row--cols-1 .p-aoyama__product {
flex: 0 1 190px;
width: 190px;
max-width: 100%;
}
.p-aoyama .p-aoyama__row--cols-2 .p-aoyama__product {
flex: 0 1 190px;
width: 190px;
max-width: calc(50% - 12px);
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__row--cols-2 .p-aoyama__product {
flex: 0 1 calc(50% - 8px);
width: calc(50% - 8px);
max-width: none;
}
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__row--cols-3 .p-aoyama__product:nth-child(3):last-child {
margin-inline: auto;
flex: 0 1 190px;
width: 190px;
}
}
.p-aoyama .p-aoyama__row--cols-4 .p-aoyama__product {
flex: 0 1 220px;
width: 220px;
max-width: calc(25% - 15px);
}
@media (max-width: 991px) {
.p-aoyama .p-aoyama__row--cols-4 .p-aoyama__product {
flex: 0 1 calc(50% - 10px);
width: calc(50% - 10px);
max-width: none;
}
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__row--cols-4 .p-aoyama__product {
flex: 0 1 calc(50% - 8px);
width: calc(50% - 8px);
}
}
.p-aoyama .p-aoyama__product {
min-width: 0;
}
.p-aoyama .p-aoyama__product-card {
display: flex;
flex-direction: column;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
text-align: center;
}
.p-aoyama .p-aoyama__product-head {
padding: 16px 12px 12px;
background-color: #faf8f6;
}
.p-aoyama .p-aoyama__product-name {
margin: 0 0 4px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-aoyama .p-aoyama__product-name {
font-size: 0.9375rem;
}
}
.p-aoyama .p-aoyama__product-name:last-child {
margin-bottom: 0;
}
.p-aoyama .p-aoyama__product-code {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-aoyama .p-aoyama__product-media {
position: relative;
height: 210px;
margin-bottom: 0;
background-color: #fff;
}
.p-aoyama .p-aoyama__product-image {
-o-object-fit: contain;
position: absolute;
top: 50%;
left: 50%;
width: auto;
max-width: calc(100% - 16px);
height: auto;
max-height: calc(100% - 16px);
object-fit: contain;
transform: translate(-50%, -50%);
}
.p-aoyama .p-aoyama__product-foot {
padding: 12px 12px 16px;
background-color: #faf8f6;
}
.p-aoyama .p-aoyama__product-desc {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-aoyama .p-aoyama__product-desc + .p-aoyama__product-action {
margin-top: 12px;
}
.p-aoyama .p-aoyama__product-action {
margin: 0;
}
.p-aoyama .p-aoyama__product-cart-btn {
width: 100%;
min-width: 0;
height: 34px;
padding: 0 12px;
border: 1px solid #968b70;
background-color: #968b70;
color: #fff;
font-size: 0.8125rem;
letter-spacing: 0.02em;
}
.p-aoyama .p-aoyama__product-cart-btn:hover {
border-color: rgb(133.4282258065, 123.164516129, 97.9717741935);
background-color: rgb(133.4282258065, 123.164516129, 97.9717741935);
}
.p-aoyama .p-aoyama__product-cart-btn.is-selected {
border-color: #968b70;
background-color: #fff;
color: #968b70;
}
.p-aoyama .p-aoyama__product-cart-btn.is-selected:hover {
background-color: #faf8f6;
}
.p-used .p-used__intro {
padding: 56px 0 24px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-used .p-used__intro {
padding: 40px 0 16px;
}
}
.p-used .p-used__intro-inner {
max-width: 900px;
}
.p-used .p-used__intro-box {
margin: 0 auto;
padding: 40px 48px;
border-radius: 4px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-used .p-used__intro-box {
padding: 28px 20px;
}
}
.p-used .p-used__intro-text,
.p-used .p-used__intro-copy p {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-used .p-used__intro-copy p {
margin: 0 0 1.25em;
}
.p-used .p-used__intro-copy p:last-child {
margin-bottom: 1.75em;
}
.p-used .p-used__intro-text:last-of-type {
margin-bottom: 1.75em;
}
.p-used .p-used__count {
margin: 0 0 1em;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
letter-spacing: 0.04em;
line-height: 1.8;
text-align: center;
}
.p-used .p-used__count strong {
font-size: 1.25rem;
font-weight: 600;
}
.p-used .p-used__actions {
text-align: center;
}
.p-used .p-used__lineup {
padding-top: 8px;
}
.p-used .p-used__list {
max-width: 960px;
}
.p-used .p-used__product-media {
height: 240px;
}
@media (max-width: 767px) {
.p-used .p-used__product-media {
height: 210px;
}
}
.p-used .p-aoyama__row-list {
align-items: stretch;
}
.p-used .p-aoyama__row--cols-3 .p-used__product {
display: flex;
flex: 0 1 280px;
width: 280px;
max-width: calc(33.333% - 14px);
}
@media (max-width: 767px) {
.p-used .p-aoyama__row--cols-3 .p-used__product {
flex: 0 1 calc(50% - 8px);
width: calc(50% - 8px);
max-width: none;
}
}
.p-used .p-used__product-card {
width: 100%;
height: 100%;
text-align: left;
}
.p-used .p-used__product-foot {
gap: 8px;
display: flex;
flex: 1;
flex-direction: column;
align-items: stretch;
}
.p-used .p-used__product-specs {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-used .p-used__product-price {
margin: 4px 0 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.4;
}
.p-used .p-used__product-price-tax {
font-family: "Noto Sans JP", sans-serif;
font-size: 0.6875rem;
letter-spacing: 0;
}
.p-used .p-used__product-name-link {
color: inherit;
text-decoration: none;
}
.p-used .p-used__product-name-link:hover {
text-decoration: underline;
}
.p-used .p-used__product-media-link {
inset: 0;
display: block;
position: absolute;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-used .p-used__product-media-link:hover {
opacity: 0.85;
}
.p-used .p-used__product-action {
justify-content: center;
margin-top: auto;
padding-top: 4px;
}
.p-used .p-used__product-btn.c-btn--dark {
gap: 2px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
min-width: 0;
height: 34px;
padding: 0 12px;
border-color: #1a1a1a;
background-color: #1a1a1a;
color: #fff;
font-size: 0.8125rem;
line-height: 1.4;
white-space: nowrap;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.p-used .p-used__product-btn.c-btn--dark:hover {
transform: translateY(-2px);
border-color: #525252;
background-color: #525252;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.p-used .p-used__product-btn.c-btn--dark:active {
transform: translateY(0);
border-color: #333;
background-color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
.p-used .p-used__product-btn-icon {
font-size: 1.125rem;
}
.p-used-detail .p-harp-camac-detail__related {
padding-bottom: 24px;
}
@media (max-width: 767px) {
.p-used-detail .p-harp-camac-detail__related {
padding-bottom: 16px;
}
}
.p-used-detail .p-used-detail__specs-wrap {
max-width: 900px;
margin-top: 8px;
}
.p-used-detail .p-used-detail__specs-heading {
margin: 0 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
}
.p-used-detail .p-used-detail__specs-text {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
letter-spacing: 0.04em;
line-height: 1.8;
}
.p-used-detail .p-used-detail__back {
padding: 24px 0 80px;
background-color: #faf8f6;
text-align: center;
}
@media (max-width: 767px) {
.p-used-detail .p-used-detail__back {
padding: 16px 0 56px;
}
}
.p-used-detail .p-used-detail__back-btn {
min-width: 200px;
}
.p-used-detail .p-used-detail__stub {
padding: 80px 0;
text-align: center;
}
.p-used-detail .p-used-detail__stub-text {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-accessory {
--gnav-height: 56px;
--filter-sticky-top: 101px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-accessory {
--filter-sticky-top: 85px;
}
}
.p-accessory .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-accessory .l-gnav {
display: none;
}
}
body.is-menu-open .p-accessory .l-gnav {
visibility: hidden;
}
.p-accessory__order-flow {
padding: 48px 0 40px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-accessory__order-flow {
padding: 32px 0 24px;
}
}
.p-accessory__order-flow-box {
max-width: 900px;
margin: 0 auto;
padding: 40px 48px 36px;
border-radius: 8px;
background-color: #1e3a2f;
color: #fff;
text-align: center;
}
@media (max-width: 767px) {
.p-accessory__order-flow-box {
padding: 32px 20px 28px;
}
}
.p-accessory__order-flow-icon {
display: block;
margin: 0 auto 16px;
color: #c9a96e;
font-size: 2.5rem;
}
.p-accessory__order-flow-title {
margin: 0 0 20px;
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 1.5rem;
font-weight: 400;
letter-spacing: 0.06em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-accessory__order-flow-title {
font-size: 1.25rem;
}
}
.p-accessory__order-flow-lead {
max-width: 680px;
margin: 0 auto 20px;
padding: 0;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
text-align: left;
}
.p-accessory__order-flow-list {
max-width: 640px;
margin: 0 auto 24px;
padding: 0;
list-style: none;
text-align: left;
}
.p-accessory__order-flow-item {
position: relative;
padding-left: 1.25em;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-accessory__order-flow-item::before {
position: absolute;
left: 0;
content: "・";
}
.p-accessory__order-flow-term {
font-weight: 700;
}
.p-accessory__order-flow-item .p-law__link {
color: #c9a96e;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-accessory__order-flow-item .p-law__link:hover {
text-underline-offset: 2px;
color: #c9a96e;
text-decoration: underline;
opacity: 0.85;
}
.p-accessory__order-flow-note {
max-width: 680px;
margin: 0 auto 20px;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
text-align: left;
}
.p-accessory__order-flow-link-wrap {
margin: 0;
}
.p-accessory__order-flow-link {
gap: 8px;
display: inline-flex;
align-items: center;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-accessory__order-flow-link:hover {
text-underline-offset: 2px;
text-decoration: underline;
opacity: 0.85;
}
.p-accessory__order-flow-link-icon {
font-size: 0.75rem;
}
.p-accessory__section-header {
margin-bottom: 0;
text-align: center;
}
.p-accessory__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 12px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-accessory__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-accessory__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-accessory__section-title {
font-size: 1.625rem;
}
}
.p-accessory__lineup {
padding-bottom: 0;
background-color: #fff;
}
@media (max-width: 767px) {
.p-accessory__lineup {
padding-bottom: 0;
}
}
.p-accessory__lineup + .c-parts-crosslink-group {
padding: 56px 0;
}
@media (max-width: 767px) {
.p-accessory__lineup + .c-parts-crosslink-group {
padding: 40px 0;
}
}
.p-accessory__lineup-header {
padding-top: 56px;
padding-bottom: 24px;
}
@media (max-width: 767px) {
.p-accessory__lineup-header {
padding-top: 40px;
padding-bottom: 16px;
}
}
.p-accessory__filters-float {
z-index: 30;
position: sticky;
top: var(--filter-sticky-top);
padding: 12px 0;
border-bottom: 1px solid #eaeaea;
backdrop-filter: blur(8px);
background-color: rgba(255, 255, 255, 0.96);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}
@media (max-width: 767px) {
.p-accessory__filters-float {
padding: 10px 0;
}
}
.p-accessory__filters {
gap: 10px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media (max-width: 767px) {
.p-accessory__filters {
padding-inline: 0;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
flex-wrap: nowrap;
justify-content: flex-start;
overflow-x: auto;
}
.p-accessory__filters::-webkit-scrollbar {
display: none;
}
}
.p-accessory__filter {
flex-shrink: 0;
padding: 10px 20px;
border: 1px solid #968b70;
border-radius: 999px;
background-color: transparent;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1.4;
cursor: pointer;
transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.p-accessory__filter:hover {
border-color: #c9a96e;
color: #5d4307;
}
.p-accessory__filter.is-active {
border-color: #c9a96e;
background-color: #c9a96e;
color: #fff;
}
.p-accessory__filter--link {
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
}
.p-accessory__product-list-wrap {
padding-top: 32px;
padding-bottom: 0;
}
@media (max-width: 767px) {
.p-accessory__product-list-wrap {
padding-top: 24px;
}
}
.p-accessory__product-list {
gap: 24px;
display: grid;
grid-template-columns: 1fr;
margin: 0;
padding: 0;
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-accessory__product-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 992px) {
.p-accessory__product-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.p-accessory__product {
min-width: 0;
}
.p-accessory__product[hidden] {
display: none;
}
.p-accessory__product-card {
height: 100%;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}
.p-accessory__product-inner {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: stretch;
min-width: 0;
height: 100%;
}
@media (max-width: 767px) {
.p-accessory__product-inner {
grid-template-columns: 1fr;
}
}
.p-accessory__product-media {
display: flex;
align-items: center;
justify-content: center;
min-width: 0;
padding: 24px 16px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-accessory__product-media {
padding: 20px 16px 12px;
}
}
.p-accessory__product-media-link {
display: block;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-accessory__product-media-link:hover {
opacity: 0.85;
}
.p-accessory__product-image {
-o-object-fit: contain;
display: block;
width: 100%;
max-width: 200px;
height: auto;
max-height: 200px;
object-fit: contain;
}
@media (max-width: 767px) {
.p-accessory__product-image {
max-width: 240px;
}
}
.p-accessory__product-body {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
padding: 24px 20px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-accessory__product-body {
padding: 16px 20px 24px;
}
}
.p-accessory__product-body-label {
margin: 0 0 6px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-accessory__product-name {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-accessory__product-name {
font-size: 1.375rem;
}
}
.p-accessory__product-description {
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
display: -webkit-box;
margin: 0 0 12px;
overflow: hidden;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.8;
}
.p-accessory__product-price {
margin: 0 0 16px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.6;
}
.p-accessory__product-price-incl {
display: block;
margin-bottom: 4px;
color: #5d4307;
font-size: 1.0625rem;
font-weight: 500;
letter-spacing: 0.02em;
}
.p-accessory__product-price-excl {
color: #707070;
font-size: 0.75rem;
}
.p-accessory__product-action {
display: flex;
justify-content: flex-end;
margin-top: auto;
}
.p-accessory__product-btn.c-btn--dark,
.p-accessory__product-btn.c-btn--primary {
gap: 4px;
display: inline-flex;
padding-right: 16px;
padding-left: 24px;
border-color: #1a1a1a;
background-color: #1a1a1a;
color: #fff;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.p-accessory__product-btn.c-btn--dark:hover,
.p-accessory__product-btn.c-btn--primary:hover {
transform: translateY(-2px);
border-color: #525252;
background-color: #525252;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.p-accessory__product-btn.c-btn--dark:active,
.p-accessory__product-btn.c-btn--primary:active {
transform: translateY(0);
border-color: #333;
background-color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
.p-accessory__product-btn-icon {
font-size: 1.25rem;
}
.p-accessory-detail-stub {
padding: 80px 0 120px;
background-color: #fff;
text-align: center;
}
@media (max-width: 767px) {
.p-accessory-detail-stub {
padding: 56px 0 80px;
}
}
.p-accessory-detail-stub__title {
margin: 0 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
}
.p-accessory-detail-stub__text {
margin: 0 0 32px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-accessory-detail-stub__back {
display: inline-flex;
}
.p-accessory-detail .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-accessory-detail .l-gnav {
display: none;
}
}
body.is-menu-open .p-accessory-detail .l-gnav {
visibility: hidden;
}
.p-accessory-detail__product {
padding: 48px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-accessory-detail__product {
padding: 32px 0 48px;
}
}
.p-accessory-detail__product-inner {
gap: 48px;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: start;
margin-bottom: 48px;
}
@media (max-width: 991px) {
.p-accessory-detail__product-inner {
gap: 32px;
grid-template-columns: 1fr;
margin-bottom: 40px;
}
}
.p-accessory-detail__product-media {
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}
.p-accessory-detail__product-image {
-o-object-fit: contain;
display: block;
width: 100%;
max-width: 400px;
height: auto;
max-height: 600px;
object-fit: contain;
}
.p-accessory-detail__product-body-label {
margin: 0 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-accessory-detail__product-name {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-accessory-detail__product-name {
font-size: 1.625rem;
}
}
.p-accessory-detail__product-origin {
margin: 0 0 16px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-accessory-detail__product-price {
margin: 0 0 20px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.6;
}
.p-accessory-detail__product-price-incl {
display: block;
margin-bottom: 4px;
color: #c9a96e;
font-size: 1.375rem;
font-weight: 500;
letter-spacing: 0.02em;
}
@media (max-width: 767px) {
.p-accessory-detail__product-price-incl {
font-size: 1.25rem;
}
}
.p-accessory-detail__product-price-excl {
color: #707070;
font-size: 0.875rem;
}
.p-accessory-detail__product-description {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-accessory-detail__order-note {
margin: 0 0 24px;
padding: 16px 20px 20px;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: transparent;
color: #968b70;
}
@media (max-width: 767px) {
.p-accessory-detail__order-note {
padding: 14px 16px 18px;
}
}
.p-accessory-detail__order-note-legend {
padding: 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.4;
}
.p-accessory-detail__order-note-text {
margin: 0 0 12px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-accessory-detail__order-note-list {
margin: 0;
padding: 0 0 0 1.25em;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
list-style: disc;
list-style-position: outside;
}
.p-accessory-detail__order-note-list li {
margin-bottom: 6px;
padding-left: 0.25em;
}
.p-accessory-detail__order-note-list li::marker {
color: #968b70;
}
.p-accessory-detail__order-note-list li:last-child {
margin-bottom: 0;
}
.p-accessory-detail__order-note-reassurance {
margin: 12px 0 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-accessory-detail__product-action {
display: flex;
justify-content: flex-start;
}
.p-accessory-detail__cart-btn.c-btn--primary {
gap: 8px;
display: inline-flex;
min-width: 200px;
padding: 12px 28px;
border-color: #1a1a1a;
background-color: #1a1a1a;
color: #fff;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.p-accessory-detail__cart-btn.c-btn--primary:hover {
transform: translateY(-2px);
border-color: #525252;
background-color: #525252;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.p-accessory-detail__cart-btn.c-btn--primary:active {
transform: translateY(0);
border-color: #333;
background-color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
@media (max-width: 767px) {
.p-accessory-detail__cart-btn.c-btn--primary {
width: 100%;
min-width: 0;
}
}
.p-accessory-detail__cart-btn-icon {
font-size: 1.25rem;
}
.p-accessory-detail__specs-wrap {
max-width: 900px;
padding-bottom: 16px;
}
.p-accessory-detail__specs-heading {
width: 200px;
margin: 0 0 0;
padding: 14px 20px;
border-radius: 4px 4px 0 0;
background-color: #5d4307;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.4;
text-align: center;
}
.p-accessory-detail__spec-list {
margin: 0;
padding: 0;
border: 1px solid #eaeaea;
border-radius: 0 0 4px 4px;
background-color: #fff;
}
.p-accessory-detail__spec-row {
gap: 16px;
display: grid;
grid-template-columns: 160px 1fr;
padding: 16px 20px;
border-bottom: 1px solid #eaeaea;
}
@media (max-width: 767px) {
.p-accessory-detail__spec-row {
gap: 4px;
grid-template-columns: 1fr;
padding: 14px 16px;
}
}
.p-accessory-detail__spec-row:last-child {
border-bottom: none;
}
.p-accessory-detail__spec-label {
margin: 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.6;
}
.p-accessory-detail__spec-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-accessory-detail__spec-note {
display: block;
margin-top: 4px;
color: #968b70;
font-size: 0.8125rem;
}
.p-accessory-detail__related {
padding: 64px 0 120px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-accessory-detail__related {
padding: 48px 0 64px;
}
}
.p-accessory-detail__related .p-accessory__section-header {
margin-bottom: 40px;
}
.p-accessory-detail__related-slider {
gap: 12px;
display: flex;
position: relative;
align-items: center;
width: 100%;
}
.p-accessory-detail__related-slider:not(.is-slider) .p-accessory-detail__related-nav {
display: none;
}
.p-accessory-detail__related-slider.is-single .p-accessory-detail__related-viewport {
overflow: visible;
}
.p-accessory-detail__related-slider.is-single .p-accessory-detail__related-track {
justify-content: center;
overflow-x: visible;
}
.p-accessory-detail__related-slider.is-single .p-accessory-detail__related-item {
flex: 0 0 calc((100% - 48px) / 3);
max-width: calc((100% - 48px) / 3);
}
@media (max-width: 991px) {
.p-accessory-detail__related-slider.is-single .p-accessory-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
max-width: calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-accessory-detail__related-slider.is-single .p-accessory-detail__related-item {
flex: 0 0 100%;
max-width: 280px;
}
}
.p-accessory-detail__related-slider.is-pair .p-accessory-detail__related-track {
justify-content: center;
}
.p-accessory-detail__related-slider.is-pair .p-accessory-detail__related-item {
flex: 0 0 calc((100% - 24px) / 3);
max-width: calc((100% - 24px) / 3);
}
@media (max-width: 991px) {
.p-accessory-detail__related-slider.is-pair .p-accessory-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
max-width: calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-accessory-detail__related-slider.is-pair .p-accessory-detail__related-item {
flex: 0 0 calc(100% - 32px);
max-width: 280px;
}
}
@media (min-width: 992px) {
.p-accessory-detail__related-slider.is-triple .p-accessory-detail__related-viewport {
overflow: visible;
}
.p-accessory-detail__related-slider.is-triple .p-accessory-detail__related-track {
overflow-x: visible;
}
.p-accessory-detail__related-slider.is-triple .p-accessory-detail__related-item {
flex: 0 0 calc((100% - 48px) / 3);
max-width: calc((100% - 48px) / 3);
}
}
.p-accessory-detail__related-slider.is-slider .p-accessory-detail__related-viewport {
overflow: hidden;
}
.p-accessory-detail__related-slider.is-slider .p-accessory-detail__related-track {
overflow-x: auto;
}
.p-accessory-detail__related-slider.is-slider .p-accessory-detail__related-item {
flex: 0 0 calc((100cqw - 48px) / 3);
width: calc((100cqw - 48px) / 3);
}
@media (max-width: 991px) {
.p-accessory-detail__related-slider.is-slider .p-accessory-detail__related-item {
flex: 0 0 calc((100cqw - 24px) / 2);
width: calc((100cqw - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-accessory-detail__related-slider.is-slider .p-accessory-detail__related-item {
flex: 0 0 calc(100cqw - 32px);
width: calc(100cqw - 32px);
}
}
.p-accessory-detail__related-nav {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 0;
border: 1px solid #eaeaea;
border-radius: 50%;
background-color: #fff;
color: #968b70;
cursor: pointer;
transition: border-color 0.2s ease, color 0.2s ease;
}
.p-accessory-detail__related-nav .material-icons {
font-size: 1.5rem;
}
.p-accessory-detail__related-nav:hover:not(:disabled) {
border-color: #c9a96e;
color: #5d4307;
}
.p-accessory-detail__related-nav:disabled {
cursor: default;
opacity: 0.35;
}
@media (max-width: 767px) {
.p-accessory-detail__related-nav {
width: 32px;
height: 32px;
}
.p-accessory-detail__related-nav .material-icons {
font-size: 1.25rem;
}
}
.p-accessory-detail__related-viewport {
container-type: inline-size;
flex: 1;
min-width: 0;
overflow: hidden;
}
.p-accessory-detail__related-track {
gap: 24px;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
display: flex;
margin: 0;
padding: 0;
overflow-x: auto;
list-style: none;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
}
.p-accessory-detail__related-track::-webkit-scrollbar {
display: none;
}
@media (max-width: 767px) {
.p-accessory-detail__related-track {
gap: 16px;
}
}
.p-accessory-detail__related-item {
scroll-snap-align: start;
flex: 0 0 calc((100% - 48px) / 3);
min-width: 0;
}
@media (max-width: 991px) {
.p-accessory-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-accessory-detail__related-item {
flex: 0 0 calc(100% - 32px);
}
}
.p-accessory-detail__related-card {
height: 100%;
padding: 24px 20px;
border-radius: 4px;
background-color: #fff;
text-align: center;
}
.p-accessory-detail__related-media {
display: flex;
justify-content: center;
margin-bottom: 16px;
}
.p-accessory-detail__related-media-link {
display: flex;
align-items: center;
justify-content: center;
width: 180px;
height: 180px;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-accessory-detail__related-media-link:hover {
opacity: 0.85;
}
.p-accessory-detail__related-image {
-o-object-fit: contain;
display: block;
width: auto;
max-width: 100%;
height: auto;
max-height: 100%;
object-fit: contain;
}
.p-accessory-detail__related-body-label {
margin: 0 0 6px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-accessory-detail__related-name {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-accessory-detail__related-price {
margin: 0 0 12px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.5;
}
.p-accessory-detail__related-price-incl {
display: block;
margin-bottom: 2px;
color: #5d4307;
font-size: 0.9375rem;
font-weight: 500;
}
.p-accessory-detail__related-price-excl {
color: #707070;
font-size: 0.75rem;
}
.p-accessory-detail__related-link {
gap: 2px;
display: inline-flex;
align-items: center;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
text-decoration: none;
transition: color 0.2s ease;
}
.p-accessory-detail__related-link .material-icons {
font-size: 1.125rem;
}
.p-accessory-detail__related-link:hover {
color: #c9a96e;
}
.p-accessory-detail__related-current {
display: inline-block;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
}
.p-accessory-detail__related-item.is-current .p-accessory-detail__related-card {
border: 1px solid rgba(201, 169, 110, 0.4);
}
.p-cd {
--gnav-height: 56px;
--filter-sticky-top: 101px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-cd {
--filter-sticky-top: 85px;
}
}
.p-cd .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-cd .l-gnav {
display: none;
}
}
body.is-menu-open .p-cd .l-gnav {
visibility: hidden;
}
.p-cd__order-flow {
padding: 56px 0 32px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-cd__order-flow {
padding: 40px 0 24px;
}
}
.p-cd__order-flow-box {
max-width: 900px;
margin: 0 auto;
padding: 40px 48px 36px;
border-radius: 8px;
background-color: #1e3a2f;
color: #fff;
text-align: center;
}
@media (max-width: 767px) {
.p-cd__order-flow-box {
padding: 32px 20px 28px;
}
}
.p-cd__order-flow-icon {
display: block;
margin: 0 auto 16px;
color: #c9a96e;
font-size: 2.5rem;
}
.p-cd__order-flow-title {
margin: 0 0 20px;
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 1.5rem;
font-weight: 400;
letter-spacing: 0.06em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-cd__order-flow-title {
font-size: 1.25rem;
}
}
.p-cd__order-flow-lead {
max-width: 680px;
margin: 0 auto 20px;
padding: 0;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
text-align: left;
}
.p-cd__order-flow-list {
max-width: 640px;
margin: 0 auto 24px;
padding: 0;
list-style: none;
text-align: left;
}
.p-cd__order-flow-item {
position: relative;
margin-bottom: 12px;
padding-left: 1.25em;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-cd__order-flow-item::before {
position: absolute;
left: 0;
content: "・";
}
.p-cd__order-flow-item:last-child {
margin-bottom: 0;
}
.p-cd__order-flow-term {
font-weight: 700;
}
.p-cd__order-flow-item .p-law__link {
color: #c9a96e;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-cd__order-flow-item .p-law__link:hover {
text-underline-offset: 2px;
color: #c9a96e;
text-decoration: underline;
opacity: 0.85;
}
.p-cd__order-flow-note {
max-width: 680px;
margin: 0 auto 20px;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
text-align: left;
}
.p-cd__order-flow-link-wrap {
margin: 0;
}
.p-cd__order-flow-link {
gap: 8px;
display: inline-flex;
align-items: center;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-cd__order-flow-link:hover {
text-underline-offset: 2px;
text-decoration: underline;
opacity: 0.85;
}
.p-cd__order-flow-link-icon {
font-size: 0.75rem;
}
.p-cd__section-header {
margin-bottom: 0;
text-align: center;
}
.p-cd__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 12px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-cd__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-cd__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-cd__section-title {
font-size: 1.625rem;
}
}
.p-cd__lineup {
padding-bottom: 0;
background-color: #fff;
}
.p-cd__lineup-header {
padding-top: 56px;
padding-bottom: 24px;
}
@media (max-width: 767px) {
.p-cd__lineup-header {
padding-top: 40px;
padding-bottom: 16px;
}
}
.p-cd__filters-float {
z-index: 30;
position: sticky;
top: var(--filter-sticky-top);
padding: 12px 0;
border-bottom: 1px solid #eaeaea;
backdrop-filter: blur(8px);
background-color: rgba(255, 255, 255, 0.96);
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}
@media (max-width: 767px) {
.p-cd__filters-float {
padding: 10px 0;
}
}
.p-cd__filters {
gap: 10px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media (max-width: 767px) {
.p-cd__filters {
padding-inline: 0;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
flex-wrap: nowrap;
justify-content: flex-start;
overflow-x: auto;
}
.p-cd__filters::-webkit-scrollbar {
display: none;
}
}
.p-cd__filter {
flex-shrink: 0;
padding: 10px 20px;
border: 1px solid #968b70;
border-radius: 999px;
background-color: transparent;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1.4;
cursor: pointer;
transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.p-cd__filter:hover {
border-color: #c9a96e;
color: #5d4307;
}
.p-cd__filter.is-active {
border-color: #c9a96e;
background-color: #c9a96e;
color: #fff;
}
.p-cd__filter--link {
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
}
.p-cd__product-list-wrap {
padding-top: 32px;
padding-bottom: 0;
}
@media (max-width: 767px) {
.p-cd__product-list-wrap {
padding-top: 24px;
}
}
.p-cd__product-list {
gap: 24px;
display: grid;
grid-template-columns: 1fr;
margin: 0;
padding: 0;
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-cd__product-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 992px) {
.p-cd__product-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.p-cd__product {
min-width: 0;
}
.p-cd__product[hidden] {
display: none;
}
.p-cd__product-card {
height: 100%;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}
.p-cd__product-inner {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: stretch;
min-width: 0;
height: 100%;
}
@media (max-width: 767px) {
.p-cd__product-inner {
grid-template-columns: 1fr;
}
}
.p-cd__product-media {
display: flex;
align-items: center;
justify-content: center;
min-width: 0;
padding: 24px 16px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-cd__product-media {
padding: 20px 16px 12px;
}
}
.p-cd__product-media-link {
display: block;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-cd__product-media-link:hover {
opacity: 0.85;
}
.p-cd__product-image {
aspect-ratio: 1;
-o-object-fit: contain;
display: block;
width: 100%;
max-width: 200px;
height: auto;
object-fit: contain;
}
@media (max-width: 767px) {
.p-cd__product-image {
max-width: 240px;
}
}
.p-cd__product-body {
display: flex;
flex-direction: column;
justify-content: center;
min-width: 0;
padding: 24px 20px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-cd__product-body {
padding: 16px 20px 24px;
}
}
.p-cd__product-body-label {
margin: 0 0 6px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-cd__product-name {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-cd__product-name {
font-size: 1.375rem;
}
}
.p-cd__product-description {
margin: 0 0 12px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.8;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-cd__product-description {
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
display: -webkit-box;
overflow: hidden;
}
}
.p-cd__product-price {
margin: 0 0 16px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.6;
}
.p-cd__product-price-incl {
display: block;
margin-bottom: 4px;
color: #5d4307;
font-size: 1.0625rem;
font-weight: 500;
letter-spacing: 0.02em;
}
.p-cd__product-price-excl {
color: #707070;
font-size: 0.75rem;
}
.p-cd__product-action {
display: flex;
justify-content: flex-end;
margin-top: auto;
}
.p-cd__product-btn.c-btn--dark,
.p-cd__product-btn.c-btn--primary {
gap: 4px;
display: inline-flex;
padding-right: 16px;
padding-left: 24px;
border-color: #1a1a1a;
background-color: #1a1a1a;
color: #fff;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.p-cd__product-btn.c-btn--dark:hover,
.p-cd__product-btn.c-btn--primary:hover {
transform: translateY(-2px);
border-color: #525252;
background-color: #525252;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.p-cd__product-btn.c-btn--dark:active,
.p-cd__product-btn.c-btn--primary:active {
transform: translateY(0);
border-color: #333;
background-color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
.p-cd__product-btn-icon {
font-size: 1.25rem;
}
.p-cd-detail-stub {
padding: 80px 0 120px;
background-color: #fff;
text-align: center;
}
@media (max-width: 767px) {
.p-cd-detail-stub {
padding: 56px 0 80px;
}
}
.p-cd-detail-stub__title {
margin: 0 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
}
.p-cd-detail-stub__text {
margin: 0 0 32px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-cd-detail-stub__back {
display: inline-flex;
}
.p-cd-detail .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-cd-detail .l-gnav {
display: none;
}
}
body.is-menu-open .p-cd-detail .l-gnav {
visibility: hidden;
}
.p-cd-detail__product {
padding: 48px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-cd-detail__product {
padding: 32px 0 48px;
}
}
.p-cd-detail__product-inner {
gap: 48px;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: start;
margin-bottom: 48px;
}
@media (max-width: 991px) {
.p-cd-detail__product-inner {
gap: 32px;
grid-template-columns: 1fr;
margin-bottom: 40px;
}
}
.p-cd-detail__product-media {
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: flex-start;
padding: 24px;
}
.p-cd-detail__product-image {
-o-object-fit: contain;
display: block;
width: 100%;
max-width: 400px;
height: auto;
max-height: 600px;
object-fit: contain;
}
.p-cd-detail__product-body-label {
margin: 0 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-cd-detail__product-subtitle {
margin: 0 0 16px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.8;
}
.p-cd-detail__product-name {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-cd-detail__product-name {
font-size: 1.625rem;
}
}
.p-cd-detail__product-origin {
margin: 0 0 16px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-cd-detail__product-price {
margin: 0 0 20px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.6;
}
.p-cd-detail__product-price-incl {
display: block;
margin-bottom: 4px;
color: #c9a96e;
font-size: 1.375rem;
font-weight: 500;
letter-spacing: 0.02em;
}
@media (max-width: 767px) {
.p-cd-detail__product-price-incl {
font-size: 1.25rem;
}
}
.p-cd-detail__product-price-excl {
color: #707070;
font-size: 0.875rem;
}
.p-cd-detail__product-description {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-cd-detail__order-note {
margin: 0 0 24px;
padding: 16px 20px 20px;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: transparent;
color: #968b70;
}
@media (max-width: 767px) {
.p-cd-detail__order-note {
padding: 14px 16px 18px;
}
}
.p-cd-detail__order-note-legend {
padding: 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.4;
}
.p-cd-detail__order-note-text {
margin: 0 0 12px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-cd-detail__order-note-list {
margin: 0;
padding: 0 0 0 1.25em;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
list-style: disc;
list-style-position: outside;
}
.p-cd-detail__order-note-list li {
margin-bottom: 6px;
padding-left: 0.25em;
}
.p-cd-detail__order-note-list li::marker {
color: #968b70;
}
.p-cd-detail__order-note-list li:last-child {
margin-bottom: 0;
}
.p-cd-detail__order-note-reassurance {
margin: 12px 0 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-cd-detail__order-note-body p {
margin: 0 0 12px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-cd-detail__order-note-body p:last-child {
margin-bottom: 0;
}
.p-cd-detail__order-note-body ul,
.p-cd-detail__order-note-body ol {
margin: 0 0 12px;
padding: 0 0 0 1.25em;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-cd-detail__order-note-body ul {
list-style: disc;
list-style-position: outside;
}
.p-cd-detail__order-note-body ul li {
margin-bottom: 6px;
padding-left: 0.25em;
}
.p-cd-detail__order-note-body ul li::marker {
color: #968b70;
}
.p-cd-detail__order-note-body ul li:last-child {
margin-bottom: 0;
}
.p-cd-detail__order-note-body > :last-child {
margin-bottom: 0;
}
.p-cd-detail__product-action {
gap: 12px;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
@media (max-width: 767px) {
.p-cd-detail__back-btn {
width: 100%;
}
}
.p-cd-detail__cart-btn.c-btn--primary {
gap: 8px;
display: inline-flex;
min-width: 200px;
padding: 12px 28px;
border-color: #1a1a1a;
background-color: #1a1a1a;
color: #fff;
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.p-cd-detail__cart-btn.c-btn--primary:hover {
transform: translateY(-2px);
border-color: #525252;
background-color: #525252;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}
.p-cd-detail__cart-btn.c-btn--primary:active {
transform: translateY(0);
border-color: #333;
background-color: #333;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
@media (max-width: 767px) {
.p-cd-detail__cart-btn.c-btn--primary {
width: 100%;
min-width: 0;
}
}
.p-cd-detail__cart-btn-icon {
font-size: 1.25rem;
}
.p-cd-detail__specs-wrap {
width: 100%;
max-width: 100%;
margin-top: 24px;
padding-bottom: 0;
}
.p-cd-detail__specs-heading {
width: 200px;
margin: 0 0 0;
padding: 14px 20px;
border-radius: 4px 4px 0 0;
background-color: #5d4307;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.4;
text-align: center;
}
.p-cd-detail__spec-list {
margin: 0;
padding: 0;
border: 1px solid #eaeaea;
border-radius: 0 0 4px 4px;
background-color: #fff;
}
.p-cd-detail__spec-row {
gap: 16px;
display: grid;
grid-template-columns: 160px 1fr;
padding: 16px 20px;
border-bottom: 1px solid #eaeaea;
}
@media (max-width: 767px) {
.p-cd-detail__spec-row {
gap: 4px;
grid-template-columns: 1fr;
padding: 14px 16px;
}
}
.p-cd-detail__spec-row:last-child {
border-bottom: none;
}
.p-cd-detail__spec-label {
margin: 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.6;
}
.p-cd-detail__spec-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.6;
}
.p-cd-detail__related {
padding: 64px 0 120px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-cd-detail__related {
padding: 48px 0 64px;
}
}
.p-cd-detail__related .p-cd__section-header {
margin-bottom: 40px;
}
.p-cd-detail__related-slider {
gap: 12px;
display: flex;
position: relative;
align-items: center;
width: 100%;
}
.p-cd-detail__related-slider:not(.is-slider) .p-cd-detail__related-nav {
display: none;
}
.p-cd-detail__related-slider.is-single .p-cd-detail__related-viewport {
overflow: visible;
}
.p-cd-detail__related-slider.is-single .p-cd-detail__related-track {
justify-content: center;
overflow-x: visible;
}
.p-cd-detail__related-slider.is-single .p-cd-detail__related-item {
flex: 0 0 calc((100% - 48px) / 3);
max-width: calc((100% - 48px) / 3);
}
@media (max-width: 991px) {
.p-cd-detail__related-slider.is-single .p-cd-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
max-width: calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-cd-detail__related-slider.is-single .p-cd-detail__related-item {
flex: 0 0 100%;
max-width: 280px;
}
}
.p-cd-detail__related-slider.is-pair .p-cd-detail__related-track {
justify-content: center;
}
.p-cd-detail__related-slider.is-pair .p-cd-detail__related-item {
flex: 0 0 calc((100% - 24px) / 3);
max-width: calc((100% - 24px) / 3);
}
@media (max-width: 991px) {
.p-cd-detail__related-slider.is-pair .p-cd-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
max-width: calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-cd-detail__related-slider.is-pair .p-cd-detail__related-item {
flex: 0 0 calc(100% - 32px);
max-width: 280px;
}
}
@media (min-width: 992px) {
.p-cd-detail__related-slider.is-triple .p-cd-detail__related-viewport {
overflow: visible;
}
.p-cd-detail__related-slider.is-triple .p-cd-detail__related-track {
overflow-x: visible;
}
.p-cd-detail__related-slider.is-triple .p-cd-detail__related-item {
flex: 0 0 calc((100% - 48px) / 3);
max-width: calc((100% - 48px) / 3);
}
}
.p-cd-detail__related-slider.is-slider .p-cd-detail__related-viewport {
overflow: hidden;
}
.p-cd-detail__related-slider.is-slider .p-cd-detail__related-track {
overflow-x: auto;
}
.p-cd-detail__related-slider.is-slider .p-cd-detail__related-item {
flex: 0 0 calc((100cqw - 48px) / 3);
width: calc((100cqw - 48px) / 3);
}
@media (max-width: 991px) {
.p-cd-detail__related-slider.is-slider .p-cd-detail__related-item {
flex: 0 0 calc((100cqw - 24px) / 2);
width: calc((100cqw - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-cd-detail__related-slider.is-slider .p-cd-detail__related-item {
flex: 0 0 calc(100cqw - 32px);
width: calc(100cqw - 32px);
}
}
.p-cd-detail__related-nav {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 0;
border: 1px solid #eaeaea;
border-radius: 50%;
background-color: #fff;
color: #968b70;
cursor: pointer;
transition: border-color 0.2s ease, color 0.2s ease;
}
.p-cd-detail__related-nav .material-icons {
font-size: 1.5rem;
}
.p-cd-detail__related-nav:hover:not(:disabled) {
border-color: #c9a96e;
color: #5d4307;
}
.p-cd-detail__related-nav:disabled {
cursor: default;
opacity: 0.35;
}
@media (max-width: 767px) {
.p-cd-detail__related-nav {
width: 32px;
height: 32px;
}
.p-cd-detail__related-nav .material-icons {
font-size: 1.25rem;
}
}
.p-cd-detail__related-viewport {
container-type: inline-size;
flex: 1;
min-width: 0;
overflow: hidden;
}
.p-cd-detail__related-track {
gap: 24px;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
display: flex;
margin: 0;
padding: 0;
overflow-x: auto;
list-style: none;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
}
.p-cd-detail__related-track::-webkit-scrollbar {
display: none;
}
@media (max-width: 767px) {
.p-cd-detail__related-track {
gap: 16px;
}
}
.p-cd-detail__related-item {
scroll-snap-align: start;
flex: 0 0 calc((100% - 48px) / 3);
min-width: 0;
}
@media (max-width: 991px) {
.p-cd-detail__related-item {
flex: 0 0 calc((100% - 24px) / 2);
}
}
@media (max-width: 767px) {
.p-cd-detail__related-item {
flex: 0 0 calc(100% - 32px);
}
}
.p-cd-detail__related-card {
height: 100%;
padding: 24px 20px;
border-radius: 4px;
background-color: #fff;
text-align: center;
}
.p-cd-detail__related-media {
display: flex;
justify-content: center;
margin-bottom: 16px;
}
.p-cd-detail__related-media-link {
display: flex;
align-items: center;
justify-content: center;
width: 180px;
height: 180px;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-cd-detail__related-media-link:hover {
opacity: 0.85;
}
.p-cd-detail__related-image {
-o-object-fit: contain;
display: block;
width: auto;
max-width: 100%;
height: auto;
max-height: 100%;
object-fit: contain;
}
.p-cd-detail__related-body-label {
margin: 0 0 6px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.06em;
line-height: 1.5;
}
.p-cd-detail__related-name {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-cd-detail__related-price {
margin: 0 0 12px;
font-family: "Noto Sans JP", sans-serif;
line-height: 1.5;
}
.p-cd-detail__related-price-incl {
display: block;
margin-bottom: 2px;
color: #5d4307;
font-size: 0.9375rem;
font-weight: 500;
}
.p-cd-detail__related-price-excl {
color: #707070;
font-size: 0.75rem;
}
.p-cd-detail__related-link {
gap: 2px;
display: inline-flex;
align-items: center;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
text-decoration: none;
transition: color 0.2s ease;
}
.p-cd-detail__related-link .material-icons {
font-size: 1.125rem;
}
.p-cd-detail__related-link:hover {
color: #c9a96e;
}
.p-cd-detail__related-current {
display: inline-block;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
}
.p-cd-detail__related-item.is-current .p-cd-detail__related-card {
border: 1px solid rgba(201, 169, 110, 0.4);
}
.p-cd-artist .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-cd-artist .l-gnav {
display: none;
}
}
body.is-menu-open .p-cd-artist .l-gnav {
visibility: hidden;
}
.p-cd-artist__inner {
padding: 48px 0 64px;
}
@media (max-width: 767px) {
.p-cd-artist__inner {
padding: 32px 0 48px;
}
}
.p-cd-artist__header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-cd-artist__header {
margin-bottom: 32px;
}
}
.p-cd-artist__title {
margin: 0 0 8px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.06em;
line-height: 1.4;
}
.p-cd-artist__reading {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
letter-spacing: 0.08em;
line-height: 1.6;
}
.p-cd-artist__blocks {
gap: 40px;
display: flex;
flex-direction: column;
max-width: 880px;
margin: 0 auto 48px;
}
@media (max-width: 767px) {
.p-cd-artist__blocks {
gap: 32px;
margin-bottom: 40px;
}
}
.p-cd-artist__block {
gap: 32px;
display: grid;
grid-template-columns: 200px 1fr;
align-items: start;
}
.p-cd-artist__block.is-alt {
grid-template-columns: 1fr 200px;
}
.p-cd-artist__block.is-alt .p-cd-artist__media {
order: 2;
}
.p-cd-artist__block.is-alt .p-cd-artist__text {
order: 1;
}
@media (max-width: 767px) {
.p-cd-artist__block {
gap: 20px;
grid-template-columns: 1fr;
}
.p-cd-artist__block.is-alt {
grid-template-columns: 1fr;
}
.p-cd-artist__block.is-alt .p-cd-artist__media,
.p-cd-artist__block.is-alt .p-cd-artist__text {
order: unset;
}
}
.p-cd-artist__media {
margin: 0;
line-height: 0;
}
.p-cd-artist__image {
display: block;
width: 100%;
max-width: 200px;
height: auto;
margin: 0 auto;
border-radius: 4px;
}
@media (max-width: 767px) {
.p-cd-artist__image {
max-width: 180px;
}
}
.p-cd-artist__text {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-cd-artist__footer {
gap: 24px;
display: flex;
flex-direction: column;
align-items: center;
max-width: 880px;
margin: 0 auto;
}
.p-cd-artist__external {
margin: 0;
text-align: center;
}
.p-cd-artist__external-link {
text-underline-offset: 2px;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-cd-artist__external-link:hover {
color: #c9a96e;
}
.p-cd-artist__back-btn {
min-width: 240px;
}
.p-company {
--gnav-height: 56px;
--anchor-offset: 120px;
background-color: #fff;
}
.p-company .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-company .l-gnav {
display: none;
}
}
@media (max-width: 767px) {
.p-company {
--anchor-offset: 88px;
}
}
body.is-menu-open .p-company .l-gnav {
visibility: hidden;
}
.p-company__inner {
max-width: 980px;
}
.p-company__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-company__section-header {
margin-bottom: 32px;
}
}
.p-company__section-header--compact {
margin-bottom: 20px;
}
.p-company__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-company__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-company__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-company__section-title {
font-size: 1.5rem;
}
}
.p-company #map,
.p-company #hanbai {
scroll-margin-top: var(--anchor-offset);
}
.p-company #map:target::before,
.p-company #hanbai:target::before {
display: block;
visibility: hidden;
height: var(--anchor-offset);
margin-top: calc(-1 * var(--anchor-offset));
content: "";
pointer-events: none;
}
.p-company__intro {
padding: 56px 0 64px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-company__intro {
padding: 40px 0 48px;
}
}
.p-company__dl {
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 12px;
background-color: #faf8f6;
}
.p-company__row {
gap: 18px;
display: grid;
grid-template-columns: 220px minmax(0, 1fr);
padding: 18px 20px;
}
@media (max-width: 991px) {
.p-company__row {
gap: 8px;
grid-template-columns: 1fr;
}
}
.p-company__row + .p-company__row {
border-top: 1px solid #eaeaea;
}
.p-company__dt {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.6;
}
.p-company__dd {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
white-space: normal;
}
.p-company__dd p {
margin: 0;
}
.p-company__dd p + p {
margin-top: 0.45em;
}
.p-company__dd a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-company__dd a:hover {
color: #c9a96e;
}
.p-company__link {
text-underline-offset: 2px;
display: inline-block;
margin-left: 10px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-company__link:hover {
color: #c9a96e;
}
.p-company__note {
margin: 16px 0 0;
color: #707070;
font-size: 0.95rem;
line-height: 1.9;
text-align: center;
white-space: pre-line;
}
.p-company__note a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-company__note a:hover {
color: #c9a96e;
}
.p-company__map {
padding: 0 0 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-company__map {
padding: 0 0 64px;
}
}
.p-company__access {
margin: -18px 0 28px;
padding-left: 1.2em;
list-style: disc;
}
@media (max-width: 767px) {
.p-company__access {
margin: -12px 0 22px;
}
}
.p-company__access-item {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
white-space: pre-line;
}
.p-company__access-item a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-company__access-item a:hover {
color: #c9a96e;
}
.p-company__access-item + .p-company__access-item {
margin-top: 6px;
}
.p-company__map-embed {
position: relative;
width: 100%;
height: clamp(360px, 50vh, 600px);
overflow: hidden;
border-radius: 12px;
background-color: #faf8f6;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}
.p-company__map-embed--full {
width: 100vw;
margin-left: calc(50% - 50vw);
border-radius: 0;
box-shadow: none;
}
.p-company__map-embed--full iframe {
inset: 0;
position: absolute;
width: 100%;
height: 100%;
}
.p-company__map-iframe {
inset: 0;
position: absolute;
width: 100%;
height: 100%;
}
.p-law {
--gnav-height: 56px;
background-color: #fff;
}
.p-law .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-law .l-gnav {
display: none;
}
}
body.is-menu-open .p-law .l-gnav {
visibility: hidden;
}
.p-law__inner {
max-width: 980px;
}
.p-law__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-law__section-header {
margin-bottom: 32px;
}
}
.p-law__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-law__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-law__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-law__section-title {
font-size: 1.5rem;
}
}
.p-law__intro {
padding: 56px 0 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-law__intro {
padding: 40px 0 64px;
}
}
.p-law__dl {
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 12px;
background-color: #faf8f6;
}
.p-law__row {
gap: 18px;
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
padding: 18px 20px;
}
@media (max-width: 991px) {
.p-law__row {
gap: 8px;
grid-template-columns: 1fr;
}
}
.p-law__row + .p-law__row {
border-top: 1px solid #eaeaea;
}
.p-law__dt {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.6;
}
.p-law__dd {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-law__link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-law__link:hover {
color: #c9a96e;
}
.p-law__list {
margin: 12px 0 0;
padding-left: 1.2em;
list-style: disc;
}
.p-law__list-item {
margin: 0;
line-height: 1.9;
}
.p-law__note {
margin: 12px 0 0;
color: #707070;
font-size: 0.9rem;
line-height: 1.9;
}
.p-law__company-info {
margin-top: 0;
}
.p-law__company-info .p-company__dl {
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 12px;
background-color: #faf8f6;
}
.p-law__company-info .p-company__row {
gap: 18px;
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
padding: 18px 20px;
}
@media (max-width: 991px) {
.p-law__company-info .p-company__row {
gap: 8px;
grid-template-columns: 1fr;
}
}
.p-law__company-info .p-company__row + .p-company__row {
border-top: 1px solid #eaeaea;
}
.p-law__company-info .p-company__dt {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.6;
}
.p-law__company-info .p-company__dd {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
white-space: normal;
}
.p-law__company-info .p-company__dd p {
margin: 0;
}
.p-law__company-info .p-company__dd p + p {
margin-top: 0.45em;
}
.p-law__company-info .p-company__dd ul,
.p-law__company-info .p-company__dd ol {
margin: 0.45em 0 0;
padding-left: 1.2em;
}
.p-law__company-info .p-company__dd li + li {
margin-top: 0.2em;
}
.p-law__company-info .p-company__dd > :first-child {
margin-top: 0;
}
.p-law__company-info .p-company__dd > :last-child {
margin-bottom: 0;
}
.p-law__company-info .p-company__dd a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-law__company-info .p-company__dd a:hover {
color: #c9a96e;
}
.p-privacy {
--gnav-height: 56px;
background-color: #fff;
}
.p-privacy .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-privacy .l-gnav {
display: none;
}
}
body.is-menu-open .p-privacy .l-gnav {
visibility: hidden;
}
.p-privacy__inner {
max-width: 980px;
}
.p-privacy__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-privacy__section-header {
margin-bottom: 32px;
}
}
.p-privacy__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-privacy__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-privacy__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-privacy__section-title {
font-size: 1.5rem;
}
}
.p-privacy__intro {
padding: 56px 0 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-privacy__intro {
padding: 40px 0 64px;
}
}
.p-privacy__lead {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-privacy__text {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-privacy__link {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-privacy__link:hover {
color: #c9a96e;
}
.p-privacy__list {
margin: 22px 0 0;
padding-left: 1.4em;
list-style: decimal;
}
.p-privacy__item + .p-privacy__item {
margin-top: 18px;
}
.p-privacy__item-title {
margin: 0 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.6;
}
.p-privacy__bullets {
margin: 12px 0 0;
padding-left: 1.2em;
list-style: disc;
}
.p-privacy__bullet {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-privacy__bullet + .p-privacy__bullet {
margin-top: 6px;
}
.p-privacy__contact {
margin: 12px 0 0;
padding: 18px 18px 16px;
border: 1px solid #eaeaea;
border-radius: 10px;
background-color: #faf8f6;
}
.p-privacy__contact-row {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-privacy__contact-row + .p-privacy__contact-row {
margin-top: 6px;
}
.p-privacy__enact {
margin: 12px 0 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-inquiry {
--gnav-height: 56px;
background-color: #faf8f6;
}
.p-inquiry .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-inquiry .l-gnav {
display: none;
}
}
body.is-menu-open .p-inquiry .l-gnav {
visibility: hidden;
}
.p-inquiry .p-inquiry__lead {
padding: 56px 0 28px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-inquiry .p-inquiry__lead {
padding: 40px 0 22px;
}
}
.p-inquiry .p-inquiry__form {
padding: 28px 0 88px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-inquiry .p-inquiry__form {
padding: 22px 0 64px;
}
}
.p-inquiry .p-law__dl {
background-color: #fff;
}
.p-inquiry .p-inquiry__badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
height: 24px;
margin-left: 10px;
padding: 0 10px;
border-radius: 6px;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.06em;
line-height: 1;
vertical-align: middle;
}
.p-inquiry .p-inquiry__badge--required {
background-color: #e64b4b;
color: #fff;
}
.p-inquiry .p-inquiry__badge--optional {
background-color: #d8d3cc;
color: #fff;
}
.p-inquiry .p-law__dd > div + div,
.p-inquiry .p-law__dd > label + label,
.p-inquiry .p-law__dd > p + input,
.p-inquiry .p-law__dd > input + input,
.p-inquiry .p-law__dd > input + p {
margin-top: 12px;
}
.p-inquiry .p-law__dd label {
display: block;
}
.p-inquiry .p-inquiry__checkline {
gap: 10px;
display: inline-flex;
align-items: center;
}
.p-inquiry .p-inquiry__checkline span {
margin: 0;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
}
.p-inquiry .p-law__dd label:not(.p-inquiry__checkline) > span {
display: inline-block;
margin: 0 0 6px;
color: #968b70;
font-size: 0.9rem;
line-height: 1.4;
}
.p-inquiry .p-inquiry__input,
.p-inquiry .p-inquiry__select,
.p-inquiry .p-inquiry__textarea {
width: 100%;
max-width: 720px;
padding: 12px 14px;
border: 1px solid #eaeaea;
border-radius: 10px;
background-color: #fff;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.p-inquiry .p-inquiry__input:focus,
.p-inquiry .p-inquiry__select:focus,
.p-inquiry .p-inquiry__textarea:focus {
border-color: rgba(229, 126, 37, 0.7);
outline: none;
box-shadow: 0 0 0 3px rgba(229, 126, 37, 0.18);
}
.p-inquiry .p-inquiry__input:disabled,
.p-inquiry .p-inquiry__select:disabled,
.p-inquiry .p-inquiry__textarea:disabled {
background-color: #faf8f6;
color: #707070;
}
.p-inquiry .p-inquiry__textarea {
max-width: 720px;
resize: vertical;
}
.p-inquiry .p-inquiry__address {
--subfield-label-width: 124px;
gap: 14px;
display: flex;
flex-direction: column;
}
@media (max-width: 767px) {
.p-inquiry .p-inquiry__address {
--subfield-label-width: 92px;
}
}
.p-inquiry .p-inquiry__subfield {
gap: 12px;
display: grid;
grid-template-columns: var(--subfield-label-width) minmax(0, 1fr);
align-items: center;
}
.p-inquiry .p-inquiry__subfield-label {
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9rem;
line-height: 1.4;
}
.p-inquiry .p-inquiry__subfield-control {
flex: 1;
max-width: 720px;
}
.p-inquiry .p-inquiry__subfield--postal {
align-items: center;
}
.p-inquiry .p-inquiry__input--postal,
.p-inquiry .fplant-postal-code-input.p-inquiry__input--postal {
max-width: 180px;
}
.p-inquiry .fplant-field-postal-code {
width: auto;
max-width: none;
padding: 0;
border: 0;
border-radius: 0;
background-color: transparent;
box-shadow: none;
}
.p-inquiry .fplant-postal-code-single,
.p-inquiry .fplant-postal-code-split {
width: auto;
}
.p-inquiry .fplant-postal-code-input {
width: 100%;
max-width: 180px;
}
.p-inquiry .fplant-postal-code-part1,
.p-inquiry .fplant-postal-code-part2 {
max-width: 88px;
}
.p-inquiry .fplant-postal-code-separator {
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1;
}
.p-inquiry .p-inquiry__subfield--link {
align-items: start;
}
.p-inquiry .p-inquiry__select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding-right: 36px;
background-image: linear-gradient(45deg, transparent 50%, #968b70 50%), linear-gradient(135deg, #968b70 50%, transparent 50%);
background-position: calc(100% - 18px) calc(50% - 3px), calc(100% - 12px) calc(50% - 3px);
background-repeat: no-repeat;
background-size: 6px 6px, 6px 6px;
}
.p-inquiry .p-inquiry__select--prefecture {
max-width: 180px;
}
.p-inquiry .p-inquiry__file {
width: 100%;
max-width: 560px;
font-family: "Noto Sans JP", sans-serif;
}
.p-inquiry .p-inquiry__file-ui {
gap: 14px;
display: flex;
position: relative;
align-items: center;
max-width: 760px;
}
.p-inquiry .p-inquiry__file-input {
clip: rect(0, 0, 0, 0);
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
border: 0;
white-space: nowrap;
pointer-events: none;
}
.p-inquiry .p-inquiry__file-button {
display: inline-flex;
align-items: center;
justify-content: center;
height: 44px;
padding: 0 18px;
border: 1px solid #eaeaea;
border-radius: 10px;
background-color: #f1eeea;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9rem;
font-weight: 500;
white-space: nowrap;
cursor: pointer;
transition: background-color 0.2s ease, border-color 0.2s ease;
}
.p-inquiry .p-inquiry__file-button:hover {
background-color: #ede8e2;
}
.p-inquiry .p-inquiry__file-name {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
}
.p-inquiry .p-inquiry__file-note {
margin: 8px 0 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.85rem;
line-height: 1.6;
}
.p-inquiry .p-inquiry__checkbox {
accent-color: #e57e25;
width: 18px;
height: 18px;
margin-right: 8px;
vertical-align: middle;
}
.p-inquiry .p-inquiry__footer {
padding: 18px 20px;
border-top: 1px solid #eaeaea;
background-color: #fff;
}
.p-inquiry .p-inquiry__actions {
gap: 12px;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 14px;
}
.p-inquiry #inquiry-submit:disabled {
cursor: not-allowed;
opacity: 0.55;
}
.p-inquiry .fplant-form.fplant-loading .fplant-submit-button,
.p-inquiry .fplant-form.fplant-loading #inquiry-submit {
cursor: wait;
opacity: 0.75;
pointer-events: none;
}
.p-inquiry .fplant-confirmation.is-loading .fplant-confirm-submit-button {
cursor: wait;
opacity: 0.75;
pointer-events: none;
}
.p-inquiry .fplant-confirmation.is-loading .fplant-back-button {
cursor: not-allowed;
opacity: 0.55;
pointer-events: none;
}
.p-inquiry .c-btn.is-loading {
cursor: wait;
opacity: 0.75;
pointer-events: none;
}
.p-inquiry .fplant-custom-success-page {
margin-top: 0;
padding: 0;
border: 0;
background-color: transparent;
}
.p-inquiry .p-inquiry__complete {
padding: 8px 0 0;
}
.p-inquiry .p-inquiry__complete-header {
margin-bottom: 20px;
text-align: left;
}
.p-inquiry .p-inquiry__complete-message {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-inquiry .p-inquiry__complete-message p {
margin: 0 0 12px;
}
.p-inquiry .p-inquiry__complete-message p:last-child {
margin-bottom: 0;
}
.p-inquiry .p-inquiry__complete-message ul {
margin: 0 0 12px;
padding-left: 1.4em;
list-style: disc;
}
.p-inquiry .p-inquiry__complete-message li + li {
margin-top: 6px;
}
.p-inquiry .p-inquiry__actions--complete {
justify-content: center;
}
.p-inquiry .fplant-form-wrapper .fplant-field-postal-code,
.p-inquiry .fplant-form-wrapper .fplant-field-prefecture,
.p-inquiry .fplant-form-wrapper .fplant-field-text,
.p-inquiry .fplant-form-wrapper .fplant-field-email,
.p-inquiry .fplant-form-wrapper .fplant-field-tel,
.p-inquiry .fplant-form-wrapper .fplant-field-textarea,
.p-inquiry .fplant-form-wrapper .fplant-field-select,
.p-inquiry .fplant-form-wrapper .fplant-field-file {
width: 100%;
max-width: none;
}
.p-inquiry .fplant-form-wrapper .fplant-field-postal-code {
width: auto;
max-width: none;
}
.p-inquiry .fplant-form-wrapper .fplant-postal-code-single,
.p-inquiry .fplant-form-wrapper .fplant-postal-code-split {
width: auto;
}
.p-inquiry .fplant-form-wrapper .p-inquiry__checkline {
gap: 8px;
display: flex;
align-items: flex-start;
margin-bottom: 10px;
}
.p-inquiry .fplant-form-wrapper .p-inquiry__checkline .fplant-field-checkbox {
margin: 0;
}
.p-inquiry .fplant-form-wrapper .p-inquiry__checkline .fplant-checkbox-label {
gap: 8px;
display: inline-flex;
align-items: center;
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
}
.p-inquiry .fplant-form-wrapper .p-inquiry__checkline--privacy .fplant-checkbox-label span:empty {
display: none;
}
.p-inquiry .fplant-form-wrapper .fplant-field-error {
margin-top: 6px;
color: #b42318;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.85rem;
line-height: 1.5;
}
.p-inquiry .fplant-form-wrapper .fplant-field-error:not(:empty) {
display: block !important;
}
.p-inquiry .fplant-form-wrapper .fplant-errors {
margin-bottom: 16px;
padding: 14px 16px;
border: 1px solid #f2c6c6;
border-radius: 10px;
background-color: #fff5f5;
color: #8a1f1f;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9rem;
line-height: 1.6;
}
.p-inquiry .fplant-form-wrapper .fplant-errors:empty {
display: none;
margin: 0;
padding: 0;
border: 0;
}
.p-inquiry .fplant-form-wrapper .fplant-success {
margin-bottom: 16px;
padding: 14px 16px;
border: 1px solid #c8e6d0;
border-radius: 10px;
background-color: #f3faf5;
color: #1f5d34;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.7;
}
.p-inquiry .fplant-form-wrapper .fplant-success:empty {
display: none;
margin: 0;
padding: 0;
border: 0;
}
.p-inquiry .fplant-form-wrapper .fplant-messages:not(:has(.fplant-errors:not(:empty), .fplant-success:not(:empty))) {
display: none;
}
.p-inquiry .fplant-confirmation {
margin-top: 0;
padding: 0;
border: 0;
border-radius: 0;
background-color: transparent;
}
.p-inquiry .fplant-confirmation .fplant-confirmation-header {
margin-bottom: 24px;
text-align: left;
}
.p-inquiry .fplant-confirmation .p-inquiry__confirm-lead {
margin-top: 10px;
}
.p-inquiry .fplant-confirmation .fplant-confirmation-body {
margin-bottom: 24px;
}
.p-inquiry .fplant-confirmation .p-law__dl--confirmation {
margin-top: 0;
}
.p-inquiry .fplant-confirmation .p-law__row {
gap: 18px;
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
align-items: start;
padding: 18px 20px;
}
@media (max-width: 991px) {
.p-inquiry .fplant-confirmation .p-law__row {
gap: 8px;
grid-template-columns: 1fr;
}
}
.p-inquiry .fplant-confirmation .p-law__dt,
.p-inquiry .fplant-confirmation .p-law__dd {
min-width: 0;
margin: 0;
}
.p-inquiry .fplant-confirmation .p-inquiry__confirm-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.8;
word-break: break-word;
}
.p-inquiry .fplant-confirmation .p-inquiry__actions--confirmation {
justify-content: center;
margin-top: 0;
padding-top: 4px;
}
.p-inquiry .fplant-confirmation .fplant-confirmation-table {
width: 100%;
border-collapse: collapse;
}
.p-inquiry .fplant-confirmation .fplant-confirmation-table th,
.p-inquiry .fplant-confirmation .fplant-confirmation-table td {
padding: 12px 14px;
border-bottom: 1px solid #eaeaea;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
text-align: left;
vertical-align: top;
}
.p-inquiry .fplant-confirmation .fplant-confirmation-table th {
width: 28%;
background-color: #faf8f5;
color: #968b70;
font-weight: 600;
}
.p-inquiry .fplant-confirmation .fplant-confirmation-footer {
margin-top: 0;
}
.p-cart {
--gnav-height: 56px;
background-color: #faf8f6;
}
.p-cart .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-cart .l-gnav {
display: none;
}
}
.p-cart__lead {
padding: 56px 0 28px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-cart__lead {
padding: 40px 0 22px;
}
}
.p-cart__items-section {
padding: 28px 0;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-cart__items-section {
padding: 22px 0;
}
}
.p-cart__list-wrap[hidden] {
display: none;
}
.p-cart__list-heading {
margin: 0 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 600;
}
.p-cart__list {
gap: 12px;
display: flex;
flex-direction: column;
margin: 0;
padding: 0;
list-style: none;
}
.p-cart__item {
gap: 16px 20px;
display: grid;
grid-template-columns: 96px minmax(0, 1fr) auto;
align-items: center;
padding: 16px 20px;
border: 1px solid #eaeaea;
border-radius: 12px;
background-color: #fff;
}
.p-cart__item-media {
flex-shrink: 0;
width: 96px;
height: 96px;
overflow: hidden;
border-radius: 8px;
background-color: #faf8f6;
}
.p-cart__item-image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.p-cart__item-image-placeholder {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
color: #968b70;
}
.p-cart__item-image-placeholder .material-icons {
font-size: 32px;
}
.p-cart__item-category {
margin: 0 0 4px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1.4;
}
.p-cart__item-link, .p-cart__item-name {
display: block;
color: #707070;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 600;
line-height: 1.5;
text-decoration: none;
}
.p-cart__item-link:hover {
text-decoration: underline;
}
.p-cart__item-subtitle {
margin: 4px 0 0;
color: #968b70;
font-size: 0.875rem;
line-height: 1.5;
}
.p-cart__item-price {
margin: 6px 0 0;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.5;
}
.p-cart__item-controls {
gap: 8px;
display: flex;
flex-direction: column;
align-items: flex-end;
}
.p-cart__qty-label {
gap: 6px;
display: flex;
align-items: center;
}
.p-cart__qty-text {
color: #968b70;
font-size: 0.875rem;
white-space: nowrap;
}
.p-cart__qty-input {
width: 64px;
padding: 8px 10px;
border: 1px solid #eaeaea;
border-radius: 8px;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
text-align: center;
}
.p-cart__qty-input:focus {
border-color: rgba(229, 126, 37, 0.7);
outline: none;
box-shadow: 0 0 0 3px rgba(229, 126, 37, 0.18);
}
.p-cart__remove-btn {
padding: 4px 0;
border: none;
background: transparent;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
text-decoration: underline;
cursor: pointer;
}
.p-cart__remove-btn:hover {
color: #5d4307;
}
.p-cart__subtotal {
margin: 16px 0 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.7;
}
.p-cart__empty {
padding: 32px 0;
text-align: center;
}
.p-cart__empty[hidden] {
display: none;
}
.p-cart__empty-text {
margin-bottom: 16px;
}
.p-cart__empty-links {
gap: 8px 24px;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0;
padding: 0;
list-style: none;
}
.p-cart__form {
padding: 28px 0 88px;
background-color: #faf8f6;
}
.p-cart__form[hidden] {
display: none;
}
@media (max-width: 767px) {
.p-cart__form {
padding: 22px 0 64px;
}
}
.p-cart[data-cart-quote-complete=true] .p-cart__lead,
.p-cart[data-cart-quote-complete=true] .p-cart__items-section, .p-cart[data-cart-quote-confirm=true] .p-cart__lead,
.p-cart[data-cart-quote-confirm=true] .p-cart__items-section {
display: none;
}
.p-cart[data-cart-quote-complete=true] .p-cart__form, .p-cart[data-cart-quote-confirm=true] .p-cart__form {
display: block;
}
.p-cart .fplant-form.fplant-loading .fplant-submit-button,
.p-cart .fplant-form.fplant-loading #quote-submit {
cursor: wait;
opacity: 0.75;
pointer-events: none;
}
.p-cart .fplant-confirmation.is-loading .fplant-confirm-submit-button {
cursor: wait;
opacity: 0.75;
pointer-events: none;
}
.p-cart .fplant-confirmation.is-loading .fplant-back-button {
cursor: not-allowed;
opacity: 0.55;
pointer-events: none;
}
.p-cart .c-btn.is-loading {
cursor: wait;
opacity: 0.75;
pointer-events: none;
}
.p-cart .fplant-form-wrapper .fplant-field-postal-code,
.p-cart .fplant-form-wrapper .fplant-field-prefecture,
.p-cart .fplant-form-wrapper .fplant-field-text,
.p-cart .fplant-form-wrapper .fplant-field-email,
.p-cart .fplant-form-wrapper .fplant-field-tel,
.p-cart .fplant-form-wrapper .fplant-field-textarea,
.p-cart .fplant-form-wrapper .fplant-field-select,
.p-cart .fplant-form-wrapper .fplant-field-file {
width: 100%;
max-width: none;
}
.p-cart .fplant-form-wrapper .fplant-field-postal-code {
width: auto;
max-width: none;
}
.p-cart .fplant-form-wrapper .fplant-postal-code-single,
.p-cart .fplant-form-wrapper .fplant-postal-code-split {
width: auto;
}
.p-cart .fplant-form-wrapper .p-inquiry__checkline {
gap: 8px;
display: flex;
align-items: flex-start;
margin-bottom: 10px;
}
.p-cart .fplant-form-wrapper .p-inquiry__checkline .fplant-field-checkbox {
margin: 0;
}
.p-cart .fplant-form-wrapper .p-inquiry__checkline .fplant-checkbox-label {
gap: 8px;
display: inline-flex;
align-items: center;
margin: 0;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
}
.p-cart .fplant-form-wrapper .p-inquiry__checkline--privacy .fplant-checkbox-label span:empty {
display: none;
}
.p-cart .fplant-form-wrapper .fplant-field-error {
margin-top: 8px;
color: #c0392b;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.5;
}
.p-cart .fplant-form-wrapper .fplant-field-error:not(:empty) {
display: block;
}
.p-cart .fplant-form-wrapper .fplant-errors {
margin: 0 0 20px;
padding: 14px 16px;
border: 1px solid rgba(192, 57, 43, 0.35);
border-radius: 10px;
background-color: #fff5f5;
color: #8f2d2d;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9rem;
line-height: 1.7;
}
.p-cart .fplant-form-wrapper .fplant-errors:empty {
display: none;
margin: 0;
padding: 0;
border: 0;
}
.p-cart .fplant-form-wrapper .fplant-success {
margin: 0 0 20px;
padding: 14px 16px;
border: 1px solid rgba(229, 126, 37, 0.35);
border-radius: 10px;
background-color: #f7fbf8;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9rem;
line-height: 1.7;
}
.p-cart .fplant-form-wrapper .fplant-success:empty {
display: none;
margin: 0;
padding: 0;
border: 0;
}
.p-cart .fplant-form-wrapper .fplant-messages:not(:has(.fplant-errors:not(:empty), .fplant-success:not(:empty))) {
display: none;
}
.p-cart .fplant-confirmation {
margin-top: 0;
padding: 0;
border: 0;
border-radius: 0;
background-color: transparent;
}
.p-cart .fplant-confirmation .fplant-confirmation-header {
margin-bottom: 24px;
text-align: left;
}
.p-cart .fplant-confirmation .p-inquiry__confirm-lead {
margin-top: 10px;
}
.p-cart .fplant-confirmation .fplant-confirmation-body {
margin-bottom: 24px;
}
.p-cart .fplant-confirmation .p-law__dl--confirmation {
margin-top: 0;
}
.p-cart .fplant-confirmation .p-law__row {
gap: 18px;
display: grid;
grid-template-columns: 240px minmax(0, 1fr);
align-items: start;
padding: 18px 20px;
}
@media (max-width: 991px) {
.p-cart .fplant-confirmation .p-law__row {
gap: 8px;
grid-template-columns: 1fr;
}
}
.p-cart .fplant-confirmation .p-law__dt,
.p-cart .fplant-confirmation .p-law__dd {
min-width: 0;
margin: 0;
}
.p-cart .fplant-confirmation .p-inquiry__confirm-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.8;
word-break: break-word;
}
.p-cart .fplant-confirmation .p-inquiry__actions--confirmation {
justify-content: center;
margin-top: 0;
padding-top: 4px;
}
.p-cart .fplant-confirmation .fplant-confirmation-footer {
margin-top: 0;
}
.p-cart .fplant-custom-success-page {
margin-top: 0;
padding: 0;
border: 0;
background-color: transparent;
}
.p-cart .p-inquiry__complete {
padding: 8px 0 0;
}
.p-cart .p-inquiry__complete-header {
margin-bottom: 20px;
text-align: left;
}
.p-cart .p-inquiry__complete-message {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-cart .p-inquiry__complete-message p {
margin: 0 0 12px;
}
.p-cart .p-inquiry__complete-message p:last-child {
margin-bottom: 0;
}
.p-cart .p-inquiry__complete-message ul {
margin: 0 0 12px;
padding-left: 1.4em;
list-style: disc;
}
.p-cart .p-inquiry__complete-message li + li {
margin-top: 6px;
}
.p-cart .p-inquiry__actions--complete {
justify-content: center;
}
.p-cart .p-law__dl {
background-color: #fff;
}
.p-cart .p-inquiry__badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 44px;
height: 24px;
margin-left: 10px;
padding: 0 10px;
border-radius: 6px;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.06em;
line-height: 1;
vertical-align: middle;
}
.p-cart .p-inquiry__badge--required {
background-color: #e64b4b;
color: #fff;
}
.p-cart .p-inquiry__badge--optional {
background-color: #d8d3cc;
color: #fff;
}
.p-cart .p-law__dd > p + input,
.p-cart .p-law__dd > input + input {
margin-top: 12px;
}
.p-cart .p-inquiry__checkline {
gap: 10px;
display: inline-flex;
align-items: center;
}
.p-cart .p-inquiry__checkline span {
margin: 0;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
}
.p-cart .p-inquiry__input,
.p-cart .p-inquiry__select,
.p-cart .p-inquiry__textarea {
width: 100%;
max-width: 720px;
padding: 12px 14px;
border: 1px solid #eaeaea;
border-radius: 10px;
background-color: #fff;
color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.6;
transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.p-cart .p-inquiry__input:focus,
.p-cart .p-inquiry__select:focus,
.p-cart .p-inquiry__textarea:focus {
border-color: rgba(229, 126, 37, 0.7);
outline: none;
box-shadow: 0 0 0 3px rgba(229, 126, 37, 0.18);
}
.p-cart .p-inquiry__textarea {
resize: vertical;
}
.p-cart .p-inquiry__address {
--subfield-label-width: 124px;
gap: 14px;
display: flex;
flex-direction: column;
}
@media (max-width: 767px) {
.p-cart .p-inquiry__address {
--subfield-label-width: 92px;
}
}
.p-cart .p-inquiry__subfield {
gap: 12px;
display: grid;
grid-template-columns: var(--subfield-label-width) minmax(0, 1fr);
align-items: center;
}
.p-cart .p-inquiry__subfield-label {
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9rem;
line-height: 1.4;
}
.p-cart .p-inquiry__subfield-control {
max-width: 720px;
}
.p-cart .p-inquiry__input--postal {
max-width: 180px;
}
.p-cart .p-inquiry__select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding-right: 36px;
background-image: linear-gradient(45deg, transparent 50%, #968b70 50%), linear-gradient(135deg, #968b70 50%, transparent 50%);
background-position: calc(100% - 18px) calc(50% - 3px), calc(100% - 12px) calc(50% - 3px);
background-repeat: no-repeat;
background-size: 6px 6px, 6px 6px;
}
.p-cart .p-inquiry__select--prefecture {
max-width: 180px;
}
.p-cart .p-inquiry__checkbox {
accent-color: #e57e25;
width: 18px;
height: 18px;
}
.p-cart .p-inquiry__footer {
padding: 18px 20px;
border-top: 1px solid #eaeaea;
background-color: #fff;
}
.p-cart .p-inquiry__actions {
gap: 12px;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 14px;
}
.p-cart #quote-submit:disabled {
cursor: not-allowed;
opacity: 0.55;
}
body.is-menu-open .p-cart .l-gnav {
visibility: hidden;
}
@media (max-width: 767px) {
.p-cart__item {
grid-template-columns: 72px minmax(0, 1fr);
grid-template-rows: auto auto;
}
.p-cart__item-media {
width: 72px;
height: 72px;
}
.p-cart__item-controls {
grid-column: 1/-1;
flex-direction: row;
align-items: center;
justify-content: flex-end;
}
}
.p-sitemap {
--gnav-height: 56px;
background-color: #fff;
}
.p-sitemap .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-sitemap .l-gnav {
display: none;
}
}
body.is-menu-open .p-sitemap .l-gnav {
visibility: hidden;
}
.p-sitemap__inner {
max-width: 1080px;
}
.p-sitemap__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-sitemap__section-header {
margin-bottom: 32px;
}
}
.p-sitemap__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-sitemap__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-sitemap__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-sitemap__section-title {
font-size: 1.5rem;
}
}
.p-sitemap__intro {
padding: 56px 0 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-sitemap__intro {
padding: 40px 0 64px;
}
}
.p-sitemap__grid {
gap: 22px;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 991px) {
.p-sitemap__grid {
grid-template-columns: 1fr;
}
}
.p-sitemap__col {
gap: 22px;
display: flex;
flex-direction: column;
min-width: 0;
}
.p-sitemap__group {
padding: 22px 22px 20px;
border: 1px solid #eaeaea;
border-radius: 12px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-sitemap__group {
padding: 18px 16px 16px;
}
}
.p-sitemap__group-title {
margin: 0 0 14px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.6;
}
.p-sitemap__subgroup + .p-sitemap__subgroup {
margin-top: 18px;
padding-top: 18px;
border-top: 1px solid #eaeaea;
}
.p-sitemap__subgroup-title {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.05rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.6;
}
.p-sitemap__list {
margin: 0;
padding-left: 1.2em;
list-style: disc;
}
.p-sitemap__list--nested {
margin-top: 6px;
}
.p-sitemap__list--child {
margin-top: 10px;
padding-left: 1.3em;
list-style: circle;
}
.p-sitemap__item {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.95rem;
line-height: 1.9;
}
.p-sitemap__item + .p-sitemap__item {
margin-top: 6px;
}
.p-sitemap__link {
text-underline-offset: 4px;
text-decoration-thickness: 1px;
color: #5d4307;
text-decoration: underline;
}
.p-sitemap__link:hover {
text-decoration-thickness: 2px;
}
.p-repair {
--gnav-height: 56px;
background-color: #fff;
}
.p-repair .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-repair .l-gnav {
display: none;
}
}
body.is-menu-open .p-repair .l-gnav {
visibility: hidden;
}
.p-repair__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-repair__section-header {
margin-bottom: 32px;
}
}
.p-repair__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-repair__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-repair__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-repair__section-title {
font-size: 1.5rem;
}
}
.p-repair__intro {
padding: 56px 0 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-repair__intro {
padding: 40px 0 64px;
}
}
.p-repair__intro-layout {
gap: 44px;
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
align-items: start;
}
@media (max-width: 991px) {
.p-repair__intro-layout {
gap: 28px;
grid-template-columns: 1fr;
}
}
.p-repair__media {
margin: 0;
line-height: 0;
}
.p-repair__image {
aspect-ratio: 4/3;
-o-object-fit: cover;
display: block;
width: 100%;
height: auto;
object-fit: cover;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}
.p-repair__content {
gap: 20px;
display: flex;
flex-direction: column;
min-width: 0;
}
.p-repair__lead {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.375rem;
font-weight: 400;
letter-spacing: 0.03em;
line-height: 1.6;
}
@media (max-width: 767px) {
.p-repair__lead {
font-size: 1.25rem;
}
}
.p-repair__actions {
gap: 12px;
display: flex;
flex-wrap: wrap;
}
.p-repair__contact {
padding: 18px 18px 16px;
border: 1px solid #eaeaea;
border-radius: 8px;
background-color: #faf8f6;
}
.p-repair__contact-item {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.8;
}
.p-repair__contact-item + .p-repair__contact-item {
margin-top: 6px;
}
.p-rental {
--gnav-height: 56px;
background-color: #fff;
}
.p-rental .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-rental .l-gnav {
display: none;
}
}
body.is-menu-open .p-rental .l-gnav {
visibility: hidden;
}
.p-rental__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-rental__section-header {
margin-bottom: 32px;
}
}
.p-rental__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-rental__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-rental__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-rental__section-title {
font-size: 1.5rem;
}
}
.p-rental__intro {
padding: 56px 0 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-rental__intro {
padding: 40px 0 64px;
}
}
.p-rental__intro-layout {
gap: 44px;
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
align-items: start;
}
@media (max-width: 991px) {
.p-rental__intro-layout {
gap: 28px;
grid-template-columns: 1fr;
}
}
.p-rental__media {
margin: 0;
line-height: 0;
}
.p-rental__image {
aspect-ratio: 4/3;
-o-object-fit: cover;
display: block;
width: 100%;
height: auto;
object-fit: cover;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}
.p-rental__content {
gap: 18px;
display: flex;
flex-direction: column;
min-width: 0;
}
.p-rental__notice {
padding: 18px 18px 16px;
border: 1px solid #eaeaea;
border-radius: 10px;
background-color: rgba(253, 201, 51, 0.12);
}
.p-rental__notice-title {
margin: 0 0 8px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.5;
}
.p-rental__notice-text {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.8;
}
.p-rental__actions {
gap: 12px;
display: flex;
flex-wrap: wrap;
}
.p-rental__contact {
padding: 18px 18px 16px;
border: 1px solid #eaeaea;
border-radius: 8px;
background-color: #faf8f6;
}
.p-rental__contact-item {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.8;
}
.p-rental__contact-item + .p-rental__contact-item {
margin-top: 6px;
}
.p-string {
--gnav-height: 56px;
--string-tabs-sticky-top: 101px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-string {
--string-tabs-sticky-top: 85px;
}
}
.p-string .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-string .l-gnav {
display: none;
}
}
body.is-menu-open .p-string .l-gnav {
visibility: hidden;
}
.p-string__order {
padding: 48px 0 32px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-string__order {
padding: 32px 0 24px;
}
}
.p-string__order-box {
max-width: 900px;
margin: 0 auto;
padding: 40px 48px 36px;
border-radius: 8px;
background-color: #1e3a2f;
color: #fff;
text-align: center;
}
@media (max-width: 767px) {
.p-string__order-box {
padding: 32px 20px 28px;
}
}
.p-string__order-icon {
display: block;
margin: 0 auto 16px;
color: #c9a96e;
font-size: 2.5rem;
}
.p-string__order-title {
margin: 0 0 20px;
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 1.5rem;
font-weight: 400;
letter-spacing: 0.06em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-string__order-title {
font-size: 1.25rem;
}
}
.p-string__order-body {
max-width: 720px;
margin: 0 auto;
text-align: left;
}
.p-string__order-body.entry-content p,
.p-string__order-body.entry-content .wp-block-paragraph {
margin: 0;
color: rgba(255, 255, 255, 0.92);
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 400;
line-height: 1.9;
}
.p-string__order-body.entry-content p + p,
.p-string__order-body.entry-content .wp-block-paragraph + .wp-block-paragraph {
margin-top: 0;
}
.p-string__order-body.entry-content ul,
.p-string__order-body.entry-content ol,
.p-string__order-body.entry-content .wp-block-list {
margin: 0 0 12px;
padding: 0 0 0 1.25em;
list-style: none;
}
.p-string__order-body.entry-content li,
.p-string__order-body.entry-content .wp-block-list-item {
position: relative;
color: rgba(255, 255, 255, 0.92);
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-string__order-body.entry-content li::before,
.p-string__order-body.entry-content .wp-block-list-item::before {
position: absolute;
left: -1.25em;
content: "・";
}
.p-string__order-body.entry-content a:not(.c-btn):not(.p-string__order-link) {
text-underline-offset: 2px;
color: #c9a96e;
text-decoration: underline;
}
.p-string__order-body.entry-content a:not(.c-btn):not(.p-string__order-link):hover {
color: #fff;
}
.p-string__order-lead,
.p-string__order-detail {
margin: 0;
color: rgba(255, 255, 255, 0.92);
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 400;
line-height: 1.9;
}
.p-string__order-lead + .p-string__order-lead {
margin-top: 0;
}
.p-string__order-list {
margin: 0 0 12px;
padding: 0 0 0 1.25em;
list-style: none;
}
.p-string__order-list-item {
position: relative;
color: rgba(255, 255, 255, 0.92);
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-string__order-list-item::before {
position: absolute;
left: -1.25em;
content: "・";
}
.p-string__order-link {
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
text-decoration: none;
transition: opacity 0.2s ease;
}
.p-string__order-link:hover {
text-underline-offset: 2px;
color: #c9a96e;
text-decoration: underline;
opacity: 0.85;
}
.p-string__price {
padding-bottom: 80px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-string__price {
padding-bottom: 56px;
}
}
.p-string__price-inner {
padding-top: 8px;
}
.p-string__tabs-float {
z-index: 30;
position: sticky;
top: var(--string-tabs-sticky-top);
background-color: #faf8f6;
}
.p-string__tabs {
margin: 0;
}
.p-string__tab-list {
gap: 0;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin: 0 0 0;
padding: 0;
overflow: hidden;
border: 1px solid #eaeaea;
border-radius: 4px 4px 0 0;
background-color: #f0ece3;
}
@media (max-width: 767px) {
.p-string__tab-list {
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
display: flex;
overflow-x: auto;
border-radius: 4px;
}
.p-string__tab-list::-webkit-scrollbar {
display: none;
}
}
.p-string__tab {
gap: 8px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 88px;
padding: 12px 10px;
border: none;
border-right: 1px solid #eaeaea;
background-color: #f0ece3;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
font-weight: 500;
line-height: 1.45;
text-align: center;
cursor: pointer;
transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.p-string__tab:last-child {
border-right: none;
}
@media (max-width: 767px) {
.p-string__tab {
flex: 0 0 42%;
min-height: 76px;
font-size: 0.6875rem;
}
}
.p-string__tab:hover:not(.is-active) {
background-color: rgba(255, 255, 255, 0.6);
color: #5d4307;
}
.p-string__tab.is-active {
background-color: #fff;
box-shadow: inset 0 2px 0 #c9a96e;
color: #5d4307;
}
.p-string__tab-icon {
display: block;
flex-shrink: 0;
color: #e57e25;
font-size: 1.75rem;
line-height: 1;
}
.p-string__tab-label {
display: block;
}
.p-string__tab-pane {
padding: 32px 0 0;
border: 1px solid #eaeaea;
border-top: none;
border-radius: 0 0 4px 4px;
background-color: #fff;
}
.p-string__tab-pane[hidden] {
display: none;
}
@media (max-width: 767px) {
.p-string__tab-pane {
padding-top: 24px;
}
}
.p-string__pane-header {
gap: 16px 24px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: space-between;
margin-bottom: 28px;
padding: 0 32px;
}
@media (max-width: 767px) {
.p-string__pane-header {
margin-bottom: 20px;
padding: 0 16px;
}
}
.p-string__pane-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.375rem;
font-weight: 500;
letter-spacing: 0.04em;
line-height: 1.4;
}
@media (max-width: 767px) {
.p-string__pane-title {
font-size: 1.125rem;
}
}
.p-string__pane-subtitle {
margin: 8px 0 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-string__pane-actions {
gap: 10px;
display: flex;
align-items: flex-end;
}
@media (max-width: 767px) {
.p-string__pane-actions {
flex-direction: column;
align-items: flex-start;
width: 100%;
}
}
.p-string__pane-tax {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
line-height: 1.5;
}
.p-string__pdf-btn {
gap: 6px;
display: inline-flex;
align-items: center;
padding: 10px 18px;
border-radius: 4px;
background-color: #1a1a1a;
color: #fff;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1;
text-decoration: none;
transition: background-color 0.2s ease;
}
.p-string__pdf-btn:hover {
background-color: #5d4307;
text-decoration: none;
}
.p-string__pdf-icon {
font-size: 1.125rem;
}
.p-string__section-note {
margin: 0 32px 20px;
padding: 12px 16px;
border: 1px solid rgba(150, 139, 112, 0.4);
border-radius: 4px;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
@media (max-width: 767px) {
.p-string__section-note {
margin-inline: 16px;
}
}
.p-string__table-block {
padding-inline: 32px;
margin-bottom: 40px;
}
@media (max-width: 767px) {
.p-string__table-block {
padding-inline: 16px;
margin-bottom: 32px;
}
}
.p-string__table-block:last-child {
margin-bottom: 32px;
}
.p-string__material {
margin: 0 0 12px;
padding: 10px 16px;
background-color: rgba(253, 201, 51, 0.25);
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
font-weight: 700;
letter-spacing: 0.04em;
line-height: 1.4;
}
.p-string__table-note {
margin: 0 0 12px;
padding: 12px 16px;
border: 1px solid rgba(150, 139, 112, 0.4);
border-radius: 4px;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-string__table-footnotes {
margin: 12px 0 0;
padding: 12px 16px 12px 1.75em;
border: 1px solid rgba(150, 139, 112, 0.4);
border-radius: 4px;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
list-style: disc;
}
.p-string__table-footnotes .p-string__table-note {
margin: 0 0 6px;
padding: 0;
border: 0;
border-radius: 0;
}
.p-string__table-footnotes .p-string__table-note:last-child {
margin-bottom: 0;
}
.p-string__table-scroll {
-webkit-overflow-scrolling: touch;
overflow-x: auto;
}
.p-string__table {
width: 100%;
min-width: 640px;
border-collapse: separate;
border-spacing: 0;
font-family: "Noto Sans JP", sans-serif;
}
.p-string__table-corner {
width: 72px;
min-width: 72px;
background-color: #faf8f6;
}
.p-string__table-note-col {
padding: 10px 6px;
border-bottom: 1px solid #eaeaea;
color: #5d4307;
font-size: 0.8125rem;
font-weight: 600;
line-height: 1.3;
text-align: center;
vertical-align: middle;
}
.p-string__table-note-col:nth-child(2) {
background-color: #e8f4fc;
}
.p-string__table-note-col:nth-child(3) {
background-color: #fce8ee;
}
.p-string__table-note-col:nth-child(4) {
background-color: #e8f5e9;
}
.p-string__table-note-col:nth-child(5) {
background-color: #fff9e6;
}
.p-string__table-note-col:nth-child(6) {
background-color: #f3e8f5;
}
.p-string__table-note-col:nth-child(7) {
background-color: #fff3e0;
}
.p-string__table-note-col:nth-child(8) {
background-color: #faf6f0;
}
.p-string__note-en {
display: block;
font-size: 0.9375rem;
}
.p-string__note-ja {
display: block;
font-size: 0.75rem;
font-weight: 400;
}
.p-string__octave {
padding: 10px 8px;
border-bottom: 1px dotted #eaeaea;
background-color: #faf8f6;
color: #968b70;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.3;
text-align: center;
vertical-align: middle;
white-space: nowrap;
}
.p-string__cell {
padding: 10px 6px;
border-bottom: 1px dotted #eaeaea;
font-size: 0.75rem;
line-height: 1.45;
text-align: center;
vertical-align: middle;
}
.p-string__cell--col-1 {
background-color: rgba(232, 244, 252, 0.55);
}
.p-string__cell--col-2 {
background-color: rgba(252, 232, 238, 0.55);
}
.p-string__cell--col-3 {
background-color: rgba(232, 245, 233, 0.55);
}
.p-string__cell--col-4 {
background-color: rgba(255, 249, 230, 0.55);
}
.p-string__cell--col-5 {
background-color: rgba(243, 232, 245, 0.55);
}
.p-string__cell--col-6 {
background-color: rgba(255, 243, 224, 0.55);
}
.p-string__cell--col-7 {
background-color: rgba(250, 246, 240, 0.55);
}
.p-string__cell--empty {
color: transparent;
}
.p-string__cell--note {
padding: 10px 12px;
background-color: #faf8f6 !important;
color: #707070;
font-size: 0.75rem;
text-align: left;
}
.p-string__cell--set {
background-color: rgba(253, 201, 51, 0.12) !important;
}
.p-string__cell--text {
font-size: 0.75rem;
text-align: left;
}
.p-string__cell-num {
display: block;
margin-bottom: 2px;
color: #5d4307;
font-weight: 600;
}
.p-string__cell-price {
display: block;
color: #707070;
font-size: 0.6875rem;
}
.p-string__cell-price.is-special-order {
color: #968b70;
}
.p-string__cell-note {
display: block;
margin-top: 2px;
color: #968b70;
font-size: 0.6875rem;
}
.p-string__set-label {
display: block;
margin-bottom: 2px;
color: #5d4307;
font-weight: 600;
}
.p-string__set-price {
display: block;
color: #e57e25;
font-size: 0.8125rem;
font-weight: 600;
}
.u-visually-hidden {
clip: rect(0, 0, 0, 0);
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
border: 0;
white-space: nowrap;
}
.p-school {
--gnav-height: 56px;
--school-category-scroll-margin: 88px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school {
--school-category-scroll-margin: 72px;
}
}
.p-school .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-school .l-gnav {
display: none;
}
}
body.is-menu-open .p-school .l-gnav {
visibility: hidden;
}
.p-school__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-school__section-header {
margin-bottom: 32px;
}
}
.p-school__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-school__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-school__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-school__section-title {
font-size: 1.5rem;
}
}
.p-school__category-nav {
scroll-margin-top: var(--school-category-scroll-margin);
padding: 32px 0;
border-bottom: 1px solid #eaeaea;
background-color: #faf8f6;
}
.p-school__category-nav-list {
gap: 12px;
display: grid;
grid-template-columns: repeat(5, 1fr);
margin: 0;
padding: 0;
list-style: none;
}
@media (max-width: 991px) {
.p-school__category-nav-list {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 767px) {
.p-school__category-nav-list {
gap: 10px;
grid-template-columns: repeat(2, 1fr);
}
}
.p-school__category-nav-link {
gap: 6px;
display: flex;
flex-direction: column;
align-items: center;
padding: 16px 8px;
border-radius: 4px;
color: inherit;
text-align: center;
text-decoration: none;
transition: background-color 0.2s ease;
}
.p-school__category-nav-link:hover {
background-color: rgba(201, 169, 110, 0.08);
}
.p-school__category-nav-link.is-active {
background-color: rgba(201, 169, 110, 0.12);
}
.p-school__category-nav-link.is-active .p-school__category-nav-label-en,
.p-school__category-nav-link.is-active .p-school__category-nav-label-ja {
color: #5d4307;
}
.p-school__category-nav-icon-wrap {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 44px;
height: 38px;
}
.p-school__category-nav-icon {
-o-object-fit: contain;
display: block;
width: auto;
max-width: 100%;
height: 100%;
object-fit: contain;
}
.p-school__category-nav-label-en {
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.625rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
}
.p-school__category-nav-label-ja {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
line-height: 1.4;
}
.p-school__intro {
padding: 56px 0;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school__intro {
padding: 40px 0;
}
}
.p-school__intro-layout {
gap: 40px;
display: grid;
grid-template-columns: 240px 1fr;
align-items: start;
}
@media (max-width: 991px) {
.p-school__intro-layout {
gap: 28px;
grid-template-columns: 200px 1fr;
}
}
@media (max-width: 767px) {
.p-school__intro-layout {
gap: 24px;
grid-template-columns: 1fr;
}
}
.p-school__intro-media {
margin: 0;
line-height: 0;
text-align: center;
}
.p-school__intro-image {
display: block;
width: 100%;
max-width: 240px;
height: auto;
margin: 0 auto;
border-radius: 4px;
}
.p-school__intro-text {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-school__intro-text:last-child {
margin-bottom: 0;
}
.p-school__intro-content p {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-school__intro-content p:last-child {
margin-bottom: 0;
}
.p-school-online {
padding: 40px 0;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-school-online {
padding: 32px 0;
}
}
.p-school-online__box {
max-width: 780px;
margin: 0 auto;
padding: 28px 32px;
border: 1px solid #eaeaea;
border-radius: 8px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school-online__box {
padding: 24px 20px;
}
}
.p-school-online__label {
display: inline-block;
margin: 0 0 10px;
padding: 3px 10px;
border-radius: 999px;
background-color: #e8f5e9;
color: #448a47;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
line-height: 1.5;
}
.p-school-online__title {
margin: 0 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.375rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-school-online__lead {
margin: 0 0 20px;
color: #707070;
font-size: 0.875rem;
line-height: 1.8;
}
.p-school-online__features {
margin: 0 0 20px;
padding: 0;
list-style: none;
}
.p-school-online__feature {
gap: 10px;
display: flex;
align-items: center;
list-style: none;
}
.p-school-online__feature:not(:last-child) {
margin-bottom: 10px;
}
.p-school-online__feature-icon {
display: flex;
flex-shrink: 0;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: 50%;
background-color: rgba(229, 126, 37, 0.1);
}
.p-school-online__feature-icon img {
display: block;
width: 18px;
height: auto;
}
.p-school-online__feature-text {
color: #707070;
font-size: 0.875rem;
line-height: 1.6;
}
.p-school-online__note {
margin: 0 0 20px;
color: #968b70;
font-size: 0.8125rem;
line-height: 1.7;
}
.p-school-online__btn {
min-width: 160px;
}
.p-school__courses {
padding: 56px 0 72px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school__courses {
padding: 40px 0 56px;
}
}
.p-school__course-cards {
gap: 32px;
display: grid;
grid-template-columns: repeat(2, 1fr);
margin: 0;
padding: 0;
list-style: none;
}
.p-school__course-cards--single {
grid-template-columns: minmax(0, 560px);
justify-content: center;
}
@media (max-width: 991px) {
.p-school__course-cards {
gap: 24px;
grid-template-columns: 1fr;
}
}
.p-school__course-card {
overflow: hidden;
border-radius: 8px;
background-color: #fff;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.p-school__course-card-media {
aspect-ratio: 16/10;
display: block;
position: relative;
overflow: hidden;
color: inherit;
text-decoration: none;
}
.p-school__course-card-media:hover .p-school__course-card-image {
transform: scale(1.04);
}
.p-school__course-card-image {
-o-object-fit: cover;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.p-school__course-card-caption {
inset: 0;
display: flex;
z-index: 1;
position: absolute;
flex-direction: column;
align-items: flex-start;
justify-content: flex-end;
padding: 24px 28px;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.55) 100%);
}
.p-school__course-card-subtitle {
margin: 0 0 8px;
color: rgba(255, 255, 255, 0.9);
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
line-height: 1.5;
}
.p-school__course-card-title {
margin: 0;
color: #fff;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-school__course-card-title {
font-size: 1.125rem;
}
}
.p-school__course-card-body {
padding: 24px 28px 28px;
}
@media (max-width: 767px) {
.p-school__course-card-body {
padding: 20px;
}
}
.p-school__course-card-body p {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-school__course-card-text {
margin: 0 0 24px;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.9;
}
.p-school__course-card-action {
display: flex;
justify-content: flex-end;
}
.p-school-detail__course {
padding: 48px 0 40px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school-detail__course {
padding: 32px 0 28px;
}
}
.p-school-detail__course-layout {
gap: 48px;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: start;
}
@media (max-width: 991px) {
.p-school-detail__course-layout {
gap: 32px;
grid-template-columns: 1fr;
}
}
.p-school-detail__course-media {
overflow: hidden;
border-radius: 8px;
line-height: 0;
}
.p-school-detail__course-image {
-o-object-fit: cover;
display: block;
width: 100%;
height: auto;
object-fit: cover;
}
.p-school-detail__course-subtitle {
margin: 0 0 8px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-school-detail__course-name {
margin: 0 0 24px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.625rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-school-detail__course-name {
font-size: 1.375rem;
}
}
.p-school-detail__course-name-note {
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 400;
letter-spacing: 0.02em;
line-height: 1.6;
}
@media (max-width: 767px) {
.p-school-detail__course-name-note {
font-size: 0.75rem;
}
}
.p-school-detail__spec-list {
margin: 0 0 28px;
padding: 0;
}
.p-school-detail__spec-row {
gap: 16px;
display: grid;
grid-template-columns: 120px 1fr;
padding: 14px 0;
border-bottom: 1px solid #eaeaea;
}
.p-school-detail__spec-row:first-child {
border-top: 1px solid #eaeaea;
}
@media (max-width: 767px) {
.p-school-detail__spec-row {
gap: 6px;
grid-template-columns: 1fr;
}
}
.p-school-detail__spec-label {
margin: 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.6;
}
.p-school-detail__spec-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.8;
}
.p-school-detail__course-text {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-school-detail__course-text:last-child {
margin-bottom: 0;
}
.p-school-detail__course-texts p {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-school-detail__course-action {
margin-top: 28px;
}
.p-school-detail__instructor {
padding: 40px 0 48px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-school-detail__instructor {
padding: 32px 0 40px;
}
}
.p-school-detail__instructor-title {
margin: 0 0 28px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.5rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
text-align: center;
}
.p-school-detail__instructor-layout {
gap: 32px;
display: grid;
grid-template-columns: 180px 1fr;
align-items: start;
max-width: 720px;
margin: 0 auto;
}
@media (max-width: 767px) {
.p-school-detail__instructor-layout {
gap: 24px;
grid-template-columns: 1fr;
}
}
.p-school-detail__instructor-media {
margin: 0;
line-height: 0;
text-align: center;
}
.p-school-detail__instructor-image {
display: block;
width: 100%;
max-width: 180px;
height: auto;
margin: 0 auto;
border-radius: 4px;
}
.p-school-detail__instructor-info {
margin: 0;
}
.p-school-detail__instructor-row {
gap: 16px;
display: grid;
grid-template-columns: 100px 1fr;
padding: 12px 0;
border-bottom: 1px solid #eaeaea;
}
.p-school-detail__instructor-row:first-child {
border-top: 1px solid #eaeaea;
}
@media (max-width: 767px) {
.p-school-detail__instructor-row {
gap: 6px;
grid-template-columns: 1fr;
}
}
.p-school-detail__instructor-label {
margin: 0;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
}
.p-school-detail__instructor-value {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.8;
}
.p-school-detail__instructor-career {
margin: 0;
padding-left: 1.2em;
}
.p-school-detail__related {
padding: 48px 0 72px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school-detail__related {
padding: 40px 0 56px;
}
}
.p-school-detail__stub {
padding: 80px 0;
text-align: center;
}
.p-school-detail__stub-text {
margin: 0 0 24px;
color: #707070;
}
.p-school-faq {
padding: 48px 0 72px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school-faq {
padding: 36px 0 56px;
}
}
.p-school-faq__inner {
max-width: 900px;
margin: 0 auto;
}
.p-school-faq__list {
gap: 12px;
display: flex;
flex-direction: column;
}
.p-school-faq__item {
border: 1px solid #eaeaea;
border-left: 3px solid #c9a96e;
border-radius: 4px;
background-color: #fff;
}
.p-school-faq__question {
gap: 16px;
-webkit-user-select: none;
-moz-user-select: none;
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 20px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1rem;
font-weight: 400;
line-height: 1.6;
list-style: none;
cursor: pointer;
user-select: none;
}
.p-school-faq__question::-webkit-details-marker {
display: none;
}
.p-school-faq__question-text {
flex: 1;
min-width: 0;
}
.p-school-faq__icon {
position: relative;
flex-shrink: 0;
width: 14px;
height: 14px;
}
.p-school-faq__icon::before, .p-school-faq__icon::after {
position: absolute;
top: 50%;
left: 50%;
width: 14px;
height: 1.5px;
border-radius: 1px;
background-color: #c9a96e;
content: "";
transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
.p-school-faq__icon::before {
transform: translate(-50%, -50%);
}
.p-school-faq__icon::after {
transform: translate(-50%, -50%) rotate(90deg);
}
.p-school-faq__item[open] .p-school-faq__icon::before {
transform: translate(-50%, -50%) rotate(45deg);
}
.p-school-faq__item[open] .p-school-faq__icon::after {
transform: translate(-50%, -50%) rotate(-45deg);
}
.p-school-faq__answer {
height: 0;
padding: 0 20px;
overflow: hidden;
transition: height 0.45s cubic-bezier(0.4, 0, 0.2, 1);
will-change: height;
}
.p-school-faq__item.is-closing .p-school-faq__answer {
height: 0;
}
.p-school-faq__answer-inner {
padding-bottom: 20px;
}
.p-school-faq__answer-text {
margin: 0;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-school-faq__answer-link-wrap {
margin: 16px 0 0;
}
.p-school-faq__answer-link {
text-underline-offset: 2px;
color: #5d4307;
font-size: 0.875rem;
text-decoration: underline;
}
.p-school-faq__answer-link:hover {
color: #c9a96e;
}
.p-school-testimony {
padding: 48px 0 72px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-school-testimony {
padding: 36px 0 56px;
}
}
.p-school-testimony__inner {
max-width: 900px;
margin: 0 auto;
}
.p-school-testimony__list {
gap: 32px;
display: flex;
flex-direction: column;
}
@media (max-width: 767px) {
.p-school-testimony__list {
gap: 24px;
}
}
.p-school-testimony__card {
margin: 0;
padding: 32px 36px 36px;
border: 1px solid #eaeaea;
border-left: 3px solid #c9a96e;
border-radius: 4px;
background-color: #fff;
}
.p-school-testimony__card.is-alt {
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-school-testimony__card {
padding: 24px 20px 28px;
}
}
.p-school-testimony__card-header {
margin-bottom: 20px;
padding-bottom: 16px;
border-bottom: 1px solid #eaeaea;
}
.p-school-testimony__name {
margin: 0 0 8px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
.p-school-testimony__meta {
margin: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.6;
}
.p-school-testimony__card-body {
gap: 24px 36px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
@media (max-width: 991px) {
.p-school-testimony__card-body {
gap: 20px;
flex-direction: column;
}
}
.p-school-testimony__media {
flex: 0 0 auto;
margin: 0;
line-height: 0;
text-align: center;
}
.p-school-testimony__image {
display: block;
width: auto;
max-width: 100%;
height: auto;
border-radius: 4px;
}
.p-school-testimony__caption {
margin-top: 10px;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.75rem;
line-height: 1.6;
text-align: center;
}
.p-school-testimony__content {
flex: 1 1 280px;
min-width: 0;
}
.p-school-testimony__text {
margin: 0 0 1.25em;
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
line-height: 1.9;
}
.p-school-testimony__text:last-child {
margin-bottom: 0;
}
.p-faq-page {
background-color: #fff;
}
.p-faq-page .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-faq-page .l-gnav {
display: none;
}
}
body.is-menu-open .p-faq-page .l-gnav {
visibility: hidden;
}
.p-faq {
padding: 48px 0 72px;
background-color: #fff;
}
@media (max-width: 767px) {
.p-faq {
padding: 36px 0 56px;
}
}
.p-faq__inner {
max-width: 900px;
margin: 0 auto;
}
.p-faq__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-faq__section-header {
margin-bottom: 32px;
}
}
.p-faq__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-faq__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-faq__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-faq__section-title {
font-size: 1.5rem;
}
}
.p-faq__toc {
margin-bottom: 40px;
padding: 20px 24px;
border: 1px solid #eaeaea;
border-radius: 4px;
background-color: #faf8f6;
}
@media (max-width: 767px) {
.p-faq__toc {
margin-bottom: 32px;
padding: 16px 18px;
}
}
.p-faq__toc-list {
gap: 10px 20px;
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 0;
}
.p-faq__toc-item {
gap: 0.45em;
display: flex;
align-items: flex-start;
list-style: none;
}
.p-faq__toc-item::before {
flex-shrink: 0;
width: 5px;
height: 5px;
margin-top: 0.55em;
border-radius: 50%;
background-color: #c9a96e;
content: "";
}
.p-faq__toc-link {
text-underline-offset: 3px;
color: #5d4307;
font-size: 0.875rem;
line-height: 1.6;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-faq__toc-link:hover {
color: #c9a96e;
}
.p-faq__category {
scroll-margin-top: 88px;
margin-bottom: 48px;
}
.p-faq__category:last-child {
margin-bottom: 0;
}
@media (max-width: 767px) {
.p-faq__category {
scroll-margin-top: 72px;
margin-bottom: 40px;
}
}
.p-faq__category-title {
margin: 0 0 20px;
padding-bottom: 12px;
border-bottom: 1px solid rgba(201, 169, 110, 0.45);
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-faq__category-title {
font-size: 1.125rem;
}
}
.p-instagram {
padding: 60px 0 72px;
background-color: #fff;
}
.p-instagram__header {
gap: 12px;
display: flex;
align-items: center;
margin-bottom: 28px;
}
.p-instagram__icon {
display: block;
flex-shrink: 0;
width: 32px;
height: 32px;
}
.p-instagram__title {
margin: 0;
color: #603f00;
font-family: "Imperial Script", cursive;
font-size: 2.75rem;
font-weight: 400;
line-height: 1;
}
.p-instagram__feed {
display: block;
line-height: 0;
transition: opacity 0.3s ease;
}
.p-instagram__feed:hover {
opacity: 0.9;
}
.p-instagram__embed #sb_instagram {
padding: 0;
}
.p-instagram__embed .sbi_header_link,
.p-instagram__embed .sbi_follow_btn {
display: none;
}
.p-instagram__image {
display: block;
width: 100%;
height: auto;
}
@media (max-width: 991px) {
.p-instagram {
padding: 48px 0 56px;
}
.p-instagram__title {
font-size: 2.25rem;
}
}
@media (max-width: 767px) {
.p-instagram {
padding: 40px 0 48px;
}
.p-instagram__header {
margin-bottom: 20px;
}
.p-instagram__title {
font-size: 1.875rem;
}
}
.p-seminar {
--gnav-height: 56px;
background-color: #fff;
}
.p-seminar .l-main {
padding: 0;
}
@media (max-width: 991px) {
.p-seminar .l-gnav {
display: none;
}
}
body.is-menu-open .l-gnav {
visibility: hidden;
}
.p-seminar__inner {
max-width: 780px;
}
.p-seminar--history .p-harp-knowledge,
.p-seminar--glissando .p-harp-knowledge,
.p-seminar--qa .p-harp-knowledge,
.p-seminar--composer .p-harp-knowledge,
.p-seminar--videoguides .p-harp-knowledge,
.p-seminar--orchestra .p-harp-knowledge,
.p-seminar--tuning .p-harp-knowledge,
.p-seminar--tuning-data .p-harp-knowledge,
.p-seminar--daybreak .p-harp-knowledge,
.p-seminar--daybreak-vol .p-harp-knowledge {
margin-top: 0;
padding: 48px 0 60px;
}
@media (max-width: 767px) {
.p-seminar--history .p-harp-knowledge,
.p-seminar--glissando .p-harp-knowledge,
.p-seminar--qa .p-harp-knowledge,
.p-seminar--composer .p-harp-knowledge,
.p-seminar--videoguides .p-harp-knowledge,
.p-seminar--orchestra .p-harp-knowledge,
.p-seminar--tuning .p-harp-knowledge,
.p-seminar--tuning-data .p-harp-knowledge,
.p-seminar--daybreak .p-harp-knowledge,
.p-seminar--daybreak-vol .p-harp-knowledge {
padding: 40px 0 48px;
}
}
.p-seminar__main {
padding: 56px 0 0;
}
@media (max-width: 767px) {
.p-seminar__main {
padding-top: 40px;
}
}
.p-seminar__section-header {
margin-bottom: 40px;
text-align: center;
}
@media (max-width: 767px) {
.p-seminar__section-header {
margin-bottom: 32px;
}
}
.p-seminar__section-label {
gap: 12px;
display: inline-flex;
align-items: center;
margin: 0 0 16px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.12em;
line-height: 1.4;
text-transform: uppercase;
}
.p-seminar__section-label::before {
color: #c9a96e;
font-weight: 400;
content: "—";
}
.p-seminar__section-title {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.75rem;
font-weight: 400;
letter-spacing: 0.04em;
line-height: 1.5;
}
@media (max-width: 767px) {
.p-seminar__section-title {
font-size: 1.5rem;
}
}
.p-seminar__entry {
color: #707070;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.98rem;
line-height: 1.95;
}
.p-seminar__entry a:not(.c-btn):not(.seminar-download__link):not(.seminar-qa-toc__link):not(.seminar-tuning-data-nav__link):not(.seminar-tuning-data-nav__back-link):not(.seminar-daybreak-nav__link) {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-seminar__entry a:not(.c-btn):not(.seminar-download__link):not(.seminar-qa-toc__link):not(.seminar-tuning-data-nav__link):not(.seminar-tuning-data-nav__back-link):not(.seminar-daybreak-nav__link):hover {
color: #c9a96e;
}
.p-seminar__entry a.c-btn {
text-underline-offset: 0;
text-decoration: none;
}
.p-seminar__entry a.c-btn.c-btn--primary {
color: #fff;
}
.p-seminar__entry a.c-btn.c-btn--primary:hover {
color: #fff;
}
.p-seminar__entry a.c-btn.c-btn--outline {
color: #968b70;
}
.p-seminar__entry a.c-btn.c-btn--outline:hover {
color: #968b70;
}
.p-seminar__entry a.c-btn.c-btn--dark {
color: #fff;
}
.p-seminar__entry a.c-btn.c-btn--dark:hover {
color: #fff;
}
.p-seminar__entry a.seminar-tuning-data-nav__link,
.p-seminar__entry a.seminar-tuning-data-nav__back-link {
text-underline-offset: 0;
text-decoration: none;
}
.p-seminar__entry a.seminar-tuning-data-nav__link {
color: #707070;
}
.p-seminar__entry a.seminar-tuning-data-nav__link:hover {
color: #c9a96e;
}
.p-seminar__entry a.seminar-tuning-data-nav__link.is-current {
color: #c9a96e;
}
.p-seminar__entry a.seminar-tuning-data-nav__back-link {
color: #c9a96e;
}
.p-seminar__entry a.seminar-tuning-data-nav__back-link:hover {
color: #c9a96e;
}
.p-seminar__entry a.seminar-daybreak-nav__link {
text-underline-offset: 0;
color: #707070;
text-decoration: none;
}
.p-seminar__entry a.seminar-daybreak-nav__link:hover {
color: #c9a96e;
}
.p-seminar__entry a.seminar-daybreak-nav__link.is-current {
color: #c9a96e;
}
.p-seminar__entry > h2,
.p-seminar__entry .seminar-section > h2,
.p-seminar__entry .seminar-appendix__title {
margin: 40px 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-seminar__entry > h2:first-child,
.p-seminar__entry > *:first-child h2:first-child,
.p-seminar__entry .seminar-section:first-child > h2,
.p-seminar__entry > [class*=lazyblock-seminar-rich-section]:first-child .seminar-section > h2 {
margin-top: 0;
}
.p-seminar__entry h3,
.p-seminar__entry .seminar-appendix__body h3 {
margin: 28px 0 12px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-seminar__entry p {
margin: 0 0 16px;
}
.p-seminar__entry ul:not(.seminar-figures):not(.p-seminar__figures):not(.seminar-qa-toc__list):not(.seminar-tuning-data-nav__list):not(.seminar-tuning-hub__cards):not(.seminar-daybreak-nav__list):not(.seminar-tuning-footnotes__list) {
margin: 0 0 16px;
padding-left: 1.5em;
list-style: disc;
list-style-position: outside;
}
.p-seminar__entry ol {
margin: 0 0 16px;
padding-left: 1.5em;
list-style: decimal;
list-style-position: outside;
}
.p-seminar__entry li + li {
margin-top: 8px;
}
.p-seminar__entry .seminar-figures > li + li,
.p-seminar__entry .p-seminar__figures > li + li,
.p-seminar__entry .seminar-tuning-hub__cards > li + li {
margin-top: 0;
}
.p-seminar__entry strong {
font-weight: 600;
}
.p-seminar__entry .seminar-appendix,
.p-seminar__entry [class*=lazyblock-seminar-appendix] .seminar-appendix {
margin-top: 48px;
}
.p-seminar__entry .seminar-appendix:first-of-type,
.p-seminar__entry [class*=lazyblock-seminar-appendix] .seminar-appendix:first-of-type {
margin-top: 40px;
}
.p-seminar__entry .seminar-appendix__label {
margin: 0 0 8px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.08em;
line-height: 1.5;
}
.p-seminar__entry .seminar-appendix__title {
margin: 0 0 16px;
font-size: 1.35rem;
}
@media (max-width: 767px) {
.p-seminar__entry .seminar-appendix__title {
font-size: 1.2rem;
}
}
.p-seminar__entry .seminar-appendix__body > *:first-child {
margin-top: 0;
}
.p-seminar__entry .seminar-note,
.p-seminar__entry [class*=lazyblock-seminar-note] .seminar-note {
margin: 24px 0 0;
padding: 16px 18px;
border: none;
border-left: 3px solid #c9a96e;
background-color: rgba(150, 139, 112, 0.08);
color: #707070;
font-size: 0.92rem;
line-height: 1.85;
}
.p-seminar__entry .seminar-note p,
.p-seminar__entry [class*=lazyblock-seminar-note] .seminar-note p {
margin: 0;
}
.p-seminar__entry .seminar-note a,
.p-seminar__entry [class*=lazyblock-seminar-note] .seminar-note a {
text-underline-offset: 2px;
color: #5d4307;
text-decoration: underline;
transition: color 0.2s ease;
}
.p-seminar__entry .seminar-note a:hover,
.p-seminar__entry [class*=lazyblock-seminar-note] .seminar-note a:hover {
color: #c9a96e;
}
.p-seminar__entry .seminar-figures,
.p-seminar__entry .p-seminar__figures,
.p-seminar__entry [class*=lazyblock-seminar-figures] .seminar-figures {
gap: 20px 16px;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin: 28px 0 32px;
padding: 0;
list-style: none;
}
@media (max-width: 991px) {
.p-seminar__entry .seminar-figures,
.p-seminar__entry .p-seminar__figures,
.p-seminar__entry [class*=lazyblock-seminar-figures] .seminar-figures {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 767px) {
.p-seminar__entry .seminar-figures,
.p-seminar__entry .p-seminar__figures,
.p-seminar__entry [class*=lazyblock-seminar-figures] .seminar-figures {
gap: 24px;
grid-template-columns: 1fr;
}
}
.p-seminar__entry .seminar-figures__item,
.p-seminar__entry .p-seminar__figure {
margin: 0;
list-style: none;
}
.p-seminar__entry .seminar-figures__item figure,
.p-seminar__entry .p-seminar__figure figure {
margin: 0;
text-align: center;
}
.p-seminar__entry .seminar-figures__img,
.p-seminar__entry .p-seminar__figure-img {
display: block;
width: auto;
max-width: 100%;
height: auto;
margin: 0 auto;
}
.p-seminar__entry .seminar-figures__caption,
.p-seminar__entry .p-seminar__figure-caption {
margin: 10px 0 0;
color: #707070;
font-size: 0.85rem;
line-height: 1.6;
}
.p-seminar__entry .seminar-download,
.p-seminar__entry [class*=lazyblock-seminar-download] .seminar-download {
margin: 0 0 24px;
text-align: center;
}
.p-seminar__entry > .seminar-download:not(:first-child),
.p-seminar__entry > [class*=lazyblock-seminar-download]:not(:first-child),
.p-seminar__entry > [class*=lazyblock-seminar-download]:not(:first-child) .seminar-download,
.p-seminar__entry .seminar-chord + .seminar-download,
.p-seminar__entry .seminar-chord + [class*=lazyblock-seminar-download],
.p-seminar__entry .seminar-chord + [class*=lazyblock-seminar-download] .seminar-download {
margin-top: 40px;
}
.p-seminar__entry .seminar-download + .seminar-note,
.p-seminar__entry .seminar-download + [class*=lazyblock-seminar-note],
.p-seminar__entry .seminar-download + [class*=lazyblock-seminar-note] .seminar-note,
.p-seminar__entry [class*=lazyblock-seminar-download] + .seminar-note,
.p-seminar__entry [class*=lazyblock-seminar-download] + [class*=lazyblock-seminar-note] .seminar-note {
margin-top: 24px;
}
.p-seminar__entry .seminar-download__link {
gap: 6px;
display: inline-flex;
align-items: center;
padding: 12px 22px;
border-radius: 4px;
background-color: #1a1a1a;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
font-weight: 500;
line-height: 1;
transition: background-color 0.2s ease;
}
.p-seminar__entry .seminar-download__link, .p-seminar__entry .seminar-download__link:link, .p-seminar__entry .seminar-download__link:visited, .p-seminar__entry .seminar-download__link:hover, .p-seminar__entry .seminar-download__link:focus, .p-seminar__entry .seminar-download__link:active {
color: #fff;
text-decoration: none;
}
.p-seminar__entry .seminar-download__link:hover {
background-color: #5d4307;
}
.p-seminar__entry .seminar-chord__diagram-img,
.p-seminar__entry .seminar-chord__type-img,
.p-seminar__entry > p > img {
width: auto;
max-width: 100%;
height: auto;
}
.p-seminar__entry .seminar-chord,
.p-seminar__entry [class*=lazyblock-seminar-chord] .seminar-chord {
gap: 20px 24px;
display: grid;
grid-template-columns: max-content minmax(0, 1fr);
margin: 32px 0 0;
padding: 28px 0 0;
border-top: 1px solid rgba(150, 139, 112, 0.25);
}
.p-seminar__entry .seminar-chord:first-of-type,
.p-seminar__entry [class*=lazyblock-seminar-chord] .seminar-chord:first-of-type {
margin-top: 40px;
}
.p-seminar__entry .seminar-chord__diagram {
margin: 0;
}
.p-seminar__entry .seminar-chord__diagram-img {
display: block;
margin: 0;
}
.p-seminar__entry .seminar-chord__content {
min-width: 0;
}
.p-seminar__entry .seminar-chord__type-img {
display: block;
margin: 0 0 12px;
}
.p-seminar__entry .seminar-chord__body > *:first-child {
margin-top: 0;
}
.p-seminar__entry .seminar-chord__body > *:last-child {
margin-bottom: 0;
}
@media (max-width: 991px) {
.p-seminar__entry .seminar-chord,
.p-seminar__entry [class*=lazyblock-seminar-chord] .seminar-chord {
gap: 16px;
grid-template-columns: 1fr;
}
}
.p-seminar__entry .wp-block-gallery {
margin: 28px 0 32px;
}
.p-seminar__entry .wp-block-gallery.columns-3 {
gap: 20px 16px;
display: grid;
grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 991px) {
.p-seminar__entry .wp-block-gallery.columns-3 {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 767px) {
.p-seminar__entry .wp-block-gallery.columns-3 {
grid-template-columns: 1fr;
}
}
.p-seminar__entry .wp-block-gallery .wp-block-image {
margin: 0;
text-align: center;
}
.p-seminar__entry .wp-block-gallery .wp-block-image img {
width: auto;
max-width: 100%;
height: auto;
}
.p-seminar__entry .wp-block-gallery .wp-block-image figcaption {
margin-top: 10px;
color: #707070;
font-size: 0.85rem;
line-height: 1.6;
}
.p-seminar--qa,
.p-seminar--composer,
.p-seminar--videoguides,
.p-seminar--orchestra {
--anchor-offset: 120px;
}
@media (max-width: 767px) {
.p-seminar--qa,
.p-seminar--composer,
.p-seminar--videoguides,
.p-seminar--orchestra {
--anchor-offset: 88px;
}
}
.p-seminar--qa .p-seminar__inner,
.p-seminar--composer .p-seminar__inner,
.p-seminar--videoguides .p-seminar__inner,
.p-seminar--orchestra .p-seminar__inner {
max-width: 1040px;
}
.p-seminar--qa .p-seminar__entry,
.p-seminar--composer .p-seminar__entry,
.p-seminar--videoguides .p-seminar__entry,
.p-seminar--orchestra .p-seminar__entry {
gap: 0 40px;
display: grid;
grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 992px) {
.p-seminar--qa .p-seminar__entry,
.p-seminar--composer .p-seminar__entry,
.p-seminar--videoguides .p-seminar__entry,
.p-seminar--orchestra .p-seminar__entry {
grid-template-columns: 200px minmax(0, 1fr);
align-items: start;
}
}
.p-seminar--qa .p-seminar__entry > .wp-block-lazyblock-seminar-qa-list,
.p-seminar--qa .p-seminar__entry > .wp-block-lazyblock-seminar-biography-list,
.p-seminar--qa .p-seminar__entry > .wp-block-lazyblock-seminar-orchestra-list,
.p-seminar--qa .p-seminar__entry > .wp-block-lazyblock-seminar-video-guides,
.p-seminar--qa .p-seminar__entry > .wp-block-lazyblock-seminar-rich-section,
.p-seminar--qa .p-seminar__entry > .wp-block-lazyblock-seminar-figures,
.p-seminar--composer .p-seminar__entry > .wp-block-lazyblock-seminar-qa-list,
.p-seminar--composer .p-seminar__entry > .wp-block-lazyblock-seminar-biography-list,
.p-seminar--composer .p-seminar__entry > .wp-block-lazyblock-seminar-orchestra-list,
.p-seminar--composer .p-seminar__entry > .wp-block-lazyblock-seminar-video-guides,
.p-seminar--composer .p-seminar__entry > .wp-block-lazyblock-seminar-rich-section,
.p-seminar--composer .p-seminar__entry > .wp-block-lazyblock-seminar-figures,
.p-seminar--videoguides .p-seminar__entry > .wp-block-lazyblock-seminar-qa-list,
.p-seminar--videoguides .p-seminar__entry > .wp-block-lazyblock-seminar-biography-list,
.p-seminar--videoguides .p-seminar__entry > .wp-block-lazyblock-seminar-orchestra-list,
.p-seminar--videoguides .p-seminar__entry > .wp-block-lazyblock-seminar-video-guides,
.p-seminar--videoguides .p-seminar__entry > .wp-block-lazyblock-seminar-rich-section,
.p-seminar--videoguides .p-seminar__entry > .wp-block-lazyblock-seminar-figures,
.p-seminar--orchestra .p-seminar__entry > .wp-block-lazyblock-seminar-qa-list,
.p-seminar--orchestra .p-seminar__entry > .wp-block-lazyblock-seminar-biography-list,
.p-seminar--orchestra .p-seminar__entry > .wp-block-lazyblock-seminar-orchestra-list,
.p-seminar--orchestra .p-seminar__entry > .wp-block-lazyblock-seminar-video-guides,
.p-seminar--orchestra .p-seminar__entry > .wp-block-lazyblock-seminar-rich-section,
.p-seminar--orchestra .p-seminar__entry > .wp-block-lazyblock-seminar-figures {
display: contents;
}
.p-seminar--qa .p-seminar__entry .seminar-qa,
.p-seminar--qa .p-seminar__entry .seminar-biography,
.p-seminar--qa .p-seminar__entry .seminar-orchestra,
.p-seminar--qa .p-seminar__entry .seminar-video-guides,
.p-seminar--composer .p-seminar__entry .seminar-qa,
.p-seminar--composer .p-seminar__entry .seminar-biography,
.p-seminar--composer .p-seminar__entry .seminar-orchestra,
.p-seminar--composer .p-seminar__entry .seminar-video-guides,
.p-seminar--videoguides .p-seminar__entry .seminar-qa,
.p-seminar--videoguides .p-seminar__entry .seminar-biography,
.p-seminar--videoguides .p-seminar__entry .seminar-orchestra,
.p-seminar--videoguides .p-seminar__entry .seminar-video-guides,
.p-seminar--orchestra .p-seminar__entry .seminar-qa,
.p-seminar--orchestra .p-seminar__entry .seminar-biography,
.p-seminar--orchestra .p-seminar__entry .seminar-orchestra,
.p-seminar--orchestra .p-seminar__entry .seminar-video-guides {
display: contents;
}
.p-seminar--qa .seminar-qa-toc,
.p-seminar--composer .seminar-qa-toc,
.p-seminar--videoguides .seminar-qa-toc,
.p-seminar--orchestra .seminar-qa-toc {
margin: 0 0 32px;
}
@media (min-width: 992px) {
.p-seminar--qa .seminar-qa-toc,
.p-seminar--composer .seminar-qa-toc,
.p-seminar--videoguides .seminar-qa-toc,
.p-seminar--orchestra .seminar-qa-toc {
display: flex;
position: sticky;
top: calc(var(--gnav-height) + 24px);
grid-column: 1;
grid-row: 1;
flex-direction: column;
align-self: start;
max-height: calc(100vh - var(--gnav-height) - 48px);
margin-bottom: 0;
}
}
.p-seminar--qa .seminar-qa__main,
.p-seminar--composer .seminar-qa__main,
.p-seminar--videoguides .seminar-qa__main,
.p-seminar--orchestra .seminar-qa__main {
min-width: 0;
}
@media (min-width: 992px) {
.p-seminar--qa .seminar-qa__main,
.p-seminar--composer .seminar-qa__main,
.p-seminar--videoguides .seminar-qa__main,
.p-seminar--orchestra .seminar-qa__main {
grid-column: 2;
grid-row: 1;
}
}
.p-seminar--qa .seminar-qa-toc__label,
.p-seminar--composer .seminar-qa-toc__label,
.p-seminar--videoguides .seminar-qa-toc__label,
.p-seminar--orchestra .seminar-qa-toc__label {
margin: 0 0 12px;
color: #c9a96e;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.1em;
line-height: 1.4;
text-transform: uppercase;
}
.p-seminar--qa .seminar-qa-toc__list,
.p-seminar--composer .seminar-qa-toc__list,
.p-seminar--videoguides .seminar-qa-toc__list,
.p-seminar--orchestra .seminar-qa-toc__list {
margin: 0;
padding: 0;
list-style: none;
}
@media (min-width: 992px) {
.p-seminar--qa .seminar-qa-toc__list,
.p-seminar--composer .seminar-qa-toc__list,
.p-seminar--videoguides .seminar-qa-toc__list,
.p-seminar--orchestra .seminar-qa-toc__list {
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
flex: 1;
min-height: 0;
padding-right: 4px;
overflow-y: auto;
}
}
.p-seminar--qa .seminar-qa-toc__list li + li,
.p-seminar--composer .seminar-qa-toc__list li + li,
.p-seminar--videoguides .seminar-qa-toc__list li + li,
.p-seminar--orchestra .seminar-qa-toc__list li + li {
margin-top: 6px;
}
.p-seminar--qa .seminar-qa-toc__link,
.p-seminar--composer .seminar-qa-toc__link,
.p-seminar--videoguides .seminar-qa-toc__link,
.p-seminar--orchestra .seminar-qa-toc__link {
display: block;
padding: 6px 0;
border-bottom: 1px solid transparent;
color: #5d4307;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.875rem;
line-height: 1.5;
transition: color 0.2s ease, border-color 0.2s ease;
}
.p-seminar--qa .seminar-qa-toc__link, .p-seminar--qa .seminar-qa-toc__link:link, .p-seminar--qa .seminar-qa-toc__link:visited, .p-seminar--qa .seminar-qa-toc__link:hover, .p-seminar--qa .seminar-qa-toc__link:focus, .p-seminar--qa .seminar-qa-toc__link:active,
.p-seminar--composer .seminar-qa-toc__link,
.p-seminar--composer .seminar-qa-toc__link:link,
.p-seminar--composer .seminar-qa-toc__link:visited,
.p-seminar--composer .seminar-qa-toc__link:hover,
.p-seminar--composer .seminar-qa-toc__link:focus,
.p-seminar--composer .seminar-qa-toc__link:active,
.p-seminar--videoguides .seminar-qa-toc__link,
.p-seminar--videoguides .seminar-qa-toc__link:link,
.p-seminar--videoguides .seminar-qa-toc__link:visited,
.p-seminar--videoguides .seminar-qa-toc__link:hover,
.p-seminar--videoguides .seminar-qa-toc__link:focus,
.p-seminar--videoguides .seminar-qa-toc__link:active,
.p-seminar--orchestra .seminar-qa-toc__link,
.p-seminar--orchestra .seminar-qa-toc__link:link,
.p-seminar--orchestra .seminar-qa-toc__link:visited,
.p-seminar--orchestra .seminar-qa-toc__link:hover,
.p-seminar--orchestra .seminar-qa-toc__link:focus,
.p-seminar--orchestra .seminar-qa-toc__link:active {
text-decoration: none;
}
.p-seminar--qa .seminar-qa-toc__link:hover,
.p-seminar--composer .seminar-qa-toc__link:hover,
.p-seminar--videoguides .seminar-qa-toc__link:hover,
.p-seminar--orchestra .seminar-qa-toc__link:hover {
border-bottom-color: rgba(150, 139, 112, 0.35);
color: #e57e25;
}
@media (min-width: 992px) {
.p-seminar--qa .p-seminar__entry > p,
.p-seminar--qa .p-seminar__entry > .seminar-qa__section,
.p-seminar--qa .p-seminar__entry > .seminar-qa__contact,
.p-seminar--qa .p-seminar__entry > .seminar-section,
.p-seminar--qa .p-seminar__entry .seminar-qa__intro,
.p-seminar--qa .p-seminar__entry .seminar-section,
.p-seminar--qa .p-seminar__entry > .seminar-figures,
.p-seminar--qa .p-seminar__entry .seminar-figures,
.p-seminar--composer .p-seminar__entry > p,
.p-seminar--composer .p-seminar__entry > .seminar-qa__section,
.p-seminar--composer .p-seminar__entry > .seminar-qa__contact,
.p-seminar--composer .p-seminar__entry > .seminar-section,
.p-seminar--composer .p-seminar__entry .seminar-qa__intro,
.p-seminar--composer .p-seminar__entry .seminar-section,
.p-seminar--composer .p-seminar__entry > .seminar-figures,
.p-seminar--composer .p-seminar__entry .seminar-figures,
.p-seminar--videoguides .p-seminar__entry > p,
.p-seminar--videoguides .p-seminar__entry > .seminar-qa__section,
.p-seminar--videoguides .p-seminar__entry > .seminar-qa__contact,
.p-seminar--videoguides .p-seminar__entry > .seminar-section,
.p-seminar--videoguides .p-seminar__entry .seminar-qa__intro,
.p-seminar--videoguides .p-seminar__entry .seminar-section,
.p-seminar--videoguides .p-seminar__entry > .seminar-figures,
.p-seminar--videoguides .p-seminar__entry .seminar-figures,
.p-seminar--orchestra .p-seminar__entry > p,
.p-seminar--orchestra .p-seminar__entry > .seminar-qa__section,
.p-seminar--orchestra .p-seminar__entry > .seminar-qa__contact,
.p-seminar--orchestra .p-seminar__entry > .seminar-section,
.p-seminar--orchestra .p-seminar__entry .seminar-qa__intro,
.p-seminar--orchestra .p-seminar__entry .seminar-section,
.p-seminar--orchestra .p-seminar__entry > .seminar-figures,
.p-seminar--orchestra .p-seminar__entry .seminar-figures {
grid-column: 2;
}
}
@media (min-width: 992px) {
.p-seminar--qa .p-seminar__entry .seminar-qa__main .seminar-qa__section,
.p-seminar--qa .p-seminar__entry .seminar-qa__main .seminar-qa__contact,
.p-seminar--qa .p-seminar__entry .seminar-qa__main .seminar-qa__intro,
.p-seminar--composer .p-seminar__entry .seminar-qa__main .seminar-qa__section,
.p-seminar--composer .p-seminar__entry .seminar-qa__main .seminar-qa__contact,
.p-seminar--composer .p-seminar__entry .seminar-qa__main .seminar-qa__intro,
.p-seminar--videoguides .p-seminar__entry .seminar-qa__main .seminar-qa__section,
.p-seminar--videoguides .p-seminar__entry .seminar-qa__main .seminar-qa__contact,
.p-seminar--videoguides .p-seminar__entry .seminar-qa__main .seminar-qa__intro,
.p-seminar--orchestra .p-seminar__entry .seminar-qa__main .seminar-qa__section,
.p-seminar--orchestra .p-seminar__entry .seminar-qa__main .seminar-qa__contact,
.p-seminar--orchestra .p-seminar__entry .seminar-qa__main .seminar-qa__intro {
grid-column: auto;
}
}
.p-seminar--qa .seminar-qa__section,
.p-seminar--composer .seminar-qa__section,
.p-seminar--videoguides .seminar-qa__section,
.p-seminar--orchestra .seminar-qa__section {
scroll-margin-top: var(--anchor-offset);
margin-top: 40px;
}
.p-seminar--qa .seminar-qa__section:first-of-type,
.p-seminar--composer .seminar-qa__section:first-of-type,
.p-seminar--videoguides .seminar-qa__section:first-of-type,
.p-seminar--orchestra .seminar-qa__section:first-of-type {
margin-top: 0;
}
@media (min-width: 992px) {
.p-seminar--qa .seminar-qa__section:first-of-type,
.p-seminar--composer .seminar-qa__section:first-of-type,
.p-seminar--videoguides .seminar-qa__section:first-of-type,
.p-seminar--orchestra .seminar-qa__section:first-of-type {
margin-top: 0;
}
}
.p-seminar--qa .seminar-qa__section > h2,
.p-seminar--composer .seminar-qa__section > h2,
.p-seminar--videoguides .seminar-qa__section > h2,
.p-seminar--orchestra .seminar-qa__section > h2 {
margin: 0 0 16px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.25rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.6;
}
.p-seminar--qa .seminar-qa__section > h2:first-child,
.p-seminar--composer .seminar-qa__section > h2:first-child,
.p-seminar--videoguides .seminar-qa__section > h2:first-child,
.p-seminar--orchestra .seminar-qa__section > h2:first-child {
margin-top: 0;
}
.p-seminar--qa .seminar-qa__section h3,
.p-seminar--composer .seminar-qa__section h3,
.p-seminar--videoguides .seminar-qa__section h3,
.p-seminar--orchestra .seminar-qa__section h3 {
margin: 24px 0 10px;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 1.0625rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.55;
}
.p-seminar--qa .seminar-qa__section h3:first-of-type,
.p-seminar--composer .seminar-qa__section h3:first-of-type,
.p-seminar--videoguides .seminar-qa__section h3:first-of-type,
.p-seminar--orchestra .seminar-qa__section h3:first-of-type {
margin-top: 16px;
}
.p-seminar--qa .seminar-qa__section > p:last-child,
.p-seminar--qa .seminar-qa__section .seminar-qa__answer > p:last-child,
.p-seminar--qa .seminar-qa__section .seminar-biography__profile > p:last-child,
.p-seminar--qa .seminar-qa__section .seminar-video__body > p:last-child,
.p-seminar--composer .seminar-qa__section > p:last-child,
.p-seminar--composer .seminar-qa__section .seminar-qa__answer > p:last-child,
.p-seminar--composer .seminar-qa__section .seminar-biography__profile > p:last-child,
.p-seminar--composer .seminar-qa__section .seminar-video__body > p:last-child,
.p-seminar--videoguides .seminar-qa__section > p:last-child,
.p-seminar--videoguides .seminar-qa__section .seminar-qa__answer > p:last-child,
.p-seminar--videoguides .seminar-qa__section .seminar-biography__profile > p:last-child,
.p-seminar--videoguides .seminar-qa__section .seminar-video__body > p:last-child,
.p-seminar--orchestra .seminar-qa__section > p:last-child,
.p-seminar--orchestra .seminar-qa__section .seminar-qa__answer > p:last-child,
.p-seminar--orchestra .seminar-qa__section .seminar-biography__profile > p:last-child,
.p-seminar--orchestra .seminar-qa__section .seminar-video__body > p:last-child {
margin-bottom: 0;
}
.p-seminar--qa .seminar-qa__section .seminar-qa__answer > p + p,
.p-seminar--qa .seminar-qa__section .seminar-biography__profile > p + p,
.p-seminar--qa .seminar-qa__section .seminar-video__body > p + p,
.p-seminar--composer .seminar-qa__section .seminar-qa__answer > p + p,
.p-seminar--composer .seminar-qa__section .seminar-biography__profile > p + p,
.p-seminar--composer .seminar-qa__section .seminar-video__body > p + p,
.p-seminar--videoguides .seminar-qa__section .seminar-qa__answer > p + p,
.p-seminar--videoguides .seminar-qa__section .seminar-biography__profile > p + p,
.p-seminar--videoguides .seminar-qa__section .seminar-video__body > p + p,
.p-seminar--orchestra .seminar-qa__section .seminar-qa__answer > p + p,
.p-seminar--orchestra .seminar-qa__section .seminar-biography__profile > p + p,
.p-seminar--orchestra .seminar-qa__section .seminar-video__body > p + p {
margin-top: 1em;
}
.p-seminar--qa .seminar-qa__section .seminar-figures,
.p-seminar--composer .seminar-qa__section .seminar-figures,
.p-seminar--videoguides .seminar-qa__section .seminar-figures,
.p-seminar--orchestra .seminar-qa__section .seminar-figures {
margin-top: 24px;
}
.p-seminar--qa .seminar-qa__section .seminar-figures__img,
.p-seminar--composer .seminar-qa__section .seminar-figures__img,
.p-seminar--videoguides .seminar-qa__section .seminar-figures__img,
.p-seminar--orchestra .seminar-qa__section .seminar-figures__img {
width: auto;
max-width: 100%;
height: auto;
}
.p-seminar--qa .seminar-qa__figure-float,
.p-seminar--composer .seminar-qa__figure-float,
.p-seminar--videoguides .seminar-qa__figure-float,
.p-seminar--orchestra .seminar-qa__figure-float {
margin: 0 0 12px 20px;
float: right;
}
@media (max-width: 767px) {
.p-seminar--qa .seminar-qa__figure-float,
.p-seminar--composer .seminar-qa__figure-float,
.p-seminar--videoguides .seminar-qa__figure-float,
.p-seminar--orchestra .seminar-qa__figure-float {
margin: 0 auto 16px;
float: none;
text-align: center;
}
}
.p-seminar--qa .seminar-qa__figure-img,
.p-seminar--composer .seminar-qa__figure-img,
.p-seminar--videoguides .seminar-qa__figure-img,
.p-seminar--orchestra .seminar-qa__figure-img {
display: block;
width: auto;
max-width: 100%;
height: auto;
}
.p-seminar--qa .seminar-qa__contact,
.p-seminar--composer .seminar-qa__contact,
.p-seminar--videoguides .seminar-qa__contact,
.p-seminar--orchestra .seminar-qa__contact {
margin-top: 48px;
padding-top: 24px;
border-top: 1px solid rgba(150, 139, 112, 0.25);
font-size: 0.92rem;
text-align: center;
}
.p-seminar--qa .seminar-video,
.p-seminar--composer .seminar-video,
.p-seminar--videoguides .seminar-video,
.p-seminar--orchestra .seminar-video {
margin: 0 0 8px;
}
.p-seminar--qa .seminar-video__embed,
.p-seminar--composer .seminar-video__embed,
.p-seminar--videoguides .seminar-video__embed,
.p-seminar--orchestra .seminar-video__embed {
aspect-ratio: 16/9;
position: relative;
width: 100%;
max-width: 640px;
background-color: rgba(0, 0, 0, 0.06);
}
.p-seminar--qa .seminar-video__embed iframe,
.p-seminar--composer .seminar-video__embed iframe,
.p-seminar--videoguides .seminar-video__embed iframe,
.p-seminar--orchestra .seminar-video__embed iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}
.p-seminar--qa .wp-block-embed.is-type-video,
.p-seminar--composer .wp-block-embed.is-type-video,
.p-seminar--videoguides .wp-block-embed.is-type-video,
.p-seminar--orchestra .wp-block-embed.is-type-video {
max-width: 640px;
margin: 0 0 8px;
}
.p-seminar--qa .wp-block-embed.is-type-video .wp-block-embed__wrapper,
.p-seminar--composer .wp-block-embed.is-type-video .wp-block-embed__wrapper,
.p-seminar--videoguides .wp-block-embed.is-type-video .wp-block-embed__wrapper,
.p-seminar--orchestra .wp-block-embed.is-type-video .wp-block-embed__wrapper {
aspect-ratio: 16/9;
}
.p-seminar--qa .wp-block-embed.is-type-video iframe,
.p-seminar--composer .wp-block-embed.is-type-video iframe,
.p-seminar--videoguides .wp-block-embed.is-type-video iframe,
.p-seminar--orchestra .wp-block-embed.is-type-video iframe {
width: 100%;
height: 100%;
}
.p-seminar--tuning .p-seminar__inner {
max-width: 780px;
}
.p-seminar--tuning .seminar-tuning-cta {
margin: 40px 0 0;
text-align: center;
}
.p-seminar--tuning .seminar-tuning-cta__link {
min-width: 240px;
height: 48px;
padding: 0 36px;
font-size: 1rem;
}
.p-seminar--tuning .seminar-tuning-footnotes {
margin-top: 40px;
padding-top: 24px;
border-top: 1px solid rgba(112, 112, 112, 0.12);
}
.p-seminar--tuning .seminar-tuning-footnotes__title {
margin: 0 0 16px;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 600;
}
.p-seminar--tuning .seminar-tuning-footnotes__list {
margin: 0;
padding-left: 1.25em;
color: #707070;
font-size: 0.9rem;
line-height: 1.7;
}
.p-seminar--tuning .seminar-tuning-footnotes__list li + li {
margin-top: 12px;
}
.p-seminar--tuning .seminar-tuning-footnote-ref {
text-underline-offset: 2px;
color: #c9a96e;
text-decoration: underline;
}
.p-seminar--tuning .seminar-tuning-footnote-ref:hover {
opacity: 0.85;
}
.p-seminar--tuning .seminar-tuning-table-wrap {
-webkit-overflow-scrolling: touch;
margin: 24px 0;
overflow-x: auto;
}
.p-seminar--tuning .seminar-tuning-table {
width: -moz-max-content;
width: max-content;
min-width: 100%;
border-collapse: collapse;
font-size: 0.8125rem;
line-height: 1.4;
}
.p-seminar--tuning .seminar-tuning-table td,
.p-seminar--tuning .seminar-tuning-table th {
padding: 4px 8px;
border: 1px solid rgba(112, 112, 112, 0.2);
vertical-align: middle;
white-space: nowrap;
}
.p-seminar--tuning .seminar-tuning-table__mark {
color: #c0392b;
font-weight: 700;
}
.p-seminar--tuning .p-seminar__entry .seminar-note + h2,
.p-seminar--tuning .p-seminar__entry aside.seminar-note + h2,
.p-seminar--tuning .p-seminar__entry [class*=lazyblock-seminar-note] + [class*=lazyblock-seminar-rich-section] {
margin-top: 40px;
}
.p-seminar--tuning .p-seminar__entry [class*=lazyblock-seminar-note] + [class*=lazyblock-seminar-rich-section] .seminar-section > h2:first-child {
margin-top: 0;
}
.p-seminar--tuning-data .p-seminar__inner {
max-width: 1040px;
}
.p-seminar--tuning-data .p-seminar__section-title {
font-size: 2.25rem;
line-height: 1.4;
}
@media (max-width: 767px) {
.p-seminar--tuning-data .p-seminar__section-title {
font-size: 1.75rem;
}
}
.p-seminar--tuning-data .seminar-tuning-data-nav {
margin: 0 0 32px;
padding-bottom: 24px;
border-bottom: 1px solid rgba(112, 112, 112, 0.12);
}
.p-seminar--tuning-data .seminar-tuning-data-nav__back {
margin: 0 0 16px;
font-size: 0.875rem;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__back-link {
color: #c9a96e;
text-decoration: none;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__back-link:hover {
text-decoration: underline;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__list {
gap: 8px 12px;
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin: 0;
padding: 0;
list-style: none;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__item {
display: flex;
margin: 0;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__link {
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 8px 14px;
border: 1px solid rgba(112, 112, 112, 0.2);
border-radius: 4px;
color: #707070;
font-size: 0.8125rem;
font-weight: 400;
line-height: 1.4;
text-align: center;
text-decoration: none;
transition: border-color 0.2s, color 0.2s, background-color 0.2s;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__link:hover {
border-color: #c9a96e;
color: #c9a96e;
}
.p-seminar--tuning-data .seminar-tuning-data-nav__link.is-current {
border-color: #c9a96e;
background-color: rgba(201, 169, 110, 0.08);
color: #c9a96e;
pointer-events: none;
}
.p-seminar--tuning-data .seminar-tuning-hub__lead {
margin: 0 0 28px;
line-height: 1.8;
}
.p-seminar--tuning-data .seminar-tuning-hub__cards {
gap: 20px;
display: grid;
grid-template-columns: minmax(0, 1fr);
margin: 0;
padding: 0;
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-seminar--tuning-data .seminar-tuning-hub__cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.p-seminar--tuning-data .seminar-tuning-hub__card {
margin: 0;
padding: 24px;
border: 1px solid rgba(112, 112, 112, 0.12);
border-radius: 4px;
background-color: #fff;
}
.p-seminar--tuning-data .seminar-tuning-hub__title {
margin: 0 0 12px;
font-family: "Noto Serif JP", serif;
font-size: 1.0625rem;
font-weight: 600;
line-height: 1.5;
}
.p-seminar--tuning-data .seminar-tuning-hub__text {
margin: 0 0 20px;
font-size: 0.9rem;
line-height: 1.7;
}
.p-seminar--tuning-data .seminar-tuning-hub__btn {
display: inline-flex;
min-width: 180px;
height: 48px;
padding: 0 28px;
font-size: 0.9375rem;
}
.p-seminar--tuning-data .seminar-tuning-table-wrap {
-webkit-overflow-scrolling: touch;
margin: 16px 0 32px;
overflow-x: auto;
}
.p-seminar--tuning-data .seminar-tuning-table {
width: -moz-max-content;
width: max-content;
min-width: 100%;
border-collapse: collapse;
font-size: 0.75rem;
line-height: 1.35;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-seminar--tuning-data .seminar-tuning-table {
font-size: 0.8125rem;
}
}
.p-seminar--tuning-data .seminar-tuning-table td,
.p-seminar--tuning-data .seminar-tuning-table th {
padding: 3px 6px;
border: 1px solid rgba(112, 112, 112, 0.2);
vertical-align: middle;
white-space: nowrap;
}
.p-seminar--tuning-data .seminar-tuning-table__mark {
color: #c0392b;
font-weight: 700;
}
.p-seminar--tuning-data h2 {
margin: 32px 0 12px;
font-family: "Noto Serif JP", serif;
font-size: 1.125rem;
font-weight: 600;
line-height: 1.5;
}
.p-seminar--tuning-data h2:first-child {
margin-top: 0;
}
.p-seminar--tuning-data p {
margin: 0 0 1em;
line-height: 1.8;
}
.p-seminar--daybreak .p-seminar__inner {
max-width: 780px;
}
.p-seminar--daybreak .p-seminar__section-title {
font-size: 2.25rem;
line-height: 1.4;
}
@media (max-width: 767px) {
.p-seminar--daybreak .p-seminar__section-title {
font-size: 1.75rem;
}
}
.p-seminar--daybreak .p-seminar__section-subtitle,
.p-seminar--daybreak-vol .p-seminar__section-subtitle {
margin-top: 12px;
margin-bottom: 0;
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.9375rem;
letter-spacing: 0.06em;
}
.p-seminar--daybreak .seminar-daybreak-nav,
.p-seminar--daybreak-vol .seminar-daybreak-nav {
margin: 0 0 32px;
padding-bottom: 24px;
border-bottom: 1px solid rgba(112, 112, 112, 0.12);
}
.p-seminar--daybreak .seminar-daybreak-nav__list,
.p-seminar--daybreak-vol .seminar-daybreak-nav__list {
gap: 8px 12px;
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin: 0;
padding: 0;
list-style: none;
}
.p-seminar--daybreak .seminar-daybreak-nav__item,
.p-seminar--daybreak-vol .seminar-daybreak-nav__item {
display: flex;
margin: 0;
}
.p-seminar--daybreak .seminar-daybreak-nav__link,
.p-seminar--daybreak-vol .seminar-daybreak-nav__link {
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 8px 14px;
border: 1px solid rgba(112, 112, 112, 0.2);
border-radius: 4px;
color: #707070;
font-size: 0.8125rem;
font-weight: 400;
line-height: 1.4;
text-align: center;
text-decoration: none;
transition: border-color 0.2s, color 0.2s, background-color 0.2s;
}
.p-seminar--daybreak .seminar-daybreak-nav__link:hover,
.p-seminar--daybreak-vol .seminar-daybreak-nav__link:hover {
border-color: #c9a96e;
color: #c9a96e;
}
.p-seminar--daybreak .seminar-daybreak-nav__link.is-current,
.p-seminar--daybreak-vol .seminar-daybreak-nav__link.is-current {
border-color: #c9a96e;
background-color: rgba(201, 169, 110, 0.08);
color: #c9a96e;
pointer-events: none;
}
.p-seminar--daybreak .seminar-daybreak-hub__lead,
.p-seminar--daybreak-vol .seminar-daybreak-hub__lead {
margin: 0 0 28px;
line-height: 1.8;
}
.p-seminar--daybreak .seminar-daybreak-hub__cards,
.p-seminar--daybreak-vol .seminar-daybreak-hub__cards {
gap: 20px;
display: grid;
grid-template-columns: minmax(0, 1fr);
margin: 0;
padding: 0;
list-style: none;
}
@media (min-width: 768px) and (max-width: 991px) {
.p-seminar--daybreak .seminar-daybreak-hub__cards,
.p-seminar--daybreak-vol .seminar-daybreak-hub__cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 992px) {
.p-seminar--daybreak .seminar-daybreak-hub__cards,
.p-seminar--daybreak-vol .seminar-daybreak-hub__cards {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
.p-seminar--daybreak .seminar-daybreak-hub__card,
.p-seminar--daybreak-vol .seminar-daybreak-hub__card {
margin: 0;
padding: 24px;
border: 1px solid rgba(112, 112, 112, 0.12);
border-radius: 4px;
background-color: #fff;
}
.p-seminar--daybreak .seminar-daybreak-hub__title,
.p-seminar--daybreak-vol .seminar-daybreak-hub__title {
margin: 0 0 12px;
font-family: "Noto Serif JP", serif;
font-size: 1.0625rem;
font-weight: 600;
line-height: 1.5;
}
.p-seminar--daybreak .seminar-daybreak-hub__text,
.p-seminar--daybreak-vol .seminar-daybreak-hub__text {
margin: 0 0 20px;
font-size: 0.9rem;
line-height: 1.7;
}
.p-seminar--daybreak .seminar-daybreak-hub__btn,
.p-seminar--daybreak-vol .seminar-daybreak-hub__btn {
display: inline-flex;
min-width: 120px;
height: 44px;
padding: 0 20px;
font-size: 0.9375rem;
}
.p-seminar--daybreak .seminar-daybreak-author,
.p-seminar--daybreak-vol .seminar-daybreak-author {
margin: 40px auto 0;
text-align: center;
}
.p-seminar--daybreak .seminar-daybreak-author__credit,
.p-seminar--daybreak-vol .seminar-daybreak-author__credit {
margin: 0;
color: #5d4307;
font-family: "Noto Serif JP", serif;
font-size: 0.9375rem;
letter-spacing: 0.04em;
line-height: 1.6;
}
.p-seminar--daybreak .seminar-daybreak-author__note,
.p-seminar--daybreak-vol .seminar-daybreak-author__note {
margin: 16px 0 0;
padding: 16px 18px;
border: 1px solid rgba(112, 112, 112, 0.1);
border-radius: 4px;
background-color: rgba(201, 169, 110, 0.06);
color: #968b70;
font-family: "Noto Sans JP", sans-serif;
font-size: 0.8125rem;
line-height: 1.75;
text-align: left;
}
.p-seminar--daybreak .seminar-daybreak__section-title,
.p-seminar--daybreak-vol .seminar-daybreak__section-title {
margin: 0 0 24px;
font-family: "Noto Serif JP", serif;
font-size: 1.375rem;
font-weight: 600;
line-height: 1.5;
}
.p-seminar--daybreak .seminar-daybreak-figure,
.p-seminar--daybreak-vol .seminar-daybreak-figure {
margin: 16px 0 24px;
text-align: center;
}
.p-seminar--daybreak .seminar-daybreak-figure img,
.p-seminar--daybreak-vol .seminar-daybreak-figure img {
width: auto;
max-width: 100%;
height: auto;
}
.p-seminar--daybreak .seminar-daybreak-figure--right,
.p-seminar--daybreak-vol .seminar-daybreak-figure--right {
max-width: min(220px, 45%);
margin: 0 0 16px 20px;
float: right;
}
@media (max-width: 767px) {
.p-seminar--daybreak .seminar-daybreak-figure--right,
.p-seminar--daybreak-vol .seminar-daybreak-figure--right {
max-width: 100%;
margin: 16px auto 24px;
float: none;
}
}
.p-seminar--daybreak .p-seminar__entry::after,
.p-seminar--daybreak-vol .p-seminar__entry::after {
display: table;
clear: both;
content: "";
}
.p-seminar--daybreak-vol .p-seminar__inner {
max-width: 780px;
}
.p-seminar--daybreak-vol .p-seminar__section-title {
font-size: 2rem;
line-height: 1.4;
}
@media (max-width: 767px) {
.p-seminar--daybreak-vol .p-seminar__section-title {
font-size: 1.625rem;
}
}