@charset "UTF-8";
/* CSS Document */



/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	72  %		19px 	136 %
11px 	79  %		20px 	143 %
12px 	86 %		21px 	150 %
13px 	93 %		22px 	158 %
14px 	100 %		23px 	165 %
15px 	108 %		24px 	172 %
16px 	115 %		25px 	179 %
17px 	122 %		26px 	186 %
18px 	129 %
---------------------------------------------------------------------*/



				.info_list figure .pht::before{
					z-index:1;
					}
				.info_list figure.cat12 .pht::before,
				.popular_list figure.cat12 .pht::before
				{
					background-image:url(../../img/top_pc/cat1.jpg);
					}
				.info_list figure.cat11 .pht::before,
				.popular_list figure.cat11 .pht::before
				{
					background-image:url(../../img/top_pc/cat2.jpg);
					}
				.info_list figure.cat10 .pht::before,
				.popular_list figure.cat10 .pht::before
				{
					background-image:url(../../img/top_pc/cat3.jpg);
					}
				.info_list figure.cat4 .pht::before,
				.popular_list figure.cat4 .pht::before
				{
					background-image:url(../../img/top_pc/cat4.jpg);
					}
				.info_list figure.cat9 .pht::before,
				.popular_list figure.cat9 .pht::before
				{
					background-image:url(../../img/top_pc/cat5.jpg);
					}
				.info_list figure.cat8 .pht::before,
				.popular_list figure.cat8 .pht::before
				{
					background-image:url(../../img/top_pc/cat6.jpg);
					}


