@charset "utf-8";

/*============目次===========
Extra small 768px未満: スマホ
============================*/


/*========================
: #home
========================*/
#home {
	clear: both;
}

#home h1 {
	display: none;
}

/*========================
: #mainBanner
========================*/
#mainBanner {transform: translate3d(0,0,0);}


#mainBanner_wrap{
	height: auto;
	overflow: hidden;
	border-top: #aeb2c8 2px solid;
	border-bottom: #aeb2c8 2px solid;
	margin-top: 22px;
	margin-bottom: 32px;
}

#mainBanner_wrap span,
#mainBanner_wrap a {
	display: block;
	width: 100%;
}

#mainBanner  {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	display: block;
	max-width: 1200px;
/*
	-webkit-animation: imageAnimation 1.7s ease-in-out forwards;
	animation: imageAnimation 1.7s ease-in-out forwards;
*/
}

#mainBanner img.imgload {
	width: 100%;
	height: auto;
}


#mainBanner .lg,
#mainBanner .sm {
	display: none;
}

#mainBanner img.arrow {
	position: absolute;
	bottom: 5%;
	right: 3%;
/*
	opacity: 0;
	animation: fadeIn 0.5s ease 1.5s forwards;
*/
	width: 18px;
	height: auto;
}


@-webkit-keyframes imageAnimation {
	0% {
		-webkit-transform: scale(1.3);
	}
	100% {
		-webkit-transform: scale(1);
	}
}
@keyframes imageAnimation {
	0% {
		transform: scale(1.3);
	}
	100% {
		transform: scale(1);
	}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*========================
3: #mainContents
========================*/
#home #mainContents a img {
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	transition: .3s;
}

#home #mainContents a:hover img {
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}


/*========================
3-2: #mainContents #news 
========================*/
#home #mainContents #news_wrap * {
	box-sizing: border-box;
	line-height: 100%;
}

#home #mainContents #news_wrap {
	clear: both;
	width: 100%;
	margin: 10px auto;
}

#home #mainContents #news {
	width: 100%;
	display: block;
	color: #333;
	/*height: 62px;*/

	/*background: #00f;	/*★ */
}

#home #mainContents #news a {
	color: #333;
}

#home #mainContents #news hr {
    border-width: 1px 0 0 0 !important;
	height:1px;
	margin: 4px 0 5px;
	color:#999;
	border-style:solid;
}


#home #mainContents #news .c1 {
	display: block;
	width: 100%;
	height: 30px;
	padding: 5px;
}

#home #mainContents #news .c1 *{
	/*height: 31px;*/
}

#home #mainContents #news .c2 {
	width: 100%;
	height:60px;
	padding: 7px 10px;
	overflow: hidden;
	
	/*background: #ff0;*/
}


#home #mainContents #news h2 {
	display: inline-block;
	float: left;
	width: 135px;
	font-size: 20px;
	line-height: 100%;
}

#home #mainContents #news .player img:hover {
	filter:alpha(opacity=70);
	opacity:0.70;
	-moz-opacity:0.70;
}

#home #mainContents #news .player span {
	display: inline-block;
	float: left;
	cursor: pointer;
	margin-left: 7px;
}


#home #mainContents #news .player span.play {
	display: none;
}



#home #mainContents #news .list p {
	/*display: none;*/
	font-size: 15px;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom:10px;

	/*background: #f00;*/
}

#home #mainContents #news .list p:first-child {
	/*display: block;*/
}


#home #mainContents #news .list p span.icon {
	display: inline-block;
	overflow: hidden;
}

#home #mainContents #news .list p span.link {
	display: inline-block;
	overflow: hidden;
}

#home #mainContents #news .list p dfn {
	display: inline-block;
	height: 18px;
	vertical-align: middle;
	padding-top:2px;
}


#home #mainContents #news .list p dfn.d1 {
	width: 85px;
	font-size: 14px !important;
}
#home #mainContents #news .list p dfn.d2 {
	width: 130px;
}

#home #mainContents #news .list p dfn.d3 {
	white-space: nowrap;
	overflow: hidden;
	
	/*background: #0ff;*/
}


#home #mainContents #news .list span.link:hover {
	border-bottom: solid #666 1px;
	/*text-decoration: underline !important;*/
}


/*========================
3-1: #mainContents #topics 
========================*/
#home #mainContents #topics_wrap {
	width: 100%;
	margin: 10px auto 0;
	background: linear-gradient(#202020, #eaeaea 15%);
	overflow: auto;
}


#home #mainContents #topics h2 {
	color: #fff;
	font-size: 15px;
	padding: 10px 0;
	text-align: center;
}

#home #mainContents #topics h2 a {
	color: #fff !important;
}


#home #mainContents #topics div{
	margin: 10px auto 20px;
	width: 78%;
	max-width: 312px;
	text-align: center;
}

#home #mainContents #topics a {
	display: block;
	overflow: visible;
	font-size: 15px;
	color: #333;
}

#home #mainContents #topics a:hover {
	text-decoration: underline;
}

	
#home #mainContents #topics span {
	display: block;
	width: 98%;
	padding-top: 5px;
}
	
#home #mainContents #topics div img{
	width: 90%;
	height: auto;
	border: solid 1px #ccc;
}


#home #mainContents #topics dfn.es_br:before {
	content: "\A" ;
	white-space: pre ;
}

	

/*========================
3-3: #mainContents #pickup 
========================*/
#home #mainContents #pickup_wrap {
	clear: both;
	width: 100%;
	margin: 10px auto 0;
	overflow: auto;
}

#home #mainContents #pickup{
	width: 100%;
}
	
#home #mainContents #pickup div{
	margin: 20px auto;
	width: 90%;
	max-width: 326px;
	text-align: center;
}


#home #mainContents #pickup a {
	display: block;
	overflow: visible;
	font-size: 15px;
	color: #333;
}


#home #mainContents #pickup a:hover {
	text-decoration: underline;
}

	
#home #mainContents #pickup span {
	display: block;
	width: 100%;
	padding-top: 5px;
}
	

#home #mainContents #pickup div img {
	width: 100%;
	height: auto;
	border: solid 1px #e4e4e4;
}

/*========================
3: #mainFooter
========================*/
#home #mainFooter {
	width: 100%;
	padding:0 10px;
	background: #d9d9d9;
	overflow: auto;
	box-sizing: border-box;
}

#home #mainFooter #linkmenu {
	width: 98%;
	padding: 10px 25px;
	box-sizing:border-box;
}

#home #mainFooter #linkmenu ul li{
	display: block;
	width: 100%;
	list-style: none;
	margin: 15px 0;
	overflow: auto;
}

#home #mainFooter #linkmenu a{
	font-size: 14px;
	color: #333;
}

#home #mainFooter #linkmenu a:hover{
	color: #5e5e5e;
}

#home #mainFooter #linkmenu a:hover img{
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}


#home #mainFooter #linkmenu a:hover .link_ttl {
	text-decoration: underline;
}

#home #mainFooter #linkmenu ul li img {
	float: left;
	width: 30px;
	height: auto;
	margin-top: 3px;
}

#home #mainFooter #linkmenu ul li span.wrap {
	display: inline-block;
	float: left;
	width: 75%;
	margin-left: 15px;
	font-size: 12px;
}

#home #mainFooter #linkmenu .link_ttl {
	font-size: 13px;
}


