@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Old+Mincho&display=swap');

img{max-width: 100%;}
a{color: #000;text-decoration: none;}

/*-------------------------
header
-------------------------*/
.container{margin: 0 auto; max-width: 430px;}

@media (max-width: 430px) {
  .container {
      width: 100%; /* 画面幅が430px以下の場合は幅を100%に設定 */
  }
}
.flex{display: flex;align-items: center;vertical-align: bottom;justify-content: space-between;padding: 8px;}
.header-wrapper{
  background: url(../img/header-bg.png);
  height: 80px;
}
.header-wrapper img{width: 100px;padding: 8px;}
.header-text{padding: 0.2em;position: relative;}
.header-text img{width: 130px;height: auto;padding: 0;margin: -4px 0;}
.header-text a {position: absolute;top: 54%;left: 50%; transform: translate(-50%,-65%);text-decoration: none;
    color: #fff;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 700;white-space: nowrap;font-size: 12px;}
.header-button-wrapper {text-align: right;}

/*-------------------------
footer
-------------------------*/
footer{padding: 1.2em; background: url(../img/footer-bg.png); color: #fff;padding-bottom: 10rem;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;}
footer li {list-style-type: none;font-weight: 900;font-size:16px; border-bottom: 1px solid rgba(242, 209, 94, 1);padding: 0.9em 0.9em 0.9em 0;margin-top: 0.2em;}
footer a{color: #FFF;}
.caution-text{border: 1px solid rgba(242, 209, 94, 1);padding: 2.0em 1.5em;margin-top: 4em;font-size: 12px;line-height: 18px;}


/*-------------------------
section contents
-------------------------*/
#before-section01{position: relative;}
.fv-images{max-width: 430px;width: 100%;}
.line-cta {position: absolute;inset:0;top: 83%;max-width:350px;width:90%;margin: 0 auto;}

/*-------------------------
金色ボーダー白背景BOX
-------------------------*/
.text-box {
  background: url(../img/text-box-bg.png);
  padding: 0.4em;
  width: 100%;
  margin: 0 auto;
  margin-top: -5px;
  background-size: 100% 100%;
  background-position: center;
}
.border-gold {
  background: url(../img/border-gold.png);
  background-size: cover;
  background-position: center;
  border-image-slice: 1;
  padding: 4em 2rem;
  color: #fff;
  margin: 2rem 0;
}
.text-box p{font-size: 12px;font-weight: 400;line-height: 20px;}
/*-------------------------
金色白BOXのテキスト
-------------------------*
.mb-1em{margin-bottom: 1em;}
.color-red{color: rgba(255, 0, 0, 1);}*/

/*-------------------------
section-images-group
-------------------------*/
/*.section-images-group{margin-top: 1em;}*/

/*-------------------------
before-section03
-------------------------*/
#before-section03{position: relative;}
.position-images{position: absolute;inset: 0;top: 85%;margin: 0 auto;text-align: center;}
.text-left{text-align: left;}

/*-------------------------
section-images-group
-------------------------*/
.section-images-group img{
  display: block;
}

/*-------------------------
line-cta2
-------------------------*/
.line-cta2{background-image: url(/img/foot-back2.png);background-size: cover; margin-top: -7px;height: 100%;text-align: center;}
.foot-line-cta{max-width: 350px;}



/*-------------------------
的中実績
-------------------------*/
#section_achievement{
  background-image: url(/img/achievement_back_before.png);
    background-size: 100% 100%;
    background-position: center;
    padding-bottom: 20px;
    padding-top: 240px;
}
#section_achievement2{
  background-image: url(/img/achievement_back_before2.png);
    background-size: 100% 100%;
    background-position: center;
    padding-bottom: 20px;
    padding-top: 200px;
}

#section_achievement .result_list{
  max-width: 310px;
  width: 90%;
  margin: 10px auto 0;
}
#section_achievement .result_list li{
  display: flex;
    align-items: center;
    background-image: url(/img/result_back.png);
    background-size: cover;
    background-position: center;
    padding: 25px 0;
    position: relative;
    justify-content: flex-end;
    margin-bottom: 1em;
}
#section_achievement .result_list li img{
  width: 50%;
    position: absolute;
    left: -8px;
}
#section_achievement .result_list li div {
  margin-right: 2em;
  z-index: 1;
}
#section_achievement .result_list li .date,#section_achievement .result_list li .race{
 text-align: right;
 font-weight: bold;
 text-align: right;
 color: #d5a52c;
  text-shadow:1px 1px 0 #000, -1px -1px 0 #000,
  -1px 1px 0 #000, 1px -1px 0 #000,
  0px 1px 0 #000,  0-1px 0 #000,
  -1px 0 0 #000, 1px 0 0 #000;
}
#section_achievement .result_list li .price{
  font-size: 1.8rem;
  background: linear-gradient(180deg, #EA2121 46.21%, #FF9292 48.82%, #EA2121 56.23%, #5D0808 90.23%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1px #000;
  font-weight: bold;
}
#section_achievement2 .result_list{
  max-width: 310px;
  width: 90%;
  margin: 10px auto 0;
}
#section_achievement2 .result_list li{
  display: flex;
    align-items: center;
    background-image: url(/img/result_back.png);
    background-size: cover;
    background-position: center;
    padding: 25px 0;
    position: relative;
    justify-content: flex-end;
    margin-bottom: 1em;
}
#section_achievement2 .result_list li img{
  width: 50%;
    position: absolute;
    left: -8px;
}
#section_achievement2 .result_list li div {
  margin-right: 2em;
  z-index: 1;
}
#section_achievement2 .result_list li .date,#section_achievement2 .result_list li .race{
 text-align: right;
 font-weight: bold;
 text-align: right;
 color: #d5a52c;
  text-shadow:1px 1px 0 #000, -1px -1px 0 #000,
  -1px 1px 0 #000, 1px -1px 0 #000,
  0px 1px 0 #000,  0-1px 0 #000,
  -1px 0 0 #000, 1px 0 0 #000;
}
#section_achievement2 .result_list li .price{
  font-size: 1.8rem;
  background: linear-gradient(180deg, #EA2121 46.21%, #FF9292 48.82%, #EA2121 56.23%, #5D0808 90.23%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1px #000;
  font-weight: bold;
}


