@charset "utf-8";

html {
  font-size: 62.5%;
  overflow-x: hidden;
}
body {
  position: relative;
  width: 100%;
  line-height: 2;
  color: #ccc;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 500;
  font-family: "YakuHanJP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  line-height: 1.86;
  background-color: #131e3e;
  /*background-color: #ccc;*/
  text-align: center;
  font-feature-settings: "palt";
}

body.nosc {
  overflow: hidden;
}
@media screen and (max-width: 768px){
  body {
    width: 100%;
    min-width: 320px;
    font-size: 14px;
  }
}

.f-yumin { font-family: "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif; }
.f-poppins { font-family: 'Poppins', sans-serif; }

* {box-sizing: border-box;}

a {
  text-decoration: none;
  color: #84daef;
  transition: all 0.3s ease-out;
}
a:hover {
  text-decoration: none;
  color: #fff;
}
a:focus{overflow: visible;}

img {
  max-width: 100%;
  vertical-align: top;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.6;
  color: inherit;
}

ol, ul {
  margin: 0;
  padding: 0;
  font-family: inherit;
  list-style: none;
}

dl, dt, dd {
  margin: 0;
  padding: 0;
}

p {margin: 0;}

figure {
  margin: 0;
  padding: 0;
}

/* ------------------------------------
  Layout
------------------------------------ */
.l-wrapper {
  display: none;
  position: relative;
  min-width: 100%;
  background: rgba(0,0,0,0.25);
  transition: all  0.3s ease-out;
}
@media screen and (max-width: 768px) {
  .l-wrapper {
    min-width: 100%;
  }
}

.l-header {
}
.l-main {
}

.l-base {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 10px;
}
.l-base-s {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .l-base {
    max-width: 100%;
    padding: 0 20px;
  }
  .l-base-s {
    max-width: 100%;
    padding: 0 20px;
  }
}

/* ------------------------------------
  common
------------------------------------ */
.c-sp-only {
  display: none!important;
}
.c-sp-s-only {
  display: none!important;
}
@media screen and (max-width: 768px) {
  .c-pc-only {
    display: none!important;
  }
  .c-sp-only {
    display: inherit!important;
  }
}
@media screen and (max-width: 480px) {
  .c-sp-s-only {
    display: inherit!important;
  }
}

a.c-reverse {
  text-decoration: underline;
}
a.c-reverse:hover {
  text-decoration: none;
}

.c-anchor {
  margin-top: 20px;
  padding-top: -20px;
}

.c-opa {
  transition: all  0.3s ease-out;
}
.c-opa:hover {
  text-decoration: none!important;
  opacity: 0.6;
}
@media screen and (max-width: 768px) {
  .c-opa {
    transition: initial;
  }
  .c-opa:hover {
    opacity: 1;
  }
}

.c-heading {
  line-height: 1;
  margin-bottom: 40px;
  color: #fff;
}
.c-heading .en {
  display: block;
  font-size: 38px;
  font-size: 3.8rem;
  letter-spacing: 8px;
}
.c-heading .jp {
  display: block;
  padding-top: 12px;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 1.2px;
}
@media screen and (max-width: 768px) {
  .c-heading {
    margin-bottom: 40px;
  }
  .c-heading .en {
    font-size: 26px;
    font-size: 2.6rem;
    letter-spacing: 6.24px;
  }
  .c-heading .jp {
    padding-top: 12px;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 0.98px;
  }
}

.c-more {
  position: relative;
  padding-bottom: 18px;
  color: #fff;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1;
  letter-spacing: 1.75px;
  transition: all 0.3s ease;
}
.c-more:hover {
  color: #84daef;
}
.c-more::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  text-align: center;
  background-color: #fff;
  transition: all 0.3s ease;
}
.c-more:hover::before {
  background-color: #84daef;
}
@media screen and (max-width: 768px) {
  .c-more {
    padding-bottom: 8px;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 0.58;
    letter-spacing: 1.5px;
  }
}

.c-more_notice {
  position: relative;
  padding-bottom: 18px;
  padding-top: 18px;
  color: #fff;
  font-size: 12px;
  font-size: 2.2rem;
  /*line-height: 1;*/
  letter-spacing: 1.75px;
  transition: all 0.3s ease;
}

