/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 13 2023 | 02:31:06 */
body {
	background-color:#eff0f1!important;

}
/* nav */

/* section1 */
.section1{
	width: 100%;
	height: 100vh;
	min-height: 700px;
	background-color: #eff0f1;
	position: relative;
}
.section1 .article {
	width: 100%;
  padding-top: 33vh;
  padding-left: 40vw;
	position: absolute;
	color:#fff;
	z-index: 2;
}
.section1bg01{
	width: 100%;
	height: 100vh;
	min-height: 700px;
	background-image: url("https://www.optoma.com/wp-content/uploads/2023/09/sec01bg_01.jpg");
	background-attachment: scroll;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	/*動畫縮寫*/
	animation:flash 1.5s ease-in-out 1s infinite alternate;
	-moz-animation:flash 1.5s ease-in-out 1s infinite alternate;
	/*動畫名稱 秒數快慢 速率 延遲秒數 次數 相反或正常播放*/	
}
.section1bg02{
	width: 100%;
	height: 100vh;
	min-height: 700px;
	background-image: url("https://www.optoma.com/wp-content/uploads/2023/09/sec01bg_02.jpg");
	background-attachment: scroll;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	top: 0;
	left: 0;
}
@-webkit-keyframes flash {
0% { opacity:0 }
50% { opacity:0.7 }	
60% { opacity:0.5 }		
70% { opacity:0.9 }	
80% { opacity:0 }	
100% { opacity:0.3  }
}
@-moz-keyframes flash {
0% { opacity:0 }
50% { opacity:0.7 }	
60% { opacity:0.5 }		
70% { opacity:0.9 }	
80% { opacity:0 }	
100% { opacity:0.3  }
}
@-o-keyframes flash {
0% { opacity:0 }
50% { opacity:0.7 }	
60% { opacity:0.5 }		
70% { opacity:0.9 }	
80% { opacity:0 }	
100% { opacity:0.3  }
}



/* scroll bt*/
.section1 .gonext {
	height: 50px;
	width: 50px;
	right: 50%;
	bottom: 1vh;
	background-image: url(https://www.optoma.com/wp-content/uploads/2023/09/gonext.png);
	background-repeat: no-repeat;
	margin-right: -25px;
	cursor: pointer;
	z-index: 4;
	position: absolute;
	/*漸變*/
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-ms-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
	transition: all .5s ease 0s;
}
.section1 .gonext:hover {
	opacity: 0.5;
}

.animation_topmove {
	/*動畫名稱 秒數快慢 速率 延遲秒數 次數 相反或正常播放*/
	/*animation: show-2 5s ease-in-out infinite（infinite参数可以设置重复播放）*/
	animation: topmove 2s ease 1s infinite forwards;
	-moz-animation: topmove 2s ease 1s infinite forwards;
	-webkit-animation: topmove 2s ease 1s infinite forwards;
}
/*動畫*/
@keyframes topmove {
0%   {transform: translate(0,0);}
50% {transform: translate(0, 20px);}
100%  {transform: translate(0,0);}
}
@-moz-keyframes topmove {
0%   {opacity: 0;}
100%  {opacity: 1;}
}
@-webkit-keyframes topmove {
0%   {opacity: 0;}
100%  {opacity: 1;}
}	
/* section2*/
.section2{
	width: 100%;
	height: auto;
	background-image: url("https://www.optoma.com/wp-content/uploads/2023/09/sec02bg.jpg");
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.section2 .article {
	width: 60%;
	margin: 0 auto;
	padding: 12% 0;
}

	
/* motion */
.motion{
	width: 100%;
	height: 3px;
	background: linear-gradient(248deg, #f3f9fb, #d8edf2, #79b4bd, #39747e, #1e585d);
	background-size: 1000% 1000%;

-webkit-animation: colormotion 4s ease infinite alternate;
-moz-animation: colormotion 4s ease infinite alternate;
-o-animation: colormotion 4s ease infinite alternate;
animation: colormotion 4s ease infinite alternate;
}
@-webkit-keyframes colormotion {
    0%{background-position:0% 71%}
    50%{background-position:100% 30%}
    100%{background-position:0% 71%}
}
@-moz-keyframes colormotion {
    0%{background-position:0% 71%}
    50%{background-position:100% 30%}
    100%{background-position:0% 71%}
}
@-o-keyframes colormotion {
    0%{background-position:0% 71%}
    50%{background-position:100% 30%}
    100%{background-position:0% 71%}
}
@keyframes colormotion { 
    0%{background-position:0% 71%}
    50%{background-position:100% 30%}
    100%{background-position:0% 71%}
}

/* section3 */
.sectiontitle{
	width: 100%;
	height: auto;
	background-color: #0b0e14;
	overflow: hidden;
	
}
.sectiontitle .center1200 {
    padding: 10% 5% 20% 5%;
	text-align: center;
}	
.sectiontitle .center1200 p, .titlecolor{
	color: rgba(254, 171, 130, 0.1);
	/*背景圖*/
	background-color: #fff;
	background-repeat: no-repeat;
	background-image: url("https://www.optoma.com/wp-content/uploads/2023/09/secbg_text.jpg");
	background-position: 50% 50%;
	background-size: cover;
	background-attachment: fixed;
	
	/*遮色片*/
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
}
.section3{
	width: 100%;
	height: auto;
	background-color: #0b0e14;
}
.section3 .flex-container {
    flex-direction: row-reverse; /*逆向*/
}
.section3 .img{
	width:100%;
}
.section3 .text{
	padding: 2% 0;
}
.section3 .contentA{
	max-width: 700px;
	padding: 6% 5% 0 0; 
}
.section3 .contentB{
	max-width: 800px;
}
.section3 .contentC{
	max-width: 1400px;
	padding: 5% 0;
}
.section3 .contentC .model{
	max-width: 100px;
	padding-top: 0.3%;
	float: right;
}
.section3 .contentC .text{
	max-width: 600px;
}
/* section4 */
.section4{
	width: 100%;
	height: auto;
	background-image: url("https://www.optoma.com/wp-content/uploads/2023/09/sec04bg.jpg");
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.section4 .article {
	max-width: 30vw;
	padding: 30% 0 80% 0;
}	
/* section5 */
.section5{
	width: 100%;
	height: auto;
	background-color: #eff0f1;
}
.section5 .article{
	padding: 15% 0;
}
.section5 .article .img{
	padding: 0 8%;
}
.section5 .article .img img{
	border-radius: 10px;
}
.section5 .article .text{
	padding: 5% 0;
}
/* section6 */
.section6{
	width: 100%;
	height: auto;
	background-color: #f7f7f8;
	
}
.section6 .article {
	width: 100%;
    padding: 15% 0 0 0;
	margin: 0 auto;
}
.section6 .imgarea {
	width: 100%;
  padding: 5% 0;
	margin: 0 auto;
}
.section6 .imgarea img {
	border-radius: 10px;
	transition: transform 300ms ease;
	/*漸變*/
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-ms-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
	transition: all .5s ease 0s;
}
.section6 .imgarea img:hover {
	 transform: scale(1.1, 1.1);
}

/* section7
.footer {
	width:100%;
	padding: 2% 0;
	background-color: #eff0f1;
	text-align: center;
} */
/* section8 */

/* section9 */

/* section10*/

/* section11*/

/* section12*/

/* spec*/


