@charset "utf-8";

.mainContentMT {
	width: 100%;
}

/*　パンくずの表示くずれ防止　*/
.rootMT ul {
	overflow: hidden;
	width: 940px;
	margin: 0 auto;
}

/* 画面100%表示用↓ここまで */

/*all*/
#presidentCnp * {
	font-feature-settings: "palt";
	letter-spacing: 0.06em;
	box-sizing: border-box;
}

#presidentCnp :is(article, h1, h2, h3, h4, h5, h6, tr, th, td, div, span, a, a:link, a:visited, p, ul, li, section) {
	color: inherit;
	text-decoration: inherit;
	padding: initial;
	margin: initial;
	min-height: initial;
	background: inherit;
	border-radius: initial;
}

#presidentCnp {
	container-type: inline-size;
	font-family: var(--serif);
	max-width: 100%;
	text-align: center;
	font-weight: 400;
	font-style: normal;
	font-feature-settings: "palt";
	position: relative;
	color: var(--black);
	overflow: hidden;
	background-color: var(--gray);
	--blue: #0d306f;
	--gold: #c4a872;
	--red: #BF0808;
	--black: #1a1a1a;
	--gray: #f2f2f2;
	--hero-title-f-size: clamp(40px, 6vw, 60px);
	--title-f-size: clamp(25px, 4vw, 40px);
	--sbtitle-f-size: clamp(18px, 2.8vw, 28px);
	--txt-f-size: clamp(14px, 2vw, 16px);
	--remark-f-size: clamp(13px, 1.5vw, 14px);
	--serif: "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
	--sans-serif: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans Japanese", "Arial", "Meiryo", sans-serif;
}

#presidentCnp .pc {
	display: block !important;
}

#presidentCnp .sp {
	display: none !important;
}

#presidentCnp .xlTitle {
	font-size: var(--hero-title-f-size);
	font-weight: 700;
	line-height: 1.3;
	text-align-last: justify;
}

#presidentCnp .title {
	font-size: var(--title-f-size);
	font-weight: 700;
	line-height: 1.3;
}

#presidentCnp .subtitle {
	font-size: var(--sbtitle-f-size);
	font-weight: 700;
	line-height: 1.3;
}

#presidentCnp .text {
	font-size: var(--txt-f-size);
	font-weight: 400;
	font-family: var(--sans-serif);
	line-height: 1.5;
}

#presidentCnp .remark {
	font-size: var(--remark-f-size);
	font-weight: 400;
	font-family: var(--sans-serif);
	line-height: 1.5;
}

#presidentCnp .small {
	font-size: 0.5em;
}

#presidentCnp .dot {
	position: relative;
}

#presidentCnp .dot::before {
	content: "";
	position: absolute;
	width: 0.15em;
	height: 0.15em;
	border-radius: 50%;
	display: block;
	top: -0.2em;
	left: 0;
	right: 0;
	margin: auto;
	background-color: #fff;
}

#presidentCnp .view-timer {
	display: none;
}

#presidentCnp #presidentCnpHeader {
	position: relative;
	background-color: var(--black);
	padding: 5% 0 0;
	margin: 0;
	overflow: hidden;
}

