﻿@import url('/resource/css/dgedu/up_pop.css');

/* 메인 컨테이너 */
#container { position:fixed; top: 0; left: 0; z-index:2; width:100%; height: 100vh; background: #615088;}
.hldy #container{padding-top: 2rem;}
#wrap.open #container{padding-top: 8.5rem;}
#container *{ scrollbar-arrow-color: #ddd; scrollbar-Track-Color: #ddd; scrollbar-base-color: #aaa; scrollbar-Face-Color: #aaa; scrollbar-3dLight-Color: #aaa; scrollbar-DarkShadow-Color: #aaa; scrollbar-Highlight-Color: #aaa; scrollbar-Shadow-Color: #aaa;}
#container ::-webkit-scrollbar { width: 5px; }
#container ::-webkit-scrollbar-thumb { background-color: #aaa; }
#container ::-webkit-scrollbar-track { background-color: #ddd; }

.MC_wrap1 { position:relative; padding:0; height: 100%; width: 100vw;}
.MC_wrap2 { position:relative; display: flex; justify-content: space-between; margin:2rem auto 1rem auto; width: 100%;}

.MC_wrap1 .container{ max-width: 1920px; }
.MC_wrap1 .container::after{display: none;}

.MC_box1 { position:relative; width:100%; overflow: hidden; padding-left: calc((100% - 85rem) / 2);} /* 메인비주얼 */
.MC_box2 { position: absolute; bottom: 4rem; left: calc((100% - 85rem) / 2); width: 42rem; height: 5rem; z-index: 9999;} /* 230307 gsjeong 수정 */
.MC_box3 {opacity: 0; position:relative; width:100%; height:35rem; background: #fff url('/images/dgedu/template/TC36/main/img_conTab.png') no-repeat right bottom; border-radius: 4.5rem; padding: 2.5rem 19rem 2.5rem 3rem; transform: translateX(-5rem); -webkit-transform: translateX(-5rem); transition: 0.5s; -webkit-transition: 0.5s; transition-delay: 0.5s; -webkit-transition-delay: 0.5s;} /* 게시판1 */
.MC_box4 { width: 100%; }

@media (max-width:1500px){
    #container{height: auto; padding-top: 6.5rem; position: relative;}
    .hldy #container{padding-top: 8.5rem;}
}

@media (min-width:1440px) and (max-height:1020px) {
    .MC_box2{bottom: 2rem;}
    .MC_box3{height: 30rem; padding: 1.5rem 19rem 1.5rem 3rem;}
}

@media (min-width:1440px) {
	.section02.swiper-slide-active .MC_box3{opacity: 1; transform: translateX(0); -webkit-transform: translateX(0);}
}


@media (max-width:1750px) {
    .MC_box1 {padding-left: 1rem;}
    .MC_box2{left: 1rem;}
	.MC_box3{padding-right: 10rem; background-size: 10rem;}
}

@media (max-width: 1500px) {
    .MC_wrap2{margin: 2rem 0;}

    .MC_box1{ width: 100%; height:auto; margin-bottom: 0;} /* 메인비주얼 */
    .MC_box2{position: relative; width: 100%; padding: 0 1rem; left: auto; height: auto; bottom: auto; margin-top: 1.5rem;}
    .MC_box3{opacity: 1; transform: none; -webkit-transform: none; padding: 2rem; background-image: none; border-radius: 3rem;}
    .MC_box4{margin: 4rem 0;}
}

@media (max-width: 1240px) {
    .hldy #container, .hldy.upPop #container{padding-top: 5.5rem;}
    #wrap.open #container{padding-top: 12rem;}
}

@media (max-width: 1024px) {

    .MC_box1{padding-left: 0;}
    .MC_box3{height: auto;}
    .MC_box4{margin: 2rem 0 1rem;}
}

@media (max-width: 768px) {
    .MC_box3{border-radius: 1rem; padding: 2rem 1rem;}
}

@media (max-width: 640px) {
    .MC_wrap2{flex-flow: column; }

    .MC_box3{margin-bottom: 1rem; padding-bottom: 3rem;} /* 게시판1 */
    .MC_box4{width:100%; max-width: 100%; } /* 게시판2 */
}

@media (max-width: 580px) {
    .hldy #container, .hldy.upPop #container{padding-top: 4.5rem;}
    #wrap.open #container{padding-top: 11rem;}
}

@media (max-width: 340px) {
    .hldy #container, .hldy.upPop #container{padding-top: 5rem;}
    #wrap.open #container{padding-top: 11.75rem;}
}