@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline; }

ol, ul {
  list-style: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
  display: block; }

audio, canvas, video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden] {
  display: none; }

a {
  text-decoration: none;
  color: initial; }
  a:focus {
    text-decoration: none;
    outline: 0;
    color: initial; }
  a:active, a:hover {
    outline: 0;
    text-decoration: none;
    color: initial; }

abbr[title] {
  border-bottom: 1px dotted; }

b, strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

hr {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

mark {
  background: #ff0;
  color: #000; }

code, kbd, pre, samp {
  font-family: monospace, serif;
  font-size: 1em; }

pre {
  white-space: pre-wrap; }

q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

small {
  font-size: 80%; }

sub {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  max-width: 100%;
  height: auto; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 0; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0; }

button, input, select, textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0; }

button, input {
  line-height: normal; }

button, select {
  text-transform: none; }

button, html input[type="button"] {
  -webkit-appearance: button;
  cursor: pointer; }

input[type="reset"], input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled], html input[disabled] {
  cursor: default; }

input[type="checkbox"], input[type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }
  input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto;
  vertical-align: top; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

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

html {
  font-family: sans-serif;
  line-height: 1;
  font-size: 16px; }

a {
  text-decoration: none;
  color: black; }

.mg-top-16 {
  margin-top: 1rem !important; }

.mg-top-32 {
  margin-top: 2rem !important; }

.mg-top-48 {
  margin-top: 3rem !important; }

.mg-bottom-16 {
  margin-bottom: 1rem !important; }

.mg-bottom-32 {
  margin-bottom: 2rem !important; }

.mg-bottom-48 {
  margin-bottom: 3rem !important; }

.pd-32 {
  padding: 2rem; }

@media (min-width: 768px) {
  .hidden-if-not-mobile {
    display: none; } }

@media (max-width: 767px) {
  .display-mobile {
    display: block; }
  .display-pad-up {
    display: none; } }

@media (min-width: 768px) {
  .display-mobile {
    display: none; }
  .display-pad-up {
    display: block; } }

.tal {
  text-align: left; }

.tac {
  text-align: center; }

.tar {
  text-align: right; }

.inline > * {
  display: inline-block; }

.element-center {
  text-align: center; }
  .element-center > * {
    display: inline-block; }

.element-right {
  text-align: right; }
  .element-right > * {
    display: inline-block; }

.iconText {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; }

.iconText-vertical {
  text-align: center; }
  .iconText-vertical i {
    display: inline-block; }
  .iconText-vertical span {
    margin-top: 0.5rem;
    display: block;
    font-size: 1.125rem; }

.icon-l {
  margin-right: 0.5rem; }

.icon-r {
  margin-left: 0.5rem; }

.border-solid {
  border-width: 1px;
  border-style: solid; }

.border-left-solid {
  border-left: 1px solid #bababa; }

.pos-r {
  position: relative; }

.overflow-hidden {
  overflow: hidden; }

.block-scrolling {
  overflow: hidden;
  height: 100%; }

.img-wrap {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-color: #ccc;
  width: 120px;
  height: 120px; }

.fl-r {
  float: right; }

.white-card {
  background-color: #fff;
  margin-bottom: 1em;
  padding: 1.875em; }

.white-bg {
  background-color: #fff; }

.no-margin {
  margin-left: 0 !important;
  margin-right: 0 !important; }

.no-padding {
  padding: 0; }

.modal.center-modal {
  text-align: center;
  padding: 0 !important; }
  .modal.center-modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px; }
  .modal.center-modal .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle; }

.no-shadow {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  box-shadow: none; }

*, html, body {
  font-family: "PingFangTC", "微軟正黑體", "Heiti TC", "Microsoft JhengHei", "新細明體", "細明體", "標楷體", Arial, serif;
  font-size: 1rem; }

.color-main {
  color: #89b528 !important; }

h1 {
  font-size: 36px;
  line-height: 48px; }

h2 {
  font-size: 30px;
  line-height: 42px; }

h3 {
  font-size: 26px;
  line-height: 38px; }

h4 {
  font-size: 20px;
  line-height: 32px; }

h5 {
  font-size: 18px;
  line-height: 30px; }

.title {
  margin-bottom: 1rem; }

.des-md {
  font-size: 1rem;
  line-height: 1.75rem; }

.des-sm {
  font-size: 0.9375rem;
  line-height: 1.625rem; }

.data-group {
  margin-bottom: 1rem; }
  .data-group .data-title {
    margin-bottom: 0.25rem;
    color: #89b528;
    font-weight: bold; }
  .data-group .data-title > *, .data-group .data-content > * {
    font-size: 0.913rem; }

@media (min-width: 1px) {
  .container {
    padding: 0 1.25em; } }

@media (min-width: 321px) {
  .container {
    padding: 0 1.5em; } }

@media (min-width: 767px) and (max-width: 992px) {
  .container {
    padding: 0 2em;
    width: 100%; } }

.row {
  margin-left: -0.75em;
  margin-right: -0.75em; }

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .colg0.col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  padding-left: 0.75em;
  padding-right: 0.75em; }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes fadeInTop {
  20% {
    opacity: 0;
    -webkit-transform: translate(0, 6px);
    transform: translate(0, 6px); }
  100% {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0); } }

@keyframes fadeInTop {
  20% {
    opacity: 0;
    -webkit-transform: translate(0, 6px);
    transform: translate(0, 6px); }
  100% {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0); } }

@-webkit-keyframes moveTop {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px); }
  100% {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0); } }

@keyframes moveTop {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px); }
  100% {
    opacity: 1;
    -webkit-transform: translate(0);
    transform: translate(0); } }

.icon-sprite-home-entries {
  background-image: url("../images/home-entries-icon.png");
  background-repeat: no-repeat;
  display: inline-block; }

.home-entries-icon-calendar {
  width: 62px;
  height: 62px;
  background-position: 0 0; }

.home-entries-icon-calendar--hover {
  width: 62px;
  height: 62px;
  background-position: -62px 0; }

.home-entries-icon-checklist {
  width: 62px;
  height: 62px;
  background-position: -124px 0; }

.home-entries-icon-checklist--hover {
  width: 62px;
  height: 62px;
  background-position: -186px 0; }

.home-entries-icon-note {
  width: 62px;
  height: 62px;
  background-position: -248px 0; }

.home-entries-icon-note--hover {
  width: 62px;
  height: 62px;
  background-position: -310px 0; }

.home-entries-icon-user {
  width: 62px;
  height: 62px;
  background-position: -372px 0; }

.home-entries-icon-user--hover {
  width: 62px;
  height: 62px;
  background-position: -434px 0; }

.icon-sprite-arrows {
  background-image: url("../images/arrows.png");
  background-repeat: no-repeat;
  display: inline-block; }

.arrowLeft-white {
  width: 21px;
  height: 21px;
  background-position: 0 0; }

.arrowRight-white {
  width: 21px;
  height: 21px;
  background-position: -21px 0; }

.btn-toggle-newsBk {
  width: 21px;
  height: 21px;
  background-position: -42px 0; }

.btn-toggle-newsBk--hover {
  width: 21px;
  height: 21px;
  background-position: -63px 0; }

.icon-mmenu {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 0 50%;
  background-image: url("../images/icon-mmenu.png");
  width: 21px;
  height: 21px;
  background-size: 21px 21px; }

.icon-not-member {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 0 50%;
  background-image: url("../images/icon_not_member.svg");
  width: 36px;
  height: 36px;
  background-size: 36px 36px; }

.icon-is-member {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 0 50%;
  background-image: url("../images/icon_is_member.svg");
  width: 36px;
  height: 36px;
  background-size: 36px 36px; }

h1, h2, h3, h4, h5 {
  font-weight: bold; }

.mainWrapper {
  margin-top: 65px; }
  @media (min-width: 768px) {
    .mainWrapper {
      margin-top: 0; } }

.no-pd-on-mobile {
  margin-left: -1.5rem;
  margin-right: -1.5rem; }
  @media (min-width: 1023px) {
    .no-pd-on-mobile {
      margin-left: 0;
      margin-right: 0; } }

.heding-border-bottom {
  margin-top: 1rem;
  margin-bottom: 1em;
  padding: 0;
  border-bottom: 1px solid #ddd; }
  .heding-border-bottom > * {
    display: block;
    margin: 0;
    padding-bottom: 0.5rem;
    color: #000;
    font-weight: bold;
    font-size: 1rem; }
    @media (min-width: 768px) {
      .heding-border-bottom > * {
        font-size: 1.125rem; } }

.dropDownWrap {
  padding: 1.5em;
  background-color: #fff;
  -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 7px rgba(0, 0, 0, 0.15);
  -ms-box-shadow: 0 0 7px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.15); }

