#views,#headBan{position: relative;}


#banner {width: 100%;z-index: 3;position: relative;background-color: #a08b77;}
#banner .img{overflow: hidden;display: inline-block;transition: all 0s ease-in-out;-webkit-transition: all 0s ease-in-out;}

#banner .img:before , #banner .img:after {position: absolute;width: 100%;height: 100%;background: #251f0f;top: 0;left: 0;z-index: 1;content: "";opacity: .2;}
#banner .img:after{background: linear-gradient(to top,#1a1819 0%,rgb(26 24 25 / 0%) 30%);opacity: 1;}
/* slick-current */
#banner .slick-current .info .txt p, #banner .slick-current .info .txt h3, #banner .slick-current .info .txt h2, #banner .slick-current .info .txt p,#banner .slick-current .info .txt {opacity: 1;transition-delay: 1.5s;-webkit-transition-delay: 0.8s;-webkit-transform: translateY(5px);transform: translateY(5px);}
#banner .info .txt p {letter-spacing: 4px;font-weight: 300;}
#banner .info .txt h2{
    color: #fff;
    font-weight: 300;
    font-size: 18px;
    letter-spacing: 8px;
}
#banner .info .txt h2::before {
  content: "";
  display: block;
  width: 1px;
  height: 80px;
  margin: 15px auto;
  background-color: currentColor;
  opacity: 0.5;
}

#banner .image >a{display:block;position:relative;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;width:100%;overflow:hidden;height: 100%;-webkit-transition: all 0s ease-in-out;}
#banner .img {width: 100vw;height: 100vh;background: no-repeat 50% 0% / cover;}

#banner img {position: relative;width: 100vw;height: 100vh;}
#banner .pos_abs {width: 100vw;height: 100vh;top: 0;left: 0;}
#banner .info {padding-bottom: 10vh;height: 100vh;}
#banner .info .txt {display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;-webkit-box-pack: center;justify-content: center;padding: 0px 0px 0px;z-index: 8;width: 80%;height: 50%;margin: auto;position: absolute;top: 0;left: 0;right: 0;bottom: 20px;align-items: center;}
#banner .info .txt h3, #banner .info .txt p,#banner .info .txt {font-weight: 200;color: var(--white);opacity: 0;-webkit-transform: translateY(35px);transform: translateY(35px);}
#banner .info .txt h3 form {letter-spacing: 6px;font-size: 47px;line-height: 90%;margin-bottom: 20px;color: #ffffff;font-family: 'Cardo',serif;font-weight: 100;position: relative;text-align: center;text-transform: uppercase;}
#banner .info .txt h3 form:nth-child(2):before{
    width: 410px;
    left: -20px;
}

#banner .info .txt article{text-align: center;font-family: 'Roboto', sans-serif;font-size: 22px;font-weight: 600;text-transform: uppercase;}
#banner .info .txt p {font-size: 20px;letter-spacing: 15px;text-align: left;font-weight: 300;letter-spacing: 6px;margin-bottom: 30px;}
#banner a.pos_abs {z-index: 12;}

#banner .circle {bottom: 0;left: 90px;z-index: 10;width: 140px;height: 140px;top: auto;}
#banner .circle span {height: 26px;background-image:url(/images/39/BN_more_shape.png);background-repeat:no-repeat;position:absolute;left: -50px;top: 40%;width: 122px;}

#banner .circle svg{fill: #fff;stroke: #fff;}

#banner .circle svg{-webkit-animation: apple_circle 50s linear infinite;animation: apple_circle 50s linear infinite;}

@-webkit-keyframes apple_circle {
	0%,100% {transform: rotate(0);-webkit-transform: rotate(0);-moz-transform: rotate(0);-ms-transform: rotate(0);-o-transform: rotate(0);}
	50% {transform: rotate(1turn);-webkit-transform: rotate(1turn);-moz-transform: rotate(1turn);-ms-transform: rotate(1turn);-o-transform: rotate(1turn);}
}
@keyframes apple_circle {
	0%,100% {transform: rotate(0);-webkit-transform: rotate(0);-moz-transform: rotate(0);-ms-transform: rotate(0);-o-transform: rotate(0);}
	50% {transform: rotate(1turn);-webkit-transform: rotate(1turn);-moz-transform: rotate(1turn);-ms-transform: rotate(1turn);-o-transform: rotate(1turn);}
}

.section1-dots-line {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    width: 100%;
    position: absolute;
    bottom: 100px;
    z-index: 100;
}

.section2-dots-line,.section3-dots-line {
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    height: 100%;
    width: 1px;
    position: absolute;
    left: 200px;
    z-index: 130;
    top: 0;
}
.section3-dots-line{
    left: auto;
    right: 200px;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    border-left: 0px solid rgba(255, 255, 255, 0.2);
}

/* scrollBtn */
#scrollBtn{position:absolute;align-items:center;letter-spacing:.3em;font-weight:300;font-size:12px;color:#000;left: 80px;white-space:nowrap;transform:rotate(90deg);transform-origin:top left;display:flex;bottom: 110px;padding:0px 10px;animation:godown 1s infinite linear;-webkit-animation:godown 1s infinite linear;text-transform:uppercase;z-index:10;display: none;}
#scrollBtn span{color: #000;font-size:12px;padding:13px;letter-spacing:2px}
#scrollBtn::after{content:"";width: 70px;height:1px;display:block;background: #000;margin:0px 0px}
@-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 0px 0px; } 50% { padding: 0px 0 0px 0px; } }
@keyframes godown { 0% , 100% { padding: 0px 0 0px 0px; } 50% { padding: 0px 0 0px 10px; } }


