@charset "UTF-8";

/* 배너존 */
#menu355_obj1167 {position: absolute; left: 0; bottom: -150px; z-index: 55; width: 100% !important;}
.wrap-banner-zone {padding: 6px 0; background: rgba(0,0,0,.6); font-size: 0; position:absolute; bottom:0; width:100%;}
.wrap-banner-zone .title,
.wrap-banner-zone .list,
.wrap-banner-zone .control {display: inline-block; vertical-align: middle;}
.wrap-banner-zone .title {width: 35px; height: 30px; background: url('../images/ic-bannerzone1.png') no-repeat left center; font-family: 'Play Bold'; font-size: 21px; color: #fff; line-height: 1;}
.wrap-banner-zone .list {width: calc(100% - 90px);}
.wrap-banner-zone .list ul {display: inline-block; width: 100%;}
.wrap-banner-zone .list li {position: relative; display: flex !important; align-items: center; float: left; width: 50%; height: 38px; margin-bottom: 10px;}
.wrap-banner-zone .link {display: block; font-family: 'Dream Bold'; font-size: 15px; color: rgba(255,255,255,.8);}
.wrap-banner-zone .link,
.wrap-banner-zone .link p {display: inline-block; width: 100%; vertical-align: middle;}
.wrap-banner-zone .link p {overflow: hidden; display: -webkit-box; width: 100%; padding-right: 14%; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.wrap-banner-zone .link p span {position: relative; background: linear-gradient(to bottom, transparent 96%, rgba(255,255,255,0.64) 0) left center no-repeat; background-size: 0; transition: 1s;}
/* .wrap-banner-zone .link:hover p span{background-size: 100% auto;} */
.wrap-banner-zone .link .new {display: inline-block; margin-right: 15px; padding: 7px 18px; border: 1px solid #fff; font-family: 'Dream Light'; font-size: 14px; color: #fff;}
.wrap-banner-zone .more {position: absolute; right: 38px; top: 2px; width: 30px; height: 30px; background: url('../images/ic-bannerzone-more.png') no-repeat center;}
.wrap-banner-zone .control {position: relative; top: 0; width: 50px;}
.wrap-banner-zone .control .button {margin-bottom: 5px;}
.wrap-banner-zone .control .button button {width: 100%; font-size: 0; text-indent: -999999px;}
.wrap-banner-zone .control .prev {height: 6px; background: url('../images/ic-bannerzone-prev.png') no-repeat center;}
.wrap-banner-zone .control .next {height: 6px; background: url('../images/ic-bannerzone-next.png') no-repeat center;}
.wrap-banner-zone .control .stop,
.wrap-banner-zone .control .play {display: none; margin: 9px 0;}
.wrap-banner-zone .control .stop.on,
.wrap-banner-zone .control .play.on {display: block;}
.wrap-banner-zone .control .stop {height: 10px; background: url('../images/ic-bannerzone-stop.png') no-repeat center;}
.wrap-banner-zone .control .play {height: 10px; background: url('../images/ic-bannerzone-play.png') no-repeat center;}
.wrap-banner-zone .control .state {text-align: center;}
.wrap-banner-zone .control .state span {font-family: 'Play Regular'; font-size: 16px; color: #fff;}

@media all and (max-width: 1200px) {
  .wrap-banner-zone .more {right: 10px;}
}

@media all and (max-width: 768px) {
  .wrap-banner-zone {padding: 13px 0 10px 0;}
  .wrap-banner-zone .title {width: 45px;}
  .wrap-banner-zone .title br {display: none;}
  .wrap-banner-zone .list {width: calc(100% - 75px);}
  .wrap-banner-zone .link {font-size: 14px;}
  .wrap-banner-zone .link .new {font-size: 12px; padding: 4px 10px;}
  .wrap-banner-zone .control {position: absolute; right: 15px; top: 2px;}
  .wrap-banner-zone .control .state span {font-size: 14px;}
}