.slider_model{ //圖片輪播容器
	position: relative;
	display: block;
	width: 100%;

	.slider_model_box{ //播放區域

		a{
			display: block;
		}

		img{
			display: block;
			width: 100%;
		}

		& > * + *{
			display: none;
		}
	}

	.slider_introduce_box{ //左側介紹方框
		position: absolute;
		display: block;
		overflow: hidden;
		width: 25%;
		top: 20px;
		left: 3%;
		bottom: 20px;
		background-color: #fff; //for odd IE
		background-color: rgba(255,255,255,.9);
		border-radius: 4px;
		z-index: 1;

		h5{
			padding: 10px;
			background-color: #08c;
			color: #fff;
		}

		p{
			margin: 10px;
			line-height: 1.2;
			font-size: .9em;
			text-indent: 2em;
			text-align: justify;
			text-justify: inter-ideograph;
		}

		.ctrl_dot_box{
			position: absolute;
			width: 100%;
			margin: 0;
			padding: 10px 0;
			left: 0;
			bottom: 0;
			background-color: #fff;

			ul{

				li{

					a{

						&:hover{

						}

						&.is_active{

						}
					}
				}
			}
		}
	}

	.slider_list_box{ //右側播放清單
		position: absolute;
		display: block;
		overflow: hidden;
		width: 30%;
		right: 0;
		top: 0;
		bottom: 0;
		background-color: #000; //for odd IE
		background-color: rgba(0,0,0,.8);
		
		ul{
			position: relative;
			padding: 0;
			margin: 0;
			list-style: none;

			li{
				border-bottom: 1px solid #555;

				+ li{
					border-top: 1px solid #333;
				}

				a{
					display: block;
					padding: 10px;
					font-size: .8em;
					text-decoration: none;
					color: #fff;

					&:hover{

					}

					&.is_active{
						background-color: #08c;
						background-color: rgba(0,136,204,.6);
					}

					div{
						width: 42px;
						height: 42px;
						float: left;
						margin-right: 10px;
						border: 1px solid #ddd;
						background-repeat: no-repeat;
						background-position: center;
						background-size: cover;
					}

					h5{
						padding: 4px 0;
						color: #fff;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
					}

					p{
						padding: 4px 0;
						color: #fff;
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
					}
				}
			}
		}
	}

	.model_ctrl_tools{ //控制按鈕組
		width: 100%;
		height: 0;
		
		a{
			position: absolute;
			display: block;
			height: 20%;
			padding: 0 10px;
			top: 40%;
			background-color: #fff;
			text-align: center;
			text-decoration: none;
			z-index: 1;

			&:hover{

			}

			&.ctrl_left{
				left: 0;
				border-radius: 0 4px 4px 0;
			}

			&.ctrl_right{
				right: 0;
				border-radius: 4px 0 0 4px;
			}
		}
	}

	.slider_sec_model_box{ //第二組輪播視窗
		position: absolute;
		display: block;
		width: 65%;
		right: 3%;
		top: 20px;
		bottom: 20px;
		border: 1px solid #fff;
		border-radius: 4px;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
	}

	.slider_bottom_box{ //下方外層方框
		position: absolute;
		width: 100%;
		left: 0;
		bottom: 0;
		z-index: 1;

		.ctrl_dot_box{ //單獨的選取點點

			ul{

				li{

					a{

						&.is_active{

						}

						&:hover{

						}
					}
				}
			}
		}

		.bg_box{ //帶背景的方框
			padding: 10px 0 6px;
			border-top: 2px solid rgba(255,255,255,.8);
			background-color: #000; //for odd IE
			background-color: rgba(0,0,0,.8);


			.ctrl_dot_box{ //選取點點
				margin: 0 20px;
				float: right;

				ul{

					li{

						a{

							&:hover{

							}

							&.is_active{

							}
						}
					}
				}
			}

			.ctrl_img_box{ //選取影像
				position: relative;

				ul{
					width: 100%;
					text-align: center;
					letter-spacing: 6px;
					*zoom: 1;

					li{
						display: inline-block;
						*float: left;
						*padding: 0 4px;

						a{
							display: block;
							height: 40px;
							width: 40px;
							border: 1px solid #ddd;
							background-repeat: no-repeat;
							background-position: center;
							background-size: cover;
							opacity: .6;

							&:hover{
								opacity: 1;
							}

							&.is_active{
								border: 1px solid #08c;
								opacity: 1;
							}
						}
					}
				}
			}

			h5{
				padding: 4px 0;
				margin: 0 6px;
				color: #fff;
				text-align: center;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}

			p{
				padding: 4px 0;
				margin: 0 4px;
				color: #fff;
				text-align: center;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}
	}

	.ctrl_dot_box{ //點點基本設計
		padding: 4px 0 8px;

		ul{
			text-align: center;
			letter-spacing: 3px;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			*zoom: 1;

			li{
				display: inline-block;
				*float: left;
				*padding: 0 4px;

				a{
					position: relative;
					display: block;
					width: 14px;
					height: 14px;
					background-color: #ddd;
					border-radius: 100%;
					opacity: .8;

					&:hover{
						opacity: 1;
						background-color: #ddd;
					}

					&.is_active{
						background-color: #08c;
					}
				}
			}
		}
	}

	h5{ //h5基本設計
		font-size: 1.2em;
	}

	p{ //p基本設計
		font-size: 1em;
		overflow: hidden;
	}
}

@media (max-width: 480px){ //mobile

	.slider_model{ //圖片輪播容器

		.slider_introduce_box{ //左側介紹方框
			display: none;
		}

		.slider_list_box{ //右側播放清單
			width: 26%;
			
			ul{

				li{

					a{
						padding: 4px;

						div{
							width: 20px;
							height: 20px;
						}

						h5{

						}

						p{
							display: none;
						}
					}
				}
			}
		}

		.model_ctrl_tools{ //控制按鈕組
			display: none;
		}

		.slider_sec_model_box{ //第二組輪播視窗
			width: auto;
			right: 0;
			left: 0;
			top: 0;
			bottom: 0;
			border: 0;
			border-radius: 0;
		}

		.slider_bottom_box{ //下方外層方框

			.bg_box{ //帶背景的方框
				padding: 4px 0 2px;

				.ctrl_dot_box{ //選取點點
					margin: 0 10px;
				}

				.ctrl_img_box{ //選取影像

					ul{
						letter-spacing: 4px;

						li{

							a{
								height: 26px;
								width: 26px;
							}
						}
					}
				}

				h5{

				}

				p{

				}
			}
		}

		.ctrl_dot_box{ //點點基本設計
			padding: 4px;

			ul{
				letter-spacing: 1px;

				li{

					a{
						width: 10px;
						height: 10px;
					}
				}
			}
		}

		h5{ //h5基本設計
			font-size: 1.2em;
		}

		p{ //p基本設計
			font-size: 1em;
		}
	}
}

@media (min-width: 481px) and (max-width: 767px){ //pad

	.slider_model{ //圖片輪播容器

		.slider_introduce_box{ //左側介紹方框
			width: 30%;
			top: 10px;
			left: 10px;
			bottom: 10px;

			h5{
				padding: 6px;
				background-color: #08c;
				color: #fff;
			}

			p{
				text-indent: 0;
				margin: 6px;
			}

			.ctrl_dot_box{
				padding: 4px 0;
			}
		}

		.slider_list_box{ //右側播放清單
			width: 26%;
			
			ul{

				li{

					a{
						padding: 4px;

						div{
							width: 20px;
							height: 20px;
						}

						h5{

						}

						p{
							display: none;
						}
					}
				}
			}
		}

		.model_ctrl_tools{ //控制按鈕組

		}

		.slider_sec_model_box{ //第二組輪播視窗
			width: 62%;
			right: 10px;
			top: 10px;
			bottom: 10px;
		}

		.slider_bottom_box{ //下方外層方框
			position: absolute;
			width: 100%;
			left: 0;
			bottom: 0;

			.bg_box{ //帶背景的方框
				padding: 4px 0 2px;


				.ctrl_dot_box{ //選取點點
					margin: 0 10px;
				}

				.ctrl_img_box{ //選取影像

					ul{
						letter-spacing: 4px;

						li{

							a{
								height: 32px;
								width: 32px;
							}
						}
					}
				}

				h5{

				}

				p{

				}
			}
		}

		.ctrl_dot_box{ //點點基本設計
			padding: 4px;

			ul{
				letter-spacing: 1px;

				li{

					a{
						width: 12px;
						height: 12px;
					}
				}
			}
		}

		h5{ //h5基本設計
			font-size: 1.2em;
		}

		p{ //p基本設計
			font-size: 1em;
		}
	}
}

@media (min-width: 768px) and (max-width: 979px){ //pad

	
}