#banner , #banner .item {position: relative;z-index: 1;overflow: hidden;}
#banner .Img{position:relative;}
#banner .Img:after{content:'';width: 100%;height: 220px;position: absolute;bottom: 0;left: 0;background: url(/images/37/bn-img.png) no-repeat;opacity: .8;z-index: 40;}
#banner .item:after{content:'';width: 1px;position: absolute;right: 9vw;bottom: 0;height: 18vh;background: #fff;opacity: .5;}
#banner .item:before{content:'';width: 9vw;position: absolute;right: 0;bottom: 0;height: 18vh;background: var(--primary);z-index: 3;}
#banner .item a { position: absolute; width: 100%; height: 100%; background: rgb(31 31 31 / .3); top: 0; left: 0; z-index: 2; }
#banner .info {position: absolute;bottom: 30vh;left: 22vw;z-index: 3;}
#banner .info h3 {display: block;line-height: 125%;font-size: 65px;font-weight: 300;color: #fff;font-family: "Cormorant Garamond", serif;letter-spacing: 1px;}
#banner .info p {margin-top: 20px;font-weight: 400;color: #fff;font-size: 21px;letter-spacing: 3px;}
#banner .img { position: relative; width: 100vw; height: 100vh; background: no-repeat 50% / cover; }
#banner .img img , #banner .img video , #banner .img iframe {position: absolute;width: 125vw;height: 120vh;left: -20%;top: -70px;}
#banner .item:after{position:absolute;width:100%;height:100vh;background: linear-gradient(to bottom, rgb(0 0 0 / 0%) 80%, rgb(0 0 0 / 40%) 100%);top:0;left:0;z-index: 5;content:"";opacity:.7;}
#banner .item:before{position:absolute;width:100%;height:100vh;background: linear-gradient(to top, rgb(0 0 0 / 0%) 50%, rgb(0 0 0 / 40%) 100%);top:0;left:0;z-index: 5;content:"";opacity:.7}
#banner .itemBox { justify-content: space-between; align-items: center; display: grid; grid-template-columns: 22% 78%; }
#banner .itemBox .bannerTxt { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-around; height: 100vh; }
#banner .bannerTxt .textBox,#banner .bannerTxt .bannerlogo { top: -30px; position: relative; }
#banner .bannerTxt .textBox .h3 { text-align: center; letter-spacing: 5px; margin-bottom: 10px; font-size: 18px; }
#banner .bannerTxt .textBox .decoTitle { font-family: "Cormorant Garamond",serif; color: #606060; letter-spacing: 1px; }
#banner .itemBox .textbtn { display: flex; justify-content: center; align-items: center; gap: 15px; }
#banner .itemBox .textbtn a { font-size: 16px; position: relative; color: #fff; padding: 24px 8px; letter-spacing: 9px; writing-mode: vertical-rl; background: var(--secondary); border-radius: 100px; display: flex; flex-direction: row; align-items: center; justify-content: center; }
#banner .itemBox .textbtn a.btn{border: 1px solid #baad9c;background: var(--white);color: #83725b;}

/* scrolldown */
#scrolldown {position: absolute;padding: 0 0 25px 10px;letter-spacing: .2em;font-weight: 100;font-size: 16px;color: #fff;white-space: nowrap;bottom: 2%;left: 27vw;animation: godown 1s infinite linear;-webkit-animation: godown 1s infinite linear;font-family: "Cormorant", serif;z-index: 50;}

@-webkit-keyframes banerBg { 0% { -webkit-transform: scale(1); } 100% { -webkit-transform: scale(1.1); } }
@keyframes banerBg { 0% { transform: scale(1); } 100% { transform: scale(1.1); } }

@-webkit-keyframes godown { 0% , 100% { padding: 0 0 25px 10px; } 50% { padding: 10px 0 15px 10px; } }
@keyframes godown { 0% , 100% { padding: 0 0 25px 10px; } 50% { padding: 10px 0 15px 10px; } }

@media screen and (max-width: 1440px){
	#banner .bannerTxt .bannerlogo { width: 140px; }
}
@media screen and (max-width: 1280px){
	#banner .itemBox .bannerTxt { display: none; }
	#banner:after,#banner .item:after,#banner .item:before { display: none; }
	#banner .itemBox { display: flex; flex-direction: column; align-items: center; width: 100%; }
	#banner .Img { width: 100%; }
	#banner { padding-top: 90px; }
	#banner .img,#banner .img video { height: 80vh; }
	#banner .img video { left: 0; top: 0; width: auto; height: 100vh; }
	#banner .info { bottom: 22vh; }
	#scrolldown { display: none; }
}
@media screen and (max-width: 980px){
    #banner .info{left: 16vw;bottom: 17vh;}
	#banner .bannerTimg img { width: 130px; }
}
@media screen and (max-width: 640px){
    #banner .img{height: 60vh;}
    #banner .info{left: 22%;bottom: 20%;}
    #banner .info p{font-size: 17px;}
    #banner .info h3{font-size: 35px;}
	#banner .img,#banner .img video { height: 50vh; }
	#banner .bannerTimg img { width: 110px; }
}