@charset "utf-8";

/* --------------------------------------------------------------------------------
	
	home
-------------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------------
	トップページのみのヘッダー
-------------------------------------------------------------------------------- */
/********** ↓↓スライダー（PC）↓↓ **********/
#header .device-pc .slider{
	position:relative;
	background-size:100% 100%;
	overflow:hidden;
}
#header .device-pc .slider .flex-control-nav{
	width:auto;
	height:auto;
	bottom:29px;
	left:32px;
	text-align:left;
	line-height:1;
	font-size:10px;
}
#header .device-pc .slider .flex-control-nav li{
	margin:0 4px 0 0;
}
#header .device-pc .slider .flex-control-nav a{
	margin:0;
	width:11px;
	height:11px;
	background:rgba(255,255,255,0.6)
}
#header .device-pc .slider .flex-control-nav a.flex-active {
	background:#800000;
	cursor:default;
}


/* --------------------------------------------------------------------------------
	index
-------------------------------------------------------------------------------- */
/********** バナー **********/


#main .top-bnr{
	margin:0 0 14px 0;
}
#main .top-bnr .bnr1{
	padding:0 0 20px;
}
#main .top-bnr .bnr2{
	padding:0 0 20px;
}
#main .top-bnr ul li{
	float:left;
	width:370px;
	padding:0 20px 20px 0;
}
#main .top-bnr ul li:nth-child(2n){
	padding:0 0 20px 0;
}
		
#main .kakusu{
	display:none;	
}

#main .bnrs1 .bnr{
	float:left;
}
#main .bnrs1 .bnr a,
#main .bnrs1 .bnr img{
	display:block;
}
#main .bnrs1 .bnr:nth-child(1){
	width:502px;
	padding:0 14px 15px 0;
}
#main .bnrs1 .bnr:nth-child(2){
	width:244px;
	padding:0 0 15px;
}
#main .bnrs1 .bnr:nth-child(3){
	width:244px;
	padding:0 14px 15px 0;
}
#main .bnrs1 .bnr:nth-child(4){
	width:244px;
	padding:0 14px 15px 0;
}
#main .bnrs1 .bnr:nth-child(5){
	width:244px;
	padding:0 0 15px 0;
}
#main .bnrs1 .bnr:nth-child(6){
	width:502px;
	padding:0 0 15px 0;
}

/********** ↓↓ランキング（PC）↓↓ **********/
#main .ranking .device-pc .ranking-wrapper{
	margin:0 0 45px;
	border-right:solid 1px #be922f;
	border-bottom:solid 1px #be922f;
	border-left:solid 1px #be922f;
}
#main .ranking .device-pc .ranking-box{
	padding:10px 0;
	border-bottom:dotted 1px #606060;
}
#main .ranking .device-pc .ranking-box ul{
	display:table;
	width:100%;
}
#main .ranking .device-pc .ranking-box ul li{
	display:table-cell;
	vertical-align:top;
}
#main .ranking .device-pc .ranking-box:nth-child(1) ul li:last-child{
	border:none;
}
#main .ranking .device-pc .ranking-box:nth-child(2){
	border:none;
}
#main .ranking .device-pc .ranking-box:nth-child(2) ul li{
	width:33%;
}

/********** 1位 **********/
#main .ranking .device-pc .ranking-box:nth-child(1) ul li:nth-child(1){
	width:355px;
	padding:9px 13px;
	border-right:dotted 1px #737373;
}

#main .ranking .device-pc .ranking-box ul li a{
	display:block;
}
#main .ranking .device-pc .ranking-box ul li .item-name{
	display:block;
	font-weight:bold;
}
#main .ranking .device-pc .ranking-box ul li .item-name1{
	font-size:1.2em;
}
#main .ranking .device-pc .ranking-box ul li .item-name2{
	font-size:1.1em;
}
#main .ranking .device-pc .ranking-box ul li .thumb{
	float:left;
	display:block;
}
#main .ranking .device-pc .ranking-box ul li .thumb{
	width:162px;
	position:relative;
	border:dotted 1px #737373;
}

#main .ranking .device-pc .ranking-box ul li .thumb img{
	width:100%;
}
#main .ranking .device-pc .ranking-box ul li .txt{
	float:right;
	display:block;
	width:178px;
}
#main .ranking .device-pc .ranking-box ul li .txt .item-name{
	padding:0 0 8px;
	line-height:1.2;
}
#main .ranking .device-pc .ranking-box ul li .txt .item-name span{
	display:inline-block;
}
#main .ranking .device-pc .ranking-box ul li .item-desc{
	font-size:90%;
}