/* モーダルCSS */
.modalArea {
  display: none;
  position: fixed;
  z-index: 10; /*サイトによってここの数値は調整 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.modalBg {
}

.modalWrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  -webkit-transform:translate(-50%,-50%);
  width: 70%;
  max-width: 280px;
  padding: 40px;
  background-color: #fff;
  border:solid #555 1px;
}

.closeModal {
  position: absolute;
  top: 0;
  right: 10px;
  font-size:25px;
  cursor: pointer;
}


/* 以下ボタンスタイル */
button {
}

.openModal {
  cursor: pointer;
  display:block;
  width:35px;
  height:35px;
  border:none;
  background:none;
}					

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* pc */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
@media all and (min-width: 801px){

#gdpr_area {
	position: fixed;
	z-index: 999999;
	bottom: 50px;
	right:20px;
	width: 70%;
	box-sizing: border-box;
	background-color: rgba(0, 0, 0, 0.85);
	color: #fff;
	line-height: 1.5;
}
	
#gdpr_area a {
	border-bottom:1px solid #fff;
}
#gdpr_area .gdpr_area_inner {
  position: relative;
  margin: 0 auto;
  padding: 15px;
}
#gdpr_area .gdpr_area_inner a {
  color: #fff;
}
#gdpr_area .gdpr_area_inner span.break {
  display: block;
}
#gdpr_area .gdpr_link_sp {
  display: none;
}




	
.content_wrap{
	width:1040px;
	margin:auto;
	}
	
	.ad_icon,
	.pr_icon{
		position:relative;
		}
		.ad_icon::after,
		.pr_icon::after{
			position:absolute;
			right:0;
			top:0.2em;
			content:"PR";
			display:inline-block;
			padding:2px 25px 1px;
			color:#fff;
			font-weight:bold;
			background-color:#D81718;
			font-size:0.8em;
			line-height:1;
			}
	.ad_icon2,
	.pr_icon2{
		position:relative;
		}
		.ad_icon2::after,
		.pr_icon2::after{
			position:absolute;
			right:0;
			top:0.2em;
			content:"PR";
			display:inline-block;
			padding:2px 25px 1px;
			color:#fff;
			font-weight:bold;
			background-color:#D81718;
			font-size:0.8em;
			line-height:1;
			}

		.btn_wrap{
			text-align:center;
			margin-top:25px;
			}
		.btn{
			text-align: center;
			display: inline-block;
			color: #fff !important;
			font-weight: bold;
			font-size: 15px;
			padding: 10px 40px 8px;
			width: 250px;
			border-radius: 5px;
			box-sizing: border-box;
			box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.6);
			-webkit-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.6);
			border: none;
			transition: 500ms;
			background-color: #D71717;
			position: relative;
			margin:10px;
			text-decoration:none !important;
			}
		.btn::after{
			content: "";
			background-image: url(../../img/common/icon_arrow_right.png);
			width: 16px;
			height: 16px;
			position: absolute;
			right: 10px;
			top: 50%;
			margin-top: -8px;
			}
		.btn.more {
			cursor: pointer;
			}
		.btn.more::after{
			transform:rotate(90deg);
			}
	
	
	/* ========================= 左 ========================= */
	.left_wrap{
		width:700px;
		float:left;
		}
		.icon_list{
			}
			.icon_list p{
				text-align:center;
				border-top:1px solid #ccc;
				padding-top:15px;
				padding-bottom:15px;
				font-size:22px;
				font-weight:bold;
				}
			.icon_list ul{
				text-align:center;
				margin-bottom:40px;
				border-bottom:1px solid #ccc;
				padding-bottom:20px;
				}
			.icon_list li{
				display: inline-block;
				width: 50px;
				margin:0 30px;
				}
			.icon_list li img{
				width:100%;
				}
		.icon_list.bottom{
			margin-top:40px;
			}
		.info_list{
			}
			.info_list figure{
				}
				
			.info_list figure img{
				width:100%;
				}
				.info_list figure .pht{
					position:relative;
					}
				.info_list figure .pht::before{
					width:30px;
					height:30px;
					position:absolute;
					left:0;
					top:0;
					content:""; 
					}
			.info_list figure figcaption{
				margin-top:10px;
				}
			.info_list figure figcaption .title{
				margin-top:5px;
				margin-bottom:10px;
				font-weight:bold;
				}
			.info_list figure figcaption h3{
				text-decoration: underline;
				color: #00A0E9;
				font-weight: bold;
				}
				
				
			/*  最初 */
			.info_list figure:first-child{
				width:100%;
				}
			.info_list figure:first-child figcaption .title{
				font-size:25px;
				}
			
			/*  最初　以外 */
			.info_list figure:not(:first-child){
				width:48%;
				margin-top:30px;
				}
			.info_list figure:nth-of-type(even){
				float:left;
				clear:both;
				}
			.info_list figure:nth-of-type(odd){
				float:right;
				}
			.info_list figure:not(:first-child) figcaption .title{
				font-size:16px;
				}
			.info_list figure:not(:first-child) figcaption .text{
				display:none;
				}
				.info_list figure:not(:first-child) .pht{
					height:224px;
					overflow:hidden;
					}
	/* ========================= 左 end  =========================*/
				
				
	
	/* ========================= 右 =========================*/
	.right_wrap{
		width:300px;
		float:right;
		}
		.right_wrap .pr{
			width:100%;
			}
			.right_wrap .pr p{
				text-align:right;
				margin-top:-1.5em;
				}
			.right_wrap .pr img{
				width:100%;
				}
		.right_wrap	.popular{
			margin-top:40px;
			}
			.right_wrap	.popular h4{
				border-top: 1px solid #D1D1D1;
				border-bottom: 1px solid #D1D1D1;
				padding:10px 0 8px;
				font-size:17px;
				margin-bottom:20px;
				}
		.popular_list{
			}
			.popular_list figure:not(:first-child){
				margin-top:20px;
				}
			.popular_list figure img{
				width:100%;
				}
				.popular_list figure .pht{
					float:left;
					width:50%;
					position:relative;
					}
				.popular_list figure .pht::before{
					width:20px;
					height:20px;
					position:absolute;
					left:0;
					top:0;
					content:"";
					background-size:cover;
					z-index:1;
					}
			.popular_list figure figcaption{
				float:right;
				width:45%;
				margin-top:-0.3em;
				}
			.popular_list figure figcaption .data{
				font-size:13px;
				}
			.popular_list figure figcaption .title{
				margin-top:5px;
				font-weight:bold;
				}
			.popular_list figure figcaption h5{
				text-decoration: underline;
				color: #00A0E9;
				font-weight: bold;
				font-size:14px;
				}
				
				





	/* ========================= 右 end  =========================*/
	

}



