﻿@charset "UTF-8";
/* custom variable */
/*main*/
/* line 2, ../sass/lib/_main-layout.scss */
html {
	min-width: 600px;
	font-family: Verdana, 'Microsoft JhengHei', '微軟正黑體',
		sans-serif !important;
	overflow-y: hidden;
}

/* line 8, ../sass/lib/_main-layout.scss */
body {
	background: #79a8ae;
	color: #666;
	font-size: 16px;
	line-height: 1.5em;
	min-width: 850px;
	min-height: 400px;
}

/* line 17, ../sass/lib/_main-layout.scss */
h1 {
	color: #111;
	margin: 0 0 12px 0;
	font-size: 24px;
	line-height: 1.5em;
}

/* line 24, ../sass/lib/_main-layout.scss */
p {
	margin: 0 0 10x 0;
}

/* line 28, ../sass/lib/_main-layout.scss */
a {
	color: #888;
	text-decoration: none;
}

/* line 34, ../sass/lib/_main-layout.scss */
a:hover {
	border-bottom-color: #888;
}

/* line 38, ../sass/lib/_main-layout.scss */
body, .overlay {
	-webkit-perspective: 1000;
	-webkit-perspective-origin-y: 25%;
}

/* line 44, ../sass/lib/_main-layout.scss */
.body--ready {
	background: -webkit-linear-gradient(top, #cbebdb 0%, #3794c0 120%);
	background: -moz-linear-gradient(top, #cbebdb 0%, #3794c0 120%);
	background: -o-linear-gradient(top, #cbebdb 0%, #3794c0 120%);
	background: -ms-linear-gradient(top, #cbebdb 0%, #3794c0 120%);
	background: linear-gradient(top, #cbebdb 0%, #3794c0 120%);
}

/* line 52, ../sass/lib/_main-layout.scss */
.body--ready .overlay, .body--ready .overlay2, .body--ready .overlay3, .body--ready .overlay4 {
	-webkit-transition: -webkit-transform 0.7s
		cubic-bezier(0.694, 0.0482, 0.335, 1), opacity 0.7s
		cubic-bezier(0.694, 0.0482, 0.335, 1);
	-moz-transition: -moz-transform 0.7s
		cubic-bezier(0.694, 0.0482, 0.335, 1), opacity 0.7s
		cubic-bezier(0.694, 0.0482, 0.335, 1);
	-ms-transition: -ms-transform 0.7s cubic-bezier(0.694, 0.0482, 0.335, 1),
		opacity 0.7s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-o-transition: -o-transform 0.7s cubic-bezier(0.694, 0.0482, 0.335, 1),
		opacity 0.7s cubic-bezier(0.694, 0.0482, 0.335, 1);
	transition: transform 0.7s cubic-bezier(0.694, 0.0482, 0.335, 1),
		opacity 0.7s cubic-bezier(0.694, 0.0482, 0.335, 1);
}

/* line 64, ../sass/lib/_main-layout.scss */
.logobox {
	position: absolute;
	text-align: center;
	line-height: 100px;
	font-weight: bold;
	top: 40px;
	left: 50px;
}
/* line 71, ../sass/lib/_main-layout.scss */
.logobox .logo {
	width: 250px;
	height: 60px;
	background: url(../../inc/img/B-logo.png) no-repeat;
	background-size: contain;
}
/* line 77, ../sass/lib/_main-layout.scss */
.logobox p {
	font-size: 2.1em;
	line-height: 1.4;
	letter-spacing: 4px;
	padding: 0 0 0 25px;
	color: #0c7a88;
}

/* line 86, ../sass/lib/_main-layout.scss */
.help-bass, .help, .help2, .help3 {
	position: absolute;
	border: 1px solid #fff;
	width: 17%;
	height: 100px;
	text-align: center;
	font-size: 2em;
	line-height: 100px;
	font-weight: bold;
	cursor: pointer;
	color: #79a8ae;
	border-radius: 20px;
	-webkit-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-moz-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-ms-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-o-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
}

/* line 105, ../sass/lib/_main-layout.scss */
.help:hover, .help2:hover, .help3:hover {
	opacity: 1;
}

/* line 109, ../sass/lib/_main-layout.scss */
.help {
	top: 40px;
	right: 45%;
}

/* line 115, ../sass/lib/_main-layout.scss */
.help2 {
	top: 40px;
	right: 25%;
}

/* line 121, ../sass/lib/_main-layout.scss */
.help3 {
	top: 40px;
	right: 5%;
}

/* line 127, ../sass/lib/_main-layout.scss */
.help span, .help2 span, .help3 span {
	border-radius: 15px;
	background: #fff;
	opacity: .9;
	width: 95%;
	line-height: 90px;
	height: 90px;
	display: inline-block;
}

/* line 138, ../sass/lib/_main-layout.scss */
.container {
	opacity: 0;
}

/* line 141, ../sass/lib/_main-layout.scss */
.container--visible {
	opacity: 1;
	/* CSS3淡出淡入效果,1秒 */
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}

/* line 149, ../sass/lib/_main-layout.scss */
.overlay, .overlay3, .overlay5, .overlay6 {
	position: absolute;
	top: 60%;
	left: 40%;
	width: 100%;
	max-width: 895px;
	height: 490px;
	margin: -260px 0 0 -275px;
	opacity: 0;
	-webkit-transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	-o-transform: rotateY(90deg);
	transform: rotateY(90deg);
}

.overlay5, .overlay6 {
	visibility: hidden;
}

.overlay2 {
	position: absolute;
	top: 60%;
	left: 40%;
	width: 100%;
	max-width: 925px;
	height: 490px;
	margin: -260px 0 0 -275px;
	opacity: 0;
	-webkit-transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	-o-transform: rotateY(90deg);
	transform: rotateY(90deg);
}

.overlay4 {
	position: absolute;
	top: 60%;
	left: 40%;
	width: 100%;
	max-width: 980px;
	height: 490px;
	margin: -260px 0 0 -275px;
	opacity: 0;
	-webkit-transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	-o-transform: rotateY(90deg);
	transform: rotateY(90deg);
	visibility: hidden;
}

/* line 165, ../sass/lib/_main-layout.scss */
.tabs {
	border: 1px solid #fff;
	padding: 20px;
	text-align: center;
	border-radius: 20px;
}

/* line 172, ../sass/lib/_main-layout.scss */
.overlay--visible {
	opacity: 1;
	-webkit-transform: rotateY(0);
	-moz-transform: rotateY(0);
	-ms-transform: rotateY(0);
	-o-transform: rotateY(0);
	transform: rotateY(0);
	visibility: visible;
}

.active {
	background: #feffc5 !important;
}

/* line 182, ../sass/lib/_main-layout.scss */
.ui-share, .ui-details {
	opacity: .9;
	background: #fff;
	z-index: 2;
}

/* line 189, ../sass/lib/_main-layout.scss */
.ui-details-content, .ui-share-content {
	padding: 100px 50px;
}

/* line 194, ../sass/lib/_main-layout.scss */
.twitter-share {
	position: absolute;
	top: 4px;
	right: 20px;
}

/* line 201, ../sass/lib/_main-layout.scss */
.tabs-labels {
	margin-bottom: 9px;
}
/* line 203, ../sass/lib/_main-layout.scss */
.tabs-labels p {
	font-size: 1.5em;
	line-height: 1.5;
	padding: 10px;
	font-weight: bold;
	color: #fff;
	text-align: left;
	margin: 0 auto;
	max-width: 700px;
	text-shadow: #848484 0.1em 0.1em 0.1em;
}

/* line 215, ../sass/lib/_main-layout.scss */
.tabs-label {
	border-radius: 20px;
	background: #fff;
	padding: 50px;
	width: 170px;
	min-width: 160px;
	text-align: center;
	font-size: 2em;
	line-height: 70px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #333;
	min-height: 70px;
	opacity: .8;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
	margin: 10px;
	-webkit-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-moz-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-ms-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	-o-transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
	transition: opacity 0.1s cubic-bezier(0.694, 0.0482, 0.335, 1);
}

/* line 240, ../sass/lib/_main-layout.scss */
.twoline {
	line-height: 1;
}

/* line 243, ../sass/lib/_main-layout.scss */
.tabs-label:hover {
	opacity: .9;
}

/* line 247, ../sass/lib/_main-layout.scss */
.tabs-label--active {
	opacity: .9;
}

/* line 251, ../sass/lib/_main-layout.scss */
.tabs-panel {
	display: none;
}

/* line 255, ../sass/lib/_main-layout.scss */
.tabs-panel--active {
	display: block;
}

/* line 259, ../sass/lib/_main-layout.scss */
.tab-panel {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

/* line 266, ../sass/lib/_main-layout.scss */
.touch .ui-input {
	display: none;
}

/* index */
/* line 1, ../sass/lib/_index-layout.scss */
.indexbox {
	opacity: 0;
}

/* line 4, ../sass/lib/_index-layout.scss */
.indexbox--visible {
	opacity: 1;
	/* CSS3淡出淡入效果,1秒 */
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}

/* line 12, ../sass/lib/_index-layout.scss */
.index-logo {
	background: url(../../inc/img/e-logo.png) no-repeat;
	background-size: contain;
	width: 300px;
	height: 300px;
	position: absolute;
	top: 26%;
	right: 50%;
	transform: translateX(50%);
}

/* line 21, ../sass/lib/_index-layout.scss */
.indextitle {
	opacity: 0;
	position: absolute;
	bottom: 0;
	font-size: 2.9em;
	width: 100%;
	display: inline-block;
	text-align: center;
	color: #fff;
	font-weight: bold;
	letter-spacing: 3px;
}

/* line 33, ../sass/lib/_index-layout.scss */
.indextitle--v {
	opacity: 1;
	-webkit-transition: opacity 1s ease-in-out;
	-moz-transition: opacity 1s ease-in-out;
	-o-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
}

/* line 40, ../sass/lib/_index-layout.scss */
img {
	position: absolute;
	bottom: -100px;
	right: 40%;
}
/* line 44, ../sass/lib/_index-layout.scss */
img:before {
	-webkit-animation: pulse 2s ease infinite;
	animation: pulse 2s ease infinite;
	border-radius: 100px;
	background: #65C2B7;
	position: absolute;
	content: "";
	z-index: -1;
	bottom: 0;
	right: 0;
	left: 0;
	top: 0;
}