.main *{
}

.main .arrow{
  margin: 2rem auto 2rem;
}

.contents {
  padding: 0 1.5rem;
}

.c-inner {
  max-width:none;
  margin: 0 auto;
}


/* ----------------------------------------
digloss-logo
---------------------------------------- */
.digloss-logo{
  height: 10rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding:0 5rem 0;
}

.digloss-logo figure{
  width: auto;
  max-width: 30rem;
}

.digloss-logo img{
  width: 100%;
  height: auto;
}

/* ----------------------------------------
mv
----------------------------------------*/
.mv {
  height: auto;
}
.mv__img {
  aspect-ratio: 75 / 119;
  background: url(/products/digloss/images/main_sp.jpg) no-repeat;
  background-position: center;
  background-size: cover;
  align-items: flex-end;
}

.mv__product{
  column-gap: 0;
  margin-bottom: 4rem;
  padding: 0;
}

.mv__product figure{
  width: 80%;
  margin: 0 auto 2rem;
}

.mv__product figure figcaption{
  font-size: 1.4rem;
}


/* ----------------------------------------
mv-m
----------------------------------------*/
.mv-m {
  height: auto;
}
.mv-m__img {
  aspect-ratio: 75 / 119;
  background: url(/products/digloss/images/main-midlle_sp.jpg) no-repeat;
  background-position: center;
  background-size: cover;
  align-items: flex-end;
}

.mv-m__product{
  column-gap: 0;
  margin-bottom: 4rem;
  padding: 0;
}

.mv-m__product figure{
  width: 80%;
  margin: 0 auto 2rem;
}

.mv-m__product figure figcaption{
  font-size: 1.4rem;
  min-height: 6rem;
}

.mv-m .link-btn {
  width: 15rem;
  margin: 0 auto;
}
.mv-m .link-btn a {
  min-height: 5.4rem;
}

/* ----------------------------------------
feature
----------------------------------------*/



/* ----------------------------------------
movie
----------------------------------------*/
.movie{
  padding: 4rem 1.5rem 0;
}

.movie h2{
		font-size: 2.6rem;
		margin: 0 0 2rem 0;
}

.movie.js-fade .movie__inner::before{
  content: none;
}

/* ----------------------------------------
merit
---------------------------------------- */
.merit{
  padding: 4rem 1.5rem 6rem;
}

.merit .bg-top{
  height: 70vw;
}
.merit .bg-bottom{
  height: 70vw;
}

.merit .bg-tit__inner{
  position: absolute;
  width: calc(100% - 3rem);
  height: 9.33rem;
}

.merit .merit__title{
  font-size: 2.6rem;
  letter-spacing: -0.05em;
  padding:1rem;
  margin: 0 0 2rem 0;
}

.merit__itme figure{
  width: auto;
}

.merit__itme__tit{
  display: block;
  text-align: center;
  font-size: 1.8rem;
  padding:1rem;
}


/* ----------------------------------------
pageNav
---------------------------------------- */
.pageNav{
  padding: 4rem 1.5rem 0;
  margin: 0;
}

.pageNav h3{
  font-size: 2.6rem;
  margin: 0 0 2rem 0;
}

.pageNav p{
  font-size: 1.6rem;
  margin: 0 0 5rem 0;
}




.pageNav__inner{
  display: block;
}
.pageNav__inner li{
  width: auto;
  border-top:1px solid #f4f5f7;
}
.pageNav__inner li:not(:last-child){
  border-right:none;
}
.pageNav__inner li:last-child{
  margin: 0 0 4rem;
}

.pageNav__inner li a{
  display: flex;
  align-items: center;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: left;
  padding: 1rem 1rem 0.5rem 1rem;
}

.pageNav__inner li a figure{
  width: 3.6rem;
  margin: 0 3rem 0 4rem;
}

.pageNav__inner li a .anc{
  position: absolute;
  top:calc(50% - 1.25rem);
  left:1rem;
}

.pageNav .icon-new{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right:1rem;
  left:auto;
  width: 4rem;
  height: 4rem;
  font-size: 1.2rem;
}

