﻿@charset "utf-8";
/* CSS Document */
body { font-family: Microsoft JhengHei;}
h1, h2, h3, h4, h5, h6 { font-family: Microsoft JhengHei;}
h1 {font-size:40px; line-height:46px;}
h2 {font-size:36px; line-height:42px;}
h3 {font-size:30px; line-height:36px;}
h4 {font-size:24px; line-height:30px;}
h5 {font-size:18px; line-height:24px;}
h6 {font-size:14px; line-height:20px;}

/* ====== intro Start ====== */
#intro { padding-top:120px;}
#intro,#team,#portfolio  { min-height:100vh;}
#team .title , #team .title p { padding-bottom: 0;}
#intro h2 { font-size: 36px; color: #EB5424;  line-height: 40px;}
#intro h5 { /*font-size: 18px;*/ color: #00CCFF;}
/*#intro img { margin:0 auto;}*/

/* ====== intro End ====== */

/* ====== work Start ====== */
#work .title {
    padding: 100px 60px 0 60px;
}
#work .bg-red, #work .bg-black {
    padding-bottom: 30px;
}

/* ====== work End ====== */

/* ====== home Start ====== */
    
#home { background: url('../images/home-bg.jpg') 50% 0 repeat-y fixed;  /*background-size: cover;*/  }
#home h1{  text-shadow: 0 0 12px rgba(0,0,0,1);}
#home h2 { text-shadow: 0 0 12px rgba(0,0,0,1); letter-spacing: 1px;}
/* ====== home End ====== */

/* ====== team Start ====== */

#team {position:relative; background: #202020 url('../images/team-bg.jpg') 50% 0 repeat-y fixed;  /*background-size: cover;*/}
#team_mask {background:url(../images/team_dot.png) repeat; width:100%; height:100%; position:absolute; z-index:2;  /*margin-top: -100px;  margin-bottom: 100px;*/ }
#team>.container{position:relative; z-index:3;}

/* ====== team End ====== */


/* ====== price Start ====== */
/*#price,#price .title h2 {color:#FF0000;}*/
#price, #price .title h2{ color: #FFF;  font-weight: 100; background: #EB5424;}
#price h4 {color: #FFFF00;font-weight: 100; letter-spacing: 3px;}
#price h4 a{color: #FFFF00;font-weight: 100; letter-spacing: 3px;}
#price h4 a:hover{color: #FFFFFF;font-weight: 100; letter-spacing: 3px;}
/* ====== team End ====== */


/* ====== portfolio Start ====== */
#portfolio .title p { letter-spacing:0;} 
#portfolio .col-sm-2, #portfolio .col-md-2 { padding-left:10px; padding-right:10px;}
/* ====== team End ====== */


/* ====== contact Start ====== */
#contact {position:relative; background: #091466 url('../images/contact-bg.jpg') 50% 0 repeat-y fixed; /*background-size: cover;*/}
#contact_mask{background:url(../images/contact_dot.png) repeat; width:100%; height:100%; position:absolute; z-index:2;  /*margin-top: -100px;  margin-bottom: 100px;*/}
#contact>.container{position:relative; z-index:3;}
#contact .title a,#contact .title a:hover { color:#FFF; }    
#contact h4 { color:#FFFF00; text-shadow: 0 0 12px rgba(0,0,0,1);}
#sendMsg { background:#EB5424; color:#FFF;}
#sendMsg:hover { color: #EB5424;  background: #FFF;}
/* ====== contact End ====== */

.modal-title { color:#EB5424; }
.modal-content { margin:40% 0;}
#contact form { text-align:left;}
select { color:#444; font-size:14px; }
/* ====== footer Start ====== */

footer {  border-bottom:none; padding:30px 0; }
footer p { font-size:14px; line-height:20px; margin:0;}
@media screen and (min-width:481px) {

    

    #f_tel {text-align:right;}
    #f_email {text-align:left;}
}

/* ====== footer End ====== */


@media screen and (min-width:920px) {
/* 針對PC調整 */
    #home { background: url('../images/home-bg.jpg') 50% 50% no-repeat fixed;  background-size: cover; }
    #team { background: #202020 url('../images/team-bg.jpg') 50% 50% no-repeat fixed; background-size: cover; }
    #contact { background: #091466 url('../images/contact-bg.jpg') 50% 50% no-repeat fixed;  background-size: cover; }
}
@media screen and (max-width: 980px) {
    #work .title { padding: 80px 0px 20px 20px; }
}




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

    /* 文字大小 */
    
    h1 {font-size:36px; line-height:42px;}
    h2 {font-size:30px; line-height:36px;}
    h3 {font-size:24px; line-height:30px;}
    h4,h5,#work h3 {font-size:16px; line-height:24px;}    
    h6,#team h4 {font-size:14px; line-height:20px;}     
    #team h3 { font-size: 12px; line-height:18px; }
    
}

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

    #home h1{ font-size: 34px; }
    #home h2 {font-size: 24px; line-height: 28px;}
    #intro .title h2 { font-size: 18px; line-height: 24px; padding-bottom:5px;}
    
    #team .team-des { padding: 5px 10px;}
    #team h3 { margin-top:0px;}
    #team .col-xs-4 {padding-left:5px; padding-right:5px;}
    #work .title p { padding-right:15px;}
    #work .title { padding-top:0;}
    #price h4 { letter-spacing: 1px; font-size: 14px;}

    #contact h2 {line-height:36px;}
    #contact .title{ padding-bottom:5px; }
    #contact.title p { padding-bottom:0;  }
    #contact h2 { padding-bottom:5px; }
    #contact h4 {font-size:18px; }
}
.salesInfo h4 {
    color: #07AF8E;
    text-align: left;
    line-height: 30px;
}
.salesInfo p a {
    color: #888;
}
.salesInfo p {
    font-size: 18px;
    line-height: 30px;
    margin-bottom: 20px;
    color: #888;
    border-bottom: 1px #eee solid;
    width: 250px;	
}