#main .ranking .device-pc .ranking-box:nth-child(1) ul li:nth-child(1) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank1.png) no-repeat;
	background-size:100%;
	width:63px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}


/********** 2位 **********/
#main .ranking .device-pc .ranking-box:nth-child(1) ul li:nth-child(2){
	width:355px;
	padding:9px 13px;
}
#main .ranking .device-pc .ranking-box:nth-child(1) ul li:nth-child(2) .thumb{
	float:left;
	width:162px;
}

#main .ranking .device-pc .ranking-box:nth-child(1) ul li:nth-child(2) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank2.png) no-repeat;
	background-size:100%;
	width:63px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}

#main .ranking .device-pc .ranking-box:nth-child(1) ul li:nth-child(2) .txt{
	float:right;
	width:179px;
}



/********** 3位 **********/
#main .ranking .device-pc .ranking-box:nth-child(2) ul li:nth-child(1){
	width:230px;
	padding:9px 13px;
	border-right:dotted 1px #737373;
}



#main .ranking .device-pc .ranking-box:nth-child(2) ul li a{
	display:block;
}
#main .ranking .device-pc .ranking-box:nth-child(2) ul li .thumb{
	float:left;
	display:block;
}
#main .ranking .device-pc .ranking-box:nth-child(2) ul li .thumb{
	width:102px;
}

#main .ranking .device-pc .ranking-box:nth-child(2) ul li:nth-child(1) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank3.png) no-repeat;
	background-size:100%;
	width:50px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}


#main .ranking .device-pc .ranking-box:nth-child(2) ul li .txt{
	float:right;
	display:block;
	width:112px;
}
#main .ranking .device-pc .ranking-box:nth-child(2) ul li .item-desc{
	font-size:80%;
}

/********** 4位 **********/
#main .ranking .device-pc .ranking-box:nth-child(2) ul li:nth-child(2){
	width:230px;
	padding:9px 13px;
	border-right:dotted 1px #737373;
}

#main .ranking .device-pc .ranking-box:nth-child(2) ul li:nth-child(2) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank4.png) no-repeat;
	background-size:100%;
	width:50px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}



/********** 5位 **********/
#main .ranking .device-pc .ranking-box:nth-child(2) ul li:nth-child(3){
	width:230px;
	padding:9px 13px;
}

#main .ranking .device-pc .ranking-box:nth-child(2) ul li:nth-child(3) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank5.png) no-repeat;
	background-size:100%;
	width:50px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}


/********** ↑↑ランキング（PC）↑↑ **********/




/********** ↓↓3位までのランキング（PC）↓↓ **********/
#main .ranking-season .ranking-wrapper{
	margin:0 0 45px;
	border-right:solid 1px #71BA2A;
	border-bottom:solid 1px #71BA2A;
	border-left:solid 1px #71BA2A;
}
#main .ranking-season .ranking-box{
	padding:10px 0;
	border-bottom:dotted 1px #71BA2A;
}


#main .ranking2 .ranking-box ul{
	display:table;
	width:100%;
}
#main .ranking2 .ranking-box ul li{
	display:table-cell;
	vertical-align:top;
	width: 230px;
    padding: 9px 13px;
    border-right: dotted 1px #737373;
}
#main .ranking2 .ranking-box ul li .thumb{
	position:relative;
}
#main .ranking2 .ranking-box ul li:nth-child(1) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank1.png) no-repeat;
	background-size:100%;
	width:63px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}
#main .ranking2 .ranking-box ul li:nth-child(2) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank2.png) no-repeat;
	background-size:100%;
	width:63px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}
#main .ranking2 .ranking-box ul li:nth-child(3) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank3.png) no-repeat;
	background-size:100%;
	width:50px;
	height:60px;
	position:absolute;
	top:0;
	left:0;
}
#main .ranking2 .ranking-box ul li:last-child{
	border:none;
}
#main .ranking2 .ranking-box ul li .thumb{
	display:block;
	border:1px solid #D1D1D1;
	width:162px;
    margin: 0 auto 5px;
}
#main .ranking2 .ranking-box ul li .thumb img{
	width:100%;
}
#main .ranking2 .ranking-box ul li .txt{
	display:block;
	width: 230px;
    text-align: center;
	margin:0 auto;
	font-size: 1.2em;
	font-weight:bold;
}











