@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+KR:wght@400;500;600;700&display=swap');
/* Shared by the public portal and the personal/group screens. */
.ol-header{position:sticky;top:0;z-index:50;width:100%;isolation:isolate;background:#16352f;color:#fff;font-family:"IBM Plex Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;font-size:18.2px;line-height:1.5;letter-spacing:0;box-shadow:0 1px 0 #16352f12}
.ol-header *{box-sizing:border-box}
.ol-header button,.ol-header input,.ol-header summary{font:inherit}
.ol-header button,.ol-header a,.ol-header summary{-webkit-tap-highlight-color:transparent}
.ol-header a{color:inherit;text-decoration:none}
.ol-header button{border:0;border-radius:0;background:none;color:inherit;cursor:pointer;margin:0}
.ol-header :focus-visible{outline:3px solid #e3982c;outline-offset:3px}
.ol-header .ol-top-row{max-width:1440px;margin:0 auto;min-height:78px;padding:13px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.ol-header .ol-brand{display:flex;align-items:center;gap:12px;min-width:0;flex-shrink:0;text-align:left;padding:0}
.ol-header .ol-brand>svg{display:block;width:38px;height:42px;flex-shrink:0;color:#fff}
.ol-header .ol-brand-copy{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.ol-header .ol-brand-copy>b{font-size:32.5px;line-height:1.25;letter-spacing:-.055em;font-weight:700;color:#fff;white-space:nowrap}
.ol-header .ol-brand-copy>small{font-size:14.3px;line-height:1.5;font-weight:400;letter-spacing:0;color:#d0ded6;white-space:nowrap}
.ol-header .ol-controls,.ol-header .ol-account{display:flex;align-items:center}
.ol-header .ol-controls{gap:14px;min-width:0}
.ol-header .ol-account{gap:17px;min-width:0}
.ol-header .ol-user{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;min-height:44px;padding:0;max-width:144px;text-align:left}
.ol-header .ol-user>b{display:block;max-width:144px;font-size:16.9px;line-height:1.5;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.ol-header .ol-user>small{display:block;font-size:14.3px;line-height:1.5;color:#d0ded6;font-weight:400}
.ol-header .ol-wallet{display:flex;align-items:center;gap:20px;border-left:1px solid #ffffff30;border-right:1px solid #ffffff30;padding:0 18px}
.ol-header .ol-wallet>span{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:43px}
.ol-header .ol-wallet small{font-size:14.3px;font-weight:400;color:#d0ded6;line-height:1.5}
.ol-header .ol-wallet b{font-size:20.8px;font-weight:600;line-height:1.5;font-variant-numeric:tabular-nums;color:#f0ad4e}
.ol-header .ol-login,.ol-header .ol-register{display:flex;align-items:center;justify-content:center;min-height:39px;padding:8px 13px;border:1px solid #ffffff4a;border-radius:7px;font-size:16.9px;font-weight:500;white-space:nowrap}
.ol-header .ol-register{background:#e3982c;color:#1b201b;border-color:#e3982c}
.ol-header .ol-icon{display:flex;align-items:center;justify-content:center;min-width:36px;min-height:42px;padding:7px;cursor:pointer;list-style:none;color:#fff}
.ol-header .ol-icon>svg{display:block;width:19px;height:19px}
.ol-header .ol-icon::-webkit-details-marker{display:none}
.ol-header .ol-more{position:relative}
.ol-header .ol-more>summary{display:flex;align-items:center;justify-content:center;gap:5px;min-height:42px;padding:7px 3px;color:#fff;font-size:16.9px;font-weight:500;list-style:none;white-space:nowrap;cursor:pointer;border-radius:5px}
.ol-header .ol-more>summary::-webkit-details-marker{display:none}
.ol-header .ol-more>summary>svg{width:15px;height:15px}
.ol-header .ol-more[open]>summary,.ol-header .ol-icon:hover{background:#ffffff10}
.ol-header .ol-more-panel{position:absolute;top:calc(100% + 16px);right:0;z-index:70;width:400px;max-width:calc(100vw - 28px);padding:17px;background:#fff;color:#203b30;border:1px solid #dfe7e2;border-radius:10px;box-shadow:0 12px 36px #102a2426;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.ol-header .ol-more-panel>div{display:flex;flex-direction:column;align-items:stretch;gap:3px;min-width:0}
.ol-header .ol-more-panel>div>span{display:block;font-size:14.3px;font-weight:700;color:#244d41;background:#e5efea;border:1px solid #d2e2d9;border-radius:6px;padding:8px 9px;margin-bottom:7px;line-height:1.5}
.ol-header .ol-more-panel a,.ol-header .ol-more-panel button{display:block;text-align:left;width:100%;min-height:39px;padding:8px 9px;border:0;border-radius:5px;background:none;color:#324f3e;font-size:16.9px;font-weight:400;line-height:1.6;white-space:normal}
.ol-header .ol-more-panel a:hover,.ol-header .ol-more-panel button:hover{background:#f2f6f3}
.ol-header .ol-primary-shell{background:#fff;border-bottom:1px solid #dfe7e2}
.ol-header .ol-primary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));max-width:1440px;margin:0 auto;padding:0 28px;gap:0;min-height:55px;background:#fff;overflow:visible;border:0}
.ol-header .ol-primary>a{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:55px;padding:14px 4px 12px;color:#607468;background:none;border:0;border-bottom:3px solid transparent;font-size:20.8px;font-weight:600;line-height:1.5;letter-spacing:-.04em;text-align:center;white-space:nowrap}
.ol-header .ol-primary>a:hover{background:#f4f7f5;color:#16352f}
.ol-header .ol-primary>a[aria-current=page]{color:#16352f;background:#f8f3e8;border-bottom-color:transparent;font-weight:700}
.ol-header .ol-search-menu{position:static}
.ol-header .ol-search-panel{position:absolute;top:100%;left:0;right:0;z-index:65;padding:18px 28px;background:#fff;color:#203b30;border-bottom:1px solid #dfe7e2;box-shadow:0 8px 20px #102a241a}
.ol-header .ol-search-panel[hidden]{display:none}
.ol-header .ol-search-inner{max-width:1060px;margin:0 auto}
.ol-header .ol-search-field{display:flex;align-items:center;gap:10px;padding:9px 12px;background:#f4f7f5;border:1px solid #d9e3dc;border-radius:8px;color:#607468}
.ol-header .ol-search-field>svg{width:18px;height:18px;flex-shrink:0}
.ol-header .ol-search-field input{min-width:0;flex:1;display:block;width:100%;padding:3px 0;border:0;background:none;box-shadow:none;color:#203b30;font-size:19.5px;line-height:1.6}
.ol-header .ol-search-field input::placeholder{color:#718376}
.ol-header .ol-search-field button{display:flex;align-items:center;justify-content:center;min-width:30px;min-height:30px;padding:5px;color:#607468}
.ol-header .ol-search-field button>svg{width:17px;height:17px}
.ol-header .ol-search-results{display:flex;gap:7px;flex-wrap:wrap;max-height:280px;overflow:auto;padding-top:11px}
.ol-header .ol-search-results:empty{display:none}
.ol-header .ol-search-results a{display:flex;align-items:center;min-height:35px;padding:6px 11px;border:1px solid #dfe7e2;border-radius:6px;background:#f4f7f5;color:#324f3e;font-size:15.6px}
.ol-header .ol-search-results a:hover{border-color:#b4c7ba;background:#eaf1ec}
.ol-header .ol-search-results p,.ol-header .ol-search-note{margin:10px 0 0;font-size:15.6px;line-height:1.7;color:#718376}
.ol-header .ol-notifications{position:relative}
.ol-header .ol-notification-panel{position:absolute;right:0;top:calc(100% + 16px);width:300px;padding:20px;background:#fff;color:#203b30;border:1px solid #dfe7e2;border-radius:10px;box-shadow:0 12px 36px #102a2426}
.ol-header .ol-notification-panel h2{margin:0 0 9px;font-size:22.1px;line-height:1.5;font-weight:600;color:#203b30}
.ol-header .ol-notification-panel p{margin:0 0 13px;font-size:16.9px;line-height:1.8;color:#607468}
.ol-header .ol-notification-panel a{font-size:16.9px;color:#32674a;text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.ol-header .ol-top-row{padding-inline:22px;gap:18px}.ol-header .ol-controls{gap:9px}.ol-header .ol-account{gap:12px}.ol-header .ol-wallet{gap:13px;padding-inline:13px}.ol-header .ol-primary{padding-inline:22px}}
@media(max-width:760px){
 .ol-header .ol-top-row{min-height:68px;padding:10px 16px;gap:12px}
 .ol-header .ol-brand{gap:9px}
 .ol-header .ol-brand>svg{width:31px;height:36px}
 .ol-header .ol-brand-copy>b{font-size:28.6px}
 .ol-header .ol-brand-copy>small{display:none}
 .ol-header .ol-controls{gap:6px}
 .ol-header .ol-account{gap:6px}
 .ol-header .ol-wallet,.ol-header .ol-register,.ol-header .ol-notifications,.ol-header .ol-notification-button{display:none}
 .ol-header .ol-user,.ol-header .ol-user>b{max-width:86px}
 .ol-header .ol-user>b{font-size:15.6px}
 .ol-header .ol-user>small{font-size:13px}
 .ol-header .ol-login{min-height:36px;padding:6px 9px;font-size:15.6px}
 .ol-header .ol-icon{min-width:34px;min-height:40px;padding:7px}
 .ol-header .ol-more>summary{font-size:15.6px;gap:4px;min-height:40px;padding-inline:2px}
 .ol-header .ol-primary{padding-inline:8px;grid-template-columns:repeat(5,minmax(0,1fr))}
 .ol-header .ol-primary>a{min-height:50px;padding:12px 1px 10px;font-size:15.6px;letter-spacing:-.05em}
 .ol-header .ol-more-panel{width:370px;max-width:calc(100vw - 28px);padding:14px;gap:8px;max-height:calc(100dvh - 90px);overflow:auto}
 .ol-header .ol-more-panel a,.ol-header .ol-more-panel button{font-size:15.6px;min-height:42px}
 .ol-header .ol-search-panel{padding:14px 16px}
 .ol-header .ol-search-field input{font-size:20.8px}
}
@media(max-width:380px){.ol-header .ol-top-row{padding-inline:12px}.ol-header .ol-account[data-authenticated=true]{display:none}.ol-header .ol-controls{gap:4px}.ol-header .ol-brand{gap:8px}}
@media(pointer:coarse){.ol-header .ol-icon,.ol-header .ol-more>summary,.ol-header .ol-user,.ol-header .ol-login,.ol-header .ol-register{min-height:44px}.ol-header .ol-icon{min-width:40px}}

/* Allow enlarged navigation and account text to wrap on narrow screens. */
@media(max-width:760px){.ol-header .ol-primary>a{white-space:normal;overflow-wrap:anywhere}}
@media(max-width:420px){.ol-header .ol-top-row{flex-wrap:wrap;row-gap:7px}.ol-header .ol-controls{margin-left:auto}}

/* Keep the introduction beside the Olgong Nara logo. */
.ol-header .ol-top-row{flex-wrap:wrap;row-gap:10px}
.ol-header .ol-brand-group{display:flex;align-items:center;gap:18px;min-width:0;flex-shrink:0}
.ol-header .ol-intro-link{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:40px;padding:8px 12px;border:1px solid #e3982c99;border-radius:7px;background:#ffffff08;color:#f0bd73;font-size:16.9px;font-weight:500;line-height:1.5;letter-spacing:-.035em;white-space:nowrap}
.ol-header .ol-intro-link:hover{background:#e3982c;border-color:#e3982c;color:#1b201b}
.ol-header .ol-controls{margin-left:auto}
@media(max-width:760px){.ol-header .ol-brand-group{gap:12px}.ol-header .ol-intro-link{min-height:36px;padding:6px 8px;font-size:14.3px}}

/* Selected section tabs echo the pale green canvas below them. */
.ol-header .ol-primary>a[data-groups][aria-current=page]{background:#e2ecf1}
.ol-header .ol-primary>a[data-main-board="olgong-news"][aria-current=page]{background:#eceeef}
.ol-header .ol-primary>a[data-activity][aria-current=page]{background:#cfe3f2}

.ol-header .ol-primary>a[data-regions][aria-current=page]{background:#dce5e0}

/* Match the person evaluation tab to its Indian yellow page canvas. */
.ol-header .ol-primary>a[data-patriot-talent][aria-current=page]{background:#fae8bc;color:#172b47}

/* Primary administrator shortcut sits between the brand and the account controls. */
.ol-header .ol-member-admin{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:46px;padding:10px 18px;margin-inline:auto;border:2px solid #f4c76a;border-radius:9px;background:#ffedbe;color:#173b30;font-size:17px;font-weight:800;line-height:1.4;white-space:nowrap;box-shadow:0 2px 8px #0002}
.ol-header .ol-member-admin:hover{background:#ffdb88;color:#102d23}
.ol-header .ol-member-admin[hidden]{display:none!important}
@media(max-width:1080px){
 .ol-header .ol-top-row[data-member-admin="true"]{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:10px}
 .ol-header .ol-top-row[data-member-admin="true"]>.ol-member-admin{margin:0;justify-self:end}
 .ol-header .ol-top-row[data-member-admin="true"]>.ol-controls{grid-column:1/-1;width:100%;justify-content:center;margin:0}
}
@media(max-width:420px){.ol-header .ol-member-admin{font-size:15px;padding:8px 12px;min-height:44px}.ol-header .ol-top-row[data-member-admin="true"]>.ol-brand-group{gap:8px}}

