@charset "UTF-8";
.pc {
  display: block!important
}

.sp {
  display: none!important
}

html {
  scroll-behavior: smooth
}

/*----------------------------------------
general
----------------------------------------*/
html {
	scroll-behavior: smooth;
}
body {
	background: #fff;
}

@media screen and (min-width: 600px) {
	.wrapper {font-size: 16px;}
}
.wrapper img {
	width: 100%;
	margin: 0;
	padding: 0;
	height: auto;
	display: block;
	font-size: 0;
	line-height: 0;
	vertical-align: bottom;
}
.wrapper a {
	display: block;
}

.wrapper ul,
.wrapper dl,
.wrapper ol{
  list-style: none;
}
.wrapper ul li,
.wrapper dl dt,
.wrapper dl dd,
.wrapper ol li{
	line-height: 0;
	font-size: 0;
}

.wrapper {
  max-width: 750px;
  margin: 0 auto;
  text-align: center;
  overflow: hidden;
}
.wrapper *{
  position: relative;
  box-sizing: border-box;
}


#template-form-view *:is(*):not(.btn-offer, .bl_floatArea, .e-offer-button, .e-offer-bottom, .e-offer-bottom *) {
  animation-duration: 0ms !important;
  animation-delay: 0ms !important;
  transition-duration: 0ms !important;
  transition-delay: 0ms !important;
}

.wrapper {
container-type: inline-size;
}
/*----------------------------------------
fv
----------------------------------------*/
.wrapper .fv h1{
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
}
.c-selection {
position: relative;
}
.c-offer-button {
width: 91.2%;
left: 0;
right: 0;
margin-inline: auto;
top: 200cqw;
position: absolute;
animation: purun 2s infinite;
}
.point02-slideWrap .point02-slider .point02-gif01 {
position: absolute;
width: calc(590 / 690* 100%);
top: 47%;
left: calc(40 / 690* 100%);
}
.point02-slideWrap .point02-slider .point02-gif02 {
position: absolute;
width: calc(590 / 690* 100%);
top: 47%;
left: calc(40 / 690* 100%);
}
.point02-slideWrap .point02-slider .point02-gif03 {
position: absolute;
width: calc(590 / 690* 100%);
top: 47%;
left: calc(40 / 690* 100%);
}
.point02-slideWrap .slider-icon {
position: absolute;
width: calc(188 / 750* 100%);
z-index: 2;
top: 38%;
left: calc(281 / 750* 100%);
}
.point02-slideWrap {
position: absolute;
top: 656cqw;
width: 90%;
left: 5%;
}
.grade-slideWrap {
position: absolute;
top: 1056cqw;
width: 100%;
}
.bl_floatArea_btn {
margin-bottom: 0 !important;
}

@keyframes pp {
  0%, 100% {
    transform: scale(1, 1);
  }
  5% {
      transform: scale(.85, 1.15);
  }
  10% {
      transform: scale(1.1, .9);
  }
  15% {
      transform: scale(.9, 1.1);
  }
  20% {
      transform: scale(1, 1);
  }
}

.e-offer-button {
  display: block;
  position: absolute;
  top: 54.5%;
  width: calc(684/750*100%);
  left: calc(33/750*100%);
  animation: pp 2s infinite;
}
.e-offer-button img {
  display: block;
  width: 100%;
  height: auto;
}
*:has(> .e-offer-button) {
  position: relative;
}
.e-offer-bottom-box {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.1s;
  overflow: hidden;
  position: relative;
}
.e-offer-bottom-box.open {
  grid-template-rows: 1fr;
}
.e-offer-bottom-box-b {
  overflow: hidden;
  height: 100000%
}
.e-offer-bottom-e {
  cursor: pointer;
  position: relative;
  container-type: inline-size;
}

.e-offer-bottom-e::after {
  position: absolute;
  display: block;
  content: '▲';
  font-size: 3.5cqw;
  top: 86%;
  left: 84%;
  z-index: 2;
  transform: rotate(180deg);
  color: white;
  transition: transfrom 0.4s;
}
.e-offer-bottom-e:has(+ .open)::after{
  transform: rotate(0deg);
}

.form_container_ec {
  width: auto !important;
}
.login_message_box_ec {
  width: auto !important;
}
#lp-form table {
  max-width: 100%;
}
.form_group_ec {
    text-align: left;
}
.landing_form_ec td {
    width: auto !important;
}

/* slider */
.slick-dots li{
  width: calc(30/750*100%);

}
.slick-dots li button:before {
  content:"";
  display: block;
  font-size: 0;
  width: 15px;
  height: 15px;
  background-color: #c5c5c5;
  border-radius: 30px;
  opacity: 1;
}
.slick-dots li.slick-active button:before{
  background-color: #cfb185;
}

/* cycle-slider */

.rel-box {
  position: relative;
}

.wrapper .cycle-gif {
  position: absolute;
  bottom:7%;
  width: calc(590/750*100%);
  left: 50%;
  transform: translateX(-50%);

}

.cycle-slider {
  width: calc(690/750*100%);
  margin: 0 auto;
}
.wrapper .cycle-slider03 {
  margin-bottom: 12%;
}
/* ---------------------------------------------
 追従ボタン
--------------------------------------------- */
.bl_floatArea {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 999;
  visibility: hidden;
  opacity: 0;
  transition: visibility .4s, opacity .4s;
  box-sizing: border-box;
}
.bl_floatArea.is_show {
  visibility: visible;
  opacity: 1;
}
.bl_floatArea_inner {
  max-width: 750px;
  margin: auto;
  padding: 0;
  box-sizing: border-box;
}

/* ボタン */
.bl_floatArea_btn {
  display: block;
}
.bl_floatArea_btn img {
  width: 100%;
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

/* 背景色付き ver */
.bl_floatArea.bl_floatArea__bg {
  background-color: rgba(255, 255, 255, .5);
}
/* パディングなし ver */
.bl_floatArea.bl_floatArea__p0 .bl_floatArea_inner {
  padding: 0;
}

/* footer */

footer {
  font-family: 游ゴシック, YuGothic, ヒラギノ角ゴ Pro, Hiragino Kaku Gothic Pro, メイリオ, Meiryo, Osaka, ＭＳ\ Ｐゴシック, MS PGothic, sans-serif;
  background: #474747;
  padding: 30px 0 10px;
  text-align: center;
}

footer ul {
  margin-bottom: 30px
}

footer ul li {
  position: relative;
  display: inline-block;
  margin-right: 30px
}

footer ul li:after {
  content: "";
  font-size: 1pc;
  color: #fff;
  position: absolute;
  right: -25px;
  top: 0
}

footer ul li:last-child {
  margin-right: 0
}

footer ul li:last-child:after {
  display: none
}

footer ul li a {
  font-size: min(calc(16/750*100vw),16px);
  color: #fff;
  text-decoration: none
}

footer .logo {
  margin-bottom: 25px
}

footer .logo img {
  width: 118px
}

footer p {
  font-size: 9pt;
  color: #fff
}