@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400italic,700,900");
@import url("font-awesome.min.css");

/* Reset */
	html {
		overflow-x:hidden;
	}

	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline;
		text-decoration:none;
	}

	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;
	}

	body {
		line-height: 1;
	}

	ol, ul {
		list-style: none;
	}

	body {
		-webkit-text-size-adjust: none;
	}

/* Box Model */

	*, *:before, *:after {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

/* Desktop + Tablet */

	@media screen and (min-width: 737px) {
				

		.container {
			background: #333333;
			width:100%; height:120em;
		}


	.sd_01 {
		position:absolute;
		display:scroll;
		position:fixed;
		background: #333333;
		top:0%;
		left:0%;
		width:100%; height:4em; z-index:99;		
		box-shadow: inset 0px 0px 10px 0px rgba(255, 255, 255, 0.25);
	}
	.sd_01 ul {
		position:absolute;
		width:60%; 
		height:8em;
		left:23%;
		top:0.5em;
	}
	.sd_01 li {
		display:inline-block;
		border-bottom:0.1em solid gray;
		padding: 0.2em;
		margin-right:2em;
		text-align:center;
		width:20%;
	}
	.sd_01 a {
		color:#ffffff;
		font-size:80%;
	}
	.sd_01 li:hover a {
		color:#fffaaa;
	}

	.sd_02 {
		position:relative;
		width:55%;
		height:100%;
		top:8em; left:23%;
	}
	.text {
		position:absolute;
		top:0px; left:0px;
		color:#ffffff;
		font-size:1.5em;
		font-weight:500;
		text-shadow:0.2em 0.2em 0.2em #000000;
	}



	.m_01 {
		position:absolute;
		top:2em; left:0px;		
	  	width:48%;
	}
	.ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.2em;
	  	color:#ffffff;
	}
	.ti span {
		font-size:0.7em;
		color:#ffffff;
	}
	.img_01 img {
	  	position:absolute;
	  	width:100%;
	  	top:1.7em; left:0px;
	  	border:0.15em solid #b0b0b0;
	}
	.tit {
	  	width:100%;
	  	margin-top:80.8%;
	  	border:0.15em solid #b0b0b0;
	  	color:#ffffff;
	  	text-align:justify;
	  	font-size:0.8em;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}

	#flip_01 img {
	  	position:absolute;
	  	top:45%; left:102%;
	  	z-index:30;
	  	cursor:pointer;

	}
	#panel_01 {
	  	position:absolute;
	  	top:0; left:112%;
	  	width:96% ;height:60em;
		display:none;
	}
	#panel_01 table {
	  	position:absolute;
	  	width:100%;
	  	top:1.7em; left:0em;
	  	border-top:0.18em solid #ffffff;  
	  	border-bottom:0.18em solid #ffffff;
	}
	#panel_01 td {
	  	text-align:center;
	  	color:#ffffff;
	  	font-size:75%;
	  	padding:0.01em 0;
	  	border-bottom:0.1em  solid #ffffff;
	}
	.ta {
	  	border-left:0.1em  solid #ffffff;
	}

	.s_title_01 {
	  	position:absolute;
	  	top:32%;left:0%;
	 	font-size:1em;
	  	font-weight:600;
	  	color:#ffffff;
	}

	.icon_0{
	  	position:absolute;
	  	width:100%;
	  	top:35%;left:0%;
	}
	.icon_0 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_0 img{
		width:100%;
	}
	.icon_0 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_1{
	  	position:absolute;
	  	width:100%;
	  	top:46%;left:0%;
	}
	.icon_1 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_1 img{
		width:100%;
	}
	.icon_1 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.s_title_02 .red {
	  	position:absolute;
	  	top:57%;left:0%;
	 	font-size:1em;
	  	font-weight:600;
	  	color:red;
	}
	.s_title_02 span {
	  	position:absolute;
	  	top:57%;left:10%;
	 	font-size:1em;
	  	font-weight:600;
	  	color:#ffffff;
	}

	.icon_3{
	  	position:absolute;
	  	width:100%;
	  	top:60%;left:0%;
	}
	.icon_3 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_3 img{
		width:100%;
	}
	.icon_3 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_4{
	  	position:absolute;
	  	width:100%;
	  	top:71%;left:0%;
	}
	.icon_4 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_4 img{
		width:100%;
	}
	.icon_4 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_5{
	  	position:absolute;
	  	width:100%;
	  	top:82%;left:0%;
	}
	.icon_5 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_5 img{
		width:100%;
	}
	.icon_5 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_6{
	  	position:absolute;
	  	width:100%;
	  	top:93%;left:0%;
	}
	.icon_6 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_6 img{
		width:100%;
	}
	.icon_6 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_7{
	  	position:absolute;
	  	width:100%;
	  	top:104%;left:0%;
	}
	.icon_7 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_7 img{
		width:100%;
	}
	.icon_7 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_8{
	  	position:absolute;
	  	width:100%;
	  	top:115%;left:0%;
	}
	.icon_8 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_8 img{
		width:100%;
	}
	.icon_8 p{
	  	text-align:center;
	  	margin-top:-1em;
	}



	.m_02 {
		position:absolute;
		top:42em; left:0px;		
	  	width:48%;
	}
	.ti_02 {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.2em;
	  	color:#ffffff;
	}
	.ti_02 span {
		font-size:0.7em;
		color:#ffffff;
	}
	.img_02 img {
	  	position:absolute;
	  	width:100%;
	  	top:1.7em; left:0px;
	  	border:0.15em solid #b0b0b0;
	}
	.tit_02 {
	  	width:100%;
	  	margin-top:80.8%;
	  	border:0.15em solid #b0b0b0;
	  	color:#ffffff;
	  	text-align:justify;
	  	font-size:0.8em;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}

	#flip_02 img {
	  	position:absolute;
	  	top:45%; left:102%;
	  	z-index:30;
	  	cursor:pointer;
	}
	#panel_02 {
	  	position:absolute;
	  	top:0; left:112%;
	  	width:96% ;height:60em;
		display:none;
	}
	#panel_02 table {
	  	position:absolute;
	  	width:100%;
	  	top:1.7em; left:0em;
	  	border-top:0.18em solid #ffffff;  
	  	border-bottom:0.18em solid #ffffff;
	}
	#panel_02 td {
	  	text-align:center;
	  	color:#ffffff;
	  	font-size:75%;
	  	padding:0.01em 0;
	  	border-bottom:0.1em  solid #ffffff;
	}
	.ta {
	  	border-left:0.1em  solid #ffffff;
	}

	.icon_9{
	  	position:absolute;
	  	width:100%;
	  	top:35%;left:0%;
	}
	.icon_9 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_9 img{
		width:100%;
	}
	.icon_9 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_10{
	  	position:absolute;
	  	width:100%;
	  	top:46%;left:0%;
	}
	.icon_10 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_10 img{
		width:100%;
	}
	.icon_10 p{
	  	text-align:center;
	  	margin-top:-1em;
	}



	.m_03 {
		position:absolute;
		top:82em; left:0px;		
	  	width:48%;
	}
	.ti_03 {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.2em;
	  	color:#ffffff;
	}
	.ti_03 span {
		font-size:0.7em;
		color:#ffffff;
	}
	.img_03 img {
	  	position:absolute;
	  	width:100%;
	  	top:1.7em; left:0px;
	  	border:0.15em solid #b0b0b0;
	}
	.tit_03 {
	  	width:100%;
	  	margin-top:80.8%;
	  	border:0.15em solid #b0b0b0;
	  	color:#ffffff;
	  	text-align:justify;
	  	font-size:0.8em;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}


	#flip_03 img {
	  	position:absolute;
	  	top:45%; left:102%;
	  	z-index:30;
	  	cursor:pointer;
	}
	#panel_03 {
	  	position:absolute;
	  	top:0; left:112%;
	  	width:96% ;height:60em;
		display:none;
	}
	#panel_03 table {
	  	position:absolute;
	  	width:100%;
	  	top:1.7em; left:0em;
	  	border-top:0.18em solid #ffffff;  
	  	border-bottom:0.18em solid #ffffff;
	}
	#panel_03 td {
	  	text-align:center;
	  	color:#ffffff;
	  	font-size:75%;
	  	padding:0.01em 0;
	  	border-bottom:0.1em  solid #ffffff;
	}
	.ta {
	  	border-left:0.1em  solid #ffffff;
	}

	.icon_11 {
	  	position:absolute;
	  	width:100%;
	  	top:30%;left:0%;
	}
	.icon_11 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_11 img{
		width:100%;
	}
	.icon_11 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_12 {
	  	position:absolute;
	  	width:100%;
	  	top:41%;left:0%;
	}
	.icon_12 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_12 img{
		width:100%;
	}
	.icon_12 p{
	  	text-align:center;
	  	margin-top:-1em;
	}

	.icon_13 {
	  	position:absolute;
	  	width:100%;
	  	top:52%;left:0%;
	}
	.icon_13 li{
	  	display:inline-block;
	  	color:#ffffff;
	  	font-size:0.8em;
		width:18%;
	}
	.icon_13 img{
		width:100%;
	}
	.icon_13 p{
	  	text-align:center;
	  	margin-top:-1em;
	}
	}

