@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.7rem;writing-mode: vertical-rl;}
  .header-tel { width: 2.84rem; padding: .055rem 0;} }

@media screen and (min-width: 769px) { 
  .header-block { padding: 18px 0;}
  .header-logo { width: 262px; font-size: 0; }}

/*============================================================================== footer ============================================================================= */
@media screen and (max-width: 768px) { 
  .footer-bg { padding: 1.21rem 0; background: #000; color: #fff; font-weight: bold; }
  .footer-copyright { font-size: .2rem; text-align: center; letter-spacing: .04em; } }

@media screen and (min-width: 769px) { 
  .footer-bg { padding: 73px 0; background: #000; color: #fff; font-weight: bold; }
  .footer-copyright { font-size: 14px; text-align: center; letter-spacing: .04em; } }

/*============================================================================== form input ============================================================================= */
@media screen and (max-width: 768px) {
  .contact-top-ttl { background: url(../images/form_bg01_sp.webp) no-repeat center/cover;height: 2.96rem;width: 100%;}
  .contact-form-bg { padding: .2rem 0 1.35rem; background: #e9eff2; }
  .contact-form-txt { margin: .4rem 0 0; font-size: .28rem; }
  .contact-form-block { margin: .64rem 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: .27rem .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: #000; font-size: .24rem; font-weight: bold; line-height: 1.5;}
  .contact-privacy-desc .txt .block { display: block; margin: .35rem 0; font-weight: normal; }
  .contact-accept { margin: .41rem 0 0 1.4rem; font-size: 0; }
  .contact-accept .checkbox-label { display: inline-block; height: .75rem; padding: 0 0 0 .7rem; background: url(../images/form_check01.webp) no-repeat left 50%; background-size: .5rem; font-size: .28rem; font-weight: bold; line-height: 1.38; }
  .contact-accept .checkbox { display: none; }
  .contact-accept .checkbox:checked + .checkbox-label { background-image: url(../images/form_check02.webp); }
  .contact-btn { margin: .44rem 0 0; }
  .form-btn-contents {background: url(../images/btn01-before.webp) no-repeat center/cover; pointer-events: none; width: 6.9rem;height: 1.5rem;-webkit-transition: 0.5s; transition: 0.5s;cursor: not-allowed;}
  .form-btn-contents.true {background: url(../images/btn01.webp) no-repeat center/cover; pointer-events: auto; width: 6.9rem;height: 1.5rem;border-radius: 4.3rem;}
  .form-btn-contents:hover {opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); background-color: unset;}
  .form-item { font-size: 0; }
  .form-item:not(:first-of-type) { margin: .33rem 0 0; }
  .form-item:last-of-type { margin: .19rem 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: .07rem .12rem; color: #fff; font-size: .26rem; line-height: 1; }
  .form-item dt.require::before { content: "必須"; background: #f13f18; }
  .form-item dt.optional::before { content: "任意"; background: #7d7d7d; }
  .form-item dd { margin: .13rem 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: .3rem 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(../images/form_arrow01.webp) 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; }
  #page-confirm dd {margin: .27rem 0 0;line-height: 1.36; font-size: .32rem;}
  /* 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: #f13f18; 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 #f13f18 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: #f13f18; font-size: .28rem; background: #ffe8f7; }
  .contact-btn .back-btn {display: block; width: 4rem; margin: .45rem auto 0;}
  .confirm-btn {border-radius: 4.3rem;}
  .confirm-btn:hover {opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); background-color: unset;}
  .contact-btn .back-btn {border-radius: 4.3rem;}
  .contact-btn .back-btn:hover {opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 8); box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 8); background-color: unset;}}

/* pc */
@media (min-width: 768px) { .contact-top .inner { position: relative; }
  .contact-top-ttl { background: url(../images/form_bg01.webp) no-repeat center/cover; height: 224px; width: 100%;}
  .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(../images/form_check01.webp) 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(../images/form_check02.webp); }
  .contact-btn { margin: 50px auto 0; width: 400px; font-size: 0; }
  .form-btn-contents {background: url(../images/btn01-before.webp) no-repeat center/cover; pointer-events: none; width: 400px; height:87px;-webkit-transition: 0.5s; transition: 0.5s;cursor: not-allowed;}
  .form-btn-contents.true {background: url(../images/btn01.webp) no-repeat center/cover; pointer-events: auto; width: 400px;height:87px;cursor: pointer;border-radius: 43px;}
  .form-btn-contents:hover {opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); background-color: unset;}
  .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; color: #888; }
  .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(../images/form_arrow01.webp) 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: #f13f18; 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 #f13f18 transparent; }
  /* errmsg-box */
  .errmsg-box { margin: 0 0 2em; padding: 1em; color: #f13f18; font-size: 16px; line-height: 1.15; background: #ffe8f7; } 
  .confirm-btn{ border-radius: 43px;}
  .confirm-btn:hover {opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); box-shadow: 0 4px 3px 0 rgba(82, 17, 17, 0.8); background-color: unset;}
  .contact-btn .back-btn {width: 240px; margin: 37px auto 0; border-radius: 45px;}}
  .contact-btn .back-btn:hover {opacity: 1; -webkit-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-3px); transform: translateY(-3px); -webkit-box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 8); box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 8); background-color: unset;}
/*============================================================================== confirm ============================================================================= */
#page-confirm dd { color: #000; font-weight: normal; }
#page-confirm .form-item.zip dd { padding: 0; }
#page-confirm .form-item.zip dd::before { content: none; }

@media (max-width: 768px) {
  #page-confirm .form-item:not(:first-of-type) { margin: .87rem 0 0; }
  #page-confirm .form-item:last-of-type { margin: .92rem 0 0; }
  #page-confirm .contact-btn { margin: .62rem auto 0; }
  #page-confirm .contact-btn:last-child { margin: -.06rem auto 0; }
  #page-confirm .contact-form-bg { padding: .2rem 0 .88rem;}
}

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

/*============================================================================== thanks ============================================================================= */
@media (max-width: 768px) { 
  .contact-thanks { margin: .46rem 0 0; }
  .contact-thanks .txt { font-size: .28rem; line-height: 1.57;}
  .contact-thanks .txt .size { font-size: .38rem; font-weight: bold; }
  .contact-thanks .txt .block { display: block; margin: .35rem 0 .45rem; }
  .contact-thanks .txt .bold { font-weight: bold; }
  #page-thanks .contact-form-bg { padding: .2rem 0 .82rem;}}

@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; }}