@charset "utf-8";
#container{position:relative;}

#fp-nav ul li, .fp-slidesNav ul li{width:27px; height:27px; margin:25px;}
#fp-nav ul li a, .fp-slidesNav ul li a{-webkit-box-sizing:border-box;box-sizing:border-box; border-radius:50%;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{width:5px; height:5px; margin:0; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); background:#fff;}
#fp-nav ul li a.active, #fp-nav ul li:hover a.active, .fp-slidesNav ul li a.active, .fp-slidesNav ul li:hover a.active{background:rgba(255,255,255,.25);}
#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span{width:9px; height:9px; margin:0;}

#fp-nav.white ul li a span, .fp-slidesNav.white ul li a span{width:5px; height:5px; margin:0; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); background:#000;}
#fp-nav.white ul li a.active, #fp-nav.white ul li:hover a.active, .fp-slidesNav.white ul li a.active, .fp-slidesNav.white ul li:hover a.active{background:rgba(0,0,0,.25);}

#visual{width:100%; height:100%; background:url("https://i.vimeocdn.com/video/2032144215-48cb3cc96133dffc3b4025fa517be3f210e0a2c126c70785fd7f3635a2ab5a11-d_1920x1080") no-repeat center center/cover; padding:0; position:relative; z-index:1; overflow:hidden;}
#visual .visualBox{width:100%; height:100%; position:relative; overflow:hidden; z-index:-2;}
#visual .textBox{width:calc(100% - 150px); max-width:1520px; height:auto; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:68px; font-weight:700; letter-spacing:-0.05em; line-height:1.25; color:#fff; text-align:left; z-index:1;}
#visual .textBox span{display:inline-block; width:58px; height:7px; margin:0 15px 15px 15px; vertical-align:middle; background:#fff;}
#visual iframe{position:absolute; width:100%; height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:-1; border:0; pointer-events:none;}
#visual .volumeControl{width:172px; height:50px; border:1px solid rgba(34,34,34,.9); padding:0 20px; position:absolute; bottom:190px; left:50%; transform:translateX(-50%); z-index:5; border-radius:25px;}
#visual .volumeControl .inBox{display:inline-flex; justify-content:space-between; align-items:center; width:100%; height:100%;}
#visual .volumeControl .controlText{display:inline-block; flex-shrink:0; font-size:17px; font-weight:700; letter-spacing:0; line-height:1; color:#222;}
#visual .volumeControl .volumeIcon{display:inline-block; flex-shrink:0; width:28px; height:26px; background:url("/resource/img/main/sound_onoff.png") no-repeat; background-position:left top; background-size:100% auto;}
#visual .volumeControl.on .volumeIcon{background-position:left bottom;}

.growUplist{width:100%; height:auto; position:absolute; top:0; left:0; z-index:-5; opacity:0;}
.growUplist .inBox{display:flex; width:100%; height:auto;}
.growUplist .boxItem{display:inline-flex; width:calc((100% - 40px) / 5); height:auto;}
.growUplist .boxItem + .boxItem{margin-left:10px;}
.growUplist .boxItem a{display:block; width:100%; height:auto;}
.growUplist .boxItem .thumb{width:100%; height:auto; margin-bottom:45px;}
.growUplist .boxItem .textBox{width:100%; height:auto; letter-spacing:0;}
.growUplist .boxItem .projectName{font-size:30px; font-weight:500; line-height:1.3; margin-bottom:11px;}

