@charset "utf-8";

.fgb-wrap{
  max-width:1120px;
  margin:34px auto 70px;
  padding:0 16px;
  font-family:'Pretendard','Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  color:#19172a;
}
.fgb-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
  padding:26px;
  border-radius:28px;
  background:
    radial-gradient(circle at 10% 0%, rgba(124,92,255,.14), transparent 34%),
    linear-gradient(135deg,#fff,#f8f4ff);
  border:1.5px solid #e8e3f5;
  box-shadow:0 18px 50px rgba(74,50,120,.09);
}
.fgb-hero small{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  background:#ede7ff;
  color:#6242df;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
}
.fgb-hero h1{
  margin:10px 0 7px;
  font-size:34px;
  line-height:1.15;
  letter-spacing:-.065em;
}
.fgb-hero p{
  margin:0;
  color:#6f6a80;
  line-height:1.65;
}
.fgb-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.fgb-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:9px 14px;
  border-radius:15px;
  border:1px solid #e8e3f5;
  background:#fff;
  color:#6242df!important;
  font-weight:900;
  text-decoration:none!important;
  cursor:pointer;
}
.fgb-btn.primary{
  border-color:transparent;
  background:linear-gradient(135deg,#7c5cff,#a48bff);
  color:#fff!important;
  box-shadow:0 10px 24px rgba(124,92,255,.20);
}
.fgb-btn.dark{
  border-color:transparent;
  background:#19172a;
  color:#fff!important;
}
.fgb-btn.danger{
  color:#ff4d7d!important;
  background:#fff3f7;
}
.fgb-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:14px 0;
  padding:14px;
  border-radius:22px;
  background:#fff;
  border:1.5px solid #e8e3f5;
  box-shadow:0 12px 34px rgba(74,50,120,.06);
}
.fgb-category{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding-bottom:2px;
}
.fgb-category a,
.fgb-category span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:7px 12px;
  border-radius:999px;
  background:#f4f0ff;
  color:#6242df!important;
  font-size:13px;
  font-weight:900;
  text-decoration:none!important;
  white-space:nowrap;
}
.fgb-category .on{
  background:#7c5cff;
  color:#fff!important;
}
.fgb-search{
  display:flex;
  align-items:center;
  gap:7px;
  flex:0 0 auto;
}
.fgb-search select,
.fgb-search input{
  height:38px;
  border:1px solid #e8e3f5;
  border-radius:13px;
  padding:0 10px;
  background:#fff;
  font-family:inherit;
}
.fgb-search button{
  height:38px;
  border:0;
  border-radius:13px;
  padding:0 13px;
  background:#19172a;
  color:#fff;
  font-weight:900;
}
.fgb-list{
  display:grid;
  gap:10px;
}
.fgb-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  min-height:82px;
  padding:16px 18px;
  border-radius:22px;
  background:#fff;
  border:1.5px solid #ece6fa;
  box-shadow:0 10px 28px rgba(74,50,120,.055);
  text-decoration:none!important;
  color:#19172a!important;
}
.fgb-row:hover{
  border-color:#d8cdfa;
  transform:translateY(-1px);
  box-shadow:0 14px 34px rgba(74,50,120,.10);
}
.fgb-no{
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:#f4f0ff;
  color:#6242df;
  font-weight:900;
  flex:0 0 auto;
}
.fgb-row.notice .fgb-no{
  background:#19172a;
  color:#fff;
}
.fgb-title{
  min-width:0;
}
.fgb-title strong{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  margin-bottom:6px;
  font-size:17px;
  line-height:1.35;
  letter-spacing:-.035em;
}
.fgb-title strong span.subject{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.fgb-title p{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  color:#7c768f;
  font-size:13px;
}
.fgb-badge{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  background:#fff0f5;
  color:#d63b70;
  font-size:11px;
  font-weight:900;
}
.fgb-meta{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
  color:#8a8499;
  font-size:12px;
  white-space:nowrap;
}
.fgb-check{
  width:18px;
  height:18px;
}
.fgb-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:18px;
}
.fgb-pages{
  display:flex;
  justify-content:center;
  margin:26px 0 0;
}
.fgb-pages .pg_wrap,
.fgb-pages .pg{
  display:flex;
  gap:5px;
  justify-content:center;
}
.fgb-pages a,
.fgb-pages strong,
.fgb-pages span{
  min-width:36px;
  height:36px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  border-radius:12px!important;
  border:1px solid #e8e3f5!important;
  background:#fff!important;
  color:#6242df!important;
  font-weight:900!important;
  text-decoration:none!important;
}
.fgb-pages strong,
.fgb-pages .pg_current{
  background:#7c5cff!important;
  color:#fff!important;
  border-color:#7c5cff!important;
}
.fgb-empty{
  padding:60px 20px;
  text-align:center;
  border-radius:24px;
  background:#fff;
  border:1.5px dashed #d8cdfa;
  color:#6f6a80;
  font-weight:800;
}
.fgb-view{
  padding:26px;
  border-radius:28px;
  background:#fff;
  border:1.5px solid #e8e3f5;
  box-shadow:0 18px 50px rgba(74,50,120,.08);
}
.fgb-view-head h1{
  margin:0 0 12px;
  font-size:32px;
  line-height:1.25;
  letter-spacing:-.06em;
}
.fgb-view-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  color:#7c768f;
  font-size:13px;
}
.fgb-view-content{
  margin-top:24px;
  padding-top:24px;
  border-top:1px solid #eee8fb;
  line-height:1.85;
  font-size:16px;
  color:#2c2737;
  word-break:break-word;
}
.fgb-view-content img{
  max-width:100%;
  height:auto;
  border-radius:16px;
}
.fgb-attach{
  margin:18px 0;
  padding:14px;
  border-radius:18px;
  background:#fbfaff;
  border:1px solid #eee8fb;
}
.fgb-attach a{
  color:#6242df!important;
  font-weight:900;
  text-decoration:none!important;
}
.fgb-write{
  padding:26px;
  border-radius:28px;
  background:#fff;
  border:1.5px solid #e8e3f5;
  box-shadow:0 18px 50px rgba(74,50,120,.08);
}
.fgb-form-row{
  margin-bottom:16px;
}
.fgb-form-row label{
  display:block;
  margin-bottom:8px;
  color:#4b465c;
  font-size:13px;
  font-weight:900;
}
.fgb-write input[type=text],
.fgb-write input[type=password],
.fgb-write input[type=file],
.fgb-write textarea,
.fgb-write select{
  width:100%;
  box-sizing:border-box;
  border:1.5px solid #e8e3f5;
  border-radius:16px;
  padding:13px 14px;
  font-family:inherit;
  font-size:15px;
  background:#fff;
}
.fgb-write textarea{
  min-height:260px;
  line-height:1.7;
}
.fgb-write input:focus,
.fgb-write textarea:focus,
.fgb-write select:focus{
  outline:none;
  border-color:#7c5cff;
  box-shadow:0 0 0 4px rgba(124,92,255,.12);
}
.fgb-comment{
  margin-top:24px;
  padding:22px;
  border-radius:24px;
  background:#fff;
  border:1.5px solid #e8e3f5;
}
.fgb-comment-list{
  display:grid;
  gap:10px;
}
.fgb-comment-item{
  padding:15px;
  border-radius:18px;
  background:#fbfaff;
  border:1px solid #eee8fb;
}
.fgb-comment-item.reply{
  margin-left:24px;
}
.fgb-comment-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
  font-size:13px;
  color:#7c768f;
}
.fgb-comment-content{
  line-height:1.7;
  color:#2c2737;
}
.fgb-comment-form{
  margin-top:16px;
}
.fgb-comment-form textarea{
  width:100%;
  min-height:100px;
  box-sizing:border-box;
  border:1.5px solid #e8e3f5;
  border-radius:18px;
  padding:14px;
  font-family:inherit;
}
.fgb-gallery{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.fgb-gcard{
  overflow:hidden;
  border-radius:24px;
  background:#fff;
  border:1.5px solid #ece6fa;
  box-shadow:0 12px 34px rgba(74,50,120,.07);
  color:#19172a!important;
  text-decoration:none!important;
}
.fgb-gthumb{
  aspect-ratio:4/3;
  background:
    radial-gradient(circle at 25% 20%, rgba(124,92,255,.22), transparent 28%),
    radial-gradient(circle at 80% 10%, rgba(255,143,199,.20), transparent 26%),
    #f6f2ff;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6242df;
  font-size:34px;
  font-weight:900;
}
.fgb-gthumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.fgb-gbody{
  padding:16px;
}
.fgb-gbody strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-bottom:8px;
  font-size:17px;
  letter-spacing:-.035em;
}
.fgb-gbody p{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  color:#7c768f;
  font-size:13px;
}
@media(max-width:900px){
  .fgb-hero{align-items:flex-start;flex-direction:column;}
  .fgb-toolbar{align-items:stretch;flex-direction:column;}
  .fgb-search{width:100%;flex-wrap:wrap;}
  .fgb-search input{flex:1 1 180px;}
  .fgb-gallery{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:640px){
  .fgb-wrap{margin-top:22px;padding:0 10px;}
  .fgb-hero{padding:22px;border-radius:23px;}
  .fgb-hero h1{font-size:28px;}
  .fgb-row{grid-template-columns:1fr;gap:9px;}
  .fgb-no{display:none;}
  .fgb-meta{align-items:flex-start;flex-direction:row;flex-wrap:wrap;}
  .fgb-bottom{align-items:stretch;flex-direction:column;}
  .fgb-actions{justify-content:flex-start;}
  .fgb-gallery{grid-template-columns:1fr;}
  .fgb-view,.fgb-write{padding:20px;border-radius:23px;}
  .fgb-view-head h1{font-size:26px;}
}


/* v0.4.6 board view profile/time layout */
.fgb-view-wrap{
  max-width:1120px;
}
.fgb-view-v46{
  padding:0;
  overflow:hidden;
}
.fgb-view-top{
  padding:30px 30px 22px;
  background:
    radial-gradient(circle at 8% 0%, rgba(124,92,255,.11), transparent 34%),
    linear-gradient(135deg,#fff,#fbf9ff);
  border-bottom:1px solid #eee8fb;
}
.fgb-view-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:14px;
}
.fgb-badge-dark,
.fgb-badge-soft{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  line-height:1;
}
.fgb-badge-dark{
  background:#19172a;
  color:#fff;
}
.fgb-badge-soft{
  background:#ede7ff;
  color:#6242df;
}
.fgb-view-top h1{
  margin:0;
  color:#19172a;
  font-size:34px;
  line-height:1.25;
  letter-spacing:-.06em;
  word-break:keep-all;
}
.fgb-view-author{
  display:flex;
  align-items:center;
  gap:13px;
  margin-top:18px;
}
.fgb-profile-img{
  width:52px;
  height:52px;
  flex:0 0 52px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  background:linear-gradient(135deg,#7c5cff,#a48bff);
  box-shadow:0 12px 24px rgba(124,92,255,.18);
}
.fgb-profile-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.fgb-profile-fallback{
  color:#fff;
  font-size:20px;
  font-weight:900;
}
.fgb-author-text{
  min-width:0;
}
.fgb-author-text strong{
  display:block;
  color:#19172a;
  font-size:16px;
  font-weight:900;
  line-height:1.25;
}
.fgb-author-text p{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin:6px 0 0;
  color:#7c768f;
  font-size:13px;
  line-height:1.45;
}
.fgb-resource-box{
  display:grid;
  gap:10px;
  padding:20px 30px 0;
}
.fgb-resource-section{
  padding:15px;
  border-radius:18px;
  background:#fbfaff;
  border:1px solid #eee8fb;
}
.fgb-resource-section b{
  display:block;
  margin-bottom:8px;
  color:#19172a;
  font-size:13px;
}
.fgb-resource-section a{
  display:block;
  color:#6242df!important;
  font-size:13px;
  font-weight:900;
  line-height:1.6;
  text-decoration:none!important;
  word-break:break-all;
}
.fgb-view-content-card{
  padding:24px 30px 30px;
}
.fgb-view-content{
  min-height:120px;
  padding:28px;
  border-radius:22px;
  background:#fff;
  border:1px solid #eee8fb;
  color:#2c2737;
  font-size:16px;
  line-height:1.85;
  word-break:break-word;
}
.fgb-view-content p{
  margin:0 0 1em;
}
.fgb-view-content p:last-child{
  margin-bottom:0;
}
.fgb-view-content img{
  max-width:100%;
  height:auto;
  border-radius:16px;
}
.fgb-view-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:20px 30px 26px;
  border-top:1px solid #eee8fb;
  background:#fbfaff;
}
.fgb-actions-left,
.fgb-actions-right{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.fgb-actions-right{
  justify-content:flex-end;
}
@media(max-width:720px){
  .fgb-view-top,
  .fgb-view-content-card,
  .fgb-view-bottom{
    padding-left:18px;
    padding-right:18px;
  }
  .fgb-view-top h1{
    font-size:27px;
  }
  .fgb-view-author{
    align-items:flex-start;
  }
  .fgb-profile-img{
    width:46px;
    height:46px;
    flex-basis:46px;
    border-radius:16px;
  }
  .fgb-author-text p{
    flex-direction:column;
    gap:4px;
  }
  .fgb-view-content{
    padding:20px;
  }
  .fgb-view-bottom{
    align-items:stretch;
    flex-direction:column;
  }
  .fgb-actions-left,
  .fgb-actions-right{
    justify-content:flex-start;
  }
}