:root{
  --bliss-black:#111;
  --bliss-text:#262626;
  --bliss-gray:#6f6f6f;
  --bliss-light:#f7f7f7;
  --bliss-soft:#f7f6f3;
  --bliss-warm:#f1eee8;
  --bliss-line:#e3e3e3;
  --bliss-white:#fff;
  --bliss-max:1240px;
  --bliss-serif:"Libre Bodoni","Shippori Mincho B1",serif;
  --bliss-sans:"Inter","Noto Sans JP",sans-serif;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  padding-top:78px;
  background:#fff;
  color:var(--bliss-text);
  font-family:var(--bliss-sans);
  font-size:15px;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}

img{
  max-width:100%;
  vertical-align:bottom;
}

a{
  color:inherit;
  text-decoration:none;
}

button,
input{
  font:inherit;
}

.bliss-container{
  width:min(var(--bliss-max),calc(100% - 64px));
  margin:0 auto;
}

.bliss-section{
  padding:76px 0;
}

.bliss-section-tone--white{background:#fff;}
.bliss-section-tone--soft{background:var(--bliss-soft);}
.bliss-section-tone--warm{background:var(--bliss-warm);}

.bliss-loading,
.bliss-load-error{
  grid-column:1/-1;
  width:100%;
  margin:0;
  padding:42px 0;
  color:#777;
  text-align:center;
  font-size:13px;
}

/* =========================
   HEADER
========================= */

.bliss-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:9999;
  width:100%;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid #ededed;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.bliss-header-inner{
  min-height:78px;
  display:grid;
  grid-template-columns:180px minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
}

.bliss-logo{
  font-family:var(--bliss-serif);
  font-size:31px;
  line-height:1;
  letter-spacing:.04em;
  white-space:nowrap;
}

.bliss-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  min-width:0;
  white-space:nowrap;
}

.bliss-nav a{
  font-size:14px;
  font-weight:700;
  letter-spacing:.05em;
  transition:opacity .2s ease;
}

.bliss-nav a:hover{
  opacity:.5;
}

.bliss-menu-toggle{
  display:none;
  width:40px;
  height:40px;
  padding:0;
  border:0;
  background:transparent;
  color:#111;
  font-size:26px;
  cursor:pointer;
}

.bliss-mobile-nav{
  display:none;
}

/* =========================
   HERO
========================= */

.bliss-hero{
  overflow:hidden;
  background:#f5f5f5;
}

.bliss-hero-inner{
  width:min(1440px,100%);
  min-height:610px;
  margin:0 auto;
  display:grid;
  grid-template-columns:47% 53%;
}

.bliss-hero-copy{
  align-self:center;
  padding:72px 48px 72px max(64px,calc((100vw - var(--bliss-max))/2));
}

.bliss-eyebrow{
  margin:0 0 20px;
  font-size:13px;
  letter-spacing:.06em;
}

.bliss-hero-title{
  margin:0 0 26px;
  color:#222;
  font-family:var(--bliss-serif);
  font-size:clamp(40px,4.2vw,58px);
  font-weight:400;
  line-height:1.36;
  letter-spacing:.035em;
}

.bliss-hero-title span{
  display:inline-block;
  white-space:nowrap;
}

.bliss-hero-text{
  margin:0 0 34px;
  color:#333;
  font-size:14px;
  line-height:2.05;
}

.bliss-hero-image{
  min-height:610px;
  overflow:hidden;
}

.bliss-hero-image img{
  width:100%;
  height:100%;
  min-height:610px;
  object-fit:cover;
  object-position:center top;
}

/* =========================
   COMMON
========================= */

.bliss-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:30px;
}

.bliss-section-kicker{
  margin:0 0 7px;
  color:#888;
  font-size:10px;
  font-weight:700;
  letter-spacing:.16em;
}

.bliss-section-title{
  margin:0;
  color:#222;
  font-family:var(--bliss-serif);
  font-size:28px;
  font-weight:400;
  line-height:1.4;
  letter-spacing:.1em;
}

.bliss-section-intro{
  margin:9px 0 0;
  color:#666;
  font-size:14px;
  line-height:1.8;
}

.bliss-section-link{
  color:#555;
  font-size:13px;
  letter-spacing:.04em;
}

.bliss-section-link:hover{
  opacity:.6;
}

.bliss-section-link-bottom{
  margin-top:32px;
  text-align:right;
}

.bliss-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:26px;
  min-width:230px;
  min-height:54px;
  padding:13px 26px;
  border:1px solid #111;
  background:#111;
  color:#fff;
  font-size:14px;
  font-weight:700;
  letter-spacing:.03em;
  transition:opacity .2s ease;
}

.bliss-btn::after{
  content:"→";
}

.bliss-btn:hover{
  opacity:.72;
}

.bliss-text-link{
  display:inline-block;
  padding-bottom:2px;
  border-bottom:1px solid currentColor;
  font-size:13px;
}

/* =========================
   BLiSS STYLE
========================= */

.bliss-style-title{
  margin-bottom:40px;
  text-align:center;
}

.bliss-style-title h2{
  margin:0;
  font-family:var(--bliss-serif);
  font-size:26px;
  font-weight:400;
  letter-spacing:.08em;
}

.bliss-style-title::after{
  content:"";
  display:block;
  width:26px;
  height:1px;
  margin:13px auto 0;
  background:#111;
}

.bliss-style-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.bliss-style-card{
  padding:10px 34px;
  text-align:center;
}

.bliss-style-card + .bliss-style-card{
  border-left:1px solid var(--bliss-line);
}

.bliss-style-icon{
  width:54px;
  height:54px;
  margin:0 auto 14px;
  display:grid;
  place-items:center;
}

.bliss-style-icon svg{
  width:42px;
  height:42px;
  fill:none;
  stroke:#111;
  stroke-width:1.35;
}

.bliss-style-card h3{
  margin:0 0 8px;
  font-size:15px;
  font-weight:700;
}

.bliss-style-card p{
  margin:0;
  color:#777;
  font-size:13px;
  line-height:1.8;
}

/* =========================
   PRODUCTS
========================= */

/* API挿入後も必ずグリッドになるよう明示 */
#bliss-new-items.bliss-product-grid{
  width:100%;
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:28px 18px !important;
  align-items:start;
}

#bliss-pickup-items.bliss-pickup-grid{
  width:100%;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:30px 24px !important;
  align-items:start;
}

.bliss-product-card{
  width:100%;
  min-width:0;
}

.bliss-product-card > a{
  display:block;
  width:100%;
}

.bliss-product-image{
  position:relative;
  width:100%;
  aspect-ratio:4/5;
  overflow:hidden;
  background:#f4f4f4;
}

.bliss-product-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .3s ease,opacity .3s ease;
}

#bliss-pickup-items .bliss-product-image{
  background:#f5f3ef;
}

#bliss-pickup-items .bliss-product-image img{
  object-fit:contain;
}

.bliss-product-card:hover .bliss-product-image img{
  transform:scale(1.02);
}

.bliss-product-title{
  margin:12px 0 4px;
  min-height:3em;
  color:#222;
  font-size:13px;
  font-weight:400;
  line-height:1.5;
}

.bliss-product-price{
  margin:0;
  color:#111;
  font-size:13px;
  font-weight:700;
  line-height:1.5;
}

.bliss-product-price--sale{
  color:#c54c4c;
}

.bliss-product-proper-price{
  margin:2px 0 0;
  color:#999;
  font-size:11px;
  line-height:1.4;
  text-decoration:line-through;
}

.bliss-soldout{
  position:absolute;
  right:8px;
  bottom:8px;
  z-index:2;
  padding:4px 7px;
  background:rgba(255,255,255,.96);
  border:1px solid #111;
  color:#111;
  font-size:9px;
  letter-spacing:.08em;
}

.bliss-pickup-cta{
  margin-top:38px;
  text-align:center;
}

.bliss-pickup-cta .bliss-btn{
  min-width:280px;
}

/* =========================
   NEWS
========================= */

#bliss-news-list.bliss-news-grid{
  width:100%;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:28px 22px !important;
  align-items:start;
}

.bliss-news-card{
  display:block;
  min-width:0;
}

.bliss-news-thumb{
  width:100%;
  aspect-ratio:4/3;
  overflow:hidden;
  margin-bottom:13px;
  background:#f5f5f5;
}

.bliss-news-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .3s ease;
}

.bliss-news-card:hover .bliss-news-thumb img{
  transform:scale(1.02);
}

.bliss-news-card-meta{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:7px;
}

.bliss-news-card-date{
  color:#777;
  font-size:11px;
}

.bliss-news-card-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:2px 7px;
  border:1px solid #d6d6d6;
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
}

.bliss-news-card-title{
  display:-webkit-box;
  overflow:hidden;
  color:#222;
  font-size:13px;
  line-height:1.65;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

/* =========================
   ABOUT
========================= */

.bliss-about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
}

.bliss-about-image{
  min-height:410px;
  overflow:hidden;
  background:#f2f2f2;
}

.bliss-about-image img{
  width:100%;
  height:100%;
  min-height:410px;
  object-fit:cover;
}

.bliss-about-label{
  margin:0 0 12px;
  font-family:var(--bliss-serif);
  font-size:25px;
  letter-spacing:.05em;
}

.bliss-about-title{
  margin:0 0 22px;
  font-family:var(--bliss-serif);
  font-size:clamp(32px,3vw,42px);
  font-weight:400;
  line-height:1.5;
  letter-spacing:.03em;
}

.bliss-about-text{
  font-size:14px;
  line-height:2;
}

.bliss-about-text p{
  margin:0 0 18px;
}

.bliss-about-text p:last-child{
  margin-bottom:0;
}

.bliss-about-text strong{
  color:#111;
  font-weight:700;
}

/* =========================
   INSTAGRAM
========================= */

.bliss-sns-heading{
  display:flex;
  align-items:center;
  gap:10px;
}

.bliss-sns-icon-img{
  width:30px;
  height:30px;
  object-fit:contain;
}

.bliss-instagram-embed{
  width:100%;
  margin-top:24px;
}

/* =========================
   LINE
========================= */

.bliss-line-box{
  display:grid;
  grid-template-columns:minmax(0,560px) 250px;
  justify-content:center;
  align-items:center;
  gap:46px;
  max-width:1120px;
  padding:34px 40px;
  border:1px solid var(--bliss-line);
  background:#fff;
}

.bliss-line-content{
  display:grid;
  gap:18px;
}

.bliss-line-head{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:18px;
  align-items:start;
}

.bliss-line-icon-image,
.bliss-line-icon-image img{
  width:72px;
  height:72px;
}

.bliss-line-icon-image img{
  display:block;
  object-fit:contain;
}

.bliss-line-copy h2{
  margin:0 0 9px;
  font-family:var(--bliss-serif);
  font-size:21px;
  font-weight:400;
}

