@charset "UTF-8";
/* 修正粗體 */
@font-face {
  font-family: '微軟正黑體修正';
  unicode-range: U+7db0, U+78A7, U+7B75,U+60E0;
  /* ASCII (碧筵綰) */
  font-style: normal;
  font-weight: bold;
  src: local(Yu Gothic), local(MS Gothic);
}

/* 一般粗細的時候改回微軟正黑 */
@font-face {
  font-family: '微軟正黑體修正';
  unicode-range: U+7db0, U+78A7, U+7B75,U+60E0;
  /* ASCII (碧筵綰) */
  font-style: normal;
  font-weight: normal;
  src: local(微軟正黑體);
}

/* line 53, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h1 {
  font-size: 2.5rem;
}

/* line 55, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h1 strong {
  font-size: unset !important;
}

/* line 59, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h2 {
  font-size: 2rem;
}

/* line 61, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h2 strong {
  font-size: unset !important;
}

/* line 65, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h3 {
  font-size: 1.6rem;
}

/* line 67, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h3 strong {
  font-size: unset !important;
}

/* line 71, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h4 {
  font-size: 1.4rem;
}

/* line 73, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h4 strong {
  font-size: unset !important;
}

/* line 77, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h5 {
  font-size: 1.2rem;
}

/* line 79, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h5 strong {
  font-size: unset !important;
}

/* line 83, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h6 {
  font-size: 1rem;
}

/* line 85, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
h6 strong {
  font-size: unset !important;
}

/* line 251, app/templates/genomics_new/assets/stylesheets/template/base/_variables.scss */
.response-content {
  justify-self: auto;
}

@media print {
  /* line 3, app/assets/stylesheets/frontend_extend.css.scss */
  .orbit a[href]:after {
    content: "";
  }
  /* line 6, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window {
    display: none;
  }
  /* line 9, app/assets/stylesheets/frontend_extend.css.scss */
  a[accesskey] {
    display: none;
  }
}

@media (max-width: 767px) {
  /* line 14, app/assets/stylesheets/frontend_extend.css.scss */
  .mobile-hide {
    display: none;
  }
}

/* line 18, app/assets/stylesheets/frontend_extend.css.scss */
[data-list="plugins"] table th:first-child {
  min-width: 4em;
}

/* line 21, app/assets/stylesheets/frontend_extend.css.scss */
button.navbar-toggle:focus {
  outline: 0.3125em auto -webkit-focus-ring-color !important;
}

/* line 24, app/assets/stylesheets/frontend_extend.css.scss */
body.no_orbit_bar {
  margin-top: 0;
}

/* line 27, app/assets/stylesheets/frontend_extend.css.scss */
button.hide_sharer_button:hover , button.hide_sharer_button.hover-class {
  background: #ccc;
}

/* line 30, app/assets/stylesheets/frontend_extend.css.scss */
.row > [class*="col-"]:empty {
  display: none;
}

/* line 33, app/assets/stylesheets/frontend_extend.css.scss */
.hide_sharer_button {
  border: none;
  width: 1.6em;
  font-size: 2em;
  padding-left: 0.4em;
  background: #fff;
}

/* line 40, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window.right .hide_sharer_button {
  float: right;
}

/* line 43, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window.left .hide_sharer_button {
  float: left;
}

@media (min-width: 1151px) {
  /* line 47, app/assets/stylesheets/frontend_extend.css.scss */
  .hide_sharer_button span.fa-angle-right.show_fa:before {
    content: "\f104";
  }
  /* line 50, app/assets/stylesheets/frontend_extend.css.scss */
  .hide_sharer_button span.fa-angle-left.show_fa:before {
    content: "\f105";
  }
  /* line 53, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.right div {
    position: relative;
    transition: all 0.5s ease-in-out;
    right: 0;
  }
  /* line 58, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.left div {
    position: relative;
    transition: all 0.5s ease-in-out;
    left: 0;
  }
  /* line 63, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.right .hide_sharers {
    position: relative;
    right: -3.2em;
    transition: all 0.5s ease-in-out;
  }
  /* line 68, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.left .hide_sharers {
    position: relative;
    left: -3.2em;
    transition: all 0.5s ease-in-out;
  }
}

@media (max-width: 1150px) {
  /* line 75, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .hide_sharer_button, .modules-menu .hide_sharer_button {
    display: none;
  }
}

/* line 79, app/assets/stylesheets/frontend_extend.css.scss */
.ui-tooltip-content {
  overflow-wrap: break-word;
}

/* line 82, app/assets/stylesheets/frontend_extend.css.scss */
.cycle-slideshow > *:nth-child(n + 2):not(.active, [class*="-wrap"]) {
  display: none;
}

