* {font-family: 'NanumSquareNeo'; color: #222;}

html,
body {
  position: relative;
  height: 100%;
}

body {
  background: #fff;
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #000;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  line-height: 1.5;
  word-break: keep-all;
}

button {font-family: 'NanumSquareNeoBold' !important;}

.slide-wrap {overflow-x: hidden;}

.weight {font-family: 'NanumSquareNeoHeavy' !important;}
.weight02 {font-family: 'NanumSquareNeoExtraBold';}
.weight03 {font-family: 'NanumSquareNeoBold';}

.swiper {
  width: 100%;
  height: 100%;
  position: relative;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pd {padding: 50px 20px 130px 20px;}
.pd-tb {padding: 50px 0px 120px 0px;}
.pd02 {padding: 50px 0px 0px 0px;}
.pd03 {padding: 50px 20px;}
.pd04 {padding: 50px 0px 30px 0;}
.pd-t {padding: 50px 0;}
.mt-4 {margin-top: 40px;}
.mt-3 {margin-top: 30px;}
.mt-2 {margin-top: 20px;}
.mb-0 {margin-bottom: 0 !important;}
/* .mb-1 {margin-bottom: 15px !important;} */

.bo-none {border-bottom: none !important;}

.swiper-pagination {display: flex; gap: 4px; padding: 5px 16px; border-radius: 40px; background-color: rgba(0, 0, 0, .35); color: #fff; width: fit-content !important; font-size: 12px; left: calc(100% - 85px) !important; bottom: 35px !important;}
.swiper-pagination-current {color: #fff;  font-family: 'NanumSquareNeoBold';}
.swiper-pagination-total {color: #fff;}

/* 메인 */

.main-header {position: fixed; top: 0; left: 0; width: 100%; z-index: 2; padding: 15px 20px; height: 50px; transition: all 0.1s;}
.logo-img-co {display: none;}
.main-header.on {background-color: #fff; z-index: 100; border-bottom: 1px solid #eee;}
.main-header.on .logo-img {display: none;}
.main-header.on .logo-img-co {display: block; width: 40px;}

.main-header .logo-img {width: 40px;}
.slide-wrap .swiper-slide {position: relative; background-color: #fb8d4a; height: 320px; overflow: hidden;}
.slide-wrap .swiper-slide .slide-img {position: absolute; bottom: -70px; right: 0; width: 230px;}
.slide-wrap .swiper-slide .slide-txt {position: absolute; top: 80px; left: 20px;}
.slide-wrap .swiper-slide .slide-txt h3 {font-size: 24px;  font-family: 'NanumSquareNeoBold'; text-align: left; color: white; line-height: 1.4; margin-bottom: 10px;}
.slide-wrap .swiper-slide .slide-txt span {text-align: left; font-size: 15px; color: #fff; line-height: 1.4; font-weight: 400;}
.slide2 {background: url(../img/main-bg.png) no-repeat center/cover; }
.slide-wrap .swiper-slide .slide-img02 {position: absolute; bottom: -10px; right: -55px; width: 331px;}

.contain {padding: 20px; position: relative;}
.contain::before {content: ""; display: block; width: 100%; height: 40px; border-radius: 20px; background-color: white; position: absolute; top: -20px; left: 0; z-index: 10;}
.main-btn {border-radius: 8px; box-shadow: 0px 4px 17px rgba(191, 191, 191, .3); display: flex; align-items: center; padding: 20px; justify-content: space-between; margin-top: -15px; position: relative; z-index: 11;}
/* .main-btn .btn-tit {gap: 4px;} */
.main-btn .btn-tit strong {display: flex; align-items: center; font-size: 18px; color: #FF6200; gap: 8px; margin-bottom: 6px;} 
.main-btn .btn-tit strong i {display: block; width: 7px; padding-bottom: 2px;}
.main-btn .btn-tit span {color: #777;}
.main-btn .btn-tit {width: calc(100% - 48px);}
.main-btn .btn-img {width: 48px;}

.reccon {display: flex; flex-direction: column; gap: 25px; margin: 30px 0;}
.reccon h3 {font-size: 20px;}
.rec-wrap {display: flex; flex-direction: column; gap: 25px;}
.rec {border-radius: 5px; border: 1px solid #ddd; overflow: hidden;}
.con-txt {display: flex; flex-direction: column; padding: 15px; gap: 10px;}
.con-txt .con-main {display: flex; justify-content: space-between;}
.con-txt .con-main p { font-family: 'NanumSquareNeoBold'; font-size: 17px;}
.con-txt .con-main span {display: flex;}
.con-txt .con-main span em {color: #FF6200; margin-left: 5px;}
.rec .con-img {height: 180px;}

.btn01 {display: flex; width: 100%; padding: 12px 0; border: 1px solid #f9690f; color: #f9690f; justify-content: center; gap: 5px; font-size: 15px;  align-items: center; height: 47px;  font-family: 'NanumSquareNeoBold'; border-radius: 5px;}
.btn01 i {display: inline-block; width: 7px;}
.btn02 {display: flex; width: 100%; padding: 12px 0 !important; justify-content: center; background-color: #f9690f; color: #fff; border-radius: 5px; font-size: 15px; height: 47px; align-items: center;  font-family: 'NanumSquareNeoBold' !important;}
.btn-wrap {margin-top: 30px;}

footer {padding: 35px 20px 120px 20px; background-color: #f9f9f9;}
footer h3 {font-size: 16px; color: #aaa; margin-bottom: 5px;}
.phone {display: flex; font-size: 22px; color: #FF6200; align-items: center; gap: 5px; margin-bottom: 20px;}
.phone i {display: inline-block;width: 17px; height: 20px;}
.contact ul {display: flex; flex-direction: column; gap: 3px;}
.contact ul li { color: #888; font-size: 13px;}
/* .contact ul li::after {content: ""; display: block; width: 1px; height: 12px; background: #959595; left: -1px; top: 50%; transform: translateY(-50%); position: absolute;} */
.contact ul li:first-child {padding-left: 0;}
.contact ul li:first-child::after {content: none;}

/* GO집 */

.header {position: fixed; width: 100%; height: 50px; top: 0; left: 0; border-bottom: 1px solid #eee; background-color: white; display: flex; align-items: center; justify-content: center; z-index: 3;}
.header h1 {font-family: 'NanumSquareNeoBold'; font-size: 15px;}
.que {margin-top: 30px;}
.que .que-tit {display: flex; font-size: 16px; margin-bottom: 15px;}
.que .que-tit span {font-size: 18px; color: #FF6200; text-wrap: nowrap;}
.que .que-tit b {margin-left: 3px;}

.input-wrap {display: flex; flex-direction: column; gap: 10px;}
.input-wrap input[type="radio"] {display: none;}
.input-wrap label {display: flex; padding: 15px; border-radius: 5px; border: 1px solid #ddd; align-items: center; gap: 10px; }
.input-wrap label div {width: calc(100% - 28px); }
.input-wrap label p {color: #555; }
.input-wrap label span.sub-txt  {color: #888; margin-top: 5px;}
span.chk-img {width: 18px; height: 18px; background: url(../img/chk-none.png) no-repeat center/cover;}

.input-wrap input:checked + label {border: 1px solid #FF6200;}
input:checked + label span.chk-img {width: 18px; height: 18px; background: url(../img/chked.png) no-repeat center/contain;}
.input-wrap input:checked + label p {font-family: 'NanumSquareNeoExtraBold'; color: #FF6200;}
.input-wrap input:checked + label span {color: #222;}

.txt-input {display: flex; flex-direction: column; gap: 20px;}
.txt-input > div {display: flex; flex-direction: column; gap: 10px; }
.txt-input p { font-family: 'NanumSquareNeoBold'; font-size: 15px;}
input[type="text"] {border: 1px solid #ddd; border-radius: 5px; height: 50px; font-size: 15px;}

.hide {display: none;}

/* 시공사 */

.search-wrap {padding: 25px 20px; border-bottom: 8px solid #f5f5f5; }
.search-wrap .search-tit {font-size: 18px; margin-bottom: 20px;}
.search-wrap .search-tit em {display: inline-block; color: #FF6200;}

.search-box {display: flex; align-items: center; justify-content: flex-start; padding: 12px 10px; border-radius: 5px; border: 1px solid #ddd; font-size: 15px; gap: 3px; position: relative;}
.search-box::after {content: ""; display: block; width: 1px; height: 30px; background-color: #ddd; position: absolute; right: -1px;}
.search-box span {position: absolute; width: 18px; top: 50%; left: 10px; transform: translateY(-50%);}
/* .search-box span {background: url(../img/search-icon.png) no-repeat center/cover; width: 20px; height: 20px; margin-right: 20px;} */
.store-wrap {padding: 20px 20px 0 20px;}
.store-wrap > ul {display: flex; gap: 12px; margin-bottom: 20px;}
.store-wrap > ul li {display: inline-block; padding: 7px 20px; border-radius: 20px; background-color: #f1f1f1; color: #888;}
.store-wrap > ul li.on {background-color: #FF6200; color: #fff; font-family: 'NanumSquareNeoBold';}

.store-box {}
.store-box .store {border: 1px solid #eee; border-radius: 5px; overflow: hidden; margin-bottom: 25px;}
.store-box .store:last-child {margin-bottom: 0;}
.store-box .store .store-img {height: 180px;}
.store-box .store .store-txt {padding: 15px;}
.store-box .store .store-txt p {font-size: 15px;  font-family: 'NanumSquareNeoBold'; margin-bottom: 10px;}
.store-box .store .store-txt ul {display: flex; align-items: center;}
.store-box .store .store-txt ul li {display: flex; align-items: center; padding: 0 10px; position: relative; color: #555;}
.store-box .store .store-txt ul li::after {content: ""; display: block; width: 3px; height: 3px; border-radius: 100%; background-color: #d9d9d9; position: absolute; left: -2px; top: 50%; transform: translateY(-50%);}
.store-box .store .store-txt ul li:first-child {padding-left: 0;}
.store-box .store .store-txt ul li:first-child::after {content: none;}
.store-box .store .store-txt ul li i {display: inline-block; width: 22px; height: 22px; border-radius: 100%; overflow: hidden; margin-right: 5px;}
.store-box .store .store-txt ul li em {color: #FF6200; margin-left: 5px;}
.store-box02 {display: none;}

.search-box input {padding: 0; border: none; height: fit-content; padding-left: 25px;}
.search-in input {padding: 0; border: none; height: fit-content;}

/* 마이페이지 */
.header-re {position: fixed; width: 100%; height: 50px; display: flex; align-items: center; justify-content: center; background-color: #fff; border-bottom: 1px solid #eee; z-index: 10;}
.header-re h1 {font-family: 'NanumSquareNeoBold'; font-size: 15px;}
.header-re span {position: absolute; top: 50%; transform: translateY(-50%); right: 20px; padding: 5px 10px; border-radius: 20px; border: 1px solid #ddd; font-size: 12px; color: #555;}

.profile-wrap {background-color: #FF9250; display: flex; align-items: center; justify-content: space-between; padding: 80px 20px 50px 20px;}
.pro-img {display: flex; align-items: center; gap: 15px;}
.pro-img div {width: 70px; height: 70px;}
.pro-img p {font-size: 18px; color: #fff;}
.pro-img b { color: #fff;}
.profile-wrap .edit-btn {background-color: #fff; color: #f9690f; padding: 7px 15px; border-radius: 30px; font-size: 13px;}

.current-sec {position: relative; padding: 20px;}
.current-sec::after {content: ""; display: block; width: 100%; height: 40px; border-radius: 20px; background-color: #fff; top: -20px; position: absolute; z-index: 2; left: 0;}

.cur-tit {font-size: 16px; margin-bottom: 10px;}
.current {border-radius: 10px; border: 1px solid #eee;}
.current .cur-process {padding: 15px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee;}
.current .cur-process ul li {display: inline-block; position: relative; padding: 0 5px;}
.current .cur-process ul li::after {content: ""; display: block; width: 2px; height: 2px; border-radius: 100%; background-color: #555; position: absolute; top: 50%; left: -3px; transform: translateY(-50%);}
.current .cur-process ul li:first-child {font-size: 15px; color: #FF6200; padding-left: 0;}
.current .cur-process ul li:first-child::after {content: none;}
.current .cur-process ul li:last-child {font-size: 13px; color: #888;}
.current .cur-process span {display: flex; align-items: center; color: #888; font-size: 13px;}
.current .cur-process span i {display: inline-block; color: #888; padding-top: 1px;}
.cur-info {display: flex; padding: 17px 15px; align-items: center; gap: 15px;}
.cur-info .st-img {width: 60px; height: 60px; border-radius: 15px; overflow: hidden;}
.cur-info .txt-info {display: flex; flex-direction: column; gap: 8px;}
.cur-info .txt-info p {font-size: 16px; font-family: 'NanumSquareNeoBold';}
.cur-info .txt-info span {font-size: 13px; color: #888;}

/* 결제버튼 */
.pay-btn02 {display: none;}

@media (max-width:430px){
  .slide-wrap .swiper-slide .slide-txt {top: 60px;}
  .slide-wrap .swiper-slide .slide-img02 {width: 290px;}
  .slide-wrap .swiper-slide .slide-img {width: 185px; bottom: -55px;}
  .main-btn .btn-tit span br {display: none;}

  .main-btn .btn-tit {width: calc(100% - 48px);}
  .main-btn .btn-img {width: 48px;}
  .main-btn {gap: 10px;}
}

@media (max-width:360px){
  .slide-wrap .swiper-slide .slide-img {width: 165px;}
  .slide-wrap .swiper-slide .slide-img02 {width: 260px;}
  .slide-wrap .swiper-slide .slide-txt span {font-size: 14px;}

  .main-btn {gap: 12px; padding: 20px 15px;}
  .main-btn .btn-tit {width: calc(100% - 47px);}
  .main-btn .btn-img {width: 47px;}
  .main-btn .btn-tit strong {font-size: 17px;}
  /* .main-btn .btn-tit strong i {width: 7px;} */
  .main-btn .btn-tit span {font-size: 13px;}

  .input-wrap label span.sub-txt {font-size: 13px;}

  .pro-img div {width: 60px; height: 60px;}
  .pro-img {gap: 10px;}
  .pro-img p {font-size: 16px;}

  .current .cur-process ul li:last-child {font-size: 12px;}
  .current .cur-process ul li:first-child {font-size: 14px;}
  .current .cur-process span {font-size: 12px;}
  .current .cur-process {padding: 15px 12px;}
  .cur-info {gap: 12px;}
  .cur-info .txt-info {gap: 6px;}
  .edit-con .input-wrap input {font-size: 13px;}
  .edit-con .number select {font-size: 13px !important;}

  .btn01 {font-size: 14px;}
  .btn02 {font-size: 14px;}
  .confirm-flex button.btn-close {font-size: 14px;}


}

@media (max-width:310px){
  .store-box .store .store-txt {padding: 15px 10px;}
  .store-box .store .store-txt ul li {padding: 0 8px; font-size: 13px;}
  .pro-img div {width: 55px; height: 55px;} 
  .profile-wrap .edit-btn {font-size: 12px; padding: 7px 13px;}
  .current .cur-process span {font-size: 11px;}

  .result-de ul li p {font-size: 15px !important;}
  .result-de ul li span {font-size: 14px !important;}
}