@charset "utf-8";

#POINT1 {
position: relative;
}
#POINT1 .cont {
margin: 0 auto;
padding: 8vw 0 16vw 0;
width: 81.333vw;
}
#POINT1 .point {
margin-bottom: 3.2vw;
font-size: 3.733vw;
}
#POINT1 h2 {
margin-bottom: 1.6vw;
font-family: 'A1 Gothic M', sans-serif;
font-size: 4.267vw;
line-height: 1.37;
}
#POINT1 h2 sup {
font-size: 2.933vw;
}
#POINT1 p {
font-size: 3.733vw;
line-height: 1.36;
}
#POINT1 p sup,
#POINT1 p span {
font-size: 2.933vw;
}
#POINT1 .image img {
display: block;
margin-top: 5.867vw;
width: 100%;
height: auto;
}
@media screen and (min-width: 768px) {
	#POINT1 .cont {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	padding: 40px 0 80px 0;
	width: 1068px;
	}
	#POINT1 .pack {
	margin-left: 64px;
	width: 300px;
	}
	#POINT1 .point {
	margin-bottom: 12px;
	font-size: 15px;
	}
	#POINT1 h2 {
	margin-bottom: 26px;
	font-size: 22px;
	}
	#POINT1 h2 sup {
	font-size: 12px;
	}
	#POINT1 p {
	font-size: 15px;
	line-height: 1.6;
	}
	#POINT1 p span {
	margin-top: 8px;
	display: block;
	font-size: 12px;
	}
	#POINT1 .image {
	width: 534px;
	}
	#POINT1 .image img {
	margin-top: 0;
	}
}

#EXPLAN1 {
position: relative;
background-color: #e4e4e4;
}
#EXPLAN1 .cont {
margin: 0 auto;
padding: 5.333vw 0 13.333vw 0;
width: 81.333vw;
}
#EXPLAN1 h2 {
margin-bottom: 5.333vw;
font-family: 'A1 Mincho', serif;
font-size: 4.533vw;
text-align: center;
letter-spacing: 0.15em;
}
#EXPLAN1 .list {
display: flex;
flex-direction: column;
gap: 6.667vw;
}
#EXPLAN1 .block {
display: flex;
flex-wrap: wrap;
}
#EXPLAN1 .block .image {
display: block;
width: 38.667vw;
height: auto;
}
#EXPLAN1 .block .image img {
display: block;
width: 38.667vw;
height: auto;
}
#EXPLAN1 .block .pack {
flex: 1;
padding-left: 2.133vw;
}
#EXPLAN1 p {
font-size: 3.733vw;
line-height: 1.36;
letter-spacing: 0.05em;
}
#EXPLAN1 p.note {
font-size: 2.933vw;
}
@media screen and (min-width: 768px) {
	#EXPLAN1 .cont {
	padding: 80px 0 70px 0;
	width: 990px;
	}
	#EXPLAN1 h2 {
	margin-bottom: 40px;
	font-size: 26px;
	text-align: left;
	}
	#EXPLAN1 .list {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	gap: 54px;
	}
	#EXPLAN1 .block {
	display: block;
	width: 468px;
	}
	#EXPLAN1 .block .image {
	width: 468px;
	}
	#EXPLAN1 .block .image img {
	margin: 0 auto 25px auto;
	width: 420px;
	}
	#EXPLAN1 .block .pack {
	margin: 0 auto 0 auto;
	padding-left: 0;
	width: 420px;
	}
	#EXPLAN1 p {
	font-size: 15px;
	line-height: 1.6;
	}
	#EXPLAN1 p.note {
	margin-top: 4px;
	font-size: 12px;
	}
}

