
.guide-first div, .guide-first form, .guide-first h1, .guide-first h2, .guide-first h3, .guide-first h4, .guide-first ul, .guide-first li, .guide-first dl, .guide-first dt, .guide-first dd, .guide-first p {
  line-height: 1.6;
}

.guide-first__page-title {
  font-size: 28px;
  font-weight: 500;
  text-align: center;
letter-spacing: 8%;
margin:24px auto 36px;
}

@media screen and (max-width: 767px) {
  .guide-first__page-title {
    font-size: 6vw;
  }
}
.guide-first__page-title img {
  width: 180px;
  margin-right: 8px;
}

@media screen and (max-width: 767px) {
  .guide-first__page-title img {
    width: 45vw;
  }
}

.guide-first section{
display:flex;
flex-direction:column;
align-items:center;
}

.guide-first .guide-first__lead{
width: fit-content;
text-align: justify;
    padding: 0 16px;
    margin: 0 auto;
}

/*▼KARTE挿入要素*/
.guide-first .first-welcome{
margin-top:24px;
display:flex;
flex-direction:column;
gap:24px;
}

@media screen and (max-width: 767px) {
.guide-first .first-welcome{
padding: 16px !important;
}
}
/*▲KARTE挿入要素*/

.guide-first .first-cta{
display:flex;
flex-direction:column;
align-items:center;
gap:1.2em;
}

.guide-first .first-cta p{
line-height:1;
}


/*KARTEでキャンペーンバナー挿入されていなければ表示する
.guide-first .first-4point-index .first-cta{
display:none;
}
.guide-first:not(:has(.first-welcome)) .first-4point-index .first-cta{
display:flex;
}
*/

/*KARTEでキャンペーンバナー挿入されていたら表示しない*/
.guide-first:has(.first-welcome) .first-4point-index .first-cta{
display:none;
}

/*KARTEでキャンペーンバナー挿入されていなければ表示しない*/
.guide-first:not(:has(.first-welcome)) .visible-with-karte{
display:none;
}

.guide-first .inner{
max-width:860px;
padding:0;
}

@media (max-width: 768px){
.guide-first .inner{
padding:0 16px;
}
}

.guide-first .first-point__item,
.guide-first .bg div.inner{
display:flex;
flex-direction:column;
gap:32px;
align-items:center;
}

.guide-first .bg{
background-color:#F7F7F7;
    padding: 48px 0;
}

.guide-first h2{
font-size:20px;
font-weight: bold;
letter-spacing:8%;
}

.first__text{
/*text-align:justify;*/
  font-size: 16px;
max-width: 700px;
}

@media (max-width:767px){
.first__text{
  font-size: 15px;
padding:0 8px;
}
}

.btn-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 24px 0;
}

.btn-wrap--center {
  justify-content: center;
}

.btn {
  font-size: 14px;
  min-width: 200px;
  padding: 12px;
  border-radius: 40px;
  border: none;
  background: none;
  box-shadow: none;
}

@media screen and (max-width: 767px) {
  .btn:hover {
    opacity: 1;
  }
}
.btn--primary {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  background-color: #ED6D68;
}
.guide-first .btn.btn--primary{
display:block;
background-color:#ED6E68;
color:#fff;
width:fit-content;
}
.btn--primary:hover {
  background-color: #e95e57;
}

.btn--secondary {
  color: #222;
  border: 1px solid #222;
}

.btn--secondary:hover {
  background-color: inherit;
}


.guide-first .btn-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  margin: 0;
}

.first-point {
  margin: 100px 0;
}

@media screen and (max-width: 767px) {
  .first-point {
    margin: 56px 0;
  }
}
.first-point__item {
  margin-top: 64px;
}

@media screen and (max-width: 767px) {
  .first-point__item {
    margin-top: 48px;
  }
}
.first-point__heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 16px;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 16px;
}

@media screen and (max-width: 767px) {
  .first-point__heading {
    flex-direction: column;
    text-align: center;
  }
}

.first-point__img {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  margin:0;
}

.first-point__img.first-point__img--brand {
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin:0;
}

@media screen and (max-width: 767px) {
  .first-point__img--brand {
    gap: 8px;
  }
}

.first-point__img--brand img {
  width: inherit;
  padding: 14px;
  background-color: #fff;
}

@media (max-width:767px){
.first-point__img.first-point__img--brand {
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin:0;
}
.first-point__img--brand img {
padding:8px;
}
}




.first-service {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  padding: 56px 0;
}

.first-service__heading {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .first-service__heading {
    font-size: min(24px, 6vw);
  }
}
.first-service__heading span {
  font-size: 32px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .first-service__heading span {
    font-size: min(32px, 8vw);
  }
}
.first-service__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

@media screen and (max-width: 767px) {
  .first-service__list {
    width: 100vw;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 -14px;
  }
}
.first-service__item {
  display: flex;
  flex-direction: column;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  padding: 8px 16px 32px;
  margin: 0;
}

