@charset "utf-8";


#example{
	text-align: center;
}
#example-title{
	border: 1px solid #5B5B5B;
	border-width: 1px 0;
	height: 255px;
}
#example-title .title-block{
	margin: 30px auto 20px;
	width: 360px;
}
#example-title .title-block p{
	margin: 10px 0 0;
}
#example-title > p img{
	opacity: 0;
}
#example-tab{
	margin-top: 50px;
}
#example-tab a{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	border-style: solid;
	border-width: 5px 5px 0 5px;
	border-radius: 10px 10px 0 0;
	color: #FFFFFF;
	display: inline-block;
	font-size: 200%;
	height: 100px;
	line-height: 90px;
	position: relative;
	text-decoration: none;
	transition: background-color 0.2s ease-out 0s;
	vertical-align: bottom;
	width: 350px;
}
#example-tab a:nth-child(1){
	background-color: #23BB68;
	border-color: #23BB68;
}
#example-tab a:nth-child(2){
	background-color: #29ABFF;
	border-color: #29ABFF;
}
#example-tab a:nth-child(3){
	background-color: #BA9A66;
	border-color: #BA9A66;
}
#example-tab a:not(:nth-child(3n+1)){
	margin-left: 25px;
}
#example-tab a:not(.active):after{
	content: "\F140";
	font-family: "Material Design Icons";
	line-height: 1;
	position: absolute;
	bottom: 0;
	left: 50%;
	-ms-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}
#example-tab a:hover,
#example-tab a.active{
	background-color: #FFFFFF;
}
#example-tab a:nth-child(1):hover,
#example-tab a.active:nth-child(1){
	color: #23BB68;
}
#example-tab a:nth-child(2):hover,
#example-tab a.active:nth-child(2){
	color: #29ABFF;
}
#example-tab a:nth-child(3):hover,
#example-tab a.active:nth-child(3){
	color: #BA9A66;
}
hr[id^="example-tab-border-"]{
	border-width: 0 0 10px 0;
	margin: 0 auto;
	width: 1100px;
}
hr#example-tab-border-1{
	border-color: #23BB68;
}
hr#example-tab-border-2{
	border-color: #29ABFF;
}
hr#example-tab-border-3{
	border-color: #BA9A66;
}
#example table{
	border-spacing: 0;
	border-left: 1px solid #333333;
	border-right: 1px solid #333333;
	margin-bottom: 60px;
	margin: 30px auto 0;
	text-align: left;
	width: 1102px;
}
#example table tr th{
	color: #29ABFF;
	font-size: 81.25%;
	padding: 10px 20px;
}
#example table tr th:nth-child(1){
	width: 349px;
}
#example table tr th:nth-child(2){
	width: 130px;
}
#example table tr th:nth-child(3){
	width: 130px;
}
#example table tr th + th{
	border-left: 1px solid #333333;
}
#example table tr td{
	padding: 10px 20px;
}
#example table tr:nth-child(odd) td{
	background-color: #D8F5FF;
}
#example table tr:nth-child(even) td{
	background-color: #EFFBFF;
}
#example table tr td + td{
	border-left: 1px solid #333333;
}
#example table tr td a.construction{
	display: inline-block;
	overflow: hidden;
	position: relative;
	text-dexoration: none;
	vertical-align: top;
	width: 220px;
}
#example table tr td a.construction:nth-child(even){
	margin-left: 10px;
}
#example table tr td a.construction img{
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: transform 0.2s ease-out 0s;
	vertical-align: top;
	width: 100%;
}
#example table tr td a.construction:hover img{
	-ms-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
#example table tr td a.construction span{
	background-color: #333333;
	color: #FFFFFF;
	display: inline-block;
	font-size: 81.25%;
	line-height: 1;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0.4em 1em;
}