.toolBar {
  margin-bottom: 1.5em; }
  @media (min-width: 768px) {
    .toolBar {
      margin-top: 1em; } }

.content-box {
  background-color: #fff; }
  .content-box .content-box-header {
    padding: 0.5rem 1.75rem;
    border-bottom: 1px solid #ddd; }
  .content-box .content-box-body {
    padding: 1.75rem; }

.content-box-radius {
  -webkit-border-radius: 8px;
  border-radius: 8px;
  background-clip: padding-box; }

.content-box-shadow {
  -webkit-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
  -ms-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1); }

.breadcrumb {
  margin-top: 1.5em;
  font-size: 0.875em; }

.tooltip-inner {
  padding: 0.875em 2em;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-clip: padding-box; }

.bg-success {
  margin-bottom: 1em;
  padding: 1em; }
  @media (min-width: 768px) {
    .bg-success {
      margin-bottom: 4em; } }

.systemMsg {
  padding: 0.75em 1.563em;
  font-size: 0.75em;
  line-height: 1.5; }
  .systemMsg .content {
    float: left;
    width: 85%; }
  .systemMsg .btn-close {
    float: right;
    text-align: right;
    width: 15%; }
    .systemMsg .btn-close > .icon-close-white {
      width: 18px;
      height: 18px;
      background-size: 18px 18px; }

.systemMsg-light-blue {
  color: #fff;
  background-color: #60b2db; }

@media (min-width: 768px) {
  .systemMsg {
    display: none; } }

.hr {
  width: 100%;
  height: 2px;
  border: 1px solid #dfdfdf; }

.loading-img {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.glyphicon {
  display: inline-block;
  vertical-align: middle; }
  .glyphicon:before {
    position: relative;
    top: -1px;
    margin-right: 0.5em; }

.bg-color-gray {
  background-color: #efefef; }

.bg-success {
  margin-top: 1em; }

.hasBottomMenu {
  padding-bottom: 4em; }
  @media (min-width: 768px) {
    .hasBottomMenu {
      padding-bottom: 1em; } }

.btn {
  padding: 0 2.5em;
  font-size: 1em;
  height: 2.5em;
  line-height: 2.5em;
  display: inline-block;
  -webkit-border-radius: 0;
  border-radius: 0;
  background-clip: padding-box;
  -webkit-transition: 0.3s all ease-in;
  -moz-transition: 0.3s all ease-in;
  -o-transition: 0.3s all ease-in;
  transition: 0.3s all ease-in;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: 0;
  border: 0;
  cursor: pointer; }

.btn-sm {
  display: inline-block;
  padding: 0 8px;
  font-size: 0.875em;
  height: 30px;
  line-height: 30px;
  color: #666;
  letter-spacing: 1px;
  font-weight: 500; }

.btn-border-radius {
  border: 1px solid #dfdfdf;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  background-clip: padding-box; }

.btn-primary {
  color: #fff;
  background-color: #89b528; }
  .btn-primary:hover, .btn-primary:focus, .btn-primary:active:hover {
    background-color: #9ad127; }

.btn-default {
  color: #89b528;
  background-color: transparent;
  border: 1px solid #89b528; }
  .btn-default:hover, .btn-default:focus, .btn-default:active:hover {
    border: 1px solid #89b528;
    color: #89b528;
    background-color: #f8fde9; }

.btn-disabled {
  color: #666;
  background-color: #ddd; }
  .btn-disabled:hover, .btn-disabledfocus {
    color: #666;
    background-color: #ddd; }

.btn-radius {
  -webkit-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box; }

@media (max-width: 767px) {
  .btn-more.visible-xs {
    display: inline-block !important;
    width: 120px;
    padding: 0; } }

.btn-groups > * {
  margin-bottom: 1em; }
  @media (min-width: 768px) {
    .btn-groups > * {
      margin-right: 2em; } }

.btn-no-border {
  border: 0; }
  .btn-no-border:hover, .btn-no-border:focus {
    border: 0;
    background-color: transparent; }

.formWrap {
  margin-top: 3em; }

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #959595;
  font-weight: 400; }

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #959595;
  font-weight: 400; }

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #959595;
  font-weight: 400; }

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #959595;
  font-weight: 400; }

.count {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }
  .count .input-group {
    float: right;
    margin-top: 62px; }
  .count .input-group-addon {
    display: inline-block;
    -webkit-border-radius: 0;
    border-radius: 0;
    background-clip: padding-box;
    background-color: #fff;
    width: 40px;
    height: 40px;
    cursor: pointer;
    outline: 0; }
    .count .input-group-addon:hover {
      background-color: #efefef; }
    .count .input-group-addon:focus {
      background-color: input, textarea; }
  .count input[type=text] {
    text-align: right;
    height: 40px;
    padding-right: 16px;
    color: #868686; }
  .count .input-group-addon, .count input[type=text] {
    float: left; }

i.icon.icon-minus {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 0 50%;
  background-image: url("../images/minus.svg");
  width: 18px;
  height: 18px;
  background-size: 18px 18px;
  position: relative;
  top: 4px; }

i.icon.icon-add {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 0 50%;
  background-image: url("../images/plus.svg");
  width: 18px;
  height: 18px;
  background-size: 18px 18px;
  position: relative;
  top: 3px; }

.input-lg {
  padding: 0.75em;
  -webkit-border-radius: 0;
  border-radius: 0;
  background-clip: padding-box; }

.user-selection {
  position: relative; }

.selectionWrap {
  width: 160px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #fff;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  background-clip: padding-box; }
  .selectionWrap > input {
    font-size: 0.875em;
    cursor: pointer;
    pointer-events: none;
    width: 120px;
    height: 40px;
    line-height: 40px;
    padding-left: 16px;
    padding-right: 30px;
    vertical-align: top;
    border: 0;
    outline: none;
    background-color: transparent;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }

.ntsu-switcher {
  position: relative;
  width: 45px;
  height: 18px;
  line-height: 18px;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  -webkit-border-radius: 9px;
  border-radius: 9px;
  background-clip: padding-box;
  -webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.06);
  -moz-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.06);
  -ms-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.06);
  box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.06);
  background-color: #9b9b9b; }
  .ntsu-switcher.active {
    background-color: #fff0cd;
    -webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.23);
    -moz-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.23);
    -ms-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.23);
    box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.23); }

.ntsu-switcher label {
  cursor: pointer;
  position: absolute;
  height: 26px;
  width: 26px;
  left: -2px;
  top: -5px;
  background: #dfdfdf;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background-clip: padding-box;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  -webkit-box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  -moz-box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  -ms-box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  z-index: 5; }
  .ntsu-switcher label:after {
    content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-position: 0 50%;
    background-image: url("../images/icon-close-white.svg");
    width: 22px;
    height: 22px;
    background-size: 22px 22px;
    position: absolute;
    top: 2px;
    left: 2px; }

.ntsu-switcher input[type=checkbox]:checked + label {
  left: 21px;
  background: #f9ba29;
  -webkit-box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  -moz-box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  -ms-box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18);
  box-shadow: 0.5px 1px 2px 0 rgba(0, 0, 0, 0.18); }
  .ntsu-switcher input[type=checkbox]:checked + label:after {
    top: 3px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-position: 0 50%;
    background-image: url("../images/icon-checked-white.svg");
    width: 22px;
    height: 22px;
    background-size: 22px 22px; }

.ntsu-form-control {
  margin-top: 0.5em;
  margin-bottom: 0.875em; }
  .ntsu-form-control span.title {
    font-size: 1em;
    font-weight: bold;
    color: #666;
    letter-spacing: 1px;
    position: relative;
    top: -3px; }

.ntsu-input-unit {
  font-size: 0.75em;
  color: #9b9b9b; }

.ntsu-input.ntsu-input-lg {
  margin-right: 0.25em;
  display: inline-block;
  padding: 0 0.2em;
  width: 108px;
  height: 60px;
  line-height: 60px;
  font-size: 3em;
  color: #89b528;
  border: 0;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-clip: padding-box;
  background-color: #f6f6f6; }

.ntsu-label {
  margin-bottom: 0.5em;
  font-size: 1.125em;
  letter-spacing: 1px;
  color: #666; }

.ntsu-radio {
  cursor: pointer;
  margin-right: 0.5em;
  display: inline-block;
  width: 20px;
  height: 20px;
  border: solid 3px #666666;
  background-color: #fff;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background-clip: padding-box; }
  .ntsu-radio:after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px; }

.ntsu-checkbox {
  margin-right: 1em;
  margin-bottom: 0.5em;
  display: inline-block;
  height: 18px;
  line-height: 18px; }
  .ntsu-checkbox > * {
    vertical-align: middle; }
  .ntsu-checkbox label {
    width: 18px;
    height: 18px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-clip: padding-box;
    border: 1px solid #666;
    cursor: pointer; }
  .ntsu-checkbox input:checked + label {
    background-image: url("../images/icon-checked-pink.svg");
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: 50% 50%; }
  .ntsu-checkbox span {
    margin-left: 0.25em;
    display: inline-block;
    height: 18px;
    line-height: 18px;
    font-size: 0.875em;
    color: #666; }

.input-shadow-style {
  border: none !important;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.08);
  -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.08);
  -ms-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.08); }

input:checked + .ntsu-radio {
  border: solid 3px #89b528; }
  input:checked + .ntsu-radio:after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #89b528;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-clip: padding-box;
    position: relative;
    top: -4px;
    left: 2px; }
    @media (min-width: 1200px) {
      input:checked + .ntsu-radio:after {
        top: -5px; } }

.ntsu-input-sm {
  padding: 0.5em;
  width: 150px;
  height: 30px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-clip: padding-box;
  background-color: #f4f4f4;
  font-size: 0.875em;
  color: #666;
  border: 0; }

.ntsu-input, .ntsu-textarea, select, select.form-control {
  display: inline-block;
  background-color: #fff;
  z-index: 1;
  padding: 0 1em;
  height: 44px;
  border: solid 1px #dfdfdf;
  border-radius: 2px;
  cursor: pointer;
  font-size: 1em;
  color: #666;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  box-shadow: none; }

.ntsu-textarea {
  height: auto; }

.ntsu-select {
  position: relative;
  display: block;
  width: 100%;
  color: #666;
  vertical-align: middle;
  text-align: left;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  font-size: 0.875em; }
  .ntsu-select .placeholder {
    position: relative;
    display: block;
    background-color: #fff;
    z-index: 1;
    padding: 0.813em 1.563em;
    border: solid 1px #dfdfdf;
    border-radius: 2px;
    cursor: pointer;
    height: 44px; }
    .ntsu-select .placeholder:hover, .ntsu-select .placeholder:focus {
      background-color: #f6f6f6;
      border: solid 1px #dfdfdf; }
    .ntsu-select .placeholder:after {
      position: absolute;
      right: 1em;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
      font-family: 'FontAwesome';
      display: inline-block;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: cover;
      background-position: 0 50%;
      background-image: url("../images/icon-arrowDown-gray.svg");
      width: 16px;
      height: 16px;
      background-size: 16px 16px;
      content: "";
      z-index: 10; }
  .ntsu-select.is-open .placeholder {
    background-color: #f6f6f6; }
  .ntsu-select.is-open .placeholder:after {
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-position: 0 50%;
    background-image: url("../images/icon-arrowDown-gray.svg");
    width: 16px;
    height: 16px;
    background-size: 16px 16px; }
  .ntsu-select.is-open ul {
    display: block; }
  .ntsu-select.select--white .placeholder {
    background: #fff;
    color: #999; }
    .ntsu-select.select--white .placeholder:hover, .ntsu-select.select--white .placeholder:focus {
      background: #fafafa; }
  .ntsu-select ul {
    display: none;
    position: absolute;
    width: 100%;
    max-height: 133px;
    overflow-y: scroll;
    background: #fff;
    border-radius: 2px;
    top: 100%;
    left: 0;
    list-style: none;
    margin: 5px 0 0 0;
    padding: 0.5em 0;
    z-index: 100;
    -webkit-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.15); }
    .ntsu-select ul li {
      display: block;
      text-align: left;
      padding: 0.375em 1.563em;
      color: #999;
      cursor: pointer; }
      .ntsu-select ul li:hover, .ntsu-select ul li:focus {
        background: #f4f4f4; }

.heading {
  margin-bottom: 1em; }
  .heading .title {
    color: #688f16;
    font-weight: bold; }
    .heading .title .title-en {
      font-size: 1.25em;
      text-transform: uppercase; }
      @media (min-width: 1200px) {
        .heading .title .title-en {
          font-size: 1.875em; } }
    .heading .title .title-tw {
      font-size: 1.2em; }
      @media (min-width: 1200px) {
        .heading .title .title-tw {
          font-size: 1.875em; } }

@media (min-width: 768px) {
  .heading-el-inline > .title {
    float: left; }
  .heading-el-inline > .btn {
    float: right; } }

@media (min-width: 1200px) {
  .heading {
    margin-bottom: 1.5em; } }

.title-divider {
  margin: 0 0.5em;
  display: inline-block;
  background-color: #688f16;
  width: 1px;
  height: 1em; }
  @media (min-width: 1200px) {
    .title-divider {
      margin: 0 1em;
      height: 1.5em; } }

.banner {
  position: relative;
  background-color: #ddd; }
  .banner .heading {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 26%; }
    @media (min-width: 1023px) {
      .banner .heading {
        top: 50%; } }
    .banner .heading .title > * {
      color: #fff;
      text-shadow: 0 0 5px #000; }
      @media (min-width: 768px) {
        .banner .heading .title > * {
          font-size: 1.875em; } }
      @media (min-width: 1200px) {
        .banner .heading .title > * {
          font-size: 2.5em; } }

.DR {
  cursor: pointer; }

.DR + * {
  display: none;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transition: 0.3s all ease-in;
  -moz-transition: 0.3s all ease-in;
  -o-transition: 0.3s all ease-in;
  transition: 0.3s all ease-in; }

.DR.active + * {
  display: block;
  position: absolute;
  width: auto;
  height: auto;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  z-index: 10; }

.dropBoxWrap {
  -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2);
  background-color: #FFFFFF;
  z-index: 10; }

.searchWrap {
  margin: 1em 0; }
  .searchWrap .searchInput-outer {
    padding: 0 20px;
    height: 40px;
    -webkit-border-radius: 25px;
    border-radius: 25px;
    background-clip: padding-box;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 5, 0.15);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 5, 0.15);
    -ms-box-shadow: 0 0 10px rgba(0, 0, 5, 0.15);
    box-shadow: 0 0 10px rgba(0, 0, 5, 0.15);
    background-color: #fff;
    background-color: rgba(255, 255, 255, 0.85); }
    .searchWrap .searchInput-outer > * {
      outline: 0;
      display: inline-block; }
    .searchWrap .searchInput-outer .searchInput {
      width: calc(100% - 32px);
      background-color: transparent;
      border: 0;
      height: 40px;
      line-height: 40px;
      vertical-align: top;
      font-size: 1em; }
      @media (min-width: 768px) {
        .searchWrap .searchInput-outer .searchInput {
          width: calc(100% - 30px); } }
    .searchWrap .searchInput-outer .searchBtn {
      padding: 0;
      width: 16px;
      height: 34px;
      font-size: 0;
      border: 0;
      background-color: transparent;
      display: inline-block;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: cover;
      background-position: 0 50%;
      background-image: url("../images/icon-search.png");
      width: 26px;
      height: 26px;
      background-size: 26px 26px;
      height: 40px;
      vertical-align: middle; }

@media (min-width: 768px) {
  .searchWrap {
    width: 250px; } }

.paginationWrap {
  margin-top: 1.5em;
  display: inline-block;
  height: 30px;
  line-height: 30px; }
  .paginationWrap > * {
    vertical-align: middle; }
  .paginationWrap .prev {
    margin-right: 0.875em; }
  .paginationWrap .next {
    margin-left: 0.875em; }
  .paginationWrap .prev > i, .paginationWrap .next > i {
    vertical-align: middle; }
  .paginationWrap .pages {
    vertical-align: middle; }
    .paginationWrap .pages > a {
      display: inline-block;
      cursor: pointer;
      width: 30px;
      height: 30px;
      line-height: 30px;
      -webkit-border-radius: 15px;
      border-radius: 15px;
      background-clip: padding-box;
      background: #fff;
      color: #666; }
    .paginationWrap .pages > a.disabled {
      background-color: #ececec; }

@media (min-width: 1200px) {
  margin-bottom: 3em; }

.pagination > li > a, .pagination > li > span {
  color: #999; }

.pagination > li > a:hover, .pagination > li > span:focus {
  color: #666;
  background-color: #f1f5ea; }

.toggleNews {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 8; }
  .toggleNews .toggle-btn {
    cursor: pointer;
    width: 150px;
    height: 32px;
    text-align: center;
    color: #fff;
    background-color: #7eb023;
    -webkit-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    background-clip: padding-box; }
    .toggleNews .toggle-btn span {
      display: inline-block;
      line-height: 32px;
      height: 32px;
      font-weight: bold;
      font-size: 0.875em; }
    .toggleNews .toggle-btn .btn-toggle-newsBk {
      margin-right: 0.5em;
      position: relative;
      top: 6px;
      -webkit-transform: rotate(-90deg);
      -moz-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg); }
    .toggleNews .toggle-btn.opened .btn-toggle-newsBk {
      -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg); }
  .toggleNews .contentWrap.opened {
    padding: 1em;
    height: 155px; }
    .toggleNews .contentWrap.opened .title, .toggleNews .contentWrap.opened .date, .toggleNews .contentWrap.opened .description, .toggleNews .contentWrap.opened .readmore {
      display: block;
      width: 100%; }
    .toggleNews .contentWrap.opened .news-slider .slick-dots {
      display: block !important;
      bottom: 0; }
      .toggleNews .contentWrap.opened .news-slider .slick-dots li {
        margin: 0 3px; }
      .toggleNews .contentWrap.opened .news-slider .slick-dots li button:before {
        width: 10px;
        height: 10px; }
  .toggleNews .contentWrap {
    -webkit-transition: 0.3s height ease;
    -moz-transition: 0.3s height ease;
    -o-transition: 0.3s height ease;
    transition: 0.3s height ease;
    height: 0;
    color: #ffffff;
    background-color: rgba(0, 0, 0, 0.7);
    word-break: break-all; }
    .toggleNews .contentWrap .loading-img {
      display: none; }
    .toggleNews .contentWrap .news-slider .slick-dots {
      display: none !important; }
    .toggleNews .contentWrap .title, .toggleNews .contentWrap .date, .toggleNews .contentWrap .description, .toggleNews .contentWrap .readmore {
      display: none; }
    .toggleNews .contentWrap .title {
      display: none;
      margin-bottom: 0.375em;
      font-size: 0.875em;
      font-weight: bold;
      white-space: nowrap;
      overflow: hidden;
      -o-text-overflow: ellipsis;
      text-overflow: ellipsis; }
    .toggleNews .contentWrap .date {
      margin-bottom: 0.25em;
      color: #abe1a1;
      font-size: 0.75em; }
    .toggleNews .contentWrap .description a {
      color: #ddd;
      font-size: 0.813em;
      line-height: 1.75em;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;
      line-height: 1.5em;
      height: 4.5em;
      overflow: hidden; }
    .toggleNews .contentWrap .readmore {
      font-size: 0.875em;
      color: #d0e5cd;
      text-decoration: underline; }

@media (min-width: 768px) {
  .toggleNews {
    width: 320px;
    left: auto;
    bottom: 50px;
    right: -280px;
    -webkit-transition: 0.3s all ease;
    -moz-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    transition: 0.3s all ease; } }
  @media (min-width: 768px) and (min-width: 1200px) {
    .toggleNews {
      bottom: 120px; } }

@media (min-width: 768px) {
    .toggleNews > * {
      float: left; }
    .toggleNews .toggle-btn {
      width: 40px;
      height: 180px;
      -webkit-border-radius: 3px 0 0 3px;
      border-radius: 3px 0 0 3px;
      background-clip: padding-box;
      -webkit-writing-mode: vertical-lr;
      -ms-writing-mode: tb-lr;
      writing-mode: vertical-lr; }
      .toggleNews .toggle-btn .btn-toggle-newsBk {
        margin-left: 10px;
        margin-bottom: 0.5em;
        top: 0;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg); }
      .toggleNews .toggle-btn.opened .btn-toggle-newsBk {
        -webkit-transform: rotate(-180deg);
        -moz-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg); }
      .toggleNews .toggle-btn span {
        height: auto;
        letter-spacing: 5px; }
    .toggleNews .contentWrap {
      width: 0;
      height: 180px;
      -webkit-transition: 0.3s width ease;
      -moz-transition: 0.3s width ease;
      -o-transition: 0.3s width ease;
      transition: 0.3s width ease; }
      .toggleNews .contentWrap .title {
        font-size: 1em; }
    .toggleNews .contentWrap.opened {
      width: 280px;
      height: 180px; }
      .toggleNews .contentWrap.opened .news-slider .slick-dots {
        display: block !important;
        bottom: -25px; }
        .toggleNews .contentWrap.opened .news-slider .slick-dots li button:before {
          width: 10px;
          height: 10px; }
    .toggleNews.opened {
      right: 0; } }

@media (min-width: 1200px) {
  .toggleNews {
    bottom: 80px; } }

.bottom-menu {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  -webkit-box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.15);
  -ms-box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.15); }
  .bottom-menu > * {
    float: left;
    width: 25%;
    font-size: 0.875em;
    padding: 0.25em 0.25em;
    text-align: center;
    border-right: 1px solid #dfdfdf; }
    .bottom-menu > * .icon-sprite-home-entries {
      width: 46.5px;
      height: 36px;
      background-size: 322.4px 40.3px; }
    .bottom-menu > * .home-entries-icon-calendar {
      background-position: 0 0; }
    .bottom-menu > * .home-entries-icon-checklist {
      background-position: -77px 0; }
    .bottom-menu > * .home-entries-icon-user {
      background-position: -240px 0; }
    .bottom-menu > * .home-entries-icon-note {
      background-position: -157px 0; }

.tabMenu {
  margin-top: 1em;
  display: block;
  -webkit-border-radius: 0.5em;
  border-radius: 0.5em;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  overflow: hidden; }
  .tabMenu li {
    width: 50%;
    float: left; }
    .tabMenu li > a {
      padding: 0.875em 0;
      width: 100%;
      font-size: 0.875em;
      text-align: center;
      display: block;
      color: #666; }
  .tabMenu li.active a {
    background-color: #89b528;
    color: #fff; }

@media (min-width: 768px) {
  .mainWrapper .tabMenu {
    width: 400px; }
    .mainWrapper .tabMenu li > a {
      padding: 0.875em 0;
      font-size: 1em; } }

@media (min-width: 1023px) {
  .mainWrapper .tabMenu {
    width: 500px; } }

table.rwdTable {
  margin-bottom: 2rem;
  padding: 0;
  border-collapse: collapse;
  width: 100%;
  table-layout: fixed; }
  table.rwdTable tr {
    margin-bottom: 1.5em;
    padding: .35em; }
  table.rwdTable th, table.rwdTable td {
    padding: .625em;
    text-align: center; }
  table.rwdTable th {
    font-size: .85em;
    letter-spacing: .1em;
    text-transform: uppercase; }
  table.rwdTable .btn {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    width: 120px; }

@media screen and (max-width: 767px) {
  table.rwdTable {
    border: 0; }
    table.rwdTable thead {
      border: none;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px; }
    table.rwdTable tr {
      display: block;
      -webkit-border-radius: 0.5em;
      border-radius: 0.5em;
      background-clip: padding-box;
      -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
      -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
      -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
    table.rwdTable td {
      border-bottom: 1px solid #efefef;
      display: block;
      font-size: .8em;
      text-align: right; }
      table.rwdTable td::before {
        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase; }
      table.rwdTable td:last-child {
        border-bottom: 0; } }

@media (min-width: 768px) {
  table.rwdTable {
    -webkit-border-radius: 0.5em;
    border-radius: 0.5em;
    background-clip: padding-box;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
    table.rwdTable th {
      font-weight: bold;
      color: #89b528; }
    table.rwdTable th, table.rwdTable td {
      font-size: 1em;
      padding: 1em; }
    table.rwdTable tr {
      border-bottom: 1px solid #efefef; } }

.card-type-01 {
  display: block;
  margin-top: 1.25em;
  margin-bottom: 1em;
  position: relative;
  -webkit-border-radius: 0.5em;
  border-radius: 0.5em;
  background-clip: padding-box;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  -webkit-transition: 0.3s all ease;
  -moz-transition: 0.3s all ease;
  -o-transition: 0.3s all ease;
  transition: 0.3s all ease;
  overflow: hidden; }
  .card-type-01:hover, .card-type-01:focus {
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.35);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.35);
    -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.35);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.35); }
  .card-type-01 .location {
    padding: 0 0.5em;
    height: 26px;
    line-height: 26px;
    font-size: 0.875em;
    position: absolute;
    right: 8px;
    top: 8px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.7);
    -webkit-border-radius: 0.5em;
    border-radius: 0.5em;
    background-clip: padding-box; }
  .card-type-01 .image-wrap {
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover; }
  .card-type-01 .content {
    padding: 1em; }
    .card-type-01 .content .title {
      font-weight: bold;
      font-size: 1.25em;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-height: 1.5em;
      height: 3em;
      overflow: hidden; }
    .card-type-01 .content .date {
      margin-top: 0.5em;
      color: #89b528;
      font-size: 0.875em; }
    .card-type-01 .content .des {
      margin-top: 0.5em;
      font-size: 0.875em;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-height: 1.5em;
      height: 3em;
      overflow: hidden; }
    .card-type-01 .content .attendance {
      color: #999;
      margin-top: 0.5em;
      font-size: 0.875em; }
  .card-type-01 .ctrl-bk {
    margin-bottom: 1em;
    text-align: center; }
    .card-type-01 .ctrl-bk .btn {
      margin-bottom: 1em;
      width: 180px; }

@media (min-width: 768px) {
  .card-type-01 {
    margin-bottom: 1.5em; } }

.modal.in .modal-dialog,
.modal.fade .modal-dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0 auto;
  width: 90%; }
  @media (min-width: 768px) {
    .modal.in .modal-dialog,
    .modal.fade .modal-dialog {
      width: 700px; } }

.modal .modal-limited-height .modal-content {
  overflow-y: hidden; }

.modal .modal-content {
  position: static;
  -webkit-border-radius: 0;
  border-radius: 0;
  background-clip: padding-box;
  background-color: #f7f8fa; }
  @media (min-width: 768px) {
    .modal .modal-content {
      padding: 0; } }

.modal .modal-header {
  padding: 1em;
  position: relative;
  top: 0;
  left: 1px;
  z-index: 10;
  width: calc(100% - 3px);
  background-color: #eaeaea;
  overflow: hidden; }
  @media (min-width: 768px) {
    .modal .modal-header {
      padding: 1.25em 1em; } }
  .modal .modal-header h4.modal-title {
    font-weight: bold;
    font-size: 1.25em; }

.modal .modal-body {
  padding-top: 2em;
  padding-bottom: 2em;
  max-height: calc(100vh - 246px);
  overflow-y: auto; }
  @media (min-width: 768px) {
    .modal .modal-body {
      max-height: calc(100vh - 342px); } }
  .modal .modal-body .heading {
    margin-bottom: 1em;
    font-size: 1.125em;
    font-weight: bold; }
  .modal .modal-body .inlineItem {
    margin-bottom: 0.5em; }
  .modal .modal-body .ntsu-form-control {
    margin-bottom: 1em; }
  .modal .modal-body label {
    font-size: 1em; }
  .modal .modal-body input {
    width: 100%; }
  .modal .modal-body .birth label {
    display: block; }
  .modal .modal-body .birth select {
    width: 100%/3; }
  .modal .modal-body .select-address label {
    display: block; }
  .modal .modal-body .note {
    width: 100%;
    display: block;
    color: red; }

.modal .modal-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  width: calc(100% - 2px);
  height: 73px;
  z-index: 10;
  background-color: #fff;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  -ms-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); }
  .modal .modal-footer .goToLogin, .modal .modal-footer .goToRegister {
    padding-top: 0.7em;
    float: left;
    font-size: 0.875em; }
    .modal .modal-footer .goToLogin a, .modal .modal-footer .goToRegister a {
      margin-left: 0.25em;
      color: #89b528; }
  .modal .modal-footer .btn {
    float: right;
    width: auto;
    padding: 0 1.5em; }
  .modal .modal-footer label span {
    margin-left: 0.5em;
    font-size: 1em; }
  .modal .modal-footer .ctrl-bk.inline .btn:first-child {
    margin-right: 1.5em; }

.modal-limited-height .modal-content {
  height: 80vh; }

@media (min-width: 768px) {
  .modal-systemMsg .modal-dialog {
    width: 450px !important; } }

.modal-systemMsg .modal-footer {
  text-align: center; }
  .modal-systemMsg .modal-footer .ctrl-bk {
    display: inline-block; }
    .modal-systemMsg .modal-footer .ctrl-bk .btn {
      border: 1px solid #89b528;
      padding: 0 0.75em;
      height: auto; }
      @media (min-width: 768px) {
        .modal-systemMsg .modal-footer .ctrl-bk .btn {
          padding: 0 1.75em; } }
    .modal-systemMsg .modal-footer .ctrl-bk .btn:last-child {
      margin-right: 1em; }
      @media (min-width: 768px) {
        .modal-systemMsg .modal-footer .ctrl-bk .btn:last-child {
          margin-right: 1em; } }

.linkToPrivacyPolicy {
  padding-top: 10px;
  display: block;
  font-size: 0.875em;
  color: #89b528;
  text-decoration: underline; }
  .linkToPrivacyPolicy:hover {
    color: #9ad127; }

.welcomeUser {
  margin-bottom: 1.5em;
  padding-left: 1.5em;
  display: block;
  height: 20px;
  color: #666; }
  @media (min-width: 768px) {
    .welcomeUser {
      display: inline-block;
      color: #d0e5cd; } }

#modal-login .modal-body {
  height: 320px; }

.qaForm {
  margin: 1em -0.25em; }
  .qaForm .form-info-display {
    padding: 1.75rem; }
    .qaForm .form-info-display .formName {
      margin-bottom: 0.5rem; }
    .qaForm .form-info-display .title, .qaForm .form-info-display .content {
      display: block; }
    .qaForm .form-info-display .content {
      margin-bottom: 0.5em;
      font-size: 1.125em;
      font-weight: bold;
      color: #89b528; }
    .qaForm .form-info-display .bottom {
      padding-top: 1rem; }
  .qaForm .timeDisplay {
    font-size: 0.875em;
    color: #999; }
  .qaForm .ctrl-bk {
    margin-top: 1.5em; }
  .qaForm .qa-title {
    margin-top: 0.75em;
    margin-bottom: 0.5em;
    font-size: 1.125em;
    line-height: 1.5;
    font-weight: bold; }
  .qaForm .form-group {
    font-size: 1.125em; }
  .qaForm .radio-inline {
    display: block;
    margin-left: 0; }
  .qaForm textarea {
    margin-top: 0.5em; }

@media (min-width: 768px) {
  .qaForm {
    margin: 2em 0; }
    .qaForm .form-info-display .formName {
      float: left; }
    .qaForm .form-info-display .formID {
      float: right;
      text-align: right;
      line-height: 2.2; }
    .qaForm .form-info-display .title, .qaForm .form-info-display .content {
      margin: 0;
      display: inline-block; }
    .qaForm .form-info-display .content {
      margin-bottom: 0;
      position: relative;
      top: 2px; }
    .qaForm .inline-form .qa-title {
      margin-top: 0; }
    .qaForm .radio-inline {
      display: inline-block;
      margin-right: 1em; }
    .qaForm .btn-back {
      float: right; }
    .qaForm .ctrl-bk.btn-groups > * {
      float: right; }
    .qaForm .ctrl-bk.btn-groups .btn-primary {
      margin-right: 0; } }

.editor-content {
  margin: 2em  0;
  font-size: 1em;
  line-height: 1.5; }

@media (max-width: 767px) {
  header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999; } }

header {
  display: block;
  height: 65px;
  color: #d0e5cd;
  background-color: #fff;
  -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  -ms-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.15); }
  header a {
    color: #d0e5cd; }
    header a:hover, header a:focus {
      color: #e0f8dd; }
  header .nav > * {
    height: 65px;
    line-height: 65px; }
  header .logo {
    margin-top: 4px;
    float: left;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-position: 0 50%;
    background-image: url("../images/logo.svg");
    width: 157.25px;
    height: 55.25px;
    background-size: 157.25px 55.25px; }
  header .toggleBtn-mmenu {
    cursor: pointer;
    float: right;
    display: inline-block; }
    header .toggleBtn-mmenu .icon-mmenu {
      height: 64px; }
  header .toggleBtn-mmenu.collapsed .icon-mmenu {
    background-image: url(../images/icon-mmenu-close.jpg); }
  header .collapse-bk {
    width: 100%;
    display: none;
    position: absolute;
    top: 65px;
    left: 0;
    z-index: 99;
    background-color: #fff; }
    header .collapse-bk.collapsed {
      padding-bottom: 1em;
      display: block;
      height: auto;
      -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
      -moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
      -ms-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
      box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2); }
      header .collapse-bk.collapsed ul.inline li {
        padding: 0.5em 1.5em;
        display: block;
        height: auto;
        line-height: 28px;
        border-bottom: 1px solid #dfdfdf; }
        header .collapse-bk.collapsed ul.inline li a {
          color: #666; }
      header .collapse-bk.collapsed .right-side .btn-register {
        padding: 0.5em 1.5em;
        display: block;
        height: auto;
        color: #666;
        line-height: 28px;
        border-bottom: 1px solid #dfdfdf; }
      header .collapse-bk.collapsed .right-side .btn-login {
        margin-top: 0.75em;
        margin-left: 1.5em; }

@media (min-width: 768px) {
  header {
    height: 44px;
    color: #d0e5cd;
    background-color: #3f5524; }
    header .nav-items ul > li {
      margin-right: 1.5em; }
    header .nav-items > * {
      height: 44px;
      line-height: 44px; }
    header .nav-items .left-side {
      float: left; }
      header .nav-items .left-side li a {
        font-size: 0.875rem; }
    header .nav-items .right-side {
      float: right; }
      header .nav-items .right-side .btn-register {
        margin-right: 1em;
        color: #fff;
        font-size: 0.875rem; }
      header .nav-items .right-side .btn-login {
        margin-left: 1.5em;
        padding: 0;
        font-size: 0.875rem;
        width: 80px;
        height: 30px;
        line-height: 30px;
        text-align: center;
        color: #ffffff;
        position: relative;
        top: -1px; }
      header .nav-items .right-side .welcomeUser {
        font-size: 0.875rem; }
    header .collapse-bk {
      display: block;
      background: transparent;
      position: relative;
      top: 0; } }

#navigator_inside {
  position: relative;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  padding: 0.25em 0.5em;
  background-color: white;
  -webkit-transition: 0.3s all ease;
  -moz-transition: 0.3s all ease;
  -o-transition: 0.3s all ease;
  transition: 0.3s all ease;
  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
  -ms-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); }
  #navigator_inside.fixed {
    position: fixed;
    top: 0;
    background-color: white;
    -webkit-box-shadow: 0 1px 16px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 1px 16px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 1px 16px rgba(0, 0, 0, 0.5);
    box-shadow: 0 1px 16px rgba(0, 0, 0, 0.5); }
    @media (min-width: 1023px) {
      #navigator_inside.fixed .logo {
        margin-left: 0;
        display: inline-block;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: cover;
        background-position: 0 50%;
        background-image: url("../images/logo.svg");
        width: 185px;
        height: 65px;
        background-size: 185px 65px; } }
    @media (min-width: 1023px) {
      #navigator_inside.fixed .nav-item .entries-btn-outer {
        margin-top: 13px; } }
  #navigator_inside .logo {
    margin-top: 4px;
    float: left; }
    @media (min-width: 768px) {
      #navigator_inside .logo {
        margin-left: -0.5em;
        display: inline-block;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: cover;
        background-position: 0 50%;
        background-image: url("../images/logo.svg");
        width: 166.5px;
        height: 58.5px;
        background-size: 166.5px 58.5px; } }
    @media (min-width: 1023px) {
      #navigator_inside .logo {
        margin-top: 0;
        margin-left: 0;
        display: inline-block;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: cover;
        background-position: 0 50%;
        background-image: url("../images/logo.svg");
        width: 185px;
        height: 65px;
        background-size: 185px 65px; } }
  #navigator_inside .nav-item {
    float: right; }
    #navigator_inside .nav-item > * {
      float: left; }
    #navigator_inside .nav-item .entries-btn-outer {
      margin-top: 0.75em; }
      @media (min-width: 1023px) {
        #navigator_inside .nav-item .entries-btn-outer {
          margin-top: 13px; } }
      #navigator_inside .nav-item .entries-btn-outer > a {
        display: inline-block;
        margin: 0 0.25em; }
        @media (min-width: 1023px) {
          #navigator_inside .nav-item .entries-btn-outer > a {
            margin-left: 1.5em; } }
      #navigator_inside .nav-item .entries-btn-outer > a.current .text {
        color: #739b27; }
      #navigator_inside .nav-item .entries-btn-outer > a:hover .text {
        color: #739b27; }
      #navigator_inside .nav-item .entries-btn-outer > a > * {
        float: left;
        height: 40px;
        line-height: 40px; }
    #navigator_inside .nav-item .icon-sprite-home-entries {
      width: 46.5px;
      height: 36px;
      background-size: 322.4px 40.3px; }
    #navigator_inside .nav-item .home-entries-icon-calendar {
      background-position: 0 0; }
    #navigator_inside .nav-item .home-entries-icon-checklist {
      background-position: -77px 0; }
    #navigator_inside .nav-item .home-entries-icon-user {
      background-position: -240px 0; }
    #navigator_inside .nav-item .home-entries-icon-note {
      background-position: -157px 0; }

