@charset "UTF-8";
/* ///////////////////////////////////////////
  value.scss
  変数・mixinに関する設定
/////////////////////////////////////////// */
/*====================================
  カラー
=====================================*/
/*
$color1: #1f3134; //黒っぽい緑
$color2: #ff0033; //赤
$color3: #b40034; //エンジ色
$color4: #0f3784; //青

//2022～
$color5: #aac467; //黄緑
$color7: #595757; //濃グレー

$mainColor: $color1;
$accentColor: #fff; //白

//2022～
$fontColor: $color7;

$bgColor1: #f8eef7; //薄ピンク
$bgColor2: #e0eff2; //水色
$bgColor3: #f4efe4; //ベージュ
$bgColor4: #f5f2ef; //グレーっぽいベージュ
$bgColor5: #fffee6; //薄黄色

$bdColor1: #d5d7d6; //グレー

$pastelColor1: #e3a7c8;
$pastelColor2: #f3efa1;
$pastelColor3: #a8cae5;
$pastelColor4: #ed7986;

$pastelColor1-dark: #eca1ca;
$pastelColor2-dark: #e6d223;
$pastelColor3-dark: #7ebded;

$mkColor1: #f6d1e5; //薄ピンク
$mkColor2: #c6e0f6; //水色
$mkColor3: #faf3b1; //黄色

//2022～
$boysColor: #5aa7ab;
$girlsColor: #ab226d;
$boysBgColor: #d4e5e6;
$girlsBgColor: #eadfe4;

$btnColor: #9fa0a0;
*/
/*====================================
  画像
=====================================*/
/*====================================
  font
=====================================*/
/*--------------------
～2021用フォント設定
--------------------*/
@font-face {
  font-family: "HoshizoraMincho";
  src: url(./../images/font/StarSkyMincyou-Regular.woff2) format("woff2");
  src: url(./../images/font/StarSkyMincyou-Regular.woff) format("woff");
}
/*--------------------
2022～フォント設定
--------------------*/
/*====================================
  レイアウト・パーツ
=====================================*/
/* /////////////////////////////////
  Media Queries
///////////////////////////////// */
/* /////////////////////////////////
  Media Queries
///////////////////////////////// */
/* ///////////////////////////////////////////
  repair.scss
  修理依頼フォームに関する記述
/////////////////////////////////////////// */
/*=================================
  repair
=================================*/
@media only screen and (max-width: 768px) {
  .page--repair {
    padding: 0 0 30px 0;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair {
    padding: 0 0 100px 0;
  }
}
.page--repair .message {
  display: block;
  max-width: 1060px;
  margin: 0 auto;
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "メイリオ", Meiryo, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, Arial, sans-serif;
}
@media only screen and (max-width: 768px) {
  .page--repair .message {
    padding: 0 20px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1219px) {
  .page--repair .message {
    padding: 0 30px;
  }
}
@media print, screen and (min-width: 1220px) {
  .page--repair .message {
    padding: 0 80px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair .message {
    margin-top: 30px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair .message {
    margin-top: 100px;
  }
  .page--repair .message p {
    text-align: center;
  }
}
.page--repair .repair__form {
  display: block;
  max-width: 1060px;
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  .page--repair .repair__form {
    padding: 0 20px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1219px) {
  .page--repair .repair__form {
    padding: 0 30px;
  }
}
@media print, screen and (min-width: 1220px) {
  .page--repair .repair__form {
    padding: 0 80px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair .repair__form {
    margin-top: 25px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair .repair__form {
    margin-top: 90px;
  }
}
.page--repair .repair__form .item__heading::after {
  display: none;
}
@media only screen and (max-width: 768px) {
  .page--repair .repair__form .item dl {
    margin-top: 25px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair .repair__form .item dl {
    margin-top: 45px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair .repair__form .item.repair__form--randoselu {
    margin-top: 30px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair .repair__form .item.repair__form--randoselu {
    margin-top: 100px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair .repair__form__customer {
    margin-bottom: 50px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair .repair__form__customer {
    margin-bottom: 100px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair .repair__form__randoselu {
    margin-bottom: 25px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair .repair__form__randoselu {
    margin-bottom: 45px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair.complete .message {
    margin-top: 25px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair.complete .message {
    margin-top: 90px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair.complete .message__heading {
    margin-bottom: 25px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair.complete .message__heading {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair.complete .message__heading::after {
    max-width: 150px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair.complete .message__heading::after {
    max-width: 200px;
  }
}
.page--repair.complete .message p {
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "メイリオ", Meiryo, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, Arial, sans-serif;
  text-align: center;
}
@media only screen and (max-width: 768px) {
  .page--repair.complete .message p:nth-child(n+2) {
    margin-top: 1em;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair.complete .message p:nth-child(n+2) {
    margin-top: 2em;
  }
}
.page--repair.complete .message a {
  width: 100%;
  max-width: 100%;
  height: 50px;
  color: #f7a1cb;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 15px;
  border: 1px solid #f7a1cb;
  background-color: #fff;
  cursor: pointer;
  transition: all 0.2s linear;
  position: relative;
  margin: 0 auto;
}
.page--repair.complete .message a::after {
  width: 0;
  height: 0;
  content: "";
  display: inline-block;
  border-style: solid;
  border-width: 4px 0 4px 6px;
  border-color: transparent transparent transparent #f7a1cb;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 17px;
  margin: auto 0;
}
@media print, screen and (min-width: 769px) {
  .page--repair.complete .message a:hover {
    color: #fff;
    background-color: #f7a1cb;
    text-decoration: none;
  }
  .page--repair.complete .message a:hover::after {
    border-color: transparent transparent transparent #fff;
  }
}
@media only screen and (max-width: 768px) {
  .page--repair.complete .message a {
    margin-top: 25px;
  }
}
@media print, screen and (min-width: 769px) {
  .page--repair.complete .message a {
    max-width: 300px;
    margin: 50px auto 0 auto;
  }
}/*# sourceMappingURL=repair.css.map */