@charset "UTF-8";
/******* setting.scss *******/
/******* mixin.scss *******/
.mvLinkArea ul li, .topUse h2 span, .topApp .topAppCont:before, .topService .serviceList li, .topLinkArea .troubleLink li {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.5s linear, transform 0.8s cubic-bezier(0.39, 0.575, 0.565, 1);
}

.mvLinkArea.view ul li, .topUse.view h2 span, .topApp.view .topAppCont:before, .topService.view .serviceList li, .topLinkArea.view .troubleLink li {
  opacity: 1;
  transform: translate(0);
}

/******* reset.scss *******/
html {
  font-size: 62.5%;
}

html,
body {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  margin: 0;
  max-width: 100%;
  min-height: 100%;
  padding: 0;
  text-align: center;
  position: relative;
  -webkit-text-size-adjust: 100%;
}

div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fildset, input, textarea, p, blockquote, table, th, td, address, textarea, input {
  color: #000;
  font-size: 15px;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 160%;
  margin: 0;
  padding: 0;
  word-wrap: break-word;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

caption, th {
  text-align: left;
}

td, th {
  vertical-align: top;
}

fieldset, img, abbr {
  border: none;
}

li {
  list-style-type: none;
}

strong {
  font-weight: bold;
}

a {
  color: #000;
  text-decoration: none;
}
a:hover {
  color: #000;
}

img {
  vertical-align: bottom;
}

*:focus {
  outline: none;
}

.sp {
  display: none !important;
}

body.menuOpen,
html.menuOpen {
  overflow: hidden;
}

.wrapper {
  position: relative;
}

/******header******/
.headWrap {
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  transition: all 0.4s;
}
.headWrap:before {
  background-color: #FFEAEA;
  content: "";
  height: 57px;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}
.headWrap.scroll {
  top: -57px;
}

header {
  height: 160px;
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
  text-align: left;
}
header .lead {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 14px;
  width: 217px;
  background-image: url("../img/common/lead.svg");
  position: absolute;
  top: 20px;
  left: 30px;
}
header .headLink {
  display: flex;
  position: absolute;
  top: 4px;
  right: 20px;
}

/* majica */
header .headLink .li_majica {
    background-color: #fff;
    border-radius: 4px 4px 0 0;
    font-size: 93%;
    font-weight: 700;
    display: flex;
    justify-content: center;
    flex-flow: column;
    height: 53px;
    line-height: 110%;
    padding: 0 10px 0 54px;
    position: relative;
}
header .headLink .li_majica span {
    display: block;
    font-size: 71%;
}
header .headLink .li_majica:before {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
    text-indent: 180%;
    white-space: nowrap;
    content: "";
    display: block;
    height: 25px;
    width: 25px;
    background-image: url("../img/common/card01.png");
    position: absolute;
    top: 14px;
    left: 19px;
}

/* USC */
header .headLink .li_usc {
    /*margin-left: 7px;*/
}
header .headLink .li_usc a {
    background-color: #FFEAEA;
    color: #8E8E8E;
    font-size: 93%;
    font-weight: 700;
    display: flex;
    justify-content: center;
    flex-flow: column;
    height: 53px;
    line-height: 110%;
    padding-left: 74px;
    padding-right: 20px;
    position: relative;
    transition: opacity 0.6s;
    text-decoration: none;
}
header .headLink .li_usc a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 960px) {
    header .headLink .li_usc a:hover {
        opacity: 1;
    }
}

header .headLink .li_usc a span {
    display: block;
    font-size: 71%;
}
header .headLink .li_usc a:before {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
    text-indent: 180%;
    white-space: nowrap;
    content: "";
    display: block;
    height: 39px;
    width: 25px;
    background-image: url(../img/common/card02.png);
    position: absolute;
    top: 5px;
    left: 32px;
}
header .headLink .li_usc a:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
    text-indent: 180%;
    white-space: nowrap;
    content: "";
    display: block;
    height: 10px;
    width: 10px;
    background-image: url("../img/common/blank2.svg");
    position: absolute;
    top: 20px;
    right: 0px;
}

header .headLogo {
  position: absolute;
  top: 90px;
  left: 40px;
}
header .spMenuBtn {
  display: none;
}
header .gNav {
  display: flex;
  justify-content: flex-end;
  position: absolute;
  top: 85px;
  right: 20px;
}
header .gNav > li {
  margin-left: 20px;
}
header .gNav > li > a {
  display: block;
  font-weight: 700;
  padding: 10px 20px 10px 50px;
  position: relative;
}
header .gNav > li > a:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 23px;
  width: 18px;
  background-image: url("../img/common/nav_icon01.svg");
  position: absolute;
  top: 10px;
  left: 20px;
  z-index: 2;
}
header .gNav > li > a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow04.svg");
  transform: rotate(90deg);
  margin: 0 auto;
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
}
@media screen and (min-width: 737px) {
  header .gNav > li.nav01 > a.hover:after, header .gNav > li.nav01 > a:hover:after {
    background-image: url("../img/common/arrow01.svg");
  }
}
header .gNav > li.nav02 > a:before {
  background-image: url("../img/common/nav_icon02.svg");
}
@media screen and (min-width: 737px) {
  header .gNav > li.nav02 > a.hover:after, header .gNav > li.nav02 > a:hover:after {
    background-image: url("../img/common/arrow01.svg");
  }
}
header .gNav > li.nav03 a {
  transition: opacity 0.6s;
  text-decoration: none;
}
header .gNav > li.nav03 a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  header .gNav > li.nav03 a:hover {
    opacity: 1;
  }
}
header .gNav > li.nav03 a:before {
  background-image: url("../img/common/nav_icon03.svg");
  height: 19px;
  top: 12px;
  width: 19px;
}
header .gNav > li.nav03 a:after {
  display: none;
}
header .gNav > li.nav04 > a:before {
  background-image: url("../img/common/nav_icon04.svg");
  height: 19px;
  top: 12px;
  width: 19px;
}
header .gNav > li.nav04 > a .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink span {
  background-color: #93F29F;
}
@media screen and (min-width: 737px) {
  header .gNav > li.nav04 > a.hover:after, header .gNav > li.nav04 > a:hover:after {
    background-image: url("../img/common/arrow01.svg");
  }
}
header .gNav > li.nav05 a {
  transition: opacity 0.6s;
  text-decoration: none;
}
header .gNav > li.nav05 a:before {
  background-image: url("../img/common/nav_icon05.svg");
  height: 19px;
  top: 12px;
  width: 19px;
}
header .gNav > li.nav05 a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  header .gNav > li.nav05 a:hover {
    opacity: 1;
  }
}
header .gNav > li.nav05 a:after {
  display: none;
}
@media screen and (max-width: 1200px) {
  header .gNav > li {
    margin-left: 10px;
  }
  header .gNav > li > a {
    padding-right: 10px;
    padding-left: 40px;
  }
}
header .megaMenuWrap {
  opacity: 0;
  visibility: hidden;
  max-width: 1000px;
  padding-top: 40px;
  position: absolute;
  top: 40px;
  right: 260px;
  width: 65vw;
  z-index: 10;
}
@media screen and (max-width: 1540px) {
  header .megaMenuWrap {
    right: 16.8vw;
  }
}
header .megaMenuWrap .megaMenuCont {
  background-color: #fff;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  border-radius: 10px;
  padding: 60px 50px;
}
header .megaMenuWrap .megaMenuCont .megaMenu {
  display: flex;
}
header .megaMenuWrap .megaMenuCont .megaMenu li {
  border-bottom: 1px solid #E2D6D6;
  padding-bottom: 20px;
  margin-right: 4.7%;
  width: 30.2%;
}
header .megaMenuWrap .megaMenuCont .megaMenu li:nth-child(3n) {
  margin-right: 0;
}
header .megaMenuWrap .megaMenuCont .megaMenu li a {
  font-size: 133%;
  font-weight: 700;
  display: block;
  position: relative;
  padding-right: 15px;
  transition: opacity 0.6s;
  text-decoration: none;
}
header .megaMenuWrap .megaMenuCont .megaMenu li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  header .megaMenuWrap .megaMenuCont .megaMenu li a:hover {
    opacity: 1;
  }
}
header .megaMenuWrap .megaMenuCont .megaMenu li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow03.svg");
  position: absolute;
  top: 6px;
  right: 0px;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex {
  display: flex;
  justify-content: space-between;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink {
  border-bottom: 1px solid #E2D6D6;
  display: flex;
  flex-flow: column;
  width: 30.2%;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink span {
  background-color: #98DFF5;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 130px;
  margin-bottom: 20px;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink span img {
  height: 100px;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink a {
  font-size: 133%;
  font-weight: 700;
  display: block;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink a:hover {
    opacity: 1;
  }
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .topLink a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow03.svg");
  position: absolute;
  top: 6px;
  right: 0px;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .megaMenu {
  flex-wrap: wrap;
  width: 65.1%;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .megaMenu li {
  margin-right: 7.2%;
  margin-top: 30px;
  width: 46.4%;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .megaMenu li:nth-child(-n+2) {
  margin-top: 0;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .megaMenu li:nth-child(3n) {
  margin-right: 7.2%;
}
header .megaMenuWrap .megaMenuCont .megaMenuFlex .megaMenu li:nth-child(2n) {
  margin-right: 0;
}
header .megaMenuWrap.show {
  opacity: 1;
  visibility: visible;
}
header .otherNav {
  display: none;
}

/******footer******/
footer {
  background-color: #EFEFEF;
  padding: 2rem 0;
}
footer .footCont {
  border-bottom: 1px solid #D8D8D8;
  padding: 60px 20px;
}
footer .footCont .footLogoArea {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1300px;
  margin: 0 auto;
}
footer .footCont .footLogoArea .footLink {
  display: flex;
  justify-content: flex-end;
}
footer .footCont .footLogoArea .footLink li {
  font-weight: 700;
  margin-left: 30px;
}
footer .footCont .footLogoArea .footLink li a {
  transition: opacity 0.6s;
  text-decoration: none;
}
footer .footCont .footLogoArea .footLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  footer .footCont .footLogoArea .footLink li a:hover {
    opacity: 1;
  }
}
footer .footCont2 {
  display: flex;
  flex-flow: row-reverse;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  margin: 0 auto;
  max-width: 1300px;
  padding: 30px 20px;
}
footer .footCont2 .footLink2 {
  display: flex;
  margin-bottom: 30px;
  width: 100%;
}
footer .footCont2 .footLink2 li {
  font-size: 80%;
  margin: 0 30px 0 0;
}
footer .footCont2 .footLink2 li a {
  transition: opacity 0.6s;
  text-decoration: none;
}
footer .footCont2 .footLink2 li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  footer .footCont2 .footLink2 li a:hover {
    opacity: 1;
  }
}
footer .footCont2 .footLink2 li.blank a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 10px;
  width: 10px;
  background-image: url("../img/common/blank.svg");
  display: inline-block;
  margin-left: 8px;
}
footer .footCont2 .group {
  width: 106px;
}
footer .footCont2 .group img {
  width: 100%;
}
footer .footCont2 .copy {
  color: #A2A2A2;
  font-size: 80%;
}

/******main******/
main {
  display: block;
  text-align: left;
  position: relative;
}

/******index******/
.mvArea {
  padding-bottom: 28px;
}
.mvArea .slideCont {
  opacity: 0.7;
  padding: 0 10px;
  transition: opacity 0.4s;
}
.mvArea .slideCont a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.mvArea .slideCont a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .mvArea .slideCont a:hover {
    opacity: 1;
  }
}
.mvArea .slideCont.slick-current {
  opacity: 1;
}
.mvArea .slideCont img {
  max-width: 100%;
}
.mvArea .slick-arrow {
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 50%;
  height: 80px;
  width: 80px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -40px;
  position: absolute;
  top: 50%;
  right: 5%;
  z-index: 20;
}
.mvArea .slick-arrow:before {
  background: url("../img/common/arrow02.svg") no-repeat 0 0;
  background-size: 100%;
  content: "";
  height: 20px;
  display: block;
  width: 10px;
}
.mvArea .slick-arrow.prev {
  right: auto;
  left: 5%;
}
.mvArea .slick-arrow.prev:before {
  transform: scale(-1, 1);
}
.mvArea .slick-dots {
  display: flex;
  justify-content: center;
  position: absolute;
  bottom: -30px;
  left: 0;
  right: 0;
}
.mvArea .slick-dots li {
  margin: 0 5px;
}
.mvArea .slick-dots li button {
  background-color: #F8C9CD;
  border: none;
  border-radius: 50%;
  height: 6px;
  padding: 0;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  width: 6px;
}
.mvArea .slick-dots li.slick-active button {
  background-color: #E60013;
}

.mvLinkArea {
  box-sizing: border-box;
  max-width: 1600px;
  margin: 0 auto;
  padding: 10px 20px 28px;
  position: relative;
}
.mvLinkArea .appAnchor {
  position: absolute;
  bottom: -120px;
  right: 40px;
  z-index: 50;
}
.mvLinkArea .appAnchor img {
  width: 185px;
}
.mvLinkArea .appAnchor a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.mvLinkArea .appAnchor a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .mvLinkArea .appAnchor a:hover {
    opacity: 1;
  }
}
.mvLinkArea ul {
  display: flex;
  justify-content: space-between;
}
.mvLinkArea ul li {
  width: 32.478%;
}
.mvLinkArea ul li a {
  background-color: #FAF953;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 40px 0 80px;
  transition: opacity 0.6s;
  text-decoration: none;
}
.mvLinkArea ul li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .mvLinkArea ul li a:hover {
    opacity: 1;
  }
}
.mvLinkArea ul li a:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 146px;
  width: 61px;
  background-image: url("../img/index/banner_image01.png");
}
.mvLinkArea ul li a p {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  font-size: 160%;
  font-weight: 700;
  min-width: 250px;
  text-align: center;
}
.mvLinkArea ul li a p:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 29px;
  width: 22px;
  background-image: url("../img/common/nav_icon01.svg");
  margin: 0 auto 12px;
}
.mvLinkArea ul li a p span {
  background-color: #fff;
  border-radius: 22px;
  font-size: 58%;
  margin-top: 12px;
  line-height: 120%;
  padding: 5px 12px;
}
.mvLinkArea ul li a p br {
  display: none;
}
.mvLinkArea ul li.link02 {
  transition-delay: 0.5s;
}
.mvLinkArea ul li.link02 a {
  background-color: #98DFF5;
}
.mvLinkArea ul li.link02 a:before {
  background-image: url("../img/index/banner_image02.png");
  height: 150px;
  width: 84px;
}
.mvLinkArea ul li.link02 a p:before {
  background-image: url("../img/common/nav_icon02.svg");
}
.mvLinkArea ul li.link03 {
  transition-delay: 1s;
}
.mvLinkArea ul li.link03 a {
  background-color: #93F29F;
}
.mvLinkArea ul li.link03 a:before {
  background-image: url("../img/index/banner_image03.png");
  height: 152px;
  width: 85px;
}
.mvLinkArea ul li.link03 a p:before {
  background-image: url("../img/common/nav_icon04.svg");
  height: 24px;
  width: 24px;
}
@media screen and (max-width: 1540px) {
  .mvLinkArea ul li a {
    padding: 0 40px 0 40px;
  }
}
@media screen and (max-width: 1400px) {
  .mvLinkArea ul li a {
    padding: 0 20px;
  }
  .mvLinkArea ul li a p {
    font-size: 130%;
    min-width: 230px;
  }
}
@media screen and (max-width: 1140px) {
  .mvLinkArea ul li a {
    padding: 0 20px;
  }
  .mvLinkArea ul li a p {
    font-size: 115%;
    min-width: 190px;
  }
}

