@charset "UTF-8";
/*----------------------------------------
       Reset
----------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&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, a {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font-weight: 400;
  box-sizing: border-box;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

ul, li {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  text-decoration: none;
  outline: none; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

html {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch; }
  @media (max-width: 750px) {
    html {
      font-size: 1.3333333333vw; } }
  @media only screen and (min-width: 751px) {
    html {
      font-size: 0.6944444444vw; } }
  @media (min-width: 1440px) {
    html {
      font-size: 10px; } }

body {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  word-wrap: break-word;
  color: #4d4d4d;
  width: 100%;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch; }

img {
  width: 100%;
  line-height: 0;
  vertical-align: bottom; }

a {
  text-decoration: none;
  transition: all .2s ease-in-out; }

a:hover,
a:active {
  text-decoration: underline;
  text-decoration-thickness: 1px; }

a img {
  border: none; }

a.over:hover,
a:hover img,
input.over:hover {
  text-decoration: none;
  filter: opacity(70);
  -moz-opacity: .7;
  opacity: .7; }

@media only screen and (min-width: 420px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none; } }
sup {
  font-size: 70%;
  vertical-align: top; }

.only_sp {
  display: inherit; }
  @media only screen and (min-width: 751px) {
    .only_sp {
      display: none; } }

.only_pc {
  display: none; }
  @media only screen and (min-width: 751px) {
    .only_pc {
      display: inherit; } }

.regist {
  display: inline-block;
  transform: translateY(0.4em); }

/*******　ヘッダー　*******/
.header {
  z-index: 2000;
  position: relative;
  width: 100%; }
  @media only screen and (min-width: 751px) {
    .header {
      z-index: 2000;
      position: fixed;
      background-color: #fff;
      box-shadow: 0px 10px 10px -6px rgba(96, 116, 127, 0.3); } }

.header-inner {
  width: 100%;
  margin: 0 auto;
  padding-left: 3.4rem;
  padding-top: 2.5rem; }
  @media only screen and (min-width: 751px) {
    .header-inner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      max-width: 120rem;
      padding: 0.7rem 0 0 0; } }

.header-inner-logo {
  width: 18.6rem; }
  @media only screen and (min-width: 751px) {
    .header-inner-logo {
      width: 14rem;
      padding-bottom: 0.7rem; } }

