@charset "utf-8";

.dataExchange-top {border-radius: 20px; background-color: #F7F7F7; padding: 30px; text-align: center; margin-top: 40px;}
.dataExchange-top p {font-size: 1.5em; font-weight: 500; line-height: 1.6;}

.model-wrap {display: flex; justify-content: center; padding: 0 40px; margin: 95px auto 0;}
.model-wrap .model-box {border-radius: 20px; background-color: rgba(11,133,239,0.08); padding: 70px 55px 50px; width: 50%; max-width: 645px; position: relative; display: flex; align-items: center;}
.model-wrap .model-box.model-l {background-image: url("../../../assets/images/sub/dataExchange-bg.png"); background-repeat: no-repeat; background-size: cover; background-position: center; background-color: unset;}
.model-wrap .model-box + .model-box {margin-left: 40px;}
.model-box .model-top {width: 100%; max-width: 250px; height: 70px; display: flex; align-items: center; justify-content: center; font-size: 1.5em; font-weight: 700; color: #fff; text-align: center; border-radius: 35px; background-color: var(--color-blue); position: absolute; top: -35px; left: 50%; transform: translateX(-50%);}

/* .model-box.model-l ul li {font-size: 22px; display: flex; align-items: center;}
.model-box.model-l ul li i {background-image: url("../../../assets/images/sub/data-li.svg"); background-repeat: no-repeat; background-size: 24px 22.5px; background-position: center; width: 50px; height: 50px; border-radius: 50%; background-color: #458DC8; margin-right: 20px;}
.model-box.model-l ul li:nth-child(even) i {background-color: #133C7E;}
.model-box.model-l ul li + li {margin-top: 45px;} */

.model-box.model-l ul {width: 100%;}
.model-box.model-l ul li {border-radius: 20px; background-color: #fff; padding: 16px 22px;}
.model-box.model-l ul li + li {margin-top: 20px;}
.model-box.model-l ul li .l-li-tit {font-size: 20px; font-weight: 800; color: #133C7E; line-height: 1.4;}
.model-box.model-l ul li .l-li-tit small {font-size: 12px; font-weight: 400; color: #000;}
.model-box.model-l ul li .l-li-tit span {background: rgba(255,255,124,1);}
.model-box.model-l ul li .l-li-tit + p {margin-top: 10px;}
.model-box.model-l ul li .l-li-tit .mo-ver {display: none;}
.model-box.model-l ul li p {font-size: 14px; word-break: keep-all;}
.model-box.model-l ul li p + p {margin-top: 4px;}

.model-box.model-r ul li {display: flex; border-radius: 20px; background-color: #fff; padding: 24px 30px;}
.model-box.model-r ul li + li {margin-top: 30px;}
.model-box.model-r ul li .year {font-size: 28px; font-weight: 800; color: #133C7E; position: relative; height: fit-content; min-width: 70px;}
.model-box.model-r ul li .year::before {content: ''; width: 100%; max-width: 40px; height: 1px; background: rgba(11,133,239,0.25); position: absolute; right: -50px; top: 50%; transform: translateY(-50%);}
.model-box.model-r ul {width: 100%;}
.model-box.model-r .r-li {display: flex; align-items: baseline; padding-top: 4px; margin-left: 60px;}
.model-box.model-r .r-li + .r-li {margin-top: 15px;}
.model-box.model-r .r-li i {background-image: url("../../../assets/images/sub/blue-check.svg"); background-repeat: no-repeat; background-size: contain; width: 20px; height: 14px; margin-right: 8px; flex: none;}
.model-box.model-r .r-li .r-li-txt {font-size: 20px; font-weight: 800; color: #133C7E;}
.model-box.model-r .r-li .r-li-txt p {font-size: 16px; font-weight: 400; color: #000; margin-top: 12.5px;}

.dataInquiry-btn {max-width: 688px; margin: 86px auto 0;}
.dataInquiry-btn a {width: 100%; height: 80px; border-radius: 10px; background-color: var(--color-blue); font-size: 1.5em; font-weight: 700; color: #fff; display: flex; align-items: center; justify-content: center; transition: .2s;}
.dataInquiry-btn:hover a {background-color: #fff; border: 1px solid var(--color-blue); color: var(--color-blue);}

@media (max-width: 1400px) {
    .model-wrap .model-box {padding: 70px 45px 50px;}
}

@media (max-width: 1280px) {
    .dataExchange-top {margin-top: 30px; padding: 25px;}
    .dataExchange-top p {font-size: 18px;}
    .model-wrap {flex-direction: column;}
    .model-wrap .model-box {width: 100%; max-width: 100%; padding: 65px 50px 55px;}
    .model-wrap .model-box + .model-box {margin: 70px 0 0;}
    .model-wrap .model-box.model-l {}
    .model-box .model-top {max-width: 220px; height: 60px; top: -30px; font-size: 1.25em;}
    .dataInquiry-btn {margin-top: 50px;}
    .dataInquiry-btn a {height: 70px; font-size: 1.375em;}
}

@media (max-width: 768px) {
    .dataExchange-top {padding: 17px 20px; font-size: 0.875em; margin-top: 20px;}
    .dataExchange-top p {font-size: 14px;}
    .model-wrap {padding: 0 20px; margin-top: 70px;}
    .model-box .model-top {max-width: 170px; height: 50px; font-size: 1.125em; top: -25px;}
    .model-wrap .model-box {padding: 60px 20px 35px;}
    .model-box ul li + li {margin-top: 15px;}
    /* .model-box.model-l ul li {font-size: 0.875em; text-align: left;}
    .model-box.model-l ul li.a-fs {align-items: flex-start; line-height: 1.5;}
    .model-box.model-l ul li i {width: 30px; height: 30px; background-size: 14px 14px; margin-right: 10px;}
    .model-box.model-l ul li + li {margin-top: 30px;} */
    .model-box.model-l ul li {padding: 14px 20px;}
    .model-box.model-l ul li .l-li-tit {font-size: 1rem; word-break: keep-all;}
    .model-box.model-l ul li .l-li-tit .mo-ver {display: block;}
    .model-box.model-l ul li .l-li-tit small {line-height: 2;}
    
    .model-box.model-r ul li {flex-direction: column; padding: 24px 20px;}
    .model-box.model-r ul li .year {font-size: 20px; padding-bottom: 12px; border-bottom: 1px solid rgba(11,133,239,0.25);}
    .model-box.model-r ul li .year::before {content: unset;}
    .model-box.model-r .r-li {margin: 0; padding-top: 16px;}
    .model-box.model-r .r-li + .r-li {margin-top: 0;}
    .model-box.model-r .r-li i {width: 15.5px; height: 10.5px;}
    .model-box.model-r .r-li .r-li-txt {font-size: 14px;}
    .model-box.model-r .r-li .r-li-txt p {margin-top: 6.5px; line-height: 1.5;}
    .model-box.model-r ul li + li {margin-top: 24px;}

    .dataInquiry-btn {margin-top: 45px;}
    .dataInquiry-btn a {height: 60px; font-size: 1.25em;}
}