@charset "UTF-8";





@import url("https://fonts.googleapis.com/css?family=Montserrat:200,300,400,600");


.more-pens {

  position: fixed;

  left: 20px;

  bottom: 20px;

  z-index: 10;

  font-family: "Montserrat";

  font-size: 12px;

}
.flashimg{width:930px}

/** 首頁動態效果 **/
.Ivideo{ display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  height: 100vh;
    }
	

a.white-mode, a.white-mode:link, a.white-mode:visited, a.white-mode:active {

  font-family: "Montserrat";

  font-size: 12px;

  text-decoration: none;

  background: #212121;

  padding: 4px 8px;

  color: #f7f7f7;

}

a.white-mode:hover, a.white-mode:link:hover, a.white-mode:visited:hover, a.white-mode:active:hover {

  background: #edf3f8;

  color: #212121;

}



body {

  margin: 0;

  /*background-image:url(../images/bgC.jpg);*/

  /*background-repeat:repeat;*/



  /*background: #000000;*/

  font-family: "Microsoft YaHei" !important;

  -moz-user-select: none;  /* for Firefox */ 

  -webkit-user-select: none;   /* for Chrome */

  font-weight: normal;

  font-size:16px;

}



.move_title {

  z-index: 10;

  position: absolute;

  left: 50%;

  top: 45%;

  transform: translateX(-50%) translateY(-50%);

  text-align: center;

  width: 100%;

}

.move_title h1 {

  position: relative;

  color: #EEEEEE;

  font-weight: 400;

  font-size: 1.8em;

  padding: 10px 0px;

  margin: 0;

  text-shadow: 0 0 15px #000155;

  line-height:35px;

}

.move_title h1 span {

  font-weight: 600;

  padding: 0;

  margin: 0;

  color: #BBB;

}

.move_title h2 {

  font-size: 1.2em;

  padding: 0;

  margin: 0;

  line-height: 1;

  color: #c00;

  letter-spacing: 2px;

  margin-top:20px;

}



.word h1 {

  position: relative;

  color: #EEEEEE;

  font-weight: 600;

  font-size: 1.1em;

  padding: 0;

  margin: 0;

  margin-top:5px;

  /*text-shadow: 0 0 15px #000155;*/

}

.word h1 span{

  font-weight: 600;

  padding: 0;

  margin: 0;

  color: #BBB;

}



.word h2 {

  font-size: 1.1em;

  padding: 0;

  margin: 0;

  margin-top:5px;

  line-height: 1;

  color: #000000;

  font-weight: 600;

}



.logo

{

	width:160px;

	margin-top: 10px;

}



.word

{

	margin-top:20px;

	width:480px;

}



.topbar 

{

	z-index:11;

	position: absolute;

	left:0%;

	top:0%;

	padding-top:10px;

	padding-left:20px;

}



.footer 

{

	display:none;

	z-index:11;

	position: absolute;

	height:80px;

	width:100%;

	background-color:#fff;

	bottom:0;

	padding-top:10px;

	padding-bottom:10px;

}



.m_footer 

{

	display:none;

	z-index:11;

	position: absolute;

	height:60px;

	width:100%;

	background-color:#fff;

	bottom:0;

	padding-top:10px;

	padding-bottom:10px;

}



.footer p

{

	line-height:30px;

	padding-left:20px;

	margin:0px;

	font-family: "微軟正黑體",Helvetica,Arial,sans-serif;

	color:#000;

	font-size:14px;

}



.m_footer p{

	line-height:30px;

	padding-left:20px;

	margin:0px;

	font-family: "微軟正黑體",Helvetica,Arial,sans-serif;

	color:#000;

	font-size:14px;

}



.s_footer

{

	display:none;

}



.s_footer p

{

	line-height:25px;

	padding-left:10px;

	padding-right:10px;

	margin:0px;

	font-family: "微軟正黑體",Helvetica,Arial,sans-serif;

	color:#000;

	font-size:14px;

}



.iconbtn

{

	z-index:11;

	position: absolute;

	height:50px;

	background-color:#fff;

	bottom:0;

	right:0;

	margin-right:50px;

}



.iconbtn a{

	margin-left:10px;

	margin-right:10px;

}



.iconbtn img{

	height:24px;

}



.triangle1 {

	z-index:12;

	position: absolute;

	bottom:80px;

    /*border-color: #FF0000 transparent transparent transparent;*/

    border-color: transparent #fff #fff #fff;

    border-style: solid solid solid solid;



    /* 設定邊框大小可拼湊出任意形狀的三角形 */

    border-width: 100px 0px 0px 1200px;



    /* 設定 width、height 可更好理解原理 */

    height: 0px;

    width: 0px;

}



