@charset "utf-8";

html,
body {
  overflow-x: hidden;
  height: auto !important;
}
.sp_br {
  display: none;
}
.sp_only {
  display: none;
}

/*-----------640px-----------*/
/*---------------------------*/
@media only screen and (max-width:640px) {
  .sp_br {
    display: block;
  }
  .pc_only {
    display: none;
  }
  .sp_only {
    display: block;
  }
}
/*
//
// products style css /
//
*/
#sl1200m7l {
  margin: 0 auto;
}
#sl1200m7l [class^='co']>img,
#sl1200m7l [class^='co']>a>img {
  width: 100%;
}
#sl1200m7l .headding {
  line-height: 1.5;
}
#sl1200m7l .headding h2 {
}
#sl1200m7l .headding h2 span {
  display: block;
  font-weight: bold;
}
#sl1200m7l .kvArea {
  position: relative;
}
#sl1200m7l .kvArea img {
  width: 100%;
  vertical-align: bottom;
}
#sl1200m7l .kvArea figure {
  margin: 0;
}
#sl1200m7l .kvArea .onSlash {
  position: absolute;
  bottom: -25px;
  left: 50%;
  margin-left: -19px;
}

.title-wrap {
  position: relative;
  text-align: center;
}
.title-wrap *{
  color: #4d4d4d;
}

.title-wrap .headding strong {
  display: block;
  font-weight: bold;
  text-align: center;
}
.title-wrap>strong {
  font-weight: normal;
}
.title-wrap h1 {
  line-height: 0;
  text-align: center;
}
.inner_wridth {
  clear: both;
  margin-right: auto;
  margin-left: auto;
}
.text_wrap p.notes {
  font-size: .88em;
  margin-top: .8em;
}

@media only screen and (max-width:640px) {

  .kvArea {
    position: relative;
    width: 100vw;
    margin-bottom: 0;
  }
  .mainContens .inContents {
    margin-top: 0;
        /* margin: 0 auto 39px; */
;
  }
  /* .inContents > div:not(.title-wrap),
  .inContents > div:not(.full_width) {
    padding-right: 5%;
    padding-left: 5%;
  } */
  .title-wrap {
    padding: 20px 5%;
  }
  .headding h2 {
    font-size: 16px;
    margin-bottom: 18px;
  }
  .headding h2 span {
    font-size: 24px;
  }
  .headding .price {
    font-size: 16px;
    margin-bottom: 34px;
    line-height: 1.64;
  }
  .title-wrap .headding strong {
    font-size: 20px;
    line-height: 1.68;
  }
  /* .title-wrap .headding strong {
    font-size: 34px;
    line-height: 1.8;
  } */

  /* .title-wrap h1 img {
    width: 90%;
  } */
  /* .title-wrap .headding strong {
    font-size: 18px;
    margin-bottom: 29px;
  } */
  /* .title-wrap h1 {
    margin: auto auto 16px;
  } */
  /* .title-wrap p.price {
    font-size: 14px;
    margin-bottom: 28px;
  }
  .title-wrap>strong {
    font-size: 16px;
    line-height: 1.78;
  } */

  /* .title-wrap p.caption+p {
    margin-top: 22px;
  }

  #sl1200m7l .title-wrap+.col1-resp {
    margin-top: 34px;
  }


  #sl1200m7l .title-wrap+.col1-resp {
    margin-top: 34px;
  } */

}
@media screen and (min-width: 641px) {

  #sl1200m7l {
    padding: 0 25px 40px 26px;
  }
  .mainContens .inContents {
    margin-bottom: 80px;
    font-size: 16px;
    max-width: none;
  }
  .kvArea {
    position: relative;
    width: calc(100vw - 15px);
    margin-left: -26px;
    margin-bottom: 0;
    /* width: 100vw; */
  }
  .title-wrap {
    padding: 26px 0 54px;
  }
  .headding {
    line-height: 1.5;
  }
  .headding h2 {
    font-size: 20px;
    margin-bottom: 18px;
  }
  .headding h2 span {
    font-size: 36px;
  }
  .headding .price {
    font-size: 20px;
    margin-bottom: 34px;
    line-height: 1.64;
  }
  .title-wrap .headding strong {
    font-size: 34px;
    line-height: 1.8;
  }
  .inner_wridth {
    max-width: 924px;
    position: relative;
    padding: 0 25px;
    margin-bottom: -24px;
  }
  
}