#footer {
  padding: 1em 0;
  background-color: #fff; }
  #footer .footer-logo {
    margin-bottom: 0.5em;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-position: 0 50%;
    background-image: url("../images/logo.svg");
    width: 138.75px;
    height: 48.75px;
    background-size: 138.75px 48.75px; }
  #footer .footer-info {
    font-size: 0.813em; }
    #footer .footer-info ul > li {
      margin-bottom: 0.5em;
      color: #666; }

@media (min-width: 768px) {
  #footer {
    padding-bottom: 1em;
    border-top: 1px solid #efefef;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-image: url(../images/bg-footer.jpg); }
    #footer .footer-logo {
      margin-bottom: 0.5em;
      display: inline-block;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: cover;
      background-position: 0 50%;
      background-image: url("../images/logo.svg");
      width: 185px;
      height: 65px;
      background-size: 185px 65px; }
    #footer .left-side {
      float: left; }
    #footer .right-side {
      padding-top: 0.5em;
      float: right;
      text-align: right; } }

.hero {
  position: relative;
  padding-bottom: 58vw;
  overflow: hidden; }
  @media (min-width: 768px) {
    .hero {
      padding-bottom: 0; } }
  .hero .container {
    position: relative; }
    @media (min-width: 768px) {
      .hero .container {
        padding-bottom: 40vw; } }
    @media (min-width: 1023px) {
      .hero .container {
        padding-bottom: 41vw; } }
    @media (min-width: 1200px) {
      .hero .container {
        padding-bottom: 740px; } }
  .hero .slide {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding-bottom: 58vw;
    background-color: #ddd;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    background-position: 50% 0; }
    @media (min-width: 768px) {
      .hero .slide {
        padding-bottom: 40vw; } }
    @media (min-width: 1023px) {
      .hero .slide {
        padding-bottom: 41vw; } }
    @media (min-width: 1200px) {
      .hero .slide {
        padding-bottom: 740px; } }

@media (min-width: 768px) {
  .hero .logo-for-pc {
    position: absolute;
    top: 15px;
    left: 25px;
    display: inline-block;
    width: 210.75px;
    height: 62.25px;
    background-image: url(../images/logo.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover; } }
  @media (min-width: 768px) and (min-width: 1200px) {
    .hero .logo-for-pc {
      width: 281px;
      height: 83px; } }

@media (min-width: 1200px) {
  .hero .logo-for-pc {
    left: 0; } }

.home-entries-for-pc {
  position: absolute;
  bottom: 60px;
  left: 0;
  width: 275px; }
  .home-entries-for-pc > * {
    float: left;
    width: 50%;
    padding: 0.125em; }
  .home-entries-for-pc .entries-btn {
    padding: 1em;
    display: block;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.95);
    font-size: 1.125em;
    -webkit-transition: 0.1s all ease-in;
    -moz-transition: 0.1s all ease-in;
    -o-transition: 0.1s all ease-in;
    transition: 0.1s all ease-in; }
    .home-entries-for-pc .entries-btn:hover, .home-entries-for-pc .entries-btn:focus {
      color: #fff;
      background-color: #89b528; }
      .home-entries-for-pc .entries-btn:hover .home-entries-icon-calendar, .home-entries-for-pc .entries-btn:focus .home-entries-icon-calendar {
        background-position: -62px 0; }
      .home-entries-for-pc .entries-btn:hover .home-entries-icon-checklist, .home-entries-for-pc .entries-btn:focus .home-entries-icon-checklist {
        background-position: -186px 0; }
      .home-entries-for-pc .entries-btn:hover .home-entries-icon-note, .home-entries-for-pc .entries-btn:focus .home-entries-icon-note {
        background-position: -310px 0; }
      .home-entries-for-pc .entries-btn:hover .home-entries-icon-user, .home-entries-for-pc .entries-btn:focus .home-entries-icon-user {
        background-position: -434px 0; }

.home-entries-for-mobile {
  background-color: #fff; }
  .home-entries-for-mobile > .entries-btn {
    cursor: pointer;
    display: inline-block;
    padding: 1em 0;
    width: 50%;
    float: left;
    border: 1px solid #efefef; }
    .home-entries-for-mobile > .entries-btn .icon, .home-entries-for-mobile > .entries-btn .text {
      text-align: center; }
    .home-entries-for-mobile > .entries-btn .text {
      font-size: 0.875em; }
  @media (min-width: 768px) {
    .home-entries-for-mobile > .entries-btn {
      width: 25%; } }

#new-events {
  padding: 1.5em 0;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 0 0;
  background-image: url(../images/bg-home-event.jpg); }
  #new-events .events-slider {
    margin-bottom: 2em; }
    #new-events .events-slider .slick-list {
      padding: 0 15% 0 0; }
    #new-events .events-slider .slick-dots {
      bottom: -20px; }
      #new-events .events-slider .slick-dots li.slick-active button:before {
        background-color: #89b528; }
      #new-events .events-slider .slick-dots li button:before {
        border-color: #89b528; }
  #new-events .event-outer {
    padding: 0.375em; }
  #new-events .event {
    display: block;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #dfdfdf; }
    #new-events .event .image-wrap {
      background-color: #dfdfdf;
      padding-bottom: 55vw;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: cover; }
    #new-events .event .content {
      padding: 1.5em 1em; }
    #new-events .event .title {
      font-size: 1.125em;
      font-weight: bold;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-height: 1.5em;
      height: 3em;
      overflow: hidden; }
    #new-events .event .description {
      margin-top: 0.25em;
      font-size: 0.875em;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-height: 1.5em;
      height: 3em;
      overflow: hidden; }
    #new-events .event .date {
      margin-top: 0.5em;
      color: #7eb023;
      font-size: 0.875em; }