#EXPLAN2 {
position: relative;
}
#EXPLAN2 .cont {
margin: 0 auto;
padding: 9.333vw 0 13.333vw 0;
width: 81.333vw;
}
#EXPLAN2 h2 {
margin-bottom: 4vw;
font-family: 'A1 Mincho', serif;
font-size: 4.533vw;
text-align: center;
letter-spacing: 0.15em;
}
#EXPLAN2 .map {
position: relative;
margin: 4vw -5.333vw 13.333vw -5.333vw;
}
#EXPLAN2 .map .image {
position: relative;
}
#EXPLAN2 .map img {
display: block;
width: 92vw;
height: auto;
}
#EXPLAN2 .map li {
position: absolute;
left: 0;
top: 0;
font-size: 3.6vw;
letter-spacing: 0;
}
#EXPLAN2 .map li::after {
transform: translateX(-50%);
content: '';
display: block;
position: absolute;
left: 50%;
background-color: #000;
border-radius: 26666.4vw;
width: 1.333vw;
height: 1.333vw;
}
#EXPLAN2 .map .li2::after,
#EXPLAN2 .map .li1::after {
bottom: -2.133vw;
}
#EXPLAN2 .map .li4::after,
#EXPLAN2 .map .li3::after {
top: -2.133vw;
}
#EXPLAN2 .map .li1 {
left: 2%;
top: 15.5%;
}
#EXPLAN2 .map .li2 {
left: 33%;
top: 24%;
}
#EXPLAN2 .map .li3 {
left: 27%;
top: 65%;
}
#EXPLAN2 .map .li4 {
left: 70%;
top: 37%;
}
#EXPLAN2 .map li a {
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
position: relative;
background-color: #fff;
border: solid 1px #000;
border-radius: 26666.4vw;
padding: 0 4.267vw 0 0;
width: 81px;
height: 26px;
text-decoration: none;
}
#EXPLAN2 .map li a::before {
transform: translateY(-1px);
content: '';
display: block;
position: absolute;
top: 50%;
right: 1.6vw;
width: 3.467vw;
border-top: solid 1px #000;
}
#EXPLAN2 .map li a::after {
transform: rotate(-45deg) translateY(1px);
content: '';
display: block;
position: absolute;
top: 50%;
right: 2.4vw;
width: 1.067vw;
border-top: solid 1px #000;
}
#EXPLAN2 .list {
display: flex;
flex-direction: column;
gap: 10.667vw;
margin: 0 auto;
padding: 9.333vw 0 0 0;
width: 81.333vw;
}
#EXPLAN2 .list h4 {
margin-bottom: 3.733vw;
font-family: 'A1 Gothic R', sans-serif;
font-size: 4.267vw;
text-align: center;
text-decoration: underline;
text-underline-offset: 1.333vw;
}
#EXPLAN2 .list p {
font-size: 3.733vw;
line-height: 1.36;
}
#EXP2-BLK1 {
padding-bottom: 13.333vw;
}
#EXP2-BLK1 .image1 {
position: relative;
margin: 0 0 6.4vw -9.333vw;
width: 90.667vw;
}
#EXP2-BLK1 .image1 img {
display: block;
width: 90.667vw;
}
#EXP2-BLK1 .p1 {
margin: 0 0 6.4vw 0;
}
#EXP2-BLK1 .image2 {
margin: 0 0 6.4vw 0;
}
#EXP2-BLK1 .image2 picture:nth-of-type(1) {
display: block;
margin: 0 0 3.2vw -9.333vw;
}
#EXP2-BLK1 .image2 picture:nth-of-type(1) img {
display: block;
width: 90.667vw;
}
#EXP2-BLK1 .image2 picture:nth-of-type(2) img {
display: block;
width: 100%;
}
#EXP2-BLK2 .image {
position: relative;
margin-bottom: 5.333vw;
}
#EXP2-BLK2 .image picture:nth-of-type(1) img {
position: absolute;
right: 0;
top: 0;
display: block;
width: 38.933vw;
height: auto;
}
#EXP2-BLK2 .image picture:nth-of-type(2) img {
display: block;
width: 39.2vw;
height: auto;
}
#EXP2-BLK2 .image picture:nth-of-type(3) img {
position: absolute;
right: 0;
bottom: 0;
display: block;
width: 38.933vw;
height: auto;
}
#EXPLAN2 .head p,
#EXP2-BLK1 p ,
#EXP2-BLK2 p {
font-size: 3.733vw;
line-height: 1.36;
}
.modal .body {
padding: 6.667vw 6.667vw 4vw 6.667vw;
}
.modal .body img {
display: block;
margin-bottom: 14.667vw;
width: 100%;
height: auto;
}
@media screen and (min-width: 768px) {
	#EXPLAN2 .cont {
	padding: 90px 0 420px 0;
	width: 990px;
	}
	#EXPLAN2 .head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 30px;
	}
	#EXPLAN2 h2 {
	margin-bottom: 0;
	font-size: 26px;
	text-align: left;
	}
	#EXPLAN2 .head p {
	padding-top: 8px;
	}
	#EXPLAN2 .map {
	margin: 35px 0 115px -35px;
	}
	#EXPLAN2 .map svg,
	#EXPLAN2 .map img {
	width: 1018px;
	}

	svg .pop {
	transition: opacity 0.7s ease;
	transition-delay: 0.3s;
	opacity: 0;
	}
	svg .aera {
	transition: opacity 0.7s ease;
	transition-delay: 2s;
	opacity: 0;
	}
	svg.activeView .aera,
	svg.activeView .pop {
	opacity: 1;
	}
	svg .svg-elem-1 {
	stroke-dashoffset: 89.9000244140625px;
	stroke-dasharray: 89.9000244140625px;
	-webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
	transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s;
	transition-delay: 1s;
	}
	svg.activeView .svg-elem-1 {
	stroke-dashoffset: 179.800048828125px;
	}
	svg .svg-elem-2 {
	stroke-dashoffset: 220.98004150390625px;
	stroke-dasharray: 220.98004150390625px;
	-webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s;
	transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s;
	transition-delay: 1s;
	}
	svg.activeView .svg-elem-2 {
	stroke-dashoffset: 441.9600830078125px;
	}
	svg .svg-elem-3 {
	stroke-dashoffset: 139.78001403808594px;
	stroke-dasharray: 139.78001403808594px;
	-webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s;
	transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s;
	transition-delay: 1s;
	}
	svg.activeView .svg-elem-3 {
	stroke-dashoffset: 279.5600280761719px;
	}
	svg .svg-elem-4 {
	stroke-dashoffset: 14.060698509216309px;
	stroke-dasharray: 14.060698509216309px;
	-webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s;
	transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s;
	transition-delay: 1s;
	}
	svg.activeView .svg-elem-4 {
	stroke-dashoffset: 0;
	}

	#EXPLAN2 .map ul {
	display: none;
	}

	#EXPLAN2 .list {
	flex-direction: row;
	justify-content: space-between;
	gap: 0;
	padding: 0 0 0 0;
	width: 1040px;
	}
	#EXPLAN2 .list .block {
	width: 290px;
	}
	#EXPLAN2 .list h4 {
	margin-bottom: 14px;
	font-size: 18px;
	text-underline-offset: 5px;
	}
	#EXPLAN2 .list p {
	font-size: 12px;
	line-height: 2;
	}
	#EXP2-BLK1 {
	box-sizing: content-box;
	position: relative;
	margin: 0 -25px 80px -25px;
	padding: 0;
	width: 1040px;
	height: 770px;
	}
	#EXP2-BLK1 .image1 {
	position: absolute;
	left: -80px;
	top: 0;
	margin: 0;
	width: 660px;
	}
	#EXP2-BLK1 .image1 img {
	display: block;
	width: 660px;
	}
	#EXP2-BLK1 .p1 {
	position: absolute;
	left: 635px;
	top: 75px;
	margin: 0;
	width: 375px;
	}
	#EXP2-BLK1 .image2 {
	margin: 0;
	}
	#EXP2-BLK1 .image2 picture:nth-of-type(1) {
	display: block;
	position: absolute;
	right: 0px;
	top: 245px;
	margin: 0;
	}
	#EXP2-BLK1 .image2 picture:nth-of-type(1) img {
	display: block;
	width: 405px;
	}
	#EXP2-BLK1 .image2 picture:nth-of-type(2) {
	transform: translateX(-50%);
	position: absolute;
	left: 50%;
	top: 100%;
	}
	#EXP2-BLK1 .image2 picture:nth-of-type(2) img {
	display: block;
	width: 100vw;
	min-width: 1200px;
	}
	.bg-space {
	width: 100vw;
	aspect-ratio: 40 / 11;
	min-height: 330px;
	}
	#EXP2-BLK1 .p2 {
	position: absolute;
	left: 80px;
	top: 475px;
	margin: 0;
	width: 500px;
	}
	#EXP2-BLK2 {
	margin: 0 auto;
	width: 598px;
	}
	#EXP2-BLK2 .image {
	margin-bottom: 0;
	position: relative;
	}
	#EXP2-BLK2 .image picture:nth-of-type(1) img {
	position: relative;
	margin: 0 auto 55px auto;
	width: 598px;
	height: auto;
	}
	#EXP2-BLK2 .image picture:nth-of-type(2) img {
	position: absolute;
	left: -185px;
	top: 480px;
	width: 412px;
	height: auto;
	}
	#EXP2-BLK2 .image picture:nth-of-type(3) img {
	position: absolute;
	right: -165px;
	top: 665px;
	bottom: inherit;
	margin: 0 auto;
	width: 412px;
	height: auto;
	}
	#EXPLAN2 .head p,
	#EXP2-BLK1 p,
	#EXP2-BLK2 p {
	font-size: 15px;
	line-height: 1.6;
	}
	#EXP2-BLK2 p {
	margin: 0 0 0 auto;
	width: 300px;
	}
	.modal .mask {
	display: none;
	}
	.modal .body {
	display: none;
	}
}