.bliss-line-copy p{
  margin:0;
  color:#666;
  font-size:13px;
  line-height:1.8;
}

.bliss-line-addfriend{
  margin-top:2px;
}

.bliss-line-addfriend img{
  display:block;
  width:auto;
  height:36px;
}

.bliss-line-phone{
  display:flex;
  align-items:center;
  justify-content:center;
}

.bliss-line-phone img{
  width:min(100%,230px);
  height:auto;
  object-fit:contain;
}

/* =========================
   SHOP INFO
========================= */

.bliss-shopinfo{
  padding:70px 0;
  background:#fafafa;
  border-top:1px solid #eee;
}

.bliss-shopinfo-title{
  margin:0 0 30px;
  font-family:var(--bliss-serif);
  font-size:26px;
  font-weight:400;
  letter-spacing:.09em;
}

.bliss-shopinfo-card{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:38px;
  padding:36px;
  background:#fff;
  border:1px solid var(--bliss-line);
}

.bliss-shop-name{
  margin:0 0 20px;
  font-size:16px;
  font-weight:700;
}

.bliss-shop-detail{
  margin:0 0 22px;
  font-size:14px;
  line-height:2;
}

.bliss-map,
.bliss-map iframe{
  min-height:330px;
}

.bliss-map iframe{
  display:block;
  width:100%;
  height:100%;
  border:0;
}

/* =========================
   FOOTER
========================= */

.bliss-footer{
  padding:58px 0 30px;
  background:#fff;
  border-top:1px solid #eee;
}

.bliss-footer-grid{
  display:grid;
  grid-template-columns:1.25fr repeat(4,1fr);
  gap:42px;
}

.bliss-footer-logo{
  font-family:var(--bliss-serif);
  font-size:33px;
  line-height:1;
}

.bliss-footer-col h3{
  margin:0 0 14px;
  font-size:12px;
  letter-spacing:.08em;
}

.bliss-footer-col a{
  display:block;
  margin:6px 0;
  color:#333;
  font-size:12px;
}

.bliss-footer-col a:hover{
  opacity:.58;
}

.bliss-copyright{
  margin:44px 0 0;
  padding-top:22px;
  border-top:1px solid #eee;
  text-align:center;
  color:#888;
  font-size:10px;
}

/* =========================
   TABLET
========================= */

@media(max-width:1080px){
  .bliss-nav{
    gap:20px;
  }

  .bliss-nav a{
    font-size:13px;
  }

  #bliss-new-items.bliss-product-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }

  #bliss-pickup-items.bliss-pickup-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media(max-width:960px){
  body{
    padding-top:70px;
  }

  .bliss-container{
    width:min(100% - 36px,var(--bliss-max));
  }

  .bliss-header-inner{
    min-height:70px;
    grid-template-columns:1fr auto;
  }

  .bliss-nav{
    display:none;
  }

  .bliss-menu-toggle{
    display:block;
  }

  .bliss-mobile-nav{
    padding:18px 24px;
    background:#fff;
    border-top:1px solid #eee;
  }

  .bliss-mobile-nav.is-open{
    display:grid;
    gap:13px;
  }

  .bliss-mobile-nav a{
    font-size:12px;
    letter-spacing:.08em;
  }

  .bliss-hero-inner{
    position:relative;
    min-height:540px;
    grid-template-columns:1fr;
  }

  .bliss-hero-copy{
    position:relative;
    z-index:2;
    min-height:540px;
    padding:70px 22px 45px;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.96) 0%,
      rgba(255,255,255,.84) 57%,
      rgba(255,255,255,0) 100%
    );
  }

  .bliss-hero-image{
    position:absolute;
    z-index:1;
    inset:0 0 0 31%;
    min-height:540px;
  }

  .bliss-hero-image img{
    min-height:540px;
  }

  .bliss-hero-title{
    max-width:72%;
  }

  .bliss-hero-text{
    max-width:58%;
  }

  #bliss-news-list.bliss-news-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .bliss-about-grid,
  .bliss-shopinfo-card{
    grid-template-columns:1fr;
  }

  .bliss-line-box{
    grid-template-columns:1fr;
    gap:26px;
  }

  .bliss-line-phone{
    justify-content:center;
  }

  .bliss-footer-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

/* =========================
   MOBILE
========================= */

@media(max-width:640px){
  body{
    padding-top:64px;
    font-size:14px;
  }

  .bliss-container{
    width:calc(100% - 28px);
  }

  .bliss-section{
    padding:50px 0;
  }

  .bliss-header-inner{
    min-height:64px;
  }

  .bliss-logo{
    font-size:25px;
  }

  .bliss-hero-copy{
    min-height:510px;
    padding-top:54px;
  }

  .bliss-hero-image{
    inset:0 0 0 29%;
    min-height:510px;
  }

  .bliss-hero-image img{
    min-height:510px;
  }

  .bliss-eyebrow{
    font-size:10px;
  }

  .bliss-hero-title{
    max-width:75%;
    font-size:28px;
    line-height:1.35;
  }

  .bliss-hero-text{
    max-width:64%;
    font-size:11px;
  }

  .bliss-btn{
    width:100%;
    min-width:0;
  }

  .bliss-section-title,
  .bliss-style-title h2,
  .bliss-shopinfo-title{
    font-size:21px;
  }

  .bliss-style-grid{
    grid-template-columns:1fr;
  }

  .bliss-style-card{
    padding:24px 8px;
  }

  .bliss-style-card + .bliss-style-card{
    border-top:1px solid var(--bliss-line);
    border-left:0;
  }

  #bliss-new-items.bliss-product-grid,
  #bliss-pickup-items.bliss-pickup-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:24px 12px !important;
  }

  .bliss-product-title{
    min-height:auto;
    font-size:12px;
  }

  .bliss-product-price{
    font-size:12px;
  }

  #bliss-news-list.bliss-news-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:22px 12px !important;
  }

  .bliss-news-card-title{
    font-size:12px;
  }

  .bliss-about-title{
    font-size:30px;
  }

  .bliss-about-image,
  .bliss-about-image img{
    min-height:280px;
  }

  .bliss-line-box{
    padding:22px 18px;
  }

  .bliss-line-head{
    grid-template-columns:56px minmax(0,1fr);
    gap:12px;
  }

  .bliss-line-icon-image,
  .bliss-line-icon-image img{
    width:56px;
    height:56px;
  }

  .bliss-shopinfo-card{
    padding:20px;
  }

  .bliss-map,
  .bliss-map iframe{
    min-height:280px;
  }

  .bliss-footer-grid{
    grid-template-columns:1fr 1fr;
    gap:30px 18px;
  }
}

@media(max-width:420px){
  #bliss-new-items.bliss-product-grid,
  #bliss-pickup-items.bliss-pickup-grid,
  #bliss-news-list.bliss-news-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .bliss-footer-grid{
    grid-template-columns:1fr;
  }
}

/* =========================
   NEWS - SIMPLE PC DESIGN
========================= */
@media (min-width: 961px){
  #bliss-news-list.bliss-news-grid{
    grid-template-columns:1fr !important;
    gap:0 !important;
    border-top:1px solid var(--bliss-line);
  }

  .bliss-news-card{
    display:grid;
    grid-template-columns:96px 72px minmax(0,1fr) 18px;
    align-items:center;
    gap:16px;
    min-height:58px;
    padding:11px 4px;
    border-bottom:1px solid var(--bliss-line);
  }

  .bliss-news-card::after{
    content:"→";
    color:#777;
    font-size:13px;
    text-align:right;
  }

  .bliss-news-thumb{
    display:none;
  }

  .bliss-news-card-meta{
    display:contents;
    margin:0;
  }

  .bliss-news-card-date{
    grid-column:1;
    font-size:11px;
    color:#777;
  }

  .bliss-news-card-label{
    grid-column:2;
    min-width:58px;
    min-height:20px;
    padding:2px 7px;
    border:1px solid #d6d6d6;
    font-size:9px;
  }

  .bliss-news-card-title{
    grid-column:3;
    display:block;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    font-size:13px;
    line-height:1.5;
    -webkit-line-clamp:unset;
  }

  #news .bliss-section-link-bottom{
    margin-top:22px;
  }
}

/* =========================
   SP HERO TEXT BALANCE
========================= */
@media (max-width: 640px){
  .bliss-hero{
    background:#f4f4f4;
  }

  .bliss-hero-inner{
    min-height:560px;
  }

  .bliss-hero-copy{
    min-height:560px;
    padding:54px 18px 42px;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.98) 0%,
      rgba(255,255,255,.92) 48%,
      rgba(255,255,255,.55) 72%,
      rgba(255,255,255,0) 100%
    );
  }

  .bliss-hero-image{
    inset:0 0 0 34%;
    min-height:560px;
  }

  .bliss-hero-image img{
    min-height:560px;
    object-position:55% top;
  }

  .bliss-eyebrow{
    width:60%;
    margin-bottom:14px;
    font-size:9px;
    line-height:1.5;
    letter-spacing:.04em;
  }

  .bliss-hero-title{
    width:62%;
    max-width:none;
    margin-bottom:18px;
    font-size:27px;
    line-height:1.45;
    letter-spacing:.015em;
  }

  .bliss-hero-title span{
    white-space:nowrap;
  }

  .bliss-hero-text{
    width:58%;
    max-width:none;
    margin-bottom:24px;
    font-size:11px;
    line-height:1.9;
  }

  .bliss-hero-copy .bliss-btn{
    width:auto;
    min-width:168px;
    min-height:46px;
    padding:10px 16px;
    font-size:11px;
    gap:18px;
  }
}

@media (max-width: 390px){
  .bliss-hero-title{
    width:66%;
    font-size:25px;
  }

  .bliss-hero-text{
    width:62%;
    font-size:10.5px;
  }

  .bliss-eyebrow{
    width:64%;
  }
}

/* =========================
   FIRST VIEW SQUARE LOGO
========================= */
.bliss-hero-image{
  position:relative;
}

.bliss-hero-photo{
  position:relative;
  z-index:1;
}

.bliss-hero-square-logo{
  position:absolute;
  top:24px;
  left:24px;
  z-index:3;
  width:92px;
  aspect-ratio:1 / 1;
  overflow:hidden;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
}

.bliss-hero-square-logo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

@media(max-width:960px){
  .bliss-hero-square-logo{
    top:18px;
    left:18px;
    width:76px;
  }
}

@media(max-width:640px){
  .bliss-hero-square-logo{
    top:14px;
    right:14px;
    left:auto;
    width:60px;
  }
}

@media(max-width:390px){
  .bliss-hero-square-logo{
    width:54px;
    top:12px;
    right:12px;
  }
}

