@charset "utf-8";

/* container */
#container{position:relative; width:100%;}
.container{position:relative; width:100%; max-width:80rem; margin:0 auto;}
.container:after{display:none;}

/* MC_wrap */
div[class^="MC_wrap"] {position:relative; width:100%;}
.MC_wrap2{padding:5.5rem 0;}
.MC_wrap3:before{display:block; position:absolute; bottom:0; left:0; width:100vw; height:100%; background:linear-gradient(180deg, #fff 0%, #E8EFFF 100%); content:'';}
.MC_wrap4 .container{display:flex;}

/* MC_box */
div[class^="MC_box"] {position:relative;}
.MC_box1{display:flex; position:relative; width:100%; height:26.4rem; align-items:center;}
.MC_box1:before{display:block; position:absolute; z-index:-1; top:0; left:calc(50% - 50vw); width:100vw; height:100%; background:linear-gradient(125deg, #56A3E8 0%, #3F97E5 100%); content:'';}
.MC_box4, .MC_box5{display:flex; flex-direction:column; height:20.9rem;}
.MC_box4, .MC_box5 .faqCon{padding-top:2.8rem; padding-bottom:4rem;}
.MC_box4{width:48rem; padding-right:4rem; background:#fff; border-top-right-radius:3rem;}
.MC_box5{flex:1;}
.MC_box5 .faqCon{padding-left:4.8rem;}

@media all and (min-width:1641px){
    /* container */
    .MC_wrap3 .container{max-width:100rem;}
}

@media screen and (max-width:1640px) {
    /* container */
    .container{max-width:100%;}
    
    /* MC_wrap */
    div[class^="MC_wrap"] {padding-left:1rem; padding-right:1rem;}
    .MC_wrap2{padding:5rem 0;}
    div.MC_wrap3{padding:0 !important;}
    .MC_box4, .MC_box5{height:auto;}
    .MC_box4{width:60vw; padding-right:4.5vw;}
    .MC_box5 .faqCon{padding-left:4.5vw;}
}

@media screen and (max-width:1440px) {
    .MC_wrap2{padding:4.5rem 0;}
    .MC_box4, .MC_box5 .faqCon{padding-bottom:3.5rem;}
}

@media screen and (max-width:1240px) {
    .MC_wrap2{padding:3rem 0 4rem;}
    .MC_box1{height:23rem;}
}

@media screen and (max-width:1024px) {
    .MC_wrap4{padding:0 !important;}
    .MC_wrap4 .container{flex-direction:column;}
    
    .MC_box1{height:20rem;}
    .MC_box4{width:100%; padding:2.5rem 1rem 2rem; border-top-right-radius:0; border-bottom-left-radius:2rem;}
    .MC_box5{flex:auto; width:100%;}
    .MC_box5 .faqCon{flex-direction:row; align-items:center; width:100%; gap:2rem; padding:2.2rem 1.5rem 2.5rem;}
}

@media screen and (max-width:800px) {
    .MC_box1{height:auto;}
}

@media screen and (max-width:768px) {
    /* MC_wrap */
    div[class^="MC_wrap"] {padding-left:0.8rem; padding-right:0.8rem;}
    .MC_box4{padding-left:0.8rem; padding-right:0.8rem;}
}

@media screen and (max-width:640px) {
    .MC_wrap2{padding:2.5rem 0 3rem;}
    .MC_box5 .faqCon{gap:1.2rem; padding:2rem 1rem;}
}

@media screen and (max-width:480px) {
    .MC_wrap2{padding:2rem 0 2.5rem;}
    .MC_box4{padding:2rem 0.8rem 1.4rem;}
    .MC_box5 .faqCon{flex-direction:column; align-items:flex-start; gap:0.7rem;}
}