#presidentCnp #presidentCnpHeader::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 8vw 0 0 100cqw;
	border-color: transparent transparent transparent #fff;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper {
	width: min(90%, 1000px);
	margin: 0 auto;
	color: #fff;
	text-align: left;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .gradation {
	letter-spacing: 0.25em;
	padding: 0.25em 0;
	margin: 0 auto;
	text-align: center;
	background: linear-gradient(135deg, rgba(136, 103, 60, 1) 0%, rgba(109, 84, 43, 1) 3.32%, rgba(109, 84, 43, 1) 5.88%, rgba(138, 111, 61, 1) 8.14%, rgba(192, 163, 103, 1) 10.71%, rgba(195, 167, 107, 1) 10.86%, rgba(220, 199, 147, 1) 12.38%, rgba(235, 220, 171, 1) 13.59%, rgba(241, 227, 180, 1) 14.33%, rgba(241, 227, 180, 1) 16.89%, rgba(239, 225, 177, 1) 18.32%, rgba(234, 217, 167, 1) 19.47%, rgba(226, 205, 150, 1) 20.51%, rgba(170, 141, 82, 1) 27.3%, rgba(136, 106, 56, 1) 32.28%, rgba(136, 106, 56, 1) 54.45%, rgba(155, 124, 69, 1) 63.5%, rgba(202, 176, 118, 1) 82.35%, rgba(233, 214, 162, 1) 85.37%, rgba(252, 246, 212, 1) 88.39%, rgba(252, 246, 212, 1) 92.91%, rgba(231, 213, 155, 1) 93.97%, rgba(197, 168, 110, 1) 95.48%, rgba(121, 91, 52, 1) 97.44%, rgba(121, 91, 52, 1) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	border: 5px solid rgba(136, 103, 60, 1);
	border-image: linear-gradient(135deg, rgba(136, 103, 60, 1) 0%, rgba(109, 84, 43, 1) 3.32%, rgba(109, 84, 43, 1) 5.88%, rgba(138, 111, 61, 1) 8.14%, rgba(192, 163, 103, 1) 10.71%, rgba(195, 167, 107, 1) 10.86%, rgba(220, 199, 147, 1) 12.38%, rgba(235, 220, 171, 1) 13.59%, rgba(241, 227, 180, 1) 14.33%, rgba(241, 227, 180, 1) 16.89%, rgba(239, 225, 177, 1) 18.32%, rgba(234, 217, 167, 1) 19.47%, rgba(226, 205, 150, 1) 20.51%, rgba(170, 141, 82, 1) 27.3%, rgba(136, 106, 56, 1) 32.28%, rgba(136, 106, 56, 1) 54.45%, rgba(155, 124, 69, 1) 63.5%, rgba(202, 176, 118, 1) 82.35%, rgba(233, 214, 162, 1) 85.37%, rgba(252, 246, 212, 1) 88.39%, rgba(252, 246, 212, 1) 92.91%, rgba(231, 213, 155, 1) 93.97%, rgba(197, 168, 110, 1) 95.48%, rgba(121, 91, 52, 1) 97.44%, rgba(121, 91, 52, 1) 100%);
	border-image-slice: 1;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 2em auto 0;
	gap: 3em;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .headerTitleContainer {
	flex: 1;
	text-align-last: justify;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .headerTitleContainer .text {
	font-family: var(--serif);
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .headerTitleContainer .date {
	font-size: 1.5em;
	letter-spacing: 0;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .headerTitleContainer .big {
	font-size: 1.7em;
	color: var(--red);
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .headerTitleContainer .extend {
	padding: 0.25em 0.3em;
	color: #fff;
	background: var(--red);
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .discount {
	display: block;
	width: 25%;
	background: linear-gradient(135deg, rgba(136, 103, 60, 1) 0%, rgba(109, 84, 43, 1) 3.32%, rgba(109, 84, 43, 1) 5.88%, rgba(138, 111, 61, 1) 8.14%, rgba(192, 163, 103, 1) 10.71%, rgba(195, 167, 107, 1) 10.86%, rgba(220, 199, 147, 1) 12.38%, rgba(235, 220, 171, 1) 13.59%, rgba(241, 227, 180, 1) 14.33%, rgba(241, 227, 180, 1) 16.89%, rgba(239, 225, 177, 1) 18.32%, rgba(234, 217, 167, 1) 19.47%, rgba(226, 205, 150, 1) 20.51%, rgba(170, 141, 82, 1) 27.3%, rgba(136, 106, 56, 1) 32.28%, rgba(136, 106, 56, 1) 54.45%, rgba(155, 124, 69, 1) 63.5%, rgba(202, 176, 118, 1) 82.35%, rgba(233, 214, 162, 1) 85.37%, rgba(252, 246, 212, 1) 88.39%, rgba(252, 246, 212, 1) 92.91%, rgba(231, 213, 155, 1) 93.97%, rgba(197, 168, 110, 1) 95.48%, rgba(121, 91, 52, 1) 97.44%, rgba(121, 91, 52, 1) 100%);
	border-radius: 50%;
}

#presidentCnp #presidentCnpHeader .headerTextWrapper .remark {
	margin: 1em 0 0;
}

#presidentCnp #presidentCnpHeader .magazineImageList {
	width: min(90%, 1200px);
	display: flex;
	gap: 5%;
	padding: 5%;
	margin: 0 auto;
}

#presidentCnp #presidentCnpHeader .magazineImageList .magazineImageListItem {
	flex: 1;
}

#presidentCnp #presidentCnpHeader .magazineImageList .magazineImageListItem .magazineImage {
	width: 100%;
}

#presidentCnp #presidentCnpHeader .magazineImageList .magazineImageListItem .magazineLogo {
	display: block;
	fill: #fff;
	width: 70%;
	margin: 1.5em auto 0;
}

#presidentCnp #introduction {
	position: relative;
	background-color: #fff;
}

#presidentCnp #introduction::after {
	display: block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0vw 0vw 8vw 100cqw;
	border-color: transparent transparent transparent var(--gray);
	transform: rotate(180deg);
}