@media screen and (max-width: 768px) {
  .c-more_notice {
    padding-bottom: 8px;
    font-size: 12px;
    font-size: 1.2rem;
    /*line-height: 0.58;*/
    letter-spacing: 1.5px;
  }
}

.c-ico-pin {
   padding-left: 18px;
  background: url(../img/pin.svg) left center no-repeat ;
  background-size: 13px auto;
}

.c-overlay {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(19, 30, 62, .95);
  z-index: 100;
}
.c-modal {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  width: 900px;
  height: 500px;
  margin: 0 auto;
  display: none;
  z-index: 101;
}
.c-modal video {
  width: 100%;
  height: 100%;
}
.c-modal__close {
  position: absolute;
  right: -45px;
  top: -45px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .c-modal {
    width: 90vw;
    height: 90vw;
  }
  .c-modal__close {
    right: 0;
    top: 0;
  }
  .c-modal__close img {
    width: 20px;
  }
}

/* ------------------------------------
  main
------------------------------------ */
.main_bg video {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
}

/* kv */
.kv {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  padding: 0 20px;
  align-items: center;
  justify-content: center;
}
.kv__main {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 100%;
  line-height: 1;
  transform: translate(-50%, -50%);
  -webkit-font-smoothing: none;
  -webkit-font-smoothing: antialiased;
  -webkit-font-smoothing: subpixel-antialiased;
}
.kv__main.sc {
  position: absolute;
}
.kv__scroll {
  position: fixed;
  left: calc(50% - 22px);
  bottom: -100px;
  transition: all  0.3s ease-out;
}
.kv__scroll.on {
  bottom: 20px;
}
.kv__scroll.sc {
  position: absolute;
}
.kv__scroll:hover {
  bottom: 15px;
}
.kv__btn {
  margin-top: 25px;
}
@media screen and (max-width: 768px) {
  .kv__title img {
    width: 310px;
  }
  .kv__date img {
    width: 230px;
  }
  .kv__place {
    margin-top: 0px;
  }
  .kv__place img {
    width: 120px;
  }
  .kv__scroll {
    width: 36px;
    left: calc(50% - 18px);
  }
  .kv__scroll.on {
    bottom: 20px;
  }
  .kv__scroll.sc {
    position: absolute;
  }
  .kv__scroll:hover {
    bottom: 15px;
  }
  .kv__btn {
    width: 215px;
    margin: 13px auto 0;
  }
}

/* news */
.news {
  padding: 240px 0 0;
  background-color: #131e3e;
}
.news__container {
  display: flex;
}
.news__heading {
  width: 200px;
  text-align: left;
}
.news__list {
  width: calc(100% - 200px);
  text-align: left;
  color: #fff;
}
.news__list li {
  display: flex;
  padding-bottom: 30px;
  transition: all  0.3s ease-out;
}
.news__list li.last {
  padding-bottom: 40px;
}
.news__list.on li.last {
  padding-bottom: 30px;
}
.news__list li.none {
  display: none;
}
.news__list.on li.none {
  display: flex;
}
.news__listDate {
  position: relative;
  width: 225px;
  font-size: 14px;
  font-size: 1.4rem;
  letter-spacing: 1.75px;
  flex-shrink: 0;
}
.news__listDate::after {
  content: "";
  position: absolute;
  left: 110px;
  top: 14px;
  width: 80px;
  height: 1px;
  background-color: #898f9f;
}
.news__listText {
  width: calc(100% - 225px);
  line-height: 2;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 1.2px;
}
.news__listText a {
  color: #fff;
  transition: all 0.3s ease-out;
}
.news__listText a:hover {
  color: #84daef;
}
.news__listText_nolink a {
  color: #fff;
}

.news__listText_nolink a:hover {
  color: #84daef;
}
.news__more {
  padding-top: 0;
}
.news__close {
  display: none;
}
@media screen and (max-width: 768px) {
  .news {
    padding: 70px 0 35px;
  }
  .news__container {
    display: block;
  }
  .news__heading {
    width: 100%;
    margin-bottom: 20px;
  }
  .news__heading span {
    display: inline-block!important;
  }
  .news__list {
    width: 100%;
  }
  .news__list li {
    display: block;
    padding-bottom: 20px;
    flex-wrap: wrap;
  }
  .news__list.on li.last {
    padding-bottom: 20px;
  }
  .news__list li.none {
    display: none;
  }
  .news__list.on li.none {
    display: flex;
  }
  .news__listDate {
    position: relative;
    width: 100%;
    font-size: 11px;
    font-size: 1.2rem;
    letter-spacing: 1.5px;
  }
  .news__listDate::after {
    left: 90px;
    top: 10px;
    width: 40px;
  }
  .news__listText {
    width: 100%;
    line-height: 1.69;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 0.65px;
  }
  .news__more {
    padding-top: 0;
  }
}

