@charset "utf-8";

/* ==================================
story.css
================================== */
.common .main {
  float: none;
  width: 1000px;
  margin: 0 auto;
  font-family: 'NotoSansJP', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
#cpbBrandname{
  font-size: 0;
  line-height: 0;
  text-align: center;
  margin-bottom: 30px;
}
#cpbBrandname a {
  display: block;
}
#contents a img {
  opacity:1;
  transition-property: all;
  transition: 0.2s linear;
}
#contents a:hover img{
  opacity:.8;
}

/* btnBackIndex */
#contents .btnBackIndex {
  text-align: center;
  margin-bottom: 130px;
}
#contents .btnBackIndex a {
  width: 1000px;
  height: 82px;
  line-height: 82px;
  display: block;
  background-color: #081f2c;
}
#contents .btnBackIndex a:hover {
  opacity: .8;
}
#contents .btnBackIndex span {
  font-size: 20px;
  color: #fff;  
}
#contents .btnBackIndex span::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border-right:1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: rotate(-45deg);
  margin-left: 30px;
}

/* movieArea */
#cpb #movieArea{
  margin: 35px 0 80px;
}
#cpb #movieArea iframe {
  width: 100%;
  height: 400px;
}

/* h */
#cpb h2,
#cpb h3 {
  font-weight: normal;
}

/* dedication */
#cpb #dedication {
  margin-bottom: 90px;
}
#cpb #dedication .img {
  margin-bottom: 90px;
}
#cpb #dedication .text {}
#cpb #dedication .textInner {
  text-align: center;
}
#cpb #dedication h2 {
  font-size: 24px;
  margin-bottom: 15px;
}

/* brilliance */
#cpb #brilliance {
  text-align: center;
  margin-bottom: 90px;
}
#cpb #brilliance h2 {
  font-size: 24px;
}
#cpb #brilliance .img {
  margin-bottom: 40px;
}
#cpb #brilliance h3 {
  font-weight: normal;
  margin-bottom: 25px;
}
#cpb #brilliance h3 span {
  font-size: 24px;
  display: block;
}
#cpb #brilliance .img iframe {
  width: 818px;
  height: 460px;
}
#cpb #brilliance p {
  line-height: 1.7;
}
#cpb #brilliance p.note {
  margin-top: 25px;
  font-size: 12px;
}
#cpb .btn {
  margin-top: 25px;
  display: inline-block;
  width: 180px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #000;
}
#cpb #brilliance .btn a {
  display: block;
}
#cpb #brilliance .slick-slider .slick-prev,
#cpb #brilliance .slick-slider .slick-next {
  top:480px;
  width: 60px;
  background-position: center;
}
#cpb #brilliance .slick-slider .slick-prev {
  background-image: url(/ec/shop/hankyu-beauty/images/cpb/story/btn_slide_left.png);
  left: 280px;
  z-index: 10;

}
#cpb #brilliance .slick-slider .slick-next {
  background-image: url(/ec/shop/hankyu-beauty/images/cpb/story/btn_slide_right.png);
  right: 280px;
}

/* heritage */
#cpb #heritage {
  margin-bottom: 90px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: center;
}
#cpb #heritage h2 {
  font-size: 24px;
  margin-bottom: 15px;
}
#cpb #heritage .img {
  width: 560px;
}
#cpb #heritage .text {
  width: 440px;
}
#cpb #heritage .text .linkVideo {
  margin-top: 30px;
}
#cpb #heritage .text .linkVideo a {
  background: url(/ec/shop/hankyu-beauty/images/cpb/story/icon_arrow.png) no-repeat left center;
  padding-left: 32px;
  display: inline-block;
}

/* productList */
#cpb #productList {
  text-align: center;
  margin-bottom: 130px;
}
#cpb #productList h2 {
  font-size: 36px;
  margin-bottom: 40px;
}
#cpb #productList ul {
  width: 900px;
  margin: 0 auto;
  display: flex;
  justify-content: flex-start;
}
#cpb #productList li {
  width: 280px;
  margin-right: 30px;
}
#cpb #productList li:last-child {
  margin: 0;
}
#cpb #productList li a {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: center;
  height: 100%;
}
#cpb #productList .itemImg {
  margin-bottom: 30px;
}
#cpb #productList .brand {
  margin-bottom: 5px;
}
#cpb #productList .itemName {
  margin-bottom: 10px;
}
#cpb #productList .price {
  margin-bottom: 20px;
}
#cpb #productList .btn {
  margin: auto auto 0;
}

