@charset "UTF-8";
/******************************
 * reset
 ******************************/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Spartan:wght@500;600;800&display=swap");
html,
body {
  width: 100%;
  font-size: 10px;
}

body {
  line-height: 1.9;
  font-feature-settings: "palt" 1;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  background: #000;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
dl,
dt,
dd,
form,
fieldset,
hr,
sup,
figure {
  margin: 0;
  padding: 0;
}

ul {
  list-style: none;
}

ol {
  margin-left: 20px;
}

img {
  border: 0;
  vertical-align: top;
  max-width: 100%;
  height: auto;
}

td img {
  vertical-align: baseline;
}

iframe,
fieldset {
  border: 0;
}

textarea {
  resize: none;
}

select {
  height: 42px;
}

pre {
  word-wrap: break-word;
  white-space: pre-wrap;
}

button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
  -webkit-appearance: none;
  background-color: transparent;
  cursor: pointer;
  border: 0;
  border-radius: 0;
}

input[type="tel"],
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
  padding: 5px 8px;
}

input,
select,
button {
  line-height: 1.42857143;
}

label {
  display: inline-block;
  cursor: pointer;
}

sup {
  font-size: 10px;
  line-height: 1.1;
  vertical-align: top;
}

a {
  color: #000;
  text-decoration: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
}

hr {
  background: none;
  height: 0;
  border: 0;
  border-top: 1px solid #ccc;
}

main,
section,
aside,
figure,
header,
footer {
  display: block;
}

small {
  font-size: 80%;
}

* {
  box-sizing: border-box;
}

::-webkit-input-placeholder {
  color: #c1c1c1;
}

:-moz-placeholder {
  color: #c1c1c1;
}

::-moz-placeholder {
  color: #c1c1c1;
}

:-ms-input-placeholder {
  color: #c1c1c1;
}

/******************************
 * base font
 ******************************/
body,
input,
select,
textarea {
  font-family: "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo", "メイリオ", sans-serif;
  font-size: 1.4rem;
}

body {
  font-size: 1.4rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  body {
    font-size: 3.2vw;
  }
  select,
  input,
  textarea,
  button,
  figcaption {
    font-size: 4.6vw;
  }
}

/******************************
 * site-footer
 ******************************/
.site-footer {
  line-height: 1.4;
}

/******************************
 * site-header
 ******************************/
.site-header {
  line-height: 1.4;
  position: fixed;
  z-index: 2;
  left: 60px;
  top: 50px;
  opacity: 0;
  transform: translateY(10px);
  transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 1s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: .9s;
}

@media screen and (max-width: 767px) {
  .site-header {
    left: 5vw;
    top: 4vw;
  }
}

@media screen and (max-width: 767px) {
  .site-header .site-header__logo {
    width: 26vw;
  }
}

.site-header__sns {
  margin-top: 18px;
}

@media screen and (max-width: 767px) {
  .site-header__sns {
    margin-top: 4vw;
  }
  .site-header__sns img {
    width: 5vw;
  }
}

.is-active .site-header {
  transform: translateY(0);
  opacity: 1;
}

/******************************
 * nav
 ******************************/
@keyframes scroll-bar {
  0% {
    top: -340px;
  }
  20% {
    top: -340px;
  }
  100% {
    top: 170px;
  }
}

@keyframes scroll-bar-sp {
  0% {
    top: -60vw;
  }
  20% {
    top: -60vw;
  }
  100% {
    top: 30vw;
  }
}

.nav {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10;
  opacity: 0;
  transform: translateY(10px);
  transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 1s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: .9s;
}

.nav__list {
  font-size: 1.4rem;
  line-height: 1.2;
}

@media screen and (max-width: 767px) {
  .nav__list {
    font-size: 3vw;
  }
}

.nav__list a {
  display: inline-block;
  padding: 2px 2px 0 2px;
  text-decoration: underline;
}

.nav__list a.is-hover:hover {
  background: #000;
  color: #fff;
  text-decoration: none;
}

.nav__item {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .nav__item {
    margin-bottom: 3vw;
  }
}

.nav__body {
  position: fixed;
  right: -400px;
  top: 0;
  z-index: 90;
  background: #fff;
  padding: 150px 40px 0 40px;
  width: 305px;
  min-height: 420px;
  transition: right .25s ease;
}

@media screen and (max-width: 767px) {
  .nav__body {
    overflow: auto;
    padding: 18vw 5vw 0 5vw;
    right: -48vw;
    width: 48vw;
    min-height: 70vw;
  }
}

.nav__body.is-active {
  right: 0;
}

.nav__btn {
  position: fixed;
  top: 35px;
  right: 60px;
  z-index: 100;
  width: 47px;
  height: 49px;
  background: url("../img/btn/btn-w.svg") 0 0/100% auto no-repeat;
}

