@charset "UTF-8";
@import url("archive.css");
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:400,500,700&subset=japanese');
@import url('https://fonts.googleapis.com/css?family=Barlow+Condensed');


/********** browser default initialization **********/

body, div, dl, dt, dd, ul, ul li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote, th, td,
section, nav, article, aside, hgroup, header, address,
figure, figcaption {
	margin: 0;
	line-height: 1.4;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {
	text-align: left;
}
q:before ,q:after {
	content: '';
}
object, embed {
	vertical-align: top;
}
hr, legend {
	display: none;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
img, abbr, acronym, fieldset {
	border: 0;
}
img {
	vertical-align: top;
	-ms-interpolation-mode: bicubic;
}
ul li {
	list-style-type: none;
}

@media print {
	body	{ display: none }
}



/* =========================================================
	basic style
========================================================= */
html{
	font-size:	62.5%;
	}

body{
	margin:	20px 0;
	padding:	0;
	color:	#606041;
	font-size:	12px;
	font-size:	1.2rem;
	line-height:	1.5em !important;
	font-family: 'Noto Sans SC',游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴ Pro','Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ ゴシック',’MS PGothic’, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
	text-align:	left;
	-webkit-text-size-adjust:	100%;

	background: linear-gradient(317deg, #ffffff, #ffffff, #f4ed9b, #ffffff, #ffffff, #ffffff);
	background-size: 1200% 1200%;
	-webkit-animation: AnimationName20s ease infinite;
	-moz-animation: AnimationName 20s ease infinite;
	-o-animation: AnimationName 20s ease infinite;
	animation: AnimationName 20s ease infinite;
	}


/********** bg animation **********/
@-webkit-keyframes AnimationName {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}
@-o-keyframes AnimationName {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}
@keyframes AnimationName { 
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}




	.pc{
	display:	block;
	}

	.pc_tablet{
	display:	block;
	}

	.tablet_phone	{
	display:	none;
	}

	.tablet	{
	display:	none;
	}

	.phone	{
	display:	none;
	}

ul{
	margin:	0;
	padding:	0;
	}

p	{
		margin:	1.2em 0 1.6em 0;
		line-height: 1.2;
		text-align:	left;
}

a	{
	display:	inline-block;
	-webkit-backface-visibility:	hidden;
	backface-visibility:	hidden;
	outline:	none;
	border:	none;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

a:focus	{
	outline:none;
}

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

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

a:hover	{
		color:#fc98a6;
		text-decoration:	underline;
		}

a:active	{
		color:#fdb3bd;
		text-decoration: none;
		}

img	{
		margin:	0;
		border:	0;
		}

a img	{
		xbackground:	#fff;
		margin:	0;
		border:	0;
		}

a:hover img{
	display:	inline-block;
	opacity:	0.7;
	-moz-opacity:	0.7;
	filter: alpha(opacity=70);
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

/* abcd
--------------------------------------------------------- */

/* ----- abcd ----- */

/********** abcd **********/



/* common
--------------------------------------------------------- */
#wrapper	{
	overflow:	hidden;
	width:	900px;
	margin:	0 auto;
}

#contents	{
	overflow:	hidden;
	margin:	0;
	font-size:	1.4rem;
	xbackground:	#cc0000;
}


main		{
	overflow:	hidden;
	float:	left;
	width:	600px;
	margin:	30px 0 0 0;
}



/* header
--------------------------------------------------------- */
header	{
	width:	500px;
	height:	450px;
	margin:	50px auto 0 auto;
	text-align:	center;
}


header h1	{
	margin:	0px auto 30px auto;
}

header h1 img	{
	width:	100%;
	height:	auto;
}

header h2	{
	width:	100%;
	margin:	0px auto 10px auto;
	padding:	1.0rem 0;
	font-size:	1.8rem;
	border-top:	#666633 solid 1px;
	border-bottom:	#666633 solid 1px;
}

header h3	{
	margin:	0px auto 10px auto;
	font-size:	1.4rem;
}



/********** program **********/
section.prg_contents h1	{
	font-size:	1.8rem;
	margin:	0 0 20px 0;
	padding:	0 0 0.4rem 0;
	border-bottom:	#666633 solid 1px;
}

section .main_img img	{
	width:	100%;
	height:	auto;
	margin:	0 0 20px 0;
}

.tag_cat	{
	display:	inline-block;
	background:	#c9151e;
	color:	#fff;
	font-size:	1.6rem;
	font-family:	'Barlow Condensed', sans-serif;
	letter-spacing:	0.2rem;
	margin:	0 0 20px 0;
	padding:	5px 80px 5px 10px;
}

.prg_date	{
	margin:	0 0 0.5rem 0;
	font-size:	1.8rem;
	font-family:	'Barlow Condensed', sans-serif;
	letter-spacing:	0.1rem;
}



/* aside
--------------------------------------------------------- */
aside	{
	overflow:	hidden;
	float:	right;
	width:	250px;
}

/********** navigator area **********/
aside .nvg_area	{
	margin:	0 0 30px 0;
	font-size:	1.2rem;
}

aside .nvg_area img	{
	width:	250px;
	height:	auto;
	margin:	0 0 20px 0;
}

aside .nvg_area h1	{
	font-size:	1.4rem;
}

/********** banner area **********/
.bnr_area	{
	overflow:	hidden;
	margin:	0 0 30px 0;
}

.bnr_area li	{
	width:	250px;
	height:	auto;
	margin:	0 0 10px 0;
}

.bnr_area img	{
	width:	100%;
	height:	auto;
}

/********** button area **********/
.btn_area	{
	overflow:	hidden;
	margin:	0 0 30px 0;
	font-size:	1.8rem;
	font-family:	'Barlow Condensed', sans-serif;
}

.btn_area li	 a{
	display:	block;
	box-sizing:	border-box;
	width:	250px;
	height:	auto;
	margin:	0 0 10px 0;
	padding:	5px 5px 5px 10px;
	letter-spacing:	0.2rem;
	border:	1px solid #606041;
}

.btn_area li	 i{
	margin:	0 2px 0 0;
	font-size:	1.4rem;
}



/* footer
--------------------------------------------------------- */
footer	{
	overflow:	hidden;
	width:	100%;
	margin:	150px 0 0 0;
	padding:	0 0 100px 0;
}

footer ul	{
	overflow:	hidden;
	margin:	0 0 50px 0;
	width:	318px;
	margin:	0 auto;
}

#footer_home	{
	float:	left;
	height:	60px;
	margin:	0 40px 0 0;
}

#footer_j-wave	{
	float:	left;
}

#footer_j-wave img	{
	width:	auto;
	height:	30px;
}