.topUse {
  background-color: #FCEE21;
  padding: 0 20px;
}
.topUse .secCont {
  max-width: 1400px;
  margin: 0 auto;
  padding: 100px 0 90px;
  position: relative;
  text-align: center;
}
.topUse .secCont:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 275px;
  width: 177px;
  background-image: url("../img/index/bg01.png");
  position: absolute;
  top: 50px;
  left: 100px;
}
.topUse .secCont:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 316px;
  width: 219px;
  background-image: url("../img/index/bg02.png");
  position: absolute;
  bottom: -90px;
  right: 30px;
}
@media screen and (max-width: 1220px) {
  .topUse .secCont:before {
    left: 0;
  }
  .topUse .secCont:after {
    right: 0;
  }
}
.topUse h2 {
  font-size: 230%;
  font-weight: 700;
  margin: 0 auto 35px;
  letter-spacing: -0.01em;
}
.topUse h2 span {
  display: inline-block;
}
.topUse h2 span:nth-child(1) {
  transition-delay: 0.06s;
}
.topUse h2 span:nth-child(2) {
  transition-delay: 0.12s;
}
.topUse h2 span:nth-child(3) {
  transition-delay: 0.18s;
}
.topUse h2 span:nth-child(4) {
  transition-delay: 0.24s;
}
.topUse h2 span:nth-child(5) {
  transition-delay: 0.3s;
}
.topUse h2 span:nth-child(6) {
  transition-delay: 0.36s;
}
.topUse h2 span:nth-child(7) {
  transition-delay: 0.42s;
}
.topUse h2 span:nth-child(8) {
  transition-delay: 0.48s;
}
.topUse h2 span:nth-child(9) {
  transition-delay: 0.54s;
}
.topUse h2 span:nth-child(10) {
  transition-delay: 0.6s;
}
.topUse h2 span:nth-child(11) {
  transition-delay: 0.66s;
}
.topUse h2 span:nth-child(12) {
  transition-delay: 0.72s;
}
.topUse h2 span:nth-child(13) {
  transition-delay: 0.78s;
}
.topUse h2 span:nth-child(14) {
  transition-delay: 0.84s;
}
.topUse h2 span:nth-child(15) {
  transition-delay: 0.9s;
}
.topUse h2 span:nth-child(16) {
  transition-delay: 0.96s;
}
.topUse h2 span:nth-child(17) {
  transition-delay: 1.02s;
}
.topUse h2 span:nth-child(18) {
  transition-delay: 1.08s;
}
.topUse h2 span:nth-child(19) {
  transition-delay: 1.14s;
}
.topUse h2 span:nth-child(20) {
  transition-delay: 1.2s;
}
.topUse p {
  font-size: 106%;
  font-weight: 700;
  margin: 0 auto 45px;
}
.topUse p.notice {
  font-size: 73%;
  font-weight: 500;
  max-width: 710px;
  margin: 0 auto;
  text-align: center;
}
.topUse .useList {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  max-width: 760px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.topUse .useList li {
  background-color: #fff;
  margin: 0 1% 18px;
  width: 17%;
}
.topUse .useList li a {
  height: 120px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: opacity 0.6s;
  text-decoration: none;
  position: relative;
}
.topUse .useList li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .topUse .useList li a:hover {
    opacity: 1;
  }
}
.topUse .useList li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 10px;
  width: 10px;
  background-image: url("../img/common/blank2.svg");
  position: absolute;
  bottom: 6px;
  right: 6px;
}
.topUse .useList li a img {
  width: 94px;
}

.topApp {
  background: linear-gradient(0deg, #fff 0%, #fff 50%, #FCEE21 50%, #FCEE21 100%);
  margin-bottom: 80px;
  padding: 60px 20px 0;
}
.topApp .secCont {
  background: url("../img/index/bg04.png") repeat 50% 0, linear-gradient(179deg, #E60013 0%, #E87A83 100%);
  background-size: 100%;
  border-radius: 10px;
  box-sizing: border-box;
  max-width: 1400px;
  margin: 0 auto;
  padding: 60px 20px 60px;
  position: relative;
  text-align: center;
}
.topApp .topAppCont {
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}
.topApp .topAppCont:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 373px;
  width: 210px;
  background-image: url("../img/index/bg03.png");
  position: absolute;
  top: 155px;
  left: 0px;
}
.topApp h2 {
  margin: 0 auto 45px;
  max-width: 720px;
}
.topApp h2 img {
  max-width: 100%;
}
.topApp .topAppDetail {
  margin: 0 0 60px auto;
  width: 74.4%;
}
.topApp .topAppInfo {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.topApp .topAppInfo li {
  background-color: #FFD8D8;
  border-radius: 10px;
  box-sizing: border-box;
  color: #E60013;
  font-weight: 700;
  font-size: 160%;
  line-height: 150%;
  padding: 20% 10px 25px;
  position: relative;
  width: 31.45%;
}
.topApp .topAppInfo li:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 134px;
  width: 234px;
  background-image: url("../img/index/pict01.png");
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
}
.topApp .topAppInfo li:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 82px;
  width: 82px;
  background-image: url("../img/index/info01.png");
  position: absolute;
  top: 65px;
  left: -10px;
}
.topApp .topAppInfo li:nth-child(2):before {
  background-image: url("../img/index/pict02.png");
}
.topApp .topAppInfo li:nth-child(2):after {
  /*background-image: url("../img/index/info02.png");*/
  background-image: url("../img/index/info03.png");
}
.topApp .topAppInfo li:nth-child(3):before {
  background-image: url("../img/index/pict03.png");
}
.topApp .topAppInfo li:nth-child(3):after {
  /*background-image: url("../img/index/info03.png");*/
  background-image: url("../img/index/info02.png");
}
.topApp p {
  color: #fff;
  font-size: 106%;
  font-weight: 700;
  max-width: 410px;
  margin: 0 auto 30px;
}
.topApp p sub {
  font-size: 45%;
  line-height: 120%;
}
.topApp p.attention {
  font-size: 73%;
  font-weight: 500;
  margin: 0 auto;
  text-align: left;
}
.topApp p.attention a {
  color: #fff;
  text-decoration: underline;
}
.topApp p.attention a:hover {
  text-decoration: none;
}
.topApp .link {
  background-color: #fff;
  border-radius: 90px;
  margin: 0 auto 30px;
  width: 400px;
}
.topApp .link a {
  background-color: #FCEE21;
  box-shadow: 0px 3px 0px #D6CB29;
  border-radius: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90px;
  font-size: 133%;
  font-weight: 700;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.topApp .link a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .topApp .link a:hover {
    opacity: 1;
  }
}
.topApp .link a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow03.svg");
  position: absolute;
  top: 38px;
  right: 40px;
}
.topApp .appDetailLinkArea {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.topApp .appDetailLinkArea p {
  margin: 0;
  letter-spacing: -0.02em;
  text-align: left;
  width: 50%;
}
.topApp .appDetailLinkArea .link {
  margin: 0;
  width: 44%;
}
.topApp h3 {
  color: #fff;
  font-size: 106%;
  font-weight: 700;
  margin: 0 auto 10px;
}
.topApp .appLink {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
}
.topApp .appLink li {
  margin: 0 2px;
}
.topApp .appLink li a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.topApp .appLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .topApp .appLink li a:hover {
    opacity: 1;
  }
}
.topApp .appLink li img {
  height: 63px;
}

.topService {
  margin-bottom: 80px;
  padding: 0 20px;
}
.topService .secCont {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
}
.topService h2 {
  border-bottom: 4px solid #E60013;
  display: inline-block;
  font-size: 213%;
  font-weight: 700;
  margin-bottom: 50px;
  padding: 0 0 5px 40px;
  position: relative;
}
.topService h2:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 35px;
  width: 22px;
  background-image: url("../img/index/h203icon.svg");
  position: absolute;
  top: 8px;
  left: 2px;
}
.topService .serviceList {
  display: flex;
  flex-wrap: wrap;
}
.topService .serviceList li {
  border-radius: 10px;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  margin: 0 2% 20px 0;
  width: 32%;
}
.topService .serviceList li:nth-child(3n) {
  margin-right: 0;
}
.topService .serviceList li a {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding: 40px 0 40px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.topService .serviceList li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .topService .serviceList li a:hover {
    opacity: 1;
  }
}
.topService .serviceList li a.blank:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 10px;
  width: 10px;
  background-image: url("../img/common/blank.svg");
  position: absolute;
  bottom: 12px;
  right: 12px;
}
.topService .serviceList li a .pict {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 140px;
  max-width: 210px;
  margin: 0 auto 25px;
  width: 80%;
}
.topService .serviceList li a .pict img {
  width: 100%;
}
.topService .serviceList li a dl {
  padding: 0 20px;
  text-align: center;
}
.topService .serviceList li a dl dt {
  font-size: 86%;
  font-weight: 700;
  margin-bottom: 5px;
}
.topService .serviceList li a dl dd {
  font-size: 120%;
  font-weight: 700;
}
.topService .serviceList li:nth-child(4), .topService .serviceList li:nth-child(5), .topService .serviceList li:nth-child(6) {
  transition-delay: 0.5s;
}
.topService .serviceList li:nth-child(7), .topService .serviceList li:nth-child(8), .topService .serviceList li:nth-child(9) {
  transition-delay: 1s;
}
.topService .serviceList li:nth-child(10), .topService .serviceList li:nth-child(11), .topService .serviceList li:nth-child(12) {
  transition-delay: 1.5s;
}

.topNews {
  background-color: #FFEAEA;
  margin-bottom: 100px;
  padding: 0 20px;
}
.topNews .secCont {
  max-width: 1000px;
  margin: 0 auto;
  padding: 80px 0 60px;
}
.topNews h2 {
  border-bottom: 4px solid #E60013;
  display: inline-block;
  font-size: 213%;
  font-weight: 700;
  margin-bottom: 50px;
  padding: 0 0 5px 50px;
  position: relative;
}
.topNews h2:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 27px;
  width: 31px;
  background-image: url("../img/index/h204icon.svg");
  position: absolute;
  top: 14px;
  left: 0px;
}
.topNews table th {
  border-top: 1px solid #E60013;
  box-sizing: border-box;
  padding: 25px 10px 25px 20px;
  width: 230px;
}
.topNews table th span {
  background-color: #fff;
  color: #E60013;
  font-size: 80%;
  display: inline-block;
  line-height: 120%;
  margin-left: 10px;
  padding: 4px 8px;
}
.topNews table td {
  border-top: 1px solid #E2D6D6;
  box-sizing: border-box;
  padding: 25px 20px;
}

.topLinkArea {
  max-width: 1000px;
  margin: 0 auto 100px;
  padding: 0 20px;
}
.topLinkArea .troubleLink {
  margin-bottom: 35px;
}
.topLinkArea p {
  text-align: right;
}
.topLinkArea p a {
  color: #E60013;
  transition: opacity 0.6s;
  text-decoration: none;
}
.topLinkArea p a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .topLinkArea p a:hover {
    opacity: 1;
  }
}
.topLinkArea p a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  display: inline-block;
  margin-left: 12px;
  vertical-align: -0.02em;
}

.troubleLink {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.troubleLink li {
  width: 32%;
}
.troubleLink li a {
  border: 2px solid #E60013;
  border-radius: 8px;
  color: #E60013;
  font-size: 120%;
  font-weight: 700;
  display: flex;
  align-items: center;
  height: 100px;
  padding: 0 30px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.troubleLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .troubleLink li a:hover {
    opacity: 1;
  }
}
.troubleLink li a:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 27px;
  width: 30px;
  background-image: url("../img/index/link_icon01.svg");
  margin-right: 15px;
}
.troubleLink li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin-top: -6px;
  position: absolute;
  top: 50%;
  right: 30px;
}
@media screen and (max-width: 1000px) {
  .troubleLink li a {
    padding: 0 20px;
  }
  .troubleLink li a:after {
    right: 20px;
  }
}
@media screen and (max-width: 940px) {
  .troubleLink li a {
    font-size: 105%;
    padding: 0 20px 0 15px;
  }
  .troubleLink li a:after {
    right: 15px;
  }
}
.troubleLink li:nth-child(2) {
  transition-delay: 0.5s;
}
.troubleLink li:nth-child(2) a:before {
  background-image: url("../img/index/link_icon02.svg");
  height: 32px;
  width: 20px;
}
.troubleLink li:nth-child(3) {
  transition-delay: 1s;
}
.troubleLink li:nth-child(3) a:before {
  background-image: url("../img/index/link_icon03.svg");
  height: 26px;
  widows: 30px;
}

/******** temp ********/
.alCenter {
  text-align: center;
}

.alRight {
  text-align: right;
}

.pt0 {
  padding-top: 0 !important;
}

.mt0 {
  margin-top: 0 !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.comments {
    text-align: center;
}

.secCont {
  max-width: 1000px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
}

.mainTitle {
  background: url("../img/common/titlebg.png") repeat;
  background-size: 110px;
  box-sizing: border-box;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 326px;
  margin: 0 auto 60px;
  padding: 0 20px 40px;
  position: relative;
}
.mainTitle:after {
  background-color: #fff;
  border-radius: 40px 40px 0 0;
  box-sizing: border-box;
  content: "";
  height: 40px;
  display: block;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
}
.mainTitle h1 {
  color: #fff;
  font-size: 266%;
  font-weight: 700;
  line-height: 140%;
  position: relative;
  text-align: center;
}
.mainTitle h1 .parentCate {
  font-size: 45%;
  line-height: 130%;
  display: block;
}
.mainTitle h1 .titleIcon {
  background-color: #fff;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 68px;
  margin: 0 auto 15px;
  position: relative;
  width: 68px;
}
.mainTitle h1 .titleIcon:after {
  background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #fff 50.5%) no-repeat top left/50% 100%, linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, #fff 50.5%) no-repeat top right/50% 100%;
  content: "";
  display: block;
  height: 10px;
  width: 10px;
  margin: 0 auto;
  position: absolute;
  bottom: -7px;
  left: 0;
  right: 0;
}
.mainTitle h1 .titleIcon img {
  width: 29px;
}
.mainTitle h1 .guideSub {
  background-color: #FCEE21;
  border-radius: 26px;
  color: #000;
  font-size: 50%;
  display: block;
  line-height: 120%;
  margin: 5px auto 0;
  padding: 6px 0;
  width: 100px;
}
.mainTitle p {
  color: #fff;
  font-weight: 700;
  font-size: 106%;
  max-width: 610px;
  margin: 20px auto 0;
  text-align: center;
}

.breadcrumb {
  margin: 20px auto;
  max-width: 1400px;
  padding: 0 20px;
}
.breadcrumb ol {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.breadcrumb ol li {
  font-size: 80%;
  line-height: 120%;
}
.breadcrumb ol li:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 6px;
  width: 4px;
  background-image: url("../img/common/arrow05.svg");
  display: inline-block;
  margin: 0 10px 2px 15px;
}
.breadcrumb ol li:first-child:before {
  display: none;
}
.breadcrumb ol li a {
  color: #E60013;
}
.breadcrumb ol li a:hover {
  text-decoration: underline;
}

.titleStyle01 {
  border-bottom: 4px solid #E60013;
  display: inline-block;
  font-size: 213%;
  font-weight: 700;
  margin: 100px auto 60px;
  line-height: 150%;
  letter-spacing: -0.01em;
  padding-bottom: 6px;
  position: relative;
}
.titleStyle01 .sub {
  background-color: #D8D8D8;
  border-radius: 26px;
  font-size: 44%;
  display: inline-block;
  line-height: 130%;
  margin: 0 0 0 10px;
  vertical-align: middle;
  padding: 5px 15px;
}
.titleStyle01 sub {
  font-size: 50%;
  font-weight: 500;
  position: absolute;
  right: -25px;
  bottom: 0;
}
@media screen and (max-width: 830px) {
  .titleStyle01 sub {
    margin: 0 0 0 5px;
    vertical-align: -0.2em;
    position: relative;
    right: auto;
    bottom: auto;
  }
}
.titleStyle01:first-of-type {
  margin-top: 0;
}
.titleStyle01.pickupTitle {
  position: relative;
}
.titleStyle01.pickupTitle:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 60px;
  width: 88px;
  background-image: url("../img/campaign/pickup.png");
  position: absolute;
  top: -32px;
  right: -65px;
}
.titleStyle01.troubleTitle {
  margin-left: 45px;
}
.titleStyle01.troubleTitle:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 31px;
  width: 31px;
  background-image: url("../img/common/nav_icon04.svg");
  position: absolute;
  top: 8px;
  left: -45px;
}
.titleStyle01 + .titleStyle02 {
  margin-top: 0;
}
.titleStyle01.type2 {
  background-color: #ff9898;
  border-radius: 10px 10px 0 0;
  border: none;
  color: #fff;
  font-size: 160%;
  display: block;
  margin-bottom: 40px;
  padding: 20px;
}

