/*
 home.css

*/

/* ==================================================== */
/* S T Y L E */
/* ==================================================== */
body,html{
/* overflow: hidden; */
}
h2{
text-align: center;
font-size: 69px;
font-weight: normal;
}

/* ==================================================== */
/* L A Y O U T */
/* ==================================================== */


/* ==================================================== */
/* A R T I C L E */
/* ==================================================== */
/* Contents Wraps
---------------------------------------- */
#article .billboard{
width: 100%;
margin: 0;
padding: 0;
}

.numazulink {
width: 100%;
margin: 0;
padding: 0;
}

#article .news-wrap{
width: 100%;
min-height: 240px;
margin: 0;
padding: 0;
color: #FFF;
background: #23ac38;
}
#article .map-posts-wrap{
width: 100%;
margin: 0;
padding: 0;
background: url(../img/bg_map.png) repeat left top;
}
#article .howto-wrap{
width: 100%;
margin: 0;
padding: 0;
}
#article .report-wrap{
width: 100%;
margin: 0;
padding: 0;
background: #555;
}
#article .member-wrap{
width: 100%;
margin: 0;
padding: 0;
}
.tegaki-fb{
width: 100%;
min-height: 370px;
padding: 0;
text-align: center;
}


/*----------------------------------------
 Billboard
---------------------------------------- */
#article .billboard .inner{
position: relative;
width: 100%;
/* height: 400px; */
margin: 0 auto;
overflow: hidden;
}
#article .billboard .inner ul.gallery{
position: relative;
/* width: 1000px; */
/* height: 400px; */
margin: 0 auto;
}
#article .billboard .inner ul.gallery li{
display: none;
/*
position: absolute;
top: 0; left: 0;
*/
}
#article .billboard .inner ul.gallery li:first-child{
display: block;
}
#article .billboard .inner ul.gallery li img{
width: 100%;
}

#article .billboard .inner ul.arrow-nav{
position: absolute;
top: 171px;
width: 100%;
display: none;
}
#article .billboard .inner ul.arrow-nav .prev{
position: absolute;
left: 0;
}
#article .billboard .inner ul.arrow-nav .next{
position: absolute;
right: 0;
}


/*----------------------------------------
 News
---------------------------------------- */
#article .news-wrap h2{
}
#article .news-wrap a{
color: #FFF;
}
#article .news-wrap dl{
width: 760px;
margin: 0 auto;
padding-bottom: 30px;
}
#article .news-wrap dl dt{
clear: both;
float: left;
width: 120px;
margin: 0 10px 5px 0;
text-align: right;
}
#article .news-wrap dl dd{
float: left;
/*
clear: both;

width: 130px;
margin: 0 0 10px;;
*/
}

/*----------------------------------------
 How To
---------------------------------------- */
#article .howto-wrap h2{
line-height: 1;
margin: 0 0 25px;
padding: 13px 0 22px;
color: #23ac38;
background: #e7f1e9;
}
#article .howto-wrap .step{
position: relative;
margin: 0 0 30px 0;
/* padding: 0 0 0 30px; */
height: 266px;
overflow: hidden;
}
#article .howto-wrap .step ul{
position: absolute;
top: 0; left:0;
width: 2160px;
height: 266px;
padding: 0 30px;
}
#article .howto-wrap .step ul li{
float: left;
width: 200px;
margin: 0 30px 0 0;
padding: 0 50px 0 0;
background: url(../img/img_right-arrow.png) no-repeat right center;
}
#article .howto-wrap .step ul li:last-child{
margin: 0;
padding: 0;
background: none;
}
#article .howto-wrap .step .arrow-nav{
position: absolute;
top: 108px;
}
#article .howto-wrap .step .arrow-nav.prev{
left: 0;
}
#article .howto-wrap .step .arrow-nav.next{
right: 0;
}


/*----------------------------------------
 Report
---------------------------------------- */
#article .report-wrap h2{
line-height: 1;
margin: 0;
padding: 13px 0 22px;
color: #FFF;	
background: #313131;
}
#article .report-wrap .postlist{
position: relative;
width: 100%;
height: 315px;
margin: 0 auto;
background: #1b1b1b;
overflow: hidden;
}
#article .report-wrap .postlist .postlist-unit{
width: 2500px;
position: absolute;
top: 0; left: 0;
}
#article .report-wrap .postlist .arrow-nav{
position: absolute;
top: 108px;
}
#article .report-wrap .postlist .arrow-nav.prev{
left: 0;
}
#article .report-wrap .postlist .arrow-nav.next{
right: 0;
}

#article .report-wrap .postlist .item a:hover,
#article .report-wrap .postlist .item a:hover .num{
background: #23ac38;
}
#article .report-wrap .postlist .num{
width: 42px;
line-height: 1.1;
background: #767676;
letter-spacing: -0.05em;
font-size: 16px;
}
#article .report-wrap .postlist .num .year{
display: block;
padding: 0;
font-size: 12px;
}



/*----------------------------------------
 Member
---------------------------------------- */
#article .member-wrap h2{
line-height: 1;
margin: 0 0 25px;
padding: 25px 0 0 0;
color: #23ac38;
background: #FFF;
}

#article .member-wrap {
margin: 0 0 30px 0;
}
#article .member-wrap ul{
width: 100%;
}
#article .member-wrap ul li{
float: left;
width: 12.5%;
margin: 0;
}
#article .member-wrap ul li a img{
transition:			all .8s ease-out;
-moz-transition: 	all .8s ease-out;
-webkit-transition: all .8s ease-out;
-moz-transition: 	all .8s ease-out;
-o-transition: 		all .8s ease-out;

-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;  /* For IE 6 - 9 */
}
#article .member-wrap ul li a:hover img{
-webkit-filter: grayscale(0);
-moz-filter: grayscale(0);
-ms-filter: grayscale(0);
-o-filter: grayscale(0);
filter: grayscale(0);
filter: none;  /* For IE 6 - 9 */
}