@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300&display=swap");
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: inherit;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

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

th {
  text-align: left;
  vertical-align: top;
  font-weight: normal;
}

td {
  text-align: left;
  vertical-align: top;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

input, select, textarea, img {
  vertical-align: middle;
}

ul, dl, ol {
  list-style: none;
}

em {
  font-style: normal;
}

* {
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/* ========================================
    ■ 必須設定
======================================== */
/* 関数
----------------------------- */
.kenten, .kenten_half {
  padding: 0.35em 0;
  background-repeat: repeat-x;
  background-size: 1em 0.5em;
  background-position: top left;
  background-image: radial-gradient(0.4em 0.4em at center center, #332d2c 50%, transparent 50%);
  -webkit-font-feature-settings: normal;
          font-feature-settings: normal;
}

.kenten_half {
  background-size: 0.65em 0.5em;
}

.is_sp {
  display: block;
}

@media screen and (min-width: 769px) {
  .is_sp {
    display: none;
  }
}

.is_pc {
  display: none;
}

@media screen and (min-width: 769px) {
  .is_pc {
    display: block;
  }
}

img.is_sp,
br.is_sp {
  display: inline-block;
}

@media screen and (min-width: 769px) {
  img.is_sp,
  br.is_sp {
    display: none;
  }
}

img.is_pc,
br.is_pc {
  display: none;
}

@media screen and (min-width: 769px) {
  img.is_pc,
  br.is_pc {
    display: inline-block;
  }
}

/* ========================================
    ■ General
======================================== */
/* 1px = 0.01remに変換（100px = 1rem）*/
html {
  font-size: 13.02083vw;
}

@media screen and (min-width: 769px) {
  html {
    font-size: 5vw;
  }
}

body {
  font-family: "Shippori Mincho B1", serif;
  color: #332d2c;
  line-height: 1.6;
  background: #fff;
  -webkit-text-size-adjust: 100%;
  -webkit-font-feature-settings: "palt" 1;
          font-feature-settings: "palt" 1;
  font-size: 0.3rem;
}

@media screen and (min-width: 769px) {
  body {
    font-size: 0.23rem;
  }
}

a {
  color: #0d0d0d;
  text-decoration: underline;
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}

a::before, a::after {
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}

a:hover {
  text-decoration: none;
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}

a:hover::before, a:hover::after {
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}

img,
video,
object {
  width: 100%;
  height: auto;
  vertical-align: bottom;
  border: none;
}

section {
  position: relative;
}

mark {
  background: none;
  color: inherit;
  font-weight: normal;
  font-style: normal;
}

picture {
  display: block;
}

/* utility class
----------------------------- */
.wrap {
  position: relative;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .wrap {
    max-width: 2000px;
  }
}

.clearfix {
  overflow: hidden;
  zoom: 1;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

.hover:hover {
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}

.hover:hover:hover {
  -webkit-transform: scale(0.98, 0.98);
          transform: scale(0.98, 0.98);
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}

.scrollbar::-webkit-scrollbar {
  background: #ccc;
  width: 0.1rem;
}

.scrollbar::-webkit-scrollbar-thumb {
  background: #aaa;
}

table.tbl_block {
  display: block;
  text-align: left;
}

@media screen and (min-width: 769px) {
  table.tbl_block {
    display: table;
  }
}

table.tbl_block tbody {
  display: block;
  text-align: left;
}

@media screen and (min-width: 769px) {
  table.tbl_block tbody {
    display: table-row-group;
  }
}

table.tbl_block tr {
  display: block;
  text-align: left;
}

@media screen and (min-width: 769px) {
  table.tbl_block tr {
    display: table-row;
  }
}

table.tbl_block th,
table.tbl_block td {
  display: block;
  text-align: left;
}

@media screen and (min-width: 769px) {
  table.tbl_block th,
  table.tbl_block td {
    display: table-cell;
  }
}

/* マーカー */
mark {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(50%, #f3f3f3), color-stop(50%, transparent));
  background: linear-gradient(0deg, #f3f3f3 50%, transparent 50%);
}

/* ・リスト */
.list_dot > li {
  position: relative;
  padding-left: 1em;
}

.list_dot > li::before {
  content: "・";
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
}

html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

/* ========================================
    ■ animation
======================================== */
@-webkit-keyframes tilt-in-top-2 {
  0% {
    -webkit-transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}

@keyframes tilt-in-top-2 {
  0% {
    -webkit-transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}

/* ========================================
    ■ header
======================================== */
.header {
  max-width: 7.22rem;
  margin: 0rem auto 0;
  padding-top: 0.16rem;
}

@media screen and (min-width: 769px) {
  .header {
    max-width: 10rem;
    position: relative;
  }
}

.header_icon {
  max-width: 0.85rem;
  -o-object-fit: cover;
     object-fit: cover;
  margin-left: auto;
  display: block;
  -webkit-transition: 1s;
  transition: 1s;
  cursor: pointer;
}

@media screen and (min-width: 769px) {
  .header_icon {
    max-width: 0.66rem;
  }
}

.header_menu {
  position: absolute;
  height: 12.72rem;
  width: 100%;
  left: 0;
  /* 変更 */
  top: -12.81rem;
  /* 変更 */
  background-color: rgba(240, 226, 199, 0.91);
  -webkit-transition: 0.7s;
  transition: 0.7s;
  z-index: 999;
  border: solid 1px #414141;
}

@media screen and (min-width: 769px) {
  .header_menu {
    width: 43%;
    right: 0;
    left: initial;
    height: 6.8901rem;
    top: -6.8901rem;
    /* 変更 */
  }
}

.header_menu_closewrap {
  max-width: 7.22rem;
  margin: 0rem auto 0;
  padding-top: 0.16rem;
  padding-right: 0.08rem;
}

.header_menu_closewrap > img {
  max-width: 0.85rem;
  -o-object-fit: cover;
     object-fit: cover;
  margin-left: auto;
  display: block;
  -webkit-transition: 1s;
  transition: 1s;
  cursor: pointer;
}

@media screen and (min-width: 769px) {
  .header_menu_closewrap > img {
    max-width: 0.66rem;
  }
}

.header_menu_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  text-align: center;
  margin-top: 0.44rem;
}

.header_menu_list > li {
  width: 50%;
  padding: 0.24rem 0;
  border-top: solid 1px #414141;
}

@media screen and (min-width: 769px) {
  .header_menu_list > li {
    padding: 0.08rem 0;
  }
}

.header_menu_list > li > a {
  font-size: 0.35rem;
  text-decoration: none;
  color: #414141;
  font-weight: 700;
}

@media screen and (min-width: 769px) {
  .header_menu_list > li > a {
    font-size: 0.2rem;
  }
}

.header_menu_list_campaign, .header_menu_list_movie, .header_menu_list_introduction {
  border-right: solid 1px #414141;
}

.header_menu_logo {
  max-width: 6.18rem;
  margin: -0.2rem auto 0px;
  display: block;
}

@media screen and (min-width: 769px) {
  .header_menu_logo {
    max-width: 3.57rem;
  }
}

.header_menu_share {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 0.6rem 1.2rem 0.56rem;
  border-top: solid 1px #414141;
  border-bottom: solid 1px #414141;
}

@media screen and (min-width: 769px) {
  .header_menu_share {
    padding: 0.08rem 0.96rem 0.16rem;
  }
}

.header_menu_share_title {
  width: 100%;
  font-size: 0.28rem;
  text-align: center;
  font-weight: 700;
}

@media screen and (min-width: 769px) {
  .header_menu_share_title {
    font-size: 0.16rem;
  }
}

.header_menu_share_twitter, .header_menu_share_line, .header_menu_share_facebook {
  margin-top: 0.32rem;
}

.header_menu_share_twitter {
  max-width: 1.1rem;
}

@media screen and (min-width: 769px) {
  .header_menu_share_twitter {
    max-width: 0.53rem;
  }
}

.header_menu_share_line {
  max-width: 0.94rem;
}

@media screen and (min-width: 769px) {
  .header_menu_share_line {
    max-width: 0.46rem;
  }
}

.header_menu_share_facebook {
  max-width: 0.91rem;
}

@media screen and (min-width: 769px) {
  .header_menu_share_facebook {
    max-width: 0.44rem;
  }
}

.header_menu_btnwrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 4rem;
  margin: 0 auto;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.header_menu_btnwrap_btn {
  max-width: 3.2445rem;
  margin: 0.36rem auto;
}

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

@media screen and (min-width: 769px) {
  .header_menu_btnwrap_btn {
    max-width: 1.75rem;
  }
}

.in {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  /* 変更 */
}

/* ========================================
    ■ keyv
======================================== */
.keyv {
  background-image: url(../images/keyv_bg@2x.png);
  background-size: cover;
}

@media screen and (min-width: 769px) {
  .keyv {
    background-image: url(../images/keyv_bg_pc@2x.png);
  }
}

.keyv_copy {
  max-width: 6.9rem;
  position: relative;
  margin: 0.48rem auto;
}

@media screen and (min-width: 769px) {
  .keyv_copy {
    max-width: 6.52rem;
  }
}

.keyv_copy_text {
  max-width: 0.392rem;
  position: absolute;
  right: 0;
  -webkit-animation: tilt-in-top-2 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  animation: tilt-in-top-2 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

@media screen and (min-width: 769px) {
  .keyv_copy_text {
    max-width: 1.12rem;
    top: -0.8rem;
  }
}

.keyv_main {
  max-width: 5.4rem;
  margin: 5rem auto 0.28rem;
}

@media screen and (min-width: 769px) {
  .keyv_main {
    margin: 3.2rem 0rem 0.4rem 11rem;
    max-width: 4.4rem;
  }
}

/* ========================================
    ■ cta
======================================== */
.cta {
  background-image: url(../images/cta_bg@2x.png);
  background-size: cover;
  padding: 0.56rem 0 1.08rem;
}

@media screen and (min-width: 769px) {
  .cta {
    background-image: url(../images/cta_bg_pc@2x.png);
    padding: 0.26rem 0 0.34rem;
  }
}

.cta_text {
  font-size: 0.28rem;
  text-align: center;
  font-weight: 700;
  line-height: 1.6;
}

@media screen and (min-width: 769px) {
  .cta_text {
    font-size: 0.25rem;
  }
}

.cta_text_strong {
  font-size: 0.35rem;
}

@media screen and (min-width: 769px) {
  .cta_text_strong {
    font-size: 0.3rem;
  }
}

.cta_text_num {
  font-size: 0.5rem;
}

@media screen and (min-width: 769px) {
  .cta_text_num {
    font-size: 0.4rem;
  }
}

@media screen and (min-width: 769px) {
  .cta_btnwrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 7.47rem;
    margin: 0.24rem auto 0;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.cta_btnwrap_btn {
  max-width: 4.65rem;
  display: block;
  margin: 0.12rem auto 0;
  position: relative;
  z-index: 999;
}

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

@media screen and (min-width: 769px) {
  .cta_btnwrap_btn {
    max-width: 3.5rem;
    display: inline;
  }
}

.cta_scroll {
  position: absolute;
  top: 56%;
  z-index: 998;
  max-width: 7.68rem;
  left: 0;
  right: 0;
  margin: auto;
}

@media screen and (min-width: 769px) {
  .cta_scroll {
    top: 45%;
  }
}

/* ========================================
    ■ campaign
======================================== */
.campaign {
  background-image: url(../images/campaign_bg@2x.png);
  background-size: contain;
  background-repeat: no-repeat;
  padding: 1.56rem 0 0;
}

@media screen and (min-width: 769px) {
  .campaign {
    background-image: url(../images/campaign_bg_pc@2x.png);
    padding: 1.4rem 0 0.68rem;
  }
}

.campaign_copy {
  max-width: 6.14rem;
  margin: 0 auto;
  opacity: 0;
}

@media screen and (min-width: 769px) {
  .campaign_copy {
    max-width: 5.35rem;
  }
}

.campaign_monster {
  max-width: 6.3rem;
  margin: 0.24rem auto 0;
  display: block;
}

@media screen and (min-width: 769px) {
  .campaign_monster {
    max-width: 5.52rem;
  }
}

.campaign_about {
  margin-top: 0.32rem;
  color: white;
  text-align: center;
  font-size: 0.28rem;
  line-height: 1.8;
}

@media screen and (min-width: 769px) {
  .campaign_about {
    font-size: 0.22rem;
  }
}

.campaign_lead {
  font-size: 0.6684rem;
  font-weight: 900;
  max-width: 6.9rem;
  margin: 1.72rem auto 0px;
  line-height: 1.2;
}

@media screen and (min-width: 769px) {
  .campaign_lead {
    max-width: 10rem;
    font-size: 0.45rem;
    margin: 3.4rem auto 0px;
  }
}

.campaign_lead_center {
  font-size: 0.7194rem;
  letter-spacing: -0.05rem;
  font-size: 0.5rem;
}

.campaign_lead_center_num {
  font-size: 1rem;
  letter-spacing: 0;
  font-size: 0.7rem;
}

.campaign_lead_bottom {
  font-size: 0.7588rem;
  font-size: 0.5rem;
}

.campaign_balloon {
  position: relative;
  max-width: 6.9rem;
  margin: 0 auto;
}

.campaign_balloon > img {
  position: absolute;
  max-width: 4.6rem;
  right: 0;
  top: 1.8rem;
}

@media screen and (min-width: 769px) {
  .campaign_balloon > img {
    left: 0;
    margin: auto;
    top: 2.76rem;
  }
}

.campaign_jem {
  margin: -0.72rem auto 0.32rem;
  max-width: 7.4rem;
  display: block;
}

@media screen and (min-width: 769px) {
  .campaign_jem {
    max-width: 9rem;
    margin: 0.4rem auto 0.88rem;
  }
}

/* ========================================
    ■ share
======================================== */
.share {
  position: relative;
  z-index: 999;
}

.share_head {
  font-size: 0.28rem;
  text-align: center;
  font-weight: 700;
  background-image: url(../images/share_head_leftdec@2x.png), url(../images/share_head_rightdec@2x.png);
  background-size: 16%;
  background-repeat: no-repeat;
  background-position: top 65% left 25%, top 60% right 25%;
}

@media screen and (min-width: 769px) {
  .share_head {
    font-size: 0.22rem;
    background-size: 5%;
    background-position: top 65% left 43%, top 60% right 43%;
  }
}

.share_btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 0.2rem;
}

.share_btn_twitter {
  max-width: 4.86rem;
}

@media screen and (min-width: 769px) {
  .share_btn_twitter {
    max-width: 3.45rem;
    margin-top: 0.24rem;
  }
}

.share_btn_line, .share_btn_facebook {
  max-width: 3.45rem;
}

@media screen and (min-width: 769px) {
  .share_btn_line {
    margin: 0.24rem 0.24rem 0;
  }
}

@media screen and (min-width: 769px) {
  .share_btn_facebook {
    margin-top: 0.24rem;
  }
}

/* ========================================
    ■ news
======================================== */
.news {
  background-image: url(../images/news_bg@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  padding-top: 4.12rem;
  margin-top: -3rem;
  padding-bottom: 2.52rem;
}

@media screen and (min-width: 769px) {
  .news {
    background-image: url(../images/news_bg_pc@2x.png);
  }
}

.news_twitterwrap {
  max-width: 6.9rem;
  margin: 0 auto;
}

.news_moviewrap {
  position: relative;
  padding-bottom: 56.25%;
  /*アスペクト比 16:9の場合の縦幅*/
  height: 0;
  overflow: hidden;
  max-width: 6.9rem;
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .news_moviewrap {
    padding-bottom: 22%;
  }
}

.news_moviewrap > iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.news_twitter {
  max-width: 4.54rem;
  -webkit-transform: scale(0.5, 1);
          transform: scale(0.5, 1);
  -webkit-transform-origin: left;
          transform-origin: left;
  opacity: 0;
}

@media screen and (min-width: 769px) {
  .news_twitter {
    max-width: 5.8rem;
    margin: 0 auto;
  }
  .news_twitter > img {
    width: 80%;
  }
}

.news_lead {
  color: white;
  text-align: center;
  margin-top: -0.2rem;
  font-size: 0.35rem;
  font-weight: 700;
  letter-spacing: 0.024rem;
}

@media screen and (min-width: 769px) {
  .news_lead {
    font-size: 0.3rem;
  }
}

.news_movie {
  max-width: 3.8rem;
  margin-top: 0.92rem;
  margin: 0.92rem 0 0 auto;
  -webkit-transform: scale(0.5, 1);
          transform: scale(0.5, 1);
  -webkit-transform-origin: right;
          transform-origin: right;
  opacity: 0;
}

@media screen and (min-width: 769px) {
  .news_movie {
    max-width: 7.82rem;
    margin-right: auto;
  }
  .news_movie > img {
    display: block;
    margin-left: auto;
    max-width: 3.91rem;
  }
}

/* ========================================
    ■ world
======================================== */
.world {
  background-image: url(../images/);
  background-size: cover;
  background-repeat: no-repeat;
  padding-bottom: 2.4rem;
}

@media screen and (min-width: 769px) {
  .world {
    background-image: url(../images/);
    background-size: contain;
    padding-bottom: 3.2rem;
  }
}

.world_imagewrap {
  max-width: 5.9rem;
}

@media screen and (min-width: 769px) {
  .world_imagewrap {
    max-width: 14.6rem;
    margin: 0 auto;
  }
  .world_imagewrap > img {
    max-width: 9.97rem;
  }
}

.world_copy01wrap {
  position: relative;
  max-width: 6.4rem;
  margin: 0 auto;
}

@media screen and (min-width: 769px) {
  .world_copy01wrap {
    max-width: 10rem;
  }
}

.world_copy01wrap_text {
  max-width: 2.4rem;
  position: absolute;
  right: 0;
  top: -5.2rem;
  -webkit-transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
  transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
  opacity: 0;
}

@media screen and (min-width: 769px) {
  .world_copy01wrap_text {
    max-width: 3.21rem;
    top: -6.6rem;
  }
}

.world_title {
  max-width: 3.52rem;
  margin-top: 5.8rem;
}

@media screen and (min-width: 769px) {
  .world_title {
    max-width: 11rem;
    margin: 5rem auto 0;
  }
  .world_title > img {
    max-width: 3.77rem;
  }
}

.world_text {
  font-size: 0.25rem;
  max-width: 6.64rem;
  margin: -0.2rem auto;
}

@media screen and (min-width: 769px) {
  .world_text {
    max-width: 10rem;
  }
}

.world_text > p + p {
  margin-top: 0.36rem;
}

.world_text > picture > img {
  margin-top: 0.56rem;
}

/* ========================================
    ■ introduction
======================================== */
.introduction {
  background-image: url(../images/introduction_bg@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  margin-top: -3.2rem;
  padding: 3.2rem 0 2rem;
  overflow: hidden;
}

@media screen and (min-width: 769px) {
  .introduction {
    background-image: url(../images/introduction_bg_pc@2x.png);
    padding: 3.2rem 0 4rem;
  }
}

@media screen and (min-width: 1200px) {
  .introduction {
    padding: 3.2rem 0 2.7rem;
  }
}

@media screen and (min-width: 320px) and (max-width: 374px) {
  .introduction {
    padding: 4rem 0 0.8rem;
  }
}

.introduction_head {
  max-width: 6.11rem;
  margin-left: auto;
  -webkit-transform: scale(0.5, 1);
          transform: scale(0.5, 1);
  -webkit-transform-origin: right;
          transform-origin: right;
}

@media screen and (min-width: 769px) {
  .introduction_head {
    max-width: 8.56rem;
    margin: 0 auto;
  }
  .introduction_head > img {
    max-width: 6.35rem;
    margin-left: auto;
    display: block;
  }
}

.introduction_about {
  font-weight: 700;
  color: white;
  font-size: 0.35rem;
  text-align: center;
}

@media screen and (min-width: 769px) {
  .introduction_about {
    font-size: 0.3rem;
  }
}

#pagination {
  position: absolute;
  left: 50%;
  margin-left: -40px;
  bottom: 70px;
}

@media screen and (max-width: 430px) {
  #pagination {
    bottom: 70px;
  }
}

#mainslider {
  padding-top: 0.8rem;
  height: 740px;
  width: 100%;
  max-width: 1315px;
}

@media screen and (max-width: 430px) {
  #mainslider {
    height: 650px;
  }
}

#mainslider .swiper-wrapper .swiper-slide {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-transition-property: all;
  transition-property: all;
  margin-top: 46px;
}

#mainslider .swiper-wrapper .swiper-slide_wrap {
  position: relative;
}

#mainslider .swiper-wrapper .swiper-slide .swiper-slide_wrap {
  height: 456.2px;
}

#mainslider .swiper-wrapper .swiper-slide .swiper-slide_wrap .swiper-slide_wrap_main {
  width: 320px;
  min-width: 320px;
  display: block;
  margin: 0 auto;
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

@media screen and (max-width: 500px) {
  #mainslider .swiper-wrapper .swiper-slide .swiper-slide_wrap .swiper-slide_wrap_main {
    width: 200px;
    min-width: 200px;
  }
}

#mainslider .swiper-wrapper .swiper-slide-active {
  margin-top: 0;
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

#mainslider .swiper-wrapper .swiper-slide-active .swiper-slide_wrap .swiper-slide_wrap_main {
  -webkit-box-shadow: 0px 7px 51px 0px rgba(3, 38, 76, 0.99);
          box-shadow: 0px 7px 51px 0px rgba(3, 38, 76, 0.99);
  width: 100%;
  max-width: 380px;
}

@media screen and (max-width: 500px) {
  #mainslider .swiper-wrapper .swiper-slide-active .swiper-slide_wrap .swiper-slide_wrap_main {
    width: 100%;
    min-width: 100%;
  }
}

