/* 메인 비주얼 */
#main{
background-image: url(../images/Main-bg.png);
background-position: center center;
background-size: cover;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
#main h2{
font-size: var(--font-headline-large);
color: var(--navy-500);
font-weight: 700;
text-align: center;
}
#main p{
margin-top: 60px;
font-size: var(--font-body-large);
color: var(--navy-500);
line-height: 1.5;
text-align: center;
}

/* 공통 타이틀 스타일 */
.top-title h4{
width: 100%;
text-align: center;
font-size: var(--font-body-small);
}
.top-title h3{
width: 100%;
text-align: center;
font-size: var(--font-headline-small);   
font-weight: 700;
}

/* 사업분야 */
.biz-field {
width: 100vw;
padding: 5.21vw 10.42vw 0vw  10.42vw;
}
.biz-field .field-list{
margin: 6.25vw;
display: flex;
justify-content: space-between;
}
.biz-field .field-list li{
width: calc(33.33% - 2.60vw);
display: flex;
justify-content: center;
flex-wrap: wrap;
background-color: #FAFCFF;
border-radius: 30px;
padding: 1.56vw 2.60vw;
}
.biz-field .field-list li  img{
width: 100%;
height: auto;
max-width: 100px;
}
.biz-field .field-list li > figcaption{
display: block;
width: 100%;
text-align: center;
color: var(--gray-500);
font-size: var(--font-body-large);
margin-top: 30px;
}
.biz-field .field-list li > p{
width: 100%;
text-align: center;
margin-top: 30px;
font-size: var(--font-body-xsmall);
color: var(--gray-400);
}

/* 채용안내 */
.jop-info {
background-color: var(--gray-100);
padding: 5.21vw 10.42vw;
display: flex;
}
.jop-info .jopimg{
width: 50%;
}
.jop-info .jopimg img{
width: 100%;
max-width: 960px;
height: auto;
}
.jop-info .jopcontents{
display: flex;
justify-content: center;
align-items: center;
width: 50%;
flex-wrap: wrap;
}
.jop-info .jopcontents h3{
width: 100%;
text-align: center;
font-size: var(--font-headline-small);   
font-weight: 700;
}
.jop-info .button-warp{
display: flex;
gap: 30px;
}

/* 협력사 */
.partner {
width: 100vw;
padding: 5.21vw 10.42vw;
}
.partner .partner-tab{
margin-top: 80px;
display: flex;
justify-content: center;
gap: 30px;
}
.partner .swiper {
display: none;
}
.partner .partner-tab li{
display: flex;
cursor: pointer;
}
.partner .partner-tab .partner-contents{
display: none;
flex-wrap: wrap;
margin: 0 40px;
}
.partner-tab li.active .partner-contents{
display: flex;
align-items: center;
max-width: 28.65vw;
position: relative;
}
.partner-tab li.active .partner-contents::before{
content: "";
position: absolute;
top: 0;
left: -20px;
background-image: url(/images/quo.svg);
background-repeat: no-repeat;
width: 25px;
height: 25px;
}
.partner-tab li.active .partner-contents > h4 {
font-size: var(--font-title-medium);
font-weight: 600;
}
.partner-tab li.active .partner-contents > p{
font-size: var(--font-body-xsmall);
color: var(--gray-400);
}
.partner-tab li.active .partner-contents > p.category{
font-size: var(--font-body-small);
color: var(--gray-500);
}
.partner-tab li.active .partner-logo{
background-color: #0014BA;
width: 300px;
padding: 0 20px;
height: 360px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 30px;
transition: .5s;
}
.partner-tab li:nth-child(1).active .partner-logo{
    background-color:#7ACF93;
    }
