body, div, ul, ol, li, h1, h2, h3, p, tr, td, img {margin: 0; padding: 0;}
img {vertical-align: top;}
body {font-size:62.5%; background-color:#ebebeb; background:url(../images/bg-r.jpg) repeat;}
hr{background:url(../images/hr-bg.jpg) repeat-x; border:none; display:block; width:100%; height:9px; margin:2% 0;}
.setop.navbar-default .navbar-nav > li > a {font-size: 1.2rem;}
.setop.navbar-default .navbar-nav > li.fb-share > a {font-size:0;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > li:hover > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > li > a:active{ background:none;}
.restriction {font-size: 1.2rem;}
/*主視覺*/
.pc{ display:block;}
.sm{ display:none;}

.kv {margin: 0 auto; padding: 0; position: relative; width:100%; height:auto; background:#82cfad; overflow:hidden;}
.kv img{width:100%;}
/*內容區塊*/
.content { margin: 0 auto; padding: 0; width:75%; background-color: #fff;}
.main{width:1400px; background:#fff; margin:auto;-webkit-box-shadow: 0 0 8px 2px rgba(140,140,140,.7); box-shadow: 0 0 8px 2px rgba(140,140,140,.7);}
.join-btn{ background:#5b5758;}
.join-btn a{ -webkit-animation:bounceIn 1s linear infinite; animation:bounceIn 1s linear infinite;}
.select{ width:100%; padding:0 2rem 3rem 2rem; text-align:center;}
.select a{ display:inline-block; width:280px; height:280px; margin:1%; box-sizing:border-box; background-position:left top; background-size:100% auto; text-indent:-9999px;}
.select a{ -webkit-animation:bounceIn 1s linear infinite; animation:bounceIn 1s linear infinite;}

.select a:hover{ background-position:left bottom;}
.jp{ background:url(../images/btn-jp.jpg) no-repeat;}
.am{ background:url(../images/btn-am.jpg) no-repeat;}
.ca{ background:url(../images/btn-ca.jpg) no-repeat;}
.kr{ background:url(../images/btn-kr.jpg) no-repeat;}
.select ul{ list-style:none;}
.select li{ text-align:center; display:inline-block; width:280px; margin:1%; font:bold 2.4rem/1.5 "微軟正黑體";}
.share-info{ width:100%; height:130px; display:block; position:relative; margin-bottom:30px; overflow:hidden;}
.share-info h4{ width:70%; margin:auto; display:block; font:bold 2.4rem/10rem "微軟正黑體"; text-align:center; -webkit-box-shadow: 3px 3px 8px 0 rgba(12,88,146,0.75);
  box-shadow: 3px 3px 8px 0 rgba(12,88,146,0.75); border:solid 1px #999;}
.share-info:before{ content:''; display:block; background:url(../images/hand-L.png) no-repeat; width:320px; height:100px; position:absolute; left:0; top:15px;}
.share-info:after{ content:''; display:block; background:url(../images/hand-R.png) no-repeat; width:320px; height:100px; position:absolute; right:0; top:15px;}
.introP{background:url(../images/bg-intro.jpg) repeat-x 0 105px; overflow:hidden; margin-bottom:5%;}
.introP h3{ width:532px; height:105px; margin:auto; font:bold 3.6rem/85px "微軟正黑體"; color:#6cf448; text-align:center; background:url(../images/bg-h3.jpg) no-repeat 8px top;}
.introP p{font:bold 2.4rem/4rem "微軟正黑體"; color:#fff; text-align:center; width:70%; margin:80px auto 80px auto;}

.rule{background:url(../images/bg-rule.jpg) repeat-x 0 105px; overflow:hidden;}
.rule h3{ width:532px; height:105px; margin:auto; font:bold 3.6rem/85px "微軟正黑體"; color:#6cf448; text-align:center; background:url(../images/bg-h3.jpg) no-repeat 8px top;}
.rule ol{width:90%; margin:70px auto 50px auto;}
.rule li{font:bold 2.4rem/3.8rem "微軟正黑體"; color:#333; text-indent:12px; background:url(../images/ol-bg.png) no-repeat;}

.play-area{ width:100%; height:640px; margin:auto; background:url(../images/re-bg.jpg) repeat-x;}
.play-bg{ width:1400px; height:640px; margin:auto; background:url(../images/bg.jpg) no-repeat 0 30%; background-size:100% auto; position:relative;}

.people-view{ width:1370px; height:410px; position:absolute; left:15px; bottom:30px; overflow:hidden;}
.all-people{/*width:2520px;*/}
.popup {font: bold 1.5rem/1.7 "微軟正黑體"; text-align: center; color: #fff;
    background: url(../images/pop-bg.png) no-repeat center top; background-size: contain; margin: auto; padding: 15px; width: 105px; height: 95px;
    transform: scale(0); transition: all .3s ease-out; box-sizing: border-box; vertical-align: text-top; position: absolute; top: 0; left: 50%; margin-left:-50px;}

.cl{ background:url(../images/pop-bg-c.png) no-repeat center top; background-size:contain;}

.set{width:140px; display:inline-block; vertical-align:top; position:relative; padding-top:85px;}
.set.talking .popup{transform: scale(1);}
.wp1,.wp2,.wp3,.wp4,.wp5,.wp6,.wp7,.wp8,.wp9,.wp10,
.mp1,.mp2,.mp3,.mp4,.mp5,.mp6,.mp7,.mp8,.mp9,.mp10{ background-size:contain; height:330px;}
.wp1{ background:url(../images/WP1.gif) no-repeat center bottom;}
.wp2{ background:url(../images/WP2.gif) no-repeat center bottom;}
.mp1{ background:url(../images/MP1.gif) no-repeat center bottom;}
.wp3{ background:url(../images/WP3.gif) no-repeat center bottom;}
.mp2{ background:url(../images/MP2.gif) no-repeat center bottom;}
.mp3{ background:url(../images/MP3.gif) no-repeat center bottom;}
.wp4{ background:url(../images/WP4.gif) no-repeat center bottom;}
.wp5{ background:url(../images/WP5.gif) no-repeat center bottom;}
.mp4{ background:url(../images/MP4.gif) no-repeat center bottom;}
.wp6{ background:url(../images/WP6.gif) no-repeat center bottom;}
.mp5{ background:url(../images/MP5.gif) no-repeat center bottom;}
.mp6{ background:url(../images/MP6.gif) no-repeat center bottom;}
.mp7{ background:url(../images/MP7.gif) no-repeat center bottom;}
.wp7{ background:url(../images/WP7.gif) no-repeat center bottom;}
.wp8{ background:url(../images/WP8.gif) no-repeat center bottom;}
.wp9{ background:url(../images/WP9.gif) no-repeat center bottom;}
.mp8{ background:url(../images/MP8.gif) no-repeat center bottom;}
.wp10{ background:url(../images/WP10.gif) no-repeat center bottom;}
.mp9{ background:url(../images/MP9.gif) no-repeat center bottom;}
.mp10{ background:url(../images/MP10.gif) no-repeat center bottom;}
.notice{ width:80%; margin:auto; padding:3rem 0;}
.notice h3{font:bold 2.4rem/1.8 "微軟正黑體"; color:#C30;}
.notice ol{font:normal 1.5rem/1.8 "微軟正黑體"; color:#333;}
.btn{ width:100%;}
.btn a{ width:30%; margin:3rem auto; display:block; background:#36F; color:#fff; font:bold 2.4rem/1.8 "微軟正黑體"; text-align:center;}

@-webkit-keyframes bounceIn {
  0%, 60%, 100% {-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}
  0% {opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}
  60% {opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03);}
  100% {opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}
}

@keyframes bounceIn {
  0%, 60%, 100% {-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);}
  0% {opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}
  60% {opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03);}
  100% {opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}
}

.bounceIn {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}

/* 假的臉書分享按鈕 */
.plugin-button {
    display: inline-block;
    vertical-align: 0;
    background: #4c69ba;
    background: linear-gradient(#4c69ba, #3b55a0);
    border: none;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    font-weight: bold;
    height: 20px;
    line-height: 20px;
    padding: 0;
    text-shadow: 0 -1px 0 #354c8c;
    white-space: nowrap;
    position: relative;
    top: 1px;
}
.suc-info .plugin-button span, .fail-info .plugin-button span{
    vertical-align: top;
    font-size:12px;
    color: #fff;
    padding: 0 8px;
}

/*回頂部*/
.scroll2top:link, .scroll2top:visited {background: url(../images/gotop.png) no-repeat 0 0; height:60px; width:60px; background-size:contain; position:fixed; bottom:50px; right:0; margin-left:0;}
/*.scroll2top:hover { background: url(../images/gotop.png) no-repeat 0 -110px;}*/


/*NEW*/
.linkshare{ padding:15px 0;}
/*.linkshare h3{ text-align:center; color:#003366; font:bold 2.4rem/1.5 "微軟正黑體";}*/
.linkshare h3
{background:url(../images/moreBtn.jpg) left top repeat;
	margin:0 auto;
	padding:15px;
	color:#fff;
	font:bold 20px/1.4 "微軟正黑體", "Microsoft JhengHei",Arial,sans-serif;
	text-align: center;
	text-decoration: none;
	display:block;}
.linkshare a{ width:22%; margin:15px 1%; height:120px; display:inline-block;}