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

/*--------------------------------------------------------
　基本設定
--------------------------------------------------------*/

article{
	background: #efefef;
}

section#page_info {
	min-height: auto;
	margin-bottom: 0;
}

section div.section_inner div.block ul li a div.box {
    text-align: left;
}

section div.section_inner div.block ul li a div.box span {
    display: inline-block;
	margin-right: 0.5em;
}

.pagination .box.active {
    background-color: #c8102e!important;
}

ul#items-list li.no_hash a div.box span {
	display: none;
}

/*--------------------------------------------------------
　PC
--------------------------------------------------------*/

@media print, screen and (min-width: 768px){
	
	article{
        padding-bottom: 10vw;
    }
	
	section#page_info {
        padding-bottom: 5.2vw;
    }
	
	section h2 {
		font-size: 3.5rem;
		font-size: clamp(1.79rem, 2.33vw, 3.5rem);
		font-weight: 700;
		text-align: center;
		letter-spacing: 0.2em;
		margin-bottom: 2.6vw;
		color: #000;
	}
	
	section div.section_inner {
		width: 76.6%;
		max-width: 1150px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	section div.section_inner div.block {
		width: 73%;
		background: #FFF;
		padding: 6vw 0;
		position: relative;
		z-index: 5;
	}
	
	section div.section_inner div.block::before {
		content: "";
		width: 100vw;
		height: 100%;
		background: #FFF;
		padding: 6vw 0;
		position: absolute;
		top: 0;
		left: calc(-100vw + 100%);
		z-index: 1;
	}
	
	section div.section_inner div.block ul{
		width: 90%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: relative;
		z-index: 5;
	}
	
	section div.section_inner div.block ul li{
		width: 47%;
	}
	
	section div.section_inner div.block ul li:nth-child(n + 3){
		margin-top: 4vw;
	}
	
	section div.section_inner div.block ul li a{
		display: block;
	}
	
	section div.section_inner div.block ul li a div.photo{
		line-height: 0;
		margin-bottom: 1.3vw;
		overflow: hidden;
	}
	
	section div.section_inner div.block ul li a div.photo span{
		display: block;
		position: relative;
		transition-duration: 0.5s;
		transition-property: all .5s ease;
	}
	
	section div.section_inner div.block ul li a div.photo span div.play{
		width: 20%;
		line-height: 0;
		position: absolute;
		top: 40%;
		left: 40%;
		
	}
	
	section div.section_inner div.block ul li a:hover div.photo span{
		scale: 1.2;
	}
	
	section div.section_inner div.block ul li a h4{
		font-size: 1.8rem;
		font-size: clamp(0.92rem, 1.2vw, 1.8rem);
		font-weight: 700;
		line-height: 1.6;
		letter-spacing: 0.025em;
		color: #c8102e;
		min-height: 3.25em;
	}
	
	section div.section_inner div.block ul li a div.box{
		margin-top: 1vw;
		border-top: 1px dotted #727171;
		padding-top: 1vw;
		font-size: 1.2rem;
		font-size: clamp(0.61rem, 0.8vw, 1.2rem);
		font-weight: 500;
		line-height: 1.6;
		color: #000;
	}
	
	section div.section_inner div.block div.pagination {
		position: absolute;
		bottom: -50px;
		right: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: center;
	}
	
	section div.section_inner div.block div.pagination a.left,
	section div.section_inner div.block div.pagination a.right{
		width: 10px;
		height: 18px;
		display: inline-block;
	}
	
	section div.section_inner div.block div.pagination a.left{
		background: url("../images/research/arrow_left_pc.svg") no-repeat;
		background-size: contain;
		margin-right: 20px;
	}
	
	section div.section_inner div.block div.pagination a.right{
		background: url("../images/research/arrow_right_pc.svg") no-repeat;
		background-size: contain;
		margin-left: 20px;
	}
	
	section div.section_inner div.block div.pagination span.box{
		width: 10px;
		height: 10px;
		background: #FFF;
		display: inline-block;
		border-radius: 100%;
		margin: 0 10px;
		cursor: pointer;
	}
	
	section div.section_inner div.block div.pagination span.box a{
		display: block;
		height: 100%;
	}

	section div.section_inner aside {
		width: 23%;
	}
	
	section div.section_inner aside h3{
		font-size: 2.9rem;
		font-size: clamp(1.48rem, 1.93vw, 2.9rem);
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.025em;
		margin-bottom: 3.3vw;
		position: relative;
	}
	
	section div.section_inner aside h3::after {
		content: "";
		width: 4vw;
		max-width: 60px;
		height: 4vw;
		max-height: 60px;
		background: url("../images/research/icon.svg") no-repeat;
		background-size: contain;
		display: inline-block;
		position: absolute;
		top: -50%;
		right: 0;
	}
	
	section div.section_inner aside h4{
		font-size: 2.6rem;
		font-size: clamp(1.33rem, 1.73vw, 2.6rem);
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.025em;
		color: #c8102e;
		margin-bottom: 1.6vw;
		margin-top: 2.5vw;
	}
	
	section div.section_inner aside ul{
		font-size: 1.7rem;
		font-size: clamp(0.87rem, 1.13vw, 1.7rem);
		font-weight: 500;
		line-height: 1;
	}
	
	section div.section_inner aside ul li + li{
		margin-top: 1.3vw;
	}
	
	section div.section_inner aside ul li a{
		color: #000;
	}
	
	section div.section_inner aside ul li a:hover{
		text-decoration: underline;
	}
	
}