/* line 85, app/assets/stylesheets/frontend_extend.css.scss */
a.line-it-button {
  background: #06c755;
  display: inline-block;
  vertical-align: top;
  padding: 0.1em;
  border-radius: 0.2em;
  font-size: 0.7em;
  font-weight: 600;
}

/* line 93, app/assets/stylesheets/frontend_extend.css.scss */
a.line-it-button:hover , a.line-it-button.hover-class {
  text-decoration: initial;
  background-color: #1d8447;
}

/* line 97, app/assets/stylesheets/frontend_extend.css.scss */
a.line-it-button img {
  margin-left: 0.4em;
  position: relative;
  width: 1.15em;
  vertical-align: text-bottom;
}

/* line 103, app/assets/stylesheets/frontend_extend.css.scss */
a.line-it-button span.label {
  display: inline-block;
  padding: 0 0.5em 0 0.2em;
}

/* line 109, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen {
  z-index: 10000;
}

/* line 112, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen.active .content {
  overflow-y: auto;
  max-height: 80%;
}

/* line 116, app/assets/stylesheets/frontend_extend.css.scss */
li {
  list-style: none;
}

/* line 119, app/assets/stylesheets/frontend_extend.css.scss */
ol li {
  list-style: unset;
}

/* line 122, app/assets/stylesheets/frontend_extend.css.scss */
td {
  word-break: break-word;
  min-width: 3em;
}

/* line 126, app/assets/stylesheets/frontend_extend.css.scss */
.ui-datepicker-calendar td {
  min-width: auto;
}

/* line 129, app/assets/stylesheets/frontend_extend.css.scss */
h1.default_site_h1, h2.default_site_h1 {
  font-size: 1em;
  margin: 0;
  padding: 0;
  height: 100%;
}

/* line 135, app/assets/stylesheets/frontend_extend.css.scss */
.default_site_h1 a.navbar-brand {
  float: none;
}

@media (max-width: 767px) {
  /* line 139, app/assets/stylesheets/frontend_extend.css.scss */
  h3 .tab_nav {
    font-size: 0.8em;
  }
}

@media (min-width: 768px) {
  /* line 144, app/assets/stylesheets/frontend_extend.css.scss */
  .navbar-header h1.default_site_h1, .navbar-header h2.default_site_h1 {
    float: left;
  }
}

/* line 148, app/assets/stylesheets/frontend_extend.css.scss */
ul.tab_nav, ul.nav-tabs {
  list-style-type: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  font-family: "Roboto", "微軟正黑體", "Helvetica Neue", Helvetica, sans-serif;
}

/* line 155, app/assets/stylesheets/frontend_extend.css.scss */
ul.tab_nav_li_only li.active {
  background-color: #969696;
  color: #fff;
}

/* line 159, app/assets/stylesheets/frontend_extend.css.scss */
ul.tab_nav_li_only li {
  background-color: #f3f3f3;
  color: #ccc;
  padding: 0.5em 1em;
  margin: 0.2em;
  cursor: pointer;
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}

/* line 170, app/assets/stylesheets/frontend_extend.css.scss */
.filter_tab {
  float: left;
  list-style: none;
  margin-right: 5px;
  margin-bottom: 3px;
  background: #bcbcbc;
  font-size: 0.8em;
  padding: 0px 5px;
  border-radius: 5px;
  cursor: pointer;
}

/* line 181, app/assets/stylesheets/frontend_extend.css.scss */
li.filter_tab.active {
  background: transparent;
  color: #555;
  border-bottom: 0;
}

/* line 186, app/assets/stylesheets/frontend_extend.css.scss */
.nav_tabs_filter {
  display: inline-block;
  padding-left: 0.625em;
}

/* line 190, app/assets/stylesheets/frontend_extend.css.scss */
td a img {
  max-width: none;
}

/* line 193, app/assets/stylesheets/frontend_extend.css.scss */
.cycle-slide {
  visibility: hidden !important;
}

/* line 196, app/assets/stylesheets/frontend_extend.css.scss */
.cycle-slide-active {
  visibility: visible !important;
}

