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

body, h1, h2, h3, h4, h5, table, th, td, ul, li, ol, dl, dt, dd, form, p, table, th, td {
  margin: 0px;
  padding: 0px;
  font-weight: normal;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  list-style-type: none;
  font-size: 100%;
}

dt, dd, li, th, td, p {
  line-height: 1.5;
}

a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-touch-callout: none;
}

a img {
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}

img {
  display: block;
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

input, textArea, select, button {
  background: none;
  margin: 0px;
  outline: none;
  padding: 0px;
  font-weight: normal;
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  list-style-type: none;
  font-size: 14px;
}

button {
  cursor: pointer;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

/*                font
  ======================================================= */

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 100;
  src: url("../fonts/notosans/NotoSansJP-Thin.woff2") format('woff2'), url("../fonts/notosans/notosans/NotoSansJP-Thin.woff") format('woff');
}
@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/notosans/NotoSansJP-Regular.woff2") format('woff2'), url("../fonts/notosans/NotoSansJP-Regular.woff") format('woff');
}
@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  src: url("/assets/fonts/notosans/NotoSansJP-Medium.woff2") format('woff2'), url("../fonts/notosans/NotoSansJP-Medium.woff") format('woff');
}
@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/notosans/NotoSansJP-Bold.woff2") format('woff2'), url("../fonts/notosans/NotoSansJP-Bold.woff") format('woff');
}

@font-face {
  font-family: 'FontAwesome';
  src: url("../fonts/fontawesome-webfont.eot?v=4.6.3");
  src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.6.3") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff2?v=4.6.3") format("woff2"), url("../fonts/fontawesome-webfont.woff?v=4.6.3") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.6.3") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

/*                link
  ======================================================= */

@media only screen and (min-width: 1025px) {
  a:hover {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
  }
  a:hover img {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
    opacity: .8;
  }
}

/*                common
  ======================================================= */

html {
  font-size: 62.5%;
}
@media screen and (max-width: 640px) {
  html {
    font-size: 2.5vw;
  }
}
body {
  font-size: 1.6rem;
  font-weight: 500;
  font-family: "Noto Sans Japanese", "Noto Sans", "Noto Sans CJK JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', "NotoSans", 'MS PGothic', arial, helvetica, sans-serif;
  color: #222;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
html {
  font-size: 62.5%;
}
@media screen and (max-width: 640px) {
  html {
    font-size: 2.5vw;
  }
}
body {
  font-size: 1.6rem;
  font-weight: 500;
  font-family: "Noto Sans Japanese", "Noto Sans", "Noto Sans CJK JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', "NotoSans", 'MS PGothic', arial, helvetica, sans-serif;
  color: #222;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
img {
  max-width: inherit;
}
@media screen and (max-width: 640px) {
  img {
    height: auto;
  }
}
picture {
  display: inline-block;
}
picture img {
  max-width: inherit;
}
@media screen and (max-width: 780px) {
  picture img {
    max-width: 100%;
    height: auto;
  }
}
a {
  font-family: "Noto Sans Japanese", "Noto Sans", "Noto Sans CJK JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', "NotoSans", 'MS PGothic', arial, helvetica, sans-serif;
  text-decoration: none;
  color: #222;
}
a:hover {
  text-decoration: none;
}
@media screen and (min-width: 640px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
button {
  outline: 0;
  border: 0;
}
img {
  flex-shrink: 0;
}
html,
body,
body div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
figure,
footer,
header,
menu,
nav,
section,
time,
mark,
audio,
video,
details,
summary {
  line-height: 1.6em;
}
table {
  border-collapse: collapse;
}
#wrapper {
  width: 100%;
  overflow: hidden;
}
.content {
  position: relative;
}
@media screen and (min-width: 769px) {
  .content {
    min-width: 1240px;
  }
}
@media screen and (max-width: 768px) {
  .content {
    min-width: 100%;
  }
}
.slick-slide {
  outline: none;
}
.show-pc {
  display: inherit;
}
@media screen and (max-width: 900px) {
  .show-pc {
    display: none;
  }
}
.show-pt {
  display: inherit;
}
@media screen and (max-width: 540px) {
  .show-pt {
    display: none;
  }
}
.show-sp {
  display: none;
}
@media screen and (max-width: 540px) {
  .show-sp {
    display: inherit;
  }
}
.show-sm {
  display: none;
}
@media screen and (max-width: 540px) {
  .show-sm {
    display: inherit;
  }
}
.text-bold{
  font-weight: bold;
}

/*                button
======================================================= */
.button-arrow {
  position: relative;
  display: block;
  font-weight: bold;
  text-align: center;
  border-radius: 50px;
  transition: all 0.5s ease;
}
.button-arrow::after {
  content: "";
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  border-top: 2px solid #0099d5;
  border-right: 2px solid #0099d5;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 15px;
  margin: auto;
}
.button-normal {
  border: 2px solid #0099d5;
  color: #0099d5;
}
.button-normal::after {
  border-color: #0099d5;
}
.button-normal:hover {
  background: #0099d5;
  color: #fff;
}
.button-normal:hover::after {
  border-color: #fff;
}
.button-red {
  border: 2px solid #e8380d;
  background: #e8380d;
  color: #fff;
}
.button-red::after {
  border-color: #fff;
}
.button-red:hover {
  background: #fff;
  color: #e8380d;
}
.button-red:hover::after {
  border-color: #fff;
}
.button-black {
  display: inline-block;
  font-size: 1.4rem;
  color: #fff;
  background: #222;
  padding: 8px 50px 5px 50px;
  border-radius: 30px;
  margin: 20px auto 0;
}
.button-black::after {
  border-color: #fff;
}
.button-black:hover {
  opacity: 0.6;
}
.button-blue {
  display: inline-block;
  color: #0099d5;
  background: #fff;
  border-radius: 50px;
  margin: 20px auto 0;
}
.button-blue::after {
  border-color: #0099d5;
  border-width: 3px;
}
.button-blue:hover {
  background: #0099d5;
  color: #fff;
}
.button-blue:hover::after {
  border-color: #fff;
}

/*                leyout
======================================================= */
.content-inner {
  width: 100%;
  max-width: 1240px;
  margin: 40px auto;
  /* padding: 0 20px; */
}
/* .section-title {
  font-size: 3.4rem;
  font-weight: bold;
  text-align: center;
  padding-bottom: 20px;
  position: relative;
}
@media screen and (max-width: 425px) {
  .section-title {
    font-size: 2.4rem;
  }
}
.section-title:after {
  content: "";
  width: 84px;
  height: 11px;
  background: #67b8e0;
  border-radius: 10px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
} */
.section-lead {
  font-size: 1.8rem;
  font-weight: bold;
  margin: 17px 0 35px;  
}
@media screen and (max-width: 425px) {
  .section-lead {
    margin: 15px 0 20px;
    text-align: left;
  }
}
.main_width {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
}

@media only screen and (max-width: 1300px) {
  .main_width {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 1024px) {
  .main_width {
    padding: 0 50px;
  }
}

@media only screen and (max-width: 850px) {
  .main_width {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 480px) {
  .main_width {
    padding: 0 15px;
  }
}

.cont_width {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 1040px;
}

@media only screen and (max-width: 1100px) {
  .cont_width {
    padding: 0 40px;
  }
}

@media only screen and (max-width: 1024px) {
  .cont_width {
    padding: 0 60px;
  }
}

@media only screen and (max-width: 850px) {
  .cont_width {
    padding: 0 30px;
  }
}

@media only screen and (max-width: 640px) {
  .cont_width {
    padding: 0 25px;
  }
}

@media only screen and (max-width: 480px) {
  .cont_width {
    padding: 0 15px;
  }
}

.cont_width_s {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 880px;
}

@media only screen and (max-width: 900px) {
  .cont_width_s {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 850px) {
  .cont_width_s {
    padding: 0 10px;
  }
}

#rental .cont_width {
  position: relative;
  z-index: 3;
  padding: 0 80px;
}

@media only screen and (max-width: 850px) {
  #rental .cont_width {
    padding: 0 50px;
  }
}

@media only screen and (max-width: 640px) {
  #rental .cont_width {
    padding: 0 30px;
  }
}

@media only screen and (max-width: 480px) {
  #rental .cont_width {
    padding: 0 25px;
  }
}

@media only screen and (max-width: 400px) {
  #rental .cont_width {
    padding: 0 20px;
  }
}

#merit .cont_width {
  padding: 0 22px;
}

@media only screen and (max-width: 850px) {
  #merit .cont_width {
    padding: 0 30px;
  }
}

@media only screen and (max-width: 640px) {
  #merit .cont_width {
    padding: 0 20px;
  }
}

#use_flow .cont_width {
  padding: 0 60px;
}

@media only screen and (max-width: 850px) {
  #use_flow .cont_width {
    padding: 0 30px;
  }
}

@media only screen and (max-width: 640px) {
  #use_flow .cont_width {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 480px) {
  #use_flow .cont_width {
    padding: 0 15px;
  }
}

/*                table
======================================================= */

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

table tr td, table tr th {
  text-align: left;
  padding: 0px;
}

.ie7 table tr th, .ie7 table tr td {
  position: relative;
}

/* 擬似テーブル */

.table {
  display: table;
  width: 100%;
}

.table .table_cell {
  display: table-cell;
  vertical-align: top;
}

@media only screen and (max-width: 640px) {
  .table.sp_brake {
    display: block;
  }
  .table.sp_brake .tablecell {
    display: block;
    width: 100%;
  }
}

/*                pageTop
======================================================= */

.page_top {
  position: fixed;
  right: 30px;
  bottom: 30px;
  z-index: 450;
  display: none;
}

@media only screen and (max-width: 850px) {
  .page_top {
    bottom: 15px;
  }
}

.page_top a {
  display: block;
}

.page_top a img {
  width: 74px;
  height: 74px;
}

@media only screen and (max-width: 850px) {
  .page_top a img {
    width: 50px;
    height: 50px;
  }
}

@media only screen and (max-width: 850px) {
  .page_top {
    right: 10px;
  }
  .page_top img {
    width: 50px;
    height: 50px;
  }
}

/*                カラム
======================================================= */

.row {
  margin-left: -14px;
  margin-right: -14px;
  overflow: hidden;
  margin-bottom: -14px;
}

@media only screen and (max-width: 1024px) {
  .row {
    margin-left: -8px;
    margin-right: -8px;
  }
}

@media only screen and (max-width: 768px) {
  .row {
    margin-left: -5px;
    margin-right: -5px;
  }
}

.row img {
  width: 100%;
}

.row .col1, .row .col2, .row .col3, .row .col4, .row .col5, .row .col6, .row .col7, .row .col8, .row .col9, .row .col10, .row .col11, .row .col12 {
  float: left;
  min-height: 1px;
  padding-left: 14px;
  padding-right: 14px;
  margin-bottom: 14px;
}

@media only screen and (max-width: 1024px) {
  .row .col1, .row .col2, .row .col3, .row .col4, .row .col5, .row .col6, .row .col7, .row .col8, .row .col9, .row .col10, .row .col11, .row .col12 {
    padding-left: 8px;
    padding-right: 8px;
  }
}

@media only screen and (max-width: 768px) {
  .row .col1, .row .col2, .row .col3, .row .col4, .row .col5, .row .col6, .row .col7, .row .col8, .row .col9, .row .col10, .row .col11, .row .col12 {
    padding-left: 5px;
    padding-right: 5px;
  }
}

.row .tab1, .row .tab2, .row .tab6 {
  float: left;
  min-height: 1px;
  padding-left: 14px;
  padding-right: 14px;
}

@media only screen and (max-width: 1024px) {
  .row .tab1, .row .tab2, .row .tab6 {
    padding-left: 8px;
    padding-right: 8px;
  }
}

@media only screen and (max-width: 768px) {
  .row .tab1, .row .tab2, .row .tab6 {
    padding-left: 5px;
    padding-right: 5px;
  }
}

.square {
  overflow: hidden;
}

.square .col1, .square .col2, .square .col3, .square .col4, .square .col5, .square .col6, .square .col7, .square .col8, .square .col9, .square .col10, .square .col11, .square .col12 {
  float: left;
  min-height: 1px;
  padding: 0;
  margin-bottom: 0;
}

.col12 {
  width: 100%;
}

.col11 {
  width: 91.66666667%;
}

.col10 {
  width: 83.33333333%;
}

.col9 {
  width: 75%;
}

.col8 {
  width: 66.66666667%;
}

.col7 {
  width: 58.33333333%;
}

.col6 {
  width: 50%;
}

.col5 {
  width: 41.66666667%;
}

.col4 {
  width: 33.33333333%;
}

.col3 {
  width: 25%;
}

.col2 {
  width: 16.66666667%;
}

.col1 {
  width: 8.33333333%;
}

@media only screen and (max-width: 1024px) {
  .pc1024Col12 {
    width: 100%;
  }
  .pc1024Col6 {
    width: 50%;
  }
  .pc1024Col3 {
    width: 25%;
  }
  .pc1024Col2 {
    width: 16.66666667%;
  }
}

@media only screen and (max-width: 768px) {
  .tab12 {
    width: 100%;
  }
  .tab6 {
    width: 50%;
  }
  .tab4 {
    width: 33.33333333%;
  }
}

@media only screen and (max-width: 767px) {
  .sp12 {
    width: 100%;
  }
  .sp6 {
    width: 50%;
  }
}

@media only screen and (max-width: 480px) {
  .sps12 {
    width: 100%;
  }
  .sps6 {
    width: 50%;
  }
}

/*                iframeのレスポン化
======================================================= */

.frame_respon .fb_iframe_widget, .frame_respon .fb_iframe_widget span, .frame_respon .fb_iframe_widget iframe[style] {
  width: 100%important;
}

.gmap {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.gmap iframe, .gmap object, .gmap embed {
  border: none !important;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*                list
======================================================= */

.list-asterisk li{
  padding-left: 1em;
  position: relative;
  display: inline-block;
}
.list-asterisk li:before{
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
  width: 1em;
  height: 1em;
}


/*                cta
======================================================= */
p.cta-button {
  text-align: center;
  margin-top: 30px;
}
.cta-button a {
  background-color: #f5297b;
  background: transparent linear-gradient(280deg, #F65878 0%, #F34B4B 100%) 0% 0% no-repeat padding-box;
  box-shadow: 0px 4px 0px #36404BCC;
  border-radius: 50px;
  color: #fff;
  display: inline-block;
  font-weight: 700;
  text-align: center;
  transition: .3s;
  padding: 23px 45px;
  position: relative;
  font-size: 2.3rem;
}
@media only screen and (max-width: 900px) {
  .cta-button a {
    font-size: 1.7rem;
  }
}
@media only screen and (max-width: 768px) {
  p.cta-button {
    margin: 30px auto 10px;
    width: 80%;
  }
  .campaign-contents p.cta-button {
    width: 100%;
  }
  .cta-button a {
    font-size: 1.3rem;
    padding: 20px 45px;
  }
  .campaign-contents .cta-button a  {
    width: 95%;
    padding: 15px 35px;
  }
}
@media only screen and (max-width: 380px) {
  .cta-button a {
      font-size: 1.2rem;
      padding: 13px 40px;
  }
}
@media only screen and (max-width: 768px) {
  .tableBlock p.cta-button {
    margin: 30px auto 10px;
    width: 95%;
  }
  .tableBlock .cta-button a {
    width: 55%;
    font-size: 1.6rem;
    padding: 10px 40px;
  }
  #tab01_content .tableBlock .cta-button a {
    padding: 5px 40px;
    line-height: 1.5em;
  }
}
@media only screen and (max-width: 650px) {
  .tableBlock .cta-button a {
    width: 90%;
    font-size: 1.3rem;
  }
}
@media only screen and (max-width: 380px) {
  .tableBlock .cta-button a {
    width: 100%;
    padding: 10px 40px;
  }
}
.cta-button a:after {
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -8px;
  right: 25px;
  width: 12px;
  height: 12px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.cta-button a span {
  position: absolute;
  display: block;
  line-height: 3.8;
  background: #fff;
  padding: 0;
  border-radius: 50%;
  top: -25px;
  left: -30px;
  width: 70px;
  height: 70px;
  font-size: 17px;
  letter-spacing: 0px;
  color: #F34B4B;
}
.cta-button a span:before {
  content: "";
  position: absolute;
  bottom: 1px;
  right: -1px;
  margin-top: -15px;
  border: 5px solid transparent;
  border-left: 10px solid #FFFFFF;
  z-index: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.tab_content .cta-button a span:before {
  border-left: 10px solid #F0F3F5;
}


/*                header
======================================================= */
@media only screen and (max-width: 1024px) {
  header {
      position: relative
  }
}

header {
  width: 100%;
  transition: 0.5s;
  z-index: 1100
}
header {
	position: fixed;
	top: -100px;
}
.header-fixed header {
  position: fixed;
  left: 0;
  top: 0
}
#header {
  /* position: fixed; */
  top: 0;
  left: 0;
  width: 100%;
  z-index: 500;
  /* 最初のspanをマイナス45度に */
}

#header.shadow {
  -webkit-box-shadow: 0px 0px 15px -1px #101112;
  box-shadow: 0px 0px 15px -1px #101112;
}

#header .bg_black {
  background-color: #000;
  height: 50px;
  z-index: 100;
}

@media only screen and (max-width: 1300px) {
  #header .bg_black {
    height: 50px;
  }
}

#header .flex {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media only screen and (min-width: 1025px) {
  #header .flex {
    height: 100%;
  }
}

@media only screen and (max-width: 1024px) {
  #header .flex {
    position: relative;
  }
}

#header .header_ttl {
  margin-right: auto;
  padding-bottom: 3px;
  padding-left: 20px;
}

@media only screen and (max-width: 1024px) {
  #header .header_ttl {
    position: absolute;
    left: 80px;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding-bottom: 0;
    padding-left: 0;
  }
}
/* @media only screen and (max-width: 900px) {
  #header .header_ttl {
    left: 9%;
    top: 50%;
  }
} */
/* @media only screen and (max-width: 425px) {
  #header .header_ttl {
    left: 0;
    transform: translate(0, -50%);
    padding-left: 60px;
  }
} */

#header .header_ttl .logo img {
  width: 44px;
}

@media only screen and (max-width: 1024px) {
  #header .header_ttl .logo img {
    width: auto;
    height: 16px;
  }
}

@media only screen and (max-width: 640px) {
  #header .header_ttl .logo img {
    height: 14px;
  }
}

@media only screen and (max-width: 350px) {
  #header .header_ttl .logo img {
    height: 12px;
  }
}

#header .header_ttl p {
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media only screen and (max-width: 1024px) {
  #header .header_ttl p {
    cursor: default;
  }
}

#header .header_ttl p .txt {
  font-weight: bold;
  padding-left: 4px;
  position: relative;
  top: 1px;
}

@media only screen and (max-width: 480px) {
  #header .header_ttl p .txt {
    font-size: 85.7%;
    padding-left: 2px;
  }
}

@media only screen and (min-width: 1025px) {
  #header .header_ttl a:hover img {
    opacity: 1;
  }
}

#header #hd_right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

#header #gnavi {
  padding-right: 10px;
}

@media only screen and (max-width: 1300px) {
  #header #gnavi {
    padding-right: 3px;
  }
}

@media only screen and (max-width: 1024px) {
  #header #gnavi {
    position: fixed;
    z-index: -1;
    /* top: 50px; */
    left: 0;
    background: rgb(0, 0, 0, 0.8);
    color: #fff;
    text-align: center;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all 0.6s;
    -o-transition: all 0.6s;
    transition: all 0.6s;
    width: 101%;
    height: 100%;
    overflow-y: auto;
    padding-right: 0;
  }

  #header #gnavi.active {
    top: 50px;
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%);
  }
}

@media only screen and (max-width: 1024px) {
  #header #gnavi ul {
    width: 100%;
    padding: 0 0 100px 0;
    margin: 0 auto;
  }
  #header #gnavi ul.flex {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    flex-direction: column;
  }
}

@media only screen and (max-width: 1024px) {
  #header #gnavi ul li {
    list-style-type: none;
    padding: 0;
    width: 90%;
    /* border-right: 1px #dbdbdb solid; */
    border-bottom: 1px #dbdbdb solid;
  }
}

#header #gnavi ul li.ap1024 {
  display: none;
}

@media only screen and (max-width: 1024px) {
  #header #gnavi ul li.ap1024 {
    display: block;
  }
}

#header #gnavi ul li a {
  color: #fff;
  font-size: 85.7%;
  padding: 0 10px;
}

@media only screen and (max-width: 1200px) {
  #header #gnavi ul li a {
    padding: 11px 8px 19px;
  }
}

@media only screen and (max-width: 1100px) {
  #header #gnavi ul li a {
    padding: 12px 6px 14px;
  }
}

@media only screen and (min-width: 1025px) {
  #header #gnavi ul li a:hover {
    color: #88dfff;
  }
}

@media only screen and (max-width: 1024px) {
  #header #gnavi ul li a {
    display: block;
    color: #fff;
    font-size: 114.3%;
    text-align: left;
    height: auto;
    position: relative;
    padding: 20px 30px 20px 20px;
  }
  #header #gnavi ul li a:hover {
    background-color: #fff;
  }
  /* #header #gnavi ul li a:before {
    font-family: FontAwesome, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f107";
    color: #1ca6d9;
    display: block;
    font-size: 18px;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -10px;
  } */
  #header #gnavi ul li a:after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-top: 3px solid #e3e3e3;
    border-right: 3px solid #e3e3e3;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    right: 25px;
    top: 50%;
    right: 20px;
    margin-top: -10px;
}
}

@media only screen and (max-width: 640px) {
  #header #gnavi ul li a {
    font-size: 100%;
  }
}

@media only screen and (max-width: 480px) {
  #header #gnavi ul li a {
    padding: 15px 30px 15px 20px;
  }
  #header #gnavi ul li a:before {
    font-size: 15px;
    right: 15px;
    margin-top: -11px;
  }
}

@media only screen and (max-width: 400px) {
  #header #gnavi ul li a {
    font-size: 85.7%;
  }
}

/* #header #hd_contact_btn {
  background-color: #fff;
} */

@media only screen and (max-width: 1024px) {
  #header #hd_contact_btn {
    position: absolute;
    right: 55px;
    top: 0;
    height: 81%;
  }
}

#header #hd_contact_btn.bg_c a {
  color: #fff;
  background: transparent linear-gradient(98deg, #F34B4B 0%, #F65878 100%) 0% 0% no-repeat padding-box;
  box-shadow: 0px 2px 0px #596A7D;
  border-radius: 40px;
}
#hd_contact_btn:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 5px;
  bottom: 0;
  margin: auto;
  z-index: 1;
  width: 8px;
  height: 8px;
  border-top: 3px solid #e3e3e3;
  border-right: 3px solid #e3e3e3;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  right: 20px;
}
#header #hd_contact_btn.bg_c a.btn_contact{
  /* background-color: #234d99; */
  background-color: #e8380d;
  height: 100%;
  /* margin-top: 4px; */
}

@media only screen and (min-width: 641px) {
  #header #hd_contact_btn.bg_c a.btn_contact{
    display: block;
  }
}

  #header #hd_contact_btn.bg_c a {
    text-align: center;
    padding: 7px 43px;
    height: 50px;
  }
@media only screen and (max-width: 1024px) {
  #header #hd_contact_btn.bg_c a {
    margin-top: 4px;
  }
}

@media only screen and (max-width: 640px) {
  #header #hd_contact_btn.bg_c a {
    font-size: 66.4%;
    text-align: center;
    padding: 0 35px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media only screen and (min-width: 1025px) {
  #header #hd_contact_btn.bg_c a:hover {
    background-color: #df130c;
  }
}

/* #header #hd_contact_btn.bg_c a:before {
  content: "";
  display: inline-block;
  background: url(../images/navi_icon.png) no-repeat left top;
  background-size: contain;
  width: 24px;
  height: 15px;
  position: relative;
  top: 3px;
  margin-right: 10px;
} */