/* ----------------------------------------
.p-contents
---------------------------------------- */
.p-contents {
  /*padding: 0 1.5rem 6rem;
  margin: 0 0 6rem 0;*/
  padding: 6rem 1.5rem 0;
  margin: 6rem 0 0 0;
  border-top:1px solid #f0f4f8;
}

.bg__inner{
  position: absolute;
  width: calc(100% - 3rem);
  height: 9rem;
}

.p-contents-main{
  display: block;
  padding: 1.2rem 0 0 0;
  margin: 0 0 5rem 0;
}

.p-contents-main__inner{
  width: auto;
  margin: 0 0 4rem 0;
}

.p-contents-main__name{
  font-size: 2.8rem;
  text-align: center;
  margin: 0 0 4rem 0;
}

.p-contents-main__txt{
  font-size: 1.6rem;
  font-weight: bold;
}

.p-contents-main__product{
  width: auto;  
}

.p-contents-main__product figure{
  max-width: 70%;
  margin: 0 auto 5rem;
}

.p-contents-main__product .icon-new{
  position: absolute;
  top:-3rem;
  left:0;
  width: 6rem;
  height: 6rem;
  font-size: 1.8rem;
}

/* ----------------------------------------
.p-contents__point
---------------------------------------- */
.p-contents__point:not(:last-child){
  margin: 0 0 5rem 0;
}

.p-contents__point__title{
  height: 6.6rem;
  padding: 1rem;
  margin: 0 auto 3rem;
}
    .p-contents__point__title::after {
      width: 2.2rem;
      height: 6.6rem;
      background: url(/products/digloss/images/title-arrow-right_sp.png) no-repeat;
      background-size: contain;
    }
    .p-contents__point__title::before {
      width: 2.2rem;
      height: 6.6rem;
      background: url(/products/digloss/images/title-arrow-left_sp.png) no-repeat;
      background-size: contain;
    }

    .p-contents__point__title .i-cleaner{
      width: 6.8rem;
      left: calc(50% - 11rem);
    }
    .p-contents__point__title .i-cleaner__txt{
      font-size: 2.8rem;
      margin: 0 0 0 6.8rem;
    }

    .p-contents__point__title .i-wax{
      width: 6.8rem;
      left: calc(50% - 11rem);
    }
    .p-contents__point__title .i-wax__txt{
      font-size: 2.8rem;
      margin: 0 0 0 6.8rem;
    }

    .p-contents__point__title .i-tire{
      width: 6.8rem;
      left: calc(50% - 11rem);
    }
    .p-contents__point__title .i-tire__txt{
      font-size: 2.8rem;
      margin: 0 0 0 6.8rem;
    }


.p-contents__point__txt{
  font-size: 1.6rem;
  line-height: 1.5;
  text-align: left;
  margin: 0 0 2rem 0;
}

.p-contents__point__img{
  display: block;
  padding: 0;
}

.p-contents__point__img li{
  width: auto;
}
.p-contents__point__img li:not(:last-child){
  margin: 0 0 3rem 0;
}

.p-contents__point__img li figcaption{
  font-size: 1.4rem;
  padding: 1rem 0 0 0;
}

.p-contents__point__img .p-contents__point__stit{
  font-size: 1.8rem;
  margin: 0 0 1rem 0;
}

.p-contents__point__img li p{
  padding: 1.5rem 0 0 0;
}

.p-contents__point__img + p{
  font-size: 1.4rem;
  text-align: left;
  margin: 1.5rem 0 4rem 0;
}
.p-contents__point__img + p span{
  font-size: 1.2rem;
}

/* ----------------------------------------
cleaner
----------------------------------------*/
.p-contents.cleaner{
  padding: 6rem 1.5rem 0;
  margin: 0 0 6rem 0;
  border-top:none;
}

.cleaner .bg-tit__inner{
  position: absolute;
  width: calc(100% - 3rem);
  height: 10.33rem;
}

