/*
 * GameNaviX editorial renewal
 * Design-only overrides for the JIN theme.
 */
:root{
  --gnx-navy:#14182B;
  --gnx-navy-2:#1C2240;
  --gnx-blue:#3D8BFF;
  --gnx-text:#171A27;
  --gnx-muted:#737A8C;
  --gnx-bg:#F4F6FA;
  --gnx-line:#E5E8F0;
  --gnx-white:#FFFFFF;
  --gnx-shadow:0 16px 40px rgba(20,24,43,.12);
}

body{
  background:var(--gnx-bg)!important;
  color:var(--gnx-text)!important;
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",Meiryo,sans-serif!important;
  -webkit-font-smoothing:antialiased;
}
#contents{padding-top:34px!important;}
#main-contents,.main-contents,#main-contents-one{
  background:transparent!important;
}

/* Header */
#header-box{
  position:sticky!important;
  top:0;
  z-index:9999;
  background:rgba(20,24,43,.97)!important;
  box-shadow:0 8px 28px rgba(7,10,24,.24);
  backdrop-filter:blur(14px);
}
.admin-bar #header-box{top:32px;}
#header-box #header,
#header-box .header,
#header-box #drawernav3{
  background:transparent!important;
}
#site-info a{
  color:#fff!important;
  font-weight:900!important;
  letter-spacing:.02em;
  display:inline-flex!important;
  align-items:center;
  gap:11px;
}
#site-info a:before{
  content:"";
  width:32px;
  height:32px;
  flex:0 0 32px;
  border-radius:9px;
  background:linear-gradient(145deg,var(--gnx-blue),#70A9FF);
  box-shadow:0 7px 18px rgba(61,139,255,.35);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.1 6.5h9.8a4.5 4.5 0 0 1 4.35 5.65l-1.05 3.9a2.9 2.9 0 0 1-4.8 1.35l-1.25-1.1H9.85L8.6 17.4a2.9 2.9 0 0 1-4.8-1.35l-1.05-3.9A4.5 4.5 0 0 1 7.1 6.5Zm.2 4.1H5.8v1.4h1.5v1.5h1.4V12h1.5v-1.4H8.7V9.1H7.3v1.5Zm9.15-.35a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm2.1 2.3a1 1 0 1 0 0 2 1 1 0 0 0 0-2Z'/%3E%3C/svg%3E") center/24px 24px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.1 6.5h9.8a4.5 4.5 0 0 1 4.35 5.65l-1.05 3.9a2.9 2.9 0 0 1-4.8 1.35l-1.25-1.1H9.85L8.6 17.4a2.9 2.9 0 0 1-4.8-1.35l-1.05-3.9A4.5 4.5 0 0 1 7.1 6.5Zm.2 4.1H5.8v1.4h1.5v1.5h1.4V12h1.5v-1.4H8.7V9.1H7.3v1.5Zm9.15-.35a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm2.1 2.3a1 1 0 1 0 0 2 1 1 0 0 0 0-2Z'/%3E%3C/svg%3E") center/24px 24px no-repeat;
}
#header-box .menu-box a,
#header-box .menu-box span,
#header-box .jic-type,
#headmenu a{
  color:#F5F7FF!important;
}
#header-box .menu-box a:hover,
#headmenu a:hover{color:#8FBCFF!important;}
#headmenu .search-box input,
#headmenu input[type="search"]{
  background:#242B4A!important;
  border-color:#353E66!important;
  color:#fff!important;
}
#headmenu input::placeholder{color:#A8B0C8!important;}

/* Typography */
h1,h2,h3,h4,
.post-list-title,.archive-post-header h1,.entry-title,.article-title{
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",Meiryo,sans-serif!important;
  font-weight:900!important;
  letter-spacing:-.025em;
}
.single .entry-title,.single .cps-post-main h1{
  line-height:1.48!important;
  margin-bottom:34px!important;
}
.single .cps-post-main h2,
.page .cps-post-main h2{
  margin-top:2.8em!important;
  margin-bottom:1.15em!important;
  padding:18px 20px!important;
  border-left:5px solid var(--gnx-blue)!important;
  background:#F4F7FF!important;
  color:#11172A!important;
  border-radius:0 10px 10px 0!important;
}
.single .cps-post-main h3,
.page .cps-post-main h3{
  margin-top:2.2em!important;
  margin-bottom:1em!important;
  padding-bottom:12px!important;
  border-bottom:2px solid #DDE8FF!important;
}

