@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap");
@import url(https://fonts.googleapis.com/earlyaccess/mplus1p.css);
@import url(https://fonts.googleapis.com/css?family=EB+Garamond);
@import url(https://fonts.googleapis.com/css?family=Montserrat);
@font-face {
  font-family: DINNLTP-B;
  src: url(../fonts/DINNLTP-B.otf);
}

@font-face {
  font-family: DINNLTP-B;
  src: url(../fonts/DINNLTP-B.woff);
}

@font-face {
  font-family: DINNLTP-B;
  src: url(../fonts/DINNLTP-B.woff2);
}

/* mixinの定義 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #FFF;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.loader {
  color: #006666;
  font-size: 50px;
  text-indent: -9999em;
  overflow: hidden;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -25px 0 0 -25px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
  animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}

@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@-webkit-keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.cssload-clock {
  border-radius: 54px;
  border: 3px solid black;
  height: 72px;
  width: 72px;
  position: relative;
  left: 35%;
  left: calc(50% - 39px);
  left: -o-calc(50% - 39px);
  left: -ms-calc(50% - 39px);
  left: -webkit-calc(50% - 39px);
  left: -moz-calc(50% - 39px);
}

.cssload-clock:after {
  content: "";
  position: absolute;
  background-color: black;
  top: 2px;
  left: 48%;
  height: 34px;
  width: 4px;
  border-radius: 4px;
  transform-origin: 50% 97%;
  -o-transform-origin: 50% 97%;
  -ms-transform-origin: 50% 97%;
  -webkit-transform-origin: 50% 97%;
  -moz-transform-origin: 50% 97%;
  animation: grdAiguille 2s linear infinite;
  -o-animation: grdAiguille 2s linear infinite;
  -ms-animation: grdAiguille 2s linear infinite;
  -webkit-animation: grdAiguille 2s linear infinite;
  -moz-animation: grdAiguille 2s linear infinite;
}

.cssload-clock:before {
  content: "";
  position: absolute;
  background-color: black;
  top: 5px;
  left: 48%;
  height: 31px;
  width: 4px;
  border-radius: 4px;
  transform-origin: 50% 94%;
  -o-transform-origin: 50% 94%;
  -ms-transform-origin: 50% 94%;
  -webkit-transform-origin: 50% 94%;
  -moz-transform-origin: 50% 94%;
  animation: ptAiguille 12s linear infinite;
  -o-animation: ptAiguille 12s linear infinite;
  -ms-animation: ptAiguille 12s linear infinite;
  -webkit-animation: ptAiguille 12s linear infinite;
  -moz-animation: ptAiguille 12s linear infinite;
}

@keyframes grdAiguille {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@-o-keyframes grdAiguille {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(360deg);
  }
}

@-ms-keyframes grdAiguille {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
  }
}

@-webkit-keyframes grdAiguille {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes grdAiguille {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}

@keyframes ptAiguille {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@-o-keyframes ptAiguille {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(360deg);
  }
}

@-ms-keyframes ptAiguille {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
  }
}

@-webkit-keyframes ptAiguille {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes ptAiguille {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}

.allloaded {
  opacity: 0;
  visibility: hidden;
}

* {
  box-sizing: border-box;
  font-family: source-han-sans-japanese, sans-serif;
  font-weight: 500;
  font-style: normal;
}

body {
  margin: 0;
  padding: 0;
  color: #000;
  overflow-x: hidden;
}

body a {
  text-decoration: none;
  color: #006666;
  transition: all .4s;
}

body a:hover, body a:active, body a:focus {
  color: black;
}

header.common {
  width: 100%;
  height: 60px;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
}

@media screen and (max-width: 768px) {
  header.common {
    width: calc(100% - 20px);
    margin: 0 auto;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

header.common h1 {
  width: 75px;
  height: 40px;
}

header.common h1 a {
  width: 100%;
  height: 100%;
  text-indent: -9999px;
  background: url("../images/logo_tvk.svg") no-repeat;
  background-size: cover;
  display: block;
}

header.common nav.pgNav {
  width: calc(1200px - 215px);
  height: 100%;
  padding: 0 0 0 50px;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -ms-flex-line-pack: center;
  align-content: center;
}

@media screen and (max-width: 1200px) {
  header.common nav.pgNav {
    width: calc(100% - 235px);
    padding: 0 0 0 40px;
  }
}

@media screen and (max-width: 768px) {
  header.common nav.pgNav {
    width: calc(100% - 105px);
    overflow-x: auto;
    padding: 0;
  }
}

header.common nav.pgNav ul {
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -ms-flex-line-pack: center;
  align-content: center;
}

@media screen and (max-width: 1000px) {
  header.common nav.pgNav ul {
    width: 100%;
  }
}

@media screen and (max-width: 768px) {
  header.common nav.pgNav ul {
    display: flex;
    /* Safari */
    display: flex;
    -webkit-flex-wrap: nowrap;
    /* Safari */
    flex-wrap: nowrap;
  }
}

header.common nav.pgNav ul li {
  margin: 0 50px 0 0;
}

@media screen and (max-width: 1200px) {
  header.common nav.pgNav ul li {
    margin: 0 30px 0 0;
  }
}

@media screen and (max-width: 1000px) {
  header.common nav.pgNav ul li {
    margin: 0 30px 5px 0;
  }
}

header.common nav.pgNav ul li a {
  font-size: 1.5rem;
  color: #000;
  white-space: nowrap;
  color: #000;
  transition: all .4s;
}

header.common nav.pgNav ul li a:hover, header.common nav.pgNav ul li a:active {
  color: #FAB000;
  text-decoration: underline;
}

header.common nav.pgNav ul li a:focus {
  color: #DC000C;
  text-decoration: underline;
}

header.common nav.mainNav {
  width: 140px;
  height: 50px;
  background: #000;
  border-radius: 0 0 5px 5px;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  transform: translateY(-10px);
}

@media screen and (max-width: 768px) {
  header.common nav.mainNav {
    width: 100%;
    border-radius: none;
    position: fixed;
    bottom: 0px;
    left: 0;
    z-index: 100;
    transform: translate(0);
    border-radius: 0;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

header.common nav.mainNav a.program, header.common nav.mainNav a.search {
  width: 70px;
  display: block;
  font-size: 1.3rem;
  color: #FFF;
  text-align: center;
}

header.common nav.mainNav a.program:before, header.common nav.mainNav a.search:before {
  width: 17px;
  height: 17px;
  content: '';
  display: block;
  margin: 7px auto;
}

header.common nav.mainNav a.program.program:before, header.common nav.mainNav a.search.program:before {
  background: url("../images/icon/program.svg") no-repeat;
}

header.common nav.mainNav a.program.search:before, header.common nav.mainNav a.search.search:before {
  background: url("../images/icon/search.svg") no-repeat;
}

header.common nav.mainNav label {
  display: none;
}

@media screen and (max-width: 768px) {
  header.common nav.mainNav label {
    display: block;
  }
}

.spNav {
  display: none;
}

@media screen and (max-width: 768px) {
  .spNav {
    display: block;
    width: 100%;
    height: auto;
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    position: fixed;
    bottom: calc(0px + 50px);
    box-sizing: border-box;
    z-index: 1;
  }
  .spNav dl {
    border-radius: 5px;
    border: 2px solid #000;
    margin: 0 0 20px;
  }
  .spNav dl:nth-child(2) {
    margin: 0;
  }
  .spNav dl dt {
    width: 100%;
    text-align: center;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    padding: 10px 0;
    color: #FFF;
    font-size: 1.8rem;
    background: #000;
    border-radius: 5px 5px 0 0;
  }
  .spNav dl dd {
    width: 100%;
  }
  .spNav dl:first-child {
    background: #FFF;
  }
  .spNav dl:first-child a {
    color: #000;
    transition: all .4s;
    display: block;
    padding: 20px;
    font-size: 1.4rem;
  }
  .spNav dl:first-child a:hover, .spNav dl:first-child a:active {
    color: #FAB000;
    text-decoration: underline;
  }
  .spNav dl:first-child a:focus {
    color: #DC000C;
    text-decoration: underline;
  }
  .spNav dl:last-child {
    background: #0057AA;
  }
  .spNav dl:last-child a {
    color: #FFF;
    display: block;
    padding: 25px;
    font-size: 1.5rem;
  }
  .spNav ul {
    display: flex;
    /* Safari */
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    /* Safari */
    flex-wrap: wrap;
  }
  .spNav ul:first-child li {
    width: 50%;
  }
  .spNav ul:first-child li:nth-child(odd) {
    border-bottom: 1px dashed #000;
    border-right: 1px dashed #000;
  }
  .spNav ul:first-child li:nth-child(even) {
    border-bottom: 1px dashed #000;
  }
  .spNav ul:first-child li:last-child {
    border-bottom: none;
    border-right: none;
  }
  .spNav ul:last-child li {
    width: 50%;
  }
}

.cntNav {
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  background: #0057AA;
}

@media screen and (max-width: 768px) {
  .cntNav {
    display: none;
  }
}

.cntNav nav {
  width: 1200px;
  margin: 0 auto;
}

.cntNav nav ul {
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  padding: 0 0 0 125px;
}

.cntNav nav ul li {
  margin: 0 50px 0 0;
}

.cntNav nav ul li a {
  color: #FFF;
  transition: all .4s;
  font-size: 1.5rem;
  height: 40px;
  line-height: 40px;
}

.cntNav nav ul li a:hover, .cntNav nav ul li a:active {
  color: #FFEC00;
  text-decoration: underline;
}

.cntNav nav ul li a:focus {
  color: #DC000C;
  text-decoration: underline;
}

section.oderWrap {
  display: flex;
  flex-flow: row wrap;
}

section.SlideView {
  width: 100%;
  padding: 30px 0;
  order: 1;
}

@media screen and (max-width: 768px) {
  section.SlideView {
    padding: 0;
    order: 2;
  }
}

section.SlideView .slideList {
  padding: 0;
  position: relative;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

section.SlideView .slideList .slick-slide {
  width: 800px !important;
  height: 450px;
  margin: 10px;
  position: relative;
  transform: scale(1);
  transition: all .3s;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

@media screen and (max-width: 768px) {
  section.SlideView .slideList .slick-slide {
    width: calc(100vw - 20px) !important;
    height: auto;
  }
}

section.SlideView .slideList .slick-slide a {
  margin: 0;
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: relative;
}

section.SlideView .slideList .slick-slide a figure {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

section.SlideView .slideList .slick-slide a figure:before {
  content: '';
  position: absolute;
  bottom: 0;
  z-index: 2;
  width: 100%;
  height: 110px;
  background: linear-gradient(0deg, #80C6EF, #FFF);
  background-size: 100%;
  background-position: 0 0;
  transition: all .2s ease-out;
  mix-blend-mode: multiply;
  border-radius: 0 0 5px 5px;
}

section.SlideView .slideList .slick-slide a figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: all .4s;
}

section.SlideView .slideList .slick-slide a:hover figure img {
  transform: scale(1.2);
  transition: all .3s;
}

section.SlideView .slideList .slick-slide a article {
  width: 100%;
  height: 110px;
  padding: 30px;
  position: absolute;
  bottom: 0;
  z-index: 2;
}

@media screen and (max-width: 768px) {
  section.SlideView .slideList .slick-slide a article {
    padding: 10px;
    height: auto;
  }
}

section.SlideView .slideList .slick-slide a article h3 {
  font-size: 2.8rem;
  margin: 0 0 10px;
  font-weight: 600;
  letter-spacing: .2rem;
  color: #FFF;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
  text-align: right;
  position: relative;
  z-index: 4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  section.SlideView .slideList .slick-slide a article h3 {
    font-size: 1.7rem;
  }
}

section.SlideView .slideList .slick-slide a article p {
  font-size: 1.8rem;
  color: #FFF;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
  font-weight: 600;
  text-align: right;
}

@media screen and (max-width: 768px) {
  section.SlideView .slideList .slick-slide a article p {
    font-size: 1.3rem;
  }
}

section.SlideView .slideList .slick-active:after {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
  content: '';
  border-radius: 5px;
}

section.SlideView .slideList .slick-current {
  transform-origin: bottom;
  transition: all .3s;
  position: relative;
  z-index: 20;
}

section.SlideView .slideList .slick-current:after {
  display: none;
}

section.oaList {
  width: 980px;
  height: 60px;
  margin: 60px auto;
  position: relative;
  order: 2;
}

@media screen and (max-width: 1000px) {
  section.oaList {
    width: calc(100% - 10px);
  }
}

@media screen and (max-width: 768px) {
  section.oaList {
    order: 1;
    margin: 0 auto;
  }
}

section.oaList .barNews {
  border-radius: 30px;
  height: 60px;
  border: 2px solid #000;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews {
    border-radius: 25px;
    height: 50px;
  }
}

section.oaList .barNews dt {
  width: 150px;
  height: 100%;
  position: relative;
  font-size: 1.8rem;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dt {
    width: 100px;
    font-size: 1.5rem;
  }
}

section.oaList .barNews dt em {
  position: absolute;
  top: -2px;
  left: -2px;
  background: #0057AA;
  color: #FFF;
  width: 150px;
  height: 60px;
  line-height: 56px;
  border: 2px solid #000;
  border-radius: 30px;
  text-align: center;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dt em {
    width: 100px;
    height: 50px;
    line-height: 46px;
    border-radius: 25px;
  }
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dt span {
    display: none;
  }
}

section.oaList .barNews dt:before {
  position: absolute;
  width: 15px;
  height: 15px;
}

section.oaList .barNews dd {
  width: calc(100% - 150px);
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dd {
    width: calc(100% - 100px);
  }
}

section.oaList .barNews dd ul {
  width: 770px;
  height: 56px;
  padding: 0 0 0 20px;
  overflow: hidden;
}

@media screen and (max-width: 1000px) {
  section.oaList .barNews dd ul {
    width: calc(100% - 36px);
  }
}

section.oaList .barNews dd ul li {
  width: 730px;
  height: 56px;
  line-height: 56px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dd ul li {
    height: 46px;
    line-height: 46px;
  }
}

section.oaList .barNews dd ul li a {
  color: #000;
  transition: all .4s;
  font-size: 1.8rem;
}

section.oaList .barNews dd ul li a:hover, section.oaList .barNews dd ul li a:active {
  color: #FAB000;
  text-decoration: underline;
}

section.oaList .barNews dd ul li a:focus {
  color: #DC000C;
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dd ul li a {
    font-size: 1.5rem;
  }
}

section.oaList .barNews dd #onairPg {
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.8rem;
  width: 100%;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dd #onairPg {
    font-size: 1.3rem;
  }
}

section.oaList .barNews dd #onairPg dt {
  width: 80px;
  padding: 0 0 0 20px;
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dd #onairPg dt {
    width: 60px;
    padding: 0 0 0 10px;
  }
}

section.oaList .barNews dd #onairPg dd {
  width: calc(100% - 100px);
}

