#banner{
	overflow: hidden;
	background: #fbfbfb;
	background-image: url(/images/05/bannerBg.png);
	background-repeat: no-repeat;
	background-position: 50% 100%;
}
#banner .slick-track{
    -webkit-transition: unset;
    transition: unset;
}
.bannerslide .slick-slide a{
	opacity:1;
}
.bannerslide .slick-active a{
	opacity:1;
}
#banner .bannerslide a{
	display:block;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size: cover;
}
#banner .bannerslide a img{
	height:100vh;
	width: 100%;
}
#banner .slick-slider {
	margin-bottom: 0;
}
#banner .slick-prev,
#banner .slick-next{
	background-image:url(/images/05/banner-scrrow.png);
	background-repeat:no-repeat;
	background-position:50% 50%;
	display:block;
    left: 0;
    width: 60px;
	height:100%;
	z-index: 99;
}
#banner .slick-next{
	background-image:url(/images/05/banner-scrrow2.png);
	left:initial;
	right:0;
}
#banner .slick-prev:before,
#banner .slick-next:before{
	display:none;
}
#banner .slick-prev:hover,
#banner .slick-next:hover{
	background-color:rgba(25,25,25,0.5);
}
#banner .slick-dots {
	bottom: 0;
	opacity: 0;
}
#banner .item {
	position: relative;
	overflow: hidden;
	text-align: right;
}
#banner .item video ,
#banner .item iframe {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
}
#banner .item .art {
	position: absolute;
	top: 15%;
	left: 5%;
	z-index: 1;
	display: none;
}
#banner .item .art a::after{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
#banner .item .art h2 {
	font-size: 36px;
	color: #231e20;
	line-height: 170%;
}
#banner .item .art p {
	color: #6c6568;
	font-size: 16px;
	text-align: left;
	line-height: 170%;
}


/* page-form */
.ml9 {
  position: relative;
  font-weight: 200;
  font-size: 3em;
  text-align: center;
}

.ml9 .text-wrapper {
  position: relative;
  display: inline-block;
  padding-top: 0.2em;
  padding-right: 0.05em;
  padding-bottom: 0.1em;
  overflow: hidden;
}

.ml9 .letter {
  transform-origin: 50% 100%;
  display: inline-block;
  line-height: 1em;
  text-shadow: 2px 2px 5px #2c2c2c8f;
}
#page-form {background: rgb(237 242 246 / 5%);padding: 15px 30px;position: absolute;top: calc(50% - 100px);left: calc(82% - 435px);width: 640px;border-radius: 20px;}
#page-form fieldset.btn p{float: left;width: 65%;}
#page-form fieldset.btn p.send{float: right;width: 35%;}
#page-form form , #page-form fieldset {margin: 0;padding: 0;border: 0;display: none;}
#page-form p {overflow: hidden;color: #2e4c3d;font-size: 16px;text-align: center;display: flex;justify-content: center;align-items: center;}
#page-form ::placeholder { /* CSS 3 */

 color: #616161ad;
  letter-spacing:0.15em;

}
#page-form ::-webkit-input-placeholder { /* Chrome, Safari */

  color: #616161ad;
  letter-spacing:0.15em;
  

}
#page-form :-ms-input-placeholder { /* IE 10+ */

  color: #616161ad;
  letter-spacing:0.15em;

}
#page-form ::-moz-placeholder { /* Firefox 19+ */
  color: #616161ad;
  letter-spacing:0.15em;
  opacity: 1;

}
#page-form label { float: left; width: 100px; text-align: right; padding: 5px 0; }
#page-form .ra span { width: auto; float: left; margin-left: 10px; padding: 5px 0; }
#page-form input[type="text"] , #page-form select {width: calc(100% - 22px);padding: 10px 10px;border-radius: 5px;font-size: 15px;margin: 7px 0;color: #616161ad;letter-spacing:0.15em;font-weight: 400;font-family: 'Noto Sans TC';}
#page-form input#Checknum {width: 80px;}
#page-form select {width: calc(100% - 1px);}
#page-form p.send a {background: #ffffffeb;text-align: center;width: 50%;padding: 10px 0;border-radius: 5px;font-size: 26px;cursor: pointer;margin: 7px 0;color: #3e3e3e;display: flex;align-items: center;justify-content: center;}
#page-form p.send a img{
    width: 60px;
}
#page-form h1 {text-align: center;color: #ffffff;margin: 10px 0 20px;font-size: 35px;border-bottom: #7c7c7c4a 1px solid;line-height: 180%;padding-bottom: 10px;font-weight: 500;}
#page-form h2 img { margin-right: 5px; vertical-align: bottom; }
#page-form h2 b { display: inline-block; font-size: 24px; color: #353535; margin-right: 10px; vertical-align: baseline; }



