@charset "UTF-8";
/*-------------------------------------------

/hojin/visa_debit/visa_debit_rwd.css

-------------------------------------------*/
@media screen and (max-width: 768px) {
  /* ここから下層ページと共通 */
  .mainList li a {
    float: none;
    margin-right: 0;
    letter-spacing: -0.04em;
    text-align: center; }
  .noteTbl {
    width: 100%;
    padding: 7px 0; }
    .noteTbl th, .noteTbl td {
      padding: 7px 0; }
  /* ここまで下層ページと共通 */
  /* ここから hojin_debitトップ */
  .top {
    /* common */
    /* main */
    /* pickup */
    /* about */
    /* compare */
    /* merit */
    /* solution */
    /* offer */ }
    .top .forPc {
      display: none; }
    .top .forSp {
      display: block; }
    .top .linkBtn {
      width: 100%; }
    .top .strongText05 {
      font-size: 1.25em;
      font-weight: bold; }
    .top .mainImg {
      margin-bottom: 3vw; }
    .top .mainLinkList {
      margin-bottom: 6vw; }
    .top .mainLinkItem a {
      padding: 4vw 0 4vw 5vw;
      letter-spacing: -0.03em; }
    .top .mainLinkItem01 a:after {
      top: 50%;
      right: 4vw;
      transform: translateY(-50%);
      width: 8.64vw;
      height: 7.58vw;
      background-size: 100%; }
    .top .mainLinkItem02 a:after {
      top: 50%;
      right: 4vw;
      transform: translateY(-50%);
      width: 8.64vw;
      height: 8vw;
      background-size: 100%; }
    .top .mainLinkItem03 a:after {
      top: 50%;
      right: 4vw;
      transform: translateY(-50%);
      width: 8.64vw;
      height: 8vw;
      background-size: 100%; }
    .top .mainLinkItem .btnT01 > span:before {
      left: 4.5vw; }
    .top .mainLinkItem *[class^="btnT"][class*=" glyph"].btnWFull {
      padding-right: 8vw !important; }
    .top .mainTxtList {
      margin-bottom: 5vw; }
    .top .pickup {
      margin: 10vw 0 11vw; }
      .top .pickupTtl {
        font-size: 1.6em;
        font-weight: bold; }
      .top .pickupImg {
        margin: 2vw 0 3vw; }
        .top .pickupImg img {
          width: 100%; }
      .top .pickupInfoTxt {
        width: 100%; }
    .top .about {
      margin-top: 36px;
      margin-bottom: 14vw; }
      .top .aboutDetail {
        display: block;
        margin: 0 0 6vw 0; }
        .top .aboutDetailWrap {
          width: 100%; }
          .top .aboutDetailWrap .strongText05 {
            margin-bottom: 1vw; }
        .top .aboutDetailImg {
          display: block;
          width: 119px;
          margin: 0 auto; }
      .top .aboutLimit {
        margin-left: 0; }
      .top .aboutMore {
        margin: 10px 0 40px; }
      .top .aboutDefault {
        width: 100%; }
        .top .aboutDefault .aboutTbl {
          width: 100%; }
      .top .aboutChange {
        width: 100%; }
        .top .aboutChange .aboutTbl {
          width: 100%; }
      .top .aboutScene {
        margin: 8vw 0 9vw;
        padding: 6vw 0 2vw; }
        .top .aboutSceneTtl {
          margin-bottom: 5vw;
          padding: 0 3vw; }
        .top .aboutSceneList {
          display: block;
          width: 100%;
          margin: 0 auto; }
        .top .aboutSceneList li {
          width: 54%;
          height: auto;
          margin: 0 auto 8vw; }
        .top .aboutSceneImg {
          margin-right: 4vw; }
      .top .about .relevanceBlock02 > .blockInner > .blockTitle {
        border-radius: 5px 5px 0 0 / 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0 / 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0 / 5px 5px 0 0; }
      .top .about .relevanceBlock02 > .blockInner.aboutMoreBlock02 {
        border-radius: 0 0 5px 5px / 0 0 5px 5px;
        -webkit-border-radius: 0 0 5px 5px / 0 0 5px 5px;
        -moz-border-radius: 0 0 5px 5px / 0 0 5px 5px; }
        .top .about .relevanceBlock02 > .blockInner.aboutMoreBlock02 > .blockTitle {
          border-radius: 0 / 0;
          -webkit-border-radius: 0 / 0;
          -moz-border-radius: 0 / 0; }
      .top .about .relevanceBlock02 > .blockInner > .blockDetail {
        background: none; }
    .top .compare {
      margin-bottom: 14vw; }
      .top .compare .normalBlockA01 .strongText05 {
        letter-spacing: -0.03em; } }
      @media only screen and (max-width: 768px) and (max-width: 320px) {
        .top .compare .normalBlockA01 .strongText05 {
          font-size: 1.15em; } }

