@charset "UTF-8";
/* ////////////////////////////////////////////////////////////////////
///// ライブラリCSS ///////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////// */

/* ==================================================
reset
================================================== */
html {
  margin: 0;
  padding: 0;
}
body {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
  text-rendering: optimizeLegibility;
  -webkit-overflow-js-btnscrolling: touch;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2/1), (min-resolution: 2dppx) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
.imgSetP {
  margin: 0;
  padding: 0;
  font-weight: normal;
  line-height: 1.5;
}
ul,
ol,
dl,
dt,
dd {
  margin: 0;
  padding: 0;
}
ol,
li {
  list-style: none;
}
img {
  border: none;
  line-height: 0;
  font-size: 0;
  vertical-align: text-bottom;
  width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic;
}
figure img,
video {
  width: 100%;
  height: auto;
}
/* ---------- */

a {
  margin: 0;
  padding: 0;
  font-size: inherit;
  background: transparent;
}
th,
td {
  font-style: normal;
  font-weight: normal;
  font-size: inherit;
  empty-cells: show;
}
input,
select {
  vertical-align: middle;
}
input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  /*border:0;*/
}
pre {
  white-space: -moz-pre-wrap;
  /* Mozilla */
  white-space: -pre-wrap;
  /* Opera 4-6 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  white-space: pre-wrap;
  /* CSS3 */
  word-wrap: break-word;
  /* IE 5.5+ */
}
/* ==================================================
 FONT SETTING
================================================== */
.taCsp {
  text-align: center !important;
}
@media screen and (in-width: 769px) {
  .taCtab {
    text-align: center !important;
  }
}
@media screen and (min-width: 961px) {
  .taC {
    text-align: center !important;
  }
}
/* ==================================================
Selected Text
================================================== */

