@charset "utf-8"; 

.heading{
	padding-top: 14em;
}
.heading .ttl{
	text-align: center;
	font-size: 4.8rem;
	font-weight: 900;
	line-height: 1.2;
}
#newsDetail{
	display: flex;
	justify-content: space-between;
	margin: 85px auto 130px;
}
#newsDetail #news{
	width: 65%;
}
#newsDetail #sidebar{
	width: 20%;
}
#news .ttl{
	font-size: 2.4rem;
	font-weight: 900;
	line-height: 1.6;
	margin: 0.7em 0;
}
#news .dateWrap{
	display: flex;
	justify-content: flex-start;
}
#news .dateWrap p{
	font-weight: 900;
	font-size: 1.3rem;
	line-height: 1.0;
}
#news .date{
	margin-right: 1em;
}
#news .cat a{
	line-height: 1.0;
	background: #000;
	color: #fff;
	padding: 0.2em 0.8em;
}
#news .txt h3{
	font-size: 2.2rem;
	border: 2px solid #000;
	padding: 0.5em 0.8em;
}
#news .txt h3,
#news .txt h4,
#news .txt h5,
#news .txt h6{
	line-height: 1.8;
	font-weight: 700;
	margin-bottom: 0.5em;
}
#news .txt * + h3,
#news .txt * + h4,
#news .txt * + h5,
#news .txt * + h6,
#news .txt * + p{
	margin-top: 1.5em;
}
#news .txt h4{
	font-size: 2.0rem;
	border-left: 2px solid #000;
	padding-left: 0.5em;
}
#news .txt h5{
	font-size: 1.8rem;
	border-bottom: 1px solid #000;
}
#news .txt h6{
	font-size: 1.6rem;
}
#news .txt img{
	max-width: 100%;
	height: auto;
}
#news .txt * + img,
#news .txt * + .aligncenter{
	margin-top: 20px;
}
#news .txt strong { font-weight: bold; }
#news .txt em { font-style: italic; }
#news .txt blockquote {
	display: block;
	-webkit-margin-before: 1em;
	-webkit-margin-after: 1em;
	-webkit-margin-start: 1em;
	-webkit-margin-end: 1em;
}
#news .txt .aligncenter {
	display: block;
	margin: 0 auto;
}
#news .txt .alignright { float: right; margin-left: 1.5em; }
#news .txt .alignleft { float: left; margin-right: 1.5em; }

#news .txt img[class*="wp-image-"],
#news .txt img[class*="attachment-"] {
	height: auto;
	max-width: 100%;
}
#news .sns{
	display: flex;
	justify-content: flex-end;
	margin: 2.6em 0 5.3em;
}
#news .sns li{
	margin-left: 10px;
}
#news .btnWrap{
	position: relative;
	width: 70%;
	margin: 0 auto;
}
#news .btnWrap .arrow{
	position: absolute;
	top: 50%;
	font-size: 1.8rem;
	font-weight: 900;
	transform: translateY(-50%);
}
#news .btnWrap .arrow a{
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	line-height: 1.0;
	position: relative;
}
#news .btnWrap .arrow a i{
	font-size: 1.2rem;
}

#news .btnWrap .arrow > span{
	opacity: 0.5;
}

