:root{
  --yellow:#fff500;
  --darkyellow:#b5ae00;
  --black:#0f0f0f;
  --white:#fff;
  --white2:#e1e1e1;
  --lightgray: #ccc;
  --gray: #7b7b7b;

  /* エリア識別用の無彩色(デザイン未確定のため区別用。明度を少しずつ変える) */
  --area-1:#8c8f91;
  --area-2:#e9ebec;
  --area-3:#c7c9cb;
  --area-4:#d8dadb;
  --area-5:#c7c9cb;
  --area-6:#d8dadb;
  --area-7:#e9ebec;
  --area-8:#a6a6a6;
  --area-footer:#212121;

  --border-nav:#352e26;   /* エリア区切りの枠 */
  --object-orange:#e2793f; /* 配置オブジェクトのオレンジ */
  --object-orange-border:#b85a26;

  --midashiblack:#383838;/* 見出しで使う黒 */

  --screen-radius: 4vw; /* 画面角丸 */
}
div { box-sizing:border-box; }
html,body{
  margin:0;
  font-family: "BIZ UDGothic", sans-serif;
  font-weight: 400;
  font-style: normal;
  color:#222;
  overflow-x:hidden;
  background: var(--white);
  font-size: 16px;
  line-height: 1.6;
}
a { color:inherit; }
p {margin: 0;}
ul { margin: 0; list-style: none; padding: 0;}

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

dd {margin: 0;}

.enfont {/* 英字用 */
  font-family: "Aldrich", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/* 画面いっぱいの要素に角丸を設定 */
@media (min-width:768px){
  .screen-wrapper {
    width: 100vw;
    height: 100vh;
    background-color: #ffffff; /* アプリやサイトの実際の背景色 */

    /* 角丸の指定 */
    border-radius: var(--screen-radius); 
    
    /* 子要素が角丸からはみ出さないように固定 */
    overflow-x: hidden;
    overflow-y: auto; 

    position: relative;
    z-index: 201;
  }
}
/* 縦スクロールバーの幅 / 横スクロールバーの高さ */
::-webkit-scrollbar {
  width: 1px;  /* 縦幅の指定 */
  height: 8px; /* 横高さの指定 */
}


/* ===== エリア共通スタイル ===== */
.area{
  position:relative;
  padding:35px;
  overflow:hidden;
}
.area + .area{ border-top:none; } /* 隣接エリアの枠が二重にならないように */

@media (max-width:767px){
  .area{
    padding:10vw 0;
  }
}


/* 各エリア共通背景設定 */
/* bottom */
#bottom,
.news.area,
/* TOP */
#area-registration,
#area3,
#area4,
#area5,
#area6,
#area9 {
  background:linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, .9)), url(../images/common/bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-blend-mode: multiply;
}


/* ===== 配置オブジェクト共通(画像・動画・文字などの仮置き) ===== */
.obj{
  position:relative;
  background:var(--object-orange);
  border:2px solid var(--object-orange-border);
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:13px;
  font-weight:700;
  line-height:1.4;
  padding:8px;
  gap:4px;
  z-index:5;
}
.obj small{
  display:block;
  font-weight:400;
  font-size:.82em;
  opacity:.9;
}
/* 画像・動画として置くオブジェクトは仮のSVGアイコンを添える */
.obj__icon{
  width:26%;
  max-width:34px;
  min-width:16px;
  aspect-ratio:1/1;
  flex-shrink:0;
}

/* 各エリアの背景に敷く見出し用の大きな文字(横幅いっぱい) */
.bg-catch{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  transform:translateY(-50%);
  margin:0;
  font-size:clamp(28px,7vw,96px);
  font-weight:900;
  letter-spacing:.04em;
  white-space:nowrap;
  color:rgba(22,50,79,.28);
  text-align:center;
  z-index:0;
  pointer-events:none;
}
.bg-catch--top{ top:0; transform:none; }

/* 縦書きテキスト */
.vertical-text{
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-size:14px;
  font-weight:700;
  letter-spacing:.15em;
  color:var(--border-navy);
  z-index:2;
}

/* ============================================================
    【1】メインビジュアルエリア1
    ============================================================ */
#area1 {
  min-height:100vh; /* 画面表示時は全画面表示 */
  display:flex;
  align-items:center;
  justify-content:center;
  position: relative;
  z-index: 199;
  aspect-ratio: 16 / 9;
}
/* 背景自動再生動画(想定)：実ファイルに差し替えてください */
#area1 .mv1-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: 50% top;
  z-index:0;
}
/* ロゴ：画面上下中央配置、大きさはvw指定(あとから調整しやすいように変数化) */
#area1 .mv1-logo{
  --logo-w:26vw; /* ← サイズ調整はここ */
  position:relative;
  z-index:1;
  width:var(--logo-w);
  aspect-ratio:570/189;
  filter: drop-shadow(3px 3px 0px var(--white));
}
@media (max-width:767px){
  #area1 {
    min-height:auto;
    padding: 0 !important;
  }
  #area1 .mv1-bg-video{
    position:relative;
  }
}
/* ============================================================
    事前登録ボタン：画面に対してfixed。PC=右下 / SP=右上
    ============================================================ */
.register-btn{
  position:fixed;
  right:0;
  top:0;
  width:200px;
  height:200px;
  z-index:1000;
}

.register-btn__ring{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  transform-origin:50% 50%;
}
.register-btn__ring--set1{ animation:spin 8s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set2{ animation:spin-reverse 12s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set3{ animation:spin 6s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set4{ animation:spin-reverse 14s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set5{ animation:spin 10s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set6{ animation:spin-reverse 16s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set7{ animation:spin 9s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set8{ animation:spin-reverse 18s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set9{ animation:spin 7s linear infinite,fadeBlink 2s infinite; }
.register-btn__ring--set10{ animation:spin-reverse 20s linear infinite,fadeBlink 2s infinite; }
@keyframes spin{ from{transform:rotate(0deg);} to{transform:rotate(360deg);} }
@keyframes spin-reverse{ from{transform:rotate(360deg);} to{transform:rotate(0deg);} }

/* 追加2ｓ毎に点滅 */
@keyframes fadeBlink {
  0% { opacity: 1; }
  50% { opacity: 0; }
  100% { opacity: 1; }
}





.register-btn__core{
  position:absolute;
  top:50%; left:50%;
  width:60%; height:60%;
  transform:translate(-50%,-50%);
  background:var(--black);
  border-radius:50%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 6px 16px rgba(0,0,0,.35);
  transition:transform .25s ease, box-shadow .25s ease;
  padding: .5em;
}
.register-btn__core a {text-decoration: none;}
.register-btn__core:hover{
  transform:translate(-50%,-50%) scale(1.06);
  box-shadow:0 8px 22px rgba(0,0,0,.45);
}
.register-btn__core-stripes{
  position:absolute; inset:0; width:100%; height:100%;
  pointer-events:none; z-index:0;
}
.register-btn__label{
  position:relative; z-index:1;
  color:var(--yellow);
  font-weight:700;
  font-size:15px;
  line-height:1.45;
  text-align:center;
  letter-spacing:.02em;
  pointer-events:none;
}


@media (max-width:767px){

  .register-btn{
    bottom:auto;
    top:0;
    right:0;
    width:25vw;
    height:25vw;
  }
  .register-btn__core{
    padding: .2em;
  }
  .register-btn__label{ font-size:2vw; }

}
.register-btn.is-hovering .register-btn__ring{ animation-play-state:paused; }

/* 見出し非表示処理 */
#area5 h2 {
  display: none;
}


/* ============================================================
    事前登録ボタン2：画面に対してfixed。左下 
    ============================================================ */
.fixed-register {
  opacity: 0;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
  background: rgba(0,0,0,.8);
  color: var(--yellow);
  padding: 2em 0;
  clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%);
  transition: .2s;
}
.fixed-register.is-show {
  opacity: 1;
}
.fixed-register p {
  margin: 0;
}
.fixed-register .top-bg img {
  position: absolute;
  top: 0;
  z-index: 2;
}
.fixed-register .bottom-bg img {
  position: absolute;
  bottom: 0;
  z-index: 2;
}
.fixed-register .chatch-txt {
  font-size: 1.6rem;
  padding: 0 5rem 0 1rem;
}
.fixed-register .icon-box {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: .5rem 4rem .5rem 1rem;
}

.fixed-register .icon-box a {
  width: 12%;
}
.fixed-register .icon-box a img {
  transition: all .3s;
}
.fixed-register .icon-box a:hover img {
  filter: drop-shadow(0px 0px 5px var(--yellow));
}
@media (max-width:767px){
  .fixed-register {
    opacity: 1;
    bottom: 18vw;
    padding: 6vw 0;
  }
  .fixed-register .chatch-txt {
    font-size: 3.5vw;
    padding: 0 3.5rem 0 1rem;
  }
}
/* ============================================================
    【2】ナビエリア
    PC: 上部まで来たら上部固定(sticky) / SP: エリアが入ったら下部固定(JS)
    ============================================================ */
#area2{
  padding:20px 16px;
  z-index:200;
  background-color: rgba(200,200,200,.5);
  backdrop-filter: blur(8px);
  border-top: solid 4px var(--border-nav);
  border-bottom: solid 10px var(--border-nav);
}
#area2 .nav-inner{
  display:grid;
  /*grid-template-columns:1fr auto 1fr;*/
  align-items:center;
  max-width:1200px;
  margin:0 auto;
}
#area2 .nav-sns {
  grid-column:1;
  display:flex;
  gap:15px;
  position: absolute;
  bottom: 0;
  left: 0;
  background: var(--border-nav);
  padding: 20px 60px 10px 20px ;
  clip-path: polygon(0 0, 82% 0, 100% 100%, 0% 100%);
}
#area2 .nav-sns a {
  width: 30px !important;
}
#area2 .nav-menu {
  display:flex;
  gap:0 60px;
  justify-content: center;
}
#area2 .nav-menu li img {
  height:52px;
}
#area2 .nav-menu li a:hover img {
  filter: drop-shadow(0 0 10px var(--yellow)) drop-shadow(0 0 10px var(--yellow));
}

@media (max-width:767px){
  #area2{
    padding:0;
    border-bottom: 0;
    border-top: 0;
    backdrop-filter: none;
    border-top: 0;
    border-bottom: 0;
  }
  #area2 .nav-sns {
    gap:1.85vw;
    top: 0;
    bottom: auto;
    left: 0;
    height: 10vw;
    padding: 1.5vw 7.5vw 0 1.5vw ;
  }
  #area2 .nav-sns a {
    width: 6vw !important;
  }
  #area2 .nav-sns > img {
    width: 4vw !important;
  }
  #area2 .nav-inner{
    border-top: solid 10px var(--border-nav);
    border-bottom: 0;
    background-color: rgba(255,255,255,.5);
    backdrop-filter: blur(8px);
    border-top: solid 4px var(--border-nav);
    padding: 3.5vw;
  }
  #area2 .nav-menu {
     gap:0 6vw;
  }
  #area2 .nav-menu li img {
    height: 10vw;
  }
}

/*
#area2 .nav-spacer{ grid-column:3; }*/

/* ナビの固定表示：PC=top:0に来たら上部固定 / SP=エリアが入ったら下部固定 */
#area2.is-pc-fixed-top{
  position:fixed;
  top:0; left:0; right:0;
  border-top:none;
}
@media (max-width:767px){
  /*#area2.is-sp-fixed-bottom{
    position:fixed;
    left:0; right:0; bottom:0;
    border-bottom: none;
    border-radius: 0;
  }*/
  #area2{
    position:fixed;
    left:0; right:0; bottom:0;
    border-bottom: none;
    border-radius: 0;
  }
}
/* 固定時にレイアウトが詰まらないようにする高さ確保用スペーサー */
#area2-spacer{ height:0; }

/* ナビからの遷移でGナビ高さ分の余白を取る */
@media (min-width: 768px) {
  #area4,
  #area5,
  #area6,
  #area8 {
    scroll-margin-top: 100px;
  }
}

/* ============================================================
    【add】事前登録エリア
    ============================================================ */

#area-registration .campaign {
  max-width: 800px;
  margin: 0 auto 30px;
  position: relative;
  padding: 20px;
  border: 1px solid var(--black);
  background: rgba(226, 226, 226, .5);
  aspect-ratio: 16 / 9.5;
  z-index: 1;
}
#area-registration .register-link {
  position: relative;
  background: rgba(40, 40, 40, 0.5);
  max-width: 800px;
  padding: 20px;
  margin: 0 auto;
}
#area-registration .register-link h2 {
  color: var(--yellow);
  text-align: center;
  margin: 0;
  font-size: 2rem;
  margin-bottom: 1rem;
  border-bottom: 2px solid var(--lightgray);
}
#area-registration .register-link h2 span {
  font-size: 1.5em;
}

#area-registration .register-link h3 {
  color: var(--white);
  text-align: center;
  margin: 0;
  font-size: 1.5rem;
  margin-bottom: .5rem;
}
#area-registration .icon-box {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
#area-registration .icon-box a {
  width: 10%;
}
#area-registration .icon-box a img {
  transition: all .3s;
}
#area-registration .icon-box a:hover img {
  filter: drop-shadow(0px 0px 5px var(--yellow));
}
#area-registration .icon-box+h3 {
  margin-top: 20px;
}
@media (max-width: 767px) {
  #area-registration .register-link {
    padding: 4vw;
  }
  #area-registration .register-link h2 {
    font-size: 4.5vw;
  }
  #area-registration .register-link h3 {
    font-size: 4vw;
  }
  #area-registration {
    padding: 10vw 4vw 0;
  }
  #area-registration .icon-box a {
    width: 20%;
  }
}
/* ============================================================
    【3】メインビジュアルエリア2
    ============================================================ */
#area3{
  /*min-height:70vh;*/
  display:flex;
  align-items:center;
  justify-content:center;
  padding-top:60px;
}

#area3 .mv2-txt {
  position: absolute;
  z-index: 100;
  display: flex;
  flex-direction: row-reverse;
  gap: 1em;
  bottom: 30px;
}
#area3 .mv2-txt p {
  margin: 0;
}
#area3 .mv2-txt p span {
  display: inline-block;
  margin: 0;
  color: var(--white);
  padding: .3em;
  background: var(--black); 
  box-shadow: 5px 5px var(--yellow);
  font-size: 22px;
}

#area3 .mv2-txt p:nth-child(1) {
  right: 1.6em;
}
#area3 .mv2-txt p:nth-child(3) {
  left: 1.6em;
}
#area3 .mv2-inner{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
}
#area3 .mv2-visual{
  width:min(95vw,1000px);
  aspect-ratio:1/1.15;
}
#area3 .mv2-visual img {
  max-width: 100%;
}
@media (max-width:767px){
  #area3 .mv2-txt {
    bottom: 10px;
  }
  #area3 .mv2-txt p span {
    font-size: 2.4vw;
  }
}

/* ============================================================
    【4】システム
    ============================================================ */
#area4{ 
  padding-top:200px; 
  padding-bottom:135px; 
}
#area4 .intro1-row{
  position:relative; z-index:2;
  display:flex;
  gap:40px;
  justify-content:center;
  flex-wrap:nowrap;
  max-width: 1200px;
  margin: 0 auto;
}
#area4 .intro1-row img {
  width: 340px;
  aspect-ratio: 9 / 16;
  border: 2px solid var(--lightgray);
  box-shadow: 8px 8px var(--black);
}
#area4 .intro1-row p {
  font-size: 22px;
  line-height: 1;
  margin: 0 0 .4em 0;
}
#area4 .intro1-row p span {
  display: inline-block;
  margin: 0;
  color: var(--white);
  padding: .3em;
  background: var(--black); 
  box-shadow: 5px 5px var(--yellow);
}
#area4 .intro1-row > div:nth-child(1) img,
#area4 .intro1-row > div:nth-child(3) img,
#area4 .intro1-row > div:nth-child(2) > div {
  margin-bottom: 30px;
} 
#area4 .intro1-row > div:nth-child(2) {
  padding-top: 100px;
}
#area4 .sys-caution {
  text-align: right;
  max-width: 1200px;
  color: var(--gray);
  font-size: .8em;
  margin: 0 auto;

}