#POINT2 {
position: relative;
background-color: #e4e4e4;
}
#POINT2 .cont {
margin: 0 auto;
padding: 10.667vw 0 13.333vw 0;
width: 81.333vw;
}
#POINT2 .point {
margin-bottom: 3.2vw;
font-size: 3.733vw;
}
#POINT2 h2 {
margin-bottom: 1.6vw;
font-family: 'A1 Gothic M', sans-serif;
font-size: 4.267vw;
line-height: 1.37;
}
#POINT2 p {
font-size: 3.733vw;
line-height: 1.36;
}
#POINT2 .image img {
display: block;
margin-top: 5.867vw;
width: 100%;
height: auto;
}
@media screen and (min-width: 768px) {
	#POINT2 .cont {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-items: center;
	padding: 100px 0 110px 0;
	width: 990px;
	}
	#POINT2 .pack {
	margin-right: 15px;
	width: 300px;
	}
	#POINT2 .point {
	margin-bottom: 12px;
	font-size: 15px;
	}
	#POINT2 h2 {
	margin-bottom: 26px;
	font-size: 22px;
	}
	#POINT2 p {
	font-size: 15px;
	line-height: 1.6;
	}
	#POINT2 p span {
	margin-top: 8px;
	display: block;
	font-size: 12px;
	}
	#POINT2 .image {
	width: 602px;
	}
	#POINT2 .image img {
	margin-top: 0;
	}
}

