/* body {
  padding-bottom: 150px;
} */

@media only screen and (min-width: 761px) {
  body {
    background-color: #F5F5F5;
    box-shadow: 0 0 15px -5px #000000;
  }
}

.sp-f {
  display: none;
}

input[readonly] {
  color: #333333;
}

.cv_area01 {
  padding: 0 25px;
  margin-top: -170px;
}

.cv_area02 {
  padding: 50px 25px;
}

.cv_area02 .tel_btn02 {
  margin-bottom: 5px;
}

#form {
  padding-top: 135px;
  margin-top: -135px;
}

.problem {
  margin-top: 12px;
}

.other_menu {
  width: 92%;
  margin: 0 auto;
}

.other_menu ul {
  padding-top: 30px;
  padding-bottom: 40px;
}

.other_menu ul li {
  margin-top: 13px;
  padding-bottom: 12px;
  border-bottom: solid 1px #DDDDDD;
  font-size: 12px;
  position: relative;
}

.other_menu ul li::after {
  content: '';
  position: absolute;
  top: 2px;
  right: 15px;
  width: 7px;
  height: 7px;
  margin: auto;
  border-top: 1px solid #333333;
  border-right: 1px solid #333333;
  transform: rotate(45deg);
  box-sizing: border-box;
}

.other_menu ul li a {
  display: block;
  text-decoration: none;
  color: #333333;
  padding-left: 8px;
}

.footer .logo_area .kaitry {
  width: 133px;
  margin: 0 auto 20px;
}

.footer .logo_area .pptc {
  width: 135px;
  margin: 0 auto 22px;
}

.copyright {
  font-size: 14px;
  text-align: center;
  letter-spacing: 0.5px;
  padding-bottom: 40px;
}

/***
  * TOP
  */
.no_suggest_result {
  position: absolute;
  z-index: 10;
  width: 400px;
  padding: 26px 20px;
  background: #fff;
  text-align: center;
  border-radius: 2px;
  display: none;
}

.el-card, .shadow {
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25) !important;
}

.no_suggest_result .main_txt {
  font-size: 20px;
  margin-bottom: 12px;
}

.bold {
  font-style: normal !important;
  font-weight: 700 !important;
}

.no_suggest_result .sub_txt {
  font-size: 16px;
  line-height: 170%;
}

.no_suggest_result .form_button {
  margin: 26px auto 6px;
  padding: 12px 60px;
  font-size: 16px;
  border-radius: 4px;
  background: #ff8900;
  color: #ffffff;
  text-decoration: none;
  display: block;
  width: 36%;
}

body .section ul li .value .selectShortWrap {
  position: relative;
}

body .section ul li .value .selectShortWrap::after,
body .section ul li .value .selectShortWrap::before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  content: "";
  width: 14px;
  height: 10px;
  background-size: 14px 9px;
}

body .section ul li .value .selectShortWrap::after {
  z-index: 101;
  background: url(../img/triangle.png) no-repeat;
  right: 16px;
}

body .section ul li .value .selectShortWrap::before {
  z-index: 100;
  background-color: #fff;
  right: 1px;
}

body .section ul li .value select.short {
  width: 100%;
  background: none;
}


/***
  * 査定完了画面
  */

.assessment_wrap {
  padding-top: 42px;
}

.assessment_result.form_detail {
  margin-bottom: 0;
  padding-bottom: 46px;
}

.assessment_result {
  width: 100%;
  max-width: 800px;
  margin-right: auto;
  margin-left: auto;
  padding-bottom: 64px;
  margin-bottom: 48px;
}

.assessment_result.form_detail .result_head {
  margin-bottom: 0;
}

.assessment_result .result_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 62px;
}

.assessment_result .result_head .title {
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 36px;
}

.assessment_result .result_head .price {
  margin-bottom: 40px;
}

.assessment_result .result_head .price .price_label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 300px;
  height: 74px;
  font-size: 28px;
  font-weight: 700;
  background-color: #f3faff;
  margin: auto;
}

.assessment_result .result_head .price .price_number {
  font-size: 64px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 8px;
}

.assessment_result .result_head .price .price_number small {
  font-size: 36px;
}

.assessment_result .result_head .price .price_note {
  font-size: 16px;
  font-weight: 700;
  color: #ff5959;
}

.assessment_result .result_head .ai_note {
  color: #ff5959;
  text-align: center;
  width: 100%;
  max-width: 700px;
  border: 2px solid #ff5959;
  padding: 15px;
}

.assessment_result .result_head .ai_note .ai_note_title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 12px;
}