/* Tablet Only */

	@media screen and (min-width: 737px) and (max-width: 1200px) {

	.sd_01 {
		position:absolute;
		display:scroll;
		position:fixed;
		background: #333333;
		top:0%;
		left:0%;
		width:100%; height:4em; z-index:99;		
		box-shadow: inset 0px 0px 10px 0px rgba(255, 255, 255, 0.25);
	}
	.sd_01 ul {
		position:absolute;
		width:70%; 
		height:4em;
		left:30%;
		top:0.5em;
	}
	.sd_01 li {
		display:inline-block;
		border-bottom:0.1em solid gray;
		padding: 0.2em;
		margin-right:2em;
		text-align:center;
		width:20%;
	}
	.sd_01 a {
		color:#ffffff;
		font-size:0.8em;
	}
	.sd_01 li:hover a {
		color:#fffaaa;
	}

	.sd_02 {
		position:relative;
		width:80%;
		height:100%;
		top:8em; left:20%;
	}
	.text {
		position:absolute;
		top:0px; left:0px;
		color:#ffffff;
		font-size:1.5em;
		font-weight:500;
		text-shadow:0.2em 0.2em 0.2em #000000;
	}
	}

/* Mobile Only */

	#navPanel, #titleBar {
		display: none;
	}

	@media screen  and (min-width: 401px) and (max-width: 736px) {
	.sd_01 ul {
		display:none;
	}
	.sd_02 {
	  	position:relative;
	  	width:88%;
	  	height:100%;
	  	top:1em; left:1em;
	}
	#t_info {
		display:none;
	}
	.text {
	  	position:absolute;
	  	top:0px; left:0px;
	  	color:#ffffff;
	  	font-size:1.5em;
	  	font-weight:500;
	  	text-shadow:0.2em 0.2em 0.2em #000000;
	}

	.m_01 {
		position:absolute;
		top:1%; left:0em;		
	  	width:100%;height:27em;
	}
	.m_01 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_01 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_01 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_01 {
		display:none;
	}
	#panel_01 {
		display:none;
	}

	.m_02 {
		position:absolute;
		top:50em; left:0em;		
	  	width:100%;height:27em;
	}
	.m_02 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_02 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_02 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_02 {
		display:none;
	}
	#panel_02 {
		display:none;
	}

	.m_03 {
		position:absolute;
		top:100em; left:0em;		
	  	width:100%;height:27em;
	}
	.m_03 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_03 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_03 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_03 {
		display:none;
	}
	#panel_03 {
		display:none;
	}
}

