/* ═════════ quote.css — 오늘의 명언 (2026-08-30d) ═════════
   학생 홈 인사말 오른쪽, 전광판처럼 흐른다.

   ── 어떻게 움직이는가 (원장님이 정하심 — 2026-08-30) ──
   시작   첫 글자가 오른쪽 끝에 걸린다
   흐름   글자가 하나씩 밀려 들어온다. 고르게 15초
   끝     다 들어오면 가운데에 멈춘다
   멈춘 뒤 회색으로 물러나 공부를 방해하지 않는다

   ★ 화면 밖에서 시작하면 한참 기다려야 글이 나온다.
     그래서 left:100% 에서 시작해 첫 글자가 바로 걸리게 한다. */
.fgQuote{
  position:relative;overflow:hidden;height:26px;
  --qdur:15s}
.fgQuote .qLine{
  position:absolute;top:2px;
  display:flex;align-items:baseline;gap:10px;white-space:nowrap;
  /* 시작 — 첫 글자가 오른쪽 끝에 걸린다 */
  left:100%;transform:none}
.fgQuote.in .qLine{
  /* 끝 — 가운데에 멈춘다. 고르게 흘러야 읽힌다 */
  left:50%;transform:translateX(-50%);
  transition:left var(--qdur) linear, transform var(--qdur) linear}

/* 한 줄에 셋이 나란히 — 영어는 이탤릭 */
.fgQuote .qEn{font-size:15px;font-weight:700;font-style:italic;
  color:#002060;letter-spacing:-.01em;line-height:1.4;
  transition:color 1.2s ease}
.fgQuote .qKo{font-size:13px;color:#33415C;line-height:1.4}
.fgQuote .qKo::before{content:"· ";color:#B9C4D4}
.fgQuote .qBy{font-size:12px;color:#657189;font-style:italic;letter-spacing:.02em;
  opacity:0;transition:opacity .8s ease}
/* 지은이는 다 들어온 뒤에 조용히 뜬다 */
.fgQuote.in .qBy{opacity:1;transition-delay:calc(var(--qdur) * .9)}
/* 멈추면 회색으로 물러난다 */
.fgQuote.rest .qEn{color:#5B6A80}

/* 움직임을 꺼 둔 기기 — 어지러움을 느끼는 분이 있다 */
@media (prefers-reduced-motion:reduce){
  .fgQuote .qLine{left:50%;transform:translateX(-50%);transition:none}
  .fgQuote .qBy{opacity:1;transition:none}
  .fgQuote .qEn{color:#5B6A80}
}
@media(max-width:1100px){ .fgQuote{display:none} }