@charset "UTF-8";

/*--------------------------------------------------------------------
=== [共通レイアウト] ====================================
 -------------------------------------------------------------------*/

body {
  font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN",
    "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo",
    "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  position: relative;
}
html {
  font-size: 62.5%;
}
a:hover {
  opacity: 0.7;
}
a:active {
  opacity: 0.7;
}
body {
  font-size: 1.6rem;
  line-height: 2;
  margin: 0;
  padding: 0;
  background-color: #525659;
}
.wrap {
  display: block;
  max-width: 750px;
  width: 100%;
  margin: 0 auto;
}
img {
  display: block;
  width: 100%;
}
.pc_only {
  display: block;
}
.sm_only {
  display: none!important;
}
.ibox-content {
  padding: 0!inherit;
}

/** オファーボタン
*************************************************/
.offer {
  position: relative;
}
.offer .offer_btn {
  position: absolute;
  bottom: 6%;
  left: 50%;
  transform: translateX(-50%);
  width: 92%;
}
.circle_btn {
  display: block;
  opacity: 0;
}
.circle_btn.none {
  display: none!important;
  opacity: 0;
  z-index: -1;
}

/** ボタンアニメーション
*************************************************/
.offer .offer_btn img {
  animation: anime01 1s ease 0s infinite alternate;
  transform-origin: center;
}
@keyframes anime01 {
  from {
    transform: scale(0.9, 0.9);
  }

  to {
    transform: scale(1, 1);
  }
}

/** modal関連
*************************************************/
#ukokkei-landing-page-form .leave-modal,
#ukokkei-landing-page-form .lp-modal {
    background-color: rgba(0,0,0,0.8)!important;
}

/** fixed_bnr
*************************************************/
.hd_active {
  display: block;
}
.none {
  display: none;
}


/** 動画コンテンツ
*************************************************/
.video_sec {
  position: relative;
}
.movie_con {
  position: absolute;
  top: 39.8%;
  left: 61.5%;
  transform: translateX(-50%);
  max-width: 516px;
  width: 70%;
}
.movie_item {
  position: absolute;
  bottom: 6%;
  left: 50%;
  transform: translateX(-50%);
  max-width: 698px;
  width: 94%;
}
.movie_con video {
  display: block;
  width: 100%;
}


/** gifコンテンツ
*************************************************/
.gif_sec {
  position: relative;
}
.gif_sec .gif_con {
  position: absolute;
  left: 50%;
  bottom: 8%;
  transform: translateX(-50%);
  width: 92%;
  box-shadow: 2px 2px 2px 2px rgb(51 51 51 / 10%);
}


/** form
*************************************************/
#ukokkei-landing-page-form .uk-password-revealing-handler {
  max-width: 14px!important;
  height: auto!important;
}
#ukokkei-landing-page-form .submit-button {
  -webkit-appearance: none;
  width: 90%!important;
  padding: 0!important;
  background-color: #ed5565!important;
  border: solid 1px #ed5565!important;
  font-size: 26px!important;
  font-weight: bold!important;
  letter-spacing: 1px!important;
  font-family: "Hiragino Kaku Gothic Pro",Meiryo,sans-serif!important;
}


/** 離脱防止モーダル
*************************************************/
#ukokkei-landing-page-form .leave-modal-header {
  display: none;
}
#ukokkei-landing-page-form .leave-modal img,
#ukokkei-landing-page-form .lp-modal img {
  padding: 0!important;
}
#ukokkei-landing-page-form .leave-modal-content {
  max-width: 580px;
}


/** 光るボタン
*************************************************/
#fixed_bnr {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 99;
  background: linear-gradient(90deg, rgba(4,22,37,1) 0%, rgba(27,77,149,1) 50%, rgba(4,22,37,1) 100%);
}
#fixed_bnr.hd_active {
  opacity: 1;
  display: block;
  -webkit-transition: 0.7s ease-in-out;
  -moz-transition: 0.7s ease-in-out;
  transition: 0.7s ease-in-out;
}
#fixed_bnr .cv_banner {
	position: relative;
  display: block;
  padding: 10px;
	text-decoration: none;
	overflow: hidden;
}
#fixed_bnr .cv_banner:hover {
		text-decoration: none;
		color: #fff;
}
#fixed_bnr .cv_banner::before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #ffffff8f;
    animation: cv_banner 3s ease-in-out infinite;
}
#fixed_bnr .cv_banner img {
}
@-webkit-keyframes cv_banner {
	0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
	80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
	81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
	100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}


/** footer
*************************************************/
footer {
  padding: 20px 0;
  background-color: #d9d9d9;
}
footer .footer_wrap {
  display: block;
  width: 94%;
  margin: 0 auto;
}
footer ul {
  display: flex;
  justify-content: center;
}
footer ul li {
  margin-right: 14px;
}
footer ul li:last-child {
  margin-right: 0;
}
footer ul li a {
  color: #3d3d3d;
  font-weight: bold;
  text-decoration: none;
}
footer p {
  font-size: 12px;
  text-align: center;
  line-height: 20px;
}

@media screen and (max-width: 750px) {
  /** 共通レイアウト
  *************************************************/
  .pc_only {
    display: none!important;
  }
  .sm_only {
    display: block!important;
  }

  /** footer
  *************************************************/
  footer ul {
    flex-wrap: wrap;
  }
  footer ul li {
    width: 100%;
    text-align: center;
    margin-right: 0;
  }
  footer ul li a {
    font-size: 16px;
  }
}


@media screen and (min-width: 750px) {
  #fixed_bnr {
    left: 72%;
  }
  #fixed_bnr {
    background: #fff0;
  }
}