@charset "utf-8";

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


	/* Orders iframe style */
	
	body{
		overflow-x:hidden;
	}


	.background{
		background:#3d3d3d url(../../img/background.png)repeat;
	}

	
	.Top{
		width:100%;
		height:100px;
		background:rgba(37, 37, 37, 0.8);
		top:0;
		left:0;
		position:fixed;
		z-index:10;
	}


	.Tops{	
		height:100%;
	}

	a.MuO,
	a.MuX
	{
		width:50px;
		height:50px;
		line-height:50px;
		background:aqua;
		position:absolute;
		text-align:center;
		top:25px;
		right:20px;
		color:#fff;
        box-sizing:border-box;
        border:1px #FBA22B solid;
        background:rgba(0, 0, 0, 0.5);	
	}


	a.MuO:hover,
	a.MuX:hover
	{
        background:#FBA22B;
	}


	
	a.Logo{
		width:300px;
		height:100px;
		background:transparent url("../../img/Logo_s.svg")no-repeat left 20px center / 70%;
		display:block;	
	}	

	
	.TopsRight{
		top:100px;
		left:0;
		z-index:100;
		background:rgba(0, 0, 0, 0.9);
		position:fixed;
		width:100%;
		height:calc(100% - 100px);	
	}


	.TopsRight .Menu{
		color:#fff;
		font-size:17px;
		font-weight:bold;
		padding:30px 0;
	}

	.TopsRight .Menu .Mu{
		height:60px;
		line-height:60px;
		display:block;
		text-align:center;
		cursor:pointer;
		position:relative;
	}
	
	
	.TopsRight .Menu .Mu.Language{
		display:block;
		margin-left:auto;
	}  		
	
	
	.TopsRight .Menu .Mu.Language a{
		color:#fff;
	} 		
	
	
	.TopsRight .Menu .Mu:hover{
		text-decoration:none;
		background:#ffd200;
		color:#000;
	}	

	.TopsRight .Menu .Mu:hover a{
		color:#000;
	}

	.TopsRight .Menu .Mu span{
		padding:0 5px;
		font-size:16px !important;
	}	

	.TopsRight .Menu .Mu.Cho{
		background:#ffd200;
	}
	
	.TopsRight .Menu .Mu .Su{
		position:absolute;
		top:50px;
		left:0;
		background:#ffd200;
		display:none;
		width:260px;
		border-radius:0 0 5px 5px;
		overflow:hidden;
	}		
	
	.TopsRight .Menu .Mu .Su.Lang{
		width:120px !important;
	}	
	
	.TopsRight .Menu .Mu:hover .Su{	
		display:block;
	}		
	
	.TopsRight .Menu .Mu .Su a{
		color:#000;
		line-height:22px;
		padding:15px 30px 15px 50px;
		display:block;
		text-align:left;
	}		
	
	.TopsRight .Menu .Mu .Su a:hover{
		text-decoration:none;
		background:#BE1721;
		color:#fff;
	}		
	

	.TopsRight .MenuFix{
	}

	.AnchorPoint{
		position:relative;
	}
	
	
	/* Ixbr Style */	
	
	.Ixbr{
		width:100%;
		height:450px;
		background:url("../../upload/ixbr/0.jpg")no-repeat center center / cover;
		z-index:0;
		position:relative;
	}


	.Ixbr .video{
		width:100%;
		min-width:1024px;
		height:450px;
		z-index:-1;
		position:absolute;
		top:0;
		right:0;
	}

	.Ixbr .video video{
		position:absolute;
		width:100%;
		height:100%;
		top:0;
		left:0;
		object-fit:cover;
	}

	.Ixbr .mask{
		width:100%;
		height:450px;
		z-index:1;
		position:absolute;
		top:0;
		left:0;
		background:rgba(0,0,0,0.3);
	}


	/* Isbr Style */	
	
	.Isbr{
		width:100%;
		height:100px;
		background:#555 url("../../upload/isbr/1.jpg")no-repeat bottom -30px center / cover;
		position:relative;
		display:flex;
		margin-top:100px;
	}

	.Isbr .name{
		width:300px;
		height:50px;
		line-height:50px;
		text-align:center;
		margin:auto;
		font-size:30px;
		font-family: "Oswald", sans-serif;	
		color:#FBA22B;
	}

	
	/* Info style */


	.Info{
		height:350px;
		margin:0 auto;	
		position:relative;
		z-index:2;
	}
	

	.Infos{			
		width:100%;
		height:100%;
		padding:120px 30px 0 30px;
		box-sizing:border-box;

	}
	
	.Infos .info1{
		color:#fff;
		font-size:25px;
		font-weight:bold;
		line-height:35px;
	}		

	.Infos .info2{
		color:#eee;
		font-size:15px;
		margin:20px 0 30px 0;
	}	
		
	.Infos .btn_info{
		display:flex;
	}		
		
	.Infos .btn_info .b1{
		width:80%;
		height:72px;
		padding-top:5px;
		color:#000;
		background:#ffd200;
		border-radius:5px;
		text-align:center;
		font-size:25px;
		font-weight:bold;
		margin-right:5px;
		display:block;
		box-sizing:border-box;
	}		
	
	.Infos .btn_info .b1 span{
		display:block;
	}		
	
	.Infos .btn_info .b1 span:nth-of-type(1){
		font-size:17px;
	}		
			
		
	.Infos .btn_info .b2{
		width:20%;
		height:72px;
		color:#000;
		background:#45CE30 url(../../img/line2.png)no-repeat center center / 90%;
		border-radius:5px;
		display:block;
	}		



	._slogan{
        color:#fff;
        font-size:25px;
        font-weight:bold;
        line-height:45px;		
	}





	
	/* Wrap style */
	
	.wrap{	
		margin:0 0 50px 0;
		color:#fff;
		padding:30px 20px;
		position:relative;
	}


 	.wraps{	
		box-sizing:border-box;
	} 


	.wrap_name{
		font-size:27px;
		font-weight:bold;
		margin:30px 0;
		color:#FBA22B;		
		text-align:center;
		position:relative;
	}	


		
 	.wrap_sub_name1{
		font-size:19px;
		font-weight:bold;
		margin-bottom:20px;
		color:#FBA22B;
	} 

 	.wrap_text{
		margin-bottom:40px;
		line-height:30px;
	} 	




	.bok_line{
		background:#FBA22B;	
		width:1px;
		height:50px;
		margin:30px auto;
	}
	

	/* article style */

 	.article{
		margin:30px auto;		
	} 
	
	.article .avatar{
		width:150px;
		height:150px;
		margin:50px auto;
		border-radius:100%;
		border:3px #FBA22B solid;	
		background:url(../../img/誠功開店財神爺.png)no-repeat top center;
	}

	
	
	/* service_container style*/
	

 	.service_container{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		box-sizing:border-box;
		margin:50px auto 70px auto;
	}
	
 	.service_container .item{
		width:98%;
		margin:1%;		
		padding:30px;
		background:#fff;
		box-sizing:border-box;
	}	
	
 	.service_container .item.info{
		border:1px #FBA22B solid;
		background:transparent;
		height:auto;
	}
	
	
 	.service_container .item .name{
		font-size:35px;
		font-weight:bold;
		color:#BE1721;
	}	
	
	
 	.service_container .item .name.info{
		font-size:30px;
		font-weight:bold;
		color:#FBA22B;
	}		
	
 	.service_container .item .text{
		color:#000;
		height:50px;
		margin:20px 0;
		text-align:justify;
	}	
	

 	.service_container .item .info_name{
		color:#FBA22B;
		height:50px;
		font-size:25px;
		font-weight:bold;		
		text-align:justify;
	}	
		

 	.service_container .item .info_text ol{
		margin-left:0px;
		padding-left:20px;
		line-height:33px;
	}			
		
		
 	.service_container .item .img{
		height:200px;
	}
	

	/* menu_case style */
	
	.menu_case{
		margin:0 auto 30px auto;
		display:flex;
		flex-wrap:wrap;
		justify-content:flex-start;
		box-sizing:border-box;
	}
	
	.menu_case a{
		width:calc(33.3% - 20px);
		margin:10px;		
		padding:20px;
		background:#fff;
		box-sizing:border-box;
		display:block;
		text-align:center;
		font-size:17px;
		font-weight:bold;
		background:#ffd200;
		color:#000;
	}
	
	.menu_case a:hover{
		background:#BE1721;
		color:#fff;
	}





	/* marquee style */

	.marquee{
		min-height:auto;
		padding:120px 50px 50px 50px;
		margin:0 auto 70px auto;
		background:rgba(37,37,37,0.9);
		position:relative;
	}
	

	.marquee .label{
		width:250px;
		height:50px;
		line-height:50px;
		background:#FBA22B;
		position:absolute;
		left:-20px;
		top:20px;
		color:#fff;
		font-weight:bold;
		font-size:17px;
		text-align:center;
	}	
	
	
	.marquee .label span{
		font-size:40px;
		transform:rotate(-20deg);
		position:absolute;
		top:3px;
		left:25px;
	}		
	
	.marquee .label_1{
		width:0;
		height:0;
		border-style:solid;
		border-width:0 20px 20px 0;
		border-color:transparent #C88122 transparent transparent;
		position:absolute;
		left:-20px;
		top:70px;		
	}	
	
	
	
	/* caseps_container style*/
	

 	.caseps_container{
		padding:30px;
		margin:50px auto 70px auto;
		background:#242424;
		position:relative;
		overflow:hidden;
	}	
	
	
 	.caseps_containers{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		box-sizing:border-box;
		box-sizing:border-box;
		margin:50px auto 70px auto;
		background:#242424;
		
	}	
	
 	.caseps_containers .caseps_box{
		margin:30px auto;
	}		
	
 	.caseps_containers .caseps_box .item{
		box-sizing:border-box;
		padding:30px;
		border:1px #FBA22B solid;
		margin-bottom:10px;
		background:#222227;
	}


	
 	.caseps_containers .caseps_box .item .lbok{
		height:30px;
		line-height:30px;
	}		
		
 	.caseps_containers .caseps_box .item .rbok{
	}		
	
	
 	.caseps_containers .caseps_box .next_step{
		margin:10px auto;
		width:50px;
		height:50px;
		line-height:50px;
		text-align:center;
	}			
	
 	.caseps_containers .caseps_box .next_step::before{
		font-family: "Material Symbols Outlined";
		content: "\f1e3";	
		font-size:25px;
	}		
	
	
	
	/* 聯絡我們 style */

 	.contact_us_container{
		padding:30px 0;
		margin:50px auto 70px auto;
	}		
	
 	.contact_us_containers{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		box-sizing:border-box;
		margin:0 auto;
	}			
	
 	.contact_us_form{
		width:100%;
		padding:50px;
		background:url(../../img/background_content_us_form.jpg);
	}		
	
 	.contact_us_form .item{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		box-sizing:border-box;
		margin-bottom:35px;
		padding-bottom:7px;
		border-bottom:1px #555 solid;
	}
	
 	.contact_us_form .item .name{
		width:150px;
		font-weight:bold;
		color:#000;
	}
	
	
 	.contact_us_form .item .name .key{
		font-weight:bold;
		font-size:13px;
		color:#fff;
		padding:2px 7px;
		background:#006DC3;
		margin-left:5px;
		vertical-align:text-top;
	}	
	

 	.contact_us_form .item .input{
		flex:1;
		color:#000;
	}
	
 	.contact_us_form .item .input input[type=text]{
		width:100%;
		height:40px;
		box-sizing:border-box;
	}

 	.contact_us_form .item .input .list{
		display:flex;
		flex-wrap:wrap;
		height:auto;
	}

 	.contact_us_form .item .input .list div{
		margin:0 10px 10px 0;
	}	
	
 	.contact_us_form .btn_box{
		margin-right:10px;
	}		
	
 	.contact_us_form .btn_box .btn_send{
		background:#ffd200;
		color:#000;
		text-align:center;
		width:150px;
		height:40px;
		line-height:40px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		display:table;		
	}		
	
 	.contact_us_form .btn_box .btn_send:hover{
		background:#BE1721;
		color:#fff;
	}		
	

	
 	.contact_us_form .btn_box .btn_send span{
		margin-right:5px;
	}	
	
	
	.contact_us_info{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		box-sizing:border-box;		
	}
	
	
	
	/* 作品展示 */
	
 	.caseshow_container{
		padding:30px 0;
		margin:0 auto;
		box-sizing:border-box;
		display:flex;
		flex-wrap:wrap;
		
	}	
	
 	.caseshow_menu_btn_call_o{
		width:30px;
		height:100px;
		line-height:100px;
		text-align:center;
		background:#ffd200;
		position:fixed;
		left:0;
		top:50%;
		z-index:10;
		margin:-50px 0 0 0;
		border-radius:0 3px 3px 0;
		cursor:pointer;
	}		
	
 	.caseshow_menu_btn_call_x{
		width:30px;
		height:100px;
		line-height:100px;
		text-align:center;
		background:#000;
		position:fixed;
		left:170px;
		top:50%;
		z-index:10;
		margin:-50px 0 0 0;
		border-radius:0 3px 3px 0;
		cursor:pointer;
		display:none;
	}	
	
	
 	.caseshow_menu{
		width:150px;
		height:calc(100% - 100px);
		position:fixed;
		top:100px;
		left:0;
		z-index:10;
		background:#000;
		padding:10px;
		display:none;
	}		

	.caseshow_menu a{
		display:block;
		color:#fff;
		padding:10px;
		border-radius:3px;
		margin-bottom:1px;
		font-weight:bold;
		font-size:17px;
	}


	.caseshow_menu a.selected,
 	.caseshow_menu a:hover
	{
		background:#ffd200;
		color:#000;
		text-decoration:none;
		
	}		
	

 	.caseshow_containers{
		width:100%;
		height:auto;
		display:flex;
		flex-wrap:wrap;
		position:relative;
	}	
	
 	.caseshow_containers .img{
		width:calc(50% - 2px);
		background:#ddd;
		margin:1px;
		position:relative;
		display:block;
		padding-bottom: 22%;
	}		


	/* radio style */

	input[type=radio].from{
		vertical-align:middle;
		margin:0px 5px 0px 0px;
		display: inline-block;
		width: 17px;
		height: 17px;
		cursor: pointer;
		background: #fff;
		border: 1px solid #c6c6c6;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		position: relative;
		vertical-align:-3px;

	}

	input[type=radio].from:checked {
		background:#336699;
		border: 1px solid #336699;
		background-clip: content-box;
	}	
	
	
	/* checkbox style */
	
	input[type=checkbox].from{
		vertical-align:middle;
		margin:0px 5px 0px 0px;
		display: inline-block;
		width: 20px;
		height: 20px;
		cursor: pointer;
		background: #fff;
		border: 1px solid #c6c6c6;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		position: relative;
		vertical-align:-3px;
	}

	input[type=checkbox].from:checked::after{
		width:17px;
		height:17px;
		background:#336699;
		font-family: "Material Icons";
		content: "\e876";
		font-size:17px;
		border: 1px solid #336699 !important;
		color:#fff;
		background-clip: content-box;
		top:0;
		left:0;
		text-align:center;
	}	
	
	
	
	/* captcha style */
  

	.container_captcha_fw{
		width:100%;
		height:40px;
		position:relative;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;		
	}

	.container_captcha_fw:after{
		content:".";
		display:block;
		height:0;
		clear:both;
		visibility:hidden;
	}

	.container_captcha_fw input[type=text].captcha{
		border:0px;
		width:100%;
		height:40px;
		padding:0px 25px;
		font-family: 'Oswald', sans-serif;
		text-align:center;
		font-size:20px;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;	
		line-height:40px;
		background:#fff;

	}

	.container_captcha_fw a.captcha_reset{
		width:30px;
		height:40px;
		display:block;
		padding:0 23px;
		position:absolute;
		top:0px;
		right:0px;
		z-index:100;
		text-align:center;
		line-height:40px;
	}

	.container_captcha_fw a.captcha_reset span{
		width:30px;
		height:40px;
		display:block;
		padding:0 20px;
		position:absolute;
		top:0px;
		right:0px;
		z-index:100;
		text-align:center;
		line-height:40px;
	}  


	.container_captcha_fw a.captcha_reset span:hover{
		transition: width .3s ,height .3s, transform .3s;
		transition-timing-function: ease;
		transform: rotate(-180deg);
	}		
	
	
	
	
	/* footer style */
	
	.footer{
		background:#242424;
		color:#fff;
		padding:50px 0 70px 0;
	}

 	.footers{
		margin:0 auto;
		padding:0 30px;
	} 
	
	
 	.footers .copyright{	
		margin-bottom:15px;
		padding-bottom:15px;
		border-bottom:1px rgba(255,255,255,0.3) solid;
	} 	
	
 	.footers .copyright_slogan{	
		font-size:30px;
		font-weight:bold;
	} 
	
 	.footers .copyright_info{	
		margin:30px 0;
	} 
		
	
	.footers .copyright_info .phone{
		color:#fff;
		padding:10px 0;
		font-size:30px;
		font-family: "Oswald", sans-serif;
	}		
	
	.footers .copyright_info .object{
		color:#fff;
		padding:10px 20px;
		font-size:20px;
		font-weight:bold;
		font-family: "Oswald", sans-serif;
		background:rgba(0,0,0,0.5);
		display:table;
	}		
	
	

	.footers .copyright_info .item{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
	}

	.footers .copyright_info .items{		
		padding:0 20px 0 60px;
		height:50px;
		line-height:50px;
		color:#fff;	
		margin:5px;
		flex:auto;
	}


	.footers .copyright_info .item .items.line{
		background:rgba(0,0,0,0.5) url(../../img/line.png)no-repeat center left 0 / contain;
	}
	
	.footers .copyright_info .item .items.qq{
		background:rgba(0,0,0,0.5) url(../../img/qq.png)no-repeat center left 0 / contain;
	}

	.footers .copyright_info .item .items.gmail{
		background:rgba(0,0,0,0.5) url(../../img/gmail.png)no-repeat center left 0 / contain;

	}

	.footers .copyright_info .item .items.wechat{
		background:rgba(0,0,0,0.5) url(../../img/wechat.png)no-repeat center left 0 / contain;
	}	
	
	
	
	
	/* other style */
	
	.anchor_fix{
		position:relative;
		top:-220px;
		height:0;
		display:block;
	}		
	
	a.BtnGoTop{
		width:100px;
		height:30px;	
		line-height:30px;	
		bottom:0;
		right:50%;
		margin:0 -50px 0 0;
		position:fixed;
		text-align:center;
		line-height:30px;
		color:#fff;
		font-size:17px;
		opacity:0;
		display:none;
		background:#ffd200;
		z-index:10;
		border-radius:5px 5px 0 0;
	}


	a.BtnGoTop:hover{
		background:#BE1721;
		text-decoration:none;
		height:40px;
		line-height:40px;
		transition:height .3s;
	}	
	

	
}