@charset "UTF-8";
/* 不改變文字單位 */
/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
/* ========================================================================== HTML5 display definitions ========================================================================== */
* { box-sizing: border-box; }

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

/** Correct `block` display not defined in IE 8/9. */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }

/** Correct `inline-block` display not defined in IE 8/9. */
audio, canvas, video { display: inline-block; }

/** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }

/** Address styling not present in IE 8/9. */
[hidden] { display: none; }

/* ========================================================================== Base ========================================================================== */
/** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */
html { font-family: sans-serif; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ }

/** Remove default margin. */
body { margin: 0; }

/* ========================================================================== Links ========================================================================== */
/** Address `outline` inconsistency between Chrome and other browsers. */
a:focus { outline: thin dotted; }

/** Improve readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; }

/* ========================================================================== Typography ========================================================================== */
/** Address variable `h1` font size within `section` and `article` contexts in Firefox 4+, Safari 5, and Chrome. */
h1 { font-size: 2em; }

/** Address styling not present in IE 8/9, Safari 5, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }

/** Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */
b, strong { font-weight: bold; }

/** Address styling not present in Safari 5 and Chrome. */
dfn { font-style: italic; }

/** Address styling not present in IE 8/9. */
mark { background: #ff0; color: #000; }

/** Correct font family set oddly in Safari 5 and Chrome. */
code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; }

/** Improve readability of pre-formatted text in all browsers. */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

/** Set consistent quote types. */
q { quotes: "\201C" "\201D" "\2018" "\2019"; }

/** Address inconsistent and variable font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* ========================================================================== Embedded content ========================================================================== */
/** Remove border when inside `a` element in IE 8/9. */
img { border: 0; }

/** Correct overflow displayed oddly in IE 9. */
svg:not(:root) { overflow: hidden; }

/* ========================================================================== Figures ========================================================================== */
/** Address margin not present in IE 8/9 and Safari 5. */
figure { margin: 0; }

/* ========================================================================== Forms ========================================================================== */
/** Define consistent border, margin, and padding. */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct `color` not being inherited in IE 8/9. 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend { border: 0; /* 1 */ padding: 0; /* 2 */ }

/** 1. Correct font family not being inherited in all browsers. 2. Correct font size not being inherited in all browsers. 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. */
button, input, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 2 */ margin: 0; /* 3 */ }

/** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */
button, input { line-height: normal; }

/** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ }

/** Re-set default cursor for disabled elements. */
button[disabled], html input[disabled] { cursor: default; }

/** 1. Address box sizing set to `content-box` in IE 8/9. 2. Remove excess padding in IE 8/9. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; }

/** Remove inner padding and search cancel button in Safari 5 and Chrome on OS X. */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** Remove inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/** 1. Remove default vertical scrollbar in IE 8/9. 2. Improve readability and alignment in all browsers. */
textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ }

/* ========================================================================== Tables ========================================================================== */
/** Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }

/* ========================================================================== Typography ========================================================================== */
/* html { font-size: 62.5%; @include rem(line-height, 24px);} */
/*字體陰影*/
/*字體樣式*/
body { font-family: "Microsoft YaHei","微软雅黑", "Microsoft Jhenghei","微軟正黑體", 'Meiryo', "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; -webkit-text-size-adjust: none; text-rendering: optimizeLegibility; color: #444; }

h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; border: 0; font-family: "HelveticaNeue-Medium", "Helvetica Neue Medium", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", serif; font-weight: 400; color: black; }

h1, h2, h3, h4, h5, h6, th { color: #444; font-family: 'Meiryo', "Microsoft YaHei","微软雅黑", "Microsoft Jhenghei","微軟正黑體", sans-serif; }

h1 { font-size: 2em; line-height: 1.125em; margin-bottom: 1.5em; }

h2 { font-size: 1.5em; line-height: 2em; margin-bottom: 1.5em; }

h3 { font-size: 1.25em; line-height: 1.2em; margin-bottom: 1.5em; }

h4 { font-size: 1.125em; line-height: 1.3333333333em; margin-bottom: 1.5em; }

p, li, td { font-family: 'Meiryo', "Microsoft YaHei","微软雅黑", "Microsoft Jhenghei","微軟正黑體", "新細明體", Tahoma, Geneva, sans-serif; font-size: 1em; line-height: 1.65em; margin-bottom: 1.5em; }

p.small { font-size: 0.75em; line-height: 2em; }

ul { line-height: 1; }
ul li { margin-bottom: 0.375em; }
ul li:last-child { margin-bottom: 0; }

a { color: blue; text-decoration: none; }
a:hover { color: #0cc; }
a:hover, a:focus { text-decoration: underline; }

/* ========================================================================== form ========================================================================== */
/* ====================  input  ==================== */
input[type="text"]:-moz-placeholder { color: #aaa; /* font-style: italic; */ }
input[type="text"]::-moz-placeholder { color: #aaa; /* font-style: italic; */ }
input[type="text"]:-ms-input-placeholder { color: #aaa; /* font-style: italic; */ }
input[type="text"]::-webkit-input-placeholder { color: #aaa; /* font-style: italic; */ }

/* ==================== Button ==================== */
/* ========================================================================== mixins ========================================================================== */
/******************  表格 ******************/
table.table_style { margin: 0 auto 20px auto; border-top: #ccc 1px solid; border-left: #ccc 1px solid; }
table.table_style th, table.table_style td { padding: 8px 10px; border-right: #ccc 1px solid; border-bottom: #ccc 1px solid; }
table.table_style thead tr th { background-color: #f2f2f2; }
table.table_style thead tr td { font-weight: bold; background-color: white; }
table.table_style tr.odd, table.table_style tbody.odd tr:nth-child(2n+2), table.table_left_style tbody.odd table.table_style tr:nth-child(2n+2) { background: white; }

table.table_left_style { margin: 0 auto 20px auto; border-top: #ccc 1px solid; border-left: #ccc 1px solid; }
table.table_left_style th, table.table_left_style td { padding: 8px 10px; border-right: #ccc 1px solid; border-bottom: #ccc 1px solid; }
table.table_left_style th { background-color: #f2f2f2; }
table.table_left_style tr.odd, table.table_style tbody.odd table.table_left_style tr:nth-child(2n+2), table.table_left_style tbody.odd tr:nth-child(2n+2) { background: white; }

/* ========================================================================== Layout ========================================================================== */
/* ==================== Setup the 960 Grid System ==================== */
/* ==================== RWD breakpoint -- columns 12, 8, 4 ==================== */
@media (max-width: 30em) { #container { max-width: 96%; margin-left: auto; margin-right: auto; }
  #container:after { content: " "; display: block; clear: both; } }
@media (min-width: 30.0625em) and (max-width: 45em) { #container { max-width: 96%; margin-left: auto; margin-right: auto; }
  #container:after { content: " "; display: block; clear: both; } }
@media (min-width: 45.0625em) { #container { max-width: 960px; margin-left: auto; margin-right: auto; }
  #container:after { content: " "; display: block; clear: both; } }

/* ==================== Block Layout  ==================== */
/* ==================== container ==================== */
/*************************************
*               body
**************************************/
html { box-sizing: border-box; }

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

.row { *zoom: 1; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.row:after { content: ""; display: table; clear: both; }

#content { *zoom: 1; }
#content:after { content: ""; display: table; clear: both; }

/*************************************
*               Header
**************************************/
header.header { width: 100%; height: 135px; margin: 0 auto 10px; background: url(/images/title_bg2-2017rwd.jpg) no-repeat left 0px; }

@media (min-width: 30.0625em) and (max-width: 45em) { header.header { width: 100%; } }
@media (max-width: 30em) { header.header { width: 100%; } }
/*************************************
*               footer
**************************************/
footer { width: 960px; margin: 20px auto; text-align: center; }
footer p { font-size: 0.8125em; line-height: 1.8461538462em; color: #666; margin: 0; }

@media (min-width: 30.0625em) and (max-width: 45em) { footer { width: 100%; } }
@media (max-width: 30em) { footer { width: 100%; }
  footer span { display: block; } }
.main { border: #ddd 1px solid; border-radius: 5px; }
.main h3 { padding: 10px 0; margin-top: 10px; text-align: center; background-color: #C5D9EB; }
.main .form-group { padding: 0 40px; }
.main label { width: 160px; text-align: right; }
.main input[type="text"], .main input[type="email"], .main input[type="tel"], .main select { display: inline-block; }
.main input[type="file"] { display: inline-block; }
.main input.date { width: 30%; }
.main .note { margin-left: 165px; font-size: 0.9375em; line-height: 1.6em; }

.text_box { padding: 0 40px; }
.text_box h4.title_font { padding: 5px 3px; background-color: #eee; }
.text_box ul { padding-left: 30px; }
.text_box ul li { list-style-type: upper-alpha; }
.text_box ul ul { margin: 10px 0; }
.text_box ul ul li { list-style-type: disc; }

@media (min-width: 30.0625em) and (max-width: 45em) { .main .form-group { padding: 0 20px; }
  .main .form-group button { margin-top: 5px; }
  .main label { width: 100%; display: block; text-align: left; }
  .main input[type="text"], .main input[type="email"], .main input[type="tel"], .main select { width: 100%; }
  .main input[type="file"] { margin-top: 5px; }
  .main img.code { margin: 5px auto 0; text-align: center; display: block; }
  .main .note { margin-left: 0px; }
  .text_box { padding: 0 20px; } }
@media (max-width: 30em) { .main .form-group { padding: 0 20px; }
  .main .form-group button { margin-top: 5px; }
  .main label { width: 100%; display: block; text-align: left; }
  .main input[type="text"], .main input[type="email"], .main input[type="tel"], .main select { width: 100%; }
  .main input[type="file"] { margin-top: 5px; }
  .main img.code { margin: 5px auto 0; text-align: center; display: block; }
  .main .note { margin-left: 0px; }
  .text_box { padding: 0 20px; } }
.center_box { text-align: center; }
.center_box input[type="checkbox"] { margin-right: 5px; }

.button_box { margin: 20px auto; text-align: center; }

/* ========================================================================== mixins ========================================================================== */
.pt0 { padding-top: 0; }

.pt5 { padding-top: 5px; }

.pt10 { padding-top: 10px; }

.pt15 { padding-top: 15px; }

.pt20 { padding-top: 20px; }

.pt25 { padding-top: 25px; }

.pt30 { padding-top: 30px; }

.pt35 { padding-top: 35px; }

.pt40 { padding-top: 40px; }

.pt45 { padding-top: 45px; }

.pt50 { padding-top: 50px; }

.pb0 { padding-bottom: 0; }

.pb5 { padding-bottom: 5px; }

.pb10 { padding-bottom: 10px; }

.pb15 { padding-bottom: 15px; }

.pb20 { padding-bottom: 20px; }

.pb25 { padding-bottom: 25px; }

.pb30 { padding-bottom: 30px; }

.pb35 { padding-bottom: 35px; }

.pb40 { padding-bottom: 40px; }

.pb45 { padding-bottom: 45px; }

.pb50 { padding-bottom: 50px; }

.pl0 { padding-left: 0; }

.pl5 { padding-left: 5px; }

.pl10 { padding-left: 10px; }

.pl15 { padding-left: 15px; }

.pl20 { padding-left: 20px; }

.pl25 { padding-left: 25px; }

.pl30 { padding-left: 30px; }

.pl35 { padding-left: 35px; }

.pl40 { padding-left: 40px; }

.pl45 { padding-left: 45px; }

.pl50 { padding-left: 50px; }

.pr0 { padding-right: 0; }

.pr5 { padding-right: 5px; }

.pr10 { padding-right: 10px; }

.pr15 { padding-right: 15px; }

.pr20 { padding-right: 20px; }

.pr25 { padding-right: 25px; }

.pr30 { padding-right: 30px; }

.pr35 { padding-right: 35px; }

.pr40 { padding-right: 40px; }

.pr45 { padding-right: 45px; }

.pr50 { padding-right: 50px; }

.mt0 { margin-top: 0; }

.mt5 { margin-top: 5px; }

.mt10 { margin-top: 10px; }

.mt15 { margin-top: 15px; }

.mt20 { margin-top: 20px; }

.mt25 { margin-top: 25px; }

.mt30 { margin-top: 30px; }

.mt35 { margin-top: 35px; }

.mt40 { margin-top: 40px; }

.mt45 { margin-top: 45px; }

.mt50 { margin-top: 50px; }

.mb0 { margin-bottom: 0; }

.mb5 { margin-bottom: 5px; }

.mb10 { margin-bottom: 10px; }

.mb15 { margin-bottom: 15px; }

.mb20 { margin-bottom: 20px; }

.mb25 { margin-bottom: 25px; }

.mb30 { margin-bottom: 30px; }

.mb35 { margin-bottom: 35px; }

.mb40 { margin-bottom: 40px; }

.mb45 { margin-bottom: 45px; }

.mb50 { margin-bottom: 50px; }

.ml0 { margin-left: 0; }

.ml5 { margin-left: 5px; }

.ml10 { margin-left: 10px; }

.ml15 { margin-left: 15px; }

.ml20 { margin-left: 20px; }

.ml25 { margin-left: 25px; }

.ml30 { margin-left: 30px; }

.ml35 { margin-left: 35px; }

.ml40 { margin-left: 40px; }

.ml45 { margin-left: 45px; }

.ml50 { margin-left: 50px; }

.mr0 { margin-right: 0; }

.mr5 { margin-right: 5px; }

.mr10 { margin-right: 10px; }

.mr15 { margin-right: 15px; }

.mr20 { margin-right: 20px; }

.mr25 { margin-right: 25px; }

.mr30 { margin-right: 30px; }

.mr35 { margin-right: 35px; }

.mr40 { margin-right: 40px; }

.mr45 { margin-right: 45px; }

.mr50 { margin-right: 50px; }

/* ========================================================================== responsive mixins ========================================================================== */
@media (min-width: 45.0625em) { table.responTable { width: 100%; margin: 0 auto 20px auto; border-top: #ccc 1px solid; border-left: #ccc 1px solid; text-rendering: optimizeLegibility; }
  table.responTable thead tr th, table.responTable thead tr td, table.responTable tbody tr th, table.responTable tbody tr td { padding: 5px; border-right: #ccc 1px solid; border-bottom: #ccc 1px solid; }
  table.responTable thead tr th a, table.responTable thead tr td a, table.responTable tbody tr th a, table.responTable tbody tr td a { min-width: 26px; display: inline-block; *display: inline; *zoom: 1; text-decoration: underline; margin: 0 5px 0 0; cursor: pointer; }
  table.responTable thead tr th { text-align: center; background: #e0e0e0; }
  table.responTable tbody tr td { color: #444; text-align: left; }
  table.responTable tr.odd, table.responTable table.table_style tbody.odd tr:nth-child(2n+2), table.table_style tbody.odd table.responTable tr:nth-child(2n+2), table.responTable table.table_left_style tbody.odd tr:nth-child(2n+2), table.table_left_style tbody.odd table.responTable tr:nth-child(2n+2) { background: #f2f2f2; }
  table.responTable tbody.odd tr:nth-child(2n+2) { background: #f2f2f2; } }
@media (min-width: 30.0625em) and (max-width: 45em) { table.responTable { width: 100%; margin: 0 auto 20px auto; border-top: #ccc 1px solid; border-left: #ccc 1px solid; text-rendering: optimizeLegibility; }
  table.responTable thead tr th, table.responTable thead tr td, table.responTable tbody tr th, table.responTable tbody tr td { padding: 5px; border-right: #ccc 1px solid; border-bottom: #ccc 1px solid; }
  table.responTable thead tr th a, table.responTable thead tr td a, table.responTable tbody tr th a, table.responTable tbody tr td a { min-width: 26px; display: inline-block; *display: inline; *zoom: 1; text-decoration: underline; margin: 0 5px 0 0; cursor: pointer; }
  table.responTable thead tr th { text-align: center; background: #e0e0e0; }
  table.responTable tbody tr td { color: #444; text-align: left; }
  table.responTable tr.odd, table.responTable table.table_style tbody.odd tr:nth-child(2n+2), table.table_style tbody.odd table.responTable tr:nth-child(2n+2), table.responTable table.table_left_style tbody.odd tr:nth-child(2n+2), table.table_left_style tbody.odd table.responTable tr:nth-child(2n+2) { background: #f2f2f2; }
  table.responTable tbody.odd tr:nth-child(2n+2) { background: #f2f2f2; } }
@media (max-width: 30em) { table.responTable { display: block; border: none; }
  table.responTable thead { display: none; }
  table.responTable tbody tr { position: relative; display: block; margin: 0 0 10px 0; }
  table.responTable tbody tr td { position: relative; margin-bottom: 0; background: #ffffff; display: inline-block; width: 100%; padding: 0; vertical-align: middle; border-top: #ccc 1px solid; border-right: #ccc 1px solid; border-left: #ccc 1px solid; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
  table.responTable tbody tr td:last-child { border-bottom: #ccc 1px solid; }
  table.responTable tbody tr td div { color: #444; display: table-cell; padding: 5px; border-left: #ccc 1px solid; }
  table.responTable tbody tr td div a { display: block; text-decoration: underline; margin: 0 0 5px 0; }
  table.responTable tbody tr td:first-child { /* background: $t_bg_color; */ }
  table.responTable tbody tr td:before { background: #e0e0e0; content: attr(data-th); display: table-cell; left: 0; width: 100px; margin: 0 5px 0 0; padding: 0 5px; /* border-right: $t_color $t_width $t_style; */ vertical-align: middle; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
  table.responTable tbody tr:not(:last-child) { border-right: none; border-bottom: none; } }
.gallery img { margin-bottom: 15px; }
@media (max-width: 30em) { .gallery img { width: 99.7368421053%; float: left; }
  .gallery img:nth-child(1n + 1) { margin-left: 0; margin-right: -100%; clear: both; margin-left: 0; } }
@media (min-width: 30.0625em) and (max-width: 45em) { .gallery img { width: 31.0344827586%; float: left; }
  .gallery img:nth-child(3n + 1) { margin-left: 0; margin-right: -100%; clear: both; margin-left: 0; }
  .gallery img:nth-child(3n + 2) { margin-left: 34.4827586207%; margin-right: -100%; clear: none; }
  .gallery img:nth-child(3n + 3) { margin-left: 68.9655172414%; margin-right: -100%; clear: none; } }
@media (min-width: 45.0625em) { .gallery img { width: 15.2542372881%; float: left; }
  .gallery img:nth-child(6n + 1) { margin-left: 0; margin-right: -100%; clear: both; margin-left: 0; }
  .gallery img:nth-child(6n + 2) { margin-left: 16.9491525424%; margin-right: -100%; clear: none; }
  .gallery img:nth-child(6n + 3) { margin-left: 33.8983050847%; margin-right: -100%; clear: none; }
  .gallery img:nth-child(6n + 4) { margin-left: 50.8474576271%; margin-right: -100%; clear: none; }
  .gallery img:nth-child(6n + 5) { margin-left: 67.7966101695%; margin-right: -100%; clear: none; }
  .gallery img:nth-child(6n + 6) { margin-left: 84.7457627119%; margin-right: -100%; clear: none; } }