@charset "UTF-8";
/* =========================================================
	basic style
========================================================= */

body{
	background:	none #fff;
	}


#wrapper	{
	overflow:	hidden;
	width:	100%;
	margin:	0 auto;
}

#contents	{
	width:	100%;
	margin:	20px auto 0 auto;
	font-size:	1.6rem;
}



/* header
--------------------------------------------------------- */
header	{
	width:	100%;
	margin:	0 auto;
}


header h1	{
	width:	300px;
	margin:	0 auto;
	text-align:	center;
}

header h1 img	{
	width:	300px;
	height:	auto;
}

header h2	{
	width:	100%;
	margin:	-35px auto 15px auto;
	text-align:	center;
	line-height:	0.8;
	}


header h2 img	{
	width:	200px;
	height:	auto;
	padding:	0 1px 1px 1px;
	border-bottom:	#666666 solid 1px;
	}


img.bnr_rinrei	{
	width:	100px;
	height:	auto;
	margin:	0 0 0 50px;
}


#gigyaShare	{
	margin:	0 0 50px 0;
}



/* navi
--------------------------------------------------------- */
nav	{
	width:	100%;
	margin:	30px auto 0 auto;
	padding:	5px 0 5px 0;
	text-align:	center;
	background:	#999;
}

nav ul	{
	margin:	0 auto 0 auto;
	text-align:	center;
}

nav li	{
	color:	#ffffff;
	display: inline-block;
	margin:	0 20px 0 0;
	font-size:	1.8rem;
	font-family: 'Abel', sans-serif;
}

nav li:last-child	{
	margin:	0;
}

nav li a	{
	color:	#ffffff !important;
padding:	1px 2px;
display:block;
position:relative;
text-align:center;
}

nav li a:link	{
	color:	#ffffff !important;
}

nav li a:before {
	content:"";
	display:block;
	position:absolute;
	left:100%;
	right:100%;
	bottom:0;
	height:1px;
	background-color:#fc98a6;
	-webkit-transition:left 0.3s ease, right 0.3s ease;
	-moz-transition:left 0.3s ease, right 0.3s ease;
	-o-transition:left 0.3s ease, right 0.3s ease;
	transition:left 0.3s ease, right 0.3s ease;
}

nav li a:hover	{
	color:	#fc98a6 !important;
}

nav li a:hover:before	{
	left:0;
	right:0;
}


/* main
--------------------------------------------------------- */
main	{
	width:	640px;
	margin:	20px auto 0 auto;
	text-align:	left;
}

/********** article, section **********/

article	{
	margin:	0 0 50px 0;
}

article h2	{
	margin:	0 0 50px 0;
	font-size:	2.2rem;
	font-family: 'Abel', sans-serif;
	border-bottom:	#666666 solid 1px;
}

section	{
	margin:	0 0 70px 0;
	font-size:	1.4rem;
}

section h3	{
	margin:	0 0 20px 0;
	padding:	5px 5px 5px 10px;
	font-size:	2.2rem;
	border-left:	6px solid #f26521;
}

section p	{
	margin:	0 0 2.0rem 0;
}

section .font_l	{
	line-height:	1.4;
	font-size:	1.8rem;
}

section .uline	{
	display:	block;
	font-size:	1.6rem;
	margin:	0 0 0.6rem 0;
	padding:	0.2rem 0.1rem;
	border-bottom:	#999 solid 1px;
}

section img	{
	margin:	1.2rem 0 1.2rem 0;
	width:	100%;
}


/* native music note
--------------------------------------------------------- */
section.musicnote	{
	margin:	0 0 70px 0;
}

section.musicnote h3	{
	padding:	3px 3px 0 3px;
	font-size:	3.6rem;
	font-family: 'Abel', sans-serif;
	border-left:	none;
	border-bottom:	1px solid #ccc;
}

section.musicnote h4	{
	margin:	0 0 40px 0;
	color:	#b6b7b7;
	font-size:	18px;
}