.pc-header-inner-nav {
  display: none; }
  @media only screen and (min-width: 751px) {
    .pc-header-inner-nav {
      display: flex; } }
  .pc-header-inner-nav li {
    margin-left: 1rem; }
    .pc-header-inner-nav li a, .pc-header-inner-nav li span {
      position: relative;
      display: block;
      padding: 2.5rem 1.5rem 2.5rem 1rem;
      font-size: 1.6rem;
      color: #4d4d4d; }
      .pc-header-inner-nav li a:hover, .pc-header-inner-nav li span:hover {
        text-decoration: none;
        color: #4f87bf;
        cursor: pointer; }
    .pc-header-inner-nav li.pc-header-nav-cate1, .pc-header-inner-nav li.pc-header-nav-cate2 {
      margin-right: 1rem; }
    .pc-header-inner-nav li.pc-header-nav-cate1 span::after, .pc-header-inner-nav li.pc-header-nav-cate2 span::after {
      position: absolute;
      right: 0;
      top: 0;
      content: "";
      display: block;
      width: 2rem;
      height: 100%;
      background-image: url("../img/pc_nav_arrow_off.svg");
      background-size: 1rem auto;
      background-position: right center;
      background-repeat: no-repeat; }
    .pc-header-inner-nav li.pc-header-nav-cate1 span:hover::after, .pc-header-inner-nav li.pc-header-nav-cate2 span:hover::after {
      background-image: url("../img/pc_nav_arrow_on.svg"); }
    .pc-header-inner-nav li.pc-header-nav-cate1 span::before, .pc-header-inner-nav li.pc-header-nav-cate2 span::before {
      position: absolute;
      left: 0;
      bottom: 0;
      content: "";
      display: block;
      width: 0%;
      height: 0.62rem;
      border-radius: 0.3rem;
      background-color: #4f87bf;
      transition: all 0.3s ease; }
    .pc-header-inner-nav li.pc-header-nav-cate1 span:hover::before, .pc-header-inner-nav li.pc-header-nav-cate2 span:hover::before {
      width: 100%; }
    .pc-header-inner-nav li.pc-header-nav-cate1.active span, .pc-header-inner-nav li.pc-header-nav-cate2.active span {
      color: #4f87bf; }
    .pc-header-inner-nav li.pc-header-nav-cate1.active span::after, .pc-header-inner-nav li.pc-header-nav-cate2.active span::after {
      background-image: url("../img/pc_nav_arrow_on.svg"); }
    .pc-header-inner-nav li.pc-header-nav-cate1.active span::before, .pc-header-inner-nav li.pc-header-nav-cate2.active span::before {
      width: 100%; }
    .pc-header-inner-nav li.pc-header-nav-cont {
      margin-left: 2rem;
      margin-top: 0.5rem; }
      .pc-header-inner-nav li.pc-header-nav-cont a {
        padding: 1.75rem 2.5rem 1.75rem 2.5rem;
        background-color: #4f87bf;
        color: #fff;
        border-radius: 2.5rem; }
        .pc-header-inner-nav li.pc-header-nav-cont a:hover {
          background-color: #ef7d16; }

/*******　フッター　*******/
.ptop {
  position: relative;
  margin-top: -0.5rem;
  width: 100%;
  height: 16rem;
  background-color: #fff;
  padding-top: 5rem; }
  @media only screen and (min-width: 751px) {
    .ptop {
      margin-top: -0.25rem;
      height: 15.2rem; } }

.ptop-btn {
  width: 3.4rem;
  margin: 0 auto; }
  @media only screen and (min-width: 751px) {
    .ptop-btn {
      width: 3.5rem; } }

/*******　フッターお問い合わせ　*******/
.footer-contact {
  width: 100%;
  background-color: #ecf1f1;
  background-image: url("../img/ft_contact_image.svg");
  background-size: 73.3rem auto;
  background-position: bottom -1rem center;
  background-repeat: no-repeat; }
  @media only screen and (min-width: 751px) {
    .footer-contact {
      background-size: 139.8rem auto; } }

.footer-contact-inner {
  width: 100%;
  margin: 0 auto;
  padding: 8rem 0 19.6rem; }
  @media only screen and (min-width: 751px) {
    .footer-contact-inner {
      width: 120rem;
      padding: 7.3rem 0 36rem; } }

.footer-contact-title {
  width: 32.9rem;
  margin: 0 auto; }
  @media only screen and (min-width: 751px) {
    .footer-contact-title {
      width: 33.6rem; } }

.footer-contact-lead {
  text-align: center;
  font-size: 2.5rem;
  margin: 3.8rem auto 0; }
  @media only screen and (min-width: 751px) {
    .footer-contact-lead {
      font-size: 2.2rem; } }

.footer-contact-telno {
  width: 55.3rem;
  margin: 3.6rem auto 0; }
  @media only screen and (min-width: 751px) {
    .footer-contact-telno {
      width: 55.6rem; } }

.footer-contact-note {
  text-align: center;
  font-size: 2.4rem;
  margin: 3.9rem auto 0; }
  @media only screen and (min-width: 751px) {
    .footer-contact-note {
      font-size: 1.6rem;
      margin: 2.6rem auto 0; } }

.footer-contact-link {
  width: 51.4rem;
  margin: 4.6rem auto 0; }
  @media only screen and (min-width: 751px) {
    .footer-contact-link {
      display: flex;
      justify-content: space-between;
      width: 93.7rem;
      margin: 5.5rem auto 0; } }
  .footer-contact-link li {
    border-top: 1px solid #989898;
    border-bottom: 1px solid #989898; }
    @media only screen and (min-width: 751px) {
      .footer-contact-link li {
        width: 42.7rem; } }
    .footer-contact-link li a {
      display: block;
      padding: 3.9rem 0 3.7rem 1rem;
      font-size: 2.8rem;
      font-weight: 600;
      color: #4d4d4d;
      background-image: url("../img/arrow_white.svg");
      background-size: 5.7rem auto;
      background-position: right center;
      background-repeat: no-repeat; }
      @media only screen and (min-width: 751px) {
        .footer-contact-link li a {
          padding: 3.3rem 0 3.4rem 1rem;
          font-size: 2.2rem;
          background-size: 4.6rem auto; } }
      @media only screen and (min-width: 751px) {
        .footer-contact-link li a:hover {
          text-decoration: none;
          color: #ef7d16; } }
    .footer-contact-link li:first-child {
      border-bottom: none; }
      @media only screen and (min-width: 751px) {
        .footer-contact-link li:first-child {
          border-bottom: 1px solid #989898; } }

/*******　フッターリンク　*******/
.footer-link {
  width: 100%;
  padding: 7.4rem 0 78rem;
  background-color: #4f87bf; }
  @media only screen and (min-width: 751px) {
    .footer-link {
      padding: 5rem 0 2.5rem; } }

.footer-link-wrap {
  position: relative;
  width: 69rem;
  margin: 0 auto; }
  @media only screen and (min-width: 751px) {
    .footer-link-wrap {
      width: 120rem; } }

.footer-link-bottle {
  position: absolute;
  top: -11rem;
  right: 2.8rem;
  width: 8.6rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-bottle {
      top: -14.5rem;
      right: -7.5rem;
      width: 14.9rem; } }

.footer-link-blk01 {
  width: 33.8rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-blk01 {
      width: 30rem;
      height: 40rem;
      border-right: 1px solid #fff;
      padding: 0.5rem 0; } }

.footer-link-corpname {
  width: 30.5rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-corpname {
      width: 27.2rem; } }

.footer-link-address {
  font-size: 2.2rem;
  margin: 1.6rem auto 0 0;
  color: #fff; }
  @media only screen and (min-width: 751px) {
    .footer-link-address {
      font-size: 1.5rem;
      margin: 2.6rem auto 0 0; } }

.footer-link-qualif {
  width: 33.0rem;
  margin: 2.8rem auto 0 0; }
  @media only screen and (min-width: 751px) {
    .footer-link-qualif {
      width: 23.2rem;
      margin: 5.9rem auto 0 0; } }

.footer-link-blk02 {
  position: relative;
  margin: 5.3rem auto 0; }
  @media only screen and (min-width: 751px) {
    .footer-link-blk02 {
      position: absolute;
      top: 0;
      left: 33rem;
      width: 69.6rem;
      margin: 0; } }

.footer-link-cont-01 {
  position: absolute;
  top: 0;
  left: 0;
  width: 30rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-01 {
      top: 0.7rem;
      left: 0;
      width: 20rem; } }

.footer-link-cate {
  font-size: 3rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cate {
      font-size: 2.2rem; } }
  .footer-link-cate a {
    color: #fff; }
    .footer-link-cate a:hover {
      text-decoration: none;
      color: #ef7d16; }

.footer-link-cont-02 {
  position: absolute;
  top: 0;
  left: 34.5rem;
  width: 34.5rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-02 {
      top: 0.7rem;
      left: 22rem;
      width: 26rem; } }

.footer-link-sub {
  margin: 2.5rem auto 0 3.2rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-sub {
      margin: 1.7rem auto 0 2rem; } }

.footer-link-sub li {
  font-size: 2.2rem;
  line-height: 1.2;
  list-style: disc;
  color: #FFF; }
  @media only screen and (min-width: 751px) {
    .footer-link-sub li {
      font-size: 1.6rem;
      line-height: 1.5; } }
  .footer-link-sub li a {
    color: #fff; }
    .footer-link-sub li a:hover {
      text-decoration: none;
      color: #ef7d16; }
    .footer-link-sub li a span {
      display: inline-block;
      transform: translateY(0.4em); }

.footer-link-sub li + li {
  margin-top: 1rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-sub li + li {
      margin-top: 0.8rem; } }

.footer-link-cont-03 {
  position: absolute;
  top: 49rem;
  left: 0;
  width: 35.2rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-03 {
      top: 0;
      left: 52rem;
      width: 24.5rem; } }

.footer-link-cont-04 {
  position: absolute;
  top: 56rem;
  left: 0;
  width: 35.2rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-04 {
      top: 5.5rem;
      left: 52rem;
      width: 22.5rem; } }

.footer-link-cont-05 {
  position: absolute;
  top: 63rem;
  left: 0;
  width: 35.2rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-05 {
      top: 11rem;
      left: 52rem;
      width: 22.5rem; } }

.footer-link-cont-sub {
  position: absolute;
  top: 58rem;
  left: 35.5rem;
  width: 35.2rem; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-sub {
      top: 32rem;
      left: 52rem;
      width: 26.5rem; } }

.footer-link-cont-sub p {
  font-size: 2.2rem;
  line-height: 2; }
  @media only screen and (min-width: 751px) {
    .footer-link-cont-sub p {
      font-size: 1.5rem;
      line-height: 1;
      margin-top: 1.5rem; } }
  .footer-link-cont-sub p a {
    color: #fff; }
    .footer-link-cont-sub p a:hover {
      text-decoration: none;
      color: #ef7d16; }

.footer-copy {
  width: 100%;
  padding: 1.6rem 0;
  background-color: #4d4d4d; }
  .footer-copy p {
    text-align: center;
    font-size: 1.4rem;
    color: #fff; }

/*******　ナビゲーションメニューPC用　*******/
.pc-header-nav {
  position: fixed;
  z-index: 3000;
  top: 8.1rem;
  background-color: aqua;
  width: 120rem;
  left: 50%;
  transform: translateX(-50%); }

.pc-header-subnav01,
.pc-header-subnav02 {
  display: none;
  position: absolute;
  top: 0;
  font-size: 1.6rem;
  background-color: #fff;
  border-radius: 1rem;
  padding: 2.4rem 2rem 1.75rem;
  box-shadow: 0px 5px 15px 0px rgba(96, 116, 127, 0.3); }
  .pc-header-subnav01.active,
  .pc-header-subnav02.active {
    display: block;
    animation: headerfadeIn 0.5s ease-in forwards; }
  .pc-header-subnav01 li a,
  .pc-header-subnav02 li a {
    display: block;
    color: #4d4d4d;
    padding: 0.5rem 0 1rem; }
    .pc-header-subnav01 li a:hover,
    .pc-header-subnav02 li a:hover {
      color: #4f87bf;
      text-decoration: none; }
  .pc-header-subnav01 li span,
  .pc-header-subnav02 li span {
    display: inline-block;
    transform: translateY(0.4em); }

.pc-header-subnav01 {
  left: 45rem; }

.pc-header-subnav02 {
  left: 62.5rem; }

/*******　ナビゲーションメニュースマホ用　*******/
.sp-header-nav-btn {
  z-index: 3000;
  position: fixed;
  top: 3.2rem;
  right: 1.8rem;
  width: 8.5rem;
  height: 8.5rem;
  background-image: url("../img/menu_btn.svg");
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: top center; }
  .sp-header-nav-btn.active {
    background-position: bottom center; }
  @media only screen and (min-width: 751px) {
    .sp-header-nav-btn {
      display: none; } }

.sp-header-nav {
  display: none;
  z-index: 2000;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  height: 100%; }
  .sp-header-nav.active {
    display: block;
    animation: headerfadeIn 0.5s ease-in forwards; }
    @media only screen and (min-width: 751px) {
      .sp-header-nav.active {
        display: none; } }
  @media only screen and (min-width: 751px) {
    .sp-header-nav {
      display: none; } }

@keyframes headerfadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
.sp-header-nav-cont {
  position: relative;
  width: 100%;
  height: 94vh;
  margin: 0 auto;
  padding-left: 3.4rem;
  overflow-y: scroll; }

.sp-header-nav-logo {
  position: absolute;
  top: 2.5rem;
  width: 18.6rem; }

.sp-header-nav-cont-01 {
  margin-top: 20.6rem; }

.sp-header-nav-cont-01,
.sp-header-nav-cont-02,
.sp-header-nav-cont-03,
.sp-header-nav-cont-04,
.sp-header-nav-cont-05 {
  width: 62.6rem; }
  .sp-header-nav-cont-01 a,
  .sp-header-nav-cont-02 a,
  .sp-header-nav-cont-03 a,
  .sp-header-nav-cont-04 a,
  .sp-header-nav-cont-05 a {
    display: block;
    color: #4f87bf; }
    .sp-header-nav-cont-01 a:hover,
    .sp-header-nav-cont-02 a:hover,
    .sp-header-nav-cont-03 a:hover,
    .sp-header-nav-cont-04 a:hover,
    .sp-header-nav-cont-05 a:hover {
      text-decoration: none;
      color: #ef7d16; }

.sp-header-nav-cont-01.active,
.sp-header-nav-cont-02.active {
  border-bottom: 1px solid #4f87bf; }

.sp-header-nav-cont-sub {
  display: flex;
  justify-content: center;
  width: 62.6rem;
  font-size: 2.8rem;
  line-height: 2; }
  .sp-header-nav-cont-sub p {
    margin: 7.7rem 3.2rem; }
  .sp-header-nav-cont-sub a {
    display: block;
    color: #4f87bf; }
    .sp-header-nav-cont-sub a:hover {
      text-decoration: none;
      color: #ef7d16; }

.sp-header-nav-cate {
  font-size: 3.4rem;
  font-weight: 500;
  border-bottom: 1px solid #4f87bf; }
  .sp-header-nav-cate a {
    padding: 3.2rem 1rem; }
    .sp-header-nav-cate a:hover {
      text-decoration: none;
      color: #ef7d16; }

.sp-header-nav-cont-01 .sp-header-nav-cate,
.sp-header-nav-cont-02 .sp-header-nav-cate {
  position: relative;
  background-image: url("../img/menu_sub_plus_btn.svg");
  background-size: 4.7rem auto;
  background-repeat: no-repeat;
  background-position: center right; }
  .sp-header-nav-cont-01 .sp-header-nav-cate.active,
  .sp-header-nav-cont-02 .sp-header-nav-cate.active {
    background-image: url("../img/menu_sub_minus_btn.svg"); }
  .sp-header-nav-cont-01 .sp-header-nav-cate a,
  .sp-header-nav-cont-02 .sp-header-nav-cate a {
    pointer-events: none; }
  .sp-header-nav-cont-01 .sp-header-nav-cate span,
  .sp-header-nav-cont-02 .sp-header-nav-cate span {
    position: absolute;
    display: block;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: aqua; }

.sp-header-nav-sub {
  display: none;
  width: 100%;
  margin: 3.3rem 0 0;
  padding: 0 1rem 3rem 1rem; }
  .sp-header-nav-sub.active {
    display: block; }
  .sp-header-nav-sub li {
    font-size: 2.8rem;
    line-height: 2; }
  .sp-header-nav-sub a span {
    display: inline-block;
    transform: translateY(0.4em); }

/*セカンドページ　キービジュアル*/
.keyvisual {
  width: 100%;
  height: 40rem;
  margin-top: -15rem; }
  @media only screen and (min-width: 751px) {
    .keyvisual {
      height: 40rem;
      margin-top: 0; } }

.keyvisual-inner {
  position: relative;
  width: 69rem;
  margin: 0 auto;
  transform: translateY(-2.5rem); }
  @media only screen and (min-width: 751px) {
    .keyvisual-inner {
      width: 120rem; } }

.keyvisual-title {
  position: absolute;
  top: 22rem;
  left: 1rem;
  width: 24.1rem; }
  @media only screen and (min-width: 751px) {
    .keyvisual-title {
      top: 20rem;
      left: 4.5rem;
      width: 25rem; } }

/*波*/
.wave-sp,
.wave-pc {
  width: 100%;
  background-color: transparent; }

.wave-sp {
  transform: translateY(-5rem); }

.wave-pc {
  transform: translateY(-8rem);
  max-height: 180px; }

/*コンテンツ*/
.contents {
  position: relative;
  padding-bottom: 20rem;
  background-color: #ebf4fa;
  margin-top: -14rem;
  background-image: url("../img/cont_bk_ft_sp.svg");
  background-size: 100% auto;
  background-position: bottom center;
  background-repeat: no-repeat; }

/*******　見出し　*******/
/*******　テキスト　*******/
.lead-copy {
  width: 100%;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 2; }
  @media only screen and (min-width: 751px) {
    .lead-copy {
      width: 120rem;
      margin: 0 auto;
      font-size: 2.4rem; } }

/*******　ボタン　*******/
.linkbutton-blue {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  height: 7.2rem;
  padding: 0 4rem 0 2rem;
  border-radius: 3.5rem;
  background-color: #4f87bf;
  background-image: url("../img/arrow_white.svg");
  background-size: 4.3rem auto;
  background-position: right 2rem center;
  background-repeat: no-repeat; }
  @media only screen and (min-width: 751px) {
    .linkbutton-blue {
      border-radius: 3.5rem;
      background-size: 3.5rem auto;
      background-position: right 1.5rem center; } }
  .linkbutton-blue.size-l {
    font-size: 2.7rem;
    width: 50rem;
    height: 8rem;
    border-radius: 4rem;
    background-size: 4.6rem auto; }
    @media only screen and (min-width: 751px) {
      .linkbutton-blue.size-l {
        width: 48.8rem;
        height: 8.8rem;
        border-radius: 4.4rem;
        background-size: 5rem auto; } }
  .linkbutton-blue.size-m {
    width: 40rem;
    height: 7.2rem;
    border-radius: 3.5rem;
    background-size: 4.3rem auto; }
    @media only screen and (min-width: 751px) {
      .linkbutton-blue.size-m {
        width: 33rem;
        border-radius: 3.5rem;
        background-size: 3.5rem auto;
        background-position: right 1.5rem center; } }
  .linkbutton-blue.size-s {
    width: 32.3rem;
    padding-right: 2.5em; }
    @media only screen and (min-width: 751px) {
      .linkbutton-blue.size-s {
        width: 21.5rem;
        height: 5rem;
        font-size: 1.5rem;
        border-radius: 4rem;
        background-size: 2.9rem auto;
        background-position: right 1.4rem center; } }
  .linkbutton-blue.separate-button {
    background-image: url("../img/sep_btn_icon.svg");
    width: 100%; }
  .linkbutton-blue:hover {
    color: #fff;
    text-decoration: none;
    opacity: 0.8; }

.linkbutton-white {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  font-weight: 600;
  color: #4d4d4d;
  padding: 0 3rem 0 0;
  height: 7.2rem;
  border: 0.2rem solid #4f87bf;
  border-radius: 3.5rem;
  background-color: #fff;
  background-image: url("../img/arrow_blue.svg");
  background-size: 4.3rem auto;
  background-position: right 2rem center;
  background-repeat: no-repeat; }
  @media only screen and (min-width: 751px) {
    .linkbutton-white {
      font-size: 2.4rem;
      padding: 0 4rem 0 2rem;
      border-radius: 3.5rem;
      background-size: 3.5rem auto;
      background-position: right 1.5rem center; } }
  .linkbutton-white:hover {
    text-decoration: none;
    opacity: 0.8; }

.plink-button-blue {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.4rem;
  font-weight: 600;
  color: #4d4d4d;
  text-decoration: none;
  width: 28.2rem;
  height: 6.2rem;
  border-radius: 3rem;
  background-color: #fff;
  filter: drop-shadow(0px 0px 2px rgba(29, 43, 57, 0.4)); }
  .plink-button-blue span::after {
    display: inline-block;
    content: url("../img/plink_arrow.svg");
    width: 1.8rem;
    padding-left: 0.5em; }
  @media only screen and (min-width: 751px) {
    .plink-button-blue {
      width: 28.3rem;
      height: 6rem;
      border-radius: 3rem;
      font-size: 1.8rem; } }
  .plink-button-blue:hover {
    text-decoration: none;
    color: #ef7d16; }

.movie-button {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  width: 45rem;
  height: 8rem;
  border-radius: 4rem;
  background-color: #4f87bf;
  background-image: url("../img/mv_btn_icon.svg");
  background-size: 4.6rem auto;
  background-position: right 2rem center;
  background-repeat: no-repeat;
  cursor: pointer; }
  @media only screen and (min-width: 751px) {
    .movie-button {
      width: 48.8rem;
      height: 8.8rem;
      border-radius: 4.4rem;
      background-size: 5rem auto;
      background-position: right 2rem center;
      font-size: 2.7rem; } }
  .movie-button:hover {
    color: #fff;
    text-decoration: none;
    opacity: 0.8; }

.link-arrow-blue {
  display: block;
  font-size: 2.8rem;
  font-weight: 600;
  text-decoration: none;
  color: #4f87bf;
  padding: 2rem 7rem 2rem 0;
  background-image: url("../img/arrow_blue.svg");
  background-size: 4.6rem auto;
  background-position: right 1.4rem center;
  background-repeat: no-repeat; }
  @media only screen and (min-width: 751px) {
    .link-arrow-blue {
      font-size: 2.2rem;
      padding: 2rem 7rem 2rem 0;
      background-size: 4rem auto; } }

.comingsoon-buttun {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  width: 100%;
  height: 8rem;
  border-radius: 4rem;
  background-color: #989898; }
  @media only screen and (min-width: 751px) {
    .comingsoon-buttun {
      height: 8.8rem;
      border-radius: 4.4rem;
      font-size: 2.7rem; } }

/*******　表組　*******/
/*******　モーダル　*******/
.modal-open {
  cursor: pointer; }

/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgba(0, 0, 0, 0.5);
  padding: 40px 20px;
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
  box-sizing: border-box; }

/*モーダル本体の擬似要素の指定*/
.modal-container:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%; }

/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active {
  opacity: 1;
  visibility: visible; }

/*モーダル枠の指定*/
.modal-body {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 90rem;
  width: 90%; }

/*モーダルを閉じるボタンの指定*/
.modal-close {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -4rem;
  right: -4rem;
  width: 4rem;
  height: 4rem;
  font-size: 4rem;
  color: #fff;
  cursor: pointer; }

/*モーダル内のコンテンツの指定*/
.modal-content {
  background: #fff;
  text-align: left;
  padding: 3rem; }

/*******　カルーセル　オプション　*******/
.case-list-carousel .slick-list, .future-list-carousel .slick-list, .vcap-list-carousel .slick-list {
  padding-top: 1rem; }
.case-list-carousel .slick-prev,
.case-list-carousel .slick-next, .future-list-carousel .slick-prev,
.future-list-carousel .slick-next, .vcap-list-carousel .slick-prev,
.vcap-list-carousel .slick-next {
  width: 4.6rem;
  height: 4.6rem;
  padding: 0;
  top: 50%;
  position: absolute;
  z-index: 999;
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  text-indent: -9999px; }
.case-list-carousel .slick-prev, .future-list-carousel .slick-prev, .vcap-list-carousel .slick-prev {
  background: url("/assets/img/cal_arrow_l.svg") no-repeat;
  background-size: contain !important;
  left: 6rem; }
  @media only screen and (min-width: 751px) {
    .case-list-carousel .slick-prev, .future-list-carousel .slick-prev, .vcap-list-carousel .slick-prev {
      left: -4.5rem; } }
  .case-list-carousel .slick-prev:hover, .future-list-carousel .slick-prev:hover, .vcap-list-carousel .slick-prev:hover {
    background: url("/assets/img/cal_arrow_l.svg") no-repeat;
    background-size: contain !important; }
.case-list-carousel .slick-next, .future-list-carousel .slick-next, .vcap-list-carousel .slick-next {
  background: url("/assets/img/cal_arrow_r.svg") no-repeat;
  background-size: contain !important;
  right: 6rem; }
  @media only screen and (min-width: 751px) {
    .case-list-carousel .slick-next, .future-list-carousel .slick-next, .vcap-list-carousel .slick-next {
      right: -4.5rem; } }
  .case-list-carousel .slick-next:hover, .future-list-carousel .slick-next:hover, .vcap-list-carousel .slick-next:hover {
    background: url("/assets/img/cal_arrow_r.svg") no-repeat;
    background-size: contain !important; }

.future-list-carousel .slick-list {
  padding-top: 2rem !important; }
.future-list-carousel .slick-prev {
  left: 3.5rem; }
  @media only screen and (min-width: 751px) {
    .future-list-carousel .slick-prev {
      left: -1rem; } }
.future-list-carousel .slick-next {
  right: 3.5rem; }
  @media only screen and (min-width: 751px) {
    .future-list-carousel .slick-next {
      right: -1rem; } }

.vcap-list-carousel .slick-list {
  padding-top: 2rem !important; }
.vcap-list-carousel .slick-prev {
  left: 1.5rem; }
  @media only screen and (min-width: 751px) {
    .vcap-list-carousel .slick-prev {
      left: -1rem; } }
.vcap-list-carousel .slick-next {
  right: 1.5rem; }
  @media only screen and (min-width: 751px) {
    .vcap-list-carousel .slick-next {
      right: -1rem; } }
