@charset "UTF-8";
@import url(reset.css);
@import url(reset.css);
/* init */
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@media (min-width: 481px) {
  html {
    font-size: 62.5%;
  }
}
@media (max-width: 480px) {
  html {
    font-size: 56.25%;
  }
}

body {
  font-family: "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  font-size: 1.6rem;
  color: #232323;
}

a {
  transition: .5s;
}
a:hover:not(.tel) {
  opacity: .6;
}

@media (max-width: 480px) {
  img {
    width: 100%;
    height: auto;
  }
}

@media (min-width: 481px) {
  .pc {
    display: block;
  }

  .smp {
    display: none;
  }
}
@media (max-width: 480px) {
  .pc {
    display: none;
  }

  .smp {
    display: block;
  }
}
/* color */
.sec {
  clear: both;
  display: block;
  padding: 6% 3%;
  box-sizing: border-box;
}
@media (min-width: 481px) {
  .sec {
    padding: 80px 0;
    zoom: 1;
  }
  .sec:after {
    clear: both;
    content: "";
    display: block;
  }
}

@media (min-width: 481px) {
  .cont-wrap {
    position: relative;
    width: 1080px;
    margin: 0 auto;
  }
}

.sec-ttl {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  padding: 0 0 3%;
}
@media (min-width: 481px) {
  .sec-ttl {
    padding: 0 0 30px;
    font-size: 3.2rem;
  }
}

/* style_common */
@media (min-width: 481px) {
  header .cont-wrap {
    display: table;
    height: 90px;
  }
}
@media (min-width: 481px) {
  header .cont-wrap .hlogo {
    display: table-cell;
    width: 280px;
    vertical-align: middle;
  }
  header .cont-wrap .hlogo .top-img {
    width: 80%;
  }
  header .cont-wrap .hlogo .form-img {
    width: 20%;
  }
}
@media (max-width: 480px) {
  header .cont-wrap .hlogo {
    width: 50%;
    margin: 3% auto 5%;
  }
}
header .cont-wrap .hnav {
  display: none;
}
@media (min-width: 481px) {
  header .cont-wrap .hnav {
    display: table-cell;
    width: 800px;
    text-align: right;
    vertical-align: middle;
  }
  header .cont-wrap .hnav li {
    display: inline-block;
    margin: 0 0 0 30px;
  }
  header .cont-wrap .hnav a {
    color: #000;
    text-decoration: none;
  }
}

