/*
Theme Name: Shirouto Daisuki
Theme URI: https://shiroutodaisuki.com/
Author: OpenAI
Description: シロウトダイスキ.com custom theme
Version: 1.2
*/

*{box-sizing:border-box}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;
  background:#fff;
  color:#151515;
}
a{text-decoration:none;color:inherit}
button{font-family:inherit}

.sd-header{
  position:sticky;
  top:0;
  z-index:100;
  height:56px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid #eee;
}

.sd-logo{
  display:flex;
  align-items:center;
  white-space:nowrap;
}

.sd-logo img{
  height:34px;
  width:auto;
  display:block;
}

.sd-fav-btn{
  height:34px;
  border:1px solid #eee;
  border-radius:999px;
  background:#fff;
  padding:0 12px;
  display:flex;
  align-items:center;
  gap:5px;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 3px 12px rgba(0,0,0,.04);
}

.sd-tabs-wrap{
  position:sticky;
  top:56px;
  z-index:90;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
  border-bottom:1px solid #f1f1f1;
}

.sd-tabs{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:10px 12px;
  scrollbar-width:none;
}

.sd-tabs::-webkit-scrollbar{display:none}

.sd-tab,
.sd-tabs a,
.sd-related-tags a{
  flex:0 0 auto;
  border:1px solid #eee;
  background:#fff;
  color:#222;
  border-radius:999px;
  padding:8px 13px;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}

.sd-tab.active,
.sd-tabs a.active,
.sd-related-tags a.active{
  background:#151515;
  color:#fff;
  border-color:#151515;
}

.sd-main{
  max-width:1180px;
  margin:0 auto;
  padding:12px 8px 70px;
}

.sd-grid{
  column-count:5;
  column-gap:12px;
}

.sd-card,
.sd-ad-card{
  break-inside:avoid;
  display:inline-block;
  width:100%;
  margin:0 0 15px;
}

.sd-thumb{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:16px;
  background:#f2f2f2;
}

.sd-thumb img{
  width:100%;
  display:block;
  aspect-ratio:3/4;
  object-fit:cover;
  transition:transform .22s ease;
}

.sd-card:hover .sd-thumb img{transform:scale(1.035)}

.sd-source{
  position:absolute;
  top:8px;
  left:8px;
  z-index:3;
  padding:5px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
  line-height:1;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
  box-shadow:0 3px 10px rgba(0,0,0,.12);
}