.features_wrap {}
.feature_fx {
  color: #fff;
  position: relative;
}
.feature_fx,
.feature_fx:before,
.feature_fx:after {
  background: #4d4d4d;
}
.feature_fx:before,
.feature_fx:after {
  content: "";
  display: block;
  width: calc((100vw - 100%) / 2);
  height: 100%;
  top: 0;
  position: absolute;
}
.feature_fx:before {
  right: 100%;
}
.feature_fx:after {
  left: 100%;
}
.feature_fx .text_wrap {
  box-sizing: border-box;
}
.text_wrap h3 {
  font-weight: bold;
}
.text_wrap sup {
  top: -0.2em;
  font-size: 1.3em;
  vertical-align: unset;
}

.feature_fx .img_wrap img {
  display: block;
  width: 100%;
}

@media screen and (max-width: 640px) {

  .feature_fx {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .feature_fx.reverse {}
  .feature_fx>* {
    width: 100%;
  }

  .feature_fx .text_wrap {
    padding: 4% 5% 15%;
  }
  .text_wrap .text_inner {
    max-width: 640px;
  }
  .feature_fx.reverse .text_inner {
    margin: 0 auto 0 0;
  }
  .text_wrap h3 {
    font-size: 18px;
    line-height: 1.78;
    margin-bottom: 4.8%;
  }
  .text_wrap p {
    font-size: 14px;
    line-height: 1.72;
  }



}


@media screen and (min-width: 641px) {

  .features_wrap {
    margin-left: -26px;
    margin-right: -25px;
  }
  .feature_fx {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
  .feature_fx.reverse {
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .feature_fx>* {
    width: 50%;
  }
  .feature_fx .text_wrap {
    padding: 2.1% 2.5% 0;
  }
  .text_wrap .text_inner {
    max-width: 640px;
    margin: 0 0 0 auto;
  }
  .feature_fx.reverse .text_inner {
    margin: 0 auto 0 0;
  }
  .text_wrap h3 {
    font-size: 28px;
    line-height: 1.78;
    margin-bottom: 4.8%;
  }
  .text_wrap p {
    font-size: 16px;
    line-height: 1.72;
  }




}
@media screen and (min-width: 641px) and (max-width: 1190px) {

    .text_wrap h3 {
      font-size: 2.35vw;
    }
    .text_wrap p {
      font-size: 1.34vw;
    }

  
}





/* sectionTitle */
#sl1200m7l .sectionTitle {
  font-family: 'DIN Regular';
  font-size: 36px;
  padding: 60px 0 14px;
  border-bottom: 1px solid #E4E4E4;
  margin-bottom: 27px;
  line-height: 1;
}
#sl1200m7l .sectionTitle span {
  font-size: 16px;
  padding-left: 10px;
  vertical-align: baseline;
  margin: auto;
}
#sl1200m7l .sectionSubTitle {
  margin: 0 0 30px;
  padding: 3px 0 3px 20px;
  border-bottom: none;
  border-left: 4px solid #666;
  font-weight: bold;
  font-size: 22px;
  line-height: 1.4;
}
#sl1200m7l .col1-resp {
  /* margin-top: 76px; */
  margin-bottom: 0 !important;
}
div.color_select_cap {
  display: block;
  margin: auto;
  text-align: center;
}
.color_select_cap p {
  display: inline-block;
  border: 1px solid #333;
  padding: 0.5em 1em;
  margin-top: 18px;
}

