@charset "utf-8";

.body .content{padding: 0px !important}
.body.fixed-width {border-left:none;border-right:none;}

.body {padding: 20px 0;}

.slidewrapper{position: relative; display: block; width: 100%; float: left; border: 1px solid #000; margin-bottom: 30px;}

.leftw {position: relative; display: block; width: 49%; float: left; border: 1px solid #000; height: 100%;}
.leftw_m {display: none;}

.titbox {position: relative; display: block; width: 100%; float: left; border-bottom: 1px solid #000; padding: 10px 10px 10px 30px;box-sizing: border-box;}

.titleft {position: relative; display: block; width: 50%; float: left; }
.titleft a{font-size: 24px; font-weight: 700; color: #000;}
.titright {position: relative; display: block; width: 30px; height: 30px; float: right; border: 1px solid #000; text-align: center;}
.titright a{font-size: 24px; font-weight: 700; color: #000;}
.titright:hover{background-color: #000;}
.titright:hover a{color: #fff;}

.leftbox  {position: relative; display: block; width: 100%; float: left; box-sizing: border-box;
padding: 30px 30px 0px 30px}


.rightw {position: relative; display: block; width: 49%; float: right; box-sizing: border-box;
border: 1px solid #000; }

.rightw01  {position: relative; display: block; width: 100%; float: left; box-sizing: border-box;}

.rightw02 {position: relative; display: block; width: 49%; float: right; box-sizing: border-box;
border: 1px solid #000; margin-top: 2%;}

.slide{height:400px;overflow:hidden;}
    .slide ul{width:calc(100% * 4);display:flex;animation:slide 15s infinite;} /* slide를 8초동안 진행하며 무한반복 함 */
    .slide li{width:calc(100% / 4);height:400px;}
    .slide li:nth-child(1){background:url('slide01.png') no-repeat; background-size: cover;}
    .slide li:nth-child(2){background:url('slide02.png') no-repeat; background-size: cover;}
    .slide li:nth-child(3){background:url('slide01.png') no-repeat; background-size: cover;}
    .slide li:nth-child(4){background:url('slide02.png') no-repeat; background-size: cover;}
    @keyframes slide {
      0% {margin-left:0;} /* 0 ~ 10  : 정지 */
      10% {margin-left:0;} /* 10 ~ 25 : 변이 */
      25% {margin-left:-100%;} /* 25 ~ 35 : 정지 */
      35% {margin-left:-100%;} /* 35 ~ 50 : 변이 */
      50% {margin-left:-200%;}
      60% {margin-left:-200%;}
      75% {margin-left:-300%;}
      85% {margin-left:-300%;}
      100% {margin-left:0;}
    }


@media all and (max-width: 768px) {
.body .content{padding: 0px 20px !important}

.leftw_m {position: relative; display: block; width: 100%; float: left; border: 1px solid #000;}

.leftw {display: none;}


.rightw  {position: relative; display: block; width: 100%; float: left; border: 1px solid #000;margin-top: 2%;}
.rightw02  {position: relative; display: block; width: 100%; float: left; border: 1px solid #000;}

.slide{height:150px;overflow:hidden;}
    .slide ul{width:calc(100% * 4);display:flex;animation:slide 15s infinite;} /* slide를 8초동안 진행하며 무한반복 함 */
    .slide li{width:calc(100% / 4);height:150px;}


}