/*--------------------------------------------------------
　SP
--------------------------------------------------------*/

@media screen and (max-width: 767px){
	
	article{
        padding-bottom: 10vw;
    }
	
	div#f_nav_block {
		margin-top: 0;
	}
	
	section#page_info {
        padding-bottom: 5vw;
    }
	
	section div.section_inner {
		width: 90%;
		margin: 0 auto;
	}
	
	section h2 {
		font-size: 1.52rem;
		font-size: clamp(1.52rem, 4.8vw, 3.6rem);
		font-weight: 700;
		color: #000;
		letter-spacing: 0.2em;
		margin-bottom: 6vw;
		text-align: center;
	}
	
	section div.section_inner div.block {
		width: 100%;
		position: relative;
		z-index: 5;
		margin-bottom: 30vw;
	}
	
	section div.section_inner div.block ul{
		width: 100%;
	}
	
	section div.section_inner div.block ul li{
		width: 100%;
	}
	
	section div.section_inner div.block ul li + li{
		margin-top: 8vw;
	}
	
	section div.section_inner div.block ul li a{
		display: block;
	}
	
	section div.section_inner div.block ul li a div.photo{
		line-height: 0;
		margin-bottom: 1.3vw;
		overflow: hidden;
	}
	
	section div.section_inner div.block ul li a div.photo span{
		display: block;
		position: relative;
	}
	
	section div.section_inner div.block ul li a div.photo span div.play{
		width: 20%;
		line-height: 0;
		position: absolute;
		top: 40%;
		left: 40%;
		
	}
	
	section div.section_inner div.block ul li a h4{
		font-size: 1.01rem;
		font-size: clamp(1.01rem, 3.2vw, 2.4rem);
		font-weight: 700;
		line-height: 1.6;
		letter-spacing: 0.025em;
		color: #c8102e;
	}
	
	section div.section_inner div.block ul li a div.box{
		margin-top: 2.6vw;
		border-top: 1px dotted #727171;
		padding-top: 2.6vw;
		font-size: 0.93rem;
		font-size: clamp(0.93rem, 2.93vw, 2.2rem);
		font-weight: 500;
		line-height: 1.6;
		color: #000;
	}
	
	section div.section_inner div.block div.pagination {
		position: absolute;
		bottom: -15vw;
		right: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: center;
	}
	
	section div.section_inner div.block div.pagination a.left,
	section div.section_inner div.block div.pagination a.right{
		width: 6.6vw;
		height: 6.6vw;
		display: inline-block;
	}
	
	section div.section_inner div.block div.pagination a.left{
		background: url("../images/research/arrow_left_sp.svg") no-repeat;
		background-size: contain;
		margin-right: 4vw;
	}
	
	section div.section_inner div.block div.pagination a.right{
		background: url("../images/research/arrow_right_sp.svg") no-repeat;
		background-size: contain;
		margin-left: 4vw;
	}
	
	section div.section_inner div.block div.pagination span.box{
		width: 10px;
		height: 10px;
		background: #FFF;
		display: inline-block;
		border-radius: 100%;
		margin: 0 6px;
		cursor: pointer;
	}
	
	section div.section_inner div.block div.pagination span.box a{
		display: block;
		height: 100%;
	}

	
	section div.section_inner aside {
		background: #FFF;
		border-radius: 20px;
		margin-top: 6vw;
		padding: 7vw 5%;
	}
	
	section div.section_inner aside h3{
		font-size: 1.48rem;
		font-size: clamp(1.48rem, 4.66vw, 3.5rem);
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.025em;
		text-align: center;
		margin-bottom: 5vw;
	}
	
	section div.section_inner aside h4{
		font-size: 1.35rem;
		font-size: clamp(1.35rem, 4.26vw, 3.2rem);
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.025em;
		color: #c8102e;
		border-top: 1px solid #ccc;
		padding-top: 6vw;
		margin-bottom: 3vw;
	}
	
	section div.section_inner aside ul{
		font-size: 1.18rem;
		font-size: clamp(1.18rem, 3.73vw, 2.8rem);
		font-weight: 500;
		line-height: 1;
		text-align: left;
		margin-bottom: 1em;
	}
	
	section div.section_inner aside ul li {
		display: inline-block;
	}
	
	section div.section_inner aside ul li{
		margin-right: 1.5em;
		margin-bottom: 1em;
	}
	
	section div.section_inner aside ul li a{
		color: #000;
	}
	
}