/* @media only screen and (max-width: 1300px) {
  #header #hd_contact_btn.bg_c a:before {
    width: 22px;
    height: 13px;
    display: block;
    margin: 0 auto 5px;
  }
}

@media only screen and (max-width: 640px) {
  #header #hd_contact_btn.bg_c a:before {
    width: 22px;
    height: 13px;
    margin-right: 5px;
  }
} */

#header #sp_menu_btn {
  display: none;
}

@media only screen and (max-width: 1024px) {
  #header #sp_menu_btn {
    display: block;
    position: relative;
    top: 7px;
    right: 20px;
    width: 26px;
    height: 51px;
    cursor: pointer;
    z-index: 3;
    text-align: center;
  }
  #header #sp_menu_btn span {
    display: block;
    position: absolute;
    /* .navToggleに対して */
    width: 26px;
    border-bottom: solid 2px #eee;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    -o-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    left: 6px;
  }
  #header #sp_menu_btn span.border01 {
    top: 10px;
  }
  #header #sp_menu_btn span.border02 {
    top: 18px;
  }
  #header #sp_menu_btn span.border03 {
    top: 26px;
  }
  #header #sp_menu_btn.active span.border01 {
    top: 20px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  #header #sp_menu_btn.active span.border02, #header #sp_menu_btn.active span.border03 {
    top: 20px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}

/*                footer
======================================================= */

#footer .f_txt {
  background-color: #000;
  padding: 58px 0 50px;
  height: 200px;
}

#footer .f_logo {
  text-align: center;
  width: 174px;
  margin: 0 auto 30px;
}

#footer p.copy {
  color: #fff;
  font-size: 12px;
  text-align: center;
}

/*                コンテンツ
======================================================= */

/*      共通     */

br.ap1300, br.ap850, br.ap640, br.ap600, br.ap480, br.ap400, br.ap350 {
  display: none;
}

@media only screen and (max-width: 1300px) {
  br.ap1300 {
    display: block;
  }
}

@media only screen and (max-width: 1100px) {
  br.no1100 {
    display: none;
  }
}

@media only screen and (max-width: 850px) {
  br.ap850 {
    display: block;
  }
  br.no850 {
    display: none;
  }
}

@media only screen and (max-width: 640px) {
  br.ap640 {
    display: block;
  }
  br.no640 {
    display: none;
  }
}

@media only screen and (max-width: 600px) {
  br.ap600 {
    display: block;
  }
  br.no600 {
    display: none;
  }
}

@media only screen and (max-width: 480px) {
  br.no480 {
    display: none;
  }
  br.ap480 {
    display: block;
  }
}

@media only screen and (max-width: 400px) {
  br.no400 {
    display: none;
  }
  br.ap400 {
    display: block;
  }
}

@media only screen and (max-width: 350px) {
  br.no350 {
    display: none;
  }
  br.ap350 {
    display: block;
  }
}

.t_blue {
  color: #1ca6d9;
}

.t_orange {
  color: #e8380d;
}

.t_yellow {
  color: #eaff05;
}

.t_white {
  color: #fff;
}

.t_black {
  color: #222222;
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: end;
}

.txt_none {
  display: none;
}

.bg_white {
  background-color: #fff;
}

.bg_gray {
  background-color: #f3f3f3;
}

.txt_blue {
  color: #1ca6d9;
  margin: 10px 0;
}

.bold {
  font-weight: bold;
}

.caution {
  font-size: 75%;
}

.textlink-arrow {
  color: #0099d5;
  display: inline-block;
  line-height: 1;
  transition: 300ms;
  text-decoration: underline;
}
.textlink-arrow::after {
  content: "";
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  border-top: 2px solid #0099d5;
  border-right: 2px solid #0099d5;
  transform: rotate(45deg);
  margin-left: 3px;
}

a {
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}

@media only screen and (min-width: 1025px) {
  a:hover {
    cursor: pointer;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
  }
}

/* PCで電話番号リンクを無効に */

@media only screen and (min-width: 1025px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

.pc {
  display: block;
}

@media only screen and (max-width: 768px) {
  .pc {
    display: none;
  }
}

.sp {
  display: none;
}

@media only screen and (max-width: 768px) {
  .sp {
    display: block;
  }
}

.pc_1024 {
  display: block;
}

@media only screen and (max-width: 1024px) {
  .pc_1024 {
    display: none;
  }
}

.sp_1024 {
  display: none;
}

@media only screen and (max-width: 1024px) {
  .sp_1024 {
    display: block;
  }
}

@media only screen and (max-width: 900px) {
  .pc_900 {
    display: none;
  }
}

.sp_900 {
  display: none;
}

@media only screen and (max-width: 900px) {
  .sp_900 {
    display: block;
  }
}

/*    フェードイン    */

.fadein {
  opacity: 0;
  -webkit-transform: translate(0, 50px);
  -ms-transform: translate(0, 50px);
  transform: translate(0, 50px);
  -webkit-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
}

/*画面内に入った状態*/

.fadein.scrollin {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
}

.fadein {
  opacity: 0;
  -webkit-transform: translate(0px, 100px);
  -ms-transform: translate(0px, 100px);
  transform: translate(0px, 100px);
  -webkit-transition: all 200ms;
  -o-transition: all 200ms;
  transition: all 200ms;
}

#about.fadein.scrollin, #use_flow .ttl_setbox.fadein {
  opacity: 1;
  -webkit-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}

#about .fadein.box_l, #use_flow .flow_listbox.fadein {
  -moz-transition-delay: 200ms;
  -webkit-transition-delay: 200ms;
  -o-transition-delay: 200ms;
  -ms-transition-delay: 200ms;
}

#about .fadein.box_r, #cooperation .tablet_img.fadein, #support .upay_img.fadein {
  -moz-transition-delay: 200ms;
  -webkit-transition-delay: 200ms;
  -o-transition-delay: 200ms;
  -ms-transition-delay: 200ms;
}

/*  共通  コンタクトボタン  */

.contact_btn, .otherpage_btn{
  max-width: 400px;
  width: 100%;
  margin: 30px auto 0;
}

.otherpage_btn.param{
  max-width: 100%;
}

@media only screen and (max-width: 600px) {
  .contact_btn, .otherpage_btn {
    max-width: 430px;
    padding: 0 10px;
  }
}

@media only screen and (max-width: 350px) {
  .contact_btn, .otherpage_btn {
    max-width: 400px;
    padding: 0;
  }
}

.contact_btn a, .otherpage_btn a {
  position: relative;
  background-color: #fff;
  border-radius: 40px;
  color: #1ca6d9;
  font-size: 114.3%;
  font-weight: bold;
  text-align: center;
  padding: 13px 20px 16px;
}

.contact_btn a {
  color: #fff;
  background: transparent linear-gradient(98deg, #F34B4B 0%, #F65878 100%) 0% 0% no-repeat padding-box;
  box-shadow: 0px 4px 0px #596A7D;
  border-radius: 40px;
}

.contact_btn.param a{
  background-color: #e8380d;
}

@media only screen and (max-width: 480px) {
  .contact_btn a, .otherpage_btn a {
    font-size: 114.3%;
    padding: 12px 12px 16px;
  }
}

@media only screen and (max-width: 400px) {
  .contact_btn a, .otherpage_btn a {
    font-size: 114.3%;
    padding: 15px 12px 14px;
  }
}

@media only screen and (max-width: 320px) {
  .contact_btn a, .otherpage_btn a {
    font-size: 85.7%;
    margin: auto;
  }
}

.contact_btn a.btn_app:before, .contact_btn a.btn_app:hover:before{
  content: "";
  display: inline-block;
  background: url(../images/btn_icon.png) no-repeat left top;
  background-size: contain;
  width: 32px;
  height: 20px;
  position: relative;
  top: 0;
  margin-right: 10px;
}

@media only screen and (min-width: 1025px) {
  .contact_btn a:before, .contact_btn a:hover:before {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
  }
}

/*
@media only screen and (max-width: 480px) {
  .contact_btn a:before, .contact_btn a:hover:before {
    top: 2px;
  }
}
*/

/*
@media only screen and (max-width: 400px) {
  .contact_btn a:before, .contact_btn a:hover:before {
    display: block;
    top: -5px;
    left: 50%;
  }
}
*/

@media only screen and (max-width: 350px) {
  .contact_btn a:before, .contact_btn a:hover:before {
    display: block;
    top: -5px;
    left: 50%;
    margin-left: -16px;
  }
}

@media only screen and (min-width: 1025px) {
  .contact_btn a:hover:before {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
  }
}

#use_flow .contact_btn {
  -webkit-box-shadow: none;
  box-shadow: none;
  margin: 0 auto 0;
}

@media only screen and (max-width: 480px) {
  #use_flow .contact_btn {
    padding: 0;
  }
}

#use_flow .contact_btn a {
  padding: 10px 20px;
}

@media only screen and (max-width: 640px) {
  #use_flow .contact_btn a {
    padding: 6px 8px 7px;
  }
}

@media only screen and (max-width: 480px) {
  #use_flow .contact_btn a {
    padding: 6px 2px;
  }
}

#use_flow .contact_btn a>span {
  font-size: 14px;
  display: inline-block;
}

@media only screen and (max-width: 480px) {
  #use_flow .contact_btn a>span {
    font-size: 10px;
    line-height: 1.2;
  }
}

#use_flow .contact_btn a:before {
  display: none;
}

#contact_area .contact_btn {
  border-radius: 30px;
  max-width: 400px;
  width: 100%;
  margin: 0 auto;
}

#contact_area .contact_btn a{
  width: 100%;
  max-width: 350px;
  background-color: #fff;
  color: #1ca6d9;
  margin: 0 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media only screen and (max-width: 900px) {
  #contact_area .contact_btn a{
    max-width: 100%;
  }
  #contact_area .contact_btn a.btn_contact{
    margin-bottom: 10px;
  }
}

#contact_area a.btn_app:before, #contact_area a.btn_app:hover:before {
    background: url(../images/btn_icon_blue.png) no-repeat left top;
    background-size: contain;
}

.contact_btn a {
  -webkit-box-shadow: 0px 0px 10px 3px rgba(44, 44, 44, 0.2);
  box-shadow: 0px 0px 10px 3px rgba(44, 44, 44, 0.2);
  text-align: center;
  padding: 18px 20px 20px;
}

@media only screen and (max-width: 400px) {
  .contact_btn a {
    padding: 17px 20px 21px;
  }
  .mainvisual .contact_btn a{
    width: 90%;
    padding: 10px 20px 15px;
    margin: auto;
  }
}

@media only screen and (max-width: 320px) {
  .mainvisual .contact_btn a{
    width: 80%;
    padding: 12px 20px 12px;
  }
  .mainvisual .contact_btn a:before{
    content: none;
  }
}

#MAINVISUAL h2{
	font-size: 6.0rem;
	color: #FFF;
	text-shadow: 5px 5px 10px rgba(0, 0, 0, 0.4);
	line-height: 1.0em;
	margin-bottom: 15px;
}
#MAINVISUAL h2 span{
	font-size: 7.0rem;
	line-height: 1.0em;
}
@media screen and (max-width: 768px) {
  #MAINVISUAL h2{
		font-size: 2.4rem;
  }
	#MAINVISUAL h2 span{
		font-size: 3.6rem;
	}
}

.contact_btn a:before {
  top: 3px;
}

@media only screen and (max-width: 400px) {
  .contact_btn a:before {
    display: inline-block;
    top: 5px;
    left: 0;
    margin-right: 10px;
  }
}

@media only screen and (max-width: 600px) {
  .otherpage_btn {
    padding: 0 15px;
  }
  #specification .otherpage_btn{
    padding: 0;
  }
}

.otherpage_btn a {
  border: 3px #1ca6d9 solid;
  padding: 20px 20px 20px;
}

.otherpage_btn.param a{
  padding: 0;
}

.otherpage_btn.param a,#specification .otherpage_btn a{
  color: #fff;
  width: 100%;
  max-width: 450px;
}

#specification .otherpage_btn a{
  border: 3px #1ca6d9 solid;
  background: #1ca6d9;
}

.otherpage_btn.param a.btn_app,#specification .otherpage_btn.param a.btn_app{
  border: 3px #e8380d solid;
  background: #e8380d;
}

.otherpage_btn.param a.btn_contact,#specification .otherpage_btn.param a.btn_contact{
  /* border: 3px #234d99 solid;
  background: #234d99; */
  border: 3px #e8380d solid;
  background: #e8380d;
}

@media only screen and (max-width: 400px) {
  .otherpage_btn.param a,#specification .otherpage_btn a{
    font-size: 100%;
    padding: 17px 20px 21px;
  }
}

.otherpage_btn a:before {
  font-family: FontAwesome, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f105";
  font-size: 20px;
  display: inline-block;
  background: none;
  padding-left: 0;
  width: 0;
  height: 0;
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -14px;
}

.otherpage_btn a:hover:before {
  background: none;
}

@media only screen and (min-width: 1025px) {
  .light {
    overflow: hidden;
    -webkit-transition: cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: cubic-bezier(0.19, 1, 0.22, 1);
    transition: cubic-bezier(0.19, 1, 0.22, 1);
  }
  .light:after {
    content: "";
    width: 160%;
    height: 160%;
    background: rgba(89, 234, 249, 0.25);
    -webkit-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    transform: rotate(-40deg);
    position: absolute;
    top: -10%;
    left: -180%;
    -webkit-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    -webkit-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
    transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
  }
  .light:hover:after {
    left: 60%;
  }
}

/*      タイトル装飾       */

.cont_ttl {
  margin-bottom: 20px;
}

@media only screen and (max-width: 640px) {
  .cont_ttl {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 480px) {
  .cont_ttl {
    margin-bottom: 15px;
  }
}

.cont_ttl h2 {
  font-size: 271.4%;
  font-weight: bold;
  text-align: center;
  margin-bottom: 10px;
}

@media only screen and (max-width: 850px) {
  .cont_ttl h2 {
    font-size: 185.7%;
  }
}

@media only screen and (max-width: 600px) {
  .cont_ttl h2 {
    font-size: 171.4%;
  }
}

@media only screen and (max-width: 480px) {
  .cont_ttl h2 {
    font-size: 157.1%;
  }
}

@media only screen and (max-width: 400px) {
  .cont_ttl h2 {
    font-size: 142.9%;
  }
  #feature .cont_ttl h2{
    line-height: 2;
  }
}

.cont_ttl h2.font_s {
  font-size: 200%;
}

@media only screen and (max-width: 640px) {
  .cont_ttl h2.font_s {
    font-size: 142.9%;
  }
}

@media only screen and (max-width: 350px) {
  .cont_ttl h2.font_s {
    font-size: 128.6%;
  }
}

.cont_ttl h2.left {
  text-align: left;
  margin-bottom: -5px;
}

.cont_ttl h2.left a, .aco_area .aco_box dl dd a {
  display: inline-block;
  text-decoration: underline;
  color: #1ca6d9;
}

.cont_ttl h2.left a.link_txt, .aco_area .aco_box dl dd a.link_txt {
  padding-right: 1.5em;
  position: relative;
}

.cont_ttl h2.left a.link_txt:after, .aco_area .aco_box dl dd a.link_txt:after {
  content: "";
  background: url(/u-pay/images/gaibulink.svg) no-repeat;
  width: 14px;
  height: 14px;
  position: absolute;
  top: 50%;
  right: 0.2em;
  margin-top: -7px;
}
.cont_ttl h2.left span {
  font-size: 60%;
}

@media only screen and (max-width: 640px) {
  .cont_ttl h2.left span {
    font-size: 80%;
  }
}

/*
.cont_ttl h3 {
  font-size: 200%;
  font-weight: bold;
  text-align: center;
}

@media only screen and (max-width: 640px) {
  .cont_ttl h3 {
    font-size: 142.9%;
  }
}
*/

.cont_ttl .read {
  font-size: 142.9%;
  font-weight: bold;
  line-height: 1.7;
}
/* #PRICE .cont_ttl .read + .list-asterisk{
  text-align: center;
}
#PRICE .cont_ttl .read + .list-asterisk > .small_txt {
  font-size: 14px;
  font-weight: bold;
  color: #fff;
} */

@media only screen and (max-width: 1300px) {
  .cont_ttl .read {
    font-size: 128.6%;
  }
}

@media only screen and (max-width: 850px) {
  .cont_ttl .read {
    line-height: 1.7;
  }
}

@media only screen and (max-width: 640px) {
  .cont_ttl .read {
    font-size: 114.3%;
  }
}

@media only screen and (max-width: 480px) {
  .cont_ttl .read {
    font-size: 100%;
    line-height: 1.6;
  }
}

.cont_ttl .read.large {
  font-size: 171.4%;
}

@media only screen and (max-width: 1300px) {
  .cont_ttl .read.large {
    font-size: 150%;
  }
}

@media only screen and (max-width: 950px) {
  .cont_ttl .read.large {
    font-size: 135.7%;
  }
}

@media only screen and (max-width: 640px) {
  .cont_ttl .read.large {
    font-size: 121.4%;
  }
}

@media only screen and (max-width: 400px) {
  .cont_ttl .read.large {
    font-size: 107.1%;
  }
}

.cont_ttl .read.font_s {
  font-size: 114.3%;
}

.cont_ttl .read.center {
  text-align: center;
}
.cont_ttl .read .borderbottomWH {
  border-bottom: #fff 2px solid;
  padding-bottom: 3px;
  display: inline-block;
}
.cont_ttl .read .borderbottomB {
  border-bottom: #2fa6d5 2px solid;
  display: inline-block;
}
.arrowB{
    position: relative;
    display: inline-block;
    padding: 0 0 0 16px;
    margin: 0 0 0 6px;
    color: #000;
    vertical-align: middle;
    text-decoration: none;
    font-size: 15px;
}
.arrowB::before,
.arrowB::after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}
.steparrow::before{
    left: 2px;
    width: 7px;
    height: 3px;
    background: #2fa6d5;
}
.steparrow::after{
    left: 2px;
    width: 6px;
    height: 6px;
    border-top: 3px solid #2fa6d5;
    border-right: 3px solid #2fa6d5;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.cont_ttl .read .small_txt {
  font-size: 14px;
}

.cont_ttl h2+.read {
  margin-top: 2%;
}

@media only screen and (max-width: 640px) {
  .cont_ttl h2+.read {
    margin-top: 6%;
  }
}