/* =========================
   NEWS - SIMPLE WITH THUMBNAIL
========================= */
@media (min-width:961px){
  #bliss-news-list.bliss-news-grid{
    grid-template-columns:1fr !important;
    gap:0 !important;
    border-top:1px solid var(--bliss-line);
  }

  .bliss-news-card{
    display:grid;
    grid-template-columns:92px 92px 66px minmax(0,1fr) 18px;
    align-items:center;
    gap:16px;
    min-height:86px;
    padding:10px 4px;
    border-bottom:1px solid var(--bliss-line);
  }

  .bliss-news-card::after{
    content:"→";
    grid-column:5;
    color:#777;
    font-size:13px;
    text-align:right;
  }

  .bliss-news-thumb{
    grid-column:1;
    display:block !important;
    width:92px;
    height:66px;
    aspect-ratio:auto;
    margin:0;
    overflow:hidden;
    background:#f4f4f4;
  }

  .bliss-news-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
  }

  .bliss-news-card-meta{
    display:contents;
  }

  .bliss-news-card-date{
    grid-column:2;
    font-size:11px;
    color:#777;
  }

  .bliss-news-card-label{
    grid-column:3;
    min-width:54px;
    min-height:20px;
    padding:2px 6px;
  }

  .bliss-news-card-title{
    grid-column:4;
    display:block;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    font-size:13px;
    line-height:1.5;
    -webkit-line-clamp:unset;
  }
}

/* =========================
   FOOTER SNS ICONS
========================= */
.bliss-footer-sns{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:4px;
}

.bliss-footer-sns a{
  width:38px;
  height:38px;
  margin:0;
  display:grid;
  place-items:center;
  border:1px solid #222;
  border-radius:50%;
  color:#111;
  background:#fff;
  transition:opacity .2s ease,transform .2s ease;
}

.bliss-footer-sns a:hover{
  opacity:.6;
  transform:translateY(-1px);
}

.bliss-footer-sns a[hidden]{
  display:none !important;
}

.bliss-footer-sns svg{
  width:18px;
  height:18px;
  display:block;
}

.bliss-footer-sns img{
  width:19px;
  height:19px;
  object-fit:contain;
  display:block;
  filter:grayscale(1) contrast(1.3);
}

/* =========================
   GOOGLE MAP COLOR
========================= */
.bliss-map iframe{
  filter:none !important;
  -webkit-filter:none !important;
}

/* =========================
   HEADER ONLINE STORE BUTTON
========================= */
.bliss-nav > a.bliss-nav-store-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:9px 18px !important;
  border:1px solid #111 !important;
  background:#111 !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:700;
  letter-spacing:.08em;
  line-height:1;
  white-space:nowrap;
  text-decoration:none !important;
  opacity:1 !important;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}

.bliss-nav > a.bliss-nav-store-btn:hover,
.bliss-nav > a.bliss-nav-store-btn:focus{
  background:#fff !important;
  color:#111 !important;
  border-color:#111 !important;
  opacity:1 !important;
}

@media(max-width:1080px){
  .bliss-nav > a.bliss-nav-store-btn{
    padding:9px 14px !important;
    font-size:11px !important;
  }
}

/* ===== FINAL FORCE OVERRIDE: MAP + ONLINE STORE ===== */
.bliss-map iframe{
  filter:none !important;
  -webkit-filter:none !important;
  opacity:1 !important;
}

header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  padding:10px 20px !important;
  margin-left:4px !important;
  border:1px solid #111 !important;
  border-radius:0 !important;
  background:#111 !important;
  background-image:none !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:.08em !important;
  text-decoration:none !important;
  box-shadow:none !important;
  opacity:1 !important;
}

header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn:hover,
header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn:focus,
header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn:active{
  border-color:#111 !important;
  background:#fff !important;
  background-image:none !important;
  color:#111 !important;
  opacity:1 !important;
}

/* ===== FOOTER SNS ICON SIZE ADJUST ===== */
.bliss-footer-sns{
  gap:8px !important;
}

.bliss-footer-sns a{
  width:30px !important;
  height:30px !important;
}

.bliss-footer-sns svg{
  width:14px !important;
  height:14px !important;
}

.bliss-footer-sns img{
  width:15px !important;
  height:15px !important;
}

@media(max-width:640px){
  .bliss-footer-sns a{
    width:28px !important;
    height:28px !important;
  }

  .bliss-footer-sns svg{
    width:13px !important;
    height:13px !important;
  }

  .bliss-footer-sns img{
    width:14px !important;
    height:14px !important;
  }
}

/* ===== 2026-08-16 FINAL UI ADJUST ===== */
:root{
  --bliss-accent:#fa5171;
}

/* EC button: BASE accent pink */
header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn{
  background:var(--bliss-accent) !important;
  border-color:var(--bliss-accent) !important;
  color:#fff !important;
}
header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn:hover,
header.bliss-header nav.bliss-nav > a.bliss-nav-store-btn:focus{
  background:#fff !important;
  border-color:var(--bliss-accent) !important;
  color:var(--bliss-accent) !important;
}

/* Footer X is always visible */
#bliss-footer-x{
  display:grid !important;
}

/* NEWS thumbnail */
.bliss-news-thumb{
  display:block !important;
  overflow:hidden !important;
  background:#f3f1ef;
}
.bliss-news-thumb img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

/* SP first view: stack copy and image to prevent overlap/collapse */
@media(max-width:640px){
  .bliss-hero{
    background:#fff !important;
  }

  .bliss-hero-inner{
    display:flex !important;
    flex-direction:column !important;
    min-height:0 !important;
  }

  .bliss-hero-copy{
    position:relative !important;
    z-index:2 !important;
    order:1 !important;
    width:100% !important;
    min-height:0 !important;
    padding:38px 22px 30px !important;
    background:#fff !important;
  }

  .bliss-eyebrow{
    width:100% !important;
    margin-bottom:12px !important;
    font-size:9px !important;
  }

  .bliss-hero-title{
    width:100% !important;
    max-width:none !important;
    margin-bottom:16px !important;
    font-size:29px !important;
    line-height:1.42 !important;
    letter-spacing:.01em !important;
  }

  .bliss-hero-title span{
    white-space:nowrap !important;
  }

  .bliss-hero-text{
    width:100% !important;
    max-width:none !important;
    margin-bottom:22px !important;
    font-size:11px !important;
    line-height:1.9 !important;
  }

  .bliss-hero-copy .bliss-btn{
    min-width:0 !important;
    width:max-content !important;
    min-height:42px !important;
    padding:10px 18px !important;
  }

  .bliss-hero-image{
    position:relative !important;
    inset:auto !important;
    order:2 !important;
    width:100% !important;
    min-height:0 !important;
    aspect-ratio:4 / 5 !important;
    overflow:hidden !important;
  }

  .bliss-hero-image .bliss-hero-photo{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:center top !important;
  }

  .bliss-hero-square-logo{
    top:14px !important;
    right:14px !important;
    left:auto !important;
    width:58px !important;
    height:58px !important;
    aspect-ratio:1 / 1 !important;
  }
}
@media(max-width:390px){
  .bliss-hero-title{
    font-size:26px !important;
  }
  .bliss-hero-copy{
    padding:32px 18px 26px !important;
  }
}

/* ==================================================
   FIRST VIEW LOGO - FIX
   bliss_logo.png の内部余白を考慮して見やすく表示
================================================== */
.bliss-hero-square-logo{
  position:absolute !important;
  top:26px !important;
  left:26px !important;
  right:auto !important;
  z-index:5 !important;
  width:112px !important;
  height:112px !important;
  aspect-ratio:1 / 1 !important;
  overflow:hidden !important;
  background:#fff !important;
  box-shadow:0 2px 14px rgba(0,0,0,.08) !important;
}

.bliss-hero-square-logo img{
  position:absolute !important;
  top:50% !important;
  left:50% !important;
  width:152% !important;
  height:auto !important;
  min-height:0 !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:translate(-50%,-50%) !important;
  display:block !important;
}