@media (min-width: 768px) {
  #new-events .events-slider {
    margin-bottom: 1.5em; }
    #new-events .events-slider .slick-list {
      padding: 0; }
    #new-events .events-slider .slick-dots {
      bottom: -20px; }
  #new-events .event .image-wrap {
    padding-bottom: 18vw; } }

@media (min-width: 1200px) {
  #new-events {
    padding: 2.5em 0; }
    #new-events .events-slider {
      margin-bottom: 1.5em; }
      #new-events .events-slider .slick-list {
        padding: 0; }
      #new-events .events-slider .slick-dots {
        bottom: -30px; }
    #new-events .event .image-wrap {
      padding-bottom: 220px; } }

#events-gallery {
  padding: 1.5em 0;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-position: 58% 7%;
  background-image: url(../images/bg-home-news.jpg); }
  #events-gallery .gallery {
    margin-bottom: 1em;
    position: relative;
    display: block; }
    #events-gallery .gallery .mask {
      width: 100%;
      position: absolute;
      left: 0;
      bottom: 0;
      background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 90%);
      background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 90%);
      background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 90%);
      background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 90%);
      background: -webkit-gradient(linear, left bottom, left top, color-stop(20%, rgba(0, 0, 0, 0.75)), color-stop(90%, rgba(0, 0, 0, 0)));
      background: linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 90%);
      padding-bottom: 25vw;
      z-index: 2; }
    #events-gallery .gallery .image-wrap {
      background-color: #dfdfdf;
      padding-bottom: 55vw;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: cover; }
    #events-gallery .gallery .date {
      display: inline-block;
      color: #fff;
      padding: 0.25em 1em;
      font-size: 0.75em;
      background-color: rgba(0, 0, 0, 0.65);
      -webkit-border-radius: 15px;
      border-radius: 15px;
      background-clip: padding-box;
      position: absolute;
      top: 0.875em;
      left: 0.875em; }
    #events-gallery .gallery .content {
      padding: 0.5em;
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: 10; }
      #events-gallery .gallery .content .title {
        margin-bottom: 0.25em;
        font-size: 1em;
        color: #fff;
        font-weight: bold;
        line-height: 1.5em;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-height: 1.5em;
        height: 3em;
        overflow: hidden; }
      #events-gallery .gallery .content .description {
        font-size: 0.875em;
        color: #fff;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-height: 1.5em;
        height: 3em;
        overflow: hidden;
        display: none; }
  #events-gallery .gallery.galleryPic_02 .content .description {
    display: none; }
  #events-gallery .gallery.galleryPic_03 .description {
    display: none; }
  #events-gallery .gallery.galleryPic_04 .description {
    display: none; }