@media screen and (max-width: 1680px) {
	#banner .slick-prev,
	#banner .slick-next{
		left: 100px;
	}
	#banner .slick-next{
		right:100px;
		left:initial;
	}
	#page-form{top: calc(35% - 85px);left: calc(92% - 500px);width: 29%;}
}

@media screen and (max-width: 1440px) {
	#page-form{top: calc(50% - 85px);left: calc(97% - 500px);width: 30%;}
	#page-form p.send a{
    font-size: 20px;
}
	#banner .slick-prev,
	#banner .slick-next{
		left: 50px;
	}
	#banner .slick-next{
		right:50px;
		left:initial;
	}
}
@media screen and (max-width: 1280px) {
	#banner .bannerslide a img{
        height: calc(100vh - 150px);
    }
    #page-form h1{
        margin: 0 0;
        padding-bottom: 0;
        line-height: 80%;
    }
    .ml9 .text-wrapper{
    padding-top: 0;
    padding-bottom: 5px;
}
	#banner .slick-prev,
	#banner .slick-next{
		left: 0px;
		background-size: 20%;
	}
	#banner .slick-next{
		right:0;
		left:initial;
	}
	#banner section { width: 100%; }
	#page-form h2 {margin: 5px 0;font-size: 26px;}
	#page-form p{
    margin-top:10px
}
	#banner {padding-top: 0;}
	#page-form{
    width: 380px;
    left: calc(100% - 490px);
    top: 267px;
    }

}
@media screen and (max-width: 1024px){
	.ml9 .letter{
        color: #ededed;
    }
    #page-form p.send input{
        background-color: #6a7e72cc;
        color: #fafafa;
    }
    #banner .bannerslide a{
    background-position: 27% 49%;
}
	#page-form {
		margin: 30px auto 30px;
		width: calc(45% - 60px);
		border-radius: 10px;
		top: 28%;
		background: #2e2e2eeb;
		}
    #banner .bannerslide a img{
    height: 680px;
}
}
@media screen and (max-width: 980px) {
	#banner .bannerslide a{
    background-position: 31% 49%;
}
	
	#banner .item video {
		width: auto;
		height: 100%;
	}
	#banner .item iframe {
		height:100%;
		transform: scale(1.4);
	}
	#banner .slick-slide img {
		max-width: inherit;
		height: calc(100vh - 195px);
	}
}
@media screen and (max-width: 928px) {
	#banner .bannerslide a{
        background-position: 0% 50%;
    }
    #banner .bannerslide a img{
        height: 790px;
    }
    #page-form{
    width: calc(90% - 60px);
    top: 61%;
    left: 5%;
}


	#page-form{
    margin: 5px auto 5px;
}
	#page-form{
        position: relative;
        width: 100%;
        margin: 0 auto;
        background: #2f4b3a;
        margin-top: 0;
        left: 0%;
        padding: 20px 0;
        border-radius: 0;
    }
    .ml9 .letter{color: #ffffff;}
	#banner{
}
    #banner .bannerslide a img{
        height: 586px;
    }
    #banner .bannerslide a{
    background-position: 0% 50%;
}
	#first-box{
		margin-top:0
	}
}
@media screen and (max-width: 480px) {
	#banner .slick-slider{
    padding-top: 25px;
    background-color: #1a2a3a;
}
	#banner .slick-prev,
	#banner .slick-next{
		display:none !important;
	}
	#banner .bannerslide a{
    background-position: 17% 50%;
}
	#banner .bannerslide a img {
		height: 380px;
	}
#page-form p.send a{
    font-size: 16px;
    width: 80%;
    padding-right: 20px;
}
	#page-form h1{font-size: 25px;}
}