.cont_ttl .border_blue {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(91.5%, transparent), color-stop(0%, #1ca6d9));
  background: -webkit-linear-gradient(transparent 91.5%, #1ca6d9 0%);
  background: -o-linear-gradient(transparent 91.5%, #1ca6d9 0%);
  background: linear-gradient(transparent 91.5%, #1ca6d9 0%);
  padding-bottom: 3px;
}

/*  アコーディオンボタン   */

.aco_area .aco_box {
  background-color: #fff;
  border: 2px #e3e3df solid;
  border-radius: 10px;
  padding: 0 10px 0 30px;
}

@media only screen and (max-width: 850px) {
  .aco_area .aco_box {
    padding: 10px 15px 10px 20px;
  }
}

.aco_area .aco_box .aco_box_subttl{
  margin-top: 10px;
}

.aco_area .aco_box+.aco_box {
  margin-top: 6px;
}

.aco_area .aco_box dl dt {
  font-size: 114.3%;
  font-weight: bold;
  position: relative;
  cursor: pointer;
  padding: 13px 0 12px 0;
}

/* .upay_master .upay_master_title{
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 30px;
}

@media only screen and (max-width: 640px) {
  .upay_master .upay_master_title{
    font-size: 142.9%;
    margin-bottom: 15px;
  }
}

.upay_master .upay_master_title span{
  border-bottom: 5px solid #1ca6d9;
}

@media only screen and (min-width: 1025px) {
  .upay_master .aco_area_outer{
    display: flex;
    justify-content: space-between;
  }
}

@media only screen and (min-width: 1025px) {
  .upay_master .aco_area_outer .aco_area{
    width: 100%;
  }
}

.upay_master .aco_area_outer .aco_area .aco_logo{
  margin-right: 30px;
}

.upay_master .aco_area_outer .aco_area .aco_logo + .txt_blue{
  font-size: 18px;
}

@media only screen and (max-width: 640px) {
  .upay_master .aco_area_outer .aco_area .aco_logo + .txt_blue{
    font-size: 114.3%;
  }
}

.upay_master .aco_area .aco_box dl dt {
  font-size: 90%;
  display: flex;
  align-items: center;
} */

@media only screen and (max-width: 850px) {
  .aco_area .aco_box dl dt {
    padding: 10px 0 8px 0;
  }
}

@media only screen and (max-width: 640px) {
  .aco_area .aco_box dl dt {
    padding: 7px 0 5px 0;
  }
}

.aco_area .aco_box dl dt .btn, .aco_area .aco_box dl dt .btn span {
  display: inline-block;
  -webkit-transition: all .4s;
  -o-transition: all .4s;
  transition: all .4s;
}

.aco_area .aco_box dl dt .btn {
  background-color: #ebebeb;
  border-radius: 50%;
  float: right;
  position: absolute;
  top: 50%;
  right: 10px;
  width: 30px;
  height: 30px;
  margin-top: -15px;
}

@media only screen and (max-width: 640px) {
  .aco_area .aco_box dl dt .btn {
    right: 0;
    top: 10%;
    margin-top: 0;
  }
}

.aco_area .aco_box dl dt .btn span {
  position: absolute;
  top: 50%;
  left: 8px;
  width: 50%;
  height: 2px;
  background-color: #1ca6d9;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -o-border-radius: 4px;
}

.aco_area .aco_box dl dt .btn span.border01 {
  top: 13px;
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
}

.aco_area .aco_box dl dt .btn span.border02 {
  top: 13px;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
}

.aco_area .aco_box dl dt .btn.active span:nth-of-type(1) {
  display: none;
}

.aco_area .aco_box dl dt .btn.active span:nth-of-type(2) {
  top: 13px;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}

.aco_area .aco_box dl dd {
  border-top: 1px #e3e3df solid;
  display: none;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  padding: 12px 0 10px;
}

/* cashless_area
========================================================================== */
/*
#main_area .cashless_area_cont {
  position: relative;
}
*/

/*
#main_area .cashless_area_cont:before {
  content: "";
  display: block;
  background: url(../images/diagonal_bg_pc.png) no-repeat center bottom;
  background-size: 2300px 1516px;
  width: 2300px;
  height: 1516px;
  position: absolute;
  left: 50%;
  top: 200px;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: -1;
}
*/
/* 
@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont:before {
    background: url(../images/diagonal_top.gif) no-repeat center bottom;
    width: 100%;
    background-size: 100% auto;
    left: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
  }
}

@media only screen and (max-width: 480px) {
  #main_area .cashless_area_cont:before {
  }
}

#main_area .cashless_area_cont .cashless_area {
  margin: 40px -40px 40px;
}

@media only screen and (max-width: 1100px) {
  #main_area .cashless_area_cont .cashless_area {
    margin: 40px -25px 40px;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area {
    margin: 40px 0 40px;
  }
}

@media only screen and (max-width: 640px) {
  #main_area .cashless_area_cont .cashless_area {
    margin: 10px 0 0;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area.flex {
    display: block;
  }
}

#main_area .cashless_area_cont .cashless_area .in_box {
  width: 33.3333333%;
  padding: 0 40px;
  position: relative;
}

@media only screen and (max-width: 1100px) {
  #main_area .cashless_area_cont .cashless_area .in_box {
    padding: 0 25px;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding: 20px 0;
  }
  #main_area .cashless_area_cont .cashless_area .in_box:last-child{
    padding: 20px 0 0;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box+.in_box {
    border-top: 1px #d4d4d4 solid;
  }
}

#main_area .cashless_area_cont .cashless_area .in_box:before {
  content: "";
  display: block;
  background-color: #d4d4d4;
  width: 1px;
  height: 118px;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box:before {
    display: none;
  }
}

#main_area .cashless_area_cont .cashless_area .in_box:first-child:before {
  display: none;
}

#main_area .cashless_area_cont .cashless_area .in_box .box_img {
  max-width: 178px;
  margin: 0 auto 10px;
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box .box_img {
    max-width: inherit;
    width: 35%;
    padding-right: 5%;
  }
}

@media only screen and (max-width: 640px) {
  #main_area .cashless_area_cont .cashless_area .in_box .box_img {
    padding-right: 0;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box .box_img img {
    width: 100%;
    height: auto;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl {
    width: 65%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

@media only screen and (max-width: 640px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl {
    width: 60%;
  }
}

@media only screen and (max-width: 350px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl {
    width: 65%;
  }
}

#main_area .cashless_area_cont .cashless_area .in_box dl dt {
  font-size: 142.9%;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}

@media only screen and (max-width: 1200px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl dt {
    font-size: 128.6%;
  }
}

@media only screen and (max-width: 1100px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl dt {
    font-size: 114.3%;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl dt {
    font-size: 121.4%;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 10px;
  }
}

@media only screen and (max-width: 400px) {
  #main_area .cashless_area_cont .cashless_area .in_box dl dt {
    font-size: 107.1%;
    margin-bottom: 5px;
  }
}

#main_area .cashless_area_cont .cashless_area .in_box dl dd .small {
  font-size: 78.6%;
} */
/* 
#QUESTION .aco_area .aco_box {
  padding: 28px 15px 27px 30px;
}

@media only screen and (max-width: 850px) {
  #QUESTION .aco_area .aco_box {
    padding: 22px 15px 23px 20px;
  }
}

@media only screen and (max-width: 640px) {
  #QUESTION .aco_area .aco_box {
    padding: 18px 15px 21px 20px;
  }
}

#QUESTION .aco_area .aco_box dl dt:before, #QUESTION .aco_area .aco_box dl dd:before {
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
}

#QUESTION .aco_area .aco_box dl dt {
  font-size: 128.6%;
  padding: 0 50px 0 40px;
}

@media only screen and (max-width: 640px) {
  #QUESTION .aco_area .aco_box dl dt {
    font-size: 121.4%;
    padding: 0 55px 0 40px;
  }
}

#QUESTION .aco_area .aco_box dl dt:before {
  background: url(../images/question.png) no-repeat left top;
  background-size: contain;
  position: absolute;
  width: 30px;
  height: 30px;
  top: 0;
}

@media only screen and (max-width: 850px) {
  #QUESTION .aco_area .aco_box dl dt:before {
    width: 26px;
    height: 26px;
    margin-top: 3px;
  }
}

#QUESTION .aco_area .aco_box dl dd {
  display: block;
  position: relative;
  padding: 24px 10px 0 40px;
  margin-top: 24px;
}

@media only screen and (max-width: 850px) {
  #QUESTION .aco_area .aco_box dl dd {
    padding-top: 16px;
    margin-top: 16px;
  }
}

#QUESTION .aco_area .aco_box dl dd:before {
  background: url(../images/answer.png) no-repeat left top;
  background-size: contain;
  width: 30px;
  height: 23px;
}

@media only screen and (max-width: 850px) {
  #QUESTION .aco_area .aco_box dl dd:before {
    width: 27px;
    height: 20px;
    margin-top: 3px;
  }
} */
.campaign-cate-title{
  font-weight: bold;
  margin-bottom: 5px;
}
.campaign-cate-title + ul{
  margin-bottom: 10px;
}
.campaign-cate-text{
  margin-top: 20px;
}
#main_area{
  /* margin-top: 50px; */
}

/*  共通 ここまで   */

/* MAINVISUAL
========================================================================== */
.mainvisual {
  position: relative;
  overflow: hidden;
  height: 3700px;
  -o-object-fit: cover;
  object-fit: cover;
  background: transparent linear-gradient(133deg, #35ADEB 0%, #323E85 100%) 0% 0% no-repeat padding-box;
}
@media screen and (max-width: 1024px) {
  .mainvisual {
    height: 4150px;
  }
}
@media screen and (max-width: 900px) {
  .mainvisual {
    height: 4800px;
    min-height: 660px;
  }
}
@media screen and (max-width: 769px) {
  .mainvisual {
    height: 5430px;
  }
}
@media screen and (max-width: 540px) {
  .mainvisual {
    height: 5200px;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual {
    height: 5000px;
  }
}
@media screen and (max-width: 430px) {
  .mainvisual {
    height: 4825px;
  }
}
@media screen and (max-width: 390px) {
  .mainvisual {
    height: 4575px;
  }
}

.mainvisual-inner {
  max-width: 1024px;
  /* padding: 0 20px; */ 
  margin: 0px auto;
  position: absolute;
  top: 40px;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
/* @media screen and (max-width: 480px) {
  .mainvisual-inner {
    top: 10px;
  }
} */
.mainvisual-inner .kv_catch {
  text-align: left;
  letter-spacing: 0.4px;
  color: #323E85;
  font-weight: bold;
  margin-top: 15px;
  position: relative;
}

@media screen and (max-width: 1200px) {
  .mainvisual-inner .kv_catch {
    margin-left: 10%;
  }
}
@media screen and (max-width: 768px) {
  .mainvisual-inner .kv_catch {
    font-size: 12px;
  }
}

@media screen and (min-width: 1025px) {
  .mainvisual:before {
    content: "";
    position: absolute;
    background: url(../images/mv_label_pc.png) no-repeat;
    background-size: cover;
    width: 260px;
    height: 297px;
    top: 0;
    right: 5%;
    z-index: 10;
  }
}
@media screen and (max-width: 1024px) {
  .mainvisual:before {
    content: "";
    position: absolute;
    background: url(../images/mv_label_sp.png) no-repeat;
    background-size: cover;
    width: 353px;
    height: 314px;
    top: 540px;
    right: 0;
    z-index: 10;
  }
}
@media screen and (max-width: 768px) {
  .mainvisual:before {
    width: 280px;
    height: 250px;
    top: 540px;
    right: 0;
    z-index: 10;
  }
}
@media screen and (max-width: 600px) {
  .mainvisual:before {
    top: 455px;
    width: 253px;
    height: 223px;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual:before {
      top: 440px;
      width: 200px;
      height: 178px;
  }
}
.mainvisual-title-area {
  width: 100%;
  max-width: 500px;
  text-align: center;
  /* margin: auto; */
  color: #000;
  position: relative;
}

@media screen and (max-width: 1024px) {
  .mainvisual-title-area {
    max-width: 90%;
  }

}
.mainvisual-title-area::before {
  content: "";
  background: #fff;
  width: 260%;
  height: 100%;
  padding: 30px 40px 10px 0;
  border-radius: 0px 20px 20px 0px;
  position: absolute;
  right: -20px;
  top: -20px;
  opacity: 0.7;
  z-index: -1;
}
.mainvisual-title-area::after {
  content: "";
  width: 260%;
  height: 100%;
  padding: 30px 40px 10px 0;
  position: absolute;
  right: -20px;
  top: -20px;
  z-index: -1;
  background: var(---ffffff) 0% 0% no-repeat padding-box;
  border-radius: 0px 16px 16px 0px;
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
}
@media screen and (max-width: 480px) {
  .mainvisual-title-area {
    margin-bottom: 40px;
  }
}

.mainvisual-title-text *{
	font-weight: bold;
}
.mainvisual-title-text {
  font-size: 2.8rem;
  font-weight: bold;
  letter-spacing: 1.08px;
  color: #323E85;
  opacity: 1;
  font-size: 36px;
  margin-top: 33px;
}
@media screen and (max-width: 1024px) {
  .mainvisual-title-text {
    font-size: 2.4rem;
    width: 95%;
  }
}
/* @media screen and (max-width: 768px) {
  .mainvisual-title-text {
    font-size: 2rem;
  }
} */
/* @media screen and (max-width: 480px) {
  .mainvisual-title-text {
    font-size: 1.6rem;
  }
} */
/*.mainvisual-title-text h1 {
  margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
  .mainvisual-title-text h1 {
    margin-bottom: 15px;
  }
}*/
.mainvisual-title-text h1 span {
  font-size: 80px;
  font-weight: bold;
  letter-spacing: 2px;
  color: #323E85;
  text-shadow: 8px 8px 0px #E9EFFF;
  opacity: 1;
  margin-left: 10px;
}
@media screen and (max-width: 600px) {
  .mainvisual-title-text h1 span {
    font-size: 4.8rem;
  }
}
.mainvisual-title-text h1 span.cashless {
  font-size: 30px;
  line-height: 1.3;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 20px;
}
@media screen and (max-width: 648px) {
  .mainvisual-title-text h1 span.cashless {
    font-size: 2.2rem;
  }
}
/* @media screen and (max-width: 480px) {
  .mainvisual-title-text h1 span {
    font-size: 2.2rem;
  }
} */
/*.mainvisual-title-text br {
  display: none;
}
@media screen and (max-width: 768px) {
  .mainvisual-title-text br {
    display: inherit;
  }
}*/
ul.circle {
  display: flex;
  color: #3b4043;
  /* gap: 15px; */
  margin-top: 30px;
  margin-left: 15px;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  ul.circle {
    width: 500px;
    margin: 30px auto;
  }
}
@media screen and (max-width: 600px) {
  ul.circle {
    width: 80vw;
  }
}
ul.circle li {
  font-size: 18px;
  font-weight: 700;
  line-height: 0.2;
  color: #323E85;
  background: transparent linear-gradient(315deg, #D5E0FF 0%, #D0EFFF 100%) 0% 0% no-repeat padding-box;
  width: calc(95% / 3);
  height: auto;
  border-radius: 50%;
  text-align: center;
  /* padding-top: 40px; */
  position: relative;
}

@media screen and (max-width: 600px) {
  ul.circle li {
    font-size: 1.1rem;
    height: auto;
  }
}
@media screen and (max-width: 480px) {
  ul.circle li {
    /* width: 115px;
    height: auto; */
  }
}
@media screen and (max-width: 430px) {
  ul.circle li {
    /* width: 105px; */
    /* height: 105px; */
  }
}
@media screen and (max-width: 380px) {
  ul.circle li {
    /* width: 95px;
    height: 95px; */
  }
}
/* ul.circle li:nth-child(2) {
  margin: 0 15px;
} */
ul.circle li sup {
  font-size: 8px;
  padding-top: 5px;
  margin-left: 2px;
  display: inline-block;
}
ul.circle li:last-child sup {
  margin-left: 0;
  margin-right: -15px;
}
ul.circle li:first-child {
  /* padding-top: 32px; */
}
ul.circle li:last-child {
  /* padding-top: 40px; */
  /* line-height: 1.1;*/
}
/* @media screen and (max-width: 480px) {
  ul.circle li:first-child, ul.circle li:last-child {
    padding-top: 25px;
  }
}
@media screen and (max-width: 480px) {
  ul.circle li:nth-child(2), ul.circle li:last-child {
    padding-top: 35px;
  }
} */
ul.circle li span {
  font-family: Oswald;
  font-size: 54px;
  font-weight: 500;
  line-height: 1.4em;
}
@media screen and (max-width: 600px) {
  ul.circle li span {
    font-size: 3.6rem;
  }
}

/* @media screen and (max-width: 430px) {
  ul.circle li span {
    font-size: 26px;
    padding-top: 26px;
  }
} */
ul.circle li img {
  position: absolute;
  top: -19px;
  left: 0;
  -webkit-backface-visibility: hidden;
  display: block;
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
}
ul.circle li:after {
  content: "";
  width: 92%;
  height: 92%;
  border: 2px solid #FFFFFF;
  box-sizing: border-box;
  border-radius: 50%;
  position: absolute;
  top: 6px;
  left: 6px;
}
/* @media screen and (max-width: 600px) {
  ul.circle li:after {
    width: 92%;
    height: 92%;
  }
} */
@media screen and (max-width: 480px) {
  ul.circle li:after {
    top: 4px;
    left: 4px;
  }
}

.circle_height {
  padding-top: 100%;
  height: 0;
  position: relative;
}
.circle_height p {
  /* display: none; */
  position: absolute;
  top: calc((100% - 1em) / 4);
  left: 0;
  right: 0;
  margin: 0;
  text-align: center;
  line-height: 0;
  font-weight: bold;
}
p.mt-10 {
  margin-top: 10px;
}
.kv_circle01, .kv_circle02, .kv_circle03 {
  height: 0;
}
.mainvisual-title-lead {
  font-size: 2rem;
  font-weight: bold;
  margin: -10px 0 30px;
  z-index: 1;
  position: relative;
  text-align: center;
}
@media screen and (max-width: 480px) {
  .mainvisual-title-lead {
    /*display: none;*/
    font-size: 1.4rem;
    text-align: center;
    position: relative;
    z-index: 2;
	  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.4);
  }
}
.mainvisual-main {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .mainvisual-main {
    margin-bottom: 5px;
  }
}
.mainvisual-main-left,
.mainvisual-main-right {
  position: relative;
}
@media screen and (min-width: 769px) {
  .mainvisual-main-left,
  .mainvisual-main-right {
    width: 405px;
  }
}
.mainvisual-main-right-caution{
	max-width: 308px;
	font-size: 1rem;
	margin: 5px auto 0;				
}
@media screen and (min-width: 769px){
	.mainvisual-main-right-caution{
		text-align: right;
		font-size: 1.2rem;
	}
}
.mainvisual-main-left-device {
  position: relative;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-left-device {
    transform: translate(-60%, 15%);
  }
}
.mainvisual-main-left-device-text {
  position: absolute;
  z-index: -2;
  top: -150px;
  left: -30px;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-left-device-text {
    left: auto;
    right: -50px;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-main-left-device-text {
    right: -20px;
    width: 105px;
    top: -80px;
  }
}
.mainvisual-main-left-device-text img {
  max-width: 100%;
}
@media screen and (max-width: 320px) {
  .mainvisual-main-left-device-text img {
    width: 98%;
  }
}
@media screen and (max-width: 768px) {
  .mainvisual-main-right {
    max-width: 33%;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-main-right {
    margin-right: -20px;
    max-width: 38%;
  }
}
@media screen and (max-width: 330px) {
  .mainvisual-main-right {
    margin-top: -20px;
  }
}
.mainvisual-main-point {
  width: 100%;
  max-width: 308px;
  color: #0099d5;
  background: #fff;
  border-radius: 30px;
  border: 1px solid #eee;
}
@media screen and (min-width: 769px) {
  .mainvisual-main-point {
    margin: auto;
  }
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point {
    border-radius: 10px;
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point {
    border-radius: 5px;
  }
}
.mainvisual-main-point-inner {
  padding: 20px 0;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-inner {
    padding: 15px 0;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point-inner {
    padding: 8px 0;
  }
}
.mainvisual-main-point-title {
  font-size: 2.5rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  padding: 0 10px;
  margin-bottom: 10px;
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point-title {
    font-size: 105%;
  }
}
.mainvisual-main-point-title span {
  font-size: 2.2rem;
  position: relative;
  padding: 0 15px;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-title span {
    font-weight: normal;
    font-size: 105%;
    padding: 0 8px;
  }
}
.mainvisual-main-point-title span::before,
.mainvisual-main-point-title span::after {
  content: "";
  width: 2px;
  height: 100%;
  position: absolute;
  bottom: -5px;
  background: #0099d5;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-title span::before,
  .mainvisual-main-point-title span::after {
    bottom: 0;
  }
}
.mainvisual-main-point-title span::before {
  transform: rotate(-20deg);
  left: 0;
}
.mainvisual-main-point-title span::after {
  transform: rotate(20deg);
  right: 0;
}
.mainvisual-main-point-subtitle{
  font-size: 3.6rem;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .mainvisual-main-point-subtitle{
    font-size: 1.8rem;
  }
}
.mainvisual-main-point-img {
  text-align: center;
  margin: 10px 0 20px;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-img {
    max-width: 70%;
    margin: auto;
  }
}
.mainvisual-main-point-campaign {
    max-width: 94%;
    margin: auto;
    transform: translateX(10px);
}
.mainvisual-main-point-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-list {
    margin-top: 10px;
  }
}
.mainvisual-main-point-list-item {
  font-size: 1.8rem;
  border: 2px solid #0099d5;
  padding: 0 26px;
  border-radius: 30px;
  margin: 0 5px 5px;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-list-item {
    font-size: 160%;
    padding: 2px 20px;
    margin: 0 2px 5px;
    border: 1px solid #0099d5;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point-list-item {
    padding: 0 7px;
    font-size: 100%;
    font-weight: normal;
    border-radius: 5px;
  }
}
.mainvisual-main-point-emphasis {
  background: #f1f1f1;
  padding: 15px 20px;
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  text-align: center;
  font-weight: bold;
  position: relative;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-emphasis {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    padding: 8px;
  }
}
.mainvisual-main-point-emphasis::before {
  content: "＋";
  font-size: 2.6rem;
  position: absolute;
  top: -0.5em;
  left: 0;
  right: 0;
  margin: auto;
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point-emphasis::before {
    font-size: 1.8rem;
  }
}
.mainvisual-main-point-emphasis span:first-child,
.mainvisual-main-point-emphasis span:last-child {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-point-emphasis span:first-child,
  .mainvisual-main-point-emphasis span:last-child {
    font-size: 1.8rem;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point-emphasis span:first-child,
  .mainvisual-main-point-emphasis span:last-child {
    font-size: 110%;
  }
}
.mainvisual-main-point-emphasis span:nth-child(2) {
  font-size: 1.4rem;
}
@media screen and (max-width: 480px) {
  .mainvisual-main-point-emphasis span:nth-child(2) {
    font-size: 100%;
  }
}
.mainvisual-main-device {
  position: relative;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-device {
    transform: translate(-60%, 15%);
  }
}
.mainvisual-main-device-text {
  position: absolute;
  top: -150px;
  left: -50px;
  z-index: -2;
}
@media screen and (max-width: 768px) {
  .mainvisual-main-device-text {
    top: -80px;
    left: auto;
    right: -10px;
  }
}
@media screen and (max-width: 320px) {
  .mainvisual-main-device-text {
    top: -70px;
  }
  .mainvisual-main-device-text img {
    width: 98%;
  }
}
.mainvisual-cta {
  display: flex;
  justify-content: center;
}
.mainvisual-bg {
  overflow: hidden;
  width: 80%;
  height: 600px;
  -o-object-fit: cover;
  object-fit: cover;
  background: #d1d6da;
  margin: 40px 0 0 20%;
  border-radius: 20px 0 0 20px;
}
@media screen and (max-width: 1800px) {
  .mainvisual-bg {
    width: 100%;
    margin: 40px 0 0 8%;
    
  }
}
@media screen and (max-width: 1024px) {
  .mainvisual-bg {
    height: 1020px;
  }
}
@media screen and (max-width: 768px) {
  .mainvisual-bg {
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-bg {
      /* height: 735px; */
  }
}
.mainvisual-bg img {
  width: 100%;
  height: 800px;
  -o-object-fit: cover;
  object-fit: cover;
  margin-top: calc(655px/2 - 800px/2);
}

@media screen and (max-width: 1024px) {
  .mainvisual-bg img {
    width: 60%;
    margin-top: calc(1200px / 2 - 480px / 2);
  }
}
@media screen and (max-width: 900px) {
  .mainvisual-bg img {
    width: 750px;
    height: 100%;
    margin-top: calc(250px / 2 - 500px / 2);
  }
}
@media screen and (max-width: 768px) {
  .mainvisual-bg img {
    width: 80%;
    -o-object-fit: contain;
    object-fit: contain;
    margin-top: calc(480px / 2 - 500px / 2);
  }
  .slick-dotted.slick-slider {
    margin-bottom: 0;
  }
}
@media screen and (max-width: 540px) {
  .mainvisual-bg img {
      width: 85%;
      margin-top: calc(570px / 2 - 500px / 2);
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-bg img {
    width: 96%;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual .cta-contact {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual .slick-dots li {
    display: none;
  }
}
.mainvisual-emblem {
  position: absolute;
  top: 0;
  right: -180px;
}
@media screen and (max-width: 768px) {
  .mainvisual-emblem {
    max-width: 120px;
    right: 0;
    top: -10px;
    z-index: 2;
  }
}
@media screen and (max-width: 480px) {
  .mainvisual-emblem {
    max-width: 60px;
    top: -5px;
    right: -10px;
  }
}
.mainvisual-emblem-caution {
  font-size: 1.1rem;
  color: #333;
  padding: 20px 0;
  text-align: right;
}
@media screen and (max-width: 480px) {
  .mainvisual-emblem-caution {
    font-size: 1rem;
    text-align: left;
    padding: 0 0 10px;
  }
}
.mainvisual-emblem-caution .only-sp {
  display: none;
}
@media screen and (max-width: 480px) {
  .mainvisual-emblem-caution .only-sp {
    display: inherit;
  }
}
#main_area .content_area .content {
  padding: 77px 0 70px;
}

@media only screen and (max-width: 850px) {
  #main_area .content_area .content {
    padding: 45px 0 40px;
  }
}

#main_area .upay_brand_intro {
  position: relative;
  top: 0;
  margin-top: -100px;
}

.upay_brand_intro .icon_brand{
  position: absolute;
  top: -90px;
  right: 0;
}

@media only screen and (max-width: 1100px) {
  .upay_brand_intro .icon_brand{
    top: -90px;
    right: -40px;
  }
}

@media only screen and (max-width: 768px) {
  .upay_brand_intro .icon_brand{
    top: -50px;
    right: -15px;
    z-index: 4;
  }
}

@media only screen and (max-width: 425px) {
  .upay_brand_intro .icon_brand{
    width: 80px;
    top: 0;
    right: -10px;
  }
}

@media only screen and (max-width: 850px) {
  #main_area .upay_brand_intro {
    margin-top: -100px;
  }
}

@media only screen and (max-width: 480px) {
  #main_area .upay_brand_intro {
    margin-top: -70px;
  }
}

@media only screen and (max-width: 400px) {
  #main_area .upay_brand_intro {
    margin-top: -15%;
  }
}

#main_area .upay_brand_intro .bg_white {
  -webkit-box-shadow: 0px 0px 10px 3px rgba(44, 44, 44, 0.2);
  box-shadow: 0px 0px 10px 3px rgba(44, 44, 44, 0.2);
  border-radius: 10px;
  padding: 10px 30px 10px 80px;
  z-index: -1;
  position: relative;
}

#main_area .upay_brand_intro .bg_white .upay_brand_intro_title{
  width: 45px;
  height: 80%;
  position: absolute;
  left: 30px;
  top: 0;
  bottom: 0;
  margin: auto;
  background: #545454;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media only screen and (min-width: 1025px) {
  #main_area .upay_brand_intro .bg_white .upay_brand_intro_title{
    flex-direction: column;
  }
}

@media only screen and (max-width: 1024px) {
  #main_area .upay_brand_intro .bg_white .upay_brand_intro_title{
    width: 80%;
    min-height: 40px;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 20px;
    bottom: auto;;
  }
  #main_area .upay_brand_intro.ver2 .bg_white .upay_brand_intro_title{
    min-height: 30px;
  }
}

#main_area .upay_brand_intro.ver2 .bg_white .upay_brand_intro_title{
  background: #afafaf;
}

#main_area .upay_brand_intro .bg_white .upay_brand_intro_title .text-vertical{
  font-size: 14px;
}

@media only screen and (min-width: 1025px) {
  #main_area .upay_brand_intro .bg_white .upay_brand_intro_title .text-vertical{
    writing-mode: vertical-rl;
    font-size: 16px;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	-o-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	font-size: 16px;
	display: flex;
	align-items: center;
  }
}

#main_area .upay_brand_intro .bg_white .upay_brand_intro_title .text-horizontal{
  font-size: 10px;
  padding: 0 .3em;
  border:1px solid #fff;
  margin: 0 .3em 0 .5em;
}

