@charset "UTF-8";
/* CSS Document */

section p{line-height: 1vw; font-size: 0.84vw;}
section h1{font-size: 1.93vw; text-align: center; color:#004274; margin-bottom: 1vw;}
section h1 span{color:#669835;}

.sldcntrl{display: none!important;}

.sec1{position:relative; top:0px; left:0px; width:100%; height:63.7vw; z-index:4; overflow:visible;}
.sec1 ul{position:absolute; top:0px; left:0px; display: block; width:100%;}
.sec1 ul li._col1{position: relative; width: 47.4vw; display: block; margin-top: 10.4vw; text-align: right; overflow:hidden;}
.sec1 ul li._col1 img{display: inline-block;}
.sec1 ul li._col1 .img2{width: 18.75vw; margin-top: 2.25vw; height: auto; display: inline-block!important;}

.sec1 ul li._col2{position: absolute; top: 12.14vw; left: 50vw; width: 35.4vw;}
.sec1 ul li._col2 h1{margin-bottom: 3.1vw;}
.sec1 ul li._col2 h2{border-left:1px solid #bfbfbf; color:#669835; text-transform: uppercase; padding-left:1vw; text-align: left; font-size: 1.28vw; height: 3.75vw; opacity:0!important;}
.sec1 ul li._col2 img{margin-bottom: 2.4vw;}
.sec1 ul li._col2 p{text-align:left;}

.sec1 .patrn1{position:absolute; top:21vw; right:0vw; width:2.6vw; height:auto; display: block;}
.sec1 ul li.elm1{position: absolute; bottom: -15vw; left: 0px; width: 19.1vw;}

.sec2{position:relative; top:0px; left:0px; width:100%; height:64vw; overflow: hidden; background-color:#fff;}
.sec2 .ovrvw{position:relative; margin-top:2.5vw; text-align: center;}
.sec2 .ovrvw h1{margin-bottom:0.9vw;}
.sec2 .ovrvw p{width:34.5vw; margin:0 auto;}

.lctor{position:relative; width:100%; padding-left: 6.4vw; padding-top: 3vw; z-index:4;}
.lctor .l_1{position:relative; width:53.4vw; height:auto; display: block;}
.lctor .l_2{position:absolute; top:4.7vw; right:0px; width:35.33vw; text-align: left;}
.lctor .l_2 h2{display: block; width:100%; border-left:1px solid #bfbfbf; height:3.5vw; position:relative;}

.lctor .l_2 h2 i{position: absolute; top: -2.3vw; left: -0.4vw; font-size: 2.1vw; font-style: normal;}
.lctor .l_2 h2 span{position: absolute; top: -1.8vw; left: 1vw; font-size: 1.29vw;}

.sec2 .elm3{position:absolute; bottom:0px; right:0px; width:14.6vw;}

.sec3{width:100%; height:49vw; overflow: hidden;}
.sec3 h1{text-align:left; margin-bottom:0.7vw;}
.sec3 .elm4{display: block; width: 30vw; height: auto; margin: 0 auto; margin-top: 2.3vw;}
.sec3 .cityscape{display: block; width: 75vw; height: auto; margin: 0 auto; overflow: hidden; opacity:0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.sec3 .cityscape img{-webkit-transition-duration: 0.3s; transition-duration: 0.3s; -ms-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1);}
.sec3 .cityscape.on img{-webkit-transition-duration: 4s; transition-duration: 4s; -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1);}
.sec3 .cityscape.on{opacity:1; -webkit-transition-duration: 1s; transition-duration: 1s;}

.sec3 .items{display: block; width: 75vw; height:auto; margin:0 auto; position:relative; margin-top:3.4vw;}
.sec3 .items .ovrvw{width:16vw; position:absolute; top:0px; left:0px; text-align:left; opacity:0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.sec3 .items.on .ovrvw{width:16vw; position:absolute; top:0px; left:0px; text-align:left; opacity:1; -webkit-transition-duration: 1s; transition-duration: 1s;}

.sec3 .items ul{float:right; width:auto;}
.sec3 .items ul li{float:left; width:auto; text-align: left; margin-left: 3.45vw; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; opacity:0;
    -ms-transform: translateX(10%); -webkit-transform: translateX(10%); transform: translateX(10%);}
.sec3 .items ul li img{display: block; width:auto; height:4.2vw; margin-bottom: 0.7vw;}
.sec3 .items ul li:last-child img{height:3.1vw; margin-top:1.1vw;}

.sec3 .items.on ul li{opacity:1; -webkit-transition-duration: 0.6s; transition-duration: 0.6s; -ms-transform: translateX(0%); -webkit-transform: translateX(0%); transform: translateX(0%);}
.sec3 .items.on ul li:nth-child(1){transition-delay: 0.2s;}
.sec3 .items.on ul li:nth-child(2){transition-delay: 0.4s;}
.sec3 .items.on ul li:nth-child(3){transition-delay: 0.6s;}
.sec3 .items.on ul li:nth-child(4){transition-delay: 0.8s;}


.sec4{background-color:#fff; position:relative;}
.sec4 p{width: 25vw; text-align: center; margin:0 auto;}
.sec4 h1{text-align: center; margin:0 auto; margin-bottom:1vw;}
.sec4 .prlx{height:114%;}
.sec4 ul li{position:absolute; top:0px; height:100%; display: grid; align-content: center;}
.sec4 .sec4_img{left:0px; width:63.6vw;}
.sec4 .sec4_img .l_1{position:relative; height:70.5vh; overflow: hidden; display: grid; align-content: center;}
.sec4 .sec4_img img{width:100%; height:auto;}
.sec4 .sec4_h{right:6.1vw; width:27vw; top:50%; height:auto; display:block; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: left;}
.sec4 .sec4_h .btn1{margin-left:0px;}

.sec4 .patrn3{position:absolute; top:11vw; right:0vw; width:2.6vw; height:auto; display: block;}

.hspot{position:absolute; top:0px; left:0px; width:100%; height:100%;}
.hspot i{position: absolute; width: 1.7vw; height: 1.7vw; top: 15vw; left: 30.4vw; display: block; opacity:0; -webkit-transition-duration: 0.7s; transition-duration: 0.7s; cursor: pointer; z-index:2;}

.hspot .sgnl{position:absolute; top:0%; left:0%; width: 1.7vw; height: 1.7vw; -webkit-transition-duration: 0s!important; transition-duration: 0s!important; display: block;}
.hspot .sgnl u{position:absolute; top:0px; left:0px; width:100%; height:100%; border:1px solid #000; display: block; animation: ray 0.6s linear infinite;
  -moz-border-radius: 20vw; -webkit-border-radius: 20vw; -khtml-border-radius: 20vw; border-radius: 20vw;
}
.hspot .sgnl .u2{animation: ray2 0.6s linear infinite;}
.hspot .sgnl .u3{animation: ray3 0.6s linear infinite;}

.hspot .c1 u{border:1px solid #004274!important;}
.hspot .c2 u{border:1px solid #90140c!important;}
.hspot .c3 u{border:1px solid #ff9600!important;}

@keyframes ray{
	0%{-ms-transform: scale(0,0); -webkit-transform: scale(0,0); transform: scale(0,0); opacity:0;}
  10%{opacity:1;}
	100%{-ms-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
}

@keyframes ray2{
	0%{-ms-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
	100%{-ms-transform: scale(2,2); -webkit-transform: scale(2,2); transform: scale(2,2);}
}
@keyframes ray3{
	0%{-ms-transform: scale(2,2); -webkit-transform: scale(2,2); transform: scale(2,2); opacity:1;}
  70%{opacity:1;}
	100%{-ms-transform: scale(3,3); -webkit-transform: scale(3,3); transform: scale(3,3); opacity:0;}
}






/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx MOBILE*/

.mob_sec{display: none!important;}
.mobile .mob_sec{display: block!important;}
.mobile .mob_sec h1{font-size: 4.95vw; color:#004274; text-align: center; width:100%;}
.mobile .mob_sec p{width:86.5vw; margin:0 auto; line-height: 3.7vw!important; font-size: 3vw; text-align: center;}

.mobile h1 span,
.mobile h1 span{color:#669835;}

.mobile section{display: none!important;}
.mobile .f_kv{height:134.2vw;}
.mobile .f_kv{display: block!important;}


.mobile .mob_sec .h1_1{padding-top:25.6vw;}
.mobile .mob_sec .img_1{padding-top:8.3vw; position:relative;}
.mobile .mob_sec .img_1 u{right:auto; left:0%;
	text-shadow: 0px 0px 6px rgba(0,0,0, 0.5);
}
.mobile .mob_sec .l_mini{position: absolute; bottom: -22.9vw; right: 7.5vw; width: 32.5vw; height: auto; display: block;}
.mobile .mob_sec .img_2{padding: 0vw 7.5vw; padding-top: 36.95vw;}
.mobile .mob_sec .img_2 img{margin-bottom: 2vw;}
.mobile .mob_sec .img_2 i{display: block; width:100%; height:1px; background-color:#bfbfbf; margin-top: 17.2vw;}
.mobile .mob_sec .h1_2{padding-top: 18vw; padding-bottom:5vw; position:relative;}
.mobile .mob_sec .h1_2 img{position: absolute; top: -15vw; left: -22vw; width: 40vw; z-index:-1;}
.mobile .mob_sec .h1_2 h1{margin-bottom:3vw;}
.mobile .mob_lctor{padding-left:0px; padding-top:0px; position:relative; background-color:#fff; padding-bottom: 30vw; overflow:hidden;}
.mobile .mob_lctor .m_elm3{position: absolute; bottom: -4vw; right: 0vw; width: 26vw;}
.mobile .mob_lctor .l_1{position:relative; width:100%;}
.mobile .mob_lctor .l_2{position:relative; top:0px; left:0px; width:100%; padding:7.3vw; padding-top: 2.2vw;}


.mobile .mob_lctor .l_2 h2{display: block; width:100%; border-left:1px solid #bfbfbf; height:11vw; position:relative;}

.mobile .mob_lctor .l_2 h2 i{position: absolute; top: -3vw; left: -1.2vw; font-size: 5.7vw; font-style: normal; background-color:#fff;}
.mobile .mob_lctor .l_2 h2 span{position: absolute; top: -1.8vw; left: 3.2vw; font-size: 3.44vw;}

.mobile .hspot i{-ms-transform: translate(41%,34%); -webkit-transform: translate(41%,34%); transform: translate(41%,34%); cursor: pointer;}
.mobile .hspot i u{animation: mob_ray 0.5s linear infinite;}
.mobile .hspot i u.u2{animation: mob_ray2 0.5s linear infinite;}

.mobile .mob_sec .img_3{padding-bottom: 15.7vw; position:relative;}
.mobile .mob_sec .img_3 .lne{display: block; position:absolute; bottom:0vw; left:50%; width:85%; height:1px; background-color:#bfbfbf; transition-duration: 0.6s; -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.mobile .mob_sec .img_3 .ovrvw{padding-top:8.1vw; padding-bottom: 3vw;}
.mobile .mob_sec .img_3 .ovrvw h1{margin-bottom: 3.2vw;}
.mobile .mob_sec .img_3 .ovrvw h1 br{display:none!important;}
.mobile .mob_sec .img_3 ul{padding: 0vw 8vw;}
.mobile .mob_sec .img_3 ul li{float:left; width:50%; height: 25.9vw;}
.mobile .mob_sec .img_3 ul li img{height:11vw; width:auto; margin:0 auto; display: block;}
.mobile .mob_sec .img_3 ul li p{width:auto; font-size: 2.3vw; line-height: 1.32!important;}
.mobile .mob_sec .img_3 ul li span{display: block; position:relative; margin-bottom: 1.6vw; display: grid; align-content: end; height:12vw;}
.mobile .mob_sec .img_3 ul li:last-child img{height:8.4vw;}
.mobile .mob_sec .img_4{padding-top: 16.4vw; padding-bottom: 18.2vw; position:relative;}
.mobile .mob_sec .img_4 h1{margin-bottom:3vw;}
.mobile .mob_sec .img_4 .mob_ptrn2{margin-top: 6.6vw;}

.mobile .hspot .sgnl{-ms-transform: translate(0.8vw,0.8vw); -webkit-transform: translate(0.8vw,0.8vw); transform: translate(0.8vw,0.8vw);}

.mobile .hspot .sgnl u{animation: mob_ray 0.6s linear infinite;}
.mobile .hspot .sgnl .u2{animation: mob_ray2 0.6s linear infinite;}
.mobile .hspot .sgnl .u3{animation: mob_ray3 0.6s linear infinite;}

.mobile .c1 u{border:0.5px solid #004274!important;}
.mobile .c2 u{border:0.5px solid #90140c!important;}
.mobile .c3 u{border:0.5px solid #ff9600!important;}

@keyframes mob_ray{
	0%{-ms-transform: scale(0,0); -webkit-transform: scale(0,0); transform: scale(0,0); opacity:0;}
  10%{opacity:1;}
	100%{-ms-transform: scale(2,2); -webkit-transform: scale(2,2); transform: scale(2,2);}
}

@keyframes mob_ray2{
	0%{-ms-transform: scale(2,2); -webkit-transform: scale(2,2); transform: scale(2,2);}
	100%{-ms-transform: scale(4,4); -webkit-transform: scale(4,4); transform: scale(4,4);}
}
@keyframes mob_ray3{
	0%{-ms-transform: scale(4,4); -webkit-transform: scale(4,4); transform: scale(4,4);}
  70%{opacity:1;}
	100%{-ms-transform: scale(6,6); -webkit-transform: scale(6,6); transform: scale(6,6); opacity:0;}
}

/* Mediaqueries */

@media (max-width:1366px){

    section p{line-height: 1.25vw!important; font-size: 1vw;}
    .sec3 .items ul li{margin-left: 1.5vw;}
    .sec3{height:53vw;}
    .sec4 p{width: 24vw;}
  
}

@media (max-width:1024px){


}

@media (max-width:550px){
}