@charset "utf-8";

/*-------------------------------
	Topics
-------------------------------*/

.Topics {
	position:relative;
	width:100%;
}

.Topics__inner {
	max-width:calc(67.7rem + (var(--padding-leftright) * 2 ));
	padding: 6rem var(--padding-leftright) 13rem;
	margin:0 auto;
}

/*-------------------------------
	Topics__head
-------------------------------*/

.Topics__head {
	margin-bottom:5rem;
}

.Topics__item-data{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.Topics__item-category{
	background: var(--subcolor);
	min-width: 6rem;
	height: 2.1rem;
	margin-bottom: .6rem;
	margin-right:.6rem;
	padding-bottom: .2rem;
	padding-left: .8rem;
	padding-right: .8rem;
	font-size: 1.4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
}

.Topics__item-title {
	font-size:3.2rem;
	font-weight:500;
	letter-spacing: 5%;
	line-height:1.375;
}

.Topics__item-time{
	margin-top:1em;
	color: var(--subcolor);
	font-size: 1.5rem;
	line-height: 1;
	display: block;
}

/*-------------------------------
	Topics__content
-------------------------------*/

.Topics__mainimage{
	width: 100%;
}
.Topics__mainimage:not(:last-child){
	margin-bottom: 6rem;
}
.Topics__mainimage img{
	width: 100%;
}

.Topics__parts:not(:last-child){
	margin-bottom:7rem;
}

.Topics__editor > *:last-child{
	margin-bottom: 0;
}

.Topics__editor img {
	margin:0 auto 6rem;
	max-width:100%;
}

.Topics__editor p {
	margin-bottom:2em;
}

.Topics__editor p a{
	color: var(--subcolor);
}

.Topics__editor h2 {
	font-size:2.4rem;
	font-weight:500;
	letter-spacing: 5%;
	line-height:1.4;
	border-bottom:1px solid var(--blackcolor);
	padding-bottom:0.25em;
	margin-bottom:2em;
}

.Topics__editor h3 {
	font-size:2rem;
	font-weight:500;
	letter-spacing: 5%;
	line-height:1.4;
	padding-left:0.4em;
	border-left:4px solid var(--subcolor);
	margin-bottom:1.25em;
}

.Topics__content-img-txt,
.Topics__content-txt-img,
.Topics__content-txt-txt,
.Topics__content-img-img {
	display: flex;
	flex-wrap:wrap;
	align-items: flex-start;
	justify-content: space-between;
}
.Topics__content-body > *:last-child{
	margin-bottom: 0;
}

.Topics__content-img-txt img,
.Topics__content-txt-img img,
.Topics__content-img-txt p,
.Topics__content-txt-img p,
.Topics__content-txt-txt p,
.Topics__content-img-img img{
	width: calc((100% - 2.5rem) / 2);
}


/*-------------------------------
	responsive
-------------------------------*/

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


} /* end 1100px */

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

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

/*-------------------------------
	Topics
-------------------------------*/

.Topics__inner {
	max-width:100%;
	padding: 4.5rem var(--padding-leftright) 6rem;
}

/*-------------------------------
	Topics__head
-------------------------------*/

.Topics__head {
	margin-bottom:4rem;
}

.Topics__item-title {
	font-size:2.4rem;
}

.Topics__item-time{
	margin-top:1em;
	font-size: 1.5rem;
}

.Topics__mainimage:not(:last-child){
	margin-bottom: 4.5rem;
}

/*-------------------------------
	Topics__content
-------------------------------*/

.Topics__parts:not(:last-child){
	margin-bottom:5.5rem;
}

.Topics__editor img {
	max-width: 100%;
	margin:0 auto 4.5rem;
}

.Topics__editor h2 {
	font-size:2rem;
	padding-bottom:0.25em;
	margin-bottom:2em;
}

.Topics__editor h3 {
	font-size:1.8rem;
	padding-left:0.4em;
	border-left:4px solid var(--subcolor);
	margin-bottom:1.25em;
}

.Topics__content-img-txt,
.Topics__content-txt-img,
.Topics__content-txt-txt,
.Topics__content-img-img {
	margin-bottom:3rem;
	row-gap: 2.5rem;
	flex-direction: column;
}

.Topics__content-img-img img,
.Topics__content-img-txt img,
.Topics__content-txt-img img {
	max-width: 100%;
	width: 100%;
	margin-bottom:0;
}

.Topics__content-txt-img img {
	order:-1;
}

.Topics__content-txt-txt p,
.Topics__content-img-txt p,
.Topics__content-txt-img p {
	width:100%;
}

.Topics__content-img-txt p {
	padding-left:0;
}

.Topics__content-txt-img p {
	padding-right:0;
}


} /* end 768px */