@charset "utf-8";

.grey-bg-box {
  background-color: #f5f5f5; 
  padding: 20px; 
  font-weight: bold; 
  text-align: center; 
  line-height: 1.8;
  font-size: 20px;
}

.small-text-aside-h3 {
  font-weight: normal;
  font-size: 14px;
  margin-left: 20px;
}

.keyvisual-outer {
  margin-left: 0;
}

.keyvisual__wrap__inner .keyvisual-outer {
  margin-top: 110px;
  background-color: rgba(255,255,255,0.9);
}

.pl-default-140 {
  padding-left: 140px !important;
}

a.bold-blue-link {
  font-weight: bold;
  color: #0062C2 !important;
}

.digitalshift-container .keyvisual-container .keyvisual-outer {
  width: 44% !important;
}

.digitalshift-container .keyvisual__wrap {
  left: unset;
}

.keyvisual__wrap__inner {
  display: block;
}

.keyvisual__wrap__container {
  width: 1190px;
  display: inline-block;
}

@media screen and (min-width: 1011px) and (max-width: 1020px) {
  .keyvisual__wrap__container {
    width: 765px;
  }
}

@media screen and (min-width: 600px) and (max-width: 1010px) {
  .keyvisual__wrap__container {
    width: 760px;
  }
}

@media screen and (min-width: 600px) {
  .keyvisual__wrap__inner .keyvisual-outer {
    margin-top: 85px;
    padding: 12px 25px;
  }

  .keyvisual__wrap__inner .keyvisual-outer__ttl {
    margin-bottom: 15px !important;
  }

  .km-kv-container__item__thumb {
    height: 300px;
  }

  .digitalshift-container .keyvisual-container .keyvisual-outer {
    width: 32% !important;
  }
}

@media screen and (min-width: 1200px) {
  .km-kv-container__item__thumb {
    height: unset;
  }
}

@media screen and (min-width: 1021px) and (max-width: 1345px) {
  .keyvisual__wrap__container {
    width: 100%;
    margin: 0 12.5%;
  }

  .digitalshift-container .keyvisual-container .keyvisual-outer {
    width: 37% !important;
  }
}

@media screen and (min-width: 1200px) { 
  .keyvisual__wrap__inner .keyvisual-outer {
    margin-top: 90px;
  }
}

@media screen and (min-width: 1346px) and (max-width: 1600px) {
  .keyvisual__wrap__container {
    width: 100%;
    margin: 0 12.5%;
  }

  .digitalshift-container .keyvisual-container .keyvisual-outer {
    width: 40% !important;
  }
}

@media screen and (min-width: 1400px) { 
  .keyvisual__wrap__inner .keyvisual-outer {
    margin-top: 100px;
  }
}

@media screen and (min-width: 1500px) { 
  .digitalshift-container .keyvisual-container .keyvisual-outer {
    width: 45% !important;
  }

  .keyvisual__wrap__inner .keyvisual-outer {
    margin-top: 110px;
  }
}

@media screen and (max-width: 599px) {
  .pl-phone-0 {
    padding-left: 0 !important;
  }
  
  .pl-phone-10 {
    padding-left: 10px !important;
  }

  .pr-phone-10 {
    padding-right: 10px !important;
  }

  .small-text-aside-h3 {
    margin-left: 10px;
  }

  #contentsArea.printlab .km-btn-cta-blank {
    padding: 0.92em 2em 0.92em 1em;
  }

  #contentsArea .km-btn-cta {
    padding: .92em 1.5em .92em 1em;
  }
  .p-caption {
    text-align: left !important;
  }
}

@media screen and (min-width: 599px) {
  .text-size-sp{
    font-size: 1.1rem!important;
  }
}

@media screen and (min-width: 390px) and (max-width: 599px) {
  .text-size-sp{
    font-size: calc(13px + (9 - 8) * ((100vw - 300px)/(599 - 300)))!important;
    text-wrap: nowrap;
  }

  .text-size-sp span{
    font-size: calc(13px + (9 - 8) * ((100vw - 300px)/(599 - 300)))!important;
    text-wrap: nowrap;
  }
}

@media screen  and (max-width: 390px) {
  .text-size-sp{
    font-size: calc(11px + (9 - 8) * ((100vw - 300px)/(390 - 300)))!important;
    text-wrap: nowrap;
  }

  .text-size-sp span{
    font-size: calc(11px + (9 - 8) * ((100vw - 300px)/(390 - 300)))!important;
    text-wrap: nowrap;
  }
}


@media screen and (min-width: 390px) and (max-width: 429px) {
  .text-size-boxsp, .text-size-boxsp span{
    font-size: 1.1rem!important;
  }
}


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

  .grey-bg-box {
    padding: 15px!important;
  }
  .text-size-boxsp, .text-size-boxsp span{
    font-size: 0.878rem!important;
  }
}