.sec-mv {
  position: relative;
  background: url(../images/mv_bg.jpg) center center no-repeat;
  background-size: cover;
}
@media (max-width: 480px) {
  .sec-mv {
    height: 0;
    padding-top: 115%;
  }
}
@media (min-width: 481px) {
  .sec-mv {
    position: relative;
    height: 492px;
  }
}
.sec-mv .cont-wrap {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
@media (max-width: 480px) {
  .sec-mv .cont-wrap {
    width: 100%;
  }
}
@media (min-width: 481px) {
  .sec-mv .cont-wrap {
    width: 410px;
  }
}
.sec-mv .mv-ttl {
  color: #fff;
  margin-left: 25px;
  font-size: 3.8rem;
  line-height: 4.7rem;
  font-weight: bold;
}
.sec-mv .mv-txt {
  margin: 3% 0;
  font-size: 1.6rem;
  line-height: 2.3rem;
  font-weight: bold;
}
@media (max-width: 480px) {
  .sec-mv .mv-contact {
    width: 80%;
    margin: 0 auto;
  }
}
.sec-mv .mv-contact img {
  vertical-align: initial;
}

@media (min-width: 481px) {
  .sec-summary .box01 {
    float: right;
    width: 446px;
  }
}
@media (max-width: 480px) {
  .sec-summary .box02 {
    padding: 3%;
  }
}
@media (min-width: 481px) {
  .sec-summary .box02 {
    float: left;
    width: 590px;
  }
}
.sec-summary .box02 b {
  color: #d70d2f;
}
.sec-summary .box03 {
  clear: both;
  padding: 3% 0 0;
}
.sec-summary .box03 ul {
  padding: 6% 6% 1%;
  background-color: #f6f6f6;
}
@media (min-width: 481px) {
  .sec-summary .box03 ul {
    padding: 30px 0 0;
    zoom: 1;
  }
  .sec-summary .box03 ul:after {
    clear: both;
    content: "";
    display: block;
  }
}
.sec-summary .box03 li {
  display: block;
  margin: 0 0 6%;
  background-color: #fff;
  border-radius: 4px;
  text-align: center;
  font-size: 1.8rem;
  overflow: hidden;
}
@media (min-width: 481px) {
  .sec-summary .box03 li {
    float: left;
    width: 302px;
    margin: 0 0 30px 42px;
  }
}
.sec-summary .box03 li h3 {
  padding: 3% 0;
  background-color: #2fbaeb;
  color: #fff;
  line-height: 1;
  font-weight: bold;
}
@media (min-width: 481px) {
  .sec-summary .box03 li h3 {
    padding: 5% 0;
  }
}
.sec-summary .box03 li p {
  margin: 3% auto 0;
  line-height: 2.9rem;
  font-weight: bold;
}
@media (min-width: 481px) {
  .sec-summary .box03 li p {
    margin: 6% auto 0;
  }
}
@media (min-width: 481px) {
  .sec-summary .box03 li img {
    margin: 3% 0;
  }
}
@media (max-width: 480px) {
  .sec-summary .box03 li img {
    width: auto;
  }
}

.sec-service {
  background: url(../images/service_bg.jpg) center center no-repeat;
  background-size: cover;
}
.sec-service .box01 {
  background-color: rgba(255, 255, 255, 0.85);
  padding: 6%;
}
@media (min-width: 481px) {
  .sec-service .box01 {
    padding: 60px;
  }
}
.sec-service .box01 img {
  margin: 3% 0 0;
}
@media (min-width: 481px) {
  .sec-service .box01 img {
    margin: 60px 0 0;
  }
}

.sec-store {
  background: url(../images/store_bg.jpg) center center no-repeat;
  background-size: cover;
}
.sec-store .box01 {
  padding: 6%;
  background-color: rgba(255, 255, 255, 0.85);
  border: 1px solid #a7a7a7;
  margin-bottom: 30px;
}
@media (min-width: 481px) {
  .sec-store .box01 {
    padding: 60px;
    zoom: 1;
  }
  .sec-store .box01:after {
    clear: both;
    content: "";
    display: block;
  }
}
@media (min-width: 481px) {
  .sec-store .box01 dl {
    border-top: 1px dashed #a7a7a7;
  }
}
.sec-store .box01 dt, .sec-store .box01 dd {
  padding: 3%;
}
@media (min-width: 481px) {
  .sec-store .box01 dt, .sec-store .box01 dd {
    padding: 20px 0;
  }
}
@media (min-width: 481px) {
  .sec-store .box01 dt {
    float: left;
    width: 23%;
    border-bottom: 1px dashed #a7a7a7;
  }
}
@media (max-width: 480px) {
  .sec-store .box01 dt {
    padding: 3% 0 0;
    font-weight: bold;
    text-align: center;
  }
}
.sec-store .box01 dd {
  border-bottom: 1px dashed #a7a7a7;
}
@media (min-width: 481px) {
  .sec-store .box01 dd {
    float: right;
    width: 77%;
  }
}
@media (max-width: 480px) {
  .sec-store .box01 dd {
    font-size: 1.4rem;
    line-height: 2.1rem;
    text-align: center;
  }
  .sec-store .box01 dd:last-child {
    border: none;
  }
}
.sec-store .box01 .gmap {
  position: relative;
  padding-top: 6%;
}
@media (min-width: 481px) {
  .sec-store .box01 .gmap {
    clear: both;
    content: "";
    display: block;
    padding: 30px 0 0;
  }
}
.sec-store .box01 .gmap iframe {
  width: 100%;
  height: 200px;
}
@media (min-width: 481px) {
  .sec-store .box01 .gmap iframe {
    height: 340px;
  }
}
.sec-store .box01 .gmap-btn {
  text-align: right;
}
.sec-store .box01 .gmap-btn a {
  color: #f08e1d;
}

.sec-gray {
  background-color: #f6f6f6;
  zoom: 1;
}
.sec-gray:after {
  clear: both;
  content: "";
  display: block;
}

@media (min-width: 481px) {
  .sec-privacy {
    float: left;
    width: 520px;
  }
}
@media (max-width: 480px) {
  .sec-privacy {
    padding-bottom: 6%;
  }
}
.sec-privacy .box01 {
  padding: 6%;
  height: 150px;
  background-color: #fff;
  font-size: 1.4rem;
  overflow-y: scroll;
}
@media (min-width: 481px) {
  .sec-privacy .box01 {
    height: 340px;
    padding: 30px;
  }
}
.sec-privacy .box01 p {
  margin: 0 0 3%;
}

@media (min-width: 481px) {
  .sec-company {
    float: right;
    width: 520px;
  }
}
.sec-company .box01 {
  padding: 6%;
  background-color: #fff;
}
@media (min-width: 481px) {
  .sec-company .box01 {
    height: 340px;
    padding: 30px;
  }
}
.sec-company .box01 dl {
  background-color: #fff;
}
@media (min-width: 481px) {
  .sec-company .box01 dl {
    border-top: 1px dashed #a7a7a7;
  }
}
.sec-company .box01 dt, .sec-company .box01 dd {
  font-size: 1.4rem;
  line-height: 2.1rem;
  padding: 3%;
}
@media (min-width: 481px) {
  .sec-company .box01 dt, .sec-company .box01 dd {
    padding: 20px 0;
    height: 44px;
  }
}
@media (min-width: 481px) {
  .sec-company .box01 dt {
    float: left;
    width: 23%;
    border-bottom: 1px dashed #a7a7a7;
  }
}
@media (max-width: 480px) {
  .sec-company .box01 dt {
    padding: 3% 0 0;
    font-weight: bold;
    text-align: center;
  }
}
.sec-company .box01 dd {
  border-bottom: 1px dashed #a7a7a7;
}
@media (min-width: 481px) {
  .sec-company .box01 dd {
    float: left;
    width: 77%;
  }
}
@media (max-width: 480px) {
  .sec-company .box01 dd {
    text-align: center;
  }
  .sec-company .box01 dd:last-child {
    border: none;
  }
}

.sec-contact {
  background: url(../images/contact_bg.jpg) center center no-repeat;
  background-size: cover;
}
@media (min-width: 481px) {
  .sec-contact .cont-wrap {
    width: 816px;
    zoom: 1;
  }
  .sec-contact .cont-wrap:after {
    clear: both;
    content: "";
    display: block;
  }
}
.sec-contact .sec-ttl {
  color: #fff;
  font-size: 3.8rem;
  line-height: 1;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  margin-left: 25px;
  padding: 0;
}
.sec-contact .ttl01 {
  color: #fff;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  padding: 3% 0;
}
@media (min-width: 481px) {
  .sec-contact .box01 {
    float: left;
    width: 400px;
  }
}
.sec-contact .box02 {
  position: relative;
}
@media (min-width: 481px) {
  .sec-contact .box02 {
    float: right;
    width: 400px;
  }
}
@media (max-width: 480px) {
  .sec-contact .box02 {
    margin: 3% 0 0;
  }
}
.sec-contact .box02 .btn01 {
  position: absolute;
  left: 50%;
  bottom: 40px;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
@media (max-width: 480px) {
  .sec-contact .box02 .btn01 {
    bottom: 16%;
    width: 80%;
  }
}

.sec-copyright {
  background-color: #2fbaeb;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
}
@media (min-width: 481px) {
  .sec-copyright {
    padding: 10px 0;
  }
}
@media (max-width: 480px) {
  .sec-copyright {
    margin: 0 0 20%;
  }
}

@media (max-width: 480px) {
  .sec-copyright-form {
    margin: 0;
  }
}

@media (max-width: 480px) {
  .formfooter {
    margin-bottom: 0;
  }
}

.fix-contact.pc {
  position: fixed;
  right: 0;
  top: 100px;
  width: 186px;
  padding: 15px 10px;
  background-color: #2fbaeb;
  border-radius: 6px;
  box-sizing: border-box;
  text-align: center;
}
.fix-contact.pc .ttl01 {
  padding: 0 0 10px;
}
.fix-contact.pc .box01 {
  padding: 20px 16px;
  background-color: #fff;
  border-radius: 6px;
}
.fix-contact.pc .box01 a {
  display: block;
  padding: 20px 0 0;
}

.fix-contact.smp {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  box-sizing: border-box;
  text-align: center;
}
.fix-contact.smp .ttl01 {
  padding: 0 0 10px;
}
.fix-contact.smp .box01 {
  zoom: 1;
}
.fix-contact.smp .box01:after {
  clear: both;
  content: "";
  display: block;
}
.fix-contact.smp .box01 li {
  position: relative;
  float: left;
  display: block;
  width: 50%;
  padding: 3% 1.5% 3% 3%;
  box-sizing: border-box;
}
.fix-contact.smp .box01 li:nth-child(2n) {
  padding: 3% 3% 3% 1.5%;
}
.fix-contact.smp .box01 a {
  display: block;
  width: 100%;
  padding: 6% 0;
  background-color: #00b9f4;
  color: #fff;
  border-radius: 4px;
  line-height: 1;
  font-weight: bold;
  text-decoration: none;
  box-sizing: border-box;
}

/* contact */
@media (min-width: 481px) {
  .sec-form .cont-wrap {
    width: 800px;
  }
}
.sec-form .ttl01 {
  text-align: center;
  margin: 0 0 6%;
}

@media (max-width: 480px) {
  .form table, .form tbody, .form tr, .form th, .form td {
    display: block;
  }
}
.form table {
  width: 100%;
  border-top: 1px dashed #a7a7a7;
}
@media (max-width: 480px) {
  .form tr {
    padding: 3% 0;
    border-bottom: 1px dashed #a7a7a7;
  }
}
.form th, .form td {
  padding: 2% 0;
}
@media (min-width: 481px) {
  .form th, .form td {
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px dashed #a7a7a7;
  }
}
@media (max-width: 480px) {
  .form th {
    font-weight: bold;
    text-align: left;
  }
}
@media (min-width: 481px) {
  .form th {
    width: 30%;
    vertical-align: top;
  }
}
@media (min-width: 481px) {
  .form td {
    width: 70%;
  }
}
.form .req th {
  position: relative;
}
.form .req th:after {
  content: "必須";
  display: inline-block;
  margin-left: 3%;
  padding: 2%;
  background-color: #d70d2f;
  color: #fff;
  border-radius: 3px;
  font-size: 1.2rem;
  line-height: 1;
}
.form .req select {
  width: 100%;
  border: 1px #ccc solid;
  padding: 10px;
  vertical-align: center;
  height: 40px;
}
.form .req .select {
  width: 65%;
  position: relative;
  cursor: pointer;
  padding-right: 0;
  padding: 5px;
  vertical-align: center;
  height: 100%;
}
.form .req select {
  cursor: pointer;
}
.form label, .form button {
  cursor: pointer;
  transition: .5s;
}
.form label:hover, .form button:hover {
  opacity: .6;
}
@media (max-width: 480px) {
  .form label, .form button {
    display: block;
  }
}
.form label {
  display: block;
}
.form input, .form textarea {
  font-family: "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  border: solid 1px #ccc;
}
.form input[type=text] {
  width: 100%;
  padding: 1%;
  font-size: 1.6rem;
  line-height: 1.3;
  box-sizing: border-box;
}
@media (min-width: 481px) {
  .form input[type=text] {
    width: 80%;
  }
}
.form input[name=monthly_i], .form input[name=bonus] {
  width: 90%;
}
@media (max-width: 480px) {
  .form input[name=monthly_i], .form input[name=bonus] {
    width: 85%;
  }
}
.form input[name=privacy_i] {
  margin-right: 20px;
}
@media (max-width: 480px) {
  .form input[name=privacy_i] {
    transform: scale(2);
  }
}
@media (min-width: 481px) {
  .form input[name=privacy_i] {
    transform: scale(1.5);
  }
}
@media (max-width: 480px) {
  .form input[type=checkbox] {
    display: inline-block;
  }
}
.form textarea {
  width: 100%;
  height: 16rem;
  padding: 1%;
  font-size: 1.6rem;
  line-height: 1.3;
  box-sizing: border-box;
}
.form .box-submit {
  text-align: center;
}
.form .box-submit button {
  display: inline-block;
  margin: 10% auto 0 auto;
  padding: 2% 4%;
  border: none;
  border-radius: 6px;
  font-size: 1.8rem;
  line-height: 1;
}
@media (max-width: 480px) {
  .form .box-submit button {
    width: 40%;
    padding: 5% 0;
  }
}
.form .box-submit button[type=submit] {
  background-color: #d70d2f;
  color: #fff;
}
@media (max-width: 480px) {
  .form .box-submit button[type=submit] {
    margin-top: 80px;
    margin-bottom: 60px;
  }
}
.form .box-submit .hisback {
  background: #F2F2F2;
}
@media (max-width: 480px) {
  .form .box-submit .hisback {
    width: 25%;
    line-height: 0.8;
  }
}
.form .box-submit p {
  margin: 6% 0 0;
}
@media (max-width: 480px) {
  .form .box-submit .doui {
    line-height: 0.5rem;
  }
}
.form .box-submit .doui .formErrorArrow {
  visibility: hidden;
}
.form .box-submit .req {
  display: inline-block;
  margin: 0 10px;
  padding: 5px;
  background-color: #d70d2f;
  color: #fff;
  border-radius: 3px;
  font-size: 1.2rem;
  line-height: 1;
}

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

@media screen and (min-width:376px) and (max-width:768px) {
	.sec-form .cont-wrap {
    width: 90%;}
	.cont-wrap { width: 100%;}
}