@charset "UTF-8";
/* CSS Document */
body {
  background-color: #666666;
}

.page {
  position: relative;
  width: 94%;
  margin-left: 3%;
  margin-right: auto;
}
.page .status-1 > img.position-absolute {
  left: auto;
  top: 0;
  right: -3.75%;
}

@media (min-width: 768px) {
  .page {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
  }
  .page .status-1 > img.position-absolute {
    left: 0;
    top: 0;
    right: 0;
  }
}
.page .btn {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9;
  width: 100%;
  height: 100%;
  right: 0;
  bottom: 0;
  margin-left: auto;
  margin-top: auto;
  margin-right: auto;
  margin-bottom: auto;
}

.page .btn > div {
  position: absolute;
}

.page .btn > div a, .page .btn > div a img {
  display: block;
  width: 100%;
}

.page .btn > div:hover {
  -ms-transform: scale(0.95, 0.95);
  /* IE 9 */
  -webkit-transform: scale(0.95, 0.95);
  /* Safari */
  transform: scale(0.95, 0.95);
}

.page .btn > div:active {
  -ms-transform: scale(0.9, 0.9);
  /* IE 9 */
  -webkit-transform: scale(0.9, 0.9);
  /* Safari */
  transform: scale(0.9, 0.9);
}

.page .part {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 8;
  width: 100%;
  height: 100%;
  right: 0;
  bottom: 0;
  margin-left: auto;
  margin-top: auto;
  margin-right: auto;
  margin-bottom: auto;
}

.page .part > div {
  position: absolute;
}

.page .part > div.m {
  display: none;
  /**/
}

.page .part > div img {
  display: block;
  width: 100%;
}

.page .animate {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 7;
  width: 100%;
  height: 100%;
  right: 0;
  bottom: 0;
  margin-left: auto;
  margin-top: auto;
  margin-right: auto;
  margin-bottom: auto;
}

.page .animate > div {
  position: absolute;
}

.page .animate > div img {
  display: block;
  width: 100%;
}

.page .btn > div {
  width: 5.92593%;
  height: 13.66906%;
}

#f2 .btn > div.m1 {
  left: 67.40741%;
  top: 52.94964%;
}

#f2 .btn > div.m4 {
  left: 25.40741%;
  top: 40.57554%;
}

#f2 .btn > div.m5 {
  left: 75.55556%;
  top: 24.17266%;
}

#f2 .btn > div.m7 {
  left: 49.77778%;
  top: 25.46763%;
}

#f2 .part > div.m4 {
  width: 17.11111%;
  height: 33.23741%;
  left: 19.85185%;
  top: 42.30216%;
}

#f2 .part > div.m7 {
  width: 3.55556%;
  height: 5.89928%;
  left: 50.44444%;
  top: 39.85612%;
}

#f2 .part > div.cat {
  width: 5.40741%;
  height: 10.35971%;
  left: 21.18519%;
  top: 58.84892%;
}

#f2 .animate > div.m4 {
  width: 17.11111%;
  height: 33.23741%;
  left: 19.85185%;
  top: 42.30216%;
}

#f2 .animate > div.m7 {
  width: 4.59259%;
  height: 5.89928%;
  left: 50.07407%;
  top: 37.55396%;
}

#f2 .animate > div.girl {
  width: 10.81481%;
  height: 21.00719%;
  left: 37.11111%;
  top: 54.38849%;
}

#f2 .animate > div.cat {
  width: 40.96296%;
  height: 19.85612%;
  left: 38.96296%;
  top: 79.71223%;
}

.page .btn > div {
  width: 5.92593%;
  height: 12.90761%;
}

#f1 .btn > div.m2 {
  left: 69.62963%;
  top: 29.8913%;
}

#f1 .btn > div.m6 {
  left: 50.88889%;
  top: 12.09239%;
}

#f1 .btn > div.m7 {
  left: 83.85185%;
  top: 45.38043%;
}

#f1 .part > div.m2 {
  width: 7.77778%;
  height: 16.57609%;
  left: 73.18519%;
  top: 32.47283%;
}

#f1 .animate > div.m2 {
  width: 12.22222%;
  left: 70.74074%;
  top: 27.17391%;
}

#f1 .animate > div.coffee {
  width: 22.81481%;
  left: 32.44444%;
  top: 47.28261%;
}

#f1 .animate > div.cat {
  width: 58.96296%;
  left: 2.22222%;
  top: 33.0163%;
}

.page .btn > div {
  width: 5.92593%;
  height: 13.66906%;
}

#fc .btn > div.m7 {
  left: 77.03704%;
  top: 20.14388%;
}

#fc .part > div.m7 {
  width: 14.96296%;
  left: 80.37037%;
  top: 29.06475%;
}

#fc .part > div.table {
  width: 12.88889%;
  left: 82.37037%;
  top: 35.68345%;
}

#fc .animate > div.m7 {
  width: 14.96296%;
  left: 80.37037%;
  top: 29.06475%;
}

#fc .animate > div.girl {
  width: 11.62963%;
  left: 62.14815%;
  top: 53.09353%;
}

#fc .animate > div.sleep {
  width: 19.92593%;
  left: 7.18519%;
  top: 29.92806%;
}

#fc .animate > div.cat {
  width: 11.11111%;
  left: 60.74074%;
  top: 69.06475%;
}

/*B1*/
.page .btn > div {
  width: 5.92593%;
  height: 13.0854%;
}

#b1 .btn > div.m3 {
  left: 51.85185%;
  top: 43.93939%;
}

#b1 .btn > div.m7 {
  left: 73.11111%;
  top: 51.37741%;
}

#b1 .part > div.table {
  width: 8.37037%;
  left: 70%;
  top: 55.78512%;
}