@media (min-width: 768px) {
  #events-gallery .row {
    margin-left: -0.25em;
    margin-right: -0.25em; }
  #events-gallery div[class*="col"] {
    padding-left: 0.25em;
    padding-right: 0.25em; }
  #events-gallery .heading .title {
    float: left; }
  #events-gallery .heading .btn-more {
    float: right; }
  #events-gallery .mask {
    background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 50%);
    background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 50%);
    background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 50%);
    background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 50%);
    background: -webkit-gradient(linear, left bottom, left top, color-stop(20%, rgba(0, 0, 0, 0.75)), color-stop(50%, rgba(0, 0, 0, 0)));
    background: linear-gradient(bottom, rgba(0, 0, 0, 0.75) 20%, rgba(0, 0, 0, 0) 50%); }
  #events-gallery .gallery.galleryPic_01 .image-wrap, #events-gallery .gallery.galleryPic_01 .mask {
    padding-bottom: 300px; }
  #events-gallery .gallery.galleryPic_01 .title {
    font-size: 1.25em; }
  #events-gallery .gallery.galleryPic_02 {
    margin-bottom: 0.5em; }
    #events-gallery .gallery.galleryPic_02 .image-wrap, #events-gallery .gallery.galleryPic_02 .mask {
      padding-bottom: 180px; }
    #events-gallery .gallery.galleryPic_02 .title {
      font-size: 1em; }
    #events-gallery .gallery.galleryPic_02 .content .description {
      display: none; }
  #events-gallery .gallery.galleryPic_03 .image-wrap, #events-gallery .gallery.galleryPic_03 .mask, #events-gallery .gallery.galleryPic_04 .image-wrap, #events-gallery .gallery.galleryPic_04 .mask {
    padding-bottom: 112px; }
  #events-gallery .gallery.galleryPic_03 .title, #events-gallery .gallery.galleryPic_04 .title {
    font-size: 0.875em; }
  #events-gallery .gallery .date {
    display: none; }
  #events-gallery .gallery .content {
    padding: 0.25em 0.75em; }
    #events-gallery .gallery .content .description {
      display: none; } }