.nav__btn.is-active {
  background-image: url("../img/btn/btn.svg");
}

@media screen and (max-width: 767px) {
  .nav__btn {
    top: 4vw;
    right: 3.8vw;
    width: 6vw;
    height: 10vw;
  }
}

.nav__scroll {
  position: fixed;
  top: 50vh;
  right: 60px;
  height: 260px;
  width: 12px;
}

@media screen and (min-width: 768px) {
  .nav__scroll {
    transform: translateY(-50%);
  }
}

@media screen and (max-width: 767px) {
  .nav__scroll {
    top: 20vw;
    right: 5vw;
    width: 2.2vw;
  }
  .nav__scroll img {
    width: 2.2vw;
  }
}

.nav__scrollbar {
  overflow: hidden;
  position: absolute;
  right: 7px;
  top: 84px;
  width: 1px;
  height: 170px;
}

@media screen and (max-width: 767px) {
  .nav__scrollbar {
    right: 1vw;
    top: 15vw;
    height: 30vw;
  }
}

.nav__scrollbar > div {
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  width: 1px;
}

@media screen and (min-width: 768px) {
  .nav__scrollbar > div {
    height: 340px;
    animation: scroll-bar 2.5s ease-in infinite;
  }
}

@media screen and (max-width: 767px) {
  .nav__scrollbar > div {
    animation: scroll-bar-sp 2.5s ease-in infinite;
    height: 30vw;
  }
}

.nav__sns {
  margin: 50px 0 20px 0;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .nav__sns {
    margin: 10vw 0 4vw 0;
  }
  .nav__sns img {
    width: 5vw;
  }
}

@media screen and (max-width: 767px) {
  .nav__logo img {
    width: 16vw;
  }
}

.is-active .nav {
  transform: translateY(0);
  opacity: 1;
}

/******************************
 * ページ全体のレイアウト
 ******************************/
.page {
  position: relative;
  z-index: 2;
}

#container.container .aligncenter {
  display: block;
  margin: 10px auto;
}

#container.container .alignright {
  float: right;
  margin-right: 0 0 0 10px;
}

#container.container .alignleft {
  float: left;
  margin: 0 10px 0 0;
}

/******************************
 *bg-img
 ******************************/
.bg-img {
  position: fixed;
  left: 0;
  top: 0;
  background: 50% 50% / cover;
  width: 100vw;
  height: 100vh;
}

/******************************
 *bg-movie
 ******************************/
.bg-movie {
  position: fixed;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.bg-movie-cover {
  position: fixed;
  z-index: 2;
  width: 100%;
  height: 100vh;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.3);
}

/******************************
 *btn
 ******************************/
.btn {
  cursor: pointer;
  position: relative;
  display: inline-block;
  line-height: 1.1;
  text-decoration: none;
  user-select: none;
  border: 0;
}

.btn:hover {
  text-decoration: none;
}

.btn--totop {
  transition: none;
}

.btn--close {
  background: #000;
  width: 38px;
  height: 38px;
}

.btn--close:before, .btn--close:after {
  display: block;
  content: "";
  position: absolute;
  background: #fff;
  width: 100%;
  height: 2px;
}

.btn--close:before {
  transform: rotate(135deg);
}

.btn--close:after {
  transform: rotate(-135deg);
}

/******************************
 *container
 ******************************/
.container {
  overflow: hidden;
  width: 100%;
  opacity: 0;
  transition: opacity 1s cubic-bezier(0.215, 0.61, 0.355, 1);
  transition-delay: .3s;
}

.container.is-active {
  opacity: 1;
}

/******************************
 * hdr
 ******************************/
.hdr-a {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}

.hdr-a__ttl {
  font-size: 2.7rem;
  font-weight: normal;
}

@media screen and (max-width: 767px) {
  .hdr-a__ttl {
    font-size: 5vw;
  }
}

.hdr-b {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .hdr-b {
    margin-bottom: 4.5vw;
  }
}

.hdr-b__ttl {
  font-size: 1.4rem;
  font-weight: normal;
}

@media screen and (max-width: 767px) {
  .hdr-b__ttl {
    font-size: 3.8vw;
  }
}

/******************************
 * icon
 ******************************/
.icon {
  position: relative;
  display: inline-block;
  background: 50% 50% no-repeat;
  background-size: 100% auto;
  vertical-align: top;
  line-height: 1;
  font-style: normal;
}

.icon--arrow {
  top: 8px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #999;
  border-right: 2px solid #999;
  transform: rotate(45deg);
}

.icon--carrow {
  background: #333;
  border-radius: 100px;
  width: 16px;
  height: 16px;
}

.icon--carrow:after {
  display: block;
  content: "";
  position: absolute;
  left: 4px;
  top: 5px;
  width: 4px;
  height: 4px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}