/* 360*/

	@media screen  and (max-width: 400px) {
	.sd_01 {
		display:none;
	}
	.sd_02 {
	  	position:relative;
	  	width:90%;
	  	height:100%;
	  	top:2em; left:1em;
	}
	#t_info {
		display:none;
	}
	.text {
	  	position:absolute;
	  	top:0px; left:0px;
	  	color:#ffffff;
	  	font-size:1.5em;
	  	font-weight:500;
	  	text-shadow:0.2em 0.2em 0.2em #000000;
	}

	.m_01 {
		position:absolute;
		top:1%; left:0em;		
	  	width:100%;height:27em;
	}
	.m_01 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_01 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_01 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_01 {
		display:none;
	}
	#panel_01 {
		display:none;
	}

	.m_02 {
		position:absolute;
		top:45em; left:0em;		
	  	width:100%;height:27em;
	}
	.m_02 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_02 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_02 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_02 {
		display:none;
	}
	#panel_02 {
		display:none;
	}

	.m_03 {
		position:absolute;
		top:90em; left:0em;		
	  	width:100%;height:27em;
	}
	.m_03 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_03 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_03 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_03 {
		display:none;
	}
	#panel_03 {
		display:none;
	}

	.m_04 {
		position:absolute;
		top:67%; left:0em;		
	  	width:100%;height:27em;
	}
	.m_04 .ti {
		position:absolute;
	  	width:100%;top:0;
	  	font-size:1.1em;
	  	color:#ffffff;
	}
	.m_04 img {
		width:99%;
	  	position:absolute;
	  	top:1.7em; left:0;
	  	border:0.15em solid #b0b0b0;
	}
	.m_04 .tit {
	  	width:100%;
	  	margin-top:80%;
	  	color:#ffffff;
	  	text-align:justify;
	  	padding:0.5em 0.5em;
	  	line-height:1.5em;
	}
	#flip_04 {
		display:none;
	}
	#panel_04 {
		display:none;
	}
}