/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* sp */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
@media all and (max-width: 800px){


#gdpr_area {
  width: 100%;
  box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.85);
  color: #fff;
  line-height: 1.5;
}
.is-fixed {
	position: fixed;
	z-index: 9999;
	top: 0 !important;
	left:0;
	bottom:auto !important;
	}
#gdpr_area a {
	border-bottom:1px solid #fff;
}
#gdpr_area .gdpr_area_inner {
  position: relative;
  margin: 0 auto;
  padding: 13px 15px 13px;
  word-break:break-all;
}
#gdpr_area .gdpr_area_inner a {
  color: #fff;
}
#gdpr_area .gdpr_area_inner span.break {
  display: block;
}
#gdpr_area .gdpr_link_sp {
  display: none;
}





.mokuji{
	margin-bottom:30px;
	margin-top:20px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding-top:20px;
	padding-bottom:20px;
	}
	.mokuji p {
		display:inline-block;
		border:1px solid #ccc;
		line-height:1;
		padding:8px 20px;
		font-weight:bold;
		margin-bottom:10px;
		color:#888;
		border-radius:3px;
		}
	.mokuji ol{
		padding:0;
		margin:0;
		counter-reset:mokuji;
		position:relative;
		padding-left:23px;
		}
	.mokuji ol li{
		margin-top:8px;
		}
		.mokuji ol li a{
			text-decoration: underline;
			color: #00A0E9;
			font-weight:bold;
			}
	
		.btn_wrap{
			text-align:center;
			margin-top:25px;
			}
		.btn{
			text-align: center;
			display: inline-block;
			color: #fff !important;
			font-weight: bold;
			font-size: 15px;
			padding: 10px 40px 8px;
			width: 250px;
			border-radius: 5px;
			box-sizing: border-box;
			box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.6);
			-webkit-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.6);
			border: none;
			transition: 500ms;
			background-color: #D71717;
			position: relative;
			margin:10px;
			text-decoration:none !important;
			}
		.btn::after{
			content: "";
			background-image: url(../../img/common/icon_arrow_right.png);
			width: 16px;
			height: 16px;
			position: absolute;
			right: 10px;
			top: 50%;
			margin-top: -8px;
			}
		.btn.more {
			cursor: pointer;
			}
		.btn.more::after{
			transform:rotate(90deg);
			}

	
.content_wrap{
	padding:0 10px;
	}
	
	.ad_icon,
	.pr_icon{
		position:relative;
		}
		.ad_icon::after,
		.pr_icon::after{
			position:absolute;
			right:0;
			top:0.2em;
			content:"PR";
			display:inline-block;
			padding:2px 15px 1px;
			color:#fff;
			background-color:#D81718;
			font-size:0.8em;
			line-height:1;
			}
	.ad_icon2,
	.pr_icon2{
		position:relative;
		}
		.ad_icon2::after,
		.pr_icon2::after{
			position:absolute;
			right:0;
			top:0.2em;
			content:"PR";
			display:inline-block;
			padding:2px 25px 1px;
			color:#fff;
			font-weight:bold;
			background-color:#D81718;
			font-size:0.8em;
			line-height:1;
			}
	
	
	/* ========================= 左 ========================= */
	.left_wrap{
		}
		.icon_list{
			margin-top:20px;
			}
			.icon_list p{
				text-align:center;
				padding-bottom:8px;
				font-size:16px;
				font-weight:bold;
				}
			.icon_list ul{
				font-size: 0;
				letter-spacing: 0;
				margin-left: -5.6%;
				text-align: center;
				}
			.icon_list li{
				display: inline-block;
				width: 11%;
				margin-left: 5.6%;
				}
			.icon_list li img{
				width:100%;
				}
		.icon_list.bottom{
			margin-top:50px;
			padding:15px 0;
			border-top:1px solid #ccc;
			border-bottom:1px solid #ccc;
			}
			
		.info_list{
			margin-top:20px;
			}
			.info_list figure{
				}
				
			.info_list figure img{
				width:100%;
				}
				.info_list figure .pht{
					position:relative;
					}
				.info_list figure .pht::before{
					width:30px;
					height:30px;
					position:absolute;
					left:0;
					top:0;
					content:""; 
					}
			.info_list figure figcaption{
				margin-top:10px;
				}
			.info_list figure figcaption .title{
				margin-top:5px;
				margin-bottom:10px;
				font-weight:bold;
				}
			.info_list figure figcaption h3{
				text-decoration: underline;
				color: #00A0E9;
				font-weight: bold;
				}
				
				
			/*  最初 */
			.info_list figure:first-child figcaption .title{
				font-size:16px;
				}
			.info_list figure:first-child figcaption .data{
				font-size:13px;
				}
			
			/*  最初　以外 */
