@charset "utf-8";
 html {
      font-size: 100%
    }

    .flex {
      display: flex;
      z-index: 9999
    }

    .box {
      width: 100px;
      width: calc(100% - 20px);
      height: 100px;
      line-height: 100px;
      text-align: center;
      font-size: 4rem;
      background-color: red
    }

    .fade-enter-active,
    .fade-leave-active {
      transition: all .5s
    }

    .fade-enter,
    .fade-leave-active {
      opacity: 0
    }


#app {
	min-height: 100vh;
	width: 100%
}
.sub-header {
	background-color: #209a7e;
	color: #fff;
	padding: 1.6rem
}
.sub-header h2 {
	font-size: 1.6rem;
	font-weight: 200;
	letter-spacing: .2rem;
	margin: 0
}
.sub-body {
	min-height: 100vh
}
.sub-body .container {
	padding-top: 2rem;
	padding-bottom: 2rem
}
a, a.r-link {
	text-decoration: none;
	color: #000
}
a.r-link:focus, a.r-link:hover, a:focus, a:hover {
	text-decoration: none;
	color: #3eb89c
}
.m-btn, a.m-btn {
	color: #fff;
	background-color: #000;
	padding: .6rem 1rem;
	font-size: .9rem;
	font-weight: 200;
	display: inline-block
}
.m-btn:hover, a.m-btn:hover {
	color: #fff;
	background: #323232
}
h3.stage-title {
	font-size: 1.6rem;
	margin: 2rem 0;
	line-height: 1.5;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex
}
h3.stage-title:before {
	content: "";
	width: 5px;
	background-color: #34675b;
	vertical-align: top;
	margin-right: 1rem;
	-webkit-flex-shrink: 0;
	-ms-flex-negative: 0;
	flex-shrink: 0
}
h4.stage-title {
	font-size: 1.4rem;
	margin: 0 0 1.4rem;
	line-height: 1.8;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex
}
h4.stage-title:before {
	content: "";
	width: 5px;
	background-color: #34675b;
	vertical-align: top;
	margin-right: 1rem;
	-webkit-flex-shrink: 0;
	-ms-flex-negative: 0;
	flex-shrink: 0
}
h5.stage-title {
	font-size: 1.25rem;
	margin: 0 0 1.25rem;
	padding-left: 1.25rem;
	line-height: 1.6;
	display: block;
	position: relative;
	font-weight: 600
}
h5.stage-title:before {
	content: "";
	width: 5px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 1.8em;
	background-color: #34675b;
	vertical-align: top;
	margin-right: 1rem
}
.stage-cover img {
	width: 100%
}
.stage-content {
	font-size: 1rem;
	line-height: 1.8
}
.stage-side {
	border: 5px solid #209a7e;
	padding: 1rem
}
.stage-side .ss-item {
	cursor: pointer
}
.character-circle {
	text-align: center
}
.character-circle .cover {
	background-color: #209a7e;
	background-size: cover;
	background-position: 50%;
	width: 70%;
	height: 0;
	padding: 35% 0;
	border-radius: 100%;
	margin: 1rem auto;
	box-shadow: 0 0 15px -3px rgba(0,0,0,.2)
}
.character-circle .name {
	font-size: 1.2rem;
	font-weight: 600;
	margin: 0;
	line-height: 1.4
}
.character-circle .title {
	font-size: 1rem;
	font-weight: 300
}
.ytVideo {
	position: relative;
	height: 0;
	width: 100%;
	padding-bottom: 56.25%
}
.ytVideo iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0
}
.album .sm-photo[data-toggle=modal] {
	height: 100%;
	cursor: pointer
}
.album .sm-photo[data-toggle=modal] img {
	width: 100%;
	height: 100%
}

.loading_wrap[data-v-69979681] {
      position: fixed;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      z-index: 9999;
      background: hsla(0, 0%, 100%, .85)
    }

    .loading_wrap .loader-container[data-v-69979681] {
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
      position: absolute;
      top: 50%;
      left: 50%;
      margin: -40px 0 0 -40px
    }

    .loading_wrap .loader-container .tp-loader[data-v-69979681] {
      width: 80px;
      height: 80px;
      background-color: #fff;
      background-size: 30px 30px;
      box-shadow: 0 0 20px 0 rgba(0, 0, 0, .15);
      border-radius: 3px;
      -webkit-animation: loader-rotate-plane-data-v-69979681 2.5s infinite ease-in-out;
      animation: loader-rotate-plane-data-v-69979681 2.5s infinite ease-in-out
    }

    .loading_wrap .loader-container .ring[data-v-69979681] {
      display: inline-block;
      box-sizing: border-box;
      width: 50px;
      height: 50px;
      border-radius: 100%;
      position: absolute;
      -webkit-transform: translateZ(100px);
      transform: translateZ(100px);
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
      border: 6px solid #8e8f8f;
      border-top-color: #2084a7;
      -webkit-animation: loader-rotate-plane-spinning-data-v-69979681 2.5s infinite ease-in-out;
      animation: loader-rotate-plane-spinning-data-v-69979681 2.5s infinite ease-in-out
    }

    @-webkit-keyframes loader-rotate-plane {
      0% {
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        transform: perspective(120px) rotateX(0deg) rotateY(0deg)
      }
      50% {
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
        transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
      }
      to {
        -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);
        transform: perspective(120px) rotateX(-180deg) rotateY(-180deg)
      }
    }

    @keyframes loader-rotate-plane-data-v-69979681 {
      0% {
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        transform: perspective(120px) rotateX(0deg) rotateY(0deg)
      }
      50% {
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
        transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
      }
      to {
        -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);
        transform: perspective(120px) rotateX(-180deg) rotateY(-180deg)
      }
    }

    @-webkit-keyframes loader-rotate-plane-spinning {
      0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
      }
      25% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
      }
      50% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
      }
      75% {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
      }
      75.1% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
      }
      to {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
      }
    }

    @keyframes loader-rotate-plane-spinning-data-v-69979681 {
      0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
      }
      25% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
      }
      50% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
      }
      75% {
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
      }
      75.1% {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
      }
      to {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
      }
    }