#BG1 img {
display: block;
width: 100%;
height: auto;
}
@media screen and (min-width: 768px) {
	#BG1 img {
	object-fit: cover;
	height: 590px;
	}
}

#EXPLAN3 {
position: relative;
}
#EXPLAN3 .cont {
margin: 0 auto;
padding: 9.333vw 0 13.333vw 0;
width: 81.333vw;
}
#EXPLAN3 .block {
margin-bottom: 13.333vw;
}
#EXPLAN3 .block:last-child {
margin-bottom: 0;
}
#EXPLAN3 h2 {
margin-bottom: 4vw;
font-family: 'A1 Mincho', serif;
font-size: 4.533vw;
text-align: center;
letter-spacing: 0.15em;
}
#EXPLAN3 .block:first-child .image {
position: relative;
margin-top: 9.333vw;
padding-bottom: 8vw;
}
#EXPLAN3 .block:last-child .image {
margin-top: 9.333vw;
}
#EXPLAN3 .block:nth-of-type(3) .image,
#EXPLAN3 .block:nth-of-type(2) .image {
margin-top: 6.667vw;
}
#EXPLAN3 .image picture:nth-of-type(1) img {
display: block;
width: 100%;
height: auto;
}
#EXPLAN3 .block:first-child .image picture:nth-of-type(1) img {
display: block;
width: 39.2vw;
height: auto;
}
#EXPLAN3 .image picture:nth-of-type(2) img {
position: absolute;
right: 0;
bottom: 0;
display: block;
width: 38.933vw;
height: auto;
}
#EXPLAN3 p {
font-size: 3.733vw;
line-height: 1.36;
}
@media screen and (min-width: 768px) {
	#EXPLAN3 .cont {
	padding: 135px 0 105px 0;
	width: 990px;
	}
	#EXPLAN3 h2 {
	margin-bottom: 20px;
	white-space: nowrap;
	font-size: 26px;
	text-align: left;
	}
	#EXPLAN3 .image img {
	display: block;
	width: 440px;
	height: auto;
	}
	#EXPLAN3 p {
	font-size: 15px;
	line-height: 1.6;
	}
	#EXPLAN3 .block:first-child {
	margin-bottom: 90px;
	}
	#EXPLAN3 .block:first-child .pack {
	margin: 0 0 60px 550px;
	width: 360px;
	}
	#EXPLAN3 .block:first-child .image {
	position: relative;
	margin: 0;
	padding: 0 20px 0 30px;
	}
	#EXPLAN3 .block:first-child .image picture:nth-of-type(1) img {
	position: absolute;
	top: -140px;
	left: -135px;
	width: 575px;
	}
	#EXPLAN3 .block:first-child .image picture:nth-of-type(2) img {
	position: relative;
	margin: 0 -115px 0 auto;
	width: 576px;
	}
	#EXPLAN3 .block:nth-of-type(2) {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	align-items: center;
	gap: 54px;
	margin-bottom: 40px;
	}
	#EXPLAN3 .block:nth-of-type(2) .image {
	margin: 0;
	width: 468px;
	}
	#EXPLAN3 .block:nth-of-type(2) .pack {
	width: 358px;
	}
	#EXPLAN3 .block:nth-of-type(3) {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 74px;
	margin-right: -105px;
	margin-bottom: 110px;
	}
	#EXPLAN3 .block:nth-of-type(3) .image {
	margin: 0;
	width: 632px;
	}
	#EXPLAN3 .block:nth-of-type(3) .pack {
	width: 358px;
	}
	#EXPLAN3 .block:last-child {
	margin-bottom: 0;
	}
	#EXPLAN3 .block:last-child .pack {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 60px;
	margin-bottom: 85px;
	}
	#EXPLAN3 .block:last-child .pack h2 {
	margin-bottom: 10px;
	}
	#EXPLAN3 .block:last-child .image img {
	display: block;
	margin: 0 auto;
	width: 628px;
	height: auto;
	}
}