@media only screen and (min-width: 1025px) {
  #main_area .upay_brand_intro .bg_white .upay_brand_intro_title .text-horizontal{
    margin: 1.5em 0 .3em;
  }
}

#main_area .upay_brand_intro .bg_white .upay_brand_intro_title .text-vertical .text-large{
  font-size: 24px;
  font-weight: bold;
}

@media only screen and (min-width: 1025px) {
  #main_area .upay_brand_intro .bg_white .upay_brand_intro_title .text-vertical .text-large{
    font-size: 30px;
  }
}

#main_area .upay_master .bg_gray {
  margin-top: 30px;
  border-radius: 10px;
  padding: 30px 40px;
  z-index: -1;
}

@media screen and (max-width: 600px) {
  #main_area .upay_master .bg_gray {
    padding: 20px;
  }
}

#main_area .upay_master .aco_area {
  margin-top: 20px;
}


/* ABOUT
========================================================================== */
/* .about {
  position: relative;
  padding-top: 80px; */
/* LINK
========================================================================== */
/* }
@media screen and (max-width: 768px) {
  .about {
    padding-top: 40px;
    padding-bottom: 70px;
  }
}
.about::before {
  display: block;
  content: "";
  background-size: 2300px 1516px;
  width: 2300px;
  height: 1516px;
  background-size: cover;
  background-position: 0 50%;
  position: absolute;
  left: 50%;
  top: -230px;
  transform: translateX(-50%);
  z-index: -1;
}
.webp .about::before {
  background-image: url("../images/diagonal_bg_pc.png.webp");
}
.no-webp .about::before {
  background-image: url("../images/diagonal_bg_pc.png");
}
@media screen and (max-width: 768px) {
  .about-section-logo {
    display: block;
  }
}
@media screen and (max-width: 480px) {
  .about-section-logo {
    max-width: 200px;
  }
}
.about-section-logo img {
  display: block;
  margin-bottom: 10px;
} */
/* .about-section-title {
  font-size: 2.8rem;
  font-weight: bold;
}
@media screen and (min-width: 769px) {
  .about-section-title {
    display: flex;
    align-items: flex-end;
  }
}
@media screen and (max-width: 768px) {
  .about-section-title {
    font-size: 2rem;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 480px) {
  .about-section-title {
    font-size: 2.7rem;
  }
} */
/* .about-section-logo{
  margin-right: 5px;;
}
.about-intro {
  display: flex;
}
@media screen and (min-width: 769px) {
  .about-intro {
    align-items: center;
  }
}
.about-intro-text {
  max-width: 60%;
}
@media screen and (min-width: 769px) {
  .about-intro-text {
    padding-left: 80px;
    flex: 1;
  }
}
@media screen and (min-width: 769px) {
  .about-intro-point {
    display: flex;
    align-items: flex-end;
    margin: 10px 0 40px;
  }
}
@media screen and (min-width: 769px) {
  .about-intro-point-text {
    margin-right: 30px;
  }
}
.about-intro-point-text span {
  display: inline-block;
  line-height: 1.6;
  font-size: 3.2rem;
  font-weight: bold;
  border-bottom: 7px solid #67b8e0;
}
.about-intro-point-text br{
  display: none;
}
@media screen and (max-width: 768px) {
  .about-intro-point-text span {
    font-size: 2rem;
  }
  
}
@media screen and (max-width: 480px) {
  .about-intro-point-text br{
    display: inherit;
  }	
  .about-intro-point-text {
    margin-bottom: 20px;
  }
}
.about-intro-lead {
  text-align: justify;
}
.about-intro-lead sup {
  font-size: 50%;
  margin-right: .5em;
}
@media screen and (min-width: 481px) {
  .about-intro-lead {
    font-size: 2.3rem;
  }
}
@media screen and (max-width: 480px) {
  .about-intro-lead {
    font-size: 1.5rem;
  }
}
.about-intro-lead + .list-asterisk{
  font-size: 1.4rem;
}
.about-intro-image {
  position: relative;
}
@media screen and (max-width: 480px) {
  .about-intro-image {
    width: calc(40% + 30px);
    margin-right: -30px;
  }
  .about-intro-lead + .list-asterisk{
    font-size: 1.2rem;
  }
}
.about-intro-image img {
  z-index: 1;
  position: relative;
  max-width: 100%;
}
@media screen and (max-width: 480px) {
  .about-intro-image img {
    bottom: -50px;
    left: -30px;
    max-width: inherit;
    width: 250px;
  }
}
.about-intro-image::before {
  content: "";
  background: url("../images/upay_device_charm.svg");
  background-size: contain;
  width: 171px;
  height: 171px;
  position: absolute;
  top: -50px;
  left: -60px;
  z-index: 0;
}
@media screen and (max-width: 768px) {
  .about-intro-image::before {
    width: 130px;
    height: 130px;
    left: -50px;
  }
}
@media screen and (max-width: 480px) {
  .about-intro-image::before {
    background: url("../images/upay_device_charm_sp.svg");
    top: -55px;
    left: auto;
    right: 0;
  }
}
@media screen and (min-width: 769px) {
  .about-content {
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 480px) {
  .about-content {
    margin-top: 40px;
  }
}
@media screen and (min-width: 481px) {
  .about-list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
}
.about-list-card {
  background: #fff;
  box-shadow: 0px 6px 8px rgba(0,0,0,0.16);
  border: 6px solid #e4f0f6;
  border-radius: 20px;
  padding: 30px 28px;
  margin-bottom: 16px;
}
@media screen and (min-width: 481px) {
  .about-list-card {
    width: 24%;
    padding: 28px 20px;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 481px) {
  .about-list-card:nth-child(3),
  .about-list-card:nth-child(4) {
    margin-bottom: 0;
  }
}
.about-list-card .button-arrow {
  padding: 15px 0;
}
.about-list-card-icon {
  text-align: center;
  margin-bottom: 10px;
}
.about-list-card-icon img {
  display: inline-block;
}
@media screen and (max-width: 480px) {
  .about-list-card-icon {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 480px) {
  .about-list-card-icon img {
    height: 60px;
  }
}
.about-list-card-title {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin-bottom: 10px;
}
@media screen and (min-width: 481px) {
  .about-list-card-title {
    min-height: 3.4em;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
  }
}
@media screen and (min-width: 481px) {
  .about-list-card-text {
    min-height: 10em;
  }
}
@media screen and (max-width: 480px) {
  .about-list-card-text {
    font-size: 1.4rem;
    margin-bottom: 10px;
  }
}
.about-list-card-text span {
  display: inline-block;
  font-size: 1.2rem;
  line-height: 1.6;
  margin-top: 10px;
}
.about-list-card:last-child .about-list-card-text {
  min-height: 0;
  margin-bottom: 20px;
}
.about-list-card-caution {
  font-size: 1.2rem;
}
.about-list-card-caution li {
  padding-left: 1em;
  position: relative;
}
.about-list-card-caution li:before {
  content: "・";
  position: absolute;
  left: 0;
} */

/* SUPPORT
========================================================================== */
/* .support {
  margin-top: -50px;
  padding: 120px 0 70px;
  position: relative;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .support {
    padding: 70px 0 0;
  }
}
.support::before {
  content: "";
  background: url("../images/support_bg_pc.gif");
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .support::before {
    background: url("../images/support_bg_sp.gif");
    background-size: cover;
    height: 100%;
  }
}
.support-bg {
  position: absolute;
  top: 160px;
  left: 50%;
  text-align: center;
  margin: 0 -1180px;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .support-bg {
    position: relative;
    left: 0;
    top: 50px;
    margin: 0;
  }
}
.support-title-logo img{
  margin-bottom: 10px;
}
.support-title {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}
@media screen and (min-width: 769px) {
  .support-title {
    margin-bottom: 35px;
  }
}
@media screen and (max-width: 480px) {
  .support-title img {
    max-width: 130px;
  }
}
.support-title span {
  line-height: 1;
  margin-left: 5px;
}
@media screen and (min-width: 769px) {
  .support-title span {
    margin-left: 15px;
  }
}
.support-title span:first-child {
  display: block;
  font-size: 2rem;
}
@media screen and (min-width: 769px) {
  .support-title span:first-child {
    /* margin-bottom: 5px; */
    /* font-size: 2.4rem;
  }
}
.support-title span:last-child {
  font-size: 3.6rem;
  line-height: 1.2;
}
@media screen and (max-width: 768px) {
  .support-title + p.show-sp {
    font-size: 3rem;
    font-weight: bold;
    text-align: center;
    margin: 5px 0 20px;
    line-height: 1.4;
  }
}
.support-lead {
  font-size: 1.8rem;
  font-weight: bold;
}
@media screen and (min-width: 481px) {
  .support-lead {
    text-align: center;
  }
}
.support-list {
  max-width: 880px;
  margin: 40px auto 0;
}
@media screen and (min-width: 481px) {
  .support-list {
    display: flex;
    justify-content: space-between;
  }
}
.support-list-item {
  width: 100%;
  border: 1px solid #fff;
  border-radius: 12px;
  padding: 20px 15px;
}
@media screen and (min-width: 481px) {
  .support-list-item {
    width: 31.6%;
  }
}
@media screen and (max-width: 480px) {
  .support-list-item {
    margin-top: 20px;
  }
}
.support-list-item .list-asterisk {
  font-size: 1.2rem;
  margin-top: 20px;
}
@media screen and (max-width: 768px) {
  .support-list-item .list-asterisk {
    margin-top: 15px;
  }
}
.support-list-item-title {
  color: #eaff05;
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 20px;
}
@media screen and (min-width: 481px) {
  .support-list-item-title {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    min-height: 56px;
  }
}
@media screen and (max-width: 481px) {
  .support-list-item-title {
    text-align: center;
  }
}
.support-list-item-title-left {
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .support-list-item-title-left {
    display: block;
    margin-bottom: 5px;
  }
}
.support-list-item-title-right {
  font-size: 1.4rem;
  margin-left: 20px;
}
@media screen and (max-width: 768px) {
  .support-list-item-title-right {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.support-list-item-title-right span {
  font-size: 3.2rem;
  line-height: 1;
}
@media screen and (max-width: 768px) {
  .support-list-item-title-right span {
    margin-left: 5px;
  }
}
.support-list-item-title .text-small {
  display: block;
}
@media screen and (min-width: 769px) {
  .support-list-item-title .text-small {
    font-size: 1.7rem;
  }
}
.support-list-item:first-child .support-list-item-title {
  align-items: flex-end;
}
.support-list-item-lead {
  font-size: 1.8rem;
  margin-bottom: 10px;
}
.support-list-item-text .list-asterisk {
  font-size: 1.6rem;
  margin-top: 0;
}
.support-list-item-text sup{
  font-size: 0.7em;
} */ */

/* QR
========================================================================== */
.qr {
  position: relative;
  padding: 70px 0;
}
@media screen and (max-width: 480px) {
  .qr {
    padding: 70px 0 20px;
  }
}
.qr::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url("../images/qr_bg.gif");
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .qr::before {
    background: url("../images/qr_bg_sp.gif") center top;
    background-size: cover;
  }
}
.qr-inner {
  width: 100%;
  padding: 0 21.8%;
  position: relative;
}
@media screen and (max-width: 768px) {
  .qr-inner {
    padding: 0;
  }
}
@media screen and (min-width: 769px) {
  .qr-image-pic {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
}
@media screen and (min-width: 769px) {
  .qr-image-logo {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-35%);
  }
}
.qr-section-title,
.qr-section-lead,
.qr-section-text {
  color: #fff;
}
.qr-section-text{
	margin-bottom: 50px;
}
.qr-section-title {
  font-size: 3.4rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.3;
}
@media screen and (max-width: 768px) {
  .qr-section-title {
    text-align: center;
  }
}
@media screen and (max-width: 480px) {
  .qr-section-title {
    font-size: 2.4rem;
  }
}
.qr-section-lead {
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  padding: 47px 0 10px;
  position: relative;
  margin-bottom: 50px;
}
@media screen and (max-width: 480px) {
  .qr-section-lead {
    padding: 30px 0 10px;
    margin-bottom: 30px;
  }
}
.qr-section-lead::after {
  content: "";
  width: 134px;
  height: 5px;
  background: #fff;
  border-radius: 3px;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.qr-section-text p {
  margin-bottom: 20px;
}
.qr-section-button {
  width: 100%;
  max-width: 400px;
  margin: 60px auto 0;
  background: #fff;
  padding: 24px 0;
  border: none;
  color: #0b3580;
}
@media screen and (max-width: 480px) {
  .qr-section-button {
    padding: 15px 0;
    margin: 30px auto 0;
  }
}
.qr-section-button::after {
  width: 0.7em;
  height: 0.7em;
  right: 20px;
  border-color: #0b3580;
}
@media screen and (max-width: 768px) {
  .qr-image {
    margin-top: 40px;
    display: flex;
    justify-content: center;
  }
  .qr-image-logo {
    max-width: 35%;
    margin-left: 5%;
  }
  .qr-image-pic {
    margin-left: -5%;
  }
}
@media screen and (max-width: 480px) {
  .qr-image {
    margin-top: 20px;
  }
}

/* DVICE
========================================================================== */
.device {
  background: #F0F3F5;
}
/* @media screen and (max-width: 768px) {
  .device {
    padding: 50px 0;
  }
} */
.device .section-inner {
  padding-top: 0;
}
.device-lead,
.device-icon {
  text-align: center;
}
.device-lead {
  font-size: 1.8rem;
  font-weight: bold;
  margin: 40px 0 5px;
}
.device-icon {
  font-size: 1.2rem;
}
.device-icon span {
  position: relative;
  padding-left: 6em;
}
.device-icon span::before,
.device-icon span::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
/* .device-icon span::before {
  background: url("../images/ic_usen.svg");
  background-size: contain;
  width: 20px;
  height: 20px;
  left: 0;
} */
.device-icon span::after {
  width: calc(6em - 30px);
  height: 3px;
  border-bottom: 3px dotted #707070;
  left: 25px;
}
.device-content,
.device-content-inner {
  position: relative;
}
/* @media screen and (min-width: 769px) {
  .device-content::before,
  .device-content-inner::before,
  .device-content::after,
  .device-content-inner::after {
    content: "";
    position: absolute;
    width: 52px;
    height: 52px;
  }
}
@media screen and (min-width: 769px) {
  .device-content::before,
  .device-content-inner::before {
    top: 0;
    border-top: 5px solid #e4e4e4;
  }
}
@media screen and (min-width: 769px) {
  .device-content::after,
  .device-content-inner::after {
    bottom: 0;
    border-bottom: 5px solid #e4e4e4;
  }
}
@media screen and (min-width: 769px) {
  .device-content::before,
  .device-content::after {
    left: 0;
    border-left: 5px solid #e4e4e4;
  }
}
@media screen and (min-width: 769px) {
  .device-content-inner::before,
  .device-content-inner::after {
    right: 0;
    border-right: 5px solid #e4e4e4;
  }
} */
.device-content {
  margin-top: 30px;
}
.device-content-inner {
  padding: 20px 0 0;
}
@media screen and (min-width: 901px) {
  .device-content-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 0;
  }
}
.device-content-center {
  padding: 0 20px;
}
.device-content-detail {
  font-size: 1.4rem;
  background: #fff;
  padding: 20px 20px 20px 30px;
  margin-bottom: 20px;
  border-radius: 5px;
  position: relative;
}
@media screen and (max-width: 900px) {
  .device-content-detail {
    margin-bottom: 0;
  }
}
/* .device-content-detail::before {
  content: "";
  background: url("../images/ic_usen.svg");
  width: 28px;
  height: 28px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -14px;
  margin: auto;
} */
dd.color-red {
  text-align: center;
  font-weight: bold;
  color: #F34B4B;
}
.device-content-detail-textS {
  font-size: 1.2rem;
}
.device-content-detail-textL {
  font-size: 2rem;
}
.device-content-detail .underline {
  border-bottom: 2px solid #e8380d;
}
.device-content-detail-title {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: left;
  /* margin-bottom: 10px; */
}
.device-content-detail-title span {
  font-size: 1.3rem;
  display: block;
}
.device-content-detail dl {
  display: flex;
}
@media screen and (max-width: 900px) {
  .device-content-detail dl {
    justify-content: center;
  }
  .device-content-detail-title {
    text-align: center;
    font-size: 1.5rem;
    margin-bottom: 15px;
  }
  .device-content-detail-title span {
    font-size: 1.1rem;
  }
}
.device-content-detail dl dt {
  font-size: 1.2rem;
  color: #fff;
  background: #98A6B5;
  padding: 10px;
  border-radius: 4px;
  /* margin-right: 10px; */
  display: flex;
  align-items: center;
}
.device-content-detail dl dd {
  line-height: 1.4;
}
.device-content-detail dl dd span {
  display: inline-block;
  font-size: 3rem;
  line-height: 1.2;
}
@media screen and (min-width: 901px) {
  .device-content-upay, .device-content-printer {
    position: absolute;
    right: 40px;
    bottom: 10px;
  }
}
@media screen and (max-width: 900px) {
  .device-content-detail dl dt {
    font-size: 1rem;
  }
}
@media screen and (max-width: 380px) {
  .device-content-detail dl dt {
    padding: 5px;
  }
}

.device-content-left {
  display: flex;
  justify-content: center;
}
@media screen and (min-width: 901px) {
  .device-content-left {
    justify-content: flex-end;
  }
}
.device-content-left-inner {
  max-width: 304px;
}
.device-content-left-title {
  text-align: right;
  margin-bottom: 10px;
}