header {
      background-color: #fff;
      width: 100%;
      border-bottom: 1px solid #ccc;
      border-top: 5px solid #209a7e
    }

    header div.row {
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 0;
      position: relative
    }

    header .main-logo {
      padding-top: 1rem;
      padding-bottom: 1rem
    }

    header .main-logo img {
      height: 5rem;
      max-width: 100%
    }

    @media (max-width:1199px) {
      header .main-logo {
        padding-bottom: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
      }
    }

    @media (max-width:991px) {
      header .main-logo {
        padding-bottom: 1rem;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
        text-align: center
      }
    }

    @media (max-width:1199px) {
      header nav.navbar {
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
      }
    }

    @media (max-width:991px) {
      header nav.navbar {
        top: 0;
        right: 0
      }
    }

    header button.btn.menu-toggle {
      display: none;
      box-shadow: 0 0 0 transparent;
      height: 100%;
      padding-top: 0;
      padding-bottom: 0;
      cursor: pointer
    }

    @media (max-width:991px) {
      header button.btn.menu-toggle {
        display: block;
        background-color: transparent;
        position: absolute;
        right: 0;
        top: 0
      }
    }

 nav[r ole=navigation] {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      padding-top: 0;
      padding-bottom: 0;
      height: 100%
    }

    @media (max-width:991px) {
      nav[role=navigation] {
        overflow: hidden;
        padding: 0;
        z-index: 1000
      }
    }

    nav[role=navigation] a.nav-link {
      color: #000;
      font-size: 1rem;
      padding: 1.6rem .6rem;
      position: relative
    }

    nav[role=navigation] a.nav-link:after {
      content: "";
      position: absolute;
      bottom: 1rem;
      left: 0;
      padding: 0 .6rem;
      background-clip: content-box;
      width: 0;
      height: 5px;
      background-color: #209a7e
    }

    @media (max-width:766px) {
      nav[role=navigation] a.nav-link:after {
        display: none
      }
    }

    nav[role=navigation] a.nav-link:hover {
      color: #209a7e
    }

    nav[role=navigation] a.nav-link.router-link-active:after {
      width: 100%
    }

    @media (max-width:1199px) {
      nav[role=navigation] a.nav-link {
        padding: 1.6rem .6rem
      }
    }

    @media (max-width:991px) {
      nav[role=navigation] a.nav-link {
        padding: .8rem 1.6rem;
        border-bottom: 1px solid #f8f8f8
      }
    }

    nav[role=navigation] ul.nav {
      display: -webkit-inline-flex;
      display: -ms-inline-flexbox;
      display: inline-flex;
      -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
      justify-content: flex-end
    }

    @media (max-width:1199px) {
      nav[role=navigation] ul.nav {
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start
      }
    }

    @media (max-width:991px) {
      nav[role=navigation] ul.nav {
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        height: 0;
        overflow: hidden;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        transition: height .5s ease
      }
      nav[role=navigation] ul.nav.show {
        height: auto
      }
    }

    nav[role=navigation] ul.nav li.nav-item {
      white-space: nowrap
    }

    @media (max-width:991px) {
      nav[role=navigation] ul.nav li.nav-item {
        display: block
      }
    }

    nav[role=navigation] li.nav-item .dropdown-menu {
      border: 1px solid #ccc;
      border-left: 5px solid #26b997;
      border-radius: 0;
      margin: 0 0 0 .6rem;
      padding: 0;
      font-size: 1rem;
      transition: all .5s ease
    }

    nav[role=navigation] li.nav-item .dropdown-menu .dropdown-item {
      padding: .6rem 1rem
    }

    nav[role=navigation] li.nav-item .dropdown-menu .dropdown-item:active,
    nav[role=navigation] li.nav-item .dropdown-menu .dropdown-item:hover {
      background-color: transparent;
      color: #209a7e
    }

    @media (max-width:991px) {
      nav[role=navigation] li.nav-item .dropdown-menu {
        position: relative;
        width: 100%;
        height: 0;
        transition: height .5s ease;
		top: 0%;
      }
    }

    @media (max-width:991px) {
      nav[role=navigation] li.nav-item.show .dropdown-menu {
        height: auto
      }
    }

 footer {
      background-color: #000;
      color: #fff;
      letter-spacing: 1px
    }

    footer .footerCtx {
      padding: 3rem
    }

    footer .footerCtx>div {
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column
    }

    footer .subscribe {
      text-align: center
    }

    footer .subscribe .sub-form {
      font-size: .8rem
    }

    footer .subscribe .sub-form input {
      width: 12rem;
      margin-right: .5rem;
      outline: 0;
      border: 1px solid #fff;
      padding: 3px
    }

    footer .subscribe .sub-form button {
      background-color: #000;
      border: 1px solid #fff;
      outline: 0;
      color: #fff
    }

    footer .subscribe .sub-form button:hover {
      background-color: #333
    }

    footer .subscribe .sub-form button:active {
      -webkit-transform: scale(.8);
      -ms-transform: scale(.8);
      transform: scale(.8);
      transition: all .3s ease
    }

    footer .socialmedia {
      letter-spacing: 1.2rem;
      padding-left: 1.2rem
    }

    footer .socialmedia>a {
      color: #fff;
      font-size: 1.5rem
    }

    footer .contact {
      text-align: right
    }

    @media (max-width:766px) {
      footer .contact {
        text-align: center;
        margin-top: 1rem
      }
    }

    footer .contact p {
      font-size: .8rem;
      margin-bottom: .1rem
    }

    footer .contact p:first-child {
      font-size: 1.2rem;
      margin-bottom: 1rem
    }

    footer .copyright {
      background-color: #333
    }

    footer .copyright>p {
      text-align: center;
      font-size: .8rem;
      padding: 1.6rem 0;
      margin: 0
    }

 /**
 * Owl Carousel v2.2.0
 * Copyright 2013-2016 David Deutsch
 * Licensed under MIT (https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE)
 */

    /*
 *  Owl Carousel - Core
 */

    .owl-carousel {
      display: none;
      width: 100%;
      -webkit-tap-highlight-color: transparent;
      /* position relative and z-index fix webkit rendering fonts issue */
      position: relative;
      z-index: 1;
    }

    .owl-carousel .owl-stage {
      position: relative;
      -ms-touch-action: pan-Y;
    }

    .owl-carousel .owl-stage:after {
      content: ".";
      display: block;
      clear: both;
      visibility: hidden;
      line-height: 0;
      height: 0;
    }

    .owl-carousel .owl-stage-outer {
      position: relative;
      overflow: hidden;
      /* fix for flashing background */
      -webkit-transform: translate3d(0px, 0px, 0px);
    }

    .owl-carousel .owl-item {
      position: relative;
      min-height: 1px;
      float: left;
      -webkit-backface-visibility: hidden;
      -webkit-tap-highlight-color: transparent;
      -webkit-touch-callout: none;
    }

    .owl-carousel .owl-item img {
      display: block;
      width: 100%;
      -webkit-transform-style: preserve-3d;
    }

    .owl-carousel .owl-nav.disabled,
    .owl-carousel .owl-dots.disabled {
      display: none;
    }

    .owl-carousel .owl-nav .owl-prev,
    .owl-carousel .owl-nav .owl-next,
    .owl-carousel .owl-dot {
      cursor: pointer;
      cursor: hand;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

    .owl-carousel.owl-loaded {
      display: block;
    }

    .owl-carousel.owl-loading {
      opacity: 0;
      display: block;
    }

    .owl-carousel.owl-hidden {
      opacity: 0;
    }

    .owl-carousel.owl-refresh .owl-item {
      visibility: hidden;
    }

    .owl-carousel.owl-drag .owl-item {
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

    .owl-carousel.owl-grab {
      cursor: move;
      cursor: grab;
    }

    .owl-carousel.owl-rtl {
      direction: rtl;
    }

    .owl-carousel.owl-rtl .owl-item {
      float: right;
    }

    /* No Js */

    .no-js .owl-carousel {
      display: block;
    }

    /*
 *  Owl Carousel - Animate Plugin
 */

    .owl-carousel .animated {
      -webkit-animation-duration: 1000ms;
      animation-duration: 1000ms;
      -webkit-animation-fill-mode: both;
      animation-fill-mode: both;
    }

    .owl-carousel .owl-animated-in {
      z-index: 0;
    }

    .owl-carousel .owl-animated-out {
      z-index: 1;
    }

    .owl-carousel .fadeOut {
      -webkit-animation-name: fadeOut;
      animation-name: fadeOut;
    }

    @-webkit-keyframes fadeOut {
      0% {
        opacity: 1;
      }
      100% {
        opacity: 0;
      }
    }

    @keyframes fadeOut {
      0% {
        opacity: 1;
      }
      100% {
        opacity: 0;
      }
    }

    /*
 * 	Owl Carousel - Auto Height Plugin
 */

    .owl-height {
      transition: height 500ms ease-in-out;
    }

    /*
 * 	Owl Carousel - Lazy Load Plugin
 */

    .owl-carousel .owl-item .owl-lazy {
      opacity: 0;
      transition: opacity 400ms ease;
    }

    .owl-carousel .owl-item img.owl-lazy {
      -webkit-transform-style: preserve-3d;
      transform-style: preserve-3d;
    }

    /*
 * 	Owl Carousel - Video Plugin
 */

    .owl-carousel .owl-video-wrapper {
      position: relative;
      height: 100%;
      background: #000;
    }

    .owl-carousel .owl-video-play-icon {
      position: absolute;
      height: 80px;
      width: 80px;
      left: 50%;
      top: 50%;
      margin-left: -40px;
      margin-top: -40px;
      background: white no-repeat;
      cursor: pointer;
      z-index: 1;
      -webkit-backface-visibility: hidden;
      transition: -webkit-transform 100ms ease;
      transition: transform 100ms ease;
    }

    .owl-carousel .owl-video-play-icon:hover {
      -webkit-transform: scale(1.3, 1.3);
      -ms-transform: scale(1.3, 1.3);
      transform: scale(1.3, 1.3);
    }

    .owl-carousel .owl-video-playing .owl-video-tn,
    .owl-carousel .owl-video-playing .owl-video-play-icon {
      display: none;
    }

    .owl-carousel .owl-video-tn {
      opacity: 0;
      height: 100%;
      background-position: center center;
      background-repeat: no-repeat;
      background-size: contain;
      transition: opacity 400ms ease;
    }

    .owl-carousel .owl-video-frame {
      position: relative;
      z-index: 1;
      height: 100%;
      width: 100%;
    }


    .showreel {
      background-color: #fff
    }

    .showreel .item {
      width: 100%;
      height: 0;
      padding: 20% 0;
      position: relative
    }

    @media (max-width:991px) {
      .showreel .item {
        padding: 25% 0
      }
    }

    @media (max-width:766px) {
      .showreel .item {
        padding: 30% 0
      }
    }

    .showreel .item .showImg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-size: cover
    }

    .showreel .item .showImg.ZoomIn {
      -webkit-animation-name: ZoomIn;
      animation-name: ZoomIn;
      -webkit-animation-duration: 8s;
      animation-duration: 8s;
      -webkit-animation-iteration-count: 1;
      animation-iteration-count: 1;
      -webkit-animation-timing-function: ease;
      animation-timing-function: ease;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      z-index: -1
    }

    @-webkit-keyframes ZoomIn {
      0% {
        -webkit-transform: scale(1);
        transform: scale(1)
      }
      to {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
      }
    }

    @keyframes ZoomIn {
      0% {
        -webkit-transform: scale(1);
        transform: scale(1)
      }
      to {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
      }
    }

    .showreel .item .showCard {
      position: absolute
    }

    .showreel .item .showCard.normal {
      max-width: 800px;
      width: 50%;
      bottom: 50%;
      right: 3rem;
      background-color: hsla(0, 0%, 100%, .5);
      box-shadow: 0 0 12px 2px rgba(0, 0, 0, .05);
      padding: 2rem;
      transition: opacity .5s ease, background-color .3s ease;
      -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
      transform: translateY(50%);
      opacity: 0
    }

    .showreel .item .showCard.normal:hover {
      background-color: hsla(0, 0%, 100%, .8)
    }

    .showreel .item .showCard.normal h3 {
      font-size: 1.8rem;
      line-height: 1.6;
      letter-spacing: 1px
    }

    @media (max-width:766px) {
      .showreel .item .showCard.normal h3 {
        font-size: 1.4rem;
        text-align: center
      }
    }

    .showreel .item .showCard.normal p {
      font-size: 1rem;
      line-height: 1.6;
      margin: 1rem 0
    }

    @media (max-width:766px) {
      .showreel .item .showCard.normal p {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
      }
    }

    @media (max-width:991px) {
      .showreel .item .showCard.normal {
        left: 50%;
        -webkit-transform: translateX(-50%) translateY(50%);
        -ms-transform: translateX(-50%) translateY(50%);
        transform: translateX(-50%) translateY(50%);
        width: 90%
      }
    }

    .showreel .item .showCard.normal p.showLink {
      margin-top: 2rem;
      margin-bottom: 0
    }

    @media (max-width:766px) {
      .showreel .item .showCard.normal p.showLink {
        text-align: center;
        margin-top: 0
      }
    }

    .showreel .item .showCard.normal p.showLink a {
      background-color: #209a7e;
      color: #fff;
      padding: .8rem 3.6rem;
      display: inline-block;
      text-decoration: none;
      transition: all .3s ease
    }

    .showreel .item .showCard.normal p.showLink a:hover {
      background-color: #52ccb0
    }

    @media (max-width:766px) {
      .showreel .item .showCard.normal p.showLink a {
        padding: 0;
        background-color: #fff;
        position: absolute;
        bottom: -1rem;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        border-radius: 2rem;
        width: 2rem;
        height: 2rem
      }
      .showreel .item .showCard.normal p.showLink a:hover {
        background-color: transparent
      }
    }

    @media (max-width:766px) {
      .showreel .item .showCard.normal p.showLink a span {
        display: none
      }
    }

    .showreel .item .showCard.normal p.showLink a i {
      display: none;
      color: #209a7e;
      font-size: 2rem
    }

    @media (max-width:766px) {
      .showreel .item .showCard.normal p.showLink a i {
        display: inline-block
      }
    }

    .showreel .item .showCard.figure {
      width: 100%;
      text-align: right;
      right: 0;
      bottom: 0;
      color: #fff;
      background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, .8) 75%);
      padding: 1rem 2rem .5rem
    }

    .showreel .item .showCard.figure h3 {
      font-size: 1.6rem;
      font-weight: 200;
      letter-spacing: 1px
    }

    .showreel .item .showCard.figure p {
      font-size: .8rem
    }

    .showreel .item .showCard.figure p.showLink {
      display: none
    }

    .showreel .owl-item.active .showCard {
      opacity: 1
    }

    .showreel .owl-nav {
      position: absolute;
      padding: 0 1rem;
      width: 100%;
      top: 50%;
      left: 0;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      opacity: 0;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%)
    }

    .showreel .owl-nav i.fa {
      font-size: 5rem;
      color: #fff;
      text-shadow: 0 0 10px rgba(0, 0, 0, .5);
      opacity: .5
    }

    .showreel .owl-nav i.fa:hover,
    .showreel:hover .owl-nav {
      opacity: 1
    }


    .eventReview {
      background-color: #eee
    }

    .eventReview .event-header {
      background-size: cover;
      background-position: 60%;
      color: #fff;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 5rem 2rem
    }

    @media (max-width:991px) {
      .eventReview .event-header {
        padding: 2rem
      }
    }

    .eventReview .event-header div {
      text-align: left
    }

    .eventReview .event-header h4 {
      font-size: 2rem;
      font-weight: 700
    }

    @media (max-width:766px) {
      .eventReview .event-header h4 {
        text-align: center
      }
    }

    .eventReview .event-header p {
      margin: 0
    }

    .eventReview .event-header .eventLink {
      margin-top: 5rem
    }

    @media (max-width:766px) {
      .eventReview .event-header .eventLink {
        display: none
      }
    }

    .eventReview .event-header .eventLink a {
      border: 1px solid #fff;
      color: #fff;
      padding: .8rem;
      min-width: 12rem;
      text-align: center;
      display: inline-block;
      text-decoration: none;
      background-color: rgba(12, 134, 106, .5);
      transition: all .3s ease
    }

    .eventReview .event-header .eventLink a:hover {
      background-color: #209a7e;
      border: 1px solid #52ccb0
    }

    .eventReview .event-item {
      padding: 0 2rem 2rem;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      transition: background-color .5s ease
    }

    @media (max-width:766px) {
      .eventReview .event-item {
        padding: 1rem
      }
    }

    .eventReview .event-item .eventBody {
      color: #000;
      text-decoration: none
    }

    @media (max-width:766px) {
      .eventReview .event-item .eventBody {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center
      }
    }

    .eventReview .event-item .eventNum {
      font-size: 4rem;
      font-family: Arial;
      font-weight: 700;
      color: #d8d8d8;
      margin: 2rem 0 3rem;
      transition: color .5s ease;
      position: relative
    }

    .eventReview .event-item .eventNum:after {
      content: "";
      display: block;
      position: absolute;
      height: 5px;
      width: 20%
    }

    @media (max-width:766px) {
      .eventReview .event-item .eventNum {
        font-size: 2rem;
        margin: 0;
        margin-right: 2rem
      }
      .eventReview .event-item .eventNum:after {
        display: none
      }
    }

    .eventReview .event-item:nth-child(2) .eventNum:after {
      background-color: #b3132a
    }

    .eventReview .event-item:nth-child(3) .eventNum:after {
      background-color: #1381b3
    }

    .eventReview .event-item:nth-child(4) .eventNum:after {
      background-color: #209a7e
    }

    .eventReview .event-item .eventTitle {
      margin-bottom: 1rem
    }

    @media (max-width:766px) {
      .eventReview .event-item .eventTitle {
        margin: 0
      }
    }

    .eventReview .event-item .eventTitle h5 {
      font-size: 1.2rem;
      font-weight: 700;
      margin-bottom: 1rem
    }

    @media (max-width:766px) {
      .eventReview .event-item .eventTitle h5 {
        margin: 0
      }
    }

    .eventReview .event-item .eventTitle .eventField {
      font-size: .5rem
    }

    .eventReview .event-item .eventCtx {
      font-size: .8rem;
      line-height: 2
    }

    @media (max-width:766px) {
      .eventReview .event-item .eventCtx {
        display: none
      }
    }

    .eventReview .event-item .eventLink a {
      color: #000;
      text-decoration: none;
      transition: all .3s ease
    }

    .eventReview .event-item .eventLink a:hover {
      color: #209a7e
    }

    @media (max-width:766px) {
      .eventReview .event-item .eventLink {
        display: none
      }
    }

    .eventReview .event-item:hover {
      background-color: #d8d8d8
    }

    .eventReview .event-item:hover .eventNum {
      color: #000
    }