/******************************
 * list
 ******************************/
.list-news {
  font-size: 1.5rem;
}

@media screen and (max-width: 767px) {
  .list-news {
    font-size: 3.2vw;
  }
}

.list-news dt {
  margin-bottom: 2px;
}

.list-news dd {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #8c8c8c;
}

@media screen and (max-width: 767px) {
  .list-news dd {
    margin-bottom: 3vw;
    padding-bottom: 3vw;
  }
}

.list-news a {
  text-decoration: underline;
}

.list-news a.is-hover:hover {
  text-decoration: none;
}

/******************************
 *map
 ******************************/
/******************************
 * modal-overlay
 ******************************/
.modal-overlay {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  background: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
}

/******************************
 *pagination
 ******************************/
.pagination {
  width: 96px;
}

@media screen and (max-width: 767px) {
  .pagination {
    width: 20vw;
  }
}

.pagination a {
  overflow: hidden;
  width: 35px;
  height: 35px;
  text-indent: -999px;
  background: 0 50% / 100% auto no-repeat;
  transition: transform .25s ease;
}

@media screen and (max-width: 767px) {
  .pagination a {
    width: 7vw;
    height: 7vw;
  }
}

.pagination .page-numbers {
  display: none;
}

.pagination .prev {
  float: left;
  display: block;
  background-image: url("../img/btn/prev.svg");
}

.pagination .prev.is-hover:hover {
  transform: translateX(-4px);
}

.pagination .next {
  float: right;
  display: block;
  background-image: url("../img/btn/next.svg");
}

.pagination .next.is-hover:hover {
  transform: translateX(4px);
}

/******************************
 * resposive-iframe
 ******************************/
.resposive-iframe {
  position: relative;
  width: 100%;
  padding-top: 42%;
}

@media screen and (max-width: 767px) {
  .resposive-iframe {
    padding-top: 60%;
  }
}

.resposive-iframe iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

/******************************
 * table
 ******************************/
.wrap-table {
  overflow: auto;
}

@media screen and (max-width: 767px) {
  .c-table-responsive {
    display: block;
  }
  .c-table-responsive thead,
  .c-table-responsive tbody,
  .c-table-responsive tr,
  .c-table-responsive th,
  .c-table-responsive td {
    display: block;
    text-align: left;
  }
}

/******************************
 * unit
 ******************************/
.unit__inner {
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  transition: transform 1.5s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media screen and (min-width: 768px) {
  .unit__inner {
    float: right;
    margin-bottom: 130px;
    padding: 50px 110px 70px 80px;
    max-width: 100%;
    min-width: 800px;
    width: 66%;
  }
}

@media screen and (max-width: 767px) {
  .unit__inner {
    margin-bottom: 15vw;
    padding: 9vw 8vw;
    width: 100%;
  }
}

.unit.is-waiting .unit__inner {
  transform: translateY(50px);
  opacity: 0;
}

.unit.is-waiting.is-active .unit__inner {
  transform: translateY(0);
  opacity: 1;
}

.unit a {
  color: #fff;
}

@media screen and (min-width: 768px) {
  .unit--commu .unit__inner {
    padding-right: 200px;
    padding-bottom: 150px;
  }
}

.unit--commu .hdr-a {
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .unit--commu .hdr-a {
    margin-bottom: 5vw;
  }
}

.unit--company .hdr-a {
  margin-bottom: 55px;
}

@media screen and (max-width: 767px) {
  .unit--company .hdr-a {
    margin-bottom: 8vw;
  }
}

.unit--contact .hdr-a {
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .unit--contact .hdr-a {
    margin-bottom: 5vw;
  }
}

/******************************
 * company-logo
 ******************************/
.home-company-logo {
  margin-bottom: 45px;
}

@media screen and (max-width: 767px) {
  .home-company-logo {
    margin-bottom: 6vw;
  }
  .home-company-logo img {
    width: 30%;
  }
}

/******************************
 * msg
 ******************************/
.home-msg {
  position: relative;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.home-msg__txt {
  font-weight: 800;
  font-size: 6.2rem;
  color: #fff;
  line-height: 1.5;
  letter-spacing: .1em;
}

@media screen and (max-width: 767px) {
  .home-msg__txt {
    font-size: 6.7vw;
  }
}

.home-msg__txt .c {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1), transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media screen and (max-width: 767px) {
  .home-msg__txt .c {
    transform: translateY(2vw);
  }
}

.home-msg__txt .c.is-active {
  opacity: 1;
  transform: translateY(0);
}

.home-msg__logo {
  position: absolute;
  left: 60px;
  bottom: 40px;
}

@media screen and (max-width: 767px) {
  .home-msg__logo {
    left: 9vw;
    bottom: 9vw;
  }
  .home-msg__logo img {
    width: 20vw;
  }
}

/******************************
 * util float
 ******************************/
.col:after {
  content: "";
  display: block;
  clear: both;
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .col .box {
    float: left;
  }
  .col .box-r {
    float: right;
  }
}

/******************************
 * util flex
 ******************************/
.flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}

.flex--start {
  justify-content: flex-start;
}

.flex--center {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.flex--r {
  flex-flow: row-reverse;
}

.flex--col2 .flex__item {
  width: 48%;
}

.flex--col3 .flex__item {
  width: 32%;
}

@media screen and (max-width: 767px) {
  .flex--reset-sp {
    display: block;
  }
  .flex--reset-sp .flex__item {
    width: auto;
  }
}

/******************************
 * util display
 ******************************/
#container .screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal;
}

#container .sp-only-ib,
#container .sp-only {
  display: none;
}