@media (min-width: 1023px) {
  #events-gallery .gallery .date {
    display: block; }
  #events-gallery .gallery .content {
    padding: 0.5em 1em; }
    #events-gallery .gallery .content .description {
      display: none; }
  #events-gallery .gallery.galleryPic_01 .image-wrap, #events-gallery .gallery.galleryPic_01 .mask {
    padding-bottom: 350px; }
  #events-gallery .gallery.galleryPic_01 .title {
    font-size: 1.25em; }
  #events-gallery .gallery.galleryPic_02 {
    margin-bottom: 0.5em; }
    #events-gallery .gallery.galleryPic_02 .image-wrap, #events-gallery .gallery.galleryPic_02 .mask {
      padding-bottom: 220px; }
    #events-gallery .gallery.galleryPic_02 .title {
      font-size: 1em; }
    #events-gallery .gallery.galleryPic_02 .content .description {
      display: none; }
  #events-gallery .gallery.galleryPic_03 .image-wrap, #events-gallery .gallery.galleryPic_03 .mask, #events-gallery .gallery.galleryPic_04 .image-wrap, #events-gallery .gallery.galleryPic_04 .mask {
    padding-bottom: 122px; }
  #events-gallery .gallery.galleryPic_03 .title, #events-gallery .gallery.galleryPic_04 .title {
    font-size: 0.875em; } }

