@font-face{font-family:NanumGothicLocal;src:url('../fonts/nanum-gothic-korean-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:NanumGothicLocal;src:url('../fonts/nanum-gothic-korean-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:block}
@font-face{font-family:NotoJP;src:url('../fonts/noto-sans-jp-japanese-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:NotoSC;src:url('../fonts/noto-sans-sc-chinese-simplified-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:NanumPen;src:url('../fonts/nanum-pen-script-korean-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:block}
*{box-sizing:border-box}
:root{color-scheme:light;--ink:#292820;--line:#e6e4dc;--paper:#fffefb;--accent:#743b24;--hero:url('../images/header-daily.png')}
html,body{margin:0;min-height:100%;background:#e9e8e2;color:var(--ink);font-family:NanumGothicLocal,Arial,sans-serif}
html[lang="ja"] body{font-family:NotoJP,NanumGothicLocal,sans-serif}html[lang="zh"] body{font-family:NotoSC,NanumGothicLocal,sans-serif}
body{padding:clamp(18px,4vw,54px)}
.community-page{--hero:url('../images/header-community.png');--accent:#75513a}.daily-page{--hero:url('../images/header-daily.png');--accent:#743b24}.farming-page{--hero:url('../images/header-farming.png');--accent:#476a3a}.seeds-page{--hero:url('../images/header-seeds.png');--accent:#805c32}.food-page{--hero:url('../images/header-food.png');--accent:#8a493a}.heart-page{--hero:url('../images/header-heart.png');--accent:#604f78}
.subpage{position:relative;width:min(100%,780px);min-height:100vh;margin:0 auto;overflow:hidden;background:var(--paper);border:1px solid #dcdad1;box-shadow:0 20px 58px rgba(31,31,26,.09)}
.hero{position:relative;height:348px;padding:62px 58px 18px;background:var(--hero) center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,253,245,.08),rgba(255,252,242,.13) 56%,rgba(242,247,224,.2));pointer-events:none}
.heading,.section-nav{position:relative}
.heading{text-align:center;text-shadow:0 1px 0 rgba(255,255,255,.9)}
.heading h1{margin:0;min-height:96px;display:flex;align-items:center;justify-content:center;font-family:NanumPen,NanumGothicLocal,sans-serif;font-size:clamp(3.45rem,8vw,4.65rem);font-weight:400;line-height:1.08;letter-spacing:.015em;color:#211f1b;word-break:keep-all;text-shadow:0 1px 0 rgba(255,255,255,.96),0 4px 17px rgba(60,48,35,.16)}
.heading h1 img{display:none}
.heading p{margin:3px 0 0;font-size:clamp(1.22rem,3.3vw,2rem);font-weight:700;line-height:1.4;color:#41372e;letter-spacing:-.04em;word-break:keep-all;text-shadow:0 1px 0 rgba(255,255,255,.98),0 2px 10px rgba(67,54,39,.13)}
.section-nav{position:absolute;left:58px;right:58px;bottom:16px;height:72px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:5px;padding:7px}
.section-nav a{height:56px;display:flex;align-items:center;justify-content:center;border-radius:12px;color:#20231d;text-decoration:none;font-size:clamp(1rem,2.5vw,1.8rem);font-weight:400;letter-spacing:-.05em;white-space:nowrap;text-shadow:0 2px 0 rgba(255,255,255,.98),0 0 9px rgba(255,255,247,.94),0 2px 7px rgba(49,55,43,.15);transition:color .16s,background-color .16s}
.section-nav a:hover,.section-nav a:focus-visible{color:var(--accent);outline:none}
.section-nav a.active{width:72px;height:46px;justify-self:center;align-self:center;background:rgba(255,252,239,.58);color:var(--accent);font-weight:700;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 42%,transparent),0 3px 9px rgba(63,62,45,.08)}
.story-list{padding:8px 58px 0;background:var(--paper)}
.story{height:119px;display:grid;grid-template-columns:61px minmax(0,1fr) auto;align-items:center;gap:20px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.story:hover,.story:focus-visible{background:#fbfaf5;outline:none}
.thumb{width:57px;height:57px;border-radius:50%;border:1px solid rgba(20,20,15,.09);background-image:url('../images/main.png');background-size:880px auto;background-position:var(--x) var(--y)}
.story:nth-child(1) .thumb{--x:18%;--y:28%}.story:nth-child(2) .thumb{--x:42%;--y:52%}.story:nth-child(3) .thumb{--x:15%;--y:72%}.story:nth-child(4) .thumb{--x:66%;--y:62%}.story:nth-child(5) .thumb{--x:88%;--y:72%}
.story-title{font-size:18px;font-weight:400;line-height:1.5;letter-spacing:-.03em;color:#3d3c37;word-break:keep-all}
.story time{font:400 14px/1.3 Arial,sans-serif;color:#77776f;letter-spacing:.02em;white-space:nowrap}
.more-button{width:142px;height:45px;margin:31px auto 50px;display:flex;align-items:center;justify-content:center;border:1px solid #cecdc5;border-radius:23px;background:#fff;color:#4f4f49;font:400 15px/1 NanumGothicLocal,Arial,sans-serif;cursor:pointer}
.more-button::after{content:"";width:6px;height:6px;margin:-4px 0 0 10px;border-right:1px solid #77776f;border-bottom:1px solid #77776f;transform:rotate(45deg)}
.music-toggle-sub{position:absolute;z-index:4;top:16px;right:18px;width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(20,20,20,.18);border-radius:50%;background:rgba(255,255,255,.76);font-size:18px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.1)}
.music-toggle-sub:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:620px){
  body{padding:0;background:#fff}
  .subpage{width:100%;min-height:100vh;border:0;box-shadow:none}
  .hero{height:300px;padding:48px 16px 14px}
  .heading h1{min-height:78px;font-size:clamp(3rem,15vw,4rem)}
  .heading p{margin-top:2px;font-size:clamp(1.08rem,5vw,1.45rem)}
  .section-nav{left:10px;right:10px;bottom:12px;height:64px;gap:0;padding:4px 0}
  .section-nav a{height:50px;font-size:clamp(.9rem,4vw,1.15rem);letter-spacing:-.07em}
  .section-nav a.active{width:48px;height:40px}
  .story-list{padding:6px 20px 0}
  .story{height:104px;grid-template-columns:50px minmax(0,1fr) auto;gap:14px}
  .thumb{width:48px;height:48px;background-size:720px auto}
  .story-title{font-size:clamp(.96rem,4.4vw,1.08rem)}
  .story time{font-size:.78rem}
  .more-button{margin-bottom:36px}
  .music-toggle-sub{top:10px;right:10px;width:34px;height:34px;font-size:16px}
}
@media(max-width:370px){
  .hero{height:282px;padding-left:10px;padding-right:10px}
  .section-nav{left:4px;right:4px}
  .section-nav a{font-size:.82rem}
  .section-nav a.active{width:43px}
  .story-list{padding-left:14px;padding-right:14px}
  .story{grid-template-columns:44px minmax(0,1fr) auto;gap:10px}
  .thumb{width:44px;height:44px}
  .story time{font-size:.72rem}
}

.empty-section{text-align:center;color:#77776f;font-size:20px;padding:62px 0 38px;margin:0;word-break:keep-all}
.more-button[hidden]{display:none}

.story .thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:52% 50%;border-radius:50%}
.story.has-video-thumb .thumb{background-image:none;background-color:#e4e8e5;overflow:hidden}

.story,.story-list .story{grid-template-columns:61px minmax(0,1fr)}
.story-meta{display:flex;align-items:baseline;justify-content:flex-start;gap:14px;flex-wrap:wrap;min-width:0}
.story-meta time{flex:0 0 auto}
@media(max-width:620px){.story,.story-list .story{grid-template-columns:50px minmax(0,1fr)}.story-meta{gap:6px 12px}}
@media(max-width:370px){.story,.story-list .story{grid-template-columns:44px minmax(0,1fr)}}

html:not(.ready) .subpage{visibility:hidden}