/* PCのヒーロー写真側の指定がロゴ画像へ影響しないよう明示 */
.bliss-hero-image > .bliss-hero-photo{
  position:relative !important;
  z-index:1 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

/* tablet */
@media(max-width:960px){
  .bliss-hero-square-logo{
    top:18px !important;
    left:18px !important;
    width:88px !important;
    height:88px !important;
  }

  .bliss-hero-square-logo img{
    width:150% !important;
  }
}

/* SP */
@media(max-width:640px){
  .bliss-hero-square-logo{
    top:14px !important;
    right:14px !important;
    left:auto !important;
    width:72px !important;
    height:72px !important;
  }

  .bliss-hero-square-logo img{
    width:148% !important;
  }
}

@media(max-width:390px){
  .bliss-hero-square-logo{
    top:12px !important;
    right:12px !important;
    width:64px !important;
    height:64px !important;
  }
}

/* ===== FIRST VIEW LOGO TRANSPARENT DISPLAY ===== */
.bliss-hero-square-logo{
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.bliss-hero-square-logo img{
  background:transparent !important;
  mix-blend-mode:multiply;
}

/* ===== ELFSIGHT FREE BADGE HIDDEN ===== */
.eapps-link,
.eapps-instagram-feed-popup,
a[href*="elfsight.com"]{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
}

/* =========================================================
   CONSOLIDATED LATEST OVERRIDES
   PC / SP HERO / 3 POINTS / LOGO / TITLE WEIGHT
========================================================= */

/* SPファーストビュー：HTML内で強制上書き */
@media screen and (max-width:640px){
  .bliss-hero{
    position:relative !important;
    min-height:480px !important;
    overflow:hidden !important;
    background:#f4f4f4 !important;
  }

  .bliss-hero .bliss-hero-inner{
    position:relative !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:480px !important;
    width:100% !important;
    height:480px !important;
    min-height:480px !important;
    margin:0 !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    grid-column:1 !important;
    grid-row:1 !important;
  }

  .bliss-hero .bliss-hero-image{
    position:relative !important;
    inset:auto !important;
    z-index:1 !important;
    width:100% !important;
    height:480px !important;
    min-height:480px !important;
    margin:0 !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:22% !important;
    width:78% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:60% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    width:100% !important;
    height:480px !important;
    min-height:480px !important;
    padding:42px 20px 20px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,.99) 34%,
      rgba(255,255,255,.90) 49%,
      rgba(255,255,255,.52) 66%,
      rgba(255,255,255,.08) 100%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:72% !important;
    margin:0 0 12px !important;
    font-size:10px !important;
    font-weight:500 !important;
    line-height:1.5 !important;
  }

  .bliss-hero .bliss-hero-title{
    width:82% !important;
    margin:0 0 16px !important;
    color:#111 !important;
    font-size:29px !important;
    line-height:1.38 !important;
    letter-spacing:.01em !important;
  }

  .bliss-hero .bliss-hero-title span{
    white-space:nowrap !important;
  }

  .bliss-hero .bliss-hero-text{
    width:70% !important;
    margin:0 0 18px !important;
    color:#222 !important;
    font-size:11px !important;
    line-height:1.75 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    width:auto !important;
    min-width:174px !important;
    min-height:44px !important;
    padding:10px 16px !important;
    font-size:11px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    position:absolute !important;
    top:14px !important;
    right:14px !important;
    left:auto !important;
    z-index:6 !important;
    width:82px !important;
    height:82px !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  .bliss-hero .bliss-hero-square-logo img{
    width:150% !important;
    max-width:none !important;
  }
}

@media screen and (max-width:420px){
  .bliss-hero,
  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:460px !important;
    min-height:460px !important;
  }

  .bliss-hero .bliss-hero-inner{
    grid-template-rows:460px !important;
  }

  .bliss-hero .bliss-hero-copy{
    padding:38px 17px 18px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:84% !important;
    font-size:27px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:72% !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    width:76px !important;
    height:76px !important;
    top:12px !important;
    right:12px !important;
  }
}

/* =========================================================
   SP FINAL：ファーストビュー＋BLiSS STYLE 3ポイント
   HTML内で最優先上書き
========================================================= */
@media screen and (max-width:640px){

  /* ---------- HERO ---------- */
  .bliss-hero{
    min-height:430px !important;
    height:430px !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:430px !important;
    height:430px !important;
    min-height:430px !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    grid-column:1 !important;
    grid-row:1 !important;
    height:430px !important;
    min-height:430px !important;
  }

  .bliss-hero .bliss-hero-image{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    position:absolute !important;
    inset:0 0 0 21% !important;
    width:79% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:60% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    width:100% !important;
    padding:34px 18px 20px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,.99) 35%,
      rgba(255,255,255,.91) 50%,
      rgba(255,255,255,.55) 67%,
      rgba(255,255,255,.10) 100%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:70% !important;
    margin:0 0 10px !important;
    font-size:9.5px !important;
    font-weight:500 !important;
    line-height:1.5 !important;
  }

  .bliss-hero .bliss-hero-title{
    width:82% !important;
    margin:0 0 14px !important;
    font-size:28px !important;
    line-height:1.35 !important;
    letter-spacing:.008em !important;
    color:#111 !important;
  }

  .bliss-hero .bliss-hero-title span{
    white-space:nowrap !important;
  }

  .bliss-hero .bliss-hero-text{
    width:69% !important;
    margin:0 0 16px !important;
    font-size:10.5px !important;
    line-height:1.72 !important;
    color:#222 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    min-width:164px !important;
    min-height:42px !important;
    padding:9px 14px !important;
    font-size:10.5px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    top:12px !important;
    right:12px !important;
    left:auto !important;
    width:74px !important;
    height:74px !important;
    z-index:6 !important;
  }

  .bliss-hero .bliss-hero-square-logo img{
    width:150% !important;
  }

  /* ---------- BLiSS STYLE ---------- */
  .bliss-section.bliss-section-tone--soft{
    padding-top:34px !important;
    padding-bottom:34px !important;
  }

  .bliss-style-title{
    margin-bottom:16px !important;
  }

  .bliss-style-title h2{
    font-size:22px !important;
    line-height:1.3 !important;
  }

  .bliss-style-title::after{
    margin-top:10px !important;
  }

  .bliss-style-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
  }

  .bliss-style-card{
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) !important;
    grid-template-areas:
      "icon title"
      "icon text" !important;
    column-gap:14px !important;
    row-gap:2px !important;
    align-items:center !important;
    min-height:0 !important;
    padding:14px 6px !important;
    text-align:left !important;
  }

  .bliss-style-card + .bliss-style-card{
    border-top:1px solid var(--bliss-line) !important;
    border-left:0 !important;
  }

  .bliss-style-icon{
    grid-area:icon !important;
    width:40px !important;
    height:40px !important;
    margin:0 !important;
  }

  .bliss-style-icon svg{
    width:30px !important;
    height:30px !important;
  }

  .bliss-style-card h3{
    grid-area:title !important;
    margin:0 !important;
    font-size:13px !important;
    line-height:1.45 !important;
  }

  .bliss-style-card p{
    grid-area:text !important;
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.55 !important;
    color:#777 !important;
  }

  .bliss-style-card p br{
    display:none !important;
  }
}

@media screen and (max-width:390px){
  .bliss-hero,
  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:410px !important;
    min-height:410px !important;
  }

  .bliss-hero .bliss-hero-inner{
    grid-template-rows:410px !important;
  }

  .bliss-hero .bliss-hero-copy{
    padding:30px 16px 18px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:84% !important;
    font-size:26px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:72% !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    width:68px !important;
    height:68px !important;
  }

  .bliss-style-card{
    padding:12px 4px !important;
  }
}

/* =========================================================
   PC：ファーストビュー＋BLiSS STYLE 3ポイントを1画面内に収める
========================================================= */
@media screen and (min-width:961px){

  /* ---------- HERO ---------- */
  .bliss-hero-inner{
    min-height:500px !important;
    height:500px !important;
  }

  .bliss-hero-copy{
    padding-top:48px !important;
    padding-bottom:48px !important;
  }

  .bliss-hero-image{
    min-height:500px !important;
    height:500px !important;
  }

  .bliss-hero-image > .bliss-hero-photo{
    min-height:500px !important;
    height:500px !important;
  }

  .bliss-eyebrow{
    margin-bottom:14px !important;
    font-size:12px !important;
  }

  .bliss-hero-title{
    margin-bottom:18px !important;
    font-size:clamp(38px,3.6vw,50px) !important;
    line-height:1.3 !important;
  }

  .bliss-hero-text{
    margin-bottom:24px !important;
    font-size:13px !important;
    line-height:1.85 !important;
  }

  .bliss-hero-copy .bliss-btn{
    min-height:48px !important;
    min-width:220px !important;
  }

  .bliss-hero-square-logo{
    top:22px !important;
    left:22px !important;
    width:96px !important;
    height:96px !important;
  }

  /* ---------- BLiSS STYLE ---------- */
  .bliss-section.bliss-section-tone--soft{
    padding-top:34px !important;
    padding-bottom:34px !important;
  }

  .bliss-style-title{
    margin-bottom:22px !important;
  }

  .bliss-style-title h2{
    font-size:23px !important;
  }

  .bliss-style-title::after{
    margin-top:9px !important;
  }

  .bliss-style-card{
    padding:4px 28px !important;
  }

  .bliss-style-icon{
    width:44px !important;
    height:44px !important;
    margin-bottom:8px !important;
  }

  .bliss-style-icon svg{
    width:34px !important;
    height:34px !important;
  }

  .bliss-style-card h3{
    margin-bottom:5px !important;
    font-size:14px !important;
  }

  .bliss-style-card p{
    font-size:11px !important;
    line-height:1.6 !important;
  }
}

/* 高さが低めのPC画面ではさらに圧縮 */
@media screen and (min-width:961px) and (max-height:900px){

  .bliss-hero-inner,
  .bliss-hero-image,
  .bliss-hero-image > .bliss-hero-photo{
    min-height:455px !important;
    height:455px !important;
  }

  .bliss-hero-copy{
    padding-top:38px !important;
    padding-bottom:38px !important;
  }

  .bliss-hero-title{
    font-size:clamp(36px,3.3vw,46px) !important;
  }

  .bliss-section.bliss-section-tone--soft{
    padding-top:26px !important;
    padding-bottom:26px !important;
  }

  .bliss-style-title{
    margin-bottom:16px !important;
  }

  .bliss-style-card{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
}

/* =========================================================
   SP HERO：写真をしっかり見せる＋CTAを画面中央付近へ
========================================================= */
@media screen and (max-width:640px){

  .bliss-hero{
    min-height:430px !important;
    height:430px !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:430px !important;
    height:430px !important;
    min-height:430px !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    grid-column:1 !important;
    grid-row:1 !important;
    height:430px !important;
    min-height:430px !important;
  }

  /* 写真をより広く見せる */
  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:10% !important;
    width:90% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:58% top !important;
  }

  /* 白を弱め、写真が見える範囲を増やす */
  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    width:100% !important;
    padding:30px 18px 18px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.98) 0%,
      rgba(255,255,255,.95) 28%,
      rgba(255,255,255,.77) 45%,
      rgba(255,255,255,.36) 62%,
      rgba(255,255,255,.06) 100%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:66% !important;
    margin:0 0 8px !important;
    font-size:9px !important;
    line-height:1.45 !important;
  }

  .bliss-hero .bliss-hero-title{
    width:76% !important;
    margin:0 0 12px !important;
    font-size:27px !important;
    line-height:1.34 !important;
    letter-spacing:.006em !important;
  }

  .bliss-hero .bliss-hero-text{
    width:64% !important;
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.68 !important;
  }

  /* CTAをヒーロー中央付近に固定 */
  .bliss-hero .bliss-hero-copy .bliss-btn{
    position:absolute !important;
    top:52% !important;
    left:18px !important;
    transform:translateY(-50%) !important;
    width:auto !important;
    min-width:166px !important;
    min-height:42px !important;
    padding:9px 14px !important;
    font-size:10.5px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    top:12px !important;
    right:12px !important;
    width:76px !important;
    height:76px !important;
  }
}

@media screen and (max-width:390px){

  .bliss-hero .bliss-hero-title{
    width:80% !important;
    font-size:25px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:68% !important;
    font-size:10px !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:53% !important;
    left:16px !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    left:6% !important;
    width:94% !important;
  }
}

/* PCファーストビュー：ロゴ位置を写真内で自然に調整 */
@media screen and (min-width:961px){
  .bliss-hero .bliss-hero-square-logo{
    top:34px !important;
    left:38px !important;
    right:auto !important;
    width:88px !important;
    height:88px !important;
  }

  .bliss-hero .bliss-hero-square-logo img{
    width:146% !important;
  }
}

/* =========================================================
   SP：ファーストビューの文字配置を整える
========================================================= */
@media screen and (max-width:640px){

  .bliss-hero .bliss-hero-copy{
    padding:38px 18px 20px !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:68% !important;
    margin:0 0 10px !important;
    font-size:9px !important;
    line-height:1.5 !important;
    letter-spacing:.035em !important;
  }

  .bliss-hero .bliss-hero-title{
    width:74% !important;
    margin:0 0 16px !important;
    font-size:26px !important;
    line-height:1.42 !important;
    letter-spacing:.008em !important;
  }

  .bliss-hero .bliss-hero-text{
    width:62% !important;
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.72 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:55% !important;
    left:18px !important;
    transform:translateY(-50%) !important;
    min-width:166px !important;
    min-height:42px !important;
    padding:9px 14px !important;
    font-size:10.5px !important;
  }
}

@media screen and (max-width:390px){

  .bliss-hero .bliss-hero-copy{
    padding:34px 16px 18px !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:72% !important;
    margin-bottom:9px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:78% !important;
    margin-bottom:14px !important;
    font-size:24px !important;
    line-height:1.4 !important;
  }

  .bliss-hero .bliss-hero-text{
    width:66% !important;
    font-size:10px !important;
    line-height:1.68 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:56% !important;
    left:16px !important;
  }
}