@media screen and (min-width: 768px) {
  .first-service__item:nth-child(4), .first-service__item:last-child {
    border-right: none;
  }
  .first-service__item:nth-child(n+5) {
    border-bottom: none;
  }
}
@media screen and (max-width: 767px) {
  .first-service__item {
    padding: 3vw 2vw 5vw;
  }
  .first-service__item:nth-child(even) {
    border-right: none;
  }
  .first-service__item:nth-child(n+7) {
    border-bottom: none;
  }
}
.first-service__item * {
  text-align: center;
}

.first-service__img img {
  width: 120px;
}

@media screen and (max-width: 767px) {
  .first-service__img img {
    width: 80px;
  }
}
.first-service__title {
  font-size: 18px;
  font-weight: bold;
  margin-top: 16px;
}

@media screen and (max-width: 767px) {
  .first-service__title {
    font-size: min(15px, 4vw);
    margin-top: 8px;
  }
}
.first-service__text {
  font-size: 14px;
  margin-top: 8px;
  margin-bottom: 16px;
}

@media screen and (max-width: 767px) {
  .first-service__text {
    font-size: min(13px, 4.4vw);
    margin-bottom: 8px;
  }
}
.first-service__link {
  margin-top: auto;
}

.first-service__link a {
  color: #2D79C4;
}

@media screen and (max-width: 767px) {
  .first-service__link a {
    font-size: min(13px, 4.4vw);
  }
}
.first-mail {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  padding: 64px 0;
}

.first-mail__heading {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 24px;
}

.first-mail__text {
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .first-mail__text {
    font-size: 15px;
    text-align: left !important;
  }
}
.first-mail * {
  text-align: center;
}

.first-app {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  padding: 64px 80px;
}

@media screen and (max-width: 767px) {
  .first-app {
    padding: 56px 0;
  }
}
.first-app__text-wrap {
  width: 460px;
}

@media screen and (max-width: 767px) {
  .first-app__text-wrap {
    width: 100%;
  }
}
.first-app__text-wrap * {
  text-align: center;
}

.first-app__heading {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 24px;
}

.first-app__text {
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .first-app__text {
    font-size: 15px;
    text-align: left !important;
  }
}
.first-app__img {
  flex: 1;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .first-app__img img {
    width: 140px;
  }
}
.first-app__btn {
  width: 340px;
  display: flex;
  align-items: center;
  gap: 16px;
  background: #F8F8F8;
  padding: 24px 32px;
  margin: 24px auto 0;
}

@media screen and (max-width: 767px) {
  .first-app__btn {
    width: 100%;
    max-width: 340px;
  }
}
.first-app__btn a {
  display: inline-block;
  flex: 1;
}

.first-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  padding: 64px 80px;
}

@media screen and (max-width: 767px) {
  .first-line {
    padding: 56px 0;
  }
}
.first-line__text-wrap {
  width: 460px;
}

@media screen and (max-width: 767px) {
  .first-line__text-wrap {
    width: 100%;
  }
}
.first-line__text-wrap * {
  text-align: center;
}

.first-line__heading {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 24px;
}

.first-line__text {
  font-size: 16px;
}

@media screen and (max-width: 767px) {
  .first-line__text {
    font-size: 15px;
    text-align: left !important;
  }
}
.first-line__img {
  flex: 1;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .first-line__img img {
    width: 200px;
  }
}
.first-line__btn {
  width: 340px;
  background: #F8F8F8;
  padding: 24px 32px;
  margin: 24px auto 0;
}

@media screen and (max-width: 767px) {
  .first-line__btn {
    width: 100%;
    max-width: 340px;
  }
}
.first-line__btn a {
  display: flex;
  align-items: center;
  column-gap: 16px;
  color: #2D79C4;
}

.first-line__btn img {
  width: 48px;
}

.first-search {
  background: #F8F8F8;
  padding: 40px 0 72px;
}

@media screen and (max-width: 767px) {
  .first-search {
    padding: 48px 0;
  }
}
.first-search__heading {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 24px;
  text-align: center;
}

.first-search__heading img {
  display: block;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .first-search__text {
    text-align: left;
  }
}
.first-search__list {
  display: grid;
  gap: 16px;
}

@media screen and (max-width: 767px) {
  .first-search__list {
    gap: 8px 4px;
  }
}
.first-search__item {
  font-size: 16px;
  text-align: center;
  margin: 0;
}

@media screen and (max-width: 767px) {
  .first-search__item {
    font-size: 11px;
  }
}
.first-search__item img {
  margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
  .first-search__item img {
    margin-bottom: 4px;
  }
}

.guide-first h2.first-search__heading{
    background: url(/Contents/image/common/icon_search.svg) no-repeat center left;
    width: fit-content;
    margin: auto;
    padding-left: 1.5em;
    background-size: 1em;
}

.guide-first .first-search__list{
grid-template-columns: repeat(6, 1fr);
}

