@charset "utf-8";
/*------------------------------------------------------------
	photoshooting
------------------------------------------------------------*/
#gHeader h1 {
	display: none;
}
.comFixPho .imgShadow {
	background-image: url(../img/photoshooting/fix_photo_bg.png);
}
#main {
	position: relative;
	z-index: 2;
}
#main .mainBox {
	position: relative;
}
#main img {
	width: 100%;
}
#main .sec {
	padding: 22.2rem 0 36.6rem;
	position: relative;
	z-index: 2;
}
#main .sec .bg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
#main .sec .bg img {
	height: 100%;
}
#main .sec .info {
	position: relative;
}
#main .sec .headLine02 {
	position: absolute;
	left: 37.8%;
	top: calc(20rem + 4.05%);
	font-size: 8rem;
	letter-spacing: -0.03em;
	z-index: 1;
}
#main .sec01 .phoBox01 {
	margin-bottom: 12.8%;
	position: relative;
}
#main .sec01 .pho01 {
	width: 47.43%;
	margin-left: 6.3%;
}
#main .sec01 .pho02 {
	width: 27.74%;
	position: absolute;
	right: 6.6%;
	bottom: -9.6%;
}
#main .sec01 .pho03 {
	width: 36.74%;
	margin: 0 0 13.65% 20.6%;
}
#main .sec01 .pho04 {
	width: 81.62%;
	margin: 0 0 12.9% 9.95%;
}
#main .sec01 .phoBox02 {
	position: relative;
}
#main .sec01 .pho05 {
	width: 45.09%;
}
#main .sec01 .pho06 {
	width: 29.28%;
	position: absolute;
	right: 11.2%;
	bottom: -13%;
}
#main .sec02 {
	padding: 20rem 0 23.5rem;
}
#main .sec02 .headLine02 {
	left: 57.3%;
	top: calc(20rem + 9%);
	font-size: 10rem;
}
#main .sec02 .pho01 {
	width: 62.66%;
}
#main .sec02 .pho02 {
	width: 31.25%;
	position: absolute;
	right: 0;
	top: 30.3%;
}
#main .sec02 .pho03 {
	width: 42.97%;
	margin: 12.5% 0 0 13.2%;
}
#main .sec03 {
	padding: 22.6rem 0 22.5rem;
}
#main .sec03 .headLine02 {
	left: 44.1%;
	top: 28.6rem;
	font-size: 10rem;
}
#main .sec03 .pho01 {
	width: 51.09%;
	margin-left: 2.7%;
}
#main .sec03 .pho02 {
	width: 39.45%;
	position: absolute;
	right: 0;
	top: 25.45%;
}
#main .sec03 .pho03 {
	width: 31.99%;
	margin: 16.3% 0 0 15.5%;
}
#main .sec04 {
	padding: 20rem 0 17.6rem;
}
#main .sec04 .headLine02 {
	left: 55.2%;
	top: 29.4rem;
	font-size: 10rem;
}
#main .sec04 .pho01 {
	width: 63.68%;
}
#main .sec04 .pho02 {
	width: 27.23%;
	position: absolute;
	right: 4.5%;
	top: 22.5%;
}
#main .sec04 .pho03 {
	width: 48.16%;
	margin: 11.3% 0 0 5.5%;
}
#main .sec04 .pho04 {
	margin: 9.35% 0 0 42.5%;
	width: 37.62%;
}
#main .fixLink {
	position: sticky;
	width: 0;
	left: 1.2rem;
	top: 0;
	display: flex;
	align-items: center;
	height: 100vh;
	z-index: 9;
	float: left;
}
#main .fixLink li {
	margin: 2.7rem 0;
	font-size: max(10px,1.5rem);
}
#main .fixLink li a {
	position: relative;
	display: block;
	color: #48382A;
	writing-mode: vertical-rl;
	opacity: 0.51;
	letter-spacing: 0.02em;
}
#main .fixLink li a.background--dark {
	color: #fff;
}
#main .fixLink li.on a {
	opacity: 1;
}
#main .fixBox {
	position: relative;
}
#main .fixBox .line {
	position: absolute;
	left: -1.2rem;
	top: 9.1rem;
	width: 1.3rem;
	height: 1px;
	background-color: #48382A;
	opacity: 0.82;
	transition: all 0.3s
}
#main .fixLink.hideLine .line {
	opacity: 0;
}
#main .fixLink[data-ind="1"] .line {
	top: 19.8rem;
}
#main .fixLink[data-ind="2"] .line {
	top: 27.1rem;
}
#main .fixLink[data-ind="3"] .line {
	top: 34.4rem;
}
#main .fixBox .line.background--dark {
	background-color: #fff;
}
@media all and (min-width: 1000px) {
	.mainImg .headLine02 {
		left: 10.5rem;
		transform: translateY(-60%);
	}
	.mainImg .btmBox {
		padding: 24.1rem 0 21.1rem;
	}
	.mainImg .btmBox .en {
		font-size: max(10px,1.4rem);
		line-height: 1.57;
	}
	#main .fixLink li:not(.on) a:hover {
		opacity: 0.2;
	}
	#main .fixLink li a::before {
		position: absolute;
		left: -1.6rem;
		top: 50%;
		width: 1.3rem;
		height: 1px;
		background-color: #48382A;
		opacity: 0.82;
		content: "";
		opacity: 0;
		transition: all 0.3s;
	}
	#main .fixLink li:not(.on) a:hover::before {
		opacity: 1;
	}
	#main .fixLink li:not(.on) a:hover.background--dark::before {
		background-color: #fff;
	}
}
@media all and (max-width: 999px) {
	.mainImg .btmBox {
		padding: 13.2rem 0 12.1rem;
	}
	.mainImg .btmBox .en {
		margin-bottom: 4.2rem;
	}
	.mainImg .linkList {
		font-size: 1.2rem;
	}
	.mainImg .linkList a {
		padding: 0 1rem;
	}
	#main .mainImg .headLine02 {
		top: 15.2rem;
	}
	#main .sec {
		padding: 9.6rem 0;
	}
	#main .sec .headLine02 {
		left: auto;
		top: 22.9%;
		font-size: 3.3rem;
		right: 5.4%;
	}
	#main .sec01 .phoBox01 {
		margin-bottom: 10.8%;
	}
	#main .sec01 .pho01 {
		width: 94.66%;
		margin-left: 0;
	}
	#main .sec01 .pho02 {
		width: 55.2%;
		margin: 19.5% 0 0 auto;
		position: static;
	}
	#main .sec01 .pho03 {
		width: 73.06%;
		margin: 0 0 25.65%;
	}
	#main .sec01 .pho04 {
		width: 89.33%;
		margin: 0 auto 25.9%;
	}
	#main .sec01 .pho05 {
		width: 73.06%;
	}
	#main .sec01 .pho06 {
		margin: 17% 5.4% 0 auto;
		width: 47.46%;
		position: static;
	}
	#main .sec02 {
		padding: 8.8rem 0 9.5rem;
	}
	#main .sec02 .headLine02 {
		left: auto;
		top: 25.8%;
		right: 5.8%;
		font-size: 6.5rem;
	}
	#main .sec02 .pho01 {
		width: 94.66%;
		margin-bottom: 18%;
	}
	#main .sec02 .pho02 {
		width: 70%;
		margin-left: auto;
		position: static;
	}
	#main .sec02 .pho03 {
		width: 73.06%;
		margin: 19.4% 0 0;
	}
	#main .sec03 {
		padding: 10.1rem 0 9.7rem;
	}
	#main .sec03 .headLine02 {
		left: 8%;
		top: -0.2rem;
		font-size: 6.5rem;
		right: auto;
	}
	#main .sec03 .pho01 {
		width: 84.8%;
		margin: 0 auto 23.4%;
	}
	#main .sec03 .pho02 {
		width: 70%;
		margin-left: auto;
		position: static;
	}
	#main .sec03 .pho03 {
		width: 53.06%;
		margin: 15.4% 0 0 11.5%;
	}
	#main .sec04 {
		padding: 8.8rem 0 9.6rem;
	}
	#main .sec04 .headLine02 {
		left: auto;
		top: 22%;
		font-size: 6.5rem;
		right: 6%;
	}
	#main .sec04 .pho01 {
		width: 94.66%;
	}
	#main .sec04 .pho02 {
		width: 70%;
		margin: 19% 0 0 auto;
		position: static;
	}
	#main .sec04 .pho03 {
		width: 72.8%;
		margin: 19.3% 0 0;
	}
	#main .sec04 .pho04 {
		margin: 8.6% 0 0 auto;
		width: 57.06%;
	}
	#main .fixLink {
		left: 0.5rem;
	}
	#main .fixLink li {
		margin: 1.8rem 0;
		font-size: 1.3rem;
	}
	#main .fixLink .line {
		left: -0.5rem;
		width: 0.7rem;
		top: 7.4rem;
	}
	#main .fixLink[data-ind="1"] .line {
		top: 16rem;
	}
	#main .fixLink[data-ind="2"] .line {
		top: 21.8rem;
	}
	#main .fixLink[data-ind="3"] .line {
		top: 27.6rem;
	}
}

.parallaxImg span  {
	display: inline-block;
}
.fixPho {
	overflow: hidden;
	position: relative;
	z-index: 1;
	height: 100vh;
}
.fixPho img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.fixPho .pho {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	clip: rect(0, auto, auto, 0);
}
.fixPho .pho .phoImg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	transform: translateZ(0);
	will-change: transform;
	backface-visibility: hidden;
	-webkit-transform-style: preserve-3d;
	-webkit-font-smoothing: antialiased;
	z-index: -1;
}
.fixPho.active .pho .phoImg {
	z-index: 0;
}
.mainImg .btmBox .textShadow {
	bottom: 50%;
	transform: translate(-50%,50%);
}