@charset "utf-8";
.car-menu-slide  {position: relative; margin: 0 -30px 40px; padding: 0 30px;}
.wide .car-menu-slide {max-width: 1260px; margin-left: auto; margin-right: auto;}
.car-menu-slide .swiper {background: #f9f9f9; border: 1px solid #ddd; border-radius: 16px; overflow: hidden; position: unset; padding: 60px 40px;}
.car-menu-slide li {width: auto;}
.car-menu-slide li a {display: block; padding: 0 10px;}
.car-menu-slide .img {display: flex; align-items: center; justify-content: center; width: 103px; height: 103px; margin: 0 auto 10px; background: #fff; border: 1px solid #ddd; border-radius: 100%;}
.car-menu-slide .img img {width: 80%; height: 80%; object-fit: contain; object-position: center center;}
.car-menu-slide .swiper-slide:first-child .img img {width: 56px;}
.car-menu-slide .swiper-slide-active .img {border-color: var(--primary-color);}
.car-menu-slide .tit {text-align: center; font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); font-weight: 600; color: var(--dark-color);}
.car-menu-slide .swiper-slide-active .tit {color: var(--primary-color);}
.swiper-arrow {position: absolute; right: 0; top: 50%; margin-top: -32px; width: 64px; height: 64px; background: url('/images/main/car-arrow.png') no-repeat center center; background-size: contain; overflow: hidden; text-indent: -9999em; border: 0; z-index: 5;}
.swiper-arrow.swiper-button-prev {left: 0; right: auto; transform: rotate(180deg);}
.wide-photo {padding: clamp(30px, calc( 135 / var(--inner) * 100vw ), 135px) 0;}
.wide-photo h2 {margin-bottom: clamp(12px, calc( 25 / var(--inner) * 100vw ), 25px);}
.full-img img {width: 100%;}
.pt120 {padding-top: clamp(40px, calc( 120 / var(--inner) * 100vw ), 120px);}
.pb120 {padding-bottom: clamp(40px, calc( 120 / var(--inner) * 100vw ), 120px);}
.indent10 {padding-left: 10px; text-indent: -10px;}
.sec-tit {margin-bottom: clamp(25px, calc( 35 / var(--inner) * 100vw ), 35px);}
.underbar-tit {position: relative; width: fit-content; margin: 0 auto clamp(8px, calc( 15 / var(--inner) * 100vw ), 15px); color: var(--primary-color);}
.underbar-tit:before {position: absolute; content: ''; left: -4px; bottom: 0; width: calc(100% + 8px); height: 37%; background: var(--primary-color); opacity: .2;}
.dot-txt {text-emphasis-style: dot;}
.dot-list li {position: relative; padding-left: 10px;}
.dot-list li:not(:last-child) {margin-bottom: clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px);}
.dot-list li:before {position: absolute; content: '·'; left: 0;}
.table-wrapper {gap: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px);}
.table-wrap table {border-collapse: collapse; width: 100%; border-top: 2px solid var(--dark-color);}
.table-wrap th {font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.table-wrap thead th {padding: 13px;}
.table-wrap tbody th {font-weight: 400; color: var(--dark-color);}
.table-wrap tbody td {font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); line-height: 1.5em;}
.table-wrap tbody th, .table-wrap tbody td {padding: 13px 5px;}
.table-wrap th, .table-wrap td {border: 1px solid #ddd;}
.table-wrap th:first-child {border-left: 0;}
.table-wrap th:last-child, .table-wrap td:last-child {border-right: 0;}
.table-type2 table {border-color: var(--primary-color)}
.table-wrap .deco-img {text-align: right; margin-top: -10px;}
.table-type3 tbody th {font-size: clamp(14px, calc( 16 / var(--inner) * 100vw ), 16px); background: #e7f0fd;}
.table-type3 tbody td {padding-left: 20px;}

.service-items {position: relative; z-index: 1;}
.service-items:before {position: absolute; content: ''; z-index: -1; top: calc(var(--service-circle) / 2); left: 0; width: 100%; height: 1px; background: #ddd;}
.service-item {max-width: var(--service-circle);}
.service-item .circle {margin-bottom: clamp(15px, calc( 25 / var(--inner) * 100vw ), 25px);}
.service-item h3 {width: max-content; margin: 0 auto;}
.sec-charge .txt, .sec-banner .txt {width: 50%;}
.sec-banner .txt {padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 0;}
.sec-charge img {border-radius: 270px;}
.sec-banner {position: relative;}
.sec-banner:before {position: absolute; content: ''; left: 0; right: 0; bottom: 0; height: 88%; background: var(--primary-color); z-index: -1;}
.sec-banner h2 {margin-bottom: 25px; font-size: clamp(22px, calc( 40 / var(--inner) * 100vw ), 40px); line-height: 1.3em;}
.color-info {justify-content: flex-end; gap: 20px; margin-bottom: 12px;}
.color-info > span {gap: 6px;}
.color-box {width: 30px; height: 20px; border: 1px solid #ddd;}
.txt-box {padding: clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px) 15px;}
.txt-box .box-items {gap: 10px;}
.txt-box .box-items .box {padding: clamp(20px, calc( 35 / var(--inner) * 100vw ), 35px) 15px; border-radius: var(--bdrs8); border: 1px solid rgba(255,255,255,.5); background: rgba(255,255,255,.1);}
.answer {flex: 1; gap: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.answer-box {border-top: 10px solid var(--primary-color); padding: clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px);}
.question {width: 33.333335%; padding-right:30px;}
.question-tag {display: flex; align-items: center; justify-content: center; width: 38px; min-width: 38px; margin-right: 10px; height: 38px; border-radius: 100%; background: var(--primary-color); color: #fff; font-weight: 600; font-size: clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.qna-item {padding: clamp(20px, calc( 45 / var(--inner) * 100vw ), 45px) 0; border-bottom: 1px solid #ddd;}
.qna-item:last-child {border-bottom: 0;}
.process-item {width: 255px; height: 255px; border-radius: 100%; padding: 15px; border: 1px solid var(--primary-color); background: #fff;}
.six-items {flex-wrap: wrap; max-width: 1020px; margin: 0 auto;}
.six-items .process-item {width: 300px; height: 300px;}
.six-items div:nth-child(6) {width: 100%; height: 60px; justify-content: flex-end; padding-right: 150px;}
.six-items div:nth-child(6) img {transform: rotate(90deg);margin-right: -5px;}
.six-items div:nth-child(7) {order:3;}
.six-items div:nth-child(8) {order:2;}
.six-items div:nth-child(9) {order:2;}
.six-items div:nth-child(10) {order:2;}
.six-items div:nth-child(11) {order:1;}
.six-items div:nth-child(8) img,
.six-items div:nth-child(10) img {transform: rotate(180deg);}
.process-arrow {width: 60px; display: flex; align-items: center; justify-content: center;}
.process-item .num {font-weight: 700;}
.info-partners {flex-wrap: wrap; gap: clamp(12px, calc( 48 / var(--inner) * 100vw ), 48px) clamp(12px, calc( 40 / var(--inner) * 100vw ), 40px);}
.info-partner {width: calc((100% - clamp(12px, calc( 40 / var(--inner) * 100vw ), 40px) * 5) / 6);}
.benefit-box {border: 1px solid var(--primary-color); overflow: hidden;}
.benefit-box h3 {padding: clamp(8px, calc( 14 / var(--inner) * 100vw ), 14px) 15px;}
.benefit-item {flex: 1; padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 10px;}
.benefit-item .icon {display: flex; align-items:center; justify-content: center; margin-left: auto; margin-right: auto; width: 96px; height: 96px; border-radius: 100%; background: var(--primary-color);}
.benefit-box:last-child .benefit-item .icon {background: var(--secondary-color);}
.succeed-tit {width: 25%; padding-top: calc(var(--succeed-width) / 2);}
.succeed-items {flex: 1;}
.succeed-item .icon {position: relative; width: var(--succeed-width); margin-bottom: clamp(8px, calc( 15 / var(--inner) * 100vw ), 15px);}
.succeed-arrow {padding-top: calc(var(--succeed-width) / 2); width: 40px; margin-top: -8px;}
.inquiry-banner {padding: clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px) 0;}
.inquiry-banner .tel-num {font-size: clamp(28px, calc( 64 / var(--inner) * 100vw ), 64px); font-weight: 700; color: #bdf6ff; line-height: 1em;}
.inquiry-banner .txt {width: 50%; padding: 0 clamp(15px, calc( 50 / var(--inner) * 100vw ), 50px);}
.inquiry-banner .img {display: flex; align-items: center; justify-content: center; padding: 0 clamp(15px, calc( 20 / var(--inner) * 100vw ), 20px)}

.sec-welcome .txt {margin-top: -60px;}
.sec-welcome .left-copyright {padding: clamp(20px, calc( 47 / var(--inner) * 100vw ), 47px) clamp(20px, calc( 33 / var(--inner) * 100vw ), 33px); border-radius: 0 clamp(20px, calc( 80 / var(--inner) * 100vw ), 80px) 0 0; padding-left: calc((100% - 1200px) / 2);}
.sec-welcome .left-copyright span {padding-left: clamp(30px, calc( 90 / var(--inner) * 100vw ), 90px);}
.sec-welcome .right-desc {padding-right: calc((100% - 1200px) / 2);}

.zigzag-item {gap: clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px);}
.zigzag-item:nth-child(odd) {flex-direction: row-reverse;}
.zigzag-item:not(:last-child) {margin-bottom: clamp(30px, calc( 130 / var(--inner) * 100vw ), 130px);}
.zigzag-item .img, .work-items .img {box-shadow: 3px 3px 10px rgba(0,0,0,.2)}
.work-items {gap: clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.contract-tit {margin-bottom: 10px; width: max-content;}
.contract-num {display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin-right: 10px; border-radius: 100%; background: var(--dark-color);font-weight: 400; color: #fff;}
.contract-items {flex-wrap: wrap; gap: 30px 0; margin: 0 calc(clamp(15px, calc( 75 / var(--inner) * 100vw ), 75px) * -1);}
.contract-item {position: relative; z-index: 1; width: 25%; padding:0 clamp(15px, calc( 75 / var(--inner) * 100vw ), 75px);}
.contract-item:before {position: absolute; z-index: -1; content:''; right: calc(clamp(15px, calc( 75 / var(--inner) * 100vw ), 75px) * -1); bottom: 40%; width: calc(clamp(15px, calc( 75 / var(--inner) * 100vw ), 75px) * 2); height: 2px; border-bottom: 1px dashed #ddd;}
.contract-item:nth-child(4n):before {content: none;}
.contract-circle {position: relative; width: 100%; padding-bottom: 100%; height: 0; border: 1px solid #505050; border-radius: 100%; background: #fff;}
.contract-circle img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)}