@charset "utf-8";

section + section {margin: 120px 0;}
.ci_sec1 {
    text-align: center;
    padding-top: 1rem;
}
.ci_img {
    margin-bottom: 3rem;
}
.ci_txt {
    font-size: 20px;
}
.ci_sec2 {}
.logo_box {
    background-color: #f7f7f7;
    border-radius: 2rem;
    padding: 3rem;
}
.logo_box ul {
    display: flex;
    align-items: center;
    gap: 10%;
    justify-content: center;
    position:relative;
}
.logo_box ul:after {content:""; position:absolute; left:50%; top:50%; background-color:#dadada; width:1px; height:80%; transform:translate(-50%, -50%)}
.logo_box ul li {
    width: 43%;
    text-align: center;
}
.logo_download {
    margin-top: 2rem;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-right: 1rem;
}
.logo_download button {
    width: 260px;
    border: 1px solid #ddd;
    border-radius: 1rem;
    transition: .4s
}
.logo_download a {text-transform: uppercase;display: block;width: 100%;height: 100%;padding: 1rem;}
.logo_download button:hover {background-color:var(--color-main); border-color:var(--color-main)}
.logo_download button:hover a {color:#fff}

/* PC */ 
@media only screen and (min-width:1024px) and (max-width: 1400px)  {
    .logo_box ul li img {width:100%}
    .logo_box ul li:last-child img {width: 60%;}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1023px)*/ 
@media all and (max-width:1023px) {
    .logo_box {padding:2rem}
    .logo_box ul {flex-wrap:wrap;gap: 4rem;}
    .logo_box ul li img {width:100%}
    .logo_box ul li:last-child img {width: 60%;}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .logo_box {padding:3rem 2rem}
    .logo_box ul li {width:100%;}
    .logo_box ul:after {
    width: 100%;
    height: 1px;
    top: 45%;
}
    .logo_download {margin-right:0}
}