@charset "utf-8";

/*
		STYLE: meet v1.0
		AUTHOR: SHINEY WU
		EMAIL: SHINEY.WU@GMAIL.COM
*/


/* icomoon */
@import url('style.css');


/*
		RESET STYLE
*/
html { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, group, menu, nav, section {margin:0;padding:0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
audio, canvas, video { display:inline-block; }
button, input[type="text"], select, textarea {font:400 16px/1.8 arial, sans-serif;}
table { border-collapse:collapse; border-spacing:0; }
th { text-align:inherit; }
fieldset, img { border:0; }
img {max-width:100%;vertical-align:top;border:0;-ms-interpolation-mode:bicubic;}
iframe { display:block; border:0; }
acronym, abbr { border-bottom:1px dotted; }
abbr { cursor:help; }
del { text-decoration:line-through; }
address, caption, cite, code, den, th, var { font-weight:500; }
ul, ol { list-style:none; }
caption, th { text-align:left; }
q:before, q:after { content:''; }
sub, sup {font-size: 62%;line-height:0;position:relative;vertical-align:top;}
:root sub, :root sup{vertical-align:baseline; }
sup {top: -0.8em;left: 5px;}
sub { bottom:-0.25em; }
ins {text-decoration:none; }
u { text-decoration:underline; }
mark { background:#fffdd1; }
pre, code { font-family:'Courier New', Courier, monospace; }
pre {border: none; }
small {font-size: 14px;}
.clearfix:before, .clearfix:after { content:''; display:table; }
.clearfix:after { clear:both; }
h1, h2, h3, h4, h5, h6{/* font-family: simsun, serif; *//* font-weight: normal; */}
a:active, button:active { outline:none; }
.hide { display:none; }

::-webkit-input-placeholder { 
	color:#7f7f7f;
}
::-moz-placeholder { 
	color:#7f7f7f;
}
:-ms-input-placeholder { 
	color:#7f7f7f;
}
:-moz-placeholder { 
	color:#7f7f7f;
}


/*
	BODY
*/
body {
	-webkit-overflow-scrolling:touch;
	-webkit-user-select:none;
	-moz-user-select:none;
	color: #333;
	font: normal 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	-webkit-tap-highlight-color:transparent;
	overscroll-behavior-y: contain;
	overscroll-behavior-y: none;
	box-sizing: border-box;
}

*,
*::before,
*::after {
	box-sizing: inherit;
}

a { text-decoration:none; cursor:pointer; }
a:hover, a:active, a:focus { text-decoration:none; outline:none; }


/*
	UA
*/
.show-in-desktop,
.show-in-ios,
.show-in-android { display:none; }
.is--desktop .show-in-desktop,
.is--ios .show-in-ios,
.is--android .show-in-android { display:block; }



/*
	HEADER
*/
.header { z-index:2; height:80px; background:#fff; }
.header .header-inner {position:relative;max-width: 1280px;margin:0 auto;}
.header .logo {position:absolute;top:24px;left: 24px;display:block;color: #4a4a4a;font-size: 24px;height: 30px;line-height: 30px;} 
.header .slogan {position:absolute;top:24px;left: 120px;width:200px;font-size: 20px;color: #7a7a7a;letter-spacing:.15em;line-height:30px;}


/*
	BODY
*/
.body { position:relative; min-height:calc(100vh - 264px - 80px); }
.body .body-inner {max-width: 1280px;padding: 64px 24px;margin:0 auto;}
.body .row { display:flex; flex-wrap:wrap; }
.body .row .col { position:relative; width:100%; }
.body .figure-area { height:100%; }
.body .figure-area figure { height:100%; display:flex; align-items:center; }
.body .figure-area figure img { display:block; }
.body .figure-area figcaption { display:none; }
.body .copywriting-area {padding: 32px 24px 32px 64px;font-size:16px;}
.body .copywriting-area .title {font-size: 40px;line-height: 1.4;}
.body .copywriting-area .description {margin: 40px 0;color: #7a7a7a;}
.body .copywriting-area .description p { margin:0 0 16px; font-size:16px; }
.body .copywriting-area .download-area { margin:16px 0; }
.body .copywriting-area .download-area .popover {position:relative;width: 210px;flex:0 0 auto;margin-top:16px;padding: 0 15px;}
.body .copywriting-area .download-area .popover {margin-left: 0;}

.body .copywriting-area .show-in-desktop .download-area {margin: 0 0 0 -15px;display:flex;flex-wrap: wrap;}
.body .copywriting-area .show-in-ios .download-area { text-align:left; display:block; }

.body .copywriting-area .show-in-android .download-area { margin: 0 auto; }
.body .copywriting-area .show-in-android .download-area .popover { margin: 0 auto; }


.body [data-toggle="popover"].btn, .btn-link.btn {position:relative; width:180px; padding-left:50px; }
.body [data-toggle="popover"].btn i, .btn-link i {position:absolute;top:8px;left:6px;display:block;width:48px;height:48px;line-height:32px;text-align:center;font-size:28px;}



.body .popover-container__box figure { text-align:center; }
.body .popover-container__box figure img {display:block;width: 120px;margin:0 auto 8px;}
.body .popover-container__box figure figcaption { color:#999; line-height:24px; font-size:14px; }
.copy-area { text-align:center; padding:12px 0; }
.copy-area #copy-txt { display:block; width:0; height:0; overflow:hidden; opacity:0; }
.copy-area #copy-btn {background: transparent;}


/*
	FOOTER
*/
.footer { width:100%; cursor:default; background:#f5f5f5; }
.footer .footer-inner {position:relative;max-width: 1280px;margin:0 auto;padding: 40px 24px 16px;}
.footer .social-network {position:absolute;top:40px;right: 80px;}
.footer .social-network figure { text-align:center; }
.footer .social-network figure img {display:block;width: 120px;margin:0 auto 8px;}
.footer .social-network figure figcaption { color:#999; line-height:24px; font-size:14px; }
.footer .sitemap {font-size: 16px;position: relative;margin-bottom: 30px;}
.footer .sitemap dl:last-child { margin-bottom:0; }
.footer .sitemap dl {float:left;width: 240px;}
.footer .sitemap dt {margin-bottom: 20px;font-size: 18px;font-weight: normal;color: #000;}
.footer .sitemap dt a {display:block; color:#000; cursor:default;}
.footer .sitemap dd {color:#898989;display: block;height: 36px;font-weight: normal;line-height: 36px;}
.footer .sitemap dd.hrs { color:#999; }
.footer .sitemap dd a {color: #999;display: block;}
.footer .sitemap dd a:hover { color:#4A90E2; }
.footer .copyright {position:relative;letter-spacing: 0.02em; height: 44px;line-height: 22px;font-size: 13px; color: #999;}
.footer .copyright a { color:#999; }
.footer .copyright a + a { margin-left:8px; }
.footer .sitemap dd a.blank-link  { display:inline-block; position:relative; line-height:30px; padding-right:32px; }
.footer .sitemap dd a.blank-link i { position:absolute; top:-1px; right:0; display:block; width:32px; height:32px; line-height:32px; text-align:center; font-size:24px; }


/*
	RESPONSIVE
*/
@media only screen and (min-width: 768px) and (max-width: 880px) {
	.body .body-inner {padding: 32px 20px;}
	.body .copywriting-area {padding: 32px 24px 32px 64px;}
	.footer .sitemap dl { float:left; width: 25%;}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.footer .sitemap dl { float:left; width: 100%;}
	.footer .sitemap dl dt { color:#999; height: 40px;line-height: 40px;}
	.footer .sitemap dl dt a { color:#999; }
	.footer .copyright { border:none; }
}
@media only screen and (min-width: 768px) {
	.body .row .col { flex: 0 0 50%; max-width: 50%; }
	.body .copywriting-area .show-in-android .download-area .popover { margin:0; }
	.is--ios .social-network .show-in-ios .copy-area,
	.is--android .social-network .show-in-android .copy-area { display:none; }
}
@media only screen and (max-width: 767px) {
	.body .copywriting-area .show-in-desktop .download-area { max-width:400px; margin-left:auto; margin-right:auto; }
	.body .copywriting-area .show-in-desktop .download-area .popover { margin-left:auto; margin-right:auto; }
	.body .copywriting-area .show-in-ios .download-area { text-align: center; display:block; }
	.body .body-inner {padding: 24px 24px 48px;}
	.body .copywriting-area .title { font-size:24px; line-height:1.5; margin:32px 0; }
	.body .copywriting-area { padding:0; }
	.footer .social-network {position:relative;bottom:auto;right:auto;display:block;width:100%;margin-bottom: 40px;top: 0;}
	.footer .social-network li { margin-left:0; margin-right:20px; }
	.footer .sitemap { margin-bottom:1em; }
	.footer .sitemap dl { float:left; width: 100%; border-bottom: 1px solid #ccc;}
	.footer .sitemap dl:first-child {border-top: 1px solid #ccc;}
	.footer .sitemap dt { height: 48px;line-height: 48px; margin-bottom:0; }
	.footer .sitemap dt a { display:block;color: #999; cursor:pointer; height: 48px;line-height: 48px; }
	.footer .sitemap dd {height: 40px; margin-left: 1em;}
	.footer .copyright { border:none; font-size:13px; height: 40px; line-height: 20px; }
	.footer .copyright::before { content:'';width: auto;height: 1px;background: #333; top:0; left:0; right:0;display: block;}
	.footer .copyright::before { background:transparent; }
	.footer .sitemap dl dt a:after {
		content: '+';
		float: right;
		font-weight: normal;
		margin-right: 8px;
		-webkit-transition: -webkit-transform .3s ease;
		transition: transform .3s ease;
		color: #999;
	}
	.footer .sitemap dl.uncollapsed dt a:after {
		-webkit-transform: rotate(45deg) scale(1.08);
		transform: rotate(45deg) scale(1.08);
	}
	.footer .sitemap dl dd {
		display:none;
	}
	.footer .sitemap dl.uncollapsed dd {
		display:block;
	}
	.footer .sitemap dl.uncollapsed dt a {
		color: #000;
	}
}


/* popover START
---------------------------------------------------------------------------------------------------- */
.popover {position:relative;}
.popover-container {position:absolute;top: 100%;right: 0;width: 300px;padding: 0;z-index: 7;margin-top:0px;}
.popover .popover-container { display:block !important; transition: all .2s cubic-bezier(0.445,0.05,0.55,0.95); transform: scale(0); opacity:0; transform-origin:calc( 100% - 14px ) 0; }
.popover .popover-container__box {position:relative;padding:16px;border-radius:6px;border: 1px solid rgba(127,127,127,.2);background: #fff;}
.popover .popover-container__box::before {content:'';position:absolute; top: -8px; left:50%;width: 14px;height: 14px; border:1px solid transparent;border-left: 1px solid #ddd;border-top: 1px solid #ddd;background: #fff;border-radius: 4px 0 0 0;transform: rotate(45deg); margin-left: -6px; }
.popover .popover-container.top-center { transform-origin:calc( 50% ) 0%; }
.popover:hover .popover-container,
.popover.active .popover-container {display:block !important;opacity:1;transform: scale(1);text-align: left;font-size: 16px;line-height: 24px;box-sizing: border-box;}
.popover-container.top-center {top: 100%;left: 50%;right: auto;width: 180px;margin-left: -90px;padding-top: 16px;}
/* popover END
---------------------------------------------------------------------------------------------------- */




/*
 Button START
---------------------------------------------------------------------------------------------------- */
.btn {
	display: inline-block;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	padding: 8px 16px;
	font-size: 16px;
	line-height: 24px;
	border-radius: 24px;
	box-sizing:border-box;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn-lg {
	padding: 12px 20px;
	font-size: 18px;
	line-height: 24px;
	border-radius: 32px;
}

@media screen and (prefers-reduced-motion: reduce) {
	.btn {
		transition: none;
	}
}
.btn:hover, .btn:focus {
	text-decoration: none;
}
.btn:focus, .btn.focus {
	outline: 0;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.btn.disabled, .btn:disabled {
	opacity: 0.65;
}
.btn:not(:disabled):not(.disabled) {
	cursor: pointer;
}
.btn:not(:disabled):not(.disabled):active, .btn:not(:disabled):not(.disabled).active {
	background-image: none;
}
a.btn.disabled,
fieldset:disabled a.btn {
	pointer-events: none;
}


.btn-primary {
	color: #fff;
	background-color: #333;
	border-color: #333;
}
.btn-primary:hover {
	color: #fff;
	background-color: #333;
	border-color: #333;
}
.btn-primary:focus, .btn-primary.focus {
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}
.btn-primary.disabled, .btn-primary:disabled {
	color: #fff;
	background-color: #68abff;
	border-color: #68abff;
}
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active {
	color: #fff;
	background-color: #4f4f4f;
	border-color: #4f4f4f;
}
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus {
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}


.btn-secondary {
	color: #333;
	background-color: #fff;
	border-color: #7a7a7a;
}
.btn-secondary:hover {
	color: #333;
	background-color: #fff;
	border-color: #7a7a7a;
}
.btn-secondary:focus, .btn-secondary.focus {
	box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}
.btn-secondary.disabled, .btn-secondary:disabled {
	color: #999;
	background-color: #999;
	border-color: #999;
}
.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active {
	color: #333;
	background-color: #f5f5f5;
	border-color: #7a7a7a;
}
.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus {
	box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}



/*
 Button END
---------------------------------------------------------------------------------------------------- */