@charset "utf-8";
@media screen and (min-device-width: 360px) and (max-device-width: 640px) and (orientation: portrait){ 
/*body                      {background: #f00;}*/
}
@media screen and (min-device-width: 360px) and (max-device-width: 640px) and (orientation: landscape){ 
/*body                      {background: #ff0;}*/
}
@media screen and (max-device-width: 640px) and (orientation: portrait){
/*body                      {background: #f00;}*/    
}
html                      {width: 100%; height: 100%;}
body                      {width: 100%; min-width: 1280px; font-size: 100%;}
div.bg                    {position: absolute; width: 100%; height: 100%; min-width: 980px; background: url("../images/episode1/sec_bg.jpg"); background-position: center;}
.preHide                  {display: none;}
div.main                  {position: relative; width: 100%; min-width: 1280px; height: 4051px;/*4104*/ overflow: hidden; background: url("../images/episode1/sec_bg.jpg"); background-position: center 91px; display: none;}
div.patternLeft           {position: absolute; width: 315px; height: 100%; left: 0px; top: 0px; background: url("../images/doodle_left.png");}
div.patternRight          {position: absolute; width: 315px; height: 100%; right: 0px; top: 0px; background: url("../images/doodle_right.png");}

/*nav*/
div.navBox                {position: absolute; width: 100%; height: 90px; background: #f5f5f5; left: 0px; top: 0px;}
div.navBoxIn              {position: relative; width: 1280px; height: 90px; margin:  0 auto;}
div.navBoxL               {position: absolute; width: 1280px; height: 90px; background: #f5f5f5; left: -1280px;}
div.navBoxR               {position: absolute; width: 1280px; height: 90px; background: #f5f5f5; left: 1280px;}
div.logo                  {position: absolute; width: 131px; height: 41px; left: 27px; top: 29px;}
div.navRight              {position: absolute; width: 401px; height: 29px; right: 0px; top: 33px;}

/*sec_0*/
div.sec_0                 {position: absolute; width: 1280px; height: 2490px; left: 50%; top: 90px; margin-left: -640px;}
div.sec_0_tit_0           {position: absolute; width: 226px; height: 71px; left: 70px; top: -17px;/*113-130*/ display: none;}
div.sec_0_tit_1           {position: absolute; width: 600px; height: 235px; left: 112px; top: 58px;/*188-130*/ display: none;}
div.sec_0_tit_2           {position: absolute; width: 146px; height: 148px; left: 586px; top: 93px; display: none;}
div.sec_0_tit_3           {position: absolute; width: 79px; height: 121px; left: 735px; top: 94px; display: none;}
div.sec_0_tit_4           {position: absolute; width: 799px; height: 760px; left: 364px; top: 144px; display: none;}
div.sec_0_tit_5           {position: absolute; width: 683px; height: 627px; left: 699px; top: 3px; display: none;}
div.sec_0_tit_6           {position: absolute; width: 600px; height: 640px; left: 694px; top: -178px;/*52-130*/}
div.sec_0_tit_6_in        {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; display: none;}
div.sec_0_tit_7           {position: absolute; width: 681px; height: 343px; left: 575px; top: 285px;/*415-130*/ display: none;}
div.sec_0_tit_8           {position: absolute; width: 291px; height: 229px; left: 957px; top: 415px;}
div.sec_0_tit_9           {position: absolute; width: 536px; height: 530px; left: 32px; top: 387px;/*517-130*/ display: none;}
div.sec_0_tit_10          {position: absolute; width: 340px; height: 128px; left: 81px; top: 474px;/*604-130*/ display: none;}
div.sec_0_tit_11          {position: absolute; width: 307px; height: 194px; left: 100px; top: 650px;/*780-130*/ color: #313131; font-family: "微軟正黑體",Arial; font-weight: bold; font-size: 0.9375em;/*15px*/ line-height: 25px; display: none;}
div.sec_0_tit_12          {position: absolute; width: 1095px; height: 475px; left: 125px; top: 614px;/*744-130*/ display: none;}
div.sec_0_tit_13          {position: absolute; width: 378px; height: 248px; left: 88px; top: -2px;/*1228-1230*/}
div.sec_0_tit_14          {position: absolute; width: 550px; height: 535px; left: 670px;/*636*/ top: -88px;/*-157+50*//*1073-1230*/}
div.sec_0_tit_15          {position: absolute; width: 305px; height: 127px; left: 847px; top: -13px;/*-163+50*//*1167-1230*/}
div.sec_0_tit_16          {position: absolute; width: 294px; height: 211px; left: 861px; top: 136px;/*86+50*//*1316-1230*/ color: #313131; font-family: "微軟正黑體",Arial; font-weight: bold; font-size: 0.9375em;/*15px*/ line-height: 25px;}
div.sec_0_tit_17          {position: absolute; width: 1125px; height: 641px; left: 52px; top: 202px;/*1442-1230*/}
div.sec_0_tit_17_gif      {position: absolute; width: 730px; height: 590px; left: 207px; top: 31px;}
div.sec_0_tit_18          {position: absolute; width: 87px; height: 67px; left: 421px; top: 149px;/*1379-1230*/}
div.sec_0_tit_19          {position: absolute; width: 112px; height: 83px; left: 377px; top: 173px;/*1403-1230*/}
div.sec_0_tit_20          {position: absolute; width: 136px; height: 99px; left: 325px; top: 202px;/*1432-1230*/}
div.sec_0_tit_21          {position: absolute; width: 543px; height: 532px; left: 32px; top: 662px;/*1892-1230*/}
div.sec_0_tit_22          {position: absolute; width: 377px; height: 206px; left: 87px; top: 731px;/*1961-1230*/}
div.sec_0_tit_23          {position: absolute; width: 330px; height: 183px; left: 91px; top: 962px;/*2192-1230*/ color: #313131; font-family: "微軟正黑體",Arial; font-weight: bold; font-size: 0.9375em;/*15px*/ line-height: 25px;}
div.sec_0_tit_24          {position: absolute; width: 684px; height: 376px; left: 516px; top: 847px;/*2077-1230*/}
div.sec_0_tit_25          {position: absolute; width: 390px; height: 214px; left: 868px; top: 731px;/*1961-1230*/}





div.sec_1                 {position: relative; width: 1280px; height: 1404px; left: 50%; top: 2580px; margin-left: -640px;/**/ background: url("../images/transparent.gif");}
div.sec_1_tit_0           {position: absolute; width: 735px; height: 257px; left: 53px; top: 30px;}
div.sec_1_tit_1           {position: absolute; width: 370px; height: 225px; left: 751px; top: 90px;}
div.sec_1_tit_2           {position: absolute; width: 298px; height: 436px; left: 910px; top: 24px;}
div.sec_1_tit_3           {position: absolute; width: 1163px; height: 459px; left: 61px; top: 277px;}
div.sec_1_tit_4           {position: absolute; width: 239px; height: 97px; left: 145px; top: 536px; cursor: pointer;}
div.sec_1_tit_5           {position: absolute; width: 1163px; height: 497px; left: 61px; top: 701px;}
div.sec_1_tit_6           {position: absolute; width: 239px; height: 97px; left: 511px; top: 977px; cursor: pointer;}
div.sec_1_tit_7           {position: absolute; width: 461px; height: 125px; left: 405px; top: 1214px; cursor: pointer;}

div.floatBox              {position: absolute; width: 1280px; height: 1450px; left: 0; top: 0; background: url("../images/transparent.gif");}
div.floatBoxL             {position: absolute; width: 1000px; height: 100%; left: -1000px; top: 0px; background: url("../images/transparent.gif");}
div.floatBoxR             {position: absolute; width: 1000px; height: 100%; right: -1000px; top: 0px; background: url("../images/transparent.gif");}
div.floatItem             {position: absolute; width: 1180px; height: 1200px; left: 50px; top: 125px; background: url("../images/transparent.gif");}
div.floatItem_0           {position: absolute; width: 1180px; height: 1200px; left: 50px; top: 125px; background: url("../images/transparent.gif");}
div.floatItem_1           {position: absolute; width: 1180px; height: 1200px; left: 50px; top: 125px; background: url("../images/transparent.gif");}

div.floatItem0            {position: absolute; width: 1280px; height: 2490px; top: 200px; left: 0px; background: url("../images/transparent.gif");}
div.floatItem0_0          {position: absolute; width: 1280px; height: 2490px; top: 0px; left: 0px; background: url("../images/transparent.gif");}
div.floatItem0_1          {position: absolute; width: 1280px; height: 2490px; top: 200px; left: 0px; background: url("../images/transparent.gif");}

div.floatItem1            {position: absolute; width: 1280px; height: 1404px; top: 0px; left: 0px; background: url("../images/transparent.gif");}
div.floatItem1_0          {position: absolute; width: 1280px; height: 1404px; top: 0px; left: 0px; background: url("../images/transparent.gif");}
div.floatItem1_1          {position: absolute; width: 1280px; height: 1404px; top: 0px; left: 0px; background: url("../images/transparent.gif");}


div.clickArea             {position: absolute;; width: 1280px; height: 1450px; left: 0; top: 0; background: url("../images/transparent.gif");}
div.episodeBtn1           {position: absolute; width: 484px; height: 468px; left: 97px; top: 388px; cursor: pointer; background: url("../images/transparent.gif");}
div.episodeBtn2           {position: absolute; width: 464px; height: 496px; left: 641px; top: 370px; cursor: pointer; background: url("../images/transparent.gif");}
div.episodeBtn3           {position: absolute; width: 1155px; height: 385px; left: 59px; top: 923px; cursor: pointer; background: url("../images/transparent.gif");}

div.hoverBtn div          {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px;}
div.hoverBtn div img      {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px;}

div.footer                {position: absolute; width: 100%; height: 120px; top: 3984px; background: #fff; left: 0px;}
div.footerR               {position: absolute; width: 1000px; height: 121px; left: -1000px; top: 0px; background: #fff;}
div.footerL               {position: absolute; width: 1000px; height: 121px; right: -1000px; top: 0px; background: #fff;} 

/*floatArea*/
div#floatArea0            {position: absolute; width: 1280px; height: 1230px; left: 0px; top: 130px;}
div#floatArea1            {position: absolute; width: 1280px; height: 1260px; left: 0px; top: 1230px;}
div#floatArea2            {position: absolute; width: 1280px; height: 1404px; left: 0px; top: 0px;}

div.areaDown              {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; /*background: #333; opacity: 0.2;*/}
div.areaMid               {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; /*background: #333; opacity: 0.2;*/}
div.areaUp                {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; /*background: #333; opacity: 0.2;*/}


div.navBoxIn {
  width: 1180px;
  margin: 0 auto;
  height: 100%;
  position: relative;
}
/* line 75, ../sass/partials/_page.scss */
div.navBox nav {
  float: right;
  margin-right: 235px;
  padding-top: 22px;
}
/* line 79, ../sass/partials/_page.scss */
div.navBox nav a {
  color: #AFB2B6;
  font-size: 0.8125em;/*13px*/
  text-decoration: none;
  text-transform: capitalize;
}
/* line 94, ../sass/partials/_page.scss */
div.navBox .social {
  /*float: right;*/
  margin-top: 46px;
  margin-bottom: 0;
  right: 0px;
  top: 0px;
  position: absolute;
}
/* line 98, ../sass/partials/_page.scss */
div.navBox .social iframe {
  border: none;
  overflow: hidden;
  width: 90px;
  height: 21px;
  margin-top: 5px;
}
/* line 101, ../sass/partials/_page.scss */
div.navBox .social li {
  float: right;
  list-style: none;
}
/* line 105, ../sass/partials/_page.scss */
div.navBox .social .share {
  width: 23px;
  height: 23px;
  display: block;
  background: url('../images/share.png');
  margin-right: 5px;
  margin-top: -3px;
  text-indent: -9999em;
  content: attr(title);
}
/* line 114, ../sass/partials/_page.scss */
div.navBox .social .share.twitter {
  background-position: -46px 0;
}
/* line 117, ../sass/partials/_page.scss */
div.navBox .social .share.googleplus {
  background-position: -23px 0;
}
/* line 120, ../sass/partials/_page.scss */
div.navBox .social .share.facebook {
  background-position: 0 0;
}
/* line 125, ../sass/partials/_page.scss */
div.navBox .social .buy {
  font-family: Arial;
  font-size: 0.8125em;/*13px*/
  margin-right: 1em;
  padding-right: 1em;
  /*border-right: 1px solid #AFB2B6;*/
  line-height: 29px;
  display: block;
  height: 16px;
}
div.navBox .social .buy img {
  margin-top: -35px;
}

{

}
/* line 125, ../sass/partials/_page.scss */
div.navBox .social .buy {
  font-family: Arial;
  font-size: 0.8125em;/*13px*/
  margin-right: 1em;
  padding-right: 1em;
  /*border-right: 1px solid #AFB2B6;*/
  line-height: 29px;
}
div.navBox a {
  text-decoration:none;
  color: #AFB2B6;
}

div.navBox a:hover {
  color: #51545B;
  -webkit-transition-property: color;
  -moz-transition-property: color;
  -o-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}

div.footerCenter .footerLeft {
  float: left;
  width: 588px;
  color: rgb(155, 148, 152);
  margin: 20px auto 70px;
  font-size: 0.8125em;/*13px*/
}
/* line 680, ../sass/partials/_page.scss */
div.footerCenter .footerRight {
  float: left;
  width: 360px;
  margin-top: 20px;
}

div.footerCenter ul li {
  padding: 0 8px;
  float: left;
  border-left: 1px solid #9B9498; 
}
div.footerCenter a {
  text-decoration:none;
  color: #AFB2B6;
}

div.footerCenter a:hover {
  color: #51545B;
  -webkit-transition-property: color;
  -moz-transition-property: color;
  -o-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  -o-transition-delay: 0s;
  transition-delay: 0s;
}
div.footerCenter {position: relative; width: 980px; height: 100%; margin: 0 auto; font-size: 0.8125em;/*13px*/ color: #9b9498;}

div.wtbListBox   {position: absolute; width: 168px; right: 26px; top: 79px; overflow: auto; display: none;}
div.wtbItem      {position: relative; width: 100%; height: 36px; color: #b54000; font-family: Arial; line-height: 36px; font-size: 12px; text-align: center;}
div.wtbListBox a{color: #b5b2b6; text-decoration: none;}
div.wtbListBox div:hover{opacity: 0.5;}
div.wtbLine      {position: relative; width: 115px; height: 1px; background: #f1b604; margin: 0 auto;}
div.wtb_bg       {position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; background: #ffd900; opacity: 0.9;}
a.linkPlatForm   {margin: 0 4px;}