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

	----------------------------------
  	Comment
  ----------------------------------
  
  修正する際は、それぞれのscssを修正してください。


====================================*/

/*  Fonts
*************************************************************************/
@import url("https://fonts.googleapis.com/css?family=Volkhov|Marcellus SC");
/*  Reset ▽_reset.scssここから
*************************************************************************/
body, div, dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
object, iframe, pre, code, p, blockquote,
form, fieldset, legend,
table, th, td, caption, tbody, tfoot, thead,
article, aside, figure, footer, header,
hgroup, menu, nav, section, audio, video, canvas, main {
  margin: 0;
  padding: 0;
  line-height: 1.65;
  letter-spacing: 0.1rem;
  font-size: 100%;
  font-weight: 400; }

article, aside, figure, figcaption, footer,
h1, h2, h3, h4, h5, h6, header, hgroup, menu, section, main {
  display: block; }

* {
  box-sizing: border-box;
  -moz-box-sizing: border-box; }

.clearfix:after {
  content: " ";
  display: block;
  clear: both; }

table {
  border-collapse: collapse; }

ul li {
  list-style: none; }

ol li {
  list-style: decimal;
  margin-left: 2.0rem; }

img {
  width: 100%; }

a {
  transition: .3s;
  text-decoration: none; }

a:hover {
  text-decoration: none; }

/* △_reset.scssここまで -----*/
/*  Login ▽_login.scss ここから
*************************************************************************/
.topHeader {
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw); }
  .topHeader img {
    display: block;
    width: 100%;
    height: 15px; }

.login {
  background: url("../images/line_top.png") repeat-x;
  background-size: contain; }

.loginArea {
  flex: 1; }

.loginArea img {
  display: block;
  max-width: 150px;
  margin: 0 auto;
  padding-top: 4rem; }
  @media screen and (min-width: 600px) {
    .loginArea img {
      max-width: 180px;
      padding-top: 13rem; } }

.loginArea .wrap {
  max-width: 425px;
  margin: 3rem auto 0;
  background: #fff;
  padding: 3rem;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); }
  @media screen and (min-width: 600px) {
    .loginArea .wrap {
      margin: 4rem auto 0;
      padding: 5rem; } }

.formGroup {
  margin-bottom: 2rem; }

.loginArea .formGroup label {
  font-weight: bold;
  display: block; }

/*---------- Checkbox ----------*/
.loginArea .checkboxParts {
  padding-left: 30px; }

.loginArea .checkboxParts:before {
  top: -2px; }

/*.checkboxInput {
  display: none;
}

.checkboxParts{
  padding-left: 2.5rem;
  position:relative;
  margin-right: 2rem;
  font-size: 1.5rem;
}

.checkboxParts::before{
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #bab5b5;
}

.checkbox:checked + .checkboxParts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid $mainColor;
  border-right: 3px solid $mainColor;
}*/
/*---------- Btn ----------*/
.loginArea .btn {
  display: block;
  width: 100%;
  font-size: 1.6rem;
  margin-top: 2rem; }

/*---------- Footer ----------*/
.topFooter {
  background: url("../images/line_btm.jpg") repeat-x right;
  background-size: cover;
  padding: 1rem 0;
  position: static;
  transform: none; }
  .topFooter p {
    padding: 0;
    font-size: 1.2rem;
    text-align: center; }

/* △_login.scssここまで -----*/
/*  サイドバー　▽_side.scssここから
*************************************************************************/
.mainWrap {
  position: relative; }
  @media screen and (min-width: 900px) {
    .mainWrap {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex; } }

_:-ms-lang(x)::-ms-backdrop, .mainWrap {
  height: 100%; }

.side {
  z-index: 1;
  overflow: hidden; }
  @media screen and (min-width: 900px) {
    .side {
      max-width: 260px;
      min-width: 260px;
      box-shadow: 4px 0px 5px rgba(0, 0, 0, 0.2);
      background: url(../images/line_top.jpg) no-repeat;
      background-size: 100% 15px;
      padding: 1rem 0; } }

main {
  width: 100%;
  /*height: 100%;*/
  padding: 4rem 2rem; }
  @media screen and (min-width: 900px) {
    main {
      padding: 2rem 3rem;
      position: relative; } }