.partner-tab li:nth-child(2).active .partner-logo{
background-color: var(--default-black);
}
.partner-tab li:nth-child(3).active .partner-logo{
background: linear-gradient(90.81deg, #e5437a .69%, #f28d52 75.01%, #ffd028 99.31%);
}
.partner-tab li:nth-child(4).active .partner-logo{
background-color: #888;
}
.partner-tab li .partner-logo .logo-big{
display: none;
}
.partner-tab li .partner-logo .logo-samll{
display: block;
}
.partner-tab li .partner-logo{
background-color: var(--gray-100);
width: 150px;
height: 360px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 30px;
}
.partner-tab li.active .logo-samll{
display: none;
}
.partner-tab li.active .logo-big{
display: block;
max-height: 40px;
width: auto;
}

/* 홍보부분 */
.promotion{
width: 100vw;
padding: 5.21vw 10.42vw;
background-image: url(/images/promotion-bg.png);
background-position: center;
background-size: cover;
}
.promotion > h3 {
color: var(--default-white);
font-size: var(--font-headline-small);
font-weight: 600;
width: 100%;
text-align: center;
}
.promotion .button-warp{
margin-top: 5.21vw;
display: flex;
justify-content: center;
gap: 30px;
}

/* 메인 푸터 부분 */
#footer-main{
width: 100vw;
background-color: var(--gray-100);
padding: 3vw 5.42vw;
}
#footer-main .link{
gap: 30px;
display: flex;
}
#footer-main .link li{
display: flex;
gap: 10px;
}
#footer-main .link a{
font-size: var(--font-body-small);
text-decoration: none;
color: var(--gray-500);
}
#footer-main .lnfo{
margin-top: 50px;
display: flex;
font-size: var(--font-body-xsmall); 
color: var(--gray-400);
}
#footer-main .lnfo li::after{
content: "|";
color: #aaa;
margin: 0 10px;
}
#footer-main .lnfo li:last-child:after{
content: "";
margin: 0 0px;
}
#footer-main .Copyright{
margin-top: 30px;
font-size: var(--font-body-xsmall); 
color: var(--gray-400);
}

/* 모바일 반응형 */
@media (max-width:1280px){
#main {
padding: 30px 20px 0 20px;
}
.biz-field {
padding: 30px 20px;
}
.biz-field .field-list {
flex-wrap: wrap;
}
.biz-field .field-list li {
width: 100%;
padding: 15px 20px;
margin-bottom: 20px;
}
.jop-info {
padding: 30px 20px;
flex-wrap: wrap;
}
.jop-info .jopimg {
display: flex;
width: 100%;
justify-content: center;
}
.jop-info .jopcontents {
width: 100%;
}
.jop-info .jopcontents h3 {
margin-top: 20px;
}
.jop-info .button-warp, .promotion .button-warp {
margin-top: 20px;
gap: 10px;
}
.partner {
padding: 30px 20px;
}
.partner .partner-tab{
display: none;
}
.partner .partner-tab li {
width: 100%;
}
#footer-main .lnfo {
flex-wrap: wrap;
margin-top:20px;
}
#footer-main .Copyright {
margin-top: 10px;
}
#footer-main .lnfo li::after{
content: "";
color: #aaa;
margin: 0 10px;
}
.partner .swiper {
margin-top: 30px;
width: 100%;
height: 100%;
position: relative;
display:block;
}
.partner .swiper-slide {
text-align: center;
font-size: 18px;
display: flex;
flex-wrap: wrap;
position: relative;
justify-content: center;
align-items: center;
padding-bottom: 30px;
}
.swiper-slide .partner-logo{
background-color: #0014BA;
width: calc(100% - 40px);
padding: 0 20px;
height: 160px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 30px;
transition: .5s;
}
.swiper-slide .partner-logo.cj{
background-color: var(--default-black);
}
.swiper-slide .partner-logo.lg{
background: linear-gradient(90.81deg, #e5437a .69%, #f28d52 75.01%, #ffd028 99.31%);
}
.swiper-slide .partner-logo.db{
    background: #7ACF93;
    }
.swiper-slide .partner-logo.lotte{
background-color: #888;
}
.swiper-slide .partner-contents{
margin-top: 20px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.swiper-slide .partner-contents h4{
font-size: var(--font-title-medium);
font-weight: 600;
width: 100%;
}
.swiper-slide .partner-contents > p{
margin-top: 15px;
font-size: var(--font-body-xsmall);
color: var(--gray-400);
}
.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction {
bottom: 0px !important;
left: 0;
z-index: 10000 !important;
width: 100%;
}
.swiper-pagination-bullet-active {
background-color: var(--navy-500);
}
}