#b1 .animate > div.air {
  width: 10.07407%;
  left: 43.18519%;
  top: 12.25895%;
}

#b1 .animate > div.cat {
  width: 16.51852%;
  left: 53.48148%;
  top: 58.26446%;
}

#b1 .animate > div.m7 {
  width: 6.59259%;
  left: 69.85185%;
  top: 46.00551%;
}

#b1 .animate > div.music {
  width: 8.14815%;
  left: 62.66667%;
  top: 21.34986%;
}

#b1 a.scrollTop {
  position: absolute;
  display: block;
  width: 3.7037%;
  height: 6.61157%;
  right: -1.48148%;
  bottom: 21.21212%;
  z-index: 9;
}

#b1 a.scrollTop img {
  width: 100%;
}

@media (min-width: 768px) {
  #b1 a.scrollTop {
    width: 3.7037%;
    height: 6.61157%;
    right: 2.07407%;
    bottom: 20.93664%;
  }
}
#Philosophy {
  display: none;
  background-color: #fff;
  background: url("../images/bg-Philosophy-m.jpg") center bottom no-repeat;
  background-size: 100% auto;
}
#Philosophy > div {
  position: relative;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
}
#Philosophy .title {
  padding-top: 2.25rem;
  padding-bottom: 0.75rem;
  padding-left: 0.1em;
}
#Philosophy .title span {
  display: inline-block;
  font-size: 1.375rem;
  line-height: 1.3em;
  letter-spacing: 0.1em;
  font-family: '微軟正黑體', '儷中黑',arial, sans-serif;
  border-bottom: 0.2rem solid #01a185;
  color: #01a185;
}
#Philosophy .sub-title {
  padding-top: 1rem;
  padding-bottom: 1.25rem;
}
#Philosophy .sub-title span {
  display: inline-block;
  font-size: 2.1875rem;
  line-height: 1.4em;
  letter-spacing: 0.025em;
}
#Philosophy .content {
  font-size: 1.375rem;
  line-height: 1.55em;
  padding-bottom: 33.5rem;
  letter-spacing: 0.05em;
  padding-right: 0em;
}
#Philosophy .content span.br {
  display: none;
}

/*
@media (min-width: 768px) {
	$size:16;
	#Philosophy{
		background:url('../images/bg-Philosophy.jpg') center bottom no-repeat;
		background-size:auto auto;
		& > div{
			width:86%;
			// width:89.0625%;
		}
		& .title{
			padding-top:2.25rem;
			padding-bottom:0.75rem;
			padding-left:0.1em;
			& span{
				display:inline-block;
				font-size:22rem/$size;
				line-height:1.3em;
				letter-spacing:0.1em;
				font-family: '微軟正黑體', '儷中黑',arial, sans-serif;
				// border-bottom:0.2rem solid #01a185;
				// color:#01a185;
				// color:red;
			}		
		}
		& .sub-title{		
			padding-top:1rem;
			padding-bottom:1.8rem;
			& span{
				display:inline-block;
				font-size:35rem/$size;
				line-height:1.35em;
				letter-spacing:0.025em;
				// font-weight:bold;
			}
		}
		& .content{
			font-size:22rem/$size;
			line-height:1.5em;
			padding-bottom:4.5rem;
			letter-spacing:0.05em;
		}
	}
}
*/
@media (min-width: 992px) {
  #Philosophy {
    background: url("../images/bg-Philosophy.jpg") center bottom no-repeat;
    background-size: auto auto;
  }
  #Philosophy > div {
    width: 95.3125%;
  }
  #Philosophy .title {
    padding-top: 2.25rem;
    padding-bottom: 0.75rem;
    padding-left: 0.1em;
  }
  #Philosophy .title span {
    display: inline-block;
    font-size: 1.375rem;
    line-height: 1.3em;
    letter-spacing: 0.1em;
    font-family: '微軟正黑體', '儷中黑',arial, sans-serif;
  }
  #Philosophy .sub-title {
    padding-top: 1rem;
    padding-bottom: 1.8rem;
  }
  #Philosophy .sub-title span {
    display: inline-block;
    font-size: 2.1875rem;
    line-height: 1.35em;
    letter-spacing: 0.025em;
  }
  #Philosophy .content {
    font-size: 1.375rem;
    line-height: 1.5em;
    padding-bottom: 4.5rem;
    letter-spacing: 0.05em;
    padding-right: 0em;
  }
  #Philosophy .content span.br {
    display: block;
  }
}
@media (min-width: 1280px) {
  #Philosophy > div {
    width: 1220px;
  }
}
#Team {
  position: relative;
  width: 100%;
  display: none;
}
#Team > div {
  position: relative;
}

#Team1 {
  width: 100%;
}

#Team1 > div {
  overflow-x: hidden;
}

#Team1bicycle {
  position: absolute;
  right: 0;
  width: 25.40741%;
  height: 48.91041%;
  top: 50.84746%;
}

#Team1slogan {
  position: absolute;
  top: 0;
  left: 0;
}

#Team2 {
  display: none;
}

#Team2 a.next {
  position: fixed;
  display: block;
  width: 2.91667rem;
  height: 3rem;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
  z-index: 1;
}

#Team3 {
  display: none;
}

#Team3 a.prev {
  position: fixed;
  display: block;
  width: 2.91667rem;
  height: 3rem;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto 0;
  z-index: 1;
}

@media (min-width: 768px) {
  #Team2 a.next {
    width: 4.375rem;
    height: 4.5rem;
  }

  #Team3 a.prev {
    width: 4.375rem;
    height: 4.5rem;
  }
}
.fancybox-skin {
  background: none;
}

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}