/* K-ART Portal topdata v0.1.0 */
.topdata-loading,.topdata-empty{padding:28px 18px;border:1px dashed #d9dee7;border-radius:16px;background:#fafbfc;color:#697386;text-align:center;grid-column:1/-1}.topdata-img{background-position:center;background-size:cover;background-repeat:no-repeat}.topdata-noimg{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#e9f0ff,#f7f2ff);color:#68758a;font-size:11px;font-weight:800;letter-spacing:.12em;text-align:center}.topdata-cover-link,.topdata-news-card a,.topdata-pickup-card a{color:inherit;text-decoration:none;display:block}.topdata-recommend-card{overflow:hidden;padding:0!important}.topdata-recommend-img{height:160px}.topdata-recommend-body{padding:18px}.topdata-chip{display:inline-block;padding:5px 9px;border-radius:999px;background:#eef3ff;color:#506078;font-size:11px;font-weight:700}.topdata-recommend-body h3{margin:10px 0 8px}.topdata-recommend-body p{margin:0 0 12px}.topdata-more{font-size:13px;font-weight:700}.topdata-event-row{display:flex!important;gap:14px;align-items:center}.topdata-event-row .event-thumb{flex:0 0 110px;height:74px;border-radius:12px}.topdata-event-row small{display:block;margin-top:6px}.topdata-news-card{overflow:hidden}.topdata-news-card .news-photo{height:145px}.topdata-news-card time{display:block;margin-top:12px}.topdata-news-card h3{margin:7px 0 10px}.topdata-pickup-card{position:relative;overflow:hidden}.topdata-pickup-card .photo{height:145px;border-radius:12px}.topdata-pickup-card em{display:inline-block;margin-top:10px;font-style:normal;font-size:11px;font-weight:700}.topdata-pickup-card h3{margin:7px 0}.topdata-pickup-card p{margin:0 0 8px}.topdata-pickup-empty{min-height:190px;display:flex;flex-direction:column;justify-content:center}.event-list #top-event-list{display:flex;flex-direction:column;gap:10px}@media(max-width:720px){.topdata-recommend-img{height:150px}.topdata-event-row .event-thumb{flex-basis:94px;height:68px}.topdata-news-card .news-photo,.topdata-pickup-card .photo{height:130px}}

.wop-top-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.wop-top-card{background:#fff;border:1px solid #e5e9e8;border-radius:18px;padding:16px;display:flex;gap:12px;min-height:145px}
.wop-top-mark{width:42px;height:42px;flex:0 0 42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#173c35;color:#fff;font-weight:800;font-size:20px}
.wop-top-body{min-width:0}.wop-top-message{margin:0 0 10px;line-height:1.65;font-weight:600}.wop-top-meta{font-size:12px;color:#78817f}.wop-top-link{display:inline-block;margin-top:10px;font-size:12px;font-weight:700;color:#176b58;text-decoration:none}
@media(max-width:900px){.wop-top-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.wop-top-grid{grid-template-columns:1fr}.wop-top-card{min-height:auto}}

.wop-banner-section{padding-top:10px}
.wop-banner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:240px;padding:34px 38px;border-radius:28px;overflow:hidden;text-decoration:none;color:#fff;background:linear-gradient(135deg,#183b35 0%,#245d52 55%,#7ea89d 100%);box-shadow:0 18px 44px rgba(18,53,47,.18)}
.wop-banner::before{content:"";position:absolute;inset:auto auto -90px -80px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08)}
.wop-banner::after{content:"";position:absolute;right:140px;top:-80px;width:220px;height:220px;border-radius:50%;border:1px solid rgba(255,255,255,.18)}
.wop-banner-copy{position:relative;z-index:2;max-width:680px}
.wop-banner-kicker{display:inline-block;font-size:12px;letter-spacing:.18em;font-weight:800;opacity:.78;margin-bottom:10px}
.wop-banner h2{font-size:clamp(30px,5vw,54px);line-height:1.12;margin:0 0 16px}
.wop-banner p{font-size:16px;line-height:1.8;margin:0 0 20px;color:rgba(255,255,255,.9)}
.wop-banner-cta{display:inline-flex;align-items:center;font-weight:800;font-size:14px;padding:11px 16px;border-radius:999px;background:#fff;color:#183b35;transition:transform .2s ease}
.wop-banner:hover .wop-banner-cta{transform:translateX(4px)}
.wop-banner-symbol{position:relative;z-index:2;flex:0 0 180px;width:180px;height:180px;display:flex;align-items:center;justify-content:center}
.wop-orbit{position:absolute;width:170px;height:170px;border:1px solid rgba(255,255,255,.38);border-radius:50%}
.wop-orbit::before,.wop-orbit::after{content:"";position:absolute;border-radius:50%;background:#fff}
.wop-orbit::before{width:10px;height:10px;right:14px;top:28px;box-shadow:-122px 75px 0 rgba(255,255,255,.65)}
.wop-orbit::after{width:6px;height:6px;left:58px;bottom:8px;opacity:.75}
.wop-pin{width:92px;height:92px;border-radius:50% 50% 50% 12%;transform:rotate(-45deg);background:#fff;color:#183b35;display:flex;align-items:center;justify-content:center;font-size:34px;font-weight:900;box-shadow:0 14px 28px rgba(0,0,0,.18)}
.wop-pin::first-letter{transform:rotate(45deg)}
@media(max-width:760px){
  .wop-banner{min-height:210px;padding:26px 22px}
  .wop-banner-symbol{flex-basis:110px;width:110px;height:110px}
  .wop-orbit{width:105px;height:105px}
  .wop-pin{width:66px;height:66px;font-size:26px}
  .wop-banner p br{display:none}
}

/* Words on Planet TOP banner v0.1.7 - compact / fresh blue */
.wop-banner{
  min-height:120px;
  padding:20px 30px;
  border-radius:22px;
  background:linear-gradient(120deg,#2f80ed 0%,#56a9f5 52%,#83d5ee 100%);
  box-shadow:0 12px 30px rgba(47,128,237,.16);
}
.wop-banner::before{
  width:190px;height:190px;left:-60px;bottom:-120px;
  background:rgba(255,255,255,.10);
}
.wop-banner::after{
  width:150px;height:150px;right:105px;top:-92px;
  border-color:rgba(255,255,255,.22);
}
.wop-banner-kicker{margin-bottom:5px;font-size:10px}
.wop-banner h2{
  font-size:clamp(23px,3vw,34px);
  line-height:1.2;
  margin:0 0 7px;
  white-space:nowrap;
}
.wop-banner p{
  font-size:13px;
  line-height:1.55;
  margin:0 0 10px;
}
.wop-banner-cta{
  padding:7px 13px;
  font-size:12px;
  color:#236bb5;
}
.wop-banner-symbol{
  flex:0 0 92px;
  width:92px;height:92px;
}
.wop-orbit{width:88px;height:88px}
.wop-orbit::before{width:7px;height:7px;right:7px;top:15px;box-shadow:-63px 40px 0 rgba(255,255,255,.65)}
.wop-orbit::after{width:5px;height:5px;left:30px;bottom:3px}
.wop-pin{width:54px;height:54px;font-size:22px;box-shadow:0 9px 20px rgba(0,0,0,.13)}
@media(max-width:760px){
  .wop-banner{min-height:112px;padding:18px 18px;gap:12px}
  .wop-banner h2{font-size:clamp(19px,5.2vw,25px);white-space:nowrap}
  .wop-banner p{font-size:12px;margin-bottom:8px}
  .wop-banner-symbol{flex-basis:72px;width:72px;height:72px}
  .wop-orbit{width:68px;height:68px}
  .wop-pin{width:44px;height:44px;font-size:18px}
}
@media(max-width:430px){
  .wop-banner{padding:16px}
  .wop-banner-symbol{display:none}
  .wop-banner h2{font-size:20px}
}