@media (min-width: 1200px) {
  #events-gallery {
    padding: 2.5em 0; }
    #events-gallery .gallery.galleryPic_01 .image-wrap, #events-gallery .gallery.galleryPic_01 .mask {
      padding-bottom: 480px; }
    #events-gallery .gallery.galleryPic_01 .title {
      font-size: 1.875em; }
    #events-gallery .gallery.galleryPic_01 .description {
      display: block; }
    #events-gallery .gallery.galleryPic_02 {
      margin-bottom: 1.25em; }
      #events-gallery .gallery.galleryPic_02 .image-wrap, #events-gallery .gallery.galleryPic_02 .mask {
        padding-bottom: 264px; }
      #events-gallery .gallery.galleryPic_02 .content {
        padding: 0.75em 1em; }
      #events-gallery .gallery.galleryPic_02 .title {
        font-size: 1.5em; }
      #events-gallery .gallery.galleryPic_02 .content .description {
        display: none; }
    #events-gallery .gallery.galleryPic_03 .image-wrap, #events-gallery .gallery.galleryPic_03 .mask, #events-gallery .gallery.galleryPic_04 .image-wrap, #events-gallery .gallery.galleryPic_04 .mask {
      padding-bottom: 196px; }
    #events-gallery .gallery.galleryPic_03 .content, #events-gallery .gallery.galleryPic_04 .content {
      padding: 1em; }
    #events-gallery .gallery.galleryPic_03 .title, #events-gallery .gallery.galleryPic_04 .title {
      font-size: 1em; }
    #events-gallery .gallery.galleryPic_03 .description, #events-gallery .gallery.galleryPic_04 .description {
      display: none; }
    #events-gallery .gallery .content {
      padding: 1.5em; } }