/********** 動画用2列バナー **********/
#main .bnr-select-douga{
}
#main .bnr-select-douga ul li{
	float:left;
	width:369px;
	padding:0 0 20px;
}
#main .bnr-select-douga ul li:nth-child(2){
	float:right;
	padding:0;
}




/********** バナー **********/
#main .bnr-select{
}
#main .bnr-select ul li{
	float:left;
	width:372px;
	padding:0 0 45px;
}
#main .bnr-select ul li:nth-child(2){
	float:right;
}

/********** 特徴 **********/
#main .tokucho h2{
	padding:0 0 33px;
}
#main .tokucho .tokucho-wrapper{
	padding:0 14px;
}
#main .tokucho .tokucho-box{
	padding:0 0 3.3%;
}
#main .tokucho h3{
	padding:0 225px 15px 0;
}
#main .tokucho h3.device-pc{
	padding:0 0 15px 0;
}
#main .tokucho .tokucho-box .txt{
	padding:12px 16px;
	line-height:2;
	background:#fcf7ef;
}

/********** お客様の声 **********/
#main .device-pc .voice{
	padding:0 0 50px;
}
#main .device-pc .voice .heading{
	margin:0 0 35px;
	padding:0 0 15px;
	border-bottom:solid 1px #000;
}
#main .device-pc .voice .heading .heading-box{
	position:relative;
}
#main .device-pc .voice h2{
	float:left;
	width:264px;
}
#main .device-pc .voice .voice-box1{
	width:482px;
	right:0;
	bottom:0;
	font-size:90%;
	position:absolute;
}
#main .device-pc .voice ul li{
	float:left;
	width:278px;
}
#main .device-pc .voice ul li:nth-child(2n){
	float:right;
}
#main .device-pc .voice ul li:nth-child(2n+1){
	clear:both;
}
#main .device-pc .voice ul li .thumb{
	display:block;
	padding:0 0 15px;
}
#main .device-pc .voice ul li .txt{
	display:block;
	padding:0 0 12px;
	text-align:center;
	font-weight:bold;
	line-height:1.8;
	font-size:120%;
}
#main .device-pc .voice ul li .btn-interview{
	display:block;
	padding:0 19px;
}
#main .device-pc .voice ul li .btn-interview a{
	display:block;
}

#main .device-pc .voice-box2{
	/*float:left;*/
	/*width:570px;*/
	width: 760px;
}
#main .device-pc .bnr-voice-list{
	float:right;
}

#main .device-pc .voice-box2 ul{
	display: flex;
	justify-content: space-between;
}
#main .device-pc .voice-box2 ul li{
	width: 240px;
}
#main .device-pc .bnr-voice-list{
	/*float:right;*/
	margin-top: 20px;
}




/********** だしに関することならフタバへお気軽にご相談ください **********/
#main .device-pc .bnr-contact{
	padding:0 0 45px;
}
#main .device-pc .dashi-futaba h2{
	padding:0 0 30px;
}
#main .device-pc .dashi-futaba{
	line-height:2;
	font-size:90%;
}
#main .device-pc .dashi-futaba .dashi-futaba-box{
	padding:0 0 20px;
}
#main .device-pc .dashi-futaba .txt{
	float:left;
	width:410px;
}
#main .device-pc .dashi-futaba p{
	padding:0 0 25px;
	letter-spacing:0.05em;
}
#main .device-pc .dashi-futaba p .mark1{
	font-weight:bold;
	color:#43170d;
}
#main .device-pc .dashi-futaba .img{
	float:right;
}
#main .device-pc .dashi-futaba .txt2{
	float:right;
}
#main .device-pc .dashi-futaba .img2{
	float:left;
}