/*---------- Sidebar Header ----------*/
.sideHeader {
  color: #033560;
  text-align: center;
  padding-top: 60px;
  z-index: 100;
  width: 100%;
  padding: 2.5rem; }
  @media screen and (min-width: 900px) {
    .sideHeader {
      background: #fff; } }

.sideHeader a {
  display: block;
  max-width: 140px;
  margin: 0 auto; }

.logoImg {
  max-width: 140px;
  padding-top: 2.5rem; }
  @media screen and (min-width: 900px) {
    .logoImg {
      padding-top: 0; } }

.side .userName {
  font-size: 1.5rem;
  margin-top: 1rem;
  color: #454c56;
  text-align: center; }
  .side .userName i {
    margin-right: .5rem; }

.logoAreaSp {
  display: block;
  max-width: 140px;
  margin: 0 auto; }

.logoAreaSp .logoImg {
  padding-top: 4rem; }
  @media screen and (min-width: 900px) {
    .logoAreaSp .logoImg {
      padding-top: 0; } }

/*---------- Sidebar ----------*/
aside {
  font-size: 1.4rem;
  background: #fff;
  position: fixed;
  right: -300px;
  top: 0;
  width: 300px;
  height: 100%;
  -webkit-transition: .35s ease-in-out;
  transition: .35s ease-in-out;
  z-index: 300; }
  @media screen and (min-width: 900px) {
    aside {
      position: static;
      width: auto; } }

/*---------- Btn ----------*/
aside nav .btn {
  width: 80%;
  margin: 0 auto 2.5rem;
  display: block;
  text-align: center;
  padding: .9rem 2.4rem; }
  @media screen and (min-width: 900px) {
    aside nav .btn {
      margin: 0 auto 2rem; } }

/*---------- Nav ----------*/
aside nav {
  padding-top: 3rem; }
  @media screen and (min-width: 900px) {
    aside nav {
      padding-top: 0; } }

aside nav ul {
  list-style: none;
  margin-left: 0; }

aside nav ul li {
  border-bottom: solid 1px #e2e2e2; }

aside nav > ul > li {
  position: relative; }

aside nav a {
  color: #585856;
  text-decoration: none;
  display: block;
  padding: 2.5rem 2rem;
  -moz-transition: background-color .3s linear;
  -webkit-transition: background-color .3s linear;
  transition: background-color .3s linear;
  border-left: solid 4px transparent;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  align-items: center; }
  aside nav a:hover {
    color: #F74F84; }

aside nav .btn:hover {
  color: #fff; }

.organization {
  color: #585856;
  text-decoration: none;
  display: block;
  padding: 2.5rem 3rem;
  -moz-transition: background-color .3s linear;
  -webkit-transition: background-color .3s linear;
  transition: background-color .3s linear;
  border-bottom: dotted 1px #e2e2e2; }

.organizationMenu a {
  padding: 1.5rem 3rem;
  text-indent: 2rem; }

aside nav a i,
.organization i {
  font-size: 2rem;
  margin-right: 1rem;
  width: 30px !important;
  text-align: center !important; }

aside nav .pay p:before {
  content: '';
  display: inline-block;
  background: url("../images/menuIco03.svg");
  width: 25px;
  height: 25px;
  background-size: contain;
  vertical-align: middle;
  margin-right: 1rem; }

aside nav .pay:hover p:before {
  content: '';
  display: inline-block;
  background: url("../images/menuIco01.svg");
  width: 25px;
  height: 25px;
  background-size: contain;
  vertical-align: middle;
  margin-right: 1rem; }

aside nav .pay .active p:before {
  content: '';
  display: inline-block;
  background: url("../images/menuIco01.svg");
  width: 25px;
  height: 25px;
  background-size: contain;
  vertical-align: middle;
  margin-right: 1rem; }

aside nav .pcPay p:before {
  content: '';
  display: inline-block;
  background: url("../images/menuIco04.svg");
  width: 25px;
  height: 25px;
  background-size: contain;
  vertical-align: middle;
  margin-right: 1rem; }

aside nav .pcPay:hover p:before {
  content: '';
  display: inline-block;
  background: url("../images/menuIco02.svg");
  width: 25px;
  height: 25px;
  background-size: contain;
  vertical-align: middle;
  margin-right: 1rem; }

aside nav .pcPay .active p:before {
  content: '';
  display: inline-block;
  background: url("../images/menuIco02.svg");
  width: 25px;
  height: 25px;
  background-size: contain;
  vertical-align: middle;
  margin-right: 1rem; }

/*---------- Nav active ----------*/
.active {
  border-left: solid 4px #F74F84;
  background: #FDFCFD;
  color: #F74F84; }

.active i {
  color: #F74F84; }

/*---------- Toggle Button ----------*/
.navToggle {
  position: fixed;
  right: 0;
  top: 0;
  width: 66px;
  height: 59px;
  cursor: pointer;
  z-index: 400;
  background: #454344; }
  @media screen and (min-width: 900px) {
    .navToggle {
      display: none; } }

.navToggle div {
  position: relative; }

.navToggle span {
  display: block;
  position: absolute;
  height: 2px;
  width: 43%;
  background: #fff;
  left: 20px;
  -webkit-transition: .35s ease-in-out;
  -moz-transition: .35s ease-in-out;
  transition: .35s ease-in-out; }

.navToggle span:nth-child(1) {
  top: 13px; }

.navToggle span:nth-child(2) {
  top: 21px;
  width: 30%; }

.navToggle span:nth-child(3) {
  top: 28px; }

.navToggle .menu {
  top: 31px;
  left: 18px;
  color: #fff;
  height: 0;
  letter-spacing: 0;
  font-size: 1.1rem; }

.navToggle .close {
  display: none; }

/*---------- nav open ----------*/
.open {
  overflow: hidden;
  position: fixed; }

.open #overlay {
  display: block; }

.open aside {
  -webkit-transform: translate3d(-300px, 0, 0);
  transform: translate3d(-300px, 0, 0);
  overflow-y: auto; }

.open .navToggle span {
  width: 40%;
  left: 21px; }

.open .navToggle span:nth-child(1) {
  top: 20px;
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg); }

.open .navToggle span:nth-child(2) {
  width: 0;
  left: 50%; }

.open .navToggle span:nth-child(3) {
  top: 20px;
  -webkit-transform: rotate(-315deg);
  -moz-transform: rotate(-315deg);
  transform: rotate(-315deg); }

.open .navToggle .menu {
  display: none; }

.open .navToggle .close {
  display: block;
  top: 32px;
  left: 18px;
  color: #fff;
  letter-spacing: .03rem;
  height: 0;
  font-size: 1.1rem; }

#overlay {
  display: none;
  position: fixed;
  background: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 200; }

@media screen and (max-width: 400px) {
  aside {
    right: -250px;
    width: 250px; }

  .open aside {
    -webkit-transform: translate3d(-250px, 0, 0);
    transform: translate3d(-250px, 0, 0); } }
/* △_side.scssここまで -----*/
/*-----▽ style.scss ここから*/
/*  Base
*************************************************************************/
html, body {
  height: 100%; }

html {
  font-size: 62.5%;
  overflow: auto; }

body {
  font-size: 1.6rem;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", YuGothic, '游ゴシック', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
  color: #454c56;
  line-height: 2.0;
  letter-spacing: 0.2rem;
  -webkit-text-size-adjust: 100%;
  display: flex;
  flex-flow: column;
  min-height: 100vh; }

/* 共通
*************************************************************************/
body {
  background: #FAF8FA; }

.mb {
  margin-bottom: 1rem; }

.mt {
  margin-top: 1rem; }

.container {
  width: 100%;
  max-width: 540px;
  margin: 0 auto;
  padding: 0 2rem; }
  @media screen and (min-width: 600px) {
    .container {
      max-width: 1000px; } }

input[type="text"],
input[type="button"],
input[type="email"],
input[type="submit"],
button[type="button"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

.formControl[readonly] {
  background: #eee; }

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  vertical-align: middle;
  vertical-align: middle; }

.formControl {
  display: block;
  width: 100%;
  height: 40px;
  padding: .8rem .75rem;
  font-size: 1.5rem;
  line-height: 1.5;
  color: #495057;
  background: #FDFCFD;
  background-clip: padding-box;
  border: solid 2px #e5e5e5;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", YuGothic, '游ゴシック', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif; }
  .formControl:focus {
    outline: 0;
    box-shadow: none;
    border: solid 1px #F74F84; }

.selectWrap {
  position: relative;
  background: #FDFCFD; }
  .selectWrap:before {
    content: "▼";
    position: absolute;
    top: 11px;
    right: 10px;
    color: #666;
    font-size: 1.1rem; }

.selectWrap select {
  width: 100%;
  background: transparent;
  cursor: pointer;
  position: relative;
  padding-right: 2.5rem; }

label.radio {
  cursor: pointer;
  position: relative;
  margin-right: 2rem;
  overflow: hidden;
  padding-left: 2.5rem;
  display: inline-block; }
  label.radio:before {
    position: absolute;
    width: 15px;
    height: 15px;
    border: 1px solid #aaa;
    border-radius: 50%;
    left: 0;
    top: 4px;
    content: '';
    z-index: 3; }
  label.radio:after {
    content: '';
    position: absolute;
    width: 11px;
    height: 11px;
    border-radius: 100%;
    left: 3px;
    top: 7px;
    background: #F74F84;
    z-index: 1; }

label.radio input[type="radio"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  position: absolute;
  z-index: 2;
  width: 14px;
  height: 14px;
  left: -20px;
  top: 5px;
  margin: 0px;
  box-shadow: 20px -1px #fff; }

label.radio input[type="radio"]:checked {
  box-shadow: none; }

/*---------- ユーザー名 ----------*/
/*.userName {
  font-size: 1.5rem;
  margin-bottom: 1rem;
  @media screen and (min-width: 900px) {
    position: absolute;
    top: 20px;
    right: 20px;
  }
}

.userName i {
  margin-right: .5rem;
}*/
/*---------- Btn ----------*/
.btn {
  font-weight: bold;
  border: solid 1px #454344;
  border-radius: .2rem;
  padding: .7rem 2.4rem;
  background: #454344;
  color: #fff;
  display: inline-block;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", YuGothic, '游ゴシック', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
  transition: .3s; }
  .btn:hover {
    opacity: .8; }
.btnReward {
  font-weight: bold;
  border: solid 1px #454344;
  border-radius: .2rem;
  padding:9px;
  background: #454344;
  color: #fff;
  display: inline-block;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", YuGothic, '游ゴシック', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
  transition: .3s; }
  .btnReward:hover {
    opacity: .8; }
.btnReceipt {
  font-weight: bold;
  border: solid 1px #000080;
  border-radius: .2rem;
  padding: .7rem 2.4rem;
  background: #0000cd;
  color: #fff;
  display: inline-block;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", YuGothic, '游ゴシック', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Arial, sans-serif;
  transition: .3s; }
  .btnReceipt:hover {
    opacity: .8; }
input[type="text"],
input[type="button"],
input[type="email"],
input[type="submit"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

.pcOnly {
  display: none; }
  @media screen and (min-width: 900px) {
    .pcOnly {
      display: block; } }

@media screen and (min-width: 900px) {
  .spOnly {
    display: none; } }
/* トップ
*************************************************************************/
.topMain {
  padding-bottom: 10rem; }
  @media screen and (min-width: 900px) {
    .topMain {
      padding-bottom: 0; } }

.topMain header {
  padding: 2rem; }
  @media screen and (min-width: 600px) {
    .topMain header {
      padding: 2.5rem; } }

.topMain header img {
  padding-top: 1rem; }
  @media screen and (min-width: 900px) {
    .topMain header img {
      padding-top: 0; } }

.topMain main {
  padding: 0 2rem 2rem;
  width: 100%;
  max-width: 835px;
  margin: 0 auto; }
  @media screen and (min-width: 600px) {
    .topMain main {
      padding: 0 2rem 2rem;
      max-width: 590px; } }
  @media screen and (min-width: 900px) {
    .topMain main {
      padding: 0 4rem 2rem;
      max-width: 745px; } }

.topMain main h1 {
  text-align: center;
  font-size: 1.7rem;
  margin: 6rem 0;
  font-weight: bold; }
  @media screen and (min-width: 600px) {
    .topMain main h1 {
      margin: 4rem 0;
      font-size: 2rem; } }

.topMain .userInner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  justify-content: space-between;
  align-items: end;
  margin-bottom: 1.2rem; }
  .topMain .userInner p {
    line-height: 1; }
  .topMain .userInner a {
    font-size: 1.4rem; }
    @media screen and (min-width: 600px) {
      .topMain .userInner a {
        font-size: 1.6rem; } }

/*.topNav {
  margin-bottom: 6rem;
}*/
.topNav ul {
  display: grid;
  display: -ms-grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(165px, 1fr));
  justify-content: center; }
  @media screen and (min-width: 600px) {
    .topNav ul {
      grid-template-columns: repeat(3, 175px);
      gap: 15px; } }
  @media screen and (min-width: 900px) {
    .topNav ul {
      grid-template-columns: repeat(3, 210px);
      gap: 20px;
      grid-auto-rows: 180px; } }

_:-ms-lang(x)::-ms-backdrop, .topNav ul {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start; }

@supports (-ms-ime-align: auto) {
  .topNav ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start; } }
.topNav ul li {
  background: #fff;
  border: solid 1px #e2e2e2;
  border-radius: .2rem;
  transition: .3s; }
  .topNav ul li:hover {
    border: solid 1px #F74F84; }
  @media screen and (min-width: 600px) {
    .topNav ul li {
      min-height: 172px; } }

_:-ms-lang(x)::-ms-backdrop, .topNav ul li {
  max-width: 200px;
  min-width: 200px;
  margin: 1.5rem; }

@supports (-ms-ime-align: auto) {
  .topNav ul li {
    max-width: 200px;
    min-width: 200px;
    margin: 1.5rem; } }
.topNav ul li a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.2rem 0;
  color: #454c56;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  /* Safari用 */
  transform: translateY(-50%); }
  @media screen and (min-width: 600px) {
    .topNav ul li a {
      display: block;
      padding: 3rem 0;
      text-align: center; } }

.topNav .menuIco {
  max-width: 25px;
  margin-right: .7rem; }
  @media screen and (min-width: 600px) {
    .topNav .menuIco {
      max-width: 50px;
      margin-bottom: 1.4rem;
      margin-right: 0; } }

.topNav i {
  color: #F74F84;
  font-size: 2.4rem;
  margin-right: .7rem; }
  @media screen and (min-width: 600px) {
    .topNav i {
      padding-bottom: 2rem;
      margin-right: 0;
      font-size: 4.5rem; } }

.topPaymentIcon {
  position: relative;
  display: inline-block;
  margin-right: 1rem;
  letter-spacing: 0;
  text-align: center; }
  @media screen and (min-width: 600px) {
    .topPaymentIcon {
      margin-right: 0; } }
  .topPaymentIcon:after {
    font-family: "Font Awesome 5 Free";
    content: '\f157';
    font-weight: 900;
    position: absolute;
    top: 1px;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    color: #1b5396;
    font-size: 1.1rem;
    letter-spacing: 0; }
    @media screen and (min-width: 600px) {
      .topPaymentIcon:after {
        font-size: 2rem;
        top: -1px; } }

.topPaymentIcon i {
  margin-right: 0;
  letter-spacing: 0; }

.topNav p {
  font-size: 1.3rem;
  line-height: 1.4; }
  @media screen and (min-width: 600px) {
    .topNav p {
      font-size: 1.6rem;
      line-height: 1.6; } }

@media screen and (min-width: 600px) {
  .linefeed {
    display: none; } }
/* Footer
*************************************************************************/
footer {
  background: #fff;
  padding-top: 2.5rem;
  width: 100%;
  position: absolute;
  left: 50%;
  bottom: 0;
  -ms-transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  margin-top: 5rem; }
  @media screen and (min-width: 600px) {
    footer {
      width: 100%;
      left: 50%;
      bottom: 0;
      -ms-transform: translate(-50%, 0);
      -webkit-transform: translate(-50%, 0);
      transform: translate(-50%, 0); } }
  @media screen and (min-width: 900px) {
    footer {
      padding: 0;
      background: none; } }

.spNav {
  display: block;
  max-width: 600px;
  margin: 0 auto 2rem; }
  @media screen and (min-width: 900px) {
    .spNav {
      display: none; } }

@media screen and (min-width: 600px) {
  .spNav ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; } }

.spNav ul li {
  text-align: center;
  padding: .5rem 1rem 1rem; }
  @media screen and (min-width: 600px) {
    .spNav ul li {
      flex-basis: 31%; } }

.spNav a {
  color: #454c56;
  font-size: 1.4rem;
  text-align: center;
  display: inline-block;
  border-bottom: solid 1px transparent; }
  .spNav a:hover {
    border-bottom: solid 1px #F74F84; }

footer .copy {
  background: url(../images/line_btm.jpg) repeat-x right;
  background-size: cover;
  padding: 1rem 0;
  font-size: 1.2rem;
  text-align: center; }
  @media screen and (min-width: 900px) {
    footer .copy {
      background: none;
      text-align: center; } }

/* 下層ページ
*************************************************************************/
.contents {
  width: 100%;
  padding: 2rem;
  min-height: 100vh;
  position: relative;
  padding-bottom: 50rem;
  box-sizing: border-box; }
  @media screen and (min-width: 900px) {
    .contents {
      padding: 2.5rem 3rem; } }

.contents h1 {
  font-size: 1.8rem;
  margin-bottom: 2rem;
  font-weight: bold; }
  .contents h1 img {
    width: 28px;
    margin-right: 1rem;
    vertical-align: middle;
    position: relative;
    top: -1px; }

.contents h1 i {
  font-size: 2.5rem;
  margin-right: 1rem;
  vertical-align: middle;
  position: relative;
  top: -1px; }

/* 保有ペイ
*************************************************************************/
.payBalance {
  width: 100%;
  max-width: 700px;
  margin: 0 auto; }
  @media screen and (min-width: 900px) {
    .payBalance {
      width: 100%;
      margin: 0; } }

.payInner {
  background: #fff;
  padding: 2rem 2.5rem; }
  @media screen and (min-width: 600px) {
    .payInner {
      padding: 3rem 3.5rem; } }
  @media screen and (min-width: 600px) {
    .payInner dl {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      align-items: center;
      justify-content: space-between; } }
  .payInner dl dt {
    font-weight: bold;
    margin-bottom: .6rem; }
  .payInner dl dd {
    border: solid 2px #e5e5e5;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 1rem;
    background: #FDFCFD;
    flex-basis: 60%; }
    .payInner dl dd .pay {
      padding-left: 1rem; }
    .payInner dl dd .payCol {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      align-items: center; }
  .payInner dl:not(:last-of-type) {
    margin-bottom: 3.5rem; }
  .payInner .btn {
    border: none;
    padding: .1rem 1.1rem;
    letter-spacing: .2rem;
    margin-left: .8rem; }

.payInner dt:not(:first-of-type) {
  margin-top: 2.2rem; }

/* PCペイ明細
*************************************************************************/
.pcPayDetail {
  width: 100%;
  max-width: 900px;
  margin: 0 auto; }
  @media screen and (min-width: 600px) {
    .pcPayDetail {
      width: 100%;
      margin: 0 auto; } }
  @media screen and (min-width: 900px) {
    .pcPayDetail {
      margin: 0; } }

.tableResponsive {
  overflow-x: scroll;
  margin: 0 auto; }
  @media screen and (min-width: 600px) {
    .tableResponsive {
      width: 100%;
      margin: 0 auto; } }
  @media screen and (min-width: 900px) {
    .tableResponsive {
      margin: 0; } }

.pcPayDetail table {
  border: solid 2px #E5E5E5;
  background: #fff;
  width: 100%;
  margin: 0 auto;
  table-layout: fixed; }
  @media screen and (min-width: 900px) {
    .pcPayDetail table {
      width: 100%; } }
  .pcPayDetail table tr:nth-child(odd) {
    background: #f9f9f9; }
  .pcPayDetail table .ttl th {
    font-weight: bold; }
  .pcPayDetail table .ttl .no {
    width: 80px; }
  .pcPayDetail table .ttl .date {
    width: 155px; }
  .pcPayDetail table .ttl .pay {
    width: 170px; }
  .pcPayDetail table .ttl .exchange {
    text-align: left;
    width: 190px; }
  .pcPayDetail table th, .pcPayDetail table td {
    padding: 1rem;
    text-align: center;
    font-size: 1.5rem; }

/*----- チェックボックス -----*/
.checkboxInput {
  display: none; }

.checkboxParts {
  padding-left: 20px;
  position: relative; }
  .checkboxParts:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 19px;
    height: 19px;
    border: 1px solid #BAB5B5;
    background: #FFF; }

.checkboxInput:checked + .checkboxParts {
  color: #F74F84; }

.checkboxInput:checked + .checkboxParts::after {
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #F74F84;
  border-right: 3px solid #F74F84; }

.replacedBtn,
.exchangeBtn {
  padding: .8rem 1rem;
  letter-spacing: .2rem;
  border: none;
  font-size: 1.6rem;
  width: 76px;
  text-align: center; }

.replacedBtn {
  background: #747072; }

.exchangeBtn {
  background: #F74F84;
  padding: .9rem 1rem; }

/*----- アラート -----*/
.swal-modal {
  width: 380px;
  padding: 1.5rem 0;
  border-radius: .2rem; }

.swal-text:first-child {
  margin: 4.5rem 0 2rem; }

.swal-footer {
  text-align: center; }

.swal-button-container {
  margin: .5rem; }

.swal-button {
  background: #F74F84;
  border-radius: .2rem;
  font-size: 1.6rem; }

.swal-button--cancel {
  background: #747072;
  color: #fff; }

.swal-button:focus {
  box-shadow: none; }

.swal-button:not([disabled]):hover {
  background: #F74F84;
  opacity: .8; }

.swal-button--cancel:not([disabled]):hover {
  background: #747072;
  opacity: .8; }

/*----- ▲ アラート ▲ -----*/
.balance {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  border: solid 2px #E5E5E5;
  background: #fff;
  max-width: 390px;
  margin: 1rem 0 0 auto;
  padding: 1rem 2rem;
  justify-content: space-between;
  font-size: 1.5rem; }
  .balance .ttl {
    font-weight: bold; }
  .balance span {
    margin-right: 1rem; }

/* PCペイ購入
*************************************************************************/
.payBuy {
  width: 100%;
  max-width: 700px;
  margin: 0 auto; }
  @media screen and (min-width: 900px) {
    .payBuy {
      width: 100%;
      margin: 0; } }
  .payBuy .btnWrap {
    text-align: center;
    margin-top: 3rem; }
    .payBuy .btnWrap .btn {
      letter-spacing: .1rem;
      background: #F74F84;
      border: solid 1px #F74F84;
      font-size: 1.8rem;
      padding: 1rem 3rem; }

.payBuyInner {
  background: #fff;
  padding: 2rem 2.5rem; }
  @media screen and (min-width: 600px) {
    .payBuyInner {
      padding: 3rem 3.5rem; } }
  @media screen and (min-width: 600px) {
    .payBuyInner dl {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      align-items: center;
      justify-content: space-between; } }
  .payBuyInner dl dt {
    font-weight: bold;
    margin-bottom: .5rem; }
    @media screen and (min-width: 600px) {
      .payBuyInner dl dt {
        margin-bottom: 0; } }
  .payBuyInner dl dd {
    width: 100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    align-items: center;
    flex-basis: 60%; }
    .payBuyInner dl dd .payWrap {
      border: solid 2px #e5e5e5;
      background: #FDFCFD;
      padding: 0.5rem 1.5rem;
      margin-right: 1rem;
      flex-basis: 83%;
      height: 40px; }
      @media screen and (min-width: 600px) {
        .payBuyInner dl dd .payWrap {
          flex-basis: 87%; } }
    .payBuyInner dl dd .selectWrap {
      flex-basis: 83%;
      margin-right: 1rem; }
      @media screen and (min-width: 600px) {
        .payBuyInner dl dd .selectWrap {
          flex-basis: 87%; } }
      .payBuyInner dl dd .selectWrap .formControl {
        padding: 0.5rem 1.5rem; }
  .payBuyInner dl:not(:last-of-type) {
    border-bottom: solid 1px #e5e5e5;
    padding-bottom: 2.5rem; }

.payBuyInner dl:not(:first-of-type) {
  padding-top: 2.5rem; }

/* PCペイ購入手続き
*************************************************************************/
.pcPayPurchase {
  padding-bottom: 6rem;
  max-width: 500px; }
  .pcPayPurchase .unit {
    margin-left: 1rem; }
  .pcPayPurchase .confirmTxt {
    border: solid 2px #E5E5E5;
    background: #f9f9f9;
    padding: 2rem 2.5rem;
    margin: 0 auto 2rem; }
    @media screen and (min-width: 600px) {
      .pcPayPurchase .confirmTxt {
        padding: 3rem 3.5rem;
        margin: 0 0 2rem; } }
    .pcPayPurchase .confirmTxt dl {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      justify-content: space-between; }
      .pcPayPurchase .confirmTxt dl dd {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: flex; }
    .pcPayPurchase .confirmTxt .paymentAmount dt {
      font-weight: bold; }
    .pcPayPurchase .confirmTxt .paymentAmount dd p {
      font-weight: bold; }
    .pcPayPurchase .confirmTxt dl:not(:last-of-type) {
      border-bottom: solid 1px #e5e5e5;
      padding-bottom: .5rem; }
    .pcPayPurchase .confirmTxt dl:not(:first-of-type) {
      padding-top: .5rem; }

.pcPaypurchaseInner {
  border: solid 2px #E5E5E5;
  padding: 0; }
  .pcPaypurchaseInner dd {
    justify-content: flex-end; }
  .pcPaypurchaseInner .paymentMethodInner {
    padding: 2rem 2.5rem; }
    @media screen and (min-width: 600px) {
      .pcPaypurchaseInner .paymentMethodInner {
        padding: 3rem 3.5rem; } }
    .pcPaypurchaseInner .paymentMethodInner dd {
      display: block; }
      @media screen and (min-width: 600px) {
        .pcPaypurchaseInner .paymentMethodInner dd {
          display: -webkit-flex;
          display: -moz-flex;
          display: -ms-flex;
          display: flex; } }

.pcPayPurchase .btnWrap {
  margin-top: 5rem; }
  .pcPayPurchase .btnWrap .btn {
    margin: 0 .5rem; }
  .pcPayPurchase .btnWrap .btnBack {
    background: #747072;
    border: solid 1px #747072; }

/* ショッピングペイ一覧
*************************************************************************/
.shoppingPay .cartBtnArea {
  position: absolute;
  top: -20px;
  right: 10px; }
  @media screen and (min-width: 900px) {
    .shoppingPay .cartBtnArea {
      top: 24px;
      right: 30px; } }
  .shoppingPay .cartBtnArea a {
    padding: .3rem 1rem;
    font-size: 1.4rem; }
    .shoppingPay .cartBtnArea a i {
      margin-right: .3rem; }

.shoppingPayList .category,
.shoppingPayDetail .category {
  font-size: 1.4rem;
  border: solid 1px #E5E5E5;
  text-align: center;
  display: inline-block;
  padding: 0.1rem 0.8rem;
  letter-spacing: .05rem; }
.shoppingPayList .ttl,
.shoppingPayDetail .ttl {
  font-size: 1.8rem;
  font-weight: bold;
  margin: .8rem 0 1rem; }

.shoppingPayList h2 {
  position: relative;
  font-weight: bold;
  font-size: 1.8rem;
  margin: 4.5rem 0 3rem; }
  .shoppingPayList h2:before {
    position: absolute;
    top: -29px;
    color: rgba(248, 149, 171, 0.5);
    font-size: 3.6rem;
    text-transform: uppercase;
    content: 'PRODUCTS LIST';
    z-index: -1; }
.shoppingPayList .shoppingPayListInner {
  background: #fff;
  padding: 2rem 3rem;
  margin: 0 auto 3rem;
  max-width: 585px; }
  @media screen and (min-width: 600px) {
    .shoppingPayList .shoppingPayListInner {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      margin: 0 0 3rem; } }
  .shoppingPayList .shoppingPayListInner .productImg {
    width: 100%;
    display: block;
    margin: 0 auto 1.5rem; }
    @media screen and (min-width: 600px) {
      .shoppingPayList .shoppingPayListInner .productImg {
        max-width: 215px;
        margin: 0 2.5rem 0 0; } }
  .shoppingPayList .shoppingPayListInner .shoppingPayListContents {
    width: 100%;
    margin: 0 auto; }
    @media screen and (min-width: 600px) {
      .shoppingPayList .shoppingPayListInner .shoppingPayListContents {
        margin: 0; } }
    .shoppingPayList .shoppingPayListInner .shoppingPayListContents .btnWrap {
      margin-top: 1.5rem; }
      .shoppingPayList .shoppingPayListInner .shoppingPayListContents .btnWrap .btn {
        text-align: center; }
      .shoppingPayList .shoppingPayListInner .shoppingPayListContents .btnWrap .detailBtn {
        background: #747072;
        border: solid 1px #747072;
        width: 100%;
        max-width: 105px; }
        @media screen and (min-width: 600px) {
          .shoppingPayList .shoppingPayListInner .shoppingPayListContents .btnWrap .detailBtn {
            max-width: 115px; } }
      .shoppingPayList .shoppingPayListInner .shoppingPayListContents .btnWrap .cartBtn {
        font-family: "Font Awesome 5 Free";
        background: #F74F84;
        border: solid 1px #F74F84;
        width: 100%;
        max-width: 155px;
        padding: .8rem 1rem;
        font-size: 1.6rem;
        margin-left: .5rem; }

/* ショッピングペイ詳細
*************************************************************************/
.shoppingPayDetail h2 {
  position: relative;
  font-weight: bold;
  font-size: 1.8rem;
  margin: 4.5rem 0 3rem; }
  .shoppingPayDetail h2:before {
    position: absolute;
    top: -29px;
    color: rgba(248, 149, 171, 0.5);
    font-size: 3rem;
    text-transform: uppercase;
    content: 'PRODUCTS DETAIL';
    z-index: -1; }
    @media screen and (min-width: 600px) {
      .shoppingPayDetail h2:before {
        font-size: 3.6rem; } }

.shoppingPayDetailInner {
  background: #fff;
  padding: 2rem 3rem;
  margin: 0 auto; }
  @media screen and (min-width: 900px) {
    .shoppingPayDetailInner {
      max-width: 1000px;
      margin: 0; } }
  @media screen and (min-width: 900px) {
    .shoppingPayDetailInner .shoppingPayDetailContents {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      align-items: flex-start; } }
  .shoppingPayDetailInner .shoppingPayDetailContents .productImg {
    width: 100%;
    max-width: 410px;
    display: block;
    margin: 0 auto 1.5rem; }
    @media screen and (min-width: 900px) {
      .shoppingPayDetailInner .shoppingPayDetailContents .productImg {
        max-width: 300px;
        margin: 0 2.5rem 0 0; } }
  .shoppingPayDetailInner .shoppingPayDetailContents .capacity {
    margin: 1rem 0 .5rem; }
  .shoppingPayDetailInner .shoppingPayDetailContents .quantityInner {
    margin-top: 1rem; }
  .shoppingPayDetailInner .shoppingPayDetailContents .cartBtn {
    font-family: "Font Awesome 5 Free";
    background: #F74F84;
    border: solid 1px #F74F84;
    padding: .8rem 1.5rem;
    font-size: 1.6rem;
    margin-top: 1rem; }

.shoppingPayDetailInner .ingredients h3 {
  position: relative;
  padding: 0 5.5rem;
  text-align: center;
  margin: 5rem 0 3rem;
  color: #494b4c;
  font-family: 'Volkhov', cursive;
  font-size: 2rem; }
  @media screen and (min-width: 900px) {
    .shoppingPayDetailInner .ingredients h3 {
      margin: 9rem 0 3rem; } }
  .shoppingPayDetailInner .ingredients h3:before {
    width: 23%;
    content: '';
    position: absolute;
    top: 28%;
    left: 0;
    display: inline-block;
    height: 1px;
    background: #aaa; }
    @media screen and (min-width: 900px) {
      .shoppingPayDetailInner .ingredients h3:before {
        width: 36%; } }
  .shoppingPayDetailInner .ingredients h3:after {
    width: 23%;
    content: '';
    position: absolute;
    top: 28%;
    right: 0;
    display: inline-block;
    height: 1px;
    background: #aaa; }
    @media screen and (min-width: 900px) {
      .shoppingPayDetailInner .ingredients h3:after {
        width: 36%; } }
  .shoppingPayDetailInner .ingredients h3 span {
    display: block;
    font-size: 1.5rem; }
.shoppingPayDetailInner .ingredients p {
  font-size: 1.4rem; }

.shoppingPay .quantityInner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 150px; }
  .shoppingPay .quantityInner .selectWrap:before {
    top: 8px; }
  .shoppingPay .quantityInner select {
    width: 70px; }
  .shoppingPay .quantityInner .formControl {
    height: 34px;
    padding: .5rem 1rem; }

/* カート
*************************************************************************/
.cart {
  max-width: 1000px; }
  .cart h2 {
    position: relative;
    font-weight: bold;
    font-size: 1.8rem;
    margin: 4.5rem 0 3rem; }
    .cart h2:before {
      position: absolute;
      top: -29px;
      color: rgba(248, 149, 171, 0.5);
      font-size: 3rem;
      text-transform: uppercase;
      content: 'SHOPPING CART';
      z-index: -1; }
      @media screen and (min-width: 600px) {
        .cart h2:before {
          font-size: 3.6rem; } }
  .cart .btnWrap {
    margin-top: 5rem;
    text-align: center; }
    .cart .btnWrap .btn {
      margin: 0 .3rem;
      background: #F74F84;
      border: solid 1px #F74F84;
      font-size: 1.6rem;
      letter-spacing: .1rem;
      padding: 1rem; }
      @media screen and (min-width: 600px) {
        .cart .btnWrap .btn {
          margin: 0 .5rem;
          font-size: 1.8rem;
          padding: 1rem 3rem; } }
    .cart .btnWrap .btnBack {
      background: #747072;
      border: solid 1px #747072; }

.cartInner {
  background: #fff;
  padding: 1.5rem; }
  @media screen and (min-width: 600px) {
    .cartInner {
      padding: 2rem 3rem; } }
  .cartInner .cartContents {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    align-items: flex-start; }
    .cartInner .cartContents .productImg {
      max-width: 110px;
      margin-right: 1.5rem; }
      @media screen and (min-width: 600px) {
        .cartInner .cartContents .productImg {
          max-width: 170px;
          margin-right: 2rem; } }
    .cartInner .cartContents .ttl {
      margin-bottom: 1rem; }
    .cartInner .cartContents .quantityWrap {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      align-items: center;
      margin-top: 1rem; }
      .cartInner .cartContents .quantityWrap .quantityInner {
        margin-right: .5rem; }
        @media screen and (min-width: 600px) {
          .cartInner .cartContents .quantityWrap .quantityInner {
            margin-right: 1rem; } }
        .cartInner .cartContents .quantityWrap .quantityInner p {
          margin-right: .5rem; }
          @media screen and (min-width: 600px) {
            .cartInner .cartContents .quantityWrap .quantityInner p {
              margin-right: 1rem; } }
      .cartInner .cartContents .quantityWrap .cartBtn {
        letter-spacing: .2rem;
        padding: .5rem 1.5rem; }
  .cartInner .cartContents:not(:first-of-type) {
    padding-top: 2rem; }
  .cartInner .cartContents:not(:last-of-type) {
    border-bottom: solid 1px #e5e5e5;
    padding-bottom: 2rem; }

.cartTotal {
  background: #fff;
  padding: 2rem 3rem;
  max-width: 330px;
  margin: 2rem 0 0 auto; }
  .cartTotal dl {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    align-items: center;
    justify-content: space-between; }
  .cartTotal dl:first-of-type {
    border-bottom: solid 1px #e5e5e5;
    padding-bottom: 1rem; }
  .cartTotal .totalPrice {
    padding-top: 1rem; }
    .cartTotal .totalPrice dt, .cartTotal .totalPrice dd {
      font-weight: bold; }

/* カート購入手続き
*************************************************************************/
.cartPurchase {
  padding-bottom: 6rem;
  max-width: 900px; }
  .cartPurchase .unit {
    margin-left: 1rem; }
  .cartPurchase .confirmTxt {
    border: solid 2px #E5E5E5;
    background: #f9f9f9;
    padding: 2rem 2.5rem;
    max-width: 500px;
    margin: 0 auto 2rem; }
    @media screen and (min-width: 600px) {
      .cartPurchase .confirmTxt {
        padding: 3rem 3.5rem;
        margin: 0 0 2rem; } }
    .cartPurchase .confirmTxt dl {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      justify-content: space-between; }
      .cartPurchase .confirmTxt dl dd {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: flex; }
    .cartPurchase .confirmTxt .totalPrice dt {
      font-weight: bold; }
    .cartPurchase .confirmTxt .totalPrice dd p {
      font-weight: bold; }
    .cartPurchase .confirmTxt dl:not(:last-of-type) {
      border-bottom: solid 1px #e5e5e5;
      padding-bottom: .5rem; }
    .cartPurchase .confirmTxt dl:not(:first-of-type) {
      padding-top: .5rem; }

.cartPurchaseInner {
  border: solid 2px #E5E5E5;
  padding: 0;
  background: #fff; }
  @media screen and (min-width: 600px) {
    .cartPurchaseInner dl {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      justify-content: space-between;
      align-items: center; } }
  .cartPurchaseInner dl dt {
    margin-bottom: .5rem;
    font-weight: bold; }
    @media screen and (min-width: 600px) {
      .cartPurchaseInner dl dt {
        flex-basis: 50%;
        margin-bottom: 0; } }
  .cartPurchaseInner dl dd {
    flex-basis: 45%; }
  .cartPurchaseInner .formItem {
    padding: 2rem 2.5rem; }
    @media screen and (min-width: 600px) {
      .cartPurchaseInner .formItem {
        padding: 3rem 3.5rem; } }
  .cartPurchaseInner .spAmount dd {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    align-items: center; }
    .cartPurchaseInner .spAmount dd .formControl {
      max-width: 160px; }
  .cartPurchaseInner .spAmount dl:not(:last-of-type) {
    padding-bottom: 1rem; }
  .cartPurchaseInner .spAmount dl:not(:first-of-type) {
    padding-top: 1rem; }
  .cartPurchaseInner .formAddress {
    background: #f9f9f9; }
    .cartPurchaseInner .formAddress .selectWrap {
      max-width: 180px; }
    .cartPurchaseInner .formAddress .addressBox {
      margin-top: 1rem;
      height: 100%;
      min-height: 80px; }
  .cartPurchaseInner .paymentMethodInner dd {
    display: block; }
    @media screen and (min-width: 600px) {
      .cartPurchaseInner .paymentMethodInner dd {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: flex; } }
    .cartPurchaseInner .paymentMethodInner dd .selectWrap {
      width: 100%;
      max-width: 180px; }

.cartPurchase .btnWrap {
  margin-top: 5rem;
  text-align: center; }
  .cartPurchase .btnWrap .btn {
    margin: 0 .3rem;
    background: #F74F84;
    border: solid 1px #F74F84;
    font-size: 1.6rem;
    letter-spacing: .1rem;
    padding: 1rem; }
    @media screen and (min-width: 600px) {
      .cartPurchase .btnWrap .btn {
        margin: 0 .5rem;
        font-size: 1.8rem;
        padding: 1rem 3rem; } }
  .cartPurchase .btnWrap .btnBack {
    background: #747072;
    border: solid 1px #747072; }

/* プロフィール
*************************************************************************/
.profileInner {
  border: solid 2px #E5E5E5;
  padding: 0;
  background: #fff; }
  .profileInner dl:nth-child(odd) {
    background: #f9f9f9; }
  .profileInner .telInner .profContents dl,
  .profileInner .shippingAddressInner .profContents dl {
    background: #fff; }
  .profileInner dl {
    padding: 2rem 2.5rem; }
    @media screen and (min-width: 600px) {
      .profileInner dl {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: flex;
        align-items: center; } }
    .profileInner dl dt {
      font-weight: bold;
      margin-bottom: .5rem; }
      @media screen and (min-width: 600px) {
        .profileInner dl dt {
          margin-bottom: 0;
          width: 30%; } }
    @media screen and (min-width: 600px) {
      .profileInner dl dd {
        width: 70%; } }
  .profileInner .profContents dl:last-of-type {
    padding: 1rem 0 0 0; }
  .profileInner .profContents dl:not(:last-of-type) {
    padding: 1rem 0 1rem 0;
    border-bottom: solid 1px #e5e5e5; }

.profile {
  max-width: 900px;
  margin: 0 auto;
  padding-bottom: 5rem; }
  @media screen and (min-width: 900px) {
    .profile {
      margin: 0; } }
  .profile .btnWrap {
    text-align: center;
    margin-top: 4rem; }
    .profile .btnWrap .btn {
      background: #F74F84;
      border: solid 1px #F74F84;
      font-size: 1.8rem;
      letter-spacing: .1rem;
      padding: 1rem 3rem; }
      @media screen and (min-width: 600px) {
        .profile .btnWrap .btn {
          font-size: 1.8rem;
          padding: 1rem 3rem; } }

.profileInner .comment {
  font-size: 1.5rem;
  margin-top: .5rem; }
.profileInner .formBirthday,
.profileInner .formPass {
  max-width: 200px; }
.profileInner .selectWrap {
  max-width: 150px; }
.profileInner .bankTxt {
  font-size: 1.5rem; }
.profileInner .searchBtn {
  border: solid 1px #747072;
  background: #747072;
  font-size: 1.6rem;
  padding: .7rem 1.5rem;
  margin: 1rem 0; }
  .profileInner .searchBtn i {
    margin-right: .5rem; }
.profileInner .bankInner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  align-items: center;
  justify-content: space-between; }
  .profileInner .bankInner .bankCode {
    max-width: 150px;
    margin-right: 1rem; }

.thanksInner {
  background: #fff;
  padding: 2rem 2.5rem;
  max-width: 1000px;
  margin: 0 auto 2rem; }
  @media screen and (min-width: 600px) {
    .thanksInner {
      padding: 3rem 3.5rem;
      margin: 0 0 2rem; } }

/* お知らせ
*************************************************************************/
.newsInner {
  background: #fff;
  padding: 2rem 2.5rem;
  max-width: 1000px;
  margin: 0 auto 2rem; }
  @media screen and (min-width: 600px) {
    .newsInner {
      padding: 3rem 3.5rem;
      margin: 0 0 2rem; } }
  .newsInner dl dt .date {
    font-family: nunito-sans, sans-serif;
    font-weight: 700;
    font-style: normal;
    background: #F74F84;
    border-radius: 20px;
    padding: .2rem 1rem;
    text-align: center;
    color: #fff;
    display: inline-block;
    font-size: 1.4rem;
    letter-spacing: .05rem; }
  .newsInner dl dt .ttl {
    font-size: 1.8rem;
    font-weight: bold;
    margin: 1rem 0; }
  .newsInner dl:not(:first-of-type) {
    padding-top: 2rem; }
  .newsInner dl:not(:last-of-type) {
    border-bottom: solid 1px #e5e5e5;
    padding-bottom: 2rem; }

/* スケジュール
*************************************************************************/
.schedule .selectWrap {
  max-width: 170px; }
.schedule .scheduleInner {
  background: #Fff;
  padding: 2rem 2.5rem;
  max-width: 1000px;
  margin: 2rem auto 0; }
  @media screen and (min-width: 600px) {
    .schedule .scheduleInner {
      padding: 3rem 3.5rem;
      margin: 2rem 0; } }
  .schedule .scheduleInner .scheduleContents .scheduleDetails {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    align-items: center; }
    .schedule .scheduleInner .scheduleContents .scheduleDetails .date {
      font-family: nunito-sans, sans-serif;
      font-weight: 700;
      font-style: normal;
      background: #F74F84;
      border-radius: 20px;
      padding: .2rem 1rem;
      text-align: center;
      color: #fff;
      display: inline-block;
      font-size: 1.4rem;
      letter-spacing: .05rem;
      margin-right: 2rem; }
    .schedule .scheduleInner .scheduleContents .scheduleDetails .area i {
      color: #F74F84;
      margin-right: .5rem;
      font-size: 2rem;
      vertical-align: middle; }
  .schedule .scheduleInner .scheduleContents h2 {
    font-size: 1.8rem;
    font-weight: bold;
    margin: 1rem 0; }
  .schedule .scheduleInner .scheduleContents .btn {
    margin-top: 1.5rem; }
    .schedule .scheduleInner .scheduleContents .btn i {
      margin-right: .5rem; }
  .schedule .scheduleInner .scheduleContents:not(:first-of-type) {
    padding-top: 2.5rem; }
  .schedule .scheduleInner .scheduleContents:not(:last-of-type) {
    border-bottom: solid 1px #e5e5e5;
    padding-bottom: 2.5rem; }

/* ダウンロード
*************************************************************************/
.downloadInner {
  background: #Fff;
  padding: 2rem 2.5rem;
  max-width: 1000px;
  margin: 0 auto; }
  @media screen and (min-width: 600px) {
    .downloadInner {
      padding: 3rem 3.5rem;
      margin: 0; } }
  @media screen and (min-width: 600px) {
    .downloadInner .downloadContents {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: flex;
      align-items: center;
      justify-content: space-between; } }
  @media screen and (min-width: 600px) {
    .downloadInner .downloadContents h2 {
      margin-right: 1rem; } }
  .downloadInner .downloadContents .btn {
    background: #F74F84;
    border: solid 1px #F74F84;
    letter-spacing: .1rem;
    padding: .6rem 2rem;
    width: 100%;
    max-width: 147px;
    text-align: center;
    margin-top: 1rem; }
    @media screen and (min-width: 600px) {
      .downloadInner .downloadContents .btn {
        margin: 0; } }
  .downloadInner .downloadContents:not(:first-of-type) {
    padding-top: 2rem; }
  .downloadInner .downloadContents:not(:last-of-type) {
    border-bottom: solid 1px #e5e5e5;
    padding-bottom: 2rem; }

/* ユニットマップ、直紹介マップ
*************************************************************************/
.unitInner,
.introductionInner {
  background: #Fff;
  padding: 2rem 2.5rem; }
  @media screen and (min-width: 600px) {
    .unitInner,
    .introductionInner {
      padding: 3rem 3.5rem; } }
/* メンバー紹介
*************************************************************************/
.introduction {
  max-width: 900px;
  margin: 0 auto;
  padding-bottom: 5rem; }
  @media screen and (min-width: 900px) {
    .introduction {
      margin: 0; } }

.mailSend {
  margin-bottom: 8rem; }
  .mailSend h2 {
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 1.5rem; }
    .mailSend h2 i {
      color: #003b96;
      margin-right: .5rem;
      font-size: 2rem; }
  .mailSend .mailSendInner {
    background: #fff;
    border: solid 2px #E5E5E5; }
    .mailSend .mailSendInner dl {
      padding: 2rem 2.5rem; }
      @media screen and (min-width: 600px) {
        .mailSend .mailSendInner dl {
          display: -webkit-flex;
          display: -moz-flex;
          display: -ms-flex;
          display: flex;
          align-items: center; } }
      .mailSend .mailSendInner dl dt {
        font-weight: bold;
        margin-bottom: .5rem; }
        @media screen and (min-width: 600px) {
          .mailSend .mailSendInner dl dt {
            margin-bottom: 0;
            width: 30%; } }
      @media screen and (min-width: 600px) {
        .mailSend .mailSendInner dl dd {
          width: 70%; } }
  .mailSend .btnWrap {
    margin-top: 3rem; }
    .mailSend .btnWrap .btn {
      font-size: 1.8rem;
      background: #003b96;
      border: solid 1px #003b96; }

.lineSend h2 {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 2.5rem; }
  .lineSend h2 i {
    color: #02C655;
    margin-right: .5rem;
    font-size: 2.3rem;
    position: relative;
    top: 1px; }
.lineSend a {
  display: block; }
  .lineSend a .lineIco {
    max-width: 180px;
    display: inline-block; }

.FixedItemTbbl{
	width:100%;
}
.FixedItemTbbl td.ViewItemName{
	text-align:left;
	
}
.FixedItemTbbl td.ViewItemPrice{
	text-align:right;
}
.ViewTotalPrice{
	text-align:right;
}
span.require{
	color:red;
	font-size:12px;
}
span.require2{
	color:blue;
	font-size:12px;
}
.DisabledField{
	background:gray;
	color:white;
}
table.CSStbl2{

	margin:5px;
}
table.CSStbl2 th{
	background-color:gray;
	color:white;
	padding:5px;
	text-align:center;
	
}
table.CSStbl2 th.MemberCode{
	width:60px;
}
table.CSStbl2 th.OrderNum{
	width:60px;
	vertical-align:bottom;
}
table.CSStbl2 td.Syokei{
	text-align:right;
	background-color:#e0ffff;
}

table.CSStbl2 th input[type="button"]{
	background-color:blue;
	color:white;
	padding:3px;
}
table.CSStbl2 td input[type="button"]{
	background-color:red;
	color:white;
	padding:3px;
}
table.BuyItem{

	margin:5px;
	width:99%;
}
table.BuyItem th{
	background-color:gray;
	color:white;
	padding:5px;
	text-align:center;
	
}
table.BuyItem th.MemberCode{
	width:50px;
}
table.BuyItem th.OrderNum{
	width:60px;
	vertical-align:bottom;
}
table.BuyItem td.tdDell{
	width:40px;
	text-align:center;
}
table.BuyItem td{
	text-align:right;
	background-color:#ffffff;
}
table.BuyItem td.Syokei{
	text-align:right;
	background-color:#e0ffff;
}
table.BuyItem th input[type="button"]{
	background-color:blue;
	color:white;
	padding:5px;
	border:0px solid #ffffff;
}
table.BuyItem td input[type="button"]{
	background-color:red;
	color:white;
	padding:5px;
	border:0px solid #ffffff;
}

input[type="date"]{
	padding:5px;
	font-size:16px;
	border:1px solid black;
	background-color:white;
	color:black;
}
p.BankInfo{
	margin:5px;
	padding:5px;
	border:1px solid blue;
	background-color:#e0ffff;
}
div.errMsg{
	color:red;
	padding:3px;
}
div.subtitle{
	font-size:18px;
	font-weight:bold;
	text-align:center;
	background-color:green;
	color:white;
	margin:0px;
	padding:5px;
}
.btTrans{
	padding:15px;
	font-size:16px:
	
}
.SiteiItem{
	background-color:green;
	color:white;
}
.SuisyouItem{
	background-color:blue;
	color:white;
}
.MCodeLine{
	width:100%;
	background-color:gray;
	color:white;
	padding:3px;
	text-align:right;
}
.CreditBrandImg{
	width:100px;
}
.clearfix::after {
    content: " ";
    display: block;
    clear: both;
}
/*================================
ボーナス明細
================================*/
div.rewardCompanyInfo{
	border:1px solid gray;
	margin:10px;
	padding-top:10px;
	padding-bottom:10px;
	padding-right:10px;
	padding-left:10px;
	text-align:right;
	background-color:white;
}
div.RewardWrap{
	width:100%;
  overflow-x: auto; /* tableタグのはみ出た要素を隠す */
  white-space: nowrap; /* テキストの折り返しなし */
}

table.Reward{
	background-color:#b0c4de;
	width:101%;
	
	
}

table.Reward th{
	background-color:#b0c4de;
	color:white;
    border-collapse: collapse;
    border:1px solid #333;
	text-align:center;
}
table.Reward th.textVertical{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;	
}

table.Reward td{
	background-color:white;
	color:black;
    border-collapse: collapse;
    border:1px solid #333;
}

table.Reward td.formula{
	texg-align:center;
}
table.Reward td.formula span{
	
}
table.Reward td.Price{
	text-align:center;
	font-size:20px;
}
table.Reward td.totalPrice{
	text-align:center;
	font-size:30px;
}
table.Reward td.Sum{
	background-color:#dcdcdc;
}
.div-equal-box{
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  margin:10px 0px;
}
.div-equal-box div{
  text-align: center;
}
p.RewardTitle{
	font-size:30px;
}