@charset "utf-8";
body{
  background-color: #000;
  width: 1280px;
  margin:0 auto;


}
.wrapper{
  width: 1280px;

}

p{
  color: #fff;
}

.copy{
  
    color: #fff;
    text-align: center;
    margin-top: 50px;
    font-size: 1.5em;
    font-weight: bold;
  
}

.section{
  margin: 100px;
}
/* header */
header{
  /* width: 1000px; */
  position: relative;
 height: 600px;
 background-image: url(../dryer_all/particle_upsidedown.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;

}

h1{
  opacity: 0;
  /* width: 150px;
  height: 50px;
  float:left;
  display: block;
  padding-top: 100px;
  padding-left: 100px;
  font-size: 4.5em; */
  /* color: #fff;
  font-size: 1em; */
/* background: url(../dryer_all/title.svg); */

}
.title_container{
  width:700px;
  height: 600px;
  /* border: 1px solid #fff; */
  
}
.title{
/* margin-left: -500px; */
padding-top: 15px;
margin-left: 30px;
}

.copy1{
  float:left;
margin-top:30px;
margin-left: 100px;
 
}
.copy2{
  float:left;
  margin-left: 50px;
  margin-top: 40px;
}
.copy3{
  float:left;
margin-top: 25px;
margin-left: 380px;
}
.optimize_img{
  margin-left: 650px; 
 
  float: left;
margin-top: -550px;

}

.cartbl{
 

  margin-left: 1000px;

}
.cart{
 
position: fixed;
margin-left: -200px;
bottom: 100px;


}


.backbtn{
  
  position: fixed;
  margin-left: -130px;
  bottom: 20px;

}


/* intro */

.intro{
margin-bottom: 160px;
}
h2{
  color: #fff;
  text-align: center;
  margin-top: 50px;
clear:both;
}

.brain{
  margin-left: 380px;
}

.video{
  margin-left: 350px;
  /* border: 1px solid #000; */
}

.intro_text1{
  color: #fff;
  font-size: 1.5em;
  font-weight: bold;
  background-color:rgb(255, 0, 179) ;
  height: 60px;
  display: block;
  width: 300px;
  padding-top: 20px;
  padding-left: 100px;
  margin-top: 50px;
  margin-left: 80px;
}
.intro_text2{
  color: #fff;
  font-size: 1.5em;
  font-weight: bold;
  margin-top: 80px;
  background-color:rgb(21, 76, 243) ;
  height: 60px;
  display: block;
  width: 600px;
  padding-top: 20px;
  padding-left: 100px;
  margin-top: 50px;
  margin-left: 500px;
}




/* AI */
.brain_mini{
  margin-left: 530px;
}

h3{
  color: #fff;
  font-size: 1.5em;
  font-weight: bold;
  margin-left:80px;
  margin-bottom: 80px;
  margin-top: 80px;
  clear: both;
}


/* AIが叶える3つの革新 */
.wethair{
  margin-left: 180px;
}
.wet_text{
  float:right;
  /* margin-right: 100px; */
  width: 600px;
  height: 260px;
  /* border: 1px solid white; */
}

.wet_copy{
font-size: 1.5em;
font-weight: bold;
/* margin-right: 50px; */
background-image: url(../dryer_all/AIicon40.png);
background-repeat: no-repeat;
background-position: left;
padding: 50px;
}

.wetp{
  margin-top: 10px;
  font-size: 1.25em;
}




.hairtest_box{
  width: 700px;
  height: 270px;
  /* border: 1px solid white; */

  
}
.hairtest_copy{
  font-size: 1.5em;
  font-weight: bold;
  /* margin-right: 50px; */
  background-image: url(../dryer_all/AIicon40.png);
  background-repeat: no-repeat;
  background-position: left;
  padding: 50px;
  margin-left: 150px;
}

.hairtest_text{
  margin-top: 10px;
  font-size: 1.25em;
  margin-left: 150px;
}

.hairtest{
  margin-left:700px ;
  float:right;
  margin-top: -300px;
  margin-right: 150px;
}

.hairset{
  margin-left: 200px;
}

.hairset_box{
  width: 700px;
  height: 400px;
  float:right;
  /* border:1px solid #fff; */
}

.hairset_copy{
  font-size: 1.5em;
  font-weight: bold;
  /* margin-right: 50px; */
  background-image: url(../dryer_all/AIicon40.png);
  background-repeat: no-repeat;
  background-position: left;
  padding: 50px;
  margin-left: 50px;
}

.hairset_text{
  /* float:right; */
  margin-top: 10px;
  font-size: 1.25em;
  margin-left: 60px;
}

.app{
  margin-left: 60px;
}


/* +3 */
.baby{
margin-left: 180px;
}

.sound_box{
  width: 700px;
  height: 500px;
  float:right;


}
.sound_copy{
  font-size: 1.5em;
  font-weight: bold;
  /* margin-right: 50px; */
  /* background-image: url(../dryer_all/AIicon40.png);
  background-repeat: no-repeat;
  background-position: left; */

  margin-left: 50px;
}

.sound_graph{
  margin-left: 120px;

}

/* .sound50cut{


} */

.sound_text{
  margin-top: 10px;
  font-size: 1.25em;
  margin-left: 60px;
}


.dry_box{
  width: 700px;
  height: 270px;
  /* border: 1px solid red; */
 
}


.dry_copy{
  font-size: 1.5em;
  font-weight: bold;
  /* margin-right: 50px; */
  /* background-image: url(../dryer_all/AIicon40.png);
  background-repeat: no-repeat;
  background-position: left; */
  padding: 50px;
margin-left: 100px;



  /* background-image: url(../dryer_all/AIicon40.png);
  background-repeat: no-repeat;
  background-position: left; */
  /* padding: 50px; */
}
.dry_text{
  margin-top: 10px;
  font-size: 1.25em;
  margin-left: 150px;
}
.dry{
  margin-left:700px ;
  float:right;
  margin-top: -300px;
  margin-right: 150px;



 }


.codeless{
  margin-left:180px;
}

.codeless_box{
  width: 700px;
  height: 500px;
  float:right;
}

.codeless_copy{
  font-size: 1.5em;
  font-weight: bold;
  margin-left: 60px;
}

.codeless_text{
  margin-top: 10px;
  font-size: 1.25em;
  margin-left: 60px;
}


/* award */
.award_container1{
  display: flex;
  justify-content: space-around;
  margin-top: 50px;
}
.award_container2{
  display: flex;
  justify-content: space-evenly;
  margin-top: 130px;
}


.award_box{ 
text-align: center;
} 


.coment{
  margin-left: 200px;
  margin-top: 150px;
  
}

.coment_title{
  color: #000;
  text-align: center;
  /* margin-top: 80px; */
  font-size: 1.5em;
  font-weight: bold;
  /* margin-left: 500px; */
  background-color: #fff;
  display: block;
  width: 450px;
  height: 50px;
  padding-top: 10px;
  margin-bottom: 30px;
}
.coment_textbox{
  float:right;
  margin-right: 150px;
margin-top: 60px;
margin-top: 150px;
margin-bottom: 100px;
}
.coment_name{
font-size: 1.5em;
font-weight: bold;
margin-bottom: 30px;
margin-left: 30px;
}
.coment_text{
font-size: 1.1em;
margin-left: 30px;
margin-bottom: 10px;
}

/* stylist */

.stylist{
  margin-left: 200px;
  margin-top: 80px;
  
}

.stilist_title{
  color: #000;
  text-align: center;
  /* margin-top: 80px; */
  font-size: 1.5em;
  font-weight: bold;
  /* margin-left: 500px; */
  background-color: #fff;
  display: block;
  width: 450px;
  height: 50px;
  padding-top: 10px;
  margin-bottom: 30px;
}
.stylist_textbox{
  float:right;
  margin-right: 150px;
margin-top: 60px;
margin-top: 150px;
margin-bottom: 100px;
}
.stylist_name{
font-size: 1.5em;
font-weight: bold;
margin-bottom: 30px;
margin-left: 30px;
}
.stylist_text{
font-size: 1.1em;
margin-left: 30px;
margin-bottom: 10px;
}
/* .AI_title{
  background-image: url(../dryer_all/brain250.png);
  background-repeat: no-repeat;
  background-position: center;
  width: 250px;
  height: 166px;
} */

/* no_stress */

.no_stress{
  margin-top: 100px;
  margin-bottom: 100px;
}
.no_stress_info{
  color: #fff;
  text-align: center;
  margin-top: 50px;
  font-size: 1.5em;
  font-weight: bold;
}

.no_stress_textbox{
  background-color: #00ffffda;
  height: 180px;

}
.no_stress_textbox p{
  font-size: 2em;
  font-weight: bold;
margin-left: 240px;
/* padding-top: 50px; */
/* margin-top: 100px; */

}

/* .no_stress p{
  font-size: 2em;
  font-weight: bold;
margin-left: 240px;
margin-top: 100px;
} */


.no_stress h2{
  text-align: center;
  padding-top: 50px;
  font-size: 3em;
  font-weight: bold;
 /* margin-top:-1px; */
} 
/* trouble */

.trouble{
  margin-bottom: 150px;
}
.trouble_titlebox{
  background-color: #1c85d8;
  height: 200px;
  margin-top: 150px;
}

.trouble_titlebox h2{
  text-align: center;
  /* padding-top: 50px; */
  font-size: 2.5em;
  font-weight: bold;

}
.trouble_men{
  margin-left: 450px;
  margin-top: 80px;
}


.trouble_difficult{
  background-color:#1c85d8 ;
  height: 100px;
  text-align: center;
  margin-top: 50px;
  font-size: 1.5em;
  font-weight: bold;
  padding-top: 50px;
}

/* .trouble_tired{
  color: rgba(241, 11, 42, 0.952);
} */
.trouble_intro{
  font-size: 1.5em;
  font-weight: bold;
  color: rgb(255, 0, 179);
  text-align: center;
  margin-top: 50px;
}
.trouble_intro_text{
  font-size: 1.1em;
  font-weight: bold;
margin-top: 30px;
  text-align: center;
}
.AI_img{
  margin-left: 480px;
  margin-top: 50px;

}

.AI_text{
  font-size: 1.25em;
  font-weight: bold;
 background-color: rgb(21, 76, 243);
 display: block;
 width: 500px;
 height: 130px;
 margin-top: 50px;
padding-left: 150px;
padding-top: 40px;
}
.AI_text_you{
  font-size: 1.25em;
  font-weight: bold;
 background-color: rgb(255, 0, 179);
 display: block;
 width: 700px;
 /* height: 150px; */
 margin-top: 80px;
 margin-left: 600px;
 padding-left: 100px;
padding-top: 40px;
height: 100px;
}
/*customer_voice */
.swim{
  margin-left: 200px;
}

/* news */
.sns_container{
  margin-top: 80px;
  display: flex;
  justify-content: space-evenly;
  width: 1280px;
  height: 700px;

}

/* last_title */
.last_title_text{
  text-align: center;
  font-size: 1.5em;
  font-weight: bold;
}

/* Question */
/*====================================================================
.s_02 .accordion_one
====================================================================*/
.s_02 .accordion_one {
  max-width: 1024px;
  margin: 0 auto;
}
.s_02 .accordion_one .accordion_header {
  background-color: #db0f2f;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  padding: 20px 11%;
  text-align: center;
  position: relative;
  z-index: +1;
  cursor: pointer;
  transition-duration: 0.2s;
}
.s_02 .accordion_one:nth-of-type(2) .accordion_header {
    background-color: #ff9a05;
}
.s_02 .accordion_one:nth-of-type(3) .accordion_header {
    background-color: #1c85d8;
}
.s_02 .accordion_one .accordion_header:hover {
  opacity: .8;
}
.s_02 .accordion_one .accordion_header .i_box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  right: 5%;
  width: 40px;
  height: 40px;
  border: 1px solid #fff;
  margin-top: -20px;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
}
.s_02 .accordion_one .accordion_header .i_box .one_i {
  display: block;
  width: 18px;
  height: 18px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
  position: relative;
}
.s_02 .accordion_one .accordion_header.open .i_box {
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
}
.s_02 .accordion_one .accordion_header .i_box .one_i:before, .s_02 .accordion_one .accordion_header .i_box .one_i:after {
  display: flex;
  content: '';
  background-color: #fff;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  transform-origin: center center;
}
.s_02 .accordion_one .accordion_header .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.s_02 .accordion_one .accordion_header.open .i_box .one_i:before {
  content: none;
}
.s_02 .accordion_one .accordion_header.open .i_box .one_i:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.s_02 .accordion_one .accordion_inner {
  display: none;
  padding: 30px 30px;
  border-left: 2px solid #db0f2f;
  border-right: 2px solid #db0f2f;
  border-bottom: 2px solid #db0f2f;
  box-sizing: border-box;
}
.s_02 .accordion_one:nth-of-type(2) .accordion_inner {
  border-left: 2px solid #ff9a05;
  border-right: 2px solid #ff9a05;
  border-bottom: 2px solid #ff9a05;
}
.s_02 .accordion_one:nth-of-type(3) .accordion_inner {
  border-left: 2px solid #1c85d8;
  border-right: 2px solid #1c85d8;
  border-bottom: 2px solid #1c85d8;
}
.s_02 .accordion_one .accordion_inner .box_one {
  height: 300px;
}
.s_02 .accordion_one .accordion_inner p.txt_a_ac {
  margin: 0;
}
@media screen and (max-width: 1024px) {
  .s_02 .accordion_one .accordion_header {
    font-size: 18px;
  }
  .s_02 .accordion_one .accordion_header .i_box {
    width: 30px;
    height: 30px;
    margin-top: -15px;
  }
}
@media screen and (max-width: 767px) {
  .s_02 .accordion_one .accordion_header {
    font-size: 16px;
    text-align: left;
    padding: 15px 60px 15px 15px;
  }
}




