/*index.css*/
#page-wrap {
	position: relative;
	width: 100%;
	margin: auto;
}
#page-wrap *{
  box-sizing: border-box;
}
#page-wrap > article,
#page-wrap > section{
	min-width: 1440px;
}
#page-wrap > article .inner,
#page-wrap > section .inner{
  width: 1120px;
  margin: 0 auto;
  position: relative;
}
body {
	padding-top: 0;
}

#header {
	display: none;
}

.footer-wrap {
	border-top: 0;
}

.scrollOff {
	position: fixed;
	overflow: hidden;
	width: 100%;
}

/* 연휴 팝업 */
/* 가격인상 모달로 수정 */
.modal-bg{
	position: fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:rgba(0, 0, 0, 0.5);
	z-index: 51;
}
.index-noti{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 600px;
	z-index: 52;
}
.index-noti img{
	width:100%;
}
.noti-close {
	position: absolute;
	top: 15px;
	right: 15px;
	width: 32px;
	height: 32px;
}

.noti-close img {
	width: 100%;
}

.pop-close {
	position: relative;
	box-sizing: border-box;
	padding: 14px 25px;
	width: 100%;
	min-height: 46px;
	background-color: #101820;
}

.pop-close input[type="checkbox"] {
	display: none;
}

.pop-close input[type="checkbox"]+label {
	float: left;
	width: 20px;
	height: 20px;
	background-image: url("/CARVAZO_IMG/web_main/checkbox_off.svg");
	background-repeat: no-repeat;
	background-position: top left;
	background-size: contain;
	cursor: pointer;
}

.pop-close input[type="checkbox"]:checked+label {
	width: 20px;
	height: 20px;
	background-image: url("/CARVAZO_IMG/web_main/checkbox_on.svg");
}

.pop-close input[type="checkbox"]+label span {
	position: absolute;
	top: 12px;
	left: 50px;
	box-sizing: border-box;
	font-size: 14px;
	font-weight: 300;
	line-height: 22px;
	letter-spacing: -1px;
	color: rgba(255, 255, 255, 0.8);
}

.pop-close button {
	float: right;
	font-size: 14px;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.8);
	line-height: 20px;
}
/* .today-close2 img {
	display: inline-block;
	vertical-align: middle;
	width: 16px;
}

.today-close2 p {
	display: inline-block;
	vertical-align: middle;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.6);
	opacity: 0.9;
	letter-spacing: -1px;
	line-height: 23px;
} */
/* !연휴 팝업 */


/* popup */
.popup-layer-wrap{
	overflow: hidden;
}
.popup-layer-wrap .slick-track{
	height:64px;
}
.popup-layer-wrap .slick-arrow{
	display: none !important;
}
.popup-layer{
	box-sizing: border-box;
	width: 100%;
	min-width: 1440px;
	height: 64px;
	font-size: 0;
	overflow: hidden;
}
.popup-layer.case{
	background:linear-gradient(to right, #00cc83 60%, #101820 40%);
	border-bottom: 2px solid #00cc83;
}
.popup-layer .inner{
	height:64px;
}
.today-close button {
	display: block;
}

.today-close img {
	width: 16px;
}

/* 띠배너 기본값 */
.popup-layer.default{
	height:64px;
}
.popup-layer.default *{
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

.popup-layer.default .inner{
	width:100%;
	max-width: 1000px;
	margin:0 auto;
	position: relative;
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.popup-layer.default .popup-text{
	width:auto;
	display: flex;
	align-items: center;
  height: 100%;
}
.popup-layer.default .popup-text img{
	display: inline-block;
	vertical-align: bottom;
}
.popup-layer.default .popup-text p{
	margin-top:0;
	margin-left: 20px;
	line-height: 66px;
}
.popup-layer.default .popup-btn{
  display: flex;
  align-items: center;
  justify-content: center;
}
.popup-layer.default .popup-btn a{
	display: inline-block;
}
.popup-layer.default .popup-btn img{
	width:100%;
}
/* !띠배너 기본값 */

/* 컴플레인 안내 배너 */
.popup-layer.after-service{
	background-color: #ECEFF2;
}
.popup-layer.after-service .inner{
	justify-content: center;
	gap:40px;
}
.popup-layer.after-service .popup-text img{
	width:65px;
	vertical-align: middle;
}
.popup-layer.after-service .popup-text p {
	color: #444e5a;
	font-weight: 600;
	font-family: 'Pretendard';
}
.popup-layer.after-service .popup-text b{
	font-weight: 700;
	font-size: 20px;
	padding-left: 12px;
}
.popup-layer.after-service .popup-btn a{
	width: 166px;
	height: 36px;
}
/* !컴플레인 안내 배너 */
/* !popup */



/* main-header */
#main-header{
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
	width: 100%;
	height: 72px;
	background-color: transparent;
  z-index: 10;
}

#main-header .gnb-menu .gnb-text {
  color: #fff;
}


.event{
	position: relative;
}

.mypage > a:hover + .mypage-box{
  display: block;
}
#main-header .mypage .my-menu{
  border: none;
  background-color: transparent;
  color: #fff;
}
/* !header */