section.musicnote dl	{
	overflow:	hidden;
	width:	640px;
	margin:	20px 0 30px 0;
}

section.musicnote dt	{
	float:left;
	clear:left;
	text-align:	center;
	width:	150px;
}

section.musicnote dl dt img	{
	width:	150px;
	height:	auto;
}


section.musicnote dd	{
	float:	right;
	width:	470px;
}


section.musicnote dl h5	{
	display:	block;
	margin:	0 0 0.8rem 0;
	font-size:	1.6rem;
	font-weight:	bold;
}



/* pagenavi
--------------------------------------------------------- */
ul.pagenavi	{
	margin: 0 0 10px;
	padding: 15px 5px  10px  5px;
	background: #fff;
	border: 1px solid #ccc;
	text-align: center;
}

ul.pagenavi li	{
	display: inline;
	margin: 0 2px;
	padding: 0;
	font-size:	1.8rem;
}

ul.pagenavi li a	{
	display: inline-block;
	margin-bottom: 5px;
	padding: 5px 13px;
	background: #c2bebe;
	text-decoration: none;
	vertical-align: middle;
	color: #fff;
	border:	1px solid #c2bebe
}

ul.pagenavi li span	{
	display: inline-block;
	margin-bottom: 5px;
	padding: 5px 13px;
	background: #fff;
	text-decoration: none;
	vertical-align: middle;
	color: #000;
	border:	1px solid #ccc;
}

ul.pagenavi li a:hover	{
	color: #000;
	background: #f3f0f0;
	border-color: #00f;
	border:	1px solid #f3f0f0
}





/* =========================================================
	media queries for tablet
========================================================= */
@media only screen and (max-width : 960px){

/* main
--------------------------------------------------------- */
main	{
	width:	90%;
}


}



/* =========================================================
	media queries for smartphone
========================================================= */
@media only screen and (max-width : 640px){

/* header
--------------------------------------------------------- */
header	{
	width:	90%;
	margin:	0 auto;
}

header h1	{
	width:	100%;
	margin:	15px auto 15px auto;
}

header h1 img	{
	width:	100%;
}

header h2	{
	width:	100%;
	margin:	10px auto 15px auto;
	border-bottom:	#666666 solid 1px;
	}


header h2 img	{
	width:	200px;
	height:	auto;
	padding:	0 1px 1px 1px;
	border-bottom:	none;
	}


img.bnr_rinrei	{
	width:	100px;
	height:	auto;
	margin:	20px 0 0 25px;
}

/* navi
--------------------------------------------------------- */
nav	{
	margin:	10px auto 20px auto;
}

nav li	{
	font-size:	1.6rem;
}



/* main
--------------------------------------------------------- */
main	{
	margin:	20px auto 0 auto;
}

/********** article **********/
article h2	{
	font-size:	1.8rem;
}

section h3	{
	font-size:	1.8rem;
}




/* native music note
--------------------------------------------------------- */
section.musicnote	{
	margin:	0 0 70px 0;
}

section.musicnote h3	{
	padding:	3px 3px 0 3px;
	font-size:	2.0rem;
	font-family:	'Abel', sans-serif;
	border-left:	none;
	border-bottom:	1px solid #ccc;
}

section.musicnote h4	{
	margin:	0 0 40px 0;
	font-size:	1.6rem;
}

section.musicnote dl	{
	overflow:	hidden;
	width:	95%;
	margin:	20px auto 50px auto;
}

section.musicnote dt	{
	clear:	both;
	width:	100%;
}

section.musicnote dl dt img	{
	width:	100%;
	height:	auto;
}

section.musicnote dd	{
	clear:	both;
	width:	100%;
}


section.musicnote dl h5	{
	display:	block;
	margin:	0 0 0.8rem 0;
	font-size:	1.6rem;
	font-weight:	bold;
}


/* pagenavi
--------------------------------------------------------- */
ul.pagenavi li	{
	margin: 0 1px;
	font-size:	1.4rem;
}




}