.banner-wrap{position:fixed; left:0; right:0; z-index:500; display:flex; justify-content:center; background:rgba(0,0,0,.5)}
.banner-wrap.is-hide .banner-thumb{height:0 !important; overflow:hidden;}
.banner-wrap .banner-inn{position:relative; z-index:9999; width:100%; max-width:1920px;}
.banner-wrap .banner-thumb{height:150px; background-position:center; background-repeat:no-repeat; background-position:cover; transition:height 300ms}
.banner-wrap .banner-thumb a{display:block}
.banner-wrap .banner-thumb img{max-width:100%}
.banner-wrap .banner-close{position:absolute; left:50%; transform:translateX(-50%); width:70px; height:30px; cursor:pointer}
.banner-wrap .banner-close:before{content:''; position:absolute; right:-5px; width:0; height:0; border-style:solid; border-width:35px}
.banner-wrap .banner-close .bar{position:absolute; top:50%; width:12px; height:2px; background:#fff; transition:transform 300ms}
.banner-wrap .banner-close .bar:nth-child(1){left:30px}
.banner-wrap .banner-close .bar:nth-child(2){right:20px}
.banner-wrap .banner-close:hover .bar{transform:rotate(180deg) !important}

/* top */
.banner-wrap.banner--top{top:0; box-shadow:0 5px 10px 0 rgba(0,0,0,.15)}
.banner-wrap.banner--top .banner-close{bottom:-30px}
.banner-wrap.banner--top .banner-close:before{top:0; border-color:rgba(0,0,0,.5) transparent transparent transparent}
.banner-wrap.banner--top .banner-close .bar:nth-child(1){transform:rotate(-45deg)}
.banner-wrap.banner--top .banner-close .bar:nth-child(2){transform:rotate(45deg)}
.banner-wrap.is-hide.banner--top .banner-close .bar:nth-child(1){transform:rotate(45deg)}
.banner-wrap.is-hide.banner--top .banner-close .bar:nth-child(2){transform:rotate(-45deg)}

/* bottom */
.banner-wrap.banner--bottom{bottom:0; box-shadow:0 -5px 10px 0 rgba(0,0,0,.15)}
.banner-wrap.banner--bottom .banner-close{top:-30px}
.banner-wrap.banner--bottom .banner-close:before{bottom:0; border-color:transparent transparent rgba(0,0,0,.5) transparent}
.banner-wrap.banner--bottom .banner-close .bar:nth-child(1){transform:rotate(45deg)}
.banner-wrap.banner--bottom .banner-close .bar:nth-child(2){transform:rotate(-45deg)}
.banner-wrap.is-hide.banner--bottom .banner-close .bar:nth-child(1){transform:rotate(-45deg)}
.banner-wrap.is-hide.banner--bottom .banner-close .bar:nth-child(2){transform:rotate(45deg)}

@media screen and (max-width:1023px){
	.banner-wrap{display:none !important}
}