@charset "UTF-8";

.layer_main figure::after{display: none;}
.layer_main_tit{bottom: -0.1em;}

#contents{padding: 0;font-family: YakuHanMP, "EB Garamond", "Zen Old Mincho", serif;}
#contents figure{overflow: hidden;}
#contents figure img{width: 100%;}
.img_contents figure img{animation-name: img_scale;animation-duration: 3s;}
.img_contents .copy h3{font-size: 1.2em;letter-spacing: 0.1em;}
.img_contents .copy h3 small{font-size: 0.83em;display: block;}
.img_contents .copy h3 + p{font-size: 0.75em;margin-top: 0.5em;}

#entrance_hall .copy{color: #fff;background: #000;padding: 0.1em 0 5em;text-align: center;font-size: 1.5em;}
#entrance_hall .copy h3{margin-top: -4em;}
#entrance_hall .copy h3 small{font-size: 1.2em;letter-spacing: 0.2em;animation-name: fadeIn;}
#entrance_hall .copy h3 i{width: 2px;height: 3em;background: #fff;display: block;margin: 0.5em auto;animation-name: scale_y_t;}
#entrance_hall .copy h3 span{animation-name: fadeIn;}

#entrance_approach .copy{color: #fff;background: #000;padding: 0.1em 0 5em;text-align: center;font-size: 1.5em;}
#entrance_approach .copy h3{margin-top: -4em;}
#entrance_approach .copy h3 small{font-size: 1.2em;letter-spacing: 0.2em;animation-name: fadeIn;}
#entrance_approach .copy h3 i{width: 2px;height: 3em;background: #fff;display: block;margin: 0.5em auto;animation-name: scale_y_t;}
#entrance_approach .copy h3 span{animation-name: fadeIn;}

/*　#entrance_approach .copy{color: #fff;position: absolute;left: 5%;bottom: 8%;animation-duration: 2s;animation-name: fadeInLeft;}　*/

#appearance{background: url("../img/appearance_bk.webp") no-repeat center center/cover;}
.appearance_item{display: flex;justify-content: space-between;padding-top: 3.5em;width: calc(50vw + 25em - 10px);margin-right: calc(-50vw - 25em - 10px);overflow: hidden;}
.appearance_item > .copy{align-self: center;animation-name: fadeInLeft;}
.appearance_item > .copy h3{font-size: 1.8em;letter-spacing: 0.05em;}
.appearance_item > .copy h3 + p{font-size: 1.2em;letter-spacing: 0.05em;margin-top: 0.5em;}
.appearance_item > figure{align-self: flex-end;width: 32.25em;margin-right: 5em;animation-name: fadeInUpPlus;animation-duration: 3s;}

#view{padding-bottom: 0;}
#view h3{text-align: center;font-size: 1.8em;}
#view h3 span{font-size: 1.3em;display: block;color: #584d10;font-weight: 200;font-family: YakuHanMP, "EB Garamond", "Zen Old Mincho", serif;}
#view h3 + p{font-size: 1.2em;margin-top: 1em;letter-spacing: 0.05em;text-align: center;}
#view .view_img_wrap{height: 31.5em;margin-top: 2em;}
#view .view_img_wrap figure{overflow-x: auto;overflow-y: hidden;height: 31.5em;cursor: grab;}
#view .view_img_wrap figure img{max-width: none;width: auto;height: 31.5em;user-select: none;-webkit-user-drag: none;pointer-events: none;}
#view .view_img_wrap figure:active {cursor: grabbing;}
#view .view_img_wrap .cap_into{bottom: 1.8em;}
#view .view_img_wrap .drug{width: 16em;background: rgba(255,255,255,0.6);text-align: center;display: flex;justify-content: center;align-items: center;height: 2.5em;position: absolute;inset :0;margin: auto;}
#view .view_img_wrap .drug::before{content: "";width: 1.6em;height: 1.4em;background: url("../img/drag_icon.png") no-repeat center center/contain;display: inline-block;margin-right: 0.5em;}
#view .view_img_wrap .drug span{letter-spacing: 0.05em;font-size: 0.8em;}

