*,
*:before,
*:after {
  box-sizing: inherit;
}
html {
  box-sizing: border-box;
  font-size: 18px;
  font-family: "Noto Sans TC", "PingFang TC", Microsoft JhengHei, "Microsoft JhengHei", sans-serif;
}
body,
main,
section {
  width: 100%;
}
main {
  position: relative;
  border: 5px solid #000;
}
h1,
h2,
h3,
h4 {
  margin: 0;
}
h1 {
  font-size: 3rem;
}
h2 {
  font-size: 1.7rem;
}
h2.notBold {
  font-weight: normal;
}
h3 {
  margin-top: 0;
  font-size: 1.5rem;
  font-weight: normal;
}
h4 {
  font-size: 1.2rem;
}
p {
  width: 90%;
  margin: 1em auto;
  line-height: 1.5;
  text-align: justify;
}
p.bold {
  font-weight: bold;
}
p:first-of-type {
  margin-top: 0;
}
p:last-of-type {
  margin-bottom: 0;
}
a {
  cursor: pointer;
  text-decoration: none;
}
figure {
  margin: 0;
}
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  width: 100%;
  height: 60px;
  background-color: #fff;
  border: 5px solid #000;
}
.nav a {
  display: inline-block;
  float: left;
  width: 45px;
  height: 45px;
  margin-top: 2.5px;
  margin-bottom: 2.5px;
  background-size: 45px 45px;
}
.nav a.nav__game {
  display: block;
  position: absolute;
  top: -5px;
  right: -5px;
  width: 60px;
  height: 60px;
  margin: 0;
  text-align: center;
  border: 5px solid #000;
}
.nav__logo {
  margin-left: 5px;
  margin-right: 5px;
  background-image: url(logo_52fd0399.png);
}
.nav__share {
  position: relative;
  z-index: 11;
  background-image: url(share_2512ab6e.png);
}
.nav__gplus,
.nav__facebook,
.nav__line {
  position: absolute;
  top: 2.5px;
  left: 55px;
  z-index: 10;
  margin: 0 !important;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  transition-duration: 0.19s;
}
.nav__gplus {
  background-image: url(data:image/png;base64,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);
  background-size: 47px !important;
}
.nav__gplus.open {
  -webkit-transform: translate3d(50px, 0, 0);
          transform: translate3d(50px, 0, 0);
}
.nav__facebook {
  background-color: #3b5998;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowNTgwMTE3NDA3MjA2ODExODA4M0NDMTM4MEMyQTVFQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0ODM5MDEzMjVEMEMxMUUyOUZGRkIyMDc2OThGM0E1MCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0ODM5MDEzMTVEMEMxMUUyOUZGRkIyMDc2OThGM0E1MCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTY3NDM2QkUxQTIwNjgxMTgwODNDQzEzODBDMkE1RUIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MDU4MDExNzQwNzIwNjgxMTgwODNDQzEzODBDMkE1RUIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz46cLmaAAACtUlEQVR42uydT0tUURiHz6iRhGJBm/4os4msDD+GEG2LcFP4Adq0qD5B7WvTplVQUBQEZbiVNm60nYuIRsxWkZYalcPt9zK3VjnUvcd7zrnzPPCTy+Bxrue57znHuWfGRpZlLmdMuamcU44p/Q72kh1lTXmp3FJW7MFGLmRKeawM009B+KJcUOZMSFMHS8oI/RKUDWWyT1+uIyMKzMENq5BWPn9AeFomZIcJPBraJiSjH+Khjy5ACCAEIYAQhABC6s8AXfCHH8q88lpZVN4pH5RvyrayXzmQf++QclA5lOeIclQZzY+nip4Efxg690a5ozxVPnv6mRkV8v+8Va4pz5lDwmJX711lIjYZvVghP5UZ5QGTehyT9iXlGcveOLgau4xeWmU9VKYrnqcQsgu2lD2hfEpBSC8MWbcrlsGQ1YV119ljth1gaU2F/IX7AWSwyurCo9ROuM5Dlm3TPF5m+GDI8st8IBkMWbuwULK9vYpxRXmi2GbCrVzwv6TUk9aV5RJtm66zK/1U1SddZyGtgu3sRtSsMs6Q5ZePBdtdDiWj7kK+F2x3nkl9b9gq2O40QuLiMELiYgghcdGPEEAIQgAhCAGEIAQQghAIRgr3QxoJPd8+19nlMkCFxMHJshc5QvxS+pYvQvwyjhAqBLpwpvSKIoGdi41EZNh9lE1lkAqJg2ZZGQjxi5fNEQhBCCsshCQkhFWWP+zTqYepkDgYdZ4+pj2FV3uziisr6IhBhUQGQhACCEEIIAQhgBCEAEIQAggBhCAEEIIQQAhCACEIAYQAQhACCEEIIAQhgBCEAEIAIQiBAkLadEM0tE3IGv0QDasm5AX9EA2z9i7cpg6WlJGa/XKpvcdwQ5m0CnnvOv/W+isXaDCs7y8qrd+rrFfKWeWessJEX80Enve19fmEMmcP/hJgAPgOlwVtJnohAAAAAElFTkSuQmCC);
  background-size: 20px !important;
}
.nav__facebook.open {
  -webkit-transform: translate3d(100px, 0, 0);
          transform: translate3d(100px, 0, 0);
}
.nav__line {
  background-color: #00b900;
  background-image: url(data:image/png;base64,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);
  background-size: 30px auto !important;
}
.nav__line.open {
  -webkit-transform: translate3d(150px, 0, 0);
          transform: translate3d(150px, 0, 0);
}
.nav__game img {
  width: auto;
  height: 30px;
  margin: 10px 0;
}
.nav__game--text {
  display: none;
  padding: 0 1em;
  font-size: 12px;
  text-align: center;
}
.nav__game {
  background-color: #fbb03b;
}
.taipeiGeo {
  position: fixed;
  top: 60px;
  left: 0;
  right: 0;
  z-index: -1;
  width: 100%;
  height: calc(100vh - 65px);
}
.taipeiGeo > div {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}
.taipeiGeo svg {
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
}
.taipeiGeo__info {
  position: absolute;
  bottom: 80px;
  left: 20px;
  text-align: left;
  font-size: 0.9rem;
  line-height: 1.5;
}
.heading {
  position: relative;
  height: calc(100vh - 10px);
  padding-top: 55px;
}
.heading img {
  position: absolute;
  bottom: 130px;
  left: 15px;
  width: 50%;
}
.infographic {
  width: 100%;
}
.infographic h2,
.infographic h3,
.infographic p {
  background-color: #fff;
}
.infographic p {
  width: 100%;
  padding: 0 5%;
  margin-left: 0;
  margin-right: 0;
}
.infographic__brief {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: calc(100vh - 60px);
  background-color: #fff;
  border-top: 5px solid #000;
  border-bottom: 5px solid #000;
}
.infographic__brief h2 {
  padding: 1em 0.5em;
  background-color: #a2dad1;
  border-bottom: 2.5px solid #000;
}
.infographic__brief p {
  text-align: justify;
}
.infographic__brief p:first-of-type {
  padding-top: 1em;
  border-top: 2.5px solid #000;
}
.infographic__brief p:last-of-type {
  padding-bottom: 1em;
}
.infographic__chart {
  position: relative;
  padding: 1em 5%;
  text-align: center;
  background-color: #fff;
}
.infographic__chart p {
  padding: 0;
}
.infographic__chart p a {
  color: #fbb03b;
  padding-bottom: 1px;
  border-bottom: 1px solid #fbb03b;
}
.infographic__chart h3 {
  margin: 0.5em 0;
  text-align: center;
}
.infographic__chart input[type="range"] {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  width: 80%;
  height: 20px;
  margin: 0 auto;
  background: transparent;
}
.infographic__chart input[type=range]:focus {
  outline: none;
}
.infographic__chart input[type=range]::-ms-track {
  width: 100%;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
.infographic__chart input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  padding: 2.5px;
  border-radius: 15px;
  background: #ae8abb;
  cursor: pointer;
  margin-top: -7px;
  pointer-events: auto;
}
.infographic__chart input[type=range]::-moz-range-thumb {
  height: 20px;
  width: 20px;
  padding: 2.5px;
  border-radius: 15px;
  background: #ae8abb;
  cursor: pointer;
  pointer-events: auto;
}
.infographic__chart input[type=range]::-ms-thumb {
  height: 20px;
  width: 20px;
  padding: 2.5px;
  border-radius: 15px;
  background: #ae8abb;
  cursor: pointer;
  pointer-events: auto;
}
.infographic__chart input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  background: #fff;
  box-shadow: 0px 0px 1px #0d0d0d;
}
.infographic__chart input[type="range"]::-moz-range-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0px 0px 1px #e6e6e6;
}
.infographic__chart input[type=range]::-ms-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  background: #fff;
  box-shadow: 0px 0px 1px #e6e6e6;
}
.infographic__chart--bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.infographic__chart--bar p {
  margin: 0;
}
.infographic__chart--barInfo span {
  color: #ae8abb;
  font-size: 1.7rem;
}
.infographic__chartBlock {
  position: relative;
}
.infographic__chartBlock:not(:first-of-type) {
  margin-top: 1em;
}
.infographic__chartBlock p {
  font-size: 18px;
  text-align: center;
}
.infographic__chartBlock--category {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 100%;
  margin: 1em 0;
}
.infographic__chartBlock--category > div {
  width: 24%;
  padding: 0.2em 0;
  color: #999;
  border: 1px solid #999;
  cursor: pointer;
}
.infographic__chartBlock--category > div.selected {
  color: #fff;
  background-color: #999;
}
.infographic__chartBlock--info {
  margin-bottom: 1em;
  font-size: 0.8rem;
  text-align: right;
  line-height: 1.4;
}
.infographic__chartBlock #chart-hotArea {
  min-height: 1200px;
}
.infographic__chartBlock #chart-hotArea .highcharts-point:nth-of-type(odd) {
  fill: #a2dad1;
}
.infographic__chartBlock #chart-hotArea .highcharts-point:nth-of-type(even) {
  fill: #ae8abb;
}
.infographic__chartBlock #chart-increase,
.infographic__chartBlock #chart-easyRent,
.infographic__chartBlock #chart-gender,
.infographic__chartBlock #chart-pet,
.infographic__chartBlock #chart-cook {
  min-height: 500px;
}
.intro {
  border-bottom: 5px solid #000;
  background-color: #fff;
}
.intro__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.7rem;
  font-weight: bold;
  border-top: 5px solid #000;
  border-bottom: 5px solid #000;
}
.intro__title--text {
  padding: 0.1em 0.2em;
  border-right: 5px solid #000;
  background-color: #ede09f;
}
.intro__title--curtain {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background: radial-gradient(circle at 100% 50%, transparent 20%, #000 21%, #000 34%, transparent 35%, transparent), radial-gradient(circle at 0% 50%, #ae8abb 20%, #000 21%, #000 34%, #ae8abb 35%, #ae8abb) 0 -22px;
  background-size: 33px 44px;
}
.intro__content {
  padding: 1em 0;
}
.intro__content--title {
  display: none;
}
.album {
  display: none;
}
.story {
  background-color: #fff;
  border-bottom: 5px solid #000;
}
.story__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 5px solid #000;
}
.story__title--text {
  max-width: 70%;
  padding: 0.1em 0.2em;
  font-size: 1.7rem;
  border-right: 5px solid #000;
  background-color: #ede09f;
}
.story__title--curtain {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background-image: radial-gradient(#000 30%, transparent 0), radial-gradient(#000 30%, transparent 0);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
  background-color: #a2dad1;
}
.story__content {
  padding-bottom: 1em;
}
.story__content figure {
  border-top: 5px solid #000;
  margin-bottom: 1em;
}
.story__content figure:first-of-type {
  border-top: none;
}
.story__content img {
  width: 100%;
  height: auto;
  border-bottom: 5px solid #000;
}
.story__content figcaption {
  width: 90%;
  margin: 0 auto;
  color: #999;
  font-weight: 300;
  line-height: 1.4;
}
.story__content h3 {
  width: 90%;
  margin: 0 auto 0.5em;
}
.story__content::-webkit-scrollbar {
  width: 5px;
}
.story__content::-webkit-scrollbar-thumb {
  background-color: #fbb03b;
  border-radius: 5px;
}
.story__content::-webkit-scrollbar-track-piece {
  background-color: rgba(251,176,59,0.3);
  border-radius: 5px;
}
.solution {
  background-color: #fff;
}
.solution__container {
  width: 100%;
}
.solution__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  border-bottom: 5px solid #000;
}
.solution__title > div {
  width: 50%;
}
.solution__title--text {
  padding: 0.8em;
  background-color: #ee9dbd;
  border-right: 2.5px solid #000;
}
.solution__title--curtain {
  background-color: #a2dad1;
  border-left: 2.5px solid #000;
}
.solution__content {
  padding: 1em 5%;
}
.solution__content p {
  width: 100%;
  text-align: justify;
}
.solution__content img {
  width: 100%;
}
.solution__content figcaption {
  font-size: 0.8rem;
  text-align: right;
}
.solution__chartBlock {
  position: relative;
  min-height: 400px;
  margin-top: 1em;
}
.solution__chartBlock--info {
  margin-bottom: 1em;
  font-size: 0.8rem;
  text-align: right;
}
.solution__chartBlock--env {
  text-align: center;
}
.solution .solutionBlock {
  width: 100%;
  margin-top: 1em;
  padding: 1em;
  border: 5px solid #000;
}
.solution .solutionBlock--title {
  padding: 0.5em 0;
  color: #fff;
  background-color: #4a4a4a;
}
.solution .solutionBlock__title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.solution .solutionBlock__title h3 {
  width: 50%;
  text-align: center;
}
.solution .solutionBlock__ratio {
  margin-top: 0.5em;
}
.solution .solutionBlock__ratio--value {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0.5em 0;
}
.solution .solutionBlock__ratio--value h2 {
  width: 50%;
  color: #ae8abb;
}
.solution .solutionBlock__rank {
  margin-top: 0.5em;
}
.solution .solutionBlock__rank--value {
  margin-top: 0.5em;
}
.solution .solutionBlock__rank--value > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0.5em 0;
}
.solution .solutionBlock__rank--value > div > div {
  width: 50%;
}
.solution .solutionBlock__rank--value > div:not(:last-of-type) {
  border-bottom: 1px solid #4a4a4a;
}
.solution .solutionBlock__rank--value p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 48px;
  margin: 0;
  text-align: center;
}
.solution .solutionBlock__rank--value span {
  display: block;
  margin-top: 0.5em;
  color: #a2dad1;
}
.footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  background-color: #fff;
  border: 5px solid #000;
  border-top: none;
}
.footer__block {
  width: 100%;
}
.footer__block > a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1em 0;
}
.footer__block > a img {
  width: auto;
  height: 30px;
  margin-right: 10px;
}
.footer__block > a h4,
.footer__block > a p {
  color: #000;
}
.footer__block > a p {
  width: 100%;
  margin: 0;
}
.footer--game {
  background-color: #fbb03b;
  border-bottom: 2px solid #000;
}
.footer--github {
  background-color: #a2dad1;
  border-top: 2px solid #000;
}
.footer__projects {
  width: 100%;
  padding: 5% 5%;
  background-color: #000;
  border-bottom: 5px solid #000;
}
.footer__projects > iframe {
  min-height: 343px;
}
.footer__credit {
  width: 100%;
  padding: 1em;
  text-align: center;
  background-color: #9bd8ec;
  border-top: 5px solid #000;
  border-bottom: 5px solid #000;
}
.footer__credit p {
  width: 100%;
  margin: 0;
  text-align: center;
}
.footer__comment {
  width: 100%;
  padding: 0 5%;
}
@media (min-width: 600px) and (max-width: 899px) {
  main {
    border-width: 20px;
    border-bottom-width: 10px;
  }
  p {
    width: 70%;
  }
  .nav {
    height: 100px;
    padding-left: 10px;
    border-width: 20px;
  }
  .nav a {
    width: 50px;
    height: 50px;
    margin: 5px 5px;
    background-size: 50px 50px;
  }
  .nav a.nav__game {
    right: -20px;
    width: 100px;
    height: 100px;
  }
  .nav a.nav__game {
    top: -20px;
  }
  .nav__gplus,
  .nav__facebook,
  .nav__line {
    top: 5px;
    left: 75px;
  }
  .nav__gplus {
    background-size: 52px !important;
  }
  .nav__gplus.open {
    -webkit-transform: translate3d(60px, 0, 0);
            transform: translate3d(60px, 0, 0);
  }
  .nav__facebook {
    background-size: 20px !important;
  }
  .nav__facebook.open {
    -webkit-transform: translate3d(120px, 0, 0);
            transform: translate3d(120px, 0, 0);
  }
  .nav__line {
    background-size: 30px auto !important;
  }
  .nav__line.open {
    -webkit-transform: translate3d(180px, 0, 0);
            transform: translate3d(180px, 0, 0);
  }
  .nav__game img {
    height: 40px;
    margin: 20px 0;
  }
  .taipeiGeo__info {
    bottom: 70px;
    left: 40px;
  }
  .heading__title {
    top: 50%;
    width: 80%;
    border-bottom: 8px solid #000;
    border-width: 15px;
  }
  .heading__title div {
    width: 90%;
    margin: 0 auto 5%;
    background-color: transparent;
  }
  .heading__title div a {
    width: calc((100% - 30px) / 3);
    background-color: #000;
  }
  .heading__title div a:not(:first-of-type):not(:last-of-type) {
    margin: 0 15px;
    border: none;
  }
  .infographic__brief h2 {
    padding-left: 5%;
    padding-right: 5%;
  }
  .infographic__chart {
    padding-left: 15%;
    padding-right: 15%;
  }
  .intro__content {
    padding: 5% 0;
  }
  .album {
    border-width: 15px;
  }
  .album__title {
    border-width: 10px;
  }
  .album__title--curtain {
    border-width: 10px;
  }
  .album__title--text {
    padding-top: 1em;
  }
  .album__mainPhoto,
  .album__photo2,
  .album__photo3 {
    border-width: 10px;
  }
  .story {
    border-width: 15px;
  }
  .story__content {
    padding: 0;
  }
  .story__content h3 {
    width: 70%;
  }
  .story__content p:last-of-type {
    margin-bottom: 5%;
  }
  .story__content figcaption {
    width: 70%;
  }
  .solution__title {
    border-width: 10px;
  }
  .solution__title--text,
  .solution__title--curtain {
    border-width: 5px;
  }
  .solution__content {
    padding: 5% 15%;
    text-align: center;
  }
  .solution__content h3 {
    text-align: left;
  }
  .solution__content img {
    width: 50%;
  }
  .footer {
    border-width: 20px;
  }
  .footer__block > div {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .footer__block > div img {
    height: 40px;
    margin-right: 20px;
  }
  .footer--game {
    border-bottom-width: 5px;
  }
  .footer--github {
    border-top-width: 5px;
  }
  .footer__credit {
    border-top-width: 10px;
    border-bottom-width: 10px;
    border-left-width: 5px;
  }
  .footer__comment {
    padding: 5% 10%;
  }
}
@media (min-width: 900px) {
  .nav a.nav__game {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    top: 20px;
    width: 90px;
    height: 90px;
  }
  .nav a.nav__game {
    right: 20px;
  }
  .nav__game {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .nav__game img {
    height: 40px;
    margin: 0 0 10px;
  }
  .nav__game--text {
    display: block;
    padding: 0;
    color: #000;
  }
  .taipeiGeo__info {
    left: auto;
    right: 20px;
    text-align: right;
  }
  .heading img {
    left: 5%;
    width: auto;
    height: 50%;
  }
  .heading__title {
    bottom: 10%;
    left: 5%;
  }
  .infographic {
    width: 100%;
  }
  .infographic__brief h2 {
    padding: 1em 20%;
  }
  .infographic__brief p {
    padding-left: 20%;
    padding-right: 20%;
  }
  .infographic__chart {
    padding-left: 20%;
    padding-right: 20%;
  }
  .infographic__chartBlock #chart-increase {
    display: block;
    min-height: 400px;
  }
  .intro {
    position: relative;
    padding: 5% 0;
    background-color: #a2dad1;
    border-top: 5px solid #000;
  }
  .intro__title {
    position: absolute;
    top: 0;
    left: 45%;
    right: 0;
    bottom: 0;
    width: 55%;
    height: 100%;
    border: none;
    border-left: 5px solid #000;
  }
  .intro__title--text {
    display: none;
  }
  .intro__title--curtain {
    margin: 0 auto 0 0;
    background: radial-gradient(circle at 100% 50%, transparent 20%, #000 21%, #000 34%, transparent 35%, transparent), radial-gradient(circle at 0% 50%, #9bd8ec 20%, #000 21%, #000 34%, #9bd8ec 35%, #9bd8ec) 0 -22px;
    background-size: 33px 44px;
  }
  .intro__content {
    position: relative;
    width: 60%;
    margin: 0 auto;
    padding-left: 50px;
    background-color: #fff;
    border: 5px solid #000;
  }
  .intro__content--title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    font-size: 1.7rem;
    font-weight: bold;
    background-color: #ede09f;
    border: 7px solid #000;
  }
  .album {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    border-bottom: 5px solid #000;
    background-color: #fff;
  }
  .album__col figure {
    position: relative;
    width: 100%;
  }
  .album__col figure img {
    width: 100%;
    height: 100%;
    vertical-align: top;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: 50% 50%;
       object-position: 50% 50%;
  }
  .album__col figure figcaption {
    position: absolute;
    right: 0.4em;
    bottom: 0.2em;
    color: #fff;
    font-size: 2rem;
    font-weight: 300;
  }
  .album__col--1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100px;
    border-right: 2.5px solid #000;
  }
  .album__col--2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 60%;
    border-left: 2.5px solid #000;
    border-right: 2.5px solid #000;
  }
  .album__col--2 > div {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .album__col--3 {
    width: calc(100% - 60% - 100px);
    border-left: 2.5px solid #000;
  }
  .album__mainPhoto {
    border-bottom: 5px solid #000;
  }
  .album__photo2 {
    width: 60% !important;
    border-left: 2.5px solid #000;
    cursor: pointer;
  }
  .album__photo3 {
    border-bottom: 2.5px solid #000;
    cursor: pointer;
  }
  .album__photo4 {
    border-top: 2.5px solid #000;
    border-bottom: 2.5px solid #000;
    cursor: pointer;
  }
  .album__line {
    width: 100%;
    height: 100px;
    background-image: linear-gradient(-45deg, #fff 62px, #000 63px, #000 68px, #fff 69px, #fff);
    border-bottom: 5px solid #000;
  }
  .album__dot {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    background-image: radial-gradient(#000 20%, transparent 0), radial-gradient(#000 20%, transparent 0);
    background-size: 30px 30px;
    background-position: 0 0, 15px 15px;
    background-color: rgba(162,218,209,0.6);
  }
  .album__wave {
    width: 40%;
    border-right: 2.5px solid #000;
    background: radial-gradient(circle at 100% 50%, transparent 22%, #000 28%, #000 29%, transparent 35%, transparent), radial-gradient(circle at 0% 50%, rgba(174,138,187,0.6) 22%, #000 28%, #000 29%, rgba(174,138,187,0.6) 35%, rgba(174,138,187,0.6)) 0 -21px;
    background-size: 30px 42px;
  }
  .album__descr {
    padding: 2em;
    border-top: 2.5px solid #000;
  }
  .album__descr li {
    line-height: 2;
    list-style-type: decimal;
    font-family: monospace;
  }
  .story {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .story__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 20%;
    background-color: #ede09f;
    border-bottom: none;
    border-right: 5px solid #000;
  }
  .story__title--text {
    max-width: 100%;
    height: 80%;
    padding: 10%;
    border-right: none;
    border-bottom: 5px solid #000;
  }
  .story__title--text h2.notBold {
    margin-top: 1em;
  }
  .story__title--curtain {
    height: 20%;
    background-image: repeating-linear-gradient(45deg, #000, #000 8px, #fbb03b 8px, #fbb03b 30px);
    background-size: auto;
    background-position: 0% 0%;
  }
  .story__content {
    width: 60%;
    height: 60vh;
    padding: 0 1em 0 0;
    margin: 50px auto;
    overflow-y: scroll;
  }
  .story__content figure {
    display: none;
  }
  .story__content h3 {
    margin-top: 1em;
  }
  .solution {
    position: relative;
    background-color: #fff;
  }
  .solution__title--text {
    width: 100% !important;
    text-align: center;
    background-color: #ee9dbd;
    border-right: none;
  }
  .solution__title--text h2 {
    display: inline;
  }
  .solution__title--curtain {
    display: none;
  }
  .solution__content {
    padding: 5% 20%;
    text-align: center;
  }
  .solution__content h3 {
    margin: 1em 0;
  }
  .solution__content img {
    width: 50%;
  }
  .solution .solutionBlock {
    padding: 0;
    border: none;
    margin-bottom: 0.5em;
  }
  .solution .solutionBlock__title {
    padding-left: 20%;
    border-bottom: 1px solid #4a4a4a;
  }
  .solution .solutionBlock__ratio {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #4a4a4a;
  }
  .solution .solutionBlock__ratio--value {
    width: 80%;
  }
  .solution .solutionBlock__rank {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #4a4a4a;
  }
  .solution .solutionBlock__rank--value {
    width: 80%;
    margin: 0;
  }
  .solution .solutionBlock__rank--value > div > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0 2em;
  }
  .solution .solutionBlock__rank--value p {
    display: inline;
    text-align: left;
    min-height: auto;
  }
  .solution .solutionBlock__rank--value p br {
    display: none;
  }
  .solution .solutionBlock__rank--value span {
    margin: 0;
  }
  .solution .solutionBlock--title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 20%;
    background-color: transparent;
    color: #000;
  }
  .footer__block > div {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .footer__block > div img {
    height: 40px;
    margin-right: 20px;
  }
  .footer__credit {
    background-color: #ae8abb;
  }
  .footer__comment {
    padding: 5% 15%;
  }
}
.highcharts-axis-title {
  font-size: 14px;
}
.bg--square {
  background-image: linear-gradient(45deg, #f2f2f2 25%, transparent 0), linear-gradient(45deg, transparent 75%, #f2f2f2 0);
  background-size: 18px 18px;
  background-position: 6px 12px, 15px 21px;
}
.bg--line {
  background-image: repeating-linear-gradient(45deg, #000, #000 8px, #a2dad1 8px, #a2dad1 30px);
}
.bg--circle {
  background-image: radial-gradient(#000 30%, transparent 0), radial-gradient(#000 30%, transparent 0);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
}
.bg--wave {
  background: radial-gradient(circle at 100% 50%, transparent 20%, #000 21%, #000 34%, transparent 35%, transparent), radial-gradient(circle at 0% 50%, #a2dad1 20%, #000 21%, #000 34%, #a2dad1 35%, #a2dad1) 0 -22px;
  background-size: 33px 44px;
}