@charset 'utf-8';
body {
  font-size: 12px;
  position: relative;
  -webkit-appearance: none;
  -webkit-text-size-adjust: 100%;
}


input[type='submit'] {
  -webkit-text-size-adjust: 100%;
}

input, select, textarea {
  font-size: 16px !important;
}

.pc {
  display: none;
}

.pc-ib {
  display: none;
}

.sp {
  display: block;
}

.sp-ib {
  display: inline-block;
}

input[type='image'] {
  max-width: 100%;
}

/*------------------------------------------------------------------------------
  layout
------------------------------------------------------------------------------*/

.sp_page_links {
  display: none !important;
}

.inner-block {
  padding: 30px 15px;
}

/*------------------------------------------------------------------------------
  common-parts
------------------------------------------------------------------------------*/

.link-pos {
  position: relative;
  top: 76px;
}

/* contact-btn */

.contact-btn {
  margin-top: 20px;
  text-align: center;
}

.contact-btn a {
  background-position:
    40% center,
    right 25px center;
  background-size:
    auto 19px,
    21px auto;
  border-radius: 26px;
  box-shadow: 0 4px 0 #00afce;
  width: 290px;
  height: 52px;
}

/* ico-arrow */

.has-arrow .inner-block::before {
  top: -15px;
  width: 30px;
  height: 30px;
}

/*------------------------------------------------------------------------------
  mv
------------------------------------------------------------------------------*/

.mv-block .inner-block {
  padding: 15px 0;
}

.mv-block .ttl {
  margin-bottom: 20px;
}

/*------------------------------------------------------------------------------
  push-block
------------------------------------------------------------------------------*/

.push-block {
  background-size: auto 200px;
}

.push-block::before {
  background-image: url(../img/sp/push_flag.png);
  background-size: 100% auto;
  top: -5px;
  width: 100%;
  height: 0;
  padding-top: 22%;
}

.push-block .inner-block {
  height: auto;
  padding-bottom: 40px;
}

.push-block .ttl img {
  max-width: 290px;
}

/*------------------------------------------------------------------------------
  problem-block
------------------------------------------------------------------------------*/

.problem-block {
  margin-top: -10px;
}

.problem-block .inner-block {
  padding-top: 30px;
}

.problem-block .ttl img {
  width: 290px;
}

.problem-list {
  margin: 20px -15px 0;
}

.problem-list li + li {
  margin-top: -10%;
}

/*------------------------------------------------------------------------------
  solution-block
------------------------------------------------------------------------------*/

.solution-block .ttl {
  margin-bottom: 15px;
}

.solution-block .ttl img {
  width: 290px;
}

.solution-list li {
  padding: 15px;
}

.solution-list li + li {
  margin-top: 15px;
}

.solution-list li .img {
  margin-bottom: 15px;
  text-align: center;
}

.solution-list li .img img {
  width: 186px;
}

.solution-list li .list-ttl {
  margin-bottom: 15px;
  padding: 10px 0 10px 75px;
}

.solution-list li .list-ttl img {
  height: 37px;
}

.solution-list li .txt {
  font-size: 12px;
}

.solution-list .sample-box {
  margin-top: 33px;
  padding-top: 33px;
}

.solution-list .sample-box .sample-ttl {
  margin-bottom: 15px;
  text-align: center;
}

.solution-list .sample-box .sample-ttl img {
  width: 260px;
}

.solution-list .sample-box .balloon {
  top: -25px;
  width: 93px;
  height: 45px;
}

.solution-list .sample-box .sample-txt {
  font-size: 12px;
}


.solution-list .sample-box table,
.solution-list .sample-box table tbody,
.solution-list .sample-box table tr,
.solution-list .sample-box table th,
.solution-list .sample-box table td {
  display: block;
  font-size: 12px;
  text-align: center;
  width: 100%;
}

.solution-list .sample-box table {
  margin-top: 15px;
}

.solution-list .sample-box table th,
.solution-list .sample-box table td {
  padding: 10px 5px;
}

.solution-list .sample-box table th {
  background: #f2f2f2;
  border-bottom: 0;
}

.solution-list .sample-box table tr + tr th {
  border-top: 0;
}

/*------------------------------------------------------------------------------
  sample-block
------------------------------------------------------------------------------*/

.sample-block {
  background-size: 8px 1px;
}

.sample-block .ttl {
  margin-bottom: 15px;
  text-align: center;
}

.sample-block .ttl img {
  width: 158px;
}

.sample-block .inner {
  padding: 15px;
}

.sample-block .before,
.sample-block .after {
  margin: auto;
  max-width: 450px;
}

.sample-block .after {
  margin-top: 15px;
}

.sample-block .after::before {
  background-image: url(../img/sp/sample_arrow.png);
  background-size: 100% 100%;
  top: -35px;
  left: auto;
  right: 15px;
  width: 42px;
  height: 70px;
}

.sample-block .before .img::before,
.sample-block .after .img::before {
  top: -4px;
  left: -16px;
  width: 134px;
  height: 64px;
}

.sample-block .before .img::after,
.sample-block .after .img::after {
  border: 10px solid #fff;
  box-shadow: 0 0 2px rgba(0,0,0,0.2);
}

.sample-block .before .balloon,
.sample-block .after .balloon {
  border-width: 1px;
  border-radius: 5px;
  margin-top: 10px;
  padding: 15px;
  text-align: center;
}

.sample-block .before .balloon::before,
.sample-block .after .balloon::before {
  top: -27px;
  left: 0;
  right: 0;
  width: 26px;
  height: 27px;
}

.sample-block .before .balloon img {
  width: 192px;
}

.sample-block .after .balloon img {
  width: 227px;
}

.sample-list {
  padding-top: 20px;
}

.sample-list li {
  width: 48%;
}

.sample-list li::after {
  border: 3px solid #fff;
  box-shadow: 0 0 2px rgba(0,0,0,0.2);
}

.sample-list li:nth-child(even) {
  float: right;
}

.sample-list li:nth-child(n+3) {
  margin-top: 5%;
}

/*------------------------------------------------------------------------------
  strong-block
------------------------------------------------------------------------------*/

.strong-block .ttl img {
  width: 290px;
}

.strong-block .txt {
  font-size: 12px;
  margin-top: 30px;
  text-align: left;
}

/*------------------------------------------------------------------------------
  contact-block
------------------------------------------------------------------------------*/

.contact-block .ttl {
  margin-bottom: 20px;
}

.contact-block .ttl img {
  height: 23px;
}

.contact-block .tel a {
  display: block;
  margin: auto;
  position: relative;
  max-width: 450px;
}

.contact-block .tel a::before {
  background: #fff;
  border-radius: 45px;
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 90px;
}

.contact-block .tel img {
  position: relative;
  z-index: 1;
}

.form-box {
  margin-top: 20px;
  padding: 15px;
}

.form-box .form-ttl {
  margin-bottom: 30px;
}

.form-box .form-ttl img {
  max-height: 20px;
}

.form-box .btn-warning {
  background-position:
    center center,
    right 25px center;
  background-size:
    auto 19px,
    21px auto;
  border-radius: 26px;
  box-shadow: 0 4px 0 #00afce;
  /* width: 260px; */
  height: 52px;
}

.form-box .form-group {
  text-align: left;
}

/*------------------------------------------------------------------------------
  clearfix
------------------------------------------------------------------------------*/
.entry .inn:after {
  clear: both;
  content: '';
  display: block;
  height: 0;
  font-size: 0;
  visibility: hidden;
}