@media (max-width:600px){
.guide-first .first-search__list{
grid-template-columns: repeat(4, 1fr);
gap:6px;
font-size: .75em;
margin-inline: -8px;
}
}

.guide-first .first-search__item {
font-size:1.05em;
}

.guide-first .first-search__item img {
  aspect-ratio:1;
  object-fit:cover;
  border-radius:50%;
}

.first-point{
padding:36px 0;
margin:0;
}

.first-point:nth-of-type(odd){
background-color:#FEF7F4;
width: 100%;
}

.guide-first .first-point h2{
margin:auto;
width:140px;
}

.first-search__heading {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 24px;
  text-align: center;
  letter-spacing: 8%;
}

.guide-first h3{
font-weight:bold;
font-size: 20px;
text-align:center;
letter-spacing:8%;
}

.guide-first .btn{
font-size:1.2em;
padding: 1em;
border-radius:3em;
background-color:#fff;
min-width: 14em;
}

.guide-first .btn:hover,
.guide-first .first-search__item a:hover{
display:block;
transform:scale(1.05);
transition:0.1s;
text-decoration:none;
}


.guide-first .first-4point-index,
.guide-first .first-last-cta{
display:flex;
flex-direction:column;
gap: 24px;
    padding: 48px 0;
}

.guide-first .first-last-cta{
gap:36px;
}

.guide-first .first-4point-index h2{
width:480px;
}

@media screen and (max-width: 767px) {
.guide-first .first-4point-index h2{
/*font-size:28px;*/
width:84%;
max-width:360px;
}
}

.guide-first .first-4point-index ol{
  margin:0;
    width: calc(100% - 32px);
max-width: 480px;
font-size:1.16em;
letter-spacing:6%;
  display: grid;
  gap: 2px;
}

@media (min-width:752px){
.guide-first .first-4point-index ol{
  grid-template-columns: repeat(2, 1fr);
max-width: 720px;
}
}

@media (max-width:751px){
.guide-first .first-4point-index ol{
  grid-template-columns: repeat(1, 1fr);
}
}

.guide-first .first-4point-index ol>li a{
background-color:#FEF7F4;
padding:18px 20px;
font-weight:bold;
}

@media (max-width:480px){
.guide-first .first-4point-index ol>li a{
padding:18px;
}
}

.guide-first .first-4point-index a{
display:flex;
gap:16px;
align-items:center;
}

.guide-first .first-4point-index a:hover{
text-decoration:none;
}

@media (min-width:540 ) and (max-width:751px){
.guide-first .first-4point-index ol>li{
font-size:1.2em;
}
.guide-first .first-4point-index a{
gap:24px;
}

}

.guide-first .first-4point-index .first-4point-index__badge{
aspect-ratio:1;
flex-basis:28%;
background-color:#fff;
border-radius:50%;
flex-grow:0;
display:flex;
justify-content: center;
align-items: center;
position:relative;
}



.guide-first .first-4point-index .first-4point-index__badge:after {
position: absolute;
    width: 100%;
    height: 10%;
    content: "";
    background: url(../Contents/image/guide/first/arrow_down.svg) no-repeat center center;
    bottom: 12%;
    background-size: 15%;
}


.guide-first .first-4point-index .first-4point-index__badge img{
position: absolute;
    clip: rect(20px auto auto auto);
    top: -9%;
    transform: scale(.9);
}

.guide-first .first-4point-index ul{
flex:1;
}


.guide-first .btn-box{
background-color:#F8F8F8;
display:flex;
flex-direction:column;
align-items:center;
gap:16px;
font-weight:bold;
}

@media (max-width:767px){
.guide-first .btn-wrap{
gap:8px 16px;
}
.guide-first .btn-box{
padding:12px;
}
}

@media (min-width:768px){
.guide-first .btn-box{
padding:24px;
font-size: 1.2em;
}
}

.guide-first .btn-box:hover{
transform:scale(1.05);
transition:0.1s;
text-decoration:none;
}

.guide-first .btn-box p{
display:flex;
gap:4px;
}


.guide-first .btn-box p:before{
content: "┐";
    transform: rotate(45deg);
    font-size: .9em;
    font-weight: bold !important;
    color: #222;
}


.guide-first .first-app__btn {
width:480px;
margin:0;
padding:24px;
}
@media (max-width:767px){
.guide-first .first-app__btn {
width:100%;
}
}

.first-app__img img {
width:320px;
}

@media screen and (max-width: 767px) {
  .first-app__img img {
    width: 65%;
  }
}

@media screen and (min-width: 768px) {
.pay_method{
width:440px;
}
}

@media screen and (max-width: 767px) {
  .first-sns__text {
    font-size: 15px;
    text-align: left !important;
  }
}
.first-sns__list {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin: 32px 0;
}

.first-sns__list img {
  width: 36px;
}

@media screen and (max-width: 767px) {
.first-sns__list img {
  width: 28px;
}
}

.first-last-cta{
display:flex;
flex-direction:column;
gap:48px;
}

.first-last-cta .first-cta p{
font-weight:bold;
}