/* line 199, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 {
  position: relative;
}

/* line 201, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .w-ba-banner__slide > a {
  display: block;
  height: 100%;
  width: 100%;
}

/* line 205, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .w-ba-banner__slide > a img {
  position: relative !important;
}

/* line 210, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .cycle-carousel-wrap .w-ba-banner__slide {
  visibility: visible !important;
}

/* line 214, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .ad-overlay , .ba-banner-widget-1 .banner-overlay {
  color: #fff;
  z-index: 200;
  font-family: "Roboto", "微軟正黑體", "Helvetica Neue", Helvetica, sans-serif;
  position: absolute;
  width: 100%;
  bottom: 0;
  background-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.7) 40%, #000);
  padding: 1.5em 1em;
  display: none;
}

/* line 225, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .cycle-carousel-wrap .ad-overlay , .ba-banner-widget-1 .cycle-carousel-wrap .banner-overlay {
  position: relative;
  display: block;
}

/* line 229, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .banner-pager button {
  background: rgba(255, 255, 255, 0.4);
  width: 100%;
  height: 3px;
  border: 0;
}

/* line 235, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .banner-pager .active-slide button {
  opacity: 1;
  background: #32D9C3;
}

/* line 239, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .banner-pager.w-ba-banner__caption {
  top: auto;
  right: auto;
}

/* line 243, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .banner-pager {
  margin: 0;
  padding: 0;
  list-style: none;
  position: absolute;
  bottom: 0;
  top: auto;
  right: auto;
  left: auto;
  z-index: 200;
  text-align: center;
  width: 100%;
}

/* line 256, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .banner-pager li {
  display: inline-block;
  height: 3px;
  width: 4%;
  cursor: pointer;
  margin: 0 2px;
}

/* line 263, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .controlplay {
  position: absolute;
  right: 1em;
  top: 3%;
  z-index: 200;
}

/* line 269, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .controlplay a {
  display: inline-block;
  margin-right: 0.25em;
  cursor: pointer;
  padding: 5px 10px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  background: rgba(0, 0, 0, 0.2);
}

/* line 277, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .controlplay a i {
  font-family: FontAwesome;
  position: relative;
  font-size: 1rem;
  line-height: 1;
  color: #FFF;
  vertical-align: middle;
  font-style: normal;
}

/* line 286, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .controlplay .resume-slide i::before {
  content: "\f04b";
}

/* line 289, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 .controlplay .pause-slide i::before {
  content: "\f04c";
}

/* line 292, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 ul.button-mid .prev-button {
  transition: 0.4s;
  float: left;
  left: 0.5rem;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 2.2rem;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.2);
  text-align: center;
  line-height: 2.5rem;
  top: 50%;
  position: absolute;
  transform: translateY(-50%);
  z-index: 999;
}

/* line 308, app/assets/stylesheets/frontend_extend.css.scss */
.ba-banner-widget-1 ul.button-mid .next-button {
  float: right;
  transition: 0.4s;
  right: 0.5rem;
  width: 2.5rem;
  height: 2.5rem;
  font-size: 2.2rem;
  color: #fff;
  background: rgba(0, 0, 0, 0.2);
  text-align: center;
  line-height: 2.5rem;
  top: 50%;
  position: absolute;
  transform: translateY(-50%);
  z-index: 999;
}

/* line 327, app/assets/stylesheets/frontend_extend.css.scss */
.modules-menu.collapse .social_wrap {
  display: none;
}

/* line 330, app/assets/stylesheets/frontend_extend.css.scss */
.modules-menu.collapse.in .social_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

/* line 335, app/assets/stylesheets/frontend_extend.css.scss */
.modules-menu .social_wrap > div > span {
  display: inline-block;
  padding: 0.5em;
  text-align: center;
  float: left;
}

/* line 341, app/assets/stylesheets/frontend_extend.css.scss */
.modules-menu .social_wrap > div i, .modules-menu .social_wrap > div img {
  width: 2em;
  font-size: 2em;
  text-align: center;
}