@media screen and (max-width: 768px) {
  section.oaList .barNews dd #onairPg dd {
    width: calc(100% - 80px);
  }
}

section.oaList .arrowBtnNxt {
  position: absolute;
  right: 5px;
  top: 5px;
  z-index: 20;
  width: 50px;
  height: 50px;
  border-radius: 25px;
  border: 2px solid #000;
  background: #0057AA;
  transition: all .3s;
  display: none;
}

@media screen and (max-width: 768px) {
  section.oaList .arrowBtnNxt {
    width: 40px;
    height: 40px;
    border-radius: 20px;
  }
}

section.oaList .arrowBtnNxt:after {
  content: '';
  display: block;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 50%;
  left: 50%;
  transition: all .4s;
  width: 10px;
  height: 10px;
  margin: -6px 0 0 -9.5px;
  border-right: 4px solid #FFF;
  border-bottom: 4px solid #FFF;
}

@media screen and (max-width: 768px) {
  section.oaList .arrowBtnNxt:after {
    margin: -6px 0 0 -9.5px;
  }
}

section.oaList .arrowBtnNxt:hover {
  transition: all .2s;
  background: #FAB000;
}

section.oaList .arrowBtnNxt:hover:after {
  left: 60%;
  transition: all .2s;
}

section.oaList:before {
  width: 165px;
  height: 235px;
  content: '';
  background: url("../images/illust/kanagawani_close.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -135px;
  top: -110px;
}

@media screen and (max-width: 768px) {
  section.oaList:before {
    display: none;
  }
}

section.adArea {
  padding: 20px 0 50px;
}

section.adArea .pcBnr {
  display: block;
}

section.adArea .spBnr {
  display: none;
}

@media screen and (max-width: 1000px) {
  section.adArea {
    padding: 20px 0;
  }
  section.adArea .pcBnr {
    display: none;
  }
  section.adArea .spBnr {
    display: block;
    width: 300px;
    margin: 0 auto;
  }
}

section.adArea .googleBnr {
  width: 970px;
  height: 90px;
  background: #BDBEBF;
  display: block;
  margin: 0 auto;
  color: #FFF;
  font-size: 1.5rem;
  text-align: center;
  line-height: 90px;
}

@media screen and (max-width: 768px) {
  section.adArea .googleBnr {
    width: 300px;
    height: 200px;
    margin: 0 auto;
    line-height: 200px;
  }
}

section.bigBnr {
  padding: 0 0 50px;
}

section.bigBnr a {
  display: block;
  /*width: 970px; bigsize*/
	width: 728px;
  margin: 0 auto;
}

@media screen and (max-width: 1000px) {
  section.bigBnr a {
    width: calc(100% - 20px);
  }
}

section.bigBnr a img {
  width: 100%;
}

section.mvList {
  height: 530px;
  position: relative;
  background: linear-gradient(0deg, #80C6EF, #FFF);
  background-size: 100%;
  background-position: 0 0;
  transition: all .2s ease-out;
}

section.mvList header {
  padding: 30px 0;
}

section.mvList header h2 {
  width: 300px;
  height: 50px;
  background: #FFF;
  border-radius: 25px;
  line-height: 50px;
  margin: 0 auto;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  display: block;
  position: relative;
  font-size: 2.8rem;
  font-weight: 500;
  text-align: center;
}

section.mvList header h2:before {
  position: absolute;
  width: 40px;
  height: 70px;
  content: '';
  background: url("../images/illust/tonebirds.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -60px;
  top: -10px;
}

section.mvList header h2:after {
  position: absolute;
  width: 28px;
  height: 16px;
  content: '';
  background: url("../images/illust/fukidashi.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -15px;
  bottom: 5px;
}

@media screen and (max-width: 768px) {
  section.mvList header h2 {
    width: calc(100% - 80px);
    margin: 0 10px 0 auto;
  }
}

section.mvList .mvListWrap {
  padding: 0;
  position: relative;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

section.mvList .mvListWrap img {
  opacity: 0;
}

section.mvList .mvListWrap .slick-slide {
  width: 350px !important;
  height: 200px;
  margin: 40px 0;
  position: relative;
  transform: scale(1);
  transition: all .3s;
}

@media screen and (max-width: 768px) {
  section.mvList .mvListWrap .slick-slide {
    width: calc(100vw - 140px) !important;
    height: auto;
  }
}

section.mvList .mvListWrap .slick-slide a {
  margin: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 2px solid #000;
  border-radius: 7px;
  cursor: pointer;
  position: relative;
}

section.mvList .mvListWrap .slick-slide a figure {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  overflow: hidden;
}

section.mvList .mvListWrap .slick-slide a figure:before {
  content: '';
  position: absolute;
  bottom: 0;
  z-index: 2;
  width: 100%;
  height: 20%;
  background: linear-gradient(0deg, #000, #FFF);
  background-size: 100%;
  background-position: 0 0;
  transition: all .2s ease-out;
  mix-blend-mode: multiply;
  border-radius: 0 0 5px 5px;
}

section.mvList .mvListWrap .slick-slide a figure img {
  width: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: all .4s;
  opacity: 1;
  height: 180px;
}

@media screen and (max-width: 768px) {
  section.mvList .mvListWrap .slick-slide a figure img {
    height: 100%;
  }
}

section.mvList .mvListWrap .slick-slide a:hover {
  border: 2px solid #FAB000;
}

section.mvList .mvListWrap .slick-slide a:hover figure img {
  transform: scale(1.2);
  transition: all .3s;
}

section.mvList .mvListWrap .slick-slide a article {
  width: 100%;
  position: absolute;
  bottom: 0;
  z-index: 2;
}

section.mvList .mvListWrap .slick-slide a article h3 {
  font-size: 1.3rem;
  letter-spacing: .2rem;
  line-height: 1.8rem;
  padding: 15px 15px 0 15px;
  color: #FFF;
}

@media screen and (max-width: 768px) {
  section.mvList .mvListWrap .slick-slide a article h3 {
    font-size: 1rem;
    line-height: 1.4rem;
    padding: 5px;
  }
}

section.mvList .mvListWrap .slick-slide a article p {
  display: none;
}

section.mvList .mvListWrap .slick-slide a article time {
  display: block;
  text-align: right;
  padding: 0 15px 15px;
}

section.mvList .mvListWrap .slick-current {
  transform: scale(1.4);
  transform-origin: middle;
  transition: all .3s;
  position: relative;
  z-index: 20;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

section.mvList:after {
  width: 230px;
  height: 110px;
  content: '';
  display: block;
  background: url("../images/illust/kanagawani_sleep.svg") no-repeat;
  background-size: contain;
  position: absolute;
  right: 20px;
  bottom: 0px;
  animation: cloudmove 2s ease-in-out -13s infinite alternate;
}

section.mvList .sky {
  bottom: -110px;
}

section.topNews header {
  padding: 30px 0;
}

section.topNews header h2 {
  width: 160px;
  height: 50px;
  background: #FFF;
  border-radius: 25px;
  line-height: 50px;
  margin: 0 auto;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  display: block;
  position: relative;
  font-size: 2.8rem;
  font-weight: 500;
  text-align: center;
}

section.topNews header h2:before {
  position: absolute;
  width: 40px;
  height: 70px;
  content: '';
  background: url("../images/illust/tonebirds.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -60px;
  top: -10px;
}

section.topNews header h2:after {
  position: absolute;
  width: 28px;
  height: 16px;
  content: '';
  background: url("../images/illust/fukidashi.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -15px;
  bottom: 5px;
}

section.topNews .newsList {
  width: 1220px;
  margin: 0 auto;
}

@media screen and (max-width: 1200px) {
  section.topNews .newsList {
    width: calc(100% - 20px);
  }
}

section.topNews .newsList ul {
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media screen and (max-width: 768px) {
  section.topNews .newsList ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

section.topNews .newsList ul li {
  width: 285px;
  margin: 10px;
}

@media screen and (max-width: 768px) {
  section.topNews .newsList ul li {
    width: calc(50% - 5px);
    margin: 10px 0;
  }
}

section.topNews .newsList ul li a {
  width: 100%;
  height: 100%;
  display: block;
  color: #000;
  transition: all .4s;
}

section.topNews .newsList ul li a:hover, section.topNews .newsList ul li a:active {
  color: #FAB000;
  text-decoration: underline;
}

section.topNews .newsList ul li a:focus {
  color: #DC000C;
  text-decoration: underline;
}

section.topNews .newsList ul li a figure .thumb {
  width: 100%;
  height: 160px;
  border-radius: 5px;
  border: 2px solid #000;
  display: block;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  section.topNews .newsList ul li a figure .thumb {
    height: 100px;
  }
}

section.topNews .newsList ul li a figure .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

section.topNews .newsList ul li a figure figcaption {
  font-size: 1.5rem;
  line-height: 2.1rem;
  font-weight: 200;
  padding: 10px 0 0;
}

section.topNews .newsList ul li a:hover figure .thumb {
  border: 2px solid #FAB000;
}

section.infoList {
  padding: 120px 0 120px;
  background: #9DD7ED;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 768px) {
  section.infoList {
    padding: 120px 0 240px;
  }
}

section.infoList header {
  padding: 30px 0;
}

section.infoList header h2 {
  width: 380px;
  height: 50px;
  background: #FFF;
  border-radius: 25px;
  line-height: 50px;
  margin: 0 auto;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  display: block;
  position: relative;
  font-size: 2.8rem;
  font-weight: 500;
  text-align: center;
}

section.infoList header h2:before {
  position: absolute;
  width: 40px;
  height: 70px;
  content: '';
  background: url("../images/illust/tonebirds.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -60px;
  top: -10px;
}

section.infoList header h2:after {
  position: absolute;
  width: 28px;
  height: 16px;
  content: '';
  background: url("../images/illust/fukidashi.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -15px;
  bottom: 5px;
}

@media screen and (max-width: 768px) {
  section.infoList header h2 {
    width: calc(100% - 80px);
    margin: 0 10px 0 auto;
  }
}

section.infoList .inner {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

@media screen and (max-width: 1200px) {
  section.infoList .inner {
    width: 100%;
  }
}

section.infoList .inner li {
  width: 285px;
  height: 90px;
  border-radius: 3px;
  border: 2px solid #000;
  margin: 0 20px 20px 0;
  background: #FFF;
}

section.infoList .inner li:nth-child(4n)/*, section.infoList .inner li:nth-child(8), section.infoList .inner li:nth-child(12), section.infoList .inner li:nth-child(16)*/ {
  margin: 0 0 20px 0;
}

@media screen and (max-width: 1200px) {
  section.infoList .inner li:nth-child(4n)/*, section.infoList .inner li:nth-child(8), section.infoList .inner li:nth-child(12), section.infoList .inner li:nth-child(16)*/ {
    margin: 10px;
  }
}

@media screen and (max-width: 1200px) {
  section.infoList .inner li {
    width: calc((100% / 4) - 20px);
    margin: 10px;
    height: auto;
  }
}

@media screen and (max-width: 1000px) {
  section.infoList .inner li {
    width: calc((100% / 3) - 20px);
    margin: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.infoList .inner li {
    width: calc(100% - 20px);
    margin: 10px auto;
  }
}

section.infoList .inner li a {
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
  position: relative;
}

section.infoList .inner li a figure {
  width: 200%;
  height: 100%;
  transform: translate3d(0, 0, 0);
  transition: .3s all;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
}

section.infoList .inner li a figure span {
  width: 50%;
  height: 100%;
  display: block;
}

section.infoList .inner li a figure span img {
  width: 100%;
  height: 100%;
}

section.infoList .inner li a figure figcaption {
  background: url("../images/illust/kanagawani_song_opacity.png") no-repeat top right 20px;
  background-size: 50% auto;
  width: 50%;
  height: 100%;
  padding: 5px 10px;
  font-size: 1.4rem;
  line-height: 2rem;
  position: relative;
}

section.infoList .inner li a figure figcaption p {
  word-break: break-all;
  /** 3行以上で省略 */
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  /** webkit以外のフォールバック */
  max-height: calc(2.1rem*3);
}

section.infoList .inner li a figure figcaption:after {
  content: '©︎tvk/ROBOT';
  position: absolute;
  right: 3px;
  bottom: 0px;
  font-size: 1rem;
}

section.infoList .inner li a:hover figure {
  transform: translate3d(-50%, 0, 0);
  transition: .3s all;
}

section.infoList .sky.top {
  top: -70px;
}

section.infoList .sky.bottom {
  bottom: -110px;
}

section.snsList .inner {
  width: 1200px;
  margin: 0 auto;
  padding: 25px 0;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

@media screen and (max-width: 1200px) {
  section.snsList .inner {
    width: 100%;
  }
}

section.snsList .inner header {
  width: 320px;
}

@media screen and (max-width: 768px) {
  section.snsList .inner header {
    transform: translateY(-150px);
  }
}

section.snsList .inner header h2 {
  width: 165px;
  height: 50px;
  background: #FFF;
  border-radius: 25px;
  line-height: 50px;
  margin: 0 0 0 auto;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  display: block;
  position: relative;
  font-size: 2.8rem;
  font-weight: 500;
  text-align: center;
}

section.snsList .inner header h2:before {
  position: absolute;
  width: 172px;
  height: 170px;
  content: '';
  background: url("../images/illust/kanagawani_base.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -150px;
  top: -60px;
}

section.snsList .inner header h2:after {
  position: absolute;
  width: 28px;
  height: 16px;
  content: '';
  background: url("../images/illust/fukidashi.svg") no-repeat;
  background-size: contain;
  position: absolute;
  left: -15px;
  bottom: 5px;
}

section.snsList .inner header h2:before {
  z-index: 11;
  animation: cloudmove 2s ease-in-out -13s infinite alternate;
}

section.snsList .inner .twWall {
  width: calc(100% - 640px);
  height: 400px;
  overflow-y: auto;
  margin: 0 0 0 20px;
}

@media screen and (max-width: 768px) {
  section.snsList .inner .twWall {
    width: calc(100% - 20px);
    padding: 0 0 120px;
    transform: translateY(-50px);
    margin: 0 auto;
  }
}

section.snsList .inner .icons {
  width: calc(100% - 640px);
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
}

@media screen and (max-width: 768px) {
  section.snsList .inner .icons {
    width: 100%;
    padding: 0 0 120px;
    transform: translateY(-50px);
  }
}

section.snsList .inner .icons a {
  width: 40px;
  height: 40px;
  margin: 0 15px;
  display: block;
  text-indent: -9999px;
}

section.snsList .inner .icons a.ico-tw {
  background: url("../images/icon/twitter.svg") no-repeat center center;
  background-size: contain;
}

section.snsList .inner .icons a.ico-ins {
  background: url("../images/icon/Instagram.png") no-repeat center center;
  background-size: contain;
}

section.snsList .inner .icons a.ico-line {
  background: url("../images/icon/line.svg") no-repeat center center;
  background-size: contain;
}

section.snsList .inner .icons a.ico-fb {
  background: url("../images/icon/facebook.svg") no-repeat center center;
  background-size: contain;
}

section.snsList .inner .icons a.ico-tt {
  background: url("../images/icon/tiktok.svg") no-repeat center center;
  background-size: contain;
}

section.snsList .inner .nipponmaru {
  width: 300px;
  position: relative;
}

section.snsList .inner .nipponmaru img {
  position: absolute;
  bottom: -55px;
  right: 0px;
  width: 220px;
  height: 157px;
  animation: cloudmove 2s ease-in-out -13s infinite alternate;
}

section.externalBnr {
  padding: 85px 0 400px;
  background: #80C6EF url("../images/bg_sea_wave.png") repeat;
  background-size: 64px 54px;
}

section.externalBnr .inner {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

@media screen and (max-width: 1200px) {
  section.externalBnr .inner {
    width: 100%;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
}

section.externalBnr .inner li {
  width: 285px;
  height: 90px;
  border-radius: 3px;
  border: 2px solid #000;
  margin: 0 20px 20px 0;
  background: #FFF;
}

section.externalBnr .inner li:nth-child(4), section.externalBnr .inner li:nth-child(8), section.externalBnr .inner li:nth-child(12), section.externalBnr .inner li:nth-child(16) {
  margin: 0 0 20px 0;
}

@media screen and (max-width: 1200px) {
  section.externalBnr .inner li:nth-child(4), section.externalBnr .inner li:nth-child(8), section.externalBnr .inner li:nth-child(12), section.externalBnr .inner li:nth-child(16) {
    margin: 10px;
  }
}

@media screen and (max-width: 1200px) {
  section.externalBnr .inner li {
    width: calc((100% / 4) - 20px);
    margin: 10px;
    height: auto;
  }
}

@media screen and (max-width: 1000px) {
  section.externalBnr .inner li {
    width: calc((100% / 3) - 20px);
    margin: 10px;
  }
}

@media screen and (max-width: 768px) {
  section.externalBnr .inner li {
    width: calc(100% - 20px);
    margin: 10px auto;
  }
}

section.externalBnr .inner li a img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

footer {
  background: #F4F4F4;
  position: relative;
}

footer .inner {
  padding: 40px 0;
  width: 1200px;
  margin: 0 auto;
  position: relative;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

@media screen and (max-width: 1200px) {
  footer .inner {
    width: calc(100% - 20px);
    padding: 80px 0 20px;
  }
}

footer .inner ul {
  width: 50%;
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  footer .inner ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: calc(100% - 20px);
    margin: 0 auto;
    position: relative;
    z-index: 10;
  }
}

footer .inner ul li {
  margin: 1rem 0;
}

@media screen and (max-width: 768px) {
  footer .inner ul li {
    width: calc(50% - 5px);
    border-bottom: 1px solid #0057AA;
    margin: 0;
  }
}

footer .inner ul li a {
  color: #0057AA;
  transition: all .4s;
  font-size: 1.5rem;
  padding: 0 20px;
  border-right: 1px solid #0057AA;
  font-weight: 500;
}

footer .inner ul li a:hover, footer .inner ul li a:active, footer .inner ul li a:focus {
  color: #002344;
  text-decoration: underline;
}

@media screen and (max-width: 768px) {
  footer .inner ul li a {
    font-size: 1.3rem;
    display: block;
    border: none;
    padding: 10px 0;
    width: 100%;
  }
}

footer .inner:after {
  width: 190px;
  height: 205px;
  content: '';
  background: url("../images/illust/kanagawani_camera.svg") no-repeat;
  display: block;
  position: absolute;
  left: 0;
  top: -195px;
}

@media screen and (max-width: 768px) {
  footer .inner:after {
    display: none;
  }
}

footer:after {
  width: 50%;
  height: 430px;
  display: block;
  position: absolute;
  left: 50%;
  top: -310px;
  content: '';
  background: url("../images/illust/footer_mm21.svg") no-repeat;
  background-size: auto 100%;
}

@media screen and (max-width: 768px) {
  footer:after {
    width: 100%;
    height: 260px;
    left: 0px;
    top: -180px;
    background-size: 100% auto;
  }
}

footer .copyright {
  padding: 0 0 40px 0;
  text-align: center;
  font-weight: 500;
}

.sky {
  width: 100%;
  height: 190px;
  position: absolute;
  overflow: hidden;
}

.sky .clouds {
  width: calc(100% + 60px);
  height: 190px;
  margin: 0 0 0 -30px;
  padding: 10px 0 0;
}

.sky .clouds .cloud {
  display: inline-block;
  border-radius: 100px;
  vertical-align: top;
  animation: cloudmove 2s ease-in-out -13s infinite alternate;
}

.sky .clouds .cloud.big {
  border: solid 65px white;
}

.sky .clouds .cloud.mid {
  border: solid 45px white;
}

.sky .clouds .cloud.sml {
  border: solid 35px white;
}

.sky .clouds .cloud:nth-child(1) {
  animation-delay: 2.3s;
  margin: 0;
}

.sky .clouds .cloud:nth-child(2) {
  animation-duration: 1.9s;
  margin-top: 45px;
  margin-left: -42px;
}

.sky .clouds .cloud:nth-child(3) {
  animation-duration: 2.2s;
  margin-top: 30px;
  margin-left: -50px;
}

.sky .clouds .cloud:nth-child(4) {
  animation-duration: 1.8s;
  margin-top: 55px;
  margin-left: -42px;
}

.sky .clouds .cloud:nth-child(5) {
  animation-duration: 2.5s;
  margin-top: 30px;
  margin-left: -37px;
}

.sky .clouds .cloud:nth-child(6) {
  animation-delay: 2.3s;
  margin-top: 22px;
  margin-left: -21px;
}

.sky .clouds .cloud:nth-child(7) {
  animation-duration: 1.9s;
  margin-top: 22px;
  margin-left: -18px;
}

.sky .clouds .cloud:nth-child(8) {
  animation-duration: 2.2s;
  margin-top: 15px;
  margin-left: -15px;
}

.sky .clouds .cloud:nth-child(9) {
  animation-duration: 1.8s;
  margin-top: 30px;
  margin-left: -55px;
}

.sky .clouds .cloud:nth-child(10) {
  animation-duration: 2.5s;
  margin-top: 53px;
  margin-left: -46px;
}

.sky .clouds .cloud:nth-child(11) {
  animation-delay: 2.3s;
  margin-top: 22px;
  margin-left: -20px;
}

.sky .clouds .cloud:nth-child(12) {
  animation-duration: 1.9s;
  margin-top: 43px;
  margin-left: -40px;
}

.sky .clouds .cloud:nth-child(13) {
  animation-duration: 2.2s;
  margin-top: 22px;
  margin-left: -18px;
}

.sky .clouds .cloud:nth-child(14) {
  animation-duration: 1.8s;
  margin-top: 40px;
  margin-left: -25px;
}

.sky .clouds .cloud:nth-child(15) {
  animation-duration: 2.5s;
  margin-top: 22px;
  margin-left: -45px;
}

.sky .clouds .cloud:nth-child(16) {
  animation-delay: 2.3s;
  margin-top: 40px;
  margin-left: -30px;
}

.sky .clouds .cloud:nth-child(17) {
  animation-duration: 1.9s;
  margin-top: 22px;
  margin-left: -45px;
}

.sky .clouds .cloud:nth-child(18) {
  animation-duration: 2.2s;
  margin-top: 20px;
  margin-left: -20px;
}

.sky .clouds .cloud:nth-child(19) {
  animation-duration: 1.8s;
  margin-top: 32px;
  margin-left: -22px;
}

.sky .clouds .cloud:nth-child(20) {
  animation-duration: 2.5s;
  margin-top: 50px;
  margin-left: -50px;
}

.sky .clouds .cloud:nth-child(21) {
  animation-delay: 2.3s;
  margin-top: 50px;
  margin-left: -60px;
}

.sky .clouds .cloud:nth-child(22) {
  animation-delay: 2.3s;
  margin-top: 20px;
  margin-left: -30px;
}

.sky .clouds .cloud:nth-child(23) {
  animation-delay: 2.3s;
  margin-top: 30px;
  margin-left: -20px;
}

.sky .clouds .cloud:nth-child(24) {
  animation-duration: 1.9s;
  margin-top: 45px;
  margin-left: -42px;
}

.sky .clouds .cloud:nth-child(25) {
  animation-duration: 2.2s;
  margin-top: 30px;
  margin-left: -50px;
}

.sky .clouds .cloud:nth-child(26) {
  animation-duration: 1.8s;
  margin-top: 55px;
  margin-left: -42px;
}

.sky .clouds .cloud:nth-child(27) {
  animation-duration: 2.5s;
  margin-top: 30px;
  margin-left: -37px;
}

.sky .clouds .cloud:nth-child(28) {
  animation-delay: 2.3s;
  margin-top: 22px;
  margin-left: -21px;
}

.sky .clouds .cloud:nth-child(29) {
  animation-duration: 1.9s;
  margin-top: 22px;
  margin-left: -18px;
}

.sky .clouds .cloud:nth-child(30) {
  animation-duration: 2.2s;
  margin-top: 15px;
  margin-left: -15px;
}

.sky .clouds .cloud:nth-child(31) {
  animation-duration: 1.8s;
  margin-top: 30px;
  margin-left: -55px;
}

.sky .clouds .cloud:nth-child(32) {
  animation-duration: 2.5s;
  margin-top: 53px;
  margin-left: -46px;
}

.sky .clouds .cloud:nth-child(33) {
  animation-delay: 2.3s;
  margin-top: 22px;
  margin-left: -20px;
}

.sky .clouds .cloud:nth-child(34) {
  animation-duration: 1.9s;
  margin-top: 43px;
  margin-left: -40px;
}

.sky .clouds .cloud:nth-child(35) {
  animation-duration: 2.2s;
  margin-top: 22px;
  margin-left: -18px;
}

.sky .clouds .cloud:nth-child(36) {
  animation-duration: 1.8s;
  margin-top: 40px;
  margin-left: -25px;
}

.sky .clouds .cloud:nth-child(37) {
  animation-duration: 2.5s;
  margin-top: 22px;
  margin-left: -45px;
}

.sky .clouds .cloud:nth-child(38) {
  animation-delay: 2.3s;
  margin-top: 40px;
  margin-left: -30px;
}

.sky .clouds .cloud:nth-child(39) {
  animation-duration: 1.9s;
  margin-top: 22px;
  margin-left: -45px;
}

.sky .clouds .cloud:nth-child(40) {
  animation-duration: 2.2s;
  margin-top: 20px;
  margin-left: -20px;
}

.sky .clouds .cloud:nth-child(41) {
  animation-duration: 1.8s;
  margin-top: 32px;
  margin-left: -22px;
}

.sky .clouds .cloud:nth-child(42) {
  animation-duration: 2.5s;
  margin-top: 50px;
  margin-left: -50px;
}

.sky .clouds .cloud:nth-child(43) {
  animation-delay: 2.3s;
  margin-top: 50px;
  margin-left: -60px;
}

.sky .clouds .cloud:nth-child(44) {
  animation-delay: 2.3s;
  margin-top: 20px;
  margin-left: -30px;
}

.sky .clouds .cloud:nth-child(45) {
  animation-delay: 2.3s;
  margin-top: 30px;
  margin-left: -20px;
}

@keyframes cloudmove {
  0% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0px);
  }
}

.gotoTop {
  position: fixed;
  bottom: 0px;
  right: 20px;
  width: 150px;
  height: 60px;
  z-index: 99;
  transform: translate3d(0, 60px, 0);
  transition: all .3s;
}

.gotoTop.active {
  transform: translate3d(0, 0, 0);
  transition: all .3s;
}

.gotoTop a {
  display: block;
  display: inline-block;
  padding: 1.5rem 2.5rem;
  border-radius: 5px;
  background: #006666;
  color: #FFF;
  transition: all .2s;
  position: relative;
  font-size: 1.3rem;
  border-radius: 5px 5px 0 0;
  width: 100%;
  height: 60px;
  line-height: 40px;
  padding: 0 20px;
  position: relative;
  transform: translateY(20px);
}

.gotoTop a:hover, .gotoTop a:active, .gotoTop a:focus {
  background: #000;
  color: #FFF;
}

.gotoTop a:hover {
  transform: translateY(0px);
}

.gotoTop a:after {
  content: '';
  display: block;
  width: 5px;
  height: 5px;
  border-right: 2px solid #FFF;
  border-top: 2px solid #FFF;
  transform: rotate(-45deg) translateY(0px);
  position: absolute;
  right: 20px;
  top: 17.5px;
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

/* animation */
@-webkit-keyframes pass-bar {
  0% {
    left: 0;
    right: auto;
    width: 0;
  }
  50% {
    left: 0;
    right: auto;
    width: 100%;
  }
  51% {
    left: auto;
    right: 0;
    width: 100%;
  }
  100% {
    left: auto;
    right: 0;
    width: 0;
  }
}

@keyframes pass-bar {
  0% {
    left: 0;
    width: 0;
  }
  50% {
    left: 0;
    width: 100%;
  }
  51% {
    left: 0;
    width: 100%;
  }
  100% {
    left: 100%;
    width: 0;
  }
}

@-webkit-keyframes pass-txt {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes pass-txt {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* css */
.pass .pass-box, .pass-s .pass-box {
  display: block;
}

.pass .pass-box:before, .pass-s .pass-box:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  /* 任意の値 */
  background: #006666;
}

.pass .pass-bar, .pass-s .pass-bar {
  position: relative;
  display: inline-block;
  /*　後ほど解説　*/
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.pass .pass-bar:before, .pass-s .pass-bar:before {
  content: '';
  display: inline-block;
  width: 0;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  /* 任意の値 */
  background: #000;
}

.pass .pass-txt, .pass-s .pass-txt {
  opacity: 0;
  /* 後ほど解説 */
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  /* 任意の値 */
}

.pass.move .pass-bar:before, .pass-s.move .pass-bar:before {
  -webkit-animation: pass-bar 1s ease 0s 1 normal forwards;
  animation: pass-bar 1s ease 0s 1 normal forwards;
}

.pass.move .pass-txt, .pass-s.move .pass-txt {
  -webkit-animation: pass-txt 0s ease .5s 1 normal forwards;
  animation: pass-txt 0s ease .5s 1 normal forwards;
}

.close {
  pointer-events: none;
  z-index: 1;
  width: 100%;
  height: 100%;
  transition: background-color .6s;
}

#navTgl:checked ~ .close {
  pointer-events: auto;
  background-color: rgba(0, 0, 0, 0.3);
}

main {
  width: 100%;
}

@media screen and (max-width: 768px) {
  main {
    width: 100%;
    margin: 0;
    transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}

.spHeader {
  display: none;
}

@media screen and (max-width: 768px) {
  .spHeader {
    display: flex;
    /* Safari */
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    /* Safari */
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    height: 60px;
    background: #FFF;
  }
  .spHeader .spH1 {
    width: 130px;
    height: 50px;
    margin: 5px;
    display: block;
    background: url("../images/share/logo_tate") no-repeat;
    background-size: auto 100%;
    text-indent: -9999px;
  }
  .spHeader .headerNav {
    display: flex;
    /* Safari */
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    /* Safari */
    flex-wrap: wrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 0 60px 0 0;
    width: calc(100% - 140px);
  }
  .spHeader .headerNav .searchBtn {
    width: 60px;
    height: 60px;
    position: relative;
    border-left: 1px solid #DDD;
    display: none;
  }
  .spHeader .headerNav .searchBtn:after {
    width: 25px;
    height: 25px;
    font-family: icomoon;
    content: '\e90e';
    font-size: 2rem;
    display: block;
    position: absolute;
    left: 19px;
    top: 13px;
  }
  .spHeader .headerNav .searchBtn span {
    font-size: .9rem;
    letter-spacing: -.05rem;
    width: 100%;
    bottom: 10px;
    position: absolute;
  }
  .spHeader .headerNav .telBtn {
    width: 120px;
    height: 60px;
    display: block;
    text-align: center;
    border-left: 1px solid #DDD;
  }
  .spHeader .headerNav .telBtn:before {
    display: block;
    content: '';
    width: 110px;
    height: 35px;
    margin: 12.5px auto;
    background: url("../images/share/telnum7676_sp.svg") no-repeat;
    background-size: cover;
  }
  .spHeader .headerNav .btn {
    width: 60px;
    height: 60px;
    display: block;
    font-size: 1rem;
    text-align: center;
    position: relative;
    border-left: 1px solid #DDD;
  }
}

@media screen and (max-width: 768px) and (max-width: 375px) {
  .spHeader .headerNav .btn {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .spHeader .headerNav .btn:before {
    font-family: icomoon;
    content: '\e90b';
    font-size: 2.5rem;
    width: 25px;
    height: 25px;
    display: block;
    margin: 10px auto 5px;
  }
}

#navTgl {
  display: none;
}

#navTgl:checked ~ main {
  transform: translateX(0);
  backface-visibility: hidden;
  width: calc(100% - 250px);
}

@media screen and (max-width: 768px) {
  #navTgl:checked ~ main {
    width: 100%;
  }
}

#navTgl:checked + .open {
  background: indianRed;
}

#navTgl:checked + .open span {
  transform: scaleX(0);
}

#navTgl:checked + .open::before {
  transform: rotate(45deg);
}

#navTgl:checked + .open::after {
  transform: rotate(-45deg);
}

#navTgl:checked ~ .close {
  pointer-events: auto;
  background: rgba(0, 0, 0, 0.3);
}

@media screen and (max-width: 768px) {
  #navTgl:checked ~ .menu {
    transform: none;
  }
}

@media screen and (max-width: 768px) {
  #navTgl:checked ~ .spNav {
    transform: none;
  }
}

#navTgl label {
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  .open {
    z-index: 1001;
    width: 50px;
    height: 50px;
    background: #000;
    transition: background 0.6s, transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translateX(0);
    backface-visibility: hidden;
  }
  .open:before, .open:after {
    content: '';
  }
  .open span, .open:before, .open:after {
    content: '';
    position: absolute;
    top: calc(50% - 1px);
    right: 30%;
    width: 40%;
    border-bottom: 2px solid white;
    transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  .open:before {
    transform: translateY(-8px);
  }
  .open:after {
    transform: translateY(8px);
  }
}

.close {
  z-index: 1000;
  width: 100%;
  height: 100%;
  pointer-events: none;
  transition: background .6s;
}

.menu {
  z-index: 1000;
  position: fixed;
  overflow: auto;
  margin: 0;
  box-sizing: border-box;
  right: 0;
  transform: translateX(0);
}

@media screen and (max-width: 768px) {
  .menu {
    transform: translateX(100%);
    transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}

@media screen and (max-width: 768px) {
  .spNav {
    z-index: 1000;
    position: fixed;
    overflow: auto;
    margin: 0;
    box-sizing: border-box;
    right: 0;
    transform: translateX(100%);
    transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
  }
}

#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #FFF;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

.loader {
  color: #006666;
  font-size: 50px;
  text-indent: -9999em;
  overflow: hidden;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -25px 0 0 -25px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
  animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}

.loader-wani {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -100px 0 0 -100px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  background: url("../images/illust/kanagawani_sound.svg") no-repeat center center;
  background-size: contain;
  animation: poyooon 0.9s linear 0s 1;
}

.poyooon {
  animation: poyooon 0.9s linear 0s 1;
}

@keyframes poyooon {
  0% {
    transform: scale(1, 1) translate(0%, 0%);
  }
  10% {
    transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  40% {
    transform: scale(1.2, 0.8) translate(0%, 15%);
  }
  50% {
    transform: scale(1, 1) translate(0%, 0%);
  }
  60% {
    transform: scale(0.9, 1.2) translate(0%, -50%);
  }
  75% {
    transform: scale(0.9, 1.2) translate(0%, -10%);
  }
  85% {
    transform: scale(1.2, 0.8) translate(0%, 7.5%);
  }
  100% {
    transform: scale(1, 1) translate(0%, 0%);
  }
}

@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@-webkit-keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.cssload-clock {
  border-radius: 54px;
  border: 3px solid #006666;
  height: 72px;
  width: 72px;
  position: absolute;
  left: 35%;
  left: calc(50% - 39px);
  left: -o-calc(50% - 39px);
  left: -ms-calc(50% - 39px);
  left: -webkit-calc(50% - 39px);
  left: -moz-calc(50% - 39px);
  top: calc(50% - 36px);
}

.cssload-clock:after {
  content: "";
  position: absolute;
  background-color: #FAB000;
  top: 2px;
  left: 48%;
  height: 34px;
  width: 4px;
  border-radius: 4px;
  transform-origin: 50% 97%;
  -o-transform-origin: 50% 97%;
  -ms-transform-origin: 50% 97%;
  -webkit-transform-origin: 50% 97%;
  -moz-transform-origin: 50% 97%;
  animation: grdAiguille 2s linear infinite;
  -o-animation: grdAiguille 2s linear infinite;
  -ms-animation: grdAiguille 2s linear infinite;
  -webkit-animation: grdAiguille 2s linear infinite;
  -moz-animation: grdAiguille 2s linear infinite;
}

.cssload-clock:before {
  content: "";
  position: absolute;
  background-color: #FAB000;
  top: 5px;
  left: 48%;
  height: 31px;
  width: 4px;
  border-radius: 4px;
  transform-origin: 50% 94%;
  -o-transform-origin: 50% 94%;
  -ms-transform-origin: 50% 94%;
  -webkit-transform-origin: 50% 94%;
  -moz-transform-origin: 50% 94%;
  animation: ptAiguille 12s linear infinite;
  -o-animation: ptAiguille 12s linear infinite;
  -ms-animation: ptAiguille 12s linear infinite;
  -webkit-animation: ptAiguille 12s linear infinite;
  -moz-animation: ptAiguille 12s linear infinite;
}

@keyframes grdAiguille {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@-o-keyframes grdAiguille {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(360deg);
  }
}

@-ms-keyframes grdAiguille {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
  }
}

@-webkit-keyframes grdAiguille {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes grdAiguille {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}

@keyframes ptAiguille {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@-o-keyframes ptAiguille {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(360deg);
  }
}

@-ms-keyframes ptAiguille {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
  }
}

@-webkit-keyframes ptAiguille {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes ptAiguille {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}

.allloaded {
  opacity: 0;
  visibility: hidden;
}

.waveSvg {
  width: 100%;
  height: 45px;
  transform: translateY(1px);
}

#wave {
  width: 100%;
  height: 45px;
}

.slick-list {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
}

#news .slick-list {
  width: 100%;
  padding: 120px 0 0 0 !important;
  overflow: hidden;
}

.slideWrap .slick-list {
  overflow: hidden;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

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

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

.slick-slider .slick-arrow {
  width: 50px;
  height: 50px;
  position: absolute;
  z-index: 10;
  display: block;
  text-indent: -9999px;
  border: none;
  background: #0057AA;
  border-radius: 25px;
  border: 2px solid #000;
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  .slick-slider .slick-arrow {
    width: 40px;
    height: 40px;
    border-radius: 20px;
  }
}

.SlideView .slick-slider .slick-prev {
  left: calc(50% - 480px);
  top: calc(50% - 50px);
}

@media screen and (max-width: 768px) {
  .SlideView .slick-slider .slick-prev {
    left: 10px;
    top: calc(50% - 40px);
  }
}

.mvList .slick-slider .slick-prev {
  left: 20px;
  top: calc(50% - 50px);
}

@media screen and (max-width: 768px) {
  .mvList .slick-slider .slick-prev {
    left: 10px;
    top: calc(50% - 40px);
  }
}

.slick-slider .slick-prev:after {
  content: '';
  display: block;
  -webkit-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  top: 50%;
  left: 50%;
  transition: all .4s;
  width: 10px;
  height: 10px;
  margin: -6px 0 0 -4.5px;
  border-right: 4px solid #FFF;
  border-bottom: 4px solid #FFF;
}

.slick-slider .slick-prev:hover:after {
  left: 40%;
  transition: all .2s;
}

.SlideView .slick-slider .slick-next {
  right: calc(50% - 480px);
  top: calc(50% - 50px);
}

@media screen and (max-width: 768px) {
  .SlideView .slick-slider .slick-next {
    right: 10px;
    top: calc(50% - 40px);
  }
}

.mvList .slick-slider .slick-next {
  right: 20px;
  top: calc(50% - 50px);
}

@media screen and (max-width: 768px) {
  .mvList .slick-slider .slick-next {
    right: 10px;
    top: calc(50% - 40px);
  }
}

.slick-slider .slick-next:after {
  content: '';
  display: block;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 50%;
  left: 50%;
  transition: all .4s;
  width: 10px;
  height: 10px;
  margin: -6px 0 0 -9.5px;
  border-right: 4px solid #FFF;
  border-bottom: 4px solid #FFF;
}

.slick-slider .slick-next:hover:after {
  left: 60%;
  transition: all .2s;
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
  height: 100%;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: '';
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
  opacity: 0;
  transition: .1s;
}

.slick-slide > div {
  transition: all .5s;
  margin: 0;
}

#recommend .slick-slide > div {
  height: 310px;
}

#news .slick-slide > div {
  height: 100%;
}

.slick-slide.slick-center > div {
  transition: all .5s;
}

.slick-slide.slick-active, .slick-slide.slick-current {
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1;
  transition: all .1s;
}

[dir='rtl'] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
  opacity: 0;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-initialized .slick-slide img {
  opacity: 1;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

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

.slick-dots {
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
}

.slideWrap .slick-dots {
  position: absolute;
  bottom: -100px;
  width: 100%;
}

@media screen and (max-width: 768px) {
  .slideWrap .slick-dots {
    bottom: 0px;
  }
}

.slick-dots li {
  width: 50px;
  height: 10px;
  margin: 0 2px 4px;
  position: relative;
}

.slick-dots li button {
  width: 100%;
  height: 10px;
  border-radius: 2px;
  padding: 0;
  background: #80C6EF;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
  border: none;
  text-indent: -999px;
  overflow: hidden;
  cursor: pointer;
  transition: all .3s;
}

.slick-dots li button:hover {
  background: #FAB000;
  transition: all .3s;
}

.slick-dots li button:focus {
  background: #FAB000;
  transition: all .3s;
}

.slick-dots li button:active {
  background: #FAB000;
  transition: all .3s;
}

.slick-dots li.slick-active button {
  background: #DC000C;
  transition: all .3s;
}

#tglBtnB,
#tglBtnE {
  border: none;
  border-radius: 3px;
  margin: 0 10px 0 0;
}

#tglBtnB #startBtnB,
#tglBtnB #startBtnE,
#tglBtnE #startBtnB,
#tglBtnE #startBtnE {
  position: relative;
  display: block;
}

#tglBtnB #startBtnB:after,
#tglBtnB #startBtnE:after,
#tglBtnE #startBtnB:after,
#tglBtnE #startBtnE:after {
  font-family: icomoon;
  content: "\e979";
  color: #FFF;
  font-size: 2rem;
  width: 20px;
  height: 20px;
  display: block;
}

#tglBtnB #stopBtnB,
#tglBtnB #stopBtnE,
#tglBtnE #stopBtnB,
#tglBtnE #stopBtnE {
  position: relative;
  display: block;
}

#tglBtnB #stopBtnB:after,
#tglBtnB #stopBtnE:after,
#tglBtnE #stopBtnB:after,
#tglBtnE #stopBtnE:after {
  font-family: icomoon;
  content: "\e97a";
  color: #FFF;
  font-size: 2rem;
  width: 20px;
  height: 20px;
  display: block;
}

.btnCenterWrap {
  text-align: center;
  padding: 40px 0;
}

a.btnBase {
  display: inline-block;
  padding: 1.5rem 2.5rem;
  border-radius: 50px;
  background: #0057AA;
  color: #FFF;
  transition: all .2s;
  position: relative;
  font-size: 1.4rem;
  border: 2px solid #000;
}

a.btnBase:after {
  content: '';
  position: absolute;
  width: 20px;
  height: 1px;
  background: #FFF;
  right: 0;
  top: 50%;
  transition: all .2s;
}

a.btnBase:hover, a.btnBase:active, a.btnBase:focus {
  background: #000;
  color: #FFF;
}

a.btnBase:hover:after, a.btnBase:active:after, a.btnBase:focus:after {
  content: '';
  width: 10px;
  height: 1px;
}

.wrap_slick-dots {
  display: flex;
  /* Safari */
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
}

.bigSlide .wrap_slick-dots {
  position: absolute;
  z-index: 100;
}

.slide-animation figure {
  animation: fadezoom 16s 0s forwards ease-out;
  -webkit-transform: translate3d(0, 0, 0);
}

.slide-animation:nth-child(1) figure {
  transform-origin: top left;
}

.slide-animation:nth-child(2) figure {
  transform-origin: bottom right;
}

.slide-animation:nth-child(3) figure {
  transform-origin: bottom left;
}

.slide-animation:nth-child(4) figure {
  transform-origin: top right;
}

@keyframes fadezoom {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}

.scAni {
  opacity: 0;
  transition: all .5s ease;
}

.scAni.show {
  opacity: 1;
  transform: none;
}

.scAni--lr {
  transform: translate(-100px, 0);
}

.scAni--rl {
  transform: translate(100px, 0);
}

.scAni--up {
  transform: translate(0, 100px);
}

.scAni--down {
  transform: translate(0, -100px);
}

.scAni--scaleUp {
  transform: scale(0.5);
}

.scAni--scaleDown {
  transform: scale(1.5);
}

.scAni--rotateL {
  transform: rotate(180deg);
}

.scAni--rotateR {
  transform: rotate(-180deg);
}

.gsc-adBlock {
  display: none !important;
}

#search-area {
  width: 100vw;
  height: 100vh;
  position: relative;
}

#search-area img {
  width: 100%;
  height: auto;
}

.gcse-search {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}