/* about */
.about {
  min-height: 1530px;
  padding: 0 0 220px;
  background: url(../img/about_bg.png) center -120px no-repeat #131e3e;
}
.about__heading {
  margin-bottom: 25px;
  padding-top: 320px;
  font-size: 42px;
  line-height: 1.33;
  letter-spacing: 2.1px;
  color: #ffffff;
  text-shadow:0px 0px 10px #0e3c76;
}
.about__description {
  margin-bottom: 55px;
  font-size: 20px;
  line-height: 1.8;
  letter-spacing: 0.6px;
  color: #ffffff;
  text-shadow:0px 0px 14px #0e3c76;
}
.about__movie {
  display: flex;
  align-items: center;
  margin-bottom: 65px;
  padding: 30px;
  background: rgba(19, 30, 62, .8);
}
.about__movieL {
  position: relative;
  width: 320px;
}
.about__moviePlay {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.about__moviePlay a:hover {
  opacity: 0.9;
}
.about__movieR {
  width: calc(100% - 320px);
  text-align: left;
}
.about__movieText {
  margin-left: 35px;
  line-height: 2;
  text-align: left;
  color: #cccccc;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 1.2px;
}
@media screen and (max-width: 768px) {
  .about {
    min-height: 780px;
    padding: 0 0 220px;
    background: url(../img/about_bg_sp.jpg) center top no-repeat;
    background-size: cover;
  }
  .about__heading {
    margin-bottom: 10px;
    padding-top: 130px;
    font-size: 17px;
    line-height: 1.56;
    letter-spacing: -0.5px;
	  font-weight: 600;
  }
  .about__heading img {
    width: 342px;
  }
  .about__description {
    margin-bottom: 20px;
    font-size: 12px;
    line-height: 1.69;
    letter-spacing: -0.2px;
	  font-weight: 600;
  }
  .about__description img {
    width: 332px;
  }
  .about__movie {
    display: block;
    margin-bottom: 65px;
    padding: 20px;
  }
  .about__movieL {
    width: 100%;
    margin: 0 auto 10px;
  }
  .about__moviePlay {
    width: 43px;
    margin: 0 auto;
  }
  .about__movieR {
    width: 100%;
  }
  .about__movieText {
    margin-left: 0;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 1.64;
    letter-spacing: 0.83px;
  }
}

/* bg */
.bg {
  background: url(../img/bg.png) center top no-repeat #131e3e;
  background-size: cover;
}
@media screen and (max-width: 768px) {
}

/* contents */
.contents {
  padding: 190px 0 150px;
  background: rgba(0,0,0,.6);
}
.contents__heading {
  margin-bottom: 60px;
}
.contents__list {
  display: flex;
  flex-wrap: wrap;
  margin-left: -60px;
  text-align: left;
}
.contents__list li {
  width: calc(50% - 60px);
  margin: 0 0 45px 60px;
}
.contents__listImg {
  margin-bottom: 20px;
}
.contents__listTitle {
  margin-bottom: 2px;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 1.65px;
  color: #84daef;
}
.contents__listText {
  line-height: 2;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0.4px;
}
@media screen and (max-width: 768px) {
  .contents {
    padding: 80px 0 95px;
  }
  .contents__heading {
    margin-bottom: 30px;
  }
  .contents__list {
    display: block;
    margin-left: 0;
  }
  .contents__list li {
    width: 100%;
    margin: 0 0 25px 0;
  }
  .contents__listImg {
    margin-bottom: 10px;
  }
  .contents__listImg img {
    width: 100%;
  }
  .contents__listTitle {
    margin-bottom: 2px;
    font-size: 16px;
    font-size: 1.6rem;
    letter-spacing: 1.2px;
  }
  .contents__listText {
    line-height: 1.69;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 0.65px;
  }
}

/* originalGoods */
.originalGoods {
  padding: 200px 0 0;
}
.originalGoods__heading {
  margin-bottom: 60px;
}
.originalGoods__comingsoon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 180px;
  margin: 0 auto  40px;
  background-color: #060c20;
  font-size: 24px;
  font-size: 2.4rem;
  letter-spacing: 1.8px;
  color: #fff;
}
.originalGoods__list {
  display: flex;
  margin-bottom: 40px;
}
.originalGoods__list li {
  width: 260px;
  margin: 0 30px;
  background: #131e3e;
}
.originalGoods__text {
  margin-bottom: 40px;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 1.2px;
}
.originalGoods__more {}
@media screen and (max-width: 768px) {
  .originalGoods {
    padding: 80px 0 60px;
  }
  .originalGoods__heading {
    margin-bottom: 40px;
  }
  .originalGoods__comingsoon {
    width: calc(100% - 40px);
    height: 120px;
    margin: 0 auto 20px;
    font-size: 20px;
    font-size: 2.0rem;
    letter-spacing: 0.9px;
  }
  .originalGoods__list {
    margin-bottom: 30px;
  }
  .originalGoods__list li {
    width: 130px;
    margin: 0 15px;
  }
  .originalGoods__text {
    margin-bottom: 40px;
    font-size: 13px;
    font-size: 1.3rem;
    letter-spacing: 0.39px;
  }
  .originalGoods__more {}
}