#container .set-hide {
  display: none;
}

#container .set-disp-table {
  display: table;
}

#container .set-disp-cell {
  display: table-cell;
}

#container .set-disp-ib {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  #container .pc-only {
    display: none;
  }
  #container .sp-only {
    display: block;
  }
  #container .sp-only-ib {
    display: inline-block;
  }
}

/******************************
 * util margin
 ******************************/
#container .set-mt-5 {
  margin-top: 5px;
}

#container .set-mr-5 {
  margin-right: 5px;
}

#container .set-mt-5 {
  margin-top: 5px;
}

#container .set-mb-5 {
  margin-bottom: 5px;
}

#container .set-ml-5 {
  margin-left: 5px;
}

#container .set-mt-10 {
  margin-top: 10px;
}

#container .set-mr-10 {
  margin-right: 10px;
}

#container .set-mt-10 {
  margin-top: 10px;
}

#container .set-mb-10 {
  margin-bottom: 10px;
}

#container .set-ml-10 {
  margin-left: 10px;
}

#container .set-mt-15 {
  margin-top: 15px;
}

#container .set-mr-15 {
  margin-right: 15px;
}

#container .set-mt-15 {
  margin-top: 15px;
}

#container .set-mb-15 {
  margin-bottom: 15px;
}

#container .set-ml-15 {
  margin-left: 15px;
}

#container .set-mt-20 {
  margin-top: 20px;
}

#container .set-mr-20 {
  margin-right: 20px;
}

#container .set-mt-20 {
  margin-top: 20px;
}

#container .set-mb-20 {
  margin-bottom: 20px;
}

#container .set-ml-20 {
  margin-left: 20px;
}

#container .set-mt-25 {
  margin-top: 25px;
}

#container .set-mr-25 {
  margin-right: 25px;
}

#container .set-mt-25 {
  margin-top: 25px;
}

#container .set-mb-25 {
  margin-bottom: 25px;
}

#container .set-ml-25 {
  margin-left: 25px;
}

#container .set-mt-30 {
  margin-top: 30px;
}

#container .set-mr-30 {
  margin-right: 30px;
}

#container .set-mt-30 {
  margin-top: 30px;
}

#container .set-mb-30 {
  margin-bottom: 30px;
}

#container .set-ml-30 {
  margin-left: 30px;
}

#container .set-mt-40 {
  margin-top: 40px;
}

#container .set-mr-40 {
  margin-right: 40px;
}

#container .set-mt-40 {
  margin-top: 40px;
}

#container .set-mb-40 {
  margin-bottom: 40px;
}

#container .set-ml-40 {
  margin-left: 40px;
}

#container .set-mt-45 {
  margin-top: 45px;
}

#container .set-mr-45 {
  margin-right: 45px;
}

#container .set-mt-45 {
  margin-top: 45px;
}

#container .set-mb-45 {
  margin-bottom: 45px;
}

#container .set-ml-45 {
  margin-left: 45px;
}

#container .set-mt-50 {
  margin-top: 50px;
}

#container .set-mr-50 {
  margin-right: 50px;
}

#container .set-mt-50 {
  margin-top: 50px;
}

#container .set-mb-50 {
  margin-bottom: 50px;
}

#container .set-ml-50 {
  margin-left: 50px;
}

#container .set-mt-60 {
  margin-top: 60px;
}

#container .set-mr-60 {
  margin-right: 60px;
}

#container .set-mt-60 {
  margin-top: 60px;
}

#container .set-mb-60 {
  margin-bottom: 60px;
}

#container .set-ml-60 {
  margin-left: 60px;
}

#container .set-mt-70 {
  margin-top: 70px;
}

#container .set-mr-70 {
  margin-right: 70px;
}

#container .set-mt-70 {
  margin-top: 70px;
}

#container .set-mb-70 {
  margin-bottom: 70px;
}