#section_achievement .more_btn {
  margin-top: 35px;
  text-align: center;
}

#section_achievement .more_btn img {
  width: 90%;
  margin: 0 auto;
}

#section_achievement .pagenation{
  margin-top: 30px;
  text-align: center;
}
#section_achievement .pagenation li{
  background-color: #000;
  display: inline-block;
  margin-left: 7px;
  border: 2px solid white; /* 枠線の太さ、スタイル、色を指定 */
}
#section_achievement .pagenation li a{
  display: inline-block;
    background: linear-gradient(171.11deg, #d4b76e 29.41%, #e5d7b3 49.04%, #d5a52c 69.06%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding: 7px 15px;
    font-weight: bold;
    font-size: 22px;
}
#section_achievement2 .pagenation{
  margin-top: 30px;
  text-align: center;
}
#section_achievement2 .pagenation li{
  background-color: #000;
  display: inline-block;
  margin-left: 7px;
  border: 2px solid white; /* 枠線の太さ、スタイル、色を指定 */
}
#section_achievement2 .pagenation li a{
  display: inline-block;
    background: linear-gradient(171.11deg, #d4b76e 29.41%, #e5d7b3 49.04%, #d5a52c 69.06%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding: 7px 15px;
    font-weight: bold;
    font-size: 22px;
}

.foot-line-cta{
  background: url(/img/foot-line-cta-bg.png);
  background-size: cover;
  max-width: 100%;
}

/*-------------------------
ログインページここから
-------------------------*/
.section_login{
  position: relative;
  margin-bottom: 3.5rem;
}
.section_login .title{
  margin: 1em;
  padding: 10px;
  text-align: center;
  position: absolute;
  font-size: 22px;
  font-weight: 600;
  background: url(/img/login_title_bg.png);
  color: #fff;
  background-size: contain;
  width: 88%;
  max-width: 430px;
  background-repeat: no-repeat;
  text-align: center;
  background-position: center;
  }

.login-back{position: relative;padding: 0;height: 500px;width: 100%;margin: 0 auto;z-index: -1;}

.login-text p{color: #fff; font-size: 13px;font-weight: 400;margin-bottom: 1em;position: absolute; top: 270px;left: 51%;transform: translateX(-50%);width: 208px;}
.font-gold{background: linear-gradient(171.11deg, #D4B76E 29.41%, #E5D7B3 49.04%, #D5A52C 69.06%);
    -webkit-background-clip: text;-webkit-text-fill-color: transparent;}



.login-button{position: relative;display: inline-block;}
.login-button img{    width: 250px;
  margin: 1rem 0;}
.login-button a {position: absolute;top: 50%;left: 50%; transform: translate(-50%,-65%);text-decoration: none;
    /* 黄金の文字 */
    background: linear-gradient(171.11deg, #D4B76E 29.41%, #E5D7B3 49.04%, #D5A52C 69.06%);
    -webkit-background-clip: text;-webkit-text-fill-color: transparent;
    /*ここまで*/
    font-weight: 900;white-space: nowrap;font-size: 14px;}

.input-box {background: rgba(245, 245, 245, 1);border: 1px solid;
    border-image-source: linear-gradient(171.11deg, #D4B76E 29.41%, #E5D7B3 49.04%, #D5A52C 69.06%);
    ;border-image-slice: 1;padding: 5px;margin: 10px auto;}

.form-content{text-align: center;margin-top: -379px; position: relative;}
.btn-login{display: block;margin: 6rem auto 0;}
.login-text{
  position: absolute;
  top: -152px;
  left: 50%;
}

/*------------------
ナビゲーション
--------------------*/
.nav-contents {
  background-size: cover;
  max-width: 430px;
  height: 60px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  position: fixed; /* 追従用 */
  bottom: 0; /* 追従用 */
  width: 100%; /* 追従用 */
  box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1); /* 追従用 */
  z-index: 1000; /* 追従用 */
}

.nav-list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  list-style: none;
  width: 100%;
  margin: 0;
  padding: 0;
}

.nav-list li {
  flex: 1;
  text-align: center;
  border-left: 1px solid rgba(169, 155, 103, 1);
  display: flex;
  justify-content: center;
  align-items: center;
}

.nav-list li:first-child {
  border-left: none;
}

.nav-list a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: inherit;
}

.nav-list img {
  max-height: 100%;
  width: 100%;
  display: inline-block;
  vertical-align: middle;
  padding-bottom: 6rem;
}

.section02_swiper{
  background: url(../img/section02_02.png);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 5em 1em;
}

.section02_swiper .swiper{
  width: 95%;
  height: 100%;
}

.section02_swiper_inner{
  position: relative;
}


.swiper-wrapper {
  /* wrapperのサイズを調整 */
    width: 90%;
}


.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  width: 100px;
  height: 100%;
  text-align: center;
  width: 30%;
}