/* music */
.music {
  padding: 200px 0 100px;
}
.music__heading {}
.music__list {
  display: flex;
  flex-wrap: wrap;
  margin-left: -60px;
}
.music__list li {
  width: calc(50% - 60px);
  margin-left: 60px;
}
.music__listImg {
  margin-bottom: 25px;
}
.music__listText {
  margin-bottom: 15px;
  text-align: left;
}
.music__listMore {}
@media screen and (max-width: 768px) {
}

/* outline */
.outline {
  padding: 200px 0 0;
}
.outline__heading {}
.outline__detail {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
  text-align: left;
  color: #fff;
}
.outline__detail dt {
  position: relative;
  width: 220px;
  padding-bottom: 35px;
  letter-spacing: 0.8px;
}
.outline__detail dt::after {
  content: "";
  position: absolute;
  left: 110px;
  top: 14px;
  width: 80px;
  height: 1px;
  background-color: #898f9f;
  letter-spacing: 0.8px;
}
.outline__detail dd {
  width: calc(100% - 220px);
  padding-bottom: 35px;
  letter-spacing: 0.8px;
}
.outline__detail dd .note {
  font-size: 14px;
  font-size: 1.4rem;
}
.outline__detailInner {
  display: flex;
}
.outline__detailL {
  width: 100px;
}
.outline__detailR {
  width: calc(100% - 100px);
  padding-left: 20px;
}
.outline__map {
  margin-bottom: 60px;
}
.outline__contact {
  text-align: left;
}
@media screen and (max-width: 768px) {
  .outline {
    padding: 80px 20px 0;
  }
  .outline__heading {}
  .outline__detail {
    display: block;
    margin-bottom: 10px;
  }
  .outline__detail dt {
    position: relative;
    width: 100%;
    padding-bottom: 2px;
  }
  .outline__detail dt::after {
    left: 90px;
    top: 13px;
    width: 40px;
  }
  .outline__detail dd {
    width: 100%;
    padding-bottom: 20px;
    line-height: 1.6;
  }
  .outline__detailL {
    width: 100px;
    padding-top: 5px;
  }
  .outline__detailR {
    width: calc(100% - 100px);
    padding-left: 20px;
  }
  .outline__map {
    margin-bottom: 30px;
  }
}

/* ticket */
.ticket {
  padding: 200px 0 100px;
}
.ticket__list {
  margin-bottom: 20px;
}
.ticket__list li {
  padding-bottom: 40px;
}
.ticket__text {
  margin-bottom: 55px;
  font-weight: bold;
}
.ticket__text span {
  font-size: 0.9em;
  font-weight: normal;
}
.ticket2__text {
  font-size: 0.9em;
}
.ticket3__text {
  font-size: 1.5em;
  margin-bottom: 40px;
  font-weight: bold;
	color: #DF6249;
}
.ticket__btn {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  .ticket {
    padding: 120px 20px 20px;
  }
  .ticket__list {
    margin-bottom: 10px;
  }
  .ticket__list li {
    padding-bottom: 20px;
  }
  .ticket__text {
    margin-bottom: 35px;
  }
	.ticket3__text {
  font-size: 1.2em;
  margin-bottom: 25px;
  font-weight: bold;
	color: #DF6249;
}
  .ticket__btn {
    width: 215px;
    margin: 0 auto 40px;
  }
}