.cleaner__title{
  font-size: 2.6rem;
  padding: 1.5rem 1.5rem 1.5rem 8rem;
  margin: 0 0 2rem 0;
}

    .cleaner__title .i-cleaner{
      width: 7rem;
      left: calc(50% - 14rem);
    }
    .cleaner__title span{
      margin: 0;
    }

.cleaner__inner{
  margin: 0 0 4rem 0;
}

.cleaner__inner::before{
  width: 100%;
}

.cleaner__pneme{
  font-size: 1.8rem;
}
.cleaner__pneme::after{
  width: auto;
  margin: 1rem auto 4rem;
}

.cleaner__inner figure{
  width: 20rem;
}

.cleaner .p-contents__point__txt{
  font-size: 2.4rem;
  text-align: center;
}

.cleaner .p-contents__point__stxt{
  font-size: 1.6rem;
  text-align: left;
  margin: 0 0 2rem 0;
}

.cleaner .p-contents__point__stit{
  font-size: 1.8rem;
}

.cleaner .point1 .p-contents__point__img:not(first-of-type) li{
  width:auto;
}
.cleaner .point1 .p-contents__point__img:first-of-type li{
  margin: 0 0 1rem 0;
}

.cleaner .point1 .p-contents__point__stxt{
  margin: 0 0 4rem 0;
}

.cleaner .point2 .p-contents__point__img:first-of-type{
  margin: 0 0 1rem 0;
}

.cleaner .point2 .p-contents__point__img:first-of-type li{
  width:auto;
}

.cleaner .point2 .p-contents__point__img:not(first-of-type){
  display: block;
}

.cleaner .point2 .p-contents__point__img:not(first-of-type) li{
  width: auto;
  margin: 0 0 1rem 0;
}

.cleaner .point2 .p-contents__point__img:not(first-of-type) li figure span{
  position: absolute;
  top: 1.5rem;
  left: 1.5rem;
  width: 16rem;
  font-size: 1.1rem;
  padding: 0.3rem;
}

.cleaner .point3 .p-contents__point__img li{
  width:auto;
}

.cleaner .point4 .p-contents__point__img:not(first-of-type) li{
  width:auto;
}


/* ----------------------------------------
wax
----------------------------------------*/
.p-contents.wax {
  padding: 6rem 1.5rem 6rem;
  border-bottom:none;
}

.wax .bg-tit__inner{
  position: absolute;
  width: calc(100% - 3rem);
  height: 10.33rem;
}

.wax__title{
  font-size: 2.6rem;
  padding: 1.5rem 1.5rem 1.5rem 8rem;
  margin: 0 0 2rem 0;
}

    .wax__title .i-wax{
      width: 7rem;
      top: -2rem;
      left: calc(50% - 14rem);
    }
    .wax__title span{
      margin: 0;
    }

.wax__inner{
  margin: 0 0 4rem 0;
}

.wax__inner::before{
  width: 100%;
}

.wax__pneme{
  font-size: 1.8rem;
}
.wax__pneme::after{
  width: auto;
  margin: 1rem auto 4rem;
}

.wax__inner figure{
  width: 20rem;
}

.wax .p-contents__point__txt{
  font-size: 2.4rem;
  text-align: center;
}

.wax .p-contents__point__stxt{
  font-size: 1.6rem;
  text-align: left;
  margin: 0 0 2rem 0;
}

.wax .p-contents__point__stit{
  font-size: 1.8rem;
  text-align: left;
}

.wax .point1 .p-contents__point__img li{
  width:auto;
}

.wax .point2 .p-contents__point__img li{
  width:auto;
}

.wax .point2 .p-contents__point__img:first-of-type{
  display: flex;
  gap: 0.3rem;
  justify-content: center;
  flex-wrap:wrap;
}

.wax .point2 .p-contents__point__img:first-of-type li{
  width: calc((100% - 0.3rem) / 2);
  line-height: 1;
}



.wax .point3 .p-contents__point__img li{
  width:auto;
}

.wax .point4 .p-contents__point__img li{
  width:auto;
}

.wax .point5 .p-contents__point__img li{
  width:auto;
}


/* ----------------------------------------
tirebrush
----------------------------------------*/
.p-contents.tirebrush{
  margin: 0;
}