#landplan{padding-bottom: 0;}
#landplan h3{text-align: center;font-size: 1.8em;}
#landplan h3 span{font-size: 1.3em;display: block;color: #584d10;font-weight: 200;font-family: YakuHanMP, "EB Garamond", "Zen Old Mincho", serif;}
#landplan h3 + p{font-size: 1.2em;margin-top: 1em;letter-spacing: 0.05em;text-align: center;}
#landplan .landplan_img{width: 28.75em;margin: 2em auto 0;}
#landplan .landplan_img .cap_out{padding-right: 3em;}
#landplan .landplan_note{width: 12.65em;position: absolute;left: 1em;bottom: 0;}
#landplan .landplan_list{margin: 2em auto 0;}
#landplan .landplan_list .item{display: flex;flex-direction: column;}
#landplan .landplan_list .item h4{font-size: 0.9em;color: #7c6b58;padding-left: 1.6em;}
#landplan .landplan_list .item h4 i{display: inline-flex;justify-content: center;align-items: center;width: 1.3em;height: 1.3em;margin-right: 0.3em;color: #fff;background: #7b7349;position: absolute;left: 0;top: 0.1em;}
#landplan .landplan_list .item h4 + p{font-size: 0.75em;margin: 0.3em 0 1em;line-height: 1.3;}
#landplan .landplan_list .item h4 + p + figure{margin-top: auto;}

@media only screen and (min-width: 3646px){
#view .view_img_wrap .drug{display: none;}
#view .view_img_wrap{height: auto;}
#view .view_img_wrap figure{overflow-x: hidden;overflow-y: hidden;height: auto;cursor: auto;}
#view .view_img_wrap figure img{max-width: 100%;width: 100%;height: auto;}
#view .view_img_wrap figure:active {cursor: auto;}
#view .view_img_wrap .drug{display: none;}
}

@media only screen and (min-width: 1921px){
.appearance_item > figure{width: 33.6vw;}
}

@media only screen and (min-width: 769px) and (max-width: 1600px){
.appearance_item{font-size: 1.25vw;}
}

@media only screen and (min-width: 769px){
#landplan .landplan_list{display: flex;justify-content: space-between;flex-wrap: wrap;gap: 2em 0;width: 45em;}
#landplan .landplan_list .item{width: 12em;}
#landplan .landplan_list .item:nth-of-type(3n-1){animation-delay: 0.2s;}
#landplan .landplan_list .item:nth-of-type(3n){animation-delay: 0.4s;}
}

@media only screen and (max-width: 768px){
.img_contents figure{height: 100vw;}
.img_contents figure img{object-fit: cover;width: 100%;height: 100%;animation-name: img_scale;animation-duration: 3s;}

#entrance_hall .copy{padding: 0.1em 0 3.5em;font-size: 0.9em;}
#entrance_hall .copy h3 small{font-size: 1.15em;}
#entrance_hall .copy h3 + p{font-size: 0.85em;}

#entrance_approach .copy{padding: 0.1em 0 3.5em;font-size: 0.9em;}
#entrance_approach .copy h3 small{font-size: 1.15em;}
#entrance_approach .copy h3 + p{font-size: 0.85em;}

/*　#entrance_approach .copy{font-size: 0.89em;left: 0;padding: 0 1.5em;bottom: 5%;text-shadow: 0 0 0.2em #000,0 0 0.2em #000;}　*/

#appearance .contents_wrap{overflow: hidden;}
.appearance_item{flex-wrap: wrap;padding-top: 1.7em;width: 100%;margin-right: 0;overflow: visible;}
.appearance_item > .copy h3{font-size: 1.4em;}
.appearance_item > .copy h3 + p{font-size: 1em;}
.appearance_item > figure{width: 100%;margin: 1em 0 0 0;}

#view h3{font-size: 1.4em;}
#view h3 + p{font-size: 1em;}
#view .view_img_wrap{height: 80vw;}
#view .view_img_wrap figure{height: 80vw;}
#view .view_img_wrap figure img{height: 80vw;}
#view .view_img_wrap .cap_into{bottom: 0.5em;}

#landplan h3{font-size: 1.4em;}
#landplan h3 + p{font-size: 1em;}
#landplan .landplan_img{width: 100%;}
#landplan .landplan_img .cap_out{padding-right: 0.5em;}
#landplan .landplan_note{width: 11em;left: 0.5em;}
#landplan .landplan_list.sp_slide .slick-dots li{width: 1.5em;}
#landplan .landplan_list.sp_slide .slick-arrow{top: 40vw;}

}