/* footer
------------------------------*/
 
footer {
  text-align: center;
 clear: both;
 height: 250px;
 margin-top: 50px;
 /* background-color: #d6d1d1; */

 }

 /* .footer_container
 {
   display: flex;
   justify-content: space-evenly;
 } */
  
 .logo_fotter{
  margin-top: 30px;
 }
  
 .sns{
  margin-top: 30px;
 }
  
 .last{
   font-size: 1em;
   margin-top: 30px;
 }
 /* nav
------------------------------*/

nav {

  margin-top: 25px;

  display: flex;
  justify-content: center;
  margin-left: 40px;

}



nav.global ul li {
  display: inline-block;
  font-size: 1.1em;
  margin-right: 40px;


}

nav ul li a {
  color: #fff;
  text-decoration: none;
  font-weight: bold;
}

nav ul li a:hover {
  text-decoration: underline;
  color: #fff;
  transform: scale(2, 2);
  transition-duration: 0.2s;
}





/* javascript */
#dryer{
  position: absolute;
}

#btn{
  position: absolute;
  left:1000px;
  top:600px;
}

#optimize{
  position: absolute;
}

#optimize_kana{
  position: absolute;
}
/* #AI{
  position: absolute;


} */
#trouble{
  position: absolute;
top:-500px;
left:200px;
}

/* javascript ここまで */

/* particleここから */
@import url('https://fonts.googleapis.com/css?family=Merienda');

.background {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  z-index: 0;
  height: 600px;

}

/* Default Styling */
body {
  /* font-family: 'Merienda', cursive; */
  background: #000;
}


/* .container {
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  /* height: 100vh; */
  /* height: 200px;
} */ 
/* .box {
  background: #fff;
  border-radius: 5px;
  padding: 20px;
  text-align: center;
  position: absolute;
  z-index: 1;
} */
/* a {
  color: #0bd;
} */
/* particleここまで */


/* 動くアニメーションデザイン帳 */
/* #particles-js{ 
	position:fixed;
	z-index:-1;
	width: 100%;
	height: 100%;
}

 #wrapper{
	position: relative;
	z-index: 1;
width: 100%;
	height: 100%;
}  */