.titleStyle02 {
  font-size: 186%;
  font-weight: 700;
  margin-top: 60px;
  margin-bottom: 40px;
  padding-left: 25px;
  position: relative;
}
.titleStyle02:before {
  background: linear-gradient(0deg, #FCEE21 0%, #FCEE21 50%, #E60013 50%, #E60013 100%);
  content: "";
  height: 20px;
  display: block;
  position: absolute;
  top: 10px;
  left: 0px;
  width: 8px;
}
.titleStyle02:first-of-type {
  margin-top: 0;
}
.titleStyle02 sub {
  font-size: 42%;
  font-weight: 500;
  line-height: 120%;
  margin: 0 3px;
  display: inline-block;
  vertical-align: -0.2em;
}

.titleStyle03 {
  border-bottom: 1px solid #E60013;
  font-size: 133%;
  font-weight: 700;
  margin-top: 40px;
  margin-bottom: 20px;
  padding: 0 0 8px;
  line-height: 130%;
  position: relative;
}

.titleStyle04 {
  font-size: 133%;
  font-weight: 700;
  margin-top: 50px;
  margin-bottom: 20px;
}

.titleStyle04 {
  font-size: 133%;
  font-weight: 700;
  margin-top: 30px;
  margin-bottom: 25px;
}
.titleStyle04:first-of-type {
  margin-top: 0;
}

.pict img,
.fig img {
  max-width: 100%;
}

.fig {
  text-align: center;
}

.noticeArea {
  background-color: #FFEAEA;
  box-sizing: border-box;
  margin-bottom: 40px;
  padding: 20px;
}
.noticeArea dl dt {
  font-weight: 700;
  margin-bottom: 5px;
}
.noticeArea .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}

.anchorLink {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 100px;
}
.anchorLink li {
  margin: 0 0.2% 20px 0;
  width: 33.2%;
}
.anchorLink li:nth-child(3n) {
  margin-right: 0;
}
.anchorLink li:nth-child(3n) a {
  border-radius: 0 5px 5px 0;
}
.anchorLink li:nth-child(3n+1) a {
  border-radius: 5px 0 0 5px;
}
.anchorLink li:last-child a {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}
.anchorLink li a {
  background-color: #EFEFEF;
  box-sizing: border-box;
  height: 100%;
  display: flex;
  align-items: center;
  font-size: 133%;
  font-weight: 700;
  min-height: 85px;
  padding: 15px 45px 15px 25px;
  letter-spacing: -0.05em;
  position: relative;
  transition: background-color 0.4s;
}
.anchorLink li a .icon {
  background-color: #ADADAD;
  border-radius: 50%;
  height: 26px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -13px;
  position: absolute;
  top: 50%;
  right: 14px;
  width: 26px;
  transition: background-color 0.4s;
}
.anchorLink li a .icon:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow02.svg");
  transform: rotate(90deg);
}
.anchorLink li a:hover {
  background-color: #FF9898;
  color: #fff;
}
.anchorLink li a:hover .icon {
  background-color: #E60013;
}
.anchorLink.type2 li {
  width: 49.9%;
}
.anchorLink.type2 li:nth-of-type(2n) {
  margin-right: 0;
}

.tabNav {
  border-bottom: 2px solid #ADADAD;
  display: flex;
  justify-content: center;
  margin: 0 auto 80px;
}
.tabNav li {
  box-sizing: border-box;
  margin: 0 1%;
  width: 41%;
}
.tabNav li a {
  border: 2px solid #EFEFEF;
  border-bottom: none;
  background-color: #EFEFEF;
  border-radius: 5px 5px 0 0;
  color: #ADADAD;
  font-size: 133%;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100px;
  position: relative;
  transition: all 0.4s;
}
.tabNav li a:before {
  background-color: #fff;
  content: "";
  height: 2px;
  opacity: 0;
  position: absolute;
  bottom: -2px;
  left: 0px;
  width: 100%;
  transition: all 0.4s;
}
.tabNav li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow07.svg");
  opacity: 0;
  margin: 0 auto;
  position: absolute;
  bottom: 5px;
  left: 0;
  right: 0;
  transform: rotate(90deg);
}
.tabNav li a:hover {
  background-color: #fff;
  border-color: #ADADAD;
  color: #8D8D8D;
}
.tabNav li a:hover:before {
  opacity: 1;
}
.tabNav li a.c {
  background-color: #fff;
  border-color: #ADADAD;
  color: #8D8D8D;
}
.tabNav li a.c:after, .tabNav li a.c:before {
  opacity: 1;
}

.tabCont {
  display: none;
  visibility: hidden;
  height: 0;
  overflow: hidden;
  padding: 0;
}
.tabCont.c {
  display: block;
  visibility: visible;
  height: auto;
  overflow: visible;
}

table.tableStyle01 th {
  background-color: #EFEFEF;
  box-sizing: border-box;
  border: 1px solid #D8D8D8;
  font-weight: 700;
  padding: 15px 20px;
  vertical-align: middle;
  text-align: center;
  width: 200px;
}
table.tableStyle01 td {
  border: 1px solid #D8D8D8;
  box-sizing: border-box;
  padding: 15px 20px;
  vertical-align: middle;
}
table.tableStyle02 th {
  background-color: #EFEFEF;
  box-sizing: border-box;
  border: 1px solid #D8D8D8;
  font-weight: 700;
  line-height: 140%;
  padding: 15px 20px;
  text-align: center;
}
table.tableStyle02 td {
  border: 1px solid #D8D8D8;
  line-height: 140%;
  padding: 15px 20px;
  text-align: center;
}

p {
  margin-bottom: 25px;
}
p.mainLead {
  font-size: 133%;
  font-weight: 700;
  margin: 0 auto 60px;
  text-align: center;
}
p.leftLead {
  font-size: 133%;
  font-weight: 700;
}

a.linkStyle01 {
  color: #E60013;
}
a.linkStyle01:hover {
  text-decoration: underline;
}
a.linkStyle02 {
  color: #E60013;
  margin-right: 3px;
  transition: opacity 0.6s;
  text-decoration: none;
}
a.linkStyle02:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  a.linkStyle02:hover {
    opacity: 1;
  }
}
a.linkStyle02:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 6px;
  width: 3px;
  background-image: url("../img/common/arrow01.svg");
  display: inline-block;
  margin: 0 0 2px 5px;
}
a.linkStyle02.blank:after {
  background-image: url("../img/common/blank4.svg");
  height: 12px;
  margin-bottom: 0;
  width: 12px;
}
a.linkStyle02.pdf:after {
  background-image: url("../img/common/pdf.svg");
  height: 10px;
  margin-bottom: 0;
  width: 8px;
}

span.red {
  color: #E60013;
  font-weight: 700;
}
span.gray {
  color: #8D8D8D;
}
span.small {
  font-size: 66%;
  display: inline-block;
  line-height: 130%;
}
span.innerIndent {
  display: block;
  padding-left: 1em;
  text-indent: -1em;
}

ul.indentList li {
  padding-left: 1em;
  text-indent: -1em;
}
ul.indentList.small {
  margin-top: -10px;
}
ul.indentList.small li {
  font-size: 93%;
}
ul.noticeList li {
  padding-left: 1.3em;
  text-indent: -1.3em;
}
ul.numList li {
  padding-left: 1em;
  text-indent: -1em;
}
ul.circleList li {
  margin-bottom: 10px;
  letter-spacing: -0.02em;
  padding-left: 20px;
  position: relative;
}
ul.circleList li:before {
  background-color: #E60013;
  border-radius: 50%;
  content: "";
  height: 8px;
  display: block;
  position: absolute;
  top: 7px;
  left: 0px;
  width: 8px;
}
ul.circleList li:last-child {
  margin-bottom: 0;
}
ul.numList2 > li {
  margin-bottom: 10px;
  padding-left: 30px;
  position: relative;
}
ul.numList2 > li:before {
  position: absolute;
  top: 0px;
  left: 0px;
  letter-spacing: -0.05em;
}
ul.numList2 > li:nth-child(1):before {
  content: "(1)";
}
ul.numList2 > li:nth-child(2):before {
  content: "(2)";
}
ul.numList2 > li:nth-child(3):before {
  content: "(3)";
}
ul.numList2 > li:nth-child(4):before {
  content: "(4)";
}
ul.numList2 > li:nth-child(5):before {
  content: "(5)";
}
ul.numList2 > li:nth-child(6):before {
  content: "(6)";
}
ul.numList2 > li:nth-child(7):before {
  content: "(7)";
}
ul.numList2 > li:nth-child(8):before {
  content: "(8)";
}
ul.numList2 > li:nth-child(9):before {
  content: "(9)";
}
ul.numList2 > li:nth-child(10):before {
  content: "(10)";
}
ul.numList2 > li:nth-child(11):before {
  content: "(11)";
}
ul.numList2 > li:nth-child(12):before {
  content: "(12)";
}
ul.numList2 > li:nth-child(13):before {
  content: "(13)";
}
ul.numList2 > li:nth-child(14):before {
  content: "(14)";
}
ul.numList2 > li:nth-child(15):before {
  content: "(15)";
}
ul.numList2 > li:nth-child(16):before {
  content: "(16)";
}
ul.numList2 > li:nth-child(17):before {
  content: "(17)";
}
ul.numList2 > li:nth-child(18):before {
  content: "(18)";
}
ul.numList2 > li:nth-child(19):before {
  content: "(19)";
}
ul.numList2 > li:nth-child(20):before {
  content: "(20)";
}
ul.numList2 > li a {
  color: #E60013;
  text-decoration: underline;
}
ul.numList2 > li a:hover {
  text-decoration: none;
}
ul.numList2 > li ul {
  margin-top: 5px;
}
ul.numList3 li {
  padding-left: 2em;
  text-indent: -2em;
}

.accordionArea dl {
  margin-bottom: 2px;
}
.accordionArea dl dt {
  background: #EFEFEF;
  box-sizing: border-box;
  color: #8D8D8D;
  cursor: pointer;
  display: flex;
  font-weight: 700;
  height: 60px;
  align-items: center;
  padding: 20px 70px 20px 20px;
  position: relative;
  transition: all 0.6s;
}
.accordionArea dl dt:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 18px;
  width: 18px;
  background-image: url("../img/common/plus.svg");
  position: absolute;
  top: 20px;
  right: 25px;
}
.accordionArea dl dd {
  box-sizing: border-box;
  visibility: hidden;
  height: 0;
  overflow: hidden;
  padding: 0 20px;
  position: relative;
  transition: all 0.6s;
}
.accordionArea dl dd strong {
  font-size: 110%;
}
.accordionArea dl dd a {
  color: #E60013;
  text-decoration: underline;
}
.accordionArea dl dd a:hover {
  text-decoration: none;
}
.accordionArea dl dd a[href*="tel:"] {
  color: #000;
  pointer-events: none;
  text-decoration: none;
}
.accordionArea dl dd p:last-of-type {
  margin-bottom: 0;
}
.accordionArea dl.show dt {
  background-color: #FCEE21;
  color: #000;
}
.accordionArea dl.show dt:after {
  background-image: url("../img/common/minus.svg");
  top: 27px;
}
.accordionArea dl.show dd {
  visibility: visible;
  height: auto;
  padding-top: 25px;
  padding-bottom: 25px;
}

.select-area {
  border: 1px solid #A0A2AF;
  border-radius: 2px;
  position: relative;
  width: 340px;
}
.select-area:after {
  content: "";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: #888B9B;
  font-size: 70%;
  position: absolute;
  top: 14px;
  right: 12px;
}
.select-area select {
  box-sizing: border-box;
  width: 100%;
  padding-right: 1em;
  cursor: pointer;
  text-indent: 0.01px;
  text-overflow: ellipsis;
  border: none;
  height: 50px;
  outline: none;
  background: transparent;
  background-image: none;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
  padding: 4px 36px 4px 10px;
  position: relative;
  z-index: 2;
}
.select-area select::-ms-expand {
  display: none;
}

input[type="checkbox"] {
  display: none;
}
input[type="checkbox"] + label {
  cursor: pointer;
  display: inline-block;
  padding-left: 40px;
  position: relative;
}
input[type="checkbox"] + label:before {
  background: url("../img/common/check.png") no-repeat 0 0;
  background-size: 100%;
  content: "";
  height: 30px;
  width: 30px;
  display: block;
  position: absolute;
  top: -2px;
  left: 0px;
}
input[type="checkbox"]:checked + label:before {
  background-position: 0 100%;
}

input[type="radio"] {
  display: none;
}
input[type="radio"] + label {
  cursor: pointer;
  display: inline-block;
  padding-left: 40px;
  position: relative;
}
input[type="radio"] + label:before {
  background: url(../img/common/radio.png) no-repeat 0 0;
  background-size: 100%;
  content: "";
  display: block;
  height: 30px;
  width: 30px;
  position: absolute;
  top: -2px;
  left: 0px;
}
input[type="radio"]:checked + label:before {
  background-position: 0 100%;
}