#mainslider .swiper-wrapper .swiper-slide-active .swiper-slide_wrap .swiper-slide_wrap_title {
  width: 335px;
}

@media screen and (max-width: 500px) {
  #mainslider .swiper-wrapper .swiper-slide-active .swiper-slide_wrap .swiper-slide_wrap_title {
    width: 250px;
  }
}

#mainslider .swiper-wrapper .swiper-slide-next .swiper-slide_wrap {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

#mainslider .swiper-wrapper .swiper-slide-next .swiper-slide_wrap .swiper-slide_wrap_main {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-box-shadow: 0px 7px 17px 0px rgba(3, 38, 76, 0.99);
          box-shadow: 0px 7px 17px 0px rgba(3, 38, 76, 0.99);
}

#mainslider .swiper-wrapper .swiper-slide-prev .swiper-slide_wrap {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
}

#mainslider .swiper-wrapper .swiper-slide-prev .swiper-slide_wrap .swiper-slide_wrap_main {
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-box-shadow: 0px 7px 17px 0px rgba(3, 38, 76, 0.99);
          box-shadow: 0px 7px 17px 0px rgba(3, 38, 76, 0.99);
}

.slide_about {
  background-image: url(../images/introduction_slider_about_bg@2x.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  width: 384px;
  height: 151px;
  position: absolute;
  left: 50%;
  margin-left: -201px;
  bottom: 116px;
  z-index: 999;
}

@media screen and (max-width: 430px) {
  .slide_about {
    width: 346px;
    height: 136px;
    margin-left: -170px;
    bottom: 145px;
  }
}

@media screen and (min-width: 500px) and (max-width: 600px) {
  .slide_about {
    bottom: 91px;
  }
}

@media screen and (min-width: 900px) and (max-width: 1000px) {
  .slide_about {
    bottom: 132px;
  }
}

@media screen and (min-width: 1000px) and (max-width: 1200px) {
  .slide_about {
    bottom: 165px;
  }
}

@media screen and (min-width: 1200px) and (max-width: 1500px) {
  .slide_about {
    bottom: 115px;
  }
}

@media screen and (min-width: 1500px) and (max-width: 1700px) {
  .slide_about {
    bottom: 140px;
  }
}

@media screen and (min-width: 1700px) {
  .slide_about {
    bottom: 155px;
  }
}

@media screen and (min-width: 320px) and (max-width: 374px) {
  .slide_about {
    width: 308px;
    height: 121px;
    margin-left: -154px;
    bottom: 130px;
  }
}

@media screen and (min-width: 360px) and (max-width: 374px) {
  .slide_about {
    bottom: 100px;
  }
}

.slide_about_text {
  color: white;
  font-size: 16px;
  font-family: "Kiwi Maru", serif;
  width: 330px;
  padding: 0.32rem 0px 0px 0.28rem;
  line-height: 1.7;
  opacity: 0;
}

@media screen and (max-width: 500px) {
  .slide_about_text {
    width: 290px;
  }
}

@media screen and (min-width: 320px) and (max-width: 374px) {
  .slide_about_text {
    font-size: 14px;
  }
}

.slide_about_avater {
  -o-object-fit: cover;
     object-fit: cover;
  width: 366px;
  position: absolute;
  right: -60px;
  top: -28px;
}

@media screen and (max-width: 500px) {
  .slide_about_avater {
    right: -41px;
    top: -23px;
    width: 336px;
  }
}

@media screen and (min-width: 320px) and (max-width: 374px) {
  .slide_about_avater {
    right: -35px;
    top: -26px;
    width: 292px;
  }
}

/* ========================================
    ■ character
======================================== */
.character {
  background-image: url(../images/character_bg@2x.png);
  background-size: cover;
  position: relative;
  margin-top: -0.08rem;
  padding-bottom: 10.56rem;
}

@media screen and (min-width: 769px) {
  .character {
    margin-top: -0.32rem;
    background-image: url(../images/character_bg_pc@2x.png);
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 1.6rem;
  }
}

.character_head {
  position: absolute;
  max-width: 2.72rem;
  left: 0;
  right: 0;
  margin: auto;
  top: -0.32rem;
}

@media screen and (min-width: 769px) {
  .character_head {
    top: -0.36rem;
  }
}

.character_imagewrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 1.2rem;
}

