@charset "utf-8";
/* CSS Document */
#adminBox, .acms-admin-box {position: relative;z-index: 1;}
header{position: relative;z-index: 1;}
img{max-width: 100%;}

.tss_body{background-color: #F9F5FB;}
.hzs_body{position: relative;}
.hzs_body::before{
  content: '';
  position: fixed;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  height: 100%;
  background-image: url(
  ../img/bg_il.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100%;
  mix-blend-mode: overlay;
  pointer-events: none;
}
.hzs_body::after{
  position: fixed;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../img/bg_bubble.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100%;
  pointer-events: none;
}
section{position: relative;z-index: 1;}
.tss_footer{background-color: #DED3EC;}
.tss_footer a{color: #000000;}


/* 共通 */
.hzs_spbr{display: inline-block;}
.hzs_Txt{
  font-size: 0.875rem;
  color: #707070;
  text-align: center;
  line-height: calc(21/14);
}
.hzs_btnLink{
  max-width: 600px;
  width: 80%;
  margin-inline: auto;
}
.hzs_btnLink a{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 60px;
  padding: 16px 0;
  text-decoration: none;
  font-size: 0.875rem;
  text-align: center;
  font-weight: bold;
  border-radius: 9999px;
}


/* fadeIn */
.hzs_visible{
  transform: translateY(60px);
  visibility: hidden;
  opacity: 0;
  transition: transform 0.9s cubic-bezier(0, 0, 0.58, 1), opacity 0.9s ease-out;
  will-change: transform, opacity;
}
.hzs_visible.is_show{
  transform: translateY(0);
  visibility: visible;
  opacity: 1;
}
.hzs_fadeIn{
  visibility: hidden;
  opacity: 0;
  transition: opacity 1s 0.2s ease-out;
  will-change: opacity;
}
.hzs_fadeIn.is_show{visibility: visible;opacity: 1;}


/* hzs_topSection */
.hzs_topSection{padding: clamp(2.5rem, -4.942rem + 27.69vw, 7rem) 0 0;/*40-112 430-690*/}
h1.hzs_logo{
  max-width: 750px;
  width: 96%;
  margin-inline: auto;
  text-align: center;
}
/* メニュー */
.hzs_menuBlock{margin-top: 8px;padding: 0 8px;}
.hzs_menuList{
  display: flex;
  align-items: flex-end;
  gap: 2px;
  max-width: 618px;
  max-height: 90px;
  height: 100%;
  margin-inline: auto;
}
.hzs_menuList li{flex: 1;}
.hzs_menuList li a{display: block;}
.hzs_menuImg{text-align: center;}
.hzs_menuImg img{transition: transform .2s ease;}
.hzs_menuTxt{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  max-height: 50px;
  padding: clamp(8px,2vw,16px)clamp(2px,1vw,8px);
  text-align: center;
  line-height: 1;
  background-color: #FFFFFF;
  border-radius: 10px;
  border: 1px solid #E7D8EF;
  box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.16);
  z-index: 1;
  transition: box-shadow .2s ease;
}
/* スチャ。 画像 */
.hzs_bigIl{
  max-width: max(494px, 25.73vw);
  width: 77.33%;
  margin-inline: auto;
  margin-top: 48px;
}
/* だいたい動きません。～ 画像 */
.hzs_topTxtImg{
 max-width: 514px;
 width: 78.4%;
 margin-inline: auto;
 margin-top: 56px;
}
/* 今日も定時に出社して、～ テキスト */
.hzs_topTxt01{
  margin-top: clamp(2rem, 0.897rem + 4.1vw, 3rem);/*32-48 430-820*/
  font-size: clamp(0.875rem, 0.4615rem + 1.5385vw, 1.25rem);/*14-20 430-820*/
  font-weight: bold;
  line-height: calc(50/20);
  text-align: center;
}
/* ふわぁ～ 画像 */
.hzs_topMiniIl{
  max-width: clamp(9.125rem, 1.063rem + 30vw, 14rem);/*146-224 430-690*/
  margin-inline: auto;
  margin-top: clamp(3rem, 2.449rem + 2.05vw, 3.5rem);/*48-56 430-820*/
}
/* なんとなく、ここにおります。～ テキスト */
.hzs_topTxt02{
  margin-top: clamp(3rem, 1.897rem + 4.1vw, 4rem);/*48-64 430-820*/
  font-size: clamp(0.875rem, 0.4615rem + 1.5385vw, 1.25rem);/*14-20 430-820*/
  font-weight: bold;
  line-height: calc(50/20);
  text-align: center;
}


/* hzs_dataSection */
.profile{
  position: relative;
  margin-top: clamp(6rem, 5.311rem + 2.56vw, 6.625rem);/*96-106 430-820*/
  padding: clamp(12px,6vw,164px) 0 clamp(64px,8vw,127px);
}
.hzs_dataSectionBg{
  position: absolute;
  content: '';
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
  aspect-ratio: 1/1;
  background-color: rgb(228, 241, 246, 0.5);
  border-radius: 50%;
}
.hzs_dataSection{max-width: 1200px;margin-inline: auto;}
.hzs_dataSection >*{position: relative;z-index: 1;}
.hzs_dataSection .hzs_sectionTtl{
  max-width: 396px;
  width: 73.07%;
  margin-inline: auto;
  margin-bottom: clamp(-56px,calc(0px + (-56) * ((100vw - 820px) / 380)),0px);/*0 -56 820-1200*/
}
.hzs_dataTop{padding: 0 8px;}
.hzs_dataTopFlx{
  display: grid;
  grid-template-columns: repeat(3, auto);
  grid-template-rows: repeat(2, auto);
  justify-content: space-between;
  gap: 48px 0;
}
.hzs_dataTopFlx>*{max-width: min(356px, 30vw);margin-inline: auto;}
.hzs_dataDetails01,
.hzs_dataDetails02{transition-delay: 1s;}
.hzs_dataDetails03,
.hzs_dataDetails04{transition-delay: 1.1s;}
.hzs_dataBigIl{
  grid-column: 2/3;
  grid-row: 1/-1;
  align-content: center;
  max-width: 466px;
  width: min(466px, 42vw);
  margin-inline: auto;
}
/* 真ん中の紫背景の画像 */
.hzs_dataDetailsIl{
  max-width: 1142px;
  margin-inline: auto;
  margin-top: 10px;
  padding: 0 8px;
  text-align: center;
  transition-delay: 1.2s;
}
/* なんとかやってる気がする。～ 画像 */
.hzs_dataMinitxt{
  max-width: 530px;
  width: 74.13%;
  margin-inline: auto;
  margin-top: clamp(2rem, 0.346rem + 6.15vw, 3.5rem);/*32-56 430-820*/
}
/* スキ・ニガテ */
.hzs_dataLikeDisWrap{
  display: flex;
  gap: 6px clamp(8px,2vw,24px);
  max-width: 960px;
  margin-inline: auto;
  margin-top: clamp(1.5rem, -3.462rem + 18.46vw, 6rem);/*24-96 430-820*/
}
.hzs_dataLikeDisWrap >*{
  flex: 1;
  width: 100%;
  max-width: 470px;
  background-color: #FFFFFF;
  box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.16);
}
.hzs_dataLikeBlock{border-radius: 100px 0 0 100px;}
.hzs_dataDisBlock{border-radius: 0 100px 100px 0;}
.hzs_dataIlBlock{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(20px,2vw,36px);
  margin-inline: auto;
  padding: clamp(1.5rem, 0.673rem + 3.08vw, 2rem) 0 clamp(1.5rem, 0.26rem + 4.62vw, 2.25rem);/*24-32 430-690*//*24-36 430-690*/
}
.hzs_dataIlBlock > img{max-width: clamp(5.625rem, 0.457rem + 19.23vw, 8.75rem);/*90-140 430-690*/}
.hzs_dataLikeIl_block{width: 68.51%;}
.hzs_dataLikeIl{flex: 1 0 auto;max-width: clamp(5.875rem, 0.5rem + 20vw, 9.125rem);/*94-146 430-690*/}
.hzs_dataDisIl_block{width: 74.47%;}
.hzs_dataDisIl{flex: 1 0 auto;max-width: clamp(5.875rem, -0.12rem + 22.31vw, 9.5rem);/*94-152 430-690*/}


/* hzs_adaySection */
.hzs_adaySection{margin-top: 32px;}
.hzs_adaySection .hzs_sectionTtl{
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: 472px;
  width: 75.2%;
  margin-inline: auto;
}
.hzs_adaySectionTtl-adj{flex: 1 0 auto;width: 23.73%;}
.hzs_adayBlock{
  max-width: 1000px;
  margin-inline: auto;
  margin-top: clamp(1rem, -0.103rem + 4.1vw, 2rem);/*16-32 430-690*/
  padding: 0 24px;
}
.hzs_adayTxt{margin-top: 36px; text-align: center;}
.hzs_adayTxt p{
  color: #707070;
  font-size: clamp(0.75rem, 0.5433rem + 0.7692vw, 0.875rem);/*12-14 430-690*/
  line-height: calc(21/14);
}
/* hzs_btnSnsFlx ボタン */
.hzs_btnSnsFlx{
  display: flex;
  gap: 8px;
  max-width: 624px;
  margin-inline: auto;
  margin-top: clamp(24px,calc(32px + (-8) * ((100vw - 430px) / 260)),32px);/*32-24 430-690*/
}
.hzs_btnSnsItem{flex: 1;}
.hzs_btnSnsItem a{
  color: #9D7EC2;
  border: 2px solid #A68FC1;
  transition: box-shadow .2s ease, opacity .2s ease;
}


/* hzs_movieSection */
.hzs_movieSection{margin-top: 88px;}
.hzs_movieSection .hzs_sectionTtl{
  max-width: 416px;
  width: 65.6%;
  margin-inline: auto;
}
.hzs_movieTxtBlock{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin-top: clamp(3rem, 2.449rem + 2.05vw, 3.5rem);/*48-56 430-820*/
}


/* hzs_goodsSection */
.hzs_goodsSection{margin-top: clamp(6rem, 3.244rem + 10.26vw, 8.5rem);/*96-136 430-820*/}
.hzs_goodsSection .hzs_sectionTtl{
  max-width: 640px;
  width: 95%;
  margin-inline: auto;
}
.hzs_goodsTxtBlock{margin-top: clamp(1.5rem, 0.949rem + 2.05vw, 2rem);/*24-32 430-820*/}
/* SUZURI公式ショップへ ボタン */
.hzs_btnShop{margin-top: 16px;}
.hzs_btnShop a{
  color: #FFFFFF;
  background-color: #A68FC1;
  box-shadow: 0px 2px 0px 0px rgba(0, 3, 6, 0.16);
  transition: opacity .2s ease;
}


/* hzs_newsSection */
.hzs_newsSection{margin-top: clamp(3.5rem, -0.91rem + 16.41vw, 7.5rem);/*56-120 430-820*/}
.hzs_newsSection .hzs_sectionTtl{
  max-width: 370px;
  width: 60.8%;
  margin-inline: auto;
}
.hzs_newsBlock{
  max-width: 1234px;
  margin-inline: auto;
  margin-top: clamp(1.5rem, 0.673rem + 3.08vw, 2rem);/*24-32 430-690*/
  padding: 0 22px;
}
.hzs_newsList{display: flex;gap: 20px;}
.hzs_newsList li{max-width: 398px;}
.hzs_newsListImg{
  aspect-ratio: 398/224;
  border-radius: 29px;
  overflow: hidden;
  border: 1px solid #84CDD5;
  background-color: #FFFFFF;
}
.hzs_newsListDetails{margin-top: 16px;}
.hzs_newsListTxt{line-height: calc(22/14);}
.hzs_newsListDate{
  display: block;
  margin-top: 8px;
  font-weight: bold;
}
.hzs_newsItemBig .hzs_newsListTxt{font-size: 0.875rem;font-weight: bold;}
.hzs_newsItemBig .hzs_newsListDate{font-size: clamp(0.75rem, 0.5433rem + 0.7692vw, 0.875rem);/*12-14 430-690*/}
.hzs_newsItemSmall .hzs_newsListTxt{font-size: 0.875rem;font-weight: bold;}
.hzs_newsItemSmall .hzs_newsListDate{font-size: clamp(0.625rem, 0.2115rem + 1.5385vw, 0.875rem);/*10-14 430-690*/}
.hzs_newsViewMore{
  max-width: 194px;
  margin-inline: auto;
  margin-top: clamp(40px,calc(56px + (-16) * ((100vw - 430px) / 260)),56px);/*56-40 430-690*/
}
.hzs_newsViewMore img{transition: transform .2s ease;}


/* 何度折れても、静かに再生する。画像 */
.hzs_Minitxt{margin-top: clamp(6.5rem, 5.122rem + 5.13vw, 7.75rem);/*104-124 430-820*/text-align: center;}


/* 文字スライダー */
.hzs_splide img{height: clamp(0.875rem, -1.192rem + 7.69vw, 2.125rem);/*14-34 430-690*/}
/* 文字スライダー 下部 */
.hzs_splideBtm{margin-top: clamp(8.25rem, 6.183rem + 7.69vw, 9.5rem);/*132-152 430-690*/position: relative;}
.hzs_splideBtm::after{
  position: absolute;
  content: '';
  bottom: -18px;
  left: 50%;
  transform: translateX(-50%);
  width: clamp(5.875rem, 2.154rem + 13.85vw, 8.125rem);/*94-130 430-690*/
  height: auto;
  aspect-ratio: 130/110;
  background-image: url(../img/il_06.webp);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: contain;
  z-index: 1;
}



@media screen and (min-width:801px){
  .hzs_menuList li a:hover .hzs_menuTxt{box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.16);}
  .hzs_menuList li a:hover .hzs_menuImg img{transform: scale(1.1);}
  .hzs_btnSnsItem a:hover{box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.16);opacity: 0.7;}
  .hzs_btnShop a:hover{opacity: 0.7;}
  .hzs_newsViewMore:hover img{transform: scale(1.05);}
}