.stepArea {
  padding-left: 10px;
}
.stepArea .stepCont {
  background-color: #EFEFEF;
  margin-bottom: 40px;
  padding: 30px 30px 30px 75px;
  position: relative;
}
.stepArea .stepCont .stepNum {
  background-color: #FCEE21;
  color: #ADADAD;
  font-family: Arial, Helvetica, "sans-serif";
  font-weight: 700;
  font-size: 240%;
  height: 78px;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  line-height: 100%;
  text-align: center;
  position: absolute;
  top: -10px;
  left: -10px;
  width: 66px;
}
.stepArea .stepCont .stepNum span {
  display: block;
  font-size: 41%;
  line-height: 120%;
  letter-spacing: -0.02em;
}
.stepArea .stepCont .stepPictArea {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.stepArea .stepCont .stepPictArea .detail {
  width: 75%;
}
.stepArea .stepCont .stepPictArea .pict {
  width: 22.5%;
}
.stepArea .stepCont p {
  font-size: 133%;
  font-weight: 700;
  margin: 0;
}
.stepArea .stepCont p span {
  font-weight: 500;
}
.stepArea .stepCont p span.notice {
  font-size: 75%;
  font-weight: 700;
  margin-left: 10px;
}
.stepArea .stepCont p span.notice2 {
  font-size: 90%;
}
.stepArea .stepCont p .linkStyle02 {
  font-size: 75%;
  font-weight: 500;
}
.stepArea .stepCont p .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}
.stepArea .stepCont .chargeStepInfo dt {
  background-color: #ADADAD;
  border-radius: 33px;
  color: #fff;
  font-size: 120%;
  display: inline-block;
  padding: 0 10px;
}
.stepArea .stepCont .chargeStepInfo dd {
  font-size: 133%;
  margin: 10px 0;
}
.stepArea .stepCont .pict {
  position: relative;
  width: 22.5%;
}
.stepArea .stepCont .pict .pictMore {
  background-color: #8D8D8D;
  border-radius: 50%;
  height: 26px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 26px;
}
.stepArea .stepCont .pict .pictMore:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 13px;
  width: 13px;
  background-image: url("../img/common/search.svg");
}
.stepArea .stepCont .supportStep {
  margin-top: 30px;
  padding: 0;
}
.stepArea .stepCont .stepCardInfo {
  border-top: 2px solid #E60013;
  border-bottom: 2px solid #E60013;
  margin-top: 25px;
  padding: 20px 0 80px;
}
.stepArea .stepCont .stepCardInfo dl {
  margin-bottom: 30px;
}
.stepArea .stepCont .stepCardInfo dl dt {
  color: #E60013;
  font-size: 120%;
  font-weight: 700;
}
.stepArea .stepCont .stepCardInfo dl dd {
  font-weight: 700;
  margin: 15px 0 0;
}
.stepArea .stepCont .stepCardInfo dl dd.link {
  font-weight: 500;
}
.stepArea .stepCont .stepCardInfo dl dd.link a {
  color: #E60013;
  transition: opacity 0.6s;
  text-decoration: none;
}
.stepArea .stepCont .stepCardInfo dl dd.link a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .stepArea .stepCont .stepCardInfo dl dd.link a:hover {
    opacity: 1;
  }
}
.stepArea .stepCont .stepCardInfo dl dd.link a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  display: inline-block;
  vertical-align: -0.1em;
  margin-left: 12px;
}
.stepArea .stepCont .stepCardInfo .chargeCard li {
  padding: 10px 0;
}
.stepArea .stepCont .stepCardInfo .chargeCard li .pict {
  width: 80%;
}
.stepArea .stepCont .stepCardInfo .chargeCard li p {
  font-size: 100%;
}
.stepArea .stepCont .stepCardInfo .chargeCard li p.notice {
  font-size: 86%;
  top: 210px;
}
.stepArea .stepCont .stepAppCardInfo {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 40px;
}
.stepArea .stepCont .stepAppCardInfo dt {
  font-weight: 700;
  margin: 0 auto 30px;
  text-align: center;
  width: 100%;
}
.stepArea .stepCont .stepAppCardInfo dd {
  width: 49%;
}
.stepArea .stepCont .stepAppCardInfo dd a {
  background-color: #fff;
  border: 2px solid #E60013;
  border-radius: 8px;
  color: #E60013;
  font-size: 120%;
  font-weight: 700;
  display: flex;
  align-items: center;
  height: 100px;
  padding: 0 40px 0 30px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.stepArea .stepCont .stepAppCardInfo dd a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .stepArea .stepCont .stepAppCardInfo dd a:hover {
    opacity: 1;
  }
}
.stepArea .stepCont .stepAppCardInfo dd a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin-top: -6px;
  position: absolute;
  top: 50%;
  right: 20px;
}

.secAppArea {
  background: url("../img/index/bg04.png") repeat 50% 0, linear-gradient(179deg, #E60013 0%, #E87A83 100%);
  background-size: 100%;
  box-sizing: border-box;
  margin: 150px auto 0;
  max-width: 1400px;
  padding: 0 20px;
}
.secAppArea .secAppCont {
  display: flex;
  justify-content: space-between;
  max-width: 1000px;
  margin: 0 auto;
  padding: 75px 0;
}
.secAppArea dl {
  width: 45%;
}
.secAppArea dl dt {
  font-size: 213%;
  color: #fff;
  font-weight: 700;
  margin-bottom: 15px;
}
.secAppArea dl dd {
  color: #fff;
  font-weight: 700;
  font-size: 106%;
}
.secAppArea dl dd sub {
  font-size: 45%;
}
.secAppArea .appLinkArea {
  min-width: 420px;
  width: 42%;
}
.secAppArea p.attention {
  color: #fff;
  font-size: 73%;
  font-weight: 500;
  margin: 0 auto;
  text-align: left;
}
.secAppArea p.attention a {
  color: #fff;
  text-decoration: underline;
}
.secAppArea p.attention a:hover {
  text-decoration: none;
}
.secAppArea .appLink {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
}
.secAppArea .appLink li {
  margin: 0 2px;
}
.secAppArea .appLink li a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.secAppArea .appLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .secAppArea .appLink li a:hover {
    opacity: 1;
  }
}
.secAppArea .appLink li img {
  height: 63px;
}

/******** use_terms ********/
.indentArea {
  margin-top: -5px;
  padding-left: 15px;
}
.indentArea .numTxt {
  margin-bottom: 10px;
  padding-left: 20px;
  position: relative;
}
.indentArea .numTxt span {
  position: absolute;
  top: 0px;
  left: 0px;
}

.telArea {
  border: 2px solid #E60013;
  border-radius: 8px;
  max-width: 560px;
  margin: 0 auto;
  padding: 45px 20px 35px;
  text-align: center;
  position: relative;
}
.telArea dt {
  background-color: #fff;
  color: #E60013;
  font-size: 133%;
  font-weight: 700;
  margin: 0 auto;
  position: absolute;
  top: -16px;
  left: 0;
  right: 0;
  width: 265px;
}
.telArea dd {
  font-weight: 700;
}
.telArea dd.telNum {
  margin: 25px auto 0;
  padding-left: 40px;
  position: relative;
  text-align: left;
  width: 265px;
}
.telArea dd.telNum:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 29px;
  width: 29px;
  background-image: url("../img/common/tel.svg");
  position: absolute;
  top: -4px;
  left: 0px;
}
.telArea dd.telNum a {
  color: #E60013;
  font-size: 240%;
  font-family: Arial, Helvetica, "sans-serif";
  pointer-events: none;
}
.telArea dd.telNum span {
  display: block;
  font-weight: 500;
}

/******** shop ********/
.useList2 {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto 20px;
  position: relative;
  z-index: 2;
}
.useList2 li {
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  border-radius: 8px;
  margin: 0 2% 20px 0;
  width: 32%;
}
.useList2 li:nth-child(3n) {
  margin-right: 0;
}
.useList2 li a {
  box-sizing: border-box;
  height: 240px;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-bottom: 40px;
  transition: opacity 0.6s;
  text-decoration: none;
  position: relative;
}
.useList2 li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .useList2 li a:hover {
    opacity: 1;
  }
}
.useList2 li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 10px;
  width: 10px;
  background-image: url("../img/common/blank2.svg");
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.useList2 li a span {
  font-weight: 700;
  position: absolute;
  top: 185px;
  left: 0;
  right: 0;
  text-align: center;
}
.useList2 li a img {
  width: 162px;
}

/******** campaign ********/
.campaignList {
  display: flex;
  flex-wrap: wrap;
}
.campaignList li {
  margin: 0 2% 45px 0;
  width: 32%;
}
.campaignList li:nth-child(3n) {
  margin-right: 0;
}
.campaignList li a {
  display: block;
  padding-bottom: 40px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.campaignList li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .campaignList li a:hover {
    opacity: 1;
  }
}
.campaignList li .cate {
  background-color: #d7505c;
  border-radius: 10px 0 10px 0;
  color: #fff;
  font-weight: 700;
  line-height: 120%;
  padding: 4px 8px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 5;
}
.campaignList li .cate.cate02 {
  background-color: #5272DD;
}

.campaignList li .cate.cate02:empty {
	background-color: inherit!important;
}
.campaignList li .cate.cate03 {
  background-color: #FCB021;
}
.campaignList li .cate.cate04 {
  background-color: #6bd193;
}
.campaignList li .pict {
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  border-radius: 10px;
  height: 224px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
  position: relative;
}
.campaignList li .pict:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 32px;
  width: 32px;
  background-image: url("../img/campaign/icon.svg");
  position: absolute;
  bottom: 0px;
  right: 0px;
}
.campaignList li .pict img {
  object-fit: cover;
  width: 256px;
}
.campaignList li dl dt {
  font-size: 120%;
  font-weight: 700;
  margin-bottom: 8px;
  letter-spacing: -0.02em;
}
.campaignList li dl dd {
  color: #E60013;
  font-size: 86%;
}
.campaignList li dl dd span {
  color: #8D8D8D;
  display: block;
}
.campaignList li .tag {
  background-color: #FF46AF;
  border-radius: 2px;
  color: #fff;
  line-height: 120%;
  padding: 6px 10px;
  position: absolute;
  bottom: 0px;
  left: 0px;
}

.campaignDetailTitle {
  margin: 70px 0 40px;
}
.campaignDetailTitle .cateInfo {
  display: flex;
  margin-bottom: 20px;
}
.campaignDetailTitle .cateInfo li {
  background-color: #FF46AF;
  border-radius: 2px;
  box-sizing: border-box;
  color: #fff;
  font-size: 120%;
  font-weight: 700;
  line-height: 120%;
  padding: 4px 12px;
}
.campaignDetailTitle .cateInfo li.cate {
  border-radius: 4px;
  background-color: #FCEE21;
  border-color: #FCEE21;
  color: #000;
  margin-right: 5px;
}
.campaignDetailTitle .cateInfo li.cate.cate02 {
  background-color: #5272DD;
  border-color: #5272DD;
  color: #fff;
}
.campaignDetailTitle .cateInfo li.cate.cate03 {
  background-color: #FCB021;
  border-color: #FCB021;
  color: #fff;
}
.campaignDetailTitle .cateInfo li.cate.cate04 {
  background-color: #85E5E2;
  border-color: #85E5E2;
}
.campaignDetailTitle h1 {
  text-align: center;
}
.campaignDetailTitle h1 img {
  max-width: 100%;
}

.targetStore {
  border-top: 1px solid #D8D8D8;
  border-bottom: 1px solid #D8D8D8;
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
  padding: 25px 0 20px;
}
.targetStore dt {
  background-color: #D8D8D8;
  border-radius: 30px;
  font-size: 93%;
  font-weight: 700;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -5px;
  margin-right: 1.5%;
  width: 9%;
}
.targetStore dd {
  width: 89.5%;
}

.rightLink {
  margin-bottom: 30px;
  text-align: right;
}
.rightLink a {
  color: #E60013;
  font-size: 86%;
  transition: opacity 0.6s;
  text-decoration: none;
}
.rightLink a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .rightLink a:hover {
    opacity: 1;
  }
}
.rightLink a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 10px;
  width: 11px;
  background-image: url("../img/campaign/modal.svg");
  display: inline-block;
  margin: 0 0 0 10px;
}

.modalCont {
  display: none;
  min-width: 800px;
}

.modalLink {
  width: 284px;
}
.modalLink a {
  background-color: #FFEAEA;
  box-shadow: 0px 3px 0px #FFBFBF;
  border-radius: 90px;
  height: 55px;
  font-size: 106%;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.modalLink a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .modalLink a:hover {
    opacity: 1;
  }
}
.modalLink a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 11px;
  width: 10px;
  background-image: url("../img/campaign/modal.svg");
  margin-top: -5px;
  position: absolute;
  right: 20px;
  top: 50%;
}

.tempBtn {
  margin: 0 auto;
  width: 534px;
}
.tempBtn a {
  background-color: #FCEE21;
  box-shadow: 0px 3px 0px #D6CB29;
  border-radius: 90px;
  height: 90px;
  font-size: 133%;
  font-weight: 700;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 140%;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.tempBtn a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .tempBtn a:hover {
    opacity: 1;
  }
}
.tempBtn a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow03.svg");
  margin-top: -6px;
  position: absolute;
  right: 40px;
  top: 50%;
}
.tempBtn a.blank:after {
  background-image: url("../img/common/blank.svg");
  height: 10px;
  margin-top: -5px;
  width: 10px;
}
.tempBtn a span {
  font-size: 65%;
  font-weight: 500;
  display: block;
}
@media screen and (min-width:768px){
    .secCont .tempBtn.campaign_disc {
        display: none;
    }
}

/******** support ********/
.processLink {
  display: flex;
  flex-wrap: wrap;
}
.processLink li {
  margin: 0 2% 20px 0;
  width: 32%;
}
.processLink li:nth-child(3n) {
  margin-right: 0;
}
.processLink li a {
  border: 2px solid #E60013;
  border-radius: 8px;
  color: #E60013;
  font-weight: 700;
  font-size: 120%;
  height: 100px;
  display: flex;
  align-items: center;
  padding: 0 30px 0 70px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.processLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .processLink li a:hover {
    opacity: 1;
  }
}
.processLink li a:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 27px;
  width: 30px;
  background-image: url("../img/support/process01.svg");
  margin-top: -13px;
  position: absolute;
  top: 50%;
  left: 25px;
}
.processLink li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin-top: -6px;
  position: absolute;
  top: 50%;
  right: 20px;
}
.processLink li a.processLink02:before {
  background-image: url("../img/support/process02.svg");
  height: 32px;
  margin-top: -16px;
  width: 20px;
}
.processLink li a.processLink03:before {
  background-image: url("../img/support/process03.svg");
  height: 31px;
  margin-top: -16px;
  width: 29px;
}
.processLink li a.processLink04:before {
  background-image: url("../img/support/process04.svg");
  height: 28px;
  margin-top: -14px;
  width: 30px;
}
.processLink li a.processLink05:before {
  background-image: url("../img/support/process05.svg");
  height: 35px;
  margin-top: -17px;
  width: 36px;
}
.processLink li a.processLink06:before {
  background-image: url("../img/support/process06.svg");
  height: 28px;
  margin-top: -14px;
  width: 22px;
}

.faqLinkTitle {
  background-color: #EFEFEF;
  border-radius: 10px 10px 0 0;
  font-size: 133%;
  font-weight: 700;
  line-height: 120%;
  padding: 15px 0 5px;
  text-align: center;
  width: 340px;
}

.faqLinkList {
  background-color: #EFEFEF;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 50px;
  padding: 40px 40px 30px;
}
.faqLinkList li {
  background-color: #fff;
  border-radius: 8px;
  margin: 0 1.1% 10px 0;
  width: 32.6%;
}
.faqLinkList li:nth-child(3n) {
  margin-right: 0;
}
.faqLinkList li a {
  color: #E60013;
  font-weight: 700;
  font-size: 120%;
  height: 100px;
  display: flex;
  align-items: center;
  padding: 0 50px 0 30px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.faqLinkList li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .faqLinkList li a:hover {
    opacity: 1;
  }
}
.faqLinkList li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin-top: -6px;
  position: absolute;
  top: 50%;
  right: 30px;
}

.telInqWrap {
  display: flex;
  justify-content: space-between;
}
.telInqWrap .telInqArea {
  display: block;
  column-count: auto;
  padding: 20px;
  width: 49%;
}
.telInqWrap .telInqArea .telInq {
  margin-right: 0;
}

.telInqArea {
  background-color: #FFEAEA;
  border-radius: 8px;
  box-sizing: border-box;
  column-count: 2;
  padding: 35px 40px 30px;
}
.telInqArea .telInq {
  background-color: #fff;
  border-radius: 8px;
  margin: 0 20px 20px 0;
  padding-bottom: 20px;
}
.telInqArea .telInq dt {
  background-color: #E60013;
  border-radius: 8px 8px 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  height: 80px;
  font-size: 133%;
  font-weight: 700;
  margin-bottom: 45px;
  letter-spacing: -0.02em;
}
.telInqArea .telInq dd {
  min-height: 80px;
  box-sizing: border-box;
  margin: 0 auto;
  padding-left: 50px;
  position: relative;
  width: 340px;
}
.telInqArea .telInq dd:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 35px;
  width: 35px;
  background-image: url("../img/common/tel.svg");
  position: absolute;
  top: -6px;
  left: 0px;
}
.telInqArea .telInq dd a {
  color: #E60013;
  font-size: 280%;
  font-family: Arial, Helvetica, "sans-serif";
  font-weight: 700;
  display: block;
  pointer-events: none;
}
.telInqArea .telInq dd span {
  font-size: 120%;
  display: block;
  margin-top: 8px;
}
.telInqArea .telInq dd span + span {
  font-size: 93%;
  margin-top: 0;
}
.telInqArea .telInfoList {
  margin-bottom: 10px;
}
.telInqArea .telInfoList li {
  font-size: 86%;
  padding-left: 2.7em;
  text-indent: -2.7em;
}

