@charset "utf-8";


/* ==========================================================================
   index
   ========================================================================== */
#top-content{
	position:relative;
	z-index:0;
	background-image:url(../img/bg.jpg);
	background-size:3px;
}
#top-content:before{
	content:"";
	position:absolute;
	width:100%;
	height:90px;
	background-color:#1c579c;
}


#visual{
	padding-bottom:35%;
	position:relative;
	overflow:hidden;
}
	#visual > .g1{
		position:absolute;
		width:100%;
		height:100%;
		z-index:0;
	}
	#visual > .g1.current{
		z-index:1;
	}
		.g1 > div,
		.g1 > h1{
			font-size:28px;
			font-weight:bold;
			position:absolute;
			text-align:center;
			color:white;
			text-shadow:0 -1px 1px rgba(0,0,0,.2), 1px 1px 2px rgba(0,0,0,.4), -1px 1px 2px rgba(0,0,0,.4);
			width:100%;
			top:50%;
			opacity:0;
opacity:1;
line-height: 1.5;
			-webkit-transform: translateY(-25%);
			transform: translateY(-25%);
		}
		.g1.current > div{
			opacity:1;
			-webkit-transform: translateY(-50%);
			transform: translateY(-50%);
			-webkit-transition:all .6s;
			transition:all .6s;
		}
@media screen and (max-width: 767px){
	.g1 > div,
	.g1 > h1{
		font-size: 14px;
	}
	.g1 > div >br,
	.g1 > h1 > br{
		display: inline-block;
	}
}




#news-wrapper h3.uline{
	font-size:21px;
	padding:10px;
	border-bottom:solid 3px #eee;
	position:relative;
}
	#news-wrapper h3.uline span{
		display:inline-block;
		position:relative;
	}
		#news-wrapper h3.uline span:after{
			content:"";
			display:inline-block;
			width:100%;
			height:100%;
			padding:10px;
			position:absolute;
			bottom:-13px;
			left:-10px;
			border-bottom:solid 3px #27A9D7;
		}
		#news-wrapper h3.uline i{
			color:#27A9D7;
			font-size:10px;
			font: 700 14px / 1 'Lato', sans-serif;
			vertical-align:middle;
			padding-left:10px;
		}
		#news-wrapper h3.uline > a{
			position:absolute;
			top:14px;
			right:10px;
			font-size:13px;
			color:inherit;
			text-decoration:none;
		}

#news-wrapper{
	background: rgb(255, 255, 255);
}
#news-wrapper .news-column{
	padding:10px 0;
}
	#news-wrapper .news-column > div{
		padding:15px 10px;
		border-bottom:solid 1px #e2e4e8;
	}
		#news-wrapper .news-column > div > a{
			color:inherit;
			text-decoration:none;
		}
			#news-wrapper .news-column i{
				display:block;
				float:left;
				padding-bottom:1em;
				margin-right:20px;
			}
			#news-wrapper .news-column i ~ *{overflow:auto;}

			#news-wrapper .news-column h4,
			#news-wrapper .news-column p{
				white-space:nowrap;
				overflow:hidden;
				text-overflow: ellipsis;
				margin-bottom:5px;
			}
			#news-wrapper .news-column h4{
				text-decoration:underline;
			}
			#news-wrapper .news-column h4 > span{
				background:#27A9D7;
				color:white;
				font-size:9pt;
				padding:5px;
				margin-right:5px;
				border-radius:4px;
				display:inline-block;
			}
			#news-wrapper .news-column p{
				font-size:9pt;
				color:#999;
			}
@media screen and (max-width: 767px){
	#news-wrapper .news-column i{
		float:none;
		padding-bottom:5px;
		font-size:smaller;
	}
}





