@charset "UTF-8";
/*============================================================================== header ============================================================================= */
@media screen and (max-width: 768px) { .header-block { display: flex; align-items: center; justify-content: space-between; }
  .header-logo { width: 3.69rem; font-size: 0; }
  .header-tel { width: 2.83rem; margin: 0 -0.3rem 0 0; } }

@media screen and (min-width: 769px) { .header-bg { padding: 18px 0; }
  .header-block { display: flex; align-items: center; justify-content: space-between; }
  .header-logo { width: 249px; font-size: 0; }
  .header-tel { position: relative; width: 105px; margin-right: 140px; }
  .header-tel:hover { -webkit-transform: scale(0.98, 0.98); -ms-transform: scale(0.98, 0.98); -webkit-transition: 0.3s ease; transform: scale(0.98, 0.98); opacity: 0.8; transition: 0.3s ease; }
  .header-tel .num { position: absolute; right: -160px; bottom: -10px; width: 230px; color: #063a62; font-size: 26px; font-weight: bold; letter-spacing: 0; } }

/*============================================================================== footer ============================================================================= */
@media screen and (max-width: 768px) { .footer-bg { padding: .7rem 0 .9rem; background: #000; color: #fff; font-weight: bold; }
  .footer-company { font-size: .26rem; text-align: center; letter-spacing: .04em; }
  .footer-company a { padding: 0 0 .02rem; border-bottom: 1px solid #fff; }
  .footer-copyright { margin: .48rem 0 0; font-size: .2rem; text-align: center; letter-spacing: .04em; } }

@media screen and (min-width: 769px) { .footer-bg { padding: 45px 0 55px; background: #000; color: #fff; font-weight: bold; }
  .footer-company { font-size: 16px; text-align: center; letter-spacing: .04em; }
  .footer-company a { padding: 0 0 .02rem; border-bottom: 1px solid #fff; }
  .footer-copyright { margin: 20px 0 0; font-size: 14px; text-align: center; letter-spacing: .04em; } }

/*============================================================================== form input ============================================================================= */
@media screen and (max-width: 768px) { .contact { color: #222; }
  .contact-top-bg { position: relative; padding: .7rem 0 .6rem; background: url(../img/form_bg01_sp.png) no-repeat 50% 0/cover; }
  .contact-top-bg::after { position: absolute; content: ""; width: 1.98rem; height: 2.05rem; right: .16rem; bottom: 0; background: url(../img/woman01.png) no-repeat 50% 0/cover; }
  .contact-top-ttl { margin: 0 0 0 .38rem; color: #fff; font-size: .7rem; font-weight: bold; line-height: 1.1; }
  .contact-form-bg { padding: .5rem .0 1.4rem; background: #f0f0f0; }
  .contact-form-step { font-size: 0; }
  .contact-form-txt { margin: .4rem 0 0; font-size: .28rem; }
  .contact-form-block { margin: .7rem 0 0; }
  .contact-privacy-desc { height: 3.08rem; margin: .1rem 0 0; padding: .08rem; background: #fff; }
  .contact-privacy-desc .desc-inner { height: 2.92rem; padding: .3rem .08rem 0 .2rem; overflow-y: scroll; }
  .contact-privacy-desc .desc-inner::-webkit-scrollbar { width: .08rem; border-radius: .08rem; }
  .contact-privacy-desc .desc-inner::-webkit-scrollbar-thumb { background-color: #b8b8b8; border-radius: .08rem; }
  .contact-privacy-desc .desc-inner::-webkit-scrollbar-track { background-color: #fff; border-radius: .08rem; }
  .contact-privacy-desc .txt { color: #222; font-size: .24rem; font-weight: bold; }
  .contact-privacy-desc .txt .block { display: block; margin: .3rem 0; font-weight: normal; }
  .contact-accept { margin: .4rem 0 0 1.4rem; font-size: 0; }
  .contact-accept .checkbox-label { display: inline-block; height: .75rem; padding: 0 0 0 .7rem; background: url(../img/form_check01.png) no-repeat left 50%; background-size: .5rem; font-size: .26rem; font-weight: bold; line-height: 1.4; }
  .contact-accept .checkbox { display: none; }
  .contact-accept .checkbox:checked + .checkbox-label { background-image: url(../img/form_check02.png); }
  .contact-btn { margin: .4rem 0 0; }
  .contact-btn bottom { display: block; }
  .form-item { font-size: 0; }
  .form-item:not(:first-of-type) { margin: .35rem 0 0; }
  .form-item dt { position: relative; display: inline-block; padding: 0 1.2rem 0 0; font-size: .36rem; font-weight: bold; }
  .form-item dt::before { position: absolute; right: 0; top: 50%; transform: translateY(-50%); padding: .05rem .1rem; color: #fff; font-size: .26rem; line-height: 1; }
  .form-item dt.require::before { content: "必須"; background: #de0000; }
  .form-item dt.optional::before { content: "任意"; background: #7d7d7d; }
  .form-item dd { margin: .1rem 0 0; color: #888; font-size: .32rem; font-weight: bold; letter-spacing: .04em; }
  .form-item input, .form-item select, .form-item textarea { width: 100%; height: 1.1rem; padding: .12rem .3rem; border: 1px solid #999; border-radius: .1rem; }
  .form-item input, .form-item textarea { box-shadow: 0.18rem 0.18rem 0.1rem rgba(0, 0, 0, 0.06) inset; }
  .form-item.zip dd { position: relative; padding: 0 0 0 .8rem; }
  .form-item.zip dd::before { position: absolute; content: "〒"; top: .3rem; left: .2rem; color: #222; font-size: .36rem; font-weight: bold; }
  .form-item.zip input { width: 6.1rem; }
  .form-item.address dd input { margin: .28rem 0 0; }
  .form-item.address .select-wrap { position: relative; }
  .form-item.address .select-wrap::after { content: ""; position: absolute; width: .17rem; height: .37rem; top: 50%; right: .32rem; transform: translateY(-50%); background: url(../img/form_arrow01.png) no-repeat 50% 0/cover; }
  .form-item.address .select-wrap select { width: 6.9rem; background: linear-gradient(#f9f9f9, #dedede); color: #222; }
  .form-item.address .select-wrap select::-ms-expand { display: none; }
  .form-item.consultation textarea { width: 6.9rem; height: 4.26rem; }
  /* validation message */
  .error, .form-item.address .select-wrap select.error { background: #ffe8f7; }
  .error-msg-balloon { position: relative; margin: .1rem 0 0; padding: .05rem 0; background: #ff8080; color: #fff; font-size: .2rem; text-align: center; }
  .error-msg-balloon::before { content: ""; position: absolute; top: -0.2rem; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-width: .1rem; border-style: solid; border-color: transparent transparent #ff8080 transparent; }
  .small-block + .error-msg-balloon, .small-width + .error-msg-balloon { padding: 0 0 0 5px; }
  /* errmsg-box */
  .errmsg-box { margin: 0 0 1.5em; padding: 1em .5em 1em; color: #ff3e3e; font-size: .28rem; background: #ffe8f7; }
  .contact-btn .back-btn {display: block; width: 4rem; margin: .45rem auto 0;}}

/* pc */
@media (min-width: 768px) { .contact-top .inner { position: relative; }
  .contact-top .inner::after { position: absolute; content: ""; width: 180px; height: 185px; right: 0; bottom: -70px; background: url(../img/woman01.png) no-repeat 50% 0/cover; }
  .contact-top-bg { position: relative; padding: 80px 0 70px; background: url(../img/form_bg01_pc.png) no-repeat 50% 0/cover; }
  .contact-top-ttl { margin: 0; color: #fff; font-size: 52px; text-align: center; letter-spacing: .08em; }
  .contact-form-bg { padding: 50px 0 70px; background: #f0f0f0; }
  .contact-form-step { width: 600px; margin: 0 auto; font-size: 0; }
  .contact-form-txt { margin: 30px 0 0; font-size: 20px; text-align: center; }
  .contact-form-block { width: 850px; margin: 70px auto 0; }
  .contact-privacy-desc { height: 300px; margin: 0 0 0 50px; padding: 5px; background: #fff; }
  .contact-privacy-desc .desc-inner { height: 290px; padding: 20px 20px 0 20px; overflow-y: scroll; }
  .contact-privacy-desc .desc-inner::-webkit-scrollbar { width: 8px; border-radius: 8px; }
  .contact-privacy-desc .desc-inner::-webkit-scrollbar-thumb { background-color: #b8b8b8; border-radius: 8px; }
  .contact-privacy-desc .desc-inner::-webkit-scrollbar-track { background-color: #fff; border-radius: 8px; }
  .contact-privacy-desc .txt { color: #222; font-size: 16px; font-weight: bold; }
  .contact-privacy-desc .txt .block { display: block; margin: 20px 0; font-weight: normal; }
  .contact-accept { margin: 40px 0 0 220px; font-size: 0; }
  .contact-accept .checkbox-label { display: inline-block; height: 25px; padding: 0 0 0 38px; background: url(../img/form_check01.png) no-repeat left 50%; background-size: 25px; font-size: 18px; font-weight: bold; line-height: 1.4; }
  .contact-accept .checkbox { display: none; }
  .contact-accept .checkbox:checked + .checkbox-label { background-image: url(../img/form_check02.png); }
  .contact-btn { margin: 50px auto 0; width: 400px; font-size: 0; }
  .contact-btn button { display: block; cursor: pointer; }
  .contact-btn button[disabled] { cursor: not-allowed; }
  .form-item { display: flex; flex-wrap: wrap; font-size: 18px; }
  .form-item:not(:first-of-type) { margin: 22px 0 0; }
  .form-item dt { position: relative; width: 240px; box-sizing: border-box; }
  .form-item dt::before { position: absolute; right: 0; top: 5px; padding: 4px 5px; color: #fff; font-size: 16px; line-height: 1; }
  .form-item dt.require::before { content: "必須"; background: #de0000; }
  .form-item dt.optional::before { content: "任意"; background: #7d7d7d; }
  .form-item dd { position: relative; width: 500px; margin: 0 0 0 50px; }
  .form-item input, .form-item select, .form-item textarea { width: 500px; height: 50px; padding: 9px 20px; border: 1px solid #999; border-radius: 5px; }
  .form-item input, .form-item textarea { box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.06) inset; }
  .form-item textarea { height: 200px; }
  .form-item.zip dd { padding: 0 0 0 40px; }
  .form-item.zip dd::before { position: absolute; content: "〒"; top: 10px; left: 5px; color: #222; font-size: 20px; font-weight: bold; }
  .form-item.zip input { width: 460px; }
  .form-item.address dd { width: 500px; }
  .form-item.address dd input { margin: 10px 0 0; }
  .form-item.address .select-wrap { position: relative; width: 500px; }
  .form-item.address .select-wrap::after { content: ""; position: absolute; width: 9px; height: 19px; top: 50%; right: 30px; transform: translateY(-50%); background: url(../img/form_arrow01.png) no-repeat 50% 0/cover; }
  .form-item.address .select-wrap select { width: 500px; background: linear-gradient(#f9f9f9, #dedede); color: #222; }
  .form-item.address .select-wrap select::-ms-expand { display: none; }
  .form-item .contact-privacy { display: block; }
  .form-item .contact-privacy-lead { width: 120px; }
  .form-item .contact-privacy-desc { width: 100%; margin: 10px 0 0; }
  .form-item.consultation textarea { width: 500px; min-width: 500px; max-width: 500px; height: 230px; min-height: 120px; max-height: 230px; }
  .form-item.contact-privacy { display: block; }
  /* validation message */
  .error, .form-item.address .select-wrap select.error { background: #ffe8f7; }
  .error-msg-balloon { position: relative; margin: 7px 0 0; padding: 3px 0; background: #ff8080; color: #fff; font-size: 14px; text-align: center; }
  .error-msg-balloon::before { content: ""; position: absolute; top: -12px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-width: 6px; border-style: solid; border-color: transparent transparent #ff8080 transparent; }
  /* errmsg-box */
  .errmsg-box { margin: 0 0 2em; padding: 1em; color: #ff3e3e; font-size: 16px; line-height: 1.15; background: #ffe8f7; } 
  .contact-btn .back-btn {width: 240px; margin: 37px auto 0;}}

/*============================================================================== confirm ============================================================================= */
#page-confirm dd { color: #222; font-weight: normal; }

#page-confirm .form-item:not(:first-of-type) { margin: .8rem 0 0; }

#page-confirm .form-item.zip dd { padding: 0; }

#page-confirm .form-item.zip dd::before { content: none; }

#page-confirm .contact-btn { margin: .8rem auto 0; }

@media (min-width: 769px) { #page-confirm .form-item:not(:first-of-type) { margin: 40px 0 0; }
  #page-confirm .contact-btn { margin: 70px auto 0; } }

/*============================================================================== thanks ============================================================================= */
@media (max-width: 768px) { .contact-thanks { margin: .5rem 0 0; }
  .contact-thanks .txt { font-size: .28rem; }
  .contact-thanks .txt .size { font-size: .38rem; font-weight: bold; }
  .contact-thanks .txt .block { display: block; margin: .35rem 0 0; }
  .contact-thanks .txt .bold { font-weight: bold; }
  .contact-thanks .txt .mail { color: #3273bd; font-weight: bold; } }

@media (min-width: 769px) { .contact-thanks { margin: 40px 0 0; }
  .contact-thanks .txt { font-size: 20px; text-align: center; }
  .contact-thanks .txt .size { font-size: 28px; font-weight: bold; }
  .contact-thanks .txt .block { display: block; margin: 20px 0 0; }
  .contact-thanks .txt .bold { font-weight: bold; }
  .contact-thanks .txt .mail { color: #3273bd; font-weight: bold; } }