.faqWrap {
  display: flex;
  justify-content: space-between;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}
.faqWrap .secCont {
  margin: 0;
  padding: 0;
  width: 80.6%;
}
.faqWrap .faqNavArea {
  width: 15.3%;
}
.faqWrap .faqNavArea h2 {
  display: none;
}
.faqWrap .faqNavArea .faqNav {
  position: sticky;
  top: 110px;
}
.faqWrap .faqNavArea .faqNav li {
  border-bottom: 1px solid #EFEFEF;
}
.faqWrap .faqNavArea .faqNav li a {
  font-size: 86%;
  height: 42px;
  display: flex;
  align-items: center;
  line-height: 120%;
  padding: 5px 20px 5px 15px;
  position: relative;
  text-align: left;
  transition: background-color 0.4s;
}
.faqWrap .faqNavArea .faqNav li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 7px;
  width: 3px;
  background-image: url("../img/common/arrow06.svg");
  margin-top: -3px;
  position: absolute;
  top: 50%;
  right: 10px;
}
.faqWrap .faqNavArea .faqNav li a.c, .faqWrap .faqNavArea .faqNav li a:hover {
  background-color: #EFEFEF;
}
.faqWrap .faqNavArea .faqNav li a.c:after, .faqWrap .faqNavArea .faqNav li a:hover:after {
  display: none;
}

.tempBtn2 {
  margin-bottom: 30px;
  width: 315px;
}
.tempBtn2 a {
  background-color: #FFEAEA;
  box-shadow: 0px 3px 0px #FFBFBF;
  border-radius: 90px;
  height: 55px;
  font-size: 106%;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  text-align: center;
  transition: opacity 0.6s;
  text-decoration: none;
}
.tempBtn2 a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .tempBtn2 a:hover {
    opacity: 1;
  }
}
.tempBtn2 a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow03.svg");
  margin-top: -6px;
  position: absolute;
  right: 20px;
  top: 50%;
}
.tempBtn2 a.blank:after {
  background-image: url("../img/common/blank.svg");
  height: 10px;
  margin-top: -5px;
  width: 10px;
}
.tempBtn2.type2 {
  width: 380px;
}

.supportStep {
  background-color: #EFEFEF;
  display: flex;
  flex-wrap: wrap;
  padding: 55px 55px 35px;
}
.supportStep dl {
  margin: 0 3.4% 40px 0;
  padding-bottom: 34%;
  position: relative;
  width: 48.3%;
}
.supportStep dl:nth-of-type(2n) {
  margin-right: 0;
}
.supportStep dl dt {
  min-height: 40px;
  letter-spacing: -0.01em;
  padding-left: 54px;
  position: relative;
}
.supportStep dl dt:before {
  background-color: #8D8D8D;
  color: #fff;
  font-size: 145%;
  font-weight: 700;
  font-family: Arial, Helvetica, "sans-serif";
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  position: absolute;
  top: 2px;
  left: 0px;
  width: 40px;
}
.supportStep dl dt .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}
.supportStep dl dt span {
  color: #E60013;
}
.supportStep dl dt span.small {
  font-size: 86%;
  margin-top: 5px;
  line-height: 150%;
}
.supportStep dl dt span.small2 {
  color: #000;
  font-size: 86%;
  margin-top: 5px;
  line-height: 150%;
}
.supportStep dl:nth-of-type(1) dt:before {
  content: "1";
}
.supportStep dl:nth-of-type(2) dt:before {
  content: "2";
}
.supportStep dl:nth-of-type(3) dt:before {
  content: "3";
}
.supportStep dl:nth-of-type(4) dt:before {
  content: "4";
}
.supportStep dl:nth-of-type(5) dt:before {
  content: "5";
}
.supportStep dl:nth-of-type(6) dt:before {
  content: "6";
}
.supportStep dl:nth-of-type(7) dt:before {
  content: "7";
}
.supportStep dl:nth-of-type(8) dt:before {
  content: "8";
}
.supportStep dl:nth-of-type(9) dt:before {
  content: "9";
}
.supportStep dl:nth-of-type(10) dt:before {
  content: "10";
}
.supportStep dl dd {
  position: absolute;
  bottom: 0px;
  left: 0px;
}
.supportStep dl dd img {
  max-width: 100%;
}
.supportStep.type2 dl dt:before {
  display: none;
}
.supportStep.type2 dl dt span {
  color: #000;
  font-size: 86%;
  display: block;
  line-height: 150%;
}
.supportStep.type2 dl dt span.num {
  background-color: #8D8D8D;
  color: #fff;
  font-size: 145%;
  font-weight: 700;
  font-family: Arial, Helvetica, "sans-serif";
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  position: absolute;
  top: 2px;
  left: 0px;
  width: 40px;
}
.supportStep.type2 .tabNav {
  margin: 0 0 30px;
  width: 100%;
}
.supportStep.type2 .tabNav li {
  width: 46.6%;
}
.supportStep.type2 .tabNav li a {
  background-color: #D8D8D8;
  border-radius: 5px 5px 0 0;
}
.supportStep.type2 .tabNav li a.c, .supportStep.type2 .tabNav li a:hover {
  background-color: #EFEFEF;
}
.supportStep.type2 .tabNav li a.c:before, .supportStep.type2 .tabNav li a:hover:before {
  background-color: #EFEFEF;
}
.supportStep.type2 .tabSupportStep {
  display: flex;
  flex-wrap: wrap;
}
.supportStep.type2 .tabSupportStep dl {
  margin-right: 2.3%;
  width: 31.8%;
}
.supportStep.type2 .tabSupportStep dl:nth-of-type(2n) {
  margin-right: 2.3%;
}
.supportStep.type2 .tabSupportStep dl:nth-of-type(3n) {
  margin-right: 0;
}
.supportStep.type3 dl dt span {
  color: #000;
  font-size: 86%;
  display: block;
  line-height: 150%;
}

.telProcess th {
  background-color: #EFEFEF;
  box-sizing: border-box;
  border: 1px solid #D8D8D8;
  font-weight: 700;
  padding: 15px 10px;
  vertical-align: middle;
  text-align: center;
  width: 390px;
}
.telProcess th span {
  display: block;
  font-weight: 500;
}
.telProcess td {
  border: 1px solid #D8D8D8;
  box-sizing: border-box;
  padding: 15px 20px;
  vertical-align: middle;
}
.telProcess td a {
  font-family: Arial, Helvetica, "sans-serif";
  font-size: 240%;
  font-weight: 700;
  line-height: 120%;
  display: inline-block;
  pointer-events: none;
}
.telProcess td p {
  margin: 0 0 5px;
}
.telProcess td p:last-of-type {
  margin-bottom: 0;
}
.telProcess td p.indent {
  padding-left: 1em;
  text-indent: -1em;
}
.telProcess td p.tel {
  display: flex;
  align-items: center;
}
.telProcess td p.tel a {
  font-size: 160%;
}
.telProcess td ul.tel {
  display: flex;
  margin-bottom: 5px;
}
.telProcess td ul.tel li {
  font-weight: 700;
  display: flex;
  align-items: center;
}
.telProcess td ul.tel li:first-child {
  margin-right: 20px;
}
.telProcess td ul.tel li a {
  font-size: 160%;
  margin-left: 10px;
}

.rightLink2 {
  margin-top: 25px;
  text-align: right;
}
.rightLink2 a {
  color: #E60013;
  transition: opacity 0.6s;
  text-decoration: none;
}
.rightLink2 a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .rightLink2 a:hover {
    opacity: 1;
  }
}
.rightLink2 a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  display: inline-block;
  margin: 0 0 0 10px;
}

.creditMain img {
  max-width: 100%;
}

.tempBtn3 {
  margin: 45px auto 0;
  width: 320px;
}
.tempBtn3 a {
  border: 2px solid #E60013;
  border-radius: 8px;
  color: #E60013;
  height: 100px;
  font-size: 120%;
  font-weight: 700;
  display: flex;
  align-items: center;
  padding: 0 40px 0 30px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.tempBtn3 a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .tempBtn3 a:hover {
    opacity: 1;
  }
}
.tempBtn3 a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin-top: -6px;
  position: absolute;
  right: 30px;
  top: 50%;
}
.tempBtn3 a.blank:after {
  background-image: url("../img/common/blank.svg");
  height: 10px;
  margin-top: -5px;
  width: 10px;
}

.cardSample {
  display: flex;
  justify-content: flex-end;
  flex-flow: row-reverse;
}
.cardSample dt {
  margin: 30px 0 0 40px;
}
.cardSample dd {
  width: 40%;
}
.cardSample dd img {
  max-width: 100%;
}

/******** about ********/
.aboutIconInfo {
  display: flex;
  justify-content: space-between;
  margin-bottom: 100px;
}
.aboutIconInfo dl {
  text-align: center;
  width: 18%;
}
.aboutIconInfo dl dt {
  color: #E60013;
  font-size: 160%;
  font-weight: 700;
  display: inline-block;
  margin-bottom: 5px;
  padding: 0 22px;
  position: relative;
}
.aboutIconInfo dl dt:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 35px;
  width: 22px;
  background-image: url("../img/about/icon.svg");
  position: absolute;
  top: 2px;
  right: -2px;
}
.aboutIconInfo dl dd {
  font-size: 93%;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.aboutIconInfo dl dd span {
  font-size: 92%;
  font-weight: 500;
  display: block;
}
.aboutIconInfo dl dd.icon {
  max-width: 100px;
  margin: 0 auto 15px;
}

.cardType {
  background-color: #EFEFEF;
  border-radius: 10px;
  margin: 50px 0 100px;
  padding: 75px 50px 100px;
}
.cardType h2 {
  font-size: 186%;
  font-weight: 700;
  margin-bottom: 50px;
  text-align: center;
}
.cardType h2 span {
  color: #E60013;
}
.cardType ul {
  display: flex;
  flex-wrap: wrap;
  max-width: 635px;
  margin: 0 auto;
}
.cardType ul li {
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  margin: 0 2.4% 15px 0;
  width: 48.8%;
}
.cardType ul li:nth-child(2n) {
  margin-right: 0;
}
.cardType ul li .txt {
  font-size: 133%;
  font-weight: 700;
}
.cardType ul li a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.cardType ul li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .cardType ul li a:hover {
    opacity: 1;
  }
}
.cardType ul li a,
.cardType ul li .noLink {
  box-sizing: border-box;
  display: block;
  height: 220px;
  padding-top: 160px;
  text-align: center;
  position: relative;
}
.cardType ul li a img,
.cardType ul li .noLink img {
  margin: 0 auto;
  position: absolute;
  top: 40px;
  left: 0;
  right: 0;
  width: 153px;
}
.cardType ul li a .icon,
.cardType ul li .noLink .icon {
  background-color: #E60013;
  border-radius: 10px 0 10px 0;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  position: absolute;
  bottom: 0px;
  right: 0px;
}
.cardType ul li a .icon:before,
.cardType ul li .noLink .icon:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow02.svg");
}
.cardType ul li.card02 a img {
  top: 60px;
  width: 214px;
}
.cardType ul li.card02 a .icon:before {
  background-image: url("../img/common/blank3.svg");
  height: 10px;
  width: 10px;
}
.cardType ul li.card03 a img {
  top: 40px;
  width: 92px;
}
.cardType ul li.card04 a img {
  top: 20px;
  width: 185px;
}

.useArea {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.useArea:before {
  background: url("../img/about/use_bg.png") repeat-x 0 0;
  background-size: auto 5px;
  content: "";
  height: 5px;
  position: absolute;
  top: 120px;
  left: 0px;
  width: 100%;
}
.useArea dl {
  background-color: #fff;
  padding-bottom: 70px;
  position: relative;
  width: 27.5%;
}
.useArea dl dt {
  background-color: #E60013;
  border-radius: 26px;
  color: #fff;
  font-size: 146%;
  font-weight: 700;
  max-width: 260px;
  margin: 0 auto 15px;
  text-align: center;
  position: relative;
}
.useArea dl dt:after {
  background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #E60013 50.5%) no-repeat top left/50% 100%, linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, #E60013 50.5%) no-repeat top right/50% 100%;
  content: "";
  display: block;
  height: 7px;
  width: 8px;
  margin: 0 auto;
  position: absolute;
  bottom: -7px;
  left: 0;
  right: 0;
}
.useArea dl dd {
  font-size: 86%;
  font-weight: 700;
}
.useArea dl dd.pict {
  margin: 0 auto 30px;
  height: 156px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.useArea dl dd.pict img {
  height: 100%;
  width: auto;
}
.useArea dl dd.tempBtn2 {
  max-width: 100%;
  margin: 0;
  position: absolute;
  bottom: 0px;
  left: 0px;
}

.bestdealArea {
  display: flex;
  flex-wrap: wrap;
}
.bestdealArea .bestdealCont {
  margin: 0 2% 20px 0;
  width: 49%;
}
.bestdealArea .bestdealCont:nth-of-type(2n) {
  margin-right: 0;
}
.bestdealArea .bestdealInfo {
  border: 2px solid #EFEFEF;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.bestdealArea .bestdealInfo .pict {
  text-align: center;
  width: 42%;
}
.bestdealArea .bestdealInfo .pict img {
  width: 120px;
}
.bestdealArea .bestdealInfo dl {
  background-color: #EFEFEF;
  box-sizing: border-box;
  display: flex;
  flex-flow: column;
  justify-content: center;
  min-height: 240px;
  padding: 0 25px;
  position: relative;
  width: 58%;
}
.bestdealArea .bestdealInfo dl:before {
  background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat bottom left/100% 50%, linear-gradient(to bottom right, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat top right/100% 50%;
  content: "";
  display: block;
  height: 20px;
  width: 15px;
  margin-top: -10px;
  position: absolute;
  left: -15px;
  top: 50%;
}
.bestdealArea .bestdealInfo dl dt {
  font-size: 133%;
  font-weight: 700;
  line-height: 140%;
  margin-bottom: 15px;
}
.bestdealArea .bestdealInfo dl dd {
  font-size: 86%;
}
.bestdealArea .bestdealInfo dl dd.link {
  margin-top: 10px;
}
.bestdealArea .indentList {
  margin-top: 15px;
}
.bestdealArea .indentList li {
  font-size: 86%;
}

.startArea {
  display: flex;
  flex-wrap: wrap;
}
.startArea .startCont {
  background-color: #FFEAEA;
  border-radius: 10px;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  margin: 0 2% 20px 0;
  position: relative;
  width: 49%;
}
.startArea .startCont:nth-of-type(2n) {
  margin-right: 0;
}
.startArea .startCont > a {
  display: block;
  height: 100%;
  transition: opacity 0.6s;
  text-decoration: none;
}
.startArea .startCont > a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .startArea .startCont > a:hover {
    opacity: 1;
  }
}
.startArea .startCont:nth-of-type(2) dl dd.icon:before {
  background-image: url("../img/common/blank3.svg");
  height: 10px;
  width: 10px;
}
.startArea .startCont:nth-of-type(2) dl dd.pict {
  width: 124px;
}
.startArea .startCont:nth-of-type(3) dl dd.pict {
  top: 45px;
  left: 45px;
  width: 94px;
}
.startArea .startCont:nth-of-type(4) dl dd.pict {
  top: 45px;
  left: 20px;
  width: 140px;
}
.startArea dl {
  box-sizing: border-box;
  height: 100%;
  min-height: 185px;
  padding: 20px 20px 20px 215px;
  position: relative;
}
.startArea dl dt {
  font-size: 133%;
  font-weight: 700;
  margin-bottom: 10px;
}
.startArea dl dd {
  font-size: 86%;
}
.startArea dl dd.link {
  font-size: 100%;
  margin-top: 25px;
}
.startArea dl dd.icon {
  background-color: #F7A1A8;
  border-radius: 10px 0 10px 0;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  position: absolute;
  bottom: 0px;
  right: 0px;
}
.startArea dl dd.icon:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow02.svg");
}
.startArea dl dd.pict {
  position: absolute;
  top: 50px;
  left: 30px;
  width: 119px;
}
.startArea dl dd.pict img {
  width: 100%;
}

/******** app ********/
.appLinkArea2 {
  background: url("../img/index/bg04.png") repeat 0 0, linear-gradient(180deg, #E60013 0%, #E87A83 100%);
  background-size: 1000px;
  border-radius: 10px;
  margin: 80px auto 10px;
  padding: 60px 20px 60px 350px;
  position: relative;
}
.appLinkArea2:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 208px;
  width: 201px;
  background-image: url("../img/index/bg03.png");
  position: absolute;
  bottom: -1px;
  left: 80px;
}
.appLinkArea2 dl {
  display: flex;
  flex-wrap: wrap;
}
.appLinkArea2 dl dt {
  color: #fff;
  font-size: 200%;
  font-weight: 700;
  margin-bottom: 30px;
  letter-spacing: -0.02em;
  width: 100%;
}
.appLinkArea2 dl dd {
  margin-right: 5px;
}
.appLinkArea2 dl dd a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.appLinkArea2 dl dd a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .appLinkArea2 dl dd a:hover {
    opacity: 1;
  }
}
.appLinkArea2 dl dd img {
  height: 60px;
}