#news .btnWrap .arrow.next{
	right: 0;
}
#news .btnWrap .arrow.next a i,
#news .btnWrap .arrow.next span i{
	margin: 0 0 0 1.5em;
}
#news .btnWrap .arrow.prev{
	left: 0;
}
#news .btnWrap .arrow.prev a i,
#news .btnWrap .arrow.prev span i{
	margin: 0 1.5em 0 0;
}
#news .btnWrap .btn{
  width: auto;
  border: none;
  margin: 0;
	font-size: 1.8rem;
	font-weight: 900;
	text-align: center;
}
#news .btnWrap .btn a{
	position: relative;
	display: inline-block;
  padding: 0;
	line-height: 1.0;
}
#news .btnWrap a:hover{
	color: #000;
}
#news .btnWrap a:hover::before{
	content: none;
}
#news .btnWrap a:hover::after{
	content: '';
	position: absolute;
	bottom: -0.5em;
	left: 0;
	width: 100%;
	height: 1px;
	background: #000;
}
#newsList{
	width: 71%;
}
#newsList .newsLink{
	border-top: 1px solid #ccc;
	padding-top: 3.3em;
	margin-top: 3.3em;
	padding-left: 2em;
}
#newsList .newsLink:first-child{
	padding-top: 0;
	margin-top: 0;
	border-top: 0;
}
#newsList .newsLink a{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	transition: 0.3s;
}
#newsList .newsLink figure{
	margin: 0;
}
#newsList .newsLink a:hover{
	opacity: 0.7;
}
#newsList .newsLink .date{
	font-weight: 500;
	line-height: 1.0;
}
#newsList .newsLink .ttl{
	font-size: 2.0rem;
	font-weight: 900;
	line-height: 1.7;
	margin: 0.5em 0;
}
#newsList .newsLink img{
	width: 13.5em;
	height: auto;
	flex-shrink: 0;
	max-width: 200px;
}
#newsList .newsLink .inner{
	width: calc(100% - 13.5em);
	padding: 0 0 0 2em;
}
#newsList .newsLink .cat{
	font-size: 0;
}
#newsList .newsLink .cat li{
	display: inline-block;
	font-size: 1.3rem;
	font-weight: 900;
	color: #fff;
	background: #000;
	padding: 0.2em 0.8em;
	margin: 5px 10px 0 0;
}
#planList{
	width: 71%;	
}
#planList .roop{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
#planList .roop::after{
	content: "";
	display: block;
	width: 14em;
}
#planList .planlink{
	width: 29%;
	max-width: 210px;
	margin-top: 4.4em;
}

#planList .planlink .product-thumb{
  position: relative;
  width: 100%;
  height: 0;
  padding-top: calc(145 / 210 * 100%);
}

#planList .planlink img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
#planList .planlink:nth-child(-n+3){
	margin-top: 0;
}
#planList .planlink a{
	display: block;
	transition: 0.3s;
}
#planList .planlink a:hover{
	opacity: 0.7;
}
#planList .planlink h2{
	font-weight: 900;
	line-height: 1.8;
	font-size: 1.5rem;
	margin: 0.8em 0 0;
}
#planList .planlink figure{
	margin: 0;
}
.pager{
	display: flex;
	justify-content: center;
	align-items: center;
	border-top: 1px solid #ccc;
	padding-top: 3.3em;
	margin-top: 3.3em;
}
#planList .pager{
	border-top: 0;
	padding-top: 0;
	margin-top: 4.3em;
}
.pager div{
	font-size: 1.8rem;
	font-weight: 900;
	line-height: 1.0;
	margin: 0 1em;
}
.pager .current,
.pager a{
	display: block;
	text-align: center;
	line-height: 1.0;
	padding: 0.5em 0;
}
.pager a{
	background: #fff;
	color: #000;
	border-bottom: 1px solid transparent;
}
.pager a:hover{
	border-bottom: 1px solid #000;
}
.pager .current{
	border-bottom: 1px solid #000;
}
.pager .arrow{
	font-size: 1.2rem;
	margin: 0 1.5em;
}
.pager .arrow a{
	background-color: transparent;
}
.pager .arrow a:hover{
	color: #000;
	opacity: 0.7;
}
#sidebar .ttl{
	position: relative;
	font-size: 2.4rem;
	line-height: 1.2;
	font-weight: 900;
	text-align: center;
	margin: 0 0 1em;
	padding: 0 0 1em;
}
#sidebar .ttl::after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: #000;
	border-radius: 1em;
}
#sidebar ul{
}
#sidebar ul + .ttl{
	margin-top: 3em;
}
#sidebar ul li{
	line-height: 1.8;
	font-weight: 900;
}
#sidebar ul li+li{
	margin-top: 2.3em;
}
#sidebar ul li a{
	display: inline-block;
	position: relative;
	padding: 0;
	transition: 0.3s;
}
#sidebar ul li a:hover{
	opacity: 0.7;
}
#sidebar ul li i{
	font-size: 1.0rem;
	margin-right: 0.5em;
}
#sidebar ul li ul li{
	font-size: 1.3rem;
	font-weight: 500;
}
#sidebar ul li ul{
	margin-top: 2em;
	margin-left: 0.5em;
}
#sidebar ul li ul li+li{
	margin-top: 2em;
}
#sidebar ul li ul li{
	position: relative;
	padding: 0 0 0 1em;
}
#sidebar ul li ul li::before{
	position: absolute;
	top: 50%;
	left: 0;
	content: '';
	border-bottom: 1px solid #000;
	border-left: 1px solid #000;
	width: 0.5em;
	height: 0.5em;
	transform: translateY(-50%);
}

