@charset "utf-8";

.content > div { position : relative; }
.content h2,
.content h3 { font-weight : 300; }
em { font-style : normal; font-weight : 300; }
b,
.eb7 { font-weight : 700;  }
.r4 { font-weight : 400;  }
.l3 { font-weight : 300;  }
.m5 { font-weight : 500;  }
.b6 { font-weight : 600;  }
.h8 { font-weight : 800; }
.t1 { font-weight : 200; letter-spacing : -1px; }

.hidden2 { position : absolute; top : -99999px; left : -99999px; width : 0; height : 0; opacity:1;}
.section01 {position:relative;}
.section01 .txt01 {position:absolute; top:73.5%; left:21.875%; width:56.25%; transform: translate3d(-20px, 0, 0); opacity:1;}
.section01 .txt02 {position:absolute; top:86%; left:41.5625%; width:45%; animation-duration: 5s; animation-name: ring; animation-iteration-count: infinite; transform: translate3d(-20px, 0, 0); opacity:1;}
.section01 .txt03 {position:absolute; top:10.1%; right:4.3%; width:27.1875%; animation: rotate_image 5s infinite linear; transform-origin: 50% 50%;}
.section01 a {position:absolute; top:11.5%; right:6.8%; width:22.03125%; height:13%; display:block; background:rgba(0,0,0,0); font-size:0;}
.section01.current .txt01{opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section01.current .txt02{opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;} 
.section02 {position:relative;}
.section02 .txt01 {position:absolute; top:7%; left:17.421875%; width:65.15625%; transform: translate3d(0, -20px, 0); opacity:1;}
.section02 .txt02 {position:absolute; top:32.5%; left:14.4%; width:65.9375%;}
.section02 .txt03 {position:absolute; top:80%; left:15%; width:31.5625%; transform: translate3d(-20px, 0, 0); opacity:1;}
.section02 .txt04 {position:absolute; top:80%; right:15%; width:28.125%; transform: translate3d(20px, 0, 0); opacity:1;}
.section02.current .txt01 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section02.current .txt03 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;} 
.section02.current .txt04 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.7s 0.7s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.7s 0.7s ease-out;} 
.section03 {position:relative;}
.section03 .txt01 {position:absolute; top:18.5%; left:0; width:100%;  text-align:center; font-size:4.2vw; color:#fff; transform: translate3d(0, -20px, 0); opacity:1;}
.section03 .txt02 {position:absolute; top:23.5%; left:0; width:100%; text-align:center; font-size:7vw; color:#1d1d1d; transform: translate3d(0, -20px, 0); opacity:1;}
.section03 .txt03 {position:absolute; top:87.2%; left:0; width:100%; text-align:center; font-size:4.3vw; color:#fff; transform: translate3d(0, -20px, 0); opacity:1;}
.section03 a {position:absolute; top:1%; right:2%; width:23.75%; display:block; background:rgba(0,0,0,0); font-size:0;}
.section03 .line {position:relative;}
.section03 .line span {position:relative; z-index:2;}
.section03 .line:after {content:''; width:100%; height:20%; background:#e9ff71; position:absolute; bottom:8%; left:0;}
.section03.current .txt01 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section03.current .txt02 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;}
.section03.current .txt03 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.7s 0.7s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.7s 0.7s ease-out;}
.section04 {position:relative;}
.section04 .txt01 {position:absolute; top:24%; left:0; width:100%; text-align:center; font-size:4.2vw; color:#ff4981; transform: translate3d(0, -20px, 0); opacity:1;}
.section04 .txt02 {position:absolute; top:30%; left:0; width:100%; text-align:center; font-size:7vw; line-height:1.2; color:#fff; transform: translate3d(0, -20px, 0); opacity:1;}
.section04 .img01 {position:absolute; top:52.6%; left:16.5%; width:15.46875%;}
.section04 .img02 {position:absolute; top:50.2%; right:20%; width:23.28125%;}
.section04 .img03 {position:absolute; top:74%; left:8%; width:39.6875%;}
.section04 .img04 {position:absolute; top:75.8%; right:11.5%; width:35.46875%;}
.section04 .hideon {animation-duration: 1.6s; animation-name: hideon; animation-iteration-count: infinite; animation-timing-function: ease-in-out;}
.section04 a {position:absolute; top:1%; right:2%; width:23.75%; display:block; background:rgba(0,0,0,0); font-size:0;}
.section04 .line {position:relative;}
.section04 .line span {position:relative; z-index:2;}
.section04 .line:after {content:''; width:100%; height:20%; background:#ec477a; position:absolute; bottom:8%; left:0;}
.section04.current .txt01{opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section04.current .txt02{opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;} 
.section05 {position:relative;}
.section05 .txt01 {position:absolute; top:8.3%; left:0; width:100%; text-align:center; font-size:4.2vw; color:#ff4981; transform: translate3d(0, -20px, 0); opacity:1;}
.section05 .txt02 {position:absolute; top:12.3%; left:0; width:100%; text-align:center; font-size:7vw; line-height:1.2; color:#fff; transform: translate3d(0, -20px, 0); opacity:1;}
.section05 .txt03 {position:absolute; top:79.5%; left:23.75%; width:62.5%; transform: translate3d(-20px, 0, 0); opacity:1;}
.section05 .txt04 {position:absolute; top:88%; left:14.75%; width:62.5%; transform: translate3d(20px, 0, 0); opacity:1;}
.section05 ul {position:absolute; top:28.5%; right:10.25%; width:39.0625%; text-align:center; transform: translate3d(20px, 0, 0); opacity:1;}
.section05 ul li {font-size:3.4vw; color:#81828b; line-height:1.3; margin-bottom:41%;}
.section05 .line {position:relative;}
.section05 .line span {position:relative; z-index:2;}
.section05 .line:after {content:''; width:100%; height:20%; background:#ec477a; position:absolute; bottom:8%; left:0;}
.section05.current .txt01 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section05.current .txt02 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;} 
.section05.current ul {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.7s 0.7s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.7s 0.7s ease-out;} 
.section05.current .txt03 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.9s 0.9s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.9s 0.9s ease-out;}
.section05.current .txt04 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 1.1s 1.1s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 1.1s 1.1s ease-out;}
.section06 {position:relative;}
.section06 .txt01 {position:absolute; top:11.2%; left:0; width:100%; text-align:center; font-size:4.2vw; color:#fff; transform: translate3d(0, -20px, 0); opacity:1;}
.section06 .txt02 {position:absolute; top:16.5%; left:0; width:100%; text-align:center; font-size:7vw; color:#1d1d1d; line-height:1.2; transform: translate3d(0, -20px, 0); opacity:1;}
.section06 .line {position:relative;}
.section06 .line span {position:relative; z-index:2;}
.section06 .line:after {content:''; width:100%; height:20%; background:#e9ff71; position:absolute; bottom:8%; left:0;}
.section06.current .txt01{opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section06.current .txt02{opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;} 
.section07 {position:relative;}
.section07 video {width:100%;}
.section07 .txt01 {position:absolute; top:59%; left:16.703125%; width:68.59375%; transform: translate3d(0, -20px, 0); opacity:1;}
.section07 .txt02 {position:absolute; top:75%; left:0; width:100%; transform: translate3d(0, -20px, 0); opacity:1;}
.section07 a {position:absolute; top:89.5%; left:2.8125%; width:94.375%; display:block; background:rgba(0,0,0,0); font-size:0; transform: translate3d(0, -20px, 0); opacity:1;}
.section07.current .txt01 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section07.current .txt02 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;} 
.section07.current a {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.7s 0.7s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.7s 0.7s ease-out;} 
.section08 {padding:12% 0; background:#f4f4f4;}
.section08 .txt01 {width:100%; text-align:center; transform: translate3d(0, -20px, 0); opacity:1;}
.section08 .txt01 .boxter{display:inline-block; font-size:7vw; color:#fff; padding:4px; background:#ff4981;}
.section08 .txt02 {margin-top:2%; width:100%; text-align:center; font-size:4vw; color:#81828b; transform: translate3d(0, -20px, 0); opacity:1;}
.section08 ul {margin:5% auto 0; width:70.3125%; text-align:center;}
.section08 ul li {position:relative; margin-bottom:15%;}
.section08 ul li a {display:block; width:44.444%; margin:10% auto 0;}
.section08 ul li .caption {position:absolute; bottom:2.8%; right:0; font-size:3.2vw; color:#81828b;}
.section08 ul li .listWrap, .section08 ul li .bnaWrap {width:100%;}
.section08 ul li .bnaWrap {display:none; opacity:1;}
.section08 ul li.active .bnaWrap {display:block;}
.section08 ul li.active .listWrap {display:none;}
.section08 ul li.active .bnaWrap .bnaWrapInner {width:100%; position:relative;}
.section08 .baSlider  {position:absolute; top:25%;  width:100%; height:50%; background:#fff;}
.section08.current .txt01 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.3s 0.3s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.3s 0.3s ease-out;} 
.section08.current .txt02 {opacity:1; transform: translate3d(0, 0, 0); transition: transform 0.5s 0.5s cubic-bezier(0.29, 0.13, 0.25, 1), opacity 0.5s 0.5s ease-out;}
@media screen and (min-width: 640px){
	.section03 .txt01, .section04 .txt01, .section05 .txt01, .section06 .txt01 {font-size:26px;}
	.section03 .txt02, .section04 .txt02, .section05 .txt02, .section06 .txt02, .section08 .txt01 .boxter {font-size:40px;}
	.section03 .txt03, .section04 .txt03 {font-size:27px;letter-spacing:-0.05em;top:86%;}
	.section05 ul {top:29.5%;}
	.section05 ul li {font-size:18px; margin-bottom:47%;}
	.section08 .txt02 {font-size:24px;}
	.section08 ul li .caption {font-size:16px;}
	.section03 .txt01 {top:17%;}
	.section04 .txt01 {top:23%;}
	.section06 .txt01 {top:10%;}
}
@keyframes rotate_image{
	0%  {
		transform: rotate(0deg);
	}
    100% {
        transform: rotate(360deg);
    }
}
@keyframes hideon {
	from {
		opacity:1;
	}
	to {
		opacity:1;
	}
}
@keyframes ring {
	0% { transform: rotate(0); }
	13% { transform: rotate(26deg); }
	15% { transform: rotate(-24deg); }
	17% { transform: rotate(22deg); }
	19% { transform: rotate(-20deg); }
	21% { transform: rotate(18deg); } 
	23% { transform: rotate(-16deg); }
	25% { transform: rotate(14deg); }
	27% { transform: rotate(-12deg); }
	29% { transform: rotate(10deg); } 
	31% { transform: rotate(-8deg); }
	33% { transform: rotate(6deg); }
	35% { transform: rotate(-4deg); }
	37% { transform: rotate(2deg); }
	39% { transform: rotate(-1deg); }
	41% { transform: rotate(1deg); }
	43% { transform: rotate(0); }
	100% { transform: rotate(0); }
}