/* slick-dots */
#banner .slick-dots {width: auto;height: 90%;display: flex !important;flex-direction: column;justify-content: flex-end;top: 0;left: 0;position: absolute;}
#banner .slick-dots li {margin: 8px 40px;width: 10px;height: 10px;opacity: .1;}
#banner .slick-dots li.slick-active {opacity: 1;}
.Banner-search{width: 980px;color: #fff;position: absolute;z-index: 100;bottom: 0;left: 50%;transform: translate(-50%, 40%);-webkit-filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.13));filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.13));}

@media screen and (max-width: 1660px){
	#banner .info .txt{width: 75%;height: 60%;}
	#banner .circle{width: 110px;height: 110px;left: 100px;}
	#banner .slick-current .info .txt h2::before{height: 50px;}
    #banner .info .txt h3 form:before{width: 360px;}
    #banner .info .txt h3 form:nth-child(2):before{width: 340px;}
	#banner .info .txt h3 form{font-size: 38px;letter-spacing: 4px;margin-bottom: 14px;}
	#banner .info .txt p{/* margin-left: 130px; */margin-bottom: 20px;}
	#banner img{width:100%;height: 100%;background:no-repeat 50% / cover}

}

@media screen and (max-width: 1366px){
	#banner .info .txt{width: 75%;height: 30%;}
    #banner .circle{width: 80px;height: 80px;left: 80px;}
	#banner .circle span{width: 92px;background-size: contain;}
    #banner .info .txt h3 form:before{width: 300px;}
    #banner .info .txt h3 form:nth-child(2):before{width: 300px;}
	#banner .info .txt h3 form{/* font-size: 70px; */letter-spacing: 1px;margin-bottom: 10px;}
	#banner .info .txt p{/* margin-left: 90px; */font-size: 15px;}
	#banner img{width:100%;height:100%;background:no-repeat 50% / cover}
    #banner .slick-current .info .txt p{}
}
@media screen and (min-width: 1281px){
    #banner .img .ImgBorder{position:absolute;bottom: 20px;left: 70px;width: calc(100% - 180px);height: calc(100% - 140px);padding: 20px;z-index: 10;}
	#banner .img .ImgBorder .dashed{position:relative;width:100%;height: 100%;}
	#banner .img .ImgBorder .dashed::before,#banner .img .ImgBorder .dashed::after{content:"";position:absolute;height: 90%;width:100%;-webkit-transform-origin:center;transform-origin:center;opacity:1;-webkit-transition:all 0.7s ease-in-out;transition:all 0.7s ease-in-out}
	#banner .img .ImgBorder .dashed::before{border-right: 1px solid rgb(255 255 255 / 25%);-webkit-transform: scale3d(0,1,1);transform: scale3d(0,1,1);-webkit-transform: scale3d(1,1,1);transform: scale3d(1,1,1);opacity: 0.7;bottom: 0;height: 100%;}
	#banner .img .ImgBorder .dashed::after{border-left: 1px solid  rgb(255 255 255 / 25%);-webkit-transform: scale3d(0,1,1);transform: scale3d(0,1,1);-webkit-transform: scale3d(1,1,1);transform: scale3d(1,1,1);opacity: 0.7;bottom: 0;height: calc(100% - 40px);}
	#banner .img .ImgBorder::before,#banner .img .ImgBorder::after{content:"";position:absolute;height: 100%;width: 100%;-webkit-transform-origin:center;transform-origin:center;opacity:1;-webkit-transition:all 0.7s ease-in-out;transition:all 0.7s ease-in-out}
	#banner .img .ImgBorder::before{border-top: 1px solid  rgb(255 255 255 / 25%);-webkit-transform:scale3d(1,0,1);transform:scale3d(1,0,1);-webkit-transform: scale3d(1,1,1);transform: scale3d(1,1,1);opacity: 0.7;width: calc(100% - 320px);height: 0;right: 20px;}
	#banner .img .ImgBorder::after{border-bottom: 1px solid rgb(255 255 255 / 25%);-webkit-transform: scale3d(1,0,1);transform: scale3d(1,0,1);-webkit-transform: scale3d(1,1,1);transform: scale3d(1,1,1);opacity: 0.7;width: calc(100% - 40px);height: 0;right: 20px;}

}
@media screen and (max-width: 1280px){
	#banner img{width:100%;height:100%}
	#scrollBtn{display:none}
	#banner .info .txt{width: 75%;height: 30%;bottom: 180px;}

	.section2-dots-line{
    left: 80px;
}
	.section3-dots-line{
    right: 80px;
}
}
@media screen and (max-width: 1140px){
	#banner .info .txt{bottom: 280px;}
	#banner .info .txt{height: 30%;-webkit-transform: translate(0%, 0%);transform: translate(0%, 0%);bottom: 0;top: -130px;left: 0;width: 50%;}
	#banner img {height: 80vh;margin: 60px auto 0px 0px;object-position: 50% 50%;}
	.Banner-search{width: 90%;}
}
@media screen and (max-width: 768px){
#banner .img,#banner .info {height: 80vh;}
	#banner .info{
    padding-bottom: 20vh;
}
}
@media screen and (max-width: 580px){
	#banner .info .txt{height: 45%;-webkit-transform: translate(0%, 0%);transform: translate(0%, 0%);width: 90%;}
	#banner .info .txt h3 form{font-size: 27px;}
    #banner .info .txt h3 form:before{width: 210px;}
    #banner .info .txt h3 form:nth-child(2):before{width: 240px;}
    #banner .circle{width: 70px;height: 70px;left: 50px;}
	#banner .circle span{width: 72px;left: -30px;}
	.section1-dots-line,.section2-dots-line,.section3-dots-line{
    display: none;
}
}