@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Vollkorn&display=swap');
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}



/*=== 画像の表示エリア ================================= */
.slide {
  position   : relative;
  overflow   : hidden;
                    /* 画像のサイズに合わせて変更ください */
  width      : 640px;
  height     : 960px;
  margin     : auto; 
  background : #fff;
}
 
 /*=== 画像の設定 ======================================= */
.slide img {
  display    : block;
  position   : absolute;
  width      : inherit;
  height     : inherit;
  opacity    : 0;
  animation  : slideAnime 12s ease infinite;
}
 
 /*=== スライドのアニメーションを段差で開始する ========= */
.slide img:nth-of-type(1) { animation-delay: 0s }
.slide img:nth-of-type(2) { animation-delay: 6s }
 
 /*=== スライドのアニメーション ========================= */
@keyframes slideAnime{
   0% { opacity: 0 }
   8% { opacity: 1 }
  50% { opacity: 1 }
  58% { opacity: 0 }
 100% { opacity: 0 }
}

body {
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN",;
  line-height: 1;
  position: relative;
  min-width: 1150px;
}
a {
  color: inherit;
  text-decoration: none
}
.clearfix {
  display: inline-block;
  height: 1%
}
.clearfix::after {
  clear: both;
  content: '.';
  display: block;
  height: 0;
  visibility: hidden
}

#main h2,.title01-2{
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  font-size: 26px;
  line-height: 2;
  font-weight: 400;
}
#main .title01 {
  font-size: 34px;
  line-height: 2;
  font-weight: 400;
}
#main .title01:after {
    content: "";
    display: block;
    width: 2px;
    height: 40px;
    margin: 40px auto ;
    background: #808080;
	transform:skewX(-40deg);
}

#main .item-name,.price,.link,.item-tips,.staff{
	font-family: 'Vollkorn', serif;
    margin: -8px 0 0 0;
}
#main .item-tips{
	color: #fff600;
}
#main .item, .text{
	display: inline-block;
}
#main {
  width: 100%;
  overflow: hidden
}
#main .main-visual{
	text-align: center;
}
#main .v_line_fix {
  margin: 84px auto;
  text-align: center;
  width: 2px;
  height: 104px;
  background-color: #efefef;
}
#main .float-content .text-item.text {
    -webkit-transition: .3s ease;
    transition: .3s ease
  }
#main .float-content .text-item.text.show {
    opacity: 1
  }
#main .float-content .text-item.text:after {
    display: none
}

#main .text01 {
	margin-top: 110px;
}
#main .text01 .subtitle {
    font-size: 16px;
    margin: 48px 0 82px;
    line-height: 2.25;
    letter-spacing: .1em;
}
#main .text {
	margin: 60px 0 0;
}
#main .text02 {
    margin: 273px 0 0 16px;
}
#main .text04 {
 margin: 60px 75px 0 0px;
}
#main .text06 {
    margin: 60px 110px 0 110px;
}
#main .text07 {
 float: right;
 margin: 380px 75px 0 0px;
}
#main .subtitle {
	font-size: 16px;
    margin: 40px 0 0;
    line-height: 2.25;
    letter-spacing: -.04em;
}
@-webkit-keyframes yajirushi {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px)
  }
  100% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
}
@keyframes yajirushi {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px)
  }
  100% {
    -webkit-transform: translateY(5px);
    transform: translateY(5px)
  }
}
#main .float-content {
  max-width: 1150px;
  padding-top: 1px;
  text-align: center;

}

/*使用*/
#main .float-content {
    margin: 0 auto
  }

#main .float-content:after {
  content: '';
  width: 100%;
  height: 1px;
  clear: both;
  display: block
}