.assessment_result .result_head .ai_note .ai_note_content {
  font-size: 14px;
}

.assessment_advantage {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 64px;
}

.assessment_advantage .advantage_title {
  font-size: 24px;
  font-weight: 700;
  border-bottom: 4px solid #32a3fd;
  margin-bottom: 24px;
}

.assessment_advantage .advantage_body {
  display: flex;
  width: 100%;
  max-width: 852px;
}

.assessment_advantage .advantage_body .advantage_item {
  position: relative;
  font-size: 18px;
  font-weight: 700;
  width: calc((100% - 24px) / 3);
  border: 1px solid #32a3fd;
  margin-right: 12px;
  padding: 12px 12px 12px 40px;
}

.assessment_advantage .advantage_body .advantage_item:last-child {
  margin-right: 0;
}

.assessment_contact_box {
  display: flex;
  justify-content: center;
  background-color: #f3faff;
  padding: 64px 0;
}

.assessment_contact_box .contact_box_item {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 330px;
  height: 80px;
  text-align: center;
  color: #fff;
  font-size: 18px;
  border-radius: 4px;
  box-shadow: 0 4px 4px 0 #00000040;
  background-color: #ff8900;
  margin-right: 21px;
}

.assessment_contact_box .contact_box_item small {
  font-size: 14px;
}

.assessment_contact_box .contact_box_item strong {
  font-size: 18px;
  font-weight: 700;
}

.assessment_contact_box .contact_box_item.phone {
  position: relative;
  font-size: 16px;
  border: 2px solid #62c3bd;
  background-color: #fff;
  color: #62c3bd;
  pointer-events: none;
  cursor: default;
}

.assessment_contact_box .contact_box_item:last-child {
  margin-right: 0;
}

.assessment_contact_box .contact_box_item {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 330px;
  height: 80px;
  text-align: center;
  color: #fff;
  font-size: 18px;
  border-radius: 4px;
  box-shadow: 0 4px 4px 0 #00000040;
  background-color: #ff8900;
  margin-right: 21px;
}

.assessment_contact_box .contact_box_item.phone strong {
  font-size: 16px;
  border-bottom: 1px solid #62c3bd;
}

#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #000;
  z-index: 1;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  text-align: center;
  color: #fff;
  z-index: 2;
}

.form .btnWrap .btn[disabled] {
  background-color: #9b9b9bfd;
  color: #fff;
  cursor: not-allowed;
  font-size: 14px;
}

.contentWrapper .notice {
  display: block;
  color: #ff5959;
  background-color: #fff;
  font-size: 12px;
  margin-bottom: 14px;
}

.show_none {
  display: none;
}

.pr-flow-big-area {
  width: 94%;
  margin: 0 auto 30px;
  background-color: #133B60;
  border-radius: 10px;
  padding: 30px 0;
}

.pr-flow-area {
  background-color: #fff;
  width: 90%;
  margin: 0 auto;
  padding: 30px 0px;
}

.value-title {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 25px;
}

.value-area {
  width : 90%;
  background-color: #fff;
  box-shadow: 0 3px 2px rgba(2, 2, 2, .12);
  margin: 0 auto;
}

.value-content-title {
  background-color: #8F8F8F;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 10px 0;
}

.value-content {
  color: #2C2C2C;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  padding: 10px 0;
}

.pr-flow-application-area {
  width: 90%;
  background-color: #fff;
  box-shadow: 0 3px 2px rgba(2, 2, 2, .12);
  margin: 20px auto 0;
  padding-bottom: 15px;
}

.application-title {
  background-color: #8F8F8F;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 10px 0;
  margin-bottom: 15px;
}

.application-txt {
  color: #2C2C2C;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 6px;
}

.cv-btn-form a {
  display: block;
  width: 90%;
  margin: 10px auto 0;
  text-decoration: none;
  background-color: #EC4747;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 17px 0;
  border-radius: 8px;
}

.cv-btn-call {
  width: 90%;
  margin: 12px auto 0;
  background-color: #0093F6;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 16px 0;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pr-flow-big-area .cv-btn-call {
  width: 80%;
}

.cv-area-call {
  color: #fff;
  text-decoration: none;
}

.cv-call-txt {
  text-align: center;
  color: #0093F6;
  font-weight: bold;
  font-size: 13px;
  margin: 4px 0 8px;
}

.other-flow-area {
  width: 90%;
  background-color: #fff;
  box-shadow: 0 3px 2px rgba(2, 2, 2, .12);
  margin: 0 auto;
  padding-bottom: 15px;
}

