@charset "utf-8";

.firstViewPc01 {
	width: 960px;
	margin-bottom: 10px;
}
.firstViewSp01 { display: none; }
.mainimgArea01 {
	padding: 5px 0;
	margin-bottom: 10px;
	background: #fff;
	border-radius: 5px;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}
.mainimgArea01 .mainVisual {
	width: 950px;
	height: 230px;
	border: none;
}
.mainMenu01 {
	overflow: hidden;
	*zoom: 1;
}
	.mainMenu01 li {
		float: left;
		margin-right: 10px;
	}
	.mainMenu01 li.sns {
		width: 210px;
		height: 60px;
		margin-right: 0;
		padding-top: 12px;
		border-radius: 5px;
		background: #fff;
	}
		.mainMenu01 li.sns .snsList01 {
			overflow: hidden;
			*zoom: 1;
			padding-left: 17px;
		}
			.mainMenu01 li.sns .snsList01 li {
				float: left;
				margin-right: 13px;
			}
				.mainMenu01 li.sns .snsList01 li img.sns {
					padding-top: 2px;
				}
.topMainBnr01 {
	width: 100%;
	padding: 5px;
	text-align: center;
}
.osusumeCol {
	padding: 5px;
	background: #fff;
	border-radius: 0 0 5px 5px;
}
#carouse {
/*	overflow: hidden;*/
	border-radius: 0;
	width: 340px;
	/*height: 146px;*/
	position:relative;
}
	#carouse .column img {
		width: 100%;
	}
	.owl-item {
		width: 0;
		float: left;
	}

/*ページネーション(丸のやーつ*/
#carouse .owl-controls {
/*	position:absolute;*/
/*	bottom:0px;*/
margin-top:6px;
}
#carouse .owl-controls .owl-page span {
	margin: 2px 4px;
	background-color: #2F74FF;
}


.itemList01.productIndex {
	padding: 5px 0 0;
}
	.itemList01.productIndex li {
		width: 178px;
		padding: 0 5px 15px;
	}
		.itemList01.productIndex .image a {
			border-color: #c0c0c0;
		}
	.itemList01.productIndex li:nth-child(even) {
		width: 168px;
		padding: 0 0 15px;
	}

.productEventList01 {
	padding: 15px 15px 0;
}
	.productEventList01 dt a img {
		border: 2px solid #c0c0c0;
	}
	.productEventList01 dt a:hover img {
		border-color: #f93;
	}
	.productEventList01 dd {
		margin-bottom: 7px;
	}

.twitterBox01 {
}
.twitterBox {
	width: 100%;
	height: 350px;
	border: none;
}
	.twitterBox01 .account {
		overflow: hidden;
		*zoom: 1;
	}
		.twitterBox01 .account dt {
			float: left;
			margin-right: 8px;
		}
	.twitterBox01 .twitterBoxIn01 {
		position: relative;
		padding: 13px 0;
	}
		.twitterBoxIn01 .nav {
			overflow: hidden;
			*zoom: 1;
			margin-bottom: 8px;
		}
		.twitterBoxIn01 .nav .prev { float: left;width: 12px;height: auto; }
		.twitterBoxIn01 .nav .next { float: right;width: 12px;height: auto; }
			.twitterBoxIn01 .nav .prev img,
			.twitterBoxIn01 .nav .next img {
				width: 100%;
				height: auto;
			}
		.twitterBoxIn01 .content .img {
			text-align: center;
		}
.topBnrArea01 {
	text-align: center;
	margin: 15px 0;
}
.topBnrList01 {
	padding: 5px 0;
	text-align: center;
}
	.topBnrList01 li {
		margin-bottom: 8px;
	}
	.topBnrList01 li:last-child {
		margin-bottom: 0px;
	}
	.topBnrList01 a img {
		border: 2px solid #d1d1d1;
	}
	.topBnrList01 a:hover img {
		border-color: #f93;
	}
.topFooterBnrList01 {
	overflow: hidden;
	*zoom: 1;
	padding: 10px 0;
	margin-right: -5px;
}
	.topFooterBnrList01 li {
		float: left;
		margin-right: 5px;
		margin-bottom: 5px;
		display: inline-block;
		height: 42px;
	}
	.topFooterBnrList01 li:last-child {
		margin-right: 0;
		width: 150px;
		font-size: 80%;
	}
	.topFooterBnrList01 li:last-child img {
		float: left;
		margin-right: 3px;
}
.topFooterBnrList01 li img {
		width: auto;
		height: 100%;
}
.specialBnr {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	font-size:14px;
	text-align:center;
	margin-bottom:10px;
	word-break: break-all;
    word-wrap: break-word;
	background-color:#fff;
	padding:5px;
}

