@charset "utf-8";
.main-section {padding-inline: 60px 100px;}
.main-section .main-tit-wrap {display: flex; flex-direction: column; align-items: center; row-gap: 10px;}
.main-section .main-tit-wrap h2 {text-align: center; font-weight: 700; font-family: 'Hana2', sans-serif; font-size: 1.5rem; color: #0D2240;}
.main-section .main-tit-wrap h2 strong {font-weight: 700; color: #009178;}
.main-section .main-tit-wrap p {font-size: 1rem; color: #414141;}
.main-section .inner {display: flex; flex-direction: column; row-gap: 50px;}
.main-section .alert-box {background-color: #fff; border-radius: 20px; border: 1px solid #e2e2e2; padding: 30px;}
.main-section .alert-box .alert-tit {display: flex; align-items: center; column-gap: 10px; margin-bottom: 20px;}
.main-section .alert-box .alert-tit p {font-size: 1.25rem; font-weight: 700; color: #525252;}
.main-section .alert-box .alert-tit li {font-size: 0.938rem; line-height: 1.75; color: #7E7E7E;}
/* jhauto solution X 하나캐피탈 26년 판매 순위 차량 */
.main-section01 {padding-block: 60px 100px;}
.main-section01 .inner {row-gap: 80px;}
.main-section01 .car-list-box {display: flex; flex-wrap: wrap; column-gap: 24px; row-gap: 40px;}
.main-section01 .car-list-box .car-list {position: relative; width: calc(100% / 4 - (24px * 3) / 4); border-radius: 20px; border: 1px solid #E5E5E5;}
.main-section01 .car-list-box .car-list .label {position: absolute; top: 20px; left: 20px;}
.main-section01 .car-list-box .car-list .img-wrap {width: 100%; height: 210px;}
.main-section01 .car-list-box .car-list .img-wrap img {width: 100%; height: 100%; object-fit: cover;}
.main-section01 .car-list-box .car-list .cont-wrap {padding: 20px; display: flex; flex-direction: column; row-gap: 20px;}
.main-section01 .car-list-box .car-list .txt-wrap strong {font-size: 1.125rem; font-weight: 500;}
.main-section01 .car-list-box .car-list .txt-wrap p {font-size: 0.875rem; color: #7E7E7E; margin-top: 4px;}
.main-section01 .car-list-box .car-list .price-wrap {padding: 10px; border-radius: 10px;}
.main-section01 .car-list-box .car-list .price-wrap .month-price {display: flex; align-items: center; justify-content: space-between;}
.main-section01 .car-list-box .car-list .price-wrap .month-price span {font-size: 0.938rem; font-weight: 500; color: #575757;}
.main-section01 .car-list-box .car-list .price-wrap .month-price strong {font-size: 1.5rem; font-weight: 700; color: #DC231E;}
.main-section01 .car-list-box .car-list .price-wrap .month-price strong i {font-size: 0.75rem; font-weight: 400;}
.main-section01 .car-list-box .car-list .price-wrap p {text-align: right; font-size: 0.75rem; color: #7E7E7E;}
.main-section01 .car-list-box .car-list .detail-wrap {display: flex; flex-direction: column; row-gap: 10px;}
.main-section01 .car-list-box .car-list .detail-wrap .square-btn {width: 100%;}
.main-section01 .car-list-box .car-list .detail-wrap .rent-info {display: flex; align-items: center; justify-content: center; column-gap: 4px;}
.main-section01 .car-list-box .car-list .detail-wrap .rent-info li {font-size: 0.75rem; color: #676767;}
.main-section01 .more-car {border-radius: 20px; padding: 45px 50px; position: relative;}
.main-section01 .more-car .left {display: flex; flex-direction: column; row-gap: 20px;}
.main-section01 .more-car .left p {font-size: 1.5rem; font-weight: 700; color: #fff;}
.main-section01 .more-car .right {position: absolute; bottom: 0; right: 50px;} 
/* 상품안내 */
.main-section02 {padding-top: 60px;}
.main-section02 .info-box {display: flex; align-items: center; column-gap: 24px;}
.main-section02 .info-box .line {flex: 1; height: 1px; background-color: #D4D4D4;}
.main-section02 .info-box .info-card {border-radius: 50%; border: 1px solid transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; row-gap: 16px; width: 300px; height: 300px;}
.main-section02 .info-box .info-card span {font-size: 1.5rem; font-weight: 700;}
.main-section02 .info-box .info-card p {font-size: 1rem; font-weight: 500; color: #404040; text-align: center;}
.main-section02 .info-box .info-card.card01 {border-color: #009178; background-color: #E6F4F2;}
.main-section02 .info-box .info-card.card01 span {color: #009178;}
.main-section02 .info-box .info-card.card02 {width: 360px; height: 360px; background-color: #009178;}
.main-section02 .info-box .info-card.card02 p,
.main-section02 .info-box .info-card.card02 span {color: #fff;}
.main-section02 .info-box .info-card.card03 {border-color: #DAA800; background-color: #FFF9E5;}
.main-section02 .info-box .info-card.card03 span {color: #DAA800;}
/* 계약절차 */
.main-section03 {padding-block: 60px;}
.main-section03 .step-box {display: flex; align-items: center; column-gap: 10px; background-color: #fff; border-radius: 20px; border: 1px solid #009178; padding: 30px;}
.main-section03 .step-box > div {flex: 1; display: flex; flex-direction: column; align-items: center; row-gap: 20px;}
.main-section03 .step-box > div .ico-wrap {width: 100px; height: 100px; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.main-section03 .step-box > div .txt-wrap {display: flex; flex-direction: column; row-gap: 14px; align-items: center;}
.main-section03 .step-box > div .txt-wrap strong {font-size: 1.25rem; font-weight: 700; color: #DC231E;}
.main-section03 .step-box > div .txt-wrap span {font-size: 1.25rem; font-weight: 500; color: #000;}
.main-section03 .step-box > div .txt-wrap p {font-size: 0.938rem; font-weight: 500; color: #5c5c5c; text-align: center;}
/* 장기렌터카 이런분께 추천 드립니다! */
.main-section04 {padding-block: 80px;}
.main-section04 .recommend-box {max-width: 1248px; margin-inline: auto; display: flex; flex-wrap: wrap; column-gap: 24px;}
.main-section04 .recommend-box .recommend-card {width: calc(100% / 3 - 48px / 3); height: 19vw; padding: 30px; border-radius: 20px; display: flex; flex-direction: column; row-gap: 20px; align-items: center; justify-content: center;} 
.main-section04 .recommend-box .recommend-card:nth-child(2),
.main-section04 .recommend-box .recommend-card:nth-child(5) {margin-top: 20px;}
.main-section04 .recommend-box .recommend-card:nth-child(3),
.main-section04 .recommend-box .recommend-card:nth-child(6) {margin-top: 40px;}
.main-section04 .recommend-box .recommend-card .img-wrap {width: 120px; height: 120px;}
.main-section04 .recommend-box .recommend-card .img-wrap img {width: 100%; height: 100%; object-fit: cover;}
.main-section04 .recommend-box .recommend-card .txt-wrap {display: flex; flex-direction: column; row-gap: 8px; align-items: center;}
.main-section04 .recommend-box .recommend-card .txt-wrap span {font-size: 1.25rem; color: #009178; font-weight: 700;}
.main-section04 .recommend-box .recommend-card .txt-wrap p {font-size: 1rem; color: #4C4C4C; font-weight: 500; text-align: center;}