#page-wrap > section, 
#page-wrap > article{
  padding: 100px 0;
  overflow: hidden;
}
section > .inner{
  width: 1120px;
  margin: 0 auto;
  position: relative;
}
section .title-wrap{

}
section .title-wrap .title{
  color: var(--Color-Text-black, #11151C);
  text-align: center;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
section .title-wrap .desc{
  color: var(--Color-Text-black, #11151C);
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 170%;
  padding-top: 24px;
}

section .text-wrap h3{
  font-size: 36px;
  font-weight: 700;
  line-height: 150%; /* 54px */
  text-align: left;
  padding-bottom: 24px;
}
section .text-wrap h5{
  font-size: 20px;
  font-weight: 400;
  line-height: 170%; /* 34px */
  text-align: left;
}
.floating-wrap{
  width: 600px;
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  padding: 24px;
  border-radius: 12px;
  background: rgba(17, 21, 28, 0.80);
  backdrop-filter: blur(12.5px);
  -webkit-backdrop-filter: blur(12.5px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  z-index: 10;
  bottom: -100%;
  transition: 0.3s;
}
.floating-wrap.on{
  bottom: 24px;
}
.floating-wrap .floating-text{
  flex: 1;
}
.floating-wrap .floating-text h5{
  color: #00E599;
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 24px */
  padding-bottom: 2px;
}
.floating-wrap .floating-text p{
  color: var(--Color-Text-white, #FFF);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  text-align: left;
}
.floating-wrap button{
  flex: 1;
  cursor: pointer;
  height: 56px;
  line-height: 56px;
  text-align: center;
  border-radius: var(--Radius-8, 8px);
  background: var(--Color-Background-Button-Primary, #0C8);
  color: var(--Semantic-Color-Text-white, #FFF);
  font-size: var(--size-font-title-title-1, 18px);
  font-style: normal;
  font-weight: 700;
}
/* 스크롤바 */
.slider-wrapper{
  width: 100%;
  height: 100%;
  scrollbar-width: none;
  -ms-overflow-style: none;
  overflow-x: auto;
  overflow-y: clip;
  position: relative;
}
.slider-wrapper:hover{
  scrollbar-width: block;
  -ms-overflow-style: block;
}
.scroll-wrapper{
  position: relative;
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  /* 스크롤바 완전히 숨기기 */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.scroll-wrapper::-webkit-scrollbar {
  display: none;
}
.slide-wrapper:hover .scroll-wrap::-webkit-scrollbar-thumb{
  border-radius: 4px;
  background-color: #C1C9D6;
}
.scroll-wrap{
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  cursor: grab;
  user-select: none;
  /* 스크롤바 숨기기 */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.scroll-wrap::-webkit-scrollbar {
  display: none;
}
.scroll-wrap.active {
  cursor: grabbing;
}
.scroll-wrap::-webkit-scrollbar{
  position: relative;
  display: block;
  width: 100%;
  height: 4px;
  background: transparent; 
  -webkit-appearance: block;
}
/* !스크롤바 */

/* 슬라이드 공통 */
#page-wrap .slick-dots{
  position: absolute;
  bottom: 40px;
  width: fit-content;
  margin: 0 auto;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
#page-wrap .slick-dots li{
  margin: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  overflow: hidden;
}
#page-wrap .slick-dots li.slick-active{
  width: 40px;
  border-radius: 8px;
}
#page-wrap .slick-dots li button{
  width: 100%;
  height: 100%;
  background: #fff;
  padding: 0;
}
#page-wrap .slick-dots li.slick-active button{
  background-color: #414B58;
}
#page-wrap .slick-dots li button:before{
  display: none;
}
/* 슬라이드 공통 */

/* hero-wrap */
#page-wrap section.hero-wrap{
  background: url("https://images.carvazo.com/carvazo/main/pc/home_test/251203/hero_bg.webp") center center / cover no-repeat;
  padding: 136.25px 0px;
  text-align: center;
}
.hero-wrap .hero-text{
  padding-bottom: 32px;
}
.hero-wrap .hero-text, 
.hero-wrap .hero-text b{
  color: var(--color-static-white, #FFF);
  text-align: center;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  
}
.hero-wrap .hero-text b{
  display: block;
  color: var(--color-green-500, #0C8);
  padding-bottom: 0
}
.hero-wrap > .inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hero-wrap .left-section{
  width: 620px;
  flex: 0 0 620px;
  position: relative;
  top: -60px;
}
.hero-wrap .right-section{
  flex: 0 0 360px;
  width: 360px;
}
.hero-wrap .hero-review-list{
  margin: 0 auto;
  border: 1px solid var(--color-neutral-200, #D9E1EE);
  border-radius: 16px;
  overflow: hidden;
  width: 100%;
  height: 160px;
  background: rgba(255, 255, 255, 0.90);
  backdrop-filter: blur(2px);
}
.hero-wrap .hero-review-list li{
  width: 100%;
  height: 160px;
  padding: 32px 42px;
  text-align: center;
  position: relative;
}

.hero-wrap .hero-review-list li::before,
.hero-wrap .hero-review-list li::after{
  content: '';
  position: absolute;
  top: 32px;
  width: 20px;
  height: 16px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero-wrap .hero-review-list li::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='16' viewBox='0 0 20 16' fill='none'%3E%3Cpath d='M9.90244 1.46835C9.90244 1.70464 9.8374 1.8903 9.70732 2.02531C9.57724 2.12658 9.41463 2.21097 9.21951 2.27848C7.82114 2.91983 6.82927 3.66245 6.2439 4.50633C5.65854 5.35021 5.36585 6.34599 5.36585 7.49367C5.36585 7.83122 5.44715 8.1519 5.60976 8.4557C5.77236 8.75949 6.14634 9.40084 6.73171 10.3797L3.36585 7.74684C3.85366 7.5443 4.35772 7.44304 4.87805 7.44304C5.82114 7.44304 6.73171 7.79747 7.60976 8.50633C8.4878 9.21519 8.92683 10.211 8.92683 11.4937C8.92683 12.8439 8.47154 13.9409 7.56098 14.7848C6.68293 15.5949 5.62602 16 4.39024 16C3.05691 16 1.98374 15.4768 1.17073 14.4304C0.390244 13.3502 0 12.0844 0 10.6329C0 8.87764 0.292683 7.34177 0.878049 6.02532C1.49594 4.67511 2.26016 3.56118 3.17073 2.68354C4.0813 1.80591 5.04065 1.14768 6.04878 0.708861C7.05691 0.236287 7.95122 0 8.73171 0C9.08943 0 9.36585 0.185653 9.56098 0.556961C9.78862 0.894513 9.90244 1.19831 9.90244 1.46835ZM20 1.46835C20 1.70464 19.935 1.8903 19.8049 2.02531C19.6748 2.12658 19.5122 2.21097 19.3171 2.27848C17.9187 2.91983 16.9268 3.66245 16.3415 4.50633C15.7561 5.35021 15.4634 6.34599 15.4634 7.49367C15.4634 7.83122 15.5447 8.1519 15.7073 8.4557C15.8699 8.75949 16.2439 9.40084 16.8293 10.3797L13.4634 7.74684C13.9512 7.5443 14.4553 7.44304 14.9756 7.44304C15.9187 7.44304 16.8293 7.79747 17.7073 8.50633C18.5854 9.21519 19.0244 10.211 19.0244 11.4937C19.0244 12.8439 18.5691 13.9409 17.6585 14.7848C16.7805 15.5949 15.7236 16 14.4878 16C13.1545 16 12.0813 15.4768 11.2683 14.4304C10.4878 13.3502 10.0976 12.0844 10.0976 10.6329C10.0976 8.87764 10.3902 7.34177 10.9756 6.02532C11.5935 4.67511 12.3577 3.56118 13.2683 2.68354C14.1789 1.80591 15.1382 1.14768 16.1463 0.708861C17.1545 0.236287 18.0488 0 18.8293 0C19.187 0 19.4634 0.185653 19.6585 0.556961C19.8862 0.894513 20 1.19831 20 1.46835Z' fill='%2311151C'/%3E%3C/svg%3E");
  left: 42px;
}
.hero-wrap .hero-review-list li::after{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='16' viewBox='0 0 20 16' fill='none'%3E%3Cpath d='M10.0976 13.8051C10.0976 13.5806 10.1626 13.4042 10.2927 13.276C10.4228 13.1798 10.5854 13.0996 10.7805 13.0355C12.1789 12.4262 13.1707 11.7207 13.7561 10.919C14.3415 10.1173 14.6341 9.17132 14.6341 8.08103C14.6341 7.76035 14.5528 7.45571 14.3902 7.1671C14.2276 6.87849 13.8537 6.26921 13.2683 5.33926L16.6341 7.84052C16.1463 8.03292 15.6423 8.12913 15.122 8.12913C14.1789 8.12913 13.2683 7.79242 12.3902 7.119C11.5122 6.44558 11.0732 5.49959 11.0732 4.28103C11.0732 2.99833 11.5285 1.95613 12.439 1.15445C13.3171 0.384824 14.374 1.28896e-05 15.6098 1.27816e-05C16.9431 1.2665e-05 18.0163 0.497061 18.8293 1.49115C19.6098 2.51731 20 3.71985 20 5.09875C20 6.76626 19.7073 8.22533 19.122 9.47596C18.5041 10.7587 17.7398 11.8169 16.8293 12.6506C15.9187 13.4844 14.9594 14.1097 13.9512 14.5266C12.9431 14.9755 12.0488 15.2 11.2683 15.2C10.9106 15.2 10.6341 15.0236 10.439 14.6709C10.2114 14.3502 10.0976 14.0616 10.0976 13.8051ZM1.7854e-06 13.8051C1.76578e-06 13.5806 0.0650423 13.4042 0.195125 13.276C0.325207 13.1798 0.487806 13.0996 0.682928 13.0355C2.0813 12.4262 3.07317 11.7207 3.65854 10.919C4.2439 10.1173 4.53659 9.17132 4.53659 8.08103C4.53659 7.76035 4.45529 7.45571 4.29268 7.1671C4.13008 6.8785 3.7561 6.26921 3.17073 5.33926L6.53659 7.84052C6.04878 8.03292 5.54472 8.12913 5.02439 8.12913C4.0813 8.12913 3.17073 7.79242 2.29268 7.119C1.41464 6.44558 0.97561 5.49959 0.97561 4.28103C0.97561 2.99833 1.4309 1.95613 2.34146 1.15445C3.21951 0.384825 4.27642 1.37724e-05 5.5122 1.36643e-05C6.84553 1.35478e-05 7.9187 0.497062 8.73171 1.49115C9.51219 2.51731 9.90244 3.71985 9.90244 5.09875C9.90244 6.76626 9.60976 8.22533 9.02439 9.47596C8.40651 10.7587 7.64228 11.8169 6.73171 12.6506C5.82114 13.4844 4.86179 14.1097 3.85366 14.5266C2.84553 14.9755 1.95122 15.2 1.17073 15.2C0.813011 15.2 0.536589 15.0236 0.341465 14.6709C0.113823 14.3502 1.80783e-06 14.0616 1.7854e-06 13.8051Z' fill='%2311151C'/%3E%3C/svg%3E");
  right: 42px;
}
.hero-wrap .hero-review-list li .review-text{
  color: var(--color-static-black, #11151C);
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.hero-wrap .hero-review-list li .review-text b{
  display: block;
  text-align: center;
  color: var(--color-green-700, #00B277);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.hero-wrap .hero-review-list li .reviewer{
  margin: 0;
  padding-top: 12px;
  color: var(--color-static-black, #11151C);
  text-align: center;
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}

.mechanic-search-filter{
  width: 100%;
  background-color: #fff;
  padding: 36px 24px;
  border-radius: 12px;
  border: 1px solid var(--color-neutral-200, #D9E1EE);
}
.mechanic-search-filter *{
	box-sizing: border-box;
}
.mechanic-search-filter .title{
	color: var(--Color-Text-black, #11151C);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 27px */
  padding-bottom: 32px;
}
.mechanic-search-filter form{
  width: 100%;
}
.mechanic-search-filter .filter-contents-wrap{
	width: 100%;
}

.mechanic-search-filter .calendar-container .calendar{
	padding: 0;
}
.mechanic-search-filter .search-filter-wrap{
  padding-top: 0;
	min-width: auto;
  display: block;
}
.mechanic-search-filter .search-filter-wrap h4{
	color: var(--color-static-black, #11151C);
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	line-height: 150%;
	position: relative;
	padding-left: 28px;
  text-align: left;
}
.mechanic-search-filter .search-filter-wrap h4::before{
	content:'';
	width: 20px;
	height: 20px;
	position: absolute;
	top: 2px;
	left: 0px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: auto;
}
.mechanic-search-filter .search-filter-wrap h4+p{
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-xs, 15px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 22.5px */ 
  padding-top: 8px;
  text-align: left;
}
.mechanic-search-filter .brand-name-wrap h4::before{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.6064 3.22363C16.5879 3.22371 17.47 3.82368 17.8311 4.73633L19.5439 9.06543H20.1348C20.9274 9.06567 21.5693 9.70833 21.5693 10.501V13.2568L21.5703 13.2676V19.9658C21.5703 20.7585 20.9274 21.4011 20.1348 21.4014H18.2207C17.4279 21.4014 16.7852 20.7586 16.7852 19.9658V18.6191H7.21484V19.9658C7.21484 20.7586 6.57209 21.4014 5.7793 21.4014H3.86523C3.07264 21.4011 2.42969 20.7585 2.42969 19.9658V10.501C2.42969 9.70832 3.07263 9.06565 3.86523 9.06543H4.45703L6.16992 4.73633C6.53105 3.82362 7.41298 3.22364 8.39453 3.22363H15.6064ZM7.14844 12.5264C6.42183 12.5264 5.83315 13.1152 5.83301 13.8418C5.83301 14.5685 6.42174 15.1582 7.14844 15.1582C7.87516 15.1582 8.46387 14.5685 8.46387 13.8418C8.46373 13.1152 7.87508 12.5264 7.14844 12.5264ZM16.8516 12.5264C16.125 12.5265 15.5363 13.1153 15.5361 13.8418C15.5361 14.5685 16.1249 15.1581 16.8516 15.1582C17.5783 15.1582 18.168 14.5685 18.168 13.8418C18.1678 13.1152 17.5782 12.5264 16.8516 12.5264ZM8.39453 5.1377C8.19823 5.1377 8.02144 5.25789 7.94922 5.44043L6.51563 9.06543H17.4854L16.0508 5.44043C15.9785 5.25805 15.8026 5.13778 15.6064 5.1377H8.39453Z' fill='%2311151C'/%3E%3C/svg%3E");
}
.mechanic-search-filter .place-wrap h4::before{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 2.5C16.4182 2.50001 19.9999 6.08179 20 10.5C20 14.1308 14.5976 19.8984 12.6719 21.8389C12.2976 22.2158 11.7024 22.2158 11.3281 21.8389C9.40236 19.8984 4 14.1308 4 10.5C4.00007 6.08179 7.58177 2.5 12 2.5ZM12 7.41113C10.5949 7.41113 9.45534 8.55005 9.45508 9.95508C9.45508 11.3603 10.5948 12.5 12 12.5C13.4052 12.4999 14.5439 11.3603 14.5439 9.95508C14.5437 8.5501 13.405 7.41122 12 7.41113Z' fill='%2311151C'/%3E%3C/svg%3E");
}
.mechanic-search-filter .date-wrap h4::before{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M12.4129 9.31722C12.7013 9.02017 13.1761 9.01273 13.4733 9.30094C13.7706 9.58936 13.778 10.0648 13.4896 10.3621L9.93166 14.0291C9.64705 14.3225 9.17968 14.3342 8.88104 14.0552L6.89455 12.1973C6.59211 11.9144 6.57603 11.4402 6.85874 11.1377C7.14165 10.8351 7.61658 10.819 7.91913 11.1019L9.3677 12.4561L12.4129 9.31722Z' fill='%2311151C'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.88381 1.32812C6.34395 1.32824 6.71714 1.70129 6.71714 2.16146V3.0306H13.2829V2.16146C13.2829 1.70131 13.6561 1.32828 14.1162 1.32812H14.6387C15.0989 1.32821 15.472 1.70128 15.472 2.16146V3.0306H16.3957C17.0844 3.0307 17.6424 3.59031 17.6424 4.2806V16.25C17.6424 17.4006 16.7097 18.3333 15.5591 18.3333H4.44094C3.29035 18.3333 2.35761 17.4006 2.3576 16.25V4.2806C2.3576 3.59031 2.91569 3.0307 3.60435 3.0306H4.52801V2.16146C4.52801 1.7013 4.90122 1.32825 5.36135 1.32812H5.88381ZM4.02427 16.25C4.02428 16.4801 4.21082 16.6667 4.44094 16.6667H15.5591C15.7892 16.6667 15.9758 16.4801 15.9758 16.25V7.61393H4.02427V16.25Z' fill='%2311151C'/%3E%3C/svg%3E");
}
.mechanic-search-filter .brand-name-wrap{
  margin-bottom: 16px;
}
.mechanic-search-filter .date-wrap{
  padding-top: 32px;
}
.mechanic-search-filter .input-wrap{
	border-radius: 8px;
	border: 1px solid var(--color-neutral-200, #D9E1EE);
	width: 100%;
	height: 56px;
	/* padding: 0 32px 0 0; */
	position: relative;
  cursor: pointer;
  background-repeat: no-repeat;
  background-size: 16px;
  background-position: right 16px center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' viewBox='0 0 16 17' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.4873 5.24513C14.2361 4.97597 13.8142 4.96142 13.5451 5.21264L7.99996 10.3881L2.45484 5.21264C2.18568 4.96142 1.76382 4.97597 1.5126 5.24513C1.26137 5.5143 1.27592 5.93616 1.54509 6.18738L7.54508 11.7874C7.80122 12.0264 8.1987 12.0264 8.45484 11.7874L14.4548 6.18738C14.724 5.93616 14.7385 5.5143 14.4873 5.24513Z' fill='%23A9B4C4'/%3E%3C/svg%3E");
}

.mechanic-search-filter .input-wrap::after{
	content:'';
	width: 16px;
	height: 16px;
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' viewBox='0 0 16 17' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.4873 5.24513C14.2361 4.97597 13.8142 4.96142 13.5451 5.21264L7.99996 10.3881L2.45484 5.21264C2.18568 4.96142 1.76382 4.97597 1.5126 5.24513C1.26137 5.5143 1.27592 5.93616 1.54509 6.18738L7.54508 11.7874C7.80122 12.0264 8.1987 12.0264 8.45484 11.7874L14.4548 6.18738C14.724 5.93616 14.7385 5.5143 14.4873 5.24513Z' fill='%23A9B4C4'/%3E%3C/svg%3E");
  display: none;
}
.mechanic-search-filter .input-wrap::before{
  content:'';
	width: 20px;
	height: 20px;
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
}
.mechanic-search-filter .brand-name-wrap .input-wrap::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='21' viewBox='0 0 20 21' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.0054 2.7697C13.8232 2.76977 14.5583 3.26974 14.8592 4.03028L16.2866 7.63786H16.779C17.4394 7.63806 17.9744 8.17361 17.9744 8.83415V11.1307L17.9752 11.1397V16.7215C17.9752 17.3821 17.4395 17.9176 16.779 17.9178H15.1839C14.5232 17.9178 13.9876 17.3822 13.9876 16.7215V15.5993H6.01235V16.7215C6.01235 17.3822 5.47672 17.9178 4.81606 17.9178H3.22101C2.56051 17.9176 2.02472 17.3821 2.02472 16.7215V8.83415C2.02472 8.17361 2.56051 7.63805 3.22101 7.63786H3.71417L5.14158 4.03028C5.44252 3.26969 6.17746 2.7697 6.99542 2.7697H13.0054ZM5.95701 10.522C5.35151 10.522 4.86094 11.0127 4.86082 11.6182C4.86082 12.2238 5.35143 12.7151 5.95701 12.7152C6.56261 12.7152 7.0532 12.2238 7.0532 11.6182C7.05309 11.0127 6.56254 10.522 5.95701 10.522ZM14.0429 10.522C13.4375 10.5221 12.9469 11.0127 12.9468 11.6182C12.9468 12.2237 13.4374 12.7151 14.0429 12.7152C14.6486 12.7152 15.14 12.2238 15.14 11.6182C15.1398 11.0127 14.6485 10.522 14.0429 10.522ZM6.99542 4.36475C6.83183 4.36475 6.68452 4.46491 6.62433 4.61703L5.42967 7.63786H14.5711L13.3756 4.61703C13.3154 4.46505 13.1688 4.36482 13.0054 4.36475H6.99542Z' fill='%2311151C'/%3E%3C/svg%3E");
}
.mechanic-search-filter .place-wrap .input-wrap::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.99998 1.66667C13.6818 1.66668 16.6666 4.6515 16.6666 8.33334C16.6666 11.359 12.1647 16.1654 10.5599 17.7824C10.248 18.0965 9.752 18.0965 9.44008 17.7824C7.83528 16.1654 3.33331 11.359 3.33331 8.33334C3.33337 4.65149 6.31812 1.66667 9.99998 1.66667ZM9.99998 5.75928C8.82907 5.75928 7.87943 6.70838 7.87921 7.87924C7.87921 9.05028 8.82894 10 9.99998 10C11.171 9.99993 12.1199 9.05023 12.1199 7.87924C12.1197 6.70842 11.1708 5.75935 9.99998 5.75928Z' fill='%2311151C'/%3E%3C/svg%3E");
}

.mechanic-search-filter .search-filter-wrap > .input-wrap > input{
	width: 100%;
	height: 100%;
	line-height: 56px;
	text-indent: 16px;
	overflow: hidden;
	color: var(--color-static-black, #11151C);
	text-overflow: ellipsis;
  white-space: nowrap;
	font-size: var(--font-size-md, 16px);
	font-style: normal;
	font-weight: 500;
	border : none;
	margin: 0;
	float: none;
	border-radius: 0;
	padding: 0;
  text-indent: 44px;
  padding-right: 42px;
  cursor: pointer;
}
.mechanic-search-filter .input-wrap input.active{
	font-weight: 500;
	border: none;
	background-color: transparent;
	color: #11151c;
}
.mechanic-search-filter .input-wrap input::-webkit-input-placeholder {
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	color: var(--color-static-black, #11151C);
	font-weight: 500;
}

.mechanic-search-filter .input-wrap input::-moz-input-placeholder {
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	color: var(--color-static-black, #11151C);
	font-weight: 500;
}

.mechanic-search-filter .input-wrap input:-ms-input-placeholder {
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
	color: var(--color-static-black, #11151C);
	font-weight: 500;
}
.calendar .calendar-notice{
	display: none;
}
.mechanic-search-filter .date-wrap h4 p{
	padding-top: 8px;
	color: var(--color-neutral-600, #717D8E);
	font-size: var(--font-size-sm, 14px);
	font-style: normal;
	font-weight: 500;
	line-height: 150%; /* 21px */
	text-indent: -32px;
}
.mechanic-search-filter .calendar-container{
  padding: 16px 0 32px;
}
.mechanic-search-filter .search-mechanic-btn{
	width: 100%;
	height: 56px;
	line-height: 56px;
	text-align: center;
	border-radius: var(--Radius-8, 8px);
	background: var(--color-green-500, #0C8);
	color: var(--color-static-white, #FFF);
	font-size: var(--font-size-md, 16px);
	font-style: normal;
	font-weight: 700;
}
.mechanic-search-filter .search-mechanic-btn:disabled{
	background-color: #C1C9D6;
}
.index-form {
	padding-top: 35px;
}
/* !hero-wrap */

/* main-wrap */
.main-wrap {
	position: relative;
	width: 100%;
  background: #F5F8FC;
}
.main-wrap .method-banner-wrap{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.main-wrap .banner-wrap{
  position: relative;
  width: 552px;
  flex: 0 0 552px;
}
.main-wrap .banner-wrap .banner-page-wrap{
  position: absolute;
  right: 36px;
  bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 4px 10px;
}
.main-wrap .banner-wrap .banner-page-wrap button{
  width: 14px;
  height: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.main-wrap .banner-wrap .banner-page-wrap span{
  color: rgba(255, 255, 255, 0.70);
  font-size: var(--font-size-2xs, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}
.main-wrap .banner-wrap .banner-page-wrap span.current{
  color: var(--color-static-white, #FFF);
  font-size: var(--font-size-2xs, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.main-wrap .banner-wrap .divi{
  color: var(--color-static-white, #FFF);
  font-size: var(--font-size-2xs, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}
.main-wrap .banner-list{
  width: 100%;
  margin-bottom: 0;
  border-radius: 12px;
  overflow: hidden;
}
/* 배너 공통 */
.main-wrap .banner-item{
  width: 100%;
  height: 219px;
}
.main-wrap .banner-item a{
  width: 100%;
  height: 100%;
  padding: 24px 36px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.main-wrap .banner-item .banner-title{
  color: var(--color-static-black, #11151C);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.main-wrap .banner-item .banner-text{
  color: var(--color-static-black, #11151C);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  padding-top: 8px;
  margin: 0;
}
.main-wrap .banner-item .banner-button{
  margin-top: 24px;
  display: block;
  text-decoration: underline;
  color: var(--color-neutral-900, #2B323B);
  font-size: var(--font-size-2xs, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}
.main-wrap .banner-item .banner-img-wrap{
  flex: 0 0 120px;
  width: 100%;
}
.main-wrap .banner-item .banner-img-wrap img{
  width: 100%;
}
/* !배너 공통 */
/* 배너 개별 */
.main-wrap .banner-item.discount-banner{
  background: linear-gradient(80deg, #F6FFDD 19.81%, #B5EB2A 86.28%);
}
.main-wrap .banner-item.equipment-banner{
  background: linear-gradient(80deg, #FFF2DE 19.81%, #FFE299 86.28%);
}
.main-wrap .banner-item.care-banner{
  background: linear-gradient(80deg, #E4FFDB 19.81%, #10A100 86.28%);
}
.main-wrap .banner-item.naverpay-banner{
  background: linear-gradient(80deg, #D5EAFF 19.81%, #0242CB 86.28%);
}
/* !배너 개별 */

.method-filter-wrap{
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.method-filter-wrap a{
  flex: 1;
  border-radius: 12px;
  background: var(--color-neutral-50, #fff);
  padding: 32px 20px;
  display: block;
  background-position: right 20px bottom 20px;
  background-repeat: no-repeat;
  position: relative;
}
.method-filter-wrap .method-visit{
  background-image: url("https://images.carvazo.com/carvazo/main/pc/home_test/251203/main_visit_img.webp");
  background-size: 80px auto;
}
.method-filter-wrap .method-center{
  background-image: url("https://images.carvazo.com/carvazo/main/pc/home_test/251203/main_center_img.webp");
  background-size: 80px auto;
}
.method-filter-wrap .method-badge{
  display: flex;
  padding: 4px 12px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 25px;
  color: var(--color-static-white, #FFF);
  font-size: var(--font-size-2xs, 14px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  position: absolute;
  left: 19px;
  top: -15px;
  width: fit-content;
}
.method-filter-wrap .method-badge.visit{
  background: #0c8;
}
.method-filter-wrap .method-badge.center{
  background: #313A5A;
}
.method-filter-wrap .method-desc{
  margin: 0;
  color: var(--color-green-700, #00B277);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%; /* 27px */
  text-align: left;
}
.method-filter-wrap .method-title{
  text-align: left;
  padding-top: 2px;
  color: var(--color-static-black, #11151C);
  font-size: var(--font-size-lg, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 30px */
}
.method-filter-wrap .method-text{
  padding-top: 24px;
  text-align: left;
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 24px */
}
.area-filter-wrap{
  padding-top: 48px;
}
.area-filter-wrap h4{
  padding-bottom: 16px;
  color: var(--color-static-black, #11151C);
  font-size: var(--font-size-lg, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.area-filter-wrap ul{
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 16px;
  flex-wrap: wrap;
}
.area-filter-wrap ul li{
  flex: 0 0 calc((100% - 48px) / 4);
  width: calc((100% - 48px) / 4);
}
.area-filter-wrap ul li a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 16px;
  border-radius: 8px;
  background: var(--color-static-white, #FFF);
  box-shadow: 0 0 12px 0 rgba(46, 86, 136, 0.04);
  color: var(--color-static-black, #11151C);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
/* !main-wrap */

/* intro-wrap */
#page-wrap section.intro-wrap{
  background-image: url('https://images.carvazo.com/carvazo/main/pc/home_test/250925/intro_bg.webp');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.intro-wrap .title-wrap .title{
  color: #fff;
}
.intro-wrap .title-wrap .title b{
  background: var(--2, linear-gradient(90deg, #CEFF48 14.21%, #00FF26 57.65%, #00BD74 98.09%));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.intro-wrap .title-wrap .desc{
  color: #fff;
}
.intro-wrap .intro-list{
  margin: 48px 0;
  padding: 12px 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro-wrap .intro-list .intro-item{
  flex: 1;
  text-align: center;
  position: relative;
  border-right: 1px solid #414B58;
}
.intro-wrap .intro-list .intro-item:last-of-type{
  border-right: none;
}
.intro-wrap .intro-list .intro-title{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--color-neutral-500, #8D97A5);
  text-align: center;
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  padding-bottom: 8px;
}
.intro-wrap .intro-list .intro-text{
  margin: 0;
  color: var(--color-static-white, #FFF);
  text-align: center;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 54px */
}
.intro-wrap .special-box{
  padding: 40px;
  border-radius: 16px;
  background: #FFF;
  overflow: hidden;
}
.intro-wrap .special-box .special-title{
  margin: 0;
  padding-bottom: 32px;
  color: var(--Color-Text-black, #11151C);
  text-align: center;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%; /* 36px */
}
.intro-wrap .special-list{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.intro-wrap .special-list .special-item{
  flex: 1;
  padding: 40px;
  border-radius: 16px;
  background: var(--color-neutral-50, #F5F8FC);
  overflow: hidden;
  text-align: left;
}
.intro-wrap .special-item .img-wrap{
  width: 84px;
}
.intro-wrap .special-item .img-wrap img{
  width: 100%;
}
.intro-wrap .special-item .text-wrap{
  padding-top: 16px;
}
.intro-wrap .special-item .text-wrap h6{
  margin: 0;
  color: #FF7240;
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%; /* 27px */
}
.intro-wrap .special-item:nth-of-type(2) .text-wrap h6{
  color: #2C6EF5;
}
.intro-wrap .special-item:nth-of-type(3) .text-wrap h6{
  color: #00B6B4;
}
.intro-wrap .special-item .text-wrap h5{
  color: var(--color-static-black, #11151C);
  font-size: var(--font-size-lg, 20px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  padding: 12px 0;
}
.intro-wrap .special-item .text-wrap p{
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  text-align: left;
}
/* !intro-wrap */

/* info-wrap */
.info-wrap .tab-wrap{
  margin-top: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 128px;
}
.info-wrap .tab-wrap .tab-menu-list{
  width: 157px;
  flex: 0 0 157px;
  position: relative;
}
.info-wrap .tab-wrap .tab-menu-list::before{
  content: '';
  width: 4px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: 4px;
  background: #E4ECF7;
}
.info-wrap .tab-wrap .tab-menu-list::after{
  content: '';
  width: 4px;
  height: 140px;
  left: 0;
  top: var(--active-top, 0px);
  position: absolute;
  border-radius: 4px;
  background: var(--color-green-500, #0C8);
  transition: top 0.3s ease-in-out;
}
.info-wrap .tab-wrap .tab-menu-list .tab-menu-item{
  padding-left: 21px;
  position: relative;
  height: 140px;
  align-content: center;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.info-wrap .tab-wrap .tab-menu-list .tab-menu-item:hover .item-num,
.info-wrap .tab-wrap .tab-menu-list .tab-menu-item:hover .tab-item-title {
  color: #0C8;
}

.info-wrap .tab-wrap .tab-menu-list .tab-menu-item .item-num{
  color: var(--color-neutral-300, #C1C9D6);
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  padding-bottom: 5px;
  text-align: left;
}
.info-wrap .tab-wrap .tab-menu-list .tab-menu-item.active .item-num{
  color: #0C8;
}
.info-wrap .tab-wrap .tab-menu-list .tab-menu-item .tab-item-title{
  color: var(--color-neutral-300, #C1C9D6);
  font-size: var(--font-size-lg, 20px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.info-wrap .tab-wrap .tab-menu-list .tab-menu-item.active .tab-item-title{
  color: #11151C;
  font-weight: 700;
}
.info-wrap .tab-wrap .tab-content-box{
  flex: 0 0 calc(100% - 285px);
  width: calc(100% - 285px);
  position: relative;
  overflow: hidden;
  height: 420px;
  position: relative;
}
.slide-shadow{
  width: 160px;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 15%, rgba(255, 255, 255, 0.77) 67.84%, var(--color-static-white, #FFF) 96.22%);
  z-index: 2;
}
.info-wrap .tab-wrap .tab-content-list{
  transition: 0.3s;
}
.info-wrap .tab-wrap .tab-content-item{
  height: 420px;
}
.video-wrap .video-list{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  overflow-x: auto;
}
.video-wrap .video-list li{
  flex: 0 0 320px;
  width: 320px;
  box-sizing: border-box;
  position: relative;
  transition: 0.5s;
}
.video-wrap .video-list li::before{
  content:'';
  color: #FFF;
  font-size: var(--font-size-md, 16px);
  font-weight: 500;
  line-height: 150%; /* 24px */
  padding: 4px 8px;
  border-radius: 6px;
  background: var(--color-basic-black-70, rgba(17, 21, 28, 0.70));
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px); /* For Safari */
  position: absolute;
  left: 16px;
  top: 16px;
  z-index: 2;
}
.video-list li.slick-active{
  opacity: 1;
}

.video-list li:nth-of-type(1)::before{
  content: '엔진룸';
}
.video-list li:nth-of-type(2)::before{
  content: '외부 상태';
}
.video-list li:nth-of-type(3)::before{
  content: '프레임';
}
.video-list li:nth-of-type(4)::before{
  content: '내부 기능';
}
.video-list li:nth-of-type(5)::before{
  content: '휠 / 타이어';
}
.video-list li:nth-of-type(6)::before{
  content: '하부';
}
.video-list li:nth-of-type(7)::before{
  content: '소모품';
}
.video-list .video-box{
  width: 100%;
  height: 380px;
  overflow: hidden;
  border-radius: 12px;
  background-color: #dee1e4;
  position: relative;
}
.video-list .video-box::after{
  content: "";
	position: absolute;
	display: block;
	top: 0;
	width: 50px;
	height: 100%;
  background: linear-gradient(to right, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.05));
  animation: shine 2s infinite;
}

@keyframes shine {
	from {
		left: 0;
	}
	to {
		left: 90%;
	}
}
.video-list video{
  height: 100%;
  position: relative;
  z-index: 1;
  object-fit: cover
}
.video-list video[poster]{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-list .video-title{
  padding-top: 16px;
  color: var(--Color-Text-gray-01, #717D8E);
  text-align: center;
  font-size: var(--font-size-sm, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 21px */
}
.info-wrap .equip-slider{
  margin-left: auto;
  margin-right: auto;
  height: auto;
  width: auto;
  overflow: hidden;
}
.info-wrap .equip-list{
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-direction: row;
  gap: 16px;
}
.info-wrap .equip-slider:nth-of-type(1) .equip-list{
  width: calc(335px * 5); 
  animation: slide1 20s linear infinite;
}
.info-wrap .equip-slider:nth-of-type(2) .equip-list{
  width: calc(335px * 7); 
  animation: slide2 40s linear infinite;
  margin: 20px 0;
}
.info-wrap .equip-slider:nth-of-type(3) .equip-list{
  width: calc(335px * 6); 
  animation: slide3 30s linear infinite;
}
@keyframes slide1 {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-351px *  5));
  }
}
@keyframes slide2{
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-351px *  7));
  }
}
@keyframes slide3{
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-351px *  6));
  }
}
.equip-list li{
  flex: 0 0 335px;
  width: 335px;
  height: 126.6667px;
  padding: 16px 16px 16px 12px;
  border-radius: 12px;
  background-color: #F5F8FC;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.equip-list li .img-wrap{
  width: 66px;
  height: 66px;
  flex: 0 0 66px;
}
.equip-list li .img-wrap img{
  width: 100%;
}
.equip-list dt{
  color: var(--Color-Text-black, #11151C);
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 21px */
  color: var(--Color-Text-black, #11151C);
  padding-bottom: 4px;
}
.equip-list dd{
  color: var(--Color-Text-gray-01, #717D8E);
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 19.5px */
}
.info-wrap .report-list{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}
.info-wrap .report-list li{
  width: 320px;
  flex: 0 0 320px;
}
.info-wrap .report-list li .img-wrap{
  width: 100%;
  user-drag: none;
  -webkit-user-drag: none; /* Safari에서 필요 */
}
.info-wrap .report-list li .img-wrap img{
  width: 100%;
  user-drag: none;
  -webkit-user-drag: none; /* Safari에서 필요 */
}
.info-wrap .report-list li .text-wrap{
  padding-top: 12px;
  color: var(--Color-Text-gray-01, #717D8E);
  text-align: center;
  font-size: var(--font-size-sm, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 21px */
}
/* !info-wrap */

/* mechanic-wrap */
section.mechanic-wrap{
  background-color: #EDF4FC;
}
.mechanic-card-wrap{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin-top: 64px;
}

.mechanic-card-wrap .reserv-mechanic-card{
  border-radius: 12px;
  background: var(--color-static-white, #FFF);
  padding: 24px;
  width: 240px;
  height: 360px;
  flex: 0 0 240px;
}
.mechanic-card-wrap .reserv-mechanic-card h6{
  margin: 0;
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  padding-bottom: 12px;
}
.mechanic-card-wrap .reserv-mechanic-card h4{
  color: var(--Color-Text-black, #11151C);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  padding-bottom: 150px;
}
.mechanic-card-wrap .reserv-mechanic-card button{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;;
  width: 100%;
  height: 40px;
  line-height: 40px;
  background: #0c8;
  color: var(--color-static-white, #FFF);
  text-align: center;
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 600;
  border-radius: 8px;
}
.mechanic-wrap .mechanic-list-wrap{
  width: calc(100% - 252px);
  flex: 0 0 calc(100% - 252px);
}
.mechanic-wrap .mechanic-list{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
}
.mechanic-wrap .mechanic-item{
  flex: 0 0 440px;
  width: 440px;
  height: 360px;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.mechanic-wrap .mechanic-item .img-wrap{
  width: 240px;
  height: 100%;
  position: relative;
  user-drag: none;
  -webkit-user-drag: none; /* Safari에서 필요 */
}
.mechanic-wrap .mechanic-item .img-wrap img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-drag: none;
  -webkit-user-drag: none; /* Safari에서 필요 */
}

.mechanic-wrap .mechanic-item .img-wrap .img-text{
  position: absolute;
  left: 16px;
  bottom: 24px;
  color: var(--color-grey-grey-10, #EDF4FC);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%; /* 27px */
}
.mechanic-wrap .mechanic-item .text-wrap{
  background: #fff;
  width: 200px;
  height: 100%;
  padding: 16px;
  position: relative;
}
.mechanic-wrap .mechanic-item .text-wrap .mec-title{
  color: var(--Color-Text-black, #11151C);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  text-align: left;
}
.mechanic-wrap .mechanic-item .text-wrap .mec-name{
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 24px */
  text-align: left;
  padding-top: 12px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
}
.mechanic-wrap .mechanic-item .text-wrap .mec-profile-img{
  position: absolute;
  width: 64px;
  height: 64px;
  border-radius: 8px;
  overflow: hidden;
  right: 16px;
  bottom: 16px;
}
.mechanic-wrap .mechanic-item .text-wrap .mec-profile-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* !mechanic-wrap */

/* review-wrap */
.review-wrap .review-box{
  margin-top: 64px;
  border-radius: 16px;
  background: var(--color-neutral-900, #2B323B);
  padding: 56px 0 56px 56px;
}
.review-category-list{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 32px;
}
.review-category-item{
  border-radius: 100px;
  background: #A9B4C4;
  color: var(--color-static-black, #11151C);
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  height: 40px;
  line-height: 40px;
  padding: 0 12px;
  white-space: nowrap;
  flex: 0 0 auto;
  width: fit-content;
  min-width: fit-content;
  max-width: none;
  box-sizing: border-box;
  cursor: pointer;
}
.review-category-item.active{
  background: #fff;
  font-weight: 700;
}
.review-tab-content .review-tabcon{
  display: none;
}
.review-tab-content .review-tabcon.active{
  display: block;
}
.review-list{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  padding-right: 56px;
}
.review-list .review-item{
  flex: 0 0 480px;
  width: 480px;
  height: 498px;
  padding: 40px;
  border-radius: 16px;
  background: var(--color-static-white, #FFF);
  box-shadow: 0 0 12px 0 rgba(46, 86, 136, 0.04);
  text-align: left;
}
.review-item .user-name{
  color: var(--color-green-700, #00B277);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  padding-bottom: 12px;
}
.review-item .review-title{
  color: var(--color-static-black, #11151C);
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  padding-bottom: 12px;
}
.review-item .review-text{
  width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  word-break: break-word;
}
.review-car-info{
  margin-top: 20px;
  padding: 12px 16px;
  border-radius: 12px;
  background: var(--Color-Background-Common-Surface, #FFF);
  box-shadow: 4px 4px 12px 0 rgba(0, 39, 86, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.review-car-info .badge-wrap{
  padding-bottom: 6px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
}
.review-car-info .badge-wrap .badge{
  width: fit-content;
  height: 21px;
  line-height: 21px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 0 4px;
  color: var(--color-static-white, #FFF);
  background: #FF5E60;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  border-radius: 4px;
  overflow: hidden;
}
.review-car-info .badge-wrap .badge.grade-badge.a{
  background: #2DA2FF;
}
.review-car-info .badge-wrap .badge.grade-badge.b{
  background: #02C258;
}
.review-car-info .badge-wrap .badge.grade-badge.c{
  background: #FFBA17;
}
.review-car-info .badge-wrap .badge.grade-badge.d{
  background: #FF5E60;
}
.review-car-info .badge-wrap .badge.advice-badge.a{
  background: #E7F4FF;
  color: #2DA2FF;
}
.review-car-info .badge-wrap .badge.advice-badge.b{
  background: #DBFFE3;
  color: #02C258;
}
.review-car-info .badge-wrap .badge.advice-badge.c{
  background: #FFF8CA;
  color: #FFBA17;
}
.review-car-info .badge-wrap .badge.advice-badge.d{
  background: #FFECF1;
  color: #FF5E60;
}
.review-car-info .review-car-name{
  color: var(--color-static-black, #11151C);
  font-size: var(--font-size-sm, 16px);
  font-weight: 600;
  line-height: 150%; /* 24px */
}
.review-car-info .flaw-count{
  color: var(--color-neutral-600, #717D8E);
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 24px */
}
.review-car-info .review-img{
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
}
.review-car-info .review-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* !review-wrap */

/* step-wrap */
.step-wrap .step-list{
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* gap: 40px; */
  padding: 64px 0;
}
.step-wrap .step-list .step-item{
  flex: 1;
  position: relative;
}
.step-wrap .step-list .step-item::after{
  content: '';
  width: 34px;
  height: 6px;
  position: absolute;
  top: 49.5px;
  right: -17px;
  background: url('https://images.carvazo.com/carvazo/main/pc/home_test/250925/icon_dots.svg') center center / cover no-repeat;
}
.step-wrap .step-list .step-item:last-of-type::after{
  display: none;
}
.step-wrap .step-list .step-img{
  width: 124px;
  height: 124px;
  margin: 0 auto;
}
.step-wrap .step-list .step-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.step-wrap .step-list .step-title{
  padding-bottom: 12px;
  color: var(--Color-Text-black, #11151C);
  text-align: center;
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
  line-height: 150%; /* 27px */
}
.step-wrap .step-list .step-text{
  color: var(--color-neutral-600, #717D8E);
  text-align: center;
  font-size: var(--font-size-sm, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 24px */
}
.step-wrap .step-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 auto;
  width: 335px;
  height: 56px;
  line-height: 56px;
  border-radius: var(--Radius-8, 8px);
  border: 1px solid var(--color-neutral-200, #D9E1EE);
  background: var(--color-static-white, #FFF);
  color: var(--color-static-black, #11151C);
  text-align: center;
  font-size: var(--font-size-md, 18px);
  font-style: normal;
  font-weight: 600;
}
/* !step-wrap */

/* 장비 모달 */
.equipment-list-modal{
  position: fixed;
  z-index: 999;
  display: none;
}
.equipment-list-modal.on{
  display: block;
}
.equipment-list-modal .modal-bg{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 998;
  background: var(--color-basic-black-70, rgba(17, 21, 28, 0.70));
  z-index: 10;
}

.equipment-list-modal .modal-box{
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
  background: #fff;
  width: 420px;
  height: 80%;
  z-index: 999;
  border-radius: 8px;
  transition: 0.5s;
}
.equipment-list-modal .modal-header{
  width: 100%;
  height: 64px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.equipment-list-modal .modal-header .modal-close{
  width: 64px;
  height: 64px;
  cursor: pointer;
}
.equipment-list-modal .modal-header .modal-close svg{
  width: 24px;
  height: 24px;
}
.equipment-list-modal .modal-title-wrap{
  padding: 0 20px 16px;
}
.equipment-list-modal h4{
  color: var(--Color-Text-black, #17191C);
  font-size: var(--Size-Font-Heading-H2, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.equipment-list-modal h4 em{
  color: var(--Color-Text-green, #00B277);
  font-size: var(--Size-Font-Heading-H2, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 30px */
}
.equipment-list-modal h6{
  margin: 0;
  color: var(--Color-Text-gray-01, #717D8E);
  font-size: var(--size-font-body-body-1, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 21px */
  padding-top: 16px;
}

.equipment-list-modal .modal-contents{
  height: calc(100% - 177px);
  overflow: auto;
  padding: 0 20px 20px;
  box-sizing: border-box;
}

.equipment-list-modal .modal-contents li{
  padding: 16px 16px 16px 12px;
  margin-top: 8px;
  border-radius: 12px;
  background-color: #F5F8FC;
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.equipment-list-modal .modal-contents li:last-of-type{
  margin-bottom: 20px;
}
.equipment-list-modal .modal-contents li .img-wrap{
  width: 66px;
  height: 66px;
  flex: 0 0 66px;
}
.equipment-list-modal .modal-contents li .img-wrap img{
  width: 100%;
}
.equipment-list-modal .modal-contents dt{
  color: var(--Color-Text-black, #11151C);
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 21px */
  color: var(--Color-Text-black, #11151C);
  padding-bottom: 4px;
}
.equipment-list-modal .modal-contents dd{
  color: var(--Color-Text-gray-01, #717D8E);
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 19.5px */
}
/* !장비 모달 */
/* !video-wrap */



/* outro-wrap */
#page-wrap > section.outro-wrap{
  text-align: center;
  display: block;
  background:url('https://images.carvazo.com/carvazo/main/pc/home_test/250602/outro_bg.webp') right bottom / cover no-repeat;
}
#page-wrap > section.outro-wrap .inner{
  padding: 91px 0;
}
#page-wrap .outro-wrap .text-wrap{
  width: 100% !important;
  margin: 0;
  text-align: center;
}
.outro-wrap .title-wrap h6{
  margin: 0;
  padding-bottom: 16px;
  color: var(--color-green-500, #0C8);
  text-align: center;
  font-size: var(--font-size-xl, 26px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.outro-wrap .title-wrap h3{
  color: var(--color-static-white, #FFF);
  text-align: center;
  font-size: 36px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%; /* 54px */
  padding-bottom: 24px;
}
.outro-wrap .title-wrap h5{
  color: var(--color-neutral-400, #A9B4C4);
  text-align: center;
  font-size: var(--font-size-lg, 20px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 30px */
}
/* !outro-wrap */

/* 프로모션 모달 */
.discount-modal.layer-modal-wrap .layer-modal{
  width: 420px;
}
.discount-modal .img-wrap{
  position: relative;
}
.item-time {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  gap: 8px;
  width: 248px;
}
.time-card {
  flex: 1;
  width: 25%;
  height: 72px;
  border-radius: 8px;
  background: #192438;
  text-align: center;
  color: #BDF03B;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}
.time-card canvas{
  top: 8px;
  position: relative;
}
.time-word {
  text-align: center;
  color: #C1C9D6;
  font-size: var(--font-size-2xs, 12px);
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 18px */
}
/* !프로모션 모달 */