/* Top tabs / section headings */
.tabBtn-mag{
  margin-bottom:28px!important;
  border:0!important;
  gap:10px;
}
.tabBtn-mag li label{
  font-size:18px!important;
  font-weight:900!important;
  padding:12px 18px!important;
  border-radius:10px!important;
  background:#E9EDF6!important;
  color:#3B4358!important;
}
.toppost-list-box input#tab-1:checked~.tabBtn-mag li:nth-child(1) label,
.toppost-list-box input#tab-2:checked~.tabBtn-mag li:nth-child(2) label,
.toppost-list-box input#tab-3:checked~.tabBtn-mag li:nth-child(3) label,
.toppost-list-box input#tab-4:checked~.tabBtn-mag li:nth-child(4) label,
.toppost-list-box input#tab-5:checked~.tabBtn-mag li:nth-child(5) label{
  background:var(--gnx-navy)!important;
  color:#fff!important;
  box-shadow:0 9px 22px rgba(20,24,43,.15);
}

/* Cards */
.post-list-mag,
.post-list-mag-sp1col{
  gap:22px!important;
}
.post-list-mag .post-list-item,
.post-list-mag-sp1col .post-list-item,
.post-list .post-list-item{
  border:1px solid var(--gnx-line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:0 4px 14px rgba(20,24,43,.06)!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.post-list-mag .post-list-item:hover,
.post-list-mag-sp1col .post-list-item:hover,
.post-list .post-list-item:hover{
  transform:translateY(-5px) scale(1.012);
  box-shadow:var(--gnx-shadow)!important;
  border-color:#C7D7F7!important;
}
.post-list-thumb{
  position:relative!important;
  overflow:hidden!important;
  aspect-ratio:16/9!important;
  background:#E9EDF5!important;
}
.post-list-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  transition:transform .35s ease!important;
}
.post-list-item:hover .post-list-thumb img{transform:scale(1.045);}
.post-list-mag .post-list-meta,
.post-list-mag-sp1col .post-list-meta{
  padding:18px 18px 20px!important;
}
.post-list-title{
  color:#151A2C!important;
  font-size:17px!important;
  line-height:1.55!important;
}
.post-list-date,.author-name,.post-list-desc{color:var(--gnx-muted)!important;}

/* category chips */
.post-list-cat,.gnx-mini-cat{
  display:inline-flex!important;
  align-items:center;
  width:auto!important;
  min-width:0!important;
  border-radius:999px!important;
  color:#fff!important;
  font-weight:800!important;
  font-size:11px!important;
  line-height:1!important;
  letter-spacing:.02em;
  padding:7px 10px!important;
  box-shadow:0 5px 12px rgba(20,24,43,.14);
}
.post-list-thumb>.post-list-cat{
  position:absolute!important;
  top:12px!important;
  left:12px!important;
  z-index:4!important;
}
.category-id-19{background:#2878F0!important;} /* ゲーム */
.category-id-26{background:#E95C9D!important;} /* 出会い */
.category-id-25{background:#8C63D9!important;} /* 占い */
.category-id-24{background:#32A66D!important;} /* 語学 */
.category-id-20{background:#EB8B32!important;} /* 配信 */
.category-id-21{background:#707A8D!important;} /* その他 */
.category-id-23{background:#9A6670!important;} /* アダルト */
.category-id-1{background:#778092!important;}  /* 未分類 */

/* Archive */
.archive-post-header{
  background:var(--gnx-navy)!important;
  color:#fff!important;
  border-radius:14px!important;
  padding:28px 30px!important;
  margin-bottom:28px!important;
}
.archive-post-header h1{
  color:#fff!important;
  font-size:30px!important;
}
.archive-box{background:transparent!important;}

/* Sidebar */
#sidebar{
  background:transparent!important;
}
.gnx-ranking-widget,.gnx-sidebar-search{
  background:#fff;
  border:1px solid var(--gnx-line);
  border-radius:14px;
  padding:22px;
  margin-bottom:24px;
  box-shadow:0 5px 18px rgba(20,24,43,.06);
}
.gnx-widget-heading{
  margin-bottom:18px;
  border-bottom:1px solid var(--gnx-line);
  padding-bottom:13px;
}
.gnx-widget-heading span{
  display:block;
  color:var(--gnx-blue);
  font-weight:900;
  font-size:10px;
  letter-spacing:.16em;
}
.gnx-widget-heading h2{
  margin:2px 0 0!important;
  font-size:19px!important;
  font-weight:900!important;
  color:var(--gnx-navy)!important;
}
.gnx-ranking-item{
  display:grid;
  grid-template-columns:28px 82px 1fr;
  gap:11px;
  align-items:center;
  padding:12px 0;
  border-bottom:1px solid #EEF0F5;
  color:inherit!important;
}
.gnx-ranking-item:last-child{border-bottom:0;}
.gnx-rank-number{
  width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--gnx-navy);
  color:#fff;font-size:12px;font-weight:900;
}
.gnx-ranking-item:nth-of-type(2) .gnx-rank-number{background:#F6B73C;color:#1A1D28;}
.gnx-ranking-item:nth-of-type(3) .gnx-rank-number{background:#AAB4C8;}
.gnx-ranking-item:nth-of-type(4) .gnx-rank-number{background:#C58A61;}
.gnx-rank-thumb{
  width:82px;height:56px;border-radius:8px;overflow:hidden;background:#E9EDF4;
}
.gnx-rank-thumb img{width:100%;height:100%;object-fit:cover;}
.gnx-rank-copy{min-width:0;}
.gnx-rank-copy strong{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:12px;line-height:1.55;
  color:#1B2033;
}
.gnx-mini-cat{
  font-size:9px!important;
  padding:4px 7px!important;
  margin-bottom:5px;
  box-shadow:none;
}
.gnx-sidebar-search .search-box,
.gnx-sidebar-search form{margin:0!important;}

/* Footer */
footer{
  background:var(--gnx-navy)!important;
  color:#D8DEED!important;
  margin-top:64px!important;
}
.gnx-footer-directory{
  max-width:1180px;
  margin:0 auto;
  padding:48px 24px 30px;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:56px;
}
.gnx-footer-directory h2{
  color:#fff!important;
  font-size:18px!important;
  margin:0 0 18px!important;
}
.gnx-footer-directory ul{
  margin:0!important;
  padding:0!important;
  list-style:none!important;
}
.gnx-footer-directory .cat-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.gnx-footer-directory .cat-list li{margin:0!important;}
.gnx-footer-directory .cat-list a{
  display:block;
  padding:8px 12px;
  border:1px solid #39415F;
  border-radius:999px;
  color:#EAF0FF!important;
  font-size:12px;
}
.gnx-footer-directory .archive-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 18px;
}
.gnx-footer-directory .archive-list a{
  color:#B9C3DA!important;
  font-size:12px;
}
.gnx-footer-directory a:hover{color:#fff!important;border-color:var(--gnx-blue);}
#footer-box{
  background:#0E1222!important;
  border-top:1px solid #2A314D!important;
}
#footer-box a,#copyright,#copyright-center{color:#AEB8D0!important;}
#footer-widget-area{background:transparent!important;}

/* Common surfaces */
.cps-post-box,.post-entry,.cps-post-main,.single .article-body{
  border-radius:14px!important;
}
.pagination a,.pagination span,.pager-top a,.pager-top span{
  border-radius:9px!important;
}
.pagination .current,.pager-top .current{
  background:var(--gnx-blue)!important;
  color:#fff!important;
}

@media (max-width:780px){
  .admin-bar #header-box{top:0;}
  #contents{padding-top:20px!important;}
  #site-info a:before{width:28px;height:28px;flex-basis:28px;}
  .tabBtn-mag{
    overflow-x:auto;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    padding-bottom:6px!important;
  }
  .tabBtn-mag li{flex:0 0 auto!important;}
  .tabBtn-mag li label{font-size:14px!important;padding:10px 13px!important;}
  .post-list-mag-sp1col .post-list-item{margin-bottom:18px!important;}
  .post-list-title{font-size:16px!important;}
  .post-list-thumb>.post-list-cat{top:10px!important;left:10px!important;}
  .gnx-footer-directory{
    grid-template-columns:1fr;
    gap:30px;
    padding:38px 18px 26px;
  }
  .gnx-footer-directory .archive-list{grid-template-columns:1fr 1fr;}
  .archive-post-header{padding:22px 20px!important;}
  .archive-post-header h1{font-size:24px!important;}
}



/* Compatibility with JIN category markup */
.post-list-inner{position:relative!important;}
.post-list-meta>.post-list-cat{
  position:absolute!important;
  top:12px!important;
  left:12px!important;
  z-index:4!important;
  margin:0!important;
}
.post-list-cat[class*="%e3%82%b2%e3%83%bc%e3%83%a0"]{background:#2878F0!important;}
.post-list-cat[class*="%e5%87%ba%e4%bc%9a%e3%81%84"]{background:#E95C9D!important;}
.post-list-cat[class*="%e5%8d%a0%e3%81%84"]{background:#8C63D9!important;}
.post-list-cat[class*="%e8%aa%9e%e5%ad%a6"]{background:#32A66D!important;}
.post-list-cat[class*="%e9%85%8d%e4%bf%a1"]{background:#EB8B32!important;}
.post-list-cat[class*="%e3%81%9d%e3%81%ae%e4%bb%96"]{background:#707A8D!important;}
.post-list-cat[class*="%e3%82%a2%e3%83%80%e3%83%ab%e3%83%88"]{background:#9A6670!important;}
.toppost-list-box:before,
.toppost-list-box-simple:before{
  content:"LATEST STORIES  /  最新記事";
  display:block;
  margin:0 0 26px;
  color:var(--gnx-navy);
  font-size:28px;
  line-height:1.25;
  font-weight:900;
  letter-spacing:-.03em;
}
@media (max-width:780px){
  .post-list-meta>.post-list-cat{top:10px!important;left:10px!important;}
  .toppost-list-box:before,.toppost-list-box-simple:before{font-size:23px;margin-bottom:20px;}
}