.pointH2 {
  margin: 60px auto;
  text-align: center;
}

.piontAnchor {
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
}
.piontAnchor li {
  font-size: 86%;
  font-weight: 700;
  text-align: center;
  width: 18%;
}
.piontAnchor li a {
  box-sizing: border-box;
  height: 100%;
  display: block;
  transition: opacity 0.6s;
  text-decoration: none;
  position: relative;
  padding-bottom: 25px;
}
.piontAnchor li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .piontAnchor li a:hover {
    opacity: 1;
  }
}
.piontAnchor li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin: 0 auto;
  transform: rotate(90deg);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.piontAnchor li span {
  color: #E60013;
  font-size: 70%;
  display: block;
}
.piontAnchor li span strong {
  display: block;
  font-size: 266%;
}
.piontAnchor li span:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 46px;
  width: 46px;
  background-image: url("../img/app/point_anchor01.png");
  margin: 5px auto 5px;
}
.piontAnchor li:nth-child(2) span:after {
  background-image: url("../img/app/point_anchor02.png");
}
.piontAnchor li:nth-child(3) span:after {
  background-image: url("../img/app/point_anchor03.png");
}
.piontAnchor li:nth-child(4) span:after {
  background-image: url("../img/app/point_anchor04.png");
}
.piontAnchor li:nth-child(5) span:after {
  background-image: url("../img/app/point_anchor05.png");
}

.pointWrap {
  margin-bottom: 170px;
}
.pointWrap .pointArea {
  background: url("../img/app/point_bg01.png") repeat;
  padding: 0 20px;
}
.pointWrap .pointArea:nth-of-type(2n) {
  background-image: url("../img/app/point_bg02.png");
}
.pointWrap .pointArea:nth-of-type(2n) .pointCont dl dt {
  color: #E60013;
}
.pointWrap .pointArea:nth-of-type(2n) .pointCont dl dt:after {
  background-color: #E60013;
}
.pointWrap .pointArea:nth-of-type(2n) .pointCont dl dd {
  border-color: #E60013;
}
.pointWrap .pointCont {
  display: flex;
  flex-flow: row-reverse;
  align-items: center;
  justify-content: space-between;
  max-width: 1223px;
  margin: 0 auto;
  padding-top: 50px;
}
.pointWrap .pointCont .pict {
  position: relative;
  width: 35.2%;
}
.pointWrap .pointCont .pict span {
  position: absolute;
  top: -40px;
  right: 20px;
  width: 84px;
}
.pointWrap .pointCont dl {
  width: 64%;
}
.pointWrap .pointCont dl dt {
  color: #fff;
  font-weight: 700;
  font-size: 300%;
  display: inline-block;
  margin-bottom: 35px;
  line-height: 140%;
  letter-spacing: -0.02em;
}
.pointWrap .pointCont dl dt i {
  font-style: normal;
  font-size: 70%;
}
.pointWrap .pointCont dl dt span {
  font-size: 80%;
}
.pointWrap .pointCont dl dt:after {
  background-color: #FCEE21;
  border-radius: 6px;
  content: "";
  height: 6px;
  display: block;
  margin: 5px auto 0;
  width: 100%;
}
.pointWrap .pointCont dl dd {
  background-color: #fff;
  border: 5px solid #FCEE21;
  border-radius: 60px;
  color: #E60013;
  font-size: 120%;
  font-weight: 700;
  line-height: 130%;
  padding: 15px 35px;
}

.functionInfo .infoCont {
  background-color: #EFEFEF;
  box-sizing: border-box;
  margin-bottom: 40px;
  padding: 25px;
  width: 480px;
}
.functionInfo .infoCont dl {
  position: relative;
}
.functionInfo .infoCont dl dt {
  background-color: #E60013;
  border-radius: 5px 5px 0 0;
  color: #fff;
  height: 45px;
  font-size: 146%;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 2;
}
.functionInfo .infoCont dl dd {
  margin-top: 10px;
}
.functionInfo .infoCont dl dd.pict {
  margin-top: -45px;
}
.functionInfo .infoCont dl dd .circleList li span {
  font-size: 86%;
  display: block;
  margin-left: -20px;
}
.functionInfo .infoCont dl dd .indentList li {
  font-size: 86%;
}
.functionInfo .infoCont dl dd .numList2 {
  margin-top: 5px;
}
.functionInfo .infoCont dl dd .numList2 li {
  font-size: 86%;
  padding-left: 20px;
}

.meritArea {
  display: flex;
  flex-wrap: wrap;
}
.meritArea .meritCont {
  background: linear-gradient(180deg, #fff 0%, #fff 50%, #EFEFEF 50%, #EFEFEF 100%);
  border: 2px solid #EFEFEF;
  border-radius: 10px;
  box-sizing: border-box;
  padding-top: 50px;
  margin: 0 2% 20px 0;
  width: 49%;
}
.meritArea .meritCont:nth-of-type(2n) {
  margin-right: 0;
}
.meritArea .meritCont .pict {
  margin: 0 auto 45px;
  width: 112px;
}
.meritArea .meritCont dl {
  background-color: #EFEFEF;
  padding: 30px 30px 15px;
  position: relative;
}
.meritArea .meritCont dl:before {
  background: linear-gradient(to bottom right, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat top left/50% 100%, linear-gradient(to bottom left, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat top right/50% 100%;
  content: "";
  display: block;
  height: 18px;
  width: 20px;
  margin: 0 auto;
  position: absolute;
  top: -18px;
  left: 0;
  right: 0;
}
.meritArea .meritCont dl dt {
  font-size: 133%;
  font-weight: 700;
}
.meritArea .meritCont dl dd {
  font-size: 86%;
  margin-top: 15px;
}
.meritArea .meritCont dl dd.link {
  font-size: 100%;
}

/******** credit ********/
.creditMain {
  margin: 0 auto 85px;
  position: relative;
}
.creditMain .tempBtn {
  margin: 0 auto;
  position: absolute;
  bottom: -40px;
  left: 0;
  right: 0;
}

.returnInfo {
  display: flex;
  justify-content: space-between;
  margin: 0 auto 30px;
}
.returnInfo li {
  width: 32%;
}
.returnInfo li img {
  width: 100%;
}

.cardDesign {
  display: flex;
  justify-content: center;
  margin: 0 auto 50px;
}
.cardDesign li {
  margin: 0 6%;
  text-align: center;
  width: 38%;
}
.cardDesign li img {
  width: 100%;
}
.cardDesign li span {
  font-size: 86%;
  display: block;
  margin-top: 12px;
}

.specialArea {
  display: flex;
  justify-content: space-between;
  margin-bottom: 95px;
}
.specialArea .specialCont {
  position: relative;
  width: 49%;
}
.specialArea .specialCont:last-of-type .specialInfo .pict img {
  width: 165px;
}
.specialArea .indentList {
  position: absolute;
  bottom: -50px;
  left: 0px;
}
.specialArea .indentList li {
  font-size: 86%;
}
.specialArea .specialInfo {
  border: 2px solid #EFEFEF;
  border-radius: 10px;
  box-sizing: border-box;
  height: 100%;
  padding-top: 210px;
  position: relative;
}
.specialArea .specialInfo .pict {
  height: 210px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
}
.specialArea .specialInfo .pict img {
  width: 129px;
}
.specialArea .specialInfo dl {
  background-color: #EFEFEF;
  box-sizing: border-box;
  height: 100%;
  padding: 0 30px 20px;
  position: relative;
}
.specialArea .specialInfo dl:before {
  background: linear-gradient(to bottom right, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat top left/50% 100%, linear-gradient(to bottom left, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat top right/50% 100%;
  content: "";
  display: block;
  height: 18px;
  width: 20px;
  margin: 0 auto;
  position: absolute;
  top: -18px;
  left: 0;
  right: 0;
}
.specialArea .specialInfo dl dt {
  font-size: 133%;
  font-weight: 700;
  letter-spacing: -0.01em;
  padding: 30px 0 15px;
}
.specialArea .specialInfo dl dd {
  font-size: 86%;
}
.specialArea .specialInfo dl dd.link {
  font-size: 100%;
  margin-top: 20px;
}

.cardFlow {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
  position: relative;
}
.cardFlow:before {
  background: url("../img/about/use_bg.png") repeat-x 0 0;
  background-size: auto 4px;
  content: "";
  height: 4px;
  margin-top: -2px;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
}
.cardFlow li {
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  height: 136px;
  color: #E60013;
  font-size: 106%;
  font-weight: 700;
  line-height: 140%;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  position: relative;
  text-align: center;
  width: 18.4%;
}
.cardFlow li span {
  background-color: #E60013;
  border-radius: 10px 0 10px 0;
  color: #fff;
  font-family: Arial, Helvetica, "sans-serif";
  height: 33px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 33px;
}
.cardFlow li:last-child {
  background-color: #E60013;
  color: #fff;
}
.cardFlow li:last-child:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 36px;
  width: 36px;
  background-image: url("../img/credit/icon01.svg");
  margin-bottom: 10px;
}

.cardAttentionArea {
  background-color: #FFEAEA;
  margin: 60px 0 100px;
  padding: 90px 20px;
}
.cardAttentionArea .attentionCont {
  max-width: 1000px;
  margin: 0 auto;
}
.cardAttentionArea .titleStyle01 {
  margin-left: 50px;
  position: relative;
}
.cardAttentionArea .titleStyle01:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 32px;
  width: 36px;
  background-image: url("../img/credit/icon02.svg");
  position: absolute;
  top: 5px;
  left: -45px;
}
.cardAttentionArea .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}

.cardInfo {
  display: flex;
}
.cardInfo .card {
  margin-right: 40px;
  width: 27.4%;
}
.cardInfo .card img {
  width: 100%;
}
.cardInfo .detail {
  max-width: 60%;
}

.tabCont .cardInfo {
  justify-content: space-between;
  align-items: center;
}
.tabCont .cardInfo .card {
  margin: 0;
  width: 48%;
}
.tabCont .cardInfo .detail {
  max-width: 48%;
}
.tabCont .cardInfo .detail h3 {
  font-size: 186%;
  font-weight: 700;
  margin-bottom: 25px;
  letter-spacing: -0.02em;
}
.tabCont .cardInfo .detail .tempBtn2 {
  margin-top: 30px;
  width: 100%;
}
.tabCont .noticeArea {
  margin-top: 40px;
}

/******** guide ********/
.guideLink {
  margin-bottom: 100px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.guideLink li {
  margin: 0 2% 20px 0;
  width: 23.5%;
}
.guideLink li:nth-child(4) {
  margin-right: 0;
}
.guideLink li:last-child {
  margin-right: 0;
}
.guideLink li a {
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
  border-radius: 10px;
  box-sizing: border-box;
  min-height: 310px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 180px 20px 20px;
  position: relative;
  transition: opacity 0.6s;
  text-decoration: none;
}
.guideLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .guideLink li a:hover {
    opacity: 1;
  }
}
.guideLink li a .icon {
  background-color: #E60013;
  border-radius: 10px 0 10px 0;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 0px;
  right: 0px;
  width: 32px;
}
.guideLink li a .icon:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow02.svg");
}
.guideLink li a:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 157px;
  width: 200px;
  background-image: url("../img/guide/guide01.png");
  margin: 0 auto;
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
}
.guideLink li a p {
  font-size: 160%;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.02em;
  text-align: center;
}
.guideLink li a p span {
  background-color: #FCEE21;
  border-radius: 26px;
  font-size: 83%;
  display: block;
  margin: 0 auto 5px;
  width: 120px;
}
.guideLink li:nth-child(n+5) a {
  background-color: #FFEAEA;
  min-height: 240px;
  padding-top: 160px;
}
.guideLink li:nth-child(n+5) a:before {
  height: 80px;
  top: 60px;
  width: 80px;
}
.guideLink li:nth-child(n+5) a .icon {
  background-color: #F7A1A8;
}
.guideLink li:nth-child(n+5) a p {
  font-size: 133%;
  line-height: 1.3;
}
.guideLink li.guideLink_01 a:before {
  background-image: url("../img/guide/guide01.png");
}
.guideLink li.guideLink_02 a:before {
  background-image: url("../img/guide/guide02.png");
}
.guideLink li.guideLink_03 a:before {
  background-image: url("../img/guide/guide03.png");
}
.guideLink li.guideLink_04 a:before {
  background-image: url("../img/guide/guide04.png");
}
.guideLink li.guideLink_05 a:before {
  background-image: url("../img/guide/guide05.png");
}
.guideLink li.guideLink_08 a:before {
  background-image: url("../img/guide/guide08.png");
}
.guideLink li.guideLink_06 a:before {
  background-image: url("../img/guide/guide06.png");
}
.guideLink li.guideLink_07 a:before {
  background-image: url("../img/guide/guide07.png");
}

.mainTitle h1.chargeMainTitle:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 249px;
  width: 271px;
  background-image: url("../img/guide/charge/title_image.png");
  position: absolute;
  top: -65px;
  left: -300px;
}
.mainTitle h1.paymentMainTitle:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 171px;
  width: 271px;
  background-image: url("../img/guide/payment/title_image.png");
  position: absolute;
  top: -40px;
  left: -300px;
}
.mainTitle h1.pointMainTitle:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 200px;
  width: 134px;
  background-image: url("../img/guide/point/title_image.png");
  position: absolute;
  top: -40px;
  left: -200px;
}
.mainTitle h1.couponMainTitle:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 166px;
  width: 149px;
  background-image: url("../img/guide/coupon/title_image.png");
  position: absolute;
  top: -40px;
  left: -200px;
}

.secWrap {
  background-color: #FFEAEA;
  margin-top: 120px;
  padding-top: 60px;
  padding-bottom: 40px;
}
.secWrap .stepArea .stepCont {
  background-color: #fff;
}
.secWrap .noticeArea {
  background-color: #fff;
}