.device-content-left-img {
  position: relative;
  margin-bottom: 20px;
  text-align: center;
  z-index: 10;
}
.device-content-left-img::before {
  content: "";
  background: url("../images/equipment_tabletballoon.png") no-repeat;
  background-size: contain;
  width: 105px;
  height: 99px;
  position: absolute;
  top: -35px;
  right: -35px;
  z-index: 100;
}
@media screen and (max-width: 900px) {
  .device-content-left .device-content-detail {
    margin-bottom: 10px;
  }
}
.device_title {
  color: #3B4043;
  font-size: 12px;
  font-weight: bold;
}
.device-content-detail-textUSEN {
  font-size: 12px;
  font-weight: bold;
}
.device-content-detail-textL.color-red{
  font-size: 15px;
}
p.device-content-text {
  font-size: 12px;
  color: #707070;
  text-align: left;
}
.device-content-text a {
  text-decoration: underline;
  color: #094C97;
}
@media screen and (max-width: 900px) {
  .device-content-center {
    display: flex;
    justify-content: center;
    margin: 20px 0;
  }
}
@media screen and (max-width: 900px) {
  .device-content-right {
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 900px) {
  .device-content-right-upay,
  .device-content-right-printer {
    width: 49%;
    text-align: center;
  }
}
@media screen and (max-width: 900px) {
  .device-content-right-upay img,
  .device-content-right-printer img {
    max-width: 60%;
    margin: 0 auto 10px;
  }
}
@media screen and (max-width: 900px) {
  .device-content-right-upay .device-content-detail,
  .device-content-right-printer .device-content-detail {
    padding: 25px 10px 10px;
  }
}
@media screen and (max-width: 900px) {
  .device-content-right-upay .device-content-detail::before,
  .device-content-right-printer .device-content-detail::before {
    top: -10px;
    bottom: auto;
    left: 0;
    right: 0;
    margin: auto;
  }
}
@media screen and (max-width: 900px) {
  .device-content-right-upay {
    background: #fff;
  }
}
/* .device-content-right-printer-inner {
  margin-bottom: 20px;
} */
@media screen and (min-width: 901px) {
  .device-content-right-printer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
.device-content-pdf {
  font-size: 1.3rem;
  margin-top: 20px;
}
@media screen and (max-width: 480px) {
  .device-content-pdf {
    margin-top: 10px;
  }
}
.device-content-right {
  max-width: 377px;
}
.device-content-right-printer {
  margin-top: 60px;
}
@media screen and (max-width: 900px) {
  .device-content-right {
    max-width: unset;
  }
  .device-content-right-printer {
    margin-top: 0;
  }
}

/* GUIDE
========================================================================== */
/* .guide {
  padding: 100px 0;
  background: #f5f5f5;
}
@media screen and (max-width: 768px) {
  .guide {
    padding: 40px 0 50px;
  }
}
.guide-intro {
  text-align: center;
}
.guide-intro .list-asterisk {
  font-size: 1.4rem;
  margin-bottom: 20px;
}
.guide-intro .list-asterisk li {
  display: inline-block;
}
@media screen and (max-width: 425px) {
  .flow-content {
    text-align: center;
  }
}
.flow-list {
  margin: 40px auto 0;
  position: relative;
}
@media screen and (min-width: 426px) {
  .flow-list {
    max-width: 800px;
    width: 100%;
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 425px) {
  .flow-list {
    display: inline-block;
  }
}
.flow-list::before,
.flow-list::after {
  content: "";
  position: absolute;
}
.flow-list::before {
  width: calc(100% - 76px);
  height: 1px;
  border-bottom: 2px dotted #e8380d;
  top: 295px;
  left: 0;
  z-index: 0;
}
@media screen and (max-width: 425px) {
  .flow-list::before {
    width: 3px;
    height: calc(100% - 168px);
    border-bottom: none;
    border-right: 3px dotted #e8380d;
    right: 60px;
    left: auto;
    top: 0;
  }
}
.flow-list::after {
  border-style: solid;
  border-width: 10px 0 10px 20px;
  border-color: transparent transparent transparent #e8380d;
  right: 76px;
  top: 287px;
}
@media screen and (max-width: 800px) {
  .flow-list::after {
    right: 126px;
  }
}
@media screen and (max-width: 425px) {
  .flow-list::after {
    border-width: 20px 10px 0 10px;
    border-color: #e8380d transparent transparent transparent;
    top: auto;
    bottom: 163px;
    right: 51px;
  }
}
@media screen and (max-width: 320px) {
  .flow-list::after {
    bottom: 215px;
  }
}
.flow-list-item {
  width: 100%;
  max-width: 225px;
  text-align: center;
  position: relative;
}
@media screen and (max-width: 425px) {
  .flow-list-item {
    max-width: 100%;
    padding-right: 110px;
  }
}
.flow-list-item-card {
  position: relative;
  margin-bottom: 58px;
}
@media screen and (min-width: 426px) {
  .flow-list-item-card {
    height: 269px;
    margin-bottom: 88px;
  }
}
@media screen and (max-width: 425px) {
  .flow-list-item-card {
    max-width: 225px;
  }
}
.flow-list-item-card::before,
.flow-list-item-card::after {
  display: inline-block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 425px) {
  .flow-list-item-card::before,
  .flow-list-item-card::after {
    top: auto;
  }
}
.flow-list-item-card::before {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 0 10px 20px;
  right: -20px;
}
@media screen and (max-width: 425px) {
  .flow-list-item-card::before {
    right: 0;
    left: 0;
    margin: auto;
    border-width: 20px 10px 0 10px;
    bottom: -30px;
  }
}
.flow-list-item-card::after {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 0 8px 16px;
  border-color: transparent transparent transparent #fff;
  right: -12px;
}
@media screen and (max-width: 425px) {
  .flow-list-item-card::after {
    right: 0;
    left: 0;
    margin: auto;
    border-width: 16px 8px 0 8px;
    border-color: #fff transparent transparent transparent;
    bottom: -19px;
  }
}
.flow-list-item-card-inner {
  width: 100%;
  height: 100%;
  padding: 20px;
  border-radius: 12px;
  background: #fff;
}
@media screen and (max-width: 425px) {
  .flow-list-item-card-inner {
    padding: 30px 30px 10px;
  }
}
.flow-list-item-card-mark {
  width: 126px;
  height: 126px;
  line-height: 126px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  color: #fff;
  background: #e8380d;
  border: 4px solid #fff;
  border-radius: 50%;
  position: absolute;
  bottom: -100px;
  right: -50px;
  z-index: 0;
}
@media screen and (max-width: 800px) {
  .flow-list-item-card-mark {
    right: 0;
  }
}
@media screen and (max-width: 425px) {
  .flow-list-item-card-mark {
    top: 0;
    bottom: auto;
    right: -110px;
  }
}
.flow-list-item-card-mark >span {
  font-size: 4.5rem;
}
.flow-list-item-card-mark::before {
  content: "";
  width: 108%;
  padding-top: 108%;
  background: transparent;
  border: 3px solid #e8380d;
  border-radius: 50%;
  position: absolute;
  top: -6%;
  left: -6%;
  z-index: -1;
}
@media screen and (max-width: 425px) {
  .flow-list-item:last-child .flow-list-item-card {
    margin-bottom: 0;
  }
}
.flow-list-item-title {
  font-size: 2.2rem;
  font-weight: bold;
  line-height: 1.4;
  position: relative;
}
@media screen and (min-width: 426px) {
  .flow-list-item-title {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.8em;
  }
}
.flow-list-item-title::after {
  content: "";
  display: block;
  margin: 10px auto;
}
@media screen and (min-width: 426px) {
  .flow-list-item-title::after {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -60px;
    margin: 20px auto;
  }
}
.flow-list-item:first-child .flow-list-item-card::before {
  border-color: transparent transparent transparent #67b8e0;
}
@media screen and (max-width: 425px) {
  .flow-list-item:first-child .flow-list-item-card::before {
    border-color: #67b8e0 transparent transparent transparent;
  }
}
.flow-list-item:first-child .flow-list-item-card-inner {
  color: #67b8e0;
  border: 4px solid #67b8e0;
}
@media screen and (min-width: 426px) {
  .flow-list-item:first-child .flow-list-item-card-inner::before,
  .flow-list-item:first-child .flow-list-item-card-inner::after {
    display: inline-block;
    content: "";
    border-radius: 50%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .flow-list-item:first-child .flow-list-item-card-inner::before {
    width: 30px;
    height: 30px;
    background: #919191;
    border: 3px solid #fff;
    bottom: -15px;
    z-index: 1;
  }
  .flow-list-item:first-child .flow-list-item-card-inner::after {
    width: 12px;
    height: 12px;
    background: #fff;
    bottom: -6px;
    z-index: 1;
  }
}
.flow-list-item:first-child .flow-list-item-title::after {
  background: url("../images/flow_icon1.svg");
  width: 60px;
  height: 25px;
}
.flow-list-item:nth-child(2) .flow-list-item-card::before {
  border-color: transparent transparent transparent #0099d5;
}
@media screen and (max-width: 425px) {
  .flow-list-item:nth-child(2) .flow-list-item-card::before {
    border-color: #67b8e0 transparent transparent transparent;
  }
}
.flow-list-item:nth-child(2) .flow-list-item-card-inner {
  color: #0099d5;
  border: 4px solid #0099d5;
}
.flow-list-item:nth-child(2) .flow-list-item-title::after {
  background: url("../images/flow_icon2.svg");
  width: 27px;
  height: 33px;
}
.flow-list-item:nth-child(2) .flow-list-item-step {
  background: #0099d5;
}
.flow-list-item:nth-child(3) .flow-list-item-card::before,
.flow-list-item:nth-child(3) .flow-list-item-card::after {
  content: none;
}
.flow-list-item:nth-child(3) .flow-list-item-card-inner {
  color: #0b3580;
  border: 4px solid #0b3580;
}
.flow-list-item:nth-child(3) .flow-list-item-title::after {
  background: url("../images/flow_icon3.svg");
  width: 62px;
  height: 38px;
}
.flow-list-item-info {
  width: 100%;
  height: 110px;
  padding: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #919191;
  border-radius: 8px;
  border: 4px solid #fff;
  text-align: left;
  color: #fff;
  position: relative;
}
@media screen and (min-width: 426px) {
  .flow-list-item-info::before {
    content: "";
    position: absolute;
  }
  .flow-list-item-info::before {
    width: 10px;
    height: 90px;
    background: #919191;
    border: 3px solid #fff;
    top: -90px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
    box-sizing: border-box;
  }
}
@media screen and (max-width: 425px) {
  .flow-list-item-info {
    font-size: 1.4rem;
    width: 55%;
    position: absolute;
    bottom: -30px;
    right: -5%;
  }
}
.flow-list-text {
  text-align: center;
  font-size: 2.4rem;
  margin: 50px 0;
}
.flow-list-text span {
  display: inline-block;
  font-size: 3.6rem;
  padding: 0 0.2em;
  margin: 0 0.5em;
  border-bottom: 3px solid #0099d5;
}
.flow-list-text-link {
  font-size: 2rem;
  color: #0099d5;
}
.flow-list-text-link.textlink-arrow::after {
  margin-left: 5px;
}
.flow-list-item-step {
  width: 67px;
  height: 67px;
  border-radius: 50%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 425px) {
  .flow-list-item-step {
    width: 52px;
    height: 52px;
    position: absolute;
    top: -26px;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 0;
  }
}
.flow-list-item-step span {
  position: relative;
  font-size: 3.6rem;
  color: #fff;
  line-height: 1;
  text-align: center;
}
@media screen and (max-width: 425px) {
  .flow-list-item-step span {
    font-size: 2.8rem;
  }
}
.flow-list-item-step span::before {
  content: "STEP";
  font-size: 25%;
  display: block;
  line-height: 1;
}
@media screen and (min-width: 426px) {
  .flow-list-item-step span::before {
    margin-bottom: 3px;
  }
}
.flow-step1 .flow-list-item-step {
  background: #67b8e0;
}
.flow-step2 .flow-list-item-step {
  background: #0099d5;
}
.flow-step3 .flow-list-item-step {
  background: #0b3580;
} */

/* FAQ
========================================================================== */
/* #QUESTION {
  background-color: #fff;
} */

/* CANTACT
========================================================================== */
/* #main_area #contact_area {
  padding: 80px 0;
}
@media only screen and (max-width: 850px) {
  #main_area #contact_area {
    padding: 60px 0;
  }
}

.webp #main_area #contact_area {
  background: #1b9ece url(../images/contact_bg.jpg.webp) no-repeat center top;
}

.no-webp #main_area #contact_area {
  background: #1b9ece url(../images/contact_bg.jpg) no-repeat center top;
}

@media only screen and (max-width: 850px) {
  .webp #main_area #contact_area {
    background: #1b9ece url(../images/contact_bg_sp.jpg.webp) no-repeat center top;
    background-size: 100% 100%;
  }

  .no-webp #main_area #contact_area {
    background: #1b9ece url(../images/contact_bg_sp.jpg) no-repeat center top;
    background-size: 100% 100%;
  }
}

#main_area #contact_area .cont_ttl .read {
  font-weight: normal;
}

#main_area #contact_area .inquiry_tel {
  border: 1px #d5dde6 solid;
  border-radius: 10px;
  max-width: 700px;
  width: 100%;
  padding: 24px 0;
  margin: 30px auto 0;
}

#main_area #contact_area .txtlink {
  text-align: center;
  margin: 20px 0;
}

#main_area #contact_area .txtlink a {
  color: #fff;
}

#main_area #contact_area .txtlink a:hover {
  text-decoration: underline;
}

@media only screen and (max-width: 850px) {
  #main_area #contact_area .inquiry_tel {
    border: none;
    display: block;
    padding: 0;
  }
}

#main_area #contact_area .inquiry_tel.flex {
  align-items: center;
}

#main_area #contact_area .inquiry_tel .txt {
  width: 204px;
  padding: 0 52px 0 52px;
}

@media only screen and (max-width: 850px) {
  #main_area #contact_area .inquiry_tel .txt {
    width: 100%;
    padding: 0;
    margin-bottom: 15px;
  }
}

#main_area #contact_area .inquiry_tel .txt p {
  font-size: 114.3%;
  font-weight: bold;
  line-height: 1.8;
  text-align: center;
  vertical-align: middle;
}

#main_area #contact_area .inquiry_tel .tel {
  border-left: 1px #8ec9ce solid;
}

@media only screen and (max-width: 600px) {
  #main_area #contact_area .inquiry_tel .tel {
    padding: 0 10px;
  }
}

@media only screen and (max-width: 850px) {
  #main_area #contact_area .inquiry_tel .tel {
    border: none;
    border-radius: 14px;
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
  }
}

#main_area #contact_area .inquiry_tel .tel a {
  padding: 10px 108px 0 60px;
}

@media only screen and (max-width: 850px) {
  #main_area #contact_area .inquiry_tel .tel a {
    -webkit-box-shadow: 0px 0px 10px 3px rgba(44, 44, 44, 0.15);
    box-shadow: 0px 0px 10px 3px rgba(44, 44, 44, 0.15);
    text-align: center;
    margin: 0 auto;
    padding: 10px 0 0 0;
    background-color: #fff;
    border-radius: 14px;
    color: #1ca6d9;
    font-size: 114.3%;
    font-weight: bold;
    text-align: center;
    padding: 23px 42px;
  }
}

@media only screen and (max-width: 850px) and (max-width: 400px) {
  #main_area #contact_area .inquiry_tel .tel a {
    padding: 23px 32px;
  }
}

@media only screen and (max-width: 850px) and (max-width: 350px) {
  #main_area #contact_area .inquiry_tel .tel a {
    padding: 20px 20px;
  }
}

#main_area #contact_area .inquiry_tel .tel a .number_img {
  margin-bottom: 6px;
  z-index: 10;
}

@media only screen and (max-width: 850px) {
  #main_area #contact_area .inquiry_tel .tel a .number_img img {
    max-width: 448px;
    width: 100%;
    margin: 0 auto;
  }
}

#main_area #contact_area .inquiry_tel .tel a p {
  color: #fff;
  text-align: center;
  margin-right: -20px;
}

@media only screen and (max-width: 850px) {
  #main_area #contact_area .inquiry_tel .tel a p {
    color: #1ca6d9;
  }
}

@media only screen and (max-width: 350px) {
  #main_area #contact_area .inquiry_tel .tel a p {
    font-size: 85.7%;
  }
} */

/* 1125PDFのリンク追加 */

a.linkpdf {
  color: #808080;
}

a.linkpdf:after {
  content: " ";
  display: inline-block;
  width: 11px;
  height: 11px;
  background: url(../images/pdficon.png) no-repeat;
  background-size: contain;
}

.add_android {
  text-align: center;
  margin-bottom: 15px;
}

@media only screen and (max-width: 850px) {
  .add_android {
    margin-top: -40px;
  }
}

.add_android .innerBlock {
  display: inline-block;
  background-color: rgba(28, 166, 217, 0.678);
  font-size: 16px;
  color: #fff;
  position: relative;
  padding: 10px 50px 10px 120px;
}

@media only screen and (max-width: 850px) {
  .add_android .innerBlock {
    font-size: 85.7%;
    padding: 10px 15px;
  }
}

.add_android .innerBlock::before {
  content: "";
  background: url(/u-pay/images/fv_new_tabret.png) no-repeat;
  background-size: contain;
  width: 50px;
  height: 50px;
  position: absolute;
  bottom: 4px;
  left: 50px;
}

@media only screen and (max-width: 850px) {
  .add_android .innerBlock::before {
    bottom: auto;
    top: -40px;
    left: -20px;
  }
}

@media only screen and (max-width: 480px) {
  .add_android .innerBlock::before {
    content: none;
  }
}

.add_android .innerBlock span.emphasis {
  color: #1ca6d9;
  background: #e6ff16;
  padding: 0 .5em;
  letter-spacing: 0.05em;
}

.add_android .innerBlock span:not(.emphasis) {
  font-size: 14px;
  margin-left: 10px;
}

@media only screen and (max-width: 850px) {
  .add_android .innerBlock span:not(.emphasis) {
    font-size: 78.6%;
  }
  .add_android .innerBlock p {
    line-height: 1.2;
  }
}

/* .price_area .price_area_ttl {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  color: #fff;
  margin-bottom: 30px;
}

.price_area .text-12 {
  font-size: 12px;
}

@media only screen and (max-width: 850px) {
  .price_area .price_area_ttl {
    font-size: 112%;
    margin-bottom: 10px;
  }
  .price_area .price_area_ttl .text-16 {
    font-size: 78%;
  }
} */

.tableBlock {
  border-radius: 10px;
  background-color: rgb(255, 255, 255);
  padding: 5px;
  margin-bottom: 5px;
}
#tab02_content .tableBlock_inner {
  margin: 20px auto 0;
}
#tab02_content .detail-cashless-inner {
  padding-left: 35px;
}
.tableBlock table, .tableBlock table th, .tableBlock table td {
  border-collapse: separate;
  height: 100%;
  font-size: 1.4rem;
  display: revert;
  margin-bottom: 20px;
}

.tableBlock .asterisk {
  padding-left: .5em;
}

.tableBlock .text-10 {
  font-size: 10px;
}

.tableBlock .text-16 {
  font-size: 14px;
}

.tableBlock .color-skyblue {
  color: #323E85;
}
.tableBlock .color-skyblue.text-16 {
  font-size: 18px;
}
.tableBlock .color-gray {
  color: #98A6B5;
}

/* .tableBlock .bg_yellow {
  background: #e6ff16;
  padding: 0 .5em;
  line-height: 1.4;
} */

.tableBlock .bg_black {
  background: #323E85 ;
  height: 100%;
  color: #fff;
  padding: 5px 0px;
  text-align: center;
  border-radius: 8px 0 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tableBlock #ios .bg_black {
  align-items: end;
}

.tableBlock .bg_blue {
  background: #323E85;
  color: #fff;
  text-align: center;
  height: 100%;
  border-radius: 8px 8px 0 0;
  padding: 15px 0;
}
#tab02_content .tableBlock .bg_blue {
  background: #35ADEB;
}

/* .tableBlock .width_1-2 {
  width: 50%;
} */

.tableBlock table tr th, .tableBlock table tr td {
  height: 100%; 
  border-top: 4px solid rgb(255, 255, 255);
  border-bottom: 8px solid rgb(255, 255, 255);
}
.tableBlock table#android tr th, .tableBlock table#android tr td {
  border-top: 8px solid rgb(255, 255, 255);
}
.tableBlock table#android tr th, .tableBlock table#android tr td, .tableBlock table#ios tr th, .tableBlock table#ios tr td {
  border-bottom: 8px solid rgb(255, 255, 255);
}
.tableBlock table tr th {
  height: 100%; 
  border: 4px solid rgb(255, 255, 255);
}
.tableBlock table#android tr th {
  border-top: 8px solid rgb(255, 255, 255);
}

.tableBlock table tr th>*, .tableBlock table tr td>* {
  width: 100%;
  height: 100%;
  text-align: center;
}
#ios tbody tr {
  height: 110px;
}
.tableBlock table thead tr .bg_gray_area {
  display: flex;
  justify-content: flex-end;
}

.tableBlock table thead tr .bg_gray_area .width_1-2 {
  background: #cbcbcb;
  color: #fff;
  /* border-radius: 5px; */
  display: flex;
  align-items: center;
  justify-content: center;
}

.tableBlock table thead tr th .bg_blue, .tableBlock table thead tr th.bg_gray_area .width_1-2 {
  line-height: 1.2;
  padding: 10px;
}

.tableBlock .tbody_th dl, .tableBlock .td_terminal dl {
  /* display: flex;
  flex-direction: column;
  flex-wrap: wrap; */
  width: 100%;
  position: relative;
}

.tableBlock .tbody_th dl dt {
  width: 90%;
  display: flex;
  align-items: center;
  position: absolute;
  left: 5%;
  top: -12px;
}

.tableBlock .tbody_th dl dt .fukidashi {
  display: inline-block;
  width: 97%;
  padding: 8px;
  /* font: normal normal bold 12px/18px Noto Sans CJK JP; */
  font-size: 12px;
  font-weight: bold;
  color: #333333;
  text-align: center;
  border-radius: 4px;
  box-sizing: border-box;
  background: #E9EFFF 0% 0% no-repeat padding-box;
  position: relative;
}

.tableBlock .tbody_th dl dt .fukidashi:after {
  content: "";
  border-top: 10px solid #E9EFFF;
  border-right: 7px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 7px solid transparent;
  position: absolute;
  bottom: -18px;
  right: 45%;
  margin-top: -4px;
  z-index: 2;
}

/* .tableBlock .tbody_th dl dt .fukidashi:before {
  content: "";
  border-style: solid;
  border-width: 6px 0 6px 14px;
  border-color: transparent transparent transparent #69a9c3;
  position: absolute;
  top: 50%;
  right: -15px;
  margin-top: -6px;
  z-index: 1;
} */

.tableBlock .tbody_th dl dd {
  height: 100%;
}

.tableBlock .td_price, .tableBlock .td_terminal, .tableBlock .td_printer, .tableBlock .td_details, .tableBlock .td_initial {
  background: #F0F3F5;
  height: 100%;
  /* border-radius: 5px; */
  display: flex;
  align-items: center;
  justify-content: center;
  /* font: normal normal bold 18px/34px Noto Sans CJK JP; */
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.9px;
  color: #3B4043;
}
.td_terminal dl, dt, dd {
  font-size: 14px;
  font-weight: bold;
}
.zero {
  display: inline-flex;
  align-items: baseline;
}
.zero_area sup {
  font-size: 65%;
}
.tableBlock .td_printer > div{
  line-height: 1.2;
}
/* .tableBlock .td_price {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  color: #1ca6d9;
} */
.tableBlock .td_initial .text-10{
  display: inline-block;
  line-height: 1.2;
  text-align: left;
}
.tableBlock .td_initial .dubble{
  position: relative;
  font-size: 16px;
}
.tableBlock .td_initial .dubble:before{
  content: "";
  display: block;
  border-top: solid 2px #555;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 100%;
}
/* .tableBlock .td_initial .td_price{
  position: relative;
  display: inline-block;
}
.tableBlock .td_initial .td_price:before{
  content: "";
  border-style: solid;
  border-width: 4px 0 4px 8px;
  border-color: transparent transparent transparent #1ca6d9;
  position: absolute;
  top: 50%;
  left: -15px;
  margin-top: -4px;
} */

/* .tableBlock .td_terminal dl dt {
  padding-right: 20px;
  position: relative;
} */

/* .tableBlock .td_terminal dl dt:after {
  content: "";
  border-style: solid;
  border-width: 4px 0 4px 8px;
  border-color: transparent transparent transparent #1ca6d9;
  position: absolute;
  top: 50%;
  right: 6px;
  margin-top: -4px;
} */

/* .tableBlock .price-terminal .td_terminal dl dt,
.tableBlock .price-terminal .td_terminal dl dd{
  width: 100%;
} */

/* .tableBlock .price-terminal .td_terminal dl dt{
  padding-right: 0;
  padding-bottom: 10px;
} */

/* .tableBlock .price-terminal .td_terminal dl dt:after{
  border-width: 8px 4px 0 4px;
  border-color: #1ca6d9 transparent transparent transparent;
  top: auto;
  bottom: 0;
  right: 50%;
  transform: translateX(-50%);
  margin-top: 0;
} */

.tableBlock .td_terminal dl:first-child {
  padding-top: 1.5em;
  padding-bottom: .5em;
  border-bottom: 1px solid #cbcbcb;
}
.tableBlock .td_terminal dl:last-child {
  padding-top: .5em;
  padding-bottom: 1.5em;
}

.tableBlock .td_terminal dl dd {
  text-align: center;
}

/* .price_area .color-white {
  color: #fff;
}
.price_area .text-link{
  color: #fff;
} */

.show-sp {
  display: none;
}

@media only screen and (max-width: 900px) {
  .show-sp {
    display: inherit;
  }
  .tableBlock_inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #tab02_content .tableBlock_inner {
    width: unset;
  }
  .tableBlock table {
    display: none;
  }
  .tableBlock #ios {
    width: 60%;
  }
  .tableBlock #android {
    width: 40%;
  }
  .tableBlock #ios table {
    display: block;
  }
  .tableBlock #ios thead {
    display: block;
    width: 33%;
    float: left;
  }
  .tableBlock #ios thead tr, #ios tbody tr {
    display: block;
  }
  .tableBlock #ios thead tr th:first-child {
    min-height: 130px;
  }
  .tableBlock #ios tbody {
    display: block;
    width: 66%;
    float: right;
  }
  .tableBlock table thead tr th, .tableBlock table tbody tr th, .tableBlock table tbody tr td {
    display: block;
    width: 100%;
  }
  .tableBlock table tr th, .tableBlock table tr td, .tableBlock table tr th>*, .tableBlock table tr td>* {
    height: auto;
  }
  .tableBlock .text-16 {
    font-size: 12px;
  }
  .tableBlock .width_1-2 {
    width: 100%;
  }
  .tableBlock .tbody_th dl dt .fukidashi:after {
    border-width: 6px 4px 0 4px;
    border-color: #fff transparent transparent transparent;
    top: auto;
    bottom: -6px;
    right: 50%;
    margin: 0 -4px 0 0;
  }
  .tableBlock .tbody_th dl dt {
    margin-bottom: 5px;
  }
  .tableBlock .tbody_th dl dt .fukidashi:before {
    border-width: 10px 6px 0 6px;
    border-color: #69a9c3 transparent transparent transparent;
    top: auto;
    bottom: -10px;
    right: 50%;
    margin: 0 -6px 0 0;
  }
  /* .tableBlock .td_price, .tableBlock .td_printer, .tableBlock .td_details {
    padding: 5px;
  }
  .tableBlock .price-device {
    height: 106px;
  }
  .tableBlock .price-initial {
    height: 106px;
  }
  .tableBlock .price-terminal {
    height: 180px;
  }
  .tableBlock .price-printer {
    height: 106px;
  }
  .tableBlock .price-details {
    height: 120px;
  } */
  .tableBlock .bg_blue {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .tableBlock table thead tr th .bg_blue {
    padding: 5px 0;
  }
  .tableBlock .td_terminal dl dt, .tableBlock .td_terminal dl dd {
    width: 100%;
  }
  .tableBlock .td_terminal dl dt {
    padding: 0 0 10px 0;
    position: relative;
  }
  .tableBlock .td_terminal dl dt:after {
    border-width: 8px 4px 0 4px;
    border-color: #1ca6d9 transparent transparent transparent;
    top: auto;
    bottom: 0;
    right: 48%;
    margin: 0;
  }
  .tableBlock #ios .tbody_th {
    position: relative;
  }
  .tableBlock .tbody_th {
    min-height: 130px;
  }
  .tableBlock table thead tr .bg_gray_area .width_1-2 {
    min-height: 146px;
  }
  .tableBlock #ios thead tr th:nth-child(3) .bg_blue {
    min-height: 180px;
  }
  .tableBlock .tbody_th dl dt .fukidashi {
    width: 100%;
  }
  /* .price_area .color-white {
    font-size: 78.6%;
  } */
  .tableBlock .td_details br.show-pc {
    display: none;
  }
}
#feature .cv_area{
  margin: 60px 0;
}

@media only screen and (max-width: 1024px) {
  #feature .cv_area{
    margin: 30px 0;
  }
}

#specification .cv_area{
  margin: 60px 0 0;
}
#use_flow .cv_area{
  margin: 30px 0 0;
}
.cv_area .cv_lead,.otherpage_btn .cv_lead{
  text-align: center;
  margin-bottom: 20px;
}

@media only screen and (max-width: 400px) {
  .cv_area .cv_lead,.otherpage_btn .cv_lead{
    margin-bottom: 10px;
  }
}

.cv_area .cv_lead > span,.otherpage_btn .cv_lead > span{
  display: inline-block;
  font-size: 22px;
  font-weight: bold;
  padding: 0 1.4em;
  line-height: 1;
  position: relative;
}

@media only screen and (max-width: 600px) {
  .cv_area .cv_lead > span,.otherpage_btn .cv_lead > span{
    font-size: 100%;
  }
}