.tirebrush .point2 .p-contents__point__img li{
  width:auto;
}
.tirebrush .point3 .p-contents__point__img li{
  width:auto;
}
.tirebrush .point1 .p-contents__point__img li p {
  margin: 0 0 3rem 0; 
}


/* ----------------------------------------
wheelbrush
----------------------------------------*/
.wheelbrush .point1 .p-contents__point__img:first-of-type li{
  margin: 0 0 0 0; 
}

.wheelbrush .point2 .p-contents__point__txt{
  text-align: center;
}

.wheelbrush .point2 .p-contents__point__img li{
  width:auto;
}

.wheelbrush .point2 .p-contents__point__img ul{
  display: block;
  margin: 1rem 0 4rem 0;
  font-size: 1.4rem;
}

.wheelbrush .point2 .p-contents__point__img ul li{
  width: auto;
}

.wheelbrush .point2 .p-contents__point__img ul li:not(:last-child){
  margin: 0 0 1.5rem 0;
}


.wheelbrush .point3 .p-contents__point__img li{
  width:auto;
}


/* ----------------------------------------
wheelsponge
----------------------------------------*/
.wheelsponge .point1 .p-contents__point__img:first-of-type{
  margin: 0 0 4rem 0; 
}
.wheelsponge .point1 .p-contents__point__img:last-child li{
  width:auto;
}

.wheelsponge .point2 .p-contents__point__img:first-of-type{
  margin: 0 0 4rem 0; 
}
.wheelsponge .point2 .p-contents__point__img:last-child li{
  width:auto;
}

/* ----------------------------------------
wheeltonic
----------------------------------------*/
.p-contents.wheeltonic{
  padding: 6rem 1.5rem 0;
  margin: 6rem 0 6rem 0;
}

.wheeltonic .point1 .p-contents__point__img:first-of-type li{
  margin: 0 0 1rem 0; 
}
.wheeltonic .point1 .p-contents__point__img:first-of-type{
  margin: 0 0 1rem 0; 
}

.wheeltonic .point1 .p-contents__point__img:not(first-of-type) li{
  width:auto;
}

.wheeltonic .point2 p{
  font-size: 1.4rem;
  text-align: left;
}


/* ----------------------------------------
pitasupo
----------------------------------------*/
.p-contents.pitasupo {
  padding: 6rem 1.5rem 6rem;
  border-top: none;
}

.pitasupo .point1 .p-contents__point__img li{
  width:auto;
}
.pitasupo .point1 .p-contents__point__img + p{
  text-align: center;
}

.pitasupo .point2 .p-contents__point__img li{
  width:auto;
}

.pitasupo .point3 .p-contents__point__txt{
  text-align: center;
}

.pitasupo .point3 .p-contents__point__img {
  display: flex;
  gap: 1.5rem 1.5rem;
  justify-content: flex-start;
  flex-wrap:wrap;
}
.pitasupo .point3 .p-contents__point__img li{
  width: calc((100% - 1.5rem) / 2);
}
.pitasupo .point3 .p-contents__point__img li {
  margin: 0;
}


/* ----------------------------------------
giraedge
----------------------------------------*/
.p-contents.giraedge {
  padding: 6rem 1.5rem 6rem;
  border-top: 1px solid #141414;
}

.giraedge .point1 .p-contents__point__img li{
  width:auto;
}

.giraedge .point2 .p-contents__point__img:first-of-type li{
  margin: 0 0 1rem 0; 
}

.giraedge .point3 .p-contents__point__img li{
  width:auto;
}

.giraedge .point1 .p-contents__point__txt{
  text-align: center;
}

.giraedge .point2 .p-contents__point__txt{
  text-align: center;
}

.giraedge .point3 .p-contents__point__txt{
  text-align: center;
}


/* ----------------------------------------
floating-bn
----------------------------------------*/
.floating-bn{
  width: calc(100% - 20px);
  height: auto;
}

.floating-bn img{
  width: 100%;
  height: auto;
}

.bottom-digloss-logo{
 padding: 0 5rem 37.33vw;
}

