*{
     margin: 0;
     border: 0;
     padding: 0;
}

body{
    margin: 0;
    padding: 0;
    background:#FFFFFF;
    font-family:,'微軟正黑體', "Microsoft JhengHe", Helvetica, serif;
    color: #1b1d1f;
    background-color: #EFEFEF;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video,input, select, textarea, button { font-family:'微軟正黑體', "Microsoft JhengHe", Helvetica, serif;}

body,html {
	height:100%;	
    
	}
/*--Basic--*/
.content {
        
    background: #ffc47f url('../img/bg.jpg') space fixed 50% 50%;
    height:100%;
    background-position-x:50%; background-position-y:50%; background-size:cover; background-image:url('../img/bg.jpg'); background-attachment: fixed;
    background-attachment:fixed; background-repeat:repeat
        
}
.content2{
		background: #a7ddc6 url('../img/bg2.jpg') space fixed 50% 50%;
    

}
.content3{
    background: #ffc47f url('../img/bg4.jpg') space fixed 50% 50%;
    height:40%;
    background-position-x:50%; background-position-y:50%; background-image:url('../img/bg4.jpg'); background-attachment:fixed; background-repeat:repeat
}

.content4{
    background: #ffc47f url('../img/bg5.jpg') space fixed 50% 50%;
    height:6%;
    background-position-x:50%; background-position-y:50%; background-image:url('../img/bg5.jpg'); background-attachment:fixed; background-repeat:repeat
}



h1{font-size: 40px;color: #393939;}
h2{font-size: 25px;color: #393939;}
h3{font-size: 22px;color: #393939;}
h4{font-size: 18px;color: #393939;}
h5{font-size: 16px;color: #393939;}
p{font-size: 14px;color: #393939;}
.space{width: 0px;height: 0px; background-color: none;color: none;position: absolute;margin-top: -65px;z-index: -1;}
/*--Nav--*/
nav ul li i{
    margin: 0 3px;
    color: #737181;
}

#gonav{
	position:absolute;
	text-align:center;
	width:100%;
    padding:0;
    top: 0;
    background: #FFF;
    height: 70px;
    z-index: 9;
}
#hnav{
    position:absolute;
	width:100%;
    padding:0;
    top: 0;
}
#hnav ul{
	list-style-type:none;
	text-align:center;
    background-color: #FFF;
    position: absolute;
    top: 0;
    width: 100%;
    overflow: hidden;
    -webkit-transition: display 0.4s;
    -ms-transition: display 0.4s;
    -o-transition: display 0.4s;
    -moz-transition: display 0.4s;
    transition: display 0.4s;
    height: 70px;
}
#hnav ul li{
    -webkit-transition: display 0.4s;
    -ms-transition: display 0.4s;
    -o-transition: display 0.4s;
    -moz-transition: display 0.4s;
    transition: display 0.4s;
}

#hnav li, #gonav li {
	display:inline;
}
#hnav li a , #gonav li a{
    z-index: 99;
	font-size:16px;	
	color:#656565;
    text-decoration: none;
    font-weight: 600;
    padding: 10px 40px;
  
}
#hnav li a:hover , #gonav li a:hover{
    color: #FED0C1;
	text-decoration:none;
}
nav ul li img{
    display: inline-block;
    width: auto;
    height: 45px;
    top: 15px;
    position: relative;

}
.go-top {
	position:fixed;
	top: 0;
	width:100%;
    display: none;
}

