@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow&family=Lora&display=swap');
/* 画面外にいる状態 */
.effect {
	opacity : 0;
  transform: scale(0.5);
	transition : all 500ms 800ms;
}

/* 画面内に入った状態 */
.effect_on {
  opacity: 1.0;
	transform: scale(1);
}

#header-wrapper.nav {
  top: 0!important;
}
#contents-wrapper {
	width: 100%!important;
  min-width: 1400px;
  margin-top: 0px;
  padding-top: 52px;
  padding-bottom: 0px;
  line-height: 1;
  background: url("bg.jpg") #fff;
  color: #000;
  overflow:hidden;
}
#special-header-wrapper {
  display: none;
}
#footer-wrapper {
  position: relative;
  z-index: 4;
}
#special-column {
  width: 100%;
  float: none;
  margin: 0 auto;
  overflow:hidden;
}
#special-column a {
  color: #000;
}
#special-column img {
  width: 100%;
  height: auto;
  vertical-align: top;
}

.en-header {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  width: 100%;
  height: calc(100vh - 52px);
  background: url("paint_1.png") no-repeat center -178px;
  background-size: 100% auto;
  position: relative;
}
.en-header-in {
  width: 400px;
  padding-top: 213px;
  margin-right: 110px;
}
.en-header-ttl {
  padding-bottom: 60px;
}
.en-header-num {
  font-family: 'Lora', serif;
  font-size: 12px;
  line-height: 1.25;
  text-align: center;
  padding-bottom: 94px;
}
.en-header-num span {
  display: block;
  font-size: 10px;
  text-align: center;
}
.en-header-logo {
  width: 120px;
  margin: 0 auto;
}
.en-header-img {
  width: 800px;
}

#special-column section {
  position: relative;
  width: 100%;
}
.sec-img-box {
  width: 100%;
  position: absolute;
  left: 50%;
  z-index: 5;
}
.sec-icon {
  position: absolute;
  z-index: 1;
}
.section-stylist {
  padding-top: 46px;
  background: url("pc_icon_hair.svg") no-repeat center top;
  position: absolute;
  z-index: 5;
}
.section-stylist__name {
  padding-bottom: 40px;
  font-family: 'Barlow', sans-serif;
  font-size: 24px;
  line-height: 1;
  text-align: center;
  
}
.section-stylist__btn {
  box-sizing: border-box;
  display: block;
  width: 160px;
  height: 40px;
  padding-top: 13px;
  border: 1px solid #000;
  margin: 0 auto;
  font-family: 'Barlow', sans-serif;
  font-size: 13px;
  line-height: 1;
  text-align: center;
  text-decoration: none!important;
  position: relative;
}
.section-stylist__btn::after {
  width: 4px;
  height: 4px;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 9px;
  bottom: 0;
  margin: auto;
  content:"";
}

.sec01 {
  height: 2660px;
}
.sec01 .section-stylist {
  top: 775px;
  left: 50%;
  margin-left: -430px;
}
.sec-img-1-1 {
  width: 680px;
  top: 106px;
  margin-left: -650px;
}
.sec-img-1-2 {
  width: 500px;
  top: 403px;
  margin-left: 150px;
}
.sec-img-1-3 {
  box-sizing: border-box;
  width: 1068px;
  height: 800px;
  padding: 100px 134px 0;
  background-image: url("01-4.jpg");
  background-size: cover;
  top: 1452px;
  right: 0;
  left: 0;
  margin: auto;
}
.sec-icon-1 {
  width: 663px;
  transform-origin: top left;
  transform: rotate(50deg);
  top: 291px;
  left: 50%;
  margin-left: 48px;
}
.sec-icon-2 {
  width: 1168px;
  transform-origin: bottom left;
  transform: rotate(249deg);
  bottom: -409px;
  left: 50%;
  margin-left: -368px;
}

.sec02 {
  height: 3414px;
}
.sec02 .section-stylist {
  bottom: 625px;
  left: 50%;
  margin-left: 286px;
}
.sec-img-2-1 {
  width: 675px;
  top: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.sec-img-2-2 {
  width: 667px;
  top: 1201px;
  right: 50%;
  left: auto;
  margin-right: 187px; 
}
.sec-img-2-3 {
  width: 800px;
  top: 1414px;
  margin-left: -147px;
}
.sec-img-2-4 {
  width: 600px;
  top: 2314px;
  margin-left: -600px;
}
.sec-icon-3 {
  width: 1168px;
  transform-origin: bottom left;
  transform: rotate(90deg);
  bottom: 3371px;
  left: 50%;
  margin-left: -171px;
}
.sec-icon-4 {
  width: 706px;
  transform-origin: bottom left;
  transform: rotate(-105deg);
  bottom: 241px;
  left: 50%;
  margin-left: -261px;
}
.sec-icon-5 {
  width: 663px;
  transform-origin: bottom right;
  transform: rotate(106deg);
  bottom: 235px;
  right: 50%;
  margin-right: -458px;
}

.sec03 {
  height: 4517px;
}
.sec03 .section-stylist {
  top: 1242px;
  left: 50%;
  margin-left: -483px;
}
.sec-img-3-1 video {
  width: 100%;
  height: auto;
}
.sec-img-3-2 {
  width: 540px;
  top: 300px;
  margin-left: -638px;
}
.sec-img-3-3 {
  width: 675px;
  top: 656px;
  margin-left: -38px;
}
.sec-img-3-4 {
  width: 450px;
  top: 1880px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.sec-img-3-5 {
  width: 800px;
  top: 2417px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.sec-img-3-6 {
  width: 675px;
  top: 3318px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.sec-icon-6 {
  width: 1003px;
  transform-origin:top left;
  transform: rotate(-21deg);
  top: 1016px;
  left: 50%;
  margin-left: -255px;
}
.sec-icon-7 {
  width: 1239px;
  transform-origin: top right;
  transform: rotate(-92deg);
  top: 2901px;
  right: 50%;
  margin-right: -447px;
}
.sec-icon-8 {
  width: 1239px;
  transform-origin: bottom left;
  transform: rotate(-96deg);
  bottom: -261px;
  left: 50%;
  margin-left: -557px;
}

/*footer*/
.en-footer {
  width: 400px;
  margin: 0 auto;
}
.en-footer-ttl {
  width: 260px;
  margin: 0 auto 48px;
}
.en-footer-num {
  font-family: 'Lora', serif;
  font-size: 12px;
  line-height: 1.25;
  text-align: center;
  padding-bottom: 40px;
}
.en-footer-num span {
  display: block;
  font-size: 10px;
  text-align: center;
}
.en-footer-logo {
  width: 120px;
  margin: 0 auto 68px;
}


.en-footer .staff {
  padding-bottom: 200px;
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  line-height: 2;
}
.en-footer-staff-ttl {
  text-align: center;
}
.en-footer ul {
  width: 100%;
  padding-bottom: 38px;
}
.en-footer li {
  text-align: center;
}