@charset "UTF-8";

/*------------------------seikin---------------------------*/
.news{
overflow:hidden;
}
.news .inner{
position:relative;
}
@keyframes kin_scale{
  0%  {scale:1 0.9;}
  100%{scale:0.9 1;}
}
@keyframes kin_step{
  0%  {margin-top:0rem;}
  100%{margin-top:-2rem;}
}
@keyframes kin01_move{
  0%  {translate:-30rem 3rem;}
  100%{translate:0 0;}
}
@keyframes kin02_move{
  0%  {translate:40rem -2rem;}
  100%{translate:0 0;}
}
.ani01{
  --easeInOutExpo:cubic-bezier((0.1,-0.6,0.2,0));
  animation-name: kin_scale, kin_step, kin01_move;
  animation-duration:0.4s,0.4s,15s;
  animation-timing-function:var(--easeInOutExpo),var(--easeInOutExpo),linear;
  animation-iteration-count:36,36,1/*infinite*/;
  animation-direction:alternate,alternate,normal;
}
.ani02{
  --easeInOutExpo: cubic-bezier((0.1,-0.6,0.2,0));
  animation-name:kin_scale, kin_step,kin02_move;
  animation-duration:0.5s,0.5s,15s;
  animation-timing-function:var(--easeInOutExpo),var(--easeInOutExpo),linear;
  animation-iteration-count:30,30,1/*infinite*/;
  animation-direction: alternate,alternate,normal;
}
@media screen and (max-width:767px){
  .kin01{
  width:2rem;
  position:absolute;
  top:0.5rem;
  right:20%;
  }
  .kin02{
  width:3rem;
  position:absolute;
  top:1rem;
  right:10%;
  }
}
@media screen and (min-width:768px){
  .kin01{
  width:2.5rem;
  position:absolute;
  top:2rem;
  left:36rem;
  }
  .kin02{
  width:3.5rem;
  position:absolute;
  top:2.5rem;
  left:40rem;
  }
}



