@keyframes fade_in 
{
    from { opacity:0; }
    to { opacity:1; }
}

@keyframes fade_out 
{
    from { opacity:1; }
    to { opacity:0; }
}

@keyframes left_in 
{
    from { transform:translateX(100%);  }
    to { transform:translateX(0); }
}

@keyframes left_out 
{
    from { transform:translateX(0);  }
    to { transform:translateX(-100%); }
}

@keyframes right_in 
{
    from { transform:translateX(-100%); }
    to { transform:translateX(0); }
}

@keyframes right_out 
{
    from { transform:translateX(0); }
    to { transform:translateX(100%); }
}




/* 외부 레이아웃 */
/*pc 버전*/
@media (min-width: 1400px) 
{ 
  .maingimg { min-width:1400px; background:black; }
  .wow_banner { width:100%; height:645px; position:absolute; }
  .wow_banner .item { }
  .wow_banner .WB_button_pre { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_next { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_pre:hover { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_next:hover {margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_on { margin:0 3px 3% 3px; width:25px; height:25px; padding:0; background:#2ddd63; color:white; border: 0; cusor:pointer; border-radius:15px; }
  .wow_banner .WB_button_off { margin:0 3px 3% 3px; width:25px; height:25px; padding:0; background:rgba(0,0,0,0.5); color:white; border: 0; cusor:pointer; border-radius:15px; }

  .travel_banner1 { width:1400px; height:600px; }
  .travel_banner1 .item { width:100%;  }
  .travel_banner1 .WB_button_pre { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner1 .WB_button_next { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner1 .WB_button_pre:hover { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner1 .WB_button_next:hover {margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}

  .travel_banner2 { width:1400px; height:600px; }
  .travel_banner2 .item { width:100%;  }
  .travel_banner2 .WB_button_pre { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner2 .WB_button_next { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner2 .WB_button_pre:hover { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner2 .WB_button_next:hover {margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}

  .travel_banner3 { width:1400px; height:600px; }
  .travel_banner3 .item { width:100%;  }
  .travel_banner3 .WB_button_pre { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner3 .WB_button_next { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner3 .WB_button_pre:hover { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner3 .WB_button_next:hover {margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}

}

/*tablet 버전*/
@media all and (min-width:540px)  and (max-width:1399px)
{ 
  .wow_banner { width:100%; height:645px; position:absolute; }
  .wow_banner .item {  }
  .wow_banner .WB_button_pre { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_next { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_pre:hover { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_next:hover {margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#2ddd63; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .wow_banner .WB_button_on { margin:0 2px 6% 2px; width:22px; height:22px; padding:0; background:#2ddd63; color:white; border: 0; cusor:pointer; border-radius:10px; }
  .wow_banner .WB_button_off { margin:0 2px 6% 2px; width:22px; height:22px; padding:0; background:rgba(0,0,0,0.5); color:white; border: 0; cusor:pointer; border-radius:10px; }

  .travel_banner1 { width:100%; height:500px; }
  .travel_banner1 .WB_button_pre { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner1 .WB_button_next { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:rgba(0,0,0,0.5); color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner1 .WB_button_pre:hover { margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#e71a0f; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
  .travel_banner1 .WB_button_next:hover {margin:30px; width:30px; height:30px; padding:0 0 0 0; background:#e71a0f; color:#fff; border:0; cusor:pointer; border-radius:30px;cusor:pointer;}
}


/*모바일 버전*/
@media (max-width: 539px) 
{ 
  .wow_banner { width:100%; height:645px; }
  .wow_banner .item { }
  .wow_banner .WB_button_pre {margin:2px 2px; width:30px; height:30px; padding:0 0 0 0; background:#white; color:black; border:solid 1px black; cusor:pointer;display:none;}
  .wow_banner .WB_button_next {margin:2px 2px; width:30px; height:30px; padding:0 0 0 0; background:#white; color:black; border:solid 1px black; cusor:pointer;display:none;}
  .wow_banner .WB_button_on {margin:5px 2px 30px 2px; padding:1% 3% !important; background:#2ddd63; color:white; border:0; cusor:pointer; text-align:center; border-radius:60px;;}
  .wow_banner .WB_button_off {margin:5px 2px 30px 2px; padding:1% 3% !important; background:rgba(0,0,0,0.5); color:white; border:0; cusor:pointer;text-align:center;border-radius:60px;}

  .travel_banner1 { width:100%; height:300px; }
  .travel_banner1 .item { display:flex; align-items:center; }
  .travel_banner1 .WB_button_pre {margin:2px 2px; width:30px; height:30px; padding:0 0 0 0; background:#white; color:black; border:solid 1px black; cusor:pointer;display:none;}
  .travel_banner1 .WB_button_next {margin:2px 2px; width:30px; height:30px; padding:0 0 0 0; background:#white; color:black; border:solid 1px black; cusor:pointer;display:none;}

}