::-moz-selection {
  background: #ffffff;
  /* Safari */
  color: #292929;
}
::selection {
  background: #ffffff;
  /* Safari */
  color: #292929;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
/* ==================================================
link
================================================== */

a {
  cursor: pointer;
  display: inline-block;
  -webkit-transition: 0.8s opacity;
  -o-transition: 0.8s opacity;
  transition: 0.8s opacity;
}
a:link {
  text-decoration: none;
}
a:visited {
  text-decoration: none;
}
a:active {
  text-decoration: none;
}
ul li a {
  position: relative;
  outline: none;
  text-decoration: none;
}
p a:link {
  text-decoration: underline;
}
p a:visited {
  text-decoration: underline;
}
p a:active {
  text-decoration: underline;
}
ul li a:focus {
  outline: none;
}
.imgObj {
  line-height: 1;
}
/* ==================================================
common
================================================== */

* {
  -webkit-overflow-js-btnscrolling: touch;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body.js-spNavOn {
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .spno {
    display: none !important;
  }
}
@media screen and (min-width: 769px) and (max-width: 960px) {
  .tabno {
    display: none !important;
  }
}
@media screen and (min-width: 961px) {
  .pcno {
    display: none !important;
  }
  .indexno {
    display: none;
    opacity: 0;
  }
}
.hide {
  -webkit-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
  opacity: 0 !important;
}
.active {
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
  opacity: 1;
}
.menuAct {
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
  opacity: 1;
}
.js-menuAccrdn {
  cursor: pointer;
}
.js-spMenuOn {
  overflow: hidden;
}
.js-closeAcc {
  line-height: 0;
  opacity: 0;
  visibility: hidden;
  padding-top: 0;
  padding-bottom: 0;
  transition:
    padding-top 0.3s ease-out,
    padding-bottom 0.3s ease-out,
    line-height 0.3s ease-out,
    opacity 0.1s linear,
    visibility 0.1s linear;
}
.js-accOpen {
  line-height: 1.5;
  opacity: 1;
  visibility: visible;
  padding-top: 1em;
  padding-bottom: 1.5em;
  transition:
    padding-top 0.3s ease-out,
    padding-bottom 0.3s ease-out,
    line-height 0.3s ease-out,
    opacity 0.1s linear 0.1s,
    visibility 0.1s linear 0.1s;
}
.noimg {
  opacity: 0;
}
.disblk {
  display: block !important;
}
.disno {
  display: none !important;
}
.opBlk,
.js-lateAppear {
  opacity: 0;
}
.opStart .cntsSct {
  display: none;
}
.opEnd .opFO {
  opacity: 0;
}
.js-lateAppFadeIn {
  opacity: 1;
  -webkit-transition: 0.8s opacity ease-in;
  -o-transition: 0.8s opacity ease-in;
  transition: 0.8s opacity ease-in;
}
.js-slideOut {
  opacity: 0;
  -webkit-transform: translate(0, 90px);
  -ms-transform: translate(0, 90px);
  transform: translate(0, 90px);
  -webkit-transition: 0.6s all ease-in;
  -o-transition: 0.6s all ease-in;
  transition: 0.6s all ease-in;
}
.js-imgFadeOut {
  opacity: 0;
  -webkit-transition: 0.6s all ease-in;
  -o-transition: 0.6s all ease-in;
  transition: 0.6s all ease-in;
}
.js-btnClose {
  font-size: 0;
  width: 14%;
  padding-top: 14%;
  background-color: #ffffff;
  border-radius: 100%;
  position: absolute;
  top: -7%;
  left: -7%;
  z-index: 1000;
  cursor: pointer;
}
.js-bnrOff .bnrSet {
  display: none;
}
.siTop {
  -webkit-transform: translate(0, 80px);
  -ms-transform: translate(0, 80px);
  transform: translate(0, 80px);
  -webkit-transition: 0.6s all ease-in;
  -o-transition: 0.6s all ease-in;
  transition: 0.6s all ease-in;
}
.js-appSlidein {
  opacity: 1;
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: all 1.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  -o-transition: all 1.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 1.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.js-btnFadeIn {
  cursor: pointer;
}
.js-menuFadeIn {
  position: absolute;
  opacity: 0;
  top: 80px;
  left: 100vw;
  min-width: 300px;
  -webkit-animation: js-imgFadeOutMenu 0.6s linear;
  animation: js-imgFadeOutMenu 0.6s linear;
  background: rgba(0, 0, 0, 0.95);
  color: #ffffff;
  padding: 2em;
  height: 0;
}
.js-menuFadeIn::before {
  content: "";
  display: block;
  border-right: 6px solid transparent;
  border-bottom: 6px solid rgba(0, 0, 0, 0.95);
  border-left: 6px solid transparent;
  position: absolute;
  bottom: 100%;
  left: 25%;
}
.js-menuFadeIn.fadeIn {
  opacity: 1;
  left: auto;
  -webkit-animation: js-menuFadeIn 0.3s linear;
  animation: js-menuFadeIn 0.3s linear;
}
@keyframes js-imgFadeOutMenu {
  0% {
    opacity: 1;
    left: auto;
    height: auto;
  }
  99% {
    opacity: 0;
    left: auto;
    height: auto;
  }
  100% {
    opacity: 0;
    left: 100vw;
    height: 0;
  }
}
@keyframes js-menuFadeIn {
  0% {
    opacity: 0;
    left: 100vw;
    height: 0;
  }
  1% {
    opacity: 0;
    left: auto;
    height: auto;
  }
  100% {
    opacity: 1;
    left: auto;
    height: auto;
  }
}
.new::after {
  content: "NEW";
}
.js-nowPage {
  opacity: 0.2;
  pointer-events: none;
}
.cs {
  position: relative;
}
.cs::before {
  content: "COMING SOON";
  display: inline-block;
}
.uc a,
.cs a {
  opacity: 0.3;
  pointer-events: none !important;
}
.scrollArrow {
  width: 100px;
  height: 57px;
  display: block;
  position: absolute;
  left: calc(50% - 52px);
  bottom: 20px;
  z-index: 10;
}
.scrollArrow::before {
  content: "SCROLL";
  color: #ffffff;
  font-size: 8px;
  position: absolute;
  display: block;
  top: 0;
  left: 50%;
  line-height: 1;
  -webkit-transform: translate(-50%, -2em);
  -ms-transform: translate(-50%, -2em);
  transform: translate(-50%, -2em);
}
.scrollArrow span {
  display: block;
  overflow: hidden;
  width: 2px;
  height: 57px;
  margin: 0 auto;
  position: relative;
}
.scrollArrow span::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  display: block;
  background: #ffffff;
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
}
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: translate(0, -100%);
    transform: translate(0, -100%);
    opacity: 0;
  }
  30% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  70% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0, 100%);
    transform: translate(0, 100%);
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    -webkit-transform: translate(0, -100%);
    transform: translate(0, -100%);
    opacity: 0;
  }
  30% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  70% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0, 100%);
    transform: translate(0, 100%);
    opacity: 0;
  }
}
@media screen and (in-width: 769px) {
  .scrollArrow {
    bottom: 40px;
  }
}
.js-coverImg {
  position: relative;
  overflow: hidden;
  width: 100%;
  background-position: center center;
  background-size: 100% 100%;
  line-height: 1;
  -webkit-transition: 0.8s all cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -o-transition: 0.8s all cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: 0.8s all cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.js-coverImg img {
  opacity: 0;
}
.js-coverImg:before {
  content: "";
  display: block;
  padding-top: 0; /* 画像の高さ設定用:それぞれのクラスを作成して上書き */
}
/* dlをテーブルに変換 */
.tableList {
  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;
}
.tableList dt {
  width: 100%;
  text-align: left;
  line-height: 1.5;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 15px 0 0;
}
.tableList dd {
  width: 100%;
  text-align: left;
  line-height: 1.5;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-bottom: 1px solid #dddddd;
  padding: 5px 0 15px;
}
@media screen and (min-width: 769px) {
  .tableList dt {
    width: 20%;
    padding: 25px 0;
    border-bottom: 1px solid #dddddd;
  }
  .tableList dd {
    width: 80%;
    padding: 25px 0;
  }
}
/* //////////////////////////////////////////////////////////////////// */
.fs90 {
  font-size: max(90%, 4px) !important;
}
.fs80 {
  font-size: max(80%, 4px) !important;
}
.fs70 {
  font-size: max(70%, 4px) !important;
}
.fs60 {
  font-size: max(60%, 4px) !important;
}
.fs50 {
  font-size: max(50%, 4px) !important;
}
/* .enSerif {
  font-size: 115% !important;
} */
.fsItalic {
  font-style: italic;
}
/* ==================================================
LetterSpace
================================================== */
.XXlLs {
  letter-spacing: 0.2em !important;
}
.XlLs {
  letter-spacing: 0.15em !important;
}
.LLs {
  letter-spacing: 0.1em !important;
}
.MLs {
  letter-spacing: 0.05em !important;
}
.SLs {
  letter-spacing: 0em !important;
}
.XsLs {
  letter-spacing: -0.02em !important;
}
/* ==================================================
Line-height
================================================== */
.XXXsLh {
  line-height: 0.9 !important;
}
.XXsLh {
  line-height: 1 !important;
}
.XsLh {
  line-height: 1.1 !important;
}
.SLh {
  line-height: 1.2 !important;
}
.MLh {
  line-height: 1.5 !important;
}
.LLh {
  line-height: 1.7 !important;
}
.XlLh {
  line-height: 2 !important;
}
.XXlLh {
  line-height: 2.5 !important;
}
.XXXlLh {
  line-height: 3 !important;
}
/* ==================================================
margin / padding
================================================== */
.XXXsMgn {
  margin-top: 0.9375vw !important;
}
.XXsMgn {
  margin-top: 1.875vw !important;
}
.XsMgn {
  margin-top: 3.75vw !important;
}
.SMgn {
  margin-top: 5.625vw !important;
}
.MMgn {
  margin-top: 7.5vw !important;
}
.LMgn {
  margin-top: 11.25vw !important;
}
.XlMgn {
  margin-top: 15vw !important;
}
.XXlMgn {
  margin-top: 22.5vw !important;
}
.XXXlMgn {
  margin-top: 30vw !important;
}

.XXXsPdnB {
  padding-bottom: 0.9375vw !important;
}
.XXsPdnB {
  padding-bottom: 1.875vw !important;
}
.XsPdnB {
  padding-bottom: 3.75vw !important;
}
.SPdnB {
  padding-bottom: 5.625vw !important;
}
.MPdnB {
  padding-bottom: 7.5vw !important;
}
.LPdnB {
  padding-bottom: 11.25vw !important;
}
.XlPdnB {
  padding-bottom: 15vw !important;
}
.XXlPdnB {
  padding-bottom: 22.5vw !important;
}
.XXXlPdnB {
  padding-bottom: 30vw !important;
}

.XXXsPdnT {
  padding-top: 0.9375vw !important;
}
.XXsPdnT {
  padding-top: 1.875vw !important;
}
.XsPdnT {
  padding-top: 3.75vw !important;
}
.SPdnT {
  padding-top: 5.625vw !important;
}
.MPdnT {
  padding-top: 7.5vw !important;
}
.LPdnT {
  padding-top: 11.25vw !important;
}
.XlPdnT {
  padding-top: 15vw !important;
}
.XXlPdnT {
  padding-top: 22.5vw !important;
}
.XXXlPdnT {
  padding-top: 30vw !important;
}
@media screen and (min-width: 961px) {
  .XXXsMgn {
    margin-top: min(0.625vw, 8px) !important;
  }
  .XXsMgn {
    margin-top: min(1.25vw, 16px) !important;
  }
  .XsMgn {
    margin-top: min(2.5vw, 32px) !important;
  }
  .SMgn {
    margin-top: min(3.75vw, 48px) !important;
  }
  .MMgn {
    margin-top: min(5vw, 64px) !important;
  }
  .LMgn {
    margin-top: min(7.5vw, 96px) !important;
  }
  .XlMgn {
    margin-top: min(10vw, 128px) !important;
  }
  .XXlMgn {
    margin-top: min(15vw, 192px) !important;
  }
  .XXXlMgn {
    margin-top: min(20vw, 256px) !important;
  }

  .XXXsPdnB {
    padding-bottom: min(0.625vw, 8px) !important;
  }
  .XXsPdnB {
    padding-bottom: min(1.25vw, 16px) !important;
  }
  .XsPdnB {
    padding-bottom: min(2.5vw, 32px) !important;
  }
  .SPdnB {
    padding-bottom: min(3.75vw, 48px) !important;
  }
  .MPdnB {
    padding-bottom: min(5vw, 64px) !important;
  }
  .LPdnB {
    padding-bottom: min(7.5vw, 96px) !important;
  }
  .XlPdnB {
    padding-bottom: min(10vw, 128px) !important;
  }
  .XXlPdnB {
    padding-bottom: min(15vw, 192px) !important;
  }
  .XXXlPdnB {
    padding-bottom: min(20vw, 256px) !important;
  }

  .XXXsPdnT {
    padding-top: min(0.625vw, 8px) !important;
  }
  .XXsPdnT {
    padding-top: min(1.25vw, 16px) !important;
  }
  .XsPdnT {
    padding-top: min(2.5vw, 32px) !important;
  }
  .SPdnT {
    padding-top: min(3.75vw, 48px) !important;
  }
  .MPdnT {
    padding-top: min(5vw, 64px) !important;
  }
  .LPdnT {
    padding-top: min(7.5vw, 96px) !important;
  }
  .XlPdnT {
    padding-top: min(10vw, 128px) !important;
  }
  .XXlPdnT {
    padding-top: min(15vw, 192px) !important;
  }
  .XXXlPdnT {
    padding-top: min(20vw, 256px) !important;
  }
}
.js-twoLine {
  line-height: 4em !important;
  vertical-align: top;
}

/* ==================================================
js-setLoad
================================================== */

.spinner {
  display: none;
}
.js-setLoad {
  overflow: hidden;
}
.js-setLoad .spinner {
  width: 40px;
  height: 40px;
  display: block;
  position: fixed;
  margin: 0;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.double-bounce1,
.double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #00aebb;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: sk-bounce 2s infinite ease-in-out;
  animation: sk-bounce 2s infinite ease-in-out;
}
.double-bounce2 {
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}
@-webkit-keyframes sk-bounce {
  0%,
  100% {
    -webkit-transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bounce {
  0%,
  100% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  50% {
    transform: scale(1);
    -webkit-transform: scale(1);
  }
}
/* ==================================================
form
================================================== */
textarea {
  resize: none;
}
/* --------------------------------------------------
マウスオーバー時のポインター設定　(IE6以上、firefox対応)
※独自画像の際は右記→ cursor: url(example.cur), url(example.gif), default;
拡張子.curはIE用、firefoxは.gifか.png / 左から優先適用
-------------------------------------------------- */
a,
.clickable {
  cursor: pointer;
}
/* --------------------------------------------------
clearfixフロートした子要素しかもたない親ブロック要素の高さを確立する
-------------------------------------------------- */
.clrfix:before,
.clrfix:after {
  content: "";
  display: table;
}
.clrfix:after {
  clear: both;
}
.clrfix {
  zoom: 1;
}