@media screen and (min-width: 769px) {
  .character_imagewrap {
    max-width: 11rem;
    margin: 0 auto;
  }
}

.character_imagewrap_01 {
  position: absolute;
  top: 51.6%;
}

@media screen and (min-width: 769px) {
  .character_imagewrap_01 {
    max-width: 5.3614rem;
    -o-object-fit: cover;
       object-fit: cover;
    top: 15%;
  }
}

.character_imagewrap_02 {
  max-width: 4.56rem;
  -o-object-fit: cover;
     object-fit: cover;
  margin: 1.4rem 0.2rem 0 0;
  position: relative;
  z-index: 999;
}

@media screen and (min-width: 769px) {
  .character_imagewrap_02 {
    max-width: 4.29rem;
    margin-top: 0.8rem;
    margin-left: auto;
  }
}

.character_imagewrap_03 {
  max-width: 2.6rem;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
  transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
  opacity: 0;
}

@media screen and (min-width: 769px) {
  .character_imagewrap_03 {
    max-width: 1.55rem;
  }
}

/* ========================================
    ■ footer
======================================== */
.footer_main {
  background-image: url(../images/);
  background-size: cover;
  padding: 0.96rem 0 0.2rem;
}

@media screen and (min-width: 769px) {
  .footer_main {
    background-image: url(../images/);
  }
}