.triangle2 {

	z-index:12;

	position: absolute;

	bottom:80px;

	right:0px;

    /*border-color: #FF0000 transparent transparent transparent;*/

    border-color: transparent #FF0000 transparent transparent ;

    border-style: solid solid solid solid;



    /* 設定邊框大小可拼湊出任意形狀的三角形 */

    border-width: 120px 720px 0px 0px;



    /* 設定 width、height 可更好理解原理 */

    height: 0px;

    width: 0px;

}



.triangle3 {

	z-index:13;

	position: absolute;

	bottom:80px;

	right:0px;

    /*border-color: #FF0000 transparent transparent transparent;*/

    border-color: transparent #fff transparent transparent ;

    border-style: solid solid solid solid;



    /* 設定邊框大小可拼湊出任意形狀的三角形 */

    border-width: 60px 720px 0px 0px;



    /* 設定 width、height 可更好理解原理 */

    height: 0px;

    width: 0px;

}



.navbar{

	width:100%;
	margin-bottom:0px;
	z-index:25;
	position:absolute

}

.hero-container
{
	position: absolute;
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    padding: 0;
    overflow: hidden;
	z-index:-1;
}

.video-bg{
    object-fit: cover;
    width: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    height: 100%;
}


.text-wrapper
{
    padding: 0 5%;
    height: 100%;
    max-width: 1440px;
    margin: 0 auto;
}

.hero-up
{
	position: relative;
    height: 100%;
	float: left;
    display: block;
    margin-right: 3.07692%;
    width: 85.27473%;
    margin-left: 7.36264%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	height:100%;
}

.text-render
{
	text-align: center;
    margin-left: auto;
    margin-right: auto;
	align-self: center;
}

.text-xxl
{
	color:#fff;
}

.text-xxl h1
{
	/* font-size:70px; */
	margin:20px auto;
	font-size:4em;
}

.text-xxl .description
{
	/* font-size: 30px; */
	margin:10px auto;
	/* font-size:1.5em; */
	font-size:2em;
}

.main-div
{
	/* margin-top:99px; */
	width: 100%;
    min-height: 450px;
}


/** 針對不同尺寸下微調 **/

@media (min-width: 1200px){

	.footer{display:inline;}

	.m_footer{display:none;}

}



@media (max-width: 1200px){

	.footer{display:none;}

	.m_footer

	{

		display:inline;

		height:100px;

		bottom:0px;

		padding-top:10px;

		padding-bottom:10px;

	}

	.s_footer p

	{

		line-height:25px;

		padding-left:10px;

		padding-right:10px;

		margin:0px;

		font-family: "微軟正黑體",Helvetica,Arial,sans-serif;

		color:#000;

		font-size:10px;

	}

	.triangle1{bottom:100px;}

	.triangle2{bottom:100px;}

	.triangle3{bottom:100px;}

}



@media (max-width: 992px){
	
	/** 首頁動態效果 **/
.Ivideo{ height: 80vh;
    }
	}


	

@media (max-width: 767px){

	.m_footer

	{

		display:none;

	}

	.iconbtn{

		right:auto;

		bottom:170px;

		text-align:center;

		width:100%;

		height:40px;

		padding-top:10px;

		padding-bottom:10px;

		

	}

	.iconbtn img

	{

		height:20px;

	}

	

	.footer 

	{

		display:none;

	}

	

	.s_footer

	{

		display:inline;

		z-index:11;

		position: absolute;

		height:170px;

		width:100%;

		background-color:#fff;

		bottom:0;

		padding-top:10px;

		text-align:center;

	}

	

	.s_footer p

	{

		line-height:25px;

		padding-left:10px;

		padding-right:10px;

		margin:0px;

		font-family: "微軟正黑體",Helvetica,Arial,sans-serif;

		color:#000;

		font-size:10px;

	}

}



@media (max-width: 640px){

	.ml15{ padding-top:40% !important}	
	.iconbtn{

		right:auto;

		bottom:70px;

		text-align:center;

		width:100%;

		height:40px;

		padding-top:10px;

		padding-bottom:10px;

		

	}

	.iconbtn img

	{

		height:20px;

	}

	

	.footer 

	{

		display:none;

	}

	

	.s_footer

	{

		display:inline;

		z-index:11;

		position: absolute;

		height:70px;

		width:100%;

		background-color:#fff;

		bottom:0;

		padding-top:10px;

		text-align:center;

	}

	

	.s_footer p

	{

		line-height:25px;

		padding-left:10px;

		padding-right:10px;

		margin:0px;

		font-family: "微軟正黑體",Helvetica,Arial,sans-serif;

		color:#000;

		font-size:10px;

	}

	

	.mm_hidden

	{

		display:none;

	}

}

.text-xxl
{
	font-size:12px;
}


@media (max-width: 480px){



}