@media (max-width:767px){
  #area4{ 
    padding:15vw 4vw 20vw; 
  }
  #area4 .intro1-row {
    position:relative; z-index:2;
    display:flex;
    flex-direction:column;
    gap:0;
    justify-content:center;
    flex-wrap:wrap;
    max-width: none;
    margin: 0 auto;
  }
  #area4 .intro1-row p {
    font-size: 2.35vw;
    line-height: 1;
    margin: 0 0 .4em 0;
  }
  #area4 .intro1-row img {
    width: 43vw;
    border: 1px solid var(--lightgray);
    box-shadow: 1vw 1vw var(--black);
  }
  #area4 .intro1-row p span {
    box-shadow: .62vw .62vw var(--yellow);
  }
  #area4 .intro1-row > div:nth-child(1) {
    display: flex;
    align-items: center;
  }
  /*#area4 .intro1-row > div:nth-child(1) img {
    width: 52vw;
  }*/
  #area4 .intro1-row > div:nth-child(1) > div {
    margin-left: 1.4em;
  }
  #area4 .intro1-row > div:nth-child(2) {
    margin-top: -16vw;
    padding-top: 0;
    display:flex;
    align-items: end;
    flex-direction:column-reverse;
    gap: 3.75vw;
  }
  #area4 .intro1-row > div:nth-child(3) {
    margin-top: -78vw;
    padding-top: 0;
    display:flex;
    align-items: start;
    flex-direction:column-reverse;
    gap: 3.75vw;
  }
}

/* ============================================================
    【5】キャラ
    ============================================================ */
#area5 {padding: 0;}
#area5 .chara-info{
  position:relative;
  z-index:2;
  aspect-ratio: 22 / 11;
  overflow: hidden;
  background: rgba(40, 40, 40, 0.5) url(/assets/images/top/chara/img_chara_bg.svg) no-repeat;
  background-position:bottom right -35%;
  background-size: 50%;
}
#area5 .chara-info .top-bg img {
  position: absolute;
  top: -3vw;
  z-index: 2;
}
#area5 .chara-info .bg-txt{
  position: absolute;
  top: 2vw;
  left: 0;
  font-size: 16px;
  color: var(--yellow);
  z-index: 2;
}
#area5 .chara-info .chara-tab { display: none;}
#area5 .chara-info .chara-tab.act { display: block;}
#area5 .chara-info .chara-tab .chara-large {
  width: 50%;
  position: absolute;
  z-index: 3;
  top: 0;
  right: 200px;
}
#area5 .chara-info .chara-tab .chara-small {
  width: 35%;
  position: absolute;
  z-index: 10;
  bottom: 0;
  right: 0;
}
#area5 .chara-info .chara-tab .chara-txt {
  position: absolute;
  z-index: 15;
  bottom: 0;
  right: 2.5vw;
  color: var(--lightgray);
  text-shadow: 3px 3px 0px rgba(47, 50, 56, 1);
  font-size: 2vw;
}
#area5 .chara-info .chara-tab .chara-txt span {
  font-size: 3vw;
}
#area5 .chara-info .chara-tab .chara-spec {
  position: absolute;
  z-index: 10;
  bottom: 5vw;
  left: 0;
  background: var(--black);
  color: var(--yellow);
  z-index: 10;
  width: 50vw;
  clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%);
}
#area5 .chara-info .chara-tab .chara-spec .chara-name {
  font-size: 6vw;
  margin: 3vw 0 1.1vw 3vw;
  line-height: 1;
}
#area5 .chara-info .chara-tab .chara-spec .chara-subname {
  display:flex;
  margin: 0 0 3vw 3vw;
  color: var(--yellow);
}
#area5 .chara-info .chara-tab .chara-spec .chara-subname dt {
  font-size: 2.3vw;
  width: 4em;
}
#area5 .chara-info .chara-tab .chara-spec .chara-subname dd {
  font-size: 1.6vw;
  width: calc(100% - 4em);
  background: var(--yellow);
  padding: .3em .8em;
  color: var(--black);
}
#area5 .chara-info .chara-tab .chara-spec .chara-flavor {
  background: var(--lightgray);
  padding: 3vw 4vw 3vw 3vw;
  color: var(--black);
  font-size: 1.3vw;
}
#area5 .intro2-chara-row {
  position:relative; 
  z-index:2;
  display:flex;
  gap:1.8vw;
  justify-content:center;
  margin-top:-5vw;
  flex-wrap:wrap;
  overflow: hidden;
  margin-bottom: 160px;
}
#area5 .intro2-chara-row .top-bg img {
  position: absolute;
  top: -3vw;
  z-index: 2;
}
#area5 .intro2-chara-row > div {
  position:relative;
}

#area5 .intro2-chara-row > div .frame {
  position:relative;
  z-index: 3;
  width: 9.5vw;
  max-width: 110px;
  cursor: pointer;
  transition: all .2s ease-out;
}
#area5 .intro2-chara-row > div img {
  transition: all .2s ease-out;

}
#area5 .intro2-chara-row > div.act .frame ,
#area5 .intro2-chara-row > div .frame:hover {
  filter: drop-shadow(0px 0px 3px var(--yellow));
}
#area5 .intro2-chara-row > div:not(.act) .frame:hover,
#area5 .intro2-chara-row > div:not(.act) .frame:hover + picture img {
  filter: drop-shadow(0px 0px 3px var(--yellow));
  transform:scale(1.1);
}

#area5 .intro2-chara-row > div .thum {
  position:absolute;
  z-index: 1;
  width: 8vw;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
@media (max-width:767px){
  #area5 .chara-info{
    position:relative;
    z-index:2;
    aspect-ratio: 4 / 6;
    background-position:bottom 50% right -35%;
    background-size: 90%;
  }
  #area5 .chara-info .bg-txt{
    font-size: 2vw;
  }
  #area5 .chara-info .chara-tab .chara-large {
    width: 100%;
    position: absolute;
    top: 0;
    right: auto;
  }
  #area5 .chara-info .chara-tab .chara-small {
    width: 60%;
    position: absolute;
    bottom: auto;
    top: 12.5vw;
    right: 0;
  }
  #area5 .chara-info .chara-tab .chara-txt {
    position: absolute;
    bottom: auto;
    top: 2vw;
    right: 2.5vw;
    text-shadow: 2px 2px 0px rgba(47, 50, 56, 1);
    font-size: 4vw;
  }
  #area5 .chara-info .chara-tab .chara-txt span {
    font-size: 5vw;
  }
  #area5 .chara-info .chara-tab .chara-spec {
    z-index: 10;
    bottom: 0;
    z-index: 10;
    width: 110vw;
    clip-path: polygon(0 0, 85% 0%, 100% 100%, 0% 100%);
  }
  #area5 .chara-info .chara-tab .chara-spec .chara-name {
    font-size: 17vw;
    margin: 4vw 0 1vw 4vw;
  }
  #area5 .chara-info .chara-tab .chara-spec .chara-subname {
    margin: 0 0 4vw 4vw;
  }
  #area5 .chara-info .chara-tab .chara-spec .chara-subname dt {
    font-size: 5vw;
    width: 4em;
  }
  #area5 .chara-info .chara-tab .chara-spec .chara-subname dd {
    font-size: 3.75vw;
  }
  #area5 .chara-info .chara-tab .chara-spec .chara-flavor {
    background: var(--lightgray);
    padding: 4vw 12vw 4vw 4vw;
    font-size: 2.8vw;
  }
  #area5 .intro2-chara-row {
    position:relative; 
    z-index:2;
    display:flex;
    gap:1.8vw;
    justify-content:start;
    margin-top:-5vw;
    flex-wrap:wrap;
    overflow: hidden;
    margin-bottom: 20vw;
    margin-left: 4vw;
  }
  #area5 .intro2-chara-row > div .frame {
    width: 15vw;
    max-width: auto;
  }
  #area5 .intro2-chara-row > div .thum {
    width: 14vw;
  }
}





/* ============================================================
    【6】ムービー
    ============================================================ */
#area6{ padding-top:60px; padding-bottom:140px; }
#area6 .intro3-sub-row{
  position:relative; z-index:2;
  display:flex;
  gap:16px;
  justify-content:center;
  margin-bottom:20px;
  flex-wrap:wrap;
}
#area6 .intro3-main{
  position:relative; z-index:2;
  max-width:1050px;
  margin:0 auto;
  width: 100%;
  aspect-ratio: 16 / 9.5;
}
#area6 .intro3-main .mov-frame {
  position: relative;
  padding: 20px;
  border: 1px solid var(--black);
  background: rgba(226, 226, 226, .5);
  aspect-ratio: 16 / 9.5;
  z-index: 1;
}
#area6 .intro3-main .mov-frame .frame-bg {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
  width: 30%;
}
#area6 .intro3-main iframe {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 5;
}
@media (max-width:767px){
  #area6 {
    padding: 20vw 4vw 21.5vw;
  }
  #area6 .intro3-main .mov-frame {
    padding: 2.5vw;
  }
  #area6 .intro3-main .mov-frame .frame-bg {
    width: 20%;
  }
}


/* ============================================================
    【7】ストア誘導エリア
    ============================================================ */
#area7{ background:var(--area-7); }
#area7 .store-row{
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
}
#area7 .store-row .obj{ width:190px; height:54px; }

/* ============================================================
    【8】お知らせエリア
    ============================================================ */
#area8{ 
  background:linear-gradient(rgba(166, 166, 166, 1), rgba(166, 166, 166, .85)), url(../images/top/bg_news.svg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 245px 0 150px ;
}
#area8 .news-body{
  max-width:800px;
  margin:0 auto;
  position: relative;
}
#area8 .news-body dl {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 0;
}
#area8 .news-body dl dt {
  position: relative;
  background: var(--gray);
  color: var(--white);
  text-align: center;
  width: 10em;
  filter: drop-shadow(3px 3px 0px var(--black));
  padding: .3em 0 ;
  display: flex;
  align-items: center;
  justify-content: center;
}

#area8 .news-body dl dd {
  background: var(--white2);
  color: var(--black);
  width: calc(100% - 10em - 2em);
  filter: drop-shadow(3px 3px 0px var(--black));
  padding: .3em 1em ;
  transition: all .7s ease-out;
  display: flex;
  align-items: center;
}
#area8 .news-body dl dd a {
  text-decoration: none;
  display: block;
}
#area8 .news-body dl dd:hover {
  background-color: var(--yellow);
}
#area8 .border {
  position: relative;
}
@media (max-width:767px){
  #area8{
    padding: 25vw 0 8.75vw ;
  }
  #area8 .news-body{
    max-width:85vw;
  }
  #area8 .news-body dl dt {
    font-size: 2vw;
  }
  #area8 .news-body dl dd {
    font-size: 3vw;
    width: calc(100% - 9em);
  }
}

/* ============================================================
    【9】アプリ情報エリア
    ============================================================ */

#area9 {
  padding: 80px 0 70px;
}
.bottom-logo {
  text-align: center;
  margin-bottom: 26px;
}
.bottom-logo > img {
  width: 330px;
  aspect-ratio: 66 / 23;
}
.app-info {
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: center;
}
.app-info img {
  width: 100px;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
}
.app-info dl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  gap: 10px 0;
  width: 450px;
} 
.app-info dl dt {
  width: 10em;
}
.app-info dl dd {
  width: calc(450px - 10em);
}

@media (max-width:767px){
  .bottom-logo > img {
    width: 57vw;
  }
  .app-info {
    flex-direction: column;
    gap: 10vw;
  }
  .app-info img {
    width: 34.5vw;
  }
  .app-info dl {
    font-size: 2.7vw;
    width: auto;
    gap: 0;
  }
  .app-info dl dt {
    width: 10em;
  }
  .app-info dl dd {
    width: calc(100% - 10em);
  }
}
/* ============================================================
    フッターエリア
    ============================================================ */
footer.area{
  background:var(--area-footer);
  text-align:center;
  padding-bottom:32px;
  color: var(--white)
}
footer .footer-notice {
  margin-bottom: 50px;
}
footer .footer-notice li {
  font-size: .65rem;
  text-indent: -1em;
  margin-left: 1em;
}

footer .footer-notice li::before {content: "※";}
footer .footer-logo {width:170px;}
footer .footer-share {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-bottom: 20px;
} 
footer .footer-share a img {
  width: 40px;
}

footer .footer-links { 
  margin:0 auto 8px; 
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  font-size: .7rem;
}
footer .footer-links ul {
  display: flex;
  justify-content: start;
  gap: 10px;
}
footer .footer-links ul li::after {
  content: "|";
  padding-left: 10px;
}
footer .footer-links ul li:last-child::after {
  content: none;
  padding-left: 0;
}
footer .footer-copy{
  text-align: left;
}
@media (max-width:767px){
  footer.area{ 
    text-align: left;
    padding: 5vw 5vw 60vw 5vw;
  }
  footer .footer-notice {
    margin-bottom: 13vw;
  }
  footer .footer-notice li {
    font-size: 2vw;
  }
  footer .footer-links { 
    flex-direction: column;
    text-align: center;
  }
  footer .footer-logo {
    width:40vw;
    display: block;
  }
  footer .footer-copy{
    margin-top: 2em;
    text-align: center;
  }
}



.icon-defs{ position:absolute; width:0; height:0; overflow:hidden; }


/* ============================================================
    下層ページ
    ============================================================ */


#bottom {
  position: relative;
  margin-bottom: -60px;
}

#bottom .logo {
  position: relative;
  width: 200px;
  z-index: 1000;
}
#bottom .logo img {
  aspect-ratio:570/189;
  filter: drop-shadow(3px 3px 0px var(--white));
}


/* news */
.news.area {
  padding:0;
}
.bottom .bg-catch {
  position: relative;
}
.bottom .bg-catch img{
  width: 58vw;
}
.bottom .bottom-body {
  padding: 100px 130px;
  position: relative;
  z-index: 2;
  background: rgba(40, 40, 40, 0.5) ;
}

.bottom .bottom-body-inner {
  max-width: 750px;
  margin: 0 auto;
  background: var(--white2);
  box-shadow: 8px 8px var(--black);
  padding: 50px 30px 100px;
  /* 背景装飾 */
  background-image: url("../images/bg_bottom_cont_lt.svg"), url("../images/bg_bottom_cont_rb.svg");
  background-repeat: no-repeat, no-repeat;
  background-size: auto, auto;
  background-position: left 10px top 10px, right 10px bottom 10px;
}

.bottom h1 {
  font-size: 28px;
  padding: .8rem 0 1.5rem 0;
  margin-bottom: 0.2rem;
  background-image: linear-gradient(
    45deg, 
    var(--midashiblack) 0 80%, 
    var(--yellow) 20%
  );
  background-repeat: no-repeat;
  background-size: 100% 10%;
  background-position: bottom;
  color: var(--black);
  font-weight: bold;
}

