@charset "utf-8";

/* =============================================================================

   BASIC

   ========================================================================== */

html, body { height: 100%; }

body { background: #FFF;}

body, th, td, input, p { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-size:15px;}

h1 { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-weight:normal;}

h2 { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-weight:normal;}

h3 { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-weight:normal;}

h4 { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-weight:normal;}

h5 { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-weight:normal;}

h6 { font-family:"Hiragino Kaku Gothic Pro","微軟正黑體","Microsoft Jhenghei",Helvetica,Arial,sans-serif; font-weight:normal;}

a:link, a:visited { cursor:pointer; text-decoration: none;}

a { color: #000; }

a:focus, a:hover { color: #666; }

.cboxPhoto{}

img{ max-width:100%;

-webkit-transition: 0.4s ease-in-out;

   -moz-transition: 0.4s ease-in-out;

    -ms-transition: 0.4s ease-in-out;

     -o-transition: 0.4s ease-in-out;

        transition: 0.4s ease-in-out;

}



.zoom:hover {

    -webkit-transform: scale(1.1, 1.1);

    -moz-transform: scale(1.1, 1.1);

    -ms-transform: scale(1.1, 1.1);

    -o-transform: scale(1.1, 1.1);

    transform: scale(1.1, 1.1);

	box-shadow:0 0 30px rgba(0,0,0,.5);

  } 



#wrapper{ width:954px; margin:auto; padding:120px 0 60px 0; position:relative;}

#header{ padding:30px 20px;}



#banner{ margin:-140px 0 0 0;}





#content{ border:solid 2px #98C55F; background:#FFF; border-radius:30px;  padding:20px 0 30px; margin:0;}



.inner{ width:950px; margin:auto; text-align:center; background:#FFF; padding:20px 0;}



.step_box{ background:url(../images/step_box_bg.jpg) no-repeat center bottom; border:3px solid #CCC; padding:10px; overflow:auto; height:300px; margin:10px;}

.step_box h1{ color:#49B3DB; font-size:30px; padding:10px 0;}

.step_box ol, .step_box li{ display:block; list-style:none; padding:0; margin:0;}

.step_box h3{ font-size:48px; color:#FFF; margin:0 0 0 0; line-height:48px;}

.step_box h3 span{ font-size:30px;}

.step_box li{ width:21%; float:left; padding:5px 2%;  color:#FFF; font-size:15px;}



.info_box{ border:3px solid #CCC; padding:10px; overflow:auto; margin:10px; }

.info_box ol, .info_box li{ display:block; list-style:none; padding:0; margin:0;}

.info_box li{ width:31%; float:left;  font-size:15px; height:280px; line-height:1.4em; margin:0 0 15px 0;

-webkit-transition: 0.4s ease-in-out;

   -moz-transition: 0.4s ease-in-out;

    -ms-transition: 0.4s ease-in-out;

     -o-transition: 0.4s ease-in-out;

        transition: 0.4s ease-in-out;

}

.info_box li.c{ margin:0 2% 15px;}



.info_box li img{ width:100%; margin:0 0 4px 0;}



/*STYLE*/

.fitimg{ display:block; position:relative; overflow:hidden;}

.fitimg img{ opacity:0;  filter:alpha(opacity=0); }

.ie{ position:fixed; width:60%; height:80%; padding:10% 20%; text-align:center; left:0; top:0; background: #CCC; z-index:9999; }

.ie h2, .ie h4{color:#333 !important;}

.ie p{ text-align:center; color:#333 !important; font-size:13px;}

.ie a{ color:#F36;}

.loading{ position:fixed; width:100%; height:100%; left:0; top:0; background: url(../images/loading.gif) no-repeat center center #FFF; z-index:2000;}

.more{ width:230px; height:294px; position:fixed; right:1%; bottom:30px; z-index:100; display:none;}

.more2{ width:230px; height:294px; position:fixed; left:1%; bottom:30px; z-index:100; display:none;}

.top{ width:46px; height:47px; position:fixed; right:0%; bottom:10px; z-index:100; display:none; background:#FFF; background:rgba(255,255,255,.5); padding:20px;}

.top:hover{ background:rgba(255,255,255,1);}