.other-flow-title {
  background-color: #8F8F8F;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 10px 0;
  margin-bottom: 15px;
}
.other-flow-title.over-title {
  background-color: #8F8F8F;
}

.other-flow-txt {
  color: #2C2C2C;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 6px;
}

.flow-under {
  width: 30px;
  height: 30px;
  margin: 20px auto 2px;
}

.caret {
  display: inline-block;
  border-left: 1.2em solid transparent;
  border-right: 1.2em solid transparent;
  border-top: 1.1em solid #D9D9D9;
  filter: drop-shadow(0 2px 2px rgba(1, 1, 1, .12));
}

.terms-conditions {
  width: 80%;
  margin: 0 auto;
  font-size: 0.75rem;
  color: #1B71C0;
  font-weight: bold;
  position: relative;
  top: -55px;
  z-index: 999;
  padding-left: 6%;
}

.area-cv {
  width: 100%;
  margin: 20px auto 15px;
}

.area-cv .cv-btn-form {
  margin: 25px auto 15px;
}

.area-cv .cv-btn-form a {
  padding: 20px 0;
}

.area-cv.last-cv {
  margin: 10px auto 30px;
}

.area-cv.last-cv .cv-btn-form {
  margin: 0 auto 10px;
}

.what {
  padding-bottom: 30px;
}

/* ファーストビュー（Hero） */
.main_visual {
  position: relative;   /* ← 子の絶対配置の基準にする */
  height: 77vh;        /* 画面1面ぶん（お好みで） */
  overflow: hidden;     /* はみ出しを隠す（重要） */
}

/* キャンバスはセクション内に絶対配置してスクロールで流れる */
#confetti-canvas {
  position: absolute;   /* ← fixed じゃない！ */
  inset: 0;             /* top:0; right:0; bottom:0; left:0; と同義 */
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;           /* ヒーローの中で前面にしたい場合は調整 */
}

.scroll-infinity {
  position: absolute;
  top: 54vh;
}


@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
    to {
    transform: translateX(-100%);
  }
  }
  .scroll-infinity__wrap {
    display: flex;
    overflow: hidden;
    justify-content: flex-start;
    width: 100%;
  }
  .scroll-infinity__list {
    display: flex;
    list-style: none;
    padding: 0;
    align-items: center;
  }
  .scroll-infinity__list--left {
    animation: infinity-scroll-left 12s infinite linear 0.5s both;
  }
  .scroll-infinity__item {
    width: calc(430px / 3);
  }
  .scroll-infinity__item>img {
    width: 63%;
  }

@media only screen and (max-width: 760px) {
  .main_visual {
    height: 61vh;        /* 画面1面ぶん（お好みで） */
  }
  .scroll-infinity {
    position: absolute;
    top: 46vh;
  }
  .scroll-infinity__list--left {
    animation: infinity-scroll-left 10s infinite linear 0.5s both;
  }
  .scroll-infinity__item {
    width: calc(62vw / 3);
  }
  .scroll-infinity__item>img {
    width: 96%;
  }
  .scroll-infinity__list {
    gap: 30px;
    justify-content: space-between;
  }
  .scroll-infinity__wrap {
    gap: 30px;
  }
  .sp-f {
    display: flex;
  }
}

@media only screen and (max-width: 379px) {
  .main_visual {
    height: 76vh;
  }
  .scroll-infinity {
    top: 56vh;
  }
}

@media only screen and (max-width: 361px) {
  .body .header h1 {
    margin-left: 7px;
  }
  .main_visual {
    height: 65vh;
  }
  .scroll-infinity {
    top: 48vh;
  }
}

@media only screen and (max-width: 1300px) {
  .body .header h1 {
    margin-left: 7px;
  }
  .main_visual {
    height: 50%;
  }
  .scroll-infinity {
    top: 72%;
  }
}

@media only screen and (min-width: 1301px) {
  .body .header h1 {
    margin-left: 7px;
  }
  .main_visual {
    height: 40%;
  }
  .scroll-infinity {
    top: 73%;
  }
}

@media only screen and (max-width: 760px) {
  .other_menu ul {
    font-size: 12px;
  }
  input {
    font-size: 16px;
  }
  .no_suggest_result {
    width: 80%;
  }

  .no_suggest_result .main_txt {
    font-size: 16px;
  }

  .no_suggest_result .sub_txt {
    font-size: 12px;
  }

  body .section ul .flexwrap .p_sub {
    flex-wrap: nowrap;
  }

  .contentWrapper .notice {
    font-size: 14px;
  }