.agreement-page { background: #fbfaf5; color: #194a3d; padding: 150px 5% 80px; }
.agreement-intro { max-width: 1220px; margin: 0 auto 48px; }
.agreement-intro h1 { font: 400 clamp(40px,5vw,70px)/1.05 Georgia,serif; letter-spacing: -.04em; color: #123e35; margin: 0 0 22px; }
.agreement-intro h1 em { color: #287560; font-weight: 400; }
.agreement-intro > p:last-child { color: #678071; font-size: 16px; }
.agreement-layout { display: grid; grid-template-columns: 230px minmax(0,1fr); align-items: start; gap: 50px; max-width: 1220px; margin: auto; }
.agreement-contents { position: sticky; top: 124px; display: grid; gap: 3px; padding: 20px; border: 1px solid #47674422; border-radius: 20px; background: #f0f3e9; }
.agreement-contents > p { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 13px; color: #627b67; }
.agreement-contents a { display: flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 1.5; color: #305c4a; }
.agreement-contents a:hover { text-decoration: underline; text-underline-offset: 4px; }
.agreement-contents a:focus-visible { outline: 2px solid #287560; outline-offset: 3px; }
.agreement-body { min-width: 0; font-size: 16px; line-height: 1.85; color: #4b665b; overflow-wrap: anywhere; }
.agreement-body > p { margin: 0 0 20px; }
.agreement-body h2 { font: 400 31px/1.2 Georgia,serif; letter-spacing: -.025em; color: #174839; margin: 48px 0 24px; scroll-margin-top: 120px; }
.agreement-body h3 { font-size: 18px; line-height: 1.6; font-weight: 600; color: #305b49; margin: 28px 0 14px; }
.agreement-body .agreement-date { white-space: pre-wrap; font-size: 13px; color: #708170; }
@media(max-width: 900px) { .agreement-page { padding-top: 116px; }.agreement-layout { grid-template-columns: minmax(0,1fr); gap: 32px; }.agreement-contents { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 18px; }.agreement-contents > p { grid-column: 1/-1; }.agreement-body h2 { font-size: 28px; } }
@media(max-width: 600px) { .agreement-page { padding: 105px 22px 48px; }.agreement-intro { margin-bottom: 30px; }.agreement-intro h1 { font-size: clamp(33px,8.8vw,49px); }.agreement-body { line-height: 1.75; }.agreement-body h3 { font-size: 17px; }.agreement-contents { gap: 6px 15px; padding: 17px; }.agreement-contents a { font-size: 13px; }.agreement-body .agreement-date { white-space: normal; } }