@charset "utf-8";
/*LandingPage 樣式設定*/

body {margin: 0;font-family: "PingFangTC-Regular", "PingFangTC", Arial, Helvetica, "HeitiTC", "微軟正黑體", "Microsoft JhengHei", sans-serif;font-size: 18px !important;font-weight: 400;line-height: 1.5;color: #6C6C6C;text-align: left;background-color: #fff;}
a {color: #6C6C6C;text-decoration: none;display: inline;transition: 0.3s;}
a:hover {color: #6C6C6C;text-decoration: none;}
:root {--primary-color: #4299F0;--second-color: #F29B00;}
#Vue a:focus{outline:0}
/*#Vue button,#Vue button:focus{margin: 0;padding: 0;border:0 none;outline:0}*/

#Vue {font-size: 100%; font: 16px 'Arial', Microsoft JhengHei, sans-serif;line-height: 1.5;}
#Vue h1,#Vue h2,#Vue h3,#Vue h4{margin:0;padding: 0;}
#Vue ul{margin: 0;padding: 0;list-style: none;}
#Vue ul li{margin: 0;padding: 0;list-style: none;}
#Vue .FlexWrap{display: flex;flex-wrap: wrap}
#Vue .Wrapper{max-width: 1200px;margin: auto; }
#Vue h2{font-size:36px;color:#3f3b3a;text-align:center;line-height:1.2;margin:70px auto 50px; font-weight: bold;}
#Vue h3{ font-size: 36px; line-height: 1.6;  color: #3f3b3a; text-align: left;margin-bottom: 1%;}
#Vue .IntorBlock h3 span{ border-bottom: 3px solid #0db2b7;padding-bottom: 5px;}
#Vue .IntorBlock h3{margin:10px 0;}
#Vue .IntroWording{display: flex;}

#Vue #Block01 p{color:#4D4D4D;}
#Vue #Block01 .Intro{width:100%;font-size:16px;color:#212529;;margin:0 auto 70px;max-width: 850px; text-align: center;}
#Vue #Block01 .IntroFlow{ background:url(../images/block01bg.jpg) no-repeat top center;padding: 4px 0 70px;background-size:cover;}
#Vue #Block01 .IntroFlow h2{ color: #fff; margin:70px 0 50px; }
#Vue #Block01 ul li{background-color: rgb(0, 0, 0,.7);border-radius: 10px;padding: 2%; margin:0 1.4%; width: 30.5%;box-sizing: border-box;flex-wrap: wrap;color:#fff;}
#Vue #Block01 ul li div{width: 100%; text-align: center;}
#Vue #Block01 ul li div.IntroFlowTitle{font-size: 26px;}
#Vue #Block01 ul li div.IntroFlowWording{ width: 80%;margin:auto;}
#Vue .IntroFlowBlock {position: relative;}
#Vue .IntroFlowBlock .FlexWrap{position: absolute; top: -70px; width:100%;}
#Vue .IntroFlowBlock .FlexWrap li{width: 130px;background-color: #0e0d12; padding: 1% .2% 0; border:1px solid #0094ff; color:#fff; border-radius: 10px; margin-right: 2%;font-size: 14px;  text-align: center; box-sizing: border-box;line-height: 1}
#Vue .IntroFlowTitleBlock h3{color:#0db2b7; border-bottom: 1px solid #0db2b7;padding-bottom: 8px;font-size: 24px;margin-bottom: 30px;}
#Vue .IntroFlowTitleBlock{padding-top: 100px;color: #fff;margin-right: 410px;margin-bottom: 10px;}
#Vue .PdtList{margin:30px 0;}
#Vue .PdtList li{background-color: rgb(0, 0, 0,.7);border-radius: 10px;padding: 2%; margin:0 1.4%; width: 30.5%;box-sizing: border-box;flex-wrap: wrap;color:#fff; border:1px solid #0094ff;border-radius: 10px; }
#Vue .PdtList .PtdImg{margin-bottom: 8px;text-align: center;}
#Vue .PdtList h4{font-size: 27px;margin-bottom: 5px;}
#Vue .PdtList .PdtName{font-size: 14px;}
#Vue .PdtList .Price{font-size: 21px; color:#17c7cd;margin:30px 0;}
#Vue .IntroButtom{padding-bottom: 50px;}
#Vue #Block02 .IntroButtom{ background:#0e0d12 url(../images/block02bg.jpg) no-repeat top center; }
#Vue #Block03 .IntroButtom{ background:#0e0d12 url(../images/block03bg.jpg) no-repeat top center; }
#Vue #Block04 .IntroButtom{ background:#0e0d12 url(../images/block04bg.jpg) no-repeat top center; }

#Vue .Btn{font-size: 16px;color: #fff;text-align: center;padding: 3% 1%;background-color: #015fdf;display: block;border-radius: 6px;max-width: 120px;}
#Vue .Btn:hover{text-decoration: none; background-color: #2359a2;}
/*
#Vue .banner.sliderFrame .owl-carousel{position:relative}
#Vue .banner.sliderFrame .owl-carousel .owl-nav{position:absolute;bottom:0;width:100%;    text-align: center;}
#Vue .banner.sliderFrame .owl-carousel .owl-nav button{font-size:50px;color:#FFF;margin:15px 30px;font-size: 36px;padding: 0 15px;cursor: pointer;    font-family: "Font Awesome 5 Pro";font-weight: 900;position: relative;}
#Vue .banner.sliderFrame .owl-carousel .owl-nav button:hover{background-color:transparent}
#Vue .banner.sliderFrame .owl-carousel .owl-nav button span{padding:0 20px}
#Vue .banner.sliderFrame .owl-carousel .item{height:450px}
#Vue .banner.sliderFrame .owl-carousel .item img{position: absolute;z-index: 100;top: 0;left: 50%;transform: translate(-50%,0);width: auto;height: 450px;}

#Vue #slider1 .item .BannerImg,#Vue .slider2 .item img{position:absolute;z-index:100;top:0;left:50%;transform:translate(-50%,0);width:100%;}
#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption h1{position: absolute;left: calc( (100vw - 1200px)/2 + 25px );top: 110px;z-index: 102;margin-bottom: 3%;width:400px;height: 138px;}
#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption h1 img{width:400px; height: 138px;}

#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption p img{width: 349px; height: 56px;}
#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption p{position: absolute;left: calc( (100vw - 1200px)/2 + 50px );top: 270px;z-index: 102;}
.BtnBanner{display: block; width:349px;height: 56px;}

#Vue #slider1 .owl-item.active .carousel-caption{z-index: 105;}
#Vue #slider1 .owl-item.cloned .carousel-caption{z-index: 102;}

#Vue #slider1{position:relative}
#Vue #slider1 .owl-nav,#Vue .slider2 .owl-nav{position:absolute;bottom:-2px;width:100%}
#Vue #slider1 .owl-nav button,#Vue .slider2 .owl-nav button,#Vue .slider3 .owl-nav button{font-size:40px;color:#666;margin:0 30px;cursor:pointer;font-family:"Font Awesome 5 Pro";font-weight:900;position:relative}
#Vue .owl-prev,#Vue .owl-next{position: relative;}
#Vue .owl-prev:before{content: "\f104";position: absolute;left: 18px;}
#Vue .owl-next:before{content: "\f105";position: absolute;left: 18px;}
#Vue #slider1 .owl-nav button:hover,#Vue .slider2 .owl-nav button:hover{background-color:transparent}
#Vue #slider1 .owl-nav button span,#Vue .slider2 .owl-nav button span{padding:0 20px;opacity:0}
#Vue #slider1 .owl-item,#Vue .slider2 .owl-item{overflow:hidden}
#Vue #slider1 .item{height:450px;background-color:#000}
#Vue .slider2 .item{height:435px}

#Vue .slider2 .owl-dots{counter-reset:slides-num;position:absolute;top:87%;left:50%;margin-top:15px;color:#fff;margin-left:-26px}
#Vue .slider2 .owl-dots:after{content:" /" counter(slides-num);display:inline-block;font-size:16px;vertical-align:middle;padding-left:2px;letter-spacing:5px}
#Vue .slider2 .owl-dot{display:inline-block;counter-increment:slides-num;margin-right:5px}
#Vue .slider2 .owl-dot span{display:none}
#Vue .slider2 .owl-dot.active:before{content:counter(slides-num);display:inline-block;vertical-align:sub;font-size:25px;font-weight:700}


#Vue .owl-dots {counter-reset: slides-num;position: absolute;top: 87%;left: 50%;margin-top: 15px;bottom: 10%;color: #666;margin-left: -26px;}
#Vue .owl-dots:after {content: " /" counter(slides-num);display: inline-block;font-size: 16px;vertical-align: middle;padding-left: 2px;letter-spacing: 5px;}
#Vue .owl-dot {display: inline-block;counter-increment: slides-num;margin-right: 5px;}
#Vue .owl-dot span {display: none;}
#Vue .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{display: none;}
#Vue .owl-theme .owl-dots .owl-dot span{display: none;}

#Vue .owl-dot.active:before {content: counter(slides-num);display: inline-block;vertical-align: sub;font-size: 25px;font-weight: 700;}
*/
/*
#Vue .KvIntro{max-width: 1100px; margin:0 auto; color: #fff;display: flex;align-items: center;height: 100%;}
#Vue .KvIntro p{}
*/

#Vue .BtnTop{position: fixed; bottom: 30px;right: 10%;z-index: 1000;}
#Vue .BtnTop a{display: flex;width: 50px;height: 50px;border-radius: 100px;border: 2px solid #004280;background-color: #fff;align-items: center;justify-content: center;font-size: 20px; z-index: 1000;}
#Vue .BtnTop a:hover{text-decoration: none;}

#Vue .menuFrame{position:absolute;left:0;top:0;width:100%;height:55px;z-index:99;background-color:#0e1736}
#Vue .menuFrame.fixed{position:fixed;top:0!important;width:100%;z-index:999;background-color:rgba(14,23,54,0.9)}
#Vue .menuFrame ul{width:100%;margin:0 auto;padding:0;max-width: 1200px;}
#Vue .menuFrame ul li{display:inline-block;list-style:none}
#Vue .menuFrame ul li a{display:block;color:#FFF;font-size:17px;font-weight:500;padding:0 25px;line-height:55px;border-right:1px solid #fff;text-decoration:none}
#Vue .menuFrame ul li a.on .outline{border-bottom:1px solid #FFF}
#Vue .menuFrame ul li:last-child a{border:0}
#Vue .menuFrame ul li a span.far{display:none}
#Vue .menuFrame .left.openMenu,#Vue .menuFrame .right.contact{display:none}
#Vue .Section{margin:0 auto 50px;justify-content:center}
#Vue .Section#Block04{margin:0 auto;}
#Vue .Section#Block01{padding-top: 54px;}


#Vue .IntroBg {padding: 2% 2% 80px; box-sizing: border-box;}
#Vue .IntroBg h3{margin:0 640px 1% 2%; color: #fff;text-align: left;}
#Vue .IntroBg .IntroWording p{margin:0 43% 2% 2%;  color: #fff}
#Vue .IntroBg .BtnMore{padding: .5%; background-color: transparent; border:1px solid #fff;margin-left: 2%; }
#Vue .IntroBg .BtnMore:hover{ background-color: transparent; border:1px solid #eee; color:#eee;}
#Vue .PhotoFlow { background-color: #ecf2f7;padding: 2%;margin-top: -60px; margin-bottom: 30px;}
#Vue .PhotoFlow li{width:23%; margin:0 1%;text-align: center; font-size: 16px;-webkit-transition: all .4s ease;-moz-transition: all .4s ease;-ms-transition: all .4s ease;-o-transition: all .4s ease;transition: all .4s ease;}
#Vue .PhotoFlow li:hover{-webkit-transform: scale(1.05);-moz-transform: scale(1.05);-ms-transform: scale(1.05);-o-transform: scale(1.05);transform: scale(1.05);}
#Vue .IntroBottomImg{text-align: center;}
#Vue  #Block02 .IntroBg { background:#3396d0 url(../images/BannerBg01.png) no-repeat right 0 top; }
#Vue  #Block03 .IntroBg { background:#3396d0 url(../images/BannerBg02.png) no-repeat right 0 top;}
#Vue  #Block04 .IntroBg { background:#3396d0 url(../images/BannerBg03.png) no-repeat right 0 top;}
#Vue .Dest{display: block;}
#Vue .Mobile{display: none;}

#Vue .content.c5.contact{max-width:1140px;background-color:#ecf2f7;border-radius:5px;padding:20px 0;margin:0  auto 70px;}
#Vue .content.c5.contact .boxs{display:flex;align-items:center;justify-content:space-between;max-width:970px;margin:0 auto}
#Vue .content.c5.contact .boxs .box img{display:block;width:auto;height:100px}
#Vue .content.c5.contact .boxs .box .tech_txt{font-size:18px;line-height:22px;color:#212529}
#Vue .content.c5.contact .boxs .box a{display:block;width:155px;height:35px;line-height:35px;background-color:#015fdf;border-radius:5px;color:#FFF;font-size:16px;font-weight:700;text-align:center;text-decoration:none}

@media screen and (max-width: 1551px){
	#Vue #Block02 .IntroBg{background: #3396d0 url(../images/BannerBg01.png) no-repeat right -25vmin top;}
	#Vue #Block03 .IntroBg{background: #3396d0 url(../images/BannerBg02.png) no-repeat right -25vmin top;}
	#Vue #Block04 .IntroBg{background: #3396d0 url(../images/BannerBg03.png) no-repeat right -25vmin top;}

}

@media screen and (max-width: 1199px){
	#Vue #Block01 ul li{flex-wrap: wrap-reverse;justify-content: center;}
	#Vue img{width:100%;height: auto;justify-content: center;}
	#Vue #Block01 .BtnMore{margin: auto;}
	#Vue .content.c5.contact{max-width:80%;padding:20px}
	#Vue .content.c5.contact .boxs{max-width:100%}
	#Vue .IntroBg h3{margin:0 0 1% 2%}
	#Vue .IntroBg .IntroWording p{margin:0 0% 2% 2%;}
	#Vue .menuFrame ul li a{padding: 0px 16px;}
	#Vue .IntroFlowImg img{max-width: 100px;}
	#Vue .IntorBlock{    flex: 4 4 0;}
	#Vue .IntroImg{    flex: 3 3 0;}
	#Vue .Section .Wrapper{padding:0 3% }
	#Vue .IntroButtom .FlexImg img{max-width: 60px;}
	#Vue #Block03 .IntroButtom .FlexWrap li:nth-child(2) .FlexImg img{max-width: 90px;margin: .5em 0;}
	#Vue #Block02 .IntroButtom .FlexWrap li:nth-child(2) .FlexImg  img{max-width: 90px;margin: .5em 0;}
	#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption h1{left: calc( (100vw - 1024px)/2 + 25px );}
	#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption p{left: calc( (100vw - 1024px)/2 + 25px );}


}
/*-------------------------------------------------*/
@media screen and (max-width: 1024px) {
	#Vue {padding-top: 84px;}
	#Vue .menuFrame.fixed{top:84px!important;}
}
@media screen and (max-width: 991px) {
	/*#Vue .banner.sliderFrame .owl-carousel .item.s1 .frame .board{width:65%}*/
	/*#Vue .banner.sliderFrame .owl-carousel .item .frame .pic{width:65%;bottom:35px}*/
	/*#Vue .KvIntro{padding: 5% ;}*/
	#Vue .menuFrame{top:0;height:45px;background-color:#0e1736;border-bottom:1px solid #CCC; color: #fff;}

	#Vue .menuFrame .left.openMenu{display:block;float:left;padding-left:20px;width: 100%;box-sizing: border-box;}
	#Vue .menuFrame .left.openMenu a{display:block;color:#fff;font-size:16px;line-height:45px;padding-right:20px;text-decoration:none}
	#Vue .menuFrame .left.openMenu a span.fa{margin-right:10px}
	#Vue .menuFrame .right.contact{display:block;float:right;position: absolute; top: 0;right: 0}
	#Vue .menuFrame .right.contact a{display:block;color:#FFF;width:115px;height:45px;font-size:16px;line-height:45px;background-color:#03091f;text-align:right;padding-right:25px}
	#Vue .menuFrame ul{position:absolute;width:100%;height:auto;left:0;top:45px;display:none;margin:0;padding:0;background-color:rgba(255,255,255,0.95)}
	#Vue .menuFrame ul li{display:block}
	#Vue .menuFrame ul li a{font-size:15px;color:#131b37;line-height:45px;border-right:0;border-bottom:1px solid #CCC;padding:0 25px 0 20px}
	#Vue .menuFrame ul li:last-child {display: none;}
	#Vue .menuFrame ul li:last-child a{border-bottom:2px solid #131b37}
	#Vue .menuFrame .left.openMenu span.fa-chevron-circle-down{display:block;float:right;margin-top:15px}
	#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption h1{    left: calc( (100vw - 760px)/2 + 25px );}
	#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption p{    left:calc( (100vw - 760px)/2 + 25px );top: 220px;}
	#Vue .content.c5.contact .boxs .box img{height:60px;}
	#Vue .content.c5.contact .boxs .box .tech_txt{margin:0 20px;}
	#Vue .IntroFlowBlock .FlexWrap li{width: 18%;}
	#Vue .IntroWording{padding-bottom: 13vmin;}
	#Vue .IntroFlowTitleBlock{margin:0;}


}


@media screen and (max-width: 767px) {
	#Vue h1{font-size: 36px;}
	#Vue .IntroFlowImg img{width: 40%;}
	/*
	#Vue .banner.sliderFrame .owl-carousel .item.s1{background:#86c7da url(css-img/slider_bg.jpg) 74% center;background-size:cover}
	#Vue .banner.sliderFrame .owl-carousel .item,#Vue .banner.sliderFrame .owl-carousel .item .frame{height:480px}
	#Vue .adv-key-visual-carousel.owl-theme .owl-dots {display: block!important;position: absolute;bottom: 10px;width: 100%;}
	#Vue .owl-theme .owl-dots .owl-dot span {width: 10px;height: 10px;margin: 5px 7px;background: #D6D6D6;display: block;-webkit-backface-visibility: visible;transition: opacity .2s ease;border-radius: 30px;}
	#Vue .owl-dot.active:before,#Vue .owl-dots:after{display: none;}
	#Vue .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{display: block;}
	#Vue .owl-theme .owl-dots .owl-dot.active span{ background:#889791; }
	#Vue .banner.sliderFrame .owl-carousel .owl-nav button{display: none;}
	#Vue .KvIntro{padding: 10% 5% 0;align-items: inherit;}
	#Vue .carousel-caption{width: 100%;}
	#Vue .banner.sliderFrame .owl-carousel .item .frame .pic{z-index:98;width:95%}
	#Vue .banner.sliderFrame .owl-carousel .item.s1 .frame .board{z-index:99;width:100%;height:290px;left:0;top:0}
	#Vue .banner.sliderFrame .owl-carousel .item.s1 .frame .board h1{font-weight:550}
	#Vue .banner.sliderFrame .owl-carousel .item.s1 .frame .board h1,#Vue .banner.sliderFrame .owl-carousel .item.s1 .frame .board h3{padding:0 10px}
	*/
	#Vue .IntroWording{display: flex;flex-wrap: wrap-reverse;}
	#Vue .IntorBlock,#Vue .IntroImg{flex: inherit;}
	#Vue .PdtList li{width: 100%;margin-bottom: 5%;}
	#Vue .IntroFlowBlock .FlexWrap{justify-content: space-between;align-items: center;}
	#Vue .IntroFlowBlock .FlexWrap li{width: 47%;margin-bottom: 4%;display: flex;justify-content: center;align-items: center;flex-flow: wrap;min-height: 42vmin;}
	#Vue .IntroFlowBlock .FlexWrap li .FlexImg{width:100%;}
	#Vue .IntroButtom .FlexImg img{max-width: 70px;}

	#Vue #Block02 .IntroButtom .FlexWrap li:nth-child(2) .FlexImg img,#Vue #Block03 .IntroButtom .FlexWrap li:nth-child(2) .FlexImg img{margin:0;}
	#Vue .IntroTop{margin-bottom: 80px;}
	#Vue .IntroFlowTitleBlock{margin:0;}
	#Vue .IntroFlowBlock{padding-top: 90vmin;}
	#Vue .Wrapper{width: 100%;}
	#Vue img{width:100%; height: auto;}
	#Vue .PdtList li{padding: 6%;}


	/*#Vue .banner.sliderFrame .owl-carousel .owl-item .item{    background-position: 0px -42vmin;}*/
	#Vue .Wrapper{width: 100%;padding: 5%;box-sizing: border-box;}
	#Vue img{width:100%;}
	#Vue  h2{ font-size: 26px;margin: 13vmin 0;}
	#Vue #Block01 .IntroFlow h2{margin: 13vmin 0;}
	#Vue  h3{font-size: 26px;}
	#Vue .Section{margin: 0;}
	#Vue #Block01 ul li{width:100%; margin:0 0 8vmin;padding: 4%;}
	#Vue #Block01 .IntroFlow{padding-bottom: 10vmin;}
	#Vue #Block01 .Intro{margin-bottom: 5vmin;}
	#Vue #Block01 .IntroImg{flex:1 1 auto;}
	#Vue #Block01 .IntroWording{flex:  2 2 auto;}
	/*#Vue .IntroBg{height: 0;padding-bottom: 60%;}*/
	#Vue .IntroBg h3{font-size: 18px;margin: 0;line-height: 1.3;margin-bottom: 4%;}
	#Vue .IntroBg .IntroWording p{    margin: 0 0 5%;}
	#Vue .PhotoFlow li{width: 48%;}
	/*#Vue .owl-dots{top: inherit;bottom: 5%;}*/
	#Vue .Dest{display: none;}
	#Vue .Mobile{display: block;}
	/*
	#Vue #slider1 .item img, #Vue .slider2 .item img{ width: 100%;height: auto; }
	#Vue #slider1 .item{    height: 0;padding-bottom: 116%;}
	#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption h1{left: 0;top: 5vmin;z-index: 102;font-size: 30px;line-height: 1.3em;margin-bottom: 3%;width: 82%;right: 0;margin: auto; text-align: center}
	#Vue .banner.sliderFrame .owl-carousel .item .carousel-caption p{font-size: 16px;left: 0;top: 28vmin;z-index: 102;width: 82%;right: 0;margin: auto; text-align: center;}
	#Vue .BannerImg{ background-color: #082a8e }
	*/
	#Vue .content.c5.contact .boxs{display:block}
	#Vue .content.c5.contact .boxs .box{width:100%;text-align:center}
	#Vue .content.c5.contact .boxs .box img,#Vue .content.c5.contact .boxs .box a{margin:10px auto}
	#Vue .IntroFlowTitleBlock h3{font-size: 20px;}
	#Vue .PdtList h4{font-size: 20px;}
	#Vue #Block02 .IntroButtom{padding:0;}

}
@media screen and (max-width: 580px) {
	#Vue{padding-top: 69px;}
	#Vue .menuFrame.fixed{top:69px!important;}
}
@media screen and (max-width: 500px) {
	/*#Vue .IntroBg{height: 0;padding-bottom: 120%;}*/
	#Vue #Block02 .IntroBg{background-size: cover;background-position: -78vmin 0;}
	#Vue #Block03 .IntroBg{background-size: cover;background-position: -78vmin 0;}
	#Vue #Block04 .IntroBg{background-size: cover;background-position: -78vmin 0;}
	#Vue .IntroWording{padding-bottom: 25vmin;}
	#Vue .IntroFlowTitleBlock{padding-top: 30vmin;}
	#Vue .IntroTop{margin-bottom: 0;}
}

/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */
/* ====================================================== */

#Vue .vueSlider
{
	position:relative;
	height:450px;
}

#Vue .vueSlider .item
{
	overflow:hidden;
	height:450px;
}

#Vue .vueSlider .item.s1
{
	background-color:#FFF;
}

#Vue .vueSlider .item.s2
{
	background-color:#000;
}

#Vue .vueSlider .owl-nav
{
	position:absolute;
	z-index:7;
	bottom:0;
	width:100%;
	text-align:center;
}

#Vue .vueSlider .owl-nav button
{
	position:relative;
	font-size:40px;
	color:#666;
	margin:0 40px;
	cursor:pointer;
	font-family:"Font Awesome 5 Pro";
	font-weight:900;
}

#Vue .vueSlider .owl-prev,
#Vue .vueSlider .owl-next
{
	position: relative;
}

#Vue .vueSlider .owl-prev:before
{
	content: "\f104";
	position: absolute;
	left: 18px;
}

#Vue .vueSlider .owl-next:before
{
	content: "\f105";
	position: absolute;
	left: 18px;
}

#Vue .vueSlider .owl-nav button:hover
{
	background-color:transparent
}
#Vue .vueSlider .owl-nav button span
{
	padding:0 20px;
	opacity:0;
}

#Vue .vueSlider .owl-dots
{
	position:absolute;
	z-index:6;
	width:100%;
	bottom:10px;
	text-align:center;
}

#Vue .vueSlider .owl-dots .owl-dot
{
	outline:none;
}

#Vue .vueSlider .owl-dots .owl-dot.active span
{
	background:#910000;
}

#Vue .owl-carousel.vueSlider .item.s1
{
	background:url(css-img/banner1_bg.jpg) center center;
	background-size:cover;
}

#Vue .owl-carousel.vueSlider .item.s1 .inner
{
	position:relative;
	width:100%;
	max-width:1140px;
	height:450px;
	margin:0 auto;
}

#Vue .owl-carousel.vueSlider .item.s1 .logo
{
	position:absolute;
	left:40px;
	top:80px;
	width:380px;
}

#Vue .owl-carousel.vueSlider .item.s1 .logo img
{
	width:100%;
	height:auto;
}

#Vue .owl-carousel.vueSlider .item.s1 a.btn
{
	display:block;
	position:absolute;
	left:60px;
	top:240px;
	width:360px;
	height:60px;
	border-radius:5px;
	padding:13px 0 0 18px;
	background:#eb991b url(css-img/banner1_arrow.png) 95% center no-repeat;
	background-size:20px 30px;
}

#Vue .owl-carousel.vueSlider .item.s1 a.btn:hover
{
	background:#eb7d1b url(css-img/banner1_arrow.png) 95% center no-repeat;
	background-size:20px 30px;
}

#Vue .owl-carousel.vueSlider .item.s1 .btn .btnTTL
{
	font-size:24px;
	font-weight:bold;
	line-height:26px;
	color:#FFF;
}

#Vue .owl-carousel.vueSlider .item.s1 .btn .btnTXT
{
	font-size:16px;
	line-height:22px;
	color:#FFF;
}

#Vue .owl-carousel.vueSlider .item.s1 .screen
{
	position:absolute;
	right:50px;
	top:60px;
	width:480px;
}

#Vue .owl-carousel.vueSlider .item.s1 .screen img
{
	width:100%;
	height:auto;
}

#Vue .owl-carousel.vueSlider .item.s2
{
	position:relative;
	background:#000 url(css-img/banner2_bg.jpg) center center;
	background-size:cover;
}

#Vue .owl-carousel.vueSlider .item.s2 .frame
{
	position:absolute;
	z-index:7;
	width:100%;
}

#Vue .owl-carousel.vueSlider .item.s2 .frame img.logo
{
	display:block;
	width:375px;
	height:auto;
	margin:100px auto 20px auto;
}

#Vue .owl-carousel.vueSlider .item.s2 .frame img.icon
{
	display:block;
	width:55px;
	height:auto;
	margin:20px auto;
	opacity:1;
}

#Vue .owl-carousel.vueSlider .item.s2 .frame img.icon:hover
{
	opacity:0.6;
}

#Vue .owl-carousel.vueSlider .item.s2 .bgVideo
{
	position:absolute;
	z-index:6;
	width:100%;
	top:50%;
	transform:translateY(-50%);
	text-align:center;
}

#Vue .owl-carousel.vueSlider .item.s2 .bgVideo video
{
	width:100%;
	/*max-width:1440px;*/
	margin:0 auto;
}


@media screen and (max-width: 1024px)
{

	#Vue .owl-carousel.vueSlider .item.s1
	{
		background:url(css-img/banner1_bg.jpg) 60% center;
		background-size:cover;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .logo
	{
		width:280px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 a.btn
	{
		left:40px;
		width:320px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .screen
	{
		right:5%;
		width:50%;
	}
}

@media screen and (max-width: 991px)
{

	#Vue .owl-carousel.vueSlider .item.s1
	{
		background:url(css-img/banner1_bg.jpg) center center;
		background-size:cover;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .screen
	{
		right:0;
	}

	#Vue .owl-carousel.vueSlider .item.s2 .bgVideo
	{
		display:none;
	}
}

@media screen and (max-width: 900px)
{

	#Vue .owl-carousel.vueSlider .item.s1 .logo
	{
		top:110px;
		width:250px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 a.btn
	{
		top:270px;
		width:290px;
		height:50px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .btn .btnTTL
	{
		font-size:20px;
		line-height:20px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .btn .btnTXT
	{
		font-size:14px;
		line-height:20px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .screen
	{
		top:100px;
	}
}


@media screen and (max-width: 767px)
{

	#Vue .vueSlider,
	#Vue .vueSlider .item,
	#Vue .vueSlider .item.s1 .inner
	{
		height:600px;
		padding:0;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .logo,
	#Vue .owl-carousel.vueSlider .item.s1 a.btn,
	#Vue .owl-carousel.vueSlider .item.s1 .screen
	{
		position:static !important;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .logo,
	#Vue .owl-carousel.vueSlider .item.s1 .screen
	{
		width:100%;
		text-align:center;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .logo img
	{
		display:inline-block;
		width:350px;
		height:auto;
		margin:20px 0;
	}

	#Vue .owl-carousel.vueSlider .item.s1 a.btn
	{
		margin:20px auto;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .screen img
	{
		display:inline-block;
		width:400px;
		height:auto;
	}

	#Vue .owl-carousel.vueSlider .item.s2 .frame img.logo
	{
		margin-top:200px;
	}

	#Vue .owl-carousel.vueSlider .item.s2 .bgVideo
	{
		width:100%;
		height:600px;
		top:unset;
		transform:translateY(0);
	}

	#Vue .owl-carousel.vueSlider .item.s2 .bgVideo video
	{
		position:absolute;
		width:auto;
		height:600px;
		left:50%;
		transform:translateX(-50%);
	}
}


@media screen and (max-width: 479px)
{

	#Vue .vueSlider,
	#Vue .vueSlider .item,
	#Vue .vueSlider .item.s1 .inner
	{
		height:550px;
		padding:0;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .logo img
	{
		width:300px;
	}

	#Vue .owl-carousel.vueSlider .item.s1 .screen img
	{
		display:inline-block;
		width:320px;
		height:auto;
	}

	#Vue .owl-carousel.vueSlider .item.s2 .frame img.logo
	{
		width:300px;
		margin-top:180px;
	}

	#Vue .owl-carousel.vueSlider .item.s2 .bgVideo
	{
		height:550px;
	}

	#Vue .owl-carousel.vueSlider .item.s2 .bgVideo video
	{
		height:550px;
	}
}