@charset "UTF-8";
/*================================================

【楽天市場】ゆかた特集2025｜ヘアスタイル

=================================================*/


/* hairstyle-container */
.hairstyle-container{
  background-image: url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/udr/hairstyle/hairstyle-container_bg.png);
  background-repeat: repeat-y;
  background-position: center 380px;
}

/*
 d-grid-anchor
======================================== */
.d-grid-anchor-hairstyle{
  width: 390px;
  margin: 0 auto;
}
.d-grid-anchor-checklist{
  width: 480px;
  margin: 0 auto;
}
.d-grid-anchor-link{
  position: relative;
  display: block;
  text-decoration: none!important;
  color: #b86c0a!important;
}
.d-grid-anchor-link:hover{opacity:.8;}
.d-grid-anchor-text{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-family: var(--font_mincho);
  text-align: center;
}

/*
 udr-heading
======================================== */
.udr-heading-hairstyle {
  background-image: url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/cmn/heading-guide_bg.png);
  background-repeat: no-repeat;
  min-height:133px!important;
}
.udr-heading-hairstyle-line2 {
  background-image: url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/cmn/heading-guide-line2_bg.png);
  background-repeat: no-repeat;
  min-height:204px!important;
  padding-top: 72px;
}

/*
 hsH3Ttl
======================================== */
.hsH3Ttl{
  text-align: center;
}
.hsH3Ttl > span{
  font-size:28px;
  font-weight:bold;
  padding-bottom:24px;
  color:#312e27;
  font-family: var(--font_mincho);
  background: url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/cmn/heading-sub-guide_icon.png) center bottom no-repeat;
  letter-spacing: -.025em;
  display: block;
}

/*
 hsH4Ttl
======================================== */
.hsH4Ttl{
  font-size: 24px;
  color:#312e27;
  font-family: var(--font_mincho);
  text-align: center;
  padding-bottom: 16px;
  background: url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/udr/heading-sub-modal-shoplist_line.png) center bottom no-repeat;
}

/*
.hsArrange
-----------------------------------------*/
/* .hsArrangeTopClm */
.hsArrangeTopClm{
  margin-bottom: 45px;
}
.hsArrangeTopClm .img,
.hsArrangeTopClm .txt{
  display: inline-block;
  vertical-align: middle;
}
.hsArrangeTopClm .img{
  width: 284px;
  margin-left: 59px;
  margin-right: 40px;
  filter:drop-shadow(0 0 4px rgba(0,0,0,.4));
}
.hsArrangeTopClm .txt{
  font-size: 16px;
  line-height: 1.5;
  color: #333333;
  width: 515px;
}

/* .hsArrangeStep */
.hsArrange{display: block;}
.hsArrangeStep>ul{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 25px 18px;
}
.hsArrangeStep>ul>li .ttl{
  text-align: center;
  font-size: 21.78px;
  margin-bottom: 7px;
  color: #ffca8a;
}
.hsArrangeStep>ul>li .ttl>span{
  color: #000000;
  padding: 0 0.2em;
  font-weight: bold;
}
.hsArrangeStep>ul>li .desc{
  font-size: 16px;
  color: #333;
  margin-top: 10px;
  line-height: 1.5;
}
.hsArrangeStep>ul>li:nth-child(n+1) .desc p:first-child {
  font-weight: bold;
  margin-bottom: 3px;
}

/* stylistComment */
.stylistComment ul li{
  display:inline-block;
  vertical-align:top;
}
.stylistComment ul .stylistComment__txt{
  width:590px;
  margin-left: 120px;
  position: relative;
}
.stylistComment__img{
  width:155px;
  text-align: center;
  padding-top: 6px;
}
.stylistComment__fukidashi{
  width:100%;
  min-height:176px;
  padding:0 33px;
  position:relative;
  border:solid 2px #ffc272;
  -webkit-border-radius:20px;
  -moz-border-radius:20px;
  border-radius:20px;
  background-color:#ffffff;
  font-size: 16px;
  line-height: 1.5;
  display: table;
}
.stylistComment__fukidashi--description{
  display: table-cell;
  vertical-align: middle;
  padding: 19px 0;
}
.stylistComment ul .stylistComment__txt:after{
  content:'';
  width:20px;
  height:32px;
  display:block;
  position:absolute;
  top:31px;
  right:-18px;
  background:url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/udr/hairstyle/point_fukidashi_arrow.png) left top no-repeat;
}

/* movie */
.movie {
  width: 674px;
  margin: 0 auto;
  border: 2px solid #9a9a9a;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.movieWrap{
  position: relative;
  display: block;
  max-width: 100%;
  padding-top: 56.25%;
}
.movieWrap iframe{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border:0;
  width: 100%;
  height: 100%;
}

/*
 d-grid-kitsuke
-----------------------------------------*/
.d-grid-kitsuke-link{
  display: block;
  height: 292px;
  background-color: #fff;
  border-radius: 18px;
  font-family: var(--font_mincho);
  position: relative;
}
.d-grid-kitsuke-link:hover{
  opacity:.8;
  text-decoration: none!important;
}
.d-grid-kitsuke-arrow{
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  right: 10px;
  bottom: 10px;
}
.d-grid-kitsuke-item{
  padding: 16px 19px 0 19px;
  flex-wrap: wrap;
}
.d-grid-kitsuke-imageBox{
  text-align: center;
  flex:0 0 100%;
}
.d-grid-kitsuke-figure{padding-top: 95px;}
.d-grid-kitsuke-difinitionTerm{
  font-size: 24px;
  padding-bottom: 10px;
  margin-bottom: 16px;
  text-align: center;
}
.d-grid-acce .d-grid-kitsuke-difinitionTerm {
  color: #b86c0a!important;
  background: url(https://r.r10s.jp/evt/event/fashion/yukata/2025/_pc/img/udr/hairstyle/acce_dt_bg.png) no-repeat left bottom;
}
.d-grid-kitsuke-difinitionDescription{
  font-size: 14px;
  color: #333 !important;
}

/*
 d-grid-shop-info
-----------------------------------------*/
.d-grid-shop-info {
  width: 880px;
  margin: 0 auto;
}
.shop-info-image {
  flex: 1 1 240px;
}
.shop-info-text {
  font-size: 16px;
  color: #333333;
  line-height: 1.5;
}