@charset "UTF-8";
html.video {
  border: none;
}

body {
  max-width: none !important;
  min-width: 0 !important;
}

@media print, screen and (min-width: 768px) {
  .pjax-area {
    padding-top: 81px;
  }
}
@media print, screen and (max-width: 767px) {
  .pjax-area {
    padding-top: 0;
  }
}
.pjax-area {
  font-size: 1.4rem;
}

img {
  width: 100%;
}

.contents-wrapper[data-layout="1"] {
  max-width: initial;
  padding: 0;
}
.contents-wrapper[data-layout="1"] > div > div > div > div {
  padding: 0;
}
.contents-wrapper[data-layout="1"] main {
  padding: 0;
}

.footer-pagetop {
  display: none;
}

#lp-container {
  /* http://meyerweb.com/eric/tools/css/reset/
     v2.0 | 20110126
     License: none (public domain)
  */
  /* HTML5 display-role reset for older browsers */
  /**
   * メディアクエリ
   * @param {string} $mode - max または min
   * @param {number} $width - 設定値
   */
  /**
   * メディアクエリ PC
   * @param {number} [$width:$breakpoin] - 設定値
   */
  /**
   * メディアクエリ SP
   * @param {number} [$width:$breakpoin] - 設定値
   */
  /**
   * メディアクエリによるIE11ハック
   */
  /**
   * VW計算
   * @param {string} $property  - プロパティ
   * @param {number} $value - 基準となる値
   * @param {number} $basewidth - 基準となるウィンドウ幅
   * @param {number} [$maxwidth:0] - 拡大を停止するウィンドウ幅
   * @param {number} [$minwidth:0] - 縮小を停止するウィンドウ幅
   */
  /**
   * メディアクエリ
   * @param {string} $mode - max または min
   * @param {number} $width - 設定値
   */
  /**
   * メディアクエリ PC
   * @param {number} [$width:$breakpoin] - 設定値
   */
  /**
   * メディアクエリ SP
   * @param {number} [$width:$breakpoin] - 設定値
   */
  /**
   * メディアクエリによるIE11ハック
   */
  /**
   * VW計算
   * @param {string} $property  - プロパティ
   * @param {number} $value - 基準となる値
   * @param {number} $basewidth - 基準となるウィンドウ幅
   * @param {number} [$maxwidth:0] - 拡大を停止するウィンドウ幅
   * @param {number} [$minwidth:0] - 縮小を停止するウィンドウ幅
   */
  overflow: hidden;
  position: relative;
  font-weight: 500;
  line-height: 1.375;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Noto Sans JP", sans-serif;
}
#lp-container html, #lp-container body, #lp-container div, #lp-container span, #lp-container applet, #lp-container object, #lp-container iframe,
#lp-container h1, #lp-container h2, #lp-container h3, #lp-container h4, #lp-container h5, #lp-container h6, #lp-container p, #lp-container blockquote, #lp-container pre,
#lp-container a, #lp-container abbr, #lp-container acronym, #lp-container address, #lp-container big, #lp-container cite, #lp-container code,
#lp-container del, #lp-container dfn, #lp-container em, #lp-container img, #lp-container ins, #lp-container kbd, #lp-container q, #lp-container s, #lp-container samp,
#lp-container small, #lp-container strike, #lp-container strong, #lp-container sub, #lp-container sup, #lp-container tt, #lp-container var,
#lp-container b, #lp-container u, #lp-container i, #lp-container center,
#lp-container dl, #lp-container dt, #lp-container dd, #lp-container ol, #lp-container ul, #lp-container li,
#lp-container fieldset, #lp-container form, #lp-container label, #lp-container legend,
#lp-container table, #lp-container caption, #lp-container tbody, #lp-container tfoot, #lp-container thead, #lp-container tr, #lp-container th, #lp-container td,
#lp-container article, #lp-container aside, #lp-container canvas, #lp-container details, #lp-container embed,
#lp-container figure, #lp-container figcaption, #lp-container footer, #lp-container header, #lp-container hgroup,
#lp-container menu, #lp-container nav, #lp-container output, #lp-container ruby, #lp-container section, #lp-container summary,
#lp-container time, #lp-container mark, #lp-container audio, #lp-container video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
#lp-container article, #lp-container aside, #lp-container details, #lp-container figcaption, #lp-container figure,
#lp-container footer, #lp-container header, #lp-container hgroup, #lp-container menu, #lp-container nav, #lp-container section {
  display: block;
}
#lp-container body {
  line-height: 1;
}
#lp-container ol, #lp-container ul {
  list-style: none;
}
#lp-container blockquote, #lp-container q {
  quotes: none;
}
#lp-container blockquote:before, #lp-container blockquote:after,
#lp-container q:before, #lp-container q:after {
  content: "";
  content: none;
}
#lp-container table {
  border-collapse: collapse;
  border-spacing: 0;
}
#lp-container input, #lp-container button, #lp-container textarea, #lp-container select, #lp-container option {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font: inherit;
}
#lp-container input::-ms-clear {
  display: none;
}
#lp-container input::-ms-reveal {
  display: none;
}
#lp-container body {
  min-width: 320px;
  color: #000;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  line-height: 1;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