#container .set-ml-70 {
  margin-left: 70px;
}

#container .set-mt-80 {
  margin-top: 80px;
}

#container .set-mr-80 {
  margin-right: 80px;
}

#container .set-mt-80 {
  margin-top: 80px;
}

#container .set-mb-80 {
  margin-bottom: 80px;
}

#container .set-ml-80 {
  margin-left: 80px;
}

#container .set-mt-90 {
  margin-top: 90px;
}

#container .set-mr-90 {
  margin-right: 90px;
}

#container .set-mt-90 {
  margin-top: 90px;
}

#container .set-mb-90 {
  margin-bottom: 90px;
}

#container .set-ml-90 {
  margin-left: 90px;
}

#container .set-mt-100 {
  margin-top: 100px;
}

#container .set-mr-100 {
  margin-right: 100px;
}

#container .set-mt-100 {
  margin-top: 100px;
}

#container .set-mb-100 {
  margin-bottom: 100px;
}

#container .set-ml-100 {
  margin-left: 100px;
}

#container .reset-mt {
  margin-top: 0;
}

#container .reset-mr {
  margin-right: 0;
}

#container .reset-mb {
  margin-bottom: 0;
}

#container .reset-ml {
  margin-left: 0;
}

@media screen and (max-width: 767px) {
  #container .set-sp-mt-5 {
    margin-top: 5vw;
  }
  #container .set-sp-mr-5 {
    margin-right: 5vw;
  }
  #container .set-sp-mt-5 {
    margin-top: 5vw;
  }
  #container .set-sp-mb-5 {
    margin-bottom: 5vw;
  }
  #container .set-sp-ml-5 {
    margin-left: 5vw;
  }
  #container .set-sp-mt-10 {
    margin-top: 10vw;
  }
  #container .set-sp-mr-10 {
    margin-right: 10vw;
  }
  #container .set-sp-mt-10 {
    margin-top: 10vw;
  }
  #container .set-sp-mb-10 {
    margin-bottom: 10vw;
  }
  #container .set-sp-ml-10 {
    margin-left: 10vw;
  }
  #container .set-sp-mt-15 {
    margin-top: 15vw;
  }
  #container .set-sp-mr-15 {
    margin-right: 15vw;
  }
  #container .set-sp-mt-15 {
    margin-top: 15vw;
  }
  #container .set-sp-mb-15 {
    margin-bottom: 15vw;
  }
  #container .set-sp-ml-15 {
    margin-left: 15vw;
  }
  #container .set-sp-mt-20 {
    margin-top: 20vw;
  }
  #container .set-sp-mr-20 {
    margin-right: 20vw;
  }
  #container .set-sp-mt-20 {
    margin-top: 20vw;
  }
  #container .set-sp-mb-20 {
    margin-bottom: 20vw;
  }
  #container .set-sp-ml-20 {
    margin-left: 20vw;
  }
  #container .set-sp-mt-30 {
    margin-top: 30vw;
  }
  #container .set-sp-mr-30 {
    margin-right: 30vw;
  }
  #container .set-sp-mt-30 {
    margin-top: 30vw;
  }
  #container .set-sp-mb-30 {
    margin-bottom: 30vw;
  }
  #container .set-sp-ml-30 {
    margin-left: 30vw;
  }
  #container .set-sp-mt-40 {
    margin-top: 40vw;
  }
  #container .set-sp-mr-40 {
    margin-right: 40vw;
  }
  #container .set-sp-mt-40 {
    margin-top: 40vw;
  }
  #container .set-sp-mb-40 {
    margin-bottom: 40vw;
  }
  #container .set-sp-ml-40 {
    margin-left: 40vw;
  }
  #container .set-sp-mt-50 {
    margin-top: 50vw;
  }
  #container .set-sp-mr-50 {
    margin-right: 50vw;
  }
  #container .set-sp-mt-50 {
    margin-top: 50vw;
  }
  #container .set-sp-mb-50 {
    margin-bottom: 50vw;
  }
  #container .set-sp-ml-50 {
    margin-left: 50vw;
  }
  #container .set-sp-mt-60 {
    margin-top: 60vw;
  }
  #container .set-sp-mr-60 {
    margin-right: 60vw;
  }
  #container .set-sp-mt-60 {
    margin-top: 60vw;
  }
  #container .set-sp-mb-60 {
    margin-bottom: 60vw;
  }
  #container .set-sp-ml-60 {
    margin-left: 60vw;
  }
  #container .set-sp-mt-70 {
    margin-top: 70vw;
  }
  #container .set-sp-mr-70 {
    margin-right: 70vw;
  }
  #container .set-sp-mt-70 {
    margin-top: 70vw;
  }
  #container .set-sp-mb-70 {
    margin-bottom: 70vw;
  }
  #container .set-sp-ml-70 {
    margin-left: 70vw;
  }
  #container .set-sp-mt-80 {
    margin-top: 80vw;
  }
  #container .set-sp-mr-80 {
    margin-right: 80vw;
  }
  #container .set-sp-mt-80 {
    margin-top: 80vw;
  }
  #container .set-sp-mb-80 {
    margin-bottom: 80vw;
  }
  #container .set-sp-ml-80 {
    margin-left: 80vw;
  }
  #container .set-sp-mt-90 {
    margin-top: 90vw;
  }
  #container .set-sp-mr-90 {
    margin-right: 90vw;
  }
  #container .set-sp-mt-90 {
    margin-top: 90vw;
  }
  #container .set-sp-mb-90 {
    margin-bottom: 90vw;
  }
  #container .set-sp-ml-90 {
    margin-left: 90vw;
  }
  #container .set-sp-mt-100 {
    margin-top: 100vw;
  }
  #container .set-sp-mr-100 {
    margin-right: 100vw;
  }
  #container .set-sp-mt-100 {
    margin-top: 100vw;
  }
  #container .set-sp-mb-100 {
    margin-bottom: 100vw;
  }
  #container .set-sp-ml-100 {
    margin-left: 100vw;
  }
  #container .reset-sp-mt {
    margin-top: 0;
  }
  #container .reset-sp-mr {
    margin-right: 0;
  }
  #container .reset-sp-mb {
    margin-bottom: 0;
  }
  #container .reset-sp-ml {
    margin-left: 0;
  }
}