.bottom h2 {
  margin-bottom: 0.2rem;
  color: var(--white2);
  font-weight: bold;
  font-size: 22px;
  padding: .5rem 0 .5rem 2em;
  margin-bottom: 1rem;
  background-image: linear-gradient(
    106deg, 
    var(--yellow) 1.2em,
    var(--darkyellow) 1.3em 1.8em,
    var(--midashiblack) 1.9em calc(100% - 3em)
  );
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: bottom;
}
.bottom h3 {
  margin-bottom: 1rem;
  border:1px solid var(--midashiblack) ;
  border-left:10px solid var(--midashiblack) ;
  border-right:10px solid var(--midashiblack) ;
  font-weight: bold;
  font-size: 22px;
  padding: .2rem 1rem;
}
.bottom h4 {
  margin-bottom: 1rem;
  border-bottom:1px solid var(--midashiblack) ;
  font-weight: bold;
  font-size: 16px;
  padding: .2rem 0;
}
.bottom .bottom-body-inner ul {
  list-style: disc;
  margin-left: 1em;
}
.bottom .bottom-body-inner ol {
  margin-left: -1em;
}
.bottom .bottom-body-inner .newsdate {
  text-align: right;
}
.bottom .bottom-body-inner p,
.bottom .bottom-body-inner .cont-img {
  margin-bottom: 1rem;
}
.bottom .bottom-body-inner a {
  color: var(--darkyellow);
}
@media (max-width:767px){
  #bottom .logo {
    width: 40vw;
    margin: 0 auto;
  }
  .bottom .bottom-body {
    padding: 5vw 4vw;
  }
  .bottom .bottom-body-inner {
    max-width: 750px;
    box-shadow: 4px 4px var(--black);
    padding: 4vw 2.5vw 6vw;
    font-size: 3.5vw;
    background-size: 30%, 30%;
    background-position: left 1vw top 1vw, right 1vw bottom 1vw;
  }
  .bottom h1 {
    font-size: 7vw;
  }
  .bottom h2 {
    font-size: 5.5vw;
  }
  .bottom h3 {
    font-size: 4vw;
  }
  .bottom h4 {
    font-size: 3.5vw;
  }
}
/*========================================
Utility（接頭辞 u-）
==========================================*/
/* ディスプレイ
-----------------------*/
/* PCのみ表示 */
@media screen and (max-width: 767px) {
  .u-pc {
    display: none !important;
  }
}
/* SPのみ表示 */
@media (min-width: 768px) {
  .u-sp {
    display: none !important;
  }
}
.u-arrow {
  border-bottom: 2px dotted #489BC5;
}
.u-arrow::before {/* > */
  font-family: "Font Awesome 5 Free";
  content: '\f054';
  margin-right: .2rem;
  font-weight: 900;
  text-decoration: none;
} 
.u-arrow.u-color-blue::before {
  color:#89BCD5;
}
.u-arrow.u-color-pink::before {
  color:#C80498;
}
.u-arrow-back::before {/* < */
  font-family: "Font Awesome 5 Free";
  content: '\f053';
  margin-right: .5rem;
  font-weight: 900;
  text-decoration: none;
}
.u-arrow-bottom::after {/* 下 */
  font-family: "Font Awesome 5 Free";
  content: '\f078';
  margin-left: .5rem;
  font-weight: 900;
  text-decoration: none;
} 

/* XXに戻る */
.u-link-back {
  text-align: center;
  background: #4FB408;
  padding: 10px;
}
.u-link-back.c-coach {
  background: #0599B1;
}
.u-link-back a {
  color: #fff;
  display: block;
}

/* 非活性化（主にボタン） */
.disable {
  filter: grayscale(100%) brightness(40%);
  cursor: auto;
  pointer-events: none;
}