#footer_copyright	{
	overflow:	hidden;
	width:	100%;
	text-align:	center;
	font-size:	12px;
	font-family: 'Abel', sans-serif;
}



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

body{
	margin:	0;
}

	.pc{
	display:	none;
	}

	.pc_tablet{
	display:	block;
	}

	.tablet_phone	{
	display:	block;
	}

	.tablet	{
	display:	block;
	}

	.phone	{
	display:	none;
	}

/* common
--------------------------------------------------------- */
#wrapper	{
	overflow:	hidden;
	width:	100%;
	margin:	0 auto;
}

#contents	{
	margin:	20px auto 0 auto;
	width:	90%;
}

main		{
	clear:	both;
	margin:	0 auto 50px auto;
	padding:	0 0 30px 0;
	width:	100%;
	border-bottom:	#666633 solid 1px;
}



/* header
--------------------------------------------------------- */
header	{
	width:	100%;
	height:	auto;
	margin:	30px auto 10px auto;
	padding:	0 0 20px 0;
}

header h1	{
	margin:	0px auto 20px auto;
}

header h1 img	{
	width:	70%;
	height:	auto;
}


/* aside
--------------------------------------------------------- */
aside	{
	clear:	both;
	margin:	0 auto;
	width:	100%;
}

/********** navigator area **********/
aside .nvg_area_img	{
	overflow:	hidden;
	text-align:	center;
}