@media screen and (max-width: 768px) {
      .top .compare .jsAccTitle .jsAccSwitch > * {
        padding-right: 0 !important; }
      .top .compareBtn {
        padding: 4vw 4.5vw 4vw; }
      .top .compareBtn.btnT01:hover > span {
        color: #333; }
      .top .compareTtlWrap {
        margin: 4vw 0 3vw; }
      .top .compareTtl {
        width: 33vw;
        height: 17vw;
        font-size: 0.9em;
        line-height: 1.4; }
        .top .compareTtl span {
          display: table-cell;
          vertical-align: middle; }
      .top .compareTtl02 {
        margin: 0 2vw; }
      .top .compareList {
        margin-bottom: 5vw;
        padding: 1.5vw; }
      .top .compareDetailTtl {
        padding: 1vw 0; }
      .top .compareDetailItem {
        width: 30vw;
        padding: 3vw 0 6vw;
        letter-spacing: -0.03em; }
      .top .compareDetailImg {
        margin-bottom: 3vw; }
      .top .compareDetailTxt {
        font-size: 0.9em; }
    .top .merit {
      margin-bottom: 14vw; }
      .top .meritLinkList {
        display: block; }
      .top .meritLinkItem a {
        width: 92vw;
        margin: 0 auto 5vw;
        padding-top: 4vw;
        padding-right: 0 !important;
        padding-bottom: 4vw;
        font-size: 1.25em; }
      .top .meritTtl {
        margin-bottom: 5vw;
        text-align: center; }
        .top .meritTtlNum {
          margin-right: 0;
          line-height: 1.8;
          font-size: 1.3em; }
        .top .meritTtl .titleInner {
          display: block;
          font-size: 1.7em;
          line-height: 1.8; }
      .top .meritList {
        margin-bottom: 14vw; }
        .top .meritListItem {
          display: block;
          margin-bottom: 9vw; }
        .top .meritListImg {
          width: 24vw;
          margin: 0 auto 3vw; }
        .top .meritListInner {
          width: 100%; }
        .top .meritListTtl {
          margin: 0 0 1vw;
          font-size: 1.45em;
          line-height: 1.3;
          text-align: center; }
        .top .meritListTxt {
          line-height: 1.5; }
    .top .solution {
      margin-bottom: 8vw; }
      .top .solutionStep {
        position: static;
        padding: 4%; }
        .top .solutionStep01 {
          padding: 4% 4% 0 4%; }
        .top .solutionStepImg {
          position: static; }
          .top .solutionStepImg img {
            width: 37%; }
        .top .solutionStepStepTxt {
          margin-bottom: 5px; }
      .top .solution .tabList [role="tabpanel"].solution {
        padding: 6% 5%; }
      .top .solutionExample {
        margin-top: 30px;
        padding: 4%; }
        .top .solutionExampleTtl {
          line-height: 1.5;
          letter-spacing: -0.04em;
          margin-bottom: 15px; }
        .top .solutionExampleFirst {
          float: none;
          width: 100%;
          margin: 0 0 15px;
          padding: 5px 0; }
        .top .solutionExampleItem {
          float: none;
          width: 90%;
          height: auto;
          margin-top: 15px;
          margin-left: 0;
          padding: 5%;
          line-height: 1.7; }
          .top .solutionExampleItem:first-child {
            margin: 0; }
    .top .offerTxt {
      font-size: 1.1em; }
    .top .offer .flow {
      margin-bottom: 7; }
      .top .offer .flowList {
        display: block;
        margin-bottom: 7vw; }
      .top .offer .flowItem {
        width: 100%;
        margin-bottom: 13vw; }
        .top .offer .flowItem:nth-of-type(1):after, .top .offer .flowItem:nth-of-type(2):after {
          content: "";
          display: block;
          position: absolute;
          top: auto;
          bottom: -11vw;
          left: 0;
          right: 0;
          transform: none;
          width: 76px;
          height: 28px;
          margin: 0 auto;
          background: url("/common/images/bg_arrow_bottom02.png") 0 0 no-repeat; }
        .top .offer .flowItem:nth-of-type(3) {
          margin-bottom: 0; }
    .top .offer .timeboxBlock01 .imgBlockA01 .text {
      margin-top: 4vw;
      font-size: 0.9em;
      letter-spacing: -0.04em; }
  /* ここまで hojin_debitトップ */
  /* ここからモーダル */
  .member .h3Title01 {
    margin: 3vw 0 5vw;
    padding-bottom: 3vw; }
  .memberInner {
    display: block;
    width: 94vw;
    margin: 0 auto 12vw; }
  .memberImg {
    width: auto;
    margin-bottom: 3vw;
    text-align: center; }
  .memberTxtWrap {
    width: 100%; }
  .memberTxt {
    margin: 2vw 0 4vw; }
  .memberList {
    margin-bottom: 6vw; }
  .memberBusiness {
    margin: 0 0 5vw;
    padding: 3vw; }
    .memberBusinessList {
      display: block;
      flex-wrap: wrap;
      margin-bottom: 0; }
    .memberBusinessItem {
      width: 100%;
      margin-bottom: 6vw; }
      .memberBusinessItemExample {
        margin-bottom: 0; }
  .member .modal__close-button {
    margin-bottom: 8vw; }
  /* ここまでモーダル */ }


/* 共通パーツ上書き */
@media screen and (max-width: 767px) {
h1.h1Title01, .architectureType2018 h1.h1Title01 {
  margin: -30px 0 20px -3vw;
  padding: 0;
  width: 100vw;
}
}