html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
body { line-height:1; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; color:#ffde00; font-size:100%; text-decoration:none; vertical-align:baseline; background:transparent; }

ol, ul, li { list-style:none; }

/* change colours to suit your needs */
ins { background-color:#ff9; color:#000; text-decoration:none; }


/* change colours to suit your needs */
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }


/* change border colour to suit your needs */
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }


/**** Clearfix ****/
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


html, body {
	background:#1b3374;
	height:100%;
	font-family:Verdana, Geneva, sans-serif, 微軟正黑體; -webkit-text-size-adjust:none; word-break:break-all;
}

#page { position:relative; min-height:100%; }

header {
	width:100%; height:60px;
	background-color:#1b3374;
	overflow:hidden;
}
header a.logo {
	display:block;
	width:115px; height:30px;
	margin:15px auto;
	background:url(images/LOGO-sampo.png) no-repeat;
	text-indent:-9999px;
}

.main { padding-bottom:45px; }
.main .head {
	padding:10px;
	background-color:#1b3374;
	font-size:24px; font-weight:bold; color:#fff; text-align:center;
	text-shadow:2px 2px 3px rgba(0,0,0,0.3);
}


/* Style */
.align-c { text-align:center; }
.c-yellow { color:#ffde00 !important; }
.text {
	color:#fff;
	font-size:1.5em; text-align:center; line-height:1.3;
	margin:40px 10px;
}
.fs-13em { font-size:1.1em !important; }

/* Tab */
ul.tabs { overflow:hidden; }
ul.tabs li {
	float:left;
	width:50%;
}
ul.tabs li a {
	display:block;
	background-color:#1b3374;
}
ul.tabs li a.current {
	background-color:#040b43;
}


/* Form Style */
form {
	height:100%;
}
.wrap-form {
	padding:20px;
	background-color:#040b43;
	color:#fff;
	overflow:hidden;
}
input[placeholder], [placeholder], *[placeholder] {
	color:#000;
	font-size:18px; text-align:center;
}
div.field {
	margin:5px 0; padding:15px 0;
	overflow:hidden;
}
div.field a {
	text-decoration:underline;
}
div.field.special {
	padding:0;
	height:auto; line-height:inherit;
	background:#349abb; /* Old browsers */
	background:-moz-linear-gradient(top,  #349abb 0%, #63d6ed 100%); /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#349abb), color-stop(100%,#63d6ed)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top,  #349abb 0%,#63d6ed 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top,  #349abb 0%,#63d6ed 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top,  #349abb 0%,#63d6ed 100%); /* IE10+ */
	background:linear-gradient(to bottom,  #349abb 0%,#63d6ed 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#349abb', endColorstr='#63d6ed',GradientType=0 ); /* IE6-9 */
}
div.field.special img {
	display:block;
	margin:auto;
	padding:10px 10px 0 10px;
	width:100%; max-width:300px;
	box-sizing:border-box;
}
div.field.special label {
	display:block;
	padding:10px;
	color:#040b43;
}
div.field.special .tip {
	padding:10px;
	text-align:center;
	background-color:#e80000;
}
div.field.special input[type="checkbox"] {
	display:block;
	float:left;
	margin:3px 10px 20px 0;
}
input[type="text"], input[type="number"], input[type="password"], input[type="email"], input[type="date"], input[type="tel"], input[type="date"]:focus {
	display:block;
	border:none;
	padding:10px; margin:5px 0;
	width:100%; height:45px;
	 -webkit-appearance: none; -moz-appearance: none;
	-webkit-box-shadow:inset 2px 2px 5px rgba(0,0,0,0.4);
	-moz-box-shadow:inset 2px 2px 5px rgba(0,0,0,0.4);
	-ms-box-shadow:inset 2px 2px 5px rgba(0,0,0,0.4);
	-o-box-shadow:inset 2px 2px 5px rgba(0,0,0,0.4);
	box-shadow:inset 2px 2px 5px rgba(0,0,0,0.4);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
	-o-border-radius:10px;
	border-radius:10px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box;
}
input:disabled { opacity:1; }
.toolbar {
	position:absolute; bottom:0;
	width:100%;
}
/*

a.btn-default, input.btn-default, button.btn-default {
	display:inline-block;
	border:none;
	background-color:#040b43;
	height:45px; 
	font-size:18px; text-align:center; line-height:45px; vertical-align:middle;
	padding:0 15px; margin:10px;
	color:#fff;
	cursor:pointer;
	
	-webkit-appearance: none;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
	-o-border-radius:10px;
	border-radius:10px;
}*/
a.btn-default, input.btn-default, button.btn-default {
    display: block;
    border: none;
    background-color: #040b43;
    height: 45px;
    width: 130px;
    font-size: 18px;
    text-align: center;
    line-height: 45px;
    vertical-align: middle;
    padding: 0 15px;
    margin: 10px auto;
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}
a.btn-accpet, input.btn-accpet, button.btn-accpet {
	background-color:#1b3374 !important;
}
.toolbar { overflow:hidden; }
.toolbar .btn-default {
	display:block;
	padding:0; margin:0;
	width:100%;
	background-color:#b2b2b2;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	-ms-border-radius:0;
	-o-border-radius:0;
	border-radius:0;
}
.toolbar.both .btn-default {
	float:left;
	width:50%;
}

.side-panel {
	position:absolute; top:0;
	width:100%; height:100%; min-height:100%;
	margin-left:-102%;
	background-color:rgba(0,0,0,0.6);
	z-index:2;
	overflow:hidden;
	-webkit-transition: all .6s ease-in-out;
	-moz-transition: all .6s ease-in-out;
	-ms-transition: all .6s ease-in-out;
	-o-transition: all .6s ease-in-out;
	transition: all .6s ease-in-out;
}
.side-panel:target { margin-left:0; }

.side-panel a#close {
	position:absolute; top:5px; right:5px;
	display:block;
	padding:10px;
}
#consent:target {
	background-color:#1b3374;
	overflow-y:auto;
}
.side-panel#consent .wrap-box {
	padding:10px 20px;
	color:#fff;
	line-height:1.4;
}


/* Consent */
.consent ul > li { list-style-type:disc; }
.consent ol > li { list-style-type:decimal; }
.consent ul, .consent ol {
	padding-left:55px; margin-bottom:20px;
}
.consent ul li, .consent ol li {
	list-style-position:outside;
	word-break:break-all;
	margin-bottom:10px;
}
#consent h2 { font-size:1.3em; margin-bottom:20px; }
#consent h4 { margin-bottom:10px; }
#consent p { word-break:break-word; margin-bottom:10px; padding-left:55px; }

#consent ul li p, #consent ol li p { padding:0; }
#consent ul li ul, #consent ol li ul { padding:20px; }