aside .nvg_area img	{
	width:	50%;
	height:	auto;
}


aside .nvg_area h1	{
	text-align:	center;
}


/********** banner area **********/
.bnr_area	{
	width:	100%;
	margin:	0 0 30px 0;
}

.bnr_area li	{
	width:	100%;
	height:	auto;
	margin:	0 0 10px 0;
	text-align:	center;
}

.bnr_area img	{
	width:	70%;
	height:	auto;
}

/********** button area **********/
.btn_area	{
	width:	100%;
	margin:	0 0 30px 0;
	font-size:	2.0rem;
}

.btn_area li	 a{
	float:	left;
	width:	49%;
	margin:	0 1% 10px 0;
	padding:	5px 5px 5px 10px;
	text-align:	center;
}

.btn_area li	 a:nth-child(even){
	float:	left;
	width:	49%;
	margin:	0 0 10px 0;
}

.btn_area li	 i{
	margin:	0 2px 0 0;
	font-size:	1.4rem;
}


/* j-wave common
--------------------------------------------------------- */
#commonFooter	{
	height:	auto !important;
	position:	relative !important;
}

#commonFooterInner {
	width:	100% !important;
	background:	none #282828;
}

}



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

	.pc{
	display:	none;
	}

	.pc_tablet{
	display:	none;
	}

	.tablet_phone	{
	display:	block;
	}

	.tablet	{
	display:	none;
	}

	.phone	{
	display:	block;
	}

a:hover img{
	opacity:	1.0;
	-moz-opacity:	1.0;
	filter: alpha(opacity=100);
}


body{
	background-size: 2000% 2000%;
	}



/* common
--------------------------------------------------------- */
main		{
	clear:	both;
	margin:	30px auto 30px auto;
	padding:	0 0 20px 0;
	border-bottom:	none;
}



/* header
--------------------------------------------------------- */
header	{
	margin:	30px auto 0 auto;
	padding:	0 0 10px 0;
}

header h2	{
	padding:	0.4rem 0.2rem;
	font-size:	1.6rem;
}

header h3	{
	width:	95%;
	font-size:	1.2rem;
	text-align:	left;
}



/* main
--------------------------------------------------------- */

/********** program **********/
section.prg_contents h1	{
	font-size:	1.4rem;
	margin:	0 0 20px 0;
}

section .main_img img	{
	margin:	0 0 10px 0;
}

.tag_cat	{
	width:	100%;
	font-size:	1.4rem;
	text-align:center;
	letter-spacing:	0.1rem;
	margin:	0 0 10px 0;
	padding:	5px;
}

.prg_date	{
	margin:	0 0 0.3rem 0;
	font-size:	2.0rem;
}



/* aside
--------------------------------------------------------- */

/********** navigator area **********/

aside .nvg_area img	{
	width:	100%;
	height:	auto;
}

aside .nvg_area h1	{
	text-align:	left;
}


/********** banner area **********/

.bnr_area img	{
	width:	100%;
	height:	auto;
}


/********** button area **********/
.btn_area	{
	width:	100%;
	margin:	0 0 20px 0;
	font-size:	2.0rem;
}

.btn_area li	 a{
	margin:	0 1% 5px 0;
	padding:	5px 5px 5px 2px;
}



/* footer
--------------------------------------------------------- */
footer	{
	overflow:	hidden;
	width:	100%;
	margin:	20px 0 0 0 ;
	padding:	0 0 50px 0;
}

footer ul	{
	overflow:	hidden;
	margin:	0;
	width:	auto;
	margin:	0 0  0 10px;
}

#footer_home	{
	float:	left;
	height:	30px;
	margin:	0 20px 0 0;
}

#footer_home img	{
	width:	auto;
	height:	30px;
}

#footer_j-wave	{
	float:	left;
	height:	30px;
}

#footer_j-wave img	{
	width:	auto;
	height:	30px;
}

#footer_copyright	{
	overflow:	hidden;
	width:	100%;
	text-align:	center;
	font-size:	10px;
	font-family: 'Abel', sans-serif;
}


}