/******************************
 * util padding
 ******************************/
.set-pt-5 {
  padding-top: 5px;
}

.set-pr-5 {
  padding-right: 5px;
}

.set-pt-5 {
  padding-top: 5px;
}

.set-pb-5 {
  padding-bottom: 5px;
}

.set-pl-5 {
  padding-left: 5px;
}

.set-pt-10 {
  padding-top: 10px;
}

.set-pr-10 {
  padding-right: 10px;
}

.set-pt-10 {
  padding-top: 10px;
}

.set-pb-10 {
  padding-bottom: 10px;
}

.set-pl-10 {
  padding-left: 10px;
}

.set-pt-15 {
  padding-top: 15px;
}

.set-pr-15 {
  padding-right: 15px;
}

.set-pt-15 {
  padding-top: 15px;
}

.set-pb-15 {
  padding-bottom: 15px;
}

.set-pl-15 {
  padding-left: 15px;
}

.set-pt-20 {
  padding-top: 20px;
}

.set-pr-20 {
  padding-right: 20px;
}

.set-pt-20 {
  padding-top: 20px;
}

.set-pb-20 {
  padding-bottom: 20px;
}

.set-pl-20 {
  padding-left: 20px;
}

.set-pt-30 {
  padding-top: 30px;
}

.set-pr-30 {
  padding-right: 30px;
}

.set-pt-30 {
  padding-top: 30px;
}

.set-pb-30 {
  padding-bottom: 30px;
}

.set-pl-30 {
  padding-left: 30px;
}

.set-pt-40 {
  padding-top: 40px;
}

.set-pr-40 {
  padding-right: 40px;
}

.set-pt-40 {
  padding-top: 40px;
}

.set-pb-40 {
  padding-bottom: 40px;
}

.set-pl-40 {
  padding-left: 40px;
}

.set-pt-50 {
  padding-top: 50px;
}

.set-pr-50 {
  padding-right: 50px;
}

.set-pt-50 {
  padding-top: 50px;
}

.set-pb-50 {
  padding-bottom: 50px;
}

.set-pl-50 {
  padding-left: 50px;
}

.set-pt-60 {
  padding-top: 60px;
}

.set-pr-60 {
  padding-right: 60px;
}

.set-pt-60 {
  padding-top: 60px;
}

.set-pb-60 {
  padding-bottom: 60px;
}

.set-pl-60 {
  padding-left: 60px;
}

.set-pt-70 {
  padding-top: 70px;
}

.set-pr-70 {
  padding-right: 70px;
}

.set-pt-70 {
  padding-top: 70px;
}

.set-pb-70 {
  padding-bottom: 70px;
}

.set-pl-70 {
  padding-left: 70px;
}

.set-pt-80 {
  padding-top: 80px;
}

.set-pr-80 {
  padding-right: 80px;
}

.set-pt-80 {
  padding-top: 80px;
}

.set-pb-80 {
  padding-bottom: 80px;
}

.set-pl-80 {
  padding-left: 80px;
}

.set-pt-90 {
  padding-top: 90px;
}

.set-pr-90 {
  padding-right: 90px;
}

.set-pt-90 {
  padding-top: 90px;
}

.set-pb-90 {
  padding-bottom: 90px;
}