/*
			.info_list figure:not(:first-child){
				width:48%;
				margin-top:30px;
				}
			.info_list figure:nth-of-type(even){
				float:left;
				clear:both;
				}
			.info_list figure:nth-of-type(odd){
				float:right;
				}
			.info_list figure:not(:first-child) figcaption .title{
				font-size:12px;
				}
			.info_list figure:not(:first-child) figcaption .data{
				font-size:12px;
				}
			.info_list figure:not(:first-child) figcaption .text{
				display:none;
				}
*/
.info_list figure:not(:first-child){
				}
		.infomation.normal{
			}
			.info_list figure:not(:first-child){
				margin-top:20px;
				}
			.info_list figure:not(:first-child) img{
				width:100%;
				}
				.info_list figure:not(:first-child) .pht{
					float:left;
					width:33%;
					position:relative;
					}
				.info_list figure:not(:first-child) .pht::before{
					width:20px;
					height:20px;
					position:absolute;
					left:0;
					top:0;
					content:"";
					background-size:cover;
					}
			.info_list figure:not(:first-child) figcaption{
				float:right;
				width:62%;
				margin-top:-0.3em;
				}
			.info_list figure:not(:first-child) figcaption .data{
				font-size:12px;
				}
			.info_list figure:not(:first-child) figcaption .title{
				font-size:12px;
				}
			.info_list figure:not(:first-child) figcaption .text{
				display:none;
				}



	/* ========================= 左 end  =========================*/
				
				
	
	/* ========================= 右 =========================*/
	.right_wrap{
		margin-top:40px;
		}
		.right_wrap .pr{
			max-width:300px;
			margin:0 auto;
			}
			.right_wrap .pr p{
				text-align:right;
				margin-top:-1.5em;
				}
			.right_wrap .pr img{
				width:100%;
				}
		.right_wrap	.popular{
			margin-top:30px;
			}
			.right_wrap	.popular h4{
				border-top: 1px solid #D1D1D1;
				border-bottom: 1px solid #D1D1D1;
				padding:10px 0 8px;
				font-size:17px;
				margin-bottom:20px;
				}
		.popular_list{
			}
			.popular_list figure:not(:first-child){
				margin-top:20px;
				}
			.popular_list figure img{
				width:100%;
				}
				.popular_list figure .pht{
					float: left;
					width: 33%;
					position: relative;
					}
				.popular_list figure .pht::before{
					width:20px;
					height:20px;
					position:absolute;
					left:0;
					top:0;
					content:"";
					background-size:cover;
					}
			.popular_list figure figcaption{
				float:right;
				width:62%;
				margin-top:-0.3em;
				}
			.popular_list figure figcaption .data{
				font-size:13px;
				}
			.popular_list figure figcaption .title{
				margin-top:5px;
				font-weight:bold;
				}
			.popular_list figure figcaption h5{
				text-decoration: underline;
				color: #00A0E9;
				font-weight: bold;
				font-size:14px;
				}
	/* ========================= 右 end  =========================*/
	
	
		

}