/* 当たらぬも八卦✳︎ トップページ整理版 */

body.home .hakke-front-actions{
  grid-template-columns:1fr;
  margin-bottom:34px;
}

body.home .hakke-front-action-single{
  grid-template-columns:1fr auto;
  min-height:auto;
  padding:18px 22px;
}

.hakke-card-slider{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.hakke-slide-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:154px;
  padding:17px 17px 15px;
  border:1px solid #e4e0d7;
  border-radius:16px;
  background:#fff;
  color:#242739 !important;
  text-decoration:none !important;
  box-shadow:0 7px 22px rgba(28,32,56,.055);
  transition:transform .18s ease,box-shadow .18s ease;
}

.hakke-slide-card:hover{
  transform:translateY(-2px);
  box-shadow:0 11px 28px rgba(28,32,56,.10);
}

.hakke-slide-mark{
  display:flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  margin-bottom:9px;
  border-radius:7px;
  background:linear-gradient(145deg,#16203f,#263361);
  color:#f3ddaa;
  font-size:8px;
}

.hakke-slide-meta{
  display:flex;
  flex-wrap:wrap;
  gap:5px 8px;
  margin-bottom:7px;
  color:#93949e;
  font-size:10px;
  line-height:1.4;
}

.hakke-slide-meta span{
  color:#8b7353;
  font-weight:700;
}

.hakke-slide-title{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  color:#25283a;
  font-size:14px;
  font-weight:700;
  line-height:1.55;
}

.hakke-slide-link{
  margin-top:auto;
  padding-top:11px;
  color:#6f7180;
  font-size:11px;
  font-weight:700;
}

.hakke-slide-card-category{
  min-height:132px;
}

.hakke-category-section{
  padding-top:0;
}

@media screen and (max-width:834px){
  .hakke-card-slider{
    display:flex;
    gap:11px;
    overflow-x:auto;
    padding:1px 2px 9px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .hakke-card-slider::-webkit-scrollbar{
    display:none;
  }

  .hakke-slide-card{
    flex:0 0 min(78vw,320px);
    min-height:142px;
    scroll-snap-align:start;
  }

  .hakke-slide-card-category{
    min-height:124px;
  }
}

@media screen and (max-width:480px){
  body.home .hakke-front-action-single{
    grid-template-columns:1fr;
    gap:5px;
    padding:16px 17px;
  }

  body.home .hakke-front-action-single > span:last-child{
    text-align:left;
  }

  .hakke-slide-card{
    flex-basis:82vw;
  }
}

/* 占いの小部屋｜配色調整 */
body.home .hakke-front-action-single .hakke-front-action-kicker{
  color:#f7f4ff;
}

body.home .hakke-front-action-single strong{
  color:#f0d9a7;
}

body.home #header-container{
  position:relative;
  left:50%;
  min-height:300px;
  width:100vw;
  max-width:none;
  margin-left:-50vw;
  margin-right:-50vw;
  overflow:hidden;
  isolation:isolate;
  background:
    linear-gradient(rgba(5,10,27,.34),rgba(5,10,27,.46)),
    url("data:image/jpeg;base64,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") center center / cover no-repeat;
}

body.home #header-container::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(5,10,27,.18),rgba(5,10,27,.34));
}

body.home #header-container-in{
  position:relative;
  z-index:2;
  width:100%;
}

body.home .hakke-hero-video{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  pointer-events:none;
}

body.home #header{
  min-height:300px;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  padding:48px 56px 42px 20px;
}

body.home #header-in{
  width:100%;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  text-align:right;
}

body.home .logo-header{
  margin:0;
}

body.home .site-name-text,
body.home .site-name-text-link{
  color:#e6e2ea !important;
  -webkit-text-fill-color:#e6e2ea !important;
  -webkit-text-stroke:0 !important;
  text-shadow:0 0 8px rgba(0,0,0,.14) !important;
  letter-spacing:.20em;
  text-align:right;
}

body.home #navi{
  display:none;
}

@media screen and (max-width:700px){
  body.home #header-container,
  body.home #header{
    min-height:210px;
  }

  body.home #header{
    padding:28px 22px 26px 16px;
  }

  body.home #header-in{
    justify-content:flex-end;
  }

  body.home .site-name-text,
  body.home .site-name-text-link{
    font-size:clamp(27px,8vw,36px);
    letter-spacing:.14em;
    text-align:right;
  }
}

@media (prefers-reduced-motion:reduce){
  body.home .hakke-hero-video{
    display:none !important;
  }
}