/* cooperation */
.cooperation {
  padding: 100px 0 0;
}
.cooperation__heading {
  margin-bottom: 30px;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: bold;
  letter-spacing: 1.8px;
}
.cooperation__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-left: -16px;
}
.cooperation__list li {
  width: calc(100% / 6 - 16px);
  margin: 0 0 16px 16px;
}
@media screen and (max-width: 768px) {
  .cooperation {
    padding: 100px 0 110px;
  }
  .cooperation__heading {
    margin-bottom: 30px;
    font-size: 24px;
    font-size: 2.4rem;
    font-weight: bold;
    letter-spacing: 1.8px;
  }
  .cooperation__list {
    width: 280px;
    margin: 0 auto;
  }
  .cooperation__list li {
    width: 85px;
    margin: 0 4px 8px;
  }
}

/* twitter */
#twitter {
  padding: 140px 0;
}
@media screen and (max-width: 768px) {
  #twitter {
    padding: 100px 0;
  }
  #twitter__feed {
    width: 295px;
    margin: 0 auto;
  }
}

/* ------------------------------------
  header
------------------------------------ */
.header {
  position: absolute;
  top: -66px;
  left: 0;
  height: 66px;
  width: 100%;
  transition: all 0.3s ease-out;
  z-index: 99;
}
.header.on {
  top: 0;
}
.header.hide {
  opacity: 0;
  -webkit-transform: translate(0, -90px);
  -ms-transform: translate(0, -90px);
  transform: translate(0, -90px);
}
.header.sc {
  position: fixed;
  background-color: rgba(0,0,0,.8);
  z-index: 99;
}
.header__logo {
  display: none;
  position: absolute;
  left: 20px;
  top: 13px;
}
.header.sc .header__logo,
.header.sc .header__btn {
  display: block;
}
.header__menu {
  display: block;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.8px;
}
.l-main .header__menu {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.header__menu ul {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 66px;
}
.header__menu li {
  padding: 0 15px;
}
.header__menu li a {
  color: #fff;
  transition: all  0.3s ease-out;
}
.header__menu li img {
  vertical-align: middle;
}
.header__btn {
  display: none;
  position: absolute;
  right: 10px;
  top: 10px;
}
@media screen and (max-width: 768px) {
  .header {
    top: 0;
    height: 41px;
  }
  .nosc .header.sc {
    background: none;
  }
  .header__logo {
    left: 10px;
    top: 8px;
  }
  .header__logo img {
    width: 225px;
  }
  .header__menu {
    display: none;
    height: 100vh;
    width: 100%;
    background-color: rgba(19, 30, 62, 0.95);
  }
  .header__menu.on {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .header__menu ul {
    display: block;
    height: auto;
    font-size: 21px;
    font-size: 2,1rem;
    line-height: 2.19;
    letter-spacing: 1.05px;
  }
  .header__menu li {
    padding: 0 15px;
  }
  .header__menu li a {
    color: #fff;
    transition: all  0.3s ease-out;
  }
  .header__menu li img {
    vertical-align: middle;
  }
  .header__menuBtn {
    margin-top: 15px;
  }
  .header__menuBtn img {
    width: 215px;
  }
}

.header__menuWBtn {
  display: none;
}
@media screen and (max-width: 768px) {
  .header__menuWBtn {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 41px;
    height: 41px;
    z-index: 100;
    background-color: rgba(0,0,0,.8);
  }
  .header__menuWBtn a,
  .header__menuWBtn a span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
  }
  .header__menuWBtn a {
    position: relative;
    width: 20px;
    height: 13px;
    margin: 8px 5px;
  }
  .header__menuWBtn a span {
    position: absolute;
    left: 0px;
    width: 100%;
    height: 1px;
    background-color: #fff;
  }
  .header__menuWBtn a span:nth-of-type(1) {
    top: 0px;
  }
  .header__menuWBtn a span:nth-of-type(2) {
    top: 6px;
  }
  .header__menuWBtn a span:nth-of-type(3) {
    bottom: 0px;
  }
  .header__menuWBtn a.active span:nth-of-type(1) {
    -webkit-transform: translateY(6px) rotate(-45deg);
    transform: translateY(6px) rotate(-45deg);
  }
  .header__menuWBtn a.active span:nth-of-type(2) {
    opacity: 0;
  }
  .header__menuWBtn a.active span:nth-of-type(3) {
    -webkit-transform: translateY(-6px) rotate(45deg);
    transform: translateY(-6px) rotate(45deg);
  }
  .header__menuWBtn-menu {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1px;
    font-size: 10px;
  }
  .header__menuWBtn-close {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1px;
    font-size: 10px;
  }
}


/* ------------------------------------
  footer
------------------------------------ */
.footer {
  padding: 50px 0 45px;
  background-color: #060c20;
}
.footer__logo {
  margin-bottom: 40px;
}
.footer__copyright {
  font-size: 14px;
  font-size: 1.4rem;
  letter-spacing: 0.7px;
  color: rgba(255, 255, 255, 0.5);
}
@media screen and (max-width: 768px) {
  .footer {
    padding: 35px 0 20px;
  }
  .footer__logo {
    margin-bottom: 30px;
  }
  .footer__logo img {
    width: 130px;
  }
  .footer__copyright {
    font-size: 11px;
    font-size: 1.1rem;
    letter-spacing: 0.6px;
  }
}



@keyframes fadeIn {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
.c-fadeIn {
    animation-name: fadeIn;
    animation-duration: 3s;
    animation-timing-function: liner;
    animation-delay: 2s;
}

@media (max-width:767px) {
  #recent {
    /*margin-top: 80px;*/
    padding: 0 20px 110px;
  }
}

@media (min-width:768px) {
  #recent {
    padding: 200px 0 185px;
  }
}