.chargeTitle {
  margin: 0 auto 60px;
  position: relative;
  text-align: center;
}
.chargeTitle .titleIcon {
  margin: 0 auto;
  position: absolute;
  top: -90px;
  left: 0;
  right: 0;
}
.chargeTitle .titleStyle01 {
  margin: 0;
}
.chargeTitle.title02 {
  margin-top: 140px;
}
.chargeTitle.title02 .titleIcon {
  top: -60px;
}
.chargeTitle.title03 {
  margin-top: 40px;
}
.chargeTitle.title03 .titleIcon {
  top: -150px;
}

.chargeAmount {
  margin-bottom: 30px;
}
.chargeAmount th {
  background-color: #EFEFEF;
  box-sizing: border-box;
  border: 1px solid #D8D8D8;
  font-size: 133%;
  font-weight: 700;
  padding: 15px 20px;
  line-height: 120%;
  vertical-align: middle;
  text-align: center;
  width: 235px;
}
.chargeAmount th span {
  display: block;
  font-size: 70%;
}
.chargeAmount td {
  background-color: #fff;
  border: 1px solid #D8D8D8;
  box-sizing: border-box;
  padding: 15px 20px;
  vertical-align: middle;
}
.chargeAmount td strong {
  color: #E60013;
}
.chargeAmount td strong.big {
  font-size: 133%;
}

.chargeLink {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.chargeLink li {
  width: 48.5%;
}
.chargeLink li a {
  border: 2px solid #E60013;
  border-radius: 8px;
  color: #E60013;
  font-size: 120%;
  font-weight: 700;
  display: flex;
  align-items: center;
  height: 100px;
  padding: 0 75px 0 80px;
  position: relative;
  letter-spacing: -0.02em;
  transition: opacity 0.6s;
  text-decoration: none;
}
.chargeLink li a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .chargeLink li a:hover {
    opacity: 1;
  }
}
.chargeLink li a:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 36px;
  width: 36px;
  background-image: url("../img/about/card03.png");
  margin-top: -18px;
  position: absolute;
  top: 50%;
  left: 25px;
}
.chargeLink li a:after {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  background-image: url("../img/common/arrow01.svg");
  margin-top: -6px;
  position: absolute;
  top: 50%;
  right: 25px;
}
.chargeLink li:last-child a:before {
  background-image: url("../img/guide/charge/icon01.svg");
  height: 38px;
}

.chargeCardInfo {
  background-color: #EFEFEF;
  padding: 30px 30px 60px;
}
.chargeCardInfo .chargeCard {
  margin-bottom: 90px;
}

.pointCardInfo {
  background-color: #EFEFEF;
  margin-bottom: 20px;
  padding: 30px 25px;
}
.pointCardInfo .chargeCard li:nth-child(2) p {
  margin-top: -20px;
}
.pointCardInfo .chargeCard li:nth-child(2) p span {
  line-height: 140%;
  margin-bottom: 5px;
}
.pointCardInfo .chargeCard li:nth-child(2) p .linkStyle02 {
  font-weight: 500;
}
.pointCardInfo .chargeCard li:nth-child(2) p .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}

.chargeCard {
  display: flex;
  justify-content: space-between;
}
.chargeCard li {
  background-color: #fff;
  padding: 15px 0;
  position: relative;
  width: 24.68%;
}
.chargeCard li .pict {
  margin: 0 auto 20px;
  width: 80%;
}
.chargeCard li p {
  font-weight: 700;
  margin: 0;
  text-align: center;
}
.chargeCard li p span {
  font-size: 75%;
  font-weight: 500;
  display: block;
}
.chargeCard li p.notice {
  font-size: 86%;
  font-weight: 500;
  line-height: 130%;
  position: absolute;
  top: 230px;
  left: 0;
  text-align: left;
}

.appLinkArea3 {
  background: url("../img/index/bg04.png") repeat 0 0, linear-gradient(180deg, #E60013 0%, #E87A83 100%);
  background-size: 1000px;
  margin: 100px auto 100px;
  padding: 60px 400px 60px 70px;
  position: relative;
}
.appLinkArea3:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 320px;
  width: 242px;
  background-image: url("../img/guide/charge/app.png");
  position: absolute;
  bottom: 0px;
  right: 80px;
}
.appLinkArea3 dl {
  margin-bottom: 30px;
}
.appLinkArea3 dl dt {
  color: #fff;
  font-size: 213%;
  font-weight: 700;
  margin-bottom: 30px;
  letter-spacing: -0.02em;
}
.appLinkArea3 dl dd {
  color: #fff;
  font-size: 105%;
  font-weight: 700;
}
.appLinkArea3 dl dd sub {
  font-size: 43%;
}
.appLinkArea3 .appLink {
  display: flex;
  margin-bottom: 10px;
}
.appLinkArea3 .appLink li:first-child {
  margin-right: 4px;
}
.appLinkArea3 .appLink img {
  height: 63px;
}
.appLinkArea3 .attention {
  color: #fff;
  font-size: 73%;
}

.usePointInfo {
  padding-left: 80px;
  position: relative;
}
.usePointInfo dl {
  background-color: #FFEAEA;
  border-radius: 10px;
  padding: 20px;
  position: relative;
}
.usePointInfo dl:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 60px;
  width: 60px;
  background-image: url("../img/about/bestdeal01.png");
  margin-top: -30px;
  position: absolute;
  top: 50%;
  left: -80px;
}
.usePointInfo dl:after {
  background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #FFEAEA 50.5%) no-repeat bottom left/100% 50%, linear-gradient(to bottom right, rgba(255, 255, 255, 0) 50%, #FFEAEA 50.5%) no-repeat top right/100% 50%;
  content: "";
  display: block;
  height: 15px;
  width: 15px;
  margin-top: -7px;
  position: absolute;
  top: 50%;
  left: -15px;
}
.usePointInfo dl dt {
  color: #E60013;
  font-size: 146%;
  font-weight: 700;
  line-height: 140%;
  margin-bottom: 15px;
  letter-spacing: -0.02em;
}
.usePointInfo.type2 dl:before {
  background-image: url("../img/guide/coupon/info01.png");
  height: 62px;
  width: 39px;
}
.usePointInfo.type3 {
  padding-left: 90px;
}
.usePointInfo.type3 dl:before {
  background-image: url("../img/guide/coupon/info02.png");
  height: 114px;
  margin-top: -57px;
  left: -90px;
  width: 66px;
}

.merchantList {
  background-color: #EFEFEF;
  margin-bottom: 20px;
  padding: 20px;
}
.merchantList ul {
  display: flex;
  justify-content: center;
}
.merchantList ul li {
  margin: 0 5px;
  max-width: 90px;
}
.merchantList ul li span.pict {
  background-color: #fff;
  height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.merchantList ul li span.pict img {
  width: 77%;
}
.merchantList ul li span.txt {
  font-size: 86%;
  display: block;
  margin-top: 8px;
  line-height: 120%;
  letter-spacing: -0.02em;
  text-align: center;
}

.pointInfoArea {
  margin-bottom: 30px;
}
.pointInfoArea dl {
  border: 1px solid #D8D8D8;
  display: flex;
  justify-content: space-between;
}
.pointInfoArea dl dt {
  background-color: #EFEFEF;
  box-sizing: border-box;
  height: 80px;
  font-weight: 700;
  font-size: 106%;
  display: flex;
  align-items: center;
  padding: 0 20px;
  width: 56%;
}
.pointInfoArea dl dd {
  background-color: #E8F9FF;
  border-left: 1px solid #d8d8d8;
  box-sizing: border-box;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 15px 0;
  width: 22%;
}
.pointInfoArea dl dd p {
  color: #00A8E6;
  font-weight: 700;
  font-size: 93%;
  line-height: 140%;
  margin: 0;
}
.pointInfoArea dl dd p span {
  background-color: #00A8E6;
  border-radius: 25px;
  color: #fff;
  font-size: 85%;
  display: inline-block;
  vertical-align: 0.6em;
  margin-right: 8px;
  padding: 2px 8px;
}
.pointInfoArea dl dd p strong {
  font-size: 228%;
  margin-right: 3px;
}
.pointInfoArea.type2 dl {
  border-top: none;
}
.pointInfoArea.type2 dl dd {
  background-color: #F4FFA3;
}
.pointInfoArea.type2 dl dd p {
  color: #FAA503;
}
.pointInfoArea.type2 dl dd p span {
  background-color: #FAA503;
}
.pointInfoArea.type2 dl:first-of-type {
  border-top: 1px solid #D8D8D8;
}
.pointInfoArea.type2 dl:first-of-type dd {
  background-color: #FFEAEA;
}
.pointInfoArea.type2 dl:first-of-type dd p {
  color: #E60013;
}
.pointInfoArea.type2 dl:first-of-type dd p span {
  background-color: #E60013;
}

.benefitArea {
  display: flex;
  flex-wrap: wrap;
}
.benefitArea .benefitCont {
  border: 2px solid #EFEFEF;
  border-radius: 10px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 320px;
  margin: 0 2% 20px 0;
  position: relative;
  width: 49%;
}
.benefitArea .benefitCont:nth-of-type(2n) {
  margin-right: 0;
}
.benefitArea .benefitCont .benefitType {
  background-color: #FCEE21;
  border-radius: 2px;
  color: #E60013;
  font-size: 80%;
  font-weight: 700;
  line-height: 120%;
  padding: 2px 6px;
  position: absolute;
  top: 10px;
  left: 10px;
}
.benefitArea .benefitCont .benefitType.type2 {
  background-color: #E60013;
  color: #fff;
}
.benefitArea .benefitCont .pict {
  text-align: center;
  width: 42%;
}
.benefitArea .benefitCont .pict img {
  width: 145px;
}
.benefitArea .benefitCont dl {
  background-color: #EFEFEF;
  box-sizing: border-box;
  display: flex;
  flex-flow: column;
  justify-content: center;
  height: 100%;
  padding: 0 25px;
  position: relative;
  width: 58%;
}
.benefitArea .benefitCont dl:before {
  background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat bottom left/100% 50%, linear-gradient(to bottom right, rgba(255, 255, 255, 0) 50%, #EFEFEF 50.5%) no-repeat top right/100% 50%;
  content: "";
  display: block;
  height: 20px;
  width: 15px;
  margin-top: -10px;
  position: absolute;
  left: -15px;
  top: 50%;
}
.benefitArea .benefitCont dl dt {
  font-size: 133%;
  font-weight: 700;
  line-height: 140%;
}
.benefitArea .benefitCont dl dd {
  font-size: 86%;
  margin-top: 10px;
}
.benefitArea .benefitCont dl dd.link {
  font-size: 100%;
}
.benefitArea .benefitCont dl dd .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}
.benefitArea .benefitCont dl dd.notice {
  background-color: #FCEE21;
  border-radius: 2px;
  color: #E60013;
  font-size: 100%;
  font-weight: 700;
  padding: 0 0 4px;
  text-align: center;
}
.benefitArea .benefitCont dl dd.notice span {
  background-color: #D8D8D8;
  display: block;
  color: #000;
  font-size: 86%;
  margin-bottom: 4px;
  padding: 4px 0 3px;
}

.iconList {
  margin-bottom: 30px;
}
.iconList > li {
  font-size: 120%;
  font-weight: 700;
  margin-bottom: 10px;
  letter-spacing: -0.02em;
  padding-left: 36px;
  position: relative;
}
.iconList > li:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 24px;
  width: 24px;
  background-image: url("../img/common/icon01.svg");
  position: absolute;
  top: 2px;
  left: 0px;
}
.iconList > li:last-child {
  margin-bottom: 0;
}
.iconList > li > span {
  display: block;
  font-size: 75%;
  font-weight: 500;
}
.iconList > li .circleList {
  margin-top: 10px;
}