#lp-container a {
  color: inherit;
  text-decoration: none;
}
#lp-container img {
  display: block;
  max-width: 100%;
}
#lp-container picture {
  display: block;
}
@media screen and (max-width: 767px) {
  #lp-container .pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  #lp-container .sp {
    display: none !important;
  }
}
#lp-container .kv-block img,
#lp-container .menu-img01 img,
#lp-container .promo-top img,
#lp-container .banner-contents img {
  pointer-events: none;
}
#lp-container .btn-somen {
  border: 1px solid #00a8c4;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  background-color: white;
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  #lp-container .btn-somen {
    transition: ease 0.5s;
    margin-top: 2.2142857143vw;
    width: 28.2142857143vw;
    height: 4.2857142857vw;
    border-radius: 2.5vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .btn-somen {
    margin-top: 31px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .btn-somen {
    width: 395px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .btn-somen {
    height: 60px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .btn-somen {
    border-radius: 35px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .btn-somen {
    width: 61.71875vw;
    height: 9.375vw;
    border-radius: 5.46875vw;
    margin-top: 4.6875vw;
  }
}
#lp-container .btn-somen p {
  color: #00a8c4;
}
@media screen and (min-width: 768px) {
  #lp-container .btn-somen p {
    transition: ease 0.5s;
    font-size: 1.6428571429vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .btn-somen p {
    font-size: 23px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .btn-somen p {
    font-size: 3.59375vw;
  }
}
#lp-container .btn-somen:hover {
  background-color: #00a8c4;
}
#lp-container .btn-somen:hover p {
  color: white;
}
#lp-container .pc-br {
  display: block;
}
@media screen and (max-width: 767px) {
  #lp-container .pc-br {
    display: none;
  }
}
#lp-container .sp-br {
  display: none;
}
@media screen and (max-width: 767px) {
  #lp-container .sp-br {
    display: block;
  }
}
#lp-container a:focus {
  outline: none !important;
}
#lp-container p,
#lp-container h3 {
  color: #3E350D;
}
@media screen and (max-width: 767px) {
  #lp-container .no-wrap {
    white-space: nowrap;
  }
}
#lp-container *:hover {
  text-decoration: none;
}
#lp-container .kv-container {
  width: 100%;
  margin-inline: auto;
  height: auto;
}
#lp-container .kv-container .kv-block img {
  display: block;
  width: 100%;
}
#lp-container .top-btn {
  position: fixed;
  right: 2.1428571429vw;
  bottom: 2.1428571429vw;
  width: 5.7142857143vw;
  z-index: 12;
  opacity: 0;
  transition: 0.3s ease;
}
@media screen and (min-width: 1400px) {
  #lp-container .top-btn {
    right: 30px;
  }
}
@media screen and (min-width: 1400px) {
  #lp-container .top-btn {
    bottom: 30px;
  }
}
@media screen and (min-width: 1400px) {
  #lp-container .top-btn {
    width: 80px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .top-btn {
    width: 12.5vw;
    right: 3.125vw;
    bottom: 12.5vw;
  }
}
#lp-container .top-btn.is-show {
  opacity: 1;
}
#lp-container .main-container .blue-content {
  background: url(../img/bg-img.webp);
  background-position: center;
  background-size: cover;
  background-repeat: repeat;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .blue-content {
    padding-bottom: 5.7142857143vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-content {
    padding-bottom: 80px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .blue-content {
    padding-top: 7.5vw;
    padding-bottom: 7.5vw;
  }
}
#lp-container .main-container .middle-img {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .middle-img {
    width: 68.5714285714vw;
    padding-top: 3.2142857143vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .middle-img {
    width: 960px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .middle-img {
    padding-top: 45px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .middle-img {
    width: 90.625vw;
  }
}
#lp-container .main-container .video-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .video-title {
    width: 49.7857142857vw;
    margin-top: 7.3571428571vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .video-title {
    width: 697px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .video-title {
    margin-top: 103px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .video-title {
    width: 92.03125vw;
    margin-top: 10.46875vw;
  }
}
#lp-container .main-container .video-img {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .video-img {
    margin-top: 3.9285714286vw;
    width: 45.7142857143vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .video-img {
    margin-top: 55px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .video-img {
    width: 640px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .video-img {
    width: 100vw;
    margin-top: 5.9375vw;
  }
}
#lp-container .main-container .video-subtitle {
  text-align: center;
  color: #fff;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .video-subtitle {
    margin-top: 1.4285714286vw;
    font-size: 2.1428571429vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .video-subtitle {
    margin-top: 20px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .video-subtitle {
    font-size: 30px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .video-subtitle {
    margin-top: 2.8125vw;
    font-size: 4.0625vw;
  }
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .white-content {
    padding-top: 5.4285714286vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .white-content {
    padding-top: 76px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .white-content {
    padding-top: 3.28125vw;
    padding-bottom: 6.25vw;
  }
}
#lp-container .main-container .product-title {
  margin-left: auto;
  margin-right: auto;
  font-weight: bold;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-title {
    width: 52.2142857143vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-title {
    width: 731px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-title {
    width: 77.34375vw;
  }
}
#lp-container .main-container .product-list {
  display: flex;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-list {
    align-items: center;
    justify-content: center;
    margin-top: 4.7142857143vw;
    gap: 8.7857142857vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-list {
    margin-top: 66px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-list {
    gap: 123px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-list {
    flex-direction: column;
    gap: 11.25vw;
  }
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-item {
    width: 37.6428571429vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item {
    width: 527px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-item {
    width: 84.84375vw;
    margin-left: auto;
    margin-right: auto;
  }
}
#lp-container .main-container .product-item img {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-item img {
    width: 18.8571428571vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item img {
    width: 264px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-item img {
    width: 41.25vw;
    margin-top: 6.25vw;
  }
  #lp-container .main-container .product-item img.mt0 {
    margin-top: 0 !important;
  }
}
#lp-container .main-container .product-item .product-title {
  color: #00a8c4;
  text-align: center;
  width: 100%;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-item .product-title {
    margin-top: 1.7142857143vw;
    font-size: 2.1428571429vw;
    line-height: 1.3;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item .product-title {
    margin-top: 24px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item .product-title {
    font-size: 30px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-item .product-title {
    font-size: 4.6875vw;
    line-height: 6.71875vw;
    margin-top: 3.90625vw;
  }
}
#lp-container .main-container .product-item .product-text {
  color: #00a8c4;
  line-height: 1.5;
  letter-spacing: -0.02em;
  width: 100%;
  position: relative;
  font-weight: 400;
}
#lp-container .main-container .product-item .product-text:after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #00a8c4;
  position: absolute;
  left: 0;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-item .product-text:after {
    top: -1.2857142857vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item .product-text:after {
    top: -18px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-item .product-text:after {
    top: -2.8125vw;
    height: 2px;
  }
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .product-item .product-text {
    margin-top: 3.2857142857vw;
    font-size: 1.5714285714vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item .product-text {
    margin-top: 46px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .product-item .product-text {
    font-size: 22px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .product-item .product-text {
    font-size: 3.59375vw;
    line-height: 6.875vw;
    margin-top: 6.875vw;
    letter-spacing: -0.02em;
  }
}
#lp-container .main-container .gradient-container {
  background: linear-gradient(to bottom, #4fc3dc 0%, #7bd9e7 50%, #d8f7f9 100%);
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .gradient-container {
    margin-top: 8.2142857143vw;
    padding-top: 3.2142857143vw;
    padding-bottom: 5.2142857143vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container {
    margin-top: 115px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container {
    padding-top: 45px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container {
    padding-bottom: 73px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .gradient-container {
    padding-top: 2.65625vw;
    padding-bottom: 5.625vw;
  }
}
#lp-container .main-container .gradient-container .bottom-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .gradient-container .bottom-title {
    width: 72.1428571429vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bottom-title {
    width: 1010px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .gradient-container .bottom-title {
    width: 58.4375vw;
  }
}
#lp-container .main-container .gradient-container .bottom-img {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .gradient-container .bottom-img {
    margin-top: 3.2142857143vw;
    width: 100vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bottom-img {
    margin-top: 45px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bottom-img {
    width: 1400px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .gradient-container .bottom-img {
    margin-top: 1.875vw;
  }
}
#lp-container .main-container .gradient-container .bigger {
  font-weight: 400;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .gradient-container .bigger {
    width: 38vw;
    font-size: 1.8571428571vw;
    border-radius: 3.2142857143vw;
    height: 5.7142857143vw;
    margin-top: 4.4285714286vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bigger {
    width: 532px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bigger {
    font-size: 26px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bigger {
    border-radius: 45px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bigger {
    height: 80px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .gradient-container .bigger {
    margin-top: 62px;
  }
}
#lp-container .main-container .blue-white-container {
  background-color: #00a8c4;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .blue-white-container {
    padding-top: 4.1428571429vw;
    padding-bottom: 7.1428571429vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-white-container {
    padding-top: 58px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-white-container {
    padding-bottom: 100px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .blue-white-container {
    padding-top: 8.28125vw;
    padding-bottom: 14.21875vw;
  }
}
#lp-container .main-container .blue-white-container .under-title {
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .blue-white-container .under-title {
    width: 25.0714285714vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-white-container .under-title {
    width: 351px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .blue-white-container .under-title {
    width: 50.9375vw;
  }
}
#lp-container .main-container .blue-white-container .under-btn-container {
  display: flex;
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .blue-white-container .under-btn-container {
    justify-content: center;
    align-items: center;
    gap: 7.1428571429vw;
    margin-top: 5.9285714286vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-white-container .under-btn-container {
    gap: 100px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-white-container .under-btn-container {
    margin-top: 83px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .blue-white-container .under-btn-container {
    flex-direction: column;
    gap: 6.25vw;
    margin-top: 8.59375vw;
  }
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .blue-white-container .under-btn {
    width: 28.1428571429vw;
    transition: ease 0.5s opacity;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .main-container .blue-white-container .under-btn {
    width: 394px;
  }
}
@media screen and (min-width: 768px) {
  #lp-container .main-container .blue-white-container .under-btn:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .main-container .blue-white-container .under-btn {
    width: 61.875vw;
    margin-left: auto;
    margin-right: auto;
  }
}
#lp-container .dialog {
  opacity: 0;
  transition: opacity 0.5s ease-out;
  position: relative;
  margin-inline: auto;
  pointer-events: none;
}
#lp-container .dialog::-webkit-backdrop {
  background-color: rgba(0, 0, 0, 0.6);
}
#lp-container .dialog::backdrop {
  background-color: rgba(0, 0, 0, 0.6);
}
#lp-container .dialog[open] {
  opacity: 1;
  pointer-events: auto;
}
#lp-container .dialog.closing {
  pointer-events: none;
  opacity: 0;
}
#lp-container .dialog .dialog-inner {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 768px) {
  #lp-container .dialog .dialog-inner .youtube-container iframe {
    width: 68.5714285714vw;
    height: 38.5714285714vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .dialog-inner .youtube-container iframe {
    width: 960px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .dialog-inner .youtube-container iframe {
    height: 540px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .dialog .dialog-inner .youtube-container iframe {
    width: 100vw;
    height: 56.25vw;
  }
}
#lp-container .dialog .close-btn {
  position: absolute;
  cursor: pointer;
  z-index: 100;
  background: transparent;
}
@media screen and (min-width: 768px) {
  #lp-container .dialog .close-btn {
    width: 3.2142857143vw;
    height: 3.2142857143vw;
    top: -3.5714285714vw;
    right: -0.7142857143vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .close-btn {
    width: 45px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .close-btn {
    height: 45px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .close-btn {
    top: -50px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .close-btn {
    right: -10px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .dialog .close-btn {
    width: 7.03125vw;
    height: 7.03125vw;
    top: -7.8125vw;
    right: 0;
  }
}
#lp-container .dialog .close-btn:before, #lp-container .dialog .close-btn:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #fff;
  transform-origin: center;
}
@media screen and (min-width: 768px) {
  #lp-container .dialog .close-btn:before, #lp-container .dialog .close-btn:after {
    width: 3.2142857143vw;
    height: 0.1428571429vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .close-btn:before, #lp-container .dialog .close-btn:after {
    width: 45px;
  }
}
@media screen and (min-width: 768px) and (min-width: 1400px) {
  #lp-container .dialog .close-btn:before, #lp-container .dialog .close-btn:after {
    height: 2px;
  }
}
@media screen and (max-width: 767px) {
  #lp-container .dialog .close-btn:before, #lp-container .dialog .close-btn:after {
    width: 7.03125vw;
    height: 0.3125vw;
  }
}
#lp-container .dialog .close-btn:before {
  transform: translate(-50%, -50%) rotate(45deg);
}
#lp-container .dialog .close-btn:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}