/* banner */
#banner {z-index: 3;width: 100vw;height: 100vh;}
#banner .item {height: 100vh;}
#banner .item .clip >* { min-width: 100vw; width: 100vw; }
#banner .item .clip iframe {position: absolute;wi;width: 100%;height: 120%;top: -20px;left: 0;}
#banner .item .clip video {overflow: hidden;position: absolute;height: auto;width: 100%;top: 50%;left: 50%;transform: translate(-50%, -55%);-webkit-transform: translate(-50%, -55%);}
#banner .item .info{background: rgb(0 0 0 / 20%);width: 100vw;height: 100vh;}
#banner .item .info >div {margin: auto auto 2%;width: calc(100% - 60px);}
#banner .item .info >div .txt {-webkit-transition-delay: .2s;transition-delay: .2s;text-align: center;}
#banner .item .info >div .txt:nth-child(2) { -webkit-transition-delay: .4s; transition-delay: .4s; }
#banner .item .info >div .txt h3 {margin-bottom: 15px;line-height: 120%;font-size: 37px;font-weight: 400;letter-spacing: 9px;margin-top: 20px;}
#banner .item .info >div .txt p{font-family: "Cormorant Garamond", serif;font-size: 80px;color: #c7c7c7;opacity: .2;line-height: 1.3;}

@media screen and (max-width: 1680px){
	#banner .item .clip iframe{top: -90px;}

}

@media screen and (max-width: 1366px){
	#banner .item .info >div .txt h3{font-size: 24px;}
	#banner .item .info >div .txt p{font-size: 46px;}

}

@media screen and (max-width: 1280px){
	#banner .item .info >div .txt h3{font-size: 24px;}
	#banner .item .info >div .txt p{font-size: 46px;}
	#banner .item .clip video{height: 100%;width:auto;}
	#banner .item .info >div {
    margin: auto auto 5%;
}
}
@media screen and (max-width: 1024px){
	#banner .item .clip iframe{top: -160px;width: 110%;}
	#banner, #banner .item{height:80vh}
}
@media screen and (max-width: 768px){
	#banner .item .clip iframe{top: -290px;width: 140%;left: -20%;}
	#banner, #banner .item, #banner .item .clip video,#banner .item .info {height: 52vh;}
#banner .item .clip video {
    top: 0;
    transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
}
}
@media screen and (max-width: 640px){
	#banner{margin-top:66px;}
	#banner, #banner .item, #banner .item .clip video,#banner .item .info {height: 35vh;}
	#banner .item .clip iframe{top: -37%;width: 105%;left: -2.5%;height: 100%;}
	#banner .item .info >div .txt h3{font-size: 25px;letter-spacing: 2px;font-weight: 400;line-height: 160%;word-spacing: 100vw;max-width: 100%;}
	#banner .item .info >div .txt p{font-size: 34px;}
	#banner .item .info >div{margin-bottom: 0;background: var(--black);width: 100%;}
}