/**下部のバナーボックス**/
.asideBannerBox {
	text-align:center;
}
.asideBannerBox img {
	width: 230px;
	height: auto;
	margin-left: 2px;
	margin-right: 2px;
	border: 1px solid #e0e0e0;
}

/*twitter用ボックス*/
#tweetBox {
	padding:0px;
}

/*cozmoArea*/

.cozmoArea02 {
	position: relative;
	width: 870px;
	margin: 30px auto 40px;
}
.cozmoArea02:before {
	position: absolute;
	left: -43px;
	top: -16px;
	width: 156px;
	height: 117px;
	background: url(../img/img_top_cozmo01.png) no-repeat left top/100%;
	content: "";
}
.cozmoArea02 a {
	display: block;
	border-radius: 30px 10px 10px 10px;
	box-shadow:0px 0px 0px 5px #e03335 inset,0px 0px 0px 6px #faeb01 inset,0px 0px 0px 12px #49ae3e inset;
	background: #fff url(../img/bg_top_cozmo01.png) no-repeat 34px 5px/434px;
	-webkit-transition:	all 0.3s;
	transition: all 0.3s;
}
.cozmoArea02 a:hover {
	background-color: #f8d400;
}
.cozmoArea02 .inner01 {
	padding: 25px 28px 29px 62px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}	
.cozmoArea02 .title01 {
	width: 347px;
	height: 195px;
	margin-top: 38px;
	background: url(../img/txt_top_cozmo01_no.png) no-repeat left top/100%;
	-webkit-transition:	all 0.3s;
	transition: all 0.3s;
}
.cozmoArea02 a:hover .title01 {
	background-image: url(../img/txt_top_cozmo01_on.png);
}
.cozmoArea02 .title01 img {
	display: none;
}
.cozmoArea02 .imgArea01 {
	position: relative;
	width: 387px;
	min-height: 259px;
}
.cozmoArea02 .imgList01,
.cozmoArea02 .imgList02 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
.cozmoArea02 .imgList01,
.cozmoArea02 .imgList02 {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}
.cozmoArea02 .imgList01 > li,
.cozmoArea02 .imgList02 > li {
	width: 192px;
}
.cozmoArea02 .imgList01 > li:nth-child(n+3),
.cozmoArea02 .imgList02 > li:nth-child(n+3) {
	margin-top: 3px;
}
.cozmoArea02 .imgList01 > li img,
.cozmoArea02 .imgList02 > li img {
	width: 100%;
}



@media screen and (max-width: 639px) {
.mainimgArea01 {
	position: relative;
	width: 100%;
	padding: 62% 0 0 0;
	border-radius: 0px;
}

.mainimgArea01 .mainVisual {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}




.boxBtnArea01 {padding-top: 0;}
.firstViewPc01 {
	display: none;
}
.firstViewSp01 {
	display: block;
}
.firstViewSp01 .mainimgArea01 {
	background: #efeff0;
	width: 100%;
	height: auto;
	padding: 0;
	margin-bottom: 0;
	overflow: hidden;
}
.firstViewSp01 .mainimgArea01 img {
	float: left;
}
	.firstViewSp01 .mainimgArea01 .mainimg01 img {
		width: 100%;
		height: auto;
	}
#carouse {
	width: 100%;
	height: auto;
}
	#carouse .column {
		width: 100%;
		height: auto;
	}