#main .float-content .item {
  position: relative;
  max-width: 1150px;
}
#main .float-content .item .img {
  position: relative;
  z-index: 2
}
#main .float-content .item .img img {
  vertical-align: bottom;
  height: auto;
}
#main .float-content .item .plus {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    bottom: 15px;
    right: 15px;
    z-index: 3;
    border: 1px solid #907651;
}
#main .float-content .item .plus:before, #main .float-content .item .plus:after {
    content: '';
    width: 13px;
    height: 2px;
    background: #907651;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    -webkit-transition: .3s ease;
    transition: .3s ease;
}
#main .float-content .item .plus:after {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg)
}
#main .float-content .item.open .plus {
  background: #907651
}
#main .float-content .item.open .plus:before, #main .float-content .item.open .plus:after {
  background: #fff
}
#main .float-content .item.open .plus:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg)
}
#main .float-content .item.open .plus:after {
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg)
}
#main .float-content .item .credit {
  position: absolute;
  background: #907651;
  color: #fff;
  top: 0;
  left: 0;
  z-index: 4;
  font-size: 16px;
  line-height: 1.84615;
  font-family: raleway, sans-serif;
  font-weight: 400;
  font-style: normal;
  display: none;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: 0.4s cubic-bezier(0.25, 0.25, 0.235, 1.65);
  transition: 0.4s cubic-bezier(0.25, 0.25, 0.235, 1.65);
  overflow: visible !important;
  width: auto !important;
  display: inline-block;
}


#main .float-content .item .credit.show {
  opacity: 1;
  -webkit-transform: none;
  transform: none
}
#main .float-content .item .credit .item-name {
  white-space: nowrap;
	font-size: 18px;
}
#main .float-content .item .credit .text {
  font-size: 18px;
  line-height: 1.41667;
  font-family: dnp-shuei-gothic-kin-std, sans-serif;
  font-weight: 500;
  font-style: normal;
  margin-top: 5px
}

 #main .float-content .item .credit .text {
    font-size: 18px;
  }

#main .float-content .item .credit .link {
  background: #fff;
  color: #907651;
  font-size: 15px;
  display: inline-block;
  margin-top: 3px;
  padding: 0 15px;
}

#main .float-content .item .credit .link {
    font-size: 15px
  }


#main .float-content .item .credit:after {
  content: '';
  width: 15px;
  height: 15px;
  position: absolute;
  box-sizing: border-box
}

#main .float-content .item .credit.arrow-bottom {
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transform: scale(0.7) translateY(20px);
  transform: scale(0.7) translateY(20px)
}
#main .float-content .item .credit.arrow-bottom:after {
  top: 100%;
  border-left: 7.5px solid #907651;
  border-top: 7.5px solid #907651;
  border-bottom: 7.5px solid transparent;
  border-right: 7.5px solid transparent
}
#main .float-content .item .credit.arrow-bottom.show {
  -webkit-transform: none;
  transform: none
}

#main .float-content .item .credit.arrow-top {
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transform: scale(0.7) translateY(20px);
  transform: scale(0.7) translateY(20px)
}
#main .float-content .item .credit.arrow-top:after {
	bottom: 100%;
    border-left: 7.5px solid #907651;
    border-bottom: 7.5px solid #907651;
    border-top: 7.5px solid transparent;
    border-right: 7.5px solid transparent;
}
#main .float-content .item .credit.arrow-top.show {
  -webkit-transform: none;
  transform: none
}

#main .float-content .item .credit.arrow-right {
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transform: scale(0.7) translateY(20px);
  transform: scale(0.7) translateY(20px)
}
#main .float-content .item .credit.arrow-right:after {
    left: 100%;
    border-left: 7.5px solid #907651;
    border-top: 7.5px solid #907651;
    border-bottom: 7.5px solid transparent;
    border-right: 7.5px solid transparent;
}
#main .float-content .item .credit.arrow-right.show {
  -webkit-transform: none;
  transform: none
}

#main .float-content .item .credit.arrow-left {
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transform: scale(0.7) translateY(20px);
  transform: scale(0.7) translateY(20px)
}
#main .float-content .item .credit.arrow-left:after {
    right: 100%;
    border-right: 7.5px solid #907651;
    border-top: 7.5px solid #907651;
    border-bottom: 7.5px solid transparent;
    border-left: 7.5px solid transparent;
}
#main .float-content .item .credit.arrow-left.show {
  -webkit-transform: none;
  transform: none
}


