@charset "utf-8";

.marketing-wrap{ margin: 0 auto;}

.prd-sum{padding: 96px 0 0 0;background:#F3F9FF;}
.prd-sum .inner{width:100%;max-width: 900px; min-width: 0;  margin:0 auto;}
.inner2{width:100%; max-width: 790px;   margin:0 auto;}
.inner3{width:100%; max-width: 900px;   margin:0 auto;}


.prd-link--header{
  position:fixed;
  top:63px;              /* header 높이 */
  left:0;
  right:0;
  z-index:100;           /* header보다 낮으면 OK */
  background:#F3F9FF;
}

.prd-link.productMenu{
  background:#fff;
  max-width: 900px;
  width: 100%;
  padding: 0 20px;
}

/* ul을 스크롤 영역으로 */
.prd-link.productMenu > ul{
  display:flex;
  padding:0 0 11px 0;
  margin:0;
  list-style:none;
  overflow-x:auto;
  white-space:nowrap;
   scrollbar-width: thin;
  -webkit-overflow-scrolling:touch;
  overflow-y: hidden;
  scrollbar-color: transparent transparent;
}

/* WebKit(Chrome/Edge/Safari) */
.prd-link.productMenu > ul::-webkit-scrollbar{
  height: 8px; /* 공간은 유지 (hover 시 자연스럽게 보이게) */
}
.prd-link.productMenu > ul::-webkit-scrollbar-track{
  background: transparent;
}
.prd-link.productMenu > ul::-webkit-scrollbar-thumb{
  background: transparent;  /* 평소엔 투명 */
  border-radius: 999px;
}

/* li는 내용폭만 */
.prd-link.productMenu > ul > li{
  flex:0 0 auto;
  padding: 0 15px;
}


/* hover 시에만 바가 보이게 */
.prd-link.productMenu:hover > ul{
  scrollbar-color: rgba(0,0,0,.25) transparent; /* Firefox */
}
.prd-link.productMenu:hover > ul::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.25); /* Chrome/Edge/Safari */
}

.prd-link.productMenu > ul > li:first-child {padding-left: 0;}

/* 기본 탭 */
.prd-link.productMenu > ul > li > a{
  padding:10px 0;
  font:500 15px/20px "Pretendard";
  color:#222;
  background:transparent !important;
  position:relative;
}

