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

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


main {
	background: rgba(212,236,243,.3);
	padding-bottom: 6.3vw;
}

footer {
	margin-top: 0;
}

.next_prev ul li.none {
	opacity: .5;
}

.next_prev ul li.none span {
	pointer-events: none;
}

div.flex section#content div.post_block div.flexible_text iframe{
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
}


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

@media print, screen and (min-width: 961px){
	
	footer div.f_bottom div.illust::before{
		content: "";
		width: 94.1%;
		height: 41.5%;
		background: url("../images/news/f_text_pc.svg") no-repeat;
		background-size: contain;
		top: 36.3%;
		left: -112%;
		z-index: 3;
	}
	
	main {
        padding-bottom: 6.3vw;
    }
	
	div.flex {
		width: 76.7%;
		max-width: 1090px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		font-size: 1.6rem;
		font-size: clamp(calc((1.6rem * 0.64)), 1.12vw, 1.6rem);
		padding-bottom: 10vw;
		position: relative;
	}
	
	div.flex section{
		width: 58.5%;
		background: #FFF;
		border-radius: 50px;
		padding: 4em;
	}
	
	div.flex div.r_block{
		width: 34.3%;
	}
	
	div.flex div.r_block span.illust {
		display: block;
		width: 98.65%;
		line-height: 0;
		margin: 1.7vw 0 0 -5.3%;
	}
	
	div.flex div.r_block aside{
		background: #FFF;
		border-radius: 50px;
		padding: 4em 7em 4em 5em;
	}
	
	div.flex div.r_block aside h3{
		font-size: 1.4rem;
		font-size: clamp(calc((1.4rem * 0.64)), 0.98vw, 1.4rem);
		font-weight: 400;
		padding-bottom: 1em;
		border-bottom: 1px solid #000;
		margin-bottom: 1.5em;
	}
	
	div.flex div.r_block aside ul{
		font-size: 1.6rem;
		font-size: clamp(calc((1.6rem * 0.64)), 1.12vw, 1.6rem);
		font-weight: 400;
		letter-spacing: 0.08em;
	}
	
	div.flex div.r_block aside ul li + li{
		margin-top: 1em;
	}
	
	div.flex div.r_block aside ul li a{
		color: #000;
	}
	
	/*一覧*/
	div.flex section#list ul li{
		border-bottom: 1px solid #000;
		padding: 0 0 0.75em 1em;
		font-size: 1.6rem;
		font-size: clamp(calc((1.6rem * 0.64)), 1.12vw, 1.6rem);
		font-weight: 400;
		letter-spacing: 0.08em;
	}
	
	div.flex section#list ul li + li{
		margin-top: 1.5em;
	}
	
	div.flex section#list ul li h4{
		font-weight: 400;
	}
	
	div.flex section#list ul li time{
		display: block;
		margin-bottom: 0.25em;
	}
	
	div.flex section#list ul li a{
		color: #000;
		display: block;
		padding-right: 1em;
		position: relative;
	}
	
	div.flex section#list ul li a::after{
		content: "→";
		position: absolute;
		top: calc(50% - 0.55em);
		right: 0;
	}
	
	/*詳細*/
	div.flex section#content{
		padding-bottom: 6em;
		position: relative;
	}
	
	div.flex section#content div.next_prev {
		width: calc(100% - 8em);
		position: absolute;
		bottom: 2em;
		left: 4em;
	}
	
	div.flex section#content div.next_prev ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	div.flex section#content div.next_prev ul li{
		display: inline-block;
		font-size: 1.1rem;
		font-size: clamp(calc((1.1rem * 0.64)), 0.77vw, 1.1rem);
		font-weight: 400;
		letter-spacing: 0.08em;
		color: #727171;
	}
	
	div.flex section#content div.next_prev ul li a{
		color: #727171;
	}
	
	div.flex section#content h1{
		font-size: 1.6rem;
		font-size: clamp(calc((1.6rem * 0.64)), 1.12vw, 1.6rem);
		font-weight: 400;
		letter-spacing: 0.08em;
		padding-bottom: 1em;
		border-bottom: 1px solid #000;
		margin-bottom: 0.5em;
	}
	
	div.flex section#content time{
		font-size: 1.1rem;
		font-size: clamp(calc((1.1rem * 0.64)), 0.77vw, 1.1rem);
		font-weight: 400;
		letter-spacing: 0.08em;
		color: #727171;
		display: block;
		margin-bottom: 0.75em;
	}
	
	div.flex section#content div.post_block > :first-child {
      margin-top: 0!important;
    }
	
	div.flex section#content div.post_block h2{
		font-size: 2.0rem;
		font-size: clamp(calc((2.0rem * 0.64)), 1.4vw, 2.0rem);
		font-weight: 600;
		letter-spacing: 0.08em;
		margin: 2em 0 0.5em;
	}
	
	div.flex section#content div.post_block h3{
		font-size: 1.6rem;
		font-size: clamp(calc((1.6rem * 0.64)), 1.12vw, 1.6rem);
		font-weight: 600;
		letter-spacing: 0.08em;
		margin: 2em 0 0.57em;
	}
	
	div.flex section#content div.post_block h4{
		font-size: 1.4rem;
		font-size: clamp(calc((1.4rem * 0.64)), 0.98vw, 1.4rem);
		font-weight: 700;
		letter-spacing: 0.08em;
		margin: 2em 0 0.71em;
	}
	
	div.flex section#content div.post_block p{
		font-size: 1.6rem;
		font-size: clamp(calc((1.6rem * 0.64)), 1.12vw, 1.6rem);
		font-weight: 400;
		letter-spacing: 0;
		line-height: 1.8;
	}
	
	/*div.flex section#content div.post_block p + p{
		margin-top: 1.25em;
	}*/
	
	div.flex section#content div.post_block a{
		color: #000;
		text-decoration: underline;
	}
	
	div.flex section#content div.post_block div.flexible_text + div.flexible_text{
		margin-top: 1.25em;
	}
	
	div.flex section#content div.post_block figure.photo1 {
		margin: 2vw 0;
	}
	
	div.flex section#content div.post_block figure.photo1.small {
		width: 80%;
		margin: 2vw auto;
	}
	
	div.flex section#content div.post_block figure.photo1 span,
	div.flex section#content div.post_block div.photo2 figure span{
		display: block;
		line-height: 0;
	}
	
	div.flex section#content div.post_block figure.photo1 figcaption,
	div.flex section#content div.post_block div.photo2 figcaption{
		font-size: 1.4rem;
		font-size: clamp(calc((1.4rem * 0.64)), 0.98vw, 1.4rem);
		margin-top: 0.25em;
	}
	
	div.flex section#content div.post_block div.photo2 {
		margin: 2vw 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	div.flex section#content div.post_block div.photo2 figure{
		width: 48%;
	}
	
}