.swiper-slide:nth-child(3n + 1) {
  /*1、4、7、3n+1枚目の背景色 */
  background-color: #D9D9D9;
}

.swiper-slide:nth-child(3n + 2) {
  /*2、5、8、3n+2枚目の背景色 */
  background-color: #D9D9D9;
}

.swiper-slide:nth-child(3n + 3) {
  /*3、6、9、3n+3枚目の背景色 */
  background-color: #D9D9D9;
}

.swiper-button-next:after, .swiper-button-prev:after{
  display: none;
}

.swiper-button-next, .swiper-rtl .swiper-button-prev {
  right: 10px;
  left: auto;
}

/* メールアドレス入力フォーム */
.top-form__inner {
	padding: 0 1.46875rem;
}

.top-form__contact {
	margin: -2.5rem auto 0;
	width: 82.01%;
}

.top-form__contact input {
	background-color: #EDEDED;
	background-image: url("../img/contact-input.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 3.125rem;
	box-sizing: border-box;
	color: #929292;
	font-size: 1.074375rem;
	font-weight: 700;
	height: 3.125rem;
	padding: 0.75rem 0.9375rem;
	width: 100%;
}

.top-form__button {
	margin-top: 1.25rem;
}

.top-form__button img {
	margin-left: auto;
	margin-right: auto;
	transition: transform 0.3s ease-out;
	width: 100%;
}

.top-form__button img:hover {
	transform: scale(0.98);
}

.top-form__benefits {
	margin-top: -0.5rem;
}

.top-form__benefits img {
	margin-left: auto;
	margin-right: auto;
	width: 85.135%;
}

.top-form__benefits--setting {
	margin-top: -0.625rem;
}

.top-form__benefits--margin {
	margin-top: 1.25rem;
}

.top-form__registration--setting {
	margin-top: -0.9375rem;
}

.top-form__registration--margin {
	margin-top: 3.125rem;
}

.setting__attention {
	margin: 0.9375rem auto auto -1.46875rem;
	width: calc(100% + 2.9375rem);
}

.top-form__contact--fv {
	margin: -12.5rem auto 0;
}

.top-form__button--fv {
	width: 82.01%;
  margin: 13px auto;
}

/* メールアドレス入力フォーム */

.top-form__inner {
	padding: 0 1.46875rem;
}

.top-form__contact2 {
	margin: -1.5rem auto 0;
	width: 82.01%;
}

.top-form__contact2 input {
	background-color: #EDEDED;
	background-image: url("../img/contact-input.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 3.125rem;
	box-sizing: border-box;
	color: #929292;
	font-size: 1.074375rem;
	font-weight: 700;
	height: 3.125rem;
	padding: 0.75rem 0.9375rem;
	width: 100%;
}

.top-form__button2 {
	margin-top: 1.25rem;
}

.top-form__button2 img {
	margin-left: auto;
	margin-right: auto;
	transition: transform 0.3s ease-out;
	width: 100%;
}

.top-form__button2 img:hover {
	transform: scale(0.98);
}

.top-form__benefits2 {
	margin-top: -0.5rem;
}

.top-form__benefits2 img {
	margin-left: auto;
	margin-right: auto;
	width: 85.135%;
}

.top-form__benefits--setting2 {
	margin-top: -0.625rem;
}

.top-form__benefits--margin2 {
	margin-top: 1.25rem;
}

.top-form__registration--setting2 {
	margin-top: -0.9375rem;
}

.top-form__registration--margin2 {
	margin-top: 3.125rem;
}

.setting__attention {
	margin: 0.9375rem auto auto -1.46875rem;
	width: calc(100% + 2.9375rem);
}

.top-form__contact2--fv {
	margin: -1rem auto 0;
}

.top-form__button2--fv {
	width: 82.01%;
  margin: 13px auto;
}
