

	.section{position: relative;}
	/* bg-color */
	.sec1{background: linear-gradient( to bottom, #000, #232323);}
	.sec2{background: linear-gradient( to top, #000 20%, #232323);}
	.sec3{background: linear-gradient( to bottom, #000, #232323);}
	.sec4{background: linear-gradient( to top, #000, #232323);}
	.sec5{background: url(../img/main_sec5_img1.jpg) no-repeat left bottom / 100%;}





	#fp-nav{right:50px; transform: translateX(50%);}
	#fp-nav a span{border-radius: 0 !important; background:#fff !important; opacity: .5;}
	#fp-nav a.active span,#fp-nav a:hover span{opacity: 1; background:var(--color1) !important;}
	#fp-nav a::before{position: absolute; content:''; right:calc(100% + 10px); top:50%; transform: translateY(-50%); width:0; height:1px; background:var(--color1); transition: all .3s ease; opacity: 0;}
	#fp-nav a.active::before,#fp-nav a:hover::before{width:25px; opacity: 1;}
	#fp-nav a::after{position: absolute; right:calc(100% + 25px); top:50%; transform: translateY(-50%); text-align: right; font-family: 'Poppins', sans-serif; opacity: 0; visibility: hidden; transition: all .3s ease; color:#fff; white-space: nowrap;}
	#fp-nav a.active::after, #fp-nav a:hover::after{right:calc(100% + 45px); opacity: 1; visibility: inherit;  color:var(--color1);}
	#fp-nav li:nth-child(1) a::after{content:'INDEX';}
	#fp-nav li:nth-child(2) a::after{content:'CARLAND RG';}
	#fp-nav li:nth-child(3) a::after{content:'CAFE RG';}
	#fp-nav li:nth-child(4) a::after{content:'NEWS';}
	#fp-nav li:nth-child(5) a::after{content:'CONTACT';}
	#fp-nav li:nth-child(6) a::after{content:'FOOTER';}


	.bg_line{position: absolute; content:''; left:50%; top:0; transform: translate(-50%,0); width:calc(100% - 200px); height:100%;}
	.bg_line i{position: absolute; width:1px; height:100%; background:rgba(255, 255, 255, .1);}
	.bg_line i:nth-child(1){left:0; --i:1;}
	.bg_line i:nth-child(2){left:20%; --i:5;}
	.bg_line i:nth-child(3){left:40%; --i:16;}
	.bg_line i:nth-child(4){left:60%; --i:7;}
	.bg_line i:nth-child(5){left:80%; --i:2;}
	.bg_line i:nth-child(6){left:100%; --i:13;}

	.bg_video{position: absolute; width:100%; height:100%; left:0; top:0;}

	/* sec1 */
	.sec1::before{position: absolute; left:0; top:0; content:''; width:100%; height:100%; background:url(../img/sec1_dot.png) no-repeat left bottom / 100%;}
	.sec1 .swiper{width:100%;height:100%;}
	.sec1 .swiper-slide{position: relative; display: flex; justify-content: flex-end; padding:100px 100px 0;}
	.sec1 .swiper-slide .img_box{display: flex; align-items: center; justify-content: center;  width:calc(80% + 100px); height:100%; transform: translateX(100px); overflow: hidden;}
	.sec1 .swiper-slide .img_box span{display: flex; align-items: center; justify-content: center; width:100%; height:100%;}
	.sec1 .swiper-slide .img_box span img{width:auto; max-width:none; height:100%;}
	.sec1 .swiper-slide-active .img_box span{animation: sec1_ani 6000ms linear forwards;}
	@keyframes sec1_ani { from{transform: scale(1.2);} to{transform: scale(1.05);} }
	.sec1 .swiper-slide .txt_box{position: absolute; left:200px; top:200px; z-index: 10; color:#fff; opacity: 0;}
	.sec1 .swiper-slide .page_bar{display: flex; align-items: center; gap:25px; opacity: 0; transition: all .3s ease;}
	.sec1 .swiper-slide .page_bar span{opacity: .5; transition: all .3s ease; line-height: 1;}
	.sec1 .swiper-slide .page_bar span.on{opacity: 1; font-weight: 500; color:var(--color1);}
	.sec1 .swiper-slide .page_bar i{position: relative; width:100px; height:3px; background:rgba(255, 255, 255, .25);}
	.sec1 .swiper-slide .page_bar i::before{position: absolute; content:''; left:0; top:0; width:0; height:100%; background:var(--color1);}
	.sec1 .swiper-slide-active .page_bar i::before{animation: page_bar 4500ms linear forwards;}
	@keyframes page_bar { 0%{width:0;} 100%{width:100%;} }
	.sec1 .swiper-slide .txt_box h2{font-size:55px; font-weight: 100; letter-spacing: 8px; margin:20px 0 30px; color:#f7f7f7; transform: translateX(-100px); transition: all 1s ease; filter: blur(10px);}
	.sec1 .swiper-slide .txt_box h2 span{font-weight: 700; color:var(--color1)}
	.sec1 .swiper-slide .txt_box p{font-size:18px; line-height: 1.8; opacity: .6; transform: translateX(-100px); transition: all 1s ease; transition-delay: .1s; filter: blur(10px);}
	.sec1 .btn_group{position: absolute; z-index: 10; width:calc(100% - 200px); left:100px; bottom:50px;}
	.sec1 .btn_group > div{margin-left:calc(20% + 50px); display: flex; gap:25px;}
	.sec1 .btn_group .prev, .sec1 .btn_group .next{display: flex; align-items: center; justify-content: center;cursor: pointer; transition: all .3s ease;}
	.sec1 .btn_group .prev{opacity: .5;}
	.sec1 .btn_group .prev:hover{opacity: 1;}
	.sec1 .btn_group svg{width:50px; height:50px; color:#f7f7f7;}
	.sec1 .swiper-slide-active .page_bar{opacity: 1;}
	.sec1 .swiper-slide-active .txt_box{opacity: 1;}
	.sec1 .swiper-slide-active .txt_box h2{transform: translateX(0); filter: blur(0);}
	.sec1 .swiper-slide-active .txt_box p{transform: translateX(0); filter: blur(0);}
	@media(max-width:1440px){
        .sec1 {height:100vh !important;}
        .sec1 .fp-tableCell{display: block !important;}
		.sec1 .swiper-slide .txt_box h2,.sec1 .swiper-slide .txt_box h2 span{font-size:54px; letter-spacing: 0;}
		.sec1 .swiper-slide .txt_box h2 span{font-weight: 500;}
        .sec1 .btn_group svg{width:40px; height:40px;}
	}
	
	@media(max-width:1024px){

		.sec1 .swiper-slide{padding:80px 5% 0;}
		.sec1 .swiper-slide .txt_box{left:5%;}
        .sec1 .btn_group{width:95%; left:50%; bottom:30px; transform: translateX(-50%);}
        .sec1 .btn_group > div{justify-content: flex-end; margin:0 auto;}
	}
	
	@media(max-width:768px){
		.sec1 .swiper-slide{padding:0;}
		.sec1 .swiper-slide .img_box{width:100%; height:100%; transform: translate(0,0);}
		.sec1 .btn_group svg{width:30px; height:30px;}
        
	}
	
	@media (max-width:650px) {
		.sec1 .swiper-slide .txt_box h2,.sec1 .swiper-slide .txt_box h2 span{font-size:44px; letter-spacing: 0; line-height: 1;}
		.sec1 .swiper-slide .txt_box p{font-size:14px;}
	}

	@media(max-width:425px){
		.sec1 .swiper-slide .txt_box h2,.sec1 .swiper-slide .txt_box h2 span{font-size:34px; letter-spacing: 0; line-height: 1.2;}
	}


	/* sec2 */
	.sec2{position: relative; overflow: hidden;}
	.sec2 .bg_line{opacity: .5;}
	.sec2 .bg_line i::after{position: absolute; content:''; left:0; top:-100%; width:1px; height:100px; background: linear-gradient( to top, var(--color1), transparent); animation: bg_line 5000ms linear infinite; animation-delay: calc(var(--i) * -.125s); opacity: .5;}
	@keyframes bg_line { from{top:-100%;} to{top:100%;} }
	.sec2 .container{position: relative; width:calc(100% - 200px); height:100%; margin:0 auto; transform: translateY(-40px);}
	.sec2 .swiper{width:100%; height:100%;}
	.sec2 .swiper-slide{display: flex; align-items: center;}
	.sec2 .swiper-slide .content{display: flex; width:100%; position: relative;}
	.sec2 .swiper-slide .img_box{position: relative;  display: flex; height:450px; padding-top:50px; overflow: hidden; transition: all .3s ease;}
    .sec2 .swiper-slide .img_box img{width:100%;}
	.sec2 .swiper-slide .img_box::after{position: absolute; content:''; left:0; bottom:0; width:100%; height:100%; background: linear-gradient( to top, #000, transparent); display: none;}
	.sec2 .swiper-slide .img_box span{display: flex; align-items: flex-end; overflow: hidden;}
	.sec2 .custom-slide-center .img_box{padding:0;}
	.sec2 .text_box{position: absolute; left:50%; transform: translateX(-50%); bottom:50px; z-index: 10; width:100%;}
	.sec2 .text_box h2{font-size:72px;  color:#f7f7f7; text-align: center; line-height: 1; position: relative;}
	.sec2 .text_box p{font-size:18px; text-align: center; color: #f7f7f7; line-height: 1.6;}
	.sec2 .btn_group{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); content:''; height:0; z-index: 10; width:calc(60% - 80px);}
	.sec2 .btn_group div{color:#fff; opacity: .5; transition: all .3s ease;}
	.sec2 .btn_group div:hover{opacity: 1;}
    @media(max-width:1440px){
        .sec2 .text_box h2{font-size:56px;}
        .sec2 .text_box p{font-size:16px;}
        .sec2 .swiper-slide .img_box{height:auto;}
    }
    
    @media(max-width:1024px){
        .sec2 {height:auto !important;}
        .sec2 .fp-tableCell{display: block !important; height:auto !important;}
        .sec2 .container{width:95%; padding:100px 0;}
        .sec2 .btn_group{width:calc(75% - 60px);}
        .sec2 .swiper-button-next::after, .sec2 .swiper-button-prev::after{font-size:24px;}
        .bg_line{width:95%;}
    }
    
    @media(max-width:768px){
        .sec2 .container{display: flex; flex-direction: column; padding:80px 0;}
        .sec2 .text_box{order:1; position: relative; left:0; top:0; bottom:0; right:0; transform: none; margin-bottom:30px;}
        .sec2 .swiper{order:2;}
        .sec2 .text_box h2{font-size:46px;}
        .sec2 .text_box p{font-size:14px;}
        .sec2 .btn_group{width:100%;}
        
    }
    
    @media(max-width:425px){
        .sec2 .container{padding-bottom:0;}
        .sec2 .swiper-slide .img_box{height:500px;}
        .sec2 .swiper-slide .img_box img{max-width:none; width:auto; height:100%;}
		.sec2 .text_box h2{font-size:38px;}
    }


	/* sec3 */
	.sec3 .container{position: relative; width:calc(100% - 200px); height:100vh; margin:0 auto;}
	.sec3 .bg_line i::after{position: absolute; content:''; left:0; top:-100%; width:1px; height:100px; background: linear-gradient( to top, var(--color1), transparent); animation: bg_line 5000ms linear infinite; animation-delay: calc(var(--i) * -.125s); opacity: .5;}
	.sec3 .bg_line i:nth-child(1), .sec3 .bg_line i:nth-child(2), .sec3 .bg_line i:nth-child(3), .sec3 .bg_line i:nth-child(4){display: none;}
	.sec3 .swiper{margin:0; overflow: hidden;}
	.sec3 .swiper-slide{overflow: hidden;}
	.sec3 .sec3_swiper{width:100%; height:100%;}
	.sec3 .sec3_swiper .swiper-slide{display: flex; width:100%; height:100%;}
	.sec3 .sec3_swiper .swiper-slide .img_box{position: relative; display: flex; align-items: center; justify-content: center; width:60%; height:100%;}
	.sec3 .sec3_swiper .swiper-slide .img_box::after{position: absolute; left:50%; bottom:0; transform: translate(-50%,0); content:''; width:100%; height:60%; background: linear-gradient( to top, #000, transparent); display: none;}
	.sec3 .sec3_swiper .swiper-slide img{width:100%;}
	.sec3 .sec3_swiper .swiper-slide .txt_box{width:40%; color:#f7f7f7; padding:200px 0 0 75px; transform: translateX(100px); opacity: 0; filter: blur(5px); transition: all .75s ease; word-break: keep-all;}
	.sec3 .sec3_swiper .swiper-slide .txt_box h2{font-size:48px; font-weight: 300; margin-bottom:25px;}
	.sec3 .sec3_swiper .swiper-slide .txt_box h2 span{font-size:1em; font-weight: 700; color:var(--color1);}
	.sec3 .sec3_swiper .swiper-slide .txt_box p{font-size:18px; opacity: .75; line-height: 1.6; word-break: keep-all;}
	.sec3 .sec3_swiper .swiper-slide-active .txt_box{transform: translateX(0); opacity: 1; filter: blur(0px);}
	.sec3 .sec3_swiper_nav{position: absolute; width:calc(40% + 200px); height:200px; right:-100px; bottom:50px;}
	.sec3 .sec3_swiper_nav .swiper-slide{display: flex; align-items: center; justify-content: center; background:#111;}
	.sec3 .sec3_swiper_nav .swiper-slide img{width:100%; opacity: .25;}
	.sec3 .sec3_swiper_nav .swiper-slide-active img{opacity: 1;}
	.sec3 .btn_group{position: absolute; left:0; top:0; height:100%; display: flex; flex-direction: column; justify-content: center; gap:20px; background: linear-gradient( to right, #111, transparent); z-index: 10;}
	.sec3 .btn_group div{position: relative; left:auto; right:auto; top:auto; bottom:auto; transform: translate(0,0); margin:0; width:50px; height:50px; color:#fff; opacity: .5; transition: all .3s ease;}
	.sec3 .btn_group div:hover{opacity: 1;}
	.sec3 .btn_group div::after{font-size:28px;}
    @media (max-width:1800px) {
        .sec3 .sec3_swiper .swiper-slide .txt_box h2{font-size:3em;}
    }
    @media(max-width:1440px){
        .sec3 .sec3_swiper .swiper-slide .img_box{width:50%; overflow: hidden;}
        .sec3 .sec3_swiper .swiper-slide .txt_box{width:50%;}
        .sec3 .sec3_swiper .swiper-slide img{max-width:none; width:auto; height:100%;}
        .sec3 .sec3_swiper_nav{width:calc(50% + 200px);}
    }
    
    @media(max-width:1024px){
        .sec3 {height:auto !important;}
        .sec3 .fp-tableCell{display: block !important; height:auto !important;}
        .sec3 .container{width:100%;}
        .sec3 .sec3_swiper .swiper-slide .txt_box{padding:150px 5% 0 30px;}
        .sec3 .sec3_swiper_nav{height:160px;}
    }
    
    @media(max-width:768px){
        .sec3 .sec3_swiper .swiper-slide .txt_box{padding:150px 5% 0 30px;}
        .sec3 .sec3_swiper .swiper-slide .txt_box h2{font-size:2.5em;}
        .sec3 .sec3_swiper .swiper-slide .txt_box p{font-size:14px;}
    }
    
    @media(max-width:550px){
        .sec3 .sec3_swiper .swiper-slide{display: flex; flex-direction: column; gap:50px; padding:100px 0 0;}
        .sec3 .sec3_swiper .swiper-slide .img_box{width:100%; order:2; height:600px;}
        
        .sec3 .sec3_swiper .swiper-slide .txt_box{width:100%; order:1; padding:0; text-align: center;}
        .sec3 .sec3_swiper_nav{display: none;}
    }


	/* sec4 */
	.sec4 .container{position: relative; z-index: 1; width:calc(100% - 200px); height:100%; margin:0 auto; display: flex; gap:100px; align-items: center;}
	.sec4 .content{width:50%; height:calc(100% - 300px); display: flex; flex-direction: column;}
	.sec4 .content .tit{margin-bottom:15px; display: flex; justify-content: space-between; align-items: flex-end;}
	.sec4 .content .tit h2{font-size:3em; color:#f7f7f7; line-height: 1;}
	.sec4 .content .tit .btn_group{display: flex; gap:15px;}
	.sec4 .content .tit .btn_group div,.sec4 .content .tit .btn_group a{display: flex; align-items: center; justify-content: center; color: #f7f7f7; opacity: .5; cursor: pointer; transition: all .3s ease; position: relative;}
	.sec4 .content .tit .btn_group div:hover,.sec4 .content .tit .btn_group a:hover{opacity: 1;}
	.sec4 .content .tit .btn_group div::after{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); content:''; width:100%; height:100%; background:transparent}
	.sec4 .content .slide_box{max-height:545px; height:100%; border-top:2px solid rgba(255, 255, 255, .5); border-bottom:1px solid rgba(255, 255, 255, .25);}
	.sec4 .content .swiper{height:100%;}
	.sec4 .swiper_news .swiper-slide{display: flex; justify-content: space-between; align-items: center; border-bottom:1px solid rgba(255, 255, 255, .05); color:#f7f7f7; transition: all .3s ease; padding:25px;}
	.sec4 .swiper_news .swiper-slide:hover{background:rgba(255, 255, 255, .05);}
	.sec4 .swiper_news .swiper-slide .text{width:calc(100% - 100px); padding:25px 25px 25px 0;}
	.sec4 .swiper_news .swiper-slide h4{font-size:1.5em; margin-bottom:15px; max-width:100%; overflow: hidden; white-space:nowrap; text-overflow: ellipsis; transition: all .3s ease;}
	.sec4 .swiper_news .swiper-slide p{font-size:1.2em; opacity: .5; max-width:100%; overflow: hidden; white-space:nowrap; text-overflow: ellipsis;}
	.sec4 .swiper_news .swiper-slide .day{display: flex; flex-direction: column; align-items: center; justify-content: center; width:100px;  border:1px solid rgba(255, 255, 255, .5);; background:rgba(255, 255, 255, .1); transition: all .3s ease; padding:10px; gap:5px;}
	.sec4 .swiper_news .swiper-slide .day span:nth-child(1){font-size:3em; font-weight: 700; line-height: 1;}
	.sec4 .swiper_news .swiper-slide:hover .day{color:var(--color1); border-color:var(--color1_50);}
	.sec4 .swiper_news .swiper-slide:hover h4{color:var(--color1);}
	.sec4 .promotion .slide_box{border-top:0;}
	.sec4 .swiper_promotion .swiper-slide{display: flex; flex-direction: column;}
	.sec4 .swiper_promotion .swiper-slide .img_box{display: flex; align-items: center; justify-content: center; overflow: hidden; height:66.6666666%;}
	.sec4 .swiper_promotion .swiper-slide .img_box img{width:100%;}
	.sec4 .swiper_promotion .swiper-slide .txt{display: flex; flex-direction: column; justify-content: center; height:33.3333333%; padding:25px; color:#f7f7f7;}
	.sec4 .swiper_promotion .swiper-slide h4{font-size:1.75em; margin-bottom:10px;}
	.sec4 .swiper_promotion .swiper-slide p{font-size:1.2em; opacity: .5;}
	.sec4 .bg_video::after{position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); content:''; width:100%; height:100%; background: linear-gradient( to bottom, #000, transparent);}
	.sec4 .bg_video video{width:100%; opacity: 1; filter: grayscale(100%) brightness(15%);}
    @media(max-width:1440px){
        .sec4 .container{gap:50px;}
        .sec4 .content .tit h2{font-size:2.5em;}
    }
    
    @media(max-width:1024px){
        .sec4 {height:auto !important;}
        .sec4 .fp-tableCell{display: block !important; height:auto !important;}
        .sec4 .container{width:95%; padding:100px 0;}
        .sec4 .content .slide_box{max-height:none; height:500px;}
        
    }
    
    @media(max-width:768px){
        .sec4 .container{flex-direction: column;}
        .sec4 .content{width:100%;}
    }
    
    @media(max-width:425px){
        .sec4 .swiper_news .swiper-slide{padding:5%;}
        .sec4 .swiper_news .swiper-slide .text{padding:0;}
        .sec4 .content .tit .btn_group div, .sec4 .content .tit .btn_group a{width:25px; height:25px;}
        .sec4 .swiper_promotion .swiper-slide .txt{padding:5%;}
    }



	/* sec5 */
	.sec5 .container{display: flex; align-items: center; width:calc(100% - 200px); height:100%; margin:0 auto; gap:100px;}
	.sec5 .content{width:50%;}
	.sec5 .info{padding:50px;}
	.sec5 .info ul{display: flex; flex-direction: column; gap:15px;}
	.sec5 .info ul li{display: flex; align-items: center;}
	.sec5 .info ul li .desc1{width:100px; font-weight: 500; color:#f7f7f7; font-size:1.5em; font-weight: 700;}
	.sec5 .info ul li .desc2{width:calc(100% - 100px); font-size:1.5em; color:#f7f7f7; opacity: .5;}
	.sec5 .contact .content_inner{width:75%; padding:50px; color:#f7f7f7; background:rgba(0, 0, 0, .8); backdrop-filter: blur(10px); box-shadow: 0 10px 40px rgba(0, 0, 0, .5);}
	.sec5 .contact .content_inner button{margin:0 auto; width:100%;}
	.sec5 .contact h2{font-size:3em; font-weight: 700; color:#f7f7f7; text-align: center; margin-bottom:25px;}
	.sec5 .contact ul{display: flex; flex-direction: column; gap:15px;}
	.sec5 .contact ul li{display: flex; align-items: center;}
	.sec5 .contact ul li .desc1{width:100px; font-weight: 500; color:#f7f7f7;}
	.sec5 .contact ul li .desc2{width:calc(100% - 100px);}
	.sec5 .contact input{background:transparent; height:45px; padding:10px; width:100%; background:rgba(255, 255, 255, .05); color:#fff;}
	.sec5 .contact textarea{background:transparent; width:100%; resize: none; min-height:200px; background:rgba(255, 255, 255, .05); color:#fff; padding:15px;}
	.sec5 .checkbox{display: flex; align-items: center; justify-content: center; padding:20px;}
	.sec5 .checkbox input { display: none;}
	.sec5 .contact .cbx { position: relative; top: 1px; width: 20px; height: 20px; border: 1px solid #c8ccd4; border-radius: 3px; transition: background 0.1s ease; cursor: pointer; display: block; margin-right:10px;}
	.sec5 .contact .cbx:after { content: ''; position: absolute; top: 2px; left: 6px; width: 5px; height: 11px; opacity: 0; transform: rotate(45deg) scale(0); border-right: 2px solid #fff; border-bottom: 2px solid #fff; transition: all 0.3s ease; transition-delay: 0.15s; }
	.sec5 .contact .lbl { margin-left: 5px; vertical-align: middle; cursor: pointer; }
	.sec5 #cbx:checked ~ .cbx { border-color: transparent; background: var(--color1); animation: jelly 0.6s ease; }
	.sec5 #cbx:checked ~ .cbx:after { opacity: 1; transform: rotate(45deg) scale(1); }
	.sec5 .cntr { position: relative; }
	@keyframes jelly { from { transform: scale(1, 1); } 30% { transform: scale(1.25, 0.75); } 40% { transform: scale(0.75, 1.25); } 50% { transform: scale(1.15, 0.85); } 65% { transform: scale(0.95, 1.05); } 75% { transform: scale(1.05, 0.95); } to { transform: scale(1, 1); } }
	.sec5 .checkbox p{line-height: 1; margin-right:20px;}
	.sec5 .checkbox span{opacity: .5; border-bottom:1px solid #f7f7f7; transition: all .3s ease; cursor: pointer;}
	.sec5 .checkbox span:hover{opacity: 1;}
    @media(max-width:1440px){
        .sec5 .container{gap:50px;}
        .sec5 .contact .content_inner{width:100%;}
    }
    
    @media(max-width:1024px){
        .sec5 {height:auto !important;}
        .sec5 .fp-tableCell{display: block !important; height:auto !important;}
        .sec5 .info{display: none;}
        .sec5 .container{width:95%; padding:0 0 100px;}
        .sec5 .content{width:100%;}
        .sec5 .contact .content_inner{background:rgba(0, 0, 0, .25);}
    }
    
    @media(max-width:768px){
    
    }
    
    @media(max-width:425px){
        .sec5 .contact .content_inner{padding:5%;}
    }


    