.banner {
  background-image: url(../images/banner-inside.jpg); }

.ntsu-table {
  margin-top: 2em;
  margin-bottom: 2em; }

@media (min-width: 768px) {
  .toolBar > * {
    float: left; }
  .toolBar .searchWrap {
    float: right;
    padding-top: 0.35em; } }

#myProfile {
  margin-bottom: 2em; }
  #myProfile .myProfile-form {
    margin-top: 1em; }
  #myProfile .ntsu-form-control {
    margin-bottom: 1.5em; }
  #myProfile .ntsu-label {
    margin-right: 0.5em;
    display: block;
    text-align: left; }
  #myProfile input {
    position: initial;
    width: 100%;
    font-size: 1em; }
  #myProfile .ntsu-radio + span {
    margin-right: 1.5em; }
  #myProfile #select-city {
    margin-right: 15px;
    float: left;
    width: 50%; }
  #myProfile #select-district {
    float: left;
    width: calc(50% - 15px); }

@media (min-width: 1023px) {
  #myProfile .myProfile-form {
    margin-top: 2em; }
  #myProfile .ntsu-label {
    display: inline-block;
    width: 120px;
    text-align: right; }
  #myProfile input {
    width: 700px; }
  #myProfile .select-address {
    width: calc(100% - 120px); }
  #myProfile #select-city, #myProfile #select-district {
    width: 150px;
    float: none; }
  #myProfile .select-address-detail {
    padding-left: 130px; }
  #myProfile .data-display {
    margin-left: 0.5em; }
  #myProfile .ctrl-bk {
    margin-top: 2em;
    padding-left: 135px; } }

@media (min-width: 1200px) {
  #myProfile {
    margin-bottom: 4em; }
    #myProfile .myProfile-form {
      margin: 2em auto;
      width: 900px; } }

.gallery-info .date .title span, .gallery-info .date .content span, .gallery-info .location .title span, .gallery-info .location .content span {
  font-size: 0.875rem; }

.img-col .img-title {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 1.125rem;
  font-weight: bold; }

.img-col .img-des {
  font-size: 0.875rem;
  line-height: 1.5; }

#modal_applyForEvent .modal-header {
  -webkit-backface-visibility: hidden; }

#modal_applyForEvent .modal-body {
  padding-bottom: 5em; }

#modal_applyForEvent .modal-footer {
  height: 112px; }
  #modal_applyForEvent .modal-footer .goToRegister {
    float: none;
    text-align: left;
    display: block; }
  #modal_applyForEvent .modal-footer .btn {
    margin-top: 8px;
    float: left; }

@media (min-width: 1023px) {
  .gallery-detail {
    padding-top: 2rem; } }

.gallery-detail .gallery-info {
  margin-bottom: 2rem; }
  .gallery-detail .gallery-info .content-box-body {
    padding-top: 1rem; }

.gallery-detail .galleryWrap {
  margin-bottom: 2rem; }

.gallery-detail .gallery-item {
  margin-bottom: 3rem; }
  .gallery-detail .gallery-item:hover .img-title, .gallery-detail .gallery-item:focus .img-title {
    color: #89b528; }
  .gallery-detail .gallery-item .image-wrap {
    overflow: hidden;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    background-clip: padding-box; }
  .gallery-detail .gallery-item .video-wrap iframe {
    width: 100%;
    max-width: 100%; }
  .gallery-detail .gallery-item .gallery-des {
    margin-top: 0.25rem; }
    .gallery-detail .gallery-item .gallery-des .img-title {
      margin-bottom: 0.25rem; }
    .gallery-detail .gallery-item .gallery-des .img-des {
      font-size: 0.875rem;
      line-height: 1.5;
      color: #666;
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-height: 1.5rem;
      height: 3rem; }
  .gallery-detail .gallery-item .btn-zoom-in {
    display: inline-block;
    width: 28px;
    height: 28px;
    background-color: rgba(0, 0, 0, 0.75);
    position: absolute;
    bottom: 0.75em;
    right: 0.75em;
    -webkit-border-radius: 0.25em;
    border-radius: 0.25em;
    background-clip: padding-box;
    border: 1px solid #666; }
    .gallery-detail .gallery-item .btn-zoom-in .glyphicon {
      position: relative;
      top: 2px;
      left: 5px;
      color: #fff; }
  .gallery-detail .gallery-item .gallery-caption-title {
    color: #FFF; }

.newsArticle {
  margin-top: 0; }
  @media (min-width: 1023px) {
    .newsArticle {
      padding-top: 2rem; } }

@media (min-width: 1023px) {
  #news-item {
    padding-top: 2rem; } }

#modal-select-membership .label-select-membership {
  margin: 2rem 2rem 2rem 0;
  cursor: pointer; }
  #modal-select-membership .label-select-membership .content-box {
    border: 2px solid #FFF; }
  #modal-select-membership .label-select-membership .content-box-body {
    padding: 1rem 4rem; }
  #modal-select-membership .label-select-membership i {
    margin-right: 1rem; }

#modal-select-membership input[name=select_membership]:checked + * {
  color: #89b528;
  border: 2px solid #89b528; }

#qaFormBgWrapper {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-attachment: fixed; }

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/* Slider */
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  width: 30px;
  height: 55px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none; }
  .slick-prev:hover, .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent; }
    .slick-prev:hover:before, .slick-prev:focus:before,
    .slick-next:hover:before,
    .slick-next:focus:before {
      opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before {
    opacity: 1; }
  .slick-prev:before,
  .slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: white;
    opacity: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }

.slick-prev {
  left: 0; }
  [dir="rtl"] .slick-prev {
    left: auto;
    right: 0; }
  .slick-prev:before {
    content: "←"; }
    [dir="rtl"] .slick-prev:before {
      content: "→"; }

.slick-next {
  right: 0; }
  [dir="rtl"] .slick-next {
    left: 0;
    right: auto; }
  .slick-next:before {
    content: "→"; }
    [dir="rtl"] .slick-next:before {
      content: "←"; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 0; }

.slick-dots {
  position: absolute;
  bottom: 1.875em;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%; }
  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 12px;
    width: 12px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; }
    .slick-dots li button {
      border: 0;
      background: transparent;
      display: block;
      height: 12px;
      width: 12px;
      outline: none;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer; }
      .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none; }
        .slick-dots li button:hover:before, .slick-dots li button:focus:before {
          opacity: 1; }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        content: "";
        width: 12px;
        height: 12px;
        line-height: 12px;
        text-align: center;
        border: 1px solid;
        border-color: #fff;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        background-clip: padding-box; }
    .slick-dots li.slick-active button:before {
      background-color: #fff;
      opacity: 1; }

@media (min-width: 768px) {
  .slick-dots {
    bottom: 25px; } }