@media screen and (min-width:961px) and (max-width: 1500px){
	div.flex section,
	div.flex div.r_block aside{
		border-radius: 3.52vw;
		border-radius: 3.52cqw;
	}
}
	

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

@media screen and (max-width: 960px){
	
	footer div.f_bottom div.illust::before{
		content: "";
		width: 111%;
		height: 48%;
		background: url("../images/news/f_text_sp.svg") no-repeat;
		background-size: contain;
		top: 31%;
		left: -129%;
		z-index: 3;
	}
	
	main {
        padding-bottom: 13vw;
    }
	
	div.flex {
		width: 88%;
		margin: 0 auto;
		font-size: calc(1.6rem * 0.72);
		font-size: clamp(calc((1.6rem * 0.72)), 3.2vw, calc(1.6rem * 1.92));
	}
	
	div.flex section{
		background: #FFF;
		border-radius: 10vw;
		padding: 3em 1.5em 3.5em;
	}
	
	div.flex div.r_block{
		width: 100%;
		margin-top: 10vw;
	}
	
	div.flex div.r_block span.illust {
		display: block;
		width: 83%;
		line-height: 0;
		margin: 9.2vw 0 0 8.2%;
	}
	
	div.flex div.r_block aside{
		background: #FFF;
		border-radius: 10vw;
		padding: 3em 1.5em 3.5em;
	}
	
	div.flex div.r_block aside h3{
		font-size: calc(1.4rem * 0.72);
		font-size: clamp(calc((1.4rem * 0.72)), 2.8vw, calc(1.4rem * 1.92));
		font-weight: 400;
		padding-bottom: 1em;
		border-bottom: 1px solid #000;
		margin-bottom: 1.5em;
		padding-left: 1.14em;
	}
	
	div.flex div.r_block aside ul{
		font-size: calc(1.6rem * 0.72);
		font-size: clamp(calc((1.6rem * 0.72)), 3.2vw, calc(1.6rem * 1.92));
		font-weight: 400;
		letter-spacing: 0.08em;
	}
	
	div.flex div.r_block aside ul li{
		padding-left: 1em;
	}
	
	div.flex div.r_block aside ul li + li{
		margin-top: 1em;
	}
	
	div.flex div.r_block aside ul li a{
		color: #000;
	}
	
	/*一覧*/
	div.flex section#list ul li{
		border-bottom: 1px solid #000;
		padding: 0 0 0.75em 1em;
		font-size: calc(1.4rem * 0.72);
		font-size: clamp(calc((1.4rem * 0.72)), 2.8vw, calc(1.4rem * 1.92));
		font-weight: 400;
		letter-spacing: 0.08em;
	}
	
	div.flex section#list ul li + li{
		margin-top: 1.5em;
	}
	
	div.flex section#list ul li h4{
		font-weight: 400;
	}
	
	div.flex section#list ul li time{
		display: block;
		margin-bottom: 0.25em;
	}
	
	div.flex section#list ul li a{
		color: #000;
		display: block;
		padding-right: 1em;
		position: relative;
	}
	
	div.flex section#list ul li a::after{
		content: "→";
		position: absolute;
		top: calc(50% - 0.55em);
		right: 0;
	}
	
	/*詳細*/
	div.flex section#content{
		padding-bottom: 7em;
		position: relative;
	}
	
	div.flex section#content div.next_prev {
		width: calc(100% - 3em);
		position: absolute;
		bottom: 3em;
		left: 1.5em;
	}
	
	div.flex section#content div.next_prev ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	div.flex section#content div.next_prev ul li{
		display: inline-block;
		font-size: calc(1.1rem * 0.72);
		font-size: clamp(calc((1.1rem * 0.72)), 2.2vw, calc(1.1rem * 1.92));
		font-weight: 400;
		letter-spacing: 0.08em;
		color: #727171;
	}
	
	div.flex section#content div.next_prev ul li a{
		color: #727171;
	}
	
	div.flex section#content h1{
		font-size: calc(1.6rem * 0.72);
		font-size: clamp(calc((1.6rem * 0.72)), 3.2vw, calc(1.6rem * 1.92));
		font-weight: 400;
		letter-spacing: 0.08em;
		padding-bottom: 1em;
		border-bottom: 1px solid #000;
		margin-bottom: 1em;
	}
	
	div.flex section#content time{
		font-size: calc(1.1rem * 0.72);
		font-size: clamp(calc((1.1rem * 0.72)), 2.2vw, calc(1.1rem * 1.92));
		font-weight: 400;
		letter-spacing: 0.08em;
		color: #727171;
		display: block;
		margin-bottom: 2em;
	}
	
	div.flex section#content div.post_block > :first-child {
      margin-top: 0!important;
    }
	
	div.flex section#content div.post_block h2{
		font-size: calc(2.0rem * 0.72);
		font-size: clamp(calc((2.0rem * 0.72)), 4vw, calc(2.0rem * 1.92));
		font-weight: 600;
		letter-spacing: 0.08em;
		margin: 2em 0 0.5em;
	}
	
	div.flex section#content div.post_block h3{
		font-size: calc(1.6rem * 0.72);
		font-size: clamp(calc((1.6rem * 0.72)), 3.2vw, calc(1.6rem * 1.92));
		font-weight: 600;
		letter-spacing: 0.08em;
		margin: 2em 0 0.57em;
	}
	
	div.flex section#content div.post_block h4{
		font-size: calc(1.4rem * 0.72);
		font-size: clamp(calc((1.4rem * 0.72)), 2.8vw, calc(1.4rem * 1.92));
		font-weight: 700;
		letter-spacing: 0.08em;
		margin: 2em 0 0.71em;
	}
	
	div.flex section#content div.post_block p{
		font-size: calc(1.6rem * 0.72);
		font-size: clamp(calc((1.6rem * 0.72)), 3.2vw, calc(1.6rem * 1.92));
		font-weight: 400;
		letter-spacing: 0;
		line-height: 1.8;
	}
	
	/*div.flex section#content div.post_block p + p{
		margin-top: 1.25em;
	}*/
	
	div.flex section#content div.post_block a{
		color: #000;
		text-decoration: underline;
	}
	
	div.flex section#content div.post_block div.flexible_text + div.flexible_text{
		margin-top: 1.25em;
	}
	
	div.flex section#content div.post_block figure.photo1 {
		margin: 2vw 0;
	}
	
	div.flex section#content div.post_block figure.photo1.small {
		width: 80%;
		margin: 2vw auto;
	}
	
	div.flex section#content div.post_block figure.photo1 span,
	div.flex section#content div.post_block div.photo2 figure span{
		display: block;
		line-height: 0;
	}
	
	div.flex section#content div.post_block figure.photo1 figcaption,
	div.flex section#content div.post_block div.photo2 figcaption{
		font-size: calc(1.4rem * 0.72);
		font-size: clamp(calc((1.4rem * 0.72)), 2.8vw, calc(1.4rem * 1.92));
		margin-top: 0.25em;
	}
	
	div.flex section#content div.post_block div.photo2 {
		margin: 2vw 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	
	div.flex section#content div.post_block div.photo2 figure{
		width: 48%;
	}
}