/* 마크업 사용자 스타일 
슬라이드의 width는 script option에서 수정.
*/


/********** 이미지 슬라이드 */


/********** 배너 슬라이드 */


/**** 1행 배너 슬라이드(기본) */
#banner01 {}
#banner01 li {position:relative;}
#banner01 li img {}
/* #banner01 li span는 예시에서 배너 순서를 표시하기 위한 Numbering 스타일 : 삭제하고 사용하세요.*/ 
#banner01 li span {display:block; position:absolute; left:45%; top:20%; color:#ffffff; font-size:3em; font-weight:bold; text-align:center; line-height:100%; background:rgba(0,0,0,0.8);}


/**** n행 배너 슬라이드 */
#banner02 {}
#banner02 li {line-height:10px;} /**/
#banner02 li img {}
/* #banner02 li span는 예시에서 배너 순서를 표시하기 위한 Numbering 스타일 : 삭제하고 사용하세요.*/ 
#banner02 li span {display:block; position:absolute; left:40%; top:30%; color:#ffffff; background:rgba(0,0,0,0.8); font-size:5em; font-weight:bold; text-align:center; line-height:100%;}


/**** vertical 배너 슬라이드 */
#banner03 {}
#banner03 li { text-align:center; }
#banner03 li img { display:inline-block; width:23.62%; margin-right:0.5%;}
#banner03 li a:last-child img { margin:0;}


/*//////////////////// multi Slider ///////////////////// */

/* Slider01 styling */
.bx-wrapper.multi01-wrapper {
	border:40px solid #ffcccc;
	border-radius:40px;
	background:#ffcccc;
	
	box-shadow: 2px 2px 0 #8a8a8a;
}
#multislider01 li {
	border-radius:20px;
	overflow:hidden;
}
.bx-wrapper.multi01-wrapper img {
	width:100%;
}

.bx-wrapper.multi01-wrapper .bx-pager.bx-default-pager a {
	background: #fff;
	width: 8px;
	height: 8px;
	margin: 0 5px;
	border-radius:0;
}

.bx-wrapper.multi01-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper.multi01-wrapper .bx-pager.bx-default-pager a.active {
	background: #ff9999;
}

.bx-wrapper.multi01-wrapper .bx-pager.bx-default-pager a.active {
	border:2px solid #ffffff;
}

#multislider01 li span,
#multislider02 li span {display:block; position:absolute; left:46%; top:50%; margin-top:-0.5em; color:#ffffff; font-size:3em; font-weight:bold; text-align:center; line-height:100%; background:rgba(0,0,0,0.8);}


/* Slide02 Styling */

.bx-wrapper.multi02-wrapper .bx-pager.bx-default-pager a {
	background: #ffcc00;
	width: 10px;
	height: 10px;
	margin: 0 5px;
}

.bx-wrapper.multi02-wrapper .bx-pager.bx-default-pager a:hover {
	background: #00ccff;
}

.bx-wrapper.multi02-wrapper .bx-pager.bx-default-pager a.active {
	background: #ffffff;
	border:3px solid #00ccff;
}


/********** banner next/prev 버튼 위치 조정 */

.banner-wrapper.bx-wrapper .bx-prev {
	left: -40px;
}

.banner-wrapper.bx-wrapper .bx-next {
	right: -40px;
}