.cv_area .cv_lead > span:before,
.cv_area .cv_lead > span:after,
.otherpage_btn .cv_lead > span:before,
.otherpage_btn .cv_lead > span:after{
  content: "";
  width: 1em;
  height: 150%;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.cv_area .cv_lead > span:before,
.otherpage_btn .cv_lead > span:before{
  -webkit-transform: skewX(30deg);
  -moz-transform: skewX(30deg);
  transform: skewX(30deg);
  /* border-left: 5px solid #234d99; */
  border-left: 5px solid #000;
  left:0;
}
.cv_area .cv_lead > span:after,
.otherpage_btn .cv_lead > span:after{
  -webkit-transform: skewX(150deg);
  -moz-transform: skewX(150deg);
  transform: skewX(150deg);
  /* border-right: 5px solid #234d99; */
  border-right: 5px solid #000;
  right: 0;
}
.cv_area_inner a{
  display: block;
}
.cv_area_inner,#contact_area .contact_btn{
  max-width: 1000px;
  margin: 30px auto 0;
}

@media only screen and (min-width: 901px) {
  .cv_area_inner,#contact_area .contact_btn{
    display: flex;
    justify-content: center;
  }
}

@media only screen and (max-width: 900px) {
  .cv_area_inner,#contact_area .contact_btn{
    max-width: 450px;
    flex-wrap: wrap;
    margin: 15px auto 0;
  }
}

.cv_area_inner a,.needs-col-link a{
  width: 100%;
  max-width: 450px;
  height: 80px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  color: #fff;
  border-radius: 50px;
  box-shadow: 3.346px 3.716px 10px 0px rgba(0, 0, 0, 0.2);
  position: relative;
  margin: auto 5px;
}

@media only screen and (max-width: 900px) {
  .cv_area_inner a,.needs-col-link a{
    width: 100%;
    margin: auto 0;
  }
}

.cv_area_inner a.btn_contact,.needs-col-link a.btn_contact{
  /* background: #234d99;
	border: 2px solid #234d99; */
  background: #e8380d;
	border: 2px solid #e8380d;
}
#QR .cv_area_inner a.btn_contact{
	/* color: #234d99; */
  color: #fff;
	background: #e8380d;
}
.cv_area_inner a.btn_app{
  background: #e8380d;
}

@media only screen and (max-width: 900px) {
  .cv_area_inner a.btn_contact{
    margin-bottom: 15px;
  }
}

.param .cv_area_inner a.btn_app{
  background: #e8380d;
}
.cv_area_inner a.btn_app span.cv_ic{
  width: 30px;
  height: 19px;
  margin-right: 10px;
  position: absolute;
  left: 25px;
  top: 50%;
  transform: translateY(-50%);
}
.cv_area_inner a.btn_app span.cv_ic img{
  max-width: 100%;
  height: auto;
}

@media only screen and (max-width: 600px) {
  .cv_area_inner a,.needs-col-link a{
    font-size: 100%;
    height: 60px;
  }
}

.cv_area_inner a:before,.needs-col-link a:before{
  content: "";
  width: 10px;
  height: 10px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  right: 25px;
  top: 0;
  bottom: 0;
  margin: auto;
}

@media screen and (max-width: 820px){
  .needs-col-link a{
    padding: 0 20px;
  }
  .needs-col-link a:before{
    content: none;
  }
}

@media only screen and (max-width: 600px) {
  .cv_area_inner a:before,.needs-col-link a:before{
    content: none;
  }
}

.cv_area_inner a.btn_contact span.cv_ic{
  display: inline-block;
  padding: .4em .7em;
  /* background: #e3e3e3;
  color: #234d99; */
  background: #fff;
  color: #e8380d;
  border-radius: 50px;
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}

@media only screen and (max-width: 600px) {
  .cv_area_inner a.btn_contact span.cv_ic{
    padding: .2em .5em;
  }
}

@media only screen and (max-width: 320px) {
  .cv_area_inner a.btn_contact span.cv_ic{
    left: 10px;
  }
}