.aboutReview {
      background-color: #f3f3f3;
      border-width: 1px 0;
      border-color: #ccc;
      border-style: solid
    }

    .aboutReview.container-fluid {
      padding: 5rem
    }

    @media (max-width:991px) {
      .aboutReview.container-fluid {
        padding: 0
      }
    }

    .aboutReview>div.row {
      box-shadow: 0 0 20px -5px #000;
      border-radius: 20px;
      overflow: hidden
    }

    @media (max-width:991px) {
      .aboutReview>div.row {
        border-radius: 0;
        margin: 0;
        box-shadow: none
      }
    }

    .aboutReview .about-item {
      padding: 5rem;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      background-color: #fff
    }

    @media (max-width:991px) {
      .aboutReview .about-item {
        padding: 3rem 2rem
      }
    }

    .aboutReview .about-item h4.aboutTitle {
      font-size: 2rem;
      margin-bottom: 2rem;
      font-weight: 200
    }

    .aboutReview .about-item h4.aboutTitle span {
      font-weight: 700;
      margin-left: 1rem;
      font-size: 2rem
    }

    @media (max-width:991px) {
      .aboutReview .about-item h4.aboutTitle {
        text-align: center;
        margin-bottom: 1rem
      }
    }

    .aboutReview .about-item .aboutCtx {
      font-size: 1rem;
      line-height: 2;
      padding: 1rem 0
    }

    .aboutReview .about-item .aboutLink {
      margin: 0;
      margin-top: 2rem;
      text-align: right
    }

    @media (max-width:991px) {
      .aboutReview .about-item .aboutLink {
        text-align: center
      }
    }

    .aboutReview .about-item .aboutLink a {
      background-color: #209a7e;
      color: #fff;
      padding: .8rem 3.6rem;
      display: inline-block;
      text-decoration: none;
      transition: all .3s ease
    }

    .aboutReview .about-item .aboutLink a:hover {
      background-color: #52ccb0
    }

    .aboutReview .about-pic {
      padding: 0;
      background-size: cover;
      background-position: 50%
    }

    @media (max-width:766px) {
      .aboutReview .about-pic {
        min-height: 200px
      }
    }


    .portReview {
      background-color: #eee;
      padding: 0
    }

    .portReview .port-header {
      padding: 3rem 1rem
    }

    .portReview .port-header>div {
      text-align: center
    }

    .portReview .port-header h4 {
      font-size: 2.5rem;
      font-weight: 800;
      font-family: STSong, FangSong, Nmingliu, STFangsong, arial;
      letter-spacing: 1px
    }

    .portReview .port-header p {
      margin: 0
    }

    .portReview .port-item {
      padding: 0;
      position: relative;
      background-color: #fff;
      overflow: hidden
    }

    .portReview .port-item>div {
      height: 100%;
      width: 100%;
      background-size: cover;
      min-height: 500px
    }

    @media (max-width:991px) {
      .portReview .port-item>div {
        min-height: 300px
      }
    }

    @media (max-width:766px) {
      .portReview .port-item>div {
        min-height: 400px
      }
    }

    .portReview .port-item .portAttr {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      padding: 1.5rem 1rem 1rem;
      background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, .8) 75%);
      letter-spacing: 1px;
      text-align: right;
      color: #fff;
      opacity: 1;
      transition: opacity .5s ease
    }

    @media (max-width:991px) {
      .portReview .port-item .portAttr {
        opacity: 1
      }
    }

    .portReview .port-item .portName {
      font-size: 1rem;
      margin: 0
    }

    .portReview .port-item .portAuthor {
      font-size: .8rem;
      margin: 0
    }

    .portReview .port-footer {
      padding: 3rem 1rem;
      text-align: center
    }

    .portReview .port-footer .portLink {
      margin: 0
    }

    .portReview .port-footer .portLink a {
      background-color: #209a7e;
      color: #fff;
      padding: .8rem 3.6rem;
      text-decoration: none;
      display: inline-block;
      transition: all .3s ease
    }

    .portReview .port-footer .portLink a:hover {
      background-color: #52ccb0
    }

    .reeReview {
      background-color: #eee
    }

    .reeReview .ree-header {
      background-size: cover;
      background-position: 50%;
      background-attachment: fixed;
      padding: 5rem
    }

    @media (max-width:991px) {
      .reeReview .ree-header {
        padding: 3rem 0
      }
    }

    .reeReview .ree-header>div {
      text-align: center
    }

    .reeReview .ree-header h4 {
      font-size: 2.5rem;
      font-weight: 700;
      color: #fff;
      font-family: STSong, FangSong, Nmingliu, STFangsong, arial
    }

    @media (max-width:991px) {
      .reeReview .ree-header h4 {
        font-size: 2rem
      }
    }

    .reeReview .ree-header p {
      margin: 0;
      color: #fff
    }

    .reeReview .ree-header .ctx {
      max-width: 1000px;
      margin: 0 auto;
      padding: 2rem 5rem;
      line-height: 2;
      text-align: left;
      font-weight: 200
    }

    @media (max-width:991px) {
      .reeReview .ree-header .ctx {
        padding: 2rem 1.5rem
      }
    }

    .reeReview .ree-items {
      padding: 5rem 3rem
    }

    @media (max-width:991px) {
      .reeReview .ree-items {
        padding: 1rem 0
      }
    }

    .reeReview .ree-items>div {
      margin-bottom: 1rem
    }

    .reeReview .ree-items .ree-item {
      padding: 0;
      padding-bottom: 3rem;
      border: 1px solid #ccc;
      height: 100%;
      position: relative;
      box-shadow: 0 0 20px -3px rgba(0, 0, 0, .2);
      background-color: #eee
    }

    .reeReview .ree-items .ree-item .ytVideo {
      border-bottom: 5px solid #b3132a
    }

    .reeReview .ree-items .ree-item .ctx {
      padding: 2rem;
      font-size: .9rem;
      line-height: 2
    }

    .reeReview .ree-items .ree-item .ctx h5.stage-title {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100%
    }

    .reeReview .ree-items .ree-item .reeLink {
      position: absolute;
      bottom: 0;
      right: 0;
      margin-top: 2rem;
      margin-right: 2rem
    }

    .reeReview .ree-items .ree-item .reeLink a {
      background-color: #b3132a;
      color: #fff;
      padding: .5rem 2.4rem;
      display: inline-block;
      text-decoration: none;
      transition: all .3s ease
    }

    .reeReview .ree-items .ree-item .reeLink a:hover {
      background-color: #e5455c
    }

    .newsReview {
      border: 2rem solid #209a7e
    }

    .newsReview .news-header {
      padding: 5rem 2rem;
      background-color: #000;
      background-size: cover;
      background-position: 50%;
      color: #fff;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center
    }

    .newsReview .news-header div {
      text-align: left
    }

    .newsReview .news-header h4 {
      font-size: 2rem;
      font-weight: 700
    }

    .newsReview .news-header .newsLink {
      margin-top: 5rem
    }

    .newsReview .news-header .newsLink a {
      border: 1px solid #fff;
      color: #fff;
      padding: .8rem 3.6rem;
      display: inline-block;
      text-decoration: none;
      background-color: rgba(0, 0, 0, .5);
      transition: all .3s ease
    }

    .newsReview .news-header .newsLink a:hover {
      background-color: #209a7e;
      border: 1px solid #52ccb0
    }

    .newsReview .news-item {
      padding: 5rem 3rem;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      transition: background-color .5s ease
    }

    @media (max-width:766px) {
      .newsReview .news-item {
        padding: 2rem
      }
    }

    .newsReview .news-item:nth-child(2n-1) {
      background-color: #eee
    }

    .newsReview .news-item:nth-child(2n-1):hover {
      background-color: #ddd
    }

    .newsReview .news-item:nth-child(2n) {
      background-color: #fff
    }

    .newsReview .news-item:nth-child(2n):hover {
      background-color: #ddd
    }

    .newsReview .news-item .newsAttr {
      font-size: .8rem
    }

    .newsReview .news-item .newsAttr span {
      margin-right: 1rem
    }

    .newsReview .news-item .newsTitle {
      font-size: 1.2rem;
      font-weight: 700;
      line-height: 2
    }

    .newsReview .news-item .newsCtx {
      font-size: .8rem;
      line-height: 1.8
    }

    .newsReview .news-item .newsLink a {
      color: #000
    }


    #page-Reviewlist .event-list {
      padding: 1rem 0
    }

    #page-Reviewlist .event-list.list .event-item {
      padding: 0;
      margin-bottom: 1.5rem;
      background-color: hsla(0, 0%, 93%, .5)
    }

    #page-Reviewlist .event-list.list .event-item .stage-cover {
      border: 0 solid #209a7e
    }

    #page-Reviewlist .event-list.list .event-item .stage-content {
      padding: 2rem;
      border: 2px solid #eee;
      border-left: 0
    }

    #page-Reviewlist .event-list.cards>div {
      padding-bottom: 1rem
    }

    #page-Reviewlist .event-list.cards .event-item {
      padding: 0;
      margin: .5rem;
      height: 100%;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      border: 1px solid #ccc;
      border-bottom: 3px solid #209a7e;
      background-color: hsla(0, 0%, 93%, .5);
      box-shadow: 0 0 15px -3px rgba(0, 0, 0, .2)
    }

    #page-Reviewlist .event-list.cards .event-item .stage-cover {
      width: 100%
    }

    #page-Reviewlist .event-list.cards .event-item .stage-cover div {
      padding: 40% 0;
      height: 0
    }

    #page-Reviewlist .event-list.cards .event-item .stage-content {
      padding: 2rem
    }

    #page-Reviewlist .event-list.cards .event-item .review-link {
      margin: 0
    }

    #page-Reviewlist .event-item {
      list-style: none;
      position: relative
    }

    #page-Reviewlist .event-item .stage-cover {
      position: relative;
      margin: 0
    }

    #page-Reviewlist .event-item .stage-cover div {
      position: relative;
      width: 100%;
      height: 100%;
      background-color: #eee;
      overflow: hidden
    }

    #page-Reviewlist .event-item .stage-cover div img {
      position: absolute;
      top: 0;
      left: 0;
      width: auto
    }

    #page-Reviewlist .event-item .stage-cover div img.landscape {
      height: 100%;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%)
    }

    #page-Reviewlist .event-item .stage-cover div img.portraits {
      width: 100%;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%)
    }

    #page-Reviewlist .event-item .stage-content {
      position: relative
    }

    #page-Reviewlist .event-item h4.title {
      font-size: 1.2rem;
      line-height: 1.6
    }

    #page-Reviewlist .event-item .detail {
      font-size: .8rem;
      color: #aaa
    }

    #page-Reviewlist .event-item .intro {
      text-align: justify;
      text-align-last: left;
      line-height: 2;
      font-size: .9rem
    }

    #page-Reviewlist .event-item .review-link {
      position: absolute;
      right: 0;
      bottom: 0;
      margin: 0
    }

    #page-Reviewlist .event-item .review-link a {
      font-size: .8rem;
      background-color: #209a7e
    }

    #page-Reviewlist .ctrl-nav {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: row;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
      justify-content: flex-end
    }

    #page-Reviewlist .ctrl-nav div.listType-btn {
      margin: 0 .5rem;
      padding: 5px 10px;
      border: 1px solid #eee;
      cursor: pointer
    }

    #page-Reviewlist .ctrl-nav.cards div.listType-btn[type=cards],
    #page-Reviewlist .ctrl-nav.list div.listType-btn[type=list] {
      background: #209a7e;
      color: #fff
    }


    @media (max-width:991px) {
      #page-Actlist .ree-items {
        padding: 1rem 0
      }
    }

    #page-Actlist .ree-items>div {
      margin-bottom: 1rem
    }

    #page-Actlist .ree-items .ree-item {
      padding: 0;
      padding-bottom: 3rem;
      border: 1px solid #ccc;
      height: 100%;
      position: relative;
      box-shadow: 0 0 20px -3px rgba(0, 0, 0, .2);
      background-color: #eee
    }

    #page-Actlist .ree-items .ree-item .ytVideo {
      border-bottom: 5px solid #b3132a
    }

    #page-Actlist .ree-items .ree-item .ctx {
      padding: 2rem;
      font-size: .9rem;
      line-height: 2
    }

    #page-Actlist .ree-items .ree-item .ctx h5.stage-title {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100%
    }

    #page-Actlist .ree-items .ree-item .reeLink {
      position: absolute;
      bottom: 0;
      right: 0;
      margin-top: 2rem;
      margin-right: 1rem
    }

    #page-Actlist .ree-items .ree-item .reeLink a {
      background-color: #b3132a;
      color: #fff;
      padding: .5rem 1.4rem;
      display: inline-block;
      text-decoration: none;
      transition: all .3s ease
    }

    #page-Actlist .ree-items .ree-item .reeLink a:hover {
      background-color: #e5455c
    }


    #page-Recommend .stage-cover {
      padding: 10% 0;
      background-size: cover;
      background-position: 50%
    }

    #page-Recommend .btns-group {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    #page-Recommend .btns-group button {
      margin: 5px;
      cursor: pointer
    }

    #page-Recommend .is-valid {
      border-color: #209a7e
    }

    #page-Recommend .is-invalid {
      border-color: #b3132a
    }

    #page-Artists ul.row {
      margin: 0 -1rem;
      padding: 0
    }

    #page-Artists ul.row>li {
      padding: 0 1rem 2rem;
      list-style: none
    }

    #page-Artists .artist-item {
      border: 2px solid #eee;
      border-radius: 5px;
      overflow: hidden;
      box-shadow: 0 0 10px -3px rgba(0, 0, 0, .2);
      position: relative;
      width: 100%;
      height: 100%;
      transition: box-shadow .2s ease
    }

    #page-Artists .artist-item:hover {
      box-shadow: 0 0 5px 3px rgba(0, 0, 0, .3)
    }

    #page-Artists .artist-item .stage-cover {
      display: block;
      position: relative;
      width: 100%;
      height: 0;
      padding: 50% 0;
      background-size: cover;
      background-position: 50%;
      border: 10px solid #fff
    }

    #page-Artists .artist-item .stage-content {
      padding: 1rem
    }

    #page-Artists .artist-item .stage-content .a-name {
      font-size: 1.2rem;
      white-space: nowrap;
      overflow: hidden;
      width: 100%;
      text-overflow: ellipsis;
      letter-spacing: 1px;
      margin: 0
    }

    #page-Artists .artist-item .stage-content .a-title {
      font-size: .8rem;
      color: #1381b3;
      white-space: nowrap;
      overflow: hidden;
      width: 100%;
      text-overflow: ellipsis;
      line-height: 1;
      margin: 5px 0
    }

    #page-Artists .artist-item .stage-content .a-intro {
      font-size: .9rem;
      line-height: 1.8
    }

    #page-Artists .artist-item .stage-link {
      position: absolute;
      bottom: 0;
      right: 0
    }

    #page-Artists .artist-item .stage-link a {
      padding: 1rem;
      display: inline-block;
      font-size: .8rem;
      line-height: 1;
      color: #1381b3
    }

    #page-Eventlist .event-item {
      border-bottom: 1px solid #ccc
    }

    #page-Eventlist .event-item .event-cover {
      width: 100%;
      position: relative;
      height: 0;
      overflow: hidden;
      padding: 40% 0
    }

    #page-Eventlist .event-item .event-cover img {
      position: absolute;
      top: 0;
      left: 0
    }

    #page-Eventlist .event-item .event-cover img.landscape {
      height: 100%
    }

    #page-Eventlist .event-item .event-cover img.portraits {
      width: 100%
    }

    #page-Eventlist .event-item .detail {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      font-size: .8rem
    }

    #page-Eventlist .event-item .detail>p {
      margin-right: 1rem
    }

    #page-Eventlist .event-item .detail>p i {
      letter-spacing: 5px
    }

    #page-Eventlist .event-item .intro {
      line-height: 2;
      font-size: .9rem
    }

    #page-Eventlist .event-item .event-link {
      text-align: right
    }

    #page-Eventlist .event-item .event-link a.m-btn {
      background-color: #209a7e
    }

    #page-Eventlist .event-item .event-link a.m-btn:hover {
      background-color: #26b997
    }

    #page-Eventlist .hot-events {
      margin-bottom: 2rem
    }

    #page-Eventlist .hot-events .event-item {
      padding: 1rem;
      position: relative;
      overflow: hidden
    }

    #page-Eventlist .hot-events .event-item h4>.r-link {
      color: #fff;
      font-size: 2rem;
      line-height: 1.6
    }

    @media (max-width:766px) {
      #page-Eventlist .hot-events .event-item {
        padding: 0
      }
    }

    #page-Eventlist .hot-events .event-cover {
      position: absolute;
      width: 100%;
      height: 0;
      top: 0;
      left: 0;
      padding: 100% 0
    }

    #page-Eventlist .hot-events .event-cover img {
      width: 100%
    }

    #page-Eventlist .hot-events .event-card {
      margin-top: 20rem;
      padding: 1rem;
      border: 1px solid #fff;
      background-color: rgba(0, 0, 0, .5);
      position: relative;
      color: #fff
    }

    @media (max-width:766px) {
      #page-Eventlist .hot-events .event-card {
        margin-top: 0
      }
    }

    #page-Eventlist .new-events {
      margin-bottom: 2rem
    }

    #page-Eventlist .new-events>div {
      padding-bottom: 2rem
    }

    #page-Eventlist .new-events .event-item {
      border: 1px solid #eee;
      box-shadow: 0 0 15px -3px rgba(0, 0, 0, .2);
      height: 100%;
      padding: 0;
      padding-bottom: 5rem;
      position: relative
    }

    #page-Eventlist .new-events .event-item .event-cover {
      padding: 30% 0
    }

    #page-Eventlist .new-events .event-item .event-cover img {
      width: 100%
    }

    #page-Eventlist .new-events .event-item h4.title {
      margin: 1rem 0;
      line-height: 1.6
    }

    #page-Eventlist .new-events .event-item .event-ctx {
      padding: 1rem 2rem
    }

    #page-Eventlist .new-events .event-item .event-link {
      position: absolute;
      bottom: 1rem;
      right: 2rem
    }

    #page-Eventlist .other-events {
      border: 1px solid #209a7e
    }

    #page-Eventlist .other-events .event-item {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      width: 100%;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 1rem
    }

    #page-Eventlist .other-events .event-item h4.title {
      width: 60%;
      font-size: 1rem;
      margin: 0
    }

    #page-Eventlist .other-events .event-item h4.title .hash {
      margin-right: 1rem
    }

    #page-Eventlist .other-events .event-item .event-link,
    #page-Eventlist .other-events .event-item p.date {
      width: 30%;
      margin: 0
    }

    #page-Catalog .catalog-items {
      padding: 2rem 0;
      margin: -.5rem
    }

    #page-Catalog .catalog-items div[class*=col] {
      padding: .5rem
    }

    #page-Catalog .catalog-item {
      cursor: pointer;
      position: relative;
      width: 100%;
      height: 0;
      padding: 50% 0
    }

    #page-Catalog .catalog-item .cover {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-position: 50%;
      background-size: cover
    }

    #page-Catalog .catalog-item .border-line {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: 1px solid #52ccb0;
      opacity: 0;
      transition: all .3s ease;
      z-index: 2
    }

    #page-Catalog .catalog-item .ctx {
      position: absolute;
      top: 5%;
      left: 5%;
      width: 90%;
      height: 90%;
      padding: 1rem;
      transition: all .3s ease;
      background-color: transparent;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      transition: all .5s ease
    }

    #page-Catalog .catalog-item .ctx p.name {
      text-align: center;
      font-size: 2rem;
      font-weight: 700;
      color: #fff;
      text-shadow: 0 0 5px rgba(0, 0, 0, .5);
      margin-top: 5rem;
      transition: all .3s ease
    }

    #page-Catalog .catalog-item .ctx p.detail {
      font-size: .8rem;
      line-height: 2;
      margin: 0;
      text-align: center;
      color: transparent;
      font-weight: 200;
      padding: 0 5px;
      transition: all .5s ease
    }

    #page-Catalog .catalog-item:hover .border-line {
      opacity: 1;
      top: 8%;
      left: 8%;
      width: 84%;
      height: 84%
    }

    #page-Catalog .catalog-item:hover .ctx {
      background-color: rgba(0, 0, 0, .5)
    }

    #page-Catalog .catalog-item:hover .ctx p.name {
      margin-top: 5rem
    }

    #page-Catalog .catalog-item:hover .ctx p.detail {
      margin-bottom: 2rem;
      font-size: .8rem;
      color: #fff
    }

    @media (max-width:766px) {
      #page-Catalog .catalog-item.on .border-line {
        opacity: 1;
        top: 8%;
        left: 8%;
        width: 84%;
        height: 84%
      }
      #page-Catalog .catalog-item.on .ctx {
        background-color: rgba(0, 0, 0, .5)
      }
      #page-Catalog .catalog-item.on .ctx p.name {
        margin-top: 5rem
      }
      #page-Catalog .catalog-item.on .ctx p.detail {
        margin-bottom: 2rem;
        font-size: .8rem;
        color: #fff
      }
    }

    #page-Catalog .catalog-intro {
      position: relative
    }

    #page-Catalog .catalog-intro .stage-content {
      height: 98%;
      width: 98%;
      position: absolute;
      padding: .5rem;
      border: 10px solid #209a7e
    }

    @media (max-width:766px) {
      #page-Catalog .catalog-intro .stage-content {
        padding: 1rem
      }
    }

    #page-Catalog .catalog-intro .stage-content p {
      line-height: 2;
      margin: 0;
      overflow-y: auto;
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      padding: 1.5rem
    }

 @media (max-width:766px) {
      #About-page .container {
        padding-bottom: 0
      }
    }

    .sideNav {
      margin: 2rem 0
    }

    @media (max-width:766px) {
      .sideNav {
        margin: 0
      }
    }

    .sideNav ul {
      list-style: none;
      padding: 0;
      margin: 0
    }

    @media (max-width:766px) {
      .sideNav ul {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        overflow-y: scroll
      }
    }

    .sideNav ul li {
      margin-bottom: .5rem
    }

    @media (max-width:766px) {
      .sideNav ul li {
        margin-right: 1rem
      }
    }

    .sideNav ul a.r-link {
      transition: all .3s ease
    }

    @media (max-width:766px) {
      .sideNav ul a.r-link {
        white-space: nowrap
      }
    }

    .sideNav ul a.r-link:before {
      content: "\F061";
      color: transparent;
      display: inline-block;
      width: 0;
      overflow: hidden;
      font-weight: 100;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: inherit;
      text-rendering: auto;
      transition: all .3s ease;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale
    }

    .sideNav ul a.r-link:hover:before {
      width: 1rem;
      color: #ff778e
    }

    .sideNav ul a.r-link.router-link-active {
      color: #1a7b65;
      font-weight: 600
    }

    .sideNav ul a.r-link.router-link-active:before {
      width: 1.4rem;
      color: #b3132a
    }


    #page-QA div.stage-content {
      padding-left: 2rem;
      line-height: 1.8;
      text-align: justify;
      text-align-last: left
    }

    @media (max-width:766px) {
      #page-QA div.stage-content {
        padding: 0 1rem;
        line-height: 2
      }
    }

    #page-QA section {
      border-bottom: 1px solid #ccc;
      padding-bottom: 2rem
    }

    @media (max-width:766px) {
      #page-QA section {
        padding: 1rem;
        border: 1px solid #ccc;
        margin-bottom: 1rem
      }
    }

    #page-QA section h3.stage-title {
      font-size: 1.2rem
    }

    @media (max-width:766px) {
      #page-QA section h3.stage-title {
        margin-top: 0
      }
    }


    #page-Eventpost .ctxHeader .stage-cover {
      width: 100%;
      height: 0;
      padding: 25% 0;
      background-size: cover;
      background-position: top;
      position: relative
    }

    #page-Eventpost .ctxHeader .stage-cover .info {
      position: absolute;
      width: 100%;
      text-align: right;
      right: 0;
      bottom: 0;
      color: #fff;
      background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, .8) 75%);
      padding: 2rem 2rem 1rem
    }

    #page-Eventpost .ctxHeader .stage-cover .info h3 {
      font-size: 3rem;
      letter-spacing: 3px
    }

    #page-Eventpost .ctxHeader .stage-cover .info p {
      margin: 0
    }

    #page-Eventpost .navSide {
      padding-top: 1rem
    }

    #page-Eventpost .navSide>div {
      background-color: #209a7e;
      padding: 1rem
    }

    #page-Eventpost .navSide section {
      margin-bottom: 1rem;
      padding-bottom: 1rem;
      border-bottom: 1px solid #fff
    }

    #page-Eventpost .navSide section h4.title {
      font-size: .8rem;
      margin-bottom: .5rem;
      color: #000
    }

    #page-Eventpost .navSide section div.content {
      color: #fff
    }

    #page-Eventpost .navSide section div.content p {
      line-height: 1.5;
      font-size: 1rem;
      margin: 0
    }

    #page-Eventpost .navSide .yt-link {
      color: #b3132a;
      font-size: 2rem;
      background-color: #fff;
      padding: 2px 6px;
      border-radius: 3px
    }

    #page-Eventpost .ctxBody section {
      padding-bottom: 1rem
    }

    #page-Eventpost .ctxBody section h4 {
      margin: 1rem 0;
      color: #34675b
    }

    #page-Eventpost .ctxBody section.intro div.stage-content {
      border: 5px solid #209a7e;
      padding: 1rem
    }

    #page-Eventpost .ctxBody section.intro div.stage-content p {
      margin: 0
    }

    #page-Eventpost .ctxBody section.hosts {
      text-align: center
    }

    #page-Eventpost .ctxBody section.hosts .hostName {
      line-height: 1.5;
      margin: 0 0 5px
    }

    #page-Eventpost .ctxBody section.hosts .hostTitle {
      font-size: .8rem;
      margin: 0;
      color: 0
    }

    #page-Eventpost .character-circle .cover {
      width: 80%;
      padding: 40% 0
    }

    #page-Artistpost .post-ctx h4 {
      margin: 1rem 0;
      color: #34675b
    }

    #page-Artistpost .post-ctx>div {
      margin-bottom: 2rem
    }

    #page-Artistpost .artist-header {
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      text-align: center
    }

    #page-Artistpost .artist-header .character-circle .cover {
      width: 100%;
      padding: 50% 0;
      border-radius: 0
    }

    #page-Artistpost .artist-header h3 {
      font-size: 1.5rem
    }

    #page-Artistpost .artist-header p {
      color: #209a7e
    }

    #page-Artistpost .artist-ctx p.intro {
      border: 5px solid #209a7e;
      padding: 1rem;
      line-height: 2
    }

    #page-Artistpost .artist-port div[class*=row] {
      margin: -.5rem
    }

    #page-Artistpost .artist-port div[class*=col-] {
      padding: .5rem
    }

    #page-Artistpost .artist-port .port-item {
      overflow: hidden;
      position: relative;
      width: 100%;
      height: 100%;
      border: 1px solid #eee
    }

    #page-Artistpost .artist-port .port-item .stage-cover {
      position: relative;
      width: 100%;
      height: 0;
      padding: 50% 0;
      background-size: cover;
      background-position: 50%
    }

    #page-Artistpost .artist-port .port-item .stage-content {
      padding: 1rem
    }

    #page-Artistpost .artist-port .port-item .stage-content .portName {
      font-size: 1.2rem;
      white-space: nowrap;
      overflow: hidden;
      width: 100%;
      text-overflow: ellipsis;
      letter-spacing: 2px;
      font-weight: 600;
      line-height: 1.8;
      margin: 0
    }

    #page-Artistpost .artist-port .port-item .stage-content .portAuthor {
      font-size: .8rem;
      line-height: 2;
      margin: 0;
      color: false
    }

    #page-Artistpost .artist-port .port-item .stage-content .portAttr {
      font-size: .5rem;
      line-height: 1.5;
      margin: 0;
      color: false;
      font-weight: 200
    }

    #page-Artistpost .artist-event .event-item {
      border-bottom: 1px solid #ccc;
      border: 1px solid #eee;
      box-shadow: 0 0 15px -3px rgba(0, 0, 0, .2);
      height: 100%;
      padding: 0;
      position: relative
    }

    #page-Artistpost .artist-event .event-item>a {
      text-decoration: none;
      color: #000
    }

    #page-Artistpost .artist-event .event-item .event-cover {
      width: 100%;
      position: relative;
      height: 0;
      overflow: hidden;
      padding: 25% 0
    }

    #page-Artistpost .artist-event .event-item .event-cover img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%
    }

    #page-Artistpost .artist-event .event-item h4.title {
      margin: 1rem 0;
      color: #000
    }

    #page-Artistpost .artist-event .event-item .event-ctx {
      padding: .5rem 1.5rem
    }

    #page-Artistpost .artist-event .event-item .detail {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      font-size: .8rem
    }

    #page-Artistpost .artist-event .event-item .detail>p {
      margin-right: 1rem
    }

    #page-Artistpost .artist-event .event-item .detail>p i {
      letter-spacing: 5px
    }

    #page-Artistpost .artist-event .event-item .intro {
      line-height: 2;
      font-size: .9rem
    }


    .modal {
      padding: 2rem;
      text-align: center
    }

    .modal .lg-photo {
      height: 100%;
      width: 100%;
      background-size: contain;
      background-position: 50%;
      background-repeat: no-repeat
    }

    .modal .modal-dialog {
      max-width: 100%;
      height: 100%;
      margin: 0
    }

    .modal .modal-content {
      height: 100%
    }

    .modal .modal-header {
      position: absolute;
      right: 0;
      top: 0;
      z-index: 1500;
      border: 0
    }

    .modal .modal-header .close {
      line-height: .5;
      margin: 0
    }

    .modal .modal-body {
      height: 100%;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column
    }

    .modal .modal-body .lg-photo {
      margin-bottom: 10px
    }

    .modal .modal-body .attr {
      margin: 0
    }

    .modal .modal-nav {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      padding: 1rem
    }

    .modal .modal-nav button {
      border: 0;
      outline: 0;
      background: hsla(0, 0%, 100%, .3);
      font-size: 2rem;
      width: 3rem;
      height: 3rem;
      line-height: 0;
      cursor: pointer;
      border-radius: 100%;
      box-shadow: 0 0 15px -3px rgba(0, 0, 0, .3)
    }

    .modal .modal-nav button:hover i {
      color: #209a7e
    }


    #page-Reviewpost .ctxHeader .stage-cover {
      width: 100%;
      height: 0;
      padding: 25% 0;
      background-size: cover;
      background-position: top;
      position: relative
    }

    #page-Reviewpost .ctxHeader .stage-cover .info {
      position: absolute;
      width: 100%;
      text-align: right;
      right: 0;
      bottom: 0;
      color: #fff;
      background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, .8) 75%);
      padding: 2rem 2rem 1rem
    }

    #page-Reviewpost .ctxHeader .stage-cover .info h3 {
      font-size: 3rem;
      letter-spacing: 3px
    }

    #page-Reviewpost .ctxHeader .stage-cover .info p {
      margin: 0
    }

    #page-Reviewpost .navSide {
      padding-top: 1rem
    }

    #page-Reviewpost .navSide>div {
      background-color: #209a7e;
      padding: 1rem
    }

    #page-Reviewpost .navSide section {
      margin-bottom: 1rem;
      padding-bottom: 1rem;
      border-bottom: 1px solid #fff
    }

    #page-Reviewpost .navSide section h4.title {
      font-size: .8rem;
      margin-bottom: .5rem;
      color: #000
    }

    #page-Reviewpost .navSide section div.content {
      color: #fff
    }

    #page-Reviewpost .navSide section div.content p {
      line-height: 1.5;
      font-size: 1rem;
      margin: 0
    }

    #page-Reviewpost .navSide .yt-link {
      color: #b3132a;
      font-size: 2rem;
      background-color: #fff;
      padding: 2px 6px;
      border-radius: 3px
    }

    #page-Reviewpost .ctxBody section {
      padding-bottom: 1rem
    }

    #page-Reviewpost .ctxBody section h4 {
      margin: 1rem 0;
      color: #34675b
    }

    #page-Reviewpost .ctxBody section.intro div.stage-content {
      border: 5px solid #209a7e;
      padding: 1rem
    }

    #page-Reviewpost .ctxBody section.hosts {
      text-align: center
    }

    #page-Reviewpost .ctxBody section.hosts .hostName {
      line-height: 1.5;
      margin: 0 0 5px
    }

    #page-Reviewpost .ctxBody section.hosts .hostTitle {
      font-size: .8rem;
      margin: 0;
      color: 0
    }

    #page-Reviewpost .ctxBody section.news a {
      width: 33.3333%;
      padding: 1rem
    }

    #page-Reviewpost .ctxBody section.news a img {
      width: 100%
    }

    #page-Reviewpost .sub-body>div.container-fluid {
      background-color: #000;
      padding: 0
    }

    #page-Reviewpost .character-circle .cover {
      width: 80%;
      padding: 40% 0
    }

    #page-Reviewpost .album .stage-content {
      margin: -.3rem
    }

    #page-Reviewpost .album .stage-content div[class*=col-] {
      padding: .3rem
    }


    #page-Newslist .event-item {
      padding: 0;
      padding-top: 2rem;
      padding-bottom: 2rem;
      border-bottom: 1px solid #ccc
    }

    @media (max-width:766px) {
      #page-Newslist .event-item {
        padding-top: 0;
        padding-bottom: 1rem
      }
    }

    #page-Newslist .event-item .stage-cover {
      position: relative
    }

    #page-Newslist .event-item .stage-cover div {
      width: 100%;
      height: 100%;
      background-size: cover;
      background-position: 50%
    }

    @media (max-width:766px) {
      #page-Newslist .event-item .stage-cover div {
        padding: 29% 0
      }
    }

    #page-Newslist .event-item .stage-cover .hover {
      position: absolute;
      top: 0;
      left: 0;
      background-color: rgba(0, 0, 0, .5);
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      opacity: 0;
      transition: opacity .25s ease
    }

    #page-Newslist .event-item .stage-cover .hover:hover {
      opacity: 1
    }

    #page-Newslist .event-item .stage-cover .hover p {
      color: #fff;
      font-weight: 100;
      font-size: .9rem;
      letter-spacing: 2px
    }

    #page-Newslist .event-item .stage-content {
      padding: 4rem 0 4rem 2rem
    }

    @media (max-width:766px) {
      #page-Newslist .event-item .stage-content {
        padding: 1rem
      }
    }

    #page-Newslist .event-item .stage-content h4.title {
      font-size: 1.2rem;
      color: #000;
      line-height: 2
    }

    #page-Newslist .event-item .stage-content .detail {
      font-size: .8rem;
      color: #ccc
    }

    #page-Newslist .event-item .stage-content .intro {
      font-size: .9rem;
      line-height: 2;
      margin: 0;
      color: #000
    }

    #page-Origin .float-right-img {
      float: right;
      display: inline-block;
      width: 50%;
      padding: 0 0 1rem 1rem;
      margin: 0
    }

    #page-Origin .float-right-img img {
      width: 100%
    }