/* メインコピーの明朝体をはっきり太く見せる */
.bliss-hero-title{
  font-family:"Shippori Mincho B1", serif !important;
  font-weight:600 !important;
  letter-spacing:.005em !important;
  color:#111 !important;
}

/* =========================================================
   TABLET PORTRAIT HERO FIX
   641px - 960px
========================================================= */
@media screen and (min-width:641px) and (max-width:960px){

  body{
    padding-top:68px !important;
  }

  .bliss-hero{
    position:relative !important;
    width:100% !important;
    height:520px !important;
    min-height:520px !important;
    overflow:hidden !important;
    background:#f4f4f4 !important;
  }

  .bliss-hero .bliss-hero-inner{
    position:relative !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:520px !important;
    width:100% !important;
    height:520px !important;
    min-height:520px !important;
    margin:0 !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    grid-column:1 !important;
    grid-row:1 !important;
    height:520px !important;
    min-height:520px !important;
  }

  .bliss-hero .bliss-hero-image{
    position:relative !important;
    inset:auto !important;
    z-index:1 !important;
    width:100% !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:34% !important;
    width:66% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:58% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    display:block !important;
    width:100% !important;
    padding:58px 38px 34px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,.99) 34%,
      rgba(255,255,255,.88) 50%,
      rgba(255,255,255,.46) 68%,
      rgba(255,255,255,.06) 100%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:48% !important;
    margin:0 0 13px !important;
    font-size:11px !important;
    line-height:1.5 !important;
  }

  .bliss-hero .bliss-hero-title{
    width:55% !important;
    max-width:none !important;
    margin:0 0 18px !important;
    font-family:"Shippori Mincho B1",serif !important;
    font-size:38px !important;
    font-weight:600 !important;
    line-height:1.4 !important;
    letter-spacing:.005em !important;
    color:#111 !important;
  }

  .bliss-hero .bliss-hero-title span{
    white-space:nowrap !important;
  }

  .bliss-hero .bliss-hero-text{
    width:46% !important;
    max-width:none !important;
    margin:0 0 22px !important;
    font-size:12px !important;
    line-height:1.85 !important;
    color:#222 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    position:static !important;
    transform:none !important;
    width:auto !important;
    min-width:190px !important;
    min-height:46px !important;
    padding:10px 18px !important;
    font-size:12px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    position:absolute !important;
    top:22px !important;
    right:24px !important;
    left:auto !important;
    z-index:6 !important;
    width:88px !important;
    height:88px !important;
  }

  .bliss-hero .bliss-hero-square-logo img{
    width:146% !important;
  }

  /* 3ポイントもタブレットでは少しコンパクトに */
  .bliss-section.bliss-section-tone--soft{
    padding-top:34px !important;
    padding-bottom:34px !important;
  }

  .bliss-style-title{
    margin-bottom:22px !important;
  }

  .bliss-style-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }

  .bliss-style-card{
    display:block !important;
    padding:6px 18px !important;
    text-align:center !important;
  }

  .bliss-style-card + .bliss-style-card{
    border-top:0 !important;
    border-left:1px solid var(--bliss-line) !important;
  }

  .bliss-style-icon{
    width:42px !important;
    height:42px !important;
    margin:0 auto 8px !important;
  }

  .bliss-style-icon svg{
    width:32px !important;
    height:32px !important;
  }

  .bliss-style-card h3{
    margin:0 0 5px !important;
    font-size:13px !important;
  }

  .bliss-style-card p{
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.6 !important;
  }
}

/* 700px前後は少しだけさらに詰める */
@media screen and (min-width:641px) and (max-width:760px){
  .bliss-hero .bliss-hero-copy{
    padding-left:28px !important;
    padding-right:28px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:60% !important;
    font-size:34px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:52% !important;
    font-size:11px !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    left:30% !important;
    width:70% !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    width:78px !important;
    height:78px !important;
  }
}

/* =========================================================
   SP HERO COPY + CTA REFINEMENT
========================================================= */
@media screen and (max-width:640px){

  .bliss-hero .bliss-hero-title{
    width:72% !important;
    margin:0 0 16px !important;
    font-size:25px !important;
    font-weight:500 !important;
    line-height:1.45 !important;
    letter-spacing:.004em !important;
  }

  .bliss-hero .bliss-hero-text{
    width:61% !important;
    font-size:10.5px !important;
    line-height:1.72 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:58% !important;
  }
}

@media screen and (max-width:390px){

  .bliss-hero .bliss-hero-title{
    width:76% !important;
    font-size:24px !important;
    font-weight:500 !important;
    line-height:1.45 !important;
  }

  .bliss-hero .bliss-hero-text{
    width:65% !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:59% !important;
  }
}

/* =========================================================
   TABLET PORTRAIT COPY + CTA REFINEMENT
   641px - 960px
========================================================= */
@media screen and (min-width:641px) and (max-width:960px){

  .bliss-hero .bliss-hero-copy{
    padding:44px 28px 24px !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:52% !important;
    margin:0 0 10px !important;
    font-size:10px !important;
    line-height:1.5 !important;
  }

  .bliss-hero .bliss-hero-title{
    width:58% !important;
    margin:0 0 16px !important;
    font-size:30px !important;
    font-weight:500 !important;
    line-height:1.42 !important;
    letter-spacing:.004em !important;
  }

  .bliss-hero .bliss-hero-text{
    width:48% !important;
    margin:0 !important;
    font-size:11px !important;
    line-height:1.72 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    position:absolute !important;
    top:61% !important;
    left:28px !important;
    transform:translateY(-50%) !important;
    min-width:180px !important;
    min-height:44px !important;
    padding:10px 16px !important;
    font-size:11px !important;
  }
}

/* 800px前後 */
@media screen and (min-width:761px) and (max-width:860px){

  .bliss-hero .bliss-hero-title{
    width:56% !important;
    font-size:29px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:46% !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:62% !important;
  }
}

/* =========================================================
   FINAL RESPONSIVE HERO AUTHORITY
   641px-960px: tablet portrait / large mobile
========================================================= */
@media screen and (min-width:641px) and (max-width:960px){

  .bliss-hero{
    position:relative !important;
    height:500px !important;
    min-height:500px !important;
    overflow:hidden !important;
    background:#f4f4f4 !important;
  }

  .bliss-hero .bliss-hero-inner{
    position:relative !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:500px !important;
    width:100% !important;
    height:500px !important;
    min-height:500px !important;
    margin:0 !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    grid-column:1 !important;
    grid-row:1 !important;
    height:500px !important;
    min-height:500px !important;
  }

  .bliss-hero .bliss-hero-image{
    position:relative !important;
    inset:auto !important;
    z-index:1 !important;
    width:100% !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:22% !important;
    width:78% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:60% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    width:100% !important;
    height:500px !important;
    min-height:500px !important;
    padding:42px 28px 22px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,.98) 34%,
      rgba(255,255,255,.84) 50%,
      rgba(255,255,255,.46) 66%,
      rgba(255,255,255,.06) 100%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:54% !important;
    margin:0 0 10px !important;
    font-size:10px !important;
    line-height:1.5 !important;
  }

  .bliss-hero .bliss-hero-title{
    width:60% !important;
    max-width:none !important;
    margin:0 0 14px !important;
    font-family:"Shippori Mincho B1",serif !important;
    font-size:30px !important;
    font-weight:500 !important;
    line-height:1.44 !important;
    letter-spacing:.004em !important;
    color:#111 !important;
  }

  .bliss-hero .bliss-hero-title span{
    white-space:nowrap !important;
  }

  .bliss-hero .bliss-hero-text{
    width:50% !important;
    margin:0 !important;
    font-size:11px !important;
    line-height:1.72 !important;
    color:#222 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    position:absolute !important;
    top:64% !important;
    left:28px !important;
    transform:translateY(-50%) !important;
    width:auto !important;
    min-width:180px !important;
    min-height:44px !important;
    padding:10px 16px !important;
    font-size:11px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    position:absolute !important;
    top:18px !important;
    right:20px !important;
    left:auto !important;
    z-index:6 !important;
    width:82px !important;
    height:82px !important;
  }

  .bliss-hero .bliss-hero-square-logo img{
    width:146% !important;
  }
}

/* =========================================================
   FINAL SP HERO
   <= 640px
========================================================= */
@media screen and (max-width:640px){

  .bliss-hero{
    height:430px !important;
    min-height:430px !important;
  }

  .bliss-hero .bliss-hero-inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:430px !important;
    height:430px !important;
    min-height:430px !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    grid-column:1 !important;
    grid-row:1 !important;
    height:430px !important;
    min-height:430px !important;
  }

  .bliss-hero .bliss-hero-image{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    overflow:hidden !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    position:absolute !important;
    inset:0 0 0 8% !important;
    width:92% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:58% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    width:100% !important;
    padding:34px 18px 18px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.98) 0%,
      rgba(255,255,255,.94) 28%,
      rgba(255,255,255,.74) 45%,
      rgba(255,255,255,.32) 62%,
      rgba(255,255,255,.04) 100%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:68% !important;
    margin:0 0 9px !important;
    font-size:9px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:72% !important;
    margin:0 0 14px !important;
    font-family:"Shippori Mincho B1",serif !important;
    font-size:25px !important;
    font-weight:500 !important;
    line-height:1.45 !important;
    letter-spacing:.004em !important;
  }

  .bliss-hero .bliss-hero-text{
    width:61% !important;
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.72 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    position:absolute !important;
    top:58% !important;
    left:18px !important;
    transform:translateY(-50%) !important;
    min-width:166px !important;
    min-height:42px !important;
    padding:9px 14px !important;
    font-size:10.5px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    top:12px !important;
    right:12px !important;
    left:auto !important;
    width:76px !important;
    height:76px !important;
  }

  .bliss-section.bliss-section-tone--soft{
    padding-top:34px !important;
    padding-bottom:34px !important;
  }

  .bliss-style-title{
    margin-bottom:16px !important;
  }

  .bliss-style-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .bliss-style-card{
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) !important;
    grid-template-areas:
      "icon title"
      "icon text" !important;
    column-gap:14px !important;
    row-gap:2px !important;
    align-items:center !important;
    padding:14px 6px !important;
    text-align:left !important;
  }

  .bliss-style-card + .bliss-style-card{
    border-top:1px solid var(--bliss-line) !important;
    border-left:0 !important;
  }

  .bliss-style-icon{
    grid-area:icon !important;
    width:40px !important;
    height:40px !important;
    margin:0 !important;
  }

  .bliss-style-card h3{
    grid-area:title !important;
    margin:0 !important;
    font-size:13px !important;
  }

  .bliss-style-card p{
    grid-area:text !important;
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.55 !important;
  }

  .bliss-style-card p br{
    display:none !important;
  }
}


