@charset "utf-8";
/* CSS Document */
/* ------------------------------------------------------------------------ */

/*  Reset

/* ------------------------------------------------------------------------ */

html {
	overflow-y	: scroll;
	height		: 100%;
	font-size	: 62.5%;
	-webkit-text-size-adjust: 100%;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,p,blockquote {
	margin 	: 0;
	padding : 0;
}

fieldset {
	display	: inline;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style : normal;
}

body/**/table {
	line-height	: 1.5;
}

q:before,
q:after {
	content : '';
}

object,embed {
	vertical-align : top;
}

hr,legend	{
	display : none;
}

h1,h2,h3,h4,h5,h6 {
	font-size : 100%;
}

img,abbr,acronym,fieldset {
	border : 0;
}

li {
	list-style-type : none;
}

img[usemap] {
	border		: none;
	height		: auto;
	max-width	: 100%;
	width		: auto;
}

img {
	border		: 0;
	max-width	: 100%;
}

i {
	padding	: 5px 5px 2px 0;
}

p {
	word-break	: break-all;
}

/* Flexible Images */
img{
    max-width	: 100%;
    height		: auto;
    width /***/	: auto;
}

submit	{ -webkit-appearance : none;}

/* ------------------------------------------------------------------------ */

/*  Basic Style

/* ------------------------------------------------------------------------ */

body {
	margin		: 0;
	padding		: 0;
	height		: 100%;
	background	: #DDD;
	font-family	: Meiryo,"Hiragino Kaku Gothic ProN",Sans-Serif;
	font-size	: 1.7rem;
	font-size	: 17px;
	line-height	: 1.5;
	text-align	: center;
	color		: #999;
	-webkit-text-size-adjust	: 100%;
}

#wrap{
	margin		: 0 auto;
	max-width	: 980px;
	text-align	: center;
	background	: #FFF;
}

body > #wrap { height : auto;}


/* Link
--------------------------------------------------------------------------- */

.opacity a:hover img{
	opacity: 0.85;
}

a:link	{
	text-decoration	: none;
	color			: #231815;
}

a:visited	{
	text-decoration	: none;
	color			: #231815;
}

a:hover	{
	text-decoration	: underline;
}


/* ------------------------------------------------------------------------ */

/* Hedaer

/* ------------------------------------------------------------------------ */

header { margin-bottom : 0;}

header {
	position		: fixed;
	margin			: 0 auto;
	width			: 100%;
	max-width		: 980px;
	background		: #54afd7;
	padding			: 10px 0;
	z-index			: 1000;
}

	header p img{
		max-width	: 140px;
	}

	@media screen and (max-width: 768px) {
		header {
			position :static;
		}
	}


/* ------------------------------------------------------------------------ */

/* Navigation

/* ------------------------------------------------------------------------ */

#nav-drawer { position : relative;}

.nav-unshown { display : none;}

#nav-open {
	position		: absolute;
	top				: -45px;
	right			: 15px;
    display			: none;
    width			: 30px;
    height			: 22px;
    vertical-align	: middle;
	z-index			: 1000;
}
	@media screen and (max-width: 668px) {
		#nav-open {
			display:inline-block;
		}
	}

	#nav-open span, 
	#nav-open span:before, 
	#nav-open span:after{
		position		: absolute;
		height			: 3px;
		width			: 28px;
		border-radius	: 3px;
		background		: #555;
		display			: block;
		content			: '';
		cursor			: pointer;
	}
	
	#nav-open span:before {
		bottom	: -10px;
	}
	
	#nav-open span:after {
		bottom	: -20px;
	}
	
	#nav-close {
		display		: none;
		position	: fixed;
		z-index		: 99;
		top			: 0;
		left		: 0;
		width		: 100%;
		height		: 100%;
		background	: black;
		opacity		: 0;
		transition	: .3s ease-in-out;
	}
	
	#nav-content {
		overflow			: auto;
		position			: fixed;
		top					: 0;
		left				: 0;
		z-index				: 9999;
		width				: 65%;
		height				: 100%;
		background			: #fff;
		transition			: .3s ease-in-out;
		-webkit-transform	: translateX(-105%);
		transform			: translateX(-105%);
	}
	
		#nav-content ul{
			margin-top	: 5%;
		}
		
			#nav-content ul li{}
			#nav-content ul li a{
				display:block;
				padding:3%;
			}
	
	
	#nav-input:checked ~ #nav-close {
		display	: block;
		opacity	: .5;
	}
	
	#nav-input:checked ~ #nav-content {
		-webkit-transform	: translateX(0%);
		transform			: translateX(0%);
		box-shadow			: 6px 0 25px rgba(0,0,0,.15);
	}



/* ------------------------------------------------------------------------ */

/* Contents

/* ------------------------------------------------------------------------ */

#headImage {
	padding-top : 95px !important;
}

	@media screen and (max-width: 768px) {
		#headImage {
			padding-top : 0 !important;
		}
	}

/* ------------------------------------------------------------------------ */

/* Footer

/* ------------------------------------------------------------------------ */

footer {
	clear 		: both;
	background	: #c8c9ca;
	overflow	: hidden;
}

footer ul{
	overflow	: hidden;
	margin		: 0 auto;
}
	
	footer ul li{
		display		: inline-block;
		padding		: 1.5% 1% 0;
		font-size	: 1.6rem;
	}

		footer ul li a:link,
		footer ul li a:visited{
			color	: #FFF;
		}
		
	#copy {
		margin-top		: 100px;
		margin-bottom	: 20px;
		font-size		: 1.3rem;
		color			: #FFF;
	}