/* 결제 */
/* .header-re {border-bottom: 1px solid #eee;} */
.header-re .back {position: absolute; top: 50%; left: 20px; transform: translateY(-50%); width: 16px;}

.pay > div {padding: 25px 20px; border-bottom: 8px solid #eee;}
.pay > div:last-child {border-bottom: none;}
.pay > div h3 {font-size: 16px; font-family: 'NanumSquareNeoBold'; margin-bottom: 20px;}
.pro-detail {display: flex; align-items: center; gap: 10px;}
.pro-detail .pro-img {width: 60px; height: 60px; border-radius: 10px; background-color: #f2f2f2; display: flex; align-items: center; justify-content: center;}
.pro-detail .pro-img img {width: 64%; object-fit: contain;}
.pro-detail .pro-txt {display: flex; flex-direction: column; gap: 8px;}
.pro-detail .pro-txt p {font-size: 15px; font-family: 'NanumSquareNeoBold';}
.pro-detail .pro-txt span {font-size: 13px; color: #888;}

.pay-btn {margin-bottom: 30px;}
.pay-btn:last-child {margin-bottom: 0;}
.pay-btn input[type="radio"] {display: none;}
.pay-info .pay-btn label {display: flex; align-items: center; gap: 10px; margin-bottom: 15px;}
.pay-info .pay-btn label > div {display: flex; align-items: center; gap: 5px;}
.pay-info .pay-btn label > div i {display: inline-block; width: 22px;}
.pay-info .pay-btn label > div p {font-size: 15px; font-family: 'NanumSquareNeoBold';}
.pay-info .pay-btn input:checked + label > div p {font-family: 'NanumSquareNeoExtraBold';}
.info-txt {display: flex; flex-direction: column; gap: 10px;}
select {height: 50px; border-radius: 5px; border: 1px solid #ddd; width: 100%; font-size: 15px; padding-left: .9em; padding-right: .9em; color: #777; font-family: inherit; background: url(../img/select-angle.png) no-repeat; background-position: 95% 50%; outline: none;}
/* .info-txt input[type="text"] {width: 100%; height: 45px; border-radius: 5px; border: 1px solid #ddd; font-size: 15px;} */

.caution {padding: 15px 12px; border-radius: 5px; border: 1px solid #ddd; background-color: #f9f9f9;}
.caution p {color: #777; display: flex; align-items: center; font-family: 'NanumSquareNeoBold'; gap: 5px; margin-bottom: 10px; font-size: 13px;}
.caution i {color: #777;}
.cau-txt {display: flex; gap: 5px; flex-direction: column;}
.cau-txt span {font-size: 13px; color: #777;}

.pay-price .price .total {display: flex; justify-content: space-between; align-items: center; padding-top: 20px;}
.pay-price .price .total span {font-size: 15px;  font-family: 'NanumSquareNeoBold'; color: #222;}
.pay-price .price .total p {font-size: 18px; color: #222;}
.pay-price .price .price-info {display: flex; flex-direction: column; gap: 15px; padding-bottom: 20px; border-bottom: 1px solid #eee;}
.pay-price .price > div > div {display: flex; justify-content: space-between; align-items: center;}
.pay-price .price > div span {font-size: 13px; color: #777;}
.pay-price .price > div p {font-size: 15px; color: #222;}

.agree-chk {display: flex; align-items: center; justify-content: space-between; padding: 10px 0;}
.agree-chk label {display: flex; align-items: center; gap: 6px;}
.agree-chk label p { font-family: 'NanumSquareNeoBold';}
.agree-chk > p {font-size: 13px; display: flex; align-items: center; color: #888;}
.agree-chk > p i {color: #888;}

/* 결제완료 */

.done {display: flex; align-items: center; justify-content: center; height: 100vh;}
.done-wrap {display: flex; flex-direction: column; gap: 25px; align-items: center; margin-bottom: 50px;}
.done-wrap i {width: 75px;}
.done-wrap .done-txt {text-align: center;}
.done-wrap .done-txt p {font-size: 16px; font-family: 'NanumSquareNeoBold'; margin-bottom: 5px;}
.done-wrap .done-txt span {font-size: 14px; color: #888; padding: 0 20px;}

.btn-fix {padding: 20px; position: fixed; width: 100%; bottom: 0; left: 0;}

/* 시공사 상세페이지 */

.st-detail .st-img {height: 210px;}
.st-detail .st-txt {padding: 25px 20px; border-bottom: 8px solid #eee; display: flex; flex-direction: column; gap: 20px;}
.st-detail .st-txt h2 {font-size: 18px;  font-family: 'NanumSquareNeoBold'; margin-bottom: 5px;}
.st-detail .st-txt span {font-size: 14px; color: #888;}

.st-info > ul {display: flex; border-bottom: 1px solid #eee; padding: 0 20px;}
.st-info > ul li {width: calc(100% / 3); text-align: center; padding: 15px 0;  font-family: 'NanumSquareNeoBold';}
.st-info > ul li.on {border-bottom: 3px solid #FF6200;}

.st-info-con {padding: 20px;}
.st-con02, .st-con03 {display: none;}
.st-info-con ul {display: flex;}
.st-info-con ul li {width: calc((100% - 15px) / 2);}
.st-info-con ul li .work-img {border-radius: 5px; overflow: hidden; aspect-ratio: 2 / 1.3;}
.st-info-con ul li p {font-size: 15px;  margin-top: 5px;}

.st-info-con > div {display: flex; align-items: center; justify-content: space-between; padding: 15px 5px; border-bottom: 1px solid #eee;}
.st-info-con > div:first-child {padding-top: 0;}
.st-info-con > div span {font-size: 15px; color: #888;}
.st-info-con > div p {font-size: 16px; color: #222;}
.st-info-con > div p b { font-family: 'NanumSquareNeoBold'; color: #FF6200; margin-right: 3px;}

/* 레퍼런스 상세페이지 */

.st-info-txt {padding: 20px; border-bottom: 8px solid #eee;}
.st-info-txt .st-top {padding-bottom: 20px; border-bottom: 1px solid #eee;}
.st-info-txt .st-top h2 {font-size: 18px;  font-family: 'NanumSquareNeoBold'; margin-bottom: 5px;}
.st-info-txt .st-top span {font-size: 14px; color: #888;}
.st-info-txt .st-top .re-profile {display: flex; gap: 3px; align-items: center; margin-top: 10px;}
.st-info-txt .st-top .re-profile i {display: block; width: 22px; aspect-ratio: 1 / 1; border-radius: 100%; overflow: hidden;}
.st-info-txt .st-top .re-profile p {font-size: 13px; color: #555;}
.st-bt {padding-top: 20px;}
.st-bt p {font-size: 16px; margin-bottom: 5px;  font-family: 'NanumSquareNeoBold';}
.st-bt strong {font-size: 18px; color: #FF6200;}

.refe-wrap {padding: 20px;}
.refe-wrap .refe-info {padding: 20px 0; border-bottom: 1px solid #eee;}
.refe-wrap .refe-info:first-child {padding-top: 0;}
.refe-wrap .refe-info:last-child {border-bottom: none;}
.refe-wrap .refe-info h3 {font-size: 16px;  font-family: 'NanumSquareNeoBold'; margin-bottom: 15px;}
.refe-img-wrap {width: 100%; overflow: hidden; overflow-x: scroll;}
.refe-img-wrap .refe-con {display: flex; width: 120%; gap: 10px;}
.refe-img-wrap .refe-con > div {width: 60%;}
.refe-txt {display: flex; flex-direction: column; gap: 15px;}
.refe-txt > div {display: flex; align-items: center; justify-content: space-between;}
.refe-txt > div span {font-size: 15px; color: #888;}
.refe-txt > div p {font-size: 16px; color: #222; font-family: 'NanumSquareNeoBold';}

/* go집 현황 상세페이지 */

.order-date {display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; border-bottom: 1px solid #eee;}
.order-date span {font-size: 12px; color: #888;}
.order-date p {font-size: 13px; color: #888;}
.go-pro {padding: 20px; border-bottom: 8px solid #eee; display: flex; flex-direction: column; gap: 20px;}
.go-pro .go-tit {padding: 4px 10px; border-radius: 3px; border: 1px solid #ff6200; background-color: #fdf9f7; width: fit-content; font-size: 12px; color: #FF6200;}
.go-pro .go-pro-info {display: flex; align-items: center; gap: 10px;}
.go-pro .go-pro-info .go-pro-img {width: 65px; border-radius: 10px; overflow: hidden; aspect-ratio: 1 / 1;}
.go-pro .go-pro-info .go-pro-txt p {font-size: 15px;  font-family: 'NanumSquareNeoBold'; margin-bottom: 5px;}
.go-pro .go-pro-info .go-pro-txt span {font-size: 13px; color: #888;}
.go-pro .go-pro-info .go-pro-txt span em {font-size: 17px; display: inline-block; color: #ff6200;}

.result > ul {display: flex; padding: 0 20px; border-bottom: 1px solid #ddd;}
.result > ul li {padding: 15px 0; text-align: center; width: calc(100% / 3); font-family: 'NanumSquareNeoBold';}
.result ul li.on {border-bottom: 3px solid #FF6200;}
.result-con {padding: 20px 15px; border-radius: 10px; background-color: #fff;}
.result-con > div {padding: 20px 0; border-bottom: 1px solid #eee;}
.result-con > div:first-child {padding-top: 0;}
.result-con > div:last-child {border-bottom: none;}
.result-wrap {padding: 20px; background-color: #f7f7f7;}
.result-wrap h2 {font-size: 20px; margin-bottom: 15px;}

.result-con > div h3 {font-size: 16px; font-family: 'NanumSquareNeoBold'; margin-bottom: 15px;}
.result-de ul {display: flex; flex-direction: column; gap: 10px;}
.result-de ul li {display: flex; align-items: center; justify-content: space-between;}
.result-de ul li span {font-size: 15px; color: #888;}
.result-de ul li p {font-size: 16px; color: #222; font-family: 'NanumSquareNeoBold';}
.blueprint {border: 1px solid #eee; border-radius: 5px; overflow: hidden;}
.two-btn {display: flex; gap: 10px; margin-top: 20px;}
.two-btn button {width: 50%;}

.result strong {font-size: 23px; color: #FF6200;}
.result02, .result03 {display: none;}

/* 실측정보입력 */

.requiry {color: #FF6200; font-family: 'NanumSquareNeoBold'; display: flex; gap: 3px;}

.input-wrap input {width: calc(100% - 36px); font-size: 15px;}
.input-wrap .in-wrap {width: 100%;}
.input-wrap .in-wrap input {width: 100%;}
.input-wrap .input-list {display: flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%;}
.input-wrap .input-list .delete-btn {width: 26px; height: 26px; border-radius: 100%; background-color: #d9d9d9; display: flex; align-items: center; justify-content: center;}
.input-wrap .input-list .delete-btn i {font-size: 20px; color: #fff;}
.hide-txt {display: none; width: 100% !important;}

.que > em {display: block; font-size: 13px; color: #888; margin: 3px 0 15px 0;}

/* go집 추천 */

.go-reco {padding: 20px;}
.go-reco h2 {font-size: 16px; margin-bottom: 10px;}
.go-reco h2 b {color: #FF6200;}
.go-reco p {font-size: 14px; line-height: 1.6; margin-bottom:25px;}
.go-reco i {display: block; width: 177px; margin: 0 auto;}

.more {padding: 0 !important;}
.more h3 {display: flex; align-items: center; justify-content: space-between;}
.more h3 i {display: block; width: 14px; transform: rotate(0deg); transition: all 0.3s;}
.more h3 i.on {transform: rotate(180deg);}
.more ul {display: none;}
.more ul li {margin-bottom: 10px;}
.more ul li:last-child {margin-bottom: 0;}

.reco-info {margin-top: 35px; padding-bottom: 30px;}
.reco-info ul {display: flex; flex-direction: column; gap: 20px;}
.reco-info ul li p {display: flex; align-items: center; font-size: 13px; color: #555; gap: 3px; margin-bottom: 5px;}
.reco-info ul li p i {font-size: 16px; color: #FF6200;}
.reco-info ul li span {font-size: 13px; color: #666;}

.go-fixed {padding: 15px 20px; background-color: #fff; display: flex; gap: 15px; position: fixed; bottom: 0; left: 0; width: 100%; box-shadow: 0 -5px 20px rgba(227, 227, 227, .5);}

/* 로딩화면 */

.loading {display: flex; align-items: center; justify-content: center; height: 100vh; width: 100%;}
.loading .loading-txt {text-align: center;}
.loading .loading-txt h3 {font-size: 15px;  font-family: 'NanumSquareNeoBold'; line-height: 1.6; margin-bottom: 10px;}
.loading .loading-txt span {font-size: 13px; color: #555;}
.loading .loading-txt button {padding: 15px 30px; background-color: #FF6200; color: #fff; border-radius: 40px; font-weight: 400 !important; margin-top: 30px;}

.load { width: 100vw; margin-bottom: 30px; display: flex; justify-content: center; align-items: center; }
  
.load span {display: inline-block; width: 10px; height: 10px; background-color: gray; border-radius: 50%;animation: loading 1s linear infinite;background-color: black; }
  
.load span:nth-child(1) {
    animation-delay: 0s;
  }
  
.load span:nth-child(2) {
    animation-delay: 0.2s;
    margin: 0px 10px
  }
  
.load span:nth-child(3) {
    animation-delay: 0.4s;
  }
  
@keyframes loading {
    0%, 100% {
      opacity: 0;
      transform: scale(0.5);
    }
    50% {
      opacity: 1;
      transform: scale(1.2);
    }
  }

/* 추천 시공사리스트 */

.list-detail h2 {font-size: 18px; margin: 25px 0;}
.list-detail b {color: #FF6200;}
.list-wrap {display: flex; flex-direction: column; gap: 25px;}
.list-wrap .list {border-radius: 10px; overflow: hidden; border: 1px solid #eee;}
.list-wrap .list .list-img-wrap {padding: 15px 0 0 15px; width: 100%; overflow: hidden; overflow-x: scroll;}
.list-wrap .list .list-img-wrap .list-inner {display: flex; width: 140%; gap: 10px;}
.list-wrap .list .list-img-wrap .list-inner .list-img {border-radius: 5px; overflow: hidden; width: 70%; aspect-ratio: 2 / 1.3;}
.list .list-txt {padding: 15px;}
.list .list-txt p {font-size: 15px; font-family: 'NanumSquareNeoBold'; margin-bottom: 5px;}
.list .list-txt span {display: flex; align-items: center; gap: 5px; color: #555;}
.list .list-txt span i {display: block; width: 22px; height: 22px; border-radius: 100%; overflow: hidden;}
.list .list-txt > div {margin-top: 15px;}

.find {padding: 30px 20px; border-radius: 8px; background-color: #f8f8f8; margin-top: 35px;}
.find .find-con {display: flex; flex-direction: column; align-items: center; gap: 20px;}
.find .find-con i {display: block; width: 43px;}
.find .find-con .find-txt {text-align: center;}
.find .find-con .find-txt p {font-size: 16px; font-family: 'NanumSquareNeoBold'; margin-bottom: 3px;}
.find .find-con .find-txt span {font-size: 13px; color: #777;}
.find .btn02 {margin-top: 20px;}

/* 입찰결과 */

.bid-tit {padding: 30px 20px; display: flex; align-items: center; justify-content: space-between;}
.bid-tit h2 {font-size: 16px;}
.bid-tit h2 b {font-size: 20px; color: #FF6200; margin-right: 5px;}
.bid-tit i {display: block; width: 72px;}

.bid-st-img {border-radius: 5px; overflow: hidden; aspect-ratio: 2 / 1;}
.bid-de ul li p.price {font-size: 18px; color: #FF6200;}
.bid-con > div {border-bottom: none;}
.bid-con .all {display: flex; align-items: center; justify-content: center; gap: 3px; padding: 0 !important;}
.bid-con .all p {color: #888;}
.bid-con .all i {display: block; width: 14px; transform: rotate(0deg); transition: all 0.3s;}
.bid-con .all-close {display: none;}
.bid-con .all-close i {transform: rotate(180deg);}

.all-wrap {display: none; flex-direction: column; gap: 30px; padding-top: 10px !important;}

.bid-confirm {margin-top: 30px;}


/* 마이페이지 정보수정 */

.img-edit-wrap {width: 65vw; border-radius: 10px; background-color: #f9f9f9; position: absolute; top: 93%; box-shadow: 0 0 20px rgba(165, 165, 165, .5); display: none;}
.img-edit-wrap li {width: 100%; padding: 15px 0; text-align: center; border-bottom: 1px solid #ddd;}
.img-edit-wrap li:last-child {border-bottom: none;}

.edit-con .img-edit {display: flex; flex-direction: column; align-items: center; position: relative; margin-bottom: 30px; margin-top: 30px;}
.edit-con .img-edit i {display: block; width: 82px;}

.edit-con .img-edit button {width: 100%; padding: 14px 0; border: 1px solid #333;}

.edit-con .input-wrap p {font-family: 'NanumSquareNeoBold'; margin-bottom: 8px;}
.edit-con .input-wrap {display: flex; flex-direction: column; gap: 20px;}
.edit-con .input-wrap input {width: 100% !important; font-size: 14px;}
.edit-con .number {display: flex; gap: 10px; align-items: center;}
.edit-con .number select {background-position: 90% 50%; font-size: 14px;}
.read {background-color: #f5f5f5;}

/* 검색 */

.search-con {display: flex; align-items: center; position: relative; height: 70px; border-bottom: 1px solid #eee;}
.back-icon {position: absolute; top: 50%; left: 20px; transform: translateY(-50%); width: 16px;}
.search-in {display: flex; align-items: center; width: 86%; margin-left: 45px; padding: 12px; background-color: #f1f1f1; border-radius: 50px;}
.search-in input {width: 93%; background-color: #f1f1f1; padding-left: 5px;}
.search-in i {display: inline-block; width: 20px;}
.search-inner {padding: 30px 20px;}
.search-inner > p {text-align: center;}

.inner02 {display: none; padding: 20px !important;}
.search-re {margin-bottom: 15px;}
.search-re p {display: flex; align-items: center;}
.search-re p span {margin: 0 2px 0 5px;}

.search-word {display: none;}

/* 약관동의 */

.policy p {padding: 20px; line-height: 1.5;}