/* --------------------------------------------------
  common styles
-------------------------------------------------- */
.card-unstyled {
  margin-bottom: 3rem;
}
.card-unstyled img.rounded {
  margin-bottom: 1.5rem;
}
.text-bold {
  font-weight: bold;
}
/* --------------------------------------------------
  override styles.css
-------------------------------------------------- */
body {
  padding-top: 85px;
}
@media (min-width: 1030px) {
  body {
    padding-top: 100px;
  }
}
@media (min-width: 1030px) {
  section {
    padding-bottom: 2rem;
  }
}
#main-visual {
  padding-top: 4rem;
  padding-bottom: 4rem;
}
#main-visual.bg-gradient:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 196px;
  background: transparent linear-gradient(180deg, #f8d7dc 0%, #ffffff 100%) 0% 0% no-repeat padding-box;
}
#main-visual .h1 {
  margin-bottom: 2rem;
  font-size: 3rem;
}
#main-visual .lead {
  margin-bottom: 1rem;
  font-weight: bold;
  font-size: 1.8rem;
}
#main-visual p:not([class]) {
  font-size: 1.5rem;
}
#main-visual .label {
  font-size: 1.6rem;
}
#main-visual .illust {
  text-align: center;
}
@media (max-width: 1029px) {
  #main-visual .column {
    margin-bottom: 0;
  }
  #main-visual img {
    max-width: 24rem;
  }
}
@media (min-width: 1030px) {
  #main-visual {
    padding-bottom: 5rem;
  }
  #main-visual .h1 {
    margin-bottom: 3rem;
    font-size: 3.4rem;
  }
  #main-visual .lead {
    margin-bottom: 1.5rem;
    font-size: 2.2rem;
  }
  #main-visual p:not([class]) {
    font-size: 1.8rem;
  }
  #main-visual .label {
    font-size: 2rem;
  }
  #main-visual .column-60 {
    padding-top: 6rem;
  }
  #main-visual .illust {
    text-align: right;
  }
}
.sec-header {
  padding-top: 6rem;
  padding-bottom: 5rem;
}
.sec-header .h2 {
  margin-bottom: 0 !important;
}
.sec-header .h2:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -2rem;
  width: 4.0rem;
  height: .4rem;
  background-color: #b00027;
}
#intro {
  padding-bottom: 3rem;
}
#intro .sec-header .h2:after {
  background-color: #fdd000;
}
#intro .h3 {
  text-align: left;
}
#intro .media {
  border: 0;
}
#intro .media-body:hover {
  color: inherit;
}
@media (min-width: 1030px) {
  #intro .h3 {
    font-size: 2.2rem;
  }
  #intro p {
    font-size: 1.8rem;
  }
  #intro .media-object {
    margin-right: 3.5rem;
    max-width: 32rem;
  }
}
#solution .bg-colored {
  padding-top: 2rem;
  background-color: #fff7d0;
}
#solution .sec-header .h2:after {
  background-color: #fdd000;
}
#solution .card-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(318px, 1fr));
  gap: 16px;
}
#solution .card {
  display: grid;
  grid-template: "title title" auto "illust body" auto / 120px auto;
  padding-bottom: 1.2rem;
  background: #fff;
  border: 1px solid #ededed;
  box-shadow: 2px 2px 0px #00000029;
  min-height: auto;
}
#solution .card .h3 {
  grid-area: title;
  margin-bottom: 2rem;
}
#solution .card .illust {
  grid-area: illust;
}
#solution .card p {
  grid-area: body;
}
#solution .h3 {
  color: #574a0e;
  text-align: left;
}
@media (max-width: 1029px) {
  #solution .card {
    grid-template-columns: 100px auto;
  }
  #solution .card .illust {
    width: 80px;
  }
}
@media (min-width: 1030px) {
  #solution .card-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }
  #solution .card .illust {
    width: 104px;
  }
  #solution .card p {
    padding-top: 1rem;
  }
  #solution .heading-group {
    margin-bottom: 5rem;
  }
  #solution .heading-group .h2 {
    margin-top: -1.8rem;
  }
}
#outline {
  padding-bottom: 6rem;
}
#outline table {
  margin-left: auto;
  margin-right: auto;
  max-width: 74.7rem;
}
#outline table th {
  background-color: #ffedf0;
}
#outline table td {
  text-align: left;
}
@media (min-width: 1030px) {
  #outline table td {
    padding-left: 1.8rem;
    padding-right: 1.8rem;
  }
}
#price .bg-colored {
  padding-top: 2rem;
  background-color: #f5f2ff;
}
#price .acms-table-responsive {
  margin-bottom: 2.4rem;
  padding-bottom: 8px;
  border: 0;
}
#price .acms-table-responsive + p {
  margin-left: auto;
  margin-right: auto;
  max-width: 74.7rem;
}
#price table {
  border: 0;
}
#price table thead th {
  background-color: #e2d17e;
  font-size: 1.6rem;
}
#price table thead th:not(:empty) {
  border-top: 1px solid #ddd;
}
#price table thead th:empty {
  background-color: transparent;
}
#price table tbody tr:first-child th {
  background-color: #b00027;
  color: #fff;
  font-size: 1.6rem;
}
#price table tbody tr:first-child td {
  background-color: #ffedf0;
  font-size: 1.6rem;
  font-weight: bold;
}
#price table tbody tr:first-child td span {
  font-size: 2.2rem;
}
#price table tbody tr:nth-child(2) th {
  color: #14988c;
}
#price table tbody tr:nth-child(3) th {
  color: #3b499f;
}
#price table tbody tr:nth-child(4) th {
  color: #cc0000;
}
#price table tbody th {
  border-left: 1px solid #ddd;
  background-color: #fff;
  height: 74px;
}
#price table tbody td {
  background-color: #fff;
  height: 74px;
}
#price .blank {
  display: inline-block;
  color: #707070;
  transform: scale(4, 1);
}
@media (min-width: 1030px) {
  #price table tbody td {
    font-size: 1.8rem;
  }
}
#feature {
  padding-bottom: 4rem;
}
#feature .illust {
  margin-bottom: 2rem;
}
#feature .h3 {
  margin-bottom: 2.5rem;
}
#handling {
  padding-bottom: 0;
}
#handling .bg-colored {
  padding-top: 2rem;
  background-color: #ffedf0;
}
#handling .sec-content {
  text-align: center;
}
#handling .sec-content p {
  margin-bottom: 3.5rem;
}
#handling .card {
  margin-left: auto;
  margin-right: auto;
  max-width: 71.3rem;
  background-color: #fff;
  border: 0;
}
#handling .dl-horizontal {
  margin-left: auto;
  margin-right: auto;
  display: inline-block;
  margin-bottom: 0;
}
#handling .dl-horizontal dt,
#handling .dl-horizontal dd {
  text-align: left;
}
#handling .dl-horizontal dt {
  position: relative;
  padding-left: 5.4rem;
  width: 19rem;
  font-size: 1.8rem;
}
#handling .dl-horizontal dt:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3.8rem;
  height: 3.8rem;
  border: 1px solid #d1d1d1;
  border-radius: 50%;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: contain;
}
#handling .dl-horizontal dt.item01:before {
  background-image: url(../img/thumb_handling01.png);
}
#handling .dl-horizontal dt.item02:before {
  background-image: url(../img/thumb_handling02.png);
}
#handling .dl-horizontal dt.item03:before {
  background-image: url(../img/thumb_handling03.png);
}
#handling .dl-horizontal dt.item04:before {
  background-image: url(../img/thumb_handling04.png);
}
#handling .dl-horizontal dt.item05:before {
  background-image: url(../img/thumb_handling05.png);
}
#handling .dl-horizontal dd {
  margin-left: 5.4rem;
  margin-bottom: 2rem;
  font-size: 1.5rem;
}
#handling .dl-horizontal dd:last-child {
  margin-bottom: 0;
}
@media (min-width: 1030px) {
  #handling .dl-horizontal dt,
  #handling .dl-horizontal dd {
    line-height: 3.8rem;
  }
  #handling .dl-horizontal dd {
    margin-left: 20.8rem;
    margin-bottom: 1.2rem;
  }
}

.h1.text-ub span{
  margin-right: 10px;
}
.h1.text-ub img{
  width: 200px;
  height: auto;
  margin: 10px 0 6px 0;
  vertical-align: bottom;
}

@media (max-width: 640px) {
  .h1.text-ub span{
    display: block;
    font-size: 28px;
  }
  .h1.text-ub img{
    width: 180px;
    height: auto;
  }
}