/* CSS Document */

#container #fv{
	background: url(../img/fv.jpg) no-repeat center top;
	background-size: cover;
}
#container #fv h1{
	padding: 120px 0 20px;
	font-size: 2.8rem;
}
#container #fv h2{
	display: inline-block;
	border-bottom: 2px solid #FFF;
}

#container section {
    padding-bottom: 50px;
}

#container section h1{
	font-size: 3.0rem;
}






#infographics{
	background: #E4F7FB url(../img/infographics.png) no-repeat center top 40px;
}
#infographics .inner{
	text-align: center;
	margin: 0 auto;
	max-width: 800px;
}
#container #infographics {
    padding: 60px 0;
}



#data{}
#data ul li{
	float: left;
	background: #E4F7FB;
	margin: 10px;
	list-style: none;
	position: relative;
}
#data ul li img{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
#data ul li:nth-of-type(1){	width: 620px;height: 620px;}
#data ul li:nth-of-type(2){	width: 300px;height: 300px;}
#data ul li:nth-of-type(3){	width: 300px;height: 300px;}
#data ul li:nth-of-type(4){	width: 460px;height: 220px;}
#data ul li:nth-of-type(5){	width: 460px;height: 220px;}
#data ul li:nth-of-type(6){	width: 940px;height: 460px;}
#data ul li:nth-of-type(7){	width: 300px;height: 300px;}
#data ul li:nth-of-type(8){	width: 300px;height: 300px;}
#data ul li:nth-of-type(9){	width: 300px;height: 300px;}
#data ul li:nth-of-type(10){	width: 460px;height: 460px;}
#data ul li:nth-of-type(11){	width: 460px;height: 220px;}
#data ul li:nth-of-type(12){	width: 460px;height: 460px;float: right;}
#data ul li:nth-of-type(13){	width: 460px;height: 220px;}
#data ul li:nth-of-type(14){	width: 940px;height: 460px;}
#data ul li:last-of-type{
	background: url(../img/igp14_bg.png) no-repeat right 20px bottom,#E4F7FB;
}





@media screen and (max-width: 480px) {
	
	#container #fv {
    height: 100px;
	}
	#container #fv h1 {
    padding: 25px 0 0;
    font-size: 2.0rem;
	}
	#container #fv h2 {
    font-size: 1.0rem;
	}
	
	#container #navBtn ul li a {
    width: auto;
		display: block;
		float: none;
		padding: 15px 0;
		margin: 10px;
		font-size: 1.8rem;
	}
	#container section h1 {
    font-size: 2.5rem;
		margin: 10px;
	}
	#container #navBtn ul li a:after {
    top: 20px;
	}
	
	#container section article {
    width: auto;
		text-align: left;
	}
	
	#container section h2 {
    font-size: 2.5rem;
    margin: 0 20px 40px;
    line-height: 1.6em;
	}
	
	
	#infographics {
		background-position: center top 20px;
		background-size: 95%;
		line-height: 1.8em;
	}
	#container #infographics {
    padding: 30px 0;
	}
	#container #infographics .inner{
    text-align: left;
	}
	#data ul li img{	max-width: 80%;max-height: 80%;}
	#data ul li {	padding: 96% 0 0;margin: 2%;}

	#data ul li:nth-of-type(1){	width: 96%;height: 96%;}
	#data ul li:nth-of-type(2){	width: 46%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(3){	width: 46%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(4){	width: 96%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(5){	width: 96%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(6){	width: 96%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(7){	width: 46%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(8){	width: 46%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(9){	width: 46%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(10){	width: 46%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(11){	width: 96%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(12){	width: 96%;height: 96%;}
	#data ul li:nth-of-type(13){	width: 96%;height: 46%;padding: 46% 0 0}
	#data ul li:nth-of-type(14){	width: 96%;height: 46%;padding: 46% 0 0}
	#data ul li:last-of-type{
		background-size: 25%;
	}	
	
	
	
	
}