body .handling-schools__hero {
overflow: hidden;
padding: clamp(64px, 8vw, 112px) 0;
background: linear-gradient(125deg, #0f394a 0%, #174f61 58%, #176e82 100%);
}
body .handling-schools__hero .container {
display: grid;
grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr);
align-items: end;
gap: clamp(44px, 8vw, 110px);
padding-top: 0;
padding-bottom: 0;
border: 0;
}
body .handling-schools__hero .container::before {
top: auto;
right: -12%;
bottom: -220px;
left: auto;
width: 520px;
height: 520px;
border: 1px solid rgba(255,255,255,.1);
border-radius: 50%;
background: transparent;
}
body .handling-schools__hero-copy > span { margin-bottom: 20px; color: #f2b7bd; font-size: 11px; letter-spacing: .25em; }
body .handling-schools__hero h1 { color: #fff; font-size: clamp(38px, 5.6vw, 70px); line-height: 1.28; letter-spacing: .03em; }
body .handling-schools__hero h1 .handling-schools__hero-result { display: inline-block; margin: 0; color: inherit; white-space: nowrap; font-size: .86em; font-weight: inherit; letter-spacing: .02em; text-transform: none; }
body .handling-schools__stats dd, body .handling-schools__nav a span em, body .handling-school-group__head h2 strong { white-space: nowrap; font-variant-numeric: tabular-nums; }
body .handling-schools__hero h1 em { color: #f5c1c5; font-family: "Noto Sans JP", sans-serif; font-size: 1.18em; font-style: normal; font-weight: 800; letter-spacing: -.02em; }
body .handling-schools__hero p { max-width: 650px; margin-top: 24px; color: rgba(255,255,255,.75); line-height: 2; }
body .handling-schools__stats { position: relative; z-index: 1; margin: 0; border-top: 1px solid rgba(255,255,255,.22); }
body .handling-schools__stats > div { display: flex; align-items: baseline; justify-content: space-between; padding: 17px 4px; border-bottom: 1px solid rgba(255,255,255,.22); }
body .handling-schools__stats dt { color: rgba(255,255,255,.72); font-size: 13px; font-weight: 700; }
body .handling-schools__stats dd { margin: 0; color: #fff; font-family: "Noto Sans JP", sans-serif; font-size: clamp(29px, 3.5vw, 42px); font-weight: 800; letter-spacing: -.02em; line-height: 1; }
body .handling-schools__stats dd small { margin-left: 7px; color: #f2b7bd; font-family: "Noto Sans JP", sans-serif; font-size: 10px; font-weight: 700; }
body .handling-schools { background: #f7faf9; }
body .handling-school-group { padding: clamp(54px, 6vw, 76px) 0; }
body .handling-school-group + .handling-school-group { border-top: 1px solid #e0e9eb; }
body .handling-school-group__head { align-items: start; margin-bottom: 30px; }
body .handling-school-group__head h2 { display: flex; align-items: baseline; gap: 18px; }
body .handling-school-group__head h2 strong { color: #d69a9f; font-family: "Noto Sans JP", sans-serif; font-size: .78em; font-weight: 800; letter-spacing: -.02em; }
body .handling-school-group__head h2 strong small { margin-left: 4px; color: #82969d; font-family: "Noto Sans JP", sans-serif; font-size: 10px; }
body .handling-school-group__summary { padding-left: clamp(20px, 4vw, 48px); border-left: 1px solid #dce6e8; }
body .handling-school-group__summary p { margin-bottom: 14px; }
body .handling-school-group__summary > small { display: block; margin-bottom: 5px; color: #9aabb0; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
body .handling-school-group__summary > b { color: #18738d; font-size: 13px; }
body .handling-school-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; border: 0; }
body .handling-school-card {
min-height: 76px;
flex-direction: row;
align-items: center;
padding: 15px 18px;
border: 1px solid #dce6e8;
border-radius: 8px;
background: #fff;
box-shadow: 0 3px 12px rgba(23, 54, 68, .035);
}
body .handling-school-card:hover { border-color: #b9cdd2; box-shadow: 0 5px 16px rgba(23, 54, 68, .06); transform: none; }
body .handling-school-card h3 { max-width: none; margin: 0; color: #173644; font-size: clamp(14px, 1.25vw, 16px); line-height: 1.45; }
body .handling-school-card h3 small { display: block; margin-bottom: 3px; color: #84979e; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
@media (max-width: 760px) {
body .handling-schools__hero { padding: 58px 0 52px; }
body .handling-schools__hero .container { grid-template-columns: 1fr; gap: 38px; }
body .handling-schools__hero h1 br { display: none; }
body .handling-schools__stats { display: grid; grid-template-columns: repeat(3, 1fr); }
body .handling-schools__stats > div { display: block; padding: 13px 8px; border-right: 1px solid rgba(255,255,255,.2); text-align: center; }
body .handling-schools__stats > div:last-child { border-right: 0; }
body .handling-schools__stats dd { margin-top: 8px; }
body .handling-school-group__head { gap: 20px; }
body .handling-school-group__summary { padding: 0; border-left: 0; }
body .handling-school-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
body .handling-school-card { min-height: 70px; padding: 13px 14px; }
}
@media (max-width: 480px) {
body .handling-school-grid { grid-template-columns: 1fr; }
body .handling-school-card { min-height: 0; }
}
body .privacy__intro .privacy__updated {
margin-top: 16px;
color: #71878f;
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
} body .shop-guide .shop-guide__section-head {
grid-template-columns: minmax(420px, 1.15fr) minmax(280px, .85fr) !important;
} .service-guide { overflow: hidden; background: #f6f9f9; color: #173644; }
.service-guide__hero { position: relative; padding: clamp(70px, 8vw, 112px) 0; background: linear-gradient(120deg, #103b4c 0%, #17667a 100%); color: #fff; }
.service-guide__hero::after { content: ""; position: absolute; right: -110px; bottom: -260px; width: 520px; height: 520px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.service-guide__hero .container { position: relative; z-index: 1; }
.service-guide__eyebrow { margin: 0 0 18px; color: #f2bcc1; font-size: 12px; font-weight: 800; letter-spacing: .24em; }
.service-guide__hero h1 { max-width: 820px; margin: 0; color: #fff; font-size: clamp(36px, 5.3vw, 66px); line-height: 1.3; letter-spacing: .04em; }
.service-guide__lead { max-width: 700px; margin: 25px 0 0; color: rgba(255,255,255,.82); font-size: clamp(14px, 1.5vw, 17px); line-height: 2; }
.service-guide__nav { position: sticky; top: 0; z-index: 10; border-bottom: 1px solid #d9e5e7; background: rgba(255,255,255,.96); box-shadow: 0 5px 18px rgba(23,54,68,.05); backdrop-filter: blur(8px); }
body.admin-bar .service-guide__nav { top: 32px; }
.service-guide__nav[hidden] { display: none; }
.service-guide__nav .container { display: flex; align-items: center; gap: 28px; min-height: 74px; }
.service-guide__nav p { flex: 0 0 auto; margin: 0; color: #71868e; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.service-guide__nav-links { display: flex; align-items: stretch; gap: 8px; overflow-x: auto; padding: 10px 0; scrollbar-width: thin; }
.service-guide__nav-links a { display: flex; align-items: center; min-height: 42px; padding: 0 17px; border: 1px solid #d5e1e4; border-radius: 999px; background: #fff; color: #173644; font-size: 13px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.service-guide__nav-links a:hover { border-color: #187b92; color: #187b92; }
.service-guide__content { max-width: 1180px; margin: 0 auto; padding: clamp(58px, 7vw, 92px) 24px; }
.service-guide__content > * { max-width: 100%; }
.service-guide__content > .wp-block-group,
.service-guide__content > section,
.service-guide__content > article { margin: 0 0 28px; padding: clamp(28px, 4vw, 48px); border: 1px solid #dce7e9; border-radius: 14px; background: #fff; box-shadow: 0 8px 28px rgba(23,54,68,.045); }
.service-guide__content h2 { scroll-margin-top: 110px; margin: 0 0 22px; color: #173644; font-size: clamp(25px, 3vw, 38px); line-height: 1.4; letter-spacing: .03em; }
.service-guide__content h2::after { content: ""; display: block; width: 42px; height: 3px; margin-top: 15px; background: #dc949b; }
.service-guide__content h3 { margin: 30px 0 12px; color: #176b80; font-size: clamp(18px, 2vw, 23px); line-height: 1.55; }
.service-guide__content p,
.service-guide__content li { color: #526f79; font-size: 15px; line-height: 1.9; }
.service-guide__content ul,
.service-guide__content ol { padding-left: 1.35em; }
.service-guide__content img { display: block; width: 100%; height: auto; border-radius: 10px; }
.service-guide__content .wp-block-columns { gap: clamp(24px, 4vw, 48px); align-items: center; }
.service-guide__content .wp-block-button__link { padding: 14px 24px; border-radius: 4px; background: #176e84; color: #fff; font-size: 14px; font-weight: 800; }
.service-guide__original-print { position: relative; isolation: isolate; }
.service-guide__original-print-title { position: relative; z-index: 2; display: inline-block; padding: 12px 18px !important; border-radius: 5px; background: #123e4e !important; color: #fff !important; text-shadow: none !important; opacity: 1 !important; }
.service-guide__original-print-title::after { display: none !important; }
.service-guide__contact { padding: clamp(56px, 7vw, 86px) 0; background: #e8f0f1; }
.service-guide__contact .container { display: grid; grid-template-columns: 1fr auto; gap: 42px; align-items: center; }
.service-guide__contact p { margin: 0 0 10px; color: #d17f88; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.service-guide__contact h2 { margin: 0 0 10px; color: #173644; font-size: clamp(24px, 3vw, 36px); }
.service-guide__contact span { color: #607983; font-size: 14px; line-height: 1.8; }
.service-guide__contact a { display: flex; align-items: center; gap: 28px; padding: 18px 22px; border: 1px solid #bfcfd3; background: #fff; color: #173644; font-size: 14px; font-weight: 800; text-decoration: none; }
.service-guide__contact a b { color: #17788e; font-size: 18px; }
@media (max-width: 760px) {
.service-guide__hero { padding: 58px 0 54px; }
.service-guide__hero h1 br { display: none; }
.service-guide__nav { position: static; }
.service-guide__nav .container { display: block; padding-top: 14px; }
.service-guide__nav-links { margin: 0 -24px; padding: 9px 24px 14px; }
.service-guide__content { padding-right: 16px; padding-left: 16px; }
.service-guide__content > .wp-block-group,
.service-guide__content > section,
.service-guide__content > article { padding: 25px 20px; border-radius: 10px; }
.service-guide__content .wp-block-columns { gap: 20px; }
.service-guide__contact .container { grid-template-columns: 1fr; gap: 26px; }
.service-guide__contact a { justify-content: space-between; width: 100%; }
} .measurement-booking { background: #f5f8f9; color: #143746; }
.measurement-booking__hero { position: relative; overflow: hidden; padding: clamp(88px, 10vw, 154px) 0 clamp(76px, 9vw, 130px); background: linear-gradient(112deg, rgba(12,65,82,.94), rgba(19,113,137,.79)), url(//www.makino-h.com/macaw/wp-content/themes/xdev-theme/assets/images/reserve-time-banner.webp) center/cover; color: #fff; text-align: center; }
.measurement-booking__hero::before,.measurement-booking__hero::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(255,255,255,.18); }
.measurement-booking__hero::before { width:340px; height:340px; top:-210px; right:7%; }
.measurement-booking__hero::after { width:220px; height:220px; bottom:-155px; left:12%; }
.measurement-booking__hero .container { position:relative; z-index:1; }
.measurement-booking__eyebrow { margin:0 0 16px; color:#f2c1c5; font:700 13px/1.2 sans-serif; letter-spacing:.25em; }
.measurement-booking__hero h1 { margin:0; color:#fff; font-size:clamp(42px,6vw,76px); line-height:1.15; letter-spacing:.08em; }
.measurement-booking__lead { margin:24px auto 0; font-size:clamp(16px,2vw,20px); line-height:2; letter-spacing:.06em; }
.measurement-booking__hero--compact { padding:72px 0 62px; }
.measurement-booking__hero--compact h1 { font-size:clamp(38px,5vw,58px); }
.measurement-booking__body { padding:0 0 clamp(80px,10vw,140px); }
.measurement-booking__body > .container { max-width:1120px; }
.measurement-booking__steps { display:grid; grid-template-columns:repeat(3,1fr); margin:-38px auto 72px; padding:0; position:relative; z-index:2; list-style:none; background:#fff; border-radius:16px; box-shadow:0 18px 50px rgba(16,62,78,.12); overflow:hidden; }
.measurement-booking__steps li { position:relative; display:grid; grid-template-columns:auto 1fr; gap:3px 16px; align-items:center; padding:25px 30px; text-align:left; }
.measurement-booking__steps li+li { border-left:1px solid #dce8eb; }
.measurement-booking__steps li+li::before { content:""; position:absolute; left:-6px; width:11px; height:11px; background:#fff; border-top:1px solid #dce8eb; border-right:1px solid #dce8eb; transform:rotate(45deg); }
.measurement-booking__steps span { grid-row:1/3; color:#dd8d96; font:700 13px/1 sans-serif; letter-spacing:.12em; }
.measurement-booking__steps strong { color:#143746; font-size:17px; line-height:1.4; }
.measurement-booking__steps small { color:#78909a; font-size:12px; }
.measurement-booking__notice { display:grid; grid-template-columns:1fr 330px; gap:48px; align-items:center; margin-bottom:48px; padding:38px 44px; background:#fff; border:1px solid #dbe8eb; border-radius:18px; }
.measurement-booking__notice-label { margin:0 0 8px; color:#16839d; font:700 12px/1.4 sans-serif; letter-spacing:.14em; }
.measurement-booking__notice h2 { margin:0 0 12px; color:#143746; font-size:clamp(21px,3vw,29px); }
.measurement-booking__notice p:last-child { margin:0; color:#607b86; line-height:1.9; }
.measurement-booking__phone { display:flex; flex-direction:column; padding:22px 28px; background:#123e4e; border-radius:12px; color:#fff!important; text-decoration:none!important; transition:.25s ease; }
.measurement-booking__phone:hover { background:#187f98; transform:translateY(-2px); }
.measurement-booking__phone small { color:#bad3db; font-size:12px; }
.measurement-booking__phone strong { margin:5px 0; color:#fff; font:700 clamp(25px,3vw,32px)/1.25 Arial,sans-serif; letter-spacing:.04em; white-space:nowrap; }
.measurement-booking__phone span { font-size:12px; }
.measurement-booking__calendar,.measurement-booking__form-card { padding:clamp(28px,5vw,58px); background:#fff; border-radius:20px; box-shadow:0 18px 60px rgba(16,62,78,.09); }
.measurement-booking__calendar-heading { display:flex; justify-content:space-between; gap:30px; align-items:flex-end; margin-bottom:36px; padding-bottom:25px; border-bottom:1px solid #dce8eb; }
.measurement-booking__calendar-heading p { margin:0 0 7px; color:#dd8d96; font:700 12px/1 sans-serif; letter-spacing:.18em; }
.measurement-booking__calendar-heading h2 { margin:0; color:#143746; font-size:clamp(23px,3vw,32px); }
.measurement-booking__calendar-heading ul { display:flex; flex-wrap:wrap; gap:10px 18px; margin:0; padding:0; list-style:none; color:#607b86; font-size:13px; }
.measurement-booking__calendar-heading b { color:#16839d; font-size:18px; }
.measurement-booking .reserve-form > p { margin:0; }
.measurement-booking .reserve-date__content,.measurement-booking .reserve-form > p > .section--title,.measurement-booking .reserve-form > p > br { display:none; }
.measurement-booking .monthly-calendar table { width:100%; border-collapse:separate; border-spacing:7px; table-layout:fixed; }
.measurement-booking .monthly-calendar caption { caption-side:top; margin-bottom:24px; color:#143746; font-size:clamp(24px,4vw,34px); font-weight:700; text-align:center; }
.measurement-booking .monthly-calendar th { padding:10px 2px; border:0; color:#69828c; background:transparent; font-size:13px; }
.measurement-booking .monthly-calendar th.sun { color:#d87983; }.measurement-booking .monthly-calendar th.sat { color:#2587a0; }
.measurement-booking .monthly-calendar td { height:78px; padding:8px; border:1px solid #dce8eb; border-radius:10px; background:#f8fafb; text-align:center; vertical-align:middle; }
.measurement-booking .monthly-calendar td:not(.disable):not(.no-day) { background:#eef9fb; border-color:#8fcbd7; box-shadow:0 3px 10px rgba(22,131,157,.08); }
.measurement-booking .monthly-calendar td:not(.disable):not(.no-day):hover { background:#dff3f7; transform:translateY(-2px); }
.measurement-booking .monthly-calendar td a { display:flex; flex-direction:column; height:100%; align-items:center; justify-content:center; color:#116f87; text-decoration:none; }
.measurement-booking .day-number { color:#566f79; font-size:14px; line-height:1; }
.measurement-booking .calendar-mark { margin-top:7px; color:#16839d; font-size:23px; font-weight:700; line-height:1; }
.measurement-booking td.disable { opacity:.55; }.measurement-booking td.no-day { border-color:transparent; background:transparent; }
.measurement-booking .today { outline:2px solid #e4a0a7; outline-offset:1px; }
.measurement-booking .monthly-prev-next { display:flex; justify-content:space-between; align-items:center; margin-top:24px; }
.measurement-booking .monthly-prev,.measurement-booking .monthly-next { float:none; width:auto; }
.measurement-booking .monthly-prev-next a,.measurement-booking .monthly-prev-next .no-link { display:inline-flex; padding:11px 18px; border:1px solid #b9d4da; border-radius:99px; color:#176f85; text-decoration:none; }
.measurement-booking .monthly-prev-next .no-link { opacity:.4; }
.measurement-booking__footnote { margin:22px 0 0; color:#6e858e; font-size:13px; text-align:center; }
.measurement-booking--form .measurement-booking__steps { margin-top:-32px; margin-bottom:46px; }
.measurement-booking__steps--form .is-current { background:#eef8fa; }
.measurement-booking__form-card { margin-bottom:24px; }
.measurement-booking__back { display:inline-block; color:#176f85; text-decoration:none; }
.measurement-booking .booking-form table { width:100%; border-collapse:collapse; }
.measurement-booking .booking-form th,.measurement-booking .booking-form td { padding:18px; border-bottom:1px solid #dce8eb; text-align:left; }
.measurement-booking .booking-form input[type="text"],.measurement-booking .booking-form input[type="email"],.measurement-booking .booking-form input[type="tel"],.measurement-booking .booking-form textarea,.measurement-booking .booking-form select { max-width:100%; padding:13px 14px; border:1px solid #bcd0d6; border-radius:8px; background:#fff; font-size:16px; }
.measurement-booking .booking-form input[type="submit"],.measurement-booking .booking-form button { min-width:220px; padding:15px 28px; border:0; border-radius:99px; background:#167f98; color:#fff; font-weight:700; cursor:pointer; }
@media (max-width: 760px) {
.measurement-booking__hero { padding:74px 20px 86px; }
.measurement-booking__lead br { display:none; }
.measurement-booking__steps { margin:-32px 12px 44px; }
.measurement-booking__steps li { display:flex; justify-content:center; padding:19px 8px; gap:8px; text-align:center; }
.measurement-booking__steps small { display:none; }.measurement-booking__steps strong { font-size:13px; }.measurement-booking__steps span { font-size:10px; }
.measurement-booking__notice { grid-template-columns:1fr; gap:24px; padding:28px 24px; }
.measurement-booking__calendar,.measurement-booking__form-card { padding:25px 13px; border-radius:14px; }
.measurement-booking__calendar-heading { display:block; }.measurement-booking__calendar-heading ul { margin-top:20px; }
.measurement-booking .monthly-calendar table { border-spacing:3px; }
.measurement-booking .monthly-calendar td { height:58px; padding:3px; border-radius:7px; }
.measurement-booking .day-number { font-size:12px; }.measurement-booking .calendar-mark { font-size:19px; }
.measurement-booking .monthly-prev-next a,.measurement-booking .monthly-prev-next .no-link { padding:9px 11px; font-size:12px; }
.measurement-booking .booking-form th,.measurement-booking .booking-form td { display:block; width:100%; padding:12px 6px; }
} @media (max-width: 1024px) {
body.home .school-section__inner,
body.home .purpose-section__inner,
body.home .support-section__inner,
body.home .items-section__inner,
body.home .brand-section__inner,
body.home .news-section__inner {
display: flex !important;
grid-template-columns: none !important;
align-items: stretch !important;
gap: 16px !important;
width: auto !important;
max-width: none !important;
margin-right: calc(50% - 50vw) !important;
margin-left: calc(50% - 50vw) !important;
padding: 4px max(20px, calc((100vw - 960px) / 2)) 24px !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scroll-snap-type: x mandatory;
scroll-padding-inline: 20px;
overscroll-behavior-inline: contain;
-webkit-overflow-scrolling: touch;
scrollbar-width: thin;
scrollbar-color: #df9ca3 #e6eff1;
}
body.home .school-section__inner::-webkit-scrollbar,
body.home .purpose-section__inner::-webkit-scrollbar,
body.home .support-section__inner::-webkit-scrollbar,
body.home .items-section__inner::-webkit-scrollbar,
body.home .brand-section__inner::-webkit-scrollbar,
body.home .news-section__inner::-webkit-scrollbar { height: 4px; }
body.home .school-section__inner::-webkit-scrollbar-track,
body.home .purpose-section__inner::-webkit-scrollbar-track,
body.home .support-section__inner::-webkit-scrollbar-track,
body.home .items-section__inner::-webkit-scrollbar-track,
body.home .brand-section__inner::-webkit-scrollbar-track,
body.home .news-section__inner::-webkit-scrollbar-track { background: #e6eff1; border-radius: 20px; }
body.home .school-section__inner::-webkit-scrollbar-thumb,
body.home .purpose-section__inner::-webkit-scrollbar-thumb,
body.home .support-section__inner::-webkit-scrollbar-thumb,
body.home .items-section__inner::-webkit-scrollbar-thumb,
body.home .brand-section__inner::-webkit-scrollbar-thumb,
body.home .news-section__inner::-webkit-scrollbar-thumb { background: #df9ca3; border-radius: 20px; }
body.home .school-section__inner > article,
body.home .purpose-section__inner > .purpose-section__card,
body.home .support-section__inner > article,
body.home .items-section__inner > article,
body.home .brand-section__inner > article,
body.home .news-section__inner > .news__item {
flex: 0 0 min(46vw, 430px) !important;
width: min(46vw, 430px) !important;
min-width: 0 !important;
max-width: none !important;
height: auto !important;
margin: 0 !important;
scroll-snap-align: start;
}
body.home .school-section__inner > article > *,
body.home .items-section__inner > article > *,
body.home .brand-section__inner > article > * { width: 100% !important; }
}
@media (max-width: 600px) {
body.home .school-section__inner,
body.home .purpose-section__inner,
body.home .support-section__inner,
body.home .items-section__inner,
body.home .brand-section__inner,
body.home .news-section__inner {
gap: 12px !important;
padding-right: 20px !important;
padding-left: 20px !important;
scroll-padding-inline: 20px;
}
body.home .school-section__inner > article,
body.home .purpose-section__inner > .purpose-section__card,
body.home .support-section__inner > article,
body.home .items-section__inner > article,
body.home .brand-section__inner > article,
body.home .news-section__inner > .news__item {
flex-basis: 82vw !important;
width: 82vw !important;
}
body.home .support-section__callout { margin-top: 12px !important; }
} body.home .contact-access-section__panel,
body.home .contact-access-section__panel button,
body.home .contact-access-section__panel a,
body.home .contact-access-section__panel span,
body.home .contact-access-section__panel h3,
body.home .contact-access-section__panel p {
font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif !important;
}
body.home .contact-access-card--tel h3,
body.home .contact-access-card--tel h3 a {
font-weight: 700 !important;
font-variant-numeric: tabular-nums;
letter-spacing: -.025em !important;
}
body.home .contact-access-card--tel h3 {
max-width: 100% !important;
font-size: clamp(27px, 2.45vw, 36px) !important;
}
body.home .contact-access-card--tel h3 a {
display: block;
max-width: 100%;
}
body.home .contact-access-card > span,
body.home .contact-access-card p,
body.home .contact-access-card__button {
font-weight: 700 !important;
}
body.home .items-section .section__lead a {
display: inline-block;
color: #176f85;
font-weight: 800;
white-space: nowrap;
text-decoration: underline;
text-decoration-color: #efb2b7;
text-decoration-thickness: 2px;
text-underline-offset: 4px;
}
body.home .items-section .section__lead a:hover,
body.home .items-section .section__lead a:focus-visible {
color: #0f4f61;
}
body.home .items-section .items-section__lead > span {
display: block;
word-break: auto-phrase;
overflow-wrap: break-word;
}
body.home .items-section .items-section__lead > span + span {
margin-top: .55em;
}
body .shop-guide .shop-guide__section-head h2 {
max-width: none !important;
font-size: clamp(28px, 3vw, 39px) !important;
line-height: 1.45 !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
white-space: nowrap !important;
}
body .shop-guide .shop-guide__section-head p {
word-break: auto-phrase !important;
overflow-wrap: break-word !important;
} body.home .banner {
position: relative !important;
isolation: isolate !important;
margin-bottom: clamp(55px, 7vw, 95px) !important;
}
body.home .banner__slider {
position: relative !important;
z-index: 1 !important;
height: clamp(520px, 56vw, 720px) !important;
overflow: hidden !important;
border-radius: 42px !important;
}
body.home .banner__slider::before {
background: linear-gradient(90deg, rgba(5,27,43,.38) 0%, rgba(5,27,43,.12) 46%, rgba(5,27,43,0) 70%), linear-gradient(180deg, transparent 58%, rgba(5,27,43,.12) 100%) !important;
}
body.home .banner__slider .banner__slide {
opacity: 0;
animation: macawHeroSlide 18s cubic-bezier(.42, 0, .24, 1) infinite !important;
}
body.home .banner__slider .banner__slide--store {
opacity: 1;
animation-delay: 0s !important;
}
body.home .banner__slider .banner__slide--uniform { animation-delay: 6s !important; }
body.home .banner__slider .banner__slide--school { animation-delay: 12s !important; }
body.home .banner:hover .banner__slider .banner__slide { animation-play-state: running !important; }
body.home .banner__description {
position: absolute !important;
top: auto !important;
right: auto !important;
bottom: clamp(42px, 6vw, 78px) !important;
left: clamp(28px, 7vw, 105px) !important;
z-index: 4 !important;
display: block !important;
width: min(650px, calc(100% - 56px)) !important;
max-width: 650px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
backdrop-filter: none !important;
text-align: left !important;
}
body.home .banner__eyebrow {
display: inline-flex !important;
margin: 0 0 18px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #f4c3c7 !important;
font-family: Georgia, serif !important;
font-size: 11px !important;
letter-spacing: .16em !important;
text-transform: uppercase !important;
text-shadow: 0 2px 14px rgba(3,22,34,.72) !important;
}
body.home .banner__description h2 {
max-width: 580px !important;
margin: 0 0 18px !important;
color: #fff !important;
font-size: clamp(31px, 3.5vw, 50px) !important;
line-height: 1.4 !important;
text-align: left !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
text-wrap: balance !important;
text-shadow: 0 3px 20px rgba(3,22,34,.78), 0 1px 3px rgba(3,22,34,.9) !important;
}
body.home .banner__description h2::after { display: none !important; }
body.home .banner__description > p:not(.banner__eyebrow) {
max-width: 560px !important;
margin: 0 !important;
color: rgba(255,255,255,.82) !important;
font-size: clamp(13px, 1.15vw, 16px) !important;
font-weight: 600 !important;
line-height: 1.9 !important;
text-align: left !important;
word-break: auto-phrase !important;
overflow-wrap: break-word !important;
text-shadow: 0 2px 12px rgba(3,22,34,.82) !important;
} .footer.footer--macaw .footer__lead--inner { grid-template-columns: minmax(0, 1fr) auto !important; column-gap: clamp(24px, 4vw, 52px) !important; }
.footer.footer--macaw .footer__lead h2 { max-width: 820px !important; font-size: clamp(26px, 2.8vw, 40px) !important; line-height: 1.45 !important; word-break: auto-phrase !important; overflow-wrap: normal !important; text-wrap: balance !important; }
.footer.footer--macaw .footer__about-copy, .footer.footer--macaw .footer__nav-group p, .footer.footer--macaw .footer__bottom p { word-break: auto-phrase !important; overflow-wrap: break-word !important; }
.footer.footer--macaw .footer__info dd, .footer.footer--macaw .footer__nav a, .footer.footer--macaw .footer__lead-actions a { word-break: keep-all !important; overflow-wrap: normal !important; }
.footer.footer--macaw .footer__info dd, .footer.footer--macaw .footer__info dd a { font-variant-numeric: tabular-nums; }
@media (max-width: 980px) {
body .shop-guide .shop-guide__section-head, .footer.footer--macaw .footer__lead--inner { grid-template-columns: 1fr !important; }
body .shop-guide .shop-guide__section-head h2 { white-space: normal !important; }
}
@media (max-width: 700px) {
body.home .banner { width: calc(100% - 20px) !important; }
body.home .banner__slider { height: 560px !important; border-radius: 28px !important; }
body.home .banner__description { right: 28px !important; bottom: 32px !important; left: 28px !important; width: auto !important; padding: 0 !important; }
body.home .banner__description h2 { font-size: clamp(27px, 8.3vw, 38px) !important; }
body.home .banner__social { display: none !important; }
} .measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset {
padding: clamp(24px, 4vw, 42px) !important;
border: 0 !important;
background: linear-gradient(125deg, #103c4c, #176f85) !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset legend {
display: block !important;
margin-bottom: 20px !important;
color: #fff !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset table {
max-width: none !important;
margin: 0 !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset table tr th {
display: block !important;
width: 100% !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
color: #bcd8df !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset table tr td {
display: block !important;
width: 100% !important;
padding: 0 !important;
border: 0 !important;
color: #fff !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset table tr:first-child td {
color: #fff !important;
font-size: clamp(22px, 3.5vw, 32px) !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .input-number {
float: none !important;
width: 100% !important;
margin: 0 !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .input-number select {
width: auto !important;
min-width: 160px !important;
height: auto !important;
margin: 0 !important;
border: 1px solid rgba(255,255,255,.55) !important;
padding: 13px 16px !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table,
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset table {
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr th,
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr td,
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset table tr th,
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset table tr td {
display: block !important;
width: auto !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
color: #284c5a !important;
text-align: left !important;
line-height: 1.6 !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr th,
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset table tr th {
padding-top: 12px !important;
}
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset table tr th {
display: block !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr th label {
display: block !important;
color: #284c5a !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset .required {
color: #ca6470 !important;
}
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset {
margin: 0 !important;
padding: clamp(24px, 4vw, 42px) !important;
border: 1px solid #d9e6e9 !important;
}
.measurement-booking--form .booking-form #booking-form #action-button button {
width: auto !important;
max-width: none !important;
padding: 14px 42px !important;
border: 0 !important;
border-radius: 999px !important;
background: linear-gradient(110deg, #126f87, #1795ad) !important;
color: #fff !important;
letter-spacing: normal !important;
}
@media (max-width: 700px) {
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr,
.measurement-booking--form .booking-form #booking-form #booking-message-fieldset table tr {
display: grid !important;
grid-template-columns: 1fr !important;
}
.measurement-booking--form .booking-form #booking-form #action-button button { width: 100% !important; }
}
@media (max-width: 560px) {
body .shop-guide .shop-guide__section-head h2 { font-size: clamp(27px, 9vw, 36px) !important; word-break: auto-phrase !important; }
.footer.footer--macaw .footer__lead h2 { font-size: clamp(23px, 7vw, 30px) !important; }
.footer.footer--macaw .footer__info dd, .footer.footer--macaw .footer__nav a, .footer.footer--macaw .footer__lead-actions a { word-break: auto-phrase !important; overflow-wrap: break-word !important; }
}
@media (prefers-reduced-motion: reduce) {
body.home .banner__slider .banner__slide { animation: macawHeroSlide 18s cubic-bezier(.42, 0, .24, 1) infinite !important; }
body.home .banner__slider .banner__slide--store { animation-delay: 0s !important; }
body.home .banner__slider .banner__slide--uniform { display: block !important; animation-delay: 6s !important; }
body.home .banner__slider .banner__slide--school { display: block !important; animation-delay: 12s !important; }
} .measurement-booking--form .measurement-booking__form-card {
padding: clamp(22px, 4vw, 48px);
background: #f7fafb;
border: 1px solid #dce8eb;
box-shadow: 0 22px 65px rgba(13, 57, 72, .10);
}
.measurement-booking--form #booking-form form {
display: grid;
gap: 26px;
}
.measurement-booking--form #booking-form fieldset {
min-width: 0;
margin: 0;
padding: clamp(24px, 4vw, 42px);
border: 1px solid #d9e6e9;
border-radius: 18px;
background: #fff;
box-shadow: 0 10px 30px rgba(20, 55, 70, .05);
}
.measurement-booking--form #booking-form fieldset legend {
float: left;
width: 100%;
margin: 0 0 20px;
padding: 0;
color: #143746;
font-size: clamp(21px, 3vw, 28px);
font-weight: 800;
line-height: 1.4;
letter-spacing: .04em;
}
.measurement-booking--form #booking-form fieldset legend::before {
content: "";
display: inline-block;
width: 5px;
height: 1.15em;
margin-right: 12px;
border-radius: 99px;
background: linear-gradient(#e59aa3, #16839d);
vertical-align: -.18em;
}
.measurement-booking--form #booking-form fieldset > *:not(legend) { clear: both; }
.measurement-booking--form #booking-reservation-fieldset {
border: 0;
background: linear-gradient(125deg, #103c4c, #176f85);
color: #fff;
box-shadow: 0 18px 42px rgba(15, 61, 77, .22);
}
.measurement-booking--form #booking-reservation-fieldset legend { color: #fff; }
.measurement-booking--form #booking-reservation-fieldset legend::before { background: #f0b3ba; }
.measurement-booking--form #booking-reservation-fieldset table,
.measurement-booking--form #booking-reservation-fieldset tbody,
.measurement-booking--form #booking-reservation-fieldset tr { display: block; }
.measurement-booking--form #booking-reservation-fieldset tr { padding: 16px 0; border-top: 1px solid rgba(255,255,255,.18); }
.measurement-booking--form #booking-reservation-fieldset th,
.measurement-booking--form #booking-reservation-fieldset td {
display: block;
width: 100%;
padding: 0;
border: 0;
color: #fff;
}
.measurement-booking--form #booking-reservation-fieldset th { margin-bottom: 8px; color: #bcd8df; font-size: 13px; }
.measurement-booking--form #booking-reservation-fieldset tr:first-child td { font-size: clamp(22px, 3.5vw, 32px); font-weight: 800; letter-spacing: .05em; }
.measurement-booking--form #booking-reservation-fieldset .booking-input > label,
.measurement-booking--form #booking-reservation-fieldset .booking-input > br { display: none; }
.measurement-booking--form #booking-reservation-fieldset .booking-input > div { display: flex; align-items: center; gap: 12px; }
.measurement-booking--form #booking-reservation-fieldset select {
min-width: 160px;
background: #fff;
color: #143746;
}
.measurement-booking--form #booking-reservation-fieldset .red { color: #ffd8dc; }
.measurement-booking--form #booking-reservation-fieldset .booking-input p { margin: 10px 0 0; color: #d4e6eb; font-size: 13px; }
.measurement-booking--form #booking-reservation-fieldset .booking-input p strong { margin-right: 8px; color: #fff; }
.measurement-booking--form .booking-section-intro {
margin: -8px 0 24px;
color: #68818b;
font-size: 14px;
line-height: 1.8;
}
.measurement-booking--form .booking-section-intro span { display: block; margin-top: 6px; font-size: 12px; }
.measurement-booking--form .booking-section-intro b { color: #d76f7b; }
.measurement-booking--form #booking-form fieldset table { width: 100%; border: 0; }
.measurement-booking--form #booking-form fieldset:not(#booking-reservation-fieldset) tr {
display: grid;
grid-template-columns: 190px minmax(0, 1fr);
gap: 26px;
align-items: start;
padding: 18px 0;
border-top: 1px solid #e4edef;
}
.measurement-booking--form #booking-form fieldset:not(#booking-reservation-fieldset) th,
.measurement-booking--form #booking-form fieldset:not(#booking-reservation-fieldset) td {
display: block;
width: auto;
padding: 0;
border: 0;
}
.measurement-booking--form #booking-form fieldset:not(#booking-reservation-fieldset) th {
padding-top: 12px;
color: #284c5a;
font-size: 14px;
font-weight: 700;
}
.measurement-booking--form #booking-form .required,
.measurement-booking--form #booking-form .red {
display: inline-flex;
margin-left: 8px;
padding: 3px 7px;
border-radius: 4px;
background: #fff0f2;
color: #ca6470;
font-size: 10px;
font-weight: 700;
}
.measurement-booking--form #booking-form input[type="text"],
.measurement-booking--form #booking-form input[type="email"],
.measurement-booking--form #booking-form input[type="tel"],
.measurement-booking--form #booking-form textarea,
.measurement-booking--form #booking-form select {
box-sizing: border-box;
width: 100%;
max-width: none;
padding: 14px 16px;
border: 1px solid #bfd1d6;
border-radius: 9px;
outline: 0;
background: #fbfdfd;
color: #173946;
font: inherit;
transition: border-color .2s, box-shadow .2s, background .2s;
}
.measurement-booking--form #booking-form input,
.measurement-booking--form #booking-form select { min-height: 52px; }
.measurement-booking--form #booking-form input::placeholder,
.measurement-booking--form #booking-form textarea::placeholder { color: #8aa0a8; opacity: 1; }
.measurement-booking--form #booking-form label { cursor: pointer; }
.measurement-booking--form #booking-questionnaire-fieldset,
.measurement-booking--form #booking-note-fieldset { scroll-margin-top: 24px; }
.measurement-booking--form #booking-note-fieldset textarea { min-height: 130px; }
.measurement-booking--form #booking-form input:focus,
.measurement-booking--form #booking-form textarea:focus,
.measurement-booking--form #booking-form select:focus {
border-color: #2189a1;
background: #fff;
box-shadow: 0 0 0 4px rgba(33, 137, 161, .12);
}
.measurement-booking--form #booking-form textarea { min-height: 150px; resize: vertical; line-height: 1.75; }
.measurement-booking--form #booking-questionnaire { min-height: 300px; }
.measurement-booking--form #booking-form hr { display: none; }
.measurement-booking--form #action-button { margin: 8px 0 0; }
.measurement-booking--form #action-button button {
display: inline-flex;
min-width: min(100%, 360px);
min-height: 70px;
align-items: center;
justify-content: center;
padding: 14px 42px;
border: 0;
border-radius: 999px;
background: linear-gradient(110deg, #126f87, #1795ad);
box-shadow: 0 14px 30px rgba(18, 111, 135, .24);
color: #fff;
cursor: pointer;
transition: transform .2s, box-shadow .2s;
}
.measurement-booking--form #action-button button:hover { transform: translateY(-2px); box-shadow: 0 18px 36px rgba(18, 111, 135, .3); }
.measurement-booking--form #action-button button span { display: flex; flex-direction: column; gap: 3px; color: #fff; font-size: 17px; font-weight: 800; }
.measurement-booking--form #action-button button small { color: #cde7ed; font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.measurement-booking--form .measurement-booking__back {
margin-top: 8px;
padding: 12px 18px;
border-radius: 999px;
color: #176f85;
font-weight: 700;
}
.measurement-booking--form .error-message { margin-top: 8px; color: #c94f5d; font-size: 13px; font-weight: 700; }
@media (max-width: 700px) {
.measurement-booking--form #booking-form fieldset { padding: 24px 17px; border-radius: 14px; }
.measurement-booking--form #booking-form fieldset:not(#booking-reservation-fieldset) tr { grid-template-columns: 1fr; gap: 8px; padding: 16px 0; }
.measurement-booking--form #booking-form fieldset:not(#booking-reservation-fieldset) th { padding-top: 0; }
.measurement-booking--form #action-button button { width: 100%; min-width: 0; }
} .measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-count-row {
padding: 22px 0 4px !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-count-row > th {
display: none !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-input > label {
display: flex !important;
align-items: center;
gap: 10px;
margin: 0 0 12px;
color: #d9ebef;
font-size: 15px;
font-weight: 700;
line-height: 1.5;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-required {
display: inline-flex;
align-items: center;
min-height: 23px;
padding: 2px 8px;
border-radius: 999px;
background: #fff0f2;
color: #c95f6b;
font-size: 10px;
line-height: 1;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-count-control {
display: flex !important;
align-items: center;
gap: 10px;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-count-control select {
box-sizing: border-box !important;
width: 150px !important;
min-width: 150px !important;
max-width: 150px !important;
min-height: 52px !important;
margin: 0 !important;
padding: 10px 38px 10px 16px !important;
border: 1px solid rgba(255,255,255,.6) !important;
border-radius: 9px !important;
background-color: #fff !important;
color: #143746 !important;
font-size: 17px !important;
font-weight: 700 !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-count-unit {
color: #fff;
font-size: 16px;
font-weight: 700;
}
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-input p {
margin: 10px 0 0 !important;
color: #bcd8df !important;
font-size: 12px !important;
line-height: 1.6 !important;
}
@media (max-width: 520px) {
.measurement-booking--form .booking-form #booking-form #booking-reservation-fieldset .booking-input > label {
align-items: flex-start;
flex-direction: column;
gap: 6px;
}
} .shop-guide__payment {
padding: clamp(70px, 9vw, 120px) 0;
background: linear-gradient(135deg, #f4f9fa 0%, #fff 48%, #fff7f7 100%);
}
.shop-guide__payment > .container {
display: block;
}
.shop-guide__payment-copy {
width: min(100%, 920px);
margin-inline: auto;
}
.shop-guide__payment-copy > span {
color: #d78991;
font-size: 12px;
font-weight: 800;
letter-spacing: .18em;
}
.shop-guide__payment-copy h2 {
margin: 10px 0 18px;
color: #143746;
font-size: clamp(31px, 4vw, 48px);
line-height: 1.25;
}
.shop-guide__payment-copy > p {
margin: 0 0 26px;
color: #58727c;
line-height: 1.9;
}
.shop-guide__payment-logos {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 9px;
margin: 0 0 24px;
}
.shop-guide__payment-logos > span {
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
min-height: 52px;
padding: 9px 12px;
border: 1px solid #dfe8ea;
border-radius: 9px;
background: #fff;
box-shadow: 0 4px 14px rgba(20, 55, 70, .045);
}
.shop-guide__payment-logos img {
display: block;
width: 100%;
max-width: 72px;
max-height: 28px;
object-fit: contain;
}
.shop-guide__payment-logos .shop-guide__transit-logos {
gap: 8px;
padding-inline: 8px;
}
.shop-guide__payment-logos .shop-guide__transit-logos img {
width: calc(50% - 4px);
max-width: 54px;
max-height: 25px;
}
.shop-guide__paypay-ng {
display: inline-flex;
align-items: center;
margin-right: 8px;
padding: 5px 9px;
border-radius: 6px;
background: #b9444e;
color: #fff;
font-size: 12px;
letter-spacing: .02em;
white-space: nowrap;
}
.shop-guide__payment-copy ul { margin: 0; padding: 0; list-style: none; }
.shop-guide__payment-copy li {
display: grid;
gap: 5px;
padding: 15px 0;
border-top: 1px solid #dce8ea;
}
.shop-guide__payment-copy li strong { color: #176f85; font-size: 14px; }
.shop-guide__payment-copy li span { color: #385d6a; font-size: 13px; line-height: 1.7; }
.shop-guide__payment-alert {
margin-top: 24px;
padding: 20px 22px;
border-left: 4px solid #df8e96;
border-radius: 0 13px 13px 0;
background: #fff1f2;
}
.shop-guide__payment-alert > strong { color: #9e4650; font-size: 13px; }
.shop-guide__payment-alert p { margin: 7px 0 0; color: #654d50; font-size: 13px; line-height: 1.8; }
.shop-guide__payment-alert b { color: #a13e49; }
.measurement-booking--form .booking-payment-note {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 18px;
width: min(100%, 900px);
box-sizing: border-box;
margin: 28px auto 22px;
padding: 20px 24px;
border: 1px solid #edc9cc;
border-radius: 14px;
background: #fff7f7;
color: #385d6a;
text-align: left;
}
.measurement-booking--form .booking-payment-note > span {
color: #c96f79;
font-size: 11px;
font-weight: 800;
letter-spacing: .15em;
}
.measurement-booking--form .booking-payment-note strong { display: block; color: #143746; font-size: 15px; }
.measurement-booking--form .booking-payment-note p { margin: 6px 0 0; font-size: 13px; line-height: 1.75; }
.measurement-booking--form .booking-payment-note a { margin-left: .5em; color: #176f85; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 760px) {
.shop-guide__payment > .container { grid-template-columns: 1fr; }
.shop-guide__payment-copy { padding-inline: 4px; }
.measurement-booking--form .booking-payment-note { grid-template-columns: 1fr; gap: 7px; padding: 18px; }
.shop-guide__payment-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
.shop-guide__payment-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
} .header--macaw-guide .macaw-menu-toggle,
.header--macaw-guide .macaw-mobile-menu { display: none; }
@media (max-width: 760px) {
body.show-nav { overflow: hidden; }
.header--macaw-guide,
body.home .header--macaw-guide,
.header--macaw-guide.sticky {
position: sticky !important;
top: 0 !important;
z-index: 10000 !important;
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: rgba(255,255,255,.97) !important;
box-shadow: 0 5px 22px rgba(20,55,70,.08) !important;
overflow: visible !important;
}
.admin-bar .header--macaw-guide { top: 46px !important; }
.header--macaw-guide .header__top,
body.home .header--macaw-guide .header__top,
.header--macaw-guide.sticky .header__top {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
width: 100% !important;
height: 68px !important;
min-height: 68px !important;
box-sizing: border-box !important;
padding: 9px 15px !important;
}
.header--macaw-guide .header__brand,
body.home .header--macaw-guide .header__brand {
display: block !important;
flex: 0 1 auto !important;
width: auto !important;
margin: 0 !important;
}
.header--macaw-guide .header__brand p { display: none !important; }
.header--macaw-guide .header__logo { display: block !important; }
.header--macaw-guide .header__logo img,
.header--macaw-guide .header__top img,
body.home .header--macaw-guide .header__logo img,
.header--macaw-guide.sticky .header__logo img {
display: block !important;
width: auto !important;
height: 43px !important;
max-width: 180px !important;
object-fit: contain !important;
}
.header--macaw-guide .header__subnav,
.header--macaw-guide .header__service,
.header--macaw-guide .header__info { display: none !important; }
.header--macaw-guide .macaw-menu-toggle {
position: relative !important;
display: grid !important;
place-items: center !important;
flex: 0 0 50px !important;
width: 50px !important;
height: 50px !important;
margin: 0 !important;
padding: 7px 6px 5px !important;
border: 1px solid #d6e4e7 !important;
border-radius: 12px !important;
background: #f7fbfb !important;
color: #143746 !important;
box-shadow: none !important;
cursor: pointer;
}
.header--macaw-guide .macaw-menu-toggle span,
.header--macaw-guide .macaw-menu-toggle span::before,
.header--macaw-guide .macaw-menu-toggle span::after {
position: absolute;
left: 13px;
display: block;
width: 24px;
height: 2px;
border-radius: 2px;
background: #176f85;
content: '';
transition: transform .25s ease, top .25s ease, opacity .2s ease;
}
.header--macaw-guide .macaw-menu-toggle span { top: 18px; }
.header--macaw-guide .macaw-menu-toggle span::before { top: -7px; left: 0; }
.header--macaw-guide .macaw-menu-toggle span::after { top: 7px; left: 0; }
.header--macaw-guide .macaw-menu-toggle small {
align-self: end;
color: #567681;
font-size: 8px;
font-weight: 800;
letter-spacing: .12em;
line-height: 1;
}
.header--macaw-guide .macaw-menu-toggle.active span { transform: rotate(45deg); }
.header--macaw-guide .macaw-menu-toggle.active span::before { top: 0; transform: rotate(90deg); }
.header--macaw-guide .macaw-menu-toggle.active span::after { top: 0; opacity: 0; }
.header--macaw-guide .macaw-mobile-menu {
position: fixed;
inset: 68px 0 0;
display: block;
box-sizing: border-box;
height: calc(100vh - 68px);
height: calc(100dvh - 68px);
overflow-y: auto;
padding: clamp(10px, 2vh, 18px) 16px max(12px, env(safe-area-inset-bottom));
background: rgba(247,251,251,.985);
opacity: 0;
visibility: hidden;
transform: translateY(-12px);
pointer-events: none;
transition: opacity .25s ease, transform .25s ease, visibility .25s;
}
.admin-bar .header--macaw-guide .macaw-mobile-menu {
inset-block-start: 114px;
height: calc(100vh - 114px);
height: calc(100dvh - 114px);
}
body.show-nav .header--macaw-guide .macaw-mobile-menu {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: auto;
}
.macaw-mobile-menu nav {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(6px, 1.1vh, 9px);
}
.macaw-mobile-menu nav a {
display: flex;
flex-direction: column;
justify-content: center;
min-height: clamp(55px, 8.5vh, 72px);
padding: 9px 13px;
border: 1px solid #dce8ea;
border-radius: 13px;
background: #fff;
color: #143746;
}
.macaw-mobile-menu nav a strong { font-size: clamp(13px, 3.7vw, 15px); line-height: 1.35; }
.macaw-mobile-menu nav a span { margin-top: 2px; color: #789099; font-size: 8px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.macaw-mobile-menu nav a:nth-child(2),
.macaw-mobile-menu nav a:last-child { border-color: #efc9cd; background: #fff7f7; }
.macaw-mobile-menu__info {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 6px 9px;
margin-top: clamp(8px, 1.5vh, 14px);
padding-top: clamp(8px, 1.5vh, 14px);
border-top: 1px solid #dce8ea;
}
.macaw-mobile-menu__info p { margin: 0; padding: 4px; }
.macaw-mobile-menu__info p span,
.macaw-mobile-menu__info p strong { display: block; }
.macaw-mobile-menu__info p span { color: #789099; font-size: 10px; }
.macaw-mobile-menu__info p strong { margin-top: 3px; color: #143746; font-size: 13px; }
.macaw-mobile-menu__info > a {
grid-column: 1 / -1;
display: flex;
align-items: center;
justify-content: space-between;
padding: clamp(10px, 1.7vh, 15px) 18px;
border-radius: 12px;
background: linear-gradient(135deg, #123f50, #18788e);
color: #fff;
font-size: 20px;
font-weight: 800;
letter-spacing: .04em;
}
.macaw-mobile-menu__info > a small { color: #c9e1e6; font-size: 10px; }
}
@media (max-width: 760px) and (max-height: 680px) {
.macaw-mobile-menu nav a { min-height: 51px; padding-block: 6px; }
.macaw-mobile-menu nav a strong { font-size: 13px; }
.macaw-mobile-menu nav a span { display: none; }
.macaw-mobile-menu__info { margin-top: 7px; padding-top: 7px; }
.macaw-mobile-menu__info > a { padding-block: 9px; font-size: 18px; }
} .measurement-booking--form .measurement-booking__steps--four {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.measurement-booking--form .measurement-booking__steps--four .is-current {
background: linear-gradient(135deg, #eaf7f9, #fff4f5);
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset {
margin: 0 !important;
padding: clamp(24px, 4vw, 42px) !important;
border: 1px solid #d9e6e9 !important;
border-radius: 18px !important;
background: #fff !important;
box-shadow: 0 10px 30px rgba(20, 55, 70, .05) !important;
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset legend {
display: block !important;
margin: 0 0 20px !important;
color: #143746 !important;
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-collapse: collapse !important;
border-radius: 0 !important;
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table tr {
display: grid !important;
grid-template-columns: minmax(150px, 190px) minmax(0, 1fr) !important;
gap: 24px !important;
align-items: start !important;
padding: 18px 0 !important;
border-top: 1px solid #e2ecee !important;
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table th,
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table td {
display: block !important;
width: auto !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
color: #254956 !important;
font-size: 15px !important;
line-height: 1.85 !important;
letter-spacing: normal !important;
text-align: left !important;
text-indent: 0 !important;
word-break: auto-phrase !important;
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table th {
color: #718992 !important;
font-size: 13px !important;
font-weight: 700 !important;
}
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table td::after { display: none !important; }
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table td br { display: block !important; }
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset .input-number {
float: none !important;
width: auto !important;
margin: 0 !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking-confirm-fieldset {
border: 0 !important;
background: linear-gradient(125deg, #103c4c, #176f85) !important;
box-shadow: 0 18px 42px rgba(15, 61, 77, .20) !important;
}
.measurement-booking--form .booking-form #booking-form #booking-confirm-fieldset legend,
.measurement-booking--form .booking-form #booking-form #booking-confirm-fieldset table td { color: #fff !important; }
.measurement-booking--form .booking-form #booking-form #booking-confirm-fieldset table th { color: #bdd9df !important; }
.measurement-booking--form .booking-form #booking-form #booking-confirm-fieldset table tr { border-color: rgba(255,255,255,.18) !important; }
.measurement-booking--form .booking-form #booking-form #booking-confirm-questionnaire-fieldset table td,
.measurement-booking--form .booking-form #booking-form #booking-confirm-note-fieldset table td {
padding: 16px 18px !important;
border-radius: 10px !important;
background: #f4f8f9 !important;
white-space: normal !important;
}
@media (max-width: 760px) {
.measurement-booking--form .measurement-booking__steps--four strong { font-size: 11px; }
.measurement-booking--form .booking-form #booking-form .booking-confirm-fieldset table tr {
grid-template-columns: 1fr !important;
gap: 7px !important;
}
} @media (min-width: 1101px) {
body.home .header--macaw-guide {
display: grid !important;
grid-template-columns: minmax(210px, 300px) minmax(0, 1fr) !important;
grid-template-areas:
"brand service"
"info info" !important;
column-gap: 28px !important;
row-gap: 10px !important;
width: min(1240px, calc(100% - 40px)) !important;
margin: 10px auto 0 !important;
padding: 12px 20px 10px !important;
}
body.home .header--macaw-guide .header__top { grid-area: brand !important; }
body.home .header--macaw-guide .header__service { grid-area: service !important; }
body.home .header--macaw-guide .header__info {
grid-area: info !important;
justify-self: end !important;
}
} @media (min-width: 761px) {
.header--macaw-guide .header__service a {
overflow: visible !important;
transition: color .2s ease, opacity .2s ease !important;
}
.header--macaw-guide .header__service a::after {
display: none !important;
}
.header--macaw-guide .header__service a:hover,
.header--macaw-guide .header__service a:focus-visible {
background: transparent !important;
color: #176f85 !important;
box-shadow: none !important;
transform: none !important;
}
.header--macaw-guide .header__service a:hover span,
.header--macaw-guide .header__service a:focus-visible span {
color: #176f85 !important;
}
.header--macaw-guide .header__subnav a:hover,
.header--macaw-guide .header__subnav a:focus-visible {
border-color: #d6e4e7 !important;
background: #f7fbfb !important;
color: #176f85 !important;
box-shadow: none !important;
transform: none !important;
}
} .measurement-booking--form .booking-form #booking-form #booking_client-fieldset .booking-contact-count-row .input-number {
float: none !important;
width: 100% !important;
margin: 0 !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset .booking-contact-count-row .booking-input {
display: block !important;
width: 100% !important;
margin: 0 !important;
color: #284c5a !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset .booking-count-control {
display: flex !important;
align-items: center;
gap: 10px;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset .booking-count-control select {
box-sizing: border-box !important;
width: 150px !important;
min-width: 150px !important;
max-width: 150px !important;
min-height: 52px !important;
margin: 0 !important;
padding: 10px 38px 10px 16px !important;
border: 1px solid #bfd1d6 !important;
border-radius: 9px !important;
background-color: #fbfdfd !important;
color: #173946 !important;
font-size: 16px !important;
font-weight: 700 !important;
text-align: left !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset .booking-count-unit {
color: #284c5a;
font-size: 15px;
font-weight: 700;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset .booking-input p {
display: block !important;
width: 100% !important;
margin: 18px 0 0 !important;
color: #789099 !important;
font-size: 12px !important;
line-height: 1.6 !important;
} .measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr,
.measurement-booking--form .booking-form #booking-form #booking-questionnaire-fieldset table tr,
.measurement-booking--form .booking-form #booking-form #booking-note-fieldset table tr {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
gap: 9px !important;
align-items: start !important;
width: 100% !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr th,
.measurement-booking--form .booking-form #booking-form #booking-questionnaire-fieldset table tr th,
.measurement-booking--form .booking-form #booking-form #booking-note-fieldset table tr th {
width: 100% !important;
padding: 0 !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
.measurement-booking--form .booking-form #booking-form #booking_client-fieldset table tr td,
.measurement-booking--form .booking-form #booking-form #booking-questionnaire-fieldset table tr td,
.measurement-booking--form .booking-form #booking-form #booking-note-fieldset table tr td {
width: 100% !important;
min-width: 0 !important;
}
.measurement-booking--form .booking-form #booking-form label {
display: flex !important;
align-items: center;
flex-wrap: wrap;
gap: 7px;
width: 100%;
color: #284c5a;
line-height: 1.55;
white-space: normal;
word-break: keep-all;
}
.measurement-booking--form .booking-form #booking-form label .required {
flex: 0 0 auto;
margin-left: 0 !important;
white-space: nowrap !important;
}
.measurement-booking--form .booking-section-intro,
.measurement-booking--form .booking-input p {
word-break: auto-phrase;
overflow-wrap: break-word;
}
@media (max-width: 520px) {
.measurement-booking--form .measurement-booking__form-card { padding-inline: 10px; }
.measurement-booking--form .booking-form #booking-form fieldset { padding-inline: 15px !important; }
.measurement-booking--form .booking-form #booking-form label { align-items: flex-start; flex-direction: row; }
} body.home .brand-section__inner article figure {
height: 125px !important;
padding-top: 0 !important;
background: #fff !important;
}
body.home .brand-section__inner article figure img,
body.home .brand-section__inner article:hover figure img {
position: static !important;
display: block !important;
width: 100% !important;
height: 125px !important;
padding: 0 !important;
object-fit: contain !important;
object-position: center center !important;
transform: none !important;
} body.home .banner__description h1 {
max-width: 580px !important;
margin: 0 0 18px !important;
color: #fff !important;
font-size: clamp(31px, 3.5vw, 50px) !important;
font-weight: 900 !important;
letter-spacing: 0 !important;
line-height: 1.4 !important;
text-align: left !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
text-wrap: balance !important;
text-shadow: 0 3px 20px rgba(3,22,34,.78), 0 1px 3px rgba(3,22,34,.9) !important;
}
body.home .banner__description h1::after { display: none !important; }
@media (max-width: 700px) {
body.home .banner__description h1 { font-size: clamp(27px, 8.3vw, 38px) !important; }
} @media (max-width: 600px) {
html,
body,
body.home {
max-width: 100%;
overflow-x: clip;
}
body.home .school-section__inner,
body.home .purpose-section__inner,
body.home .support-section__inner,
body.home .items-section__inner,
body.home .brand-section__inner,
body.home .news-section__inner {
box-sizing: border-box !important;
width: 100vw !important;
max-width: 100vw !important;
gap: 12px !important;
padding: 4px 20px 20px !important;
scrollbar-width: none;
}
body.home .school-section__inner::-webkit-scrollbar,
body.home .purpose-section__inner::-webkit-scrollbar,
body.home .support-section__inner::-webkit-scrollbar,
body.home .items-section__inner::-webkit-scrollbar,
body.home .brand-section__inner::-webkit-scrollbar,
body.home .news-section__inner::-webkit-scrollbar {
display: none;
}
body.home .school-section__inner > article,
body.home .purpose-section__inner > .purpose-section__card,
body.home .support-section__inner > article,
body.home .items-section__inner > article,
body.home .brand-section__inner > article,
body.home .news-section__inner > .news__item {
flex: 0 0 calc(100vw - 40px) !important;
width: calc(100vw - 40px) !important;
max-width: calc(100vw - 40px) !important;
}
} @media (max-width: 600px) {
body.home .school-section__inner > article,
body.home .purpose-section__inner > .purpose-section__card,
body.home .support-section__inner > article,
body.home .items-section__inner > article,
body.home .brand-section__inner > article,
body.home .news-section__inner > .news__item {
height: auto !important;
min-height: 0 !important;
}
body.home .school-section__inner article figure,
body.home .items-section__inner article figure,
body.home .brand-section__inner article figure {
overflow: hidden !important;
background: #f4f8f9 !important;
}
body.home .school-section__inner article figure img,
body.home .items-section__inner article figure img,
body.home .brand-section__inner article figure img,
body.home .school-section__inner article:hover figure img,
body.home .items-section__inner article:hover figure img,
body.home .brand-section__inner article:hover figure img {
object-fit: contain !important;
object-position: center center !important;
transform: none !important;
}
body.home .school-section__inner article h3,
body.home .school-section__inner article h3 small,
body.home .items-section__inner article h3,
body.home .items-section__inner article h3 small,
body.home .brand-section__inner article h3,
body.home .brand-section__inner article h3 small,
body.home .purpose-section__card h3,
body.home .purpose-section__card p,
body.home .support-section__inner article h3,
body.home .support-section__inner article p,
body.home .news__item h3,
body.home .news__item p {
max-height: none !important;
overflow: visible !important;
white-space: normal !important;
text-overflow: clip !important;
-webkit-line-clamp: unset !important;
overflow-wrap: anywhere !important;
word-break: normal !important;
}
body.home .news__item--body,
body.home .news__item--body p {
display: block !important;
}
body.home .news__item--content h3 {
padding-right: 0 !important;
}
body.home .news__item--content h3::before {
display: none !important;
}
} @media (max-width: 600px) {
body.home .banner {
height: auto !important;
overflow: visible !important;
}
body.home .banner__slider {
width: 100% !important;
height: auto !important;
aspect-ratio: 1 / 1 !important;
background: #eef4f5 !important;
}
body.home .banner__slider .banner__slide {
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
}
body.home .banner__description {
position: relative !important;
inset: auto !important;
width: 100% !important;
max-width: 100% !important;
padding: 24px 10px 4px !important;
overflow: visible !important;
}
body.home .banner__description h1 {
width: 100% !important;
max-width: 100% !important;
color: #0b3448 !important;
font-size: clamp(26px, 7.6vw, 32px) !important;
line-height: 1.4 !important;
word-break: normal !important;
overflow-wrap: anywhere !important;
text-wrap: pretty !important;
text-shadow: none !important;
}
body.home .banner__description .banner__eyebrow {
color: #b47d82 !important;
text-shadow: none !important;
}
body.home .banner__description > p:not(.banner__eyebrow) {
width: 100% !important;
max-width: 100% !important;
color: #315b6c !important;
overflow: visible !important;
white-space: normal !important;
overflow-wrap: anywhere !important;
text-shadow: none !important;
}
body.home .about-section .container,
body.home .about-section__inner,
body.home .about-section figure,
body.home .about-section__text {
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
}
body.home .about-section__inner {
grid-template-columns: minmax(0, 1fr) !important;
overflow: visible !important;
}
body.home .about-section figure {
height: auto !important;
aspect-ratio: 4 / 3 !important;
}
body.home .about-section figure img {
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
}
body.home .about-section__text {
box-sizing: border-box !important;
padding-right: 20px !important;
padding-left: 20px !important;
overflow: visible !important;
}
body.home .about-section__text h2,
body.home .about-section__text p {
width: 100% !important;
max-width: 100% !important;
max-height: none !important;
overflow: visible !important;
white-space: normal !important;
word-break: normal !important;
overflow-wrap: anywhere !important;
text-overflow: clip !important;
-webkit-line-clamp: unset !important;
}
} @media (max-width: 600px) {
body.home .items-section__inner article figure img,
body.home .items-section__inner article:hover figure img {
position: absolute !important;
inset: 0 !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
transform: none !important;
}
} @media (max-width: 600px) {
body.home .banner {
position: relative !important;
}
body.home .banner__slider {
position: relative !important;
aspect-ratio: 1 / 1 !important;
overflow: hidden !important;
}
body.home .banner__slider::before {
z-index: 2 !important;
background: linear-gradient(180deg, rgba(5, 27, 43, 0.02) 25%, rgba(5, 27, 43, 0.30) 53%, rgba(5, 27, 43, 0.90) 100%) !important;
}
body.home .banner__description {
position: absolute !important;
z-index: 4 !important;
top: auto !important;
right: 20px !important;
bottom: 20px !important;
left: 20px !important;
width: auto !important;
max-width: none !important;
padding: 0 !important;
}
body.home .banner__description h1 {
width: 100% !important;
margin-bottom: 10px !important;
color: #ffffff !important;
font-size: clamp(24px, 7.2vw, 30px) !important;
line-height: 1.32 !important;
text-shadow: 0 2px 12px rgba(3, 22, 34, 0.88) !important;
}
body.home .banner__description .banner__eyebrow {
margin-bottom: 8px !important;
color: #ffd0d2 !important;
font-size: 9px !important;
text-shadow: 0 2px 8px rgba(3, 22, 34, 0.9) !important;
}
body.home .banner__description > p:not(.banner__eyebrow) {
color: rgba(255, 255, 255, 0.92) !important;
font-size: 12px !important;
line-height: 1.65 !important;
text-shadow: 0 1px 7px rgba(3, 22, 34, 0.95) !important;
}
} @media (max-width: 600px) {
body.home .banner {
width: calc(100% - 12px) !important;
margin-right: 6px !important;
margin-left: 6px !important;
padding-right: 0 !important;
padding-left: 0 !important;
}
body.home .banner__slider {
width: 100% !important;
aspect-ratio: 4 / 5 !important;
border-radius: 24px !important;
}
body.home .banner__slider .banner__slide {
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
}
body.home .banner__description {
right: 24px !important;
bottom: 24px !important;
left: 24px !important;
}
body .header--macaw-guide .macaw-menu-toggle {
position: relative !important;
z-index: 10002 !important;
display: grid !important;
width: 56px !important;
height: 56px !important;
pointer-events: auto !important;
touch-action: manipulation !important;
cursor: pointer !important;
}
body .header--macaw-guide .macaw-mobile-menu {
z-index: 10001 !important;
pointer-events: none !important;
}
body.show-nav .header--macaw-guide .macaw-mobile-menu {
pointer-events: auto !important;
}
body.show-nav .header--macaw-guide .macaw-mobile-menu nav,
body.show-nav .header--macaw-guide .macaw-mobile-menu nav a {
pointer-events: auto !important;
touch-action: manipulation !important;
}
body.show-nav .header--macaw-guide .macaw-mobile-menu nav a {
min-height: 72px !important;
}
} @media (max-width: 600px) {
body.home .banner {
box-sizing: border-box !important;
width: calc(100vw - 16px) !important;
max-width: calc(100vw - 16px) !important;
margin-right: calc(50% - 50vw + 8px) !important;
margin-left: calc(50% - 50vw + 8px) !important;
padding: 0 !important;
}
body.home .banner__slider {
width: 100% !important;
max-width: none !important;
}
body .header--macaw-guide .macaw-menu-toggle {
flex: 0 0 58px !important;
width: 58px !important;
min-width: 58px !important;
max-width: 58px !important;
height: 58px !important;
min-height: 58px !important;
padding: 0 !important;
border: 2px solid #176f85 !important;
background: #176f85 !important;
color: #ffffff !important;
box-shadow: 0 8px 20px rgba(20, 74, 91, 0.22) !important;
pointer-events: auto !important;
touch-action: manipulation !important;
-webkit-tap-highlight-color: rgba(23, 111, 133, 0.20) !important;
}
body .header--macaw-guide .macaw-menu-toggle span,
body .header--macaw-guide .macaw-menu-toggle span::before,
body .header--macaw-guide .macaw-menu-toggle span::after {
background: #ffffff !important;
}
body .header--macaw-guide .macaw-menu-toggle small {
color: #ffffff !important;
}
body .header--macaw-guide .macaw-menu-toggle:active {
transform: scale(0.96) !important;
}
} @media (max-width: 760px) {
body.show-nav {
overflow-x: clip !important;
overflow-y: auto !important;
}
body .header--macaw-guide,
body.home .header--macaw-guide,
body .header--macaw-guide.sticky {
position: sticky !important;
top: 0 !important;
}
body.admin-bar .header--macaw-guide,
body.admin-bar .header--macaw-guide.sticky {
top: 46px !important;
}
} @media (max-width: 760px) {
body.show-nav {
overflow: visible !important;
overflow-x: clip !important;
}
} @media (max-width: 760px) {
body.home .banner__description h1,
body.home .banner__description p,
body.home .section__heading,
body.home .section__lead,
body.home .school-section__inner h3,
body.home .school-section__inner small,
body.home .purpose-section__card h3,
body.home .purpose-section__card p,
body.home .support-section__inner h3,
body.home .support-section__inner p,
body.home .support-section__aftercare h3,
body.home .support-section__aftercare p,
body.home .about-section__text h2,
body.home .about-section__text p,
body.home .items-section__inner h3,
body.home .items-section__inner small,
body.home .brand-section__inner h3,
body.home .brand-section__inner small,
body.home .instagram-section h3,
body.home .instagram-section h4,
body.home .instagram-section p,
body.home .news-section h3,
body.home .news-section p,
body.home .contact-access-section h2,
body.home .contact-access-section h3,
body.home .contact-access-section p {
word-break: auto-phrase !important;
overflow-wrap: break-word !important;
line-break: strict !important;
text-wrap: pretty !important;
}
} body.home .macaw-notices {
padding: clamp(28px, 4vw, 54px) 0 clamp(42px, 6vw, 74px);
background: #ffffff;
overflow: hidden;
}
body.home .macaw-notices__header {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 20px;
margin-bottom: 22px;
}
body.home .macaw-notices__header p {
margin: 0;
color: #c5868c;
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .18em;
}
body.home .macaw-notices__header h2 {
margin: 0;
color: #0b3448;
font-size: clamp(22px, 2.2vw, 32px);
font-weight: 900;
line-height: 1.4;
}
body.home .macaw-notices__viewport {
width: 100%;
overflow-x: auto;
overflow-y: hidden;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
scrollbar-width: none;
overscroll-behavior-inline: contain;
}
body.home .macaw-notices__viewport::-webkit-scrollbar { display: none; }
body.home .macaw-notices__track {
display: flex;
align-items: stretch;
gap: 24px;
}
body.home .macaw-notices__slide {
flex: 0 0 calc((100% - 48px) / 3);
min-width: 0;
overflow: hidden;
border: 1px solid #dbe6e9;
border-radius: 18px;
background: #ffffff;
box-shadow: 0 14px 34px rgba(15, 53, 70, .09);
scroll-snap-align: start;
}
body.home .macaw-notices__image {
display: grid;
place-items: center;
aspect-ratio: 16 / 7;
background: linear-gradient(135deg, #edf5f7 0%, #fff4f5 100%);
color: #9ab0b8;
font-family: Georgia, serif;
font-size: 12px;
font-weight: 700;
letter-spacing: .18em;
}
body.home .macaw-notices__copy { padding: 18px 20px 20px; }
body.home .macaw-notices__copy small {
display: block;
margin-bottom: 7px;
color: #c5868c;
font-size: 10px;
font-weight: 800;
letter-spacing: .14em;
}
body.home .macaw-notices__copy h3 {
margin: 0 0 8px;
color: #123d56;
font-size: 19px;
font-weight: 900;
line-height: 1.45;
}
body.home .macaw-notices__copy p {
margin: 0;
color: #5a737d;
font-size: 13px;
font-weight: 600;
line-height: 1.75;
}
body.home .macaw-notices__controls {
display: flex;
align-items: center;
justify-content: center;
gap: 18px;
margin-top: 22px;
}
body.home .macaw-notices__arrow {
display: grid;
width: 42px;
height: 42px;
padding: 0;
place-items: center;
border: 1px solid #cbdadd;
border-radius: 50%;
background: #ffffff;
color: #176f85;
font-size: 18px;
cursor: pointer;
touch-action: manipulation;
}
body.home .macaw-notices__dots {
display: flex;
align-items: center;
gap: 10px;
}
body.home .macaw-notices__dots button {
width: 10px;
height: 10px;
padding: 0;
border: 0;
border-radius: 50%;
background: #cfdcdf;
cursor: pointer;
touch-action: manipulation;
}
body.home .macaw-notices__dots button.is-active {
width: 13px;
height: 13px;
background: #f2a2a7;
}
@media (max-width: 900px) {
body.home .macaw-notices__slide { flex-basis: calc((100% - 18px) / 2); }
body.home .macaw-notices__track { gap: 18px; }
}
@media (max-width: 600px) {
body.home .macaw-notices { padding: 24px 0 48px; }
body.home .macaw-notices .container {
width: calc(100% - 32px) !important;
margin-right: auto !important;
margin-left: auto !important;
padding: 0 !important;
}
body.home .macaw-notices__header {
display: block;
margin-bottom: 16px;
}
body.home .macaw-notices__header p { margin-bottom: 5px; }
body.home .macaw-notices__header h2 { font-size: 23px; }
body.home .macaw-notices__track { gap: 14px; }
body.home .macaw-notices__slide { flex-basis: 100%; }
body.home .macaw-notices__copy { padding: 15px 17px 18px; }
body.home .macaw-notices__controls { gap: 14px; margin-top: 17px; }
}
@media (prefers-reduced-motion: reduce) {
body.home .macaw-notices__viewport { scroll-behavior: auto; }
} body.home .top-school-lists {
padding: clamp(58px, 7vw, 92px) 0;
background: linear-gradient(180deg, #f5fafb 0%, #ffffff 100%);
}
body.home .top-school-lists__header { max-width: 780px; margin-bottom: 30px; }
body.home .top-school-lists__header > p {
margin: 0 0 8px;
color: #c5868c;
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .18em;
}
body.home .top-school-lists__header h2 {
margin: 0 0 12px;
color: #0b3448;
font-size: clamp(28px, 3vw, 42px);
font-weight: 900;
line-height: 1.35;
}
body.home .top-school-lists__header > span {
color: #526f7b;
font-size: 15px;
font-weight: 600;
line-height: 1.9;
}
body.home .top-school-lists__nav {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
margin-bottom: 28px;
}
body.home .top-school-lists__nav a {
display: flex;
min-height: 58px;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 14px 18px;
border: 1px solid #d7e3e6;
border-radius: 12px;
background: #ffffff;
color: #143f53;
font-size: 16px;
font-weight: 800;
}
body.home .top-school-lists__nav a small {
color: #c5868c;
font-size: 12px;
font-weight: 800;
}
body.home .top-school-lists__groups { display: grid; gap: 22px; }
body.home .top-school-list-group {
scroll-margin-top: 90px;
padding: clamp(24px, 3vw, 36px);
border: 1px solid #dbe6e9;
border-radius: 18px;
background: #ffffff;
box-shadow: 0 16px 38px rgba(15, 53, 70, .07);
}
body.home .top-school-list-group > header {
display: grid;
grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.2fr);
align-items: end;
gap: 28px;
margin-bottom: 22px;
padding-bottom: 20px;
border-bottom: 1px solid #e0e9eb;
}
body.home .top-school-list-group > header small {
display: block;
margin-bottom: 7px;
color: #18738d;
font-size: 10px;
font-weight: 800;
letter-spacing: .14em;
}
body.home .top-school-list-group > header h3 {
display: flex;
align-items: baseline;
gap: 12px;
margin: 0;
color: #123d56;
font-size: clamp(22px, 2.4vw, 30px);
font-weight: 900;
line-height: 1.4;
}
body.home .top-school-list-group > header h3 strong {
color: #d39399;
font-size: 16px;
}
body.home .top-school-list-group > header p {
margin: 0;
color: #5b727c;
font-size: 14px;
font-weight: 600;
line-height: 1.8;
}
body.home .top-school-list-group ul {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 10px;
margin: 0;
padding: 0;
list-style: none;
}
body.home .top-school-list-group li {
display: flex;
min-height: 54px;
align-items: center;
padding: 12px 14px;
border: 1px solid #e1eaec;
border-radius: 10px;
background: #f9fbfc;
color: #173d50;
font-size: 14px;
font-weight: 700;
line-height: 1.55;
word-break: auto-phrase;
}
@media (max-width: 900px) {
body.home .top-school-list-group ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
body.home .top-school-lists { padding: 48px 0; }
body.home .top-school-lists .container { width: calc(100% - 32px) !important; padding: 0 !important; }
body.home .top-school-lists__nav { grid-template-columns: 1fr; gap: 8px; }
body.home .top-school-list-group { scroll-margin-top: 78px; padding: 20px 16px; }
body.home .top-school-list-group > header { grid-template-columns: 1fr; gap: 10px; }
body.home .top-school-list-group ul { grid-template-columns: 1fr; gap: 8px; }
body.home .top-school-list-group li { min-height: 50px; }
} body.home .mobile-swipe-hint { display: none; }
@keyframes macawSwipeHint {
0%, 100% { transform: translateX(0); }
50% { transform: translateX(5px); }
}
@media (max-width: 600px) {
body.home .mobile-swipe-hint {
display: flex;
width: fit-content;
max-width: 100%;
align-items: center;
justify-content: center;
gap: 7px;
margin: 0 0 12px;
padding: 8px 12px;
border: 1px solid #d8e5e8;
border-radius: 999px;
background: #f5fafb;
color: #315b6c;
font-size: 12px;
font-weight: 800;
line-height: 1.5;
word-break: keep-all;
}
body.home .mobile-swipe-hint span {
display: inline-block;
flex: 0 0 auto;
color: #d58f96;
font-size: 16px;
}
body.home .mobile-swipe-hint span:last-child {
animation: macawSwipeHint 1.25s ease-in-out infinite;
}
body.home .school-section .mobile-swipe-hint,
body.home .items-section .mobile-swipe-hint,
body.home .brand-section .mobile-swipe-hint,
body.home .news-section .mobile-swipe-hint {
margin-left: 0;
}
}
@media (prefers-reduced-motion: reduce) {
body.home .mobile-swipe-hint span:last-child { animation: none; }
} body.home .top-school-search {
width: min(720px, 100%);
margin: 34px auto 42px;
text-align: left;
}
body.home .top-school-search > label {
display: block;
margin: 0 0 10px;
color: #173f52;
font-size: 15px;
font-weight: 800;
letter-spacing: .05em;
}
body.home .top-school-search__field {
position: relative;
display: flex;
align-items: center;
}
body.home .top-school-search__field svg {
position: absolute;
left: 19px;
width: 23px;
height: 23px;
fill: none;
stroke: #177c99;
stroke-width: 2;
stroke-linecap: round;
pointer-events: none;
}
body.home #top-school-search-input {
width: 100%;
min-height: 58px;
padding: 14px 86px 14px 55px;
border: 2px solid #cbdde2;
border-radius: 16px;
background: #fff;
box-shadow: 0 10px 26px rgba(18, 64, 82, .08);
color: #143c4f;
font: inherit;
font-size: 17px;
font-weight: 700;
line-height: 1.5;
outline: none;
transition: border-color .2s ease, box-shadow .2s ease;
}
body.home #top-school-search-input::placeholder {
color: #77909b;
font-weight: 600;
}
body.home #top-school-search-input:focus {
border-color: #187f9d;
box-shadow: 0 0 0 4px rgba(24, 127, 157, .14), 0 12px 30px rgba(18, 64, 82, .1);
}
body.home .top-school-search__clear {
position: absolute;
right: 12px;
padding: 7px 11px;
border: 0;
border-radius: 999px;
background: #edf5f7;
color: #315b6c;
font-size: 12px;
font-weight: 800;
cursor: pointer;
}
body.home .top-school-search__clear:hover,
body.home .top-school-search__clear:focus-visible {
background: #dfeef1;
}
body.home .top-school-search__result {
margin: 9px 4px 0;
color: #607d89;
font-size: 13px;
font-weight: 700;
}
body.home .top-school-search__empty {
margin: 24px auto 0;
padding: 24px;
border: 1px dashed #c6d9df;
border-radius: 16px;
background: #f6fafb;
color: #496b79;
text-align: center;
font-weight: 700;
}
body.home .top-school-list-group[hidden],
body.home .top-school-list-group li[hidden],
body.home .top-school-search__clear[hidden],
body.home .top-school-search__empty[hidden] {
display: none !important;
}
@media (max-width: 600px) {
body.home .top-school-search {
margin: 24px auto 30px;
}
body.home .top-school-search > label {
font-size: 14px;
}
body.home #top-school-search-input {
min-height: 54px;
padding-left: 50px;
padding-right: 76px;
border-radius: 14px;
font-size: 16px;
}
body.home .top-school-search__field svg {
left: 17px;
width: 21px;
height: 21px;
}
} body.home .top-school-lists {
padding: clamp(34px, 4vw, 54px) 0;
}
body.home .top-school-lists__header {
max-width: 780px;
margin: 0 auto 18px;
text-align: center;
}
body.home .top-school-search {
margin-top: 22px;
margin-bottom: 24px;
}
body.home .top-school-lists__nav {
gap: 8px;
margin-bottom: 16px;
}
body.home .top-school-lists__nav a {
justify-content: center;
min-height: 52px;
padding: 10px 12px;
text-align: center;
}
body.home .top-school-lists__groups {
gap: 12px;
}
body.home .top-school-list-group {
padding: 18px;
}
body.home .top-school-list-group > header {
grid-template-columns: 1fr;
justify-items: center;
gap: 6px;
margin-bottom: 12px;
padding-bottom: 12px;
text-align: center;
}
body.home .top-school-list-group > header h3 {
justify-content: center;
}
body.home .top-school-list-group > header p {
text-align: center;
}
body.home .top-school-list-group ul {
gap: 6px;
}
body.home .top-school-list-group li {
justify-content: center;
min-height: 48px;
padding: 8px 10px;
font-size: 16px;
font-weight: 800;
text-align: center;
}
@media (max-width: 600px) {
body.home .top-school-lists {
padding: 28px 0;
}
body.home .top-school-lists__header {
margin-bottom: 14px;
}
body.home .top-school-search {
margin: 18px auto 20px;
}
body.home .top-school-lists__nav {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 5px;
margin-bottom: 12px;
}
body.home .top-school-lists__nav a {
min-height: 50px;
flex-direction: column;
gap: 1px;
padding: 7px 3px;
font-size: 12px;
line-height: 1.35;
}
body.home .top-school-list-group {
padding: 14px 10px;
border-radius: 14px;
}
body.home .top-school-list-group > header {
gap: 4px;
margin-bottom: 9px;
padding-bottom: 9px;
}
body.home .top-school-list-group > header h3 {
font-size: 24px;
}
body.home .top-school-list-group ul {
gap: 5px;
}
body.home .top-school-list-group li {
min-height: 46px;
padding: 7px 8px;
font-size: 17px;
line-height: 1.45;
}
} body.home .top-school-lists__swipe-hint {
display: none;
}
@media (max-width: 600px) {
body.home .top-school-lists__swipe-hint {
display: flex;
margin: 0 auto 12px;
}
body.home .top-school-list-group ul {
display: flex;
grid-template-columns: none;
gap: 9px;
overflow-x: auto;
overscroll-behavior-inline: contain;
scroll-snap-type: x mandatory;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
padding: 0 4px 8px;
}
body.home .top-school-list-group ul::-webkit-scrollbar {
display: none;
}
body.home .top-school-list-group li {
flex: 0 0 82%;
scroll-snap-align: start;
scroll-snap-stop: always;
}
} body.home .macaw-mobile-rail-controls {
display: none;
}
@media (max-width: 600px) {
body.home .macaw-mobile-rail-controls {
display: flex;
width: min(320px, 100%);
align-items: center;
justify-content: space-between;
gap: 12px;
margin: 14px auto 6px;
}
body.home .macaw-mobile-rail-controls[hidden] {
display: none !important;
}
body.home .macaw-mobile-rail-arrow,
body.home .macaw-notices__arrow {
display: grid;
width: 56px;
height: 56px;
flex: 0 0 56px;
place-items: center;
padding: 0;
border: 2px solid #cbdde2;
border-radius: 50%;
background: #ffffff;
box-shadow: 0 8px 13px rgba(26, 66, 80, .18);
color: #087593;
font-size: 25px;
font-weight: 500;
line-height: 1;
cursor: pointer;
touch-action: manipulation;
}
body.home .macaw-mobile-rail-arrow:active,
body.home .macaw-notices__arrow:active {
transform: translateY(1px);
box-shadow: 0 4px 8px rgba(26, 66, 80, .16);
}
body.home .macaw-mobile-rail-dots,
body.home .macaw-notices__dots {
display: flex;
min-width: 0;
align-items: center;
justify-content: center;
gap: 10px;
}
body.home .macaw-mobile-rail-dots button,
body.home .macaw-notices__dots button {
width: 11px;
height: 11px;
flex: 0 0 11px;
padding: 0;
border: 0;
border-radius: 50%;
background: #d2e0e4;
box-shadow: 0 2px 5px rgba(32, 76, 91, .14);
cursor: pointer;
}
body.home .macaw-mobile-rail-dots button.is-active,
body.home .macaw-notices__dots button.is-active {
width: 15px;
height: 15px;
flex-basis: 15px;
background: #f49ca6;
}
body.home .macaw-notices__controls {
width: min(320px, 100%);
justify-content: space-between;
gap: 12px;
margin: 17px auto 0;
}
body.home .macaw-ig-controls {
display: none !important;
}
body.home .top-school-list-group .macaw-mobile-rail-controls {
margin-top: 8px;
}
} @media (max-width: 767px) {
#footer_fixed.footer-fixed-nav {
position: fixed !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
z-index: 99999 !important;
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
width: 100% !important;
height: calc(76px + env(safe-area-inset-bottom)) !important;
margin: 0 !important;
padding: 0 0 env(safe-area-inset-bottom) !important;
overflow: hidden !important;
background: #ffffff !important;
border-top: 1px solid rgba(15, 55, 74, .14) !important;
box-shadow: 0 -8px 24px rgba(15, 55, 74, .16) !important;
box-sizing: border-box !important;
}
#footer_fixed.footer-fixed-nav > li { min-width: 0 !important; height: 76px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
#footer_fixed.footer-fixed-nav > li > a {
display: grid !important;
grid-template-columns: 22px minmax(0, max-content) !important;
align-items: center !important;
justify-content: center !important;
column-gap: 7px !important;
width: 100% !important;
height: 76px !important;
padding: 9px 7px !important;
box-sizing: border-box !important;
text-align: left !important;
text-decoration: none !important;
}
#footer_fixed.footer-fixed-nav .mobile-contact-phone > a { color: #ffffff !important; background: #12384d !important; }
#footer_fixed.footer-fixed-nav .mobile-contact-form > a { color: #12384d !important; background: #f3a1a9 !important; }
#footer_fixed.footer-fixed-nav img { display: block !important; width: 22px !important; height: 22px !important; margin: 0 !important; object-fit: contain !important; }
#footer_fixed.footer-fixed-nav .mobile-contact-phone img { filter: brightness(0) invert(1) !important; }
#footer_fixed.footer-fixed-nav .mobile-contact-copy {
display: flex !important;
min-width: 0 !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: center !important;
gap: 3px !important;
line-height: 1.1 !important;
}
#footer_fixed.footer-fixed-nav strong {
display: block !important; margin: 0 !important; font-size: clamp(10.5px, 3.35vw, 14px) !important; font-weight: 700 !important; line-height: 1.15 !important; letter-spacing: 0 !important; white-space: nowrap !important; word-break: keep-all !important; overflow-wrap: normal !important;
}
#footer_fixed.footer-fixed-nav small {
display: block !important; margin: 0 !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1 !important; letter-spacing: .02em !important; white-space: nowrap !important; word-break: keep-all !important; overflow-wrap: normal !important;
}
body { padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important; }
}
@media (max-width: 767px) {
#footer_fixed.footer-fixed-nav > li {
width: 100% !important;
max-width: none !important;
flex: none !important;
box-sizing: border-box !important;
}
} @media (max-width: 767px) {
#footer_fixed.footer-fixed-nav > li {
width: 100% !important;
max-width: none !important;
flex: none !important;
box-sizing: border-box !important;
}
} @media (max-width: 767px) {
body.home .shop-guide--home,
body.home .shop-guide--home * { box-sizing: border-box; }
body.home .shop-guide--home .shop-guide__hero-copy h1,
body.home .shop-guide--home .shop-guide__section-head h2,
body.home .shop-guide--home .shop-guide__contact-card h3,
body.home .shop-guide--home .shop-guide__payment-copy h2 {
max-width: 100% !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
line-break: strict;
text-wrap: balance;
}
body.home .shop-guide--home .shop-guide__hero-copy p,
body.home .shop-guide--home .shop-guide__section-head p,
body.home .shop-guide--home .shop-guide__details dt,
body.home .shop-guide--home .shop-guide__details dd,
body.home .shop-guide--home .shop-guide__contact-card p,
body.home .shop-guide--home .shop-guide__payment-copy p,
body.home .shop-guide--home .shop-guide__payment-alert p {
max-width: 100% !important;
word-break: normal !important;
overflow-wrap: break-word !important;
line-break: strict;
}
body.home .shop-guide--home .shop-guide__section-head,
body.home .shop-guide--home .shop-guide__payment-copy { width: 100% !important; }
body.home .shop-guide--home .shop-guide__details > dl > div {
display: grid !important;
grid-template-columns: minmax(82px, 28%) minmax(0, 1fr) !important;
gap: 14px !important;
align-items: start !important;
}
body.home .shop-guide--home .shop-guide__details dt,
body.home .shop-guide--home .shop-guide__details dd {
min-width: 0 !important;
margin: 0 !important;
font-size: 15px !important;
line-height: 1.8 !important;
}
body.home .shop-guide--home .shop-guide__details dd small {
display: block !important;
margin-top: 3px !important;
font-size: 12px !important;
line-height: 1.65 !important;
}
body.home .shop-guide--home .shop-guide__contact-card {
width: 100% !important;
padding-inline: 20px !important;
text-align: center !important;
align-items: center !important;
}
body.home .shop-guide--home .shop-guide__contact-card h3 {
font-size: clamp(19px, 5.6vw, 23px) !important;
line-height: 1.6 !important;
}
body.home .shop-guide--home .shop-guide__tel strong {
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
body.home .shop-guide--home .shop-guide__contact-link {
width: 100% !important;
justify-content: center !important;
text-align: center !important;
}
body.home .shop-guide--home .shop-guide__payment-alert strong,
body.home .shop-guide--home .shop-guide__paypay-ng {
display: block !important;
width: 100% !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
line-height: 1.7 !important;
}
body.home .shop-guide--home .shop-guide__payment-alert p {
margin-top: 10px !important;
font-size: 14px !important;
line-height: 1.85 !important;
}
body.home .shop-guide--home .shop-guide__map iframe {
width: 100% !important;
min-height: 300px !important;
}
}
@media (max-width: 390px) {
body.home .shop-guide--home .shop-guide__details > dl > div { display: block !important; }
body.home .shop-guide--home .shop-guide__details dt {
margin-bottom: 6px !important;
color: #16809a !important;
font-size: 12px !important;
font-weight: 800 !important;
letter-spacing: .08em !important;
}
} @media (max-width: 767px) {
body.home .shop-guide--home .shop-guide__overview .shop-guide__section-head h2 {
display: block !important;
width: 100% !important;
margin-inline: auto !important;
font-size: clamp(23px, 7vw, 29px) !important;
line-height: 1.35 !important;
letter-spacing: -.035em !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
body.home .shop-guide--home .shop-guide__details > dl > div:first-child dd {
display: flex !important;
flex-wrap: wrap !important;
align-items: baseline !important;
gap: 2px 8px !important;
}
body.home .shop-guide--home .shop-guide__details > dl > div:first-child dd small {
display: inline-block !important;
margin: 0 !important;
white-space: nowrap !important;
}
body.home .shop-guide--home .shop-guide__contact-card {
min-width: 0 !important;
overflow: hidden !important;
padding: 28px 18px !important;
}
body.home .shop-guide--home .shop-guide__contact-card > span {
display: block !important;
width: 100% !important;
text-align: center !important;
white-space: nowrap !important;
}
body.home .shop-guide--home .shop-guide__contact-card h3 {
width: 100% !important;
max-width: 18em !important;
margin-inline: auto !important;
font-size: clamp(17px, 4.8vw, 20px) !important;
line-height: 1.7 !important;
letter-spacing: 0 !important;
white-space: normal !important;
word-break: normal !important;
overflow-wrap: break-word !important;
text-wrap: balance !important;
}
body.home .shop-guide--home .shop-guide__tel {
display: flex !important;
width: 100% !important;
min-width: 0 !important;
flex-direction: column !important;
align-items: center !important;
text-align: center !important;
}
body.home .shop-guide--home .shop-guide__tel small,
body.home .shop-guide--home .shop-guide__tel strong {
display: block !important;
max-width: 100% !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
body.home .shop-guide--home .shop-guide__tel small { font-size: 12px !important; }
body.home .shop-guide--home .shop-guide__tel strong { font-size: clamp(25px, 8vw, 34px) !important; }
body.home .shop-guide--home .shop-guide__contact-link {
display: flex !important;
width: 100% !important;
min-width: 0 !important;
padding: 14px 10px !important;
gap: 7px !important;
font-size: clamp(13px, 3.8vw, 15px) !important;
line-height: 1.35 !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
}
@media (max-width: 350px) {
body.home .shop-guide--home .shop-guide__overview .shop-guide__section-head h2 {
font-size: 22px !important;
}
body.home .shop-guide--home .shop-guide__contact-link { font-size: 12px !important; }
} @media (max-width: 760px) {
.measurement-booking__steps--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.measurement-booking__steps--four li { min-width: 0; flex-direction: column; justify-content: center; gap: 7px; padding: 15px 2px 16px; }
.measurement-booking__steps--four span { display: block; flex: 0 0 auto; font-size: 10px; line-height: 1; }
.measurement-booking__steps--four strong { display: block; width: 100%; font-size: clamp(10px, 2.8vw, 12px); line-height: 1.25; letter-spacing: -.03em; white-space: nowrap; word-break: keep-all; overflow-wrap: normal; text-align: center; }
} @media (max-width: 760px) {
.measurement-booking__steps:not(.measurement-booking__steps--four) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.measurement-booking__steps:not(.measurement-booking__steps--four) li { min-width: 0; flex-direction: column; justify-content: center; gap: 7px; padding: 15px 4px 16px; }
.measurement-booking__steps:not(.measurement-booking__steps--four) span { display: block; flex: 0 0 auto; font-size: 10px; line-height: 1; }
.measurement-booking__steps:not(.measurement-booking__steps--four) strong { display: block; width: 100%; font-size: clamp(11px, 3.2vw, 13px); line-height: 1.25; letter-spacing: -.03em; white-space: nowrap; word-break: keep-all; overflow-wrap: normal; text-align: center; }
} .footer.footer--macaw::before { display: none !important; }
.footer.footer--macaw .footer__lead { border-bottom: 0 !important; }
.footer.footer--macaw .footer__bottom { border-top: 0 !important; } @media (max-width: 768px) {
.footer.footer--macaw .footer__lead,
.footer.footer--macaw .footer__bottom,
.footer.footer--macaw .footer__lead-actions a,
.footer.footer--macaw .footer__about,
.footer.footer--macaw .footer__info div,
.footer.footer--macaw .footer__social a,
.footer.footer--macaw .footer__instagram-card { border: 0 !important; }
.footer.footer--macaw .footer__nav-group h3::after { display: none !important; }
#footer_fixed.footer-fixed-nav { border: 0 !important; }
}