#page-referenceList .col-md-6 {
      padding: .5rem
    }

    #page-referenceList .ref-item {
      height: 100%;
      margin: 0;
      padding: 1rem;
      padding-bottom: 5rem;
      background-color: rgba(32, 154, 126, .1);
      position: relative
    }

    #page-referenceList .ref-item .content {
      color: #000;
      text-align: justify;
      font-size: .9rem;
      letter-spacing: 1px
    }

    #page-referenceList .ref-item .name {
      position: absolute;
      bottom: 0;
      right: 0;
      text-align: right;
      padding: 0 1rem 1rem 0
    }

    #page-referenceList .ref-item .name .author {
      font-size: 1rem;
      margin: 0
    }

    #page-referenceList .ref-item .name .cat {
      font-size: .8rem;
      color: #209a7e;
      margin: 0
    }


    #page-Future section {
      margin-bottom: 1rem
    }

    #page-Future section h4 {
      font-size: 2rem;
      line-height: 1.6;
      font-weight: 400;
      margin-bottom: 2rem;
      text-align: center
    }

    @media (max-width:766px) {
      #page-Future section h4 {
        font-size: 1.2rem
      }
    }

    #page-Future div.stage-content.goal {
      margin-bottom: 3rem
    }

    @media (max-width:766px) {
      #page-Future div.stage-content.goal {
        margin: 0
      }
    }

    #page-Future div.stage-content.goal h4 {
      border-bottom: 1px solid #000;
      padding-bottom: 1rem
    }

    #page-Future div.stage-content.goal ul {
      padding: 0;
      list-style: none
    }

    #page-Future div.stage-content.goal ul li {
      margin-bottom: 2rem
    }

    @media (max-width:766px) {
      #page-Future div.stage-content.goal ul li {
        margin-bottom: 1rem
      }
    }

    #page-Future div.stage-content.goal ul li div {
      width: 100%;
      height: 100%;
      padding: 1rem 2rem;
      padding-left: 6.5rem;
      background-color: #eee;
      border: 1px solid #209a7e;
      border-left: 5px solid #209a7e;
      position: relative;
      overflow: hidden
    }

    #page-Future div.stage-content.goal ul li div:hover span {
      color: rgba(32, 154, 126, .8)
    }

    #page-Future div.stage-content.goal ul li div span {
      color: rgba(0, 0, 0, .1);
      font-size: 9rem;
      line-height: 0;
      position: absolute;
      top: 45%;
      left: 0;
      font-style: italic;
      transition: color .3s ease
    }

    #page-Future div.stage-content.goal ul li div h5.title {
      color: #209a7e;
      position: relative
    }

    #page-Future div.stage-content.goal ul li div p.ctx {
      margin-top: 2rem;
      font-size: .9rem;
      color: rgba(0, 0, 0, .8);
      position: relative
    }

    @media (max-width:766px) {
      #page-Future div.stage-content.future {
        padding: 0
      }
    }

    #page-Future section.phaseOne {
      position: relative;
      padding: 3rem
    }

    @media (max-width:766px) {
      #page-Future section.phaseOne {
        padding: 1rem;
        margin: 0
      }
    }

    #page-Future section.phaseOne .bg {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background-size: cover;
      background-position: 50%;
      background-attachment: fixed
    }

    #page-Future section.phaseOne .ctx {
      position: relative;
      color: #fff;
      width: 100%;
      padding: 3rem;
      line-height: 2;
      background-color: rgba(0, 0, 0, .6);
      border: 1px solid #209a7e
    }

    @media (max-width:766px) {
      #page-Future section.phaseOne .ctx {
        padding: 1rem
      }
    }

    #page-Future section.phaseOne .ctx h4 {
      font-size: 2rem;
      font-weight: 100;
      border-bottom: 1px solid #fff;
      padding-bottom: .5rem
    }

    @media (max-width:766px) {
      #page-Future section.phaseOne .ctx h4 {
        font-size: 1.2rem
      }
    }

    #page-Future section.phaseTwo {
      border: 5px solid #209a7e;
      padding: 3rem;
      margin-top: 2rem
    }

    @media (max-width:766px) {
      #page-Future section.phaseTwo {
        margin: 0;
        padding: 1rem;
        border: 1rem solid #209a7e
      }
    }

    #page-Future section.phaseTwo h4 {
      padding-bottom: 1rem;
      border-bottom: 1px solid #209a7e
    }

    #page-Future section.phaseTwo p>img {
      width: 100%
    }

    @media (max-width:766px) {
      #page-Idea {
        padding: 0
      }
    }

    #page-Idea .idea-nav {
      z-index: 2;
      position: relative
    }

    #page-Idea .idea-nav>div {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      cursor: pointer;
      position: relative;
      background-color: rgba(0, 0, 0, .4);
      transition: background-color .3s ease
    }

    #page-Idea .idea-nav>div:hover {
      background-color: rgba(0, 0, 0, .1)
    }

    #page-Idea .idea-nav>div.active {
      background-color: transparent
    }

    #page-Idea .idea-nav>div.active div.bg {
      border-bottom: 10px solid #52ccb0
    }

    #page-Idea .idea-nav div.bg {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      background-size: cover;
      background-position: 50%;
      border-bottom: 0 solid transparent;
      transition: border-bottom .5s ease;
      z-index: -1
    }

    #page-Idea .idea-nav div.bg:after {
      content: "";
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0
    }

    #page-Idea .idea-nav div.ctx {
      padding: 3rem;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: column;
      -ms-flex-direction: column;
      flex-direction: column
    }

    #page-Idea .idea-nav div.ctx .title {
      font-size: 3rem;
      font-weight: 800
    }

    #page-Idea .idea-nav div.ctx .text {
      height: 80%;
      font-weight: 200
    }

    #page-Idea .idea-nav p {
      color: #fff;
      margin: 0
    }

    #page-Idea .idea-part {
      padding-top: 1rem;
      margin: 0
    }

    #page-Idea .idea-part .item {
      width: 100%;
      padding: 0;
      background-color: hsla(0, 0%, 100%, 0);
      background-size: cover;
      background-position: bottom;
      background-attachment: fixed;
      position: relative;
      margin: 1rem 15px;
      border: 15px solid #209a7e
    }

    @media (max-width:766px) {
      #page-Idea .idea-part .item {
        border-width: 10px;
        margin: 0;
        background-attachment: scroll;
        background-size: 100%;
        background-position: top
      }
    }

    #page-Idea .idea-part .item p.title {
      font-size: 3rem;
      font-weight: 400;
      text-shadow: 0 0 10px rgba(0, 0, 0, .5);
      color: #fff;
      margin: 1.5rem 1.5rem 15rem;
      line-height: 1;
      letter-spacing: .5rem;
      -webkit-writing-mode: vertical-lr;
      -ms-writing-mode: tb-lr;
      writing-mode: vertical-lr
    }

    #page-Idea .idea-part .item p.title:after {
      content: "\3002";
      vertical-align: super;
      letter-spacing: 0;
      margin-top: -15px
    }

    @media (max-width:766px) {
      #page-Idea .idea-part .item p.title {
        margin-bottom: 1.5rem
      }
    }

    #page-Idea .idea-part .item div.ctx {
      padding: 2rem 3rem;
      background-color: #fff;
      width: 100%;
      margin: 0
    }

    @media (max-width:766px) {
      #page-Idea .idea-part .item div.ctx {
        padding: 1rem
      }
    }

    #page-Idea .idea-part .item p.sub-title {
      font-size: 2rem;
      margin-bottom: 2rem;
      padding-bottom: 2rem;
      border-bottom: 1px solid #ccc;
      line-height: 2
    }

    @media (max-width:766px) {
      #page-Idea .idea-part .item p.sub-title {
        font-size: 1.2rem;
        font-weight: 700;
        text-align: center;
        margin-bottom: 1rem;
        padding-bottom: 1rem
      }
    }

    #page-Idea .idea-part .item p.text {
      font-size: 1rem;
      line-height: 2
    }