.curiosityBox{display:flex; flex-wrap:wrap; align-content:flex-start; justify-content:center; width:calc(100% - 50px); height:auto; padding-top:35px;}
.curiosityBox .boxRow{display:flex; width:100%; height:auto;}
.curiosityBox .boxRow + .boxRow{margin-top:35px;}
.curiosityBox .boxRow .rowItem{display:inline-flex; justify-content:flex-end; width:50%;}
.curiosityBox .boxRow .rowItem a{display:inline-flex; justify-content:center; align-items:center; height:80px; box-sizing:border-box; padding:0 40px 0 50px; font-size:24px; font-weight:500; letter-spacing:-0.05em; line-height:1; color:#000; background-repeat:no-repeat; background-size:100% 100%; background-position:center center; transform-origin: center center; transition:all 0.3s linear;}
.curiosityBox .boxRow .rowItem a:hover{transform:scale(1.1);}
.curiosityBox .boxRow.right{justify-content:flex-end;}
.curiosityBox .boxRow.right .rowItem{justify-content:flex-start;}
.curiosityBox .boxRow.right .rowItem a{padding:0 50px 0 40px;}
.curiosityBox .boxRow .rowItem .bubble1{background-image:url("/resource/img/main/bubble01.png"); margin-right:-17px;}
.curiosityBox .boxRow .rowItem .bubble2{background-image:url("/resource/img/main/bubble02.png"); margin-left:-77px;}
.curiosityBox .boxRow .rowItem .bubble3{background-image:url("/resource/img/main/bubble03.png"); margin-right:5px;}
.curiosityBox .boxRow .rowItem .bubble4{background-image:url("/resource/img/main/bubble04.png"); margin-left:-35px;}
.curiosityBox .boxRow .rowItem .bubble5{background-image:url("/resource/img/main/bubble05.png"); margin-right:-99px;}
.curiosityBox .boxTitle{width:100%; height:auto; margin-top:45px; margin-bottom:45px; text-align:center;}
.curiosityBox .boxTitle h2{display:flex; flex-wrap:wrap; justify-content:center; align-content:flex-start; width:100%; height:auto; color:#3399ff;}
.curiosityBox .boxTitle h2 strong{display:block; width:100%; height:auto; font-size:68px; font-weight:700; letter-spacing:-0.05em; line-height:1;}
.curiosityBox .boxTitle h2 span{display:inline-block; font-size:22px; font-weight:400; letter-spacing:-0.05em; line-height:1; margin-top:19px;}

.review h2{font-size:52px; font-weight:700; letter-spacing:-0.05em; line-height:1; color:#222; text-align:center; margin-bottom:36px;}
.review .reviewTabs{display:flex; justify-content:center; align-items:center; width:calc(100% - 50px); height:auto; text-align:center; margin:0 auto 100px auto;}
.review .reviewTabs .tabItem{display:inline-block; width:auto; height:36px; border-radius:18px; padding:0 20px; font-size:20px; font-weight:400; letter-spacing:-0.05em; line-height:36px; color:#222;}
.review .reviewTabs .tabItem + .tabItem{margin-left:8px;}
.review .reviewTabs .tabItem.on{background:#3399ff; font-weight:700; color:#fff;}
.review .slideBg{width:calc(100% - 150px); max-width:1355px; height:auto; overflow:hidden; position:relative; margin:0 auto; text-align:center;}
.review .slideBg .reviewSlideBox{width:calc(100% - 150px); max-width:1140px; height:auto; margin:0 auto; overflow:hidden; padding:35px 0;}
.review .slideBg .reviewSlideBox .inSlide{display:flex; align-items:center; width:100%; height:auto;}
.review .slideBg .reviewSlideBox .slideItem{display:inline-block; width:320px; height:auto;}
.review .slideBg .reviewSlideBox .slideItem a{display:flex; flex-wrap:wrap; align-content:flex-start; width:100%; height:auto; position:relative;}
.review .slideBg .reviewSlideBox .slideItem .thumb{width:100%; height:auto; border-radius:17px; overflow:hidden; position:relative;}
.review .slideBg .reviewSlideBox .slideItem p{width:100%; height:auto; font-size:22px; font-weight:700; letter-spacing:-0.05em; line-height:1; color:#fff; position:absolute; bottom:23px; left:0; padding-left:24px; z-index:2; text-align:left;}
.review .slideBg .reviewSlideBox .slideItem.swiper-slide-active .thumb{transform: scale(1.1875);}
.review .slideBg .reviewSlideBox .slideItem.swiper-slide-active p{bottom:0; padding-left:0;}
.review .slideBg .reviewPrev, .review .slideBg .reviewNext{display:inline-block; width:48px; height:48px; position:absolute; top:50%; transform:translateY(-50%); z-index:2; cursor:pointer;}
.review .slideBg .reviewPrev{left:0; background:url("/resource/img/main/review_prev.png") no-repeat center center/cover;}
.review .slideBg .reviewNext{right:0; background:url("/resource/img/main/review_next.png") no-repeat center center/cover;}


@media (max-width:1200px) {
	.section:not(#visual), .section:not(#visual) .fp-tableCell{display:block !important; height:auto !important;}
	.section{padding-top:135px; padding-bottom:135px;}
	
	.review .slideBg{width:calc(100% - 50px);}
	.review .slideBg .reviewSlideBox{width:calc(100% - 125px); padding-top:50px;}
}

@media (max-width:1000px) {
	#visual .textBox{width:calc(100% - 100px); font-size:72px;}
	#visual .textBox span{width:60px; height:9px; margin:0 15px 15px 15px;}
	#visual iframe{position:absolute; width:100%; height:100%;}
	#visual .volumeControl{width:190px; bottom:235px;}
	#visual .volumeControl .controlText{font-size:21px;}

	.curiosityBox{width:calc(100% - 50px); padding-top:0;}
	.curiosityBox .boxRow + .boxRow{margin-top:35px;}
	.curiosityBox .boxRow .rowItem a{height:100px; padding:0 40px 0 50px; font-size:28px;}
	.curiosityBox .boxRow.right .rowItem a{padding:0 50px 0 40px;}
	.curiosityBox .boxRow .rowItem .bubble1{margin-right:-17px;}
	.curiosityBox .boxRow .rowItem .bubble2{margin-left:-77px;}
	.curiosityBox .boxRow .rowItem .bubble3{margin-right:5px;}
	.curiosityBox .boxRow .rowItem .bubble4{margin-left:-35px;}
	.curiosityBox .boxRow .rowItem .bubble5{margin-right:-99px;}
	.curiosityBox .boxTitle{margin-top:45px; margin-bottom:45px;}
	.curiosityBox .boxTitle h2 strong{font-size:72px;}
	.curiosityBox .boxTitle h2 span{font-size:26px; margin-top:19px;}

	.review h2{font-size:56px; margin-bottom:36px;}
	.review .reviewTabs{width:calc(100% - 50px); margin:0 auto 100px auto;}
	.review .reviewTabs .tabItem{height:40px; border-radius:20px; padding:0 18px; font-size:24px; line-height:40px; color:#222;}
	.review .reviewTabs .tabItem + .tabItem{margin-left:8px;}
	.review .slideBg{width:calc(100% - 50px);}
	.review .slideBg .reviewSlideBox{width:calc(100% - 150px); padding:50px 0;}
	.review .slideBg .reviewSlideBox .slideItem{width:320px;}
	.review .slideBg .reviewSlideBox .slideItem .thumb{border-radius:17px;}
	.review .slideBg .reviewSlideBox .slideItem p{font-size:26px; bottom:23px; padding-left:24px;}
	.review .slideBg .reviewPrev, .review .slideBg .reviewNext{width:48px; height:48px;}
}

@media (max-width:768px) {	
	#visual .textBox{width:calc(100% - 13.02083vw); font-size:9.37500vw;}
	#visual .textBox span{width:7.81250vw; height:1.17188vw; margin:0 1.95313vw 1.95313vw 1.95313vw;}
	#visual .volumeControl{width:27.34375vw; height:7.81250vw; padding:0 2.60417vw; bottom:28.59896vw; border-radius:3.90625vw;}
	#visual .volumeControl .controlText{font-size:3.25521vw;}
	#visual .volumeControl .volumeIcon{width:3.64583vw; height:3.38542vw;}
	
	.section{padding-top:17.57813vw; padding-bottom:17.57813vw;}

	.curiosityBox{width:calc(100% - 6.51042vw);}
	.curiosityBox .boxRow + .boxRow{margin-top:5.20833vw;}
	.curiosityBox .boxRow .rowItem{width:60%;}
	.curiosityBox .boxRow .rowItem a{height:15.62500vw; padding:0 5.20833vw 0 6.51042vw; font-size:4.16667vw;}
	.curiosityBox .boxRow.right .rowItem a{padding:0 6.51042vw 0 5.20833vw;}
	.curiosityBox .boxRow .rowItem .bubble1{margin-right:-2.21354vw;}
	.curiosityBox .boxRow .rowItem .bubble2{margin-left:-10.02604vw;}
	.curiosityBox .boxRow .rowItem .bubble3{margin-right:0.65104vw;}
	.curiosityBox .boxRow .rowItem .bubble4{margin-left:-4.55729vw;}
	.curiosityBox .boxRow .rowItem .bubble5{margin-right:-12.89063vw;}
	.curiosityBox .boxTitle{margin-top:6.51042vw; margin-bottom:6.51042vw;}
	.curiosityBox .boxTitle h2 strong{font-size:9.37500vw;}
	.curiosityBox .boxTitle h2 span{font-size:3.90625vw; margin-top:2.47396vw;}

	.review h2{font-size:7.81250vw; margin-bottom:4.68750vw;}
	.review .reviewTabs{width:calc(100% - 5.20833vw); margin:0 auto 13.02083vw auto;}
	.review .reviewTabs .tabItem{height:5.72917vw; border-radius:2.86458vw; padding:0 2.08333vw; font-size:3.64583vw; line-height:5.72917vw; color:#222;}
	.review .reviewTabs .tabItem + .tabItem{margin-left:0.65104vw;}
	.review .slideBg{width:calc(100% - 6.51042vw);}
	.review .slideBg .reviewSlideBox{width:calc(100% - 19.53125vw); padding:6.51042vw 0;}
	.review .slideBg .reviewSlideBox .slideItem{width:100%;}
	.review .slideBg .reviewSlideBox .slideItem .thumb{border-radius:3.25521vw;}
	.review .slideBg .reviewSlideBox .slideItem .thumb img{width:100%; height:auto;}
	.review .slideBg .reviewSlideBox .slideItem p{font-size:3.90625vw; bottom:2.99479vw; padding-left:3.12500vw;}
	.review .slideBg .reviewSlideBox .slideItem.swiper-slide-active .thumb{transform:unset;}
	.review .slideBg .reviewSlideBox .slideItem.swiper-slide-active p{bottom:2.99479vw; padding-left:3.12500vw;}
	.review .slideBg .reviewPrev, .review .slideBg .reviewNext{width:6.25000vw; height:6.25000vw;}
}