/*使用*/
#main .float-content .item .credit {
  padding: 2% 2%
}
#main .float-content .item.item1 {
    width: 600px;
    margin: 0 auto 120px;
 }

#main .float-content .item.item1 .credit1-1 {
    margin-left: 370px;
    margin-top: 106px;
}
#main .float-content .item.item1 .credit1-1:after {
  right: 70%
}
#main .float-content .item.item1 .credit1-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item1 .credit1-2 {
    margin-left: 90px;
    margin-top: 368px
  }
#main .float-content .item.item1 .credit1-2:after {
  right: 15px
}

#main .float-content .item.item1 .credit1-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}
#main .float-content .item.item1 .credit1-3 {
    margin-left: 325px;
    margin-top: 590px
  }
#main .float-content .item.item1 .credit1-3:after {
	top:10px;
}


#main .float-content .item.item2 {
    width: 706px;
    margin: 120px 0 0 0;
    float: left;
 }
#main .float-content .item.item2 .credit2-1 {
    margin-left: 314px;
    margin-top: 65px;
}
#main .float-content .item.item2 .credit2-1:after {
  right: 70%
}
#main .float-content .item.item2 .credit2-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item2 .credit2-2 {
    margin-left: 184px;
    margin-top: 323px
  }
#main .float-content .item.item2 .credit2-2:after {
  top: 10%;
}

#main .float-content .item.item3 {
    width: 600px;
    margin: 120px 0 0 0;
    float: right;
 }
#main .float-content .item.item3 .credit3-1 {
    margin-left: 306px;
    margin-top: 210px;
}
#main .float-content .item.item3 .credit3-1:after {

}
.item.item3 .credit .credit3-2{
	left: 2%;
	bottom: 2%;
	color: aliceblue;
	z-index: 3
}

#main .float-content .item.item4 {
    width: 600px;
	margin: 0 0 0 75px;
	float: left;
 }
#main .float-content .item.item4 .credit4-1 {
    margin-left: 380px;
    margin-top: 74px;
}
#main .float-content .item.item4 .credit4-1:after {
	left: 5%;
}
#main .float-content .item.item4 .credit4-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item4 .credit4-2 {
    margin-left: 55px;
    margin-top: 565px
  }
#main .float-content .item.item4 .credit4-2:after {
  right: 15px
}
#main .float-content .item.item5 {
    width: 700px;
    margin: 120px 75px 0 0;
    float: right;
 }
#main .float-content .item.item5 .credit5-1 {
    margin-left: 367px;
    margin-top: 170px;
}
#main .float-content .item.item5 .credit5-1:after {
   left: 20%;
}
#main .float-content .item.item5 .credit5-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item5 .credit5-2 {
    margin-left: 42px;
    margin-top: 243px

  }
#main .float-content .item.item5 .credit5-2:after {

}

#main .float-content .item.item6 {
    width: 700px;
    margin: 120px 0 0 0;
 }
#main .float-content .item.item6 .credit6-1 {
    margin-left: 438px;
    margin-top: 121px;
}
#main .float-content .item.item6 .credit6-1:after {
}


#main .float-content .item.item7 {
    width: 600px;
	margin: 0 50px 0 0;
	float: left;
 }
#main .float-content .item.item7 .credit7-1 {
    margin-left: 100px;
    margin-top: 200px;
}
#main .float-content .item.item7 .credit7-1:after {

}
#main .float-content .item.item7 .credit7-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item7 .credit7-2 {
    margin-left: 75px;
    margin-top: 465px

  }
#main .float-content .item.item7 .credit7-2:after {
	left: 35%;
}
#main .float-content .item.item7 .credit7-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}

#main .float-content .item.item7 .credit7-3 {
    margin-left: 400px;
    margin-top: 575px

  }
