/* Reading groups: soft section backgrounds, narrative panels and illustrated cards. */
.surface-band{display:flow-root}
.philosophy-band{background:radial-gradient(ellipse at 0 100%,#f6f1e5 0,transparent 60%),#edf0e8}
.message-layout{grid-template-columns:.95fr 1.05fr;gap:64px;align-items:center}
.message-heading h2{font-size:34px}
.message-body{background:var(--white);padding:42px 44px;border-radius:38px 4px 4px 4px;line-height:2.15;letter-spacing:.025em;box-shadow:0 12px 40px #3e4b4005}
.message-body br{display:none}
.message-body .message-lead{font-family:var(--serif);font-size:21px;line-height:1.95;color:var(--ink);padding-bottom:25px;border-bottom:1px solid var(--line);text-wrap:balance}
.message-body .message-lead br{display:initial}
.message-lead-phrase{display:inline-block}
.message-body p+p{margin-top:24px}
.message-body .message-last{background:#eef1e9;padding:18px 22px;border-left:2px solid #b5a17b;font-size:16px;line-height:2}
.mini-staff{width:230px;margin-top:38px}
.mini-staff i{background:#cbd1c3}
.approach-band{background:var(--white)}
.approach{border-top:0}
.approach-list{gap:24px}
.approach-item{position:relative;background:#f3efe4;border:1px solid #e4dece;border-radius:4px;padding:30px 30px 34px}
.approach-item:nth-child(2){background:#edf1e9;border-color:#dce2d6}
.approach-item:nth-child(3){background:#f6f0e8;border-color:#e8ded1}
.approach-number{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 30px;padding-right:40px;min-height:56px}
.approach-index{display:flex;width:44px;height:44px;align-items:center;justify-content:center;background:#fffdf6;border-radius:50%;font:400 26px var(--english);flex-shrink:0}
.approach-number span{font-size:12px;letter-spacing:.1em}
.approach-symbol{position:absolute;width:48px;height:48px;right:27px;top:30px;color:#8d856d}
.approach-item h3{font-size:21px;margin-bottom:16px;letter-spacing:.025em}
.approach-item p{font-size:16px;line-height:2.1}
.director-band{background:#f0eee6}
.director-layout{grid-template-columns:.92fr 1.08fr;gap:0;background:var(--white);border-radius:4px 44px 4px 4px;overflow:hidden;align-items:stretch}
.director-portrait{padding:0;align-self:stretch;background:#e9e5d9}
.director-portrait>img{aspect-ratio:.9;object-fit:cover;object-position:47% center}
.director-portrait>p{margin:0;padding:20px 28px;flex-wrap:wrap;gap:4px 18px}
.director-copy{padding:42px 48px 112px}
.director-copy h2{font-size:31px;line-height:1.85;margin:16px 0 26px;letter-spacing:.07em}
.director-copy>p{font-size:16px;line-height:2.15}
.director-copy>p br{display:none}
.director-name{padding-top:24px;border-top:1px solid var(--line);margin-top:28px}
.piano-art{width:108px;right:28px;bottom:20px;opacity:.45}
.recruit{border-top:0}
.recruit-notice{background:#efeddf;border:1px solid #ded8c2;border-radius:4px 32px 4px 4px}
.faq-band{background:#edf0e8}
.faq{padding-top:85px;padding-bottom:85px}
.faq-list{display:flex;flex-direction:column;gap:16px}
.faq-list details,.faq-list details:last-child{background:var(--white);border:1px solid #dce0d3;border-radius:4px}
.faq-list summary{padding:23px 26px;font-size:16px;gap:16px;min-height:88px}
.faq-list details[open] summary{padding-bottom:18px}
.faq-list details>p{background:#f3f4ee;margin:0 24px 24px;padding:20px 24px;font-size:16px;line-height:2.1}
.access{border-top:0}
.access-address{background:#f0eee5;border-left:2px solid #b5a17b;padding:24px 28px}
.access-address p{font-size:16px}
.access-art{background:#e9ecdf;border-radius:4px 42px 4px 4px}
.location-rings:before,.location-rings:after{border-color:#cdd3c2}
.contact{background:#e6e5d5}
@media(max-width:1180px){
  .message-layout{gap:40px;grid-template-columns:.95fr 1.05fr}
  .message-heading h2{font-size:29px;letter-spacing:.06em}
  .message-body{padding:34px}
  .approach-item{padding:27px 24px}
  .approach-number{flex-direction:column;align-items:flex-start;gap:12px}
  .approach-symbol{right:24px;top:27px}
  .approach-item h3{font-size:19px}
  .director-copy{padding:35px 34px 105px}
  .director-copy h2{font-size:27px}
}
@media(min-width:641px) and (max-width:980px){
  .message-layout{display:block}
  .message-heading{position:relative;padding-right:180px;margin-bottom:35px}
  .message-heading>.serif-english{font-size:35px;margin-bottom:22px}
  .message-heading h2{font-size:30px;line-height:1.8}
  .message-heading .mini-staff{display:flex;position:absolute;right:0;bottom:10px;width:150px;height:70px}
  .message-body{padding:34px 40px}
  .message-body .message-lead{max-width:25em}
  .approach-list{grid-template-columns:1fr;gap:18px}
  .approach-item{display:grid;grid-template-columns:140px 1fr;gap:28px;padding:30px}
  .approach-number{position:relative;margin:0;padding-right:0;min-height:110px}
  .approach-symbol{width:42px;height:42px;right:0;top:0}
  .approach-item h3{font-size:22px;margin-bottom:10px}
  .director-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:0}
  .director-portrait{width:100%;margin:0}
  .director-portrait>img{aspect-ratio:.7}
  .director-portrait>p{padding:18px;font-size:10px}
  .director-portrait>p span{font-size:24px}
  .director-copy{padding:30px 30px 100px}
  .director-copy h2{font-size:24px;letter-spacing:.025em}
  .director-name{gap:10px}
  .director-name strong{font-size:20px}
  .faq{grid-template-columns:1fr;gap:30px}
  .faq-head{position:relative}
  .faq-bird{display:block;position:absolute;right:25px;bottom:10px;width:85px;margin:0}
}
@media(min-width:641px) and (max-width:760px){
  .director-layout{display:flex;flex-direction:column}
  .director-portrait>img{aspect-ratio:1.4}
}
@media(max-width:640px){
  .message-layout{display:block}
  .message-heading h2{font-size:28px}
  .message-heading>.serif-english{font-size:35px;margin-bottom:25px}
  .message-body{margin-top:30px;padding:28px 24px;border-radius:28px 4px 4px 4px;line-height:2.1}
  .message-body .message-lead{font-size:19px;line-height:1.95;padding-bottom:21px}
  .message-body p+p{margin-top:22px}
  .message-body .message-last{padding:16px 18px;margin-top:24px;line-height:2}
  .approach-list{display:grid;grid-template-columns:1fr;gap:18px}
  .approach-item{padding:26px 24px 28px}
  .approach-item+.approach-item{margin-top:0}
  .approach-number{flex-direction:row;align-items:center;margin-bottom:22px;gap:14px;min-height:48px}
  .approach-symbol{width:43px;height:43px;top:28px;right:24px}
  .approach-number span{font-size:11px}
  .approach-item h3{font-size:21px;margin-bottom:13px}
  .director-layout{display:flex;flex-direction:column;gap:0;border-top-right-radius:32px}
  .director-portrait{width:100%;margin:0}
  .director-portrait>img{aspect-ratio:1.15}
  .director-portrait>p{padding:17px 24px;gap:4px 16px}
  .director-copy{padding:30px 24px 105px}
  .director-copy h2{font-size:25px;letter-spacing:.04em}
  .director-copy>p{font-size:16px}
  .director-name{flex-direction:column;align-items:flex-start;gap:5px;margin-bottom:22px}
  .director-name>span{font-size:12px}
  .piano-art{right:22px;bottom:19px;width:100px}
  .faq{padding-top:62px;padding-bottom:62px}
  .faq-list{gap:14px}
  .faq-list summary{padding:20px 18px;font-size:16px;gap:12px;min-height:90px}
  .faq-list details>p{margin:0 16px 16px;padding:18px;font-size:16px}
  .access-address{padding:22px}
}
@media(max-width:359px){
  .message-heading h2{font-size:25px;letter-spacing:.04em}
  .message-body{padding:25px 20px}
  .message-body .message-lead{font-size:18px}
  .approach-item{padding:24px 20px}
  .approach-number{flex-direction:column;align-items:flex-start;gap:8px;padding-right:0}
  .approach-symbol{right:20px;top:25px}
  .approach-item h3{font-size:20px}
  .director-copy{padding-left:20px;padding-right:20px}
  .director-copy h2{font-size:22px}
}
