@charset "UTF-8";
* {
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

*, h1, h2, h3, h4, h5, p {
  padding: 0;
  margin: 0;
}

html {
  font-size: 10px;
  overflow-y: scroll;
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  html {
    overflow-x: hidden;
    width: 100%;
  }
}

body {
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  body {
    width: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
  }
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  body {
    overflow-x: hidden;
    width: 100%;
  }
}

a {
  text-decoration: none;
}

ul, li {
  list-style: none;
}

*:focus {
  outline: none;
}

img {
  vertical-align: bottom;
  border: 0px;
  width: 100%;
  height: 100%;
}

section {
  position: relative;
}

.pc-none {
  display: none;
}
@media screen and (min-width: 1501px) {
  .pc-none {
    display: none;
  }
}
@media screen and (min-width: 1281px) and (max-width: 1500px) {
  .pc-none {
    display: none;
  }
}
@media screen and (min-width: 961px) and (max-width: 1280px) {
  .pc-none {
    display: none;
  }
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .pc-none {
    display: block;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .pc-none {
    display: block;
  }
}
@media screen and (max-width: 375px) {
  .pc-none {
    display: block;
  }
}

.sp-none {
  display: block;
}
@media screen and (min-width: 1501px) {
  .sp-none {
    display: block;
  }
}
@media screen and (min-width: 1281px) and (max-width: 1500px) {
  .sp-none {
    display: block;
  }
}
@media screen and (min-width: 961px) and (max-width: 1280px) {
  .sp-none {
    display: block;
  }
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .sp-none {
    display: none;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .sp-none {
    display: none;
  }
}
@media screen and (max-width: 375px) {
  .sp-none {
    display: none;
  }
}

/****************************************
		1. General Setting
*****************************************/
html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption,
tbody, tfoot, thead, table, label, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
  list-style: none;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

* {
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

.clearfix:before,
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

html {
  background-color: #fff;
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  html {
    width: 99%;
    margin: 0 auto;
  }
}

body {
  font-family: "Noto Sans JP", "Inconsolata", "游ゴシック体", "YuGothic", "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "ms pgothic", "osaka", sans-serif;
  font-size: 14px;
  color: #000;
}

img {
  vertical-align: text-bottom;
}

iframe {
  width: 100% !important;
}

.clear {
  clear: both;
  line-height: 0;
}

/****************************************
costomize_propety
*****************************************/
header {
  background-color: #000 !important;
}

main {
  background-color: #fff !important;
  top: 0 !important;
}
.product_p h2 {
  margin: 100px 0 50px 0;
  font-size: 55px;
  letter-spacing: 6px;
  text-align: center;
  font-weight: 600;
}
.product_p h2 rt {
  font-size: 35px;
}

.s_box .prdct {
  font-size: 36px;
  color: #000;
  padding: 0 0 4px 16px;
  margin: 0 0 50px 0;
  border-left: 11px solid #c4c4c4;
}
.s_box .prdct a {
  color: #000;
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .s_box .prdct {
    width: 90%;
    font-size: 7.2vw;
    margin: 0 auto 50px;
  }
}
@media screen and (max-width: 375px) {
  .s_box .prdct {
    width: 90%;
    font-size: 7.5vw;
    margin: 0 auto 50px;
  }
}
.s_box .prdct .small {
  font-size: 22px;
  position: relative;
  top: -3px;
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .s_box .prdct .small {
    font-size: 5.2vw;
  }
}
@media screen and (max-width: 375px) {
  .s_box .prdct .small {
    font-size: 5.2vw;
  }
}
.s_box .img_box {
  width: 85%;
  text-align: center;
  margin: 0 auto;
  display: block;
}
.s_box .img_box .item {
  width: 39%;
  display: inline-block;
  vertical-align: top;
  margin: 0 50px 0 0;
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .s_box .img_box .item {
    display: block;
    width: 95%;
    margin: 0 auto 40px;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .s_box .img_box .item {
    display: block;
    width: 95%;
    margin: 0 auto 40px;
  }
}
@media screen and (max-width: 375px) {
  .s_box .img_box .item {
    display: block;
    width: 95%;
    margin: 0 auto 40px;
  }
}
.s_box .img_box .prm {
  width: 50%;
  display: inline-block;
  vertical-align: top;
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .s_box .img_box .prm {
    width: 100%;
    display: block;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .s_box .img_box .prm {
    width: 100%;
    display: block;
  }
}
@media screen and (max-width: 375px) {
  .s_box .img_box .prm {
    width: 100%;
    display: block;
  }
}
.s_box .disp {
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  padding: 20px 25px;
  text-align: center;
  font-size: 18px;
  color: #333;
  line-height: 1.45;
  margin: 50px 0 0 0;
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .s_box .disp {
    text-align: left;
    font-size: 16px;
    line-height: 1.55;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .s_box .disp {
    text-align: left;
    font-size: 16px;
    line-height: 1.55;
  }
}
@media screen and (max-width: 375px) {
  .s_box .disp {
    text-align: left;
    font-size: 16px;
    line-height: 1.55;
  }
}
.s_box .disp a {
  color: #333;
}
.s_box .button {
  display: block;
  text-align: center;
  width: 45%;
  border-radius: 10px;
  color: #fff;
  font-weight: 500;
  font-size: 24px;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: color, background-color;
  transition-property: color, background-color;
  -webkit-transition-property: transform;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-transform: scale(1);
  transform: scale(1);
  margin: 50px auto 200px;
  padding: 30px 25px;
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .s_box .button {
    width: 90%;
    font-size: 5.3vw;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .s_box .button {
    width: 90%;
    font-size: 5.3vw;
  }
}
@media screen and (max-width: 375px) {
  .s_box .button {
    width: 90%;
    font-size: 5.3vw;
  }
}
.s_box .button:hover {
  -webkit-animation-name: hover-button-size;
  animation-name: hover-button-size;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  margin: 50px auto 200px;
  padding: 30px 25px;
}
.s_box .stimupb {
  background-color: #ee0100;
}
.s_box .stimupb:hover {
  background-color: #ee0100;
}
.s_box .insoleb {
  background-color: #222222;
}
.s_box .insoleb:hover {
  background-color: #222222;
}
.s_box .somasoleb {
  background-color: #2a3e95;
}
.s_box .somasoleb:hover {
  background-color: #2a3e95;
}
.s_box .gateb {
  background-color: #138468;
}
.s_box .gateb:hover {
  background-color: #138468;
}
.s_box .trueb {
  background-color: #d73c18;
}
.s_box .trueb:hover {
  background-color: #d73c18;
}

.service {
  margin: 200px 0 200px 0;
}
.service .sub_title {
  margin: 150px 0 0 0;
  font-size: 55px;
  letter-spacing: 6px;
  text-align: center;
  font-weight: 600;
}
.service .sub_title rt {
  font-size: 35px;
}
.service .disp {
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  padding: 20px 25px;
  text-align: center;
  font-size: 18px;
  color: #333;
  line-height: 1.45;
  margin: 50px 0 0 0;
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .service .disp {
    text-align: left;
    font-size: 16px;
    line-height: 1.55;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .service .disp {
    text-align: left;
    font-size: 16px;
    line-height: 1.55;
  }
}
@media screen and (max-width: 375px) {
  .service .disp {
    text-align: left;
    font-size: 16px;
    line-height: 1.55;
  }
}
.service .disp a {
  color: #333;
}
.service .service_info {
  position: relative;
  margin: 120px 0 0 0;
}
@media screen and (min-width: 696px) and (max-width: 960px) {
  .service .service_info {
    display: block;
    width: 100%;
  }
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .service .service_info {
    display: block;
    width: 100%;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .service .service_info {
    display: block;
    width: 100%;
  }
}
@media screen and (max-width: 375px) {
  .service .service_info {
    display: block;
    width: 100%;
  }
}
.service .service_info .rehamo_link {
  position: absolute;
  border-radius: 0;
  border: 0;
  font-size: 25px;
  font-weight: 500;
  top: 85%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 696px) and (max-width: 960px) {
  .service .service_info .rehamo_link {
    display: block;
    width: 100%;
    font-size: 4.9vw;
    margin: 0 auto;
    left: 62.5%;
  }
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .service .service_info .rehamo_link {
    display: block;
    width: 100%;
    font-size: 4.9vw;
    margin: 0 auto;
    left: 62.5%;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .service .service_info .rehamo_link {
    display: block;
    width: 100%;
    font-size: 4.9vw;
    margin: 0 auto;
    left: 62.5%;
  }
}
@media screen and (max-width: 375px) {
  .service .service_info .rehamo_link {
    display: block;
    width: 100%;
    font-size: 4.9vw;
    margin: 0 auto;
    left: 62.5%;
  }
}
.service .service_info .rehamo_link:after {
  position: absolute;
  content: "";
  background-color: #000;
  width: 85%;
  height: 1.5px;
  bottom: 30px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media screen and (min-width: 696px) and (max-width: 960px) {
  .service .service_info .rehamo_link:after {
    display: none;
    width: 80%;
    height: 1.5px;
    bottom: -38px;
    left: 42.5%;
  }
}
@media screen and (min-width: 431px) and (max-width: 695px) {
  .service .service_info .rehamo_link:after {
    display: none;
    width: 80%;
    height: 1.5px;
    bottom: -38px;
    left: 42.5%;
  }
}
@media screen and (min-width: 376px) and (max-width: 430px) {
  .service .service_info .rehamo_link:after {
    display: none;
    width: 80%;
    height: 1.5px;
    bottom: -38px;
    left: 42.5%;
  }
}
@media screen and (max-width: 375px) {
  .service .service_info .rehamo_link:after {
    display: none;
    width: 80%;
    height: 1.5px;
    bottom: -38px;
    left: 42.5%;
  }
}
.service .service_info .rehamo_link a {
  display: inline-block;
  padding: 35px 4vw 35px 4vw;
  background-color: #fff;
  color: #000;
  -webkit-box-shadow: 2px 2px 2px rgba(33, 33, 33, 0.35);
          box-shadow: 2px 2px 2px rgba(33, 33, 33, 0.35);
  opacity: 0.96;
  -webkit-appearance: none;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: color, background-color;
  transition-property: color, background-color;
  -webkit-transition-property: transform;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}
.service .service_info .rehamo_link a:hover {
  cursor: pointer;
  color: #000;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
          box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
.service .service_info .rehamo_link span:after {
  content: "";
  display: inline-block;
  width: 28px;
  height: 28px;
  background-image: url("../img/button-arrow.png");
  background-position: center;
  background-size: contain;
  position: relative;
  top: 5px;
  margin: 0 0 0 7px;
}
/*# sourceMappingURL=product.css.map */