/* ============================================
   Brooks Brothers × Lavenham コラボレーションLP
   Figmaデザインに基づくフォント指定
   ============================================ */
figure{
  display: block;
  margin: 0;
  padding: 0;
}
h1,h2,h3{
  margin: 0;
  padding: 0;
}
   .OnlyPc {
  display: block;
}

@media screen and (max-width: 768px) {
  .OnlyPc {
    display: none;
  }
}
.OnlyInlinBlockPc {
  display: inline-block;
}

@media screen and (max-width: 768px) {
  .OnlyInlinBlockPc {
    display: none;
  }
}

.OnlySp {
  display: none;
}

@media screen and (max-width: 768px) {
  .OnlySp {
    display: block;
  }
}
.OnlyInlinBlockSp {
  display: none;
}

@media screen and (max-width: 768px) {
  .OnlyInlinBlockSp {
    display: inline-block;
  }
}
@media screen and (max-width: 768px) {
  .InnerSp{
    padding-inline: 24px;
  }
}

/* フッター */
.lavenham-footer {
  width: 100%;
  margin-top: 80px;
}

.lavenham-footer__image {
  width: 100%;
  height: auto;
  display: block;
}

/* ページトップボタン */
.lavenham-page-top {
  text-align: center;
  padding: 40px 20px;
  position: relative;
}

.lavenham-page-top__link {
  display: inline-block;
  text-decoration: none;
}

.lavenham-page-top__link img {
  height: 58px;
  width: auto;
  display: block;
}

.lavenham-page-top__link:hover {
  opacity: 0.7;
}

/* ここから追加 */
.lavenham-collaboration{
  background-color: #fff;
}

/* メインビジュアル */

.lavenham-mv {
padding-inline: 49px 20px;
  background: #fff;
}
@media (max-width: 768px) {
  .lavenham-mv {
padding-inline:0;
}
}

.lavenham-mv__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.9s ease-in-out;
}

.lavenham-mv__content.active {
  opacity: 1;
}

.lavenham-mv__eyebrow {
font-family: 'Libre Caslon Text';
font-weight: 500;
font-size: 24px;
line-height: 2.72;
letter-spacing: 0.03em;
color: #000000;
text-align: center;
}


@media (max-width: 768px) {
  .lavenham-mv__eyebrow {
font-size: 16px;
margin-top: 30px;
line-height: 2.49;
  }
}

.lavenham-mv__divider {
  width: 1px;
  height: 27.8px;
  margin: 0 auto;
  background: #000000;
}
@media (max-width: 768px) {
  .lavenham-mv__divider {
    height: 17px;
  }
}
.lavenham-mv__title {
display: flex;
justify-content: center;
margin-top: 24px;
}

@media (max-width: 768px) {
.lavenham-mv__title {
margin-top: 0;
max-width: 275px;
margin-inline: auto;
  }
}


.lavenham-mv__title-separator {
  display: inline-block;
font-family: "Montserrat", sans-serif;
font-weight: 400;
font-size: 61.4569px;
line-height: 0.6;
color: #000000;
padding-block: 0px 11px;

}
@media (max-width: 768px) {
.lavenham-mv__title-separator {
font-size: 37.5167px;
padding-block: 2px 0px;
  }
}


.lavenham-mv__content2{
  display: flex;
  justify-content: center;
  gap: 35px;
  padding-top: 41.92px;
}

@media (max-width: 768px) {
  .lavenham-mv__content2{
    flex-direction: column;
    gap: 49px;
    padding-top: 18px;
  }
}
.lavenham-mv__visual{
  aspect-ratio: 736/430;
  overflow: hidden;
  position: relative;
}

/* holidayページの動きを踏襲：左から右に移動（角度変更なし） */
.lavenham-mv__visual-figure{
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
}

/* holidayページと同じ仕組み：大きな覆いが左から右に移動 */
.lavenham-mv__visual-figure::before {
  background: #fff;
  content: '';
  position: absolute;
  /* 画像より大きくしておく（全体を覆えるように） */
  width: 150%;
  height: 100%;
  top: 0;
  left: -50%;
  /* 角度変更なし（回転を削除） */
  transform-origin: left center;
  /* 初期位置：左側に配置（画像全体を覆う） */
  transform: translateX(0);
  pointer-events: none;
  z-index: 1;
  }