@media screen and (max-width : 1160px){

	#newsDetail{
		margin: 7vw auto 11.2vw;
	}
	#news .txt * + img,
	#news .txt * + .aligncenter{
		margin-top: 2vw;
	}
	#news .sns{
		margin: 5.1vw 0;
		padding: 0 0 3.4vw;
	}
	#news .sns li{
		width: 5vw;
		max-width: 30px;
		margin-left: 1vw;
	}
	#news .sns li img{
		width: 100%;
		height: auto;
	}
	.pager{
	}
	.pager div{
		font-size: 1.4vw;
	}
	.pager .arrow{
		font-size: 1.0vw;
	}
	#newsList .newsLink .ttl{
		font-size: 1.8rem;
	}
	#planList .planlink{
		max-width: inherit;
	}
	#planList .planlink p{
		font-size: 1.4rem;
	}
}

@media screen and (min-width : 768px){

}

@media screen and (max-width : 767px){

	.heading{
		padding: 25vw 0 0;
	}
	.heading .ttl{
		font-size: 8vw;
	}
	#newsList .newsLink a{
		display: block;
	}
	#newsList .newsLink p{
		line-height: 1.8;
	}
	#newsList .newsLink .date{
		width: auto;
	}
	#newsList .newsLink div{
		display: block;
		width: auto;
	}
	#newsList .newsLink div .ttl{
		font-size: 1.5rem;
	}
	#newsList .newsLink div .ttl,
	#newsList .newsLink div .txt{
		width: auto;
	}
	#newsDetail{
		display: block;
		margin: 12vw 0 10vw;
	}
	#newsList .newsLink{
		padding-top: 8vw;
		padding-left: 0;
		margin-top: 8vw;
	}
	#newsList .newsLink img{
		width: 100%;
		max-width: inherit;
	}
	#newsList .newsLink .inner{
		width: auto;
		padding: 0;
		margin: 5vw 0 0;
	}
	#newsDetail #news{
		width: auto;
	}
	#news .ttl{
		font-size: 4.8vw;
	}
	#news .txt * + h3,
	#news .txt * + h4,
	#news .txt * + h5,
	#news .txt * + h6,
	#news .txt * + p{
		margin-top: 1em;
	}
	#news .txt * + img{
		margin-top: 5vw;
	}
	#newsDetail #sidebar{
		width: auto;
		margin-top: 21.4vw;
	}
	#sidebar .ttl{
		font-size: 6.0vw;
	}
	#sidebar ul li{
		font-size: 1.7rem;
	}
	#sidebar ul li ul li{
		font-size: 1.5rem;
	}
	#news .sns{
		margin: 10vw 0;
	}
	#news .sns li{
		width: 10vw;
		max-width: inherit;
		line-height: 0;
		margin-left: 3vw;
	}
	#news .sns li a{
		display: block;
	}
	#news .btnWrap{
		width: auto;
	}
	#news .btnWrap .btn{
		margin: 0 1.5em;
	}
	#news .btnWrap .arrow a{
		align-items: center;
	}
	#news .btnWrap .arrow.next a i{
		margin: 0 0 0 1em;
	}
	#news .btnWrap .arrow.prev a i{
		margin: 0 1em 0 0;
	}
	#newsList{
		width: auto;
	}
	#planList{
		width: auto;
	}
	#planList .roop{
		display: block;
	}
	#planList .planlink{
		width: 100%;
		margin-top: 8vw;
	}
	#planList .planlink:nth-child(-n+3){
		margin-top: 8vw;
	}
	#planList .planlink:first-child{
		margin-top: 0;
	}
	#planList .planlink p{
		font-size: 1.45rem;
	}
	.pager{
		padding-top: 8vw;
		margin-top: 8vw;
	}
	.pager div{
		font-size: 4vw;
	}
	.pager .arrow{
		font-size: 3.2vw;
	}

}
@media (orientation: landscape) and (max-width : 767px){


}