.set-pl-90 {
  padding-left: 90px;
}

.set-pt-100 {
  padding-top: 100px;
}

.set-pr-100 {
  padding-right: 100px;
}

.set-pt-100 {
  padding-top: 100px;
}

.set-pb-100 {
  padding-bottom: 100px;
}

.set-pl-100 {
  padding-left: 100px;
}

.reset-pt {
  padding-top: 0;
}

.reset-pr {
  padding-right: 0;
}

.reset-pb {
  padding-bottom: 0;
}

.reset-pl {
  padding-left: 0;
}

@media screen and (max-width: 767px) {
  .set-sp-pt-5 {
    padding-top: 5vw;
  }
  .set-sp-pr-5 {
    padding-right: 5vw;
  }
  .set-sp-pt-5 {
    padding-top: 5vw;
  }
  .set-sp-pb-5 {
    padding-bottom: 5vw;
  }
  .set-sp-pl-5 {
    padding-left: 5vw;
  }
  .set-sp-pt-10 {
    padding-top: 10vw;
  }
  .set-sp-pr-10 {
    padding-right: 10vw;
  }
  .set-sp-pt-10 {
    padding-top: 10vw;
  }
  .set-sp-pb-10 {
    padding-bottom: 10vw;
  }
  .set-sp-pl-10 {
    padding-left: 10vw;
  }
  .set-sp-pt-15 {
    padding-top: 15vw;
  }
  .set-sp-pr-15 {
    padding-right: 15vw;
  }
  .set-sp-pt-15 {
    padding-top: 15vw;
  }
  .set-sp-pb-15 {
    padding-bottom: 15vw;
  }
  .set-sp-pl-15 {
    padding-left: 15vw;
  }
  .set-sp-pt-20 {
    padding-top: 20vw;
  }
  .set-sp-pr-20 {
    padding-right: 20vw;
  }
  .set-sp-pt-20 {
    padding-top: 20vw;
  }
  .set-sp-pb-20 {
    padding-bottom: 20vw;
  }
  .set-sp-pl-20 {
    padding-left: 20vw;
  }
  .set-sp-pt-30 {
    padding-top: 30vw;
  }
  .set-sp-pr-30 {
    padding-right: 30vw;
  }
  .set-sp-pt-30 {
    padding-top: 30vw;
  }
  .set-sp-pb-30 {
    padding-bottom: 30vw;
  }
  .set-sp-pl-30 {
    padding-left: 30vw;
  }
  .set-sp-pt-40 {
    padding-top: 40vw;
  }
  .set-sp-pr-40 {
    padding-right: 40vw;
  }
  .set-sp-pt-40 {
    padding-top: 40vw;
  }
  .set-sp-pb-40 {
    padding-bottom: 40vw;
  }
  .set-sp-pl-40 {
    padding-left: 40vw;
  }
  .set-sp-pt-50 {
    padding-top: 50vw;
  }
  .set-sp-pr-50 {
    padding-right: 50vw;
  }
  .set-sp-pt-50 {
    padding-top: 50vw;
  }
  .set-sp-pb-50 {
    padding-bottom: 50vw;
  }
  .set-sp-pl-50 {
    padding-left: 50vw;
  }
  .set-sp-pt-60 {
    padding-top: 60vw;
  }
  .set-sp-pr-60 {
    padding-right: 60vw;
  }
  .set-sp-pt-60 {
    padding-top: 60vw;
  }
  .set-sp-pb-60 {
    padding-bottom: 60vw;
  }
  .set-sp-pl-60 {
    padding-left: 60vw;
  }
  .set-sp-pt-70 {
    padding-top: 70vw;
  }
  .set-sp-pr-70 {
    padding-right: 70vw;
  }
  .set-sp-pt-70 {
    padding-top: 70vw;
  }
  .set-sp-pb-70 {
    padding-bottom: 70vw;
  }
  .set-sp-pl-70 {
    padding-left: 70vw;
  }
  .set-sp-pt-80 {
    padding-top: 80vw;
  }
  .set-sp-pr-80 {
    padding-right: 80vw;
  }
  .set-sp-pt-80 {
    padding-top: 80vw;
  }
  .set-sp-pb-80 {
    padding-bottom: 80vw;
  }
  .set-sp-pl-80 {
    padding-left: 80vw;
  }
  .set-sp-pt-90 {
    padding-top: 90vw;
  }
  .set-sp-pr-90 {
    padding-right: 90vw;
  }
  .set-sp-pt-90 {
    padding-top: 90vw;
  }
  .set-sp-pb-90 {
    padding-bottom: 90vw;
  }
  .set-sp-pl-90 {
    padding-left: 90vw;
  }
  .set-sp-pt-100 {
    padding-top: 100vw;
  }
  .set-sp-pr-100 {
    padding-right: 100vw;
  }
  .set-sp-pt-100 {
    padding-top: 100vw;
  }
  .set-sp-pb-100 {
    padding-bottom: 100vw;
  }
  .set-sp-pl-100 {
    padding-left: 100vw;
  }
  .reset-sp-ml {
    margin-left: 0;
  }
  .reset-sp-pt {
    padding-top: 0;
  }
  .reset-sp-pr {
    padding-right: 0;
  }
  .reset-sp-pb {
    padding-bottom: 0;
  }
  .reset-sp-pl {
    padding-left: 0;
  }
}