/* =========================================================
   2026-08-16 FINAL HEADER + HERO TUNING
   - Tablet/SP header ONLINE STORE button
   - Reduce white overlay so clothes show more clearly
   - Make hero copy slightly larger/bolder
========================================================= */
.bliss-header-store-mobile{
  display:none;
}

@media screen and (max-width:960px){
  .bliss-header-inner{
    grid-template-columns:1fr auto auto !important;
    gap:12px !important;
    min-height:70px !important;
  }

  .bliss-header-store-mobile{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:38px !important;
    padding:0 14px !important;
    border:1px solid var(--bliss-accent) !important;
    background:var(--bliss-accent) !important;
    color:#fff !important;
    font-size:10.5px !important;
    font-weight:700 !important;
    letter-spacing:.06em !important;
    line-height:1 !important;
    white-space:nowrap !important;
    text-decoration:none !important;
  }

  .bliss-header-store-mobile:hover,
  .bliss-header-store-mobile:focus{
    background:#fff !important;
    color:var(--bliss-accent) !important;
    border-color:var(--bliss-accent) !important;
  }

  .bliss-menu-toggle{
    width:38px !important;
    height:38px !important;
    font-size:30px !important;
  }
}

@media screen and (max-width:640px){
  .bliss-header-inner{
    gap:10px !important;
  }

  .bliss-header-store-mobile{
    min-height:34px !important;
    padding:0 11px !important;
    font-size:9.5px !important;
  }
}

@media screen and (min-width:641px) and (max-width:960px){
  .bliss-hero{
    height:500px !important;
    min-height:500px !important;
  }

  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:500px !important;
    min-height:500px !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    left:18% !important;
    width:82% !important;
    object-position:56% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    padding:40px 26px 22px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.95) 0%,
      rgba(255,255,255,.88) 24%,
      rgba(255,255,255,.64) 42%,
      rgba(255,255,255,.26) 60%,
      rgba(255,255,255,0) 78%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:56% !important;
    margin:0 0 12px !important;
    font-size:10.5px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:62% !important;
    margin:0 0 16px !important;
    font-size:33px !important;
    font-weight:600 !important;
    line-height:1.4 !important;
  }

  .bliss-hero .bliss-hero-text{
    width:50% !important;
    font-size:11.5px !important;
    line-height:1.8 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:63% !important;
    left:26px !important;
  }
}

@media screen and (max-width:640px){
  .bliss-hero{
    height:440px !important;
    min-height:440px !important;
  }

  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:440px !important;
    min-height:440px !important;
  }

  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    inset:0 0 0 6% !important;
    width:94% !important;
    object-position:56% top !important;
  }

  .bliss-hero .bliss-hero-copy{
    padding:34px 18px 18px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.96) 0%,
      rgba(255,255,255,.88) 24%,
      rgba(255,255,255,.62) 42%,
      rgba(255,255,255,.24) 60%,
      rgba(255,255,255,0) 78%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:70% !important;
    margin:0 0 10px !important;
    font-size:9.5px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:74% !important;
    margin:0 0 16px !important;
    font-size:28px !important;
    font-weight:600 !important;
    line-height:1.42 !important;
  }

  .bliss-hero .bliss-hero-text{
    width:60% !important;
    font-size:10.5px !important;
    line-height:1.74 !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:60% !important;
    left:18px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    width:80px !important;
    height:80px !important;
    top:10px !important;
    right:12px !important;
  }
}

@media screen and (max-width:390px){
  .bliss-header-store-mobile{
    padding:0 9px !important;
    font-size:9px !important;
  }

  .bliss-hero{
    height:420px !important;
    min-height:420px !important;
  }

  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:420px !important;
    min-height:420px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:78% !important;
    font-size:26px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:64% !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:61% !important;
    left:16px !important;
  }
}

/* =========================================================
   SP HERO FINAL ALIGNMENT
   - ぼかしを自然に
   - ロゴ位置補正
   - コピー/本文/CTAを少し下へ
========================================================= */
@media screen and (max-width:640px){

  .bliss-hero{
    height:440px !important;
    min-height:440px !important;
    background:#f4f4f4 !important;
  }

  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:440px !important;
    min-height:440px !important;
  }

  /* 写真は右側をしっかり見せる */
  .bliss-hero .bliss-hero-image > .bliss-hero-photo{
    inset:0 0 0 4% !important;
    width:96% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:57% top !important;
  }

  /* 左の白が急に切れないよう、ぼかし範囲を広げて弱める */
  .bliss-hero .bliss-hero-copy{
    padding:46px 18px 18px !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.96) 0%,
      rgba(255,255,255,.91) 23%,
      rgba(255,255,255,.73) 41%,
      rgba(255,255,255,.43) 57%,
      rgba(255,255,255,.17) 72%,
      rgba(255,255,255,0) 88%
    ) !important;
  }

  .bliss-hero .bliss-eyebrow{
    width:68% !important;
    margin:0 0 11px !important;
    font-size:9.5px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:74% !important;
    margin:0 0 16px !important;
    font-size:28px !important;
    font-weight:600 !important;
    line-height:1.42 !important;
  }

  .bliss-hero .bliss-hero-text{
    width:61% !important;
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.74 !important;
  }

  /* CTAを少し下げる */
  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:63% !important;
    left:18px !important;
    transform:translateY(-50%) !important;
  }

  /* ロゴを写真右上の余白に合わせて補正 */
  .bliss-hero .bliss-hero-square-logo{
    top:16px !important;
    right:16px !important;
    left:auto !important;
    width:78px !important;
    height:78px !important;
  }

  .bliss-hero .bliss-hero-square-logo img{
    width:146% !important;
    transform:translate(-50%,-50%) !important;
  }
}

@media screen and (max-width:390px){

  .bliss-hero{
    height:420px !important;
    min-height:420px !important;
  }

  .bliss-hero .bliss-hero-inner,
  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-copy{
    height:420px !important;
    min-height:420px !important;
  }

  .bliss-hero .bliss-hero-copy{
    padding:42px 16px 16px !important;
  }

  .bliss-hero .bliss-hero-title{
    width:78% !important;
    font-size:26px !important;
  }

  .bliss-hero .bliss-hero-text{
    width:65% !important;
  }

  .bliss-hero .bliss-hero-copy .bliss-btn{
    top:64% !important;
    left:16px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    top:14px !important;
    right:14px !important;
    width:72px !important;
    height:72px !important;
  }
}


/* --- SP hero lower blur fix --- */
@media screen and (max-width: 640px) {
  .bliss-hero {
    position: relative !important;
    overflow: hidden !important;
  }

  /* 左側の白ぼかしをセクション全高にかける */
  .bliss-hero::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 72%;
    pointer-events: none;
    z-index: 2;
    background: linear-gradient(
      90deg,
      rgba(255,255,255,0.97) 0%,
      rgba(255,255,255,0.94) 18%,
      rgba(255,255,255,0.88) 36%,
      rgba(255,255,255,0.72) 52%,
      rgba(255,255,255,0.42) 68%,
      rgba(255,255,255,0.15) 82%,
      rgba(255,255,255,0.00) 100%
    );
  }

  /* 既存の部分的な白背景は外して、全体オーバーレイに統一 */
  .bliss-hero .bliss-hero-copy {
    position: relative !important;
    z-index: 3 !important;
    background: transparent !important;
  }

  .bliss-hero .bliss-hero-image,
  .bliss-hero .bliss-hero-square-logo {
    position: relative;
    z-index: 1;
  }
}

@media screen and (max-width: 390px) {
  .bliss-hero::after {
    width: 76%;
    background: linear-gradient(
      90deg,
      rgba(255,255,255,0.98) 0%,
      rgba(255,255,255,0.95) 22%,
      rgba(255,255,255,0.89) 40%,
      rgba(255,255,255,0.74) 56%,
      rgba(255,255,255,0.45) 71%,
      rgba(255,255,255,0.16) 85%,
      rgba(255,255,255,0.00) 100%
    );
  }
}

/* =========================================================
   SP HERO: BOTTOM BLUR CONTINUITY + LOGO POSITION
========================================================= */
@media screen and (max-width:640px){
  .bliss-hero{
    position:relative !important;
    overflow:hidden !important;
  }

  /* 左→右のぼかしは全高に維持 */
  .bliss-hero::after{
    content:"";
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    bottom:0 !important;
    width:74% !important;
    z-index:2 !important;
    pointer-events:none !important;
    background:linear-gradient(
      90deg,
      rgba(255,255,255,.97) 0%,
      rgba(255,255,255,.94) 20%,
      rgba(255,255,255,.86) 38%,
      rgba(255,255,255,.68) 54%,
      rgba(255,255,255,.39) 69%,
      rgba(255,255,255,.14) 83%,
      rgba(255,255,255,0) 100%
    ) !important;
  }

  /* 下端にも横幅100%のぼかしを追加して、次セクションまで自然につなぐ */
  .bliss-hero::before{
    content:"";
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    height:72px !important;
    z-index:2 !important;
    pointer-events:none !important;
    background:linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.08) 25%,
      rgba(255,255,255,.24) 48%,
      rgba(255,255,255,.50) 72%,
      rgba(255,255,255,.88) 100%
    ) !important;
  }

  .bliss-hero .bliss-hero-copy{
    position:relative !important;
    z-index:3 !important;
    background:transparent !important;
  }

  /* SPロゴを少し下へ */
  .bliss-hero .bliss-hero-square-logo{
    position:absolute !important;
    top:24px !important;
    right:14px !important;
    left:auto !important;
    z-index:4 !important;
  }
}

@media screen and (max-width:390px){
  .bliss-hero::after{
    width:78% !important;
  }

  .bliss-hero::before{
    height:64px !important;
  }

  .bliss-hero .bliss-hero-square-logo{
    top:22px !important;
    right:12px !important;
  }
}

/* =========================================================
   HERO LOGO FINAL POSITION
   PC / TABLET / SP：写真の右下に白ロゴを配置
========================================================= */
.bliss-hero-image{
  position:relative !important;
}

.bliss-hero .bliss-hero-square-logo{
  position:absolute !important;
  top:auto !important;
  left:auto !important;
  right:28px !important;
  bottom:26px !important;
  z-index:7 !important;
  width:132px !important;
  height:auto !important;
  aspect-ratio:auto !important;
  overflow:visible !important;
  background:transparent !important;
  box-shadow:none !important;
}

.bliss-hero .bliss-hero-square-logo img{
  position:static !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
  background:transparent !important;
  mix-blend-mode:normal !important;
  filter:none !important;
}

@media screen and (min-width:641px) and (max-width:960px){
  .bliss-hero .bliss-hero-square-logo{
    right:22px !important;
    bottom:22px !important;
    width:116px !important;
  }
}

@media screen and (max-width:640px){
  .bliss-hero .bliss-hero-square-logo{
    top:auto !important;
    left:auto !important;
    right:16px !important;
    bottom:18px !important;
    width:96px !important;
  }
}