/*#recent .recent__inner h3 {
  text-align: center
}

#recent .recent__inner h3 img {
  height: 18px;
  width: auto
}

@media (min-width:768px) {
  #recent .recent__inner h3 img {
    height: 20px
  }
}

#recent .recent__inner h3 span {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1;
  color: #fff
}
*/

#recent .recent__inner .recent__list {
  margin: 40px 0;
  display: flex;
  flex-wrap: wrap;

}

@media (max-width:767px) {
  #recent .recent__inner .recent__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 30px
  }
}

@media (max-width:767px) {
  #recent .recent__inner .recent__list li:first-child {
    width: 100%
  }
  #recent .recent__inner .recent__list li:nth-child(2) {
    margin-right: 4%
  }
  #recent .recent__inner .recent__list li:nth-child(n+2) {
    width: 48%;
    margin-top: 30px
  }
}

@media (min-width:768px) {
  #recent .recent__inner .recent__list li {
    display: inline-block;
    float: left;
    width: calc((100% - 60px)/ 3)
  }
  #recent .recent__inner .recent__list li:nth-child(n+2) {
    margin-left: 30px
  }
}

#recent .recent__inner .recent__list li a {
  display: block;
  text-align: center
}

#recent .recent__inner .recent__list li a .recent__thumb {
  display: block;
  border: 2px solid #c1ddff;
  border-radius: 10px;
  overflow: hidden
}

#recent .recent__inner .recent__list li a .recent__thumb .thumb {
  background: no-repeat center;
  background-size: cover;
  width: 100%;
  padding-top: 56.25%;
  -webkit-transition: .7s;
  -o-transition: .7s;
  transition: .7s
}

#recent .recent__inner .recent__list li a .recent__title {
  font-weight: 700;
  color: #fff;
  margin-top: 10px
}

#recent .recent__inner .recent__list li a:hover .recent__thumb .thumb {
  -webkit-transform: scale(1.07);
  -ms-transform: scale(1.07);
  transform: scale(1.07)
}

#recent .recent__inner .recent__more {
  display: block;
  text-align: center;
  margin-top: 20px
}

@media (min-width:768px) {
  #recent .recent__inner .recent__more {
    margin-top: 30px
  }
}

#recent .recent__inner .recent__more a {
  display: inline-block;
  font-weight: 700;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 10px;
  padding: 1px 10px;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}

#recent .recent__inner .recent__more a:hover {
  background-color: #fff;
  color: #020b15
}