.rankInfoArea {
  display: flex;
  margin-bottom: 20px;
}
.rankInfoArea .rankSlideTitle {
  border-top: 1px solid #D8D8D8;
  border-left: 1px solid #D8D8D8;
  box-sizing: border-box;
  width: 16.7%;
}
.rankInfoArea .rankSlideTitle dt {
  background-color: #EFEFEF;
  border-bottom: 1px solid #D8D8D8;
  color: #ADADAD;
  font-size: 133%;
  font-weight: 700;
  height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.rankInfoArea .rankSlideTitle dd {
  background-color: #EFEFEF;
  border-bottom: 1px solid #D8D8D8;
  box-sizing: border-box;
  font-size: 125%;
  font-weight: 700;
  height: 110px;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 140%;
  text-align: center;
}
.rankInfoArea .rankSlideTitle dd.service {
  height: 75px;
  justify-content: flex-start;
  padding: 0 10px;
  text-align: left;
}
.rankInfoArea .rankSlideTitle dd.service .num {
  background-color: #8D8D8D;
  color: #fff;
  font-size: 63%;
  line-height: 110%;
  margin-right: 10px;
  padding: 5px;
}
.rankInfoArea .rankSlideTitle dd.service .txt {
  font-size: 84%;
  line-height: 140%;
}
.rankInfoArea .rankSlideTitle dd.service .txt sub {
  font-size: 75%;
  line-height: 110%;
  display: inline-block;
  vertical-align: -0.2em;
}
.rankInfoArea .rankSlideArea {
  border-top: 1px solid #D8D8D8;
  border-right: 1px solid #D8D8D8;
  box-sizing: border-box;
  display: flex;
  width: 83.3%;
}
.rankInfoArea .rankSlideArea dl {
  box-sizing: border-box;
  width: 25%;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(1) {
  background-color: #000;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(1) dd.white {
  border-left: 1px solid #D8D8D8;
  border-bottom: 1px solid #D8D8D8;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(2) {
  background-color: #A59E39;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(2) dd.white {
  border-bottom: 1px solid #D8D8D8;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(2) dd.white:last-of-type {
  border-left: 1px solid #D8D8D8;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(3) {
  background-color: #AFAFAF;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(4) {
  background-color: #5D4337;
}
.rankInfoArea .rankSlideArea dl:nth-of-type(5) {
  background-color: #E60013;
}
.rankInfoArea .rankSlideArea dl dt {
  border-bottom: 1px solid #D8D8D8;
  border-left: 1px solid #D8D8D8;
  color: #fff;
  font-size: 133%;
  font-weight: 700;
  height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  line-height: 120%;
}
.rankInfoArea .rankSlideArea dl dd {
  border-bottom: 1px solid #D8D8D8;
  border-left: 1px solid #D8D8D8;
  box-sizing: border-box;
  height: 110px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  line-height: 140%;
  padding-top: 10px;
  text-align: center;
}
.rankInfoArea .rankSlideArea dl dd p {
  color: #fff;
  font-size: 150%;
  font-weight: 700;
  margin: 0;
  line-height: 110%;
}
.rankInfoArea .rankSlideArea dl dd p strong {
  font-size: 170%;
}
.rankInfoArea .rankSlideArea dl dd p span {
  display: block;
}
.rankInfoArea .rankSlideArea dl dd p span.over {
  font-size: 82%;
}
.rankInfoArea .rankSlideArea dl dd p span.note {
  font-size: 52%;
  font-weight: 500;
}
.rankInfoArea .rankSlideArea dl dd.over {
  background-color: #fff;
  height: 75px;
  overflow: visible;
  position: relative;
}
.rankInfoArea .rankSlideArea dl dd.over p {
  color: #000;
  font-size: 100%;
  font-weight: 500;
  position: absolute;
  top: 30px;
  left: 20px;
  text-align: left;
  width: 600px;
}
.rankInfoArea .rankSlideArea dl dd.white {
  background-color: #fff;
  border: none;
  height: 75px;
  align-items: flex-start;
  padding: 0 5px 0 20px;
  text-align: left;
}
.rankInfoArea .rankSlideArea dl dd.none {
  background-color: #D8D8D8;
  border: none;
  height: 75px;
}

.figLink img {
  max-width: 100%;
}

.rankPictArea {
  display: flex;
  flex-flow: row-reverse;
  justify-content: flex-end;
  padding: 0 50px;
}
.rankPictArea .pict {
  margin-right: 30px;
  width: 25%;
}
.rankPictArea .detail {
  padding-top: 20px;
  width: 56%;
}

.noticeArea.type2 {
  background-color: #FCEE21;
  margin-bottom: 0;
}
.noticeArea.type2 p {
  color: #E60013;
  font-size: 120%;
  font-weight: 700;
  margin: 0;
}
.noticeArea .rankNote {
  background-color: #fff;
  font-size: 86%;
  margin: 0;
  padding: 20px;
}

.meritInfo {
  background-color: #FFEAEA;
  border-radius: 10px;
  box-sizing: border-box;
  max-width: 750px;
  margin: 0 auto 55px;
  padding: 25px;
  position: relative;
  text-align: center;
}
.meritInfo:after {
  background: linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, #FFEAEA 50.5%) no-repeat top left/50% 100%, linear-gradient(to top left, rgba(255, 255, 255, 0) 50%, #FFEAEA 50.5%) no-repeat top right/50% 100%;
  content: "";
  display: block;
  height: 15px;
  width: 15px;
  margin: 0 auto;
  position: absolute;
  bottom: -15px;
  left: 0;
  right: 0;
}
.meritInfo dt {
  color: #E60013;
  font-size: 146%;
  font-weight: 700;
  margin-bottom: 15px;
  letter-spacing: -0.02em;
}

.meritTitle {
  font-size: 185%;
  font-weight: 700;
  margin: 0 auto 80px;
  text-align: center;
}

.meritService {
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
}
.meritService dl {
  border: 1px solid #EFEFEF;
  border-radius: 8px;
  box-sizing: border-box;
  width: 23.5%;
}
.meritService dl dt {
  background-color: #EFEFEF;
  border-radius: 8px 8px 0 0;
  box-sizing: border-box;
  min-height: 235px;
  font-size: 120%;
  font-weight: 700;
  line-height: 150%;
  padding: 140px 20px 20px;
  position: relative;
}
.meritService dl dt:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 80px;
  width: 80px;
  background-image: url("../img/guide/registration/merit01.png");
  margin: 0 auto;
  position: absolute;
  top: 30px;
  left: 0;
  right: 0;
}
.meritService dl:nth-of-type(2) dt:before {
  background-image: url("../img/guide/registration/merit02.png");
}
.meritService dl:nth-of-type(3) dt:before {
  background-image: url("../img/guide/registration/merit03.png");
}
.meritService dl:nth-of-type(4) dt:before {
  background-image: url("../img/guide/registration/merit04.png");
}
.meritService dl dd {
  font-size: 86%;
  padding: 20px;
}
.meritService dl dd .linkStyle02 {
  font-size: 115%;
  display: inline-block;
  margin-top: 10px;
}
.meritService dl dd .linkStyle02:after {
  height: 12px;
  margin-bottom: 0;
  width: 6px;
}

.appInfoArea {
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
  position: relative;
}
.appInfoArea .appOsInfo {
  width: 50%;
}
.appInfoArea .appOsInfo dl dt {
  font-weight: 700;
  margin-bottom: 25px;
  padding-left: 58px;
  position: relative;
}
.appInfoArea .appOsInfo dl dt:before {
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 100%;
  overflow: hidden;
  text-indent: 180%;
  white-space: nowrap;
  content: "";
  display: block;
  height: 48px;
  width: 48px;
  background-image: url("../img/guide/registration/app01.svg");
  position: absolute;
  top: -12px;
  left: 0px;
}
.appInfoArea .appOsInfo dl dt span {
  font-weight: 500;
  margin-left: 5px;
}
.appInfoArea .appOsInfo dl:last-of-type {
  margin-top: 25px;
}
.appInfoArea .appOsInfo dl:last-of-type dt:before {
  background-image: url("../img/guide/registration/app02.svg");
}
.appInfoArea .appOsInfo dl dd {
  background-color: #FFEAEA;
  letter-spacing: -0.02em;
  padding: 15px 20px;
}
.appInfoArea .appDownload {
  background-color: #EFEFEF;
  min-width: 450px;
  width: 45%;
}
.appInfoArea .appDownload dl {
  padding: 55px 35px 55px 200px;
  position: relative;
}
.appInfoArea .appDownload dl dt {
  position: absolute;
  top: 55px;
  left: 35px;
}
.appInfoArea .appDownload dl dt img {
  width: 144px;
}
.appInfoArea .appDownload dl dd {
  width: 212px;
}
.appInfoArea .appDownload dl dd:last-of-type {
  margin-top: 10px;
}
.appInfoArea .appDownload dl dd img {
  width: 100%;
}
.appInfoArea .appDownload dl dd a {
  transition: opacity 0.6s;
  text-decoration: none;
}
.appInfoArea .appDownload dl dd a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 960px) {
  .appInfoArea .appDownload dl dd a:hover {
    opacity: 1;
  }
}

.stepTitle {
  background-color: #FCEE21;
  font-size: 133%;
  font-weight: 700;
  display: flex;
  align-items: center;
  padding: 15px 20px;
}
.stepTitle span {
  background-color: #fff;
  border-radius: 26px;
  font-size: 70%;
  line-height: 140%;
  margin-left: 15px;
  padding: 4px 15px;
}
.stepTitle span i {
  color: #E60013;
  font-style: normal;
}

/******** error ********/
.errorArea {
  background-color: #FFEAEA;
  border-radius: 10px;
  box-sizing: border-box;
  max-width: 646px;
  margin: 60px auto 60px;
  padding: 50px 30px 40px;
  text-align: center;
}
.errorArea h1 {
  color: #E60013;
  font-family: Arial, Helvetica, "sans-serif";
  font-size: 306%;
  font-weight: 700;
  line-height: 100%;
}
.errorArea h1 span {
  font-size: 56%;
  margin-left: 10px;
}
.errorArea h2 {
  color: #E60013;
  font-size: 133%;
  font-weight: 700;
  margin-bottom: 35px;
}

.errorLink {
  margin-bottom: 150px;
}

/******** 20210727 追加 ********/
.brpc {
    display: block;
}
span.inlineB {
    display: inline-block;
	white-space: nowrap;
}

/* --- 211129_majica障害告知 ---*/
.a_majica{
	border: solid 2px #ff0000;
	color:#ff0000;
	margin: 20px auto 40px;
	max-width: 68.5%;
	text-align: center;
}
.a_majica a{
	display: block;
}
.a_majica p{
	color:#ff0000;
	font-size: 110%;
	font-weight: bold;
	margin: 0;
	padding: 20px;
}
/* --- 231025 majicaの利用規約改修 ---*/
.processLink.use_terms_link li {
    margin: 0 10px 10px 0;
    width: calc( 50% - 5px );
}
.processLink.use_terms_link li:nth-child(3n) {
    margin-right: 10px;
}
.processLink.use_terms_link li:nth-child(2n) {
    margin-right: 0;
}
.processLink.use_terms_link li a {
    padding: 0 50px 0 80px;
}
.processLink.use_terms_link li.link_01 {
    
}
.processLink.use_terms_link li a:before {
    height: auto;
    width: 40px!important;
    margin-top: 0;
    top: 0;
    bottom: 0;
    left: 23px!important;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background-position: center;
    background-size: contain;
}
.processLink.use_terms_link li.link_01 a:before {
    background-image: url(../img/about/card03.png);
}
.processLink.use_terms_link li.link_02 a:before {
    background-image: url(../img/guide/icon_link02.svg);
    width: 35px;
    left: 25px;
}
.processLink.use_terms_link li.link_03 a:before {
    background-image: url(../img/guide/icon_link03.svg);
    /*width: 48px;
    left: 18px;*/
}
.processLink.use_terms_link li.link_04 a:before {
    background-image: url(../img/guide/icon_link04.svg);
    width: 35px;
    left: 25px;
}
.processLink.use_terms_link li.link_05 a:before {
    background-image: url(../img/guide/icon_link05.svg);
}
.processLink.use_terms_link li.link_06 a:before {
    background-image: url(../img/guide/icon_link06.svg);
    width: 37px;
}
.processLink.use_terms_link li.link_07 a:before {
    background-image: url(../img/guide/icon_link07.svg);
}

.processLink.use_terms_link li.link_08 a:before {
    background-image: url(../img/guide/icon_link08.svg);
    width: 38px;
    left: 25px;
}
.processLink.use_terms_link li.link_09 a:before {
    background-image: url(../img/guide/icon_link09.svg);
    width: 44px;
    left: 22px;
    bottom: -5px;
}
.processLink.use_terms_link li.link_10 a:before {
    background-image: url(../img/guide/icon_link10.svg);
}


@media screen and (max-width: 736px) {
    .processLink.use_terms_link li {
        margin: 0 10px 10px 0;
        width: 100%;
    }
}
@media screen and (max-width: 480px) {
    .processLink.use_terms_link li a {
        padding: 0 35px 0 70px;
    }
    .processLink.use_terms_link li a:before {
        width: 34px!important;
        left: 20px!important;
    }
    .processLink.use_terms_link li a {
        font-size: 16px;
    }
}

@media screen and (max-width: 370px) {
    .processLink.use_terms_link li a {
        font-size: 110%;
    }
}



/* --- 231107 銀行口座チャージ バナー ---*/
.charge-bank-point .cam_banner_img {
    text-align: center;
    margin-top: 50px;
}
.charge-bank-point .cam_banner_img a {
    transition: 0.2s;
}
.charge-bank-point .cam_banner_img a:hover {
    opacity: 0.5;
}

@media screen and (max-width: 736px) {
    .charge-bank-point .cam_banner_img {
        margin-top: 5vw;
    }
}

/* --- 240208 majicaマンガ バナー ---*/
.secAppArea.manga {
	background: #FFEAEA;
	margin: 0 auto;
	padding: 40px 20px 5px;
	text-align: center;
}
.secAppArea.manga a {
	transition: all .2s;
}
.secAppArea.manga a:hover {
	opacity: .7;
}
.secAppArea.manga img {
	width: 100%;
	max-width: 600px;
	border: 1px solid #fff;
	border-radius: 15px;
}
.secAppArea.manga p {
	margin: 10px 0 20px 0;
	font-weight: 700;
    font-size: 96%;
}
.brsp {
	display: none;
}






/* =========================================================
     2024.04.17 
========================================================= */

.transmission_table {
    margin: 10px 0;
}
.transmission_table thead th {
    background-color: #EFEFEF;
    box-sizing: border-box;
    border: 1px solid #D8D8D8;
    font-weight: 700;
    padding: 15px 15px;
    vertical-align: middle;
}
.transmission_table tbody td {
    background-color: #fff;
    box-sizing: border-box;
    border: 1px solid #D8D8D8;
    padding: 15px 15px;
    vertical-align: middle;
    font-size: 14px;
    line-height: 1.5;
}
.transmission_table thead th:first-child {
    width: 450px;
}
@media screen and (max-width: 736px) {
    .transmission_table {
        border-bottom: 1px solid #D8D8D8;
    }
    .transmission_table thead {
        display: none;
    }
    .transmission_table tbody td {
        display: block;
        width: 100%;
        font-size: 12px;
        padding: 10px 10px;
        border-bottom: none;
    }
    .transmission_table td:first-child {
        background-color: #EFEFEF;
    }
}



/* =========================================================
     2024.05.16  MV スライド一時停止ボタン
========================================================= */
.mvArea {
    position: relative;
}
#pause_button {
    position: absolute;
    right: 20px;
    bottom: -5px;
    z-index: 11;
}
#pause_button .slick_pause {
    background: url(../img/index/pause_button_02.png) no-repeat center center / contain;
    width: 18px;
    height: 18px;
    border: none;
    box-shadow: none;
    cursor: pointer;
}
#pause_button .slick_pause:hover {
    background-image: url(../img/index/pause_button_02_hover.png);
}
#pause_button .slick_pause.paused {
    background-image: url(../img/index/pause_button_01.png);
}
#pause_button .slick_pause.paused:hover {
    background-image: url(../img/index/pause_button_01_hover.png);
}


.mvArea .slick-dots li button {
    width: 10px;
    height: 10px;
    cursor: pointer;
}



/* =========================================================
     2024.11.28  初めての方 majicaアプリ ページ改修
========================================================= */

@media screen and (min-width: 737px) {
    .functionInfo {
        overflow: hidden;
    }
    .functionInfo > div {
        float: left;
    }

    .functionInfo .infoCont {
        background-color: #EFEFEF;
        box-sizing: border-box;
        margin-bottom: 20px;
        padding: 25px;
        width: calc(50% - 10px );
    }
    .functionInfo .infoCont:nth-of-type(odd) {
        margin-right: 20px;
    }
    .functionInfo .infoCont:last-of-type {
        margin-right: 0px;
    }
}


/* =========================================================
     2025.06.17  headerにどこでもmajicaの追加
========================================================= */
header .headLink .li_dokodemo_pc{
    align-items: center;
    display: flex;
    justify-content: center;
    
    background-color: #FFEAEA;
    color: #8E8E8E;
    font-size: 93%;
    font-weight: 700;
    height: 53px;
    line-height: 110%;
    padding-left: 30px;
    padding-right: 0;
    position: relative;
    transition: opacity 0.6s;
    text-decoration: none;
}
header .headLink .li_dokodemo_pc img{
    width: 100px;
    max-width: 100%;
}

header .headLink .li_dokodemo_sp{
    display: none;
}



/* =========================================================
     2025.12.08  majicaキャンペーン一覧整え
========================================================= */
#cam_list_page p.cam_c_ttl {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 0.5em;
    letter-spacing: -0.02em;
    line-height: 1.5;
}


#cam_list_page p.store-format_list {
    color: #E60013;
    margin-bottom: 0.25em;
    font-size: 13px;
}

#cam_list_page p.campaign-period {
    color: #8D8D8D;
    display: block;
    margin-bottom: 0;
    font-size: 13px;
}






#cam_list_page .cateArea {
    display: flex;
    position: absolute;
    left: 10px;
    right: 0px;
    margin: auto;
    top: 10px;
}
#cam_list_page .campaignList li .cate {
    border-radius: 5px;
    font-weight: bold;
    line-height: 30px;
    font-size: 14px;
    padding: 0px 10px;
    position: static;
    margin-right: 5px;
}

#cam_list_page .campaignList li .tag {
    border-radius: 5px;
    font-weight: bold;
    line-height: 30px;
    font-size: 14px;
    padding: 0px 10px;
    position: static;
}

#cam_list_page .campaignList li a {
    padding-bottom: 0;
}
#cam_list_page .campaignList li .pict {
    height: auto;
    padding: 50px 10px 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    margin-bottom: 15px;
}
#cam_list_page .pict_inner {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 65.7%;
    
}

#cam_list_page .pict_inner > img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}



#cam_list_page .campaignList li .pict:after {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 100%;
    overflow: hidden;
    text-indent: 180%;
    white-space: nowrap;
    content: "";
    display: block;
    height: 30px;
    width: 30px;
    background-image: url(../img/campaign/icon.svg);
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #e60013;
    border-radius: 5px;
}

@media screen and (max-width:850px){
    #cam_list_page .campaignList li {
        margin: 0 2% 45px 0;
        width: 49%;
    }
    #cam_list_page .campaignList li:nth-child(3n) {
        margin-right: 2%;
    }
    #cam_list_page .campaignList li:nth-child(2n) {
        margin-right: 0%;
    }
}