@charset "utf-8";
/*------------------------------------------------------------
	index
------------------------------------------------------------*/
#gHeader .lBox,
#gHeader .menu {
	opacity: 0;
	transition: 1s ease;
}
#gHeader.show .lBox,
#gHeader.show .menu {
	opacity: 1;
}
#gHeader:not(.show) {
	user-select: none;
	pointer-events: none;
}
#main .sec01 {
	min-height: 45rem;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	height: 100svh;
	padding: 5rem;
	position: relative;
	overflow-x: clip;
}
#main .sec01 .bgBox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 3006 / 2162;
	min-height: 108.1rem;
	transition: 2s ease;
}
#main .sec01 .bgBox::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/img/index/bg01.jpg) no-repeat left top -0.4rem;
	background-size: cover;
	content: "";
}
#main .sec01 .content {
	width: 100%;
	max-width: 85.5rem;
	align-items: flex-start;
}
#main .sec01 .lBox {
	padding-right: 4rem;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	transition-delay: .3s;
}
#main .sec01 .lBox .ttl {
	width: 2.8rem;
}
#main .sec01 .lBox .txt {
	margin: 0 4.7rem -9.7rem 0;
	font-size: 3rem;
	letter-spacing: 0.5em;
	line-height: 1.87;
}
#main .sec01 .rBox {
	margin-right: -11.4rem;
	width: 20rem;
	padding: 5.2rem 0.7rem 0 0;
}
#main .sec01 .list {
	margin-bottom: 6.5rem;
}
#main .sec01 .list li {
	margin-bottom: 2rem;
	font-size: 2.7rem;
	letter-spacing: 0.05em;
	transition-delay: .6s;
}
#main .sec01 .list li:nth-child(2) {
	transition-delay: .8s;
}
#main .sec01 .list li:last-child {
	margin-bottom: 0;
	transition-delay: 1s;
}
#main .sec01 .comSnsBox .ttl {
	transition-delay: 1.2s;
}
#main .sec01 .comSnsBox .snsUl li {
	transition-delay: 1.4s;
}
#main .sec01 .comSnsBox .snsUl li:nth-child(2) {
	transition-delay: 1.6s;
}
#main .sec01 .comSnsBox .comLinkP {
	transition-delay: 1.8s;
}
#main .newsSec {
	padding-top: 20rem;
	padding-bottom: 3.4rem;
	position: relative;
	z-index: 2;
}
#main .newsSec .content {
	max-width: 85.5rem;
}
#main .newsSec .rBox {
	width: 24.2rem;
	order: 2;
	display: flex;
	margin: -0.8rem -4.5rem 0 0;
	justify-content: flex-end;
}
#main .newsSec .lBox {
	flex: 1;
}
#main .newsBox {
	margin-bottom: 5.7rem;
}
.comBgBox {
	overflow: inherit;
}
#main .bookSec {
	position: relative;
	padding: 20rem 0 13.5rem;
}
#main .bookSec .bg {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	overflow-x: clip;
	aspect-ratio: 1466 / 1396;
}
#main .bookSec .bg:after {
	background: url(/img/index/bg02.png) no-repeat;
	background-size: 100% auto;
	position: absolute;  
	top: -19.6rem;
	left: -5rem;
	right: -5rem;
	bottom: 0;
	content: ""; 
}
#main .bookSec .headLine01 {
	margin-bottom: 10.8rem;
}
#main .bookSec .headLine01 .jp {
	letter-spacing: 0.55em;
	margin-bottom: -0.4rem;
}
#main .bookSec .viewLink {
	position: absolute;
	top: 2.5rem;
	right: 2rem;
}
#main .bookSec .bookList {
	--top: 10rem;
}
#main .bookSec .bookList li {
	--height: 0;
}
#main .bookSec .bookList li:nth-child(2) {
	margin-top: var(--top);
}
#main .bookSec .bookList li:nth-child(3) {
	margin-top: calc(var(--top) * 2);
}
#main .bookSec .bookList li:nth-child(4) {
	margin-top: calc(var(--top) * 3);
}
#main .bookSec .bookList li .sticky {
	position: sticky;
	top: calc(50% - var(--height)*0.5);
}
#main {
	margin-bottom: 0;
}
#main .profileSec {
	position: relative;
	padding: 23rem 0 24.3rem;
}
#main .profileSec .bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow-x: clip;
	z-index: -1;
}
#main .profileSec .headLine01 {
	position: absolute;
	top: -14.6rem;
	right: 1.6rem;
	z-index: 2;
}
#main .profileSec .photoBox {
	width: 57.1rem;
	margin-right: 10.8rem;
	overflow: hidden;
	align-self: start;
	text-align: right;
	line-height: 35px;
	font-size: 1.4rem;
}
#main .profileSec .photoBox img {
	object-fit: cover;
	aspect-ratio: 1142/856;
	width: 100%;
}
#main .profileSec .textBox {
	margin-top: -0.9rem;
	padding-right: 16rem;
	flex: 1;
}
#main .profileSec .textBox p:not(.name) {
	text-align: justify;
	line-height: 2.05;
}
#main .profileSec .textBox .name {
	margin-bottom: 4.1rem;
	font-size: 2.4rem;
	letter-spacing: 0.15em;
}
#main .profileSec .textBox .name small {
	font-size: max(1.25rem,10px);
	letter-spacing: 0.15em;
	vertical-align: 0.4rem;
	margin-left: 2.3rem;
}