.u-d-none {
  display: none !important;
}
.u-d-none-before::before {
  display: none !important;
}
.u-d-none-after::after {
  display: none !important;
}
.u-d-block {
  display: block !important;
}
.u-d-inline-block {
  display: inline-block !important;
}
.u-d-inline {
  display: inline !important;
}
.u-d-flex {
  display: flex !important;
}
@media (min-width: 768px) {
  .u-d-none-pc {
    display: none !important;
  }
  .u-d-none-before-pc::before {
    display: none !important;
  }
  .u-d-none-after-pc::after {
    display: none !important;
  }
  .u-d-block-pc {
    display: block !important;
  }
  .u-d-flex-pc {
    display: flex !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-d-none-tab {
    display: none !important;
  }
  .u-d-none-before-tab::before {
    display: none !important;
  }
  .u-d-none-after-tab::after {
    display: none !important;
  }
  .u-d-block-tab {
    display: block !important;
  }
  .u-d-flex-tab {
    display: flex !important;
  }
}
@media screen and (max-width: 767px) {
  .u-d-none-sp {
    display: none !important;
  }
  .u-d-none-before-sp::before {
    display: none !important;
  }
  .u-d-none-after-sp::after {
    display: none !important;
  }
  .u-d-block-sp {
    display: block !important;
  }
}

/* フレックス系
-----------------------*/
.u-flex-none {
  flex: none;
}
.u-flex-flow-column {
  flex-flow: column !important;
}
.u-flex-flow-column-reverse {
  flex-flow: column-reverse !important;
}
.u-flex-flow-row-reverse {
  flex-flow: row-reverse !important;
}
.u-flex-flow-wrap {
  flex-flow: wrap !important;
}
.u-flex-flow-nowrap {
  flex-flow: nowrap !important;
}
.u-flex-shrink-0 {
  flex-shrink: 0 !important;
}
.u-flex-basis-auto {
  flex-basis: auto !important;
}
.u-justify-content-start {
  justify-content: flex-start !important;
}
.u-justify-content-center {
  justify-content: center !important;
}
.u-justify-content-end {
  justify-content: flex-end !important;
}
.u-justify-content-between {
  justify-content: space-between !important;
}
.u-align-items-start {
  align-items: flex-start !important;
}
.u-align-items-center {
  align-items: center !important;
}
.u-align-items-end {
  align-items: flex-end !important;
}
.u-align-items-stretch {
  align-items: stretch !important;
}
.u-align-content-start {
  align-content: flex-start !important;
}
.u-align-content-center {
  align-content: center !important;
}
.u-align-content-end {
  align-content: flex-end !important;
}
.u-align-content-between {
  align-content: space-between !important;
}
.u-align-content-stretch {
  align-content: stretch !important;
}
.u-align-self-start {
  align-self: flex-start;
}
.u-align-self-center {
  align-self: center;
}
.u-align-self-end {
  align-self: flex-end;
}
.u-align-self-stretch {
  align-self: stretch;
}
@media screen and (max-width: 767px) {
  .u-flex-none-sp {
    flex: none;
  }
  .u-flex-flow-column-sp {
    flex-flow: column !important;
  }
  .u-flex-flow-column-reverse-sp {
    flex-flow: column-reverse !important;
  }
  .u-flex-flow-row-reverse-sp {
    flex-flow: row-reverse !important;
  }
  .u-flex-flow-wrap-sp {
    flex-flow: wrap !important;
  }
  .u-flex-flow-nowrap-sp {
    flex-flow: nowrap !important;
  }
  .u-flex-shrink-0-sp {
    flex-shrink: 0 !important;
  }
  .u-flex-basis-auto-sp {
    flex-basis: auto !important;
  }
  .u-justify-content-start-sp {
    justify-content: flex-start !important;
  }
  .u-justify-content-center-sp {
    justify-content: center !important;
  }
  .u-justify-content-end-sp {
    justify-content: flex-end !important;
  }
  .u-justify-content-between-sp {
    justify-content: space-between !important;
  }
  .u-align-items-start-sp {
    align-items: flex-start !important;
  }
  .u-align-items-center-sp {
    align-items: center !important;
  }
  .u-align-items-end-sp {
    align-items: flex-end !important;
  }
  .u-align-items-stretch-sp {
    align-items: stretch !important;
  }
  .u-align-content-start-sp {
    align-content: flex-start !important;
  }
  .u-align-content-center-sp {
    align-content: center !important;
  }
  .u-align-content-end-sp {
    align-content: flex-end !important;
  }
  .u-align-content-between-sp {
    align-content: space-between !important;
  }
  .u-align-content-stretch-sp {
    align-content: stretch !important;
  }
  .u-align-self-start-sp {
    align-self: flex-start;
  }
  .u-align-self-center-sp {
    align-self: center;
  }
  .u-align-self-end-sp {
    align-self: flex-end;
  }
  .u-align-self-stretch-sp {
    align-self: stretch;
  }
}
@media (min-width: 768px) {
  .u-flex-none-pc {
    flex: none;
  }
  .u-flex-flow-column-pc {
    flex-flow: column !important;
  }
  .u-flex-flow-column-reverse-pc {
    flex-flow: column-reverse !important;
  }
  .u-flex-flow-row-reverse-pc {
    flex-flow: row-reverse !important;
  }
  .u-flex-flow-wrap-pc {
    flex-flow: wrap !important;
  }
  .u-flex-flow-nowrap-pc {
    flex-flow: nowrap !important;
  }
  .u-flex-shrink-0-pc {
    flex-shrink: 0 !important;
  }
  .u-flex-basis-auto-pc {
    flex-basis: auto !important;
  }
  .u-justify-content-start-pc {
    justify-content: flex-start !important;
  }
  .u-justify-content-center-pc {
    justify-content: center !important;
  }
  .u-justify-content-end-pc {
    justify-content: flex-end !important;
  }
  .u-justify-content-between-pc {
    justify-content: space-between !important;
  }
  .u-align-items-start-pc {
    align-items: flex-start !important;
  }
  .u-align-items-center-pc {
    align-items: center !important;
  }
  .u-align-items-end-pc {
    align-items: flex-end !important;
  }
  .u-align-items-stretch-pc {
    align-items: stretch !important;
  }
  .u-align-content-start-pc {
    align-content: flex-start !important;
  }
  .u-align-content-center-pc {
    align-content: center !important;
  }
  .u-align-content-end-pc {
    align-content: flex-end !important;
  }
  .u-align-content-between-pc {
    align-content: space-between !important;
  }
  .u-align-content-stretch-pc {
    align-content: stretch !important;
  }
  .u-align-self-start-pc {
    align-self: flex-start;
  }
  .u-align-self-center-pc {
    align-self: center;
  }
  .u-align-self-end-pc {
    align-self: flex-end;
  }
  .u-align-self-stretch-pc {
    align-self: stretch;
  }
}

/* オーバーフロー
-----------------------*/
.u-overflow-hidden {
  overflow: hidden !important;
}
.u-overflow-auto {
  overflow: auto !important;
}
.u-overflow-scroll {
  overflow: scroll !important;
}
.u-overflow-x-scroll {
  overflow-x: scroll !important;
}
.u-overflow-y-scroll {
  overflow-y: scroll !important;
}
@media (min-width: 768px) {
  .u-overflow-hidden-pc {
    overflow: hidden !important;
  }
  .u-overflow-auto-pc {
    overflow: auto !important;
  }
  .u-overflow-scroll-pc {
    overflow: scroll !important;
  }
  .u-overflow-x-scroll-pc {
    overflow-x: scroll !important;
  }
  .u-overflow-y-scroll-pc {
    overflow-y: scroll !important;
  }
}
@media screen and (max-width: 767px) {
  .u-overflow-hidden-sp {
    overflow: hidden !important;
  }
  .u-overflow-auto-sp {
    overflow: auto !important;
  }
  .u-overflow-scroll-sp {
    overflow: scroll !important;
  }
  .u-overflow-x-scroll-sp {
    overflow-x: scroll !important;
  }
  .u-overflow-y-scroll-sp {
    overflow-y: scroll !important;
  }
}

/* ポジション
-----------------------*/
.u-pos-relative {
  position: relative !important;
}
.u-pos-absolute {
  position: absolute !important;
}
.u-z-index-9999 {
  z-index: 9999 !important;
}
.u-top-0 {
  top: 0 !important;
}
.u-bottom-0 {
  bottom: 0 !important;
}
.u-left-0 {
  left: 0 !important;
}
.u-right-0 {
  right: 0 !important;
}
@media screen and (max-width: 767px) {
  .u-pos-relative-sp {
    position: relative !important;
  }
  .u-pos-absolute-sp {
    position: absolute !important;
  }
  .u-z-index-9999-sp {
    z-index: 9999 !important;
  }
  .u-top-0-sp {
    top: 0 !important;
  }
  .u-bottom-0-sp {
    bottom: 0 !important;
  }
  .u-left-0-sp {
    left: 0 !important;
  }
  .u-right-0-sp {
    right: 0 !important;
  }
}
@media (min-width: 768px) {
  .u-pos-relative-pc {
    position: relative !important;
  }
  .u-pos-absolute-pc {
    position: absolute !important;
  }
  .u-z-index-9999-pc {
    z-index: 9999 !important;
  }
  .u-top-0-sp {
    top: 0 !important;
  }
  .u-bottom-0-pc {
    bottom: 0 !important;
  }
  .u-left-0-pc {
    left: 0 !important;
  }
  .u-right-0-pc {
    right: 0 !important;
  }
}


/* マージン
-----------------------*/
@media (min-width: 0px) {
  .u-mt-0 {
    margin-top: 0px !important;
  }
  .u-mt-5 {
    margin-top: 5px !important;
  }
  .u-mt-10 {
    margin-top: 10px !important;
  }
  .u-mt-15 {
    margin-top: 15px !important;
  }
  .u-mt-20 {
    margin-top: 20px !important;
  }
  .u-mt-25 {
    margin-top: 25px !important;
  }
  .u-mt-30 {
    margin-top: 30px !important;
  }
  .u-mt-40 {
    margin-top: 40px !important;
  }
  .u-mt-50 {
    margin-top: 50px !important;
  }
  .u-mt-60 {
    margin-top: 60px !important;
  }
  .u-mt-70 {
    margin-top: 70px !important;
  }
  .u-mt-80 {
    margin-top: 80px !important;
  }
  .u-mt-90 {
    margin-top: 90px !important;
  }
  .u-mt-100 {
    margin-top: 100px !important;
  }
  .u-mt-auto {
    margin-top: auto !important;
  }
}
@media (min-width: 768px) {
  .u-mt-0-pc {
    margin-top: 0px !important;
  }
  .u-mt-5-pc {
    margin-top: 5px !important;
  }
  .u-mt-10-pc {
    margin-top: 10px !important;
  }
  .u-mt-15-pc {
    margin-top: 15px !important;
  }
  .u-mt-20-pc {
    margin-top: 20px !important;
  }
  .u-mt-25-pc {
    margin-top: 25px !important;
  }
  .u-mt-30-pc {
    margin-top: 30px !important;
  }
  .u-mt-40-pc {
    margin-top: 40px !important;
  }
  .u-mt-50-pc {
    margin-top: 50px !important;
  }
  .u-mt-60-pc {
    margin-top: 60px !important;
  }
  .u-mt-70-pc {
    margin-top: 70px !important;
  }
  .u-mt-80-pc {
    margin-top: 80px !important;
  }
  .u-mt-90-pc {
    margin-top: 90px !important;
  }
  .u-mt-100-pc {
    margin-top: 100px !important;
  }
  .u-mt-auto-pc {
    margin-top: auto !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-mt-0-tab {
    margin-top: 0px !important;
  }
  .u-mt-5-tab {
    margin-top: 5px !important;
  }
  .u-mt-10-tab {
    margin-top: 10px !important;
  }
  .u-mt-15-tab {
    margin-top: 15px !important;
  }
  .u-mt-20-tab {
    margin-top: 20px !important;
  }
  .u-mt-25-tab {
    margin-top: 25px !important;
  }
  .u-mt-30-tab {
    margin-top: 30px !important;
  }
  .u-mt-40-tab {
    margin-top: 40px !important;
  }
  .u-mt-50-tab {
    margin-top: 50px !important;
  }
  .u-mt-60-tab {
    margin-top: 60px !important;
  }
  .u-mt-70-tab {
    margin-top: 70px !important;
  }
  .u-mt-80-tab {
    margin-top: 80px !important;
  }
  .u-mt-90-tab {
    margin-top: 90px !important;
  }
  .u-mt-100-tab {
    margin-top: 100px !important;
  }
  .u-mt-auto-tab {
    margin-top: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .u-mt--20-sp {
    margin-top: -20px !important;
  }
  .u-mt-0-sp {
    margin-top: 0px !important;
  }
  .u-mt-5-sp {
    margin-top: 5px !important;
  }
  .u-mt-10-sp {
    margin-top: 10px !important;
  }
  .u-mt-15-sp {
    margin-top: 15px !important;
  }
  .u-mt-20-sp {
    margin-top: 20px !important;
  }
  .u-mt-25-sp {
    margin-top: 25px !important;
  }
  .u-mt-30-sp {
    margin-top: 30px !important;
  }
  .u-mt-40-sp {
    margin-top: 40px !important;
  }
  .u-mt-50-sp {
    margin-top: 50px !important;
  }
  .u-mt-60-sp {
    margin-top: 60px !important;
  }
  .u-mt-70-sp {
    margin-top: 70px !important;
  }
  .u-mt-80-sp {
    margin-top: 80px !important;
  }
  .u-mt-90-sp {
    margin-top: 90px !important;
  }
  .u-mt-100-sp {
    margin-top: 100px !important;
  }
  .u-mt-auto-sp {
    margin-top: auto !important;
  }
}

@media (min-width: 0px) {
  .u-mb-0 {
    margin-bottom: 0px !important;
  }
  .u-mb-5 {
    margin-bottom: 5px !important;
  }
  .u-mb-10 {
    margin-bottom: 10px !important;
  }
  .u-mb-15 {
    margin-bottom: 15px !important;
  }
  .u-mb-20 {
    margin-bottom: 20px !important;
  }
  .u-mb-25 {
    margin-bottom: 25px !important;
  }
  .u-mb-30 {
    margin-bottom: 30px !important;
  }
  .u-mb-40 {
    margin-bottom: 40px !important;
  }
  .u-mb-50 {
    margin-bottom: 50px !important;
  }
  .u-mb-60 {
    margin-bottom: 60px !important;
  }
  .u-mb-70 {
    margin-bottom: 70px !important;
  }
  .u-mb-80 {
    margin-bottom: 80px !important;
  }
  .u-mb-90 {
    margin-bottom: 90px !important;
  }
  .u-mb-100 {
    margin-bottom: 100px !important;
  }
  .u-mb-auto {
    margin-bottom: auto !important;
  }
}
@media (min-width: 768px) {
  .u-mb-0-pc {
    margin-bottom: 0px !important;
  }
  .u-mb-5-pc {
    margin-bottom: 5px !important;
  }
  .u-mb-10-pc {
    margin-bottom: 10px !important;
  }
  .u-mb-15-pc {
    margin-bottom: 15px !important;
  }
  .u-mb-20-pc {
    margin-bottom: 20px !important;
  }
  .u-mb-25-pc {
    margin-bottom: 25px !important;
  }
  .u-mb-30-pc {
    margin-bottom: 30px !important;
  }
  .u-mb-40-pc {
    margin-bottom: 40px !important;
  }
  .u-mb-50-pc {
    margin-bottom: 50px !important;
  }
  .u-mb-60-pc {
    margin-bottom: 60px !important;
  }
  .u-mb-70-pc {
    margin-bottom: 70px !important;
  }
  .u-mb-80-pc {
    margin-bottom: 80px !important;
  }
  .u-mb-90-pc {
    margin-bottom: 90px !important;
  }
  .u-mb-100-pc {
    margin-bottom: 100px !important;
  }
  .u-mb-auto-pc {
    margin-bottom: auto !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-mb-0-tab {
    margin-bottom: 0px !important;
  }
  .u-mb-5-tab {
    margin-bottom: 5px !important;
  }
  .u-mb-10-tab {
    margin-bottom: 10px !important;
  }
  .u-mb-15-tab {
    margin-bottom: 15px !important;
  }
  .u-mb-20-tab {
    margin-bottom: 20px !important;
  }
  .u-mb-25-tab {
    margin-bottom: 25px !important;
  }
  .u-mb-30-tab {
    margin-bottom: 30px !important;
  }
  .u-mb-40-tab {
    margin-bottom: 40px !important;
  }
  .u-mb-50-tab {
    margin-bottom: 50px !important;
  }
  .u-mb-60-tab {
    margin-bottom: 60px !important;
  }
  .u-mb-70-tab {
    margin-bottom: 70px !important;
  }
  .u-mb-80-tab {
    margin-bottom: 80px !important;
  }
  .u-mb-90-tab {
    margin-bottom: 90px !important;
  }
  .u-mb-100-tab {
    margin-bottom: 100px !important;
  }
  .u-mb-auto-tab {
    margin-bottom: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .u-mb-0-sp {
    margin-bottom: 0px !important;
  }
  .u-mb-5-sp {
    margin-bottom: 5px !important;
  }
  .u-mb-10-sp {
    margin-bottom: 10px !important;
  }
  .u-mb-15-sp {
    margin-bottom: 15px !important;
  }
  .u-mb-20-sp {
    margin-bottom: 20px !important;
  }
  .u-mb-25-sp {
    margin-bottom: 25px !important;
  }
  .u-mb-30-sp {
    margin-bottom: 30px !important;
  }
  .u-mb-40-sp {
    margin-bottom: 40px !important;
  }
  .u-mb-50-sp {
    margin-bottom: 50px !important;
  }
  .u-mb-60-sp {
    margin-bottom: 60px !important;
  }
  .u-mb-70-sp {
    margin-bottom: 70px !important;
  }
  .u-mb-80-sp {
    margin-bottom: 80px !important;
  }
  .u-mb-90-sp {
    margin-bottom: 90px !important;
  }
  .u-mb-100-sp {
    margin-bottom: 100px !important;
  }
  .u-mb-auto-sp {
    margin-bottom: auto !important;
  }
}

@media (min-width: 0px) {
  .u-my-0 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  .u-my-5 {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
  .u-my-10 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
  .u-my-15 {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }
  .u-my-20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
  .u-my-25 {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
  .u-my-30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }
  .u-my-40 {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
  .u-my-50 {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
  .u-my-60 {
    margin-top: 60px !important;
    margin-bottom: 60px !important;
  }
  .u-my-70 {
    margin-top: 70px !important;
    margin-bottom: 70px !important;
  }
  .u-my-80 {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
  .u-my-90 {
    margin-top: 90px !important;
    margin-bottom: 90px !important;
  }
  .u-my-100 {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
  .u-my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
}
@media (min-width: 768px) {
  .u-my-0-pc {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  .u-my-5-pc {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
  .u-my-10-pc {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
  .u-my-15-pc {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }
  .u-my-20-pc {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
  .u-my-25-pc {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
  .u-my-30-pc {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }
  .u-my-40-pc {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
  .u-my-50-pc {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
  .u-my-60-pc {
    margin-top: 60px !important;
    margin-bottom: 60px !important;
  }
  .u-my-70-pc {
    margin-top: 70px !important;
    margin-bottom: 70px !important;
  }
  .u-my-80-pc {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
  .u-my-90-pc {
    margin-top: 90px !important;
    margin-bottom: 90px !important;
  }
  .u-my-100-pc {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
  .u-my-auto-pc {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-my-0-tab {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  .u-my-5-tab {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
  .u-my-10-tab {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
  .u-my-15-tab {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }
  .u-my-20-tab {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
  .u-my-25-tab {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
  .u-my-30-tab {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }
  .u-my-40-tab {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
  .u-my-50-tab {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
  .u-my-60-tab {
    margin-top: 60px !important;
    margin-bottom: 60px !important;
  }
  .u-my-70-tab {
    margin-top: 70px !important;
    margin-bottom: 70px !important;
  }
  .u-my-80-tab {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
  .u-my-90-tab {
    margin-top: 90px !important;
    margin-bottom: 90px !important;
  }
  .u-my-100-tab {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
  .u-my-auto-tab {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .u-my-0-sp {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }
  .u-my-5-sp {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
  .u-my-10-sp {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }
  .u-my-15-sp {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
  }
  .u-my-20-sp {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }
  .u-my-25-sp {
    margin-top: 25px !important;
    margin-bottom: 25px !important;
  }
  .u-my-30-sp {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
  }
  .u-my-40-sp {
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
  .u-my-50-sp {
    margin-top: 50px !important;
    margin-bottom: 50px !important;
  }
  .u-my-60-sp {
    margin-top: 60px !important;
    margin-bottom: 60px !important;
  }
  .u-my-70-sp {
    margin-top: 70px !important;
    margin-bottom: 70px !important;
  }
  .u-my-80-sp {
    margin-top: 80px !important;
    margin-bottom: 80px !important;
  }
  .u-my-90-sp {
    margin-top: 90px !important;
    margin-bottom: 90px !important;
  }
  .u-my-100-sp {
    margin-top: 100px !important;
    margin-bottom: 100px !important;
  }
  .u-my-auto-sp {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }
}

@media (min-width: 0px) {
  .u-ml-0 {
    margin-left: 0px !important;
  }
  .u-ml-5 {
    margin-left: 5px !important;
  }
  .u-ml-10 {
    margin-left: 10px !important;
  }
  .u-ml-15 {
    margin-left: 15px !important;
  }
  .u-ml-20 {
    margin-left: 20px !important;
  }
  .u-ml-25 {
    margin-left: 25px !important;
  }
  .u-ml-30 {
    margin-left: 30px !important;
  }
  .u-ml-40 {
    margin-left: 40px !important;
  }
  .u-ml-50 {
    margin-left: 50px !important;
  }
  .u-ml-60 {
    margin-left: 60px !important;
  }
  .u-ml-70 {
    margin-left: 70px !important;
  }
  .u-ml-80 {
    margin-left: 80px !important;
  }
  .u-ml-90 {
    margin-left: 90px !important;
  }
  .u-ml-100 {
    margin-left: 100px !important;
  }
  .u-ml-auto {
    margin-left: auto !important;
  }
  .u-ml-1em {
    margin-left: 1em !important;
  }
  .u-ml-2em {
    margin-left: 2em !important;
  }
}

@media (min-width: 768px) {
  .u-ml-0-pc {
    margin-left: 0px !important;
  }
  .u-ml-5-pc {
    margin-left: 5px !important;
  }
  .u-ml-10-pc {
    margin-left: 10px !important;
  }
  .u-ml-15-pc {
    margin-left: 15px !important;
  }
  .u-ml-20-pc {
    margin-left: 20px !important;
  }
  .u-ml-25-pc {
    margin-left: 25px !important;
  }
  .u-ml-30-pc {
    margin-left: 30px !important;
  }
  .u-ml-40-pc {
    margin-left: 40px !important;
  }
  .u-ml-50-pc {
    margin-left: 50px !important;
  }
  .u-ml-60-pc {
    margin-left: 60px !important;
  }
  .u-ml-70-pc {
    margin-left: 70px !important;
  }
  .u-ml-80-pc {
    margin-left: 80px !important;
  }
  .u-ml-90-pc {
    margin-left: 90px !important;
  }
  .u-ml-100-pc {
    margin-left: 100px !important;
  }
  .u-ml-auto-pc {
    margin-left: auto !important;
  }
  .u-ml-1em-pc {
    margin-left: 1em !important;
  }
  .u-ml-2em-pc {
    margin-left: 2em !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-ml-0-tab {
    margin-left: 0px !important;
  }
  .u-ml-5-tab {
    margin-left: 5px !important;
  }
  .u-ml-10-tab {
    margin-left: 10px !important;
  }
  .u-ml-15-tab {
    margin-left: 15px !important;
  }
  .u-ml-20-tab {
    margin-left: 20px !important;
  }
  .u-ml-25-tab {
    margin-left: 25px !important;
  }
  .u-ml-30-tab {
    margin-left: 30px !important;
  }
  .u-ml-40-tab {
    margin-left: 40px !important;
  }
  .u-ml-50-tab {
    margin-left: 50px !important;
  }
  .u-ml-60-tab {
    margin-left: 60px !important;
  }
  .u-ml-70-tab {
    margin-left: 70px !important;
  }
  .u-ml-80-tab {
    margin-left: 80px !important;
  }
  .u-ml-90-tab {
    margin-left: 90px !important;
  }
  .u-ml-100-tab {
    margin-left: 100px !important;
  }
  .u-ml-auto-tab {
    margin-left: auto !important;
  }
  .u-ml-1em-tab {
    margin-left: 1em !important;
  }
  .u-ml-2em-tab {
    margin-left: 2em !important;
  }
}
@media screen and (max-width: 767px) {
  .u-ml-0-sp {
    margin-left: 0px !important;
  }
  .u-ml-5-sp {
    margin-left: 5px !important;
  }
  .u-ml-10-sp {
    margin-left: 10px !important;
  }
  .u-ml-15-sp {
    margin-left: 15px !important;
  }
  .u-ml-20-sp {
    margin-left: 20px !important;
  }
  .u-ml-25-sp {
    margin-left: 25px !important;
  }
  .u-ml-30-sp {
    margin-left: 30px !important;
  }
  .u-ml-40-sp {
    margin-left: 40px !important;
  }
  .u-ml-50-sp {
    margin-left: 50px !important;
  }
  .u-ml-60-sp {
    margin-left: 60px !important;
  }
  .u-ml-70-sp {
    margin-left: 70px !important;
  }
  .u-ml-80-sp {
    margin-left: 80px !important;
  }
  .u-ml-90-sp {
    margin-left: 90px !important;
  }
  .u-ml-100-sp {
    margin-left: 100px !important;
  }
  .u-ml-auto-sp {
    margin-left: auto !important;
  }
  .u-ml-1em-sp {
    margin-left: 1em !important;
  }
  .u-ml-2em-sp {
    margin-left: 2em !important;
  }
}

@media (min-width: 0px) {
  .u-mr-0 {
    margin-right: 0px !important;
  }
  .u-mr-5 {
    margin-right: 5px !important;
  }
  .u-mr-10 {
    margin-right: 10px !important;
  }
  .u-mr-15 {
    margin-right: 15px !important;
  }
  .u-mr-20 {
    margin-right: 20px !important;
  }
  .u-mr-25 {
    margin-right: 25px !important;
  }
  .u-mr-30 {
    margin-right: 30px !important;
  }
  .u-mr-40 {
    margin-right: 40px !important;
  }
  .u-mr-50 {
    margin-right: 50px !important;
  }
  .u-mr-60 {
    margin-right: 60px !important;
  }
  .u-mr-70 {
    margin-right: 70px !important;
  }
  .u-mr-80 {
    margin-right: 80px !important;
  }
  .u-mr-90 {
    margin-right: 90px !important;
  }
  .u-mr-100 {
    margin-right: 100px !important;
  }
  .u-mr-auto {
    margin-right: auto !important;
  }
  .u-mr-1em {
    margin-right: 1em !important;
  }
  .u-mr-2em {
    margin-right: 2em !important;
  }
}
@media (min-width: 768px) {
  .u-mr-0-pc {
    margin-right: 0px !important;
  }
  .u-mr-5-pc {
    margin-right: 5px !important;
  }
  .u-mr-10-pc {
    margin-right: 10px !important;
  }
  .u-mr-15-pc {
    margin-right: 15px !important;
  }
  .u-mr-20-pc {
    margin-right: 20px !important;
  }
  .u-mr-25-pc {
    margin-right: 25px !important;
  }
  .u-mr-30-pc {
    margin-right: 30px !important;
  }
  .u-mr-40-pc {
    margin-right: 40px !important;
  }
  .u-mr-50-pc {
    margin-right: 50px !important;
  }
  .u-mr-60-pc {
    margin-right: 60px !important;
  }
  .u-mr-70-pc {
    margin-right: 70px !important;
  }
  .u-mr-80-pc {
    margin-right: 80px !important;
  }
  .u-mr-90-pc {
    margin-right: 90px !important;
  }
  .u-mr-100-pc {
    margin-right: 100px !important;
  }
  .u-mr-auto-pc {
    margin-right: auto !important;
  }
  .u-mr-1em-pc {
    margin-right: 1em !important;
  }
  .u-mr-2em-pc {
    margin-right: 2em !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-mr-0-tab {
    margin-right: 0px !important;
  }
  .u-mr-5-tab {
    margin-right: 5px !important;
  }
  .u-mr-10-tab {
    margin-right: 10px !important;
  }
  .u-mr-15-tab {
    margin-right: 15px !important;
  }
  .u-mr-20-tab {
    margin-right: 20px !important;
  }
  .u-mr-25-tab {
    margin-right: 25px !important;
  }
  .u-mr-30-tab {
    margin-right: 30px !important;
  }
  .u-mr-40-tab {
    margin-right: 40px !important;
  }
  .u-mr-50-tab {
    margin-right: 50px !important;
  }
  .u-mr-60-tab {
    margin-right: 60px !important;
  }
  .u-mr-70-tab {
    margin-right: 70px !important;
  }
  .u-mr-80-tab {
    margin-right: 80px !important;
  }
  .u-mr-90-tab {
    margin-right: 90px !important;
  }
  .u-mr-100-tab {
    margin-right: 100px !important;
  }
  .u-mr-auto-tab {
    margin-right: auto !important;
  }
  .u-mr-1em-tab {
    margin-right: 1em !important;
  }
  .u-mr-2em-tab {
    margin-right: 2em !important;
  }
}
@media screen and (max-width: 767px) {
  .u-mr-0-sp {
    margin-right: 0px !important;
  }
  .u-mr-5-sp {
    margin-right: 5px !important;
  }
  .u-mr-10-sp {
    margin-right: 10px !important;
  }
  .u-mr-15-sp {
    margin-right: 15px !important;
  }
  .u-mr-20-sp {
    margin-right: 20px !important;
  }
  .u-mr-25-sp {
    margin-right: 25px !important;
  }
  .u-mr-30-sp {
    margin-right: 30px !important;
  }
  .u-mr-40-sp {
    margin-right: 40px !important;
  }
  .u-mr-50-sp {
    margin-right: 50px !important;
  }
  .u-mr-60-sp {
    margin-right: 60px !important;
  }
  .u-mr-70-sp {
    margin-right: 70px !important;
  }
  .u-mr-80-sp {
    margin-right: 80px !important;
  }
  .u-mr-90-sp {
    margin-right: 90px !important;
  }
  .u-mr-100-sp {
    margin-right: 100px !important;
  }
  .u-mr-auto-sp {
    margin-right: auto !important;
  }
  .u-mr-1em-sp {
    margin-right: 1em !important;
  }
  .u-mr-2em-sp {
    margin-right: 2em !important;
  }
}

@media (min-width: 0px) {
  .u-mx-0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  .u-mx-2 {
    margin-left: 2px !important;
    margin-right: 2px !important;
  }
  .u-mx-5 {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
  .u-mx-10 {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  .u-mx-15 {
    margin-left: 15px !important;
    margin-right: 15px !important;
  }
  .u-mx-20 {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  .u-mx-25 {
    margin-left: 25px !important;
    margin-right: 25px !important;
  }
  .u-mx-30 {
    margin-left: 30px !important;
    margin-right: 30px !important;
  }
  .u-mx-40 {
    margin-left: 40px !important;
    margin-right: 40px !important;
  }
  .u-mx-50 {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
  .u-mx-60 {
    margin-left: 60px !important;
    margin-right: 60px !important;
  }
  .u-mx-70 {
    margin-left: 70px !important;
    margin-right: 70px !important;
  }
  .u-mx-80 {
    margin-left: 80px !important;
    margin-right: 80px !important;
  }
  .u-mx-90 {
    margin-left: 90px !important;
    margin-right: 90px !important;
  }
  .u-mx-100 {
    margin-left: 100px !important;
    margin-right: 100px !important;
  }
  .u-mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media (min-width: 768px) {
  .u-mx-0-pc {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  .u-mx-2-pc {
    margin-left: 2px !important;
    margin-right: 2px !important;
  }
  .u-mx-5-pc {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
  .u-mx-10-pc {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  .u-mx-15-pc {
    margin-left: 15px !important;
    margin-right: 15px !important;
  }
  .u-mx-20-pc {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  .u-mx-25-pc {
    margin-left: 25px !important;
    margin-right: 25px !important;
  }
  .u-mx-30-pc {
    margin-left: 30px !important;
    margin-right: 30px !important;
  }
  .u-mx-40-pc {
    margin-left: 40px !important;
    margin-right: 40px !important;
  }
  .u-mx-50-pc {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
  .u-mx-60-pc {
    margin-left: 60px !important;
    margin-right: 60px !important;
  }
  .u-mx-70-pc {
    margin-left: 70px !important;
    margin-right: 70px !important;
  }
  .u-mx-80-pc {
    margin-left: 80px !important;
    margin-right: 80px !important;
  }
  .u-mx-90-pc {
    margin-left: 90px !important;
    margin-right: 90px !important;
  }
  .u-mx-100-pc {
    margin-left: 100px !important;
    margin-right: 100px !important;
  }
  .u-mx-auto-pc {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-mx-0-tab {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  .u-mx-2-tab {
    margin-left: 2px !important;
    margin-right: 2px !important;
  }
  .u-mx-5-tab {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
  .u-mx-10-tab {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  .u-mx-15-tab {
    margin-left: 15px !important;
    margin-right: 15px !important;
  }
  .u-mx-20-tab {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  .u-mx-25-tab {
    margin-left: 25px !important;
    margin-right: 25px !important;
  }
  .u-mx-30-tab {
    margin-left: 30px !important;
    margin-right: 30px !important;
  }
  .u-mx-40-tab {
    margin-left: 40px !important;
    margin-right: 40px !important;
  }
  .u-mx-50-tab {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
  .u-mx-60-tab {
    margin-left: 60px !important;
    margin-right: 60px !important;
  }
  .u-mx-70-tab {
    margin-left: 70px !important;
    margin-right: 70px !important;
  }
  .u-mx-80-tab {
    margin-left: 80px !important;
    margin-right: 80px !important;
  }
  .u-mx-90-tab {
    margin-left: 90px !important;
    margin-right: 90px !important;
  }
  .u-mx-100-tab {
    margin-left: 100px !important;
    margin-right: 100px !important;
  }
  .u-mx-auto-tab {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
@media screen and (max-width: 767px) {
  .u-mx-0-sp {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
  .u-mx-2-sp {
    margin-left: 2px !important;
    margin-right: 2px !important;
  }
  .u-mx-5-sp {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }
  .u-mx-10-sp {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  .u-mx-15-sp {
    margin-left: 15px !important;
    margin-right: 15px !important;
  }
  .u-mx-20-sp {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }
  .u-mx-25-sp {
    margin-left: 25px !important;
    margin-right: 25px !important;
  }
  .u-mx-30-sp {
    margin-left: 30px !important;
    margin-right: 30px !important;
  }
  .u-mx-40-sp {
    margin-left: 40px !important;
    margin-right: 40px !important;
  }
  .u-mx-50-sp {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
  .u-mx-60-sp {
    margin-left: 60px !important;
    margin-right: 60px !important;
  }
  .u-mx-70-sp {
    margin-left: 70px !important;
    margin-right: 70px !important;
  }
  .u-mx-80-sp {
    margin-left: 80px !important;
    margin-right: 80px !important;
  }
  .u-mx-90-sp {
    margin-left: 90px !important;
    margin-right: 90px !important;
  }
  .u-mx-100-sp {
    margin-left: 100px !important;
    margin-right: 100px !important;
  }
  .u-mx-auto-sp {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* パディング
-----------------------*/
@media (min-width: 0px) {
  .u-pt-0 {
    padding-top: 0px !important;
  }
  .u-pt-5 {
    padding-top: 5px !important;
  }
  .u-pt-10 {
    padding-top: 10px !important;
  }
  .u-pt-15 {
    padding-top: 15px !important;
  }
  .u-pt-20 {
    padding-top: 20px !important;
  }
  .u-pt-25 {
    padding-top: 25px !important;
  }
  .u-pt-30 {
    padding-top: 30px !important;
  }
  .u-pt-40 {
    padding-top: 40px !important;
  }
  .u-pt-50 {
    padding-top: 50px !important;
  }
  .u-pt-60 {
    padding-top: 60px !important;
  }
  .u-pt-70 {
    padding-top: 70px !important;
  }
  .u-pt-80 {
    padding-top: 80px !important;
  }
  .u-pt-90 {
    padding-top: 90px !important;
  }
  .u-pt-100 {
    padding-top: 100px !important;
  }
  .u-pt-120 {
    padding-top: 120px !important;
  }
}
@media (min-width: 768px) {
  .u-pt-0-pc {
    padding-top: 0px !important;
  }
  .u-pt-5-pc {
    padding-top: 5px !important;
  }
  .u-pt-10-pc {
    padding-top: 10px !important;
  }
  .u-pt-15-pc {
    padding-top: 15px !important;
  }
  .u-pt-20-pc {
    padding-top: 20px !important;
  }
  .u-pt-25-pc {
    padding-top: 25px !important;
  }
  .u-pt-30-pc {
    padding-top: 30px !important;
  }
  .u-pt-40-pc {
    padding-top: 40px !important;
  }
  .u-pt-50-pc {
    padding-top: 50px !important;
  }
  .u-pt-60-pc {
    padding-top: 60px !important;
  }
  .u-pt-70-pc {
    padding-top: 70px !important;
  }
  .u-pt-80-pc {
    padding-top: 80px !important;
  }
  .u-pt-90-pc {
    padding-top: 90px !important;
  }
  .u-pt-100-pc {
    padding-top: 100px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-pt-0-tab {
    padding-top: 0px !important;
  }
  .u-pt-5-tab {
    padding-top: 5px !important;
  }
  .u-pt-10-tab {
    padding-top: 10px !important;
  }
  .u-pt-15-tab {
    padding-top: 15px !important;
  }
  .u-pt-20-tab {
    padding-top: 20px !important;
  }
  .u-pt-25-tab {
    padding-top: 25px !important;
  }
  .u-pt-30-tab {
    padding-top: 30px !important;
  }
  .u-pt-40-tab {
    padding-top: 40px !important;
  }
  .u-pt-50-tab {
    padding-top: 50px !important;
  }
  .u-pt-60-tab {
    padding-top: 60px !important;
  }
  .u-pt-70-tab {
    padding-top: 70px !important;
  }
  .u-pt-80-tab {
    padding-top: 80px !important;
  }
  .u-pt-90-tab {
    padding-top: 90px !important;
  }
  .u-pt-100-tab {
    padding-top: 100px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-pt-0-sp {
    padding-top: 0px !important;
  }
  .u-pt-5-sp {
    padding-top: 5px !important;
  }
  .u-pt-10-sp {
    padding-top: 10px !important;
  }
  .u-pt-15-sp {
    padding-top: 15px !important;
  }
  .u-pt-20-sp {
    padding-top: 20px !important;
  }
  .u-pt-25-sp {
    padding-top: 25px !important;
  }
  .u-pt-30-sp {
    padding-top: 30px !important;
  }
  .u-pt-40-sp {
    padding-top: 40px !important;
  }
  .u-pt-50-sp {
    padding-top: 50px !important;
  }
  .u-pt-60-sp {
    padding-top: 60px !important;
  }
  .u-pt-70-sp {
    padding-top: 70px !important;
  }
  .u-pt-80-sp {
    padding-top: 80px !important;
  }
  .u-pt-90-sp {
    padding-top: 90px !important;
  }
  .u-pt-100-sp {
    padding-top: 100px !important;
  }
}

@media (min-width: 0px) {
  .u-pb-0 {
    padding-bottom: 0px !important;
  }
  .u-pb-5 {
    padding-bottom: 5px !important;
  }
  .u-pb-10 {
    padding-bottom: 10px !important;
  }
  .u-pb-15 {
    padding-bottom: 15px !important;
  }
  .u-pb-20 {
    padding-bottom: 20px !important;
  }
  .u-pb-25 {
    padding-bottom: 25px !important;
  }
  .u-pb-30 {
    padding-bottom: 30px !important;
  }
  .u-pb-40 {
    padding-bottom: 40px !important;
  }
  .u-pb-50 {
    padding-bottom: 50px !important;
  }
  .u-pb-60 {
    padding-bottom: 60px !important;
  }
  .u-pb-70 {
    padding-bottom: 70px !important;
  }
  .u-pb-80 {
    padding-bottom: 80px !important;
  }
  .u-pb-90 {
    padding-bottom: 90px !important;
  }
  .u-pb-100 {
    padding-bottom: 100px !important;
  }
}
@media (min-width: 768px) {
  .u-pb-0-pc {
    padding-bottom: 0px !important;
  }
  .u-pb-5-pc {
    padding-bottom: 5px !important;
  }
  .u-pb-10-pc {
    padding-bottom: 10px !important;
  }
  .u-pb-15-pc {
    padding-bottom: 15px !important;
  }
  .u-pb-20-pc {
    padding-bottom: 20px !important;
  }
  .u-pb-25-pc {
    padding-bottom: 25px !important;
  }
  .u-pb-30-pc {
    padding-bottom: 30px !important;
  }
  .u-pb-40-pc {
    padding-bottom: 40px !important;
  }
  .u-pb-50-pc {
    padding-bottom: 50px !important;
  }
  .u-pb-60-pc {
    padding-bottom: 60px !important;
  }
  .u-pb-70-pc {
    padding-bottom: 70px !important;
  }
  .u-pb-80-pc {
    padding-bottom: 80px !important;
  }
  .u-pb-90-pc {
    padding-bottom: 90px !important;
  }
  .u-pb-100-pc {
    padding-bottom: 100px !important;
  }
  .u-pb-200-pc {
    padding-bottom: 200px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-pb-0-tab {
    padding-bottom: 0px !important;
  }
  .u-pb-5-tab {
    padding-bottom: 5px !important;
  }
  .u-pb-10-tab {
    padding-bottom: 10px !important;
  }
  .u-pb-15-tab {
    padding-bottom: 15px !important;
  }
  .u-pb-20-tab {
    padding-bottom: 20px !important;
  }
  .u-pb-25-tab {
    padding-bottom: 25px !important;
  }
  .u-pb-30-tab {
    padding-bottom: 30px !important;
  }
  .u-pb-40-tab {
    padding-bottom: 40px !important;
  }
  .u-pb-50-tab {
    padding-bottom: 50px !important;
  }
  .u-pb-60-tab {
    padding-bottom: 60px !important;
  }
  .u-pb-70-tab {
    padding-bottom: 70px !important;
  }
  .u-pb-80-tab {
    padding-bottom: 80px !important;
  }
  .u-pb-90-sp {
    padding-bottom: 90px !important;
  }
  .u-pb-100-tab {
    padding-bottom: 100px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-pb-0-sp {
    padding-bottom: 0px !important;
  }
  .u-pb-5-sp {
    padding-bottom: 5px !important;
  }
  .u-pb-10-sp {
    padding-bottom: 10px !important;
  }
  .u-pb-15-sp {
    padding-bottom: 15px !important;
  }
  .u-pb-20-sp {
    padding-bottom: 20px !important;
  }
  .u-pb-25-sp {
    padding-bottom: 25px !important;
  }
  .u-pb-30-sp {
    padding-bottom: 30px !important;
  }
  .u-pb-40-sp {
    padding-bottom: 40px !important;
  }
  .u-pb-50-sp {
    padding-bottom: 50px !important;
  }
  .u-pb-60-sp {
    padding-bottom: 60px !important;
  }
  .u-pb-70-sp {
    padding-bottom: 70px !important;
  }
  .u-pb-80-sp {
    padding-bottom: 80px !important;
  }
  .u-pb-90-sp {
    padding-bottom: 90px !important;
  }
  .u-pb-100-sp {
    padding-bottom: 100px !important;
  }
}

@media (min-width: 0px) {
  .u-py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .u-py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .u-py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .u-py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .u-py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .u-py-25 {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
  .u-py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .u-py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .u-py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .u-py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .u-py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .u-py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .u-py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .u-py-100 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}
@media (min-width: 768px) {
  .u-py-0-pc {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .u-py-5-pc {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .u-py-10-pc {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .u-py-15-pc {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .u-py-20-pc {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .u-py-25-pc {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
  .u-py-30-pc {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .u-py-40-pc {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .u-py-50-pc {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .u-py-60-pc {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .u-py-70-pc {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .u-py-80-pc {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .u-py-90-pc {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .u-py-100-pc {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-py-0-tab {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .u-py-5-tab {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .u-py-10-tab {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .u-py-15-tab {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .u-py-20-tab {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .u-py-25-tab {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
  .u-py-30-tab {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .u-py-40-tab {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .u-py-50-tab {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .u-py-60-tab {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .u-py-70-tab {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .u-py-80-tab {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .u-py-90-tab {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .u-py-100-tab {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-py-0-sp {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .u-py-5-sp {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .u-py-10-sp {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .u-py-15-sp {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .u-py-20-sp {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .u-py-25-sp {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
  .u-py-30-sp {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .u-py-40-sp {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .u-py-50-sp {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .u-py-60-sp {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .u-py-70-sp {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .u-py-80-sp {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .u-py-90-sp {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .u-py-100-sp {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
  }
}

@media (min-width: 0px) {
  .u-pl-0 {
    padding-left: 0px !important;
  }
  .u-pl-5 {
    padding-left: 5px !important;
  }
  .u-pl-10 {
    padding-left: 10px !important;
  }
  .u-pl-15 {
    padding-left: 15px !important;
  }
  .u-pl-20 {
    padding-left: 20px !important;
  }
  .u-pl-22 {
    padding-left: 22px !important;
  }
  .u-pl-25 {
    padding-left: 25px !important;
  }
  .u-pl-30 {
    padding-left: 30px !important;
  }
  .u-pl-40 {
    padding-left: 40px !important;
  }
  .u-pl-50 {
    padding-left: 50px !important;
  }
  .u-pl-60 {
    padding-left: 60px !important;
  }
  .u-pl-70 {
    padding-left: 70px !important;
  }
  .u-pl-80 {
    padding-left: 80px !important;
  }
  .u-pl-90 {
    padding-left: 90px !important;
  }
  .u-pl-100 {
    padding-left: 100px !important;
  }
}
@media (min-width: 768px) {
  .u-pl-0-pc {
    padding-left: 0px !important;
  }
  .u-pl-5-pc {
    padding-left: 5px !important;
  }
  .u-pl-10-pc {
    padding-left: 10px !important;
  }
  .u-pl-15-pc {
    padding-left: 15px !important;
  }
  .u-pl-20-pc {
    padding-left: 20px !important;
  }
  .u-pl-22-pc {
    padding-left: 22px !important;
  }
  .u-pl-25-pc {
    padding-left: 25px !important;
  }
  .u-pl-30-pc {
    padding-left: 30px !important;
  }
  .u-pl-40-pc {
    padding-left: 40px !important;
  }
  .u-pl-50-pc {
    padding-left: 50px !important;
  }
  .u-pl-60-pc {
    padding-left: 60px !important;
  }
  .u-pl-70-pc {
    padding-left: 70px !important;
  }
  .u-pl-80-pc {
    padding-left: 80px !important;
  }
  .u-pl-90-pc {
    padding-left: 90px !important;
  }
  .u-pl-100-pc {
    padding-left: 100px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-pl-0-tab {
    padding-left: 0px !important;
  }
  .u-pl-5-tab {
    padding-left: 5px !important;
  }
  .u-pl-10-tab {
    padding-left: 10px !important;
  }
  .u-pl-15-tab {
    padding-left: 15px !important;
  }
  .u-pl-20-tab {
    padding-left: 20px !important;
  }
  .u-pl-22-tab {
    padding-left: 22px !important;
  }
  .u-pl-25-tab {
    padding-left: 25px !important;
  }
  .u-pl-30-tab {
    padding-left: 30px !important;
  }
  .u-pl-40-tab {
    padding-left: 40px !important;
  }
  .u-pl-50-tab {
    padding-left: 50px !important;
  }
  .u-pl-60-tab {
    padding-left: 60px !important;
  }
  .u-pl-70-tab {
    padding-left: 70px !important;
  }
  .u-pl-80-tab {
    padding-left: 80px !important;
  }
  .u-pl-90-tab {
    padding-left: 90px !important;
  }
  .u-pl-100-tab {
    padding-left: 100px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-pl-0-sp {
    padding-left: 0px !important;
  }
  .u-pl-5-sp {
    padding-left: 5px !important;
  }
  .u-pl-10-sp {
    padding-left: 10px !important;
  }
  .u-pl-15-sp {
    padding-left: 15px !important;
  }
  .u-pl-20-sp {
    padding-left: 20px !important;
  }
  .u-pl-22-sp {
    padding-left: 22px !important;
  }
  .u-pl-25-sp {
    padding-left: 25px !important;
  }
  .u-pl-30-sp {
    padding-left: 30px !important;
  }
  .u-pl-40-sp {
    padding-left: 40px !important;
  }
  .u-pl-50-sp {
    padding-left: 50px !important;
  }
  .u-pl-60-sp {
    padding-left: 60px !important;
  }
  .u-pl-70-sp {
    padding-left: 70px !important;
  }
  .u-pl-80-sp {
    padding-left: 80px !important;
  }
  .u-pl-90-sp {
    padding-left: 90px !important;
  }
  .u-pl-100-sp {
    padding-left: 100px !important;
  }
}

@media (min-width: 0px) {
  .u-pr-0 {
    padding-right: 0px !important;
  }
  .u-pr-5 {
    padding-right: 5px !important;
  }
  .u-pr-10 {
    padding-right: 10px !important;
  }
  .u-pr-15 {
    padding-right: 15px !important;
  }
  .u-pr-20 {
    padding-right: 20px !important;
  }
  .u-pr-22 {
    padding-right: 22px !important;
  }
  .u-pr-25 {
    padding-right: 25px !important;
  }
  .u-pr-30 {
    padding-right: 30px !important;
  }
  .u-pr-40 {
    padding-right: 40px !important;
  }
  .u-pr-50 {
    padding-right: 50px !important;
  }
  .u-pr-60 {
    padding-right: 60px !important;
  }
  .u-pr-70 {
    padding-right: 70px !important;
  }
  .u-pr-80 {
    padding-right: 80px !important;
  }
  .u-pr-90 {
    padding-right: 90px !important;
  }
  .u-pr-100 {
    padding-right: 100px !important;
  }
}
@media (min-width: 768px) {
  .u-pr-0-pc {
    padding-right: 0px !important;
  }
  .u-pr-5-pc {
    padding-right: 5px !important;
  }
  .u-pr-10-pc {
    padding-right: 10px !important;
  }
  .u-pr-15-pc {
    padding-right: 15px !important;
  }
  .u-pr-20-pc {
    padding-right: 20px !important;
  }
  .u-pr-22-pc {
    padding-right: 22px !important;
  }
  .u-pr-25-pc {
    padding-right: 25px !important;
  }
  .u-pr-30-pc {
    padding-right: 30px !important;
  }
  .u-pr-40-pc {
    padding-right: 40px !important;
  }
  .u-pr-50-pc {
    padding-right: 50px !important;
  }
  .u-pr-60-pc {
    padding-right: 60px !important;
  }
  .u-pr-70-pc {
    padding-right: 70px !important;
  }
  .u-pr-80-pc {
    padding-right: 80px !important;
  }
  .u-pr-90-pc {
    padding-right: 90px !important;
  }
  .u-pr-100-pc {
    padding-right: 100px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-pr-0-tab {
    padding-right: 0px !important;
  }
  .u-pr-5-tab {
    padding-right: 5px !important;
  }
  .u-pr-10-tab {
    padding-right: 10px !important;
  }
  .u-pr-15-tab {
    padding-right: 15px !important;
  }
  .u-pr-20-tab {
    padding-right: 20px !important;
  }
  .u-pr-22-tab {
    padding-right: 22px !important;
  }
  .u-pr-25-tab {
    padding-right: 25px !important;
  }
  .u-pr-30-tab {
    padding-right: 30px !important;
  }
  .u-pr-40-tab {
    padding-right: 40px !important;
  }
  .u-pr-50-tab {
    padding-right: 50px !important;
  }
  .u-pr-60-tab {
    padding-right: 60px !important;
  }
  .u-pr-70-tab {
    padding-right: 70px !important;
  }
  .u-pr-80-tab {
    padding-right: 80px !important;
  }
  .u-pr-90-tab {
    padding-right: 90px !important;
  }
  .u-pr-100-tab {
    padding-right: 100px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-pr-0-sp {
    padding-right: 0px !important;
  }
  .u-pr-5-sp {
    padding-right: 5px !important;
  }
  .u-pr-10-sp {
    padding-right: 10px !important;
  }
  .u-pr-15-sp {
    padding-right: 15px !important;
  }
  .u-pr-20-sp {
    padding-right: 20px !important;
  }
  .u-pr-22-sp {
    padding-right: 22px !important;
  }
  .u-pr-25-sp {
    padding-right: 25px !important;
  }
  .u-pr-30-sp {
    padding-right: 30px !important;
  }
  .u-pr-40-sp {
    padding-right: 40px !important;
  }
  .u-pr-50-sp {
    padding-right: 50px !important;
  }
  .u-pr-60-sp {
    padding-right: 60px !important;
  }
  .u-pr-70-sp {
    padding-right: 70px !important;
  }
  .u-pr-80-sp {
    padding-right: 80px !important;
  }
  .u-pr-90-sp {
    padding-right: 90px !important;
  }
  .u-pr-100-sp {
    padding-right: 100px !important;
  }
}

@media (min-width: 0px) {
  .u-px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .u-px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .u-px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .u-px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .u-px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .u-px-25 {
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
  .u-px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .u-px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .u-px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .u-px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .u-px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .u-px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .u-px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .u-px-100 {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}
@media (min-width: 768px) {
  .u-px-0-pc {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .u-px-5-pc {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .u-px-10-pc {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .u-px-15-pc {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .u-px-20-pc {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .u-px-25-pc {
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
  .u-px-30-pc {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .u-px-40-pc {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .u-px-50-pc {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .u-px-60-pc {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .u-px-70-pc {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .u-px-80-pc {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .u-px-90-pc {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .u-px-100-pc {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-px-0-tab {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .u-px-5-tab {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .u-px-10-tab {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .u-px-15-tab {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .u-px-20-tab {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .u-px-25-tab {
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
  .u-px-30-tab {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .u-px-40-tab {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .u-px-50-tab {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .u-px-60-tab {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .u-px-70-tab {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .u-px-80-tab {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .u-px-90-tab {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .u-px-100-tab {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-px-0-sp {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .u-px-5-sp {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .u-px-10-sp {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .u-px-15-sp {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .u-px-20-sp {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .u-px-25-sp {
    padding-left: 25px !important;
    padding-right: 25px !important;
  }
  .u-px-30-sp {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .u-px-40-sp {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .u-px-50-sp {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .u-px-60-sp {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .u-px-70-sp {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .u-px-80-sp {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .u-px-90-sp {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .u-px-100-sp {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}

/* ボーダー
-----------------------*/
.u-br-50p {
  border-radius: 50% !important;
}

/* 横幅
-----------------------*/
@media (min-width: 0px) {
  .u-w-auto {
    width: auto !important;
  }
  .u-w-5p {
    width: 5% !important;
  }
  .u-w-10p {
    width: 10% !important;
  }
  .u-w-15p {
    width: 15% !important;
  }
  .u-w-20p {
    width: 20% !important;
  }
  .u-w-25p {
    width: 25% !important;
  }
  .u-w-30p {
    width: 30% !important;
  }
  .u-w-35p {
    width: 35% !important;
  }
  .u-w-40p {
    width: 40% !important;
  }
  .u-w-45p {
    width: 45% !important;
  }
  .u-w-50p {
    width: 50% !important;
  }
  .u-w-55p {
    width: 55% !important;
  }
  .u-w-60p {
    width: 60% !important;
  }
  .u-w-65p {
    width: 65% !important;
  }
  .u-w-70p {
    width: 70% !important;
  }
  .u-w-75p {
    width: 75% !important;
  }
  .u-w-80p {
    width: 80% !important;
  }
  .u-w-85p {
    width: 85% !important;
  }
  .u-w-90p {
    width: 90% !important;
  }
  .u-w-95p {
    width: 90% !important;
  }
  .u-w-100p {
    width: 100% !important;
  }
  .u-w-1 {
    width: 1px !important;
  }
  .u-w-5 {
    width: 5px !important;
  }
  .u-w-10 {
    width: 10px !important;
  }
  .u-w-15 {
    width: 15px !important;
  }
  .u-w-20 {
    width: 20px !important;
  }
  .u-w-25 {
    width: 25px !important;
  }
  .u-w-30 {
    width: 30px !important;
  }
  .u-w-35 {
    width: 35px !important;
  }
  .u-w-40 {
    width: 40px !important;
  }
  .u-w-45 {
    width: 45px !important;
  }
  .u-w-50 {
    width: 50px !important;
  }
  .u-w-55 {
    width: 55px !important;
  }
  .u-w-60 {
    width: 60px !important;
  }
  .u-w-65 {
    width: 65px !important;
  }
  .u-w-70 {
    width: 70px !important;
  }
  .u-w-75 {
    width: 75px !important;
  }
  .u-w-80 {
    width: 80px !important;
  }
  .u-w-85 {
    width: 85px !important;
  }
  .u-w-90 {
    width: 90px !important;
  }
  .u-w-95 {
    width: 95px !important;
  }
  .u-w-100 {
    width: 100px !important;
  }
  .u-w-110 {
    width: 110px !important;
  }
  .u-w-120 {
    width: 120px !important;
  }
  .u-w-130 {
    width: 130px !important;
  }
  .u-w-140 {
    width: 140px !important;
  }
  .u-w-150 {
    width: 150px !important;
  }
  .u-w-160 {
    width: 160px !important;
  }
  .u-w-170 {
    width: 170px !important;
  }
  .u-w-180 {
    width: 180px !important;
  }
  .u-w-190 {
    width: 190px !important;
  }
  .u-w-200 {
    width: 200px !important;
  }
  .u-w-210 {
    width: 210px !important;
  }
  .u-w-220 {
    width: 220px !important;
  }
  .u-w-230 {
    width: 230px !important;
  }
  .u-w-240 {
    width: 240px !important;
  }
  .u-w-250 {
    width: 250px !important;
  }
  .u-w-260 {
    width: 260px !important;
  }
  .u-w-270 {
    width: 270px !important;
  }
  .u-w-280 {
    width: 280px !important;
  }
  .u-w-290 {
    width: 290px !important;
  }
  .u-w-300 {
    width: 300px !important;
  }
  .u-w-350 {
    width: 350px !important;
  }
  .u-w-400 {
    width: 400px !important;
  }
  .u-w-450 {
    width: 450px !important;
  }
  .u-w-500 {
    width: 500px !important;
  }
  .u-w-550 {
    width: 550px !important;
  }
  .u-w-600 {
    width: 600px !important;
  }
  .u-w-650 {
    width: 650px !important;
  }
  .u-w-700 {
    width: 700px !important;
  }
  .u-w-750 {
    width: 750px !important;
  }
  .u-w-800 {
    width: 800px !important;
  }
  .u-w-850 {
    width: 850px !important;
  }
  .u-w-900 {
    width: 900px !important;
  }
  .u-w-950 {
    width: 950px !important;
  }
  .u-w-980 {
    width: 980px !important;
  }
  .u-w-1000 {
    width: 1000px !important;
  }
}
@media (min-width: 768px) {
  .u-w-auto-pc {
    width: auto !important;
  }
  .u-w-5p-pc {
    width: 5% !important;
  }
  .u-w-10p-pc {
    width: 10% !important;
  }
  .u-w-15p-pc {
    width: 15% !important;
  }
  .u-w-20p-pc {
    width: 20% !important;
  }
  .u-w-25p-pc {
    width: 25% !important;
  }
  .u-w-30p-pc {
    width: 30% !important;
  }
  .u-w-35p-pc {
    width: 35% !important;
  }
  .u-w-40p-pc {
    width: 40% !important;
  }
  .u-w-45p-pc {
    width: 45% !important;
  }
  .u-w-50p-pc {
    width: 50% !important;
  }
  .u-w-55p-pc {
    width: 55% !important;
  }
  .u-w-60p-pc {
    width: 60% !important;
  }
  .u-w-65p-pc {
    width: 65% !important;
  }
  .u-w-70p-pc {
    width: 70% !important;
  }
  .u-w-75p-pc {
    width: 75% !important;
  }
  .u-w-80p-pc {
    width: 80% !important;
  }
  .u-w-85p-pc {
    width: 85% !important;
  }
  .u-w-90p-pc {
    width: 90% !important;
  }
  .u-w-95p-pc {
    width: 90% !important;
  }
  .u-w-100p-pc {
    width: 100% !important;
  }
  .u-w-1-pc {
    width: 1px !important;
  }
  .u-w-10-pc {
    width: 10px !important;
  }
  .u-w-20-pc {
    width: 20px !important;
  }
  .u-w-30-pc {
    width: 30px !important;
  }
  .u-w-40-pc {
    width: 40px !important;
  }
  .u-w-50-pc {
    width: 50px !important;
  }
  .u-w-60-pc {
    width: 60px !important;
  }
  .u-w-70-pc {
    width: 70px !important;
  }
  .u-w-80-pc {
    width: 80px !important;
  }
  .u-w-90-pc {
    width: 90px !important;
  }
  .u-w-100-pc {
    width: 100px !important;
  }
  .u-w-110-pc {
    width: 110px !important;
  }
  .u-w-120-pc {
    width: 120px !important;
  }
  .u-w-130-pc {
    width: 130px !important;
  }
  .u-w-140-pc {
    width: 140px !important;
  }
  .u-w-150-pc {
    width: 150px !important;
  }
  .u-w-160-pc {
    width: 160px !important;
  }
  .u-w-170-pc {
    width: 170px !important;
  }
  .u-w-180-pc {
    width: 180px !important;
  }
  .u-w-190-pc {
    width: 190px !important;
  }
  .u-w-200-pc {
    width: 200px !important;
  }
  .u-w-210-pc {
    width: 210px !important;
  }
  .u-w-220-pc {
    width: 220px !important;
  }
  .u-w-230-pc {
    width: 230px !important;
  }
  .u-w-240-pc {
    width: 240px !important;
  }
  .u-w-250-pc {
    width: 250px !important;
  }
  .u-w-260-pc {
    width: 260px !important;
  }
  .u-w-270-pc {
    width: 270px !important;
  }
  .u-w-280-pc {
    width: 280px !important;
  }
  .u-w-290-pc {
    width: 290px !important;
  }
  .u-w-300-pc {
    width: 300px !important;
  }
  .u-w-350-pc {
    width: 350px !important;
  }
  .u-w-400-pc {
    width: 400px !important;
  }
  .u-w-450-pc {
    width: 450px !important;
  }
  .u-w-500-pc {
    width: 500px !important;
  }
  .u-w-550-pc {
    width: 550px !important;
  }
  .u-w-600-pc {
    width: 600px !important;
  }
  .u-w-650-pc {
    width: 650px !important;
  }
  .u-w-700-pc {
    width: 700px !important;
  }
  .u-w-750-pc {
    width: 750px !important;
  }
  .u-w-800-pc {
    width: 800px !important;
  }
  .u-w-850-pc {
    width: 850px !important;
  }
  .u-w-900-pc {
    width: 900px !important;
  }
  .u-w-950-pc {
    width: 950px !important;
  }
  .u-w-980-pc {
    width: 980px !important;
  }
  .u-w-1000-pc {
    width: 1000px !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .u-w-auto-tab {
    width: auto !important;
  }
  .u-w-5p-tab {
    width: 5% !important;
  }
  .u-w-10p-tab {
    width: 10% !important;
  }
  .u-w-15p-tab {
    width: 15% !important;
  }
  .u-w-20p-tab {
    width: 20% !important;
  }
  .u-w-25p-tab {
    width: 25% !important;
  }
  .u-w-30p-tab {
    width: 30% !important;
  }
  .u-w-35p-tab {
    width: 35% !important;
  }
  .u-w-40p-tab {
    width: 40% !important;
  }
  .u-w-45p-tab {
    width: 45% !important;
  }
  .u-w-50p-tab {
    width: 50% !important;
  }
  .u-w-55p-tab {
    width: 55% !important;
  }
  .u-w-60p-tab {
    width: 60% !important;
  }
  .u-w-65p-tab {
    width: 65% !important;
  }
  .u-w-70p-tab {
    width: 70% !important;
  }
  .u-w-75p-tab {
    width: 75% !important;
  }
  .u-w-80p-tab {
    width: 80% !important;
  }
  .u-w-85p-tab {
    width: 85% !important;
  }
  .u-w-90p-tab {
    width: 90% !important;
  }
  .u-w-95p-tab {
    width: 90% !important;
  }
  .u-w-100p-tab {
    width: 100% !important;
  }
  .u-w-1-tab {
    width: 1px !important;
  }
  .u-w-10-tab {
    width: 10px !important;
  }
  .u-w-20-tab {
    width: 20px !important;
  }
  .u-w-30-tab {
    width: 30px !important;
  }
  .u-w-40-tab {
    width: 40px !important;
  }
  .u-w-50-tab {
    width: 50px !important;
  }
  .u-w-60-tab {
    width: 60px !important;
  }
  .u-w-70-tab {
    width: 70px !important;
  }
  .u-w-80-tab {
    width: 80px !important;
  }
  .u-w-90-tab {
    width: 90px !important;
  }
  .u-w-100-tab {
    width: 100px !important;
  }
  .u-w-110-tab {
    width: 110px !important;
  }
  .u-w-120-tab {
    width: 120px !important;
  }
  .u-w-130-tab {
    width: 130px !important;
  }
  .u-w-140-tab {
    width: 140px !important;
  }
  .u-w-150-tab {
    width: 150px !important;
  }
  .u-w-160-tab {
    width: 160px !important;
  }
  .u-w-170-tab {
    width: 170px !important;
  }
  .u-w-180-tab {
    width: 180px !important;
  }
  .u-w-190-tab {
    width: 190px !important;
  }
  .u-w-200-tab {
    width: 200px !important;
  }
  .u-w-210-tab {
    width: 210px !important;
  }
  .u-w-220-tab {
    width: 220px !important;
  }
  .u-w-230-tab {
    width: 230px !important;
  }
  .u-w-240-tab {
    width: 240px !important;
  }
  .u-w-250-tab {
    width: 250px !important;
  }
  .u-w-260-tab {
    width: 260px !important;
  }
  .u-w-270-tab {
    width: 270px !important;
  }
  .u-w-280-tab {
    width: 280px !important;
  }
  .u-w-290-tab {
    width: 290px !important;
  }
  .u-w-300-tab {
    width: 300px !important;
  }
  .u-w-350-tab {
    width: 350px !important;
  }
  .u-w-400-tab {
    width: 400px !important;
  }
  .u-w-450-tab {
    width: 450px !important;
  }
  .u-w-500-tab {
    width: 500px !important;
  }
  .u-w-550-tab {
    width: 550px !important;
  }
  .u-w-600-tab {
    width: 600px !important;
  }
  .u-w-650-tab {
    width: 650px !important;
  }
  .u-w-700-tab {
    width: 700px !important;
  }
  .u-w-750-tab {
    width: 750px !important;
  }
  .u-w-800-tab {
    width: 800px !important;
  }
  .u-w-850-tab {
    width: 850px !important;
  }
  .u-w-900-tab {
    width: 900px !important;
  }
  .u-w-950-tab {
    width: 950px !important;
  }
  .u-w-980-tab {
    width: 980px !important;
  }
  .u-w-1000-tab {
    width: 1000px !important;
  }}
@media screen and (max-width: 767px) {
  .u-w-auto-sp {
    width: auto !important;
  }
  .u-w-5p-sp {
    width: 5% !important;
  }
  .u-w-10p-sp {
    width: 10% !important;
  }
  .u-w-15p-sp {
    width: 15% !important;
  }
  .u-w-20p-sp {
    width: 20% !important;
  }
  .u-w-25p-sp {
    width: 25% !important;
  }
  .u-w-30p-sp {
    width: 30% !important;
  }
  .u-w-35p-sp {
    width: 35% !important;
  }
  .u-w-40p-sp {
    width: 40% !important;
  }
  .u-w-45p-sp {
    width: 45% !important;
  }
  .u-w-50p-sp {
    width: 50% !important;
  }
  .u-w-55p-sp {
    width: 55% !important;
  }
  .u-w-60p-sp {
    width: 60% !important;
  }
  .u-w-65p-sp {
    width: 65% !important;
  }
  .u-w-70p-sp {
    width: 70% !important;
  }
  .u-w-75p-sp {
    width: 75% !important;
  }
  .u-w-80p-sp {
    width: 80% !important;
  }
  .u-w-85p-sp {
    width: 85% !important;
  }
  .u-w-90p-sp {
    width: 90% !important;
  }
  .u-w-95p-sp {
    width: 90% !important;
  }
  .u-w-100p-sp {
    width: 100% !important;
  }
  .u-w-1-sp {
    width: 1px !important;
  }
  .u-w-10-sp {
    width: 10px !important;
  }
  .u-w-20-sp {
    width: 20px !important;
  }
  .u-w-30-sp {
    width: 30px !important;
  }
  .u-w-40-sp {
    width: 40px !important;
  }
  .u-w-50-sp {
    width: 50px !important;
  }
  .u-w-60-sp {
    width: 60px !important;
  }
  .u-w-70-sp {
    width: 70px !important;
  }
  .u-w-80-sp {
    width: 80px !important;
  }
  .u-w-90-sp {
    width: 90px !important;
  }
  .u-w-100-sp {
    width: 100px !important;
  }
  .u-w-110-sp {
    width: 110px !important;
  }
  .u-w-120-sp {
    width: 120px !important;
  }
  .u-w-130-sp {
    width: 130px !important;
  }
  .u-w-140-sp {
    width: 140px !important;
  }
  .u-w-150-sp {
    width: 150px !important;
  }
  .u-w-160-sp {
    width: 160px !important;
  }
  .u-w-170-sp {
    width: 170px !important;
  }
  .u-w-180-sp {
    width: 180px !important;
  }
  .u-w-190-sp {
    width: 190px !important;
  }
  .u-w-200-sp {
    width: 200px !important;
  }
  .u-w-210-sp {
    width: 210px !important;
  }
  .u-w-220-sp {
    width: 220px !important;
  }
  .u-w-230-sp {
    width: 230px !important;
  }
  .u-w-240-sp {
    width: 240px !important;
  }
  .u-w-250-sp {
    width: 250px !important;
  }
  .u-w-260-sp {
    width: 260px !important;
  }
  .u-w-270-sp {
    width: 270px !important;
  }
  .u-w-280-sp {
    width: 280px !important;
  }
  .u-w-290-sp {
    width: 290px !important;
  }
  .u-w-300-sp {
    width: 300px !important;
  }
  .u-w-350-sp {
    width: 350px !important;
  }
  .u-w-400-sp {
    width: 400px !important;
  }
  .u-w-450-sp {
    width: 450px !important;
  }
  .u-w-500-sp {
    width: 500px !important;
  }
  .u-w-550-sp {
    width: 550px !important;
  }
  .u-w-600-sp {
    width: 600px !important;
  }
  .u-w-650-sp {
    width: 650px !important;
  }
  .u-w-700-sp {
    width: 700px !important;
  }
  .u-w-750-sp {
    width: 750px !important;
  }
  .u-w-800-sp {
    width: 800px !important;
  }
  .u-w-850-sp {
    width: 850px !important;
  }
  .u-w-900-sp {
    width: 900px !important;
  }
  .u-w-950-sp {
    width: 950px !important;
  }
  .u-w-980-sp {
    width: 980px !important;
  }
  .u-w-1000-sp {
    width: 1000px !important;
  }}

.u-min-w-0 {
  min-width: 0 !important;
}
@media (min-width: 768px) {
  .u-min-w-0-pc {
    min-width: 0 !important;
  }
}
@media screen and (max-width: 767px) {
  .u-min-w-0-sp {
    min-width: 0 !important;
  }
}

@media (min-width: 0px) {
  .u-max-w-none {
    max-width: none !important;
  }
  .u-max-w-100 {
    max-width: 100px !important;
  }
  .u-max-w-150 {
    max-width: 150px !important;
  }
  .u-max-w-200 {
    max-width: 200px !important;
  }
  .u-max-w-250 {
    max-width: 250px !important;
  }
  .u-max-w-300 {
    max-width: 300px !important;
  }
  .u-max-w-350 {
    max-width: 350px !important;
  }
  .u-max-w-400 {
    max-width: 400px !important;
  }
  .u-max-w-450 {
    max-width: 450px !important;
  }
  .u-max-w-500 {
    max-width: 500px !important;
  }
}
@media (min-width: 768px) {
  .u-max-w-none-pc {
    max-width: none !important;
  }
  .u-max-w-100-pc {
    max-width: 100px !important;
  }
  .u-max-w-150-pc {
    max-width: 150px !important;
  }
  .u-max-w-200-pc {
    max-width: 200px !important;
  }
  .u-max-w-250-pc {
    max-width: 250px !important;
  }
  .u-max-w-300-pc {
    max-width: 300px !important;
  }
  .u-max-w-350-pc {
    max-width: 350px !important;
  }
  .u-max-w-400-pc {
    max-width: 400px !important;
  }
  .u-max-w-450-pc {
    max-width: 450px !important;
  }
  .u-max-w-500-pc {
    max-width: 500px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-max-w-none-sp {
    max-width: none !important;
  }
  .u-max-w-100-sp {
    max-width: 100px !important;
  }
  .u-max-w-150-sp {
    max-width: 150px !important;
  }
  .u-max-w-200-sp {
    max-width: 200px !important;
  }
  .u-max-w-250-sp {
    max-width: 250px !important;
  }
  .u-max-w-300-sp {
    max-width: 300px !important;
  }
  .u-max-w-350-sp {
    max-width: 350px !important;
  }
  .u-max-w-400-sp {
    max-width: 400px !important;
  }
  .u-max-w-450-sp {
    max-width: 450px !important;
  }
  .u-max-w-500-sp {
    max-width: 500px !important;
  }
}

/* 高さ
-----------------------*/
@media (min-width: 0px) {
  .u-h-auto {
    height: auto !important;
  }
  .u-h-100p {
    height: 100% !important;
  }
  .u-h-100vh {
    height: 100vh!important;
  }
  .u-h-0 {
    height: 0px !important;
  }
  .u-h-50 {
    height: 50px !important;
  }
  .u-h-100 {
    height: 100px !important;
  }
  .u-h-150 {
    height: 150px !important;
  }
  .u-h-200 {
    height: 200px !important;
  }
  .u-h-250 {
    height: 250px !important;
  }
  .u-h-300 {
    height: 300px !important;
  }
  .u-h-350 {
    height: 350px !important;
  }
  .u-h-400 {
    height: 400px !important;
  }
  .u-h-450 {
    height: 450px !important;
  }
  .u-h-470 {
    height: 470px !important;
  }
  .u-h-500 {
    height: 500px !important;
  }
  .u-h-1100 {
    height: 1100px !important;
  }
}
@media (min-width: 768px) {
  .u-h-auto-pc {
    height: auto !important;
  }
  .u-h-100p-pc {
    height: 100% !important;
  }
  .u-h-100vh-pc {
    height: 100vh!important;
  }
  .u-h-0-pc {
    height: 0px !important;
  }
  .u-h-50-pc {
    height: 50px !important;
  }
  .u-h-100-pc {
    height: 100px !important;
  }
  .u-h-150-pc {
    height: 150px !important;
  }
  .u-h-200-pc {
    height: 200px !important;
  }
  .u-h-250-pc {
    height: 250px !important;
  }
  .u-h-300-pc {
    height: 300px !important;
  }
  .u-h-350-pc {
    height: 350px !important;
  }
  .u-h-400-pc {
    height: 400px !important;
  }
  .u-h-450-pc {
    height: 450px !important;
  }
  .u-h-470-pc {
    height: 470px !important;
  }
  .u-h-500-pc {
    height: 500px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-h-auto-sp {
    height: auto !important;
  }
  .u-h-100p-sp {
    height: 100% !important;
  }
  .u-h-100vh-sp {
    height: 100vh!important;
  }
  .u-h-0-sp {
    height: 0px !important;
  }
  .u-h-50-sp {
    height: 50px !important;
  }
  .u-h-100-sp {
    height: 100px !important;
  }
  .u-h-150-sp {
    height: 150px !important;
  }
  .u-h-200-sp {
    height: 200px !important;
  }
  .u-h-250-sp {
    height: 250px !important;
  }
  .u-h-300-sp {
    height: 300px !important;
  }
  .u-h-350-sp {
    height: 350px !important;
  }
  .u-h-400-sp {
    height: 400px !important;
  }
  .u-h-450-sp {
    height: 450px !important;
  }
  .u-h-500-sp {
    height: 500px !important;
  }
}

@media (min-width: 0px) {
  .u-min-h-0 {
    min-height: 0 !important;
  }
  .u-min-h-50 {
    min-height: 50px !important;
  }
  .u-min-h-100 {
    min-height: 100px !important;
  }
  .u-min-h-150 {
    min-height: 150px !important;
  }
  .u-min-h-200 {
    min-height: 200px !important;
  }
  .u-min-h-250 {
    min-height: 250px !important;
  }
  .u-min-h-300 {
    min-height: 300px !important;
  }
  .u-min-h-350 {
    min-height: 350px !important;
  }
  .u-min-h-400 {
    min-height: 400px !important;
  }
  .u-min-h-450 {
    min-height: 450px !important;
  }
  .u-min-h-500 {
    min-height: 500px !important;
  }
}
@media (min-width: 768px) {
  .u-min-h-0-pc {
    min-height: 0 !important;
  }
  .u-min-h-50-pc {
    min-height: 50px !important;
  }
  .u-min-h-100-pc {
    min-height: 100px !important;
  }
  .u-min-h-150-pc {
    min-height: 150px !important;
  }
  .u-min-h-200-pc {
    min-height: 200px !important;
  }
  .u-min-h-250-pc {
    min-height: 250px !important;
  }
  .u-min-h-300-pc {
    min-height: 300px !important;
  }
  .u-min-h-350-pc {
    min-height: 350px !important;
  }
  .u-min-h-400-pc {
    min-height: 400px !important;
  }
  .u-min-h-450-pc {
    min-height: 450px !important;
  }
  .u-min-h-500-pc {
    min-height: 500px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-min-h-0-sp {
    min-height: 0 !important;
  }
  .u-min-h-50-sp {
    min-height: 50px !important;
  }
  .u-min-h-100-sp {
    min-height: 100px !important;
  }
  .u-min-h-150-sp {
    min-height: 150px !important;
  }
  .u-min-h-200-sp {
    min-height: 200px !important;
  }
  .u-min-h-250-sp {
    min-height: 250px !important;
  }
  .u-min-h-300-sp {
    min-height: 300px !important;
  }
  .u-min-h-350-sp {
    min-height: 350px !important;
  }
  .u-min-h-400-sp {
    min-height: 400px !important;
  }
  .u-min-h-450-sp {
    min-height: 450px !important;
  }
  .u-min-h-500-sp {
    min-height: 500px !important;
  }
}

@media (min-width: 0px) {
  .u-max-h-none {
    max-height: none !important;
  }
  .u-max-h-3em {
    max-height: 6em !important;
  }

  .u-max-h-50 {
    max-height: 50px !important;
  }
  .u-max-h-100 {
    max-height: 100px !important;
  }
  .u-max-h-150 {
    max-height: 150px !important;
  }
  .u-max-h-200 {
    max-height: 200px !important;
  }
  .u-max-h-202 {
    max-height: 202px !important;
  }
  .u-max-h-250 {
    max-height: 250px !important;
  }
  .u-max-h-300 {
    max-height: 300px !important;
  }
  .u-max-h-350 {
    max-height: 350px !important;
  }
  .u-max-h-400 {
    max-height: 400px !important;
  }
  .u-max-h-450 {
    max-height: 450px !important;
  }
  .u-max-h-500 {
    max-height: 500px !important;
  }
}
@media (min-width: 768px) {
  .u-max-h-none-pc {
    max-height: none !important;
  }
  .u-max-h-50-pc {
    max-height: 50px !important;
  }
  .u-max-h-100-pc {
    max-height: 100px !important;
  }
  .u-max-h-150-pc {
    max-height: 150px !important;
  }
  .u-max-h-200-pc {
    max-height: 200px !important;
  }
  .u-max-h-250-pc {
    max-height: 250px !important;
  }
  .u-max-h-300-pc {
    max-height: 300px !important;
  }
  .u-max-h-350-pc {
    max-height: 350px !important;
  }
  .u-max-h-400-pc {
    max-height: 400px !important;
  }
  .u-max-h-450-pc {
    max-height: 450px !important;
  }
  .u-max-h-500-pc {
    max-height: 500px !important;
  }
}
@media screen and (max-width: 767px) {
  .u-max-h-none-sp {
    max-height: none !important;
  }
  .u-max-h-50-sp {
    max-height: 50px !important;
  }
  .u-max-h-100-sp {
    max-height: 100px !important;
  }
  .u-max-h-150-sp {
    max-height: 150px !important;
  }
  .u-max-h-200-sp {
    max-height: 200px !important;
  }
  .u-max-h-250-sp {
    max-height: 250px !important;
  }
  .u-max-h-300-sp {
    max-height: 300px !important;
  }
  .u-max-h-350-sp {
    max-height: 350px !important;
  }
  .u-max-h-400-sp {
    max-height: 400px !important;
  }
  .u-max-h-450-sp {
    max-height: 450px !important;
  }
  .u-max-h-500-sp {
    max-height: 500px !important;
  }
}

/* フォントファミリー
-----------------------*/
.u-ff-hiragino-sans {
  font-family:  'ヒラギノUD角ゴ W3 JIS2004','Hiragino UD Sans W3 JIS2004' !important;
}
.u-ff-montserrat {
  font-family: 'Montserrat' !important;
}
.u-ff-lato {
  font-family: 'Lato' !important;
  font-weight: 300;
}

/* フォントサイズ
-----------------------*/
@media (min-width: 0px) {
  .u-fs-0 {
    font-size: 0 !important;
  }
  .u-fs-10 {
    font-size: 1.0rem !important;
  }
  .u-fs-11 {
    font-size: 1.1rem !important;
  }
  .u-fs-12 {
    font-size: 1.2rem !important;
  }
  .u-fs-13 {
    font-size: 1.3rem !important;
  }
  .u-fs-14 {
    font-size: 1.4rem !important;
  }
  .u-fs-16 {
    font-size: 1.6rem !important;
  }
  .u-fs-18 {
    font-size: 1.8rem !important;
  }
  .u-fs-20 {
    font-size: 2.0rem !important;
  }
  .u-fs-22 {
    font-size: 2.2rem !important;
  }
  .u-fs-24 {
    font-size: 2.4rem !important;
  }
  .u-fs-26 {
    font-size: 2.6rem !important;
  }
  .u-fs-28 {
    font-size: 2.8rem !important;
  }
  .u-fs-30 {
    font-size: 3rem !important;
  }
  .u-fs-32 {
    font-size: 3.2rem !important;
  }
  .u-fs-34 {
    font-size: 3.4rem !important;
  }
  .u-fs-36 {
    font-size: 3.6rem !important;
  }
  .u-fs-38 {
    font-size: 3.8rem !important;
  }
  .u-fs-40 {
    font-size: 4rem !important;
  }
  .u-fs-48 {
    font-size: 4.8rem !important;
  }
  .u-fs-120 {
    font-size: 12rem !important;
  }
}
@media screen and (max-width: 767px) {
  .u-fs-0-sp {
    font-size: 0 !important;
  }
  .u-fs-10-sp {
    font-size: 1.0rem !important;
  }
  .u-fs-11-sp {
    font-size: 1.1rem !important;
  }
  .u-fs-12-sp {
    font-size: 1.2rem !important;
  }
  .u-fs-13-sp {
    font-size: 1.3rem !important;
  }
  .u-fs-14-sp {
    font-size: 1.4rem !important;
  }
  .u-fs-16-sp {
    font-size: 1.6rem !important;
  }
  .u-fs-18-sp {
    font-size: 1.8rem !important;
  }
  .u-fs-20-sp {
    font-size: 2.0rem !important;
  }
  .u-fs-22-sp {
    font-size: 2.2rem !important;
  }
  .u-fs-24-sp {
    font-size: 2.4rem !important;
  }
  .u-fs-26-sp {
    font-size: 2.6rem !important;
  }
  .u-fs-28-sp {
    font-size: 2.8rem !important;
  }
  .u-fs-30-sp {
    font-size: 3rem !important;
  }
  .u-fs-32-sp {
    font-size: 3.2rem !important;
  }
  .u-fs-34-sp {
    font-size: 3.4rem !important;
  }
  .u-fs-36-sp {
    font-size: 3.6rem !important;
  }
  .u-fs-38-sp {
    font-size: 3.8rem !important;
  }
  .u-fs-40-sp {
    font-size: 4rem !important;
  }
  .u-fs-48-sp {
    font-size: 4.8rem !important;
  }
}
@media (min-width: 768px) {
  .u-fs-0-pc {
    font-size: 0 !important;
  }
  .u-fs-10-pc {
    font-size: 1.0rem !important;
  }
  .u-fs-11-pc {
    font-size: 1.1rem !important;
  }
  .u-fs-12-pc {
    font-size: 1.2rem !important;
  }
  .u-fs-13-pc {
    font-size: 1.3rem !important;
  }
  .u-fs-14-pc {
    font-size: 1.4rem !important;
  }
  .u-fs-16-pc {
    font-size: 1.6rem !important;
  }
  .u-fs-18-pc {
    font-size: 1.8rem !important;
  }
  .u-fs-20-pc {
    font-size: 2.0rem !important;
  }
  .u-fs-22-pc {
    font-size: 2.2rem !important;
  }
  .u-fs-24-pc {
    font-size: 2.4rem !important;
  }
  .u-fs-26-pc {
    font-size: 2.6rem !important;
  }
  .u-fs-28-pc {
    font-size: 2.8rem !important;
  }
  .u-fs-30-pc {
    font-size: 3rem !important;
  }
  .u-fs-32-pc {
    font-size: 3.2rem !important;
  }
  .u-fs-34-pc {
    font-size: 3.4rem !important;
  }
  .u-fs-36-pc {
    font-size: 3.6rem !important;
  }
  .u-fs-38-pc {
    font-size: 3.8rem !important;
  }
  .u-fs-40-pc {
    font-size: 4rem !important;
  }
  .u-fs-46-pc {
    font-size: 4.6rem !important;
  }
  .u-fs-48-pc {
    font-size: 4.8rem !important;
  }
}

/* フォントウェイト
-----------------------*/
.u-fw-normal {
  font-weight: normal !important;
}
.u-fw-bold {
  font-weight: bold !important;
}


/* ラインハイト
-----------------------*/
.u-lh-10 {
  line-height: 1.0 !important;
}
.u-lh-13 {
  line-height: 1.3 !important;
}
.u-lh-15 {
  line-height: 1.5 !important;
}
.u-lh-17 {
  line-height: 1.7 !important;
}
.u-lh-20 {
  line-height: 2.0 !important;
}
@media screen and (max-width: 767px) {
  .u-lh-10-sp {
    line-height: 1.0 !important;
  }
  .u-lh-13-sp {
    line-height: 1.3 !important;
  }
  .u-lh-15-sp {
    line-height: 1.5 !important;
  }
  .u-lh-17-sp {
    line-height: 1.7 !important;
  }
  .u-lh-20-sp {
    line-height: 2.0 !important;
  }
}
@media (min-width: 768px) {
  .u-lh-10-pc {
    line-height: 1.0 !important;
  }
  .u-lh-13-pc {
    line-height: 1.3 !important;
  }
  .u-lh-15-pc {
    line-height: 1.5 !important;
  }
  .u-lh-17-pc {
    line-height: 1.7 !important;
  }
  .u-lh-20-pc {
    line-height: 2.0 !important;
  }
}

/* テキストアライン
-----------------------*/
.u-ta-left {
  text-align: left !important;
}
.u-ta-center {
  text-align: center !important;
}
.u-ta-right {
  text-align: right !important;
}
@media (min-width: 768px) {
  .u-ta-left-pc {
    text-align: left !important;
  }
  .u-ta-center-pc {
    text-align: center !important;
  }
  .u-ta-right-pc {
    text-align: right !important;
  }
}
@media screen and (max-width: 767px) {
  .u-ta-left-sp {
    text-align: left !important;
  }
  .u-ta-center-sp {
    text-align: center !important;
  }
  .u-ta-right-sp {
    text-align: right !important;
  }
}

/* バーティカルアライン
-----------------------*/
.u-va-middle {
  vertical-align: middle !important;
}

/* テキストデコレーション
-----------------------*/
.u-td-none {
  text-decoration: none !important;
}
.u-td-underline {
  text-decoration: underline !important;
}

/* ホワイトスペース
-----------------------*/
.u-ws-normal {
  white-space: normal !important;
}
.u-ws-nowrap {
  white-space: nowrap !important;
}

/* ワードブレイク
-----------------------*/
.u-wb-all {
  word-break: break-all !important;
}

/* カーソル
-----------------------*/
.u-cursor-pointer {
  cursor: pointer;
}