@import url(../../fonts.googleapis.com/earlyaccess/notosansjp.css);
.sec.howto_section > .title {
  padding-left: 7em;
  background-image: url(../images/howtouse/img_ttl_howtouse.png);
}
.sec.howto_section .contents {
  background: #fff;
  width: 100%;
  padding: 2% 5% 5% 5%;
}
.sec.howto_section .contents .title {
  font-size: 18px;
  text-align: center;
  line-height: 2;
  padding: 5% 0 0 0;
}
.sec.howto_section .contents .title .va_t .inner {
  display: inline-block;
}
.sec.howto_section .contents .title .va_t .inner .ruby {
  display: table;
}
.sec.howto_section .contents .title .va_t .inner .ruby .rb {
  display: table-row-group;
  line-height: 15px;
  text-align: center;
}
.sec.howto_section .contents .title .va_t .inner .ruby .rt {
  display: table-header-group;
  font-size: 10px;
  line-height: 1.8;
  letter-spacing: 1;
  text-align: center;
}
.sec.howto_section .contents .txt {
  width: 90%;
  margin: 3% auto;
  text-align: center;
  line-height: 1.7;
  font-size: 16px;
}
.sec.howto_section .contents .care {
  color: #fff;
  margin: 5% 0 0 0;
}
.sec.howto_section .contents .care.night {
  background: #333f48;
}
.sec.howto_section .contents .care.day {
  background: #01a7ca;
}
.sec.howto_section .contents .care > .title {
  font-size: 1.5em;
  padding: 5% 0 2%;
}
.sec.howto_section .contents .care > .title span {
  padding: 0 0 0 2%;
  vertical-align: middle;
  line-height: 2.5;
}
.sec.howto_section .contents .care .lists {
  width: 90%;
  margin: 0 auto;
  padding: 3% 0 5%;
}
.sec.howto_section .contents .care .lists .list .title {
  font-size: 1em;
  padding: 2% 0;
}
.sec.howto_section .contents .care .lists .list .box {
  padding: 3% 0;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
.sec.howto_section .contents .care .lists .list .box:after {
  display: block;
  content: "";
  clear: both;
}
.sec.howto_section .contents .care .lists .list .box .img {
  float: left;
  width: 25%;
  text-align: center;
}
.sec.howto_section .contents .care .lists .list .box .text {
  float: left;
  width: 75%;
  font-size: .81em;
}
.sec.howto_section .contents .care .lists .list .box .text .list {
  margin: 4% 0;
}
.sec.howto_section .contents .care .lists .list .box .sub {
  font-size: 10px;
  line-height: 2;
  float: right;
  width: 75%;
}
.sec.howto_section .contents .care .lists .list .triangle {
  text-align: center;
  padding: 2% 0 0;
}

@media (max-width: 1024px) {
  .sec.howto_section > .title {
    padding-left: 6em;
  }
}
@media (max-width: 500px) {
  .sec.howto_section > .title {
    padding-left: 0;
  }
  .sec.howto_section .contents .title {
    font-size: 15px;
  }
  .sec.howto_section .contents .txt {
    font-size: 12.8px;
  }
  .sec.howto_section .contents .care > .title {
    font-size: 1.2em;
  }
  .sec.howto_section .contents .care .lists .list .box .img {
    float: none;
    width: 25%;
    margin: 0 auto;
  }
  .sec.howto_section .contents .care .lists .list .box .text {
    float: none;
    width: 100%;
  }
  .sec.howto_section .contents .care .lists .list .box .sub {
    float: none;
    width: 100%;
  }
}

/*# sourceMappingURL=howtouse.css.map */