/* 활성 탭 (기존 on 클래스 사용) */
.prd-link.productMenu > ul > li.on > a{
  color:#0871F3;
  font-weight:700;
  border-bottom: 1px solid #0871F3;
}
.prd-link.productMenu > ul > li.on > a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:3px;
  background:#0871F3;
  border-radius:3px;
}
.prd-link ul li.on a{color:#fff;background:#00449B}





[data-type=marketing] .prd-sum .sum{position:relative;width:100%;margin-bottom:22px; display: flex; flex-direction: column;align-items: center; }
[data-type=marketing] .prd-sum .sum .title{text-align: center; margin-bottom:10px; display: flex; flex-direction: column; align-items: center;}
[data-type=marketing] .prd-sum .sum .title > span{font: 700 13px / 13px "Pretendard";color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-sum .sum .title > span em{display:inline-block;padding:4px 8px;border-radius: 3px; color:#FFFFB2;background:#2963AB;}
[data-type=marketing] .prd-sum .sum .title > .name{display:block;margin-top:10px;font: 900 32px/39px "Pretendard"; color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-sum .sum .title > .name .sm{font:700 23px/38px "Pretendard";font-style:normal;}
[data-type=marketing] .prd-sum .sum .thumb{display:block;position:relative;width:100%;height:284px; background-size:contain;background-repeat:no-repeat;background-position: center;}
[data-type=marketing] .prd-sum .sum .ico-hashtag{display:-webkit-flex;display:flex;width:100%;}
[data-type=marketing] .prd-sum .sum .ico-hashtag li{display:-webkit-flex;display:flex;flex-direction:column;align-items:center;position:relative;width:100%;padding:29px 0 22px;}
[data-type=marketing] .prd-sum .sum .ico-hashtag li:before{content:'';display:block;position:relative;width:64px;height:64px;margin-bottom:9px;background-color:#fff;background-position:center;background-repeat:no-repeat;background-size:auto;border-radius:50%;box-shadow:0px 0px 5px rgba(0,0,0,0.16);}
[data-type=marketing] .prd-sum .sum .ico-hashtag li:nth-of-type(1):before{background-image:url(../img/ico_percent.svg);}
[data-type=marketing] .prd-sum .sum .ico-hashtag li:nth-of-type(2):before{background-image:url(../img/ico_money_pocket.svg);}
[data-type=marketing] .prd-sum .sum .ico-hashtag li:nth-of-type(3):before{background-image:url(../img/ico_calendar.svg);}
[data-type=marketing] .prd-sum .sum .ico-hashtag li + li:after{content:'';display:block;position:absolute;left:-0.5px;top:50%;width:1px;height:112px;margin-top:-56px;background:#E1E1E1;}
[data-type=marketing] .prd-sum .sum .ico-hashtag li .hashtag{display:inline-block;font: 500 14px 'Pretendard';}
[data-type=marketing] .prd-sum .sum .ico-hashtag li .hashtag:before{content:'#';display:inline-block;}
[data-type=marketing] .prd-sum .sum .ico-hashtag li strong{display:block;font: 700 18px/22px 'Pretendard'; text-align: center;}


[data-type=marketing] .prd-sum .contact{display:-webkit-flex;display:flex;flex-direction: column-reverse; width:100%;background:#fff;border:1px solid #AAC5E8;border-radius:24px;}
/* 전화상담 접수 */
[data-type=marketing] .prd-sum .contact .left{display:-webkit-flex;display:flex; flex-direction: column; flex-wrap:wrap;align-items: center; justify-content:space-between;;gap:16px 0;max-width:100%;padding:48px 0; margin: 0 40px; border-bottom: 1px solid #DBE6F0; border-top: 1px solid #DBE6F0;}
[data-type=marketing] .prd-sum .contact .left p.text{display:-webkit-flex;display:flex;flex:none;align-items:center;gap:0 16px;font: 500 15px / 25px "Pretendard"; color:var(--u-color-text-default-00);word-break:keep-all;}
[data-type=marketing] .prd-sum .contact .left p.text:before{content:'';display:block;flex:none;position:relative;width:70px;height:70px;background:url(../img/ico_cscenter.svg);}
[data-type=marketing] .prd-sum .contact .left .cousl-recept{display:-webkit-flex;display:flex;flex-direction:column; width: 100%;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .contact{display:block;padding:28px 14px;font:400 18px/21px "Pretendard";color:var(--u-color-text-default-00);border-radius:4px;border:1px solid #DFDFDF;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .contact::placeholder{color:#747474;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .check{display:block;position:relative;width:100%;margin-top:8px;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .check input{display:block;position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .check input + span{display:block;padding-left:28px;font:400 14px/18px "Pretendard";color:#5F6F81;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .check input + span:before{content:'';display:block;position:absolute;left:0;top:0;width:18px;height:18px;background:url(../img/ico_check.svg) center no-repeat;border-radius:4px;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .check input + span.active:before{content:'';display:block;position:absolute;left:0;top:0;width:18px;height:18px;background:url(../img/ico_checked.svg) center no-repeat;border-radius:4px;}
/*[data-type=marketing] .prd-sum .contact .left .cousl-recept .check input:checked + span:before{background-image:url(/renew/images/ico/ico_checked.svg);}*/
[data-type=marketing] .prd-sum .contact .left .primary{display:-webkit-flex;display:flex;align-items:center;justify-content:center;width:100%;background:#0871F3;border-radius:4px;}
[data-type=marketing] .prd-sum .contact .left .cousl-recept .check input:focus-visible + span:after{content:'';display:block;position:absolute;left:-1px;top:-1px;bottom:-1px;right:-1px;border:2px solid #000;}
[data-type=marketing] .prd-sum .contact .left .primary span{font: 700 18px / 28px "Pretendard"; color:#fff; padding: 14px 0;}
[data-type=marketing] .prd-sum .contact .left .primary:hover,
[data-type=marketing] .prd-sum .contact .left .primary:focus-visible{background:#065AC3;}
/* 한도조회 & 대출신청 */
[data-type=marketing] .prd-sum .contact .right{position:relative;width:100%;padding:48px 40px;}
/* [data-type=marketing] .prd-sum .contact .right:before{content:'';display:block;position:absolute;top:0;left:0;bottom:0;width:1px; background: #AAC5E8;} */
[data-type=marketing] .prd-sum .contact .right p.text{display:-webkit-flex;display:flex;align-items:center;gap:0 16px;justify-content: center; font: 500 15px / 25px "Pretendard"; color:var(--u-color-text-default-00);word-break:keep-all;}
[data-type=marketing] .prd-sum .contact .right p.text:before{content:'';display:block;flex:none;position:relative;width:70px;height:70px;background:url(../img/ico_loanservice.svg) center no-repeat;}
[data-type=marketing] .prd-sum .contact .right .subdued{display:-webkit-flex;display:flex;align-items:center;justify-content:center;width:100%; margin-top:23px;background:#057EB6;border-radius:4px;}
[data-type=marketing] .prd-sum .contact .right .subdued span{font: 700 18px / 28px "Pretendard"; color:#fff; padding: 14px 0;}
[data-type=marketing] .prd-sum .contact .right .subdued:hover,
[data-type=marketing] .prd-sum .contact .right .subdued:focus-visible{background:#0471A4;}

/* 상품안내 */
[data-type=marketing] .prd-info{padding:55px 0;}
[data-type=marketing] .prd-info .inner{display:-webkit-flex;display:flex;justify-content:space-between;align-items: center; flex-direction: column; position:relative; width:100%;max-width:900px;margin:0 auto;}
[data-type=marketing] .prd-info .info-wrap{width:792px;     background: #fff;}
[data-type=marketing] .prd-info .info-tit{margin-bottom:30px; font: 500 18px / 17px "Pretendard"; color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-info .process {margin-top: 55px;}
@media (max-width: 880px) {
  [data-type=marketing] .prd-info .process-box {  padding-top: 48px; }
}
[data-type=marketing] .prd-info .info-box{padding:28px 40px;border-radius:0 24px 24px 24px;border:1px solid #AAC5E8; display: flex; align-items: center; justify-content: center; flex-direction: column; }
[data-type=marketing] .prd-info .info-box img {max-width: 100%; width: 477px;}
[data-type=marketing] .prd-info .info-box + .info-tit{margin-top:40px;}

/* 상품안내 - 상단 내용 */
[data-type=marketing] .prd-info .info-box .top{display:-webkit-flex;display:flex;flex-wrap:wrap;width:100%;padding-bottom:8px;flex-direction: column; }
[data-type=marketing] .prd-info .info-box .top .prd-name{flex:none;width:100%;padding-bottom: 16px; font:700 24px/39px "Pretendard";}
[data-type=marketing] .prd-info .info-box .top dl{display:-webkit-flex;display:flex;flex-direction:column;position:relative;padding-left:58px;padding-top: 4px; }
[data-type=marketing] .prd-info .info-box .top dl:before{content:'';display:block;position:absolute;top:50%;left:0;width:44px;height:44px;margin-top:-32px;background-repeat:no-repeat;background-size:contain;background-position:center;border-radius:50%;}
[data-type=marketing] .prd-info .info-box .top dl:nth-of-type(1):before{background-image:url(../img/ico_loan_info_01.svg);}
[data-type=marketing] .prd-info .info-box .top dl:nth-of-type(2):before{background-image:url(../img/ico_loan_info_02.svg);}
[data-type=marketing] .prd-info .info-box .top dl dt{font:500 16px/25px "Pretendard";color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-info .info-box .top dl dd {padding-bottom: 20px;}
[data-type=marketing] .prd-info .info-box .top dl dd strong{font:700 18px/26px "Pretendard";color:var(--u-color-text-default-00);}
/* 상품안내 - 아래 내용 */
[data-type=marketing] .prd-info .info-box .btm {width: 100%;}
[data-type=marketing] .prd-info .info-box .btm .group-txt .tit{display:block;margin-bottom:10px;font:700 18px/21px "Pretendard";color:var(--u-color-text-default-02);}
[data-type=marketing] .prd-info .info-box .btm .group-txt .txt{font:500 15px/23px "Pretendard";}
[data-type=marketing] .prd-info .info-box .btm .group-txt .txt .sub{display:block;margin:2px 0;font:400 11px/16px "Pretendard";color:#728B99;}
[data-type=marketing] .prd-info .info-box .btm .group-txt .txt .underline{display:inline-block;position:relative;font-family:inherit;text-decoration:underline;}
[data-type=marketing] .prd-info .info-box .btm .group-txt .txt+.txt{margin-top:10px;}
[data-type=marketing] .prd-info .info-box .btm .group-txt + .group-txt{margin-top:24px;}
/* 상품안내 - 대출절차 */
[data-type=marketing] .prd-info .info-box .loan-process{display:-webkit-flex;display:flex;justify-content:space-between; align-items: flex-start; flex-wrap: wrap; width: 100%; gap:16px ;}
[data-type=marketing] .prd-info .info-box .loan-process li{display:-webkit-flex; display: flex; justify-content: center; text-align: center; align-items:center;position:relative; width: 128px; flex-wrap: wrap; flex-direction: row; flex-direction: column; }
[data-type=marketing] .prd-info .info-box .loan-process li:before{content:'';display:block;position:relative;width:85px;height:85px;background-position:center;background-repeat:no-repeat;background-size:contain;}
[data-type=marketing] .prd-info .info-box .loan-process li:nth-of-type(1):before{background-image:url(../img/ico_replace_process01.png);}
[data-type=marketing] .prd-info .info-box .loan-process li:nth-of-type(2):before{background-image:url(../img/ico_replace_process02.png);}
[data-type=marketing] .prd-info .info-box .loan-process li:nth-of-type(3):before{background-image:url(../img/ico_replace_process03.png);}
[data-type=marketing] .prd-info .info-box .loan-process li:nth-of-type(4):before{background-image:url(../img/ico_replace_process04.png);}
[data-type=marketing] .prd-info .info-box .loan-process li:nth-of-type(5):before{background-image:url(../img/ico_replace_process05.png);}
[data-type=marketing] .prd-info .info-box .loan-process li+li:after{content:'';display:block;position:absolute;left:-40px;top:53px;width:16px;height:16px;margin-top:-16px;margin-left:24px;background:url(../img/ico_loain_arrow.svg) center no-repeat;}
[data-type=marketing] .prd-info .info-box .loan-process li span{display:block;margin-top:10px;font:500 16px/19px "Pretendard";color:#333;}
[data-type=marketing] .prd-info .info-box .loan-process li .process_sm { font: 500 12px / 15px "Pretendard"; margin-top: 2px;}
[data-type=marketing] .prd-info .process-box2 img{max-width: 100%; width: 330px;}
/* [data-type=marketing] .prd-info .info-box .replace-loan-process { padding: 8.5px 0;} */

/* 계산기 */
[data-type=marketing] .prd-info .calculator-wrap{margin: 55px 55px 0 55px; width: 100%; max-width: 792px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator{background: #D9E8F9; border-radius:0 24px 24px 24px;overflow:hidden;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .sub-tit{margin-bottom:12px;font:600 20px/24px "Pretendard";}
/* 계산기 - 계산정보입력영역 */
[data-type=marketing] .prd-info .calculator-wrap #calculator .top{padding:48px;background:#D9E8F9;border-radius:0 24px 0 0;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm{width:100%;background:#fff;border-radius:8px; padding: 20px 24px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl{display:-webkit-flex;display:flex;align-items:center;justify-content:space-between;gap:0 16px;padding:14px 0;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl+dl{border-top:1px solid #DFDFDF;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dt{flex:none;font:400 15px/21px "Pretendard";color:var(--u-color-text-default-02);}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dd{display:-webkit-flex;display:flex;align-items:center;gap:0 3px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dd input{width:100%;font:600 15px/15px "Pretendard";text-align:right;border:none;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dd input:placeholder-shown + span{color:#333;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dd input+span{display:block;flex:none;font:600 15px/15px "Pretendard";}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dd button{background:none;}
[data-type=marketing] .prd-info .calculator-wrap #calculator #calcForm dl dd button span{display:block;font:600 15px/21px "Pretendard";color:#0871F3;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap{display:-webkit-flex;display:flex;gap:0 10px;margin-top:16px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap .btn-reset{display:-webkit-flex;display:flex;flex:none;align-items:center;justify-content:center;width:30%;padding:14px 0;background:#EFEFEF;border-radius:4px;border:1px solid #CDD2D8;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap .btn-reset span{font: 700 16px / 28px "Pretendard";color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap .btn-action{display:-webkit-flex;display:flex;align-items:center;justify-content:center;width:100%;padding:16px 0;background:#0871F3;border-radius:4px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap .btn-action span{font:700 16px/21px "Pretendard";color:#fff;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap .btn-action:hover,
[data-type=marketing] .prd-info .calculator-wrap #calculator .btn-wrap .btn-action:focus-visible{background:#065AC3;}
/* 계산기 - 계산결과영역 */
[data-type=marketing] .prd-info .calculator-wrap #calculator .btm{padding:48px;border-radius:0 0 24px 24px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result{display:-webkit-flex;display:flex;flex-direction:column;margin-top:16px; padding: 14px 24px;  background: #fff; border-radius: 8px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl{display:-webkit-flex;display:flex;align-content:center;justify-content:space-between;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl dt{padding:8px 0;font:400 16px/19px "Pretendard";color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl dd{padding:8px 0;font:600 16px/19px "Pretendard";color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl dd span{font:600 16px/19px "Pretendard";color:var(--u-color-text-default-00);}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl.total{position:relative;margin-top:17px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl.total:before{content:'';display:block;position:absolute;top:-8px;left:0;width:100%;height:1px;background:#DFDFDF;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl.total dd{font:600 18px/21px "Pretendard";}
[data-type=marketing] .prd-info .calculator-wrap #calculator .result dl.total dd span{font:600 18px/21px "Pretendard";color:#0871F3;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .list-dot{margin-top:12px;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .list-dot li{position:relative;padding-left:19px;font:400 13px/19px "Pretendard";color:#5F6F81;list-style:none;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .list-dot li:before{content:'';display:block;position:absolute;top:8px;left:8px;width:3px;height:3px;background:#5F6F81;border-radius:50%;}
[data-type=marketing] .prd-info .calculator-wrap #calculator .list-dot li+li{margin-top:4px;}
/* 유의사항 */
[data-type=marketing] .caution{background:#F5F5F5;}
[data-type=marketing] .caution .inner{width:900px;margin:0 auto;padding:48px 0 88px;}
[data-type=marketing] .caution .tit{display:block;position:relative;margin-bottom:24px;padding:11px 0 11px 76px;font:600 19px/19px "Pretendard";color:#191919;border-bottom:1px solid #dfdfdf;}
[data-type=marketing] .caution .tit:before{content:'';display:block;position:absolute;left:0;top:-5px;width:68px;height:48px;background:url(../img/ico_webee_caution.svg) no-repeat center/contain;}
[data-type=marketing] .caution .list-dot li{position:relative;padding-left:19px;font:400 12px/19px "Pretendard";color:#5F6F81;}
[data-type=marketing] .caution .list-dot li:before{content:'';display:block;position:absolute;left:9px;top:11px;width:3px;height:3px;background:#5F6F81;}
[data-type=marketing] .caution .list-dot li+li{margin-top:10px;}
[data-type=marketing] .caution .list-dot li strong{font:700 12px/20px "Pretendard";}

.marketing-wrap .popup.hide {display:none;}
.marketing-wrap .popup.multiple-filter {backdrop-filter:blur(4px) grayscale(90%);-webkit-backdrop-filter:blur(4px) grayscale(90%);}
.marketing-wrap .popup {display:flex;position:fixed;top:0;left:0;right:0;bottom:0;justify-content:center;align-items:center;z-index:300;background-color:rgba(0, 0, 0, 0.4);}
.marketing-wrap .pop {padding:20px;margin:30px;z-index:200;background:#fff;border-radius:10px;box-shadow:5px 7px 12px 3px rgba(58, 58, 58, 0.2);}
.marketing-wrap .pop .pop-tit {font-size:1.25rem;font-weight:600;text-align:center;color:#2860A7;padding:4px 0;margin-bottom:6px;}
.marketing-wrap .pop .pop-desc {padding:10px 0 0;color:#333;border-top:2px solid #dce9f4;border-bottom:2px solid #dce9f4;}
.marketing-wrap .pop .pop-desc dt {font:500 16px/24px 'Pretendard';}
.marketing-wrap .pop .pop-desc dd {margin-bottom:10px;font:400 14px/21px 'Pretendard';}
.marketing-wrap .pop .btn {width:100%;text-align:center;padding-top:20px;}
.marketing-wrap .pop .btn button {display:inline-block;padding:4px 20px;text-align:center;font:400 16px/16px 'Pretendard';background:#dce9f4;border-radius:4px;border:none;cursor:pointer;}


@media (max-width: 880px){

  /* 1) 최상단 캔버스 */
  .marketing-wrap{
    min-width: 360px !important;
    width: 100% !important;
    overflow-x: hidden;
  }

  /* 2) 공통 레이아웃(980px 고정 + 가운데 고정) 제거 — 반쪽 현상 1순위 */
  div.LayOut_Header,
  div.LayOut_Contents{
    width: 100% !important;
    margin-left: 0 !important;
    display: block !important;
  }


  /* 3) 랜딩 내부 고정 900/792 풀기 */
  [data-type=marketing] .caution .inner{
    width: 100% !important;
    padding: 40px 16px !important;
  }
  [data-type=marketing] .prd-info {
    padding: 48px 50px ;
  }

  [data-type=marketing] .prd-info .info-wrap{
    width: 100% !important;
  }

  [data-type=marketing] .prd-info .info-box {
    padding: 0;
    border: 0;
  }


  [data-type=marketing] .prd-info .info-box .loan-process {
    margin: -8px 0;
    max-width: 500px;
    width: 100%;
  }

  [data-type=marketing] .prd-info .info-box .loan-process li {
    width: 132px;
  }

[data-type=marketing] .prd-info .calculator-wrap {
  width: auto;
  margin-top: 48px;
  background: #D9E8F9;
  margin-left: -50px;
  margin-right: -50px;
  padding-left: 50px;
  padding-top: 48px;
  margin-bottom: -55px;
  padding-bottom: 48px;
  padding-right: 50px;
}

  [data-type=marketing] .prd-info .calculator-wrap #calculator .top {
    padding: 0 0 19px 0;
  }

  [data-type=marketing] .prd-info .calculator-wrap #calculator .btm {
    padding-top: 19px;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
  }

  [data-type=marketing] .prd-sum .contact {
    border: 0;
    border-radius: 0;
  }

  [data-type=marketing] .prd-sum .contact .left {
    padding: 48px 0px;
  }

  [data-type=marketing] .prd-sum .contact .right{
    padding: 48px 50px !important;

  }
}

@media (max-width: 768px){
  .autoSecureLoan .name{
    font-size: 2rem;
  }

  [data-type=marketing] .prd-info .info-box .replace-loan-process{
  display:flex;
  flex-wrap:wrap;
  gap:16px;       
  justify-content:center; 
}

/* 기본: 아래줄(3개)은 3등분 */
[data-type=marketing] .prd-info .info-box .replace-loan-process > li{
  flex: 0 0 calc((100% - 16px * 2) / 3); /* 3칸 */
  max-width: calc((100% - 40px * 2) / 3);
}

/* 첫 줄(1~2번)은 2등분 */
[data-type=marketing] .prd-info .info-box .replace-loan-process > li:nth-child(-n+2){
  flex: 0 0 calc((100% - 16px) / 2);     /* 2칸 */
  max-width: calc((100% - 110px) / 2);
}

.replace-loan-process .process_sm { display:block; }

[data-type=marketing] .prd-info .info-box .loan-process li span {
  font: 500 15px / 15px "Pretendard";
  margin-top: 6px;
}

}


@media (max-width: 495px){
    [data-type=marketing] .prd-sum .contact .left {
      padding: 40px 0px;
      margin: 0 22px;
    }

      [data-type=marketing] .prd-sum .contact .right{
    padding: 40px 22px !important;
      }

      [data-type=marketing] .prd-info {
        padding: 48px 22px;
    } 
  
[data-type=marketing] .prd-info .info-box .loan-process li:before {
      width:70px;
      height: 70px;
    }

  [data-type=marketing] .prd-info .info-box .loan-process li+li:after {
      top: 45px;
      width: 13px; 
      height: 13px;    
      background-size: 13px 13px;   
    }
    
}

@media (max-width: 450px){
[data-type=marketing] .prd-info .process-box2 img {
  width: 300px;
}
}


@media (max-width: 360px){
  .marketing-wrap{
    transform-origin: top center;
    transform: scale(calc(100vw / 360));
  }

  [data-type=marketing] .prd-info .info-box .loan-process li:before {
      width:55px;
      height: 55px;
    }

  [data-type=marketing] .prd-info .info-box .replace-loan-process li span {
      font: 500 13px / 14px "Pretendard";
      margin-top: 8px;
    }

    [data-type=marketing] .prd-info .info-box .loan-process li+li:after {
      top: 40px;
      width: 10px; 
      height: 10px;    
      background-size: 10px 10px;   
    }
  
[data-type=marketing] .prd-info .process-box2 img {
  width: 250px;
}

}