.sd-source.fanza{color:#ff2f5f}
.sd-source.mgs{color:#7650ff}
.sd-source.fantia{color:#ff7a2f}

.sd-heart{
  position:absolute;
  top:8px;
  right:8px;
  z-index:3;
  width:34px;
  height:34px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);
  font-size:18px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 3px 10px rgba(0,0,0,.12);
  color:#222;
}

.sd-heart.active{color:#ff2f5f}

.sd-card-body{padding:7px 2px 2px}

.sd-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.sd-tags span,
.sd-tags a{
  font-size:10px;
  font-weight:800;
  color:#777;
  line-height:1.2;
}

.sd-ad-label{
  display:inline-block;
  margin:0 0 6px 2px;
  font-size:10px;
  font-weight:900;
  color:#aaa;
}

.sd-ad-box{
  width:100%;
  aspect-ratio:300/250;
  border-radius:16px;
  border:1px solid #eee;
  background:#f6f6f7;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#aaa;
  font-size:12px;
  font-weight:900;
}

.sd-pagination{
  display:flex;
  justify-content:center;
  gap:8px;
  margin:22px 0 0;
  flex-wrap:wrap;
}

.sd-pagination a,
.sd-pagination span{
  min-width:36px;
  height:36px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid #eee;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:900;
}

.sd-pagination .current{
  background:#151515;
  color:#fff;
  border-color:#151515;
}

/* Detail */
.sd-page{
  max-width:880px;
  margin:0 auto;
  padding:14px 12px 70px;
}

.sd-main-img{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  background:#f3f3f3;
}

.sd-main-img img{
  width:100%;
  display:block;
  object-fit:cover;
}

.sd-title{
  margin:16px 0 8px;
  font-size:22px;
  line-height:1.45;
  font-weight:900;
  letter-spacing:-.04em;
}

.sd-detail-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:10px 0 16px;
}

.sd-detail-tags a{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:#f5f5f6;
  color:#555;
  font-size:12px;
  font-weight:800;
}

.sd-cta{
  display:block;
  width:100%;
  margin:16px 0;
  padding:16px 18px;
  border-radius:999px;
  background:#ff2f5f;
  color:#fff;
  text-align:center;
  font-size:15px;
  font-weight:900;
  box-shadow:0 8px 22px rgba(255,47,95,.22);
}

.sd-sub-cta{
  display:block;
  width:100%;
  margin:10px 0 22px;
  padding:14px 18px;
  border-radius:999px;
  background:#151515;
  color:#fff;
  text-align:center;
  font-size:14px;
  font-weight:900;
}

.sd-section-title{
  margin:28px 0 12px;
  font-size:18px;
  font-weight:900;
  letter-spacing:-.04em;
}

.sd-video{
  overflow:hidden;
  border-radius:18px;
  background:#111;
  aspect-ratio:16/9;
}

.sd-video video,
.sd-video iframe{
  width:100%;
  height:100%;
  display:block;
  border:0;
  object-fit:cover;
}

.sd-gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}

.sd-gallery img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  border-radius:12px;
  background:#f3f3f3;
  cursor:pointer;
}

.sd-info{
  border:1px solid #eee;
  border-radius:18px;
  overflow:hidden;
  margin-top:10px;
}

.sd-info-row{
  display:flex;
  border-bottom:1px solid #eee;
  font-size:13px;
}

.sd-info-row:last-child{border-bottom:0}

.sd-info-label{
  width:110px;
  flex:0 0 110px;
  background:#fafafa;
  padding:12px;
  color:#777;
  font-weight:800;
}

.sd-info-value{
  padding:12px;
  font-weight:700;
  line-height:1.6;
}

.sd-tag-head{
  max-width:1180px;
  margin:0 auto;
  padding:20px 12px 10px;
}

.sd-back{
  display:inline-flex;
  margin-bottom:12px;
  font-size:12px;
  font-weight:900;
  color:#777;
}

.sd-tag-title{
  margin:0;
  font-size:30px;
  font-weight:900;
  letter-spacing:-.06em;
}

.sd-tag-desc{
  margin:7px 0 0;
  font-size:13px;
  font-weight:700;
  line-height:1.7;
  color:#777;
}

.sd-related-tags{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:14px 0 2px;
  scrollbar-width:none;
}

.sd-related-tags::-webkit-scrollbar{display:none}

.sd-empty{
  padding:50px 16px;
  text-align:center;
  color:#777;
  font-weight:800;
}

@media(max-width:1080px){.sd-grid{column-count:4}}
@media(max-width:820px){.sd-grid{column-count:3}}
@media(max-width:620px){
  .sd-header{height:54px}
  .sd-logo img{height:28px}
  .sd-tabs-wrap{top:54px}
  .sd-main{padding:10px 8px 70px}
  .sd-grid{column-count:2;column-gap:9px}
  .sd-card,.sd-ad-card{margin-bottom:13px}
  .sd-thumb{border-radius:14px}
  .sd-page{padding:10px 10px 64px}
  .sd-title{font-size:18px}
  .sd-gallery{grid-template-columns:repeat(2,1fr)}
  .sd-info-row{font-size:12px}
  .sd-info-label{width:92px;flex-basis:92px}
  .sd-tag-head{padding:18px 12px 8px}
  .sd-tag-title{font-size:26px}
  .sd-tag-desc{font-size:12px}
}