@media all and (min-width: 1000px) {
	.btmBg {
		overflow: hidden;
		position: absolute;
		width: 100%;
		bottom: 0;
		left: 0;
		z-index: -1;
		aspect-ratio: 2.5;
	}
	.btmBg:after {
		aspect-ratio: 2732 / 1831;
		background: url(/img/index/bg03.png) no-repeat center top;
		background-size: 100% auto;
		position: absolute;  
		bottom: 0;
		left: 0;
		right: 0;  
		content: ""; 
		z-index: -1;
	}
	#main .bookSec .content > .headLine01,
	#main .bookSec .content > .viewLink {
		visibility: hidden;
	}
	#main .bookSec .bookList li .headLine01 {
		position: absolute;
		left: 0;
		top: -16.8rem;
	}
	#main .bookSec .bookList li .viewLink {
		position: absolute;
		left: 112rem;
		top: -14.3rem;
		width: 6.5rem;
	}
}

@media all and (max-width: 999px) {
	#main {
		overflow: hidden;
	}
	#main .sec01 {
		padding-inline: 0;
		padding-block: 2rem;
	}
	#main .sec01 .bgBox {
		/* overflow-x: clip; */
		min-height: inherit;
		background: none;
		z-index: -1;
		aspect-ratio: inherit;
		height: 100%;
	}
	#main .sec01 .bgBox:after {
		aspect-ratio: 750 / 2133;
		display: block;
		background: url(/img/index/bg01_sp.png) no-repeat;
		background-size: 100% auto;
		position: absolute;  
		top: 0;
		left: 0;
		right: 0;  
		content: "";
		height: auto;
	}
	#main .sec01 .content {
		display: block;
	}
	#main .sec01 .lBox {
		padding: 0 1.8rem min(20vh,15.3rem);
	}
	#main .sec01 .lBox .txt {
		margin: 0 4.7rem max(-9vh,-7.2rem) 0;
		font-size: 2.4rem;
		line-height: 1.875;
	}
	#main .sec01 .lBox .ttl {
		padding-right: 1rem;
		width: 2.6rem;
		box-sizing: content-box;
	}
	#main .sec01 .rBox {
		width: auto;
		margin: 0;
		padding: 0 2.5rem;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-end;
		justify-content: space-between;
	}
	#main .sec01 .list {
		margin: 0;
		order: 2;
	}
	#main .sec01 .list li {
		margin-bottom: 1rem;
		text-align: right;
		font-size: 2.3rem;
		letter-spacing: 0.02em;
	}
	#main .newsBox {
		margin-bottom: 2.8rem;
		display: block;
	}
	#main .newsSec .rBox {
		width: auto;
		display: block;
		margin: 0 0 5.6rem;
	}
	#main .newsSec {
		margin-top: -5rem;
		padding-top: 10rem;
		padding-bottom: 5rem;
	}
	#main .bookSec {
		padding: 5rem 0 14.2rem;
	}
	#main .bookSec .headLine01 {
		margin-bottom: 7.9rem;
	}
	#main .bookSec .slick-list {
		overflow: visible;
	}
	#main .bookSec .viewLink {
		position: static;
		text-align: center;
		margin: 6.3rem 0 0;
	}
	#main .bookSec .bg { 
		aspect-ratio: 1968 / 4662;
	}
	#main .bookSec .bg::after { 
		top: -8.6rem;
		left: -79.2vw;
		right: -31.19rem;
		right: -83.17vw;
		background-image: url(/img/index/bg02_sp.png);
	}
	#main .bookSec .bookList li {
		margin-top: 0 !important;
		width: 20.8rem !important;
	}
	#main .profileSec {
		padding: 10rem 0 13.2rem;
	}
	#main .profileSec .bg {
		top: 5rem;
	}
	#main .profileSec .content {
		display: block;
	}
	#main .profileSec .photoBox {
		width: auto;
		position: relative;
		margin: 0 1rem 5.2rem -5.2rem;
		font-size: 1.2rem;
	}
	#main .profileSec .photoBox img {
		object-fit: cover;
		width: 100%;
	}
	#main .profileSec .textBox {
		position: relative;
		margin: 0;
		padding: 0 0.7rem;
	}
	/* #main .profileSec .textBox:after {
		aspect-ratio: 372 / 702;
		background: url(/img/index/bg04_sp.png) no-repeat;
		background-size: 100% auto;
		position: absolute;  
		top: -7rem;
		left: -2.7rem;
		bottom: 0;
		right: 17.5rem;
		z-index: -1;
		content: ""; 
	} */
	#main .profileSec .textBox p:not(.name) {
		font-size: 1.4rem;
	}
	#main .profileSec .textBox .name {
		font-size: 1.9rem;
		margin-bottom: 3.3rem;
	}
	#main .profileSec .textBox .name small {
		font-size: 1rem;
		margin-left: 1.7rem;
		vertical-align: 0.3rem;
	}
	#main .profileSec .bg::after {
		bottom: auto;
		top: -15rem;
		left: -14.2rem;
		right: -70.9rem;
		left: -37.9vw;
		right: -189vw;
		aspect-ratio: 2452 / 1760;
		background: url(/img/index/bg03_sp.jpg) no-repeat center top;
		position: absolute;
		z-index: -1;
		content: '';
		background-size: 100% auto;
	}
	#main .profileSec .headLine01 {
		top: -5.7rem;
		right: 3.8rem;
	}
	.headLine01.style2 .en {
		background: linear-gradient(to bottom, #000 0%, #000 46%, #fff 46%, #fff 100%);
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		color: transparent;
	}
}

@media (hover: hover) {
	#main .sec01 .rBox a:hover {
		opacity: 0.7;
	}
}
.paraBox {
	opacity: 0;
	transition: 1s ease;
}
.paraBox.isShow {
	opacity: 1;
}
.paraBox::after {
	transform: translateY(var(--para));
}