#banner { position: relative; }

/* banner-for */
#banner { position: relative; z-index: 1; }
#banner .sp-slide { background: no-repeat 50% / cover; }
#banner .sp-slide a { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, .4); display: block; top: 0; left: 0; z-index: 10; }
#banner .banner-txt { position: absolute; width: 50%; top: 25%; left: 25%; border-bottom: 1px rgba(255, 255, 255, .2) solid; z-index: 11; }
#banner .banner-txt h2 { text-align: center; font-weight: 500; font-size: 40px; color: #fff; }
#banner .banner-txt p { margin: 15px 0 40px; text-align: center; line-height: 140%; font-size: 18px; color: #fff; }

/* banner-nav */
.sp-thumbnails-container { position: absolute; margin-bottom: 0; width: 100%; bottom: 0; left: 0; z-index: 2; }
.sp-bottom-thumbnails .sp-thumbnail-container ,
.sp-top-thumbnails .sp-thumbnail-container { float: none; margin-top: 100px; margin-left: 0; margin-right: 0; background: rgba(41, 40, 49, .9); display: inline-block; }
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail { margin-top: 0; background: #292831; }
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:before ,
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:after { display: none; }
.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail { position: relative; top: auto; }
.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail-title { text-align: center; line-height: 100px; font-weight: 500; font-size: 24px; color: #fff; }
.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail .sp-thumbnail-title { line-height: 160px; color: #a2664f; }

@media screen and (max-width: 980px) {
	#banner .banner-txt { width: 70%; top: 20%; left: 15%; }
}