@media screen and (max-width: 640px) {

  .inContents p {
    font-size: 110%;
    line-height: 170%;
  }
  .sectionTitle+h3 {
    font-size: 16px;
    line-height: 1.6;
  }
  .sectionTitle+h3+p.color_select_cap {}


}

@media screen and (min-width:641px) {

  .sectionTitle + h3 {
    font-size: 22px;
    line-height: 1.8;
  }

  img + .sectionLead_b {
    font-size: 15px;
    margin-top: 13px;
  }

}
















/*-----------640px-----------*/
/*---------------------------*/
@media only screen and (max-width:640px) {

  #sl1200m7l .col1-resp {
    margin-top: 20px;
  }
  #sl1200m7l .kvArea .onSlash {
    bottom: -12px;
    margin-left: -9px;
    width: 18px;
  }

  /* added 201028--!*/
  #sl1200m7l .col2-resp {
    margin-top: 0 !important;
  }
  #sl1200m7l .col2-resp:first-of-type {
    margin-bottom: 0;
  }
  #sl1200m7l .col2-resp:last-of-type {
    margin-bottom: inherit;
  }
  #sl1200m7l .col2-resp .co2-1,
  #sl1200m7l .col2-resp .co2-2,
  #sl1200m7l .col2-resp .co2-1.sm2,
  #sl1200m7l .col2-resp .co2-1.sm2+.co2-2 {
    float: none;
    margin: 0;
    width: 100%;
  }
  #sl1200m7l .col2-resp .co2-1 img,
  #sl1200m7l .col2-resp .co2-2 img,
  #sl1200m7l .col3-resp .co3-1 img,
  #sl1200m7l .col3-resp .co3-2 img,
  #sl1200m7l .col3-resp .co3-3 img {
    width: 100%;
  }
  #sl1200m7l .col2-resp .co2-1,
  #sl1200m7l .col2-resp .co2-2,
  #sl1200m7l .col2-resp .co2-1.sm2 {
    margin-top: 10px;
  }

  .vgpmark {
    margin-top: 10%;
    padding: 0 10%;
  }
  .vgpmark li img {
    width: 100%;
  }
  /* added 201028--!*/
  .vgpmark li .aw_logo {
    max-width: 100%;
    width: 25.5%;
  }
  .vgpmark li .aw_cap .p_name {
    font-size: 3.3vw;
    line-height: 1.5;
  }
  .vgpmark li .aw_cap .aw_txt {
    font-size: 2.9vw;
    line-height: 1.5;
  }
}



/* vgpmark */
.vgpmark {
  margin-top: 10%;
}
.vgpmark li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  width: 100%;
}
.vgpmark li .aw_logo {
  width: 14%;
  max-width: 70px;
}
.vgpmark li .aw_cap {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #000;
  padding-right: 1em;
  padding-left: 1.5em;
  font-family: 'DIN Regular';
  width: 86%;
}
.vgpmark li .aw_cap .p_name {
  font-size: 16px;
  line-height: 1.9;
}
.vgpmark li .aw_cap .p_name:before {
  content: '■';
  font-size: .8em;
  padding-right: .2em;
}
.vgpmark li .aw_cap .aw_txt {
  font-size: 12.8px;
  line-height: 1.45;
}
.vgpmark li img {
  width: 100%;
  vertical-align: bottom;
}
.vgpmark li+li {
  margin-top: 5%;
}



@media screen and (min-width:641px) {
  .pageTop {
    margin-top: 40px;
  }

}


.exp {
  position: relative;
  display: inline-block;
}
.exp:after {
  content: "制作中";
  color: #fff;
  background: #000;
  border: 1px solid #fff;
  width: 10em;
  line-height: 2.6;
  font-size: 1.2em;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  display: inline-block;
  text-align: center;
  font-weight: bold;
}