#supports-wrapper{
}
	#supports-wrapper:before{
		content:"";
		position:absolute;
		width:100%;
		height:90px;
		background-color: #1c579c;
	}
	#supports{
		width:1200px;
		margin:auto;
		max-width:100%;
		overflow:hidden;
		position:relative;
	}
		#supports > .box{
			width:50%;
			height:90px;
			float:left;
		}
		#supports > .box.current{
			-webkit-transition:padding-bottom .4s .1s;
			transition:padding-bottom .4s .1s;
		}

			#supports > .box > h2{
				color:white;
				text-align:center;
				font-size:21px;
				height:90px;
				line-height:90px;
				position:relative;
				-webkit-transition:all .3s;
				transition:all .3s;
				background:#1c579c;
				cursor:pointer;
				text-indent:0;
			}
			#supports > .box.current > h2{
				background:#27A9D7;
			}
			#supports > .box.current > h2,
			#supports > .box > h2:hover{
				padding-left:1.5em;
			}
			#supports > .box2 > h2{
				border-left:solid 1px white;
			}
				#supports > .box > h2:after{
					content:"";
					width:0;
					height:0;
					border-style:solid;
					border-width:10px 10px 0 10px;
					border-color:#1c579c transparent transparent transparent;
					position:absolute;
					bottom:0;
					z-index:2;
					left:0;
					right:0;
					margin:auto;
					-webkit-transition:all .3s;
					transition:all .3s;
				}
				#supports > .box.current > h2:after{
					bottom:-10px;
					border-top-color:#27A9D7;
				}
				#supports > .box > h2 span{
					display:block;
				}
					#supports > .box > h2 span:before{
						content:"\f063";
						font-family:FontAwesome;
						line-height:1;
						position:absolute;
						width:1em;
						height:1em;
						text-align:center;
						left:.5em;
						-webkit-transition:all .3s;
						transition:all .3s;
						-webkit-transform:translateY(-1em);
						transform:translateY(-1em);
						opacity:0;
						top:0;
						bottom:0;
						margin:auto 0;
					}
					#supports > .box.current > h2 span:before,
					#supports > .box > h2:hover span:before{
						-webkit-transform:translateY(0);
						transform:translateY(0);
						opacity:1;
					}
					#supports > .box.current > h2 span:before{
						-webkit-transition-duration:0s;
						transition-duration:0s;
						-webkit-transition-delay:0s;
						transition-delay:0s;
					}

			#supports > .box > div{
				width:200%;
				padding:10px;
				box-sizing:border-box;
				background-image:url(../img/bg.jpg);
				background-size:3px;
				position:relative;
			}
			#supports > .box2 > div{
				margin-left:-100%;
			}
			#supports > .box.current > div{
				z-index:1;
			}
				#supports > .box > div > *{
					padding:10px;
					background:white;
					border-radius:4px;
				}
				#supports > .box > div h3{
					font-size:18px;
					font-weight:bold;
					padding:3px;
					margin-top:20px;
					margin-bottom:10px;
					color:#27A9D7;
					border-top:double 3px #27A9D7;
					border-bottom:double 3px #27A9D7;
				}
					#supports > .box > div h3:first-child{
						margin-top:0;
					}

				#supports > .box > div dl dt,
				#supports > .box > div ol li{
					font-size:16px;
					font-weight:bold;
					margin-top:.5em;
					padding-top:.5em;
					border-top:dotted 1px #e2e4e8;
					counter-increment:num;
					padding-left:27px;
					text-indent:-27px;
				}
				#supports > .box > div dl dd{
					font-size:13px;
					padding-top:5px;
					padding-left:27px;
				}
					#supports > .box > div dl dt:before,
					#supports > .box > div ol li:before{
						content:counter(num);
						font-size:12px;
						display:inline-block;
						margin-right:5px;
						width:18px;
						line-height:18px;
						text-align:center;
						border:solid 2px #27A9D7;
						vertical-align:text-top;
						text-indent:0;
						color:white;
						background:#27A9D7;
					}
					#supports > .box > div dl dt:first-child,
					#supports > .box > div ol li:first-child{
						margin-top:0;
						padding-top:0;
						border-top-width:0;
					}

				#supports > .box a{
					color:#007AFF;
					text-decoration:underline;
				}
@media screen and (max-width: 767px){
	#supports > .box > h2{
		width:100%;
		font-size:18px;
		line-height:1.278;
		display:table;
		box-sizing:border-box;
	}
	#supports > .box > h2 span{
		display:table-cell;
		vertical-align:middle;
	}
}


#we{
	width:100%;
	padding-bottom:10px;
	margin-bottom:10px;
	text-align:center;
	font-weight:bold;
	font-size:28px;
	position:relative;
	border-bottom:dotted 1px black;
}
	#we > a{
		display:block;
		width:100%;
		height:100%;
		color:inherit;
		text-decoration:none;
	}
		#we > a > div{
			display:table-cell;
			vertical-align:middle;
		}
		#we > a > .before,
		#we > a > .after{
			width:25%;
		}
		#we i{
			margin:0 -30%;
			position:relative;
			z-index:1;
		}
		#we span{
			display:inline-block;
			font-weight: bold;
			font-size: 18px;
			text-align: center;
			color: #1c579c;
			padding:15px;
			border: solid 3px #1c579c;
		}
@media screen and (max-width: 767px){
	#we{font-size:18px}
}


#main .row{
	overflow:hidden;
}
	#main .row > .col{
		width:50%;
		float:left;
	}
		#main .col > div{
			font-weight:bold;
			font-size:18px;
			text-align:center;
			margin:0 5px 10px 0;
			border:solid 3px #1c579c;
		}
		#main .col:nth-of-type(2n) > div{
			margin:0 0 10px 5px;
		}
			#main .col a,
			#we span{
				display:block;
				padding:20px .5em;
				color:#1c579c;
				text-decoration:none;
				position:relative;
				-webkit-transition:all .3s;
				transition:all .3s;
			}
			#main .col a:hover,
			#we a:hover span{
				padding-right:2em;
			}
			#main .col a:after,
			#we span:after{
				content:"\f061";
				font-family:FontAwesome;
				line-height:1;
				position:absolute;
				width:1em;
				height:1em;
				text-align:center;
				right:.5em;
				-webkit-transition:all .3s;
				transition:all .3s;
				-webkit-transform:translateX(-1em);
				transform:translateX(-1em);
				opacity:0;
				top:0;
				bottom:0;
				right:.5em;
				margin:auto 0;
			}
			#main .col a:hover:after,
			#we a:hover span:after{
				opacity:1;
				-webkit-transform:translateX(0);
				transform:translateX(0);
			}