.footer_btnwrap {
  margin: 0rem auto 0.4rem;
}

@media screen and (min-width: 769px) {
  .footer_btnwrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 7.47rem;
    margin: 0rem auto 0.6rem;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

.footer_btnwrap_btn {
  max-width: 4.65rem;
  display: block;
  margin: 0.12rem auto 0;
  position: relative;
}

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

@media screen and (min-width: 769px) {
  .footer_btnwrap_btn {
    max-width: 3.5rem;
    display: inline;
  }
}

.footer_company {
  color: #0d0d0d;
  font-size: 0.28rem;
  font-weight: 700;
  text-align: center;
  margin-top: 0.64rem;
}

@media screen and (min-width: 769px) {
  .footer_company {
    font-size: 0.22rem;
  }
}

.footer_company_name {
  font-size: 0.35rem;
}

@media screen and (min-width: 769px) {
  .footer_company_name {
    font-size: 0.25rem;
  }
}

.footer_company_address {
  margin-top: 0.12rem;
  font-weight: 500;
}

.footer_company_privacy {
  margin-top: 0.56rem;
  display: block;
}

.footer_copyright {
  font-size: 0.18rem;
  font-weight: 700;
  text-align: center;
  margin-top: 1.08rem;
}

/* ========================================
    ■ holdnav
======================================== */
.holdnav {
  padding: 0.16rem 0px 0.2rem;
  background-image: url(../images/footer_hold_bg@2x.png);
  background-size: cover;
  position: -webkit-sticky;
  position: sticky;
  opacity: 0;
  bottom: 0;
  z-index: 999;
  width: 100%;
}

@media screen and (min-width: 769px) {
  .holdnav {
    background-image: url(../images/footer_hold_bg_pc@2x.png);
    padding: 0.2rem 0px 0.12rem;
  }
}

.holdnav_wrap {
  max-width: 10.68rem;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (min-width: 769px) {
  .holdnav_wrap {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    max-width: 7rem;
  }
}

.holdnav_wrap_btn {
  max-width: 3.2445rem;
  -o-object-fit: cover;
     object-fit: cover;
  position: relative;
}

@media screen and (min-width: 769px) {
  .holdnav_wrap_btn {
    margin-left: 0;
  }
}

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

.holdnav_wrap_top {
  position: absolute;
  right: 8px;
  max-width: 0.4rem;
  -o-object-fit: cover;
     object-fit: cover;
}

@media screen and (min-width: 769px) {
  .holdnav_wrap_top {
    right: 200px;
  }
}

/* ========================================
    ■ privacy
======================================== */
.privacy {
  background-image: url(../images/privacy_bg@2x.png);
  background-size: cover;
}

@media screen and (min-width: 769px) {
  .privacy {
    background-image: url(../images/privacy_bg_pc@2x.png);
  }
}

.privacy_main_title {
  font-size: 0.35rem;
  font-weight: 700;
  color: white;
  text-align: center;
  margin-top: 0.4rem;
}

@media screen and (min-width: 769px) {
  .privacy_main_title {
    margin-top: 0.24rem;
  }
}

.privacy_main_wrap {
  background-color: rgba(255, 255, 255, 0.851);
  padding: 0.6rem 0.24rem 0;
  max-width: 6.9rem;
  padding-bottom: 0.56rem;
  margin: 0.48rem auto 0.96rem;
  font-size: 0.21rem;
}

@media screen and (min-width: 769px) {
  .privacy_main_wrap {
    max-width: 10rem;
    font-size: 0.18rem;
    margin: 0.4rem auto 1.28rem;
  }
}

.privacy_main_wrap_head {
  margin-bottom: 0.24rem;
}

.privacy_main_wrap_title {
  margin-top: 0.24rem;
}

.privacy_main_wrap_content > li {
  margin-left: 0.16rem;
}

@media screen and (min-width: 769px) {
  .privacy_main_wrap_content > li {
    margin-left: 0.32rem;
  }
}

.privacy_link {
  color: #00a0e9;
  -webkit-text-decoration-color: #00a0e9;
          text-decoration-color: #00a0e9;
}

.privacy_date {
  text-align: right;
  margin-top: 0.24rem;
}
/*# sourceMappingURL=style.css.map */

/* ---------------
利用者情報の外部送信について
--------------- */


.userdata__title{
	margin-top: 20px;
	font-size: 32px;
	color: #fff;
	text-align: center;
}
.userdata__contents{
	margin-top: 20px;
	color: #fff;
	letter-spacing: 1px;
	padding: 0 20px 184px;
}
.userdata__itemTitle{
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.6;
}
.userdata__itemContents{
	margin-top: 5px;
	font-size: 16px;
	line-height: 1.6;
}
.userdata__itemList{
	padding-left: 1em;
}


.userdata__appName{
	margin-top: 30px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.8;
}
.userdata__wrap{
	margin-top: 10px;
	overflow-x: auto;
	height: 100%;
	overflow-y: hidden;
}
.userdata__table {
	text-align: left;
	position: relative;
	border-collapse: collapse;
	height: 100%;
	width: 100%;
	table-layout: fixed;
}

.userdata__row:nth-child(2n+1) {
	background: #FFF;
}
.userdata__row {
	color: #222;
	background: #F5F5F5;
	border-bottom: solid 1px #ddd;
}
.userdata__row--title {
	position:-webkit-sticky;
	position: sticky;
	top: 0;
	background: #A6A6A6;
}


.userdata__head {
	background: #A6A6A6;
	padding: 16px 0px 16px 32px;
	vertical-align: top;
}
.userdata__head:first-child {
	background: #A6A6A6;
	padding: 16px 0px 16px 24px;
	vertical-align: top;
}
.userdata__head:last-child {
	background: #A6A6A6;
	padding: 16px 24px 16px 32px;
	vertical-align: top;
}

.userdata__head:nth-of-type(1),
.userdata__head:nth-of-type(2),
.userdata__head:nth-of-type(3) {
	width: 140px;
	box-sizing: content-box;
}
.userdata__head:nth-of-type(4),
.userdata__head:nth-of-type(5){
	width: 320px;
	box-sizing: content-box;
}
.userdata__head:nth-of-type(6),
.userdata__head:nth-of-type(7),
.userdata__head:nth-of-type(8) {
	width: 160px;
	box-sizing: content-box;
}


.userdata__headText{
	color: #FFF;
	z-index: 10;
	white-space: nowrap;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0;
}
.userdata__headNote{
	color: #FFF;
	font-size: 10px;
	font-weight: 400;
	line-height: 1.8;
	display: block;
	white-space: nowrap;
	margin-top: 4px;
}


.userdata__date{
	font-size: 14px;
	line-height: 1.8;
	letter-spacing: 0;
	padding: 16px 0px 16px 32px;
	vertical-align: top;
}
.userdata__date:first-child {
	padding: 16px 0px 16px 24px;
}
.userdata__date:last-child {
	padding: 16px 24px 16px 32px;
}

.userdata__date:nth-child(1),
.userdata__date:nth-child(2),
.userdata__date:nth-child(3){
	width: 140px;
	box-sizing: content-box;
	/* display: block; */
}
.userdata__date:nth-child(4),
.userdata__date:nth-child(5){
	width: 320px;
	box-sizing: content-box;
	/* display: block; */
}
.userdata__date:nth-child(6),
.userdata__date:nth-child(7),
.userdata__date:nth-child(8){
	width: 160px;
	box-sizing: content-box;
	/* display: block; */
}

.userdata__date--indent{
	padding-left:0.5em;
	text-indent:-0.5em;
}
.userdata__date--blank{
	text-align: center;
}
.userdata__link{
	text-decoration: underline;
}
.userdata__attention{
	font-size: 16px;
	line-height: 1.8;
	margin-top: 50px;
}