.intro_wrap{width: 100%; height: 100%; overflow: hidden; text-align: center; font-size: 0; display: table;}
.m_intro_wrap{display: none;}
.intro_wrap>div{display: table-cell; vertical-align: middle;}
.intro_wrap .main_box{display: inline-block; width: 240px;
    height: 316px;
    position: relative; overflow: hidden;}
.intro_wrap .main_box.last{width: 200px;}
.intro_wrap .main_box p{float: left; width: 50%; cursor: pointer;}
.intro_wrap .main_box .txt{background:#fff; height: 100%; display: table;}
.intro_wrap .main_box .txt span{display: table-cell; color:#852885; font-size: 20px; font-weight: 800; letter-spacing: -0.01em; vertical-align: middle;}
.intro_wrap .main_box .txt span.on2{color:#f15a31;}
.intro_wrap .main_box .img{background:#000; height: 100%;}
.intro_wrap>div address{font-size: 13px; display: inline-block; width: 100%; color:#575757; margin-top: 20px; letter-spacing: -0.035em;}

/*큰박스*/
.intro_wrap .main_box .box_wrap{width: 480px; height: 100%; position: absolute; top: 0; right: 0; transition: all .5s;}
.intro_wrap .main_box .box_wrap a{display: block; height: 100%;}
.intro_wrap .main_box .box_wrap.on{right: -240px;}
.intro_wrap .main_box .box_wrap2{width: 480px; height: 100%; position: absolute; top: 0; left: 0; transition: all .5s;}
.intro_wrap .main_box .box_wrap2.on{left: -240px;}

/*작은 박스*/
.intro_wrap .main_box ul{height: 100%;}
.intro_wrap .main_box ul li{height: 107px; width: 100%; overflow: hidden;}
.intro_wrap .main_box ul li a{display: block; height: 100%; position: relative;}
.intro_wrap .main_box ul li:nth-child(2){height: 108px;}

.intro_wrap .main_box ul li a p{width: 100%; height: 100%; position: absolute; right: 0; top: -107px; transition: all .5s;}
.intro_wrap .main_box ul li a p span{display: block; width: 100%; height:100%; font-size: 20px; font-weight: 800; }
.intro_wrap .main_box ul li a p span.txt{padding: 35px 0 0 0;}
.intro_wrap .main_box ul li a p span.col01{color:#addb20;}
.intro_wrap .main_box ul li a p span.col02{color:#6ca8ee;}
.intro_wrap .main_box ul li.col4 a p span.col02{color:#aa0334;}
.intro_wrap .main_box ul li a p span.col03{color:#febc00;}
.intro_wrap .main_box ul li a p span.col04{color:#6ca8ee;}


.intro_wrap .main_box ul li a p.type01.on{top:0;}
.intro_wrap .main_box ul li a p.type02{width: 400px; overflow: hidden; top: 0px; right:-200px;}
.intro_wrap .main_box ul li a p.type02.on{right: 0;}
.intro_wrap .main_box ul li a p.type02 span{float: right; width: 50%;}

.intro_wrap .main_box ul li a p.type03{top:0;}
.intro_wrap .main_box ul li a p.type03.on{top:-107px;}

.intro_wrap .main_box ul li.col4{
    height: 79px;
    margin-bottom: 0px;
}
.intro_wrap .main_box ul li.col4 a p span{
    height: 79px;

}
.intro_wrap .main_box ul li.col4 a p span.txt{
    line-height: 1.2;
}
.intro_wrap .main_box ul li.col4 a p{
    top: -79px;
}
.intro_wrap .main_box ul li.col4 a p.type02{
    top: 0px;
}
.intro_wrap .main_box ul li.col4 a p.type03{
    top: 0px;
}
.intro_wrap .main_box ul li.col4 a p.type03.on{
    top: -79px;
}
.intro_wrap .main_box ul li.col4 a p.type04{
    width: 400px;
    top: 0px;
    right: -200px;
}
.intro_wrap .main_box ul li.col4 a p.type04.on{
    right: 0;
}
.intro_wrap .main_box ul li.col4 a p.type04 span{
    float: left;
    width: 50%;
}
.intro_wrap .main_box ul li.col4 a p span.txt{padding: 20px 0 0 0;}
/* @media screen and(max-width: 760px) */
@media screen and (max-width: 760px){

.intro_wrap{display: none;}
.m_intro_wrap{display: block; height: 100%; text-align: center; padding: 0 20px;}
.m_intro_wrap ul{height: 100%;}
.m_intro_wrap ul li a{display: block;}

}