/* line 348, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap {
  width: 100%;
  display: block;
}

/* line 349, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap a:hover, .black-screen-social-window .content-social .social_wrap a.hover-class, .black-screen-social-window .content-social .social_wrap a:focus {
  text-decoration: none;
}

/* line 354, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap > div > span {
  padding: 0.5em 0;
}

/* line 357, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap span {
  display: block;
}

/* line 360, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap img {
  width: auto;
}

/* line 363, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap i {
  font-size: 3em;
}

@media (max-width: 1150px) {
  /* line 348, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap {
    display: flex;
  }
}

@media (min-width: 720px) and (max-width: 1150px) {
  /* line 370, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap span, .black-screen-social-window .content-social .social_wrap span a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    vertical-align: middle;
    height: 100%;
  }
  /* line 378, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap span br, .black-screen-social-window .content-social .social_wrap span a br {
    display: none;
  }
}

@media (max-width: 719px) and (min-width: 210px) {
  /* line 384, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap span, .black-screen-social-window .content-social .social_wrap span a {
    font-size: 1.7vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  /* line 390, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap span br, .black-screen-social-window .content-social .social_wrap span a br {
    display: none;
  }
}

/* line 395, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-social-window .content-social .social_wrap > div {
  padding: 0 1%;
  display: block;
  height: 100%;
}

@media (min-width: 1151px) {
  /* line 395, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div {
    width: 100%;
  }
}

@media (max-width: 1150px) {
  /* line 395, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div {
    width: 25%;
    flex: 1;
    height: auto;
    font-size: 1.7vw;
    text-align: center;
    line-height: 3em;
  }
  /* line 406, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div > span, .black-screen-social-window .content-social .social_wrap > div span a {
    height: 100%;
    padding: 1% 0;
  }
  /* line 410, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div img, .black-screen-social-window .content-social .social_wrap > div i {
    height: 60%;
    font-size: 2em;
  }
  /* line 414, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div i {
    padding-bottom: 20%;
  }
}

@media (min-width: 1150px) {
  /* line 347, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window {
    position: absolute;
    min-width: 80px;
    top: 20px;
    z-index: 8000;
    border: 2px solid #afa49e;
    padding: 3% 0;
    background: white;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    text-align: center;
  }
  /* line 424, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable {
    border: 0;
    background: transparent;
  }
  /* line 427, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable.right .content-social .social_wrap > div {
    float: right;
  }
  /* line 429, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable.right .content-social .social_wrap > div > span {
    border-radius: 0.5em 0 0 0.5em;
  }
  /* line 437, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable.left .content-social .social_wrap > div {
    float: left;
  }
  /* line 439, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable.left .content-social .social_wrap > div > span {
    border-radius: 0.5em 0 0 0.5em;
  }
  /* line 447, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable br {
    display: none;
  }
  /* line 450, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable .content-social .social_wrap span {
    white-space: nowrap;
    display: flex;
    align-items: center;
    padding: 0.3em;
  }
  /* line 457, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable .content-social .social_wrap > div {
    clear: both;
    width: 4.5em;
    transition: all 0.5s ease-in-out;
    overflow: hidden;
  }
  /* line 462, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable .content-social .social_wrap > div > span {
    background-color: white;
  }
  /* line 466, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable .content-social .social_wrap > div:hover ,   .black-screen-social-window.reactable .content-social .social_wrap > div.hover-class {
    width: 100%;
  }
  /* line 469, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable .content-social .social_wrap img {
    height: 90%;
    width: auto;
    padding-top: 5%;
  }
  /* line 474, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.reactable .content-social .social_wrap i, .black-screen-social-window.reactable .content-social .social_wrap img {
    width: 1.3em;
  }
  /* line 479, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div > span {
    margin: 3% 0;
  }
  /* line 483, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.right {
    right: 0;
  }
  /* line 486, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window.left {
    left: 0;
  }
  /* line 500, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap img {
    width: 60%;
    height: auto;
  }
}

@media (max-width: 1150px) {
  /* line 347, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window {
    position: fixed;
    left: 10vw;
    width: 70vw;
    bottom: 15px;
    z-index: 8000;
    border: 2px solid #afa49e;
    background: white;
    border-radius: 10px;
  }
  /* line 507, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window .content-social .social_wrap > div > span {
    border-radius: 0.5em;
  }
}

@media (max-width: 1150px) and (min-width: 210px) {
  /* line 347, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window {
    height: auto;
  }
}

@media (max-width: 209px) {
  /* line 347, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-social-window {
    height: auto;
    overflow-wrap: break-word;
  }
}

/* line 528, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-popup-window {
  position: fixed;
  width: 100%;
  height: 100%;
  opacity: 0;
  top: -20000px;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1100;
  left: 0;
  transition: opacity .3s ,top 0s .3s;
}

/* line 538, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-popup-window.active {
  opacity: 1;
  top: 0;
  transition: opacity .3s;
}

/* line 542, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-popup-window.active .content {
  transform: translate(-50%, -50%);
  opacity: 1;
  top: 50%;
  left: 50%;
  transition: opacity 1s .8s,top .5s .7s;
}

/* line 551, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-popup-window .content {
  background: #fff;
  color: #666;
  font-family: '微軟正黑體','sans-serif';
  position: absolute;
  opacity: 0;
  left: -20000px;
  top: 60%;
  transform: translate(-50%, -50%);
  transform-origin: center;
  width: 90%;
  font-weight: bold;
  transition: opacity .5s ,top .5s, left 0s .5s;
  padding: 2px;
}

@media (min-width: 768px) {
  /* line 551, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-popup-window .content {
    width: 40%;
    padding: 30px;
  }
}

@media (max-width: 767px) {
  /* line 551, app/assets/stylesheets/frontend_extend.css.scss */
  .black-screen-popup-window .content {
    padding: 30px 10px;
  }
}

/* line 572, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-popup-window .content .close-screen-btn {
  position: absolute;
  right: 0;
  top: 0;
  padding: 5px 10px;
  background: #333333;
  color: #fff;
  font-size: 1.125em;
  transition: .3s;
}

/* line 581, app/assets/stylesheets/frontend_extend.css.scss */
.black-screen-popup-window .content .close-screen-btn:hover , .black-screen-popup-window .content .close-screen-btn.hover-class {
  background: #555555;
}