@charset "utf-8";

/* mainvisual */
#main-image{position:relative;}

.main{position:relative;overflow: hidden;display:block;height: 100vh;max-height:62.5rem;background: #000;background-position: center center;background-size:cover;background-repeat: no-repeat;display: flex;}
	@media only screen and (max-width:991px)	 {.main{height: 66vw;}}
	@media only screen and (max-width:767px)	 {.main{height: 100vh;}}
	@media only screen and (max-width:575px)	 {.main{height: 100vw;}}

.main img{position:absolute;top:0;left:0;right:0;bottom:0;max-width:inherit;max-height:inherit;width:100%;height:100%;margin:auto;font-family:'object-fit:cover;';object-fit:cover;opacity:.75;}

.main-text{
	color:#FFF;text-align: center;text-shadow:0 0 .1em #000;
	white-space: nowrap;
	display: flex;justify-content:center;align-items:center;
	position: absolute;top: 6rem;left: 0;right: 0;bottom: 0;z-index: 9;
	}
	@media only screen and (max-width:991px)	 {.main-text{top: 9vw;}}
	@media only screen and (max-width:767px)	 {.main-text{top: 7.5vw;}}
	@media only screen and (max-width:575px)	 {.main-text{top: 15vw;}}

.main-copy{background-color: rgba(0,0,0,0);padding: 0;white-space: nowrap;}
	@media only screen and (max-width:991px)	 {.main-copy{}}
	@media only screen and (max-width:767px)	 {.main-copy{}}
	@media only screen and (max-width:575px)	 {.main-copy{width: 100%;}}

.main-copy h2{font-size: 4em;line-height: 1;}
	@media only screen and (max-width:991px)	 {.main-copy h2{font-size: 2.75rem;}}
	@media only screen and (max-width:767px)	 {.main-copy h2{font-size: 1.5em;}}

.main-copy h2 small{font-size: .45em;line-height: 1;display: block;font-family: 'Cormorant',serif;margin-bottom: 1em;}
	@media only screen and (max-width:991px)	 {.main-copy h2 small{font-size: .6em;}}
	@media only screen and (max-width:767px)	 {.main-copy h2 small{font-size: .75em;}}


.main-copy p{font-size: 1.125em;line-height: 1.5;margin-top: 1.5em;}
	@media only screen and (max-width:767px)	 {.main-copy p{font-size: 1em;}}





.scroll{position: absolute;top: 6rem;left: 3rem;bottom: 0;z-index: 99;display: flex;align-items:center;}
	@media only screen and (max-width:1199px)	 {.scroll{left: 2rem;}}
	@media only screen and (max-width:991px)	 {.scroll{top: 9vw;left: 1.5rem;}}
	@media only screen and (max-width:767px)	 {.scroll{display: none;}}

.scroll img{width: auto;height: auto;}

.scroll a{transform:translate(0,0);display: block;}

.scroll a:hover{transform:translate(0,1rem);}