@media screen and (max-width:390px){
  .bliss-hero .bliss-hero-square-logo{
    right:14px !important;
    bottom:16px !important;
    width:88px !important;
  }
}

/* =========================================================
   ABOUT BLiSS LOGO
========================================================= */
.bliss-about-content{
  min-width:0;
}

.bliss-about-logo{
  display:block;
  width:148px;
  height:auto;
  margin:0 0 18px;
  object-fit:contain;
}

@media screen and (max-width:960px){
  .bliss-about-logo{
    width:132px;
    margin-bottom:16px;
  }
}

@media screen and (max-width:640px){
  .bliss-about-logo{
    width:118px;
    margin-bottom:14px;
  }
}

/* =========================================================
   2026-08-16 LOGO / NEW ITEM / ABOUT FINAL ADJUST
========================================================= */

/* ファーストビュー白ロゴを少し大きく */
@media screen and (min-width:961px){
  .bliss-hero .bliss-hero-square-logo{
    width:156px !important;
    height:156px !important;
    right:28px !important;
    bottom:24px !important;
    top:auto !important;
    left:auto !important;
  }
}

@media screen and (min-width:641px) and (max-width:960px){
  .bliss-hero .bliss-hero-square-logo{
    width:136px !important;
    height:136px !important;
    right:20px !important;
    bottom:18px !important;
    top:auto !important;
    left:auto !important;
  }
}

@media screen and (max-width:640px){
  .bliss-hero .bliss-hero-square-logo{
    width:112px !important;
    height:112px !important;
    right:14px !important;
    bottom:14px !important;
    top:auto !important;
    left:auto !important;
  }
}

@media screen and (max-width:390px){
  .bliss-hero .bliss-hero-square-logo{
    width:102px !important;
    height:102px !important;
    right:12px !important;
    bottom:12px !important;
  }
}

/* ABOUTロゴ：写真の右下にオーバーレイ */
.bliss-about-image{
  position:relative;
}

.bliss-about-logo-overlay{
  position:absolute;
  right:22px;
  bottom:20px;
  z-index:2;
  display:block;
  width:150px;
  height:auto !important;
  min-height:0 !important;
  object-fit:contain !important;
  filter:drop-shadow(0 1px 6px rgba(0,0,0,.12));
}

@media screen and (max-width:960px){
  .bliss-about-logo-overlay{
    right:18px;
    bottom:16px;
    width:136px;
  }
}

@media screen and (max-width:640px){
  .bliss-about-logo-overlay{
    right:14px;
    bottom:14px;
    width:118px;
  }
}

/* 旧ABOUTロゴ用の余白を無効化 */
.bliss-about-content .bliss-about-logo{
  display:none !important;
}

/* =========================================================
   ABOUT BLiSS LOGO - OUTSIDE STORE PHOTO
========================================================= */
.bliss-about-logo-overlay{
  display:none !important;
}

.bliss-about-content{
  min-width:0 !important;
}

.bliss-about-brand{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  width:100% !important;
  margin:0 0 18px !important;
}

.bliss-about-brand-logo{
  display:block !important;
  position:static !important;
  width:140px !important;
  max-width:34% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  transform:none !important;
  filter:none !important;
}

@media screen and (max-width:960px){
  .bliss-about-brand-logo{
    width:126px !important;
    max-width:38% !important;
  }
}

@media screen and (max-width:640px){
  .bliss-about-brand{
    justify-content:flex-start !important;
    margin-bottom:14px !important;
  }

  .bliss-about-brand-logo{
    width:112px !important;
    max-width:42% !important;
  }
}

/* =========================================================
   ABOUT BLiSS SECTION - SPACING REFINEMENT
========================================================= */

/* セクション全体の上下余白を少し圧縮 */
#about.bliss-section{
  padding-top:56px !important;
  padding-bottom:56px !important;
}

/* 画像とテキストの間隔を詰める */
.bliss-about-grid{
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;
  gap:42px !important;
  align-items:center !important;
}

/* 写真を少しだけ横長に見せて余白感を減らす */
.bliss-about-image{
  min-height:390px !important;
}

.bliss-about-image > img{
  min-height:390px !important;
}

/* テキスト側の上部余白感を調整 */
.bliss-about-brand{
  margin-bottom:10px !important;
}

.bliss-about-brand-logo{
  width:128px !important;
  max-width:32% !important;
}

.bliss-about-label{
  margin-bottom:8px !important;
}

.bliss-about-title{
  margin-bottom:16px !important;
}

.bliss-about-text p{
  margin-bottom:14px !important;
}

/* Tablet */
@media screen and (max-width:960px){
  #about.bliss-section{
    padding-top:46px !important;
    padding-bottom:46px !important;
  }

  .bliss-about-grid{
    gap:30px !important;
  }

  .bliss-about-brand-logo{
    width:116px !important;
  }
}

/* SP */
@media screen and (max-width:640px){
  #about.bliss-section{
    padding-top:38px !important;
    padding-bottom:38px !important;
  }

  .bliss-about-grid{
    gap:24px !important;
  }

  .bliss-about-brand{
    margin-bottom:8px !important;
  }

  .bliss-about-brand-logo{
    width:104px !important;
  }

  .bliss-about-image{
    min-height:0 !important;
  }

  .bliss-about-image > img{
    min-height:0 !important;
  }
}

/* =========================================================
   ABOUT BLiSS TITLE + LOGO ROW
========================================================= */

/* 旧ロゴ配置用の余白を無効化 */
.bliss-about-brand{
  display:none !important;
}

.bliss-about-title-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:24px !important;
  width:100% !important;
  margin:0 0 18px !important;
}

.bliss-about-title-row .bliss-about-title{
  flex:1 1 auto !important;
  margin:0 !important;
  min-width:0 !important;
}

.bliss-about-title-row .bliss-about-title span{
  display:block !important;
  white-space:nowrap !important;
}

.bliss-about-title-row .bliss-about-brand-logo{
  flex:0 0 auto !important;
  display:block !important;
  position:static !important;
  width:126px !important;
  max-width:30% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  transform:none !important;
  filter:none !important;
}

@media screen and (max-width:960px){
  .bliss-about-title-row{
    gap:18px !important;
  }

  .bliss-about-title-row .bliss-about-brand-logo{
    width:112px !important;
    max-width:31% !important;
  }
}

@media screen and (max-width:640px){
  .bliss-about-title-row{
    gap:14px !important;
    align-items:center !important;
  }

  .bliss-about-title-row .bliss-about-title{
    font-size:30px !important;
    line-height:1.45 !important;
  }

  .bliss-about-title-row .bliss-about-brand-logo{
    width:88px !important;
    max-width:28% !important;
  }
}

@media screen and (max-width:390px){
  .bliss-about-title-row .bliss-about-title{
    font-size:27px !important;
  }

  .bliss-about-title-row .bliss-about-brand-logo{
    width:78px !important;
  }
}

/* =========================================================
   ABOUT BLiSS FINAL BALANCE
   - PC/Tablet: タイトルの改行を減らす
   - ロゴを少し大きく
   - SPレイアウト最適化
========================================================= */

/* ---------- PC / Tablet ---------- */
.bliss-about-title-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:28px !important;
  margin:0 0 18px !important;
}

.bliss-about-title-row .bliss-about-title{
  flex:1 1 auto !important;
  margin:0 !important;
  min-width:0 !important;
  font-size:clamp(34px,3vw,44px) !important;
  line-height:1.42 !important;
}

/* PCでは1行で見せて、改行を減らす */
.bliss-about-title-row .bliss-about-title span{
  display:inline !important;
  white-space:normal !important;
}

.bliss-about-title-row .bliss-about-title span:first-child::after{
  content:" " !important;
}

/* ロゴを少し大きく */
.bliss-about-title-row .bliss-about-brand-logo{
  flex:0 0 auto !important;
  width:156px !important;
  max-width:30% !important;
  height:auto !important;
  margin:0 !important;
}

.bliss-about-text{
  max-width:590px !important;
}

.bliss-about-text p{
  margin-bottom:13px !important;
}

/* ---------- Tablet ---------- */
@media screen and (min-width:641px) and (max-width:960px){
  .bliss-about-grid{
    gap:30px !important;
  }

  .bliss-about-title-row{
    gap:20px !important;
  }

  .bliss-about-title-row .bliss-about-title{
    font-size:34px !important;
  }

  .bliss-about-title-row .bliss-about-brand-logo{
    width:132px !important;
    max-width:31% !important;
  }
}

/* ---------- SP ---------- */
@media screen and (max-width:640px){
  #about.bliss-section{
    padding-top:34px !important;
    padding-bottom:36px !important;
  }

  .bliss-about-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
  }

  .bliss-about-image{
    width:100% !important;
    min-height:0 !important;
    aspect-ratio:4 / 3 !important;
    overflow:hidden !important;
  }

  .bliss-about-image > img{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
    object-position:center center !important;
  }

  .bliss-about-content{
    width:100% !important;
  }

  .bliss-about-label{
    margin:0 0 8px !important;
    font-size:20px !important;
    line-height:1.3 !important;
  }

  .bliss-about-title-row{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:14px !important;
    margin:0 0 16px !important;
  }

  /* SPでは2行に戻して読みやすく */
  .bliss-about-title-row .bliss-about-title{
    margin:0 !important;
    font-size:29px !important;
    line-height:1.42 !important;
    letter-spacing:.01em !important;
  }

  .bliss-about-title-row .bliss-about-title span{
    display:block !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span:first-child::after{
    content:"" !important;
  }

  .bliss-about-title-row .bliss-about-brand-logo{
    width:104px !important;
    max-width:none !important;
  }

  .bliss-about-text{
    max-width:none !important;
    font-size:13px !important;
    line-height:1.9 !important;
  }

  .bliss-about-text p{
    margin:0 0 13px !important;
  }

  .bliss-about-text p:last-child{
    margin-bottom:0 !important;
  }
}

@media screen and (max-width:390px){
  #about.bliss-section{
    padding-top:30px !important;
    padding-bottom:32px !important;
  }

  .bliss-about-grid{
    gap:20px !important;
  }

  .bliss-about-label{
    font-size:19px !important;
  }

  .bliss-about-title-row{
    gap:10px !important;
  }

  .bliss-about-title-row .bliss-about-title{
    font-size:26px !important;
  }

  .bliss-about-title-row .bliss-about-brand-logo{
    width:90px !important;
  }

  .bliss-about-text{
    font-size:12.5px !important;
  }
}

/* =========================================================
   ABOUT + LINE FINAL ADJUST
========================================================= */

/* ---------- ABOUT / PC ---------- */
.bliss-about-title-row{
  margin-bottom:18px !important;
}

.bliss-about-title-row .bliss-about-title{
  margin:0 !important;
}