/*--Section Home Content--*/
section.home{
    width: 100%;
    height:100%;
    box-sizing: border-box;
    padding: 50px;
}
section.home h3{
    width: 200px;
    padding: 8px 0;
    text-align: center;
    color: white;
    border: 2px solid #FFFFFF;
    top: 35%;
    left: 15%;
    position: relative;
    -weblit-transition: background-color  0.6s;
    -moz-transition: background-color  0.6s;
    -ms-transition: background-color  0.6s;
    -o-transition: background-color  0.6s;
    transition: background-color  0.6s;
    
}
section.home h3:hover{background-color: #A1B53B;border-color: #A1B53B;}
section.home h3 a{
    text-decoration: none;
    color: #FFFFFF;
    display: block;
}

section.home h1, section.home h2{
    color: #FFFFFF;
    width: 42%;
    position: relative;
    top: 30%;
    left: 15%;
}
section.home h2{font-weight: 500;}
/*--Section About Content--*/
section.about{
    clear: both;
    width: 100%;
    height: 480px;
    text-align: center;
    line-height: 450px;
    background-color: #E7E72F;
    background-attachment: scroll;
}
.abo-med{
    width: 70%;
    height: inherit;
    line-height: 24px;
    margin: 0 auto;
   

}
.lngdec{
    width: 2px;
    height: 35px;
    margin: 0 auto;
    background-color: #7e7e7e;
}
.abo-med h1{
    padding: 30px 0;font-size: 35px;
}
.abo-med h3{padding: 10px;box-sizing: border-box; text-align: center;width: 50%;margin: 0 auto;}
.abo-med p{width: 50%;margin: 0 auto;color: #777474;}
/*---Content2 Content ---*/
.con2-med{
    width: 60%;
    height: inherit;
    overflow: hidden;
    margin: 0 auto;
}
.citem-l{
    width: 50%;
    height: 300px;
    float: left;
    margin: 100px 0 60px 0;
}
.citem-l-c{
    width: 300px;
    height: inherit;
    float: right;
    background-color: #FFF;
    text-align: center;
}
.citem-r{
    width: 50%;
    height: 300px;
    float: right;
    margin: 100px 0 60px 0;
}
.citem-r-c{
    width: 300px;
    height: inherit;
    float: left;
    background-color: #E7E72F;
    text-align: center;
}
.citem-l-c h3, .citem-r-c h3{
    padding: 30px 0;
    font-size: 26px;
}
.citem-l-c p, .citem-r-c p{
    padding: 10px 20px;
    box-sizing: border-box;
    line-height: 25px;
}
.con2-med h2{
    clear: both;
    text-align: center;
    padding-bottom: 30px;
}
.con2-med h2 a{
    display: inline-block;
    text-decoration: none;
    color: #FFF;
    letter-spacing: 0.3em;
    padding: 15px 20px;
    box-sizing: border-box;
    border: solid #DDD 3px;
    -webkit-transition: background-color 0.6s;
    -o-transition: background-color 0.6s;
    -moz-transition: background-color 0.6s;
    -ms-transition: background-color 0.6s;
    transition: background-color 0.6s;
}
.con2-med h2 a:hover{background-color: #A1B53B;border-color: #A1B53B;}
/*---Section Service--*/
section.service{
    clear: both;
    width: 100%;
    height: 300px;
    text-align: center;
    line-height: 300px;
    background-color: #FED0C1;
    background-attachment: scroll;
}
.ser-med{
    width: 70%;
    height: inherit;
    margin: 0 auto;
    line-height: 30px;
}
.ser-med h1{padding: 30px 0;}
.ser-med h4{font-weight: 500;font-size: 16px;padding: 20px 0;}


section.service-bg{
    clear: both;
    width: 100%;
    height: 700px;
    text-align: center;
    background-color: #f8cece;
    background-attachment: scroll;
    background: url(../img/bg3.jpg) no-repeat 50% 60%;
}
.serbg-med{
    width: 600px;
    height: inherit;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 50px 0;
    
}
.ser-item{
    width: 200px;
    height: 200px;
    background-color: #FFF;
    float: left;
}
.ser-item a{display: block;width: 100%;
height: inherit;cursor: initial;}
.ser-item a:hover{background-color: #82E4D5;}
.ser-item i{color: #463033;margin: 30px 0;}
.ser-mart{margin-left: 200px;}
.ser-mart2{margin-left: 400px;}
.ser-cor1{background-color:#FED0C1;}
.ser-cor2{background-color:#E7E72F;}

/*---Section Contact Content--*/
section.contact{
    width: 100%;
    height:auto;
    background-color: #82E4D5;
    background-attachment: scroll;
    text-align: center;
    box-sizing: border-box;
    padding-bottom: 30px;
}
.conta-med{
    width: 50%;
    margin:  0 auto;
}
.conta-med table{
    word-break: break-all;
    width: 100%;
    text-align: left;
    font-size: 0.9em;
    line-height: 2.3em;
}
th.tb-l{
    width: 42%;
}
th.tb-r{
    width: 58%;
}
th.tb-r input[type="text"], th.tb-r textarea{
    width: 80%;
    height: 75%;
    max-width: 400px;
    max-height: 100px;
    color: #717171;
    outline:medium;
}
th.tb-r textarea{width: 80%;height: 400px;}
th.tb-r input[type="text"]:focus, th.tb-r textarea:focus{
    background-color: #ffd2c3;
}
.redred{color: red;}
.conta-med h4{
    float: left;
    box-sizing: border-box;
    padding-top: 10px;
    color: #e58667;
    font-size: 12px;
}

.conta-med button{
    box-sizing: border-box;
    padding: 10px;
    background-color: #FFF;
    border-radius: 5px;
    font-weight: 900;
    font-size: 14px;
    border-bottom: solid 3px #a3a3a3;
    outline:medium;
    /*box-shadow: 1px 1px 2px 0px #393939;*/
}
.conta-med button:active{border-bottom: 0px;}

.conta-med h1{padding: 20px 0;box-sizing: border-box;}
/*-- FOOTER--*/
footer{
    clear: both;
    width: 100%;
    height: auto;
    background-color: #FED0C1;
    text-align: center;
    background-attachment: fixed;
    padding-bottom: 30px;
    box-sizing: border-box;
}
a#botup{
    color: #986767;
    -webkit-transition: color 0.6s;
    -o-transition: color 0.6s;
    -moz-transition: color 0.6s;
    -ms-transition: color 0.6s;
    transition: color 0.6s;
}
a#botup:hover{color:#6c2a2a; }
footer img{
    margin: 20px 0;
    width: 100%;
    height: auto;
    max-width: 200px;
}
footer h4{
    color: #4d4d4d;
    font-size: 1em;
    letter-spacing: 0.1em;
    
}
footer h4 a{
    text-decoration: none;
    color:  #986767;
    display: inline-block;
    
}
footer h4 a:hover{color:#6c2a2a; }
footer span.copy{color: #5f5f5f;font-size: 12px;}
.edesigna{
    text-decoration: underline;
    color: #393939;
}
a.edesigna:hover{color: #829039;font-weight: 900;}
/*--GO TOP BTN--*/
.topbtn{
    width: 45px;
    height: 45px;
    background-color: #F4C23D;
    z-index: 999;
    position: fixed;
    bottom: 10px;
    right: 10px;
    text-decoration: none;
    color: #FFF;
    display: block;
    text-align: center;
    line-height: 50px;
    -webkit-transition: background-color 0.6s;
    -o-transition: background-color 0.6s;
    -moz-transition: background-color 0.6s;
    -ms-transition: background-color 0.6s;
    transition: background-color 0.6s;
}
.topbtn:hover{background-color: #e8b631;}

/*-----More PAGE CSS------*/
/*-----More-basice------*/
.content-2{
    background: #FFF;
    width: 100%;
    background:url(../img/bg2.jpg) no-repeat;
    overflow: hidden;
    box-sizing: border-box;
    padding-bottom: 50px;
}
.content2-2 {
    background: #db9f9f;
    width: 100%;
    background:url(../img/pat1.png) repeat 50% 50%;
}
.test{
    width: 100%;
    height: auto;
    clear: both;
}
.content3-2{
    clear: both;
		background: #ffc47f;
		height:auto;
        background:url(../img/pat3.png) repeat 50% 50% ;
        
}
.content4-2{
        clear: both;
		background: #ffc47f;
		width: 100%;
        height: auto;
        background:url(../img/pat.png) repeat 50% 50% ;
    
}
.content5{
        clear: both;
		background: #ffc47f;
		height:auto;
        background:url(../img/pat4.png) repeat 50% 50% ;
}
.morehome{
    text-align: center; 
    font-size: 32px;
    color: #555;
}
/*-----More-home-總畫面----*/

.morehome h1{
    color: #E7E72F;
    box-sizing: border-box;
    padding: 30px 0;
}
.btn-show{
    margin:  0 auto;
    width: 500px;
    margin-top: 100px;
}

.btn-show a {
    text-decoration: none;
    display: inline-block;
    width: 200px;
    height: 200px;
    font-size: 24px;
    font-weight: 900;
    color: #A1B53B;
    background-color: #FFF;
    line-height: 200px;
    border-radius: 5px;
    margin: 10px;
    box-shadow: 0 6px 0 rgba(231, 231, 47, 0.7);
    border-radius: 5px;
}
.btn-show a:hover{background-color: rgba(240, 247, 206,0.95);}
.btn-show a:active{-webkit-transform: translate(0, 3px);
			transform: translate(0, 3px);
			box-shadow: none;}

a.backhome{
   text-decoration: none;
}
a.backhome button{
    width: 430px;
    height: 40px;
    font-size: 20px;
    font-weight: 900;
    color: #A1B53B;
    background-color: #FFF;
    box-shadow: 0 6px 0 rgba(231, 231, 47, 0.7);
    cursor: pointer;
    margin-top: 20px;
    border-radius: 5px;
}
a.backhome button:active{-webkit-transform: translate(0, 3px);
			transform: translate(0, 3px);
			box-shadow: none;}
a.backhome button:hover{background-color: rgba(240, 247, 206,0.95);}
/*-----More-page 重複性使用-----*/
.content2-2 h3, .content3-2 h3, .content4-2 h3, .content5-2 h3, .content5 h3{
    color: #AAC17F;
    text-align: center;
    font-size: 35px;
    box-sizing: border-box;
    padding: 20px 0;
}
a.sbtnu{
    position: absolute;
    left: 30px;
    margin-top: 100px;
    background-color: #FFF;
    border-style: solid;
    border-color: #CFC946;
    border-width: 0 5px 5px 0px;
    box-sizing: border-box;
    text-decoration: none;
    display: block;
    width: 35px;
    height: 140px;
     color: #313131;
    text-align: center;
}
.sbtnu span{
    display: inline-block;
    box-sizing: border-box; 
}

a.sbtnd{
    position: absolute;
    left: 30px;
    margin-top: 250px;
    background-color: #FFF;
    border-style: solid;
    border-color: #CFC946;
    border-width: 0 5px 5px 0px;
    box-sizing:border-box;
    text-decoration: none;
    display: block;
    width: 35px;
    height: 140px;
     color: #313131;
    text-align: center;
}
.sbtnd span{
    display: inline-block;
    box-sizing: border-box; 
    width:100%;
}
a.sbtnu:active, a.sbtnd:active{color: #313131;}
a.sbtnu:active, a.sbtnd:active{
    -webkit-transform: translate(0, 5px);
    -moz-transform: translate(0, 5px);
    -o-transform: translate(0, 5px);
    -ms-transform: translate(0, 5px);
    transform: translate(0, 5px);
}
.sbtnu:hover, .sbtnd:hover{background-color: #f9faf5;}
/*-----More-page2-互動式型錄-----*/
.about-med{
    width: 80%;
    margin: 0px auto;
    color: #b63d32;
    text-align: center;
    padding-top: 0px;
    height: auto;
}
.cat-l{
    width: 50%;
    float: left;
    
}
.cat-l img{
    width: 60%;
    height: auto;
    max-width: 700px;
}
.cat-r{
    width: 50%;
    float: right;
    box-sizing: border-box;
    padding: 0px 10px 0 10px;
}
.cat-r h2{
    font-weight: 600;
    color: #F4C23D;
    text-align: left;
}
.cat-r p{
    letter-spacing: 0.1em;
    padding: 5px;
    color: #656161;
    text-align: left;
    line-height: 2.5em;
}
.cate-demo{
    clear: both;
    width: 100%;
    height: auto;
}
.cate-t{
    text-align: center;
    width: 100%;
}
.cate-t h3{
    font-size: 30px;
    letter-spacing: 0.1em;
    color:  #F4C23D;
}
.cate-deco{
    width: 100%;
    height: 5px;
    background-color: #F4C23D;
}

.inline {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 10px;
}
.inline div{
    display: inline-block;
    width: 32%;
    vertical-align: middle;
    text-align: center;
}
.inline div img{
    width: 65%;
    height: auto;
}
.cate-img img{
    width: 65%;
    height: auto;
    max-width: 552px;
    box-sizing: border-box;
    padding: 0 20px;
    max-width: 400px;
    margin-bottom: 20px;
    
}
.mail-href{
    clear: both;
    text-align: center;
    box-sizing: border-box;
    padding: 10px 0;
    margin:100px 0;
}
.mail-href span{
    font-size: 22px;
    letter-spacing: 0.1em;
    color: #FFF;
}
.mail-href a{
    width: 150px;
    height: 34px;
    border-radius: 5px;
    padding: 10px 20px;
    box-sizing: border-box;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    color: #f7f7f7;
    line-height: 35px;
    margin-top: 10px;
    background-color: #bc4444; 
}
.href-deco{
    display: none;
}

/*-----More-page3-整合行銷-----*/
.mark-med{margin: 0 auto;width: 90%;height: auto;}
.mark-title{
    width: 100%;
    text-align: center;
}
.mark-title h3{
    font-size: 24px;
    color: #a22a2a;
    font-weight: 900;
}
.mark-l{
    width: 40%;
    float: left;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
}
.mark-l i{
    color: #F4C23D;
    padding: 50px;
    margin: 30px;
    border-radius: 50%;
    border: solid;
}
.mark-l h2{
    color: #a22a2a;
    font-size: 30px;
}
.mark-l p{
   
    letter-spacing: 0.1em;
    line-height: 24px;
    color: #656161;
}
.mark-r{
    width: 60%;
    float: right;
    padding: 50px 60px;
    box-sizing: border-box;
}
.mark-r h2{
    font-size: 30px;
    color:  #a22a2a;
}
.mark-r p{
    letter-spacing: 0.1em;
    line-height: 1.8em;
    color: #656161;
}
.mark-ad-bg{
    clear: both;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: auto;
    margin: 0 auto;
    box-sizing: border-box;
    padding-bottom: 30px;
}
.mark-ad-l{
    width: 50%;
    float: left;
    box-sizing: border-box;
    
}
.mark-ad-l img{
    width: 80%;
    height: auto;
    max-width:800px; 
}
.mark-ad-r{
    width:50%;
    float: right;
    padding: 50px 40px;
    box-sizing: border-box;
}
.mark-ad-r h2{
    color: #2F5E8E;
}
.mark-ad-r h3{
    font-size: 20px;
    font-weight: 900;
    color: #c49109;
    text-align: left;
    padding: 10px 0;
}
h3.text-spc{color: #EA1D1D;}
.mark-ad-r p{
    width: 90%;
    letter-spacing: 0.1em;
}

/*-----More-page4-關鍵字廣告-----*/
.key-med{
    width: 100%;
   
    margin: 0 auto;
}
.ket-top{
    width: 80%;
    margin: 0px auto 50px auto;
}
.ket-top p{
    letter-spacing: 0.1em;
    line-height: 2em;
}
.ket-top i{padding-right: 10px;}
.ket-top p span{
    color: red;
    font-weight: 900;
    font-size: 20px;
}
.key-com{
    clear: both;
    width: 100%;
    height: auto;
    display: inline-block;
    box-sizing: border-box;
    padding-bottom: 30px;
}
.key-l{
    width: 50%;
    float: left;
    text-align: center;
}
.key-l img{
    width: 50%;
    max-width: 400px;
    height: auto;
    margin-bottom: 0px;
}
.key-l h2{
   color: #F4C23D; 
}
.key-l p{
    width: 70%;
    margin: 0 auto;
    letter-spacing: 0.1em;
    line-height: 2em;
}
.key-r{
    width: 50%;
    float: right;
    text-align: center;
}



.key-r img{
    width: 50%;
    max-width: 400px;
    height: auto;
    margin-bottom: 0px;
}
.key-r h2{
   color: #F4C23D; 
   width: 100%; 
}
.key-r p{
    width: 70%;
    margin: 0 auto;
    letter-spacing: 0.1em;
    line-height: 2em;
}
img.keyimg{
    max-width: 700px;
    padding: 0 20px;
}
img.yahooimg{
    padding-top: 60px;
}
p.rrr i{
    width: 16px;
}
h4.newaddword{
    width: 50%;
    margin: 0 auto;
    text-align: center;
    font-size: 20px;
    color: green;
}
h4.newaddword p{
    color: #8d7c7c;
}
/*-----More-page5-響應式設計-----*/
.content5 h3{clear: both;}
.rwd-bgg{
    clear: both;
    width: 100%;
    padding: 0px 20px;
    box-sizing: border-box;
}
.rwd-con-l{
    width: 50%;
    height: inherit;
    float: left;
    text-align: right;
    
}
.rwd-con-l img{
    width: 75%;
    height: auto;
    max-width: 800px;
    
}
.rwd-con-l p{
    color: #616569;
    letter-spacing: 0.1em;
    line-height: 1.5em;
    width: 80%;
    padding: 0 10px;
    box-sizing: border-box;
    float: right;
    text-align: left;
}
.rwd-con-r{
    width: 50%;
    height: inherit;
    float: right;
    padding: 10px 30px 40px 0;
    box-sizing: border-box;
}
.rwd-good, .rwd-bad{
    width: 90%;
    margin: 0 auto;
}
.rwd-con-r i{color: #a22a2a;padding-right: 15px;}
.rwd-con-r span{
    font-size: 40px;
    color: #a22a2a;
}


.rwd-dec{
    width: 100px;
    height: 5px;
    background-color: #F4C23D;
    margin: 10px 0;  
}
span.stitle{
    font-size: 20px;
    color:  #336799;
    font-weight: 900;
}
.rwd-con-r p{
    width: 95%;
    letter-spacing: 0.1em;
    margin-top: 5px;
}
.rwd-s-bg{
    width: 100%;
    
    clear: both;
    padding: 0px 20px 20px 20px;
    text-align: center;
    box-sizing: border-box;
    
}
.rwd-item-med{
    margin: 0 auto;
    width: 100%;height: auto;
    display: inline-block;
}
.rwd-item{
    width: 25%;
    float: left;
   
}
.rwd-item i{
    color: #a22a2a;
    width: 100px;
    height: 100px;
    line-height: 100px;
    border: solid 2px;
    border-radius: 50%;
}
.rwd-item h3{
    font-weight: 600;
    color: #a22a2a;
    font-size: 20px;
    padding: 10px 0;
}
.rwd-item p{
    letter-spacing: 0.1em;
    padding: 0 10px;
    box-sizing: border-box;
}
.ft{
    clear: both;
    box-sizing: border-box;
    padding-top: 0px;
    padding-bottom: 30px;
}
/*------RWD-----*/
@media screen and (max-width:1355px){
    .abo-med h3{width: 80%;}
    .abo-med p{width: 80%;}
    .cat-l img{width: 90%;}
    .cate-img img{width: 90%;}
    .mark-r{padding: 50px 30px;}
    .about-med{width: 85%;}
    .con2-med{padding-bottom: 20px;}
}

@media screen and(max-width:1025px){
    .content {
        
    background: #ffc47f;
    height:100%;
/*    background-position: 50% 50%;*/
/*    background-image:url(../img/bg1.jpg) ;*/
/*    background-attachment: fixed;*/
/*    background-size: cover;*/
/*    background-repeat:space;*/
    background: url(../img/bg1.jpg) 50% 50% space ;
        
}
.content2{
		background: #a7ddc6;
/*		height:100%;*/
/*        background-position: 50% 50%;*/
/*        background:url(../img/bg2.jpg);*/
/*        background-attachment: fixed;*/
/*        background-size: cover;*/
/*        background-repeat:space;*/
        background: url(../img/bg2.jpg) 100% 100% space;
    
    
}
.content3{
		background: #ffc47f;
		height:40%;
/*        background-position: 50% 50%;*/
/*        background-image:url(../img/bg4.jpg) ;*/
/*        background-attachment: fixed;*/
/*        background-size: cover;*/
/*    background-repeat:space;*/
    background: url(../img/bg4.jpg) 50% 50% space ;
    
}

.content4{
		background: #ffc47f;
		height:80%;
/*        background:url(../img/bg5.jpg)  50% 50% fixed ;   */
/*    background-size: cover;*/
/*    background-repeat:space;*/
    background: url(../img/bg5.jpg)  50% 50% space;
}
}

@media screen and (max-width:1025px){
    .conta-med{width: 90%;}
    section.home h1, section.home h2, section.home h3{
        left: 2%;
    }
    .cat-l, .cat-r{width: 100%;}
    .cat-l{text-align: left;box-sizing: border-box;padding-left: 80px;}
    .cat-l img{width: 50%;}
    .cat-r{padding: 0 80px;}
    .cat-r p{line-height: 20px;}
    /*.content2-2{height: 128%;}*/
    .mark-ad-r{padding: 10px 50px;}
    .mark-med{width: 100%;}
    .mark-r h2{font-size: 20px;}
    .rwd-con-l{width: 100%;text-align: center;}
    .rwd-con-l p{width:100%;padding: 0 40px;}
    .rwd-con-r{width: 100%;}
    .rwd-item{width: 50%;padding: 15px;box-sizing: border-box;}
    .con2-med{width: 70%;}
    .inline div img{width: 75%;}
    /*.content5{height: 200%;}*/
}
@media screen and (max-width:880px){
    .abo-med h3{width: 100%;box-sizing: border-box}
    .abo-med p{width: 100%;}
    .abo-med{width: 80%;}
    section.home h1, section.home h2{width: 100%;}
    .content{background-position: 60% 50%;}
    .about-med{width: 100%;}
    a.sbtnu, a.sbtnd{left: 5px;}
    .citem-l, .citem-r{margin-top: 50px;margin-bottom: 30px;}
    /*.sbtnu, .sbtnd{left: 5px;width: 40px;height: 100px;}
    .sbtnu a, .sbtnd a{width: 40px;line-height: 40px;height: 100px;}
    .sbtnu{margin-top: 10px;}
    .sbtnd{margin-top: 120px;}
    .sbtnd i, .sbtnu i{width: 14px;height: 14px;margin: 0 auto;}*/
    .mark-l{width: 100%;}
    .mark-l p{padding: 0 40px;box-sizing: border-box;}
    .mark-r{width: 100%;}
    .mark-ad-l, .mark-ad-r{width: 100%;}
    .mark-ad-r p{text-align: left;}
    .con2-med{width: 80%;padding-bottom: 20px;}
    /*.mark-ad-l{text-align: center;}
    .mark-ad-l img{width: 70%;margin:  0 auto;}
    .mark-ad-r{padding: 0 50px;}*/
    /*.content3-2{height: 165%;}*/
}
@media screen and (max-width:769px){
    .key-l{width: 100%;}
    .key-r{width: 100%;margin-top: 20px;}
    .key-r h2{padding: 0 20px;box-sizing: border-box;}
    .key-r p, .key-l p{width: 90%;}
    
    
}
@media screen and (max-width:720px){
    
    .go-top, #gonav{display: none;}
    #hnav{display:none;}
    .citem-l-c, .citem-r-c{width: 250px;height: 250px;}
    .citem-l-c h3, .citem-r-c h3{font-size: 24px;padding: 20px 0;}
    .ser-med{width: 100%;}
       .morehome h1{font-size: 30px;padding: 50px 0;}
    .content-2{background-position: 45% 50%;}
    

@media screen and (max-width:641px){
    .abo-med{width: 90%;box-sizing: border-box;}
    section.about{height: 500px;}
    .content2{padding-bottom: 50px;}
    .citem-l{width: 100%;margin: 0 auto;height: 250px; margin-top: 40px;}
    .citem-r{width: 100%;margin: 0;margin-bottom: 35px;height: 250px;}
    .citem-l-c{float: none;margin:  0 auto;}
    .citem-r-c{float: none;margin:  0 auto;}
    .con2-med h2 a{padding: 10px;font-size: 16px;} 
    .ser-med h4{font-size: 14px;line-height: 24px;}
    .serbg-med{width: 400px;}
    .ser-mart, .ser-mart2{margin: 0;}
    .conta-med{width: 96%;}
    th.tb-r input[type="text"], th.tb-r textarea{width: 90%;}
    .cate-img{width: 50%;}
    .cat-l img{width: 70%;}
    /*.content2-2{height: 180%;}
    .content3-2{height: 180%;}
    .content5{height: 210%;}*/
}
@media screen and (max-width:555px){
    .content{background-position: 65% 50%;}
    .morehome h1{font-size: 24px;}
    .btn-show{margin: 20px auto;padding: 0;width: 90%;}
    .btn-show a{width: 150px;height: 150px;line-height: 150px;font-size: 20px;}
    a.backhome button{width: 320px;}
    /*.sbtnu a, .sbtnd a{width: 30px;line-height: 30px;height: 100px;}
    .sbtnu{margin-top: 10px;left: 0;border-width: 0 4px 4px 0px;}
    .sbtnd{margin-top: 120px;left: 0;border-width: 0 4px 4px 0px;}*/
    .rwd-item{width: 90%;}
    .inline div img{width: 100%;}
    h4.newaddword{width: 70%;}
    /*.content5{height: 250%;}
    .content2-2{height: 165%;}
    .content5{height: 260%;}*/
}
@media screen and (max-width:481px){
    section.about{height: auto;box-sizing: border-box;padding-bottom: 30px;}
    .citem-r{margin-bottom: 40px;}
    .btn-show{width: 100%;}
    
    .cat-r{padding: 0 50px;}
    /*.content3-2{height: 190%;}
    .content5{height: 270%;}*/
    .content-2{background: url(../img/bg2.jpg) no-repeat 85% 20%;}
    .content2{background-attachment:scroll;}
    section.home h1, section.home h2{top: 10px;}
    section.home h3{top: 20px;}
}

@media screen and (max-width:441px){
    .serbg-med{width: 300px;padding: 140px 0;}
    .ser-item{width: 150px;height: 150px;}
    .ser-item i{color: #463033;margin: 20px 0;}
    .ser-item h3{font-size: 20px;}
    /*.content5{height: 300%;}*/
    /*.content2-2{height: 140%;}
    .content4-2{height: 200%;}
    .content3-2{height: 210%;}*/
    .morehome h1{font-size: 20px;}
    a.sbtnu, a.sbtnd{left: 0px;}
    .btn-show a{width: 120px;height: 120px;line-height: 120px;font-size: 12px;}
    a.backhome button{width: 220px;font-size: 12px;}
    .btn-show{margin: 0;}
    .inline div{width: 100%;}
    .inline div img{width: 60%;}
}

@media screen and (max-width:321px){
    section.home h1, section.home h2{
        top: 10%;
    }
    section.home h2{font-size: 16px;}
    section.home h3{top:14%;}
    .about h3{font-size: 18px;}
    section.about{height: auto;box-sizing: border-box;padding-bottom: 30px;}
    .content{background: url(../img/bg.jpg) no-repeat 20% 50%;}
    .content2{background: url(../img/bg2s.jpg) no-repeat 90% 50%;height: 120%;background-color: palevioletred;height: auto;}
    .con2-med a{z-index: 999;}
    .con2-med{width: 100%;height: auto;}
    .citem-l-c{width: 250px;height: 250px;margin-top: 20px;}
    .citem-r-c{width: 250px;height: 250px;}
    .citem-l-c h3{padding: 10px 0;}
    section.contact{height: auto;box-sizing: border-box;padding-bottom: 30px;}
    .content3{height:0;}
    .ser-med h4{padding: 0px 15px;}
    .content4{background: url(../img/bg5s.jpg) no-repeat 50% 50%;border-left-color: lightpink;}
    .morehome h1{font-size: 17px;padding: 40px 0 0 0;}
    .btn-show a{width: 100px;height: 100px;line-height: 100px;font-size: 14px;}
    a.backhome button{width: 220px;font-size: 14px;}
    a.backhome button{margin: 0;}
    .cat-r h2{font-size: 20px;}
    /*.content2-2{height: 220%;}
    .content3-2{height: 415%;}
    .content4-2{height: 370%;}*/
    .rwd-good, .rwd-bad{width: 110%}
    /*.content5{height: 550%;}*/
    .cate-deco{width: 90%;margin: 0 auto;}
    .mark-ad-r h2{font-size: 20px;}
    .mark-ad-r p{width: 100%;}
    .ket-top{width: 75%;}
    .key-l h2{box-sizing: border-box;padding: 0 6px;font-size: 20px;}
    .key-l img{width: 80%;}
    .key-r img{width: 80%;}
    .key-r h2{font-size: 20px;}
    .rwd-con-l p{padding: 0 10px;}
    .cat-l img{width: 100%;box-sizing: border-box;padding: 0 20px;}
    .cat-l{padding-left: 0;}
    
}