@media screen and (max-width:800px){
  .tss_body{padding-bottom: 20vw;}
  
  /* hzs_dataSection */
  .hzs_dataDetails01,
  .hzs_dataDetails02{transition-delay: 0s;}
  .hzs_dataDetails03,
  .hzs_dataDetails04{transition-delay: 1.1s;}
  .hzs_dataBigIl{transition-delay: 1s;}

  /* スキ・ニガテ */
  .hzs_dataLikeDisWrap{
    flex-direction: column;
    align-items: center;
    padding: 0 22px;
  }
  .hzs_dataLikeBlock,
  .hzs_dataDisBlock{border-radius: 9999px;}

  /* hzs_adaySection */
  .hzs_adayBlock{flex-direction: column;}

  /* hzs_newsSection */
  .hzs_newsList{flex-wrap: wrap;}
  .hzs_newsList li{max-width: unset;}
  .hzs_newsItemBig{width: 100%;}
  .hzs_newsItemSmall{width: calc((100% - 20px)/2);}
  .hzs_newsItemSmall .hzs_newsListTxt{font-weight: normal;}

  /* 文字スライダー 下部 */
  .hzs_splideBtm::after{bottom: 20px;}
  .hzs_splideBtm .splide__track{bottom: 34px;}
}



@media screen and (max-width:690px){
  .hzs_body::before{content: none;}

  /* hzs_dataSection */
  .hzs_dataTopFlx{
    grid-template-columns: repeat(2, auto);
    grid-template-rows: repeat(3, auto);
    gap: 0;
  }
  .hzs_dataTopFlx>* {max-width: min(368px, 53.33vw);}
  .hzs_dataBigIl{grid-column: 1/-1;grid-row: 2/3;}
  .hzs_dataDetails01,
  .hzs_dataDetails03{margin-top: 16px;}

  /* hzs_btnSnsFlx ボタン */
  .hzs_btnSnsFlx{flex-direction: column;}
}