@font-face {
	font-family: "Visby Round CF Medium"; 
	src: url("../font/visby-round-medium.eot"); 
	src: url("../font/visby-round-medium-ie.eot?#iefix") format("embedded-opentype"), 
	url("../font/visby-round-medium.woff2") format("woff2"), 
	url("../font/visby-round-medium.woff") format("woff"), 
	url("../font/visby-round-medium.ttf") format("truetype"), 
	url("../font/visby-round-medium.svg#Visby Round CF Medium") format("svg"); 
}
@font-face {
	font-family: "Visby Round CF Heavy"; 
	src: url("../font/visby-round-heavy.eot"); 
	src: url("../font/visby-round-heavy-ie.eot?#iefix") format("embedded-opentype"), 
	url("../font/visby-round-heavy.woff2") format("woff2"), 
	url("../font/visby-round-heavy.woff") format("woff"), 
	url("../font/visby-round-heavy.ttf") format("truetype"), 
	url("../font/visby-round-heavy.svg#Visby Round CF Heavy") format("svg"); 
}
body{ margin:0; }
.v-main__wrap {
    flex: 1 1 auto;
    max-width: 100%;
    position: relative;
}
.main-banner {
    height: 46.8vw;
    background: rgb(255, 242, 242);
    display: flex;
    place-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    padding: 0px;
    z-index: 4;
}
.main-banner image,.main-banner video {
    margin: auto;
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    display: block;
    line-height: 0;
    outline: none;
    transition: transform 1s ease-in-out 0s, opacity 0.5s ease-in-out 0s;
    opacity: 1;
}
:root {
  --animate-delay: 0.5s;
}
.logo{position:absolute;top:1vw;left:17vw;width:15vw;}
.page2{height:47vw;width:100%;background-color:#ffffff;position:relative;}
.page2 .img1{position:absolute;width:20vw;top:-2.5vw;left:-6vw;
	
}
.page2 .img2{position:absolute;width:18vw;top:14vw;left:-6.5vw;}
.page2 .img3{position:absolute;width:24vw;top:30vw;left:-4vw;}
.page2 .img4{position:absolute;width:23vw;top:-2vw;left:14vw;}
.page2 .img5{position:absolute;width:20vw;top:25vw;left:22vw;}
.page2 .img6{position:absolute;width:27.5vw;top:11vw;left:4.5vw;}
.page2 .wobble1{
	-webkit-animation: wobble1 4s linear infinite;
	animation: wobble1 4s linear infinite;
}
.page2 .page2_text{position:absolute;width:32vw;top:12vw;right:18vw;opacity:0;}
.page2 .page2_text img {width: 100%; position: absolute; top: 0; display: none;}

.text-title {    font-size: 0.7rem; font-family: Visby Round CF Heavy;}
.text-desc {    font-size: 0.2rem; font-family: Visby Round CF Medium; margin-top: 2vw; line-height: 0.3rem;}

.page3{height:47vw;width:100%;background-color:#ffffff;position:relative;}
.page3 .page3_text{position:absolute;width:28vw;top:15vw;left:12vw;opacity:0;}
.page3 .page3_bg1{position:absolute;height:100%;right:0;top:0;}
.page3 .page3_img1{position:absolute;width:30vw;right:23vw;top:10vw;}
.page3 .page3_bg2{position:absolute;height:100%;right:0;top:0;opacity : 0;}
.page3 .page3_img2{position:absolute;width:30vw;right:26vw;top:8vw;display:none;}
.page3 .page3_bg3{position:absolute;height:100%;right:0;top:0;opacity : 0;}
.page3 .page3_img3{position:absolute;width:28vw;right:28vw;top:8vw;display:none;}
.page3 .page3_bg4{position:absolute;height:100%;right:0;top:0;opacity : 0;}
.page3 .page3_img4{position:absolute;width:32vw;right:25vw;top:8vw;display:none;}

.page4{height:47vw;width:100%;background-color:#f1f1f1;position:relative;}
.page4 .page4_text{position:absolute;width:38vw;top:8vw;left:30.5vw;opacity:0;}
.page4 .page4_img1{position:absolute;width:13vw;top:2vw;left:13vw;
	-webkit-animation: bounce-down 2s linear infinite;
	animation: bounce-down 2s linear infinite;
}
.page4 .page4_img2{position:absolute;width:24vw;bottom:2vw;left:4vw;
	-webkit-animation: bounce-down 2s linear infinite;
	animation: bounce-down 2s linear infinite;
}
.page4 .page4_img3{position:absolute;width:24vw;top:5.5vw;right:4.5vw;
	-webkit-animation: bounce-up 2s linear infinite;
	animation: bounce-up 2s linear infinite;
}

.page5{ height:47vw; width:100%;background-color:#DDD2BD;position:relative;}
.page5 .page5_box{width:100%;height:100%;}
.page5 .page5_text_img{position:absolute;width:37vw;top:9vw;right:12vw;}
.page5 .page5_titles{position:absolute;width:30vw;height:36vw;left:12vw;top:5.5vw; margin: 0; padding: 0;}
.page5 .page5_titles li { list-style: none;  font-size: 0.4rem; font-family: "Visby Round CF Heavy"; color: #6a5e54; }
.page5 .page5_titles .title{padding:1.5vw 3vw;cursor:pointer; margin-bottom:1vw;}
.page5 .page5_titles .active { background: #ffffff; border-radius: 3vw;opacity: 0.8; color: #392d28;}
.page5 .page5_titles .title:hover {  background: #ffffff;  border-radius: 3vw;opacity: 0.8; color: #392d28;}
.page5 .page5_titles .title1{width:20vw;display:block;}
.page5 .page5_titles .title2{width:13vw;display:block;}
.page5 .page5_titles .title3{width:19vw;display:block;}
.page5 .page5_titles .title4{width:27vw;display:block;}
.page5 .page5_titles .title5{width:26vw;display:block;}

.page5_text-box{position: absolute; width: 30vw; height: 20vw;top: 9vw;right: 14vw; background: #f8f1dd; padding: 3vw;}
.page5_text-title {font-family: "Visby Round CF Heavy"; font-size: 0.25rem; color: #392d28}
.page5_text-desc {font-family: "Visby Round CF Medium"; font-size: 0.2rem; margin-top: 1vw; line-height: 0.3rem; color: #392d28;}

.page6 { height:47vw;width:100%;background-color:#F8F1DD;position:relative; }
.page6 .page6_bg{width:100%;height:100%;position:absolute;bottom:0;left:0;}
.page6 .page6_text{position:absolute;width:26vw;top:16vw;right:20vw;}
.page6 .page6_img1{position:absolute;width:14vw;bottom:1vw;left:12vw;}
.page6 .page6_img2{position:absolute;width:15vw;bottom:1vw;left:32vw;}
.page6 .page6_img3{position:absolute;width:15.5vw;bottom:1vw;left:52vw;}
.page6 .page6_img4{position:absolute;width:14vw;bottom:1vw;left:72.5vw;}

@-webkit-keyframes bounce-down {
   25% {
        -webkit-transform: translateY(-5px);
   }
   50%, 100% {
        -webkit-transform: translateY(0);
   }
   75% {
        -webkit-transform: translateY(5px);
   }
}

@-webkit-keyframes bounce-up {
   25% {
        -webkit-transform: translateY(10px);
   }
   50%, 100% {
        -webkit-transform: translateY(0);
   }
   75% {
        -webkit-transform: translateY(-10px);
   }
}

@-webkit-keyframes wobble1 {

	0% { -webkit-transform: rotate(0deg);  }
	
	15% { -webkit-transform: rotate(-3deg); }
	
	30% { -webkit-transform: rotate(0deg); }
	
	45% { -webkit-transform: rotate(-3deg); }
	
	60% { -webkit-transform: rotate(1deg); }
	
	75% { -webkit-transform: rotate(-1deg); }
	
	100% { -webkit-transform: rotate(0deg); }
}
		
.footer {background:#fcc900; color:#ffffff;}
.footer-logo {    
	text-align: center;
	padding-top: 50px;
	padding-bottom:40px;
}
.footer .icons {
    position: relative;
    text-align: center;
}
.footer .icons a {
    width: 10vw;
    text-align: center;
    display: inline-block;
}
.footer .icons img {
    width: 10vw;
}
.footer .text {
    display: block;
    font-size: 12px;
    color: #ffffff;
    text-align: center;
    opacity: .8;
    padding-bottom:30px;
}
.footer .text span { padding:0 10px;}
.footer .text a {
    color: #ffffff;
    text-decoration:none;
}
    
    
.loader {
    background: #000;
    background: radial-gradient(#222, #000);
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 99999;
    opacity:0.8;
}

.loader-inner {
    bottom: 0;
    height: 60px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100px;
}

.loading-text {
	text-align: center;
	bottom: -200px;
    height: 60px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100px;
	font-size:15px;
	color:#ffffff;
}
.loader-line-wrap {
    animation: 
		spin 2000ms cubic-bezier(.175, .885, .32, 1.275) infinite
	;
    box-sizing: border-box;
    height: 50px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    transform-origin: 50% 100%;
    width: 100px;
}
.loader-line {
    border: 4px solid transparent;
    border-radius: 100%;
    box-sizing: border-box;
    height: 100px;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 100px;
}
.loader-line-wrap:nth-child(1) { animation-delay: -50ms; }
.loader-line-wrap:nth-child(2) { animation-delay: -100ms; }
.loader-line-wrap:nth-child(3) { animation-delay: -150ms; }
.loader-line-wrap:nth-child(4) { animation-delay: -200ms; }
.loader-line-wrap:nth-child(5) { animation-delay: -250ms; }

.loader-line-wrap:nth-child(1) .loader-line {
    border-color: hsl(0, 80%, 60%);
    height: 90px;
    width: 90px;
    top: 7px;
}
.loader-line-wrap:nth-child(2) .loader-line {
    border-color: hsl(60, 80%, 60%);
    height: 76px;
    width: 76px;
    top: 14px;
}
.loader-line-wrap:nth-child(3) .loader-line {
    border-color: hsl(120, 80%, 60%);
    height: 62px;
    width: 62px;
    top: 21px;
}
.loader-line-wrap:nth-child(4) .loader-line {
    border-color: hsl(180, 80%, 60%);
    height: 48px;
    width: 48px;
    top: 28px;
}
.loader-line-wrap:nth-child(5) .loader-line {
    border-color: hsl(240, 80%, 60%);
    height: 34px;
    width: 34px;
    top: 35px;
}

@keyframes spin {
    0%, 15% {
		transform: rotate(0);
	}
	100% {
		transform: rotate(360deg);
	}
}