/*------------------------mainVisual---------------------------*/
.mv{}
.mv [class^="slick_img"] .inner{
position:relative;
}
.mv .slick_img01{background:#ffe7e3;}
.mv .slick_img02{background:#fff6ef;}
.mv .slick_img03{background:#fff6ef;}
.mv .slick_img04{background:#e1f3fe;}
.mv .mv_btn{
position:absolute;
background-color:#fff;
background-repeat:no-repeat;
background-position:right 3rem center;
background-size:1rem;
text-align:center;
font-weight:500;
font-family:var(--maru);
}
.mv .slick_img01 .mv_btn{color:#ff958a;background-image:url(../img/ico_arw05.svg);}
.mv .slick_img02 .mv_btn{color:#2a8cca;background-image:url(../img/ico_arw04.svg);}
.mv .slick_img03 .mv_btn{color:#ff958a;background-image:url(../img/ico_arw05.svg);}
.mv .slick_img04 .mv_btn{color:#2a8cca;background-image:url(../img/ico_arw04.svg);}
.thumbnailbox{
position:relative;
box-shadow:0 -0.2rem 0.2rem 0 rgba(0,0,0,0.05);
background:#fff;
}
.thumbnail [class^="thumbnail_img"]{
position:relative;
display:block;
border-radius:0.5rem;
cursor:pointer;
}
.thumbnail .slick-current::before{
content:'';
display:block;
position:absolute;
border-color:#fff;
border-style:solid;
box-shadow:0 -0.2rem 0 0 rgba(0,0,0,0.05);
}
.thumbnail .thumbnail_img01,
.thumbnail .thumbnail_img01.slick-current::before{background:var(--theme4);}
.thumbnail .thumbnail_img02,
.thumbnail .thumbnail_img02.slick-current::before{background:#7fbadf;}
.thumbnail .thumbnail_img03,
.thumbnail .thumbnail_img03.slick-current::before{background:#ffb8cb;}
.thumbnail .thumbnail_img04,
.thumbnail .thumbnail_img04.slick-current::before{background:#d3ecfc;}
.thumbnail .slick-current::after{
content:'';
display:block;
position:absolute;
top:-1.1rem;
left:50%;
transform:translateX(-50%);
width:0;
height:0;
border-style:solid;
border-right:1rem solid transparent;
border-left:1rem solid transparent;
border-top:1rem solid #fff;
border-bottom:0;
}
.thumbnail [class^="thumbnail_img"] img{
position:relative;
}
@media screen and (max-width:767px){
  .mv .inner{
  width:100%;
  }
  .mv .mv_btn{
  bottom:3rem;
  right:13%;
  width:74%;
  height:4rem;
  line-height:4rem;
  border-radius:2rem;
  }
  .thumbnailbox{
  padding:1rem 0 1.5rem;
  }
  .thumbnailbox .slick-list{
  margin-top:-2rem;
  padding-top:2rem !important;
  }
  .thumbnail [class^="thumbnail_img"]{
  margin:0 0.5rem;
  z-index:1;
  }
  .thumbnail .slick-current{
  z-index:0;
  }
  .thumbnail .slick-current::before{
  top:-1.75rem;
  left:-1rem;
  width:calc(100% + 2rem);
  height:calc(100% + 2.75rem);
  border-radius:1.5rem;
  border-width:1rem;
  z-index:0;
  }
}
@media screen and (min-width:768px){
  .mv .mv_btn{
  bottom:5rem;
  right:3rem;
  width:41.8%;
  height:4.6rem;
  line-height:4.6rem;
  border-radius:2.3rem;
  }
  .thumbnailbox{
  padding:2rem 0;
  }
  .thumbnailbox .slick-list{
  margin:-3.5rem -1% 0;
  padding:3.5rem 0.5% 0 !important;
  }
  .thumbnail [class^="thumbnail_img"]{
  margin:0 1rem;
  }
  .thumbnail .slick-current::before{
  top:-3rem;
  left:-2rem;
  width:calc(100% + 4rem);
  height:calc(100% + 5rem);
  border-radius:2.5rem;
  border-width:2rem;
  }
  .thumbnail .slick-track{
  transform:unset !important;
  }
}



/*------------------------pg_top Banner---------------------------*/
.pg_index .banner{
padding:1rem 0 4rem;
background:#fff;
}
.pg_index .banner .banner_list{}
.pg_index .banner .banner_item{}
.pg_index .banner .banner_item:nth-child(n+2){
margin-top:2rem;
}
@media screen and (max-width:767px){}
@media screen and (min-width:768px){}



/*------------------------newsList---------------------------*/
.news{
padding:4rem 0;
background:var(--theme2);
}
.news .ttl{
display:inline-block;
margin:0;
padding:0.5rem 2rem 0;
border-radius:2rem 2rem 0 0;
background:#fff;
text-align:left;
font-weight:500;
font-size:2.2rem;
font-family:var(--gothic);
letter-spacing:0.2em;
}
.news .ttl .eng{
display:inline-block;
margin-right:0.5em;
font-weight:500;
font-size:1.4rem;
letter-spacing:0.05em;
font-family:var(--maru);
color:var(--theme1);
}
.news_list{
margin-top:-1rem;
padding:3rem 2rem 6rem;
background:#fff;
border-radius:0 2rem 2rem 2rem;
}
.news_item{
display:grid;
padding:0.75rem 0.5rem;
line-height:1.5;
border-top:1px #ccc dotted;
}
.news_item .date{
white-space:nowrap;
}
.news_item:last-child{
border-bottom:1px #ccc dotted;
}
.news .link_box{
transform:translateY(-5rem);
text-align:right;
}
@media screen and (max-width:767px){
  .news .link_box{
  margin-right:3rem;
  }
  .news_item{
  grid-template-columns:1fr;
  }
}
@media screen and (min-width:768px){
  .news{
  padding:6rem 0;
  }
  .news .ttl{
  padding:0.5rem 6rem 0;
  font-size:3rem;
  }
  .news .ttl .eng{
  font-size:1.6rem;
  }
  .news_list{
  padding:4rem 6rem 6rem;
  }
  .news_item{
  grid-template-columns:auto 1fr;
  gap:2em;
  padding:0.75rem 2rem;
  }
  .news .link_box{
  margin-right:6rem;
  }
}



/*------------------------About---------------------------*/
.about{
background:var(--theme4);
padding:4rem 0 6rem;
}
.about h2.ttl{
position:relative;
text-align:center;
font-weight:500;
font-size:3rem;
font-family:var(--gothic);
color:#fff;
}
.about h3.ttl{
position:relative;
margin-top:1.5rem;
height:3.5rem;
line-height:3rem;
background:url(../img/top/ttl_bg01.svg) no-repeat center center / contain;
text-align:center;
font-weight:500;
font-size:2rem;
font-family:var(--gothic);
color:var(--theme1);
}
.about h3.ttl .bold{
color:var(--theme1_dark);
}
.about h3.ttl .large3{
display:inline-block;
transform:translateY(0.05em);
}
.about .about_img{
width:90%;
margin:-8rem auto 0;
}
.about .btn_box .txt{
font-weight:500;
font-size:2rem;
font-family:var(--maru);
color:#fff;
}
.about .btn{
background-color:#d15e6e;
}
@media screen and (max-width:767px){
  .about h2.ttl::first-line{
  font-size:2rem;
  }
  .about .btn_box{
  margin-top:1rem;
  }
  .about .btn_box .txt{
  text-align:center;
  }
}
@media screen and (min-width:768px){
  .about{
  padding:8rem 0;
  }
  .about h2.ttl{
  font-size:4rem;
  }
  .about h3.ttl{
  margin-top:3rem;
  height:6rem;
  line-height:5rem;
  font-size:3rem;
  }
  .about .about_img{
  width:45rem;
  margin:-11rem auto 0;
  }
  .about .btn_box{
  margin-top:3rem;
  }
  .about .btn_box .txt{
  font-size:2.2rem;
  }
}



/*------------------------Trial---------------------------*/
.trial{
background:var(--theme3);
padding:8rem 0;
}
.trial .head_box{
position:relative;
display:flex;
align-items:center;
width:100%;
color:var(--theme1);
}
.trial .head_box .img{
width:45%;
margin-left:5%;
}
.trial .head_box .eng{
position:absolute;
left:0;
top:0;
font-size:1.25rem;
line-height:1;
font-weight:700;
transform-origin:0.5em 0.5em;
transform:rotate(90deg);
}
.trial .head_box .eng::after{
content:'';
display:inline-block;
width:3em;
height:1px;
margin:0.4em 0 0.4em 1em;
background:var(--theme1);
}
.trial .head_box .ttl{
width:50%;
text-align:center;
font-weight:500;
font-size:4.6rem;
line-height:1.4;
font-family:var(--gothic);
color:var(--theme4);
}
.trial .head_box .ttl::first-line{
font-size:3.6rem;
line-height:2.5;
}
.trial .head_box .ttl .dots{
background-image:radial-gradient(circle at center, var(--theme1) 20%, transparent 20%);
color:var(--theme1);
}
.trial_item{
display:flex;
justify-content:space-between;
width:100%;
margin:6rem auto 0;
}
.trial_box{
width:48%;
padding:0 0 5rem;
border-radius:2rem;
background:#fff;
text-align:center;
}
.trial_head{
transform:translateY(-50%);
font-size:3rem;
line-height:1;
}
.trial_ttl{
margin-top:3rem;
font-weight:700;
font-size:2.2rem;
line-height:1;
font-family:var(--maru);
letter-spacing:0;
}
#body .trial_head,
#body .trial_ttl{color:#3d70a9;}
#scalp .trial_head,
#scalp .trial_ttl{color:#dc4e54;}
.trial_item .trial_img{
float:left;
}
.trial_item #body .trial_img{width:43%;margin-left:3%;}
.trial_item #scalp .trial_img{width:33%;margin-left:7%;}
.trial_item .trial_exp{
float:right;
width:48%;
margin-right:5%;
margin-bottom:1rem;
}
.trial_item .net{
margin-top:2rem;
padding:0.2em 1em;
border-radius:0.5rem;
text-align:center;
font-weight:700;
font-family:var(--maru);
}
.trial_item #body .net{background:#e9f3ff;color:#3d70a9;}
.trial_item #scalp .net{background:#f6e2e3;color:#dc4e54;}
.trial_item .price_ttl{
margin-top:1rem;
padding:0.2em 1em;
border-radius:0.5rem;
text-align:center;
font-weight:700;
font-family:var(--maru);
color:#fff;
}
.trial_item #body .price_ttl{background:#3d70a9;}
.trial_item #scalp .price_ttl{background:#dc4e54;}
.trial_item .price_box{
text-align:center;
font-weight:700;
font-size:150%;
line-height:1;
font-family:var(--maru);
}
.trial_item #body .price_box{color:#3d70a9;}
.trial_item #scalp .price_box{color:#dc4e54;}
.trial_item .price{
font-size:240%;
}
.trial_item #body .price{text-shadow:1px 1px 0 #3d70a9,-1px -1px 0 #3d70a9,-1px 1px 0 #3d70a9,1px -1px 0 #3d70a9,1px 0 0 #3d70a9,-1px 0 0 #3d70a9,0 1px 0 #3d70a9,0 -1px 0 #3d70a9;}
.trial_item #scalp .price{text-shadow:1px 1px 0 #dc4e54,-1px -1px 0 #dc4e54,-1px 1px 0 #dc4e54,1px -1px 0 #dc4e54,1px 0 0 #dc4e54,-1px 0 0 #dc4e54,0 1px 0 #dc4e54,0 -1px 0 #dc4e54;}
.trial_item .tax{
font-size:40%;
margin-left:-2.1em;
position:relative;
top:-2.5em;
}
.trial .btn{
clear:both;
margin:0 auto;
}
@media screen and (max-width:767px){
  .trial{
  background:var(--theme3);
  padding:8rem 0;
  }
  .trial .head_box{
  display:block;
  }
  .trial .head_box .img{
  width:100%;
  margin-left:0;
  }
  .trial .head_box .eng{
  top:28rem;
  }
  .trial .head_box .ttl{
  width:100%;
  margin-top:4rem;
  font-size:3.8rem;
  }
  .trial .head_box .ttl::first-line{
  font-size:2.6rem;
  }
  .trial_item{
  display:block;
  }
  .trial_box{
  width:100%;
  padding:0 0 3rem;
  }
  .trial_box + .trial_box{
  margin-top:6rem;
  }
  .trial_ttl{
  margin-top:1rem;
  }
  .trial_img{
  margin:3rem auto 2rem;
  }
  .trial .btn{
  width:90%;
  }
}
@media screen and (min-width:768px){
  .trial_img{
  width:80%;
  margin:2rem auto 3rem;
  }
.trial_item .price_box{
font-size:180%;
}
  .trial .btn{
  width:80%;
  }
}



/*------------------------Top_force---------------------------*/
.force{
background:var(--theme2);
padding:8rem 0 8rem;
}
.force .ttl{
text-align:center;
font-weight:500;
font-size:3.4rem;
font-family:var(--gothic);
letter-spacing:0.1em;
}
.force .ttl span{
font-size:4.6rem;
}
.force_list{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:2rem;
margin:4rem auto 0;
}
.force_item{
background:#fff;
border-radius:3rem;
box-shadow:0 0.4rem 0.4rem 0 rgba(0,0,0,0.1);
}
.force_item a{
display:block;
overflow:hidden;
padding:3rem 0 1.25rem;
}
.force_item_ttl{
text-align:center;
font-weight:700;
font-size:2.5rem;
line-height:1.3;
font-family:var(--maru);
}
.force_item_ttl .eng{
display:block;
font-weight:500;
font-size:1.6rem;
color:#ff8e9c;
}
.force .btn_box{
margin-top:6rem;
}
@media screen and (min-width:768px){
  [class^="force_item_img"]{
  margin:1rem auto 0;
  }
  .force_item_img01{width:7.875rem;}
  .force_item_img02{width:5.5rem;}
  .force_item_img03{width:6.09375rem;}
  .force_item_img04{width:9.5625rem;}
}
@media screen and (max-width:767px){
  .force .ttl{
  font-size:2.3rem;
  }
  .force .ttl span{
  display:block;
  font-size:4rem;
  }
  .force_list{
  grid-template-columns:repeat(2,1fr);
  }
  .force_item a{
  display:flex;
  flex-direction:row-reverse;
  align-items:center;
  width:100%;
  height:100%;
  padding:2rem 3%;
  }
  .force_item_ttl{
  flex-grow:1;
  }
  [class^="force_item_img"]{
  flex-shrink:0;
  }
  .force_item_img01{width:40%;margin-left:5%;}
  .force_item_img02{width:30%;margin-left:10%;}
  .force_item_img03{width:40%;}
  .force_item_img04{width:40%;margin-left:5%;}
  .force_item_ttl{
  font-size:2rem;
  }
  li:nth-of-type(3) .force_item_ttl,
  li:nth-of-type(4) .force_item_ttl{
  font-size:1.8rem;
  letter-spacing:0;
  }
  .force_item_ttl .eng{
  font-size:1.2rem;
  }
}



/*------------------------Top_BestSeller---------------------------*/
.seller{
padding:5rem 0 8rem;
background:var(--theme2);
}
.seller .ttl{
margin-bottom:1em;
text-align:center;
font-weight:500;
font-size:3rem;
font-family:var(--gothic);
letter-spacing:0.1em;
}
.seller .ttl .eng{
display:block;
margin-bottom:1em;
height:2.2em;
line-height:2.2em;
background: url(../img/top/ttl_bg02.svg) no-repeat center center / contain;
font-size:1.2rem;
font-family:var(--maru);
letter-spacing:0.05em;
color:#fff;
}
.seller_list{
display:flex;
flex-wrap:wrap;
justify-content:center;
width:104%;
margin:0 -2%;
}
.seller_item{
width:46%;
margin:2rem 2%;
}
.seller a{
text-decoration:none;
}
.seller_item_img{
}
.seller_item_txt{
margin-top:1em;
text-align:center;
font-weight:700;
font-size:1.6rem;
line-height:1.3;
font-family:var(--maru);
}
.seller .btn_box{
margin-top:3rem;
}
@media screen and (min-width:768px){
  .seller .ttl{
  font-size:5rem;
  }
  .seller .ttl .eng{
  height:2.5em;
  line-height:2.5em;
  font-size:1.6rem;
  }
  .seller_list{
  width:102%;
  margin:0 -1%;
  }
  .seller_item{
  width:23%;
  margin:2rem 1%;
  }
}
@media screen and (max-width:767px){}



/*------------------------Top_Voice---------------------------*/
.voice{
padding:30rem 0 4rem;
}
.voice .ttl{
text-align:center;
font-weight:500;
font-size:5rem;
font-family:var(--gothic);
letter-spacing:0.2em;
color:#fff;
}
.voice .ttl .eng{
display:block;
font-size:1.6rem;
letter-spacing:0.05em;
font-family:var(--maru);
}
.voice .review_box{
 margin-top:4rem;
}
@media screen and (min-width:768px){
  .voice{
  background:url(../img/top/voice_img.webp) no-repeat center top / contain,linear-gradient(var(--theme2) 5rem, var(--theme4) 5rem);
  }
}
@media screen and (max-width:767px){
  .voice{
  padding:25rem 0 4rem;
  background:url(../img/top/voice_img_sp.webp) no-repeat center top / contain,linear-gradient(var(--theme2) 5rem, var(--theme4) 5rem);
  }
  .voice .ttl{
  font-size:3rem;
  }
  .voice .ttl .eng{
  font-size:1.4rem;
  }
}


