/*common*/
@import url('/data/font/pretendard.css');
@import url('/data/font/gmarket.css');

.ft-gm {font-family: 'GmarketSans';}
.bold {font-weight:bold;}
.ft500 {font-weight:500;}
.img-responsive {width:100%;}
.pc {display:none;}
.mobile {display:block;}
.mbr {display:block; width:100%; height:1px;}
.br {display:none;}
label {cursor:pointer;}

/*scrollbar*/
::-webkit-scrollbar { width: 5px;}
::-webkit-scrollbar-track { background:#f8f8f8;   }
 ::-webkit-scrollbar-thumb {  background: #b8b8b8;   border-radius: 10px;}

/*color*/
/*Primary red : f4142a*/

.fc-p {color:#082A66;}
a.fc-p {color:#082A66;}
a.bg-p {background:#082A66;}
button.fc-p {color:#082A66;}
button.bg-p {background:#082A66;}
.bg-p {background:#082A66;}
.bb-p {border:1px solid #082A66;}

.contour {max-width:1280px; width:100%; height:12px;background: #F5F5F5; margin:0 auto;
box-shadow: inset 0px 1.09px 2.18px rgba(97, 97, 97, 0.05), inset 0px 0.55px 1.09px rgba(97, 97, 97, 0.1);}

#estimate {font-family: 'Pretendard', 'Dotum', sans-serif;}
#estimate .container {margin:0 auto; padding:0 15px; max-width:1280px; color:#494949; width:100%;}
#estimate .container100 {margin:0 auto; max-width:1280px; color:#494949; width:100%;}
#estimate .esBtn.bt-right {text-align:right;}
#estimate .esBtn.bt-center {text-align:center;}
#estimate .esBtn button {display:inline-block; background:#04193d; color:#fff; border-radius:50px; font-size:18px; letter-spacing:-1px; cursor:pointer;}
#estimate .esBtn button.st1 {padding:15px 70px; transition:all 0.5s;}
#estimate .esBtn button.st2 {padding:16px 0; width:250px;}
#estimate .esBtn button.st3 {margin-top:15px; width:100%; padding:11px 5px; background:#082A66;}
#estimate .esBtn button span {display:flex; justify-content:center; align-items:center;}
#estimate .esBtn button span i {margin:1px  0 0 12px; font-size:20px;}
#estimate .esBtn button.st1:hover {background:#082A66; }
#estimate .selectbox {border:none;}

#estimate .agreeWarp {display:flex; align-items:center; justify-content:space-between;}
#estimate .agreeWarp .agree {display:flex; flex-direction:column; gap:5px;}

/*index*/
#estimate {padding:195px 0 155px 0; background:linear-gradient(to bottom, #f2f3f6 0%, #fff 100%);}
.esIndex .landtab{ margin-top:50px;}
.esIndex .select-car {margin:50px 0;}
.esIndex .landtab .tablist {display:flex;}
.esIndex .landtab .tablist li  {width:50%;}
.esIndex .landtab .tablist li:first-child label {border-top-left-radius:15px;}
.esIndex .landtab .tablist li:nth-child(2) label {border-top-right-radius:15px;}
.esIndex .landtab .tablist label{ display:block; width:100%; padding:18px 0; font-size:20px; text-align:center; border:1px solid #e0e0e0; box-sizing:border-box; background:#fff;}
.esIndex .landtab .tablist input{display:none;}
.esIndex .landcon{ display:none; width: 100%; text-align:left;   padding: 20px;   box-sizing: border-box;   border : 5px solid #f9f9f9;}
.esIndex .landtab input:checked ~ label{ border:1px solid #082A66; color:#082A66; font-weight:bold; background:#fff;}
.esIndex .landtab input:checked ~ .landcon{ display:block;}
.esIndex .subTit {padding:18px 0; font-size:20px;  border:1px solid #082A66; border-top-left-radius:15px; border-top-right-radius:15px; color:#082A66; text-align:center; background:#fff;}

.esIndex .tabview {padding:25px 25px 15px 25px;  border:1px solid #e0e0e0; box-sizing:border-box; border-bottom-left-radius:15px; border-bottom-right-radius:15px; background:#fff;}
.esIndex .tabview .brandList {display:flex; flex-wrap:wrap;}
.esIndex .tabview .brandList li {width:16.5%; text-align:center;}
.esIndex .tabview .brandList li a {padding:7px 5px 15px 5px; margin-bottom:10px; display:inline-flex; flex-direction:column; align-items:center; font-size:14px; letter-spacing:-1px;}
.esIndex .tabview .brandList li a img {max-width:80px; margin-bottom:12px;}
.esIndex .tabview .brandList li a p {white-space:nowrap; font-size:17px;}
.esIndex .tabview .brandList li.select a {border-radius:15px; border: 1px solid #082A66; color:#082A66; font-weight:bold;}

.esIndex .estimateCarList input {display:none;}
.esIndex .estimateCarList li.listNone  {padding:20px;  font-size:16px; width:100%; }
.esIndex .estimateCarList {padding:25px; border:1px solid #e0e0e0; box-sizing:border-box; border-bottom-left-radius:15px; border-bottom-right-radius:15px;
display:flex; flex-wrap:wrap; background:#fff;}
.esIndex .estimateCarList li {width:25%;}
.esIndex .estimateCarList li label {cursor:pointer;}
.esIndex .estimateCarList li.select .list {border:1px solid #082A66;}
.esIndex .estimateCarList li .list {position:relative; display:block; padding:25px;  margin:10px;  border: 1px solid #E0E0E0; border-radius:15px; color:#313131;  letter-spacing:-0.5px;}
.esIndex .estimateCarList .brand {position:absolute;  top:8px; right:3px; z-index:9;}
.esIndex .estimateCarList .brand img {width:65px;}
.esIndex .estimateCarList .car-image {}
.esIndex .estimateCarList .car-image img {}
.esIndex .estimateCarList .car-name {margin:13px 0 7px 0; font-size:18px;font-weight:600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.esIndex .estimateCarList .car-price {font-size:16px; white-space:nowrap;}
.esIndex .estimateCarList .car-price .bold {margin-right:3px; }

/*esStep*/
#estimate .steptop {padding:30px 0; display:flex; justify-content:space-between; align-items:center;}
#estimate .steptop .steptop-con {width:50%;}
#estimate .steptop .steptop-con .esline {margin:30px 0;}

#estimate .cartit {margin:5px 0 30px 0; padding-bottom:30px; border-bottom:1px solid #e0e0e0;}
#estimate .cartit .name {position:relative; display:flex; align-items:center;}
#estimate .cartit .name .brand {width:65px; margin-left:-15px;}
#estimate .cartit .name h2 {font-size:30px; letter-spacing:-1px; line-height:22px;}
#estimate .cartit .name .catalog {position:absolute; top:50%; right:0; transform:translate(0, -50%); cursor:pointer; 
padding:8px 15px; font-size:14px; background:#082A66; color:#fff;  border-radius:100px;}
#estimate .cartit p {margin-top:13px; font-size:17px; letter-spacing:-1px; color:#7a7a7a; line-height:28px;}
#estimate.esStep .carimg { text-align:center; width:50%;}
#estimate.esStep .carimg img {max-width:600px;}
#estimate .optit {margin:10px 0 20px 0;  display:flex; justify-content:space-between; align-items:center; color:#313131;}
#estimate .optit h3 {font-size:22px; letter-spacing:-1px; font-weight:600; }
#estimate .optit .oncolor {font-size:16px; color:#626262; font-weight:400;}
#estimate .optit .sm {font-size:15px; color:#ababab; font-weight:300; vertical-align:bottom;}
#estimate .pricenum {font-size:17px; font-weight:600;}
.selectbox h4 {margin-bottom:10px; font-size:17px; font-weight:500; color:#626262}

.opcolor {position:relative;}
.colorcaution {margin-top:25px; display:flex; align-items:center; color:#ababab; font-size:15px; letter-spacing:-0.5px;}
.colorcaution .ico {width:20px; margin-right:8px;}
.esline {margin:50px auto; display:block; width:100%; height:1px;  background:#e0e0e0;}

.opwide {display:flex; padding:0 40px; align-items:stretch;}
.opwide .ophalf {width:50%;}
.opwide .detailModel {padding-right:30px; height:380px; overflow-y:scroll;}
.opwide .detailOption {padding-right:30px; height:380px; overflow-y:scroll;}
.opwide > .esline {margin:0 40px !important; width:1px; height:auto; background:#f0f0f0;}

#estimate .colorslide {}
#estimate .colorslide.swiper-container {}
#estimate .colorItem input:checked + label .colorchip {position:relative; border:2px solid #082A66;}
#estimate .colorItem input:checked + label .colorchip:after {position:absolute; content:''; top:0; left:0; width:100%; height:100%;
 background:url('/_img/ico_check.png') no-repeat center; background-size:30px 30px; filter:hue-rotate(135deg); z-index:9;}
#estimate .colorItem label .colorchip {width:60px; height:60px; border-radius:12px; border: 1px solid #e0e0e0; box-sizing:border-box; box-shadow:0 2px 2px rgba(50,50,71,0.06);}

.esresult {margin-bottom:30px; display:flex; justify-content:space-between; flex-direction:column; padding:30px; background:#fff; border: 1px solid #eee; border-radius:15px; height:490px;}
.esresult .tit h3 {font-size:22px; font-weight:500; color:#494949;}
.esresult .esresult-wrap {margin:7px 0 12px 0; display:flex; justify-content:space-between; align-items:end; font-size:16px; line-height:30px; letter-spacing:-0.5px; font-weight:500;}
.esresult .esdetail-txt {width:180px; color:#939393;  word-break:keep-all;}
.esresult .price .big {font-size:130%; font-weight:bold;}
.esresult .total {display:flex; justify-content:space-between; align-items:center; }
.esresult .esline {margin:20px 0; }
.esresult .esresult-wrap.op-height .esdetail-txt {height:150px; overflow-y:scroll;}
.esresult .esdetail-txt {width:350px;}

.input-arrow input {display:none;}
.input-arrow input + label {margin-bottom:8px; display:flex; justify-content:space-between; align-items:center; padding:20px; border:1px solid #e0e0e0;  box-sizing:border-box; border-radius:11px; 
font-size:17px;  line-height:16px;}
.input-arrow input + label .arrow {width:14px; line-height:8px; transition: all 0.7s;}
.input-arrow input:checked + label .arrow {transform:rotate(-180deg);}

.input-arrow2 .abcd {font-size:17px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:center; padding:20px; border:1px solid #e0e0e0;  box-sizing:border-box; border-radius:11px; cursor:pointer;}
.input-arrow2 .abcd .arrow {width:14px; line-height:8px; transition: all 0.7s; transform:rotate(-180deg);}
.input-arrow2.on .abcd .arrow {transform:rotate(0deg);}
.input-arrow2 .abcd2 {font-size:17px; margin-bottom:8px; display:flex; justify-content:space-between; align-items:center; padding:20px; border:1px solid #e0e0e0;  box-sizing:border-box; border-radius:11px; 
color:#082A66; font-weight:bold; cursor:pointer;}
 
.input-check input {display:none;}
.input-check input + label {position:relative;  display:flex; justify-content:space-between; align-items:center; padding:20px 0 20px 27px;font-size:17px; line-height:18px; border-bottom:1px solid #e0e0e0;}
.input-check input + label:before {position:absolute; content:''; top:50%; left:0; transform:translate(0,-50%);
width:17px; height:17px; border-radius:3px; border:1px solid #e0e0e0; background:url('/_img/ico_check_sm.png') no-repeat center;  background-size:13px;
transition: all 0.7s;}
.input-check input + label .txt {width:330px; word-break:keep-all;}
.input-check input + label:hover {color:#082A66;}
.input-check input + label:hover:before {background:url('/_img/ico_check_wh.png') no-repeat center #082A66; border:1px solid #082A66;  background-size:13px;}
.input-check input:checked + label {color:#082A66;}
.input-check input:checked + label:before {background:url('/_img/ico_check_wh.png') no-repeat center #082A66; border:1px solid #082A66;  background-size:13px;}

.input-check-circle input {display:none;}
.input-check-circle {display:flex; align-items:center;  font-size:14px; line-height:18px; color:#9e9e9e;}
.input-check-circle a {color:#9e9e9e;}
.input-check-circle input + label {position:relative; }
.input-check-circle input + label:before {position:absolute; content:''; top:50%; left:0; transform:translate(0,-50%);
width:15px; height:15px; border-radius:100%; border:1px solid #e0e0e0; background:url('/_img/ico_check_sm.png') no-repeat center;  background-size:13px;
transition: all 0.7s;}
.input-check-circle input + label .txt {padding:0 5px 0 23px;}
.input-check-circle input:checked + label {}
.input-check-circle input:checked + label:before {background:url('/_img/ico_check_wh.png') no-repeat center #082A66; border:1px solid #082A66;  background-size:13px;}

.inputBar {margin-bottom:12px;}
.inputBar ul {display:flex; justify-content:space-between;}
.inputBar.wd6 ul li {display:flex; flex-basis:50%;} 
.inputBar.wd3 ul li {display:flex; flex-basis:25%;}  
.inputBar.wd4 ul li {display:flex; flex-basis:33.5%;} 
.inputBar ul li input[type="radio"] {display:none; appearance:none; display:none; }
.inputBar ul li input[type="radio"] + label {display:block; padding:12px 0; font-size:15px; line-height:20px; color:#ababab; text-align:center; border:1px solid #d8d8d8; width:100%; box-sizing:border-box; cursor:pointer; letter-spacing:-0.5px;}
.inputBar ul li input[type="radio"]:checked + label {color:#082A66; border:1px solid #082A66;  font-weight:bold;}
.inputBar ul li:first-child input[type="radio"] + label {border-top-left-radius:13px; border-bottom-left-radius:13px; }
.inputBar ul li:last-child input[type="radio"] + label {border-top-right-radius:13px; border-bottom-right-radius:13px; }
.inputText input {padding:13px 15px; width:100%; border:1px solid #D8DFE3; border-radius:11px; box-sizing:border-box; font-size:15px; color:#43484d;}
.inputText input::placeholder {color:#E0E0E0;}

.inputSelect {display:flex; gap:10px;}
.inputSelect .custom-select.wd35 {width:35%;}
.inputSelect .custom-select.wd35 select {width:100%;}
.inputSelect .custom-select.wd65 {width:65%;}
.inputSelect .custom-select.wd65 select {width:100%;}

.inputNum {position:relative; }
.inputNum .blank {position:absolute; top:7px; right:10px; width:15px; height:30px; background:#fcfcfd; z-index:2;}
.inputNum input {margin-bottom:12px; padding:12px 15px; font-size:15px; line-height:20px; width:100%; border:1px solid #d8d8d8; background:transparent; border-radius:13px;}
.inputNum input:focus { border:1px solid #082A66; }
/*.inputNum input:not(:placeholder-shown) { border-color: #082A66; }*/
.opwide .selectbox:after {display:none !important; }

li.input-check:last-child input + label {border-bottom:none;}
#estimate .detailCarList .input-check input:checked + label:before {display:none;}
#estimate .detailCarList .input-check input:checked + label {color:#082A66; padding:20px 0;}
#estimate .detailCarList { margin-bottom:10px; padding:7px 17px; border:1px solid #e0e0e0;  box-sizing:border-box; border-radius:11px; }
#estimate .detailOption .txt {width:360px; word-break:keep-all;}
#estimate .detailOption .input-check input + label {padding:20px 20px 20px 45px;margin-bottom:8px; border:1px solid #e0e0e0; border-radius:11px;}
#estimate .detailOption .input-check input + label:before {left:15px;}

/*esFinal*/
.esFinal .cardetail {margin-bottom:7px; display:flex; justify-content:space-between; font-size:17px; letter-spacing:-0.5px; line-height:30px;}
.esFinal .cardetail .tit { color:#626262; font-weight:600; }
.esFinal .cardetail .txt {position:relative; display:flex; color:#7a7a7a; font-weight:400; text-align:right; }
.esFinal .cardetail .txt .big {font-size:120%; font-weight:bold; }
.esFinal .cardetail.total {font-size:140%;}

.esFinal .cardetail .txt .etc-click {margin-left:3px; font-weight:600; cursor:pointer;}
.esFinal .cardetail .txt .etc-click .ico-plus {border-radius:3px; border:1px solid #082A66; padding:0 4px; margin-left:4px;}
.esFinal .cardetail .txt .etc-click:hover .tooltip {display:block;}
.esFinal .cardetail .txt .tooltip {display:none; position:absolute; bottom:40px; right:0; padding:18px; background:#fff; border-radius:8px; font-size:14px; line-height:24px; text-align:center; z-index:99999; 
filter:drop-shadow(2px 2px 2px rgb(0 0 0 / 15%)); color:#939393 !important; font-weight:300;}
.esFinal .cardetail .txt .tooltip:after {position:absolute; bottom:-15px; right:5px; content:'';  border-top: 30px solid #fff;  border-left: 15px solid transparent; z-index:8; border-right: 15px solid transparent; }

.carfinal {padding-bottom:30px;}
.carfinal .esline {margin:17px 0;}

.capital ul {height:300px; padding-right:30px; overflow-y:scroll;}
.capital li.cplist  {margin-bottom:10px; padding:15px; display:flex; justify-content:space-between; align-items:center; border-radius:10px; border:1px solid #e0e0e0; box-sizing:border-box;}
.capital li.cplist .img img {max-width:135px; padding-left:5px;}
.capital li.cplist .cpwon {display:flex; align-items:center; font-size:14px; line-height:14px; text-align:right;}
.capital li.cplist .cpwon h4 {width:100px; font-weight:400;}
.capital li.cplist .cpwon h4 .big {margin-right:2px; font-size:18px; font-weight:bold; letter-spacing:-1px;}

.capital li.cplist .first{display:none;}
.capital li.cplist .cp-button {display:none;}
.capital li.cplist:first-child {border:2px solid #082A66;}
.capital li.cplist:first-child .first {display:flex; align-items:center; font-size:16px; font-weight:bold; color:#494949; height:38px;}
.capital li.cplist:first-child .first .ico-down {padding:3px 8px; margin-right:5px; font-size:11px; background:#F7E11C; border-radius:30px;}
.capital li.cplist:first-child .cp-button {display:block; }
.capital li.cplist:first-child .cp-button a {padding:6px 10px 6px 15px; display:flex; align-items:center; background:#082A66; color:#fff; font-size:12px; border-radius:50px;}
.capital li.cplist:first-child .cp-button a .ico-arrow {width:18px;}
.capital li.cplist:first-child .img img {display:none;}
.capital li.cplist:first-child .cpwon {display:none;}
.capital li.cplist:first-child.cpnone {border:1px solid #e0e0e0; text-align:center; font-size:14px; line-height:24px; justify-content:center; color:#939393;}

#esForm {margin-bottom:20px; padding:20px; border-radius:10px; border:2px solid #082A66; box-sizing:border-box;}
#esForm .tit a {display:flex; justify-content:center; margin-bottom:15px;}
#esForm .tit a img {max-width:170px; height:fit-content; margin-right:15px; padding:5px 15px 5px 0; border-right:1px solid #e0e0e0; }
#esForm .tit a .num h5 {font-size:16px; line-height:20px; color:#000; font-weight:500;}
#esForm .tit a .num h4 {font-size:20px;}
#esForm .esformbox p {font-size:16px; font-weight:500; color:#494949;}
#esForm .esformbox input[type="text"] {margin:7px 0 12px 0; padding:14px; width:100%;  border-radius:8px; border:1px solid #e0e0e0;}
#esForm .esformbox input[type="text"]::placeholder {font-size:13px;}

.escaution { margin-top:40px; font-size:14px; line-height:20px; color:#ababab; word-break:keep-all;}
.escaution .space {display:block; width:100%; height:10px;}

.esobttom a {display:block; border-radius:13px; overflow:hidden;}

#framepdf {width:100%; height:100vh;}

/*tit*/
#estimate h1.mainTit{font-size: 40px;    font-weight: 300;    line-height: 40px;    letter-spacing: -2px;    text-align: center;    padding: 80px 0 50px 0;}
.processStep {	margin-bottom: 50px;}
.processStep ol {	display: flex;}
.processStep ol li {position: relative;  flex: 1; margin-right: -1px; text-align: center; line-height: 60px; padding: 0 0 0 14px; background: #fff; font-size: 16px;
 color: #999; border: 1px solid #ddd; height:62px;}
:-ms-fullscreen,
:root .processStep ol li {line-height: 54px;}
.processStep ol li.is-active { color: #fff; background: #082A66; border-color: #082A66;}
.processStep ol li:before {	content: ""; 	position: absolute; 	left: -1px; 	top: -1px;width: 0;	height: 0;	border-style: solid;	border-width: 31px 0 31px 20px;
	border-color: transparent transparent transparent #fff;	z-index: 1;}
.processStep ol li:after {	content: "";	position: absolute;	left: 0;	top: -1px;	width: 0;	height: 0;	border-style: solid;	border-width: 31px 0 31px 20px;
	border-color: transparent transparent transparent #ccc;	z-index: 0;}
.processStep ol li.is-active+li:before {	content: "";	position: absolute;	left: -1px;	top: -1px;	width: 0;	height: 0;	border-style: solid;	border-width: 31px 0 31px 20px;
	border-color: transparent transparent transparent #082A66;	z-index: 1;}
.processStep ol li.is-active+li:after {	content: "";	position: absolute;	left: 0;	top: -1px;	width: 0;	height: 0;	border-style: solid;	border-width: 31px 0 31px 20px;
	border-color: transparent transparent transparent #082A66; 	z-index: 0;}
.processStep ol li.is-active:before,
.processStep ol li.is-active:after {	border-color: transparent transparent transparent #fff;}
.processStep ol li:first-child:before,
.processStep ol li:first-child:after,
.processStep ol li.is-active:first-child:before,
.processStep ol li.is-active:first-child:after {	display: none}
.processStep ol li.is-active .num {	font-weight: 500; }
.processStep ol li .num {display:initial !important;}



@media (min-width: 1000px) {
.pc {display:block;}
.mobile {display:none;}
.container {padding:0; }
.mbr  {display:none;}
.br {display:block; width:100%; height:1px;}


}