.cv_area_inner a span:not(.cv_ic){
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cv_area_inner a.btn_contact span:not(.cv_ic){
  margin-left: 1.2em;
}

/*
@media only screen and (max-width: 600px) {
  .cv_area_inner a span:not(.cv_ic){
    padding-left: 50px;
  }
}
*/
.contact_btn_area {
  margin-top: 75px;
  text-align: center;
}
@media only screen and (max-width: 1024px) {
  .contact_btn_area {
    margin-top: 525px;
  }
}
@media only screen and (max-width: 768px) {
  .contact_btn_area {
      margin-top: 69%;
  }
}
@media only screen and (max-width: 480px) {
  .contact_btn_area {
      margin-top: 77%;
  }
}
@media only screen and (max-width: 430px) {
  .contact_btn_area {
    /* margin-top: 80%; */
  }
}
@media only screen and (max-width: 380px) {
  .contact_btn_area {
    /* margin-top: 100%; */
  }
}
.contact_btn_area h3 {
  font-weight: 700;
  display: inline-block;
  position: relative;
  margin-bottom: 8px;
  letter-spacing: 0.48px;
  color: #3B4043;
  text-shadow: 0px 0px 8px #FFFFFF;
  font-size: 24px;
}

@media only screen and (max-width: 768px) {
  .contact_btn_area h3 {
    font-size: 1.5rem;
  }
}
.contact_btn_area h3::after, .contact_btn_area h3::before {
  content: url(../images/line_dot.svg);
  position: absolute;
  top: -3px;
}
h3::before {
  left: -20px;
  transform: rotate(-30deg);
}
h3::after {
  right: -20px;
  transform: rotate(30deg);
}
.mainvisual .contact_btn{
  max-width: 460px;
  margin: 0 auto 20px;
}
@media only screen and (max-width: 600px) {
  .mainvisual .contact_btn{
    width: 80%;
    margin: 0 auto 10px;
    padding: 0;;
  }
}
.mainvisual .contact_btn a{
  display: block;
  width: 100%;
  font-size: 22px;
  padding: 25px 10px;
  box-shadow: 0px 4px 0px #596A7D;
}
@media only screen and (max-width: 600px) {
  .mainvisual .contact_btn a{
    font-size: 100%;
    padding: 18px 10px;
  }
}
.mainvisual .contact_btn{
  position: relative;
}
.mainvisual .contact_btn a span.cv_ic{
  display: inline-block;
  padding: 0.1em 0.5em;
  background: #fff;
  color: #e8380d;
  border-radius: 50px;
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.mainvisual .contact_btn:before,
.mainvisual .contact_btn:after{
  content: "";
  display: inline-block;
  position: absolute;
  top:0;
  bottom: 0;
  margin: auto;
  z-index: 1;
}
.mainvisual .contact_btn:after{
  width: 12px;
  height: 12px;
  border-top: 4px solid #e3e3e3;
  border-right: 4px solid #e3e3e3;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  right: 25px;
}
@media only screen and (max-width: 425px) {
  .mainvisual .contact_btn:after{
    width: 10px;
    height: 10px;
    border-top: 2px solid #e3e3e3;
    border-right: 2px solid #e3e3e3;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    right: 25px;
  }
}

@media only screen and (max-width: 400px) {
  .mainvisual .contact_btn{
    margin: 0 auto 10px;
  }
}
p.section_note {
  font-size: 12px;
  text-align: center;
  letter-spacing: 0.48px;
  color: #FFFFFF;
  opacity: 1;
  margin-top: -10px;
}
@media only screen and (max-width: 900px) {
  p.section_note {
    margin-top: 0;
  }
}
/* DETAIL
========================================================================== */
@media screen and (min-width: 769px) {
  .detail {
    transform: translateY(-50px);
  }
}
@media screen and (max-width: 768px) {
  .detail {
    transform: translateY(-50px);
  }
}
@media screen and (max-width: 480px) {
  .detail {
    transform: translateY(-60px);
    margin-bottom: -50px;
  }
}
@media screen and (max-width: 320px) {
  .detail {
    transform: translateY(-40px);
  }
}
.detail-inner {
  margin-top: 15px;
}
@media screen and (min-width: 901px) {
  .detail-inner {
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 900px) {
  .detail-inner {
    margin: 15px;
  }
}
@media screen and (max-width: 480px) {
  .detail-inner {
    padding-top: 60px;
  }
}
.detail-cashless,
.detail-regi {
  border-radius: 8px;
  background: #fff;
  box-shadow: 4px 0 10px rgba(0,0,0,0.16);
  position: relative;
}
.detail-cashless:before,
.detail-regi:before {
  content: "";
  width: 145px;
  height: 145px;
  position: absolute;
  bottom: -12px;
  right: -12px;
  z-index: 1;
}
.detail-cashless-inner,
.detail-regi-inner {
  padding: 40px 9px;
}
@media screen and (max-width: 480px) {
  .detail-cashless-inner,
  .detail-regi-inner {
    padding: 20px 20px 30px;
  }
}
.detail-cashless-charm,
.detail-regi-charm {
  position: absolute;
}
@media screen and (min-width: 769px) {
  .detail-cashless-charm,
  .detail-regi-charm {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .detail-cashless-charm,
  .detail-regi-charm {
    width: 100%;
    bottom: auto;
    top: -50px;
    text-align: center;
    color: #fff;
    padding: 10px 0;
    border-radius: 10px;
    right: 50%;
    transform: translateX(50%);
  }
}
.detail-cashless-charm *,
.detail-regi-charm * {
  line-height: 1.3;
}
.detail-cashless-charm-inner,
.detail-regi-charm-inner {
  position: relative;
  z-index: 2;
  text-align: center;
}
.detail-cashless-charm::before,
.detail-regi-charm::before,
.detail-cashless-charm::after,
.detail-regi-charm::after {
  content: "";
  position: absolute;
}
@media screen and (min-width: 769px) {
  .detail-cashless-charm::before,
  .detail-regi-charm::before,
  .detail-cashless-charm::after,
  .detail-regi-charm::after {
    border-radius: 50%;
  }
}
.detail-cashless-charm::before,
.detail-regi-charm::before {
  top: 0;
  display: block;
}
@media screen and (min-width: 769px) {
  .detail-cashless-charm::before,
  .detail-regi-charm::before {
    left: 0;
    padding-top: 100%;
    width: 100%;
    z-index: 1;
  }
}
@media screen and (max-width: 768px) {
  .detail-cashless-charm::before,
  .detail-regi-charm::before {
    border-style: solid;
    border-width: 16px 8px 0 8px;
    bottom: -14px;
    top: auto;
    right: 50%;
    transform: translateX(50%);
  }
}
.detail-cashless-charm::after,
.detail-regi-charm::after {
  top: 0;
  left: 0;
}
@media screen and (max-width: 768px) {
  .detail-cashless-charm::after,
  .detail-regi-charm::after {
    content: none;
  }
}
@media screen and (min-width: 769px) {
  .detail-cashless-charm::after,
  .detail-regi-charm::after {
    width: 115%;
    padding-top: calc(115% - 12px);
    position: absolute;
    top: -7.5%;
    left: -7.5%;
    z-index: 0;
  }
}
@media screen and (min-width: 769px) {
  .detail-cashless-charm span,
  .detail-regi-charm span {
    display: block;
  }
  .detail-cashless-charm span:first-child,
  .detail-regi-charm span:first-child {
    font-size: 7rem;
    font-weight: bold;
    display: inline-block;
    line-height: 1;
  }
  .detail-cashless-charm span:nth-child(2),
  .detail-regi-charm span:nth-child(2) {
    font-size: 2.1rem;
    display: inline-block;
  }
  .detail-cashless-charm span:nth-child(3),
  .detail-regi-charm span:nth-child(3) {
    font-size: 2.1rem;
  }
}
@media screen and (max-width: 480px) {
  .detail-cashless-charm span,
  .detail-regi-charm span {
    font-size: 1.8rem;
  }
}
.detail-cashless {
  width: 65%;
  max-width: 820px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
@media screen and (max-width: 900px) {
  .detail-cashless {
      width: 100%;
      margin-bottom: 30px;
      max-width: unset;
  }
}
@media screen and (max-width: 768px) {
  .detail-cashless-charm {
    background: #0099d5;
  }
}
@media screen and (min-width: 769px) {
  .detail-cashless-charm::before {
    background: #67b8e0;
  }
  .detail-cashless-charm::after {
    background: #fff;
    border: 6px solid #67b8e0;
  }
}
@media screen and (max-width: 768px) {
  .detail-cashless-charm::before {
    border-color: #0099d5 transparent transparent transparent;
  }
}
.content-inner h3 {
  text-align: center;
  letter-spacing: 0.9px;
  font-size: 30px;
  font-weight: bold;
  color: #FFFFFF;
  opacity: 1;
}
.content-inner h3 span {
  text-align: center;
  vertical-align: bottom;
  font-size: 64px;
  letter-spacing: 0px;
  line-height: 1;
  color: #FFFFFF;
  opacity: 1;
}
@media screen and (max-width: 480px) {
  .content-inner h3 {
    font-size: 22px;
    margin: 15px;
  }
  .content-inner h3 span {
    font-size: 50px;
  }
}
.under_blue {
  background: linear-gradient(transparent .9em, #323E85 0, #323E85 1.2em, transparent 0);
}
.under_red {
  background: linear-gradient(transparent .9em, #F34B4B 0, #F34B4B 1.2em, transparent 0);
}
.detail-cashless-title {
  font-size: 2.4rem;
  color: #fff;
  text-align: center;
  background: #3c3c3c;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
@media screen and (max-width: 480px) {
  .detail-cashless-title {
    font-size: 2rem;
    padding: 5px 0;
  }
}
.detail-cashless-inner {
  display: flex;
}
@media screen and (max-width: 900px) {
  .detail-cashless-inner {
    justify-content: center;
  }
  #PRICE .detail-cashless-inner {
    flex-direction: column;
    padding: 0;
  }
  #PRICE .detail-cashless-brand {
    margin: 10px;
  }

}
.detail-cashless-item {
  display: flex;
  flex-direction: column;
  width: 50%;
  padding: 0 20px;
}

@media screen and (max-width: 900px) {
  .detail-cashless-item {
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    width: unset;
    padding: 0 20px;
  }
  #PRICE .detail-cashless-item {
    padding: 0;
  }
}
.detail-cashless-item:first-child {
  border-right: 1px dashed #e0e0e0;
}
@media screen and (max-width: 900px) {
  #PRICE .detail-cashless-item:first-child {
    border-bottom: 1px dashed #e0e0e0;
    border-right: none;
  }
}
@media screen and (max-width: 768px) {
  .detail-cashless-item:first-child {
    padding: 0 10px 0 0;
  }
}
@media screen and (max-width: 768px) {
  .detail-cashless-item:last-child {
    padding: 0 0 0 10px;
  }
}
.detail-cashless-logo-upay,
.detail-cashless-logo-upayqr {
  /* min-height: 40px; */
  /* margin-bottom: 15px;*/
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 480px) {
  .detail-cashless-logo-upay,
  .detail-cashless-logo-upayqr {
    min-height: 0;
  }
  .detail-cashless-logo-upay img,
  .detail-cashless-logo-upayqr img {
    height: 18px;
  }
}
.detail-cashless-catch-upay,
.detail-cashless-catch-upayqr {
  font-size: 1.2rem;
  font-weight: bold;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
@media screen and (min-width: 481px) {
  .detail-cashless-catch-upay,
  .detail-cashless-catch-upayqr {
    text-align: center;
    font-size: 1.3rem;
  }
}
.detail-cashless-catch-upay {
  border-bottom: 3px solid #323E85;
}
.detail-cashless-catch-upayqr {
  border-bottom: 3px solid #6744C8
}
.detail-cashless-catch-upayqr a {
  color: #0099d5;
}
@media screen and (min-width: 481px) {
  .detail-cashless-catch-upayqr a {
    margin-left: 30px;
  }
}
@media screen and (max-width: 480px) {
  .detail-cashless-catch-upayqr a {
    margin-left: 5px;
  }
}
.detail-cashless-brand {
  margin-bottom: 10px;
  text-align: center;
  flex-grow: 1;
}
@media screen and (max-width: 480px) {
  .detail-cashless-brand {
    margin-bottom: 0;
    flex-grow: 1;
  }
}
.detail-cashless-brand img {
  max-width: 100%;
}
.detail-cashless-brand-caution {
  text-align: left;
  font-size: 1.1rem;
  margin: 10px 0 5px;
  line-height: 1.4;
  letter-spacing: 0.48px;
  color: #596A7D;
}
.detail-cashless-brand-caution a {
  color: #0099d5;
  text-decoration: underline;
}
.detail-cashless-margin {
  margin-top: 20px;
}
.detail-cashless-margin,
.detail-cashless-monthly {
  line-height: 1;
}
@media screen and (min-width: 900px) {
  .detail-cashless-margin,
  .detail-cashless-monthly {
    display: flex;
    align-items: center;
    margin-bottom: 3px;
  }
}
@media screen and (max-width: 900px) {
  .detail-cashless-margin {
    margin-top: 0;
  }
}
.detail-cashless-margin *,
.detail-cashless-monthly * {
  line-height: 1.5em;
}
.detail-cashless-margin-ttl,
.detail-cashless-monthly-ttl {
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  background: #F6F2FF 0% 0% no-repeat padding-box;
  color: #3B4043;
  padding: 25px 10px;
  border-radius: 5px;
  margin: 25px 10px 0 0;
  min-width: 74px;
  height: 88px;
  line-height: 1.5;
  position: relative;
}
.detail-cashless-margin-ttl:after {
  content: "";
  border-top: 10px solid #F5D81F;
  border-right: 7px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 7px solid transparent;
  position: absolute;
  top: 15px;
  margin-top: -4px;
  z-index: 2;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
@media screen and (max-width: 900px) {
  .detail-cashless-margin-ttl:after {
    top: 21px;
    right: 47%;
  }
}
@media screen and (max-width: 900px) {
  .detail-cashless-margin-ttl,
  .detail-cashless-monthly-ttl {
    font-size: 1.4rem;
    text-align: center;
    width: 70%;
    height: unset;
    margin: 25px auto 0;
  }
}
@media screen and (max-width: 480px) {
  .detail-cashless-margin-ttl,
  .detail-cashless-monthly-ttl {
    width: 100%;
  }
}
dt.detail-cashless-margin-ttl::before {
  content: "業界\a最安水準";
  font-size: 12px;
  font-weight: bold;
  position: absolute;
  white-space: pre;
  display: block;
  top: -37px;
  letter-spacing: 0.44px;
  color: #333333;
  background: #F5D81F 0% 0% no-repeat padding-box;
  border-radius: 4px;
  padding: 8px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
@media screen and (max-width: 900px) {
dt.detail-cashless-margin-ttl::before {
  content: "業界最安水準";
  top: -15px;
}
}
.detail-cashless-margin-text,
.detail-cashless-monthly-text {
  font-size: 12px;
  font-weight: bold;
}
@media screen and (max-width: 900px) {
  .detail-cashless-margin-text,
  .detail-cashless-monthly-text {
    text-align: center;
  }
}
@media screen and (max-width: 480px) {
  .detail-cashless-margin-text,
  .detail-cashless-monthly-text {
    padding: 5px 0 7px;
    text-align: center;
    font-size: 10px;
  }
}
.detail-cashless-margin span {
  letter-spacing: -0.01em;
  font-size: 32px;
}
.detail-cashless-margin span.lh-0 {
  font-size: 12px;
  display: inline-block;
}
span.color-red {
  letter-spacing: 0px;
  color: #F34B4B;
  font-size: 40px;
}
@media screen and (max-width: 480px) {
  span.color-red {
    letter-spacing: 0px;
    color: #F34B4B;
    font-size: 24px;
  }
  .detail-cashless-margin span {
    font-size: 24px;
  }
  .detail-cashless-margin span.lh-0 {
    font-size: 10px;
  }
}
.detail-cashless-margin span.caution {
  display: inline-block;
  font-size: 1rem;
  letter-spacing: -0.01em;
  margin-left: 5px;
}
@media screen and (max-width: 480px) {
  .detail-cashless-margin span.caution {
    display: block;
    margin-left: 0;
    margin-top: 5px;
  }
}
.detail-cashless-monthly span {
  font-size: 3rem;
  margin-right: 0.1em;
}
.detail-cashless-device-title {
  margin-top: 20px;
}
.detail-cashless-device-title,
.detail-cashless-device-list {
  font-size: 1.3rem;
  font-weight: bold;
}
.detail-cashless-device-list {
  margin-bottom: 3px;
}
.detail-cashless-device-list li:before {
  content: "●";
  font-size: 8px;
  margin-right: 0.3em;
}
@media screen and (max-width: 480px) {
  .detail .textlink-arrow {
    font-size: 1.3rem;
  }
}
.detail-regi {
  width: 33%;
  max-width: 340px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
@media screen and (max-width: 901px) {
  .detail-regi {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 769px) {
  .detail-regi-charm::before {
    background: #afafaf;
  }
  .detail-regi-charm::after {
    background: #fff;
    border: 6px solid #afafaf;
  }
}
@media screen and (max-width: 768px) {
  .detail-regi-charm {
    display: none;
  }
  .detail-regi-charm::before {
    border-color: transparent transparent #afafaf transparent;
  }
}
@media screen and (min-width: 769px) {
  .detail-regi-charm span {
    display: block;
  }
  .detail-regi-charm span:first-child {
    font-size: 1.7rem;
  }
  .detail-regi-charm span:nth-child(2) {
    font-size: 2.1rem;
  }
  .detail-regi-charm span:nth-child(3) {
    font-size: 3.5rem;
    line-height: 1;
  }
}
.detail-regi-title {
  min-height: 38px;
  line-height: 38px;
  color: #fff;
  text-align: center;
  background: #afafaf;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.detail-regi-logo {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media screen and (min-width: 481px) {
  .detail-regi-logo {
    min-height: 50px;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 480px) {
  .detail-regi-logo img {
    height: 18px;
  }
}
.detail-regi-catch {
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  padding-bottom: 10px;
  margin-bottom: 20px;
  border-bottom: 2px solid #6481c0;
}
.detail-regi-catch a {
  color: #0099d5;
  margin-left: 30px;
}
.detail-regi-text {
  font-size: 14px;
  text-align: center;
  font-weight: bold;
  line-height: 1.6;
  margin-bottom: 18px;
  letter-spacing: 0.7px;
  color: #3B4043;
}
.detail-regi-text span { 
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1.2px;
  color: #3B4043;
}
.detail-regi-point {
  margin-bottom: 25px;
}
.detail-regi-point li {
  font-size: 1.4rem;
  font-weight: bold;
  padding: 5px 10px;
}
.detail-regi-point li:nth-child(odd) {
  background: #f5f5f5;
}
.detail-regi-img {
  text-align: center;
}
.detail-regi-img img{
  display: inline-block;
  margin-bottom: 20px;
}
.detail-cashless-caution {
  text-align: center;
  font-size: 1.1rem;
  margin: 20px 0 5px;
  line-height: 1.4;
  letter-spacing: 0.48px;
  color: #596A7D;
}
.detail-cashless-caution a {
  text-decoration: underline;
  /* font: normal normal normal 12px / 18px Noto Sans CJK JP; */
  font-size: 12px;
  letter-spacing: 0.48px;
  color: #094C97;
}
.detail-regi-link-title,
.detail-regi-link-list {
  font-size: 1.3rem;
}
@media screen and (max-width: 768px) {
  .detail-regi-link-list {
    display: flex;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 768px) {
  .detail-regi-link-list li {
    margin-right: 10px;
  }
}
.detail-regi-link-list li:before {
  content: "●";
  font-size: 8px;
  margin-right: 0.3em;
}
.detail .cta-btn {
  margin-top: 50px;
}
@media screen and (max-width: 480px) {
  .detail .cta-btn {
    margin-top: 30px;
  }
}
.detail .cta-contact {
  margin: auto;
  max-width: 480px;
}

.campaign {
  margin-top: 35px;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 900px) {
  .campaign {
    /* flex-direction: column-reverse; */
    margin: 10px 40px;
  }
}
.campaign-img {
  width: 50%;
}
.campaign-contents {
  width: 50%;
}
/* @media screen and (max-width: 900px) {
  .campaign-img {
    width: 90%;
    margin: 0 auto;
  }
} */
 
.campaign-img img {
  width: 100%;
}
.campaign-contents h3 {
  text-align: left;
  font-size: 3.8rem;
  letter-spacing: 1.08px;
  color: #FFFFFF;
  text-shadow: 3px 3px 0px #FFFFFF40;
  margin: 2vw 10px 0;
}
@media screen and (max-width: 900px) {
  .campaign-contents h3 {
    font-size: 2.3rem;
  }
}
/* @media screen and (max-width: 768px) {
  .campaign-contents h3 {
      font-size: 2.5rem;
  }
} */
 

p.campaign-caution {
  text-align: left;
  font-size: 12px;
  letter-spacing: 0.48px;
  color: #FFFFFF;
  margin: 16px;
}

@media screen and (max-width: 768px) {
  .campaign-contents h3 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 540px) {
  .campaign {
    flex-direction: column-reverse;
  }
  .campaign-img {
    width: 80%;
    margin: 0 auto;
  }
  .campaign-contents {
    width: 90%;
  }
  .campaign-contents h3 {
    margin-bottom: 15px;
  }
  p.campaign-caution {
    width: 70%;
    margin: 16px auto;
    display: table;
}
}
@media screen and (max-width: 480px) {
  .campaign-img {
    width: 90%;
  }
}
.reason {
  background: transparent linear-gradient(180deg, #E9EFFF 0%, #E6F7FF 100%) 0% 0% no-repeat padding-box;
}
.section-inner {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 1080px;
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative;
  text-align: center;
  border-radius: 8px;
}

@media screen and (max-width: 1200px) {
  .section-inner {
    margin: 0 20px;
  }
}
.nav .section-inner {
  padding-top: 70px;
  padding-bottom: 40px;
}
@media screen and (max-width: 480px) {
  #NAV h3.dots {
    font-size: 1.5rem;
  }
}
h3.dots {
  font-weight: 700;
  display: inline-block;
  position: relative;
  margin-bottom: 20px;
  color: #323E85;
  font-size: 24px;
}
h3.dots::after, h3.dots::before {
  position: absolute;
  bottom: 0;
  content: url(../images/line_dot_blue.svg);
}
h3.dots::before {
  left: -20px;
  transform: rotate(-30deg);
}
h3.dots::after {
  right: -20px;
  transform: rotate(30deg);
}
.nav_list {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
  margin-left: -20px;
}
.nav_list li {
  width: 30%;
  position: relative;
  padding: 30px 20px;
  background: #ffffff;
  border-radius: 4px;
  margin-left: 20px;
}
.nav a {
  color: #333;
  text-decoration: none;
}
h3.dots span {
  text-align: center;
  font-size: 42px;
  letter-spacing: 1.26px;
  color: #323E85;
}
#COST h3.dots span,  #SUPPORT h3.dots span,  #SOONPAY h3.dots span, .tableBlock_inner h3.dots span{
  line-height: 0.6em;
}
#COST h3.dots::after, #COST h3.dots::before, #SUPPORT h3.dots::after, #SUPPORT h3.dots::before, #SOONPAY h3.dots::after, #SOONPAY h3.dots::before, .tableBlock_inner h3.dots::after, .tableBlock_inner h3.dots::before   {
  bottom: -10px;
}
.nav_list li::after {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-bottom: 3px solid #c9d1d9;
  border-right: 3px solid #c9d1d9;
  position: absolute;
  bottom: 17px;
  left: 50%;
  margin-left: -8px;
  transform: rotate(45deg);
  transition: all .4s;
}
.section-number {
  font-size: 40px;
  font-family: Oswald;
  font-weight: 400;
  line-height: 1.8;
  color: #fff;
  background: #323E85 0% 0% no-repeat padding-box;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: -35px;
  margin-left: -35px;
}
.nav_list .section-number {
  font-size: 30px;
  line-height: 1.5;
  width: 48px;
  height: 48px;
  top: -25px;
  margin-left: -25px;
}
@media screen and (max-width: 480px) {
  .section-number {
    font-size: 32px;
    width: 60px;
    height: 60px;
  }
  .nav_list .section-number {
    font-size: 20px;
    line-height: 1.7;
    width: 35px;
    height: 35px;
    top: -20px;
    margin-left: -18px;
  }
  .nav_list {
    margin-left: 0;
  }
  .nav_list li{
    width: 31.5%;
    margin-left: 0;
    padding: 30px 9px;
  }
  .nav_list li p.nav_text {
    font-size: 1.3rem;
  }
}
.nav_list li p.nav_text {
  font-size: 24px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .nav_list li p.nav_text {
    font-size: 1.2rem;
  }
}


.soonpay {
  margin-top: 70px;
  background: linear-gradient(90deg, transparent 0, transparent 50%, #ffffff 50%, #ffffff 100%);
}
.soonpay .section-inner, .cost .section-inner, .support .section-inner {
  background: #ffffff;
  padding-bottom: 60px;
}
.reason-inner {
  width: 850px;
  margin: 0 auto;
}
@media screen and (max-width: 900px) {
  .reason-inner {
    width: 90%;
    margin: 0 auto;
  }
}
.reason-inner .caution {
  text-align: left;
  letter-spacing: 0.48px;
  color: #596A7D;
  font-size: 12px;
  margin-top: 16px;
  font-weight: normal;
}
.reason-inner img {
  margin: auto;
}
@media screen and (max-width: 900px) {
  .reason-inner img.size_60 {
    width: 60%;
  }
}
@media screen and (max-width: 480px) {
  .reason-inner img.size_60 {
    width: 100%;
  }
}
.reason-inner p {
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1.2px;
  color: #3B4043;
  margin: 16px 0;
}

@media screen and (max-width: 900px) {
  .reason-inner p {
    margin: 16px;
    font-size: 16px;
    text-align: left;
  }
}
p.in_bl {
  display: inline-block;
}
@media screen and (max-width: 900px) {
  p.in_bl {
    font-size: 20px;
    line-height: 1.2;
  }
}
.reason-contents {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
#COST .reason-contents {
  flex-direction: row-reverse;
}

@media screen and (max-width: 900px) {
  .reason-contents {
    flex-direction: column-reverse;
    margin: 0 auto;
    align-items: center;
  }
  #COST .reason-contents {
    flex-direction: column;
    align-items: center;
  }
}

h3.reason-title {
  text-align: left;
  /* font: normal normal bold 36px / 57px Noto Sans CJK JP; */
  font-size: 36px;
  font-weight: bold;
  letter-spacing: 1.08px;
  color: #3B4043;
  text-shadow: 4px 4px 0px #E9EFFF;
}
@media screen and (max-width: 900px) {
  h3.reason-title {
    text-align: center;
    /* font: normal normal bold 40px / 57px Noto Sans CJK JP; */
    font-size: 40px;
    font-weight: bold;
    line-height: 1.6em;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  h3.reason-title {
    font-size: 2.5em;
  }
}
@media screen and (max-width: 640px) {
  h3.reason-title { 
    font-size: 1.56em;
  }
}
.reason-inner h3.dots {
  margin-top: 50px;
  line-height: 1;
}
@media screen and (max-width: 480px) {
  .reason-inner h3.dots {
    font-size: 16px;
  }
}
.reason-textarea {
  width: 46%;
}
@media screen and (max-width: 900px) {
  .reason-textarea {
    width: 105%;
  }
}
.reason-textarea p {
  text-align: left;
  /* font: normal normal bold 16px / 38px Noto Sans CJK JP; */
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.8px;
  color: #3B4043;
}
.reason-inner p span{
  text-align: left;
  /* font: normal normal bold 24px/38px Noto Sans CJK JP; */
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1.2px;
  color: #3B4043;
  background: linear-gradient(transparent 70%, #E9EFFF 70%);
}

.reason-inner p span.color-red {
  letter-spacing: 0px;
  color: #F34B4B;
  font-size: 30px;
  background: none;
}
@media screen and (max-width: 900px) {
  .reason-inner p span{
    font-size: 20px;
  }
}
.reason-detail {
  display: flex;
  justify-content: space-between;
  width: 750px;
  margin: 0 auto;
}
.reason-detail-inner {
  display: flex;
  flex-direction: column;
  width: 30%;
}
@media screen and (max-width: 900px) {
  .reason-detail {
    flex-direction: column;
    width: unset;
  }
  .reason-detail-inner {
    width: 100%;
  }
}
.reason-detail-inner p {
  text-align: left;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0.8px;
  color: #3B4043;
  flex-grow: 1;
}
.reason-detail-inner-title {
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1.2px;
  flex-grow: 1;
  color: #323E85;
  margin: 16px 0 8px;
}

.cost {
  margin-top: 105px;
  background: linear-gradient(90deg, #ffffff 0, #ffffff 50%, transparent 50%, transparent 100%);
}

.support {
  margin-top: 105px;
  background: linear-gradient(90deg, transparent 0, transparent 50%, #ffffff 50%, #ffffff 100%);
}

.cta-area {
  background: url(../images/bg_cta_area.png) no-repeat;
  background-size: cover;
  background-position: center;
  height: auto;
  margin-top: 105px;
}
.cta-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 15px;
}
.hidden {
  visibility: hidden;
}
.cta-main {
  text-align: center;
  width: 570px;
}
.cta-main-inner {
  display: flex;
}
.cta-main .caution {
  text-align: center;
  /* font: normal normal normal 12px/18px Noto Sans CJK JP; */
  font-size: 12px;
  letter-spacing: 0.48px;
  color: #FFFFFF;
  margin: 16px 0;
}
.cta-main img {
  display: inline-block;
}
.cta-main h3.dots{
  text-align: center;
  font-size: 30px;
  letter-spacing: 1.6px;
  color: #323E85;
  margin-bottom: 10px;
  background: linear-gradient(transparent 1.5em, #F5D81F 0, #F5D81F 1.9em, transparent 0);
}
@media screen and (max-width: 768px) {
  .cta-main h3.dots{
    font-size: 22px;
    padding-top: 0;
    background: linear-gradient(transparent 2.1em, #F5D81F 0, #F5D81F 2.5em, transparent 0);
  }
  .cta-inner {
    padding-top: 0;
    width: 90%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 430px) {
  .cta-main h3.dots{
    font-size: 18px;
    /* padding-top: 0; */
    background: linear-gradient(transparent 2.5em, #F5D81F 0, #F5D81F 3em, transparent 0);
  }
  .cta-inner {
    /* padding-top: 0;
    width: 90%;
    margin: 0 auto; */
  }
}
.inner-contents {
  display: flex;
}
.inner-contents {
  display: flex;
  align-items: center;
}
.inner-contents div{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 72px;
  width: 128px;
  text-align: center;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 24px 24px 4px 24px;
}
.inner-contents p{
  font-size: 30px;
  font-weight: bold;
  letter-spacing: 0.9px;
  color: #323E85;
}
.inner-contents div p{
  letter-spacing: 0.7px;
  font-size: 14px;
  font-weight: bold;
  color: #323E85;
}
.inner-contents p span{
  font-size: 60px;
  font-weight: bold;
}

/* ========================================================================
   Component: flow
========================================================================== */


.flow {
	overflow: hidden;
	background: #DDE2E7;
}
.price .section-title, .device .section-title, .flow .section-title, .faq .section-title {
  font-size: 36px;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
  padding: 30px 0;
  position: relative;
}
.section-title span.eng-title {
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  font-size: 72px;
  font-family: Oswald;
  font-weight: 200;
  font-optical-sizing: auto;
  transform: translate(-50%, 0);
  z-index: 10;
  letter-spacing: 1.44px;
}
.section-title span.eng-title {
  color: #fff;
}
.section-title span.jpn-title {
  display: inline-block;
  width: 100%;
  position: relative;
  z-index: 20;
}
h3.flow-head {
	margin-bottom: 0;
}

h3.flow-head::before,
h3.flow-head::after {
	content: none;
}

@media screen and (max-width: 767px) {
	.flow h3:not(.flow-head) {
		font-size: 1.1rem;
	}
}


.flow-cards {
	width: 100%;
	max-width: 100%;
	margin: 40px 0 18px;
	display: flex;
	justify-content: space-between;
}

@media screen and (max-width: 767px) {
	.flow-cards {
		width: 100%;
		max-width: 100%;
		display: block;
		margin: 20px auto 30px;
	}
	.flow-cards:after {
		content: "";
		position: absolute;
		background: #323E85;
		width: 3px;
    height: 83%;
    top: 0;
    right: 7%;
	}
}
@media screen and (max-width: 480px) {
	.flow-cards:after {
    height: 80%;
	}
}

.flow-card {
  width: 30%;
	position: relative;
	background: #fff;
	border-radius: 10px;
	margin-right: 30px;
}

.flow-card:last-child {
	margin-right: 0;
}

@media screen and (max-width: 767px) {
	.flow-card {
		width: 90%;
		margin-left: 5%;
		margin-right: 0;
	}
}

.flow-icon {
  text-align: center;
}
.flow-icon img{
  display: inline-block;
}

@media screen and (max-width: 767px) {
	.flow-card dl {
		display: flex;
		margin-bottom: 10px;
	}
}

.flow-card dl dt {
	text-align: center;
	padding: 8px 0;
	border-radius: 10px 10px 0 0;
  font: normal normal bold 18px/29px DIN 2014;
  letter-spacing: 0.9px;
  color: #FFFFFF;
}

.flow-card:nth-child(1) dl dt {
	background: #c9d1d9;
}

.flow-card:nth-child(2) dl dt {
	background: #7A8CA0;
}

.flow-card:nth-child(3) dl dt {
	background: #596a7d;
}


@media screen and (max-width: 767px) {
	.flow-card dl dt {
		width: 20%;
		border-radius: 5px 0 0 5px !important;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

.flow-card dl dd {
  /* font: normal normal bold 16px/30px Noto Sans CJK JP; */
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.8px;
  color: #3B4043;
	text-align: center;
	line-height: 1.8;
	padding: 20px;
}

.flow-card dl dd a {
  text-align: center;
  text-decoration: underline;
  /* font: normal normal bold 16px/30px Noto Sans CJK JP; */
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.8px;
  color: #094C97;
}
.flow-card dl dd span {
  /* font: normal normal bold 14px/24px Noto Sans CJK JP; */
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.7px;
  color: #3B4043;
	display: inline-block;
  background: #F5D81F 0% 0% no-repeat padding-box;
  border-radius: 4px;
}

@media screen and (max-width: 767px) {
	.flow-card dl dd {
		width: 80%;
    text-align: center;
		padding: 15px;
	}
	.flow-card:nth-child(1) dl dd:after {
		content: "";
		position: absolute;
		background: #323E85;
		width: 11px;
		height: 11px;
		border-radius: 11px;
		top: -5px;
    left: 96%;
	}
	.flow-card:nth-child(3) dl dd:after {
		content: "";
		position: absolute;
		background: #323E85;
		width: 11px;
		height: 11px;
		border-radius: 11px;
		bottom: -5px;
    left: 96%;
	}
}

.flow-cards-box {
	margin-bottom: 60px;
}

@media screen and (max-width: 767px) {
	.flow-cards-box {
		position: relative;
		margin-bottom: 0;
	}
}

.flow-caption {
	width: 100%;
	position: relative;
	background: linear-gradient(180deg, transparent 0%, transparent 47%, #323E85 47%, #323E85 53%, transparent 53%, transparent 100%);
}

@media screen and (max-width: 767px) {
	.flow-caption {
		width: 100%;
		float: none;
		position: absolute;
    bottom: 150px;
    right: 25px;
		background: none;
		text-align: right;
	}
}
@media screen and (max-width: 480px) {
	.flow-caption {
    bottom: 172px;
	}
}
.flow-caption:before {
	content: "";
	position: absolute;
	background: #323E85;
	width: 11px;
	height: 11px;
	border-radius: 11px;
	top: 50%;
	left: 0;
	margin-top: -5px;
}

@media screen and (max-width: 767px) {
	.flow-caption:before {
		content: none;
	}
}

.flow-caption:after {
	content: "";
	position: absolute;
	background: #323E85;
	width: 11px;
	height: 11px;
	border-radius: 11px;
	top: 50%;
	right: 0;
	margin-top: -5px;
}

@media screen and (max-width: 767px) {
	.flow-caption:after {
		content: none;
	}
}

.flow-caption p {
  padding: 0 80px;
  display: inline-block;
  background: #323E85 0% 0% no-repeat padding-box;
  border-radius: 8px;
  /* font: normal normal bold 18px / 29px Noto Sans CJK JP; */
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.45px;
  color: #FFFFFF;
}

@media screen and (max-width: 767px) {
	.flow-caption p {
		font-size: 1.0rem;
		margin: 0;
		padding: 0 20px;
		display: inline-block;
	}
}
.flow-caption span {
  font-size: 32px;
}
.flow .caution {
  text-align: left;
  letter-spacing: 0.48px;
  color: #596A7D;
  font-size: 12px;
  margin-top: 16px;
}

@media screen and (max-width: 767px) {
  .flow-caption span {
    font-size: 20px;
  }
}

/* ========================================================================
   Component: faq
========================================================================== */


.faq {
	background: #e6f7ff;
}

.faq .section-inner {
	padding-top: 60px;
}

@media screen and (max-width: 767px) {
	.faq .section-inner {
		padding-top: 40px;
		padding-bottom: 30px;
	}
}

.faq-card {
	width: 94%;
	margin-top: 40px;
		margin-left: 3%;
}

@media screen and (max-width: 767px) {
	.faq-card {
		width: 90%;
		margin-top: 20px;
		margin-left: 5%;
	}
}

.faq-card .faq_box {
	background-color: #fff;
  border-radius: 4px;
	margin-bottom: 20px;
	text-align: left;
}

.faq-card dl dt, .faq-card dl dd {
	font-weight: 500;
	position: relative;
}

.faq-card dl dt {
	cursor: pointer;
	position: relative;
	padding: 25px 60px 25px 70px;
  /* font: normal normal bold 18px/34px Noto Sans CJK JP; */
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.9px;
  color: #3B4043;
}

@media screen and (max-width: 767px) {
	.faq-card dl dt {
    font-size: 1.8rem;
		padding: 15px 60px 15px 50px;
	}
}

.faq-card dl dd {
	display: none;
	line-height: 1.6;
	position: relative;
  padding: 14px 60px 20px 70px;
  /* font: normal normal normal 16px/25px Noto Sans CJK JP; */
  font-size: 16px;
  letter-spacing: 0.4px;
  color: #3B4043;
}

@media screen and (max-width: 767px) {
	.faq-card dl dd {
		padding: 15px 60px 15px 50px;
	}
}

.faq-card dl dt::before {
  content: "Q.";
  position: absolute;
  top: 10px;
  left: 24px;
  font-family: Oswald;
  font-size: 32px;
  font-weight: 400;
  letter-spacing: 0px;
  color: #98A6B5;
}

@media screen and (max-width: 767px) {
	.faq-card dl dt::before {
		top: 5px;
		left: 16px;
	}
}

.faq-card dl dd::before {
	content: "A.";
	position: absolute;
  top: 0;
	left: 24px;
  font-family: Oswald;
  font-size: 24px;
  letter-spacing: 0px;
  color: #323E85;
}

@media screen and (max-width: 767px) {
	.faq-card dl dd::before {
		left: 16px;
	}
}

.faq-card dl dd::after {
	content: "";
	display: block;
	background-color: #ecf9ff;
	width: calc(100% - 130px);
	height: 2px;
	position: absolute;
	top: 0;
	left: 70px;
}

@media screen and (max-width: 767px) {
	.faq-card dl dd::after {
		width: calc(100% - 95px);
		left: 45px;
	}
}


.faq-card dl .faq_btn {
	background-color: #323E85;
	border-radius: 50%;
	-webkit-transition: all .4s;
	-o-transition: all .4s;
	transition: all .4s;
	position: absolute;
	top: 50%;
	right: 15px;
	width: 30px;
	height: 30px;
	margin-top: -15px;
}

.faq-card dl .faq_btn .border:before, .faq-card dl .faq_btn .border:after {
	content: "";
	display: block;
	background-color: #fff;
	width: 14px;
	height: 2px;
	position: absolute;
	left: 8px;
	-webkit-transition: all .4s;
	-o-transition: all .4s;
	transition: all .4s;
}

.faq-card dl .faq_btn .border:before {
	top: 13px;
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
}

.faq-card dl .faq_btn .border:after {
	top: 13px;
	transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
}

.faq-card dl .active .faq_btn .border:after {
	top: 13px;
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
}

/* ========================================================================
   Component: price
========================================================================== */

.price {
	background: #F0F3F5;
	position: relative;
}
/* @media screen and (max-width: 450px) {
	.price {
		padding: 80px 0 30px;
	}
} */

.price .caution {
  text-align: left;
  letter-spacing: 0.48px;
  color: #596A7D;
  font-size: 12px;
  margin-top: 16px;
}
@media screen and (max-width: 900px) {
  .price-card-inner .caution {
    margin-bottom: 30px;
  }
}
.price .caution a {
  text-decoration: underline;
  color: #094C97;
}
.price h2 {
  margin-top: 33px;
}
@media screen and (max-width: 900px) {
  .price h2 img {
      margin-left: 30%;
  }
}
@media screen and (max-width: 768px) {
  .price h2 img {
      margin-left: 18%;
  }
}
.price:before {
	content: '';
	width: 100%;
	height: calc(100% + 126px);
	position: absolute;
	top: 0;
	bottom: 0;
	background: #ebebeb;
	z-index: -1;
}
.price-inner {
	width: 100%;
	max-width: 1020px;
	padding: 0 20px;
	margin: auto;
}
/* .price-title,
.price-lead {
	color: #fff;
	text-align: center;
} */
.price-title {
	font-size: 6rem;
}
@media screen and (max-width: 450px) {
	.price-title {
		font-size: 3.8rem;
	}
}
.price-lead {
	font-size: 1.8rem;
	margin: 10px 0 0;
}
.price-card {
	background: #fff;
	margin: 30px auto 0;
}
.price-card-title {
	background: #ebebeb;
	font-size: 2.8rem;
	font-weight: 800;
	text-align: center;
	padding: 10px;
}
@media screen and (max-width: 450px) {
	.price-card-title {
		font-size: 1.6rem;
	}
}
.price-card-title span {
	font-size: 2rem;
}
@media screen and (max-width: 450px) {
	.price-card-title span {
		font-size: 1.4rem;
	}
}
.price-card.first .price-card-inner {
	display: flex;
	justify-content: space-between;
}
.price-card.first .price-card-detail {
	padding: 20px;
}
@media screen and (max-width: 450px) {
	.price-card.first .price-card-detail {
		padding: 10px;
	}
}
.price-card.second .price-card-inner {
	padding: 20px 40px;
}
@media screen and (max-width: 450px) {
	.price-card.second .price-card-inner {
		padding: 10px 20px;
	}
}
@media screen and (min-width: 451px) {
	.price-card-inner {
		padding: 0 0;
	}
}
.price-card-inner .text-60 {
	margin: 0 5px;
}
@media screen and (max-width: 450px) {
	.price-card-inner .text-60 {
		font-size: 5.5rem !important;
	}
}
@media screen and (max-width: 450px) {
	.price-card-inner .text-28 {
		font-size: 2rem !important;
	}
}
@media screen and (max-width: 450px) {
	.price-card-inner .text-28 {
		font-size: 2rem !important;
	}
}
.price-card-detail {
	width: 50%;
	text-align: center;
	font-weight: 800;
	padding: 0 1%;
}
.price-card-detail:first-child {
	border-right: 1px solid #ddd;
}
.price-card-subtitle {
	font-size: 2.4rem;
	margin-bottom: 10px;
}
@media screen and (max-width: 450px) {
	.price-card-subtitle {
		font-size: 1.4rem;
	}
}
.price-card-price {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	font-weight: 800;
}

.price-card-list {
	margin-top: 0;
}
@media screen and (min-width: 451px) {
	.price-card-list {
		display: flex;
		justify-content: space-between;
		margin-top: 2px;
	}
}
.price-card-list li {
	background: #eee;
	padding: 8px;
	line-height: 1.4;
	width: 100%;
	text-align: center;
}

@media screen and (max-width: 450px) {
	.price-card-list li {
		font-size: 1.6rem;
		margin-top: 10px;
	}
}
.price .list-asterisk {
	margin: 20px 0;
}
@media screen and (max-width: 450px) {
	.price .list-asterisk li {
		font-size: 1.3rem;
	}
}

.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1rem;
	margin-top: 120px;
}

@media screen and (max-width: 768px) {
	.tabs {
		margin-top: 70px;
	}
}
.tab_label {
  color: #fff;
  max-width: 50%;
	padding: 1rem 1rem calc(1rem + 5px);
	/* font-size: 2.4rem; */
	text-align: center;
	/* font-weight: 800; */
	z-index: 1;
	cursor: pointer;
	flex: 1;
	border-radius: 5px 5px 0 0;
	transition: 0.5s;
	margin-bottom: -5px;
	z-index: 5;
}
.tab_label.tab_card {
	background-color: #323E85;
}
.tab_label.tab_multi {
	background-color: #35ADEB;
}

.tab_label:hover {
	opacity: 0.75;
	transform: translateY(-5px);
}
.tab_card, .tab_multi {
	position: relative;
}
.tab_content {
	flex: 100%;
	display: none;
	overflow: hidden;
	background: #fff;
	padding: 5rem 8rem;
	z-index: 100;
}

input[name='tab_switch'] {
	display: none;
}

.tab_label img {
	position: absolute;
	top: -45px;
	left: 10px;
}
@media screen and (max-width: 768px) {
	.tab_label img {
		top: -55px;
	}
}
.tabs input:checked + .tab_label:hover {
	opacity: 1;
	transform: translateY(0);
}

.tabs input:checked + .tab_label {
	background-color: #fff;
  color: #3b4043;
  max-width: 50%;
	padding: 1rem;
	/* font-size: 2.4rem; */
	text-align: center;
  font-weight: bold;
}

/* @media screen and (max-width: 540px) {
  .tabs input:checked + .tab_label {
    font-size: 1.4rem;
	}
} */
.tab_label.tab_card h3.dots {
  display: inline-table;
  position: absolute;
  top: -80px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
@media screen and (max-width: 900px) {
  .tab_label.tab_card h3.dots {
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
	}
}
@media screen and (max-width: 540px) {
  .tab_label.tab_card h3.dots {
    font-size: 1.2rem;
	}
}
.tab_label.tab_multi h3.dots {
  display: inline-table;
  position: absolute;
  top: -80px;
  right: 0;
  left: 0;
  margin: 0 auto;
}
@media screen and (max-width: 900px) {
  .tab_label.tab_multi h3.dots {
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
	}
}
.tab_label h3.dots.color-skyblue {
  color: #0099d5;
  line-height: 0;
}

h3.dots.color-skyblue::after, h3.dots.color-skyblue::before {
  position: absolute;
  top: 20px;
  content: url(../images/line_dot_ltblue.svg);
}
h3.dots.color-skyblue::before {
  left: -20px;
  transform: rotate(-30deg);
}
h3.dots.color-skyblue::after {
  right: -20px;
  transform: rotate(30deg);
}

@media screen and (max-width: 540px) {
  .tab_label.tab_multi h3.dots {
    /* left: 28px; */
    font-size: 1.2rem;
    top: -55px;
	}
  .tab_label.tab_multi h3.dots span{
   line-height: 0.6em;
	}
  h3.dots.color-skyblue::after, h3.dots.color-skyblue::before {
    bottom: -10px;
    top: auto;
  }
}
#tab01:checked ~ #tab01_content,
#tab02:checked ~ #tab02_content,
#tab03:checked ~ #tab03_content {
	display: block;
}

.tab_content {
	position: relative;
	animation: fadeIn 1s ease;
}

.tab_content {
	position: relative;
	animation: fadeIn 1s ease;
}

/* .tab_content h3 {
	font-size: 2.8rem;
	font-weight: 800;
	text-align: center;
	margin-block: 3rem 2rem;
} */

@media screen and (max-width: 768px) {
	/* .tab_label {
		font-size: 1.8rem;
	} */
	.tab_content {
		flex: 100%;
		display: none;
		overflow: hidden;
		background: #fff;
		padding: 2rem;
		z-index: 100;
	}
	.el_illust img {
		width: 100%;
	}
	.tab_content h3 {
		font-size: 2rem;
	}
}
.bl_flex {
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 900px) {
  .bl_flex {
    flex-direction: column-reverse;
    align-items: center;
  }
}
p.bl_lead {
  text-align: left;
  /* font: normal normal bold 24px / 38px Noto Sans CJK JP; */
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1.2px;
  color: #3B4043;
  margin-top: 33px;
}
.plus_img {
  margin: 30px 0;
}
.plus_img, .with_qr {
  text-align: center;
}
.plus_img img, .with_qr img {
  text-align: center;
  display: inline-block;
}

@media screen and (max-width: 900px) {
  .with_qr .show-pc {
    display: none;
  }
}

@media screen and (max-width: 430px) {
  .with_qr img {
    width: 100%;
  }
}
@media screen and (min-width: 901px) {
  .with_qr .show-sp {
    display: none;
  }
}
/* #PRICE .tab_content h3 {
  margin-top: 5px;
} */
#PRICE .cta-button a span {
  background: #F0F3F5;
}
.commission-list {
  position: relative;
  margin-bottom: 50px;
}
@media screen and (min-width: 768px) {
  .commission-list {
    display: flex;
    justify-content: center;
  }
}

.commission-list:after {
  transform: rotate(90deg);
}
@media screen and (min-width: 1024px) {
  .commission-list-item {
    width: 232px;
  }
}
@media screen and (max-width: 1023px) {
  .commission-list-item {
    width: 32%;
  }
}
@media screen and (max-width: 767px) {
  .commission-list-item {
    width: 100%;
    margin-bottom: 24px;
  }
}
@media screen and (min-width: 1024px) {
  .commission-list-item:nth-child(1),
  .commission-list-item:nth-child(2) {
    margin-right: 40px;
  }
}
@media screen and (min-width: 768px) {
  .commission-list-item:nth-child(1),
  .commission-list-item:nth-child(2) {
    margin-right: 1%;
  }
}
.commission-list-item-inner {
  margin-top: 8px;
}
@media screen and (min-width: 768px) {
  .commission-list-item-inner {
    margin-top: 16px;
  }
}
@media screen and (max-width: 767px) {
  .commission-list-item-inner {
    display: flex;
    align-items: center;
  }
}
.commission-list-title {
  /* font: normal normal bold 24px/38px Noto Sans CJK JP; */
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 1.2px;
  color: #36404B;
}
@media screen and (min-width: 768px) {
  .commission-list-title {
    text-align: center;
  }
}
.commission-list-image {
  text-align: center;
}
.commission-list-image img {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .commission-list-image {
    width: 100px;
    margin-right: 16px;
  }
}
@media screen and (max-width: 767px) {
  .commission-list-image img {
    max-width: 100%;
    height: auto;
  }
}
@media screen and (min-width: 768px) {
  .commission-list-price {
    display: flex;
    justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .commission-list-price {
    flex: 1;
  }
  .commission-list-price-inner {
    text-align: left;
}
}
.commission-list-price-l,
.commission-list-price-s {
  display: flex;
  align-items: center;
  justify-content: center;
}
.commission-list-price-l dt,
.commission-list-price-s dt {
  font-size: 12px;
  letter-spacing: 0;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .commission-list-price-l {
    margin-top: 24px;
  }
}
.commission-list-price-l .text-l {
  font-size: 48px;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .commission-list-price-l .text-l {
    font-size: 36px;
  }
}
.commission-list-price-l .text-m {
  font-size: 16px;
}
.commission-list-price-s .text-l {
  font-size: 28px;
}
@media screen and (max-width: 767px) {
  .commission-list-price-s .text-l {
    font-size: 24px;
  }
}
.commission-list-price-s .text-m {
  font-size: 16px;
}
.commission-list-price-other {
  display: flex;
}
.commission-list-item:first-child .commission-list-price-other {
  justify-content: space-between;
}
/* @media screen and (max-width: 767px) {
  .commission-list-item:first-child .commission-list-price-l {
    display: inherit;
  }
} */
.commission-list-item:first-child .commission-list-price-l dd {
  margin-top: 4px;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .commission-list-item:nth-child(3) .commission-list-price-other {
    justify-content: center;
  }
}
/* @media screen and (max-width: 767px) {
  .commission-list-item:nth-child(3) .commission-list-price-s,
  .commission-list-item:nth-child(3) .commission-list-price-l {
    display: inherit;
  }
} */
.commission-list-item:nth-child(3) .commission-list-price-s dd,
.commission-list-item:nth-child(3) .commission-list-price-l dd {
  margin-top: 4px;
}
/* 202012追記 */
#main_area #point {
  background: url(../images/point_bg.gif) no-repeat center top;
  background-size: cover;
  position: relative;
  z-index: 4;
  padding: 50px 0 2%; }
@media only screen and (min-width: 769px) {
  #main_area #point .cont_width{
      padding: 0 0 0 5%;
  }
}
#main_area #point .container{
  display: flex;
  justify-content: space-between;
}
#main_area #point .cont_ttl h2 {
  text-align:center;
}
#main_area #point .container .pointtxt{
  margin: 50px 3% 0 0;
  font-size: 120%;
}
#main_area #point .container .pointtxt p:first-child{
  margin-bottom: 40px;
}
#main_area #point .container .pointtxt .attention{
  color:#fff600;
}
@media only screen and (min-width: 769px) {
  #main_area #point .container .pointimg{
    transform: translateY(-40px);
  }
}
#main_area #point .otherpage_btn{
      margin: -140px auto 0;
}
#main_area #point .otherpage_btn a{
  color:#04469c;
  border: 3px #04469c solid;
}
#main_area #point .otherpage_btn.param .cv_lead{
  color: #fff;
}
#main_area #point .cv_area_inner a{
  color:#fff;
  border: 3px #fff solid;
}
/* #main_area #PRICE {
  background: url(../images/price_bg.gif) no-repeat center top;
  background-size: 100% 100%;
}
#main_area #PRICE .cv_area{
  margin: 50px auto 0;
} */
#main_area #point .cv_area{
  margin: 50px auto 0;
}
@media only screen and (min-width: 769px) {
  #main_area #point .cv_area{
    margin: -100px auto 0;
  }
}
@media only screen and (max-width: 400px) {
  #main_area #point .cv_area{
    margin: 25px auto 0;
  }
}
#main_area #point .cv_area .cv_lead,
#main_area #PRICE .cv_area .cv_lead,
#main_area #QR .cv_area .cv_lead{
  color: #fff;
}
#main_area #point .cv_area .cv_lead > span:before,
#main_area #PRICE .cv_area .cv_lead > span:before,
#main_area #QR .cv_area .cv_lead > span:before{
    border-left: 5px solid #fff;
}
#main_area #point .cv_area .cv_lead > span:after,
#main_area #PRICE .cv_area .cv_lead > span:after,
#main_area #QR .cv_area .cv_lead > span:after{
    border-right: 5px solid #fff;
}
@media only screen and (max-width: 850px) {
  #main_area #point {
    background: url(../images/point_bg_sp.gif) no-repeat center top;
    background-size: cover;
    padding: 20% 0 10%;}
  #main_area #point .otherpage_btn{
    margin: -10px auto 0;
  }
}
@media only screen and (max-width: 480px) {
  #main_area #point {
    padding: 30% 0 15%; }
  #main_area #point .container{
    display: block;
  }
  #main_area #point .cont_width{
    padding: 0 5%;
  }
  #main_area #point .container .pointimg{
    transform: translateY(10px);
    text-align: center;
  }
  #main_area #point .container .pointimg img{
    margin: 0 auto;
  }
  #main_area #point .otherpage_btn{
    margin: 0px auto 0;
    padding: 0;	
  }
  #main_area #point .container .pointtxt{
    font-size: 100%;
    margin: 20px 0 0 0;
  }
  #main_area #point .container .pointtxt p:first-child{
    margin-bottom: 20px;
  }
}
    @media only screen and (max-width: 850px) {
      #main_area #point .cont_ttl h2 {
        line-height: 0.8; } }
    #main_area #point .cont_ttl h2 .big {
      display: inline-block;
      font-size: 228.6%;
      position: relative;
      top: 10px;
      padding: 0 3px; }
    #main_area #point .cont_ttl h2 .border {
      border-bottom: 3px #fff solid; }

