@charset "UTF-8";

/* Three plain editorial sections, inspired by the reference site's generous image/text blocks. */
.section-index{display:block;color:#c9a979;font-size:11px;font-weight:700;letter-spacing:.18em}

.history-simple{padding:92px 0 77px;background:#18352d;color:#f4f0e4}
.history-simple-head{display:flex;align-items:end;justify-content:space-between;gap:64px;margin-bottom:52px}
.history-simple-head h2{margin:19px 0 0;font:500 clamp(43px,4.5vw,69px)/1.24 var(--serif);letter-spacing:.035em}
.history-simple-head p{max-width:380px;margin:0 0 7px;color:#bed0c0;font-size:15px;line-height:1.9}
.history-moments{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:0;padding:0;border-top:1px solid #668170;border-bottom:1px solid #668170}
.history-moments li{min-width:0;padding:30px 29px 30px;border-right:1px solid #4a6957}
.history-moments li:first-child{padding-left:0}
.history-moments li:last-child{padding-right:0;border-right:0}
.history-moments article{display:flex;flex-direction:column;height:100%}
.history-date{color:#d9b779;font:400 clamp(33px,3.5vw,49px)/1 Georgia,serif;letter-spacing:-.035em}
.history-date small{margin-left:5px;color:#b9cab9;font:500 11px/1 var(--sans);letter-spacing:0}
.history-moments h3{margin:22px 0 13px;font:500 clamp(23px,2vw,30px)/1.35 var(--serif)}
.history-moments p{margin:0 0 28px;color:#bfcdbf;font-size:13px;line-height:1.85}
.history-moments a{display:inline-flex;align-items:center;gap:12px;align-self:flex-start;margin-top:auto;padding-bottom:6px;border-bottom:1px solid #a6b7a5;color:#ead3a9;font-size:12px;transition:color .2s,border-color .2s}
.history-moments a:hover{border-color:#f6deb0;color:#fff5db}
.history-footnote{margin:18px 0 0;color:#9db2a2;font-size:11px;line-height:1.7}

.source-simple{padding:88px 0 82px;background:#f3f0e8;color:#19362d}
.source-simple-head{display:flex;align-items:end;justify-content:space-between;gap:45px;margin-bottom:39px}
.source-simple .section-index{color:#9c7948}
.source-simple-head h2{margin:17px 0 0;font:500 clamp(44px,4.5vw,68px)/1.2 var(--serif);letter-spacing:.035em}
.source-simple-head p{max-width:380px;margin:0 0 7px;color:#697b6d;font-size:15px;line-height:1.8}
.source-list{border-top:1px solid #aeb9aa}
.source-list>a{display:grid;grid-template-columns:170px minmax(0,1fr) 210px 24px;gap:22px;align-items:center;min-height:91px;padding:17px 6px;border-bottom:1px solid #c5cec0;transition:background .2s,padding .2s}
.source-list>a:hover{padding-left:18px;background:#e8ebe1}
.source-list>a>span{color:#9c7847;font:500 17px/1.3 Georgia,serif}
.source-list small{margin-left:15px;color:#718675;font:500 11px/1.4 var(--sans);white-space:nowrap}
.source-list strong{font:500 clamp(18px,1.7vw,23px)/1.45 var(--serif);overflow-wrap:anywhere}
.source-list em{color:#788a7a;font-size:12px;font-style:normal;line-height:1.6}
.source-list b{color:#9c7847;font-size:20px;font-weight:400;text-align:right}
.source-note{display:flex;justify-content:space-between;gap:24px;margin:20px 0 0;color:#7b897a;font-size:11px;line-height:1.7}
.source-note a{flex:0 0 auto;padding-bottom:4px;border-bottom:1px solid #9baa98;color:#45644b}
.source-note a:hover{color:#9c7847;border-color:#9c7847}

.closing-simple{position:relative;isolation:isolate;overflow:hidden;background:#0e2924;color:#f3ecda}
.closing-simple::before{content:"";position:absolute;z-index:-1;inset:-20% -4% -45% 55%;background:url("assets/tuoba-route-reference.jpg") center 44%/cover no-repeat;opacity:.085;filter:grayscale(1)}
.closing-simple-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);gap:clamp(50px,8vw,130px);align-items:center;min-height:490px;padding-top:70px;padding-bottom:70px}
.closing-mark{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:290px;padding:35px;border:1px solid #5a725e;background:rgba(21,59,46,.44)}
.closing-mark img{width:min(100%,530px);filter:drop-shadow(0 9px 20px rgba(0,0,0,.2))}
.closing-mark span{margin-top:2px;color:#c4d1be;font-size:12px;letter-spacing:.22em}
.closing-copy h2{margin:20px 0 20px;font:500 clamp(35px,3.65vw,55px)/1.4 var(--serif);letter-spacing:.035em}
.closing-copy p{max-width:400px;margin:0;color:#b5c8b8;font-size:14px;line-height:1.9}
.closing-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.closing-links a{display:inline-flex;justify-content:space-between;align-items:center;gap:30px;min-height:47px;padding:0 17px;border:1px solid #a1b399;color:#e9e9d8;font-size:12px;transition:background .2s,color .2s}
.closing-links a:first-child{background:#d9b779;border-color:#d9b779;color:#1e392e;font-weight:700}
.closing-links a:hover{background:#f0d6a2;border-color:#f0d6a2;color:#19362d}
.closing-links span{font-size:17px}

.footer-simple{background:#0b211d;color:#d9e2d6}
.footer-simple-main{display:flex;align-items:center;gap:36px;min-height:92px;border-bottom:1px solid #3b5547}
.footer-simple-brand{flex:0 0 auto;font:500 20px/1.2 var(--serif);letter-spacing:.07em}
.footer-simple-brand span{display:block;margin-top:5px;color:#95a99b;font:500 8px/1 var(--sans);letter-spacing:.18em}
.footer-simple nav{display:flex;flex-wrap:wrap;gap:11px 27px;margin-left:auto}
.footer-simple nav a,.footer-back{color:#c0d0be;font-size:11px;white-space:nowrap}
.footer-simple nav a:hover,.footer-back:hover{color:#e6bf82}
.footer-back{white-space:nowrap}
.footer-simple-meta{display:flex;align-items:center;gap:16px 30px;min-height:65px;padding-top:15px;padding-bottom:15px;color:#91a796;font-size:10px}
.footer-simple-meta>a{margin-left:auto;color:#c0d0be}
.footer-simple-meta details{position:relative}
.footer-simple-meta summary{color:#c0d0be;cursor:pointer}
.footer-simple-meta details>div{position:absolute;z-index:5;left:0;bottom:calc(100% + 14px);display:flex;flex-direction:column;gap:10px;min-width:200px;padding:18px;background:#1e3c30;border:1px solid #698172;box-shadow:0 8px 24px rgba(0,0,0,.22)}
.footer-simple-meta details a:hover,.footer-simple-meta>a:hover{color:#e6bf82}

@media(max-width:1040px){
  .history-moments{grid-template-columns:repeat(2,minmax(0,1fr))}
  .history-moments li{min-height:230px;padding:27px!important}
  .history-moments li:nth-child(2){border-right:0}
  .history-moments li:nth-child(-n+2){border-bottom:1px solid #4a6957}
  .source-list>a{grid-template-columns:130px minmax(0,1fr) 165px 22px;gap:15px}
  .closing-simple-inner{gap:42px}
}
@media(max-width:740px){
  .history-simple{padding:66px 0 59px}
  .history-simple-head,.source-simple-head{display:block;margin-bottom:30px}
  .history-simple-head h2,.source-simple-head h2{font-size:clamp(36px,9vw,50px)}
  .history-simple-head p,.source-simple-head p{max-width:480px;margin:16px 0 0;font-size:13px}
  .history-moments li{min-height:0;padding:22px 19px!important}
  .history-moments li:nth-child(odd){padding-left:0!important}
  .history-moments li:nth-child(even){padding-right:0!important}
  .history-date{font-size:36px}
  .history-moments h3{margin:15px 0 8px;font-size:22px}
  .history-moments p{margin-bottom:18px;font-size:11px;line-height:1.75}
  .history-moments a{font-size:10px}
  .history-footnote{font-size:10px}
  .source-simple{padding:67px 0 61px}
  .source-list>a{grid-template-columns:66px minmax(0,1fr) 20px;gap:10px;min-height:86px;padding:14px 2px}
  .source-list>a:hover{padding-left:7px}
  .source-list>a>span{font-size:15px}
  .source-list small{display:block;margin:5px 0 0;font-size:9px;white-space:normal}
  .source-list strong{font-size:17px}
  .source-list em{grid-column:2;grid-row:2;font-size:10px}
  .source-list b{grid-column:3;grid-row:1/3;font-size:17px}
  .source-note{display:block;font-size:10px}
  .source-note a{display:inline-block;margin-top:8px}
  .closing-simple::before{inset:0;opacity:.055}
  .closing-simple-inner{display:flex;flex-direction:column;align-items:stretch;gap:31px;min-height:0;padding-top:61px;padding-bottom:65px}
  .closing-mark{min-height:190px;padding:25px}
  .closing-mark img{width:min(100%,440px)}
  .closing-mark span{font-size:10px}
  .closing-copy h2{font-size:clamp(34px,8vw,45px)}
  .closing-copy p{font-size:12px}
  .closing-links{margin-top:25px}
  .closing-links a{min-height:44px;gap:14px;font-size:11px}
  .footer-simple-main{flex-wrap:wrap;gap:18px 24px;min-height:0;padding-top:26px;padding-bottom:25px}
  .footer-simple-brand{width:100%;font-size:18px}
  .footer-simple nav{margin-left:0;gap:10px 20px}
  .footer-back{margin-left:auto}
  .footer-simple-meta{flex-wrap:wrap;min-height:0;gap:10px 20px;padding-top:18px;padding-bottom:22px;font-size:9px}
  .footer-simple-meta>a{margin-left:0}
}
@media(max-width:400px){
  .history-moments{grid-template-columns:1fr}
  .history-moments li{padding:21px 0!important;border-right:0;border-bottom:1px solid #4a6957}
  .history-moments li:last-child{border-bottom:0}
  .history-moments article{display:grid;grid-template-columns:90px 1fr;gap:4px 14px}
  .history-date{grid-row:1/4;font-size:29px}
  .history-moments h3{margin:0;font-size:22px}
  .history-moments p{margin:3px 0 8px}
  .history-moments a{grid-column:2;margin:0}
}