#main .float-content .item.item7 .credit7-3:after {
	left: 35%;
}

#main .float-content .item.item8 {
    width: 485px;
	margin: 480px 0 0 0;
	float: right;
 }
#main .float-content .item.item8 .credit8-1 {
    margin-left: -60px;
    margin-top: 460px;
}
#main .float-content .item.item8 .credit8-1:after {

}
#main .movie02{
	margin: 0 0 0 75px;
	float: left;
}

#main .float-content .item.item9 {
    width: 650px;
    margin: 110px 50px 0 0;
    float: right;
 }
#main .float-content .item.item9 .plus{
    margin: 0 25px 0 0;
}
#main .float-content .item.item9 .credit9-1 {
    margin-left: 509px;
    margin-top: 182px;
}
#main .float-content .item.item9 .credit9-1:after {

}
#main .float-content .item.item9 .credit9-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item9 .credit9-2 {
    margin-left: 122px;
    margin-top: 373px

  }
#main .float-content .item.item9 .credit9-2:after {
	left: 35%;
}
#main .float-content .item.item9 .credit9-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}

#main .float-content .item.item9 .credit9-3 {
    margin-left: 455px;
    margin-top: 595px

  }
#main .float-content .item.item9 .credit9-3:after {
	left: 35%;
}

#main .float-content .item.item10 {
    width: 900px;
    margin: 110px 0 0 0;
 }
#main .float-content .item.item10 .credit10-1 {
    margin-left: 610px;
    margin-top: 190px;
}
#main .float-content .item.item10 .credit10-1:after {
    left: 20%;
}
#main .float-content .item.item10 .credit10-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item10 .credit10-2 {
    margin-left: 320px;
    margin-top: 209px
  }
#main .float-content .item.item10 .credit10-2:after {
	left: 44%;
}
#main .float-content .item.item10 .credit10-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}

#main .float-content .item.item10 .credit10-3 {
    margin-left: 50px;
    margin-top: 310px
  }
#main .float-content .item.item10 .credit10-3:after {
	top: 70%;
}

#main .float-content .item.item10 .credit10-4.show {
  -webkit-transition-delay: .9s;
  transition-delay: .9s
}

#main .float-content .item.item10 .credit10-4 {
    margin-left: 70px;
    margin-top: 455px

  }
#main .float-content .item.item10 .credit10-4:after {
}


#main .float-content .item.item11 {
    width: 580px;
 }
#main .float-content .item.item11 .credit11-1 {
    margin-left: 30px;
    margin-top: 615px;
}
#main .float-content .item.item11 .credit11-1:after {
    top: 70%;
}
#main .float-content .item.item11 .credit11-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item11 .credit11-2 {
    margin-left: 376px;
    margin-top: 319px
  }
#main .float-content .item.item11 .credit11-2:after {
    left: 10%;
}
#main .float-content .item.item12 {
    width: 600px;
    margin: 120px 0 0 0;
	float: left;
 }
#main .float-content .item.item12 .credit12-1 {
    margin-left: 330px;
    margin-top: 145px;
}
#main .float-content .item.item12 .credit12-1:after {

}
#main .float-content .item.item12 .credit12-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item12 .credit12-2 {
    margin-left: 25px;
    margin-top: 335px
  }
#main .float-content .item.item12 .credit12-2:after {
    left: 80%;
}
#main .float-content .item.item12 .credit12-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}

#main .float-content .item.item12 .credit12-3 {
    margin-left: 400px;
    margin-top: 485px

  }
#main .float-content .item.item12 .credit12-3:after {

}

#main .float-content .item.item13 {
    width: 399px;
    margin: 520px 0 0 0;
	float: right;
 }
#main .float-content .item.item13 .credit13-1 {
    margin-left: -60px;
    margin-top: 80px;
}
#main .float-content .item.item13 .credit13-1:after {

}
#main .float-content .item.item13 .credit13-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item13 .credit13-2 {
    margin-left: 275px;
    margin-top: 368px
  }