.lavenham-mv__visual{
  width: 100%;
  aspect-ratio: 736/430;
  max-width: 736px;
}

@media screen and (max-width: 768px) {
  .lavenham-mv__visual-figure::before {
    width: 200%;
    left: -100%;
  }
  }
@media (min-width: 1324px) {
.lavenham-mv__visual{
  max-width: 1000px;
}
}

.lavenham-mv__visual-figure.active::before {
  animation: lavenham-mv-visual-figure 2.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes lavenham-mv-visual-figure {
  0% {
    /* 初期位置：左側（画像全体を覆う） */
    transform: translateX(0);
  }
  100% {
    /* 右方向へ大きく移動して画面外へ（角度変更なし） */
    transform: translateX(150%);
  }
}
@media (max-width: 768px) {
.lavenham-mv__visual{
  aspect-ratio: unset;
  max-width: 100%;
}
}

.lavenham-mv__visual-figure picture {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.lavenham-mv__visual-figure img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  position: relative;
  /* 初期状態：拡大（左側を基準に） */
  transform: scale(1.3);
  transform-origin: left center;
  transition: transform 1.5s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
max-width: 736px;
}
@media (min-width: 1324px) {
.lavenham-mv__visual-figure img{
max-width: 1000px;
}
}

.lavenham-mv__visual-figure.active img {
  /* アニメーション後：通常サイズ */
  transform: scale(1);
}

@media (max-width: 768px) {
  .lavenham-mv__visual-figure img {
    /* 初期状態：拡大（スマホ版） */
    transform: scale(1.2);
  }
  
  .lavenham-mv__visual-figure.active img {
    /* アニメーション後：通常サイズ（スマホ版） */
    transform: scale(1);
  }
  .lavenham-mv__visual-figure img{
max-width: 100%;
}
}

.lavenham-mv__content2-text{
  margin: 0;
  margin-top: -67px;
  opacity: 0;
  transition: opacity 0.9s ease-in-out;
}

.lavenham-mv__content2-text.active {
  opacity: 1;
}
@media (max-width: 1161px) {
.lavenham-mv__content2-text{
  margin: 0;
}
}
@media (max-width: 768px) {
.lavenham-mv__content2-text{
  margin: 0;
}
}
.lavenham-mv__headline {
font-family: 'Zen Old Mincho';
font-weight: 500;
font-size: 32px;
line-height: 1.25;
color: #000000;
margin: 0;padding: 0;
}
@media (max-width: 768px) {
  .lavenham-mv__headline {
font-family: 'Zen Old Mincho';
font-size: 22px;
line-height: 1.55;
text-align: center;
  }
}
.lavenham-mv__lead {  
font-family: 'Zen Old Mincho';
font-size: 20px;
line-height: 1.65;
letter-spacing: 1px;
color: #000000;
padding-top: 21px;
}
@media (max-width: 768px) {
  .lavenham-mv__lead {  
font-size: 14px;
line-height: 1.8;
letter-spacing: 0.5px;
padding-top: 18px;
  }
}
/* メインビジュアル */
/* BRAND INTRODUCTION */
.lavenham-introduction{
  margin-top: 100px;
}
@media (max-width: 768px) {
.lavenham-introduction{
  margin-top: 53px;
}
}
.lavenham-introduction__upper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 48px;
} 
@media (max-width: 768px) {
.lavenham-introduction__upper {
  flex-direction: column  ;
  gap: 38px;
} 
}
.lavenham-introduction__title-block {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
@media (max-width: 768px) {

.lavenham-introduction__title-block {
  order: 2;
  gap: 0;
} 
}

.lavenham-introduction__eyebrow {
font-family: 'Libre Caslon Text';
font-size: 18px;
font-weight: 500;
line-height: 0;
color: #000000;

}
@media (max-width: 768px) {
.lavenham-introduction__eyebrow {
font-size: 14px;
line-height: 2.84;
}

}
.lavenham-introduction__divider {
  width: 1px;
  height: 28px;
background-color: #000000;
}
@media (max-width: 768px) {
  .lavenham-introduction__divider {
  height: 17px;
}
}
.lavenham-introduction__logo{
  margin: 0;
  margin-top: 10px;
  padding: 0;
}
@media (max-width: 768px) {
.lavenham-introduction__logo-text svg{
  max-width: 189px;
}
}

.lavenham-introduction__spacer{
  width: 1px;
  height: 101px;
  background-color: #000000;
}
@media (max-width: 768px) {
.lavenham-introduction__spacer{
width: calc(100% - 59px);
height: 1px;
order: 1;
}
}
.lavenham-introduction__content {
max-width: 494px;
}
@media (max-width: 768px) {
.lavenham-introduction__content {
max-width: 100%;
padding-top: 2px;
order: 3;
}
}
.lavenham-introduction__headline {
font-family: 'Zen Old Mincho';
font-weight: 600;
font-size: 18px;
line-height: 1.56;
letter-spacing: 1px;
color: #000000; 
}
@media (max-width: 768px) {
.lavenham-introduction__headline {
font-size: 18px;
font-weight: 500;
line-height: 1.44;
text-align: center;
}
}
.lavenham-introduction__description {
font-family: 'Zen Old Mincho';
font-weight: 500;
font-size: 16px;
line-height: 1.8;
letter-spacing: 1px;
color: #000000;
padding-top: 14px;
}
@media (max-width: 768px) {
.lavenham-introduction__description {
padding-top: 16px;
font-size: 14px;
}

}
.lavenham-introduction__links {
display: flex;
justify-self: center;
gap: 39.78px;
margin-top: 100px;
padding-inline: calc(152 / 1280 * 100vw) calc(163 / 1280 * 100vw);
}
@media (max-width: 768px) {
.lavenham-introduction__links {
flex-direction: column;
gap: 33.96px;
margin-top: 78px;
padding-inline: 24px;
}
}

.lavenham-introduction__link-card {
  text-align: center;
}
.lavenham-introduction__link-card:hover {
  opacity: 1;
}

.lavenham-introduction__link-figure img {
  width: 100%;
  height: auto;
  display: block;
  max-width: 462.22px;
  filter: grayscale(1);
}
.lavenham-introduction__link-figure img {
  width: 100%;
  height: auto;
  display: block;
  max-width: 462.22px;
  filter: grayscale(1);
}
.lavenham-introduction__link-figure img:hover {
  filter: unset;
}
@media (max-width: 768px) {
.lavenham-introduction__link-figure img {
  max-width: 100%;
filter: unset;
}

}

.lavenham-introduction__link-label {
font-family: 'Libre Caslon Text';
font-weight: 500;
font-size: 20px;
line-height: 2.4;
letter-spacing: 0.03em;
color: #000000;
margin: 0;
padding: 0;
/* padding-top: 5.11px; */
}
@media (max-width: 768px) {
.lavenham-introduction__link-label {
line-height: 1;
padding-top: 23.41px    ;
}

}
/* BRAND INTRODUCTION */
/* COLLABORATION */
.lavenham-collaboratio.ver1{
  padding-top: 86px;
}
@media (max-width: 768px) {
  .lavenham-collaboratio.ver1{
  padding-top: 104px;
}
}
.lavenham-collaboratio.ver2{
  padding-top: 196px;
}
@media (max-width: 768px) {
  .lavenham-collaboratio.ver2  {
  padding-top: 130px;
}
}
.lavenham-collaboratio.ver3{
  padding-top: 200px;
}
@media (max-width: 768px) {
  .lavenham-collaboratio.ver3  {
  padding-top: 179px;
}
}
.lavenham-collaboratio.ver4{
  padding-top: 195px;
}
@media (max-width: 768px) {
  .lavenham-collaboratio.ver4  {
  padding-top: 166px;
}
}


@media (max-width: 768px) {
.lavenham-collaboratio{
  .lavenham-collaboratio__eyebrow{
  margin-top: 0;
}
}    
}
@media (max-width: 768px) {
.lavenham-collaboratio:has(.c-vertical__text){
.lavenham-collaboratio__eyebrow{
  margin-top: 57px;
}
  
}    
}


.lavenham-collaboratio__header{
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  max-width: 674px;
  margin-inline: auto;
}
@media (max-width: 768px) {
.lavenham-collaboratio__header{
  max-width: 100%;
  margin-inline: auto;
}
}
.lavenham-collaboratio__main{
  margin-top: 50px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__main{
  margin-top: 45px;
}
}
.lavenham-collaboratio__eyebrow{
font-family: 'Libre Caslon Text';
font-weight: 500;
font-size: 16.9903px;
  line-height: 1;
letter-spacing: 0.04em;
color: #000000; 
}
@media (max-width: 768px) {
.lavenham-collaboratio__eyebrow{
font-weight: 400;
font-size: 18.6667px;
padding-top: 8px;
  order: 2;
}
}
.c-circle__number{
font-family: 'Libre Caslon Text';
font-style: normal;
font-weight: 500;
font-size: 15.78px;
line-height: 34px;
color: #000000;
width: 34px;
height: 34px;
border-radius: 50%;
border: 1px solid #000000;
text-align: center;
margin-top: 14px;
}
@media (max-width: 768px) {
.c-circle__number{
font-size: 17.3333px; 
width: 37px;
height: 37px;
line-height: 37px;
}
}

@media (max-width: 768px) {
.lavenham-collaboratio__number{
margin-top: 13px;
order: 3;
}
}
.lavenham-collaboratio__title{
padding-top    : 18px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__title{

 order: 4;
}
}
.lavenham-collaboratio__vertical{
  position: absolute;
  transform: rotate(90deg);
  order: 1;
}
.lavenham-collaboratio__vertical.men{
right: -52%;
  bottom: -267px;
}
.lavenham-collaboratio__vertical.women{
right: -57%;
  bottom: -305px;
}
@media (max-width: 1040px) {
.lavenham-collaboratio__vertical.men{
right: -34%;
}
.lavenham-collaboratio__vertical.women{
right: -38%;

}
}
.c-vertical__text{
  display: inline-block;
  position: relative;
font-family: 'Libre Caslon Text';
font-style: normal;
font-weight: 400;
font-size: 38px;
line-height: 1.26;
letter-spacing: 0.03em;
color: #000000;
}
.c-vertical__text::after{
content: "";
display: block;
position: absolute;
left: -6px;
width: 102%;
height: 1px;
background-color: #000000;
}
@media (max-width: 768px) {
  .lavenham-collaboratio__vertical{
  position: static;
    transform: unset;
}
.c-vertical__text{
font-size: 22px;
line-height: 1.51;


}
.c-vertical__text::after{
      left: -3px;
      bottom: 4px;
    width: 101%;
}
}



.lavenham-collaboratio__hero{
max-width: 674px;
margin-inline: auto;
}
.lavenham-collaboratio__hero img{
width: 100%;
}
@media (max-width: 1040px) {
.lavenham-collaboratio__hero{
max-width: 500px;
}
}
@media (max-width: 768px) {
.lavenham-collaboratio__hero{
max-width: 100%;
margin-inline: unset;
margin-top: 42px;
}
}
.lavenham-collaboratio__body{
display: flex;
justify-content: center;
gap: 55px;
margin-top: 100px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__body{
  flex-direction: column;
  margin-top: 66px  ;
}
}
.lavenham-collaboratio__detail{
margin: 0;
max-width: 292px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__detail{
max-width: 100%;
padding-inline: 41px 42px;
}
}
.lavenham-collaboratio__detail img{
width: 100%;
}
.lavenham-collaboratio__text{
max-width: 465px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__text{
max-width: 100%;
padding-inline: 24px;
}
}

.lavenham-collaboratio__lede{
font-family: 'Zen Old Mincho';
font-weight: 500;
font-size: 22px;
line-height: 1.45;
letter-spacing: 2px;
color: #000000;
text-align: left;
}
@media (max-width: 768px) {
.lavenham-collaboratio__lede{
font-size: 18px;
font-weight: 600;
line-height: 1.67;
}     
}
.lavenham-collaboratio__description{
font-family: 'Zen Old Mincho';
font-weight: 500;
font-size: 16px;
line-height: 1.8;
letter-spacing: 1px;
color: #000000;
margin-top: 24px;
text-align: left;
}
@media (max-width: 768px) {
.lavenham-collaboratio__description{   
  font-size: 14px;
line-height: 1.8;
margin-top: 24px;
}     
}
.lavenham-collaboratio__minspacer  {
  display: block;
  width: 78px;
  height: 1px;
  margin-top: 17px ;
  margin-left: 10px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__minspacer  {
margin-top: 51px;
background-color: #000;
}     
}

.lavenham-collaboratio__price{
  display: block;
    margin-top: 15px ;
}
  @media (max-width: 768px) {
.lavenham-collaboratio__price{
margin-top: 33px;
}     
}

.lavenham-collaboratio__price-name{
font-family: "Montserrat", sans-serif;
font-weight: 600;
font-size: 16px;
line-height: 0;
letter-spacing: 1px;
color: #333333;
}
.lavenham-collaboratio__price-value{
font-family: "Montserrat", sans-serif;
font-weight: 600;
font-size: 16px;
line-height: 0;
letter-spacing: 1px;
color: #000000;
padding-left: 20px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__price-value{
padding-left: 18px;
}     
} 
.lavenham-collaboratio__price-tax{
padding-left: 10px;
}
@media (max-width: 768px) {
.lavenham-collaboratio__price-tax{
padding-left: 8px;
}     
} 
.lavenham-collaboratio__btn{
  display: flex;
  justify-content: center;
  margin-top: 125px;
  padding-bottom: 73px;
  text-align: center;
  width: 100%;
}
.lavenham-collaboratio__btn-link{
  display: block;
font-family: 'Zen Kaku Gothic New';
font-style: normal;
font-weight: 500;
font-size: 14px;
line-height: 0;
letter-spacing: 1px;
color: #000000;
  text-decoration: none;
  /* padding-block: 20px 21px; */
  padding-block: 32px 33px;
  width: 100%;
  max-width: 386px;
  border: 1px solid #000000;
}
.lavenham-collaboratio__btn-link:hover{
  background-color: #000000;
color: #fff;
}

@media (max-width: 768px) {
  .lavenham-collaboratio__btn{
      margin-top: 101px;
  padding-bottom: 108px;
  }
.lavenham-collaboratio__btn-link{
max-width: 100%;
margin-inline: 26px;
}     
}

/* スクロール連動フェードインアニメーション（holidayページと同じ） */
.js-inview {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.js-inview.is-show {
  opacity: 1;
  transform: translateY(0);
}

.js-inview--late {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s ease, transform 0.8s ease;
  transition-delay: 0.3s; /* 遅延発火用 */
}

.js-inview--late.is-show {
  opacity: 1;
  transform: translateY(0);
} 

.lavenham-collaboratio__price:hover {
  opacity: 1!important;
}

/* 下線引き直しアニメーション */
.underline-anim {
  position: relative;
  display: inline-block;
}

/* 下線の基本スタイル（常に表示しておく） */
.underline-anim::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -11px;          /* テキストとの距離 */
  width: 100%;
  height: 2px;           /* 線の太さ */
  background: #000;      /* 線の色 */
  transform-origin: left center;
  transform: scaleX(1);  /* 通常時は線が全部見えている */
}

.underline-anim:hover::after {
  animation:
    underline-hide 0.18s ease forwards,
    underline-show 0.3s ease forwards 0.2s; /* 0.2s 後に引き直し */
}

@keyframes underline-hide {
  from { transform-origin: left center; transform: scaleX(1); }
  to   { transform-origin: right center; transform: scaleX(0); }
}

@keyframes underline-show {
  from { transform-origin: left center; transform: scaleX(0); }
  to   { transform-origin: left center; transform: scaleX(1); }
}


/* アロー */
#c-page_top_btn .line{
  background-color: #000;
}
#c-page_top_btn .line::before{
  background-color: #000;
}
#c-page_top_btn p{
  color: #000;
}
@media (max-width: 768px) {
.lavenham-collaboratio__lede_ls0{
  letter-spacing: -0.03em;
}
}
