.yl-income-ranking{margin:20px 0 30px;font-size:15px;line-height:1.6;color:#222}
.yl-income-ranking *{box-sizing:border-box}
.yl-income-ranking-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;border:1px solid #e2e5e9;border-bottom:3px solid #2878c8;background:#fff}
.yl-income-ranking-head strong{font-size:19px;font-weight:800}.yl-income-ranking-head span{font-size:13px;color:#68707a}
.yl-income-ranking-list{border:1px solid #e2e5e9;border-top:0;background:#fff}
.yl-income-rank-card{display:grid;grid-template-columns:70px 112px minmax(220px,1fr) 170px;align-items:center;min-height:116px;border-bottom:1px solid #e8eaed;background:#fff;transition:background .15s ease}
.yl-income-rank-card:last-child{border-bottom:0}.yl-income-rank-card:hover{background:#fafcff}
.yl-income-rank-badge{display:flex;align-items:baseline;justify-content:center;gap:2px;font-weight:800;color:#525a63;text-align:center}
.yl-income-rank-number{font-size:28px;line-height:1}.yl-income-rank-label{font-size:13px}
.yl-income-rank-1 .yl-income-rank-badge,.yl-income-rank-2 .yl-income-rank-badge,.yl-income-rank-3 .yl-income-rank-badge{width:48px;height:48px;justify-self:center;align-items:center;border-radius:50%;gap:1px;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.yl-income-rank-1 .yl-income-rank-badge{background:#c89b24}.yl-income-rank-2 .yl-income-rank-badge{background:#89939f}.yl-income-rank-3 .yl-income-rank-badge{background:#a96f45}
.yl-income-rank-1 .yl-income-rank-number,.yl-income-rank-2 .yl-income-rank-number,.yl-income-rank-3 .yl-income-rank-number{font-size:22px}.yl-income-rank-1 .yl-income-rank-label,.yl-income-rank-2 .yl-income-rank-label,.yl-income-rank-3 .yl-income-rank-label{font-size:11px}
.yl-income-rank-thumb{display:block;width:92px;height:92px;overflow:hidden;border-radius:4px;background:#f1f3f5;justify-self:center}
.yl-income-rank-thumb img{display:block;width:100%;height:100%;object-fit:cover;margin:0;padding:0;border:0}
.yl-income-rank-person{min-width:0;padding:16px 18px 16px 4px}.yl-income-rank-name{display:inline-block;font-size:18px;font-weight:800;line-height:1.45;color:#1769aa;text-decoration:none}.yl-income-rank-name:hover{text-decoration:underline}.yl-income-rank-cats{font-size:12px;color:#7b838c;margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yl-income-rank-income{align-self:stretch;border-left:1px solid #eceff2;padding:18px 18px;display:flex;flex-direction:column;justify-content:center;background:#fcfcfd}
.yl-income-rank-income span{font-size:12px;color:#7b838c;margin-bottom:2px}.yl-income-rank-income strong{font-size:22px;line-height:1.35;font-weight:800;color:#1f252b}.yl-income-rank-income small{font-size:12px;color:#6f7780;margin-top:4px}
.yl-income-ranking-note{font-size:12px;color:#777;text-align:right;margin:8px 1px 0}.yl-income-message{padding:14px;border:1px solid #ddd;background:#fafafa}
@media(max-width:700px){.yl-income-ranking-head{align-items:flex-start;flex-direction:column;gap:2px}.yl-income-rank-card{grid-template-columns:48px 76px minmax(0,1fr);min-height:92px}.yl-income-rank-badge{justify-content:flex-start}.yl-income-rank-number{font-size:22px}.yl-income-rank-1 .yl-income-rank-badge,.yl-income-rank-2 .yl-income-rank-badge,.yl-income-rank-3 .yl-income-rank-badge{width:38px;height:38px}.yl-income-rank-1 .yl-income-rank-number,.yl-income-rank-2 .yl-income-rank-number,.yl-income-rank-3 .yl-income-rank-number{font-size:18px}.yl-income-rank-thumb{width:68px;height:68px}.yl-income-rank-person{padding:11px 8px}.yl-income-rank-name{font-size:15px}.yl-income-rank-income{grid-column:2 / 4;border-left:0;border-top:1px solid #eceff2;padding:8px 10px;display:grid;grid-template-columns:68px 1fr auto;align-items:center;gap:6px;background:#fff}.yl-income-rank-income span,.yl-income-rank-income small{margin:0}.yl-income-rank-income strong{font-size:17px}.yl-income-rank-cats{margin-top:3px}}

/* v1.3.1: Luxeritas 側の汎用スタイルに負けない順位バッジ */
body .yl-income-ranking .yl-income-ranking-list .yl-income-rank-card > .yl-income-rank-badge{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  justify-self:center !important;
  align-self:center !important;
  width:50px !important;
  min-width:50px !important;
  height:50px !important;
  min-height:50px !important;
  padding:0 !important;
  margin:0 auto !important;
  border:0 !important;
  border-radius:50% !important;
  line-height:1 !important;
  text-align:center !important;
  text-decoration:none !important;
  box-shadow:0 2px 7px rgba(0,0,0,.18) !important;
  color:#fff !important;
  overflow:visible !important;
}
body .yl-income-ranking .yl-income-rank-card.yl-income-rank-1 > .yl-income-rank-badge{
  background:linear-gradient(145deg,#f6d66a,#b88412) !important;
  border:2px solid #d8aa2f !important;
}
body .yl-income-ranking .yl-income-rank-card.yl-income-rank-2 > .yl-income-rank-badge{
  background:linear-gradient(145deg,#dfe3e8,#7d8792) !important;
  border:2px solid #aab2bb !important;
}
body .yl-income-ranking .yl-income-rank-card.yl-income-rank-3 > .yl-income-rank-badge{
  background:linear-gradient(145deg,#d6a06e,#8f552d) !important;
  border:2px solid #b97746 !important;
}
body .yl-income-ranking .yl-income-rank-card.yl-income-rank-other > .yl-income-rank-badge{
  width:auto !important;
  min-width:0 !important;
  height:auto !important;
  min-height:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:#606872 !important;
  flex-direction:row !important;
  gap:2px !important;
}
body .yl-income-ranking .yl-income-rank-card > .yl-income-rank-badge .yl-income-rank-number{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  font-size:22px !important;
  font-weight:800 !important;
  line-height:.95 !important;
  color:inherit !important;
}
body .yl-income-ranking .yl-income-rank-card > .yl-income-rank-badge .yl-income-rank-label{
  display:block !important;
  margin:2px 0 0 !important;
  padding:0 !important;
  font-size:10px !important;
  font-weight:700 !important;
  line-height:1 !important;
  color:inherit !important;
}
body .yl-income-ranking .yl-income-rank-card.yl-income-rank-other > .yl-income-rank-badge .yl-income-rank-label{
  margin:0 !important;
  font-size:12px !important;
}
@media(max-width:700px){
  body .yl-income-ranking .yl-income-ranking-list .yl-income-rank-card > .yl-income-rank-badge{
    width:40px !important;min-width:40px !important;height:40px !important;min-height:40px !important;
  }
  body .yl-income-ranking .yl-income-rank-card > .yl-income-rank-badge .yl-income-rank-number{font-size:18px !important}
}


/* v1.5.3: ランキング条件枠をランキング表と同じフラットな枠線デザインに統一 */
.yl-income-ranking-controls{
  margin:0 0 28px !important;
  padding:16px 18px 18px !important;
  border:1px solid #d9dee3 !important;
  border-radius:0 !important;
  background:#fff !important;
  box-shadow:none !important;
}
.yl-income-controls-title{
  margin:0 0 12px !important;
  padding:0 !important;
  font-size:17px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
  color:#16191d !important;
}
.yl-income-controls-row{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
}
.yl-income-controls-label{
  flex:0 0 auto !important;
  min-width:52px !important;
  margin:0 !important;
  padding:7px 0 0 !important;
  font-size:13px !important;
  line-height:1.3 !important;
  font-weight:800 !important;
  color:#222 !important;
}
.yl-income-filter-buttons{
  display:flex !important;
  flex:1 1 auto !important;
  flex-wrap:wrap !important;
  gap:10px 10px !important;
  align-items:center !important;
}
body .yl-income-ranking .yl-income-filter-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:34px !important;
  margin:0 !important;
  padding:7px 14px !important;
  border:1px solid #d8dde3 !important;
  border-radius:5px !important;
  background:#fff !important;
  color:#252a30 !important;
  font:inherit !important;
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:600 !important;
  white-space:nowrap !important;
  cursor:pointer !important;
  box-shadow:none !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease !important;
}
body .yl-income-ranking .yl-income-filter-btn:hover{
  border-color:#9da6b0 !important;
  background:#f5f6f8 !important;
}
body .yl-income-ranking .yl-income-filter-btn.is-active,
body .yl-income-ranking .yl-income-filter-btn[aria-pressed="true"]{
  border-color:#292d32 !important;
  background:#292d32 !important;
  color:#fff !important;
  font-weight:800 !important;
  box-shadow:inset 0 0 0 1px #292d32 !important;
}
.yl-income-ranking-table{
  margin-top:0 !important;
  border:0 !important;
  background:transparent !important;
}
@media(max-width:700px){
  .yl-income-ranking-controls{
    margin-bottom:22px !important;
    padding:14px !important;
    border-radius:0 !important;
  }
  .yl-income-controls-title{
    margin-bottom:10px !important;
    font-size:16px !important;
  }
  .yl-income-controls-row{
    display:block !important;
  }
  .yl-income-controls-label{
    min-width:0 !important;
    margin-bottom:8px !important;
    padding:0 !important;
  }
  .yl-income-filter-buttons{
    gap:8px !important;
  }
  body .yl-income-ranking .yl-income-filter-btn{
    min-height:32px !important;
    padding:6px 12px !important;
    font-size:12px !important;
  }
}


/* v1.6.0: 個別記事末尾のカテゴリー別年収ランキング誘導バナー */
body .yl-income-related-ranking{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:100% !important;
  margin:32px 0 18px !important;
  padding:0 !important;
  border:1px solid #d8dee6 !important;
  border-radius:0 !important;
  background:#fff !important;
  box-shadow:none !important;
  overflow:hidden !important;
  clear:both !important;
}
body .yl-income-related-ranking *{box-sizing:border-box !important}
body .yl-income-related-ranking__head{
  display:block !important;
  margin:0 !important;
  padding:11px 16px !important;
  border:0 !important;
  border-bottom:4px solid #d8ad33 !important;
  background:#24364d !important;
  color:#fff !important;
  font-size:18px !important;
  font-weight:800 !important;
  line-height:1.4 !important;
  letter-spacing:0 !important;
  text-align:left !important;
}
body a.yl-income-related-ranking__link,
body a.yl-income-related-ranking__link:link,
body a.yl-income-related-ranking__link:visited{
  display:flex !important;
  align-items:stretch !important;
  width:100% !important;
  min-height:132px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:#fff !important;
  color:#222 !important;
  text-decoration:none !important;
  box-shadow:none !important;
  outline:0 !important;
}
body a.yl-income-related-ranking__link:hover{background:#fafcff !important;text-decoration:none !important}
body .yl-income-related-ranking__image{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  flex:0 0 166px !important;
  width:166px !important;
  min-width:166px !important;
  margin:0 !important;
  padding:4px 4px 0 !important;
  border:0 !important;
  background:#fff0bf !important;
  overflow:hidden !important;
}
body .yl-income-related-ranking__image img{
  display:block !important;
  width:auto !important;
  max-width:156px !important;
  height:128px !important;
  max-height:128px !important;
  margin:0 auto !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  box-shadow:none !important;
}
body .yl-income-related-ranking__body{
  position:relative !important;
  display:flex !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:flex-start !important;
  margin:0 !important;
  padding:19px 46px 18px 22px !important;
  border:0 !important;
  background:transparent !important;
  text-align:left !important;
}
body .yl-income-related-ranking__question{
  display:block !important;
  margin:0 0 7px !important;
  padding:0 !important;
  border:0 !important;
  color:#171a1d !important;
  font-size:18px !important;
  font-weight:800 !important;
  line-height:1.5 !important;
  text-align:left !important;
}
body .yl-income-related-ranking__desc{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  color:#656d76 !important;
  font-size:14px !important;
  font-weight:400 !important;
  line-height:1.65 !important;
  text-align:left !important;
}
body .yl-income-related-ranking__arrow{
  position:absolute !important;
  top:50% !important;
  right:17px !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  color:#cf9e17 !important;
  font-size:30px !important;
  font-weight:800 !important;
  line-height:1 !important;
  transform:translateY(-50%) !important;
}
body a.yl-income-related-ranking__link:hover .yl-income-related-ranking__question{color:#0674c8 !important}

@media(max-width:600px){
  body .yl-income-related-ranking{margin:26px 0 16px !important}
  body .yl-income-related-ranking__head{padding:10px 12px !important;font-size:16px !important;border-bottom-width:3px !important}
  body a.yl-income-related-ranking__link{min-height:104px !important}
  body .yl-income-related-ranking__image{flex-basis:112px !important;width:112px !important;min-width:112px !important;padding:3px 2px 0 !important}
  body .yl-income-related-ranking__image img{max-width:106px !important;height:101px !important;max-height:101px !important}
  body .yl-income-related-ranking__body{padding:14px 31px 13px 12px !important}
  body .yl-income-related-ranking__question{margin-bottom:5px !important;font-size:15px !important;line-height:1.45 !important}
  body .yl-income-related-ranking__desc{font-size:12px !important;line-height:1.5 !important}
  body .yl-income-related-ranking__arrow{right:9px !important;font-size:24px !important}
}

/* v1.7.0: 自宅まとめUIに合わせた条件枠・ジャンルURL・100件ページング */
body .yl-income-ranking .yl-income-ranking-controls{
  margin:0 0 28px !important;
  padding:0 !important;
  border:1px solid #ccd3da !important;
  border-radius:0 !important;
  background:#fff !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
body .yl-income-ranking .yl-income-controls-title{
  display:block !important;
  margin:0 !important;
  padding:17px 17px 15px !important;
  border:0 !important;
  border-bottom:1px solid #d9dee5 !important;
  background:#fff !important;
  color:#16191d !important;
  font-size:17px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}
body .yl-income-ranking .yl-income-controls-body{
  display:block !important;
  margin:0 !important;
  padding:16px 17px !important;
  border:0 !important;
  background:#fff !important;
}
body .yl-income-ranking .yl-income-controls-row{
  display:flex !important;
  align-items:flex-start !important;
  gap:14px !important;
  margin:0 !important;
  padding:0 !important;
}
body .yl-income-ranking .yl-income-controls-label{
  flex:0 0 68px !important;
  min-width:68px !important;
  margin:0 !important;
  padding:10px 0 0 !important;
  color:#222 !important;
  font-size:14px !important;
  line-height:1.3 !important;
  font-weight:800 !important;
}
body .yl-income-ranking .yl-income-filter-buttons{
  display:flex !important;
  flex:1 1 auto !important;
  flex-wrap:wrap !important;
  gap:10px 12px !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
}
body .yl-income-ranking a.yl-income-filter-btn,
body .yl-income-ranking a.yl-income-filter-btn:link,
body .yl-income-ranking a.yl-income-filter-btn:visited,
body .yl-income-ranking button.yl-income-filter-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:36px !important;
  margin:0 !important;
  padding:8px 15px !important;
  border:1px solid #ccd3da !important;
  border-radius:1px !important;
  background:#fff !important;
  color:#222 !important;
  font:inherit !important;
  font-size:14px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  white-space:nowrap !important;
  text-decoration:none !important;
  cursor:pointer !important;
  box-shadow:none !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease !important;
}
body .yl-income-ranking a.yl-income-filter-btn:hover,
body .yl-income-ranking button.yl-income-filter-btn:hover{
  border-color:#9eabb8 !important;
  background:#f5f7f9 !important;
  color:#222 !important;
  text-decoration:none !important;
}
body .yl-income-ranking a.yl-income-filter-btn.is-active,
body .yl-income-ranking a.yl-income-filter-btn[aria-pressed="true"],
body .yl-income-ranking button.yl-income-filter-btn.is-active,
body .yl-income-ranking button.yl-income-filter-btn[aria-pressed="true"]{
  border-color:#445a73 !important;
  background:#445a73 !important;
  color:#fff !important;
  font-weight:800 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}

body .yl-income-ranking .yl-income-pagination{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-items:center !important;
  gap:7px !important;
  margin:22px 0 8px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
body .yl-income-ranking a.yl-income-page-link,
body .yl-income-ranking a.yl-income-page-link:link,
body .yl-income-ranking a.yl-income-page-link:visited{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:36px !important;
  min-height:36px !important;
  margin:0 !important;
  padding:7px 11px !important;
  border:1px solid #ccd3da !important;
  border-radius:1px !important;
  background:#fff !important;
  color:#222 !important;
  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}
body .yl-income-ranking a.yl-income-page-link:hover{
  border-color:#9eabb8 !important;
  background:#f5f7f9 !important;
  color:#222 !important;
  text-decoration:none !important;
}
body .yl-income-ranking a.yl-income-page-link.is-active,
body .yl-income-ranking a.yl-income-page-link[aria-current="page"]{
  border-color:#445a73 !important;
  background:#445a73 !important;
  color:#fff !important;
}
body .yl-income-ranking .yl-income-page-prev,
body .yl-income-ranking .yl-income-page-next{
  min-width:auto !important;
  padding-left:13px !important;
  padding-right:13px !important;
}

@media(max-width:700px){
  body .yl-income-ranking .yl-income-ranking-controls{
    margin-bottom:22px !important;
  }
  body .yl-income-ranking .yl-income-controls-title{
    padding:14px 14px 13px !important;
    font-size:16px !important;
  }
  body .yl-income-ranking .yl-income-controls-body{
    padding:14px !important;
  }
  body .yl-income-ranking .yl-income-controls-row{
    display:block !important;
  }
  body .yl-income-ranking .yl-income-controls-label{
    min-width:0 !important;
    margin-bottom:9px !important;
    padding:0 !important;
  }
  body .yl-income-ranking .yl-income-filter-buttons{
    gap:8px !important;
  }
  body .yl-income-ranking a.yl-income-filter-btn,
  body .yl-income-ranking button.yl-income-filter-btn{
    min-height:34px !important;
    padding:7px 11px !important;
    font-size:12px !important;
  }
  body .yl-income-ranking .yl-income-pagination{
    gap:6px !important;
    margin-top:18px !important;
  }
  body .yl-income-ranking a.yl-income-page-link{
    min-width:34px !important;
    min-height:34px !important;
    padding:6px 9px !important;
    font-size:12px !important;
  }
}


/* v1.7.3: タグは小ささを維持しつつ指定色 #15334F で表示 */
.yl-income-rank-tags{
  margin-top:3px;
  color:#15334F;
  font-size:9px;
  font-weight:400;
  line-height:1.45;
  letter-spacing:0;
  overflow-wrap:anywhere;
}
@media(max-width:700px){
  .yl-income-rank-tags{
    margin-top:2px;
    font-size:8px;
  }
}