/******************************
 * util width
 ******************************/
#container .fix-w {
  margin-right: auto;
  margin-left: auto;
}

@media screen and (min-width: 768px) {
  #container .fix-w {
    width: 1000px;
  }
}

#container .set-w-10 {
  width: 10%;
}

#container .set-w-20 {
  width: 20%;
}

#container .set-w-30 {
  width: 30%;
}

#container .set-w-40 {
  width: 40%;
}

#container .set-w-50 {
  width: 50%;
}

#container .set-w-60 {
  width: 60%;
}

#container .set-w-70 {
  width: 70%;
}

#container .set-w-80 {
  width: 80%;
}

#container .set-w-90 {
  width: 90%;
}

#container .set-w-100 {
  width: 100%;
}

#container .set-w-full {
  width: 100%;
}

#container .reset-max-w {
  max-width: none;
}

@media screen and (max-width: 767px) {
  #container .sp-full-w {
    margin-right: -8vw;
    margin-left: -8vw;
  }
  #container .reset-sp-w {
    width: auto;
  }
}

/******************************
 * util align
 ******************************/
#container .set-block-c {
  margin-left: auto;
  margin-right: auto;
}

#container .set-align-c {
  text-align: center;
}

#container .set-align-r {
  text-align: right;
}

#container .set-align-l {
  text-align: left;
}

#container .set-valign-t {
  vertical-align: top;
}

#container .set-valign-m {
  vertical-align: middle;
}

#container .set-valign-b {
  vertical-align: bottom;
}

@media screen and (max-width: 767px) {
  #container .set-sp-align-c {
    text-align: center;
  }
  #container .set-sp-align-r {
    text-align: right;
  }
  #container .set-sp-align-l {
    text-align: left;
  }
}

/******************************
 * util font size
 ******************************/
.set-fs-11 {
  font-size: 1.1rem;
}

.set-fs-12 {
  font-size: 1.2rem;
}

.set-fs-13 {
  font-size: 1.3rem;
}

.set-fs-14 {
  font-size: 1.4rem;
}

.set-fs-15 {
  font-size: 1.5rem;
}

.set-fs-16 {
  font-size: 1.6rem;
}

.set-fs-17 {
  font-size: 1.7rem;
}

.set-fs-18 {
  font-size: 1.8rem;
}

.set-fs-19 {
  font-size: 1.9rem;
}

.set-fs-20 {
  font-size: 2rem;
}

.set-fs-21 {
  font-size: 2.1rem;
}

.set-fs-22 {
  font-size: 2.2rem;
}

.set-fs-23 {
  font-size: 2.3rem;
}

.set-fs-24 {
  font-size: 2.4rem;
}

.set-fs-25 {
  font-size: 2.5rem;
}

.set-fs-26 {
  font-size: 2.6rem;
}

.set-fs-27 {
  font-size: 2.7rem;
}

.set-fs-28 {
  font-size: 2.8rem;
}

.set-fs-29 {
  font-size: 2.9rem;
}

.set-fs-30 {
  font-size: 3rem;
}

.set-fs-s {
  font-size: 1.1rem;
}

@media screen and (max-width: 767px) {
  .set-fs-s {
    font-size: 3.0vw;
  }
}

/******************************
 * util hover
 ******************************/
.is-hover--op {
  transition: opacity .25s ease;
}

.is-hover--op:hover {
  opacity: .8;
}

/******************************
 * util other
 ******************************/
#container .set-en {
  font-family: 'Spartan', "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック", "Hiragino Sans", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro" , "Meiryo", "メイリオ", sans-serif;
}

#container .set-pos-rel {
  position: relative;
}

#container .set-pos-abs {
  position: absolute;
}

#container .set-float-l {
  float: left;
}

#container .set-float-r {
  float: right;
}

#container .set-wbreak {
  word-break: break-all;
}

#container .set-nowrap {
  white-space: nowrap;
}

#container .set-ellipsis {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#container .reset-a-style {
  cursor: default;
}

@media screen and (max-width: 767px) {
  #container .sp-pad {
    padding-right: 8vw;
    padding-left: 8vw;
  }
  #container .reset-sp-pos {
    position: static;
  }
}