/* --------------------------------------------------------------------------------
	以下幅の狭いデバイス
-------------------------------------------------------------------------------- */
@media screen and (min-width: 0px) and (max-width: 799px){

	/* --------------------------------------------------------------------------------
		トップページのみのヘッダー
	-------------------------------------------------------------------------------- */
	/********** スライダー **********/
	#header .slider{
		position:relative;
		margin:0 0 3.5%;
		padding:4.5% 0;
		background:url(../images/index/sp/bg-slider.png) no-repeat 0 0;
		background-size:100% 100%;
		overflow:hidden;
	}
	#header .slider .flex-control-nav{
		bottom:1.5em;
		left:1em;
		text-align:left;
	}
	#header .slider .flex-control-nav li{
		margin:0 0.15em 0 0;
	}
	#header .slider .flex-control-nav a{
		margin:0;
		width:0.5em;
		height:0.5em;
		background:rgba(255,255,255,0.6);
	}
	#header .slider .flex-control-nav a.flex-active {
		background:#800000;
		cursor:default;
	}
	
	/* --------------------------------------------------------------------------------
		メイン
	-------------------------------------------------------------------------------- */
	
	#main .top-bnr .bnr1{
	padding:0 0 3%;
	}
	#main .top-bnr .bnr2{
		padding:0 0 3%;
	}
	#main .top-bnr ul li{
		float:left;
		width:49%;
		padding:0 2% 2% 0;
	}
	#main .top-bnr ul li:nth-child(2n){
		padding:0 0 2% 0;
	}
	
	
	/********** バナー **********/
	#main .bnrs1{
		padding:0 0 2.5%;
	}
	#main .bnrs1 .bnr{
		float:left;
	}
	#main .bnrs1 .bnr:nth-child(1){
		float:none;
		width:auto;
		padding:0 0 3%;
	}
	#main .bnrs1 .bnr:nth-child(2){
		clear:both;
		width:48.5%;
		padding:0 0 3%;
	}
	#main .bnrs1 .bnr:nth-child(3){
		float:right;
		width:48.5%;
		padding:0 0 3%;
	}
	#main .bnrs1 .bnr:nth-child(4){
		clear:both;
		width:48.5%;
		padding:0 0 3%;
	}
	#main .bnrs1 .bnr:nth-child(5){
		float:right;
		width:48.5%;
		padding:0 0 3%;
	}
	#main .bnrs1 .bnr:nth-child(6){
		clear:both;
		float:none;
		width:auto;
		padding:0 0 3%;
	}
	#main .bnrs1 .bnr a{
		display:block;
	}
	#main .bnrs1 .bnr img{
		display:block;
		width:100%;
	}
	
	
	/********** ランキング **********/
	#main .ranking{
		padding:0 0 5.6%;
	}
	#main .ranking .ranking-wrapper{
		border-right:solid 0.15em #be922f;
		border-bottom:solid 0.15em #be922f;
		border-left:solid 0.15em #be922f;
	}
	#main .ranking ul{
		padding:0 3%;
	}
	#main .ranking ul li{
		padding:3% 0;
		border-bottom:dashed 0.1em #606060;
	}
	#main .ranking .ranking-box:nth-child(2) ul li:last-child{
		border-bottom:none;
	}
	#main .ranking ul li a{
		display:block;
	}
	#main .ranking ul li a .thumb{
		float:left;
		width:30%;		
	}
	#main .ranking ul li a .txt{
		float:right;
		width:65%;
	}
	#main .ranking ul li a .txt .item-name{
		display:block;
		font-size:140%;
		font-weight:bold;
	}
	#main .ranking ul li a .txt .item-desc{
		display:block;
	}
	
	
	#main .ranking .ranking-box ul li .thumb{
		position:relative;
		border:dotted 1px #737373;
	}
	#main .ranking .ranking-box:nth-child(1) ul li:nth-child(1) a .thumb:before{
		content:"";
		background:url(../images/index/icon-rank1.png) no-repeat;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}
	
	#main .ranking .ranking-box:nth-child(1) ul li:nth-child(2) a .thumb:before{
	content:"";
	background:url(../images/index/icon-rank2.png) no-repeat;
	background-size:100%;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}
	
	#main .ranking .ranking-box:nth-child(2) ul li:nth-child(1) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank3.png) no-repeat;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}

	#main .ranking .ranking-box:nth-child(2) ul li:nth-child(2) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank4.png) no-repeat;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}

	#main .ranking .ranking-box:nth-child(2) ul li:nth-child(3) .thumb:before{
	content:"";
	background:url(../images/index/icon-rank5.png) no-repeat;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}
	
	
	
	
	
	
	/********** ↓↓3位までのランキング（PC）↓↓ **********/
	#main .ranking-season .ranking-wrapper{
		margin:0 0 45px;
		border-right:solid 0.15em #71BA2A;
		border-bottom:solid 0.15em #71BA2A;
		border-left:solid 0.15em #71BA2A;
	}
	#main .ranking-season .ranking-box{
		padding:10px 0;
		border-bottom:dotted 1px #71BA2A;
	}
	
	#main .ranking2{
		padding:0 0 5.6%;
	}
	#main .ranking2 .ranking-box ul{
		display:table;
		width:100%;
	}
	#main .ranking2 .ranking-box ul li{
		display:table-cell;
		vertical-align:top;
		width: 33%;
		padding: 2%;
		border-right: dotted 1px #737373;
	}
	#main .ranking2 .ranking-box ul li .thumb{
		position:relative;
	}
	#main .ranking2 .ranking-box ul li:nth-child(1) .thumb:before{
		content:"";
		background:url(../images/index/icon-rank1.png) no-repeat;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}
	#main .ranking2 .ranking-box ul li:nth-child(2) .thumb:before{
		content:"";
		background:url(../images/index/icon-rank2.png) no-repeat;
		background-size:100%;
		width:10vw;
		height:10vw;
		position:absolute;
		top:0;
		left:0;
	}
	#main .ranking2 .ranking-box ul li:nth-child(3) .thumb:before{
		content:"";
		background:url(../images/index/icon-rank3.png) no-repeat;
		background-size:100%;
		width:8vw;
		height:8vw;
		position:absolute;
		top:0;
		left:0;
	}
	#main .ranking2 .ranking-box ul li:last-child{
		border:none;
	}
	#main .ranking2 .ranking-box ul li .thumb{
		display:block;
		border:1px solid #D1D1D1;
		width:100%;
		margin: 0 auto 5px;
	}
	#main .ranking2 .ranking-box ul li .thumb img{
		width:100%;
	}
	#main .ranking2 .ranking-box ul li .txt{
		display:block;
		width: 100%;
		text-align: center;
		margin:0 auto;
		font-size: 1.2em;
		font-weight:bold;
	}


	/********** バナー **********/
	#main .bnr-select ul{
		padding:0 0 2.5%;
	}
	#main .bnr-select ul li{
		float:left;
		width:48.5%;
		padding:0 0 3%;
	}
	#main .bnr-select ul li:nth-child(2n){
		float:right;
	}
	#main .bnr-select ul li:nth-child(2n+1){
		clear:both;
	}
	
	#main .bnr-member{
		padding:0 0 6%;
	}
	
	/********** 特徴 *********/
	#main .tokucho h2{
		padding:0 0 3.2%;
	}
	#main .tokucho .tokucho-wrapper{
		padding:0 1.5% 3.4%;
	}
	#main .tokucho .tokucho-box{
		padding:0 0 3.3%;
	}
	#main .tokucho h3{
		padding:0 0 3%;
	}
	#main .tokucho .tokucho-box .txt{
		padding:3%;
		line-height:1.5;
		background:#fcf7ef;
	}
	
	/********** 新着情報 **********/
	#main .recentlist{
		padding:0 0 5.8%;
	}
	#main .recentlist ul{
		height:10em;
		-webkit-overflow-scrolling:touch;
		overflow:auto;
	}
	#main .recentlist ul li{
		float: none;
		width: 100%;
		border-bottom:dashed 1px #606060;
	}
	#main .recentlist ul li a{
		display:block;
		padding:2% 0;
		text-decoration:none;
		font-size:150%;
		color:#000;
	}
	#main .recentlist ul li a:before{
		margin:0 1em 0 0;
		content:'≫';
		color:#c52222;
		font-size:80%;
	}
	
	/********** 声 **********/
	#main .voice{
		padding:0 0 3%;
	}
	#main .voice .voice-box1{
		margin:0 0 4.5%;
		padding:0 0 3%;
		border-bottom:solid 0.15em #000;
	}
	#main .voice h2{
		padding:0 16.7% 5%;
	}
	#main .voice ul li{
		float:left;
		width:48%;
		margin-bottom: 5vw;
	}
	#main .voice ul li:nth-child(2n){
		float:right;
		margin-bottom: 5vw;
	}
	#main .voice ul li:nth-child(2n+1){
		clear:both;
	}
	#main .voice ul li .thumb{
		display:block;
		padding:0 0 3%;
	}
	#main .voice ul li .txt{
		display:block;
		text-align:center;
		font-weight:bold;
		font-size:120%;
	}
	#main .voice ul li .btn-interview{
		display:block;
		padding:2% 2.4%;
	}
	#main .voice ul li .btn-interview a{
		display:block;
	}
	#main .bnr-voice{
		padding:0 0 5.4%;
	}
	#main .h-bnr-mail{
		padding:0 0 3.1%;
	}
	
	
	#footer .bnrs2 .bnr-member{
		display:none;
	}

}