.movieBtn01 a,
.mainMenu01 li a {
	display: block;
	background: -webkit-linear-gradient(#0050d9, #0023c9);
	background: linear-gradient(#0050d9, #0023c9);
}

.mainMenu01 li.movie a {
	background-color: #FFFFFF;
	background-image:none;
	border: 1px solid #acacac;
	padding-top:20px;
}


.movieBtn01 a {
	height: 45px;
	padding-top: 9px;
	text-align: center;
}
.mainMenu01 {
	padding: 0 10px;
	margin: 10px 0;
}
.mainMenu01 li {
	width: 31.33%;
	height: 60px;
	margin-right: 9px;
}
.mainMenu01 li:last-child {
	margin-right: 0;
}
.boxBtnArea01 .btnNewsList01 {
	margin-top: 0;
}
	.mainMenu01 li a {
		height: 60px;
		text-align: center;
		padding-top: 23px;
		border-radius: 3px;
	}
.topMainBnr01 img {
	width: 100%;
	height: auto;
}
.itemList01.productIndex {
	padding: 10px;
}
	.itemList01.productIndex li,
	.itemList01.productIndex li:nth-child(even) {
		width: 100%;
		overflow: hidden;
		*zoom: 1;
		margin: 0 0 20px;
		padding: 0;
	}
	.itemList01.productIndex li:last-child { margin-bottom: 10px;}
	.itemList01.productIndex li .image {
		width: 35.71%;
		margin-right: 0;
	}
		.itemList01.productIndex li .image a {
			width: 100%;
		}
		.itemList01.productIndex li .image a img {
			width: 100%;
			height: auto;
		}
	.itemList01.productIndex .titArea,
	.itemList01.productIndex .txt {
		float: right;
	}
	.itemList01.productIndex .titArea {
		width: 60.71%;
		font-size: 12px;
	}
		.itemList01.productIndex .titArea .tit {
			font-size: 12px;
		}
	.itemList01.productIndex .txt {
		clear: none;
		width: 60%;
	}
.productEventList01 {
	width: 100%;
	padding: 10px 10px 0;
}
	.productEventList01 dt {
		margin-bottom: 10px;
	}
		.productEventList01 dt a img {
			width: 100%;
			height: auto;
			border: none;
		}
	.productEventList01 dd {
		margin-bottom: 15px;
	}
.twitterBox01 {
}
	.twitterBox01 .account {
		display: table;
	}
		.twitterBox01 .account dt,
		.twitterBox01 .account dd {
			float: none;
			display: table-cell;
			margin-right: 0;
		}
		.twitterBox01 .account dt {
			width: 30px;
		}
			.twitterBox01 .account dt img {
				width: 100%;
				height: auto;
			}
		.twitterBox01 .account dd {
			padding-left: 10px;
		}
.twitterBoxIn01 .nav .prev { float: left;width: 22px;height: auto; }
.twitterBoxIn01 .nav .next { float: right;width: 22px;height: auto; }
	.twitterBoxIn01 .nav .prev img,
	.twitterBoxIn01 .nav .next img {
		width: 100%;
		height: auto;
	}
.topBnrArea01 {
	margin: 30px 0;
}
.topBnrList01 {
	padding: 5px;
}
.topBnrList01 a img {
	width: 100%;
	height: auto;
}
.topFooterBnrList01 {}
	.topFooterBnrList01 li,
	.topFooterBnrList01 li:last-child {
		width: 48%;
		float: left;
		margin: 0 0 10px 0;
	}
	.topFooterBnrList01 li:nth-child(even) {
		float: right;
	}

.asideBannerBox {
	margin-top:10px;
}
.asideBannerBox img {
		width: 49.5%;
		float: left;
		margin: 0 0 10px 0;
}
.asideBannerBox a:nth-child(even) img {
		float: right;
	}


}


@media screen and (max-width: 639px) {
.mainimg01,
.movieBtn01 {
	position: relative;
}
.mainimg01 .inner,
.movieBtn01 .inner {
	position: absolute;
	top: 0;
	left: 0;
}
.movieBtn01 .inner {
	display: block;
	width: 100%;
	height: 45px;
}
.specialBnr {
	margin-bottom:5px;
	font-size:9px;
}

/*cozmoArea*/

.cozmoArea02 {
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
}
.cozmoArea02:before {
	left: -19px;
	top: -12px;
	width: 102px;
	height: 76px;
}
.cozmoArea02 a {
	box-shadow:0px 0px 0px 3px #e03335 inset,0px 0px 0px 4px #faeb01 inset,0px 0px 0px 7px #49ae3e inset;
	background-size: 90%;
	background-position: center -10px; 
}
.cozmoArea02 a:hover {
	background-color: #fff;
}
.cozmoArea02 .inner01 {
	padding: 25px 0 29px 0;
}	
.cozmoArea02 .title01 {
	width: 78.02%;
	margin: 0 auto;
	height: auto;
	background-image: none;
}
.cozmoArea02 a:hover .title01 {
	background-image: none;
}
.cozmoArea02 .title01 img {
	display: block;
	width: 100%;
}
.cozmoArea02 .imgArea01 {
	width: 85.49%;
	margin: 20px auto 0;
	min-height: auto;
	padding-bottom: 57%;
}
.cozmoArea02 .imgList01 > li,
.cozmoArea02 .imgList02 > li {
	width: 49.42%;
}

}