/* タイトル横の旧ロゴ配置を完全に解除 */
.bliss-about-title-row .bliss-about-brand-logo{
  display:none !important;
}

.bliss-about-intro-row{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 170px !important;
  align-items:center !important;
  gap:28px !important;
  width:100% !important;
  margin:0 0 14px !important;
}

.bliss-about-intro-row > p{
  margin:0 !important;
}

.bliss-about-intro-row .bliss-about-brand-logo{
  display:block !important;
  position:static !important;
  width:170px !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  transform:none !important;
  filter:none !important;
}

/* ---------- ABOUT / Tablet ---------- */
@media screen and (min-width:641px) and (max-width:960px){
  .bliss-about-intro-row{
    grid-template-columns:minmax(0,1fr) 138px !important;
    gap:20px !important;
  }

  .bliss-about-intro-row .bliss-about-brand-logo{
    width:138px !important;
  }
}

/* ---------- ABOUT / SP ---------- */
@media screen and (max-width:640px){
  #about.bliss-section{
    padding-top:32px !important;
    padding-bottom:34px !important;
  }

  .bliss-about-grid{
    gap:22px !important;
  }

  .bliss-about-content{
    padding:0 2px !important;
  }

  .bliss-about-label{
    margin-bottom:8px !important;
    font-size:19px !important;
  }

  .bliss-about-title-row{
    margin-bottom:14px !important;
  }

  .bliss-about-title-row .bliss-about-title{
    font-size:28px !important;
    line-height:1.42 !important;
  }

  .bliss-about-title-row .bliss-about-title span{
    display:block !important;
    white-space:nowrap !important;
  }

  /* SPは本文とロゴを横並びにせず、ロゴを独立させて見やすく */
  .bliss-about-intro-row{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
    margin-bottom:14px !important;
  }

  .bliss-about-intro-row .bliss-about-brand-logo{
    width:112px !important;
    align-self:flex-end !important;
    margin-top:-4px !important;
  }

  .bliss-about-text{
    font-size:12.5px !important;
    line-height:1.85 !important;
  }

  .bliss-about-text p{
    margin-bottom:12px !important;
  }
}

@media screen and (max-width:390px){
  .bliss-about-title-row .bliss-about-title{
    font-size:25px !important;
  }

  .bliss-about-intro-row .bliss-about-brand-logo{
    width:100px !important;
  }
}

/* ---------- LINE ---------- */
.bliss-line-copy p{
  max-width:470px !important;
}

/* SPでは友だち追加ボタンを中央寄せ */
@media screen and (max-width:640px){
  .bliss-line-content{
    width:100% !important;
  }

  .bliss-line-copy p{
    max-width:none !important;
    font-size:12px !important;
    line-height:1.75 !important;
  }

  .bliss-line-addfriend{
    display:flex !important;
    justify-content:center !important;
    width:100% !important;
    margin-top:8px !important;
    text-align:center !important;
  }

  .bliss-line-addfriend a{
    display:inline-flex !important;
    justify-content:center !important;
  }

  .bliss-line-addfriend img{
    margin:0 auto !important;
  }
}

/* =========================================================
   ABOUT BLiSS LOGO - BESIDE FULL COPY BLOCK
========================================================= */

/* 以前の1段目横並び指定を解除 */
.bliss-about-intro-row{
  display:block !important;
}

.bliss-about-text-with-logo{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 176px !important;
  align-items:center !important;
  gap:30px !important;
  max-width:none !important;
  width:100% !important;
}

.bliss-about-copy-block{
  min-width:0 !important;
}

.bliss-about-copy-block p{
  margin:0 0 14px !important;
}

.bliss-about-copy-block p:last-child{
  margin-bottom:0 !important;
}

.bliss-about-brand-logo--side{
  display:block !important;
  position:static !important;
  width:176px !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
  transform:none !important;
  filter:none !important;
  align-self:center !important;
  justify-self:end !important;
}

/* Tablet */
@media screen and (min-width:641px) and (max-width:960px){
  .bliss-about-text-with-logo{
    grid-template-columns:minmax(0,1fr) 142px !important;
    gap:22px !important;
  }

  .bliss-about-brand-logo--side{
    width:142px !important;
  }
}

/* SPは本文の右に無理に置かず、本文下の右寄せにして読みやすさ優先 */
@media screen and (max-width:640px){
  .bliss-about-text-with-logo{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:12px !important;
  }

  .bliss-about-brand-logo--side{
    width:108px !important;
    align-self:flex-end !important;
    justify-self:auto !important;
    margin-top:-2px !important;
  }
}

@media screen and (max-width:390px){
  .bliss-about-brand-logo--side{
    width:96px !important;
  }
}

/* =========================================================
   ABOUT BLiSS SP FINAL
   - 「好きな服を、もっと自由に。」を1行表示
   - ロゴをPC同様、本文ブロック右側へ
========================================================= */
@media screen and (max-width:640px){

  .bliss-about-title-row{
    display:block !important;
    margin:0 0 14px !important;
  }

  .bliss-about-title-row .bliss-about-title{
    margin:0 !important;
    font-size:25px !important;
    line-height:1.4 !important;
    letter-spacing:.005em !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span{
    display:inline !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span:first-child::after{
    content:" " !important;
  }

  /* SPも本文ブロックの右側にロゴ */
  .bliss-about-text-with-logo{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 92px !important;
    align-items:center !important;
    gap:14px !important;
    width:100% !important;
  }

  .bliss-about-copy-block{
    min-width:0 !important;
  }

  .bliss-about-copy-block p{
    margin:0 0 12px !important;
    font-size:12px !important;
    line-height:1.8 !important;
  }

  .bliss-about-copy-block p:last-child{
    margin-bottom:0 !important;
  }

  .bliss-about-brand-logo--side{
    width:92px !important;
    max-width:100% !important;
    align-self:center !important;
    justify-self:end !important;
    margin:0 !important;
  }
}

@media screen and (max-width:390px){

  .bliss-about-title-row .bliss-about-title{
    font-size:22px !important;
  }

  .bliss-about-text-with-logo{
    grid-template-columns:minmax(0,1fr) 82px !important;
    gap:10px !important;
  }

  .bliss-about-copy-block p{
    font-size:11.5px !important;
    line-height:1.75 !important;
  }

  .bliss-about-brand-logo--side{
    width:82px !important;
  }
}

/* =========================================================
   ABOUT BLiSS PC TITLE - SINGLE LINE
========================================================= */
@media screen and (min-width:961px){
  .bliss-about-title-row{
    display:block !important;
  }

  .bliss-about-title-row .bliss-about-title{
    width:100% !important;
    max-width:none !important;
    margin:0 0 18px !important;
    font-size:clamp(32px,2.6vw,40px) !important;
    line-height:1.35 !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span{
    display:inline !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span:first-child::after{
    content:" " !important;
  }
}

/* =========================================================
   ABOUT BLiSS SP - SAME STRUCTURE AS PC
   - タイトルを1行
   - 本文ブロック右側にロゴ
========================================================= */
@media screen and (max-width:640px){

  #about.bliss-section{
    padding-top:32px !important;
    padding-bottom:34px !important;
  }

  .bliss-about-grid{
    gap:22px !important;
  }

  .bliss-about-content{
    width:100% !important;
    min-width:0 !important;
  }

  .bliss-about-label{
    margin:0 0 8px !important;
    font-size:19px !important;
    line-height:1.3 !important;
  }

  /* タイトルをSPでも必ず1行に */
  .bliss-about-title-row{
    display:block !important;
    width:100% !important;
    margin:0 0 14px !important;
  }

  .bliss-about-title-row .bliss-about-title{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    font-size:24px !important;
    line-height:1.35 !important;
    letter-spacing:.002em !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span{
    display:inline !important;
    white-space:nowrap !important;
  }

  .bliss-about-title-row .bliss-about-title span:first-child::after{
    content:" " !important;
  }

  /* PC版と同じく、本文ブロック全体の右側へロゴを配置 */
  .bliss-about-text-with-logo{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 96px !important;
    align-items:center !important;
    gap:14px !important;
    width:100% !important;
    max-width:none !important;
  }

  .bliss-about-copy-block{
    min-width:0 !important;
  }

  .bliss-about-copy-block p{
    margin:0 0 12px !important;
    font-size:11.5px !important;
    line-height:1.76 !important;
  }

  .bliss-about-copy-block p:last-child{
    margin-bottom:0 !important;
  }

  .bliss-about-brand-logo--side{
    display:block !important;
    position:static !important;
    align-self:center !important;
    justify-self:end !important;
    width:96px !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    object-fit:contain !important;
    transform:none !important;
    filter:none !important;
  }
}

@media screen and (max-width:390px){

  .bliss-about-title-row .bliss-about-title{
    font-size:21px !important;
  }

  .bliss-about-text-with-logo{
    grid-template-columns:minmax(0,1fr) 84px !important;
    gap:10px !important;
  }

  .bliss-about-copy-block p{
    font-size:11px !important;
    line-height:1.72 !important;
  }

  .bliss-about-brand-logo--side{
    width:84px !important;
  }
}

/* =========================================================
   ABOUT BLiSS SP LOGO SIZE UP
========================================================= */
@media screen and (max-width:640px){
  .bliss-about-text-with-logo{
    grid-template-columns:minmax(0,1fr) 112px !important;
    gap:14px !important;
  }

  .bliss-about-brand-logo--side{
    width:112px !important;
  }
}

@media screen and (max-width:390px){
  .bliss-about-text-with-logo{
    grid-template-columns:minmax(0,1fr) 98px !important;
    gap:10px !important;
  }

  .bliss-about-brand-logo--side{
    width:98px !important;
  }
}

/* =========================================================
   2026-08-17 FINAL FUNCTIONAL ADJUSTMENTS
========================================================= */

/* ---------- HERO: copy must always stay in front of photo ---------- */
.bliss-hero{
  position:relative !important;
  isolation:isolate !important;
}

.bliss-hero .bliss-hero-image{
  z-index:1 !important;
}

.bliss-hero .bliss-hero-image > .bliss-hero-photo{
  z-index:1 !important;
}

.bliss-hero .bliss-hero-copy{
  z-index:20 !important;
}

.bliss-hero .bliss-eyebrow,
.bliss-hero .bliss-hero-title,
.bliss-hero .bliss-hero-text{
  position:relative !important;
  z-index:21 !important;
}

.bliss-hero .bliss-hero-copy .bliss-btn{
  z-index:22 !important;
}

/* ---------- PICK UP: 4 items ---------- */
#bliss-pickup-items.bliss-pickup-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:28px 20px !important;
}

@media screen and (max-width:960px){
  #bliss-pickup-items.bliss-pickup-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:26px 18px !important;
  }
}

@media screen and (max-width:640px){
  #bliss-pickup-items.bliss-pickup-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:22px 12px !important;
  }
}

/* ---------- ABOUT managed image ---------- */
#bliss-about-photo{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}