.upay_master .aco_area .aco_box dl dd{
  display: block;
}

/* NEES
========================================================================== */
/* .needs{
  position: relative;
  padding: 50px 0 100px;
}
@media screen and (max-width: 768px){
  .needs{
    padding: 20px 0 120px;
  }
}
@media screen and (max-width: 425px){
  .needs{
    padding: 40px 0 0;
  }
}
.needs-title{
  font-size: 32px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 640px){
  .needs-title{
    font-size: 142.9%;
    margin-bottom: 15px;
  }
}
.needs-cols{
    margin-top: 20px
}
@media screen and (min-width: 426px){
  .needs-cols{
	display: flex;
	justify-content:space-between;
  }
}
.needs-col{
    background: #67b8e0;
    border-radius: 17px;
    padding: 20px;
}
@media screen and (min-width: 426px){
  .needs-col{
    width: 49%;
  }
}			
@media screen and (max-width: 425px){
  .needs-col{
    margin-bottom: 20px;
  }
}
.needs-col-title{
  font-size:30px;
  font-weight: bold;
  color: #fff;
  padding: 0 0 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px){
  .needs-col-title{
    font-size: 24px;
  }
}
@media screen and (max-width: 425px){
  .needs-col-title{
    font-size: 22px;
  }
}
.needs-col-title span{
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  color: #0099D5;
  background: #fcdc50;
  padding: 0 10px;
  border: 2px solid #FFFFFF;
  margin-right: 10px;
  margin-top: 2px;
}
@media screen and (max-width: 425px){
  .needs-col-title span{
    font-size: 14px;
  }
}
.needs-col-inner{
  background: #fff;
  padding: 30px;
  border-radius: 17px;
  position: relative;
}
@media screen and (max-width: 768px){
  .needs-col-inner{
    padding: 30px 20px 20px
  }
}
.needs-col-inner:before{
  content: "";
  border-style: solid;
  border-width: 16px 14px 0 14px;
  border-color: #67b8e0 transparent transparent transparent;
  position: absolute;
  top: -1px;
  left: 50%;
  transform: translateX(-50%);
}
.needs-col-subtitle{
  font-size: 34px;
  font-weight: bold;
  color: #13469c;
  text-align: center;
  margin-bottom: 17px;
  height: 50px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  line-height: 1;
}
@media screen and (max-width: 768px){
  .needs-col-subtitle{
    flex-wrap: wrap;;
    font-size: 20px;
    height: 60px;
  }
}
@media screen and (max-width: 425px){
  .needs-col-subtitle{
    height: auto
  }
}
.needs-col-subtitle span{
  display: inline-block;
  line-height: 1;
}
.needs-col-subtitle span:nth-child(1){
  font-size: 18px;
}
@media screen and (max-width: 425px){
  .needs-col-subtitle span:nth-child(1){
    width: 100%
  }
}
.needs-col-subtitle span:nth-child(2){
  font-size: 46px;
  font-weight: bold;
  padding: 0 0 0 5px;
  line-height: 0.8;
}
@media screen and (max-width: 425px){
  .needs-col-subtitle span:nth-child(2){
   font-size: 36px;
  }
}
.needs-col-subtitle span:nth-child(3){
  font-size: 20px;
}
.needs-col-image{
  margin-bottom: 20px
}
@media screen and (max-width: 425px){
  .needs-col-image{
    margin-bottom: 10px
  }
}
.needs-col-image:before{
  display: block;
  content: "";
  background: #13469c;
  width: 100%;
  height: 5px;
}
.needs-col-image img{
  max-width: 100%;
  height: auto;
}
.needs-col-notes{
  font-size: 12px;
}	
.needs-col-notes li{
  position: relative;
  padding-left: 2em;
}
.needs-col-notes li:before{
  display: inline-block;
  content: "注：";
  position: absolute;
  top: 0;
  left: 0;
}
.needs-col-text{
  min-height: 100px;
}
@media screen and (max-width: 425px){
  .needs-col-text{
    font-size: 14px;
  }
}
.needs-col-link{
  margin: 20px auto 0;
}
.needs-col-link a{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: left;
}
@media screen and (max-width: 768px){
  .needs-col-link a{
    padding: 15px 20px 15px 10px;
  }
}
@media screen and (max-width: 425px){
  .needs-col-link a{
    font-size: 14px;
  }
} */


.specialrate {

}
.specialrate-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}
.specialrate h3.dots {
  color: white;
}
.specialrate h3.dots::before,
.specialrate h3.dots::after {
  bottom: -10px;
  content: url(../images/line_dot_white.svg);
}
.detail-specialrate {
  width: 48.5%;
}
.detail-specialrate-inner {
  border-radius: 8px;
  background: #fff;
  box-shadow: 4px 0 10px rgba(0, 0, 0, 0.16);
  position: relative;
  padding: 40px 9px;
}
.detail-specialrate h4 {
  font-size: 20px;
  font-weight: bold;
}
.detail-specialrate img {
  margin-top: 30px;
  width: 100%;
}
.specialrate .detail-specialrate .cta-button {
  width: 100%;
}
.specialrate .detail-specialrate .cta-button a {
  width: 92%;
}


.specialrate-inner {
  margin-top: 50px;
}
.specialrate-inner .specialrate-text-wrap {
  max-width: 710px;
  margin: 0 auto;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box {
  border: 1px solid #E4E3EC;
  border-radius: 5px;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box p.ttl {
  background-color: #E4E3EC;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  padding: 10px;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list {
  padding: 20px 50px;
  color: white;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list:last-child {
  padding: 0 50px 30px;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list p.sub-ttl {
  margin-bottom: 10px;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list ul {
  padding-left: 15px;
}
.specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list ul li {
  font-size: 14px;
  text-align: left;
  list-style: disc;
  font-weight: 200;
}

.cta-wrap {

}
.cta-wrap h3.lines {
  font-size: 20px;
  color: white;
  position: relative;
    width: fit-content;
    margin: 0 auto;
}
.section-three h3.lines {
  font-size: 24px;
  display: inline-block;
  position: relative;
  margin-bottom: 20px;
  color: white;
  font-weight: bold;
}
.cta-wrap h3.lines::before,
.cta-wrap h3.lines::after,
.section-three h3.lines::before,
.section-three h3.lines::after {
  position: absolute;
  bottom: -5px;
  content: url(../images/line_white.svg);
}
.cta-wrap h3.lines::before {
  left: -20px;
  transform: rotate(-30deg);
}
.cta-wrap h3.lines::after {
  right: -20px;
  transform: rotate(30deg);
}
.cat-box {
  border: 5px solid #284081;
  background-color: white;
  padding: 30px;
  position: relative;
  margin-top: 50px;
}
.cat-box::before {
  position: absolute;
  content: "";
  top: -20px;
  right: 10px;
  background-image: url(../images/usen-pay.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 18vw;
  height: 75%;
}
@media only screen and (min-width: 1025px) {
  .cat-box::before {
    width: 230px;
  }
}

.cat-box .cta-title {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
.cat-box .cta-title h4 {
  position: relative;
  font-size: 24px;
  margin-top: -35px;
  font-weight: bold;
  color: #355097;
}
.cat-box .cta-title h4 span {
  padding: 0 80px;
  position: relative;
}
.cat-box .cta-title h4 span::before,
.cat-box .cta-title h4 span::after {
  position: absolute;
  content: "";
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  width: 50px;
  height: 50px;
  background-size: contain;
  background-repeat: no-repeat;
}
.cat-box .cta-title h4 span::before {
  background-image: url(../images/star-left.png);
  left: 0;
}
.cat-box .cta-title h4 span::after {
  background-image: url(../images/star-right.png);
  right: 0;
}
.cat-box .cta-title h4::before {
  position: absolute;
  content: "";
  background-image: url(../images/ribon-bg.png);
max-width: 698px;
    height: 76px;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -1;
    width: 140%;
}
.cat-box .cta-img {
  margin: 30px 0 20px;
  max-width: 88%;
}
.cat-box .cta-img img {
  width: 100%;
}
.cat-box p {
  font-size: 14px;
  text-align: left;
  text-indent: -1em;  /* 米印を左にずらす */
  padding-left: 1em;  /* 本文を米印の位置に揃える */
}
.cat-box p a {
  color: #0000ee;
  text-decoration: underline;
}
@media screen and (max-width: 910px) {
  .cat-box .cta-title h4 span {
    padding: 0 60px;
  }
  .cat-box .cta-title h4 {
    font-size: 20px;
  }
  .cat-box .cta-title h4::before {
    height: 53px;
    top: -4px;
  }
  .cat-box .cta-title h4 span::before, .cat-box .cta-title h4 span::after {
    width: 4vw;
    height: 4vw;
  }
  .cta-wrap h3.lines {
    font-size: 18px;
  }
}
@media screen and (max-width: 740px) {
  .cat-box .cta-title h4 span {
    padding: 0 30px;
  }
  .cat-box .cta-title h4::before {
    width: 170%;
  }
  .cat-box .cta-img {
    max-width: 85%;
  }
  .cat-box::before {
    top: 20px;
    right: 30px;
    width: 18vw;
    height: 55%;
  }
  .detail-specialrate h4 {
    font-size: 16px;
  }
  .detail-specialrate-inner {
    padding: 20px 9px;
  }
}
@media screen and (max-width: 678px) {
  .specialrate-wrap {
    flex-direction: column;
    margin-top: 0;
  }
  .detail-specialrate {
    width: 100%;
  }
}
@media screen and (max-width: 631px) {
  .cat-box p {
    font-size: 12px;
  }
  .cat-box {
    padding: 15px;
    margin-top: 20px;
  }
  .cat-box .cta-title h4 span {
    padding: 0 10px;
  }
  .cat-box .cta-title h4 span::after {
    right: -30px;
  }
  .cat-box .cta-title h4 span::before {
    left: -30px;
  }
  .cat-box .cta-title h4::before {
    top: -1px;
  }
  .cat-box .cta-title h4 {
    margin-top: -20px;
  }
}
@media screen and (max-width: 468px) {
  .cat-box .cta-title {
    width: 58%;
  }
  .cta-wrap h3.lines {
    font-size: 16px;
  }
  .cat-box .cta-title h4 {
    font-size: 18px;
  }
  .cat-box .cta-title h4 span {
    padding: 0;
  }
  .cat-box .cta-img {
    max-width: 100%;
  }
  .cat-box::before {
    top: -40px;
    right: 0px;
    width: 90px;
    height: 40%;
    z-index: 1;
  }
  .specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list {
    padding: 20px;
  }
  .specialrate-inner .specialrate-text-wrap .specialrate-text-box .specialrate-list:last-child {
    padding: 0 20px 30px;
  }
  .cta-banner .cta-button {
    width: 100%;
  }
  .cta-banner .cta-button a {
    width: 100%;
  }
  .section-inner.section-three {
    margin: 0;
  }
}
.section-inner.m-0 {
  margin: 0;
}
@media screen and (max-width: 910px) {
  .section-inner.m-0 {
    margin: 0 15px;
  }
}
@media screen and (max-width: 414px) {
  .cat-box .cta-title h4 span {
    padding: 0;
    font-size: 16px;
  }
}