@charset "big5";
@import url("/css/fancybox/jquery.fancybox.css");
@import url("/css/_footer.css");
/* ==========================================================================
   Common
   ========================================================================== */


body {
  font-family:"·L³n¥¿¶ÂÅé", Arial,sans-serif;
  line-height: 1.6em;
  font-size: 15px;
  background: url('../images/bg.jpg');
  color: #fff;
}

ul,ul li {
  list-style-type: none;
  margin: 0;padding: 0;
  line-height: 1.6em;
}
ul.ulist {
  margin-left: 2em;
}
ul.ulist li {
  list-style-type: circle;

}
ol li {line-height: 1.6em; list-style-type:decimal;}
.content ol {padding-left: 30px;line-height: 1.6em;}
.content p {padding-left: 10px;line-height: 1.6em;}
#googleCode {position: absolute;}
button {
  cursor: pointer;
}
a {color: #00f0ff;}
a:hover {color: #48d2ff;}

.color_1 {
  color: #fff22a;
}
/* ==========================================================================
   Layout
   ========================================================================== */
.header {
  background: url('../images/bg_header.jpg') center top no-repeat;
  height: 756px;
  
}
.header .container {
  width: 1000px;
  margin: 0 auto;
  position: relative;
}

.content {

}
.content .container {
  width: 930px;
  margin: 0 auto;
  padding: 95px 0 30px;
}
.section {
  margin-bottom: 40px;
  position: relative;
}
.section:after {
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  clear: both;
  visibility: hidden;
}
 * html .section,
 *:first-child+html .section { zoom: 1; }

 .section_3 {
    margin-bottom: 200px;
 }
 .section_3 p {
  margin-bottom: 5em;
  
  
 }
 .section_3 p img {
  position: relative;
  z-index: 11;
 }
 .section_3 .bg {
  background: url('../images/teach_bg.png') 0 0 no-repeat;
  width: 431px;height: 442px;
  right: -30px;bottom: -250px;
  position: absolute;
 }
.title {
   white-space: nowrap;text-indent: 100%;overflow: hidden;
   background: url('../images/title.png') 0 0 no-repeat;
   height: 40px;
   margin-bottom: 10px;
}

.section_1 .title {}
.section_2 .title {background-position: 0 -40px;}
.section_3 .title {background-position: 0 -80px;}
.section_4 .title {background-position: 0 -120px;}
.section_5 .title {background-position: 0 -160px;}

h1 ,.logo {
  white-space: nowrap;text-indent: 100%;overflow: hidden;
  display: block;position: absolute;
}
h1 {width: 1px;height: 1px;}
.logo {
  width: 240px;height: 150px;
  left: 70px;
}
.menu {
  position: absolute;
  top: 701px;
  width: 933px;
  left: 50%;
  margin-left: -466px;
}
.menu li,.btn li {
  float: left;
}
.menu a,.btn a {
  display: block;
  background: url('../images/menu.png') 0 0 no-repeat;
  height: 118px;
  white-space: nowrap;text-indent: 100%;overflow: hidden;
}
.menu .menu_1 a {width: 466px;}
.menu .menu_1 a:hover,
#index .menu .menu_1 a {background-position: 0 -118px;}
.menu .menu_2 a {
  width: 467px;
  background-position: -466px 0;
}
.menu .menu_2 a:hover,
#fbcode .menu .menu_2 a {background-position: -466px -118px;}

.btn {position: relative;z-index: 11;}
.btn .btn_1 a {width: 288px;background-position: 0 -236px;}
.btn .btn_1 a:hover,
.btn .btn_1 a.focus {background-position: 0 -354px;}
.btn .btn_2 a {
  width: 289px;
  background-position: -288px -236px;
}
.btn .btn_2 a:hover,
.btn .btn_2 a.focus {background-position: -288px -354px;}


.stepimg {
  position: relative;
  width: 886px;
  height: 257px;
  margin-bottom: 10px;
}
.stepimg .fb_like {
  position: absolute;
  left: 34px;
  top: 70px;
}