#MOVIE .cont {
padding-bottom: 20vw;
}
#MOVIE .image {
background: url("/ie/tree/primewood/originality/img/sp/exp3_movie_bg1.jpg") no-repeat center center;
background-size: cover;
padding: 10.667vw 0;
}
#MOVIE .image img {
display: block;
margin: 0 auto;
width: 81.333vw;
height: auto;
}
#MOVIE .pack {
padding: 5.333vw 0 0 0;
}
#MOVIE h2 {
margin-bottom: 2.667vw;
display: flex;
justify-content: center;
align-items: center;
}
#MOVIE h2 img {
display: block;
margin: 0 auto 0 auto;
width: auto;
height: 6.4vw;
}
#MOVIE h2 span {
position: relative;
padding-left: 10.667vw;
height: 100%;
}
#MOVIE h2 img.new {
transform: translateY(-50%);
position: absolute;
left: 0;
top: 50%;
width: 8vw;
height: 8vw;
}
#MOVIE p {
font-size: 3.733vw;
line-height: 1.36;
text-align: center;
}
@media screen and (min-width: 768px) {
	#MOVIE .cont {
	padding-bottom: 160px;
	}
	#MOVIE .image {
	background: none;
	background-size: cover;
	padding:0;
	}
	#MOVIE .image img {
	width: 720px;
	}
	#MOVIE .pack {
	padding: 25px 0 0 0;
	}
	#MOVIE h2 {
	margin-bottom: 22px;
	}
	#MOVIE h2 img {
	height: 47px;
	}
	#MOVIE h2 span {
	padding-left: 85px;
	}
	#MOVIE h2 img.new {
	width: 60px;
	height: 60px;
	}
	#MOVIE p {
	font-size: 15px;
	}
}