#main .float-content .item.item13 .credit13-2:after {

}

#main .float-content .item.item14 {
    width: 640px;
	margin: 0 75px 0 0;
	float: right;
 }
#main .float-content .item.item14 .credit14-1 {
    margin-left: 396px;
    margin-top: 128px;
}
#main .float-content .item.item14 .credit14-1:after {
    left: 20%;
}
#main .float-content .item.item14 .credit14-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item14 .credit14-2 {
    margin-left: -30px;
    margin-top: 230px
  }
#main .float-content .item.item14 .credit14-2:after {
}
#main .float-content .item.item14 .credit14-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}

#main .float-content .item.item14 .credit14-3 {
    margin-left: 490px;
    margin-top: 695px

  }
#main .float-content .item.item14 .credit14-3:after {
    left: 10%;
}

#main .float-content .item.item14 .credit14-4.show {
  -webkit-transition-delay: .9s;
  transition-delay: .9s
}

#main .float-content .item.item14 .credit14-4 {
    margin-left: 75px;
    margin-top: 735px

  }
#main .float-content .item.item14 .credit14-4:after {

}
#main .float-content .item.item15 {
    width: 540px;
    margin: 120px 0 0 75px;
	float: left;
 }
#main .float-content .item.item15 .credit15-1 {
    margin-left: 325px;
    margin-top: 155px;
}
#main .float-content .item.item15 .credit15-1:after {
    left: 10%;
}
#main .float-content .item.item15 .credit15-2.show {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}

#main .float-content .item.item15 .credit15-2 {
    margin-left: 40px;
    margin-top: 225px
  }
#main .float-content .item.item15 .credit15-2:after {

}
#main .float-content .item.item15 .credit15-3.show {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}

#main .float-content .item.item15 .credit15-3 {
    margin-left: 315px;
    margin-top: 435px

  }
#main .float-content .item.item15 .credit15-3:after {
    top: 10%;
}

#main .float-content .item.item15 .credit15-4.show {
  -webkit-transition-delay: .9s;
  transition-delay: .9s
}

#main .float-content .item.item15 .credit15-4 {
    margin-left: 50px;
    margin-top: 680px

  }
#main .float-content .item.item15 .credit15-4:after {
    top: 80%;
    right: -10%;
}
#main .btn_area{
	margin-top: 160px;
}
/*Stylist小物用*/
#main .float-content .item.item4 .credit4-3 {
    background: transparent;
    margin-top: 750px;
}
#main .float-content .item.item5 .credit5-3 {
    background: transparent;
    margin-top: 420px;
}
#main .float-content .item.item6 .credit6-2 {
    background: transparent;
    margin-top: 650px;
}
#main .float-content .item.item7 .credit7-4 {
    background: transparent;
    margin-top: 750px;
}
#main .float-content .item.item11 .credit11-3 {
    background: transparent;
    margin-top: 810px;
}
#main .float-content .item.item12 .credit12-4{
    background: transparent;
    margin-top: 745px;
}
#main .float-content .item.item14 .credit14-5 {
    background: transparent;
    margin-top: 900px;
	color: #907651;
}



#main .btn_area ul{
    display: inline-flex;
   margin: 0 auto;
  margin-top: 55px;
}
#main .btn_area li{
    margin: 0 35px;
}
#main .profile_area {
    max-width: 710px;
    background-color: #f4f4f4;
    padding: 35px;
    margin: 0 auto;
    margin-top: 170px;
}
.profile-neme {
	font-size: 20px;
    margin-bottom: 30px;
}
#main .title08 .subtitle {
    margin-top: 38px;
}
#main .profile_area ul{
    display: inline-flex;
   margin: 0 auto;
  margin-top: 30px;
}
#main .profile_area li{
  margin: 0 20px;
}
.staff {
    font-size: 14px;
    left: 1;
    margin: 130px 0;
}