#presidentCnp #introduction p {
	text-align: center;
	line-height: 2;
	padding: 5% 0;
}

#presidentCnp #magazineWrapper {
	padding: 5%;
}

#presidentCnp #magazineWrapper .magazineList {
	display: flex;
	justify-content: center;
	gap: 3em;
	width: min(100%, 1200px);
	margin: 0 auto;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem {
	flex: 1;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .magazineLogo {
	width: 70%;
	display: block;
	margin: 0 auto;
	fill: var(--black);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .magazineName {
	position: relative;
	margin: 0 0 1em;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .magazineName::before {
	content: "";
	width: 3em;
	height: 2px;
	background: var(--black);
	display: block;
	margin: 0 auto 1em;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .magazineImage {
	display: block;
	width: 90%;
	margin: 0 auto;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .regularPrice {
	margin: 0.5em 0;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .regularPrice .line {
	text-decoration: line-through;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer {
	display: flex;
	justify-content: space-between;
	gap: 1em;
	margin: 0 auto 0.5em;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType {
	flex: 1;
	font-weight: 700;
	color: #fff;
	padding: 1em;
	font-family: var(--serif);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType.vip {
	background: var(--red);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType.standard {
	background: var(--blue);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType .membershipStyle {
	display: block;
	width: fit-content;
	padding: 0.5em 1em;
	margin: 0 auto 0.5em;
	background: #fff;
	border-radius: 3em;
	font-family: var(--serif);
	line-height: 1;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType.vip .membershipStyle {
	color: var(--red);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType.standard .membershipStyle {
	color: var(--blue);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType .price {
	font-size: 3em;
	letter-spacing: 0;
	line-height: 1;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .remark {
	text-align: right;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .applicationButton a {
	position: relative;
	z-index: 2;
	display: block;
	overflow: hidden;
	width: 100%;
	padding: 1em 0;
	margin: 1em auto 0;
	color: #fff;
	background-color: var(--black);
	transition: all .3s;
	font-size: 1.2em;
	font-family: var(--serif);
	line-height: 1;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .applicationButton a::before {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	transition: all .3s;
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .applicationButton a:hover::before {
	top: 0;
	left: 0;
	background-color: var(--red);
}

#presidentCnp #magazineWrapper .magazineList .magazineListItem .applicationButton a::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 1em;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 8px;
	border-color: transparent transparent transparent #fff;
	position: absolute;
}

#presidentCnp #magazineWrapper .caution {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	width: min(100%, 1200px);
	margin: 2em auto 0;
	line-height: 2;
	text-align: left;
	font-weight: 400;
}

#presidentCnp #magazineWrapper .caution li span {
	color: var(--red);
	font-weight: 700;
}

@media screen and (max-width:1100px) {
	#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper {
		flex-direction: column-reverse;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper .remark {
		text-align: center;
	}

}

@media screen and (max-width: 767px) {

	#presidentCnp .sp {
		display: block !important;
	}

	#presidentCnp .pc {
		display: none !important;
	}

	#fftop_recomDetail section {
		padding: 0px;
	}

	#presidentCnp #presidentCnpHeader {
		padding: 12% 0 0;
	}

	#presidentCnp #presidentCnpHeader::after {
		border-width: 12vw 0 0 100cqw;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper {
		text-align: center;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .headerTitleContainer {
		text-align-last: inherit;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper .gradation {
		border-width: 2px;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper .remark {
		text-align: left;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper {
		gap: 2em;
	}

	#presidentCnp #presidentCnpHeader .headerTextWrapper .headerTitleWrapper .discount {
		width: 60%;
	}

	#presidentCnp #introduction::after {
		border-width: 0 0 12vw 100cqw;
	}

	#presidentCnp #presidentCnpHeader .magazineImageList {
		padding: 5% 0;
	}

	#presidentCnp #presidentCnpHeader .magazineImageList .magazineImageListItem .magazineLogo {
		width: 80%;
		margin: 0.5em auto 0;
	}

	#presidentCnp #magazineWrapper .magazineList {
		flex-direction: column;
	}

	#presidentCnp #magazineWrapper .magazineList .magazineListItem .regularPrice {
		font-size: calc(var(--sbtitle-f-size)* 1.5);
	}

	#presidentCnp #magazineWrapper .magazineList .magazineListItem .priceContainer .priceType {
		width: 100%
	}

	#presidentCnp #magazineWrapper .magazineList .magazineListItem .applicationButton a:active::before {
		top: 0;
		left: 0;
		background-color: var(--red);
	}

}
