@charset "UTF-8";
@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Bold.woff2") format("woff2"), url("../fonts/NotoSansJP-Bold.woff") format("woff");
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Medium.woff2") format("woff2"), url("../fonts/NotoSansJP-Medium.woff") format("woff");
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Regular.woff2") format("woff2"), url("../fonts/NotoSansJP-Regular.woff") format("woff");
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  src: url("../fonts/NotoSansJP-Light.woff2") format("woff2"), url("../fonts/NotoSansJP-Light.woff") format("woff");
  font-weight: 100;
  font-display: swap;
}

a,
aside,
blockquote,
code,
dd,
div,
dl,
dt,
fieldset,
figcaption,
figure,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
img,
input,
legend,
li,
main,
ol,
option,
p,
pre,
section,
select,
span,
table,
td,
textarea,
th,
tr,
ul {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

section {
  position: relative;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input,
textarea,
button {
  font-family: "Noto Sans JP","ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif;
  border: none;
  border-radius: 0;
  color: inherit;
}

textarea::-webkit-input-placeholder {
  font-family: "Noto Sans JP","ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif !important;
  font-weight: normal !important;
}

textarea::placeholder {
  font-family: "Noto Sans JP","ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif !important;
  font-weight: normal !important;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}

abbr,
acronym {
  border: 0;
  font-variant: normal;
}

ol,
ul {
  list-style: none;
}

caption,
th {
  text-align: left;
}

fieldset,
img {
  border: 0;
}

legend {
  color: #000000;
}

sub {
  vertical-align: text-bottom;
}

.clearfix {
  zoom: 1;
}

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

label {
  cursor: pointer;
}

html {
  font-size: 10px;
}

body {
  height: 100%;
  word-break: break-word;
  font-family: "Noto Sans JP","ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif;
  margin: 0;
  padding: 0;
  letter-spacing: 1px;
  line-height: 1.8;
  font-size: 1.2rem;
  color: #333;
  -moz-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
       text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body.scrollOff {
  overflow: hidden;
  position: fixed;
}

#loading {
  background: rgba(198, 198, 198, 0.7);
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  pointer-events: none;
}

#loading > img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 150px;
  height: 150px;
}

.wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 16px;
}

.mincho {
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  letter-spacing: 1px;
  font-weight: bold;
}

h1 {
  font-size: 2.6rem;
}

.h1-small {
  font-weight: 100;
  font-size: 2rem;
}

h2 {
  font-size: 2rem;
  line-height: 36px;
}

.h2-medium {
  font-size: 2rem;
  line-height: 36px;
}

.h2-small {
  font-size: 1.6rem;
}

.h2-x-small {
  font-size: 1.4rem;
}

h3 {
  font-size: 1.6rem;
}

.h3-small {
  font-size: 1.6rem;
}

h4 {
  font-size: 1.6rem;
}

h5 {
  font-size: 1.4rem;
}

h6 {
  font-size: 1.2rem;
}

p {
  margin-bottom: 8px;
}

a {
  text-decoration: none;
  color: #0066cc;
}

@media (min-width: 768px) {
  a:hover {
    color: #554B98;
  }
}

a.hover:hover,
.hover a:hover {
  opacity: 0.7;
  cursor: pointer;
}

.hover-box:hover {
  opacity: 0.7;
  cursor: pointer;
}

.no-hover {
  pointer-events:none;
  cursor: default;
}

.default-link,
.default-link-gray,
.default-link-black {
  text-decoration: underline;
}

.default-link:hover,
.default-link-gray:hover,
.default-link-black:hover {
  text-decoration: none;
}

.default-link-gray {
  color: #757575;
}

.default-link-gray:hover {
  color: #757575;
}

.default-link-black {
  color: #333;
}

.default-link-black:hover {
  color: #333;
}

.opacity-0 {
  opacity: 0 !important;
}

.opacity-1 {
  opacity: 1 !important;
}

.hide {
  display: none;
}

.pc-only {
  display: none;
}

.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-one {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-4 {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-5 {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.common-overlay {
  display: none;
  width: 100%;
  height: 100%;
  text-align: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  background: rgba(0, 0, 0, 0.05);
}

.common-overlay.none {
  background: none;
}

@media (min-width: 1280px) {
  .wrap {
    padding: 0;
  }
}
@media (min-width: 1024px) {
  .tb-only {
    display: none;
  }
}

@media (min-width: 768px) {
  body {
    font-size: 1.4rem;
  }
  .pc-only {
    display: block;
  }
  .sp-only {
    display: none;
  }
  h1 {
    font-size: 4rem;
  }
  .h1-small {
    font-size: 3.6rem;
  }
  .h1-sp-small {
    font-size: 2.6rem;
  }
  h2 {
    font-size: 2.6rem;
    line-height: 48px;
  }
  .h2-medium {
    font-size: 2.6rem;
    line-height: 48px;
  }
  .h2-small {
    font-size: 2.8rem;
  }
  .h2-x-small {
    font-size: 2.4rem;
  }
  .h2-sp-small {
    font-size: 2.4rem;
  }
  .h2-sp-x-small {
    font-size: 1.6rem;
  }
  h3 {
    font-size: 2rem;
    line-height: 36px;
  }
  .h3-small {
    font-size: 2rem;
  }
  .h3-sp-small {
    font-size: 2rem;
  }
  h4 {
    font-size: 2rem;
  }
  h5 {
    font-size: 1.8rem;
  }
  h6 {
    font-size: 1.6rem;
  }
}

.clear {
  clear: both;
}

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

.text-right {
  text-align: right;
}

.text-left {
  text-align: left;
}

.text-shadow-none {
  text-shadow: none !important;
}
.text-shadow-100 {
  text-shadow: 1px 1px 1px  #000;
}

.text-shadow-50 {
  text-shadow: 0 0 5px #000;
}

.float-right {
  float: right;
}

.float-left {
  float: left;
}

.float-none {
  float: none;
}

.d-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.space-between {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.space-around {
  -webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;
}

.d-block {
  display: block;
}

.d-inline-block {
  display: inline-block;
}

.d-none {
  display: none;
}

.row-reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: row-reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

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

.align-start {
    align-items: flex-start;
}

.align-end {
    align-items: flex-end;
}

.bd-none {
  border: none;
}

.bd-top-none {
  border-top: none;
}

.bd-bottom-none {
  border-bottom: none;
}

.bd-right-none {
  border-right: none;
}

.bd-left-none {
  border-left: none;
}

.bd-top-gray {
  border-top: 1px solid #F5F5F5;
}

.bd-right-gray {
  border-right: 1px solid #F5F5F5;
}

.bd-left-gray {
  border-left: 1px solid #F5F5F5;
}

.bd-bottom-gray {
  border-bottom: 1px solid #F5F5F5;
}

.bd-top-gray-2 {
  border-top: 1px solid #c6c6c6;
}

.bd-bottom-gray-2 {
  border-top: 1px solid #c6c6c6;
}

.bd-width-2 {
  border-width: 2px;
}

.bd-width-3 {
  border-width: 3px;
}

.bd-width-4 {
  border-width: 4px;
}

.bd-width-5 {
  border-width: 5px;
}

.bd-orange {
  border: 1px solid #FF503E;
}

.font-heavy {
  font-weight: 900;
}

.font-bold {
  font-weight: bold;
}

.font-bold.font-small, .font-bold.font-x-small {
  font-weight: 900;
}

.font-bold .font-small,
.font-bold .font-x-small {
  font-weight: 900;
}

.font-normal {
  font-weight: normal;
}

.font-thin {
  font-weight: 100;
}

.font-xxxxxx-large {
  font-size: 3.2rem;
}

.font-xxxxx-large {
  font-size: 3.2rem;
}

.font-xxxx-large {
  font-size: 2.8rem;
}

.font-xxx-large {
  font-size: 2.4rem;
}

.font-xx-large {
  font-size: 2rem;
}

.font-x-large {
  font-size: 1.6rem;
}

.font-large {
  font-size: 1.4rem;
}

.font-default {
  font-size: 1.3rem;
}

.font-small {
  font-size: 1.2rem;
}

.font-small .font-bold {
  font-weight: 900;
}

.font-x-small {
  font-size: 1rem;
}

.font-x-small .font-bold {
  font-weight: 900;
}

.font-64 {
  font-size: 64px;
}
.font-56 {
  font-size: 56px;
}
.font-46 {
  font-size: 46px;
}
.font-40 {
  font-size: 40px;
}
.font-36 {
  font-size: 36px;
}
.font-26 {
  font-size: 26px;
}
.font-20 {
  font-size: 20px;
}
.font-16 {
  font-size: 16px;
}

.font-14 {
  font-size: 14px;
}
.font-12 {
  font-size: 12px;
}

.line-x-large {
  line-height: 2.5;
}

.line-large {
  line-height: 2;
}

.line-medium {
  line-height: 1.6;
}

.line-small {
  line-height: 1.5;
}

.line-x-small {
  line-height: 1.2;
}

.line-xx-small {
  line-height: 1;
}

.line-0 {
  line-height: 0;
}

.vertical-middle {
  vertical-align: middle;
}
.vertical-text-bottom {
  vertical-align: text-bottom;
}
.vertical-text-top {
  vertical-align: text-top;
}

.white-pre-wrap {
  white-space: pre-wrap;
  word-break: break-all;
}

.white-no-wrap {
  white-space: nowrap;
}

.position-relative {
  position: relative;
}

@media (min-width: 768px) {
  .font-xxxxxx-large {
    font-size: 4rem;
  }
  .font-xxxxx-large {
    font-size: 3.6rem;
  }
  .font-xxxx-large {
    font-size: 3.2rem;
  }
  .font-xxx-large {
    font-size: 2.6rem;
  }
  .font-xx-large {
    font-size: 2.4rem;
  }
  .font-x-large {
    font-size: 2rem;
  }
  .font-large {
    font-size: 1.6rem;
  }
  .font-default {
    font-size: 1.4rem;
  }
  .font-small {
    font-size: 1.2rem;
  }
  .font-x-small {
    font-size: 1rem;
  }
  .pc-font-24 {
    font-size: 24px !important;
  }
  .pc-font-20 {
    font-size: 20px !important;
  }
  .pc-font-16 {
    font-size: 16px !important;
  }
}

@media (max-width: 767px) {
  .sp-font-32 {
    font-size: 3.2rem;
  }
  .sp-font-30 {
    font-size: 3rem;
  }
  .sp-font-28 {
    font-size: 2.8rem;
  }
  .sp-font-26 {
    font-size: 2.6rem;
  }
  .sp-font-24 {
    font-size: 2.4rem;
  }
  .sp-font-20 {
    font-size: 2rem;
  }
  .sp-font-18 {
    font-size: 1.8rem;
  }
  .sp-font-16 {
    font-size: 1.6rem;
  }
  .sp-font-14 {
    font-size: 1.4rem;
  }
  .sp-font-12 {
    font-size: 1.2rem;
  }
  .sp-font-11 {
    font-size: 1.1rem;
  }
  .sp-font-10 {
    font-size: 1rem;
  }
  .sp-line-small {
    line-height: 1.5;
  }
  .sp-line-x-small {
    line-height: 1.2;
  }
  .sp-line-xx-small {
    line-height: 1;
  }
}

.font-small.line-small {
  color: #757575;
}

.font-small.line-small.color-black {
  color: #333;
}

.color-black {
  color: #000;
}

.color-inherit {
  color: inherit;
}

.color-white {
  color: #fff;
}

.color-gray-1 {
  color: #333;
}

.color-gray-1-hover {
  color: #333 !important;
}

.color-gray-2 {
  color: #757575;
}

a.color-gray-2:hover {
  color: #000;
}

.color-gray-3 {
  color: #c6c6c6;
}

.color-gray-4 {
  color: #f5f5f5;
}

.color-gray-5 {
  color: #A5A4A4;
}

.color-relux {
  color: #0F0A64;
}

.color-blue-1 {
  color: #554B98;
}

.color-blue-2 {
  color: #4F68C2;
}

.color-blue-3 {
  color: #A6BCE9;
}

.color-blue-4 {
  color: #E1E9F8;
}

.color-link {
  color: #0066CC;
}

.color-red {
  color: #CE0000;
}
.color-red-2 {
  color: #C11C3A;
}

.color-maroon {
  color: #FF503E;
}

.color-orange {
  color: #FF850C;
}

.color-orange-2 {
  color: #FF503E;
}
.color-orange-3 {
  color: #EB5505;
}

.color-yellow {
  color: #FEE661;
}
.color-gold {
  color: #A58D2D;
}
.color-disabled {
  color: #B3B3B3;
}

.bg-black {
  background: #000;
}

.bg-white {
  background: #fff;
}

.bg-gray {
  background: #f5f5f5;
}

.bg-gold {
  background: #AA9A31;
}

.bg-relux {
  background: #0F0A64;
}
.bg-paleblue {
  background: #F3F8FD;
}

.m-auto {
  margin: 0 auto;
}
.m-0 {
  margin: 0px !important;
}

.m-8 {
  margin: 8px !important;
}

.m-16 {
  margin: 16px !important;
}

.m-24 {
  margin: 24px !important;
}

.m-32 {
  margin: 32px !important;
}

.m-40 {
  margin: 40px !important;
}

.m-48 {
  margin: 48px !important;
}

.m-56 {
  margin: 56px !important;
}

.m-64 {
  margin: 64px !important;
}

.m-72 {
  margin: 72px !important;
}

.m-80 {
  margin: 80px !important;
}

.m-88 {
  margin: 88px !important;
}

.m-96 {
  margin: 96px !important;
}

.m-104 {
  margin: 104px !important;
}

.m-112 {
  margin: 112px !important;
}

.m-120 {
  margin: 120px !important;
}

.m-128 {
  margin: 128px !important;
}

.m-136 {
  margin: 136px !important;
}

.m-144 {
  margin: 144px !important;
}

.m-152 {
  margin: 152px !important;
}

.m-160 {
  margin: 160px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mt-4 {
  margin-top: 4px !important;
}

.mt-8 {
  margin-top: 8px !important;
}

.mt-16 {
  margin-top: 16px !important;
}

.mt-24 {
  margin-top: 24px !important;
}

.mt-32 {
  margin-top: 32px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mt-48 {
  margin-top: 48px !important;
}

.mt-56 {
  margin-top: 56px !important;
}

.mt-64 {
  margin-top: 64px !important;
}

.mt-72 {
  margin-top: 72px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mt-88 {
  margin-top: 88px !important;
}

.mt-96 {
  margin-top: 96px !important;
}

.mt-104 {
  margin-top: 104px !important;
}

.mt-112 {
  margin-top: 112px !important;
}

.mt-120 {
  margin-top: 120px !important;
}

.mt-128 {
  margin-top: 128px !important;
}

.mt-136 {
  margin-top: 136px !important;
}

.mt-144 {
  margin-top: 144px !important;
}

.mt-152 {
  margin-top: 152px !important;
}

.mt-160 {
  margin-top: 160px !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.mt-auto {
  margin-top: auto !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.mb-2 {
  margin-bottom: 2px !important;
}

.mb-4 {
  margin-bottom: 4px !important;
}

.mb-8 {
  margin-bottom: 8px !important;
}

.mb-16 {
  margin-bottom: 16px !important;
}

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

.mb-24 {
  margin-bottom: 24px !important;
}

.mb-32 {
  margin-bottom: 32px !important;
}

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

.mb-48 {
  margin-bottom: 48px !important;
}

.mb-56 {
  margin-bottom: 56px !important;
}

.mb-64 {
  margin-bottom: 64px !important;
}

.mb-72 {
  margin-bottom: 72px !important;
}

.mb-80 {
  margin-bottom: 80px !important;
}

.mb-88 {
  margin-bottom: 88px !important;
}

.mb-96 {
  margin-bottom: 96px !important;
}

.mb-104 {
  margin-bottom: 104px !important;
}

.mb-112 {
  margin-bottom: 112px !important;
}

.mb-120 {
  margin-bottom: 120px !important;
}

.mb-128 {
  margin-bottom: 128px !important;
}

.mb-136 {
  margin-bottom: 136px !important;
}

.mb-144 {
  margin-bottom: 144px !important;
}

.mb-152 {
  margin-bottom: 152px !important;
}

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

.ml-0 {
  margin-left: 0px !important;
}

.ml-8 {
  margin-left: 8px !important;
}

.ml-16 {
  margin-left: 16px !important;
}

.ml-24 {
  margin-left: 24px !important;
}

.ml-32 {
  margin-left: 32px !important;
}

.ml-40 {
  margin-left: 40px !important;
}

.ml-48 {
  margin-left: 48px !important;
}

.ml-56 {
  margin-left: 56px !important;
}

.ml-64 {
  margin-left: 64px !important;
}

.ml-72 {
  margin-left: 72px !important;
}

.ml-80 {
  margin-left: 80px !important;
}

.ml-88 {
  margin-left: 88px !important;
}

.ml-96 {
  margin-left: 96px !important;
}

.ml-104 {
  margin-left: 104px !important;
}

.ml-112 {
  margin-left: 112px !important;
}

.ml-120 {
  margin-left: 120px !important;
}

.ml-128 {
  margin-left: 128px !important;
}

.ml-136 {
  margin-left: 136px !important;
}

.ml-144 {
  margin-left: 144px !important;
}

.ml-152 {
  margin-left: 152px !important;
}

.ml-160 {
  margin-left: 160px !important;
}

.mr--10 {
  margin-right: -10px !important;
}
.mr--20 {
  margin-right: -20px !important;
}
.mr--30 {
  margin-right: -30px !important;
}
.mr--40 {
  margin-right: -40px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.mr-8 {
  margin-right: 8px !important;
}

.mr-16 {
  margin-right: 16px !important;
}

.mr-24 {
  margin-right: 24px !important;
}

.mr-32 {
  margin-right: 32px !important;
}

.mr-40 {
  margin-right: 40px !important;
}

.mr-48 {
  margin-right: 48px !important;
}

.mr-56 {
  margin-right: 56px !important;
}

.mr-64 {
  margin-right: 64px !important;
}

.mr-72 {
  margin-right: 72px !important;
}

.mr-80 {
  margin-right: 80px !important;
}

.mr-88 {
  margin-right: 88px !important;
}

.mr-96 {
  margin-right: 96px !important;
}

.mr-104 {
  margin-right: 104px !important;
}

.mr-112 {
  margin-right: 112px !important;
}

.mr-120 {
  margin-right: 120px !important;
}

.mr-128 {
  margin-right: 128px !important;
}

.mr-136 {
  margin-right: 136px !important;
}

.mr-144 {
  margin-right: 144px !important;
}

.mr-152 {
  margin-right: 152px !important;
}

.mr-160 {
  margin-right: 160px !important;
}

.p-0 {
  padding: 0px !important;
}

.p-8 {
  padding: 8px !important;
}

.p-16 {
  padding: 16px !important;
}

.p-24 {
  padding: 24px !important;
}

.p-32 {
  padding: 32px !important;
}

.p-40 {
  padding: 40px !important;
}

.p-48 {
  padding: 48px !important;
}

.p-56 {
  padding: 56px !important;
}

.p-64 {
  padding: 64px !important;
}

.p-72 {
  padding: 72px !important;
}

.p-80 {
  padding: 80px !important;
}

.p-88 {
  padding: 88px !important;
}

.p-96 {
  padding: 96px !important;
}

.p-104 {
  padding: 104px !important;
}

.p-112 {
  padding: 112px !important;
}

.p-120 {
  padding: 120px !important;
}

.p-128 {
  padding: 128px !important;
}

.p-136 {
  padding: 136px !important;
}

.p-144 {
  padding: 144px !important;
}

.p-152 {
  padding: 152px !important;
}

.p-160 {
  padding: 160px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pt-4 {
  padding-top: 4px !important;
}

.pt-8 {
  padding-top: 8px !important;
}

.pt-16 {
  padding-top: 16px !important;
}

.pt-24 {
  padding-top: 24px !important;
}

.pt-32 {
  padding-top: 32px !important;
}

.pt-36 {
  padding-top: 36px !important;
}

.pt-40 {
  padding-top: 40px !important;
}

.pt-48 {
  padding-top: 48px !important;
}

.pt-56 {
  padding-top: 56px !important;
}

.pt-64 {
  padding-top: 64px !important;
}

.pt-72 {
  padding-top: 72px !important;
}

.pt-80 {
  padding-top: 80px !important;
}

.pt-88 {
  padding-top: 88px !important;
}

.pt-96 {
  padding-top: 96px !important;
}

.pt-104 {
  padding-top: 104px !important;
}

.pt-112 {
  padding-top: 112px !important;
}

.pt-120 {
  padding-top: 120px !important;
}

.pt-128 {
  padding-top: 128px !important;
}

.pt-136 {
  padding-top: 136px !important;
}

.pt-144 {
  padding-top: 144px !important;
}

.pt-152 {
  padding-top: 152px !important;
}

.pt-160 {
  padding-top: 160px !important;
}

.pb-4 {
  padding-bottom: 4px;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pb-8 {
  padding-bottom: 8px !important;
}

.pb-16 {
  padding-bottom: 16px !important;
}

.pb-24 {
  padding-bottom: 24px !important;
}

.pb-32 {
  padding-bottom: 32px !important;
}

.pb-40 {
  padding-bottom: 40px !important;
}

.pb-48 {
  padding-bottom: 48px !important;
}

.pb-56 {
  padding-bottom: 56px !important;
}

.pb-64 {
  padding-bottom: 64px !important;
}

.pb-72 {
  padding-bottom: 72px !important;
}

.pb-80 {
  padding-bottom: 80px !important;
}

.pb-88 {
  padding-bottom: 88px !important;
}

.pb-96 {
  padding-bottom: 96px !important;
}

.pb-104 {
  padding-bottom: 104px !important;
}

.pb-112 {
  padding-bottom: 112px !important;
}

.pb-120 {
  padding-bottom: 120px !important;
}

.pb-128 {
  padding-bottom: 128px !important;
}

.pb-136 {
  padding-bottom: 136px !important;
}

.pb-144 {
  padding-bottom: 144px !important;
}

.pb-152 {
  padding-bottom: 152px !important;
}

.pb-160 {
  padding-bottom: 160px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pl-8 {
  padding-left: 8px !important;
}

.pl-16 {
  padding-left: 16px !important;
}

.pl-24 {
  padding-left: 24px !important;
}

.pl-32 {
  padding-left: 32px !important;
}

.pl-40 {
  padding-left: 40px !important;
}

.pl-48 {
  padding-left: 48px !important;
}

.pl-56 {
  padding-left: 56px !important;
}

.pl-64 {
  padding-left: 64px !important;
}

.pl-72 {
  padding-left: 72px !important;
}

.pl-80 {
  padding-left: 80px !important;
}

.pl-88 {
  padding-left: 88px !important;
}

.pl-96 {
  padding-left: 96px !important;
}

.pl-104 {
  padding-left: 104px !important;
}

.pl-112 {
  padding-left: 112px !important;
}

.pl-120 {
  padding-left: 120px !important;
}

.pl-128 {
  padding-left: 128px !important;
}

.pl-136 {
  padding-left: 136px !important;
}

.pl-144 {
  padding-left: 144px !important;
}

.pl-152 {
  padding-left: 152px !important;
}

.pl-160 {
  padding-left: 160px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.pr-8 {
  padding-right: 8px !important;
}

.pr-16 {
  padding-right: 16px !important;
}

.pr-24 {
  padding-right: 24px !important;
}

.pr-32 {
  padding-right: 32px !important;
}

.pr-40 {
  padding-right: 40px !important;
}

.pr-48 {
  padding-right: 48px !important;
}

.pr-56 {
  padding-right: 56px !important;
}

.pr-64 {
  padding-right: 64px !important;
}

.pr-72 {
  padding-right: 72px !important;
}

.pr-80 {
  padding-right: 80px !important;
}

.pr-88 {
  padding-right: 88px !important;
}

.pr-96 {
  padding-right: 96px !important;
}

.pr-104 {
  padding-right: 104px !important;
}

.pr-112 {
  padding-right: 112px !important;
}

.pr-120 {
  padding-right: 120px !important;
}

.pr-128 {
  padding-right: 128px !important;
}

.pr-136 {
  padding-right: 136px !important;
}

.pr-144 {
  padding-right: 144px !important;
}

.pr-152 {
  padding-right: 152px !important;
}

.pr-160 {
  padding-right: 160px !important;
}

@media (min-width: 768px){
  .mt-pc-37 {
    margin-top: 37px !important;
  }
}

@media (max-width: 767px) {
  .m-sp-0 {
    margin: 0px !important;
  }
  .m-sp-8 {
    margin: 8px !important;
  }
  .m-sp-16 {
    margin: 16px !important;
  }
  .m-sp-24 {
    margin: 24px !important;
  }
  .m-sp-32 {
    margin: 32px !important;
  }
  .m-sp-40 {
    margin: 40px !important;
  }
  .m-sp-48 {
    margin: 48px !important;
  }
  .m-sp-56 {
    margin: 56px !important;
  }
  .m-sp-64 {
    margin: 64px !important;
  }
  .m-sp-72 {
    margin: 72px !important;
  }
  .m-sp-80 {
    margin: 80px !important;
  }
  .m-sp-88 {
    margin: 88px !important;
  }
  .m-sp-96 {
    margin: 96px !important;
  }
  .m-sp-104 {
    margin: 104px !important;
  }
  .m-sp-112 {
    margin: 112px !important;
  }
  .m-sp-120 {
    margin: 120px !important;
  }
  .m-sp-128 {
    margin: 128px !important;
  }
  .m-sp-136 {
    margin: 136px !important;
  }
  .m-sp-144 {
    margin: 144px !important;
  }
  .m-sp-152 {
    margin: 152px !important;
  }
  .m-sp-160 {
    margin: 160px !important;
  }
  .mt-sp-0 {
    margin-top: 0px !important;
  }
  .mt-sp-8 {
    margin-top: 8px !important;
  }
  .mt-sp-16 {
    margin-top: 16px !important;
  }
  .mt-sp-24 {
    margin-top: 24px !important;
  }
  .mt-sp-32 {
    margin-top: 32px !important;
  }
  .mt-sp-37 {
    margin-top: 37px !important;
  }
  .mt-sp-40 {
    margin-top: 40px !important;
  }
  .mt-sp-48 {
    margin-top: 48px !important;
  }
  .mt-sp-56 {
    margin-top: 56px !important;
  }
  .mt-sp-64 {
    margin-top: 64px !important;
  }
  .mt-sp-72 {
    margin-top: 72px !important;
  }
  .mt-sp-80 {
    margin-top: 80px !important;
  }
  .mt-sp-88 {
    margin-top: 88px !important;
  }
  .mt-sp-96 {
    margin-top: 96px !important;
  }
  .mt-sp-104 {
    margin-top: 104px !important;
  }
  .mt-sp-112 {
    margin-top: 112px !important;
  }
  .mt-sp-120 {
    margin-top: 120px !important;
  }
  .mt-sp-128 {
    margin-top: 128px !important;
  }
  .mt-sp-136 {
    margin-top: 136px !important;
  }
  .mt-sp-144 {
    margin-top: 144px !important;
  }
  .mt-sp-152 {
    margin-top: 152px !important;
  }
  .mt-sp-160 {
    margin-top: 160px !important;
  }
  .mb-sp-0 {
    margin-bottom: 0px !important;
  }
  .mb-sp-1 {
    margin-bottom: 1px !important;
  }
  .mb-sp-2 {
    margin-bottom: 2px !important;
  }
  .mb-sp-4 {
    margin-bottom: 4px !important;
  }
  .mb-sp-5 {
    margin-bottom: 5px !important;
  }
  .mb-sp-8 {
    margin-bottom: 8px !important;
  }
  .mb-sp-16 {
    margin-bottom: 16px !important;
  }
  .mb-sp-20 {
    margin-bottom: 20px !important;
  }
  .mb-sp-24 {
    margin-bottom: 24px !important;
  }
  .mb-sp-32 {
    margin-bottom: 32px !important;
  }
  .mb-sp-40 {
    margin-bottom: 40px !important;
  }
  .mb-sp-48 {
    margin-bottom: 48px !important;
  }
  .mb-sp-56 {
    margin-bottom: 56px !important;
  }
  .mb-sp-64 {
    margin-bottom: 64px !important;
  }
  .mb-sp-72 {
    margin-bottom: 72px !important;
  }
  .mb-sp-80 {
    margin-bottom: 80px !important;
  }
  .mb-sp-88 {
    margin-bottom: 88px !important;
  }
  .mb-sp-96 {
    margin-bottom: 96px !important;
  }
  .mb-sp-104 {
    margin-bottom: 104px !important;
  }
  .mb-sp-112 {
    margin-bottom: 112px !important;
  }
  .mb-sp-120 {
    margin-bottom: 120px !important;
  }
  .mb-sp-128 {
    margin-bottom: 128px !important;
  }
  .mb-sp-136 {
    margin-bottom: 136px !important;
  }
  .mb-sp-144 {
    margin-bottom: 144px !important;
  }
  .mb-sp-152 {
    margin-bottom: 152px !important;
  }
  .mb-sp-160 {
    margin-bottom: 160px !important;
  }
  .ml-sp-0 {
    margin-left: 0px !important;
  }
  .ml-sp-8 {
    margin-left: 8px !important;
  }
  .ml-sp-16 {
    margin-left: 16px !important;
  }
  .ml-sp-24 {
    margin-left: 24px !important;
  }
  .ml-sp-32 {
    margin-left: 32px !important;
  }
  .ml-sp-40 {
    margin-left: 40px !important;
  }
  .ml-sp-48 {
    margin-left: 48px !important;
  }
  .ml-sp-56 {
    margin-left: 56px !important;
  }
  .ml-sp-64 {
    margin-left: 64px !important;
  }
  .ml-sp-72 {
    margin-left: 72px !important;
  }
  .ml-sp-80 {
    margin-left: 80px !important;
  }
  .ml-sp-88 {
    margin-left: 88px !important;
  }
  .ml-sp-96 {
    margin-left: 96px !important;
  }
  .ml-sp-104 {
    margin-left: 104px !important;
  }
  .ml-sp-112 {
    margin-left: 112px !important;
  }
  .ml-sp-120 {
    margin-left: 120px !important;
  }
  .ml-sp-128 {
    margin-left: 128px !important;
  }
  .ml-sp-136 {
    margin-left: 136px !important;
  }
  .ml-sp-144 {
    margin-left: 144px !important;
  }
  .ml-sp-152 {
    margin-left: 152px !important;
  }
  .ml-sp-160 {
    margin-left: 160px !important;
  }
  .mr-sp-0 {
    margin-right: 0px !important;
  }
  .mr-sp-8 {
    margin-right: 8px !important;
  }
  .mr-sp-16 {
    margin-right: 16px !important;
  }
  .mr-sp-24 {
    margin-right: 24px !important;
  }
  .mr-sp-32 {
    margin-right: 32px !important;
  }
  .mr-sp-40 {
    margin-right: 40px !important;
  }
  .mr-sp-48 {
    margin-right: 48px !important;
  }
  .mr-sp-56 {
    margin-right: 56px !important;
  }
  .mr-sp-64 {
    margin-right: 64px !important;
  }
  .mr-sp-72 {
    margin-right: 72px !important;
  }
  .mr-sp-80 {
    margin-right: 80px !important;
  }
  .mr-sp-88 {
    margin-right: 88px !important;
  }
  .mr-sp-96 {
    margin-right: 96px !important;
  }
  .mr-sp-104 {
    margin-right: 104px !important;
  }
  .mr-sp-112 {
    margin-right: 112px !important;
  }
  .mr-sp-120 {
    margin-right: 120px !important;
  }
  .mr-sp-128 {
    margin-right: 128px !important;
  }
  .mr-sp-136 {
    margin-right: 136px !important;
  }
  .mr-sp-144 {
    margin-right: 144px !important;
  }
  .mr-sp-152 {
    margin-right: 152px !important;
  }
  .mr-sp-160 {
    margin-right: 160px !important;
  }
  .p-sp-0 {
    padding: 0px !important;
  }
  .p-sp-8 {
    padding: 8px !important;
  }
  .p-sp-16 {
    padding: 16px !important;
  }
  .p-sp-24 {
    padding: 24px !important;
  }
  .p-sp-32 {
    padding: 32px !important;
  }
  .p-sp-40 {
    padding: 40px !important;
  }
  .p-sp-48 {
    padding: 48px !important;
  }
  .p-sp-56 {
    padding: 56px !important;
  }
  .p-sp-64 {
    padding: 64px !important;
  }
  .p-sp-72 {
    padding: 72px !important;
  }
  .p-sp-80 {
    padding: 80px !important;
  }
  .p-sp-88 {
    padding: 88px !important;
  }
  .p-sp-96 {
    padding: 96px !important;
  }
  .p-sp-104 {
    padding: 104px !important;
  }
  .p-sp-112 {
    padding: 112px !important;
  }
  .p-sp-120 {
    padding: 120px !important;
  }
  .p-sp-128 {
    padding: 128px !important;
  }
  .p-sp-136 {
    padding: 136px !important;
  }
  .p-sp-144 {
    padding: 144px !important;
  }
  .p-sp-152 {
    padding: 152px !important;
  }
  .p-sp-160 {
    padding: 160px !important;
  }
  .pt-sp-0 {
    padding-top: 0px !important;
  }
  .pt-sp-8 {
    padding-top: 8px !important;
  }
  .pt-sp-16 {
    padding-top: 16px !important;
  }
  .pt-sp-24 {
    padding-top: 24px !important;
  }
  .pt-sp-28 {
    padding-top: 28px !important;
  }
  .pt-sp-32 {
    padding-top: 32px !important;
  }
  .pt-sp-40 {
    padding-top: 40px !important;
  }
  .pt-sp-48 {
    padding-top: 48px !important;
  }
  .pt-sp-56 {
    padding-top: 56px !important;
  }
  .pt-sp-64 {
    padding-top: 64px !important;
  }
  .pt-sp-72 {
    padding-top: 72px !important;
  }
  .pt-sp-80 {
    padding-top: 80px !important;
  }
  .pt-sp-88 {
    padding-top: 88px !important;
  }
  .pt-sp-96 {
    padding-top: 96px !important;
  }
  .pt-sp-104 {
    padding-top: 104px !important;
  }
  .pt-sp-112 {
    padding-top: 112px !important;
  }
  .pt-sp-120 {
    padding-top: 120px !important;
  }
  .pt-sp-128 {
    padding-top: 128px !important;
  }
  .pt-sp-136 {
    padding-top: 136px !important;
  }
  .pt-sp-144 {
    padding-top: 144px !important;
  }
  .pt-sp-152 {
    padding-top: 152px !important;
  }
  .pt-sp-160 {
    padding-top: 160px !important;
  }
  .pb-sp-0 {
    padding-bottom: 0px !important;
  }
  .pb-sp-8 {
    padding-bottom: 8px !important;
  }
  .pb-sp-16 {
    padding-bottom: 16px !important;
  }
  .pb-sp-24 {
    padding-bottom: 24px !important;
  }
  .pb-sp-32 {
    padding-bottom: 32px !important;
  }
  .pb-sp-40 {
    padding-bottom: 40px !important;
  }
  .pb-sp-48 {
    padding-bottom: 48px !important;
  }
  .pb-sp-56 {
    padding-bottom: 56px !important;
  }
  .pb-sp-64 {
    padding-bottom: 64px !important;
  }
  .pb-sp-72 {
    padding-bottom: 72px !important;
  }
  .pb-sp-80 {
    padding-bottom: 80px !important;
  }
  .pb-sp-88 {
    padding-bottom: 88px !important;
  }
  .pb-sp-96 {
    padding-bottom: 96px !important;
  }
  .pb-sp-104 {
    padding-bottom: 104px !important;
  }
  .pb-sp-112 {
    padding-bottom: 112px !important;
  }
  .pb-sp-120 {
    padding-bottom: 120px !important;
  }
  .pb-sp-128 {
    padding-bottom: 128px !important;
  }
  .pb-sp-136 {
    padding-bottom: 136px !important;
  }
  .pb-sp-144 {
    padding-bottom: 144px !important;
  }
  .pb-sp-152 {
    padding-bottom: 152px !important;
  }
  .pb-sp-160 {
    padding-bottom: 160px !important;
  }
  .pl-sp-0 {
    padding-left: 0px !important;
  }
  .pl-sp-8 {
    padding-left: 8px !important;
  }
  .pl-sp-16 {
    padding-left: 16px !important;
  }
  .pl-sp-24 {
    padding-left: 24px !important;
  }
  .pl-sp-32 {
    padding-left: 32px !important;
  }
  .pl-sp-40 {
    padding-left: 40px !important;
  }
  .pl-sp-48 {
    padding-left: 48px !important;
  }
  .pl-sp-56 {
    padding-left: 56px !important;
  }
  .pl-sp-64 {
    padding-left: 64px !important;
  }
  .pl-sp-72 {
    padding-left: 72px !important;
  }
  .pl-sp-80 {
    padding-left: 80px !important;
  }
  .pl-sp-88 {
    padding-left: 88px !important;
  }
  .pl-sp-96 {
    padding-left: 96px !important;
  }
  .pl-sp-104 {
    padding-left: 104px !important;
  }
  .pl-sp-112 {
    padding-left: 112px !important;
  }
  .pl-sp-120 {
    padding-left: 120px !important;
  }
  .pl-sp-128 {
    padding-left: 128px !important;
  }
  .pl-sp-136 {
    padding-left: 136px !important;
  }
  .pl-sp-144 {
    padding-left: 144px !important;
  }
  .pl-sp-152 {
    padding-left: 152px !important;
  }
  .pl-sp-160 {
    padding-left: 160px !important;
  }
  .pr-sp-0 {
    padding-right: 0px !important;
  }
  .pr-sp-8 {
    padding-right: 8px !important;
  }
  .pr-sp-16 {
    padding-right: 16px !important;
  }
  .pr-sp-24 {
    padding-right: 24px !important;
  }
  .pr-sp-32 {
    padding-right: 32px !important;
  }
  .pr-sp-40 {
    padding-right: 40px !important;
  }
  .pr-sp-48 {
    padding-right: 48px !important;
  }
  .pr-sp-56 {
    padding-right: 56px !important;
  }
  .pr-sp-64 {
    padding-right: 64px !important;
  }
  .pr-sp-72 {
    padding-right: 72px !important;
  }
  .pr-sp-80 {
    padding-right: 80px !important;
  }
  .pr-sp-88 {
    padding-right: 88px !important;
  }
  .pr-sp-96 {
    padding-right: 96px !important;
  }
  .pr-sp-104 {
    padding-right: 104px !important;
  }
  .pr-sp-112 {
    padding-right: 112px !important;
  }
  .pr-sp-120 {
    padding-right: 120px !important;
  }
  .pr-sp-128 {
    padding-right: 128px !important;
  }
  .pr-sp-136 {
    padding-right: 136px !important;
  }
  .pr-sp-144 {
    padding-right: 144px !important;
  }
  .pr-sp-152 {
    padding-right: 152px !important;
  }
  .pr-sp-160 {
    padding-right: 160px !important;
  }
}

.lt-0 {
  letter-spacing: 0px !important;
}

.lt-1 {
  letter-spacing: 1px !important;
}

.lt-2 {
  letter-spacing: 2px !important;
}

.lt-3 {
  letter-spacing: 3px !important;
}

.lt-4 {
  letter-spacing: 4px !important;
}

.lt-5 {
  letter-spacing: 5px !important;
}

.lt-6 {
  letter-spacing: 6px !important;
}

.lt-7 {
  letter-spacing: 7px !important;
}

.lt-8 {
  letter-spacing: 8px !important;
}

.lt-9 {
  letter-spacing: 9px !important;
}

.lt-10 {
  letter-spacing: 10px !important;
}

.lt-11 {
  letter-spacing: 11px !important;
}

.lt-12 {
  letter-spacing: 12px !important;
}

.lt-13 {
  letter-spacing: 13px !important;
}

.lt-14 {
  letter-spacing: 14px !important;
}

.lt-15 {
  letter-spacing: 15px !important;
}

.lt-16 {
  letter-spacing: 16px !important;
}

.lt-17 {
  letter-spacing: 17px !important;
}

.lt-18 {
  letter-spacing: 18px !important;
}

.lt-19 {
  letter-spacing: 19px !important;
}

.lt-20 {
  letter-spacing: 20px !important;
}

.text-indent-1 {
  text-indent: -1em;
  padding-left: 1em;
}

.bg-none {
  background: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

.width-400 {
  max-width: 100%;
  width: 400px;
}

.max-wd-100per {
  max-width: 100%;
}

@media (max-width: 767px) {
  .sp-p-0 {
    padding: 0;
  }
  .sp-m-0 {
    margin: 0;
  }
  .sp-d-block {
    display: block;
  }
  .sp-d-inline {
    display: inline !important;
  }
}

.text-deco-none {
  text-decoration: none;
}

.text-deco-underline {
  text-decoration: underline;
}

.text-link-underline {
  text-decoration: underline;
}
.text-link-underline:hover {
  text-decoration: none;
  color: inherit;
}
.text-deco-through {
  text-decoration: line-through;
}

.letter-spacing-0 {
  letter-spacing: 0px;
}

.letter-spacing-05 {
  letter-spacing: 0.5px;
}

.letter-spacing-1 {
  letter-spacing: 1px;
}

.letter-spacing-2 {
  letter-spacing: 2px;
}

.wd-100per {
  width: 100%;
}

@media screen and (max-width: 767px){
  .sp-letter-spacing-0 {
    letter-spacing: 0;
  }
  .sp-letter-spacing-0-5 {
    letter-spacing: 0.5px;
  }
  .sp-wd-100per {
    width: 100%;
  }
}

.global-header {
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
  width: 100%;
  position: absolute;
  height: 50px;
  z-index: 30;
  color: #fff;
}

.global-header a {
  color: #fff;
}

.global-header .hide {
  display: none !important;
}

.global-header .header-inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 16px;
  position: relative;
}

.global-header .fukidashi {
  cursor: pointer;
  margin-bottom: 5px;
}

.global-header .fukidashi:hover {
  opacity: 0.8;
}

.global-header .logo-image {
  padding-top: 16px;
  display: inline-block;
  cursor: pointer;
  vertical-align: top;
  text-decoration: none;
}

.global-header .logo-image img {
  height: 20px;
}

.global-header .logo-image img.fukidashi {
  height: 24px;
  cursor: pointer;
  margin-bottom: 5px;
}

.global-header .logo-image img.fukidashi:hover {
  opacity: 0.8;
}

.global-header .sub {
  position: absolute;
  top: 12px;
  right: 0;
}

.global-header .sub .menu {
  position: absolute;
  top: 0;
  right: 15px;
  display: block;
}

.global-header .sub .menu a {
  display: block;
  font-size: 11px !important;
  color: #fff;
  float: left;
}

.global-header .sub .menu a img {
  width: 40px;
}

.global-header .menu-account,
.global-header .menu-service {
  float: left;
  cursor: pointer;
}

.global-header .menu-account a,
.global-header .menu-service a {
  color: #333;
}

.global-header .menu-service .menu-btn {
  margin-right: 20px;
}

.global-header .menu-account .menu-btn img,
.global-header .menu-service .menu-btn img {
  width: 26px;
  height: 26px;
}

.global-header .menu-btn {
  text-align: center;
  position: relative;
}

.global-header .menu-btn.notice::before {
  top: 4px;
  right: 0;
  border: 1px solid rgba(255, 255, 255, 0.7);
}

@media (max-width: 767px) {
  .global-header .menu-btn.notice::before {
    top: 2px;
  }
}

.global-header .menu-btn span {
  font-size: 1rem;
  margin: 3px 0 0 !important;
  line-height: 1 !important;
  display: none;
}

.global-header .menubox {
  background-color: #fff;
  border: 1px solid #e9e9e9;
  width: 220px;
  clear: both;
  position: absolute;
  top: 42px;
  right: 0;
  z-index: 2;
}

.global-header .menubox ul {
  padding: 10px 0;
}

.global-header .menubox .border {
  border-bottom: 1px solid #e9e9e9;
}

.global-header .menubox .no-padding {
  padding: 0;
}

.global-header .menubox .no-padding a:link {
  padding: 10px 15px;
}

.global-header .menubox ul li a:link {
  display: block;
  padding: 6px 15px;
  background: url("/stcontents/img/common/icon-navigate-right.svg") no-repeat 96% 50%;
  background-size: 16px 16px;
  line-height: 1.5;
  font-size: 1.2rem;
  text-decoration: none;
}

.global-header .menubox ul li a:hover {
  background-color: #ffefb4;
  color: #000;
}

.global-header .menubox-service {
  display: none;
}

.global-header .menubox .name {
  font-size: 1.6rem;
}

.global-header .menubox .id {
  font-size: 1rem;
  display: block;
}

.global-header .menubox .name span {
  font-size: 1.3rem;
}

.global-header .menubox .memberStatusLabel {
  margin-top: 8px;
}

.global-header .menubox .link {
  font-size: 1rem;
  color: #666;
}

.global-header .menu-account .number-badge {
  font-size: 1.3rem;
  color: #fff;
  background: red;
  line-height: 16px !important;
  text-align: center;
  padding: 1px 3px;
  border-radius: 20%;
  -webkit-font-smoothing: auto;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4) !important;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);
          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.7);
}

.global-header .menu-account .menu-btn .number-badge {
  position: absolute;
  top: -6px;
  right: 18px;
}

.global-header .menu-account .menu-btn .number-badge:lang(zh-Hant) {
  position: absolute;
  top: -6px;
  right: 5px;
}

.global-header .menubox-account li {
  position: relative;
}

.global-header .menubox-account li .number-badge {
  position: absolute;
  right: 25px;
  top: 7px;
}

.global-header .menubox-account {
  display: none;
}

.global-header .menubox-account img.fukidashi,
.global-header .menubox-service img.fukidashi {
  width: 12px;
  position: absolute;
  top: -9px;
}

.global-header .menubox-service img.fukidashi {
  right: 56px;
}

.global-header .menubox-account img.fukidashi {
  right: 9px;
}

@media screen and (min-width: 767px) {
  .global-header .gray-mark {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .global-header .gray-mark {
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: fixed;
    background-color: rgba(198, 198, 198, 0.7);
    display: none;
  }
  .global-header .gray-mark.active {
    display: block;
  }
}

.global-header .menu-member {
  margin-top: -13px;
}

.global-header .menu-member .icon-head-member {
  width: 40px;
  height: 40px;
  cursor: pointer;
}

.global-header .menu-member .menubox.menubox-member {
  width: 320px;
  -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.2);
}

@media screen and (min-width: 768px) {
  .global-header .menu-member .menubox.menubox-member {
    overflow: hidden;
    border-radius: 8px;
  }
}

@media screen and (max-width: 767px) {
  .global-header .menu-member .menubox.menubox-member {
    height: 100vh;
    height: 100dvh;
    padding-bottom: 40px;
    position: fixed;
    right: 0;
    top: 0;
    border: none;
    overflow: auto;
  }
}

.global-header .menu-member .menubox.menubox-member img.close {
  width: 40px;
  height: 40px;
  top: 4px;
  right: 8px;
  position: absolute;
  position: fixed;
  z-index: 2;
}

.global-header .menu-member .menubox.menubox-member ul {
  border-bottom: none;
}

.global-header .menu-member .menubox.menubox-member ul li {
  background: none;
  padding: 0;
  margin: 0;
  border-left: none;
  border-right: none;
  border-bottom: none;
  border-top: 2px solid #f5f5f5;
  min-height: 60px;
  position: relative;
}

.global-header .menu-member .menubox.menubox-member ul li a {
  padding: 16px 24px;
}

.global-header .menu-member .menubox.menubox-member ul li a:hover {
  color: #333;
}

.global-header .menu-member .menubox.menubox-member ul li.member-info {
  padding: 16px 24px;
}

.global-header .menu-member .menubox.menubox-member ul li.member-info:hover {
  color: #333;
  background-color: #fff;
}

.global-header .menu-member .menubox.menubox-member ul li:first-of-type {
  pointer-events: none;
}

@media screen and (min-width: 768px) {
  .global-header .menu-member .menubox.menubox-member ul li.member-info,
  .global-header .menu-member .menubox.menubox-member ul li a {
    padding: 16px 24px;
  }
  .global-header .menu-member .menubox.menubox-member ul li.member-info {
    padding-top: 24px;
    border-top: none;
  }
}

.global-header .menu-member .menubox.menubox-member ul li:last-of-type {
  padding-bottom: 8px;
  border-bottom: none;
}

.global-header .menu-member .menubox.menubox-member ul li:first-of-type {
  padding-top: 56px;
  height: auto;
  pointer-events: auto;
}

@media screen and (min-width: 768px) {
  .global-header .menu-member .menubox.menubox-member ul li:first-of-type {
    display: none;
  }
}

.global-header .menu-member .menubox.menubox-member ul li a:link {
  background: none;
  font-size: 1.6rem;
}

.global-header .menu-member .menubox.menubox-member ul li:hover {
  background-color: #F5F5F5;
}

.global-header .menu-member .menubox.menubox-member ul li .title {
  margin-bottom: 24px;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  line-height: 1.5;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.global-header .menu-member .menubox.menubox-member ul li .title .memberStatusLabel {
  margin-top: 0;
  margin-right: 8px;
  height: 2.4rem;
}

.global-header .menu-member .menubox.menubox-member ul li .contents {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.global-header .menu-member .menubox.menubox-member ul li .contents .content1 {
  margin-right: 8px;
}

.global-header .menu-member .menubox.menubox-member ul li .contents .content1, .global-header .menu-member .menubox.menubox-member ul li .contents .content2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.global-header .menu-member .menubox.menubox-member ul li .contents .content1 p, .global-header .menu-member .menubox.menubox-member ul li .contents .content2 p {
  position: relative;
  margin: 0;
}

.global-header .menu-member .menubox.menubox-member ul li .contents .content1 p:first-child, .global-header .menu-member .menubox.menubox-member ul li .contents .content2 p:first-child {
  border-right: 1px solid #c6c6c6;
  padding-right: 4px;
}

.global-header .menu-member .menubox.menubox-member ul li .contents .content1 p:nth-of-type(2), .global-header .menu-member .menubox.menubox-member ul li .contents .content2 p:nth-of-type(2) {
  color: #757575;
  font-size: 1.2rem;
  font-weight: 900;
  padding-left: 4px;
}

@media screen and (max-width: 768px) {
  .global-header .menu-member .menubox.menubox-member ul li .contents .content1 p:nth-of-type(2), .global-header .menu-member .menubox.menubox-member ul li .contents .content2 p:nth-of-type(2) {
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 768px) {
  .global-header .menu-member .menubox.menubox-member ul li .contents .content1 p, .global-header .menu-member .menubox.menubox-member ul li .contents .content2 p {
    line-height: 1.8rem;
  }
}

.global-header .menu-member .menubox.menubox-member ul .banner-pontapass {
  border-top: 4px solid #f5f5f5;
}

.global-header .menu-member .menubox.menubox-member ul .banner-pontapass img {
  width: 100%;
}

.global-header .menu-member .menubox.menubox-member ul .mypage,
.global-header .menu-member .menubox.menubox-member ul .setting {
  border-top: 4px solid #f5f5f5;
}

.global-header .sub a:link {
  text-decoration: none;
}

.global-header.static .sub a:link {
  text-shadow: none;
}

.global-header .before-menu {
  display: block;
  overflow: hidden;
  padding: 4px 0;
  padding-top: 3px;
}

.global-header .before-menu > li {
  display: inline;
  float: left;
  margin-left: 24px;
  line-height: 24px;
  font-size: 1.2rem;
}

.global-header .before-menu > li:first-child {
  margin-left: 0;
}

.global-header .before-menu .concept,
.global-header .before-menu .service {
  display: none;
}

.global-header .before-menu > li a:link {
  text-shadow: 1px 1px 1px #000;
}

.global-header .before-menu > li a:hover {
  text-shadow: none;
  color: #554B98;
}

.global-header .menu-member .menubox .title {
  color: #333;
}

.global-header .menu-member .menubox ul li a {
  text-shadow: none;
  color: #333;
}

.global-header.static .before-menu > li a {
  text-shadow: none;
}

.global-header.static .before-menu > li a:hover {
  color: #554B98;
}

@media screen and (max-width: 767px) {
  .global-header.menu-open {
    z-index: 41;
  }
  .global-header .logo-image img {
    height: 16px;
  }
  .global-header .menu-member {
    margin-top: -2px;
  }
  .global-header .menu-member .menubox.menubox-member ul .coupon {
    border-top: 2px solid #f5f5f5;
  }
  .global-header .menu-member .icon-head-member {
    width: 28px;
    height: 28px;
  }
  .global-header .logo {
    display: inline-block;
  }
  .global-header .btn-menu img {
    width: 28px;
    position: absolute;
    top: 10px;
    right: 16px;
    z-index: 1;
  }
  .global-header .before-menu {
    margin-right: 68px;
    padding: 0;
  }
  .global-header .sub-menu {
    background: #fff;
    width: 320px;
    height: 100%;
    position: fixed;
    top: 0;
    right: -100%;
    left: auto;
    z-index: 2;
  }
  .global-header .sub-menu.on {
    right: 0;
  }
  .global-header .sub-menu.on .before-menu {
    margin-right: 0;
  }
  .global-header .sub-menu .btn-menu-close {
    position: absolute;
    top: 4px;
    right: 8px;
  }
  .global-header .sub-menu .btn-menu-close img {
    width: 40px;
    height: 40px;
    top: 0;
    right: 0;
    position: absolute;
  }
  .global-header .sub-menu .before-menu {
    padding-top: 56px;
  }
  .global-header .sub-menu .before-menu > li {
    display: block;
    float: none;
    margin-left: 0;
    border-bottom: 2px solid #f5f5f5;
    line-height: normal;
    font-size: 1.6rem;
  }
  .global-header .sub-menu .before-menu > li:first-child {
    border-top: 2px solid #f5f5f5;
  }
  .global-header .sub-menu .before-menu > li a {
    display: block;
    padding: 20px 56px 20px 24px;
    text-shadow: none !important;
    color: #333;
  }
  .login-header .before-menu {
    margin-right: 16px;
  }
}

@media screen and (max-width: 360px) {
  .global-header .before-menu > li {
    margin-left: 16px;
    font-size: 1.1rem;
  }
}

.global-header.static {
  background: none;
  position: relative;
  border-bottom: 2px solid #F5F5F5;
  color: #000;
}

.global-header.static a {
  color: #000;
}

.global-header.static .before-menu li a:hover {
  border-color: #333;
}

@media (min-width: 768px) {
  .global-header {
    height: 60px;
  }
  .global-header .header-inner {
    margin: 0 auto;
  }
  .global-header .logo-image img {
    height: 26px;
  }
  .global-header .menu a img {
    display: none;
  }
  .global-header h1 {
    padding-top: 17px;
    margin-left: 0;
  }
  .global-header h1 img.logo,
  .global-header img.logo {
    height: 27px;
  }
  .global-header .logo-image {
    padding-top: 16px;
  }
  .global-header .before-menu {
    padding: 10px 0 11px;
    margin-top: 14px;
  }
  .global-header .before-menu > li {
    font-size: 1.4rem;
    line-height: 14px;
    margin-left: 32px;
    vertical-align: middle;
  }
  .global-header .before-menu .concept,
  .global-header .before-menu .service {
    display: inline;
  }
  .global-header .sub {
    position: absolute;
    top: 0;
    right: 16px;
  }
  .global-header .menubox {
    position: absolute;
    top: 69px;
  }
  .global-header .menu-btn span {
    display: block;
  }
  .global-header .menubox-service img.fukidashi {
    right: 103px;
  }
  .global-header .menubox-account img.fukidashi {
    right: 23px;
  }
  .global-header .menu-account,
  .global-header .menu-service {
    display: block;
    margin-top: -9px;
    margin-right: 20px;
  }
  .global-header .menu-service {
    width: 60px;
  }
  .global-header .menu-account {
    width: 34px;
  }
  .global-header .menu-account .menu-btn img,
  .global-header .menu-service .menu-btn img {
    width: 34px;
    height: 34px;
  }
}

@media screen and (min-width: 1280px) {
  .global-header .menubox {
    right: 0;
  }
  .global-header .menu-account,
  .global-header .menu-service {
    margin-right: 0;
  }
  .global-header .header-inner {
    padding: 0;
  }
  .global-header .sub {
    right: 0;
  }
}

.bread-crumbs {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  padding: 72px 0 8px;
  font-size: 1.0rem;
  color: #757575;
  overflow: hidden;
}

.bread-crumbs li:last-child {
  position: relative;
  bottom: 0.5px;
}

.bread-crumbs a {
  color: #0f0a64;
}

.bread-crumbs a:after {
  content: url(/stcontents/img/common/icon-arrow-breadcrumbs.svg);
  display: inline-block;
  vertical-align: middle;
  margin: 0 8px;
}

.bread-crumbs a:hover {
  text-decoration: underline;
  color: #554B98;
}

.bread-crumbs h1 {
  font-size: 1.4rem;
  font-weight: normal;
  display: inline;
}

.title-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  color: #333;
}

.title-box h1 {
  text-align: left;
}

.title-box .count {
  margin-bottom: 4px;
  font-weight: 100;
  font-size: 1.4rem;
}

@media (min-width: 768px) {
  .title-box .count {
    font-size: 2rem;
  }
}

.modal-overlay {
  background: rgba(198, 198, 198, 0.7);
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 51;
}

.global-header.modal-on,
main.modal-on,
.logo-image.modal-on {
  -webkit-filter: blur(4px);
          filter: blur(4px);
}

.global-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  z-index: 52;
}

.global-modal.register {
  background: #fff;
}

.global-modal.au-connect {
  overflow-y: auto;
}

.modal-small {
  background: #fff;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  z-index: 52;
}

.common-modal {
  width: 90%;
  max-width: 767px;
  height: 100%;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 52;
}

.common-modal .modal-container {
  width: 100%;
  height: 90%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 45px auto;
  padding: 40px 40px;
  border-radius: 8px;
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.common-modal .modal-container.scroll-on {
  padding-right: 24px;
}

.common-modal .modal-container.scroll-on .content-body {
  overflow-y: auto;
  padding-right: 16px;
}

.common-modal .modal-container.scroll-on .content-body::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.common-modal .modal-container.scroll-on .content-body::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.common-modal .modal-container.scroll-on .content-body::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.common-modal .modal-container .content-body {
  margin-top: 8px;
  height: 93%;
  overflow: hidden;
  padding: 0;
}

.common-modal .modal-container .content-scroll {
  height: 100%;
  overflow-y: auto;
  padding: 0 20px 0 0;
}

.common-modal .modal-container .content-scroll::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.common-modal .modal-container .content-scroll::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.common-modal .modal-container .content-scroll::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.common-modal .modal-title-blue {
  background: #0F0A64;
  padding: 40px 40px;
  color: #fff;
}

.common-modal .note-wrap {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid #C6C6C6;
}

.common-modal .modal-close-footer.js-modal-close {
  background: none;
  width: auto;
  height: auto;
  position: relative;
  top: 0;
  right: 0;
  margin-top: 24px;
}

.common-modal .modal-close-footer.js-modal-close span, .common-modal .modal-close-footer.js-modal-close a {
  width: 100%;
}

.common-title-modal .modal-container {
  padding: 0;
}

.common-title-modal .modal-container.scroll-on {
  padding: 0 0 36px;
}

.common-title-modal .modal-container .content-body {
  height: calc(100% - 126px);
  margin-top: 0;
  padding: 24px 40px 36px;
}

.common-title-modal .modal-container.scroll-on .content-body {
  margin-right: 24px;
  padding-right: 16px;
}

.common-btn-modal .modal-container {
  padding-right: 24px;
}

.common-btn-modal .modal-container .content-scroll {
  height: calc(100% - 96px);
  margin-bottom: 16px;
}

@media (min-width: 768px) {
  .modal-small {
    background: transparent;
  }
  .global-modal.register {
    background: transparent;
  }
}

.modal-container {
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
  position: relative;
  background: #fff;
  width: 100%;
  overflow: hidden;
  border-radius: 8px;
}

@media (max-width: 767px) {
  .modal-small .modal-container,
  .common-modal .modal-container {
    position: fixed;
    height: 100%;
    width: 100%;
    overflow: auto;
    border-radius: 0;
    margin: 0;
  }
  .common-modal {
    width: 100%;
  }
  .common-modal .modal-container {
    max-height: 100%;
    padding: 50px 16px 64px;
  }
  .common-modal .modal-container.scroll-on .content-body {
    padding: 20px 8px 20px 16px;
    margin-right: 8px;
  }
  .common-modal .modal-title-blue {
    padding: 40px 16px 24px;
  }
  .common-title-modal .modal-container {
    padding: 0;
  }
  .common-title-modal .modal-container.scroll-on {
    padding: 0 0 36px;
  }
  .common-title-modal .js-modal-close {
    background-image: url(/stcontents/img/common/icon-close-2-white.svg);
    width: 30px;
    height: 30px;
  }
}

.modal-container .contents {
  padding: 30px 80px 40px;
}

.modal-container .refine-contents {
  padding: 10px;
}

.modal-container .header {
  border-bottom: 1px solid #dedede;
  padding-top: 10px;
}

.modal-container .header p {
  font-size: 1.6rem;
  text-align: center;
  margin: 10px 0;
}

.modal-container .header img.close {
  position: absolute;
  top: 10px;
  right: 13px;
  cursor: pointer;
}

.modal_refine .header {
  padding: 10px 0;
}

.modal_refine .header img.close {
  position: absolute;
  top: 14px !important;
  right: 13px;
  cursor: pointer;
}

.modal-container .center-contents {
  margin: 0 auto;
  width: 249px;
  padding-top: 25px;
  display: block;
}

.modal-container .center-contents-connect {
  margin: 0 auto;
  width: 270px;
  padding-top: 25px;
  display: block;
}

.modal-container .center-contents-connect-eng {
  width: 100%;
}

.modal-container .contents .signup-welcome {
  display: none;
}

.modal-container .contents .sns-btn-area {
  margin-bottom: 24px;
}

.modal-container .contents .sns-btn-area a.btn {
  display: block;
  margin-bottom: 12px;
}

.modal-container .contents .mail-area {
  margin-bottom: 16px;
}

.modal-container .contents .mail-area input[type="text"] {
  padding: 6px 5%;
  width: 90%;
  font-size: 1.2rem;
  border: 1px solid #ccc;
  display: inline-block;
  line-height: 25px;
  height: 25px;
  margin-bottom: 8px;
  -webkit-appearance: none;
  border-radius: 2px;
  -webkit-box-sizing: initial;
          box-sizing: initial;
}

.modal-container .contents .reservationMailBox {
  margin-bottom: 10px;
  display: table;
  width: 100%;
}

.modal-container .contents .reservationMailBox input[type="text"] {
  height: 35px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: none;
  padding: 0 2%;
  border-radius: 2px;
  -webkit-appearance: none;
  display: table-cell;
  width: 100%;
}

.modal-container .contents .reservationMailBox input[type="text"]:focus {
  outline: none;
}

.modal-container .contents .reservationMailBox a.btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-appearance: none;
  display: table-cell;
  padding: 9px 0;
}

.modal-container .contents .signup-special {
  display: none;
}

.modal-container .contents .small-mail-area {
  display: inline-block;
  margin-left: 32px;
  vertical-align: top;
  width: 300px;
}

.modal-container .contents .mail-area .title {
  text-align: center;
  font-size: 1.1rem;
  margin-bottom: 5px;
  margin-top: 15px;
}

.modal-container .contents .small-mail-area label {
  display: block;
  font-size: 1.1rem;
  margin-bottom: 3px;
}

.modal-container .contents .small-mail-area input {
  width: 90%;
  -webkit-appearance: none;
  border: 1px solid #ccc;
  border-radius: 2px;
  padding: 6px 5%;
  -webkit-box-sizing: initial;
          box-sizing: initial;
  margin-bottom: 10px;
  line-height: 25px;
  height: 25px;
}

.modal-container .contents .small-mail-area .recover {
  font-size: 1.1rem;
  margin-top: 15px;
  text-align: center;
}

.loginBtn-fix {
  margin-top: 12px;
}

.loginBtn-fix-sp {
  margin-top: 16px;
}

.login_error {
  font-size: 1.1rem;
  color: #ff0000;
}

.login_error-sp {
  font-size: 1.1rem;
  color: #ff0000;
}

.modal-forgetPassword {
  font-size: 1.4rem;
  text-align: center;
  margin-top: 16px;
  margin-bottom: 0;
}

.modal-forgetPassword a,
.modal-forgetPassword-sp a {
  color: #757575;
  text-align: center;
  font-size: 1.4rem;
  text-decoration: underline;
}

.modal-forgetPassword a:hover,
.modal-forgetPassword-sp a:hover {
  color: #000;
}

.modal-forgetPassword-sp {
  font-size: 1.1rem;
  text-align: right;
  margin: 16px 0 24px;
}

.modal-small .modal-container .contents .sns-btn-area {
  display: inline-block;
  vertical-align: top;
}

.modal-split {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 1.2rem;
  color: #757575;
  text-align: center;
  margin-bottom: 16px;
}

.modal-split::after,
.modal-split::before {
  margin-top: 7px;
  content: "";
  width: 40%;
  height: 1px;
  background-color: #cccccc;
  display: block;
}

.modal-split::after {
  margin-left: 8px;
}

.modal-split::before {
  margin-right: 8px;
}

.modal-split-pc {
  display: none;
}

.modal-title {
  margin-bottom: 24px;
  text-align: center;
  font-weight: 600;
  font-size: 2.4rem;
  padding-top: 2px;
}

@media screen and (max-width: 767px){
  .modal-title.font-sp-heavy {
    font-weight: 900;
  }
}

.btn-modal {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 308px;
  height: 48px;
  line-height: 48px;
  text-align: center;
  border-radius: 4px;
  vertical-align: middle;
  font-size: 1.4rem;
  padding: 0 4px;
  cursor: pointer;
}

.btn-modal .title {
  margin-bottom: 16px;
  text-align: center;
}

.btn-modal-sp {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  height: 44px;
  text-align: center;
  border-radius: 4px;
  vertical-align: middle;
  line-height: 44px !important;
  font-size: 1.4rem;
  margin-bottom: 16px;
}

.btn-modal-login-sp {
  line-height: 40px;
}

.js-modal-close {
  background: url(/stcontents/img/common/icon-close-2.svg) no-repeat 0 0;
  background-size: contain;
  width: 48px;
  height: 48px;
  position: fixed;
  top: 32px;
  right: 32px;
  display: block;
  cursor: pointer;
}

.modal-loginsignin {
  height: 100%;
  overflow-y: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.modal-loginsignin::-webkit-scrollbar {
  display: none;
}

.modal-loginsignin .text-link {
  display: block;
  margin: 16px 0;
  text-align: right;
}

.modal-loginsignin .text-link a {
  font-size: 1.4rem;
  color: #0f0a64;
}

.modal-loginsignin .text-link:after {
  width: 8px;
}

.modal-loginsignin .text-link:hover {
  color: #554B98;
}

.register .wrap-loginsignin {
  padding: 0;
}

.modal-logInWithMailArea {
  width: 100%;
  margin-bottom: 0;
}

.modal-logInWithMailArea-sp {
  width: 100%;
  margin-top: 8px;
}

.modal-loginInput {
  position: relative;
  margin-bottom: 16px;
}

.modal-loginInput.error {
  margin-bottom: 4px;
}

.modal-loginInput.error .loginInput {
  border-color: #ce0000;
}

.modal-loginInput.error + .error-text {
  display: block;
  font-size: 12px;
  margin-bottom: 16px;
  color: #ce0000;
}

.modal-loginInput.password > input[type=password] {
  padding-right: 41px;
}

.modal-loginInput .icon-eye {
  position: absolute;
  right: 9px;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 32px;
  height: 32px;
  background-size: 20px;
  background-position: center;
  right: 0;
}

.modal-loginInput-sp {
  position: relative;
}

.loginError-logInWithMailArea-sp input[type=password],
.loginError-logInWithMailArea-sp input[type=text] {
  background: #FFF !important;
}

.modal-loginInput input[type=password],
.modal-loginInput input[type=text],
.modal-loginInput-sp input[type=password],
.modal-loginInput-sp input[type=text] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 1.4rem;
  color: #333333;
  padding: 0 12px 0 48px;
}

.loginInput-sp::-webkit-input-placeholder,
.loginInput::-webkit-input-placeholder {
  font-size: 1.4rem;
  color: #C6C6C6;
}

.loginInput-sp:-ms-input-placeholder,
.loginInput:-ms-input-placeholder {
  font-size: 1.4rem;
  color: #C6C6C6;
}

.loginInput-sp::-ms-input-placeholder,
.loginInput::-ms-input-placeholder {
  font-size: 1.4rem;
  color: #C6C6C6;
}

.loginInput-sp::placeholder,
.loginInput::placeholder {
  font-size: 1.4rem;
  color: #C6C6C6;
}

.modal-loginInput input,
.modal-loginInput-sp input {
  font-size: 1.4rem;
  color: #cccccc;
  width: 100% !important;
  border: 1px solid #cccccc;
  border-radius: 4px;
}

.global-modal input,
.loginError-logInWithElseArea-sp input,
.loginError-logInWithMailArea-sp input,
.loginError-resetPassword-sp input,
.modal-small input {
  -webkit-appearance: none;
}

.loginInput {
  height: 48px;
  width: 308px;
}

.loginInput-sp {
  height: 48px;
}

.modal-logInWithMailArea input,
.modal-logInWithMailArea-sp input {
  border-radius: 4px;
}

.wrap-loginsignin .title {
  font-size: 1.6rem;
  margin-bottom: 16px;
  text-align: center;
  font-weight: bold;
  color: #000;
}

.sns-login {
  margin: 0 auto;
  display: block;
  width: 100%;
}

.sns-login > div a {
  width: 100%;
  height: 48px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #fff;
  position: relative;
  color: #333;
  font-weight: bold;
  font-size: 1.4rem !important;
}

.sns-login > div a:hover {
  opacity: 0.7;
}

.sns-login > div a img {
  position: absolute;
  left: 16px;
}

.register .sns-login > div a img {
  height: 24px;
}

.InputIconPosition,
.IconPosition {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 12px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.InputEyePosition {
  position: absolute;
  width: 24px;
  height: 24px;
  right: 12px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.modal-logInWithMailArea,
.modal-logInWithElseArea {
  width: 100%;
}

.icon-modal-close {
  background: url(/stcontents/img/common/icon-close-2.svg) no-repeat 0 0;
  background-size: contain;
  width: 40px;
  height: 40px;
  position: absolute;
  top: -48px;
  right: -48px;
  display: block;
  cursor: pointer;
}
.modal-small.facebook-modal {
  height: 690px;
}
.modal-small.facebook-modal-wrap {
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.modal-small.facebook-modal-wrap .contents {
  cursor: default;
}
.modal-small.facebook-modal-wrap .contents a {
  pointer-events: auto;
}
.facebook-modal-wrap .modal-container {
  width: 800px;
  height: 676px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
    box-shadow: none;
}
.facebook-modal .modal-container {
  overflow: visible;
}
.facebook-modal .wrap-loginsignin,
.facebook-modal .js-modal-close {
  display: none !important;
}


@media (max-width: 1280px) {
  .js-modal-close {
    width: 40px;
    height: 40px;
    top: 16px;
    right: 14px;
    z-index: 53;
  }
}

@media (max-width: 767px) {
  .modal-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 40px;
    background: #fff;
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
    z-index: 10;
  }
  .modal-header-ttl {
    display: flex;
    justify-content: center;
    height: 100%;
    font-weight: bold;
    margin-bottom: 0;
  }
  .modal-header-ttl span,
  .common-modal-title span {
    display: flex;
    align-items: center;
  }
  .js-modal-close {
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    position: fixed;
    top: 10px;
    width: 30px;
    height: 30px;
  }
  .js-modal-close.float {
    background-image: url(/stcontents/img/common/icon-close-3.svg);
    width: 40px;
    height: 40px;
    top: 8px;
    right: 12px;
  }
  .modal-header .js-modal-close,
  .modal-header .js-modal-close.float {
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    position: fixed;
    top: 6px;
    right: 14px;
    width: 30px;
    height: 30px;
  }
  .wrap-loginsignin,
  .register .wrap-loginsignin {
    display: -ms-grid;
    display: grid;
    -webkit-box-pack: unset;
    -webkit-justify-content: unset;
        -ms-flex-pack: unset;
            justify-content: unset;
    margin: 0 auto;
    width: 100%;
  }
  .modal-logInWithElseArea,
  .register .modal-logInWithElseArea {
    margin: 28px auto 0;
  }
  .sns-login,
  .register .sns-login {
    width: auto;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .sns-login > div:last-child,
  .register .sns-login > div:last-child {
    margin-right: 0;
  }
  .wrap-loginsignin .title {
    margin-bottom: 24px;
  }
  .modal-logInWithMailArea {
    width: 100%;
    margin: 0 auto;
  }
  .modal-split-pc {
    width: 308px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    font-size: 1.2rem;
    color: #757575;
    text-align: center;
    margin: 16px auto;
  }
  .modal-split-signin-pc {
    margin: 24px auto 16px;
  }
  .modal-split-pc::after,
  .modal-split-pc::before {
    margin-top: 7px;
    content: "";
    width: 40%;
    height: 1px;
    background-color: #cccccc;
  }
  .modal-split-pc::after {
    margin-left: 8px;
  }
  .modal-split-pc::before {
    margin-right: 8px;
  }
  .modal-loginsignin .pontaBoost__banner {
    margin-top: 0 !important;
  }
  .auid-info p {
    font-weight: 900;
  }
  .modal-loginInput input[type=password],
  .modal-loginInput input[type=text],
  .modal-loginInput-sp input[type=password],
  .modal-loginInput-sp input[type=text] {
    padding-left: 32px;
  }
  .InputIconPosition,
  .IconPosition {
    width: 16px;
    height: 16px;
    left: 8px;
  }
  .InputEyePosition {
    width: 16px;
    height: 16px;
    right: 8px;
  }
  .area-partition {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .area-partition:before,
  .area-partition:after {
    border-top: 1px solid #C6C6C6;
    content: "";
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    color: #757575;
  }
  .area-partition:before {
    margin-right: 8px;
  }
  .area-partition:after {
    margin-left: 8px;
  }
  .facebook-modal-wrap .modal-container {
    width: 100%;
    height: 100%;
  }
  .modal-small.facebook-modal-wrap .contents {
    cursor: default;
    overflow-y: auto;
    height: 100%;
    padding-bottom: 20px;
  }
  .icon-modal-close {
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    position: fixed;
    width: 30px;
    height: 30px;
    top: 16px;
    right: 10px;
  }
  .icon-modal-close.float {
    background-image: url(/stcontents/img/common/icon-close-3.svg);
    width: 35px;
    height: 35px;
    top: 12px;
    right: 7px;
  }
}

.modal-container .contents ul > li {
  margin-bottom: 4px;
  font-size: 1.2rem;
}

.modal-container .refine-contents ul > li {
  margin: 0 2px 8px 0;
  font-size: 1.2rem;
}

.modal-container .refine-contents .area ul > li {
  margin: 0 8px 8px 0;
  font-size: 1.2rem;
}

.modal-small .modal-container .contents .pontaBoost__banner {
  margin: 0 auto;
}

.modal-small .modal-container .contents .pontaBoost__banner img {
  width: 100%;
}

@media (max-width: 500px) {
  .modal-container .contents {
    padding: 48px 24px 48px;
  }
  .common-modal .modal-container {
    padding: 50px 16px 64px;
  }
  .common-modal .modal-container .common-modal-title {
    display: flex;
    justify-content: center;
    height: 100%;
    font-size: 1.4rem;
    margin-bottom: 12px;
  }
  .common-modal .modal-container .content-body {
    height: auto;
  }
  .common-modal .modal-container.scroll-on {
    padding-right: 0;
  }
  .common-modal .modal-container.scroll-on .content-body {
    padding-right: 16px;
  }
  .common-modal .modal-container .content-scroll {
    height: calc(100% - 200px);
    padding: 0 8px 0 0;
  }
  .modal-small .modal-container .contents .sns-btn-area {
    display: block;
    width: 100%;
  }
  .modal-container .contents .small-mail-area {
    display: block;
    margin-left: 0;
    width: 100%;
  }
  .modal-small .modal-container .contents .pontaBoost__banner {
    height: auto;
    width: 100%;
  }
}

@media (max-width: 360px) {
  .modal-container .contents {
    padding: 24px 4px 48px;
  }
}

.sns-btn-area-sp {
  margin-bottom: 56px;
}

.refine-contents {
  overflow: scroll;
  height: 100vh;
}

.refine-contents .height_block {
  height: 150px;
}

.refine-contents ul li {
  display: inline-block;
  border: 1px solid #d6d6d6;
  padding: 8px;
  border-radius: 5px;
  vertical-align: middle;
}

.refine-contents .grade ul .museum {
  padding: 8px 8px 10px;
}

.refine-contents .grade ul .casual {
  padding: 7px 8px 10px;
}

.refine-contents ul li img.museum {
  width: 64px;
}

.refine-contents ul li img.star {
  width: 15px;
}

.refine-contents input {
  border: 1px solid #d6d6d6;
}

.refine-contents select {
  border: 1px solid #d6d6d6;
  background: #fff;
  height: 36px;
}

.refine-contents .price {
  padding: 0 10px;
}

.refine-contents h2,
.refine-contents p {
  margin-bottom: 9px;
  font-weight: bold;
}

.refine-contents .con {
  margin-bottom: 30px;
}

.refine-btn {
  position: fixed;
  bottom: 0;
  background: #fff;
  -webkit-box-shadow: 0 2px 9px 0 rgba(141, 137, 137, 0.5);
          box-shadow: 0 2px 9px 0 rgba(141, 137, 137, 0.5);
  width: 100%;
}

.refine-btn ul li {
  display: inline-block;
  background-color: #fff;
  color: #fff;
  width: 28%;
  height: 44px;
  text-align: center;
  line-height: 44px;
  color: #0f0a64;
  margin: 10px 0 10px 10px;
  border: solid 1px #0f0a64;
  border-radius: 2px;
}

.refine-btn ul li:first-child {
  background: #0f0a64;
  color: #fff;
  width: 60%;
  height: 44px;
  text-align: center;
  line-height: 44px;
  margin: 10px 0 10px 10px;
}

#color-list .js_active {
  background-color: #0f0a64;
  border: 1px solid #0f0a64;
  color: #fff;
}

#color-list .js_disabled {
  background-color: #FFF;
  border: 1px solid #F5F5F5;
  color: #CCC;
}

@media (min-width: 768px) {
  .global-modal {
    width: 600px;
    height: 560px;
  }
  .modal-small {
    width: 720px;
    height: 560px;
  }
  .loginsignin-modal {
    width: 800px;
    height: 690px;
  }
  .loginsignin-modal .btn-modal {
    line-height: 48px;
    padding: 0 4px;
    font-size: 1.6rem;
  }
  .loginsignin-modal .modal-logInWithMailArea .btn-modal {
    height: 48px;
  }
  .loginsignin-modal .modal-container .contents {
    padding: 40px 56px;
  }
  .register.loginsignin-modal {
    height: 676px;
  }
  .modal-container .contents .signup-welcome {
    display: block;
    text-align: center;
  }
  .modal-container .contents .signup-welcome .title {
    font-size: 1.7rem;
    margin-bottom: 16px;
  }
  .modal-container .contents .signup-welcome .txt {
    font-size: 1.4rem;
    line-height: 1.8;
    margin-bottom: 32px;
    color: #757575;
  }
  .modal-container .contents .wrap {
    margin-bottom: 20px;
    display: table;
    width: 540px;
  }
  .modal-container .contents .wrap .sns-btn-area {
    margin-bottom: 20px;
    text-align: center;
    display: table-cell;
    width: 250px;
    border-right: 1px solid #ccc;
    padding-right: 20px;
    vertical-align: top;
  }
  .modal-container .contents .wrap .mail-area {
    margin-bottom: 20px;
    display: table-cell;
    width: 250px;
    padding-left: 20px;
    vertical-align: top;
  }
  .modal-container .contents .mail-area .title {
    text-align: center;
    font-size: 1.3rem;
    padding: 12px 0;
    margin: 0 0 5px;
  }
  .modal-container .contents .signup-special {
    margin: 24px 0;
    display: block;
  }
  .modal-container .contents .signup-special .title {
    font-size: 1.4rem;
    margin-bottom: 10px;
  }
  .modal-container .contents .signup-special .note {
    font-size: 1.1rem;
    margin-bottom: 10px;
  }
  .wrap-loginsignin {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: row;
        -ms-flex-flow: row;
            flex-flow: row;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .modal-logInWithElseArea {
    position: relative;
    padding-left: 24px;
    margin-left: 24px;
    border-top: none;
  }
  .modal-logInWithElseArea:after {
    border-left: 1px solid #C6C6C6;
    width: 1px;
    height: 240px;
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    display: block;
  }
  .area-partition {
    display: none;
  }
}

.attention {
  font-size: 1.2rem;
  color: #757575;
}

.attention a {
  text-decoration: underline;
  color: #757575;
}

.modal-loginsignin .attention {
  margin-top: 32px;
  text-align: center;
}

.auid-info p, .auid-info ul > li {
  margin-bottom: 0 !important;
}

@media (max-width: 500px) {
  .loginsignin-modal .modal-container .contents {
    padding: 10px 16px 16px 16px;
  }
  .loginsignin-modal .modal-title {
    font-size: 1.4rem;
  }
}

.global-modal.modal-resend-email {
  background-color: #fff;
}

.modal-resend-email button,
.modal-resend-email input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  outline: none;
  background-color: transparent;
}

.modal-resend-email__form {
  margin-bottom: 8px;
}

input.modal-resend-email__text {
  height: 40px;
  width: 100%;
  padding: 0 10px;
  border: 1px solid #ddd;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.modal-resend-email button.btn {
  display: block;
  text-align: center;
  font-size: 1.4rem;
}

.modal-resend-email button.btn-inline {
  height: 38px;
  border: 1px solid #0f0a64;
}

.modal-resend-email button.btn-relux {
  height: 44px;
  background-color: #0f0a64;
}

.modal-resend-email__footer {
  padding: 16px;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-top: 1px solid #dedede;
}

@media (min-width: 768px) {
  .global-modal.modal-resend-email {
    background-color: transparent;
    width: 360px;
  }
  .modal-resend-email__footer {
    padding: 0;
    margin-top: 32px;
    position: static;
    border-top: none;
  }
}

/* ----------------------------------------------------------------------
  .modal-float
---------------------------------------------------------------------- */
.global-modal.modal-float {
  width: 100%;
  height: 100%;
  background-position: 0 0;
  background-repeat: repeat;
  background-image: url("/stcontents/img/common/popup_bg_b.png");
}

.global-modal.modal-float .modal-container {
  width: calc(100% - 48px);
  max-width: 360px;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 10px rgba(200, 200, 200, 0.4);
          box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 10px rgba(200, 200, 200, 0.4);
}

.global-modal.modal-float .modal-container .header {
  background-color: #f0f0f0;
}

.modal-float-button {
  margin-top: 24px;
}

.modal-float-button__item + .modal-float-button__item {
  margin-top: 8px;
}

.modal-float-button__item .btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 38px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.modal-float-button__item a.btn-inline {
  color: #0f0a64;
}

.modal__text,
.modal__text--center {
  font-size: 1.6rem;
  color: #333;
}

.modal__text__marginbottom {
  margin-bottom: 24px;
}

.modal__text--center {
  text-align: center;
}

.modal__annotation {
  margin-top: 24px;
  font-size: 1.1rem;
  letter-spacing: 1.2px;
  color: #333;
}

.modal-share-reservation .contents {
  height: 100vh;
}

.modal-share-reservation-shareicon {
  text-align: center;
}

.modal-share-reservation-shareicon img {
  width: 104px;
  height: auto;
  margin-top: 20px;
  margin-bottom: 40px;
}

.modal-share-reservation-text {
  font-size: 1.4rem;
  font-weight: bold;
  color: #0F0A64;
  margin-bottom: 24px;
  line-height: 24px;
}

.modal-share-reservation-snstext {
  font-size: 1.3rem;
  font-weight: bold;
  color: #0F0A64;
}

.modal-share-reservation-attention {
  font-size: 1.2rem;
  line-height: 20px;
}

.modal-share-reservation-sharesns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 auto 32px;
}

.modal-share-reservation-snsicon img {
  width: 56px;
  height: 56px;
  border-radius: 28px;
  margin-left: 8px;
}

.btn-modal-share-copy {
  width: 104px;
  border-radius: 0 4px 4px 0 !important;
}

.reservation-modal-url-input {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: calc(100vw - 154px);
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #ccc;
  padding: 0 8px;
}

.reservation-modal-url-inputtext {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 1.2rem;
  line-height: 34px;
  overflow: hidden;
  white-space: nowrap;
}

.modal-share-reservation-pc {
  width: 380px;
}

.reservation-modal-url-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 24px;
}

.modal-share-reservation .contents-pc {
  height: auto;
}

.modal-share-reservation-shareicon-pc img {
  margin-top: 4px;
  margin-bottom: 22px;
}

.modal-share-reservation-text-pc {
  margin-bottom: 16px;
}

.reservation-modal-url-container-pc {
  margin-bottom: 16px;
}

.modal-share-reservation-sharesns-pc {
  margin: 0 auto 16px;
}

.reservation-modal-url-input-pc {
  width: 206px;
}

.modal-share-reservation .modal-container-pc {
  width: 360px;
}

.global-modal.smartpassBenefits__modal {
  bottom: auto;
  height: 96%;
  overflow-y: auto;
  top: 2%;
  width: calc(100% - 32px);
}

.global-modal.smartpassBenefits__modal ~ .modal-overlay {
  background-color: rgba(0, 0, 0, 0.67);
}

.global-modal.smartpassBenefits__modal .modal-container {
  margin: 0 auto;
}

.global-modal.smartpassBenefits__modal .modal-container .header {
  background: #ec671f;
  padding: 24px 16px;
}

.global-modal.smartpassBenefits__modal .modal-container .header p {
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 27px;
  margin: 0;
  text-align: left;
}

.global-modal.smartpassBenefits__modal .modal-container .header .caption {
  font-size: 1.2rem;
  font-weight: normal;
  line-height: 18px;
  margin: 16px 0 0;
}

.global-modal.smartpassBenefits__modal .modal-container .header img.close {
  height: 14px;
  right: 10px;
  top: 10px;
  width: 14px;
}

.global-modal.smartpassBenefits__modal .modal-container .contents {
  padding: 24px 16px;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsChecklist ul > li {
  background: url("/stcontents/img/common/relux-icon_icon-check-smps.svg") no-repeat;
  background-size: 28px 28px;
  font-size: 1.2rem;
  min-height: 24px;
  line-height: 18px;
  margin: 0 0 24px;
  padding: 0 0 0 40px;
  vertical-align: bottom;
  width: 87%;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsChecklist ul > li:last-of-type {
  margin: 0 0 32px;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsNotice {
  background: #efefef;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 18px;
  margin: 0 0 8px;
  padding: 16px;
  width: 90%;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsNotice dl > dt {
  margin: 0 0 8px;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsNotice dl > dd {
  display: list-item;
  font-weight: normal;
  line-height: 1.8;
  list-style: disc;
  margin: 0 0 0 14px;
  width: 96%;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsLink {
  color: #0f0a64;
  display: inline-block;
  font-size: 1.4rem;
  line-height: 1.5;
  text-decoration: none;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .benefitsLink img {
  height: 21px;
  margin: 0 0 0 3px;
  vertical-align: -6px;
  width: 21px;
}

.global-modal.smartpassBenefits__modal .modal-container .benefitsLinkGroup {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 16px 0 0;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .close_btn {
  display: block;
  margin: 24px 0 0;
  text-align: center;
}

.global-modal.smartpassBenefits__modal .modal-container .contents .close_btn a {
  border: solid 1px #0f0a64;
  border-radius: 4px;
  color: #0f0a64;
  display: block;
  font-size: 1.6rem;
  height: 44px;
  line-height: 2.5;
}

@media (min-width: 768px) {
  .global-modal.smartpassBenefits__modal {
    bottom: 0;
    height: 592px;
    top: 0;
    max-width: 100%;
    width: 960px;
  }
  .global-modal.smartpassBenefits__modal ~ .modal-overlay {
    background-color: transparent;
  }
  .global-modal.smartpassBenefits__modal .modal-container {
    -webkit-box-shadow: none;
            box-shadow: none;
    margin: 0;
  }
  .global-modal.smartpassBenefits__modal .modal-container .header {
    padding: 40px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .header p {
    font-size: 2.4rem;
    line-height: 24px;
    margin: 0;
  }
  .global-modal.smartpassBenefits__modal .modal-container .header .caption {
    font-size: 1.4rem;
    line-height: 21px;
    margin: 16px 0 0;
  }
  .global-modal.smartpassBenefits__modal .modal-container .header img.close {
    height: 22px;
    right: 20px;
    top: 20px;
    width: 22px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents {
    padding: 40px 40px 24px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .scrollWrap {
    height: 340px;
    overflow-y: scroll;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .scrollWrap::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .scrollWrap::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
            box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .benefitsChecklist ul > li {
    background-size: 28px 28px;
    font-size: 1.4rem;
    min-height: 24px;
    line-height: 21px;
    margin: 0 0 24px;
    padding: 0 0 0 50px;
    max-width: 100%;
    width: 800px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .benefitsChecklist ul > li:last-of-type {
    margin: 0 0 40px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .benefitsNotice {
    font-size: 1.2rem;
    line-height: 18px;
    margin: 0 0 8px;
    padding: 24px;
    max-width: 100%;
    width: 804px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .benefitsNotice dl > dd {
    line-height: 1.8;
    margin: 0 0 0 18px;
    max-width: 100%;
    width: 800px;
  }
  .global-modal.smartpassBenefits__modal .modal-container .contents .close_btn {
    display: none;
  }
}

.global-footer {
  background-color: #303233;
  color: #fff;
  clear: both;
}

.google-code {
  background-color: #303233;
}

.global-footer .footer-inner {
  max-width: 1080px;
  margin: 0 auto;
}

.global-footer .title {
  padding: 16px 16px;
  border-bottom: 1px solid #000;
}

.global-footer .nav {
  display: none;
}

.global-footer .nav li a {
  background: url(/stcontents/img/common/icon-footer-arrow-right.svg) no-repeat right 15px top 50% #F5F5F5;
  background-size: 6px;
  text-decoration: none;
  color: #333;
  padding: 16px 24px;
  display: block;
  border-bottom: 1px solid #333;
}

.global-footer .info {
  text-align: center;
  padding: 30px 10px;
}

.global-footer .info a.logo img {
  width: 124px;
  height: 40px;
}

.global-footer .info a.logo img.logo-kddi {
  width: 82px;
}

.global-footer .info a.logo img.logo-loco-partners {
  width: 160px;
}

.global-footer .info .nav-info {
  margin: 20px 0 15px;
}

.global-footer .info .logo-info {
  display: flex;
  justify-content: center;
  align-items: center;
}

.global-footer .info .logo-info li {
  display: inline-flex;
}

.global-footer .info .logo-info li:first-child {
  margin-right: 40px;
}

.global-footer .info .logo-info li:last-child {
  align-items: center;
  margin-left: 40px;
}

.global-footer .info .nav-info li {
  display: inline-block;
  margin: 0 5px;
}

.global-footer .info .nav-info li a {
  color: #ccc;
  font-size: 1rem;
  text-decoration: none;
}

.global-footer .info .nav-social {
  margin: 10px 0 20px;
}

.global-footer .info .nav-social li {
  display: inline;
  margin: 0 5px;
}

.global-footer .info .nav-social li a {
  color: #fff;
  font-size: 1.4rem;
  text-decoration: none;
}

.global-footer .info .nav-social li img {
  height: 24px;
  vertical-align: middle;
}

.global-footer small {
  font-size: 1.1rem;
  color: #ccc;
}

@media (min-width: 768px) {
  .global-footer .footer-inner {
    padding: 40px 20px 0;
  }
  .global-footer .col-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    border-bottom: 1px solid #393c3e;
    width: 100%;
    padding: 0 60px 30px;
    margin: 0 auto 10px;
  }
  .global-footer .col {
    display: table-cell;
    width: 26%;
    vertical-align: top;
  }
  .global-footer .inbound {
    display: block;
    width: auto;
  }
  .global-footer .inbound li {
    display: block;
    width: auto;
    text-align: left;
    margin-bottom: 20px;
    text-align: center;
    cursor: pointer;
  }
  .global-footer .title {
    padding: 0;
    margin-bottom: 15px;
    border-bottom: none;
    background: none;
    background-size: auto;
    text-align: left;
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 20px;
  }
  .global-footer .nav {
    display: block;
  }
  .global-footer .nav li {
    margin-bottom: 10px;
    white-space: nowrap;
  }
  .global-footer .nav li a {
    font-size: 1.4rem;
    margin-bottom: 12px;
    background: none;
    background-size: auto;
  }
  .global-footer .inbound li a,
  .global-footer .nav li a {
    text-decoration: none;
    color: #ccc;
    background-color: inherit;
    padding: 0;
    border-bottom: none;
  }
  .global-footer .nav li a:hover,
  .global-footer .nav-info li a:hover {
    text-decoration: underline !important;
  }
  .global-footer .inbound li a {
    padding: 12px 10px;
    width: 160px;
    background-color: #494e50;
    border-bottom: 1px solid #222;
    border-right: 1px solid #222;
    border-radius: 1px;
  }
  .global-footer .inbound .displayCurrency a {
    padding: 12px 10px;
    width: 160px;
    background-color: #494e50;
    border-bottom: 1px solid #222;
    border-right: 1px solid #222;
    border-radius: 1px;
    letter-spacing: 2px;
  }
}

@media (min-width: 768px) and (max-width: 800px) {
  .global-footer .col {
    width: 29%;
  }
}

@media (max-width: 767px) {
  .global-footer .info .logo-info-sp li {
    margin-top: 16px;
  }
  .global-footer .title {
    background: url("/stcontents/img/common/icon-footer-menu.svg") no-repeat right 15px top 50%;
  }
  .global-footer .title.active {
    background: #555 url("/stcontents/img/common/icon-footer-menu-top.svg") no-repeat right 15px top 50%;
  }
}

.lineLoading {
  color: #fff !important;
  background-color: #00bb00;
  border-color: #00bb00;
  text-decoration: none !important;
  margin-bottom: 10px;
}

.lineProfileBtn {
  color: #fff !important;
  background-color: #00bb00;
  border-color: #00bb00;
  text-decoration: none !important;
  margin-bottom: 10px;
}

.lineLoadingExpo {
  text-align: center;
}

.lineProfileBtnExpo {
  text-decoration: underline;
  background-color: #fff;
}

.lineUnderline {
  padding-bottom: 3px;
}

.memberStatusLabel {
  font-family: Calibre,Helvetica Neue,Helvetica,Arial,sans-serif !important;
  border-radius: 2px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #fff !important;
  display: inline-block;
  font-size: 1rem;
  line-height: 1.6rem;
  min-height: 1.6rem;
  min-width: 70px;
  padding: 4px;
  text-align: center;
  text-decoration: none !important;
}

.memberStatusColor--green {
  background-color: #61803a;
}

.memberStatusColor--greenTxt {
  color: #61803a;
}

.memberStatusLabel.memberStatusColor--green {
  background: -webkit-linear-gradient(276deg, #81A754 48%, #688C3B 50%);
  background: linear-gradient(174deg, #81A754 48%, #688C3B 50%);
}

.memberStatusColor--gold {
  background-color: #a08a42;
}

.memberStatusColor--goldTxt {
  color: #a08a42;
}

.memberStatusLabel.memberStatusColor--gold {
  background: -webkit-linear-gradient(315deg, #b59f58 0%, #b59f58 66%, #a08a42 66%, #a08a42 100%);
  background: linear-gradient(135deg, #b59f58 0%, #b59f58 66%, #a08a42 66%, #a08a42 100%);
}

.memberStatusColor--platinum {
  background-color: #667a81;
}

.memberStatusColor--platinumTxt {
  color: #667a81;
}

.memberStatusLabel.memberStatusColor--platinum {
  background: -webkit-linear-gradient(315deg, #799098 0%, #799098 66%, #667a81 66%, #667a81 100%);
  background: linear-gradient(135deg, #799098 0%, #799098 66%, #667a81 66%, #667a81 100%);
}

.memberStatusColor--diamond {
  background-color: #07061f;
}

.memberStatusColor--diamondTxt {
  color: #07061f;
}

.memberStatusLabel.memberStatusColor--diamond {
  background: -webkit-linear-gradient(315deg, #333062 0%, #333062 66%, #07061f 66%, #07061f 100%);
  background: linear-gradient(135deg, #333062 0%, #333062 66%, #07061f 66%, #07061f 100%);
}

.btn {
  display: inline-block;
  padding: 8px 12px;
  margin-bottom: 0;
  font-size: 1.4rem;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  border-radius: 2px;
  -webkit-appearance: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.btn:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

.btn:focus,
.btn:hover {
  color: #333;
}

.btn.active,
.btn:active {
  background-image: none;
  outline: 0;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 0.65;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-default {
  height: 48px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 10px;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #0F0A64;
  border-radius: 4px;
  line-height: 1.8;
  font-weight: bold;
  font-size: 1.6rem;
  color: #0F0A64;
  cursor: pointer;
  outline: none;
}

.btn-default:hover {
  border-color: #554B98;
  color: #554B98;
}

.btn-default .badge {
  color: #fff;
  background-color: #fff;
}

.btn-gray {
  border-color: #c6c6c6;
}

.btn-gray:hover {
  border-color: #554B98;
}

.btn-relux {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 48px;
  padding: 0 10px;
  background-color: #0f0a64;
  border: 1px solid #0f0a64;
  text-decoration: none;
  border-radius: 4px;
  font-weight: bold;
  font-size: 1.6rem;
  color: #fff;
  cursor: pointer;
  outline: none;
}

.btn-small {
  height: 40px;
  font-size: 1.4rem;
}

.btn-x-small {
  height: 40px;
  font-size: 1.4rem;
}

.btn-xx-small {
  height: 32px;
  font-size: 1.4rem;
  font-weight: 500;
}

.btn-wide {
  width: 100%;
}

.btn-to-top {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: 40px;
  padding: 0 10px;
  background-color: #0f0a64;
  border: 1px solid #0f0a64;
  text-decoration: none;
  border-radius: 4px;
  font-weight: bold;
  font-size: 1.4rem;
  color: #fff;
  cursor: pointer;
}

.btn-to-top:hover {
  text-decoration: none;
  background-color: #554B98;
  border-color: #554B98;
  color: #fff;
}

.btn-relux-app {
  color: #000;
  background-color: #fff;
  color: #0f0a64 !important;
  border: solid 1px #0f0a64;
  text-decoration: none;
  border-radius: 4px;
}

.btn-relux.active,
.btn-relux:active,
.btn-relux:hover,
.open .dropdown-toggle.btn-relux {
  text-decoration: none;
  background-color: #554B98;
  border-color: #554B98;
  color: #fff;
}

.btn-relux.active,
.btn-relux:active,
.open .dropdown-toggle.btn-relux {
  background-image: none;
}

.btn-disabled {
  opacity: .2;
  cursor: default;
  pointer-events: none;
}

.btn-disabled-gray {
  background-color: #F5F5F5;
  border-color: #f5f5f5;
  color: #C6C6C6;
  cursor: default;
  pointer-events: none;
}

.btn-invalid {
  background-color: #C6C6C6 !important;
  border-color: #C6C6C6 !important;
  color: #fff !important;
  cursor: default;
  pointer-events: none;
}

.btn-relux .badge {
  color: #428bca;
  background-color: #fff;
}

.btn-large-blue {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 66px;
  line-height: 66px;
  display: inline-block;
  font-size: 1.8rem;
  background-color: #0f0a64;
  color: #fff !important;
  border-color: #0f0a64;
  text-decoration: none !important;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  border-radius: 4px !important;
  -webkit-appearance: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.btn-large-blue:active,
.btn-large-blue:focus,
.btn-large-blue:hover {
  text-decoration: none !important;
  background-color: #554B98;
  border-color: #554B98;
}

.btn-middle-blue {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 44px;
  line-height: 44px;
  display: inline-block;
  font-size: 1.6rem;
  background-color: #0f0a64;
  color: #fff !important;
  border-color: #0f0a64;
  text-decoration: none !important;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  border-radius: 4px !important;
  -webkit-appearance: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.btn-middle-blue:active,
.btn-middle-blue:focus,
.btn-middle-blue:hover {
  text-decoration: none !important;
  background-color: #554B98;
  border-color: #554B98;
}

.btn-small-blue {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 36px;
  line-height: 36px;
  display: inline-block;
  font-size: 1.2rem;
  background-color: #0f0a64;
  color: #fff !important;
  border-color: #0f0a64;
  text-decoration: none !important;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  border-radius: 4px !important;
  -webkit-appearance: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.btn-small-blue:active,
.btn-small-blue:focus,
.btn-small-blue:hover {
  text-decoration: none !important;
  background-color: #554B98;
  border-color: #554B98;
}

.btn-small-white {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 36px;
  line-height: 34px;
  display: inline-block;
  font-size: 1.2rem;
  background-color: #fff;
  color: #0f0a64 !important;
  border-color: #0F0A64;
  text-decoration: none !important;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: solid 1px #0f0a64;
  border-radius: 4px !important;
  -webkit-appearance: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.btn-border {
  background-color: #fff !important;
  color: #0f0a64 !important;
  border: 1px solid #0f0a64 !important;
  text-decoration: none !important;
}

.btn-inline {
  color: #0f0a64;
  border: 1px solid #0f0a64;
  text-decoration: none !important;
}

.btn-inline.active,
.btn-inline:active,
.btn-inline:focus,
.btn-inline:hover,
.open .dropdown-toggle.btn-inline {
  text-decoration: none !important;
  background-color: #fff;
  border: 1px solid #261777 !important;
  color: #261777 !important;
}

.btn-inline.active,
.btn-inline:active,
.open .dropdown-toggle.btn-relux {
  background-image: none;
}

.btn-fb {
  display: inline-block;
  color: #fff !important;
  background-color: #3b5998;
  border-color: #3b5998;
  text-decoration: none !important;
  border: 1px solid #3b5998;
}

.btn-fb.active,
.btn-fb:active,
.btn-fb:focus,
.btn-fb:hover,
.open .dropdown-toggle.btn-fb {
  color: #fff;
  background-color: #5872a7;
  border-color: #5872a7;
  text-decoration: none !important;
}

.btn-fb.active,
.btn-fb:active,
.open .dropdown-toggle.btn-fb {
  background-image: none;
}

.btn-fb.disabled,
.btn-fb.disabled.active,
.btn-fb.disabled:active,
.btn-fb.disabled:focus,
.btn-fb.disabled:hover,
.btn-fb[disabled],
.btn-fb[disabled].active,
.btn-fb[disabled]:active,
.btn-fb[disabled]:focus,
.btn-fb[disabled]:hover,
fieldset[disabled] .btn-fb,
fieldset[disabled] .btn-fb.active,
fieldset[disabled] .btn-fb:active,
fieldset[disabled] .btn-fb:focus,
fieldset[disabled] .btn-fb:hover {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-fb .badge {
  color: #f0ad4e;
  background-color: #fff;
}

.btn-fb img {
  height: 18px;
  vertical-align: middle;
  margin: -12px 0 -10px;
}

.btn-gg {
  color: #1f1f1f !important;
  background-color: #fff;
  border-color: #e0430d;
  text-decoration: none !important;
  border: 1px solid #1f1f1f;
}

.btn-gg.active,
.btn-gg:active,
.btn-gg:focus,
.btn-gg:hover,
.open .dropdown-toggle.btn-gg {
  color: #1f1f1f;
  background-color: #fff;
  border-color: #1f1f1f;
  text-decoration: none !important;
}

.btn-gg.active,
.btn-gg:active,
.open .dropdown-toggle.btn-gg {
  background-image: none;
}

.btn-gg.disabled,
.btn-gg.disabled.active,
.btn-gg.disabled:active,
.btn-gg.disabled:focus,
.btn-gg.disabled:hover,
.btn-gg[disabled],
.btn-gg[disabled].active,
.btn-gg[disabled]:active,
.btn-gg[disabled]:focus,
.btn-gg[disabled]:hover,
fieldset[disabled] .btn-gg,
fieldset[disabled] .btn-gg.active,
fieldset[disabled] .btn-gg:active,
fieldset[disabled] .btn-gg:focus,
fieldset[disabled] .btn-gg:hover {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-fb .badge {
  color: #f0ad4e;
  background-color: #fff;
}

.btn-gg img {
  height: 18px;
  vertical-align: middle;
  margin: -12px 0 -10px;
}

.btn-au {
  color: #fff !important;
  background-color: #e0430d;
  border-color: #e0430d;
  text-decoration: none !important;
  border: 1px solid #e0430d;
}

.btn-au-eng {
  font-size: 1rem;
}

.btn-au.active,
.btn-au:active,
.btn-au:focus,
.btn-au:hover,
.open .dropdown-toggle.btn-au {
  color: #fff;
  background-color: #e55517;
  border-color: #e55517;
  text-decoration: none !important;
}

.btn-au.active,
.btn-au:active,
.open .dropdown-toggle.btn-au {
  background-image: none;
}

.btn-au.disabled,
.btn-au.disabled.active,
.btn-au.disabled:active,
.btn-au.disabled:focus,
.btn-au.disabled:hover,
.btn-au[disabled],
.btn-au[disabled].active,
.btn-au[disabled]:active,
.btn-au[disabled]:focus,
.btn-au[disabled]:hover,
fieldset[disabled] .btn-au,
fieldset[disabled] .btn-au.active,
fieldset[disabled] .btn-au:active,
fieldset[disabled] .btn-au:focus,
fieldset[disabled] .btn-au:hover {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-au img {
  height: 18px;
  vertical-align: middle;
  margin: -12px 0 -10px;
}

.btn-line {
  color: #fff !important;
  background-color: #00b900;
  border-color: #00b900;
  text-decoration: none !important;
  border: 1px solid #00BB00;
}

.btnLineExport {
  text-align: center;
}

#btnLineExport {
  text-decoration: underline;
  margin-top: 5px;
}

#btnLineExport img {
  display: inline-block;
  width: 100%;
  max-width: 189px;
  border: 0;
  margin: 0;
  padding: 0;
  position: static;
  vertical-align: middle;
}

#btnLineExport :first-child,
#btnLineImport :first-child {
  border-radius: 2px;
}

.btn-line.active,
.btn-line:active,
.btn-line:focus,
.btn-line:hover,
.open .dropdown-toggle.btn-line {
  color: #fff;
  background-color: #24c224;
  border-color: #24c224;
  text-decoration: none !important;
}

.btn-line.active,
.btn-line:active,
.open .dropdown-toggle.btn-line {
  background-image: none;
}

.btn-line.disabled,
.btn-line.disabled.active,
.btn-line.disabled:active,
.btn-line.disabled:focus,
.btn-line.disabled:hover,
.btn-line[disabled],
.btn-line[disabled].active,
.btn-line[disabled]:active,
.btn-line[disabled]:focus,
.btn-line[disabled]:hover,
fieldset[disabled] .btn-line,
fieldset[disabled] .btn-line.active,
fieldset[disabled] .btn-line:active,
fieldset[disabled] .btn-line:focus,
fieldset[disabled] .btn-line:hover {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-line .badge {
  color: #f0ad4e;
  background-color: #fff;
}

.btn-line img {
  height: 18px;
  vertical-align: middle;
  margin: -12px 0 -10px;
}

.btn-line-export {
  background-color: #37c65c;
  color: #fff;
  height: 43px;
  text-align: center;
  vertical-align: middle;
}

.line-add-fiend .line-icon {
  height: 22px;
}

.users.line-add-friend .btn-area {
  width: 280px;
  margin: 0 auto;
  padding-top: 40px;
}

.btn-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-sub.active,
.btn-sub:active,
.btn-sub:focus,
.btn-sub:hover,
.open .dropdown-toggle.btn-sub {
  color: #333;
  background-color: #ebebeb;
  border-color: #e7e7e7;
  text-decoration: none !important;
}

.btn-sub.active,
.btn-sub:active,
.open .dropdown-toggle.btn-sub {
  background-image: none;
}

.btn-sub.disabled,
.btn-sub.disabled.active,
.btn-sub.disabled:active,
.btn-sub.disabled:focus,
.btn-sub.disabled:hover,
.btn-sub[disabled],
.btn-sub[disabled].active,
.btn-sub[disabled]:active,
.btn-sub[disabled]:focus,
.btn-sub[disabled]:hover,
fieldset[disabled] .btn-sub,
fieldset[disabled] .btn-sub.active,
fieldset[disabled] .btn-sub:active,
fieldset[disabled] .btn-sub:focus,
fieldset[disabled] .btn-sub:hover {
  background-color: #fff;
  border-color: #ccc;
}

.btn-sub .badge {
  color: #fff;
  background-color: #fff;
}

.btn-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success.active,
.btn-success:active,
.btn-success:focus,
.btn-success:hover,
.open .dropdown-toggle.btn-success {
  color: #fff;
  background-color: #47a447;
  border-color: #398439;
}

.btn-success.active,
.btn-success:active,
.open .dropdown-toggle.btn-success {
  background-image: none;
}

.btn-success.disabled,
.btn-success.disabled.active,
.btn-success.disabled:active,
.btn-success.disabled:focus,
.btn-success.disabled:hover,
.btn-success[disabled],
.btn-success[disabled].active,
.btn-success[disabled]:active,
.btn-success[disabled]:focus,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success,
fieldset[disabled] .btn-success.active,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:hover {
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}

.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info.active,
.btn-info:active,
.btn-info:focus,
.btn-info:hover,
.open .dropdown-toggle.btn-info {
  color: #fff;
  background-color: #39b3d7;
  border-color: #269abc;
}

.btn-info.active,
.btn-info:active,
.open .dropdown-toggle.btn-info {
  background-image: none;
}

.btn-info.disabled,
.btn-info.disabled.active,
.btn-info.disabled:active,
.btn-info.disabled:focus,
.btn-info.disabled:hover,
.btn-info[disabled],
.btn-info[disabled].active,
.btn-info[disabled]:active,
.btn-info[disabled]:focus,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info,
fieldset[disabled] .btn-info.active,
fieldset[disabled] .btn-info:active,
fieldset[disabled] .btn-info:focus,
fieldset[disabled] .btn-info:hover {
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}

.btn-link {
  font-weight: normal;
  color: #428bca;
  cursor: pointer;
  border-radius: 0;
}

.btn-link,
.btn-link:active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.btn-link,
.btn-link:active,
.btn-link:focus,
.btn-link:hover {
  border-color: transparent;
}

.btn-link:focus,
.btn-link:hover {
  color: #2a6496;
  text-decoration: underline;
  background-color: transparent;
}

.btn-link[disabled]:focus,
.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:focus,
fieldset[disabled] .btn-link:hover {
  color: #999;
  text-decoration: none;
}

.btn-lg {
  padding: 10px 16px;
  font-size: 1.8rem;
}

.btn-sm,
.btn-sm_app,
.btn-xs {
  font-size: 1.2rem;
  line-height: 1.5;
}

.btn-sm {
  padding: 5px 10px;
}

.btn-sm_app {
  padding: 7px 10px;
}

.btn-xs {
  padding: 1px 5px;
}

.btn-block {
  display: block;
  position: relative;
  width: 100%;
  padding-right: 0;
  padding-left: 0;
}

.btn-block + .btn-block {
  margin-top: 5px;
}

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%;
}

.sns-fav {
  position: absolute;
  top: 33%;
  left: 13px;
}

.sns-fav-img {
  position: absolute;
  top: 57%;
  left: 8px;
}

.btn-pagetop {
  background: url("/stcontents/img/common/icon-pagetop.png") no-repeat 0 0;
  background-size: cover;
  display: block;
  width: 40px;
  height: 40px;
  position: fixed;
  bottom: 14px;
  bottom: calc(env(safe-area-inset-bottom) + 44px);
  right: 20px;
  text-indent: -200px;
  white-space: nowrap;
  overflow: hidden;
  z-index: 1;
}

.btn-pagetop.static {
  position: relative;
  bottom: inherit;
  right: inherit;
  margin-top: -56px;
  margin-right: 20px;
  margin-bottom: 0 !important;
  float: right;
}

.btn-close {
  background: url("/stcontents/img/common/icon-modal-close.svg") no-repeat 0 0;
  background-size: contain;
  display: block;
  width: 30px;
  height: 30px;
  text-indent: -200px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
}

.btn-close:hover {
  opacity: 0.7;
}

.btn-anker {
  height: 32px;
  background: #FFF;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 14px;
  cursor: pointer;
  text-align: center;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
  border: 1px solid #f5f5f5;
  border-radius: 40px;
  font-weight: bold;
  font-size: 1.2rem;
  color: #0F0A64;
  letter-spacing: 0;
}

.btn-anker.active {
  background: #0F0A64;
  border-color: #0F0A64;
  text-decoration: none;
  color: #fff;
}

.btn-diamond {
  background: url(/stcontents/img/common/bg-diamond-banner.png) no-repeat 0 0;
  background-size: cover;
  max-width: 542px;
  width: 100%;
  height: 48px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: bold;
  letter-spacing: 1px;
  color: #fff;
}

.btn-diamond img {
  margin-left: 8px;
}

.btn-diamond:after {
  width: 16px;
  content: url(/stcontents/img/common/icon-jump.png);
  margin-top: 1px;
  margin-left: 4px;
  line-height: 0;
  -webkit-transform: scale(0.3);
          transform: scale(0.3);
  -webkit-transform-origin: center left;
          transform-origin: center left;
}

.btn-diamond:hover {
  color: #c6c6c6;
}

.btn-diamond:hover:after {
  opacity: 0.7;
}

.btn-col-2 a {
  margin-bottom: 16px;
}

@media (min-width: 768px) {
  .btn-default {
    height: 56px;
    padding: 0 16px;
    font-size: 1.6rem;
  }
  .btn-relux {
    height: 56px;
    padding: 0 16px;
    font-size: 1.6rem;
  }
  .btn-small {
    height: 48px;
  }
  .btn-x-small {
    height: 40px;
    font-size: 1.4rem;
  }
  .btn-xx-small {
    height: 32px;
    font-size: 1.4rem;
  }
  .btn-wide {
    width: auto;
    min-width: 300px;
  }
  .btn-to-top {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    width: auto;
    min-width: 300px;
    height: 48px;
    padding: 0 10px;
    background-color: #0f0a64;
    border: 1px solid #0f0a64;
    text-decoration: none;
    border-radius: 4px;
    font-weight: bold;
    font-size: 1.6rem;
    color: #fff;
    cursor: pointer;
  }
  .btn-to-top:hover {
    text-decoration: none;
    background-color: #554B98;
    border-color: #554B98;
    color: #fff;
  }
  .btn-pagetop {
    width: 58px;
    height: 58px;
    bottom: 40px;
    right: 60px;
  }
  .btn-pagetop:hover {
    background: url("/stcontents/img/common/icon-pagetop-hover.png") no-repeat 0 0;
    background-size: contain;
  }
  .btn-pagetop.static {
    margin-top: -90px;
    margin-right: 60px;
  }
  .btn-close {
    width: 40px;
    height: 40px;
  }
  .btn-anker {
    height: 40px;
  }
  .btn-anker:hover {
    background: #554B98;
    border-color: #554B98;
    text-decoration: none;
    color: #fff;
  }
  .btn-diamond {
    height: 56px;
  }
  .btn-diamond:after {
    -webkit-transform: scale(0.35);
            transform: scale(0.35);
  }
  .btn-col-2 a {
    margin: 0 8px;
  }
}

@media (max-width: 767px) {
  .btn-sp-wide {
    max-width: 343px;
  }
}

@media screen and (max-width: 340px) {
  .btn-default,
  .btn-relux,
  .btn-small,
  .btn-x-small {
    font-size: 1.2rem;
  }
}

.anchor-link.position-measure {
  position: -webkit-sticky;
  position: sticky;
  top: 8px;
  z-index: 21;
  overflow-x: auto;
  margin: 0 auto;
}

.anchor-link.position-measure::-webkit-scrollbar {
  display: none;
}

.anchor-link.position-measure > ul {
  min-width: 500px;
  height: 42px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.anchor-link.position-measure > ul > li {
  margin-right: 8px;
  white-space: nowrap;
}

.anchor-link.position-measure > ul > li:first-child {
  margin-left: 8px;
}

@media (min-width: 768px) {
  .anchor-link.position-measure {
    width: 680px;
    top: 16px;
  }
  .anchor-link.position-measure > ul {
    height: 52px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .anchor-link.position-measure > ul > li {
    margin-right: 16px;
  }
  .anchor-link.position-measure > ul > li:first-child {
    margin-left: 16px;
  }
  .anchor-link.position-measure .btn-anker {
    padding: 8px 24px 8px;
    font-size: 1.4rem;
  }
}

.text-link {
  display: inline-block;
  font-size: 1.4rem;
  color: #0F0A64;
  cursor: pointer;
}

.text-link:hover {
  text-decoration: none;
  opacity: 0.7;
}

.text-link:after {
  background: url("/stcontents/img/common/icon-text-link.svg") no-repeat 0 center;
  content: "";
  width: 8px;
  height: 12px;
  display: inline-block;
  margin-left: 10px;
  margin-bottom: -1px;
}

.text-link.link-close:after {
  content: none;
}

.text-link.link-close:before {
  background: url("/stcontents/img/common/icon-text-link-close.svg") no-repeat 0 center;
  background-size: contain;
  content: "";
  width: 14px;
  height: 14px;
  display: inline-block;
  margin-right: 10px;
}

.text-link.link-add::after {
  background: url("/stcontents/img/common/icon-arrow-bottom-relux.svg") no-repeat 0 center;
  background-size: contain;
  width: 16px;
  height: 9px;
  margin-bottom: 0;
  margin-top: -2px;
}

.text-link.link-left::after {
  content: none;
}

.text-link.link-left::before {
  background: url("/stcontents/img/common/icon-text-link.svg") no-repeat 0 center;
  content: "";
  width: 8px;
  height: 12px;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: -1px;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}

.text-link-gray {
  display: inline-block;
  font-size: 1.4rem;
  color: #757575;
  cursor: pointer;
}

.text-link-gray:hover {
  text-decoration: none;
  color: #000000;
}

.text-link-gray:hover:after {
  background: url("/stcontents/img/common/icon-text-link-gray-hover.svg") no-repeat 0 center;
}

.text-link-gray:after {
  background: url("/stcontents/img/common/icon-text-link-gray.svg") no-repeat 0 center;
  content: "";
  width: 8px;
  height: 12px;
  display: inline-block;
  margin-left: 10px;
  margin-bottom: -1px;
}

.text-link-gray.link-close:after {
  content: none;
}

.text-link-gray.link-close:before {
  background: url("/stcontents/img/common/icon-text-link-gray-close.svg") no-repeat 0 center;
  background-size: contain;
  content: "";
  display: inline-block;
  margin-right: 10px;
  width: 14px;
  height: 14px;
  margin-bottom: -2px;
}

.text-link-gray.link-close:hover:before {
  background: url("/stcontents/img/common/icon-text-link-gray-close-hover.svg") no-repeat 0 center;
  background-size: contain;
}

.text-link-gray.pale-gray a {
  color: #757575;
}

.text-link-gray.pale-gray:after {
  background: url("/stcontents/img/common/icon-text-link-gray-2.svg") no-repeat 0 center;
  background-size: contain;
}

.text-link-gray.link-left::after {
  content: none;
}

.text-link-gray.link-left::before {
  background: url("/stcontents/img/common/icon-text-link-gray.svg") no-repeat 0 center;
  content: "";
  width: 8px;
  height: 12px;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: -1px;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}

.text-link-gray.link-left:hover:before {
  background: url("/stcontents/img/common/icon-text-link-gray-hover.svg") no-repeat 0 center;
}

.text-link-white {
  display: inline-block;
  font-size: 1.4rem;
  color: #FFF;
  cursor: pointer;
}

.text-link-white:hover {
  text-decoration: none;
  color: #C6C6C6;
}

.text-link-white:hover::after {
  background: url("/stcontents/img/common/icon-text-link-white-hover.svg") no-repeat 0 center;
}

.text-link-white::after {
  background: url("/stcontents/img/common/icon-text-link-white.svg") no-repeat 0 center;
  content: "";
  width: 8px;
  height: 12px;
  display: inline-block;
  margin-left: 10px;
  margin-bottom: -1px;
}

.text-link-white.link-left::after {
  content: none;
}

.text-link-white.link-left::before {
  background: url("/stcontents/img/common/icon-text-link-white.svg") no-repeat 0 center;
  content: "";
  width: 8px;
  height: 12px;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: -1px;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}

.text-link-white.link-left:hover::before {
  background: url("/stcontents/img/common/icon-text-link-white-hover.svg") no-repeat 0 center;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
}
.text-link-default {
  text-decoration: underline;
  cursor: pointer;
}
.text-link-default:hover {
  text-decoration: none;
  color: #0066cc;
}
.text-link-default.color-gray-2:hover {
  color: #757575;
}

.icon-alert {
  background: url("/stcontents/img/common/icon-alert.svg") no-repeat 0 center;
  background-size: 18px;
  padding-left: 26px;
}

a.icon-alert {
  text-decoration: underline;
}

.js-conent-fadein {
  display: none;
}

.message.multi {
  height: auto;
}

.js-accordion-open:after {
  background: url("/stcontents/img/common/icon-arrow-bottom-relux.svg") no-repeat 0 center;
  background-size: contain;
  content: "";
  width: 16px;
  height: 9px;
  display: inline-block;
  margin-left: 10px;
  margin-bottom: 0;
  margin-top: -2px;
}

.js-accordion-open.active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.accordion-content {
  display: none;
}

.js-accordion-open.accordion-gray::after {
  background: url("/stcontents/img/common/icon-accordion-gray.svg") no-repeat 0 center;
  background-size: contain;
}

.js-accordion-open.accordion-gray:hover::after {
  background: url("/stcontents/img/common/icon-accordion-gray-hover.svg") no-repeat 0 center;
  background-size: contain;
}

.js-accordion-open.gray-line {
  background: rgb(245,245,245);
  position: relative;
  padding: 16px 16px;
  color: #0F0A64;
  cursor: pointer;
  font-weight: bold;
}
.js-accordion-open.gray-line::after {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}
.js-accordion-open.gray-line.active:after {
  transform: translateY(-50%) rotate(180deg);
}

.accordion-box .border {
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  overflow: hidden;
}
.accordion-box .border.active {
  border: 1px solid #0F0A64;
}
.accordion-box .border.error {
  border: 1px solid #CE0000
}
.accordion-box .label {
  background: #F5F5F5;
  width: 100%;
  position: relative;
  margin-bottom: 0 !important;
  padding: 8px 8px;
  border: none;
}
.accordion-box .label:after {
  background: url(/stcontents/img/common/icon-arrow-bottom-relux.svg) no-repeat 0 center;
  background-size: contain;
  content: "";
  width: 16px;
  height: 9px;
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -4px;
}
.accordion-box .label.active:after {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.accordion-box .text-area-common-style textarea {
  width: calc(100% - 8px);
  height: 200px;
  display: block;
  margin: 0 auto 8px;
  border: none !important;
}
.accordion-box .text-number {
  display: none;
  line-height: 1.6;
  margin: 0;
  font-size: 1rem;
  color: #757575;
  text-align: right;
}
.accordion-box .text-number.active {
  display: block;
}
.accordion-box .input-error-word {
  padding: 4px 0 8px 8px;
}

@media (min-width: 768px) {
  .text-link,
  .text-link-gray {
    font-size: 1.6rem;
  }
  .js-accordion-open:after {
    width: 19px;
    height: 10px;
    margin-top: -4px;
    margin-bottom: 0;
  }
}

@media (max-width: 767px){
  .js-accordion-open.gray-line {
    padding: 12px 8px;
  }
  .js-accordion-open.gray-line::after {
    right: 10px;
  }
}

.modal-link,
.modal-link-gray,
.modal-link-black {
  font-size: 1.4rem;
  position: relative;
  padding-right: 20px;
  text-decoration: underline;
}

.modal-link:hover,
.modal-link-gray:hover,
.modal-link-black:hover {
  text-decoration: none;
}

.modal-link::after,
.modal-link-gray::after,
.modal-link-black::after {
  content: '';
  display: block;
  width: 16px;
  height: 16px;
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.modal-link {
  color: #0066cc;
}

.modal-link:hover {
  color: #0066cc;
}

.modal-link::after {
  background-image: url("../img/common/icon-modal-link-blue.svg");
}

.modal-link-gray {
  color: #757575;
}

.modal-link-gray:hover {
  color: #757575;
}

.modal-link-gray::after {
  background-image: url("../img/common/icon-modal-link-gray.svg");
}

.modal-link-black {
  color: #333;
}

.modal-link-black:hover {
  color: #333;
}

.modal-link-black::after {
  background-image: url("../img/common/icon-modal-link-black.svg");
}

.bnr-detail-diamond {
  background: #F3F8FD;
  width: 100%;
  height: 48px;
  padding: 8px ;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  border: 1px solid #0F0A64;
}

.bnr-detail-diamond img {
  height: 21px;
  width: auto;
}

.bnr-detail-pontapass img {
  width: 100%;
  height: 48px;
}

@media (min-width: 768px) {
  .modal-link,
  .modal-link-gray,
  .modal-link-black {
    font-size: 1.6rem;
    padding-right: 32px;
  }
  .modal-link::after,
  .modal-link-gray::after,
  .modal-link-black::after {
    width: 24px;
    height: 24px;
  }
  .bnr-detail-diamond,
  .bnr-detail-pontapass {
    max-width: 33%;
    width: 343px;
    height: 58px;
  }
  .bnr-detail-diamond img {
    max-width: 100%;
    width: 300px;
    height: auto;
  }

  .bnr-detail-pontapass img{
    height: 58px;
  }
}

.icon {
  width: 16px;
  height: auto;
}

.icon-orange {
  background: #fff;
  height: 18px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 8px;
  border: 1px solid #FF503E;
  border-radius: 50px;
  line-height: 0;
  white-space: nowrap;
  font-size: 1rem;
  color: #FF503E;
}

.icon-orange-tag {
  background: #FF503E;
  height: 24px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex !important;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid #FF503E;
  border-radius: 50px;
  line-height: 1;
  white-space: nowrap;
  font-size: 1.2rem;
  color: #fff;
}

.icon-red {
  background: #CE4949;
  height: 18px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 8px;
  border: 1px solid #fff;
  border-radius: 50px;
  line-height: 0;
  white-space: nowrap;
  font-size: 1rem;
  color: #fff;
}

.icon-breads,
.icon-room,
.icon-smoke,
.icon-wifi {
  display: inline-block;
  padding-left: 24px;
  font-size: 1rem;
}

.border-none {
  border: none;
}
.border-gray {
  border-color:#C6C6C6 !important;
}

.icon-smoke {
  background: url("/stcontents/img/common/icon-smoke.svg") no-repeat 0 center;
  background-size: contain;
}

/* .icon-smoke-on {
  background: url("/stcontents/img/common/icon-smoke-on.svg") no-repeat 0 center;
  background-size: contain;
} */

.icon-room {
  background: url("/stcontents/img/common/icon-room.svg") no-repeat 0 center;
  background-size: contain;
}

.icon-breads {
  background: url("/stcontents/img/common/icon-breads.svg") no-repeat 0 center;
  background-size: contain;
}

.icon-wifi {
  background: url("/stcontents/img/common/icon-wifi.svg") no-repeat 0 center;
  background-size: contain;
}

.icon-label {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50px;
  line-height: 0;
  white-space: nowrap;
  height: 18px;
  padding: 0 8px;
  font-size: 1rem;
}

.color-white {
  color: #fff;
}

.bg-deep-gray {
  background-color: #333;
  border: 1px solid #fff;
}

.bg-blue {
  background-color: #4F68C2;
}

.bg-orange {
  background-color: #FF503E;
  color: #fff;
  border: 1px solid #fff;
}

@media (min-width: 768px) {
  .icon {
    width: 24px;
    height: auto;
  }
  .icon-label {
    height: 24px;
    padding: 0 10px;
    font-size: 1.2rem;
  }
  .icon-breads,
  .icon-room,
  .icon-smoke,
  .icon-wifi {
    padding-left: 30px;
    font-size: 1.2rem;
  }
  .icon-orange {
    height: 24px;
    padding: 0 10px;
    font-size: 1.2rem;
  }
  .icon-red {
    height: 24px;
    padding: 0 10px;
    font-size: 1.2rem;
  }
  .icon-alert {
    background-size: contain;
  }
}

@media (max-width: 767px) {
  .icon-orange-tag {
    font-size: 1rem;
    padding: 0 6px;
    height: 16px;
  }
}

.icon-grade,
.icon-grade2 {
  height: 16px;
  width: auto;
}

.icon-grade[src*="grade-star"] + .icon-grade[src*="grade-star"],
.icon-grade2[src*="grade-star"] + .icon-grade[src*="grade-star"], .icon-grade[src*="grade-star"] +
.icon-grade2[src*="grade-star"],
.icon-grade2[src*="grade-star"] +
.icon-grade2[src*="grade-star"] {
  margin-left: 2px;
}

.icon-museum, .icon-casual {
  height: 16px;
}

.icon-question {
  height: 16px;
  width: auto;
  margin: 0 6px;
  cursor: pointer;
}

.icon-ranking {
  width: 30px;
}

.tag-auberge,
.tag-business,
.tag-city,
.tag-consept,
.tag-hostel,
.tag-kominka,
.tag-machiya,
.tag-require,
.tag-any,
.tag-resort,
.tag-ryokan,
.tag-ryokan,
.tag-villa,
.tag-coupon,
.tag-fcfs,
.tag-done {
  height: 20px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transform-origin: 0 center;
          transform-origin: 0 center;
  padding: 0 5px;
  border-radius: 2px;
  font-size: 1rem;
  line-height: 1;
  white-space: nowrap;
  color: #fff;
}

.tag-hoteltype {
  height: 20px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transform-origin: 0 center;
          transform-origin: 0 center;
  padding: 0 5px;
  border-radius: 2px;
  font-size: 1rem;
  line-height: 1;
  color: #333;
  border: 1px solid #333;
  border-radius: 2px;
  background-color: #fff;
  white-space: nowrap;
}


.tag-require,
.tag-any {
  height: 14px;
  padding: 0 4px;
  background: #CE0000;
  font-size: 1rem;
  line-height: 1;
}

.tag-any {
  background: #757575;
}

.tag-ryokan {
  background: #4AA265;
}

.tag-auberge {
  background: #81C858;
}

.tag-city {
  background: #39669C;
}

.tag-business {
  background: #67B1CF;
}

.tag-resort {
  background: #796BAF;
}

.tag-consept {
  background: #BA79B1;
}

.tag-hostel {
  background: #FF997F;
}

.tag-machiya {
  background: #937453;
}

.tag-kominka {
  background: #937453;
}

.tag-villa {
  background: #D38958;
}

.tag-coupon {
  background: #FFF;
  border: 1px solid #CE0000;
  color: #CE0000;
}

.tag-fcfs {
  background: #FFF;
  border: 1px solid #0F0A64;
  color: #0F0A64;
}

.tag-done {
  background: #FFF;
  border: 1px solid #333;
  color: #333;
}

.tag-label,
.tag-label-white {
  background: #4F68C2;
  display: inline-block;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transform-origin: 0 0;
          transform-origin: 0 0;
  padding: 0 7px;
  border-radius: 20px;
  line-height: 22px;
  font-size: 1rem;
  color: #fff;
}

.tag-label-white {
  border: 1px solid #fff;
  line-height: 20px;
}

.tag-label-ro {
  border: none !important;
  background: none !important;
  padding: 0 !important;
}

.tag-pr {
  background: #FFF;
  display: inline-block;
  padding: 2px 7px;
  border: 1px solid #757575;
  border-radius: 2px;
  font-size: 10px;
  line-height: 1;
  color: #757575;
}

.tag-hoteltype-white {
  height: 20px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transform-origin: 0 center;
          transform-origin: 0 center;
  padding: 0 5px;
  border-radius: 2px;
  font-size: 1rem;
  line-height: 1;
  border-radius: 2px;
  border: 1px solid;
  color: #fff;
  background: rgba(0, 0, 0, 0.1);
}

.tag-gtt {
  height: 20px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transform-origin: 0 center;
          transform-origin: 0 center;
  padding: 0 5px;
  border-radius: 2px;
  font-size: 1rem;
  line-height: 1;
  background-color: #4F68C2;
  border-radius: 2px;
  border: none;
  color: #fff;
  white-space: nowrap;
}

.tag-gtt-white {
  height: 20px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transform-origin: 0 center;
          transform-origin: 0 center;
  padding: 0 5px;
  border-radius: 2px;
  font-size: 1rem;
  line-height: 1;
  background-color: #fff;
  border-radius: 2px;
  border: 1px solid #4F68C2;
  color: #4F68C2;
}

.tag-label-orange {
  background: #fff;
  color: #FF503E;
  border: 1px solid #FF503E;
}

@media (min-width: 768px) {
  .icon-grade {
    height: auto;
  }
  .icon-grade[src*="grade-star"] + .icon-grade[src*="grade-star"] {
    margin-left: 4px;
  }
  .icon-grade2 {
    width: 24px;
    height: 24px;
  }
  .icon-grade2[src*="grade-star"] + .icon-grade2[src*="grade-star"] {
    margin-left: 4px;
  }
  .icon-museum, .icon-casual {
    height: 24px;
  }
  .icon-question {
    height: 20px;
    margin: 0 10px;
  }
  .icon-ranking {
    width: 56px;
  }
  .tag-auberge,
  .tag-business,
  .tag-city,
  .tag-consept,
  .tag-hostel,
  .tag-kominka,
  .tag-machiya,
  .tag-require,
  .tag-any,
  .tag-resort,
  .tag-ryokan,
  .tag-ryokan,
  .tag-villa,
  .tag-coupon,
  .tag-fcfs,
  .tag-done {
    height: 24px;
    -webkit-transform: scale(1);
            transform: scale(1);
    padding: 0 10px;
    font-size: 1.2rem;
  }
  .tag-hoteltype,
  .tag-gtt,
  .tag-hoteltype-white,
  .tag-gtt-white {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 24px;
    -webkit-transform: scale(1);
            transform: scale(1);
    padding: 4px 10px;
    font-size: 1.2rem;
    line-height: 1;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transform-origin: 0 center;
            transform-origin: 0 center;
  }

  .tag-require,
  .tag-any {
    height: 16px;
    padding: 0 4px;
    line-height: 1;
    font-size: 1rem;
  }
  .tag-label,
  .tag-label-white,
  .tag-label-orange {
    -webkit-transform: none;
            transform: none;
    padding: 0 10px;
    line-height: 22px;
    font-size: 1.2rem;
  }
  .tag-label {
    line-height: 24px;
  }
  .tag-label-orange {
    line-height: 22px;
  }
}

.tab-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 2px solid #0F0A64;
}

.tab-box > * {
  background: #ffffff;
  width: calc(100% / 2);
  padding: 8px 6px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #0F0A64;
  cursor: pointer;
  height: 3.8rem;
  border-radius: 4px 4px 0 0;
  border: 1px solid #c6c6c6;
}

.tab-box > *:hover {
  background: #58489d;
  color: #fff;
}

.tab-box > *:hover a {
  display: block;
  color: #fff;
}

.tab-box > * a {
  color: #0F0A64;
}

.tab-box > *.active {
  background: #0F0A64;
  color: #fff;
  cursor: default;
  border: none;
}

.tab-box > *.active a {
  color: #fff;
}

.tab-box.type-gray {
  border-bottom: 2px solid #f5f5f5;
}

.tab-box.type-gray > * {
  background: #555555;
  color: #fff;
}

.tab-box.type-gray > *:hover {
  background: #757575;
}

.tab-box.type-gray > *.active {
  background: #f5f5f5;
  color: #333;
  cursor: default;
}

.tab-box.column-3 > * {
  width: calc(100% / 3);
}

.tab-box.column-4 > * {
  width: calc(100% / 4);
}

.tab-box.column-5 > * {
  width: calc(100% / 5);
}

.tab-box.column-6 > * {
  width: calc(100% / 6);
}

.tab-box.column-7 > * {
  width: calc(100% / 7);
}

.tab-box.column-8 > * {
  width: calc(100% / 8);
}

.flex-wrap {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}
.flex-shrink-0 {
  flex-shrink: 0;
}

.scroll-line {
  overflow-x: auto;
  white-space: nowrap;
}

.scroll-line::-webkit-scrollbar {
  height: 5px;
}

.scroll-line::-webkit-scrollbar-track {
  background: #f5f5f5;
  border-radius: 5px;
}

.scroll-line::-webkit-scrollbar-thumb {
  background: #C6C6C6;
  border-radius: 5px;
}

.scroll-line .scroll-child {
  width: 1080px;
}

.tab-content > * {
  display: none;
}

.tab-content > *:first-child {
  display: block;
}

.tab-search-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.tab-search-list li {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  margin-right: 8px;
  cursor: pointer;
}

.tab-search-list li.icon-search-3, .tab-search-list li.icon-search-4 {
  margin-right: 0;
}

.tab-search-list li.icon-search-1 {
  background: url(/stcontents/img/common/icon-seach-list-1.svg) no-repeat center center;
  background-size: 20px;
}

.tab-search-list li.icon-search-2 {
  background: url(/stcontents/img/common/icon-seach-list-2.svg) no-repeat center center;
  background-size: 20px;
}

.tab-search-list li.icon-search-3 {
  background: url(/stcontents/img/common/icon-seach-list-3.svg) no-repeat center center;
  background-size: 20px;
}

.tab-search-list li.icon-search-4 {
  background: url(/stcontents/img/common/icon-seach-list-4.svg) no-repeat center center;
  background-size: 16px;
}

.tab-search-list li.active.icon-search-1 {
  background: #0F0A64 url(/stcontents/img/common/icon-seach-list-1-white.svg) no-repeat center center;
  background-size: 20px;
}

.tab-search-list li.active.icon-search-2 {
  background: #0F0A64 url(/stcontents/img/common/icon-seach-list-2-white.svg) no-repeat center center;
  background-size: 20px;
}

.tab-search-list li.active.icon-search-3 {
  background: #0F0A64 url(/stcontents/img/common/icon-seach-list-3-white.svg) no-repeat center center;
  background-size: 20px;
}

.tab-search-list li.active.icon-search-4 {
  background: #0F0A64 url(/stcontents/img/common/icon-seach-list-4-white.svg) no-repeat center center;
  background-size: 16px;
}

.tab-box.large-style > * {
  font-size: 1.6rem;
  padding-top: 9px;
  padding-bottom: 9px;
}

@media (min-width: 768px) {
  .tab-box > * {
    padding: 13px;
    height: 4.8rem;
  }
}

@media (max-width: 768px) {
  .scroll-line .tab-box.column-3 > *, .scroll-line .tab-box.column-4 > *, .scroll-line .tab-box.column-5 > *, .scroll-line .tab-box.column-6 > *, .scroll-line .tab-box.column-7 > *, .scroll-line .tab-box.column-8 > * {
    width: auto;
    height: auto;
    padding: 10px 10px;
  }
  .tab-box.large-style > * {
    font-size: 1.4rem;
    padding: 9px 2px;
  }
}

.table-basic {
  width: 100%;
  border-bottom: 2px solid #F5F5F5;
}

.table-basic td,
.table-basic th {
  display: block;
  width: 100%;
  padding: 8px 8px;
  vertical-align: top;
  font-size: 1.4rem;
}

.table-basic th {
  background: #F5F5F5;
  min-width: 120px;
  font-weight: bold;
}

.table-basic.bd-none td,
.table-basic.bd-none th {
  border: none;
}

.table-basic.large-style td,
.table-basic.large-style th {
  font-size: 1.6rem;
}

.tableSpVertical {
  width: 100%;
  border: 1px solid #C6C6C6;
  line-height: 1.4;
}

.tableSpVertical th,
.tableSpVertical td {
  border-bottom: 1px solid #C6C6C6;
  padding: 16px;
}

.tableSpVertical th {
  background-color: #F5F5F5;
  font-weight: 900;
}

.table-icon::before {
  content: '';
  background-repeat: no-repeat;
  background-size: 100%;
  padding-left: 1.5em;
  margin-right: 8px;
}
.table-icon.table-icon-address::before {
  background-image: url(/stcontents/img/common/table-icon-address.svg);
}
.table-icon.table-icon-attention::before {
  background-image: url(/stcontents/img/common/table-icon-attention.svg);
}
.table-icon.table-icon-bath::before {
  background-image: url(/stcontents/img/common/table-icon-bath.svg);
}
.table-icon.table-icon-bus::before {
  background-image: url(/stcontents/img/common/table-icon-bus.svg);
}
.table-icon.table-icon-car::before {
  background-image: url(/stcontents/img/common/table-icon-car.svg);
}
.table-icon.table-icon-card::before {
  background-image: url(/stcontents/img/common/table-icon-card.svg);
}
.table-icon.table-icon-cashless::before {
  background-image: url(/stcontents/img/common/table-icon-cashless.svg);
}
.table-icon.table-icon-checkin::before {
  background-image: url(/stcontents/img/common/table-icon-checkin.svg);
}
.table-icon.table-icon-hotel::before {
  background-image: url(/stcontents/img/common/table-icon-hotel.svg);
}
.table-icon.table-icon-info::before {
  background-image: url(/stcontents/img/common/table-icon-info.svg);
}
.table-icon.table-icon-invoice::before {
  background-image: url(/stcontents/img/common/table-icon-invoice.svg);
}
.table-icon.table-icon-other::before {
  background-image: url(/stcontents/img/common/table-icon-other.svg);
}
.table-icon.table-icon-pets::before {
  background-image: url(/stcontents/img/common/table-icon-pets.svg);
}
.table-icon.table-icon-room::before {
  background-image: url(/stcontents/img/common/table-icon-room.svg);
}
.table-icon.table-icon-train::before {
  background-image: url(/stcontents/img/common/table-icon-train.svg);
}
.table-icon.table-icon-restaurant::before {
  background-image: url(/stcontents/img/common/table-icon-restaurant.svg);
}
.table-icon.table-icon-wheelchair::before {
  background-image: url(/stcontents/img/common/table-icon-wheelchair.svg);
}

@media (min-width: 768px) {
  .table-basic {
    border-top: 1px solid #C6C6C6;
    border-bottom: 1px solid #C6C6C6;
  }
  .table-basic td,
  .table-basic th {
    width: auto;
    display: table-cell;
    padding: 16px;
    border-bottom: 1px solid #C6C6C6;
    font-size: 1.6rem;
  }
  .table-basic th {
    width: 25.6%;
  }
}

.input-radio {
  background: url("/stcontents/img/common/icon-radio.svg") no-repeat 0 center;
  background-size: contain;
  width: 24px;
  height: 24px;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  display: inline-block;
  vertical-align: middle;
  margin-top: -2px;
  margin-right: 4px;
}

.input-radio.radio-error {
  background: url("/stcontents/img/common/icon-radio-error.svg") no-repeat 0 center;
  background-size: contain;
}

.input-radio:checked {
  background: url("/stcontents/img/common/icon-radio-on.svg") no-repeat 0 center;
  background-size: contain;
}

.input-radio:disabled {
  background: url("/stcontents/img/common/icon-radio-disabled.svg") no-repeat 0 center;
  background-size: contain;
  width: 24px;
  height: 24px;
}

/* 非活性時、input(radio)の親要素に付与 */
.radio-disabled label {
  color: #C6C6C6;
}

.input-checkbox {
  background: #fff url("/stcontents/img/common/icon-checkbox.svg") no-repeat 0 center;
  background-size: contain;
  width: 24px;
  height: 24px;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  display: inline-block;
  vertical-align: middle;
  margin-top: -2px;
  margin-right: 4px;
}

.input-checkbox:checked {
  background: #fff url("/stcontents/img/common/icon-checkbox-on.svg") no-repeat 0 center;
  background-size: contain;
}

.input-checkbox:disabled {
  background: #f5f5f5;
  cursor: default;
}

.bg-gray .input-checkbox:disabled {
  background: #dfdfdf;
}

.input-checkbox2 input[type="checkbox"] {
  visibility: hidden;
  position: absolute;
  left: -99999px;
}
.input-checkbox2 span {
  padding-left: 28px;
  position: relative;
  font-size: 1.6rem;
  display: block;
  line-height: 1.4;
}
.input-checkbox2 span::before {
  content: '';
  display: block;
  width: 17px;
  height: 17px;
  border: 2px solid #757575;
  border-radius: 2px;
  background-color: #FFFFFF;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.input-checkbox2 span::after {
  content: '';
  display: none;
  width: 10px;
  height: 4px;
  border-left: 2px solid #FFFFFF;
  border-bottom: 2px solid #FFFFFF;
  position: absolute;
  left: 4px;
  top: 0;
  bottom: 0;
  margin: auto;
  transform: rotate(-45deg);
}
.input-checkbox2 input[type="checkbox"]:checked + span::before {
  background-color: #0F0A64;
  border-color: #0F0A64;
}
.input-checkbox2 input[type="checkbox"]:checked +span::after {
  display: block;
}

.input-box .label {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.6rem;
}

.input-box .label span {
  margin-right: 4px;
}

.input-box input {
  padding-bottom: 6px;
  border: none;
  border-bottom: 1px solid #C6C6C6;
  font-size: 1.4rem;
}

.input-box input::-webkit-input-placeholder {
  color: #C6C6C6;
}

.input-box input:-ms-input-placeholder {
  color: #C6C6C6;
}

.input-box input::-ms-input-placeholder {
  color: #C6C6C6;
}

.input-box input::placeholder {
  color: #C6C6C6;
}

.input-box .input-content {
  position: relative;
}

.input-box .input-content2 {
  position: relative;
  margin-bottom: 16px;
}

.input-box .input-content2 > input {
  width: 100%;
  padding: 0 12px;
  height: 48px;
  font-size: 1.4rem;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
}

.input-box .input-content2 > input::-webkit-input-placeholder {
  color: #C6C6C6;
}

.input-box .input-content2 > input:-ms-input-placeholder {
  color: #C6C6C6;
}

.input-box .input-content2 > input::-ms-input-placeholder {
  color: #C6C6C6;
}

.input-box .input-content2 > input::placeholder {
  color: #C6C6C6;
}

.input-box .input-content2.password > input {
  padding-right: 41px;
}

.input-box .input-content2.password .icon-eye {
  position: absolute;
  left: auto;
  right: 9px;
  top: 12px;
  bottom: auto;
  margin: auto;
}

.input-box .input-content2.icon-mail::before {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("/stcontents/img/common/icon-mail.svg");
  position: absolute;
  left: 9px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.input-box .input-content2.icon-mail > input {
  padding-left: 41px;
  padding-right: 41px;
}

.input-box .input-content2.icon-lock::before {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("/stcontents/img/common/icon-lock.svg");
  position: absolute;
  left: 9px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.input-box .input-content2.icon-lock > input {
  padding-left: 41px;
}

.input-box .input-content2.icon-number::before {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("/stcontents/img/common/icon-number.svg");
  position: absolute;
  left: 9px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.input-box .input-content2.icon-number > input {
  padding-left: 41px;
}

.input-box .input-content2.error {
  margin-bottom: 4px;
}

.input-box .input-content2.error > input {
  border-color: #ce0000;
}

.input-box .input-content2.error + .error-text {
  display: block;
  color: #ce0000;
  margin-bottom: 16px;
}

.input-box .icon-eye {
  position: absolute;
  z-index: 2;
  left: 316px;
}

.input-box .input-error {
  border-bottom: 1px solid #CE0000;
}

.input-box .text-box {
  max-width: 100%;
  padding: 13px 12px;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  -webkit-appearance: none;
}

.input-box .text-box-error {
  border: 1px solid #CE0000;
}

.input-box .btn-submit {
  background: #0F0A64;
  padding: 14px 16px;
  border: none;
  border-radius: 4px;
  color: #fff;
  font-weight: bold;
  font-size: 1.4rem;
  cursor: pointer;
}

.input-box .btn-submit:hover {
  opacity: 0.7;
}

.input-box .btn-submit:disabled {
  opacity: .2;
}

.input-box .input-clear-wrap {
  position: relative;
}

.input-box .input-clear-wrap .input-clear-btn {
  display: inline-block;
  position: absolute;
  cursor: pointer;
  outline: none;
  content: '';
  width: 19px;
  height: 18px;
  background-image: url(/stcontents/img/common/icon-input-delete.svg);
  background-color: transparent;
  background-repeat: no-repeat;
  right: 18px;
  top: 0;
  bottom: 0;
  margin: auto;
  border: none;
}

.input-box .input-clear-wrap .js-input-clear:placeholder-shown + .input-clear-btn {
  display: none;
}

.apply .text-box, .apply-disabled .text-box {
  width: 493px;
  height: 56px;
  border-radius: 4px 0 0 4px;
  border-right: none;
}

.apply .text-box :disabled, .apply-disabled .text-box :disabled {
  background-color: #fff;
  border-color: #c6c6c6;
  color: #c6c6c6;
}

.apply .btn-submit, .apply-disabled .btn-submit {
  width: 113px;
  height: 56px;
  border-radius: 0 4px 4px 0;
  padding: 16px 24px;
}

.apply .btn-submit :disabled, .apply-disabled .btn-submit :disabled {
  border: 1px solid #c6c6c6;
  border-left: none;
}

.apply .btn-disabled-gray, .apply-disabled .btn-disabled-gray {
  width: 113px;
  height: 56px;
  border: 1px solid #c6c6c6;
  border-left: none;
  border-radius: 0 4px 4px 0;
  padding: 15px 24px;
  font-size: 1.6rem;
}

.apply-disabled .text-box {
  cursor: default;
  pointer-events: none;
  background-color: #fff;
}

@media (min-width: 768px) {
  .input-checkbox,
  .input-radio {
    margin-right: 8px;
  }
  .input-box .label {
    margin-bottom: 8px;
    font-size: 1.6rem;
  }
  .input-box .label span {
    margin-right: 8px;
  }
  .input-box input {
    padding-bottom: 8px;
    font-size: 1.6rem;
    border-width: 2px;
  }
  .input-box .input-error {
    border-width: 2px;
  }
  .input-box .text-box-min {
    padding: 13px 12px;
    font-size: 1.4rem;
  }
  .input-box .btn-submit {
    padding: 16px 28px 16px;
    font-size: 1.6rem;
  }
}

@media (max-width: 767px) {
  .input-box {
    margin-bottom: 16px;
  }
  .input-box .input-content2 {
    position: relative;
  }
  .input-box .input-content2 > input {
    width: 100%;
    padding: 0 12px;
    height: 48px;
    font-size: 1.4rem;
    border: 1px solid #C6C6C6;
    border-radius: 4px;
  }
  .input-box .input-content2 > input::-webkit-input-placeholder {
    color: #C6C6C6;
  }
  .input-box .input-content2 > input:-ms-input-placeholder {
    color: #C6C6C6;
  }
  .input-box .input-content2 > input::-ms-input-placeholder {
    color: #C6C6C6;
  }
  .input-box .input-content2 > input::placeholder {
    color: #C6C6C6;
  }
  .input-box .input-content2.password > input {
    padding-right: 41px;
  }
  .input-box .input-content2.password .icon-eye {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    left: auto;
    right: 9px;
    top: 14px;
    margin: auto;
    cursor: pointer;
  }
  .input-box .input-content2.icon-mail::before {
    width: 16px;
    height: 16px;
    background-size: 100%;
    left: 8px;
  }
  .input-box .input-content2.icon-mail > input {
    padding-left: 32px;
  }
  .input-box .input-content2.icon-lock::before {
    width: 16px;
    height: 16px;
    background-size: 100%;
    left: 8px;
  }
  .input-box .input-content2.icon-lock > input {
    padding-left: 32px;
  }
  .input-box .input-content2.icon-number::before {
    width: 16px;
    height: 16px;
    background-size: 100%;
    left: 8px;
  }
  .input-box .input-content2.icon-number > input {
    padding-left: 32px;
  }
  .input-box .input-content2.error > input {
    border-color: #ce0000;
  }
  .input-box .input-content2.error + .error-text {
    display: block;
    color: #ce0000;
    margin-top: 4px;
  }
  .input-box .js-radio-acd-content-b .input-content2 {
    max-width: 155px;
  }
  .apply, .apply-disabled {
    width: 100%;
  }
  .apply .text-box, .apply-disabled .text-box {
    width: calc(100% - 77px) !important;
    height: 48px;
    padding: 8px;
    border-radius: 4px 0 0 4px;
    border-right: none;
  }
  .apply .btn-submit, .apply-disabled .btn-submit {
    width: 77px;
    height: 48px;
    padding: 2px 8px;
    font-size: 1.4rem;
  }
  .apply .btn-disabled-gray, .apply-disabled .btn-disabled-gray {
    width: 77px;
    height: 48px;
    padding: 2px 8px;
    font-size: 1.4rem;
  }
  .input-checkbox2 span {
    padding: 4px 12px;
    background: #FFFFFF;
    font-size: 1.4rem;
    border-radius: 100px;
    border: 1px solid #FFFFFF;
  }
  .input-checkbox2 span::before,
  .input-checkbox2 span::after {
    display: none;
  }
  .input-checkbox2 input[type="checkbox"]:checked + span {
    background: #F3F8FD;
    border-color: #0F0A64;
  }
  .input-checkbox2 input[type="checkbox"]:checked +span::after {
    display: none;
  }
}

.form-validation .btn-target.disabled,
.member-form-validation .btn-target.disabled {
  opacity: .2;
  pointer-events: none;
}

.form-validation .on .input-error-word,
.member-form-validation .on .input-error-word {
  display: block;
  white-space: nowrap;
}

.form-validation .on input,
.member-form-validation .on input {
  border: 1px solid #CE0000;
}

.form-validation .on .input-radio,
.member-form-validation .on .input-radio {
  background: url(/stcontents/img/common/icon-radio-error.svg) no-repeat 0 center;
  background-size: contain;
  width: 20px;
  height: 20px;
  margin-left: 1px;
}

.form-validation .on .input-radio:checked,
.member-form-validation .on .input-radio:checked {
  background: url(/stcontents/img/common/icon-radio-on-checked.svg) no-repeat 0 center;
  background-size: contain;
}

.form-validation .no-validate input,
.member-form-validation .no-validate input {
  border-color: #C6C6C6 !important;
}

.form-validation .js-notice-text,
.member-form-validation .js-notice-text {
  display: none;
}

.form-validation .alert-baloon,
.member-form-validation .alert-baloon {
  display: none !important;
  margin-bottom: 40px;
}

.form-validation .alert-baloon .list,
.member-form-validation .alert-baloon .list {
  background: #fff;
  max-width: 400px;
  position: relative;
  overflow: hidden;
  padding: 5px 18px 7px;
  border-radius: 50px;
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
  cursor: pointer;
}

.form-validation .alert-baloon .list:after,
.member-form-validation .alert-baloon .list:after {
  width: 6px;
  height: 6px;
  content: "";
  display: block;
  position: absolute;
  top: 45%;
  right: 18px;
  border-top: 2px solid #CE0000;
  border-right: 2px solid #CE0000;
  -webkit-transform: rotate(-45deg) translateY(-30%);
          transform: rotate(-45deg) translateY(-30%);
}

.form-validation .alert-baloon .list:before,
.member-form-validation .alert-baloon .list:before {
  width: 2px;
  height: 10px;
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 23px;
  margin-top: -4px;
  border-right: 2px solid #CE0000;
}

.form-validation .alert-baloon .list span,
.member-form-validation .alert-baloon .list span {
  width: 100%;
  display: none;
  position: relative;
  z-index: 1;
}

.form-validation .alert-baloon .list span:only-child,
.member-form-validation .alert-baloon .list span:only-child {
  padding: 3px 0;
}

.form-validation .alert-baloon .list span:nth-of-type(-n+2),
.member-form-validation .alert-baloon .list span:nth-of-type(-n+2) {
  display: block;
}

.form-validation .alert-baloon .list span span span:before,
.form-validation .alert-baloon .list span div:before,
.member-form-validation .alert-baloon .list span span span:before,
.member-form-validation .alert-baloon .list span div:before {
  content: "※";
}

.form-validation .alert-baloon .list .more,
.member-form-validation .alert-baloon .list .more {
  display: none;
  position: absolute;
  top: 22px;
  right: 36px;
  font-weight: bold;
  text-align: right;
}

.form-validation .alert-baloon .list .more span,
.member-form-validation .alert-baloon .list .more span {
  width: auto;
  display: inline;
}

.form-validation .alert-baloon .list.on a,
.member-form-validation .alert-baloon .list.on a {
  display: block;
  margin-bottom: 4px;
}

.form-validation .alert-baloon .list.on .more,
.member-form-validation .alert-baloon .list.on .more {
  display: none !important;
}

.form-validation .alert-baloon .input-error-word,
.member-form-validation .alert-baloon .input-error-word {
  display: block;
  padding-right: 70px;
}

.form-validation .alert-baloon .input-error-word .add,
.member-form-validation .alert-baloon .input-error-word .add {
  display: none !important;
}

.form-validation .input-box .select-dropdown-search .search-area input,
.member-form-validation .input-box .select-dropdown-search .search-area input {
  border-color: #c6c6c6;
}

.form-validation .input-box-birth > div,
.form-validation .input-box-checkin > div,
.member-form-validation .input-box-birth > div,
.member-form-validation .input-box-checkin > div {
  width: 68px;
  height: 48px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 8px;
  border: 1px solid #c6c6c6;
  border-radius: 4px;
  margin-bottom: 4px;
  color: #C6C6C6;
  text-align: center;
}

@media (min-width: 768px) {
  .form-validation .input-box-birth > div:first-of-type,
  .form-validation .input-box-checkin > div:first-of-type,
  .member-form-validation .input-box-birth > div:first-of-type,
  .member-form-validation .input-box-checkin > div:first-of-type {
    width: 90px;
  }
}

.form-validation .input-box-birth > div:last-of-type,
.form-validation .input-box-checkin > div:last-of-type,
.member-form-validation .input-box-birth > div:last-of-type,
.member-form-validation .input-box-checkin > div:last-of-type {
  margin-right: 0;
}

.form-validation .input-box-birth > div.fill,
.form-validation .input-box-checkin > div.fill,
.member-form-validation .input-box-birth > div.fill,
.member-form-validation .input-box-checkin > div.fill {
  border-color: #c6c6c6 !important;
}

.form-validation .input-box-birth > div input,
.form-validation .input-box-checkin > div input,
.member-form-validation .input-box-birth > div input,
.member-form-validation .input-box-checkin > div input {
  padding: 0 0;
  text-align: center;
  color: #333;
  border: none !important;
}

.form-validation .input-box-birth > div.focus,
.form-validation .input-box-checkin > div.focus,
.member-form-validation .input-box-birth > div.focus,
.member-form-validation .input-box-checkin > div.focus {
  border: 1px solid #0F0A64;
}

.form-validation .input-box-birth > div.on,
.form-validation .input-box-checkin > div.on,
.member-form-validation .input-box-birth > div.on,
.member-form-validation .input-box-checkin > div.on {
  border-color: #CE0000;
}

.form-validation .input-box-birth.on > div,
.form-validation .input-box-checkin.on > div,
.member-form-validation .input-box-birth.on > div,
.member-form-validation .input-box-checkin.on > div {
  border-color: #CE0000;
}

.form-validation .anniversary-input > div,
.member-form-validation .anniversary-input > div {
  width: 68px;
  border-color: #c6c6c6 !important;
}

.form-validation .anniversary-input > div input:first-of-type,
.member-form-validation .anniversary-input > div input:first-of-type {
  width: 20px !important;
}

.form-validation .mypage-btn-double,
.member-form-validation .mypage-btn-double {
  margin-top: 60px;
}

.form-validation .input-box .password,
.member-form-validation .input-box .password {
  max-width: 343px;
}

.form-validation .js-dropdown .select-frame,
.member-form-validation .js-dropdown .select-frame {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.form-validation .input-hint,
.member-form-validation .input-hint {
  display: none;
}

.form-validation .input-hint.active,
.member-form-validation .input-hint.active {
  display: block;
}

.form-validation input:-webkit-autofill,
.member-form-validation input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 300px #fff inset;
}

.form-validation .float-bar-fix,
.member-form-validation .float-bar-fix {
  -webkit-transform: translateY(0) !important;
          transform: translateY(0) !important;
}

.form-validation a.btn-target.no-disabled,
.member-form-validation a.btn-target.no-disabled {
  background: #0f0a64;
  border: 1px solid #0f0a64;
  pointer-events: auto;
}

@media (min-width: 768px) {
  .form-validation .alert-baloon .list,
  .member-form-validation .alert-baloon .list {
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .form-validation .phone .js-dropdown.js-half-modal-trigger,
  .member-form-validation .phone .js-dropdown.js-half-modal-trigger {
    width: auto !important;
  }
  .form-validation .alert-baloon .list .more,
  .form-validation .alert-baloon .input-error-word,
  .member-form-validation .alert-baloon .list .more,
  .member-form-validation .alert-baloon .input-error-word {
    font-size: 1rem;
  }
  .reservation .member-form-validation .reserve-float-bar {
    box-shadow: 0 0 8px rgba(0,0,0,0.15);
  }
}

@media (max-width: 360px) {
  .form-validation .on .input-error-word,
  .member-form-validation .on .input-error-word {
    white-space: normal;
  }
}

.grid-1,
.grid-2,
.grid-2-left,
.grid-2-right,
.grid-3,
.grid-4,
.grid-5,
.grid-6 {
  display: block;
}

.grid-1 > *,
.grid-2 > *,
.grid-2-left > *,
.grid-2-right > *,
.grid-3 > *,
.grid-4 > *,
.grid-5 > *,
.grid-6 > * {
  width: 100%;
  margin-bottom: 16px;
}

@media (min-width: 768px) {
  .grid-1,
  .grid-2,
  .grid-2-left,
  .grid-2-right,
  .grid-3,
  .grid-4,
  .grid-5,
  .grid-6 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .grid-2 > * {
    width: 48.7%;
  }
  .grid-2-left > *:first-child {
    width: 65%;
  }
  .grid-2-left > *:last-child {
    width: 32.4%;
  }
  .grid-2-right > *:first-child {
    width: 32.4%;
  }
  .grid-2-right > *:last-child {
    width: 65%;
  }
  .grid-3 > * {
    width: 48.7%;
  }
  .grid-4 > * {
    width: 48.7%;
  }
  .grid-5 > * {
    width: 48.7%;
  }
  .grid-6 > * {
    width: 48.7%;
  }
}

@media (min-width: 1024px) {
  .grid-3 > * {
    width: 32%;
  }
  .grid-4 > * {
    width: 24%;
  }
  .grid-5 > * {
    width: 19%;
  }
  .grid-6 > * {
    width: 16%;
  }
}

.searchBox {
  position: relative;
  display: table;
  table-layout: fixed;
  height: 70px;
}

.searchBox .box {
  display: table-cell;
  vertical-align: middle;
  background-color: #fff;
  cursor: pointer;
  overflow: hidden;
  height: 68px;
  cursor: pointer;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.searchBox .box .reset-btn {
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.searchBox .box.area {
  display: table-cell;
}

.searchBox .box.area.unset .box-name {
  display: block;
}

.searchBox .box.area .box-name {
  display: none;
}

.searchBox .box.checkin-out {
  display: table-cell;
  position: relative;
}

.searchBox .box.checkin-out.unset .box-name {
  display: block;
}

.searchBox .box.checkin-out .box-name {
  display: none;
}

.searchBox .box.peopleroom {
  display: table-cell;
  position: relative;
}

.searchBox .box.peopleroom.unset .box-name {
  display: block;
}

.searchBox .box.peopleroom.unset .main {
  color: #757575;
}

@media (max-width: 767px){
	.searchBox .box-inner .box-name {
    display: none;
	}
}

.searchBox .searchBtn {
  display: table-cell;
  width: 120px;
}

.searchBoxArea {
  position: absolute;
  top: 50px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 10;
}

.searchBoxArea.fixed {
  background: #fff;
  position: fixed;
  width: 100%;
  top: 0;
  padding: 8px;
  z-index: 30;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
}

.searchBoxArea .searchBox {
  width: calc(100vw - 32px);
  height: 48px;
  border-radius: 4px;
  margin: 0 auto;
  overflow: hidden;
}

.searchBoxArea .searchBox .box {
  display: none;
  height: 48px;
  border-top: 1px solid #0F0A64;
  border-bottom: 1px solid #0F0A64;
}

.searchBoxArea .searchBox .box:first-child {
  border-left: 1px solid #0F0A64;
  border-radius: 4px 0 0 4px;
}

.searchBoxArea .searchBox .box.area {
  display: table-cell;
  width: auto;
}

.searchBoxArea .searchBox .box.area .box-inner {
  position: relative;
  padding-right: 32px;
}

.searchBoxArea .searchBox .box.area .box-inner .reset-btn {
  position: absolute;
}

.searchBoxArea .searchBox .box.area .box-inner .reset-btn.unset a {
  display: none;
}

.searchBoxArea .searchBox .box.area .box-inner .reset-btn a {
  display: block;
  font-size: 1.6rem;
  color: #757575 !important;
  background-color: transparent;
  padding: 0;
  padding-left: 28px;
  position: relative;
}

.searchBoxArea .searchBox .box.area .box-inner .reset-btn a::before {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("../img/common/icon-reset.svg");
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.searchBoxArea .searchBox .box.checkin-out {
  width: 34%;
}

.searchBoxArea .searchBox .box.area .box-inner .reset-btn,
.searchBoxArea .searchBox .box.checkin-out .box-inner .reset-btn {
  display: none;
}

.searchBoxArea .searchBox .box.area.focus .box-inner .reset-btn,
.searchBoxArea .searchBox .box.checkin-out.focus .box-inner .reset-btn {
  display: block;
}

.searchBoxArea .searchBox .box.peopleroom {
  width: 29%;
}

.searchBoxArea .searchBox .searchBtn {
  width: 48px;
  height: 100%;
}

.searchBoxArea .searchBox .searchBtn button {
  width: 100%;
  height: 48px;
  padding: 0;
}

.searchBoxArea .searchBox .unset {
  color: #757575;
}

.searchBoxArea .searchBox .box .sub {
  display: none;
  font-size: 1.1rem;
  color: #757575;
}

.sub-page .searchBoxArea {
  position: relative;
  top: inherit;
  left: inherit;
  -webkit-transform: none;
          transform: none;
}

.sub-page .searchBoxArea .searchBox {
  margin: 0 auto;
}

.sub-page .searchBoxArea.fixed {
  position: fixed;
  top: 0;
  left: 0;
}

.searchBox .box-inner {
  padding: 0 8px;
}

.searchBox .box-inner .box-name {
  width: 100%;
  margin-bottom: 2px;
  line-height: 1.5;
  font-size: 1.2rem;
  font-weight: bold;
  color: #333;
}

.searchBox .checkin-out .box-name {
  margin-bottom: -8px;
}

.searchBox .checkin-out .stay {
  margin-left: 16px;
  margin-bottom: 19px;
  display: none;
}

.searchBox .checkin-out .checkin-out-unselected {
  font-size: 1rem;
  color: #757575;
}

.searchBox .checkin-out .checkin-out-unselected::before {
  background: url(/stcontents/img/common/icon-calendar.svg) no-repeat center 0;
  background-size: 14px;
  content: "";
  display: block;
  width: 100%;
  height: 14px;
  margin-top: 4px;
  margin-bottom: 2px;
}

@media (min-width: 768px) {
  .bread-crumbs {
    padding: 8px 0 16px;
    font-size: 1.2rem;
  }
  .bread-crumbs a:after {
    margin: 0 8px;
  }
  .searchBoxArea {
    top: 80px;
  }
  .searchBoxArea .searchBox {
    max-width: none;
    width: 736px;
  }
  .searchBoxArea .searchBox .box {
    display: table-cell;
    height: 60px;
  }
  .searchBoxArea .searchBox .searchBtn {
    width: 60px;
  }
  .searchBoxArea .searchBox .searchBtn button {
    width: 60px;
    height: 60px;
    padding: 0;
  }
  .searchBoxArea .searchBox .box-inner {
    padding: 0 10px 0 24px;
  }
}

@media (min-width: 1024px) {
  .searchBoxArea .searchBox {
    width: 800px;
    height: 60px;
  }
  .searchBoxArea .searchBox .box.area {
    width: 48%;
  }
  .searchBoxArea .searchBox .box.checkin-out {
    width: 40%;
  }
  .searchBoxArea .searchBox .box.peopleroom {
    width: 30%;
  }
}

.searchBox .box.checkin-out.unset .box-inner {
  padding-right: 10px;
  -webkit-box-pack: unset;
  -webkit-justify-content: unset;
      -ms-flex-pack: unset;
          justify-content: unset;
}

.searchBox .box.checkin-out .box-inner {
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  padding: 0 24px;
  border-left: 1px solid #efefef;
  border-right: 1px solid #efefef;
  line-height: 1.4;
}

.searchBox .box.checkin-out .box-inner .unset {
  color: #757575;
}

.searchBox .box.checkin-out .box-inner .unset .main {
  color: inherit;
  font-size: 1.4rem;
}

.searchBox .box.checkin-out .box-inner .border {
  margin: 0 4px;
  color: #757575;
}

.searchBox .box.checkin-out .box-inner .reset-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.searchBox .box.checkin-out .box-inner .reset-btn.unset a {
  display: none;
}

.searchBox .box.checkin-out .box-inner .reset-btn a {
  font-size: 1.6rem;
  color: #757575 !important;
  background-color: transparent;
  padding: 0;
  padding-left: 28px;
  position: relative;
}

.searchBox .box.checkin-out .box-inner .reset-btn a::before {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("../img/common/icon-reset.svg");
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.searchBoxArea .searchBox .box.area.selected .box-name,
.searchBoxArea .searchBox .box.peopleroom.selected .box-name {
  display: none;
}

.searchBoxArea .searchBox .box.area.selected .sub,
.searchBoxArea .searchBox .box.peopleroom.selected .sub {
  display: block;
}

.searchBoxArea .searchBox .box.area.selected.checkin-out .box-inner,
.searchBoxArea .searchBox .box.peopleroom.selected.checkin-out .box-inner {
  -webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;
}

.searchBoxArea .searchBox .box.area.selected.checkin-out .box-inner > div,
.searchBoxArea .searchBox .box.peopleroom.selected.checkin-out .box-inner > div {
  width: calc(50% - 20px);
}

.searchBoxArea .searchBox .box.area.selected.checkin-out .box-inner .border,
.searchBoxArea .searchBox .box.peopleroom.selected.checkin-out .box-inner .border {
  margin: 0 16px 0 8px;
}

.searchBox .box.peopleroom .box-inner {
  padding: 0 10px 0 24px;
}

.searchBox .box.meal .box-inner {
  padding: 0 10px 0 24px;
}

.searchBox .box .main {
  font-size: 1.3rem;
  color: #333;
  display: block;
}

.searchBox .box .main #searchTotalNumOfAdult,
.searchBox .box .main #searchTotalNumOfChild {
  margin-left: 4px;
}

.searchBox .box input[type="text"] {
  border: none;
  line-height: 1.6;
  font-size: 1.4rem;
  width: 100%;
  background-color: transparent;
}

.searchBox .box input[type="text"]::-webkit-input-placeholder {
  font-size: 1.4rem;
}

.searchBox .box input[type="text"]:-ms-input-placeholder {
  font-size: 1.4rem;
}

.searchBox .box input[type="text"]::-ms-input-placeholder {
  font-size: 1.4rem;
}

.searchBox .box input[type="text"]::placeholder {
  font-size: 1.4rem;
}

.searchBox .box input[type="text"]:focus {
  outline: none;
}

.searchBox .box.area input[type="text"] {
  font-size: 1.6rem;
}

.searchBox .box.area input[type="text"]::-webkit-input-placeholder {
  font-size: 1.6rem;
}

.searchBox .box.area input[type="text"]:-ms-input-placeholder {
  font-size: 1.6rem;
}

.searchBox .box.area input[type="text"]::-ms-input-placeholder {
  font-size: 1.6rem;
}

.searchBox .box.area input[type="text"]::placeholder {
  font-size: 1.6rem;
}

@media screen and (max-width: 767px) {
  .searchBox .box.area input[type="text"]::-webkit-input-placeholder {
    font-size: 1.2rem;
  }
  .searchBox .box.area input[type="text"]:-ms-input-placeholder {
    font-size: 1.2rem;
  }
  .searchBox .box.area input[type="text"]::-ms-input-placeholder {
    font-size: 1.2rem;
  }
  .searchBox .box.area input[type="text"]::placeholder {
    font-size: 1.2rem;
  }
}

.searchBox .box.area:hover,
.searchBox .box.checkin-out:hover,
.searchBox .box.meal:hover,
.searchBox .box.peopleroom:hover,
.searchBox .box.sort:hover {
  background: #f5f5f5 !important;
}

.searchBox .searchBtn button {
  vertical-align: middle;
  display: table-cell;
  width: 120px;
  font-size: 2rem;
  height: 70px;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 3px !important;
  border-bottom-right-radius: 3px !important;
  border-bottom-left-radius: 0 !important;
}

.searchBox .searchBtn button img {
  height: 24px;
  vertical-align: -5px;
  width: 24px;
}

.searchBox .searchBtn button.js-searchButton img {
  height: 17px;
  margin: 0 3px 0 0;
  vertical-align: -4px;
  width: 17px;
}

.searchBox .box.error {
  color: #990000;
  border: 3px solid #990000;
}

.searchBox .box.error input[type='text']:-ms-input-placeholder {
  color: #990000;
}

.searchBox .box.error input[type='text']::-ms-input-placeholder {
  color: #990000;
}

.searchBox .box.error input[type='text']::-webkit-input-placeholder {
  color: #990000;
}

.searchBox .box.error input[type='text']::placeholder {
  color: #990000;
}

.searchBox .box.error .box-inner {
  background: url("/stcontents/img/searchbox/icon-room-error.svg") no-repeat 8px 50%;
  background-size: 24px auto;
  padding-left: 40px;
}

.popup-position {
  display: none;
  width: 736px;
  position: absolute;
  top: 140px;
  left: calc(50% + 1px);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  color: #333;
  z-index: 10;
  pointer-events: none;
}

.search-result .popup-position {
  top: 68px;
}

.search-result .popup-position.fixed {
  top: 68px;
}

.search-result .btn-popup-close {
  background: url(/stcontents/img/common/icon-close-4.svg);
  left: auto;
  right: 14px;
}

.btn-popup-close {
  display: none;
  background: url(/stcontents/img/common/icon-arrow-left-black-2.svg) no-repeat center center;
  background-size: 9px;
  width: 30px;
  height: 30px;
  position: fixed;
  top: 10px;
  left: 8px;
  z-index: 42;
}

.btn-popup-close.right {
  background: url(/stcontents/img/common/icon-close-4.svg);
  left: auto;
  right: 14px;
}

.popup-suggest,
.popup-dateSelector,
.popup-peopleroom {
  display: none;
  -webkit-box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
  padding: 0 24px 0;
  z-index: 1;
  background: #fff;
  border: 1px solid #efefef;
  border-radius: 0 0 8px 8px;
  max-height: 460px;
  overflow-y: auto;
  pointer-events: auto;
}

.popup-suggest::-webkit-scrollbar,
.popup-dateSelector::-webkit-scrollbar,
.popup-peopleroom::-webkit-scrollbar {
  width: 0;
}

.popup-suggest {
  background: #fff;
  width: 550px;
  position: absolute;
  top: 0;
  left: 0;
  padding: 8px 24px 8px;
  border-radius: 0 0 8px 8px;
}

.popup-suggest .description {
  border-bottom: 1px solid #F5F5F5;
  padding-bottom: 10px;
  margin-bottom: 0;
  font-size: 12px;
}

.popup-suggest ul li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid #F5F5F5;
}

.popup-suggest ul li:last-of-type {
  border: none;
}

.popup-suggest ul li.region a {
  background: url(/stcontents/img/common/icon-map.svg) no-repeat 4px 16px;
  background-size: 12px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-left: 32px;
}

.popup-suggest ul li.prefecture a {
  background: url(/stcontents/img/common/icon-hang.svg) no-repeat 40px 16px;
  background-size: 14px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-left: 64px;
}

.popup-suggest ul li.hotel a {
  background: url(/stcontents/img/common/icon-room-2.svg) no-repeat 4px 20px;
  background-size: 16px;
  padding-left: 32px;
}

.popup-suggest ul li.japan a {
  border-bottom: 1px solid #f5f5f5 !important;
}

.popup-suggest ul li a {
  width: 100%;
  padding: 12px 0;
  color: #333 !important;
  cursor: pointer;
}

.popup-suggest ul li a:hover {
  background-color: #F3F8FD;
}

.popup-suggest ul li:last-child a {
  border: none;
}

.popup-suggest ul li strong {
  font-weight: 900;
}

.popup-suggest ul li .num {
  padding-left: 8px;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  color: #757575;
}

.popup-suggest .area-words {
  display: none;
  border-bottom: 1px solid #f5f5f5;
}

.popup-peopleroom {
  position: absolute;
  top: 0;
  right: 1px;
}

.js-child-modalbox-detail .modalbox-container {
  display: block;
}

.js-child-modalbox-detail .select-dropdown {
  width: 100%;
}

.js-child-modalbox-detail .select-dropdown > span.select-frame {
  padding-left: 0;
}

.js-child-modalbox-detail .select-dropdown .dropdown-select-button {
  right: -16px;
}

.js-child-modalbox-detail .select-dropdown ul {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.js-child-modalbox-detail .select-dropdown ul li {
  padding-left: 16px;
  text-align: left;
}

.js-child-modalbox-detail .select-dropdown ul li:hover {
  background: #F3F8FD;
}

.js-child-modalbox-detail .js-dropdown .select-frame {
  color: #333;
  font-size: 1.4rem;
}

.js-child-modalbox-detail .js-dropdown .select-frame > span {
  font-size: 1.2rem;
}

.js-child-modalbox-detail .js-dropdown .dropdown-select-ul {
  position: static;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.js-child-modalbox-detail .js-dropdown .dropdown-select-ul > li {
  font-size: 1.4rem;
}

.js-child-modalbox-detail .js-dropdown .dropdown-select-ul > li:hover {
  background-color: #F3F8FD;
}

.js-child-modalbox-detail .js-dropdown .dropdown-select-ul > li + li {
  border-top: 1px solid #f5f5f5;
}

.js-child-modalbox-detail .js-dropdown .dropdown-select-ul > li > span {
  color: #333;
  font-size: 1.2rem;
}

@media (max-width: 767px) {
  .popup-suggest,
  .popup-dateSelector,
  .popup-peopleroom {
    max-height: 100%;
  }
  .js-child-modalbox-detail {
    padding-left: 50px;
  }
  .js-child-modalbox-detail .modalbox-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .js-child-modalbox-detail .modalbox-itemname {
    width: 76px;
  }
  .js-child-modalbox-detail .modalbox-select {
    width: calc(100% - 86px);
  }
  .popup-suggest,
  .popup-dateSelector,
  .popup-peopleroom {
    -webkit-box-shadow: unset;
            box-shadow: unset;
    border: none;
  }
  .popup-peopleroom {
    padding-bottom: 120px;
  }
  .popup-peopleroom .peopleroomArea {
    height: 100%;
    overflow-y: auto;
    font-size: 1.4rem;
  }
  .popup-suggest ul li.prefecture a {
    background-position: 35px 16px;
    padding-left: 60px;
  }
}

@media (max-width: 360px) {
  .js-child-modalbox-detail {
    padding-left: 8px;
  }
}

.popup-dateSelector {
  padding: 24px 32px;
  background-color: #fff;
  position: absolute;
  left: 1px;
  right: 1px;
  border-radius: 0 0 8px 8px;
}

.dateSelector .error-msg {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  color: #ce0000;
  font-size: 1.2rem;
  margin-bottom: 0;
}

.dateSelector .error-msg::before {
  content: '※';
  margin-right: 4px;
}

.dateSelector .arrow-left,
.dateSelector .arrow-right {
  width: 48px;
  height: 48px;
  display: block;
  color: transparent;
  text-indent: -99999px;
  position: absolute;
  top: -16px;
  left: 10px;
  z-index: 1;
}

.dateSelector .arrow-left.slick-disabled,
.dateSelector .arrow-right.slick-disabled {
  pointer-events: none;
}

.dateSelector .arrow-left.slick-disabled:before,
.dateSelector .arrow-right.slick-disabled:before {
  border-color: #c6c6c6;
}

.dateSelector .arrow-left:hover,
.dateSelector .arrow-right:hover {
  opacity: 0.4;
}

.dateSelector .arrow-left:before {
  content: "";
  display: block;
  position: absolute;
  top: 15px;
  left: 15px;
  width: 18px;
  height: 18px;
  border-left: 2px solid #000;
  border-bottom: 2px solid #000;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.dateSelector .arrow-right {
  right: 10px;
  left: auto;
}

.dateSelector .arrow-right:before {
  content: "";
  display: block;
  position: absolute;
  top: 15px;
  right: 15px;
  width: 18px;
  height: 18px;
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.calendar-area {
  margin-left: -25px;
  margin-right: -25px;
}

.calendar {
  padding: 0 25px;
}

.calendar .month {
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
}

.calendar table {
  width: 100%;
  table-layout: fixed;
  word-wrap: break-word;
}

.calendar table tr {
  border-bottom: 2px solid #f5f5f5;
}

.calendar table tr th, .calendar table tr td {
  text-align: center;
  padding: 2px 0;
}

.calendar table tr th:last-child, .calendar table tr td:last-child {
  color: #ce0000;
}

.calendar table tr th:nth-last-child(2), .calendar table tr td:nth-last-child(2) {
  color: #06c;
}

.calendar table tr th {
  height: 34px;
  font-size: 1.2rem;
}

.calendar table tr td .date-btn {
  height: 40px;
}

.calendar table tr td .date-btn button {
  height: 100%;
  width: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
  background-color: transparent;
  font-size: 1.6rem;
  padding: 8px 0;
}

.calendar table tr td .date-btn button .stay-price {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  justify-self: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.2rem;
  margin-top: 8px;
  color: #333;
}

.calendar table tr td .date-btn button .stay-price-none {
  display: none;
}

.calendar table tr:last-child {
  border-bottom: none;
}

.calendar .stay-date .date-btn {
  background-color: #4F68C2;
}

.calendar .stay-date .date-btn button {
  color: #fff;
}

.calendar .stay-date .date-btn button .stay-price {
  display: none;
}

.calendar .stay-date .date-btn button .stay-price-none {
  display: none !important;
}

.calendar .stay-date.checkin-date .date-btn {
  border-radius: 4px 0 0 4px;
  overflow: hidden;
}

.calendar .stay-date.checkin-date .date-btn button {
  background-color: #0F0A64;
}

.calendar .stay-date.checkin-date .date-btn button .stay-price-none {
  display: none !important;
}

.calendar .stay-date.checkout-date .date-btn {
  border-radius: 0 4px 4px 0;
  overflow: hidden;
}

.calendar .stay-date.checkout-date .date-btn button {
  background-color: #0F0A64;
}

.calendar .passed-day .date-btn,
.calendar .disabled .date-btn,
.calendar .last-day .date-btn,
.calendar .full-day .date-btn,
.calendar .future-day .date-btn {
  color: #c6c6c6;
}

.calendar .passed-day .date-btn button,
.calendar .disabled .date-btn button,
.calendar .last-day .date-btn button,
.calendar .full-day .date-btn button,
.calendar .future-day .date-btn button {
  cursor: none;
  pointer-events: none;
}

.calendar .passed-day .date-btn button .stay-price,
.calendar .disabled .date-btn button .stay-price,
.calendar .last-day .date-btn button .stay-price,
.calendar .full-day .date-btn button .stay-price,
.calendar .future-day .date-btn button .stay-price {
  color: #c6c6c6;
  display: none;
}

.calendar .passed-day .date-btn button .stay-price-none,
.calendar .disabled .date-btn button .stay-price-none,
.calendar .last-day .date-btn button .stay-price-none,
.calendar .full-day .date-btn button .stay-price-none,
.calendar .future-day .date-btn button .stay-price-none {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  justify-self: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.calendar .holiday .date-btn {
  color: #ce0000;
}

.calendar .holiday.stay-date .date-btn {
  color: #fff;
}

.calendar .holiday.disabled .date-btn, .calendar .holiday.full-day .date-btn, .calendar .holiday.future-day .date-btn {
  color: #c6c6c6;
}

.calendar .holiday.disabled .date-btn button, .calendar .holiday.full-day .date-btn button, .calendar .holiday.future-day .date-btn button {
  cursor: none;
  pointer-events: none;
}

.calendar .holiday.last-day .date-btn, .calendar .holiday.last-day.full-day .date-btn, .calendar .holiday.last-day.future-day .date-btn {
  color: #c6c6c6;
}

.calendar .holiday.last-day .date-btn button, .calendar .holiday.last-day.full-day .date-btn button, .calendar .holiday.last-day.future-day .date-btn button {
  cursor: none;
  pointer-events: none;
}

.index .anchor-bar {
  display: flex;
  position: absolute;
  top: 64px;
  left: 0;
  width: 100%;
  padding: 0 16px 10px;
  overflow-x: auto;
  align-items: center;
  white-space: nowrap;
}
.index .modal-on .anchor-bar {
  display: none;
}
.index .anchor-bar a {
  background: #fff;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 8px;
  padding: 0 14px;
  border-radius: 40px;
  font-weight: bold;
  font-size: 1.2rem;
  color: #0F0A64 !important;
  -webkit-box-shadow: 0 3px 6px rgb(0 0 0 / 15%);
  box-shadow: 0 3px 6px rgb(0 0 0 / 15%);
  border: 1px solid #f5f5f5;
  text-align: center;
}
.index .anchor-bar a.active {
  background: #0F0A64;
  color: #fff !important;
}
.index .anchor-bar::-webkit-scrollbar {
 display: none;
}
.pointer-none {
  pointer-events: none;
}

@media (min-width: 1024px) {
  .popup-position {
    width: 800px;
  }
  .popup-peopleroom {
    width: 254px;
  }
}

@media (min-width: 768px) {
  .popup-position.fixed {
    position: fixed;
    top: 68px;
    z-index: 30;
  }
  .popup-position.fixed .popup-suggest,
  .popup-position.fixed .popup-peopleroom {
    max-height: calc(100vh - 90px);
    overflow-y: auto;
  }
  .detail-page .popup-position.fixed .popup-peopleroom {
    top: -6px;
  }
  .date-btn button:hover {
    color: #fff;
    background-color: #554B98 !important;
    border-radius: 4px;
  }
  .date-btn button:hover .stay-price {
    color: #fff !important;
  }
  .index .anchor-bar {
    display: flex;
    justify-content: center;
    max-width: 800px;
    top: 72px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0 0 30px;
  }
  .index .fixed .anchor-bar {
    display: flex;
    top: 84px;
  }
  .index .anchor-bar a:hover {
    background: #0F0A64;
    color: #fff !important;
  }
}

@media (max-width: 1023px) {
  .index .anchor-bar {
    max-width: 736px;
  }
}

@media (max-width: 767px) {
  .index .key-visual {
    height: 280px;
    margin-bottom: 64px;
  }
  .index .searchBoxArea .searchBox {
    background: #fff;
    width: calc(100vw - 32px);
    height: 48px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    border-radius: 4px;
    border: 1px solid #0F0A64;
  }
  .index .searchBoxArea .searchBox.focus {
    border-color: #0F0A64;
  }
  .index .searchBoxArea .searchBox .box.area {
    width: 100%;
    height: auto;
    border: none;
    border-radius: 0;
  }
  .index .searchBoxArea .searchBox .box.area:hover {
    background: none !important;
  }
  .index .searchBoxArea .searchBox .searchBtn {
    width: 24px;
  }
  .index .searchBoxArea .searchBox .searchBtn.hide {
    display: none;
  }
  .index .searchBoxArea .searchBox .searchBtn button {
    background: transparent url(/stcontents/img/common/icon-search.svg) no-repeat 8px center;
    width: 100%;
    border: none;
  }
  .index .searchBoxArea .searchBox .searchBtn button img {
    display: none;
  }
  .index .searchBoxArea .searchBox .searchBtn:hover {
    border: none;
  }
  .searchBoxArea.modal-on {
    background: #fff;
    position: fixed;
    top: 0;
    padding: 32px 0 0;
    z-index: 41;
  }
  .searchBoxArea.modal-on .searchBox {
    width: calc(100vw - 32px);
    height: 48px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #C6C6C6;
  }
  .searchBoxArea.modal-on .searchBox.focus {
    border-color: #0F0A64;
  }
  .searchBoxArea.modal-on .searchBox .box.area {
    width: 100%;
    height: auto;
    border: none;
    border-radius: 0;
  }
  .searchBoxArea.modal-on .searchBox .box.area:hover {
    background: none !important;
  }
  .searchBoxArea.modal-on .searchBox .searchBtn {
    width: 20px;
  }
  .searchBoxArea.modal-on .searchBox .searchBtn.hide {
    display: none;
  }
  .searchBoxArea.modal-on .searchBox .searchBtn button {
    background: transparent url(/stcontents/img/common/icon-search.svg) no-repeat 4px center;
    width: 100%;
    border: none;
  }
  .searchBoxArea.modal-on .searchBox .searchBtn button img {
    display: none;
  }
  .searchBoxArea.modal-on .searchBox .searchBtn:hover {
    border: none;
  }
  .searchBoxArea.modal-on ~ .popup-position .popup-suggest,
  .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom {
    overflow-y: hidden;
    border-radius: 0;
  }
  .keywordSelectListArea {
    height: 100%;
    overflow-y: auto;
    margin-left: -16px;
    margin-right: -16px;
    padding: 0 16px 64px;
  }
  .keywordSelectListArea .japan {
    display: none;
  }
  .suggest-panel-foot {
    background-color: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px 16px 16px;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.1);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.1);
  }
  .detail-page .searchBoxArea.modal-on,
  .search-from-area .searchBoxArea.modal-on {
    position: relative;
    width: 100%;
    background: #fff;
    top: -20px;
    bottom: auto;
    left: 0;
    padding: 0;
  }
  .detail-page .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom,
  .search-from-area .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom {
    padding: 26px 24px 120px;
    width: 100%;
  }
  .detail-page .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom .peopleroomArea,
  .search-from-area .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom .peopleroomArea {
    height: 100%;
    overflow-y: auto;
  }
  .search-result .searchBoxArea {
    position: static;
    left: 0;
    -webkit-transform: none;
            transform: none;
  }
  .search-result .searchBoxArea.modal-on {
    position: fixed;
    width: 100%;
    background: #fff;
    bottom: auto;
  }
  .search-result .searchBoxArea.modal-on.fixed {
    margin-top: -26px;
  }
  .search-result .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom {
    padding: 26px 0 120px;
    width: 100%;
  }
  .search-result .searchBoxArea.modal-on ~ .popup-position .popup-peopleroom .peopleroomArea {
    height: 100%;
    padding: 0 24px;
    overflow-y: auto;
  }
  .search-result .searchBox {
    position: static;
  }
  .popup-position {
    width: 100%;
    height: 100%;
    top: 0 !important;
    left: 0;
    right: 0;
    bottom: 0;
    position: fixed;
    -webkit-transform: none;
            transform: none;
    z-index: 40;
  }
  .popup-suggest,
  .popup-peopleroom {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: auto;
    padding: 110px 16px 0;
    border-radius: 0;
  }
  .popup-suggest {
    padding-top: 80px;
  }
  .searchBox .box.area.unset .box-name {
    display: none;
  }
  .searchBox .box.checkin-out .box-inner .unset .main {
    font-size: 1.2rem;
  }
  .checkin-sp,
  .checkout-sp {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .checkin-sp .sub,
  .checkout-sp .sub {
    margin-left: 8px;
  }
  .popup-dateSelector {
    position: fixed;
    display: block;
    padding: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 16px 64px;
    overflow-y: auto;
    display: none;
    border-radius: 0;
    touch-action: manipulation;
  }
  .popup-dateSelector.is-show {
    display: block;
  }
  .popup-dateSelector.scrolling .panel-head {
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  }
  .panel-head {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    padding: 45px 16px 0;
    margin-left: -16px;
    margin-right: -16px;
    background-color: #fff;
    -webkit-transition: -webkit-box-shadow .25s;
    transition: -webkit-box-shadow .25s;
    transition: box-shadow .25s;
    transition: box-shadow .25s, -webkit-box-shadow .25s;
  }
  .panel-head .btn-back {
    background: url(/stcontents/img/common/icon-arrow-left-black-2.svg) no-repeat center center;
    background-size: auto;
    width: 30px;
    height: 30px;
    position: fixed;
    top: 10px;
    left: 8px;
    z-index: 1;
  }
  .panel-head .date-box {
    height: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 16px;
    border-bottom: 1px solid #c6c6c6;
    padding: 6px 22px 0 28px;
  }
  .panel-head .date-box .checkin,
  .panel-head .date-box .checkout {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .panel-head .date-box .unset {
    color: #757575;
  }
  .panel-head .date-box .unset .sub {
    display: none;
  }
  .panel-head .date-box .sub {
    color: #757575;
    font-size: 1.2rem;
    margin-left: 4px;
  }
  .panel-head .date-box .stay {
    margin-left: auto;
    margin-right: 48px;
  }
  .panel-head .date-box .border {
    margin: 0 16px;
    color: #757575;
  }
  .panel-head .date-box .reset-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    right: 12px;
  }
  .panel-head .date-box .reset-btn.unset {
    display: none;
  }
  .panel-head .date-box .reset-btn a {
    font-size: 1.6rem;
    color: #757575 !important;
    background-color: transparent;
    padding: 0;
    padding-left: 28px;
    position: relative;
  }
  .panel-head .date-box .reset-btn a::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("../img/common/icon-reset.svg");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  .calendar-area {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
    margin-left: 0;
    margin-right: 0;
  }
  .calendar-head {
    width: 100%;
    height: 34px;
    font-size: 1.2rem;
  }
  .calendar-head tr > th {
    text-align: center;
    padding: 6px;
  }
  .calendar-head tr > th:last-child {
    color: #ce0000;
  }
  .calendar-head tr > th:nth-last-child(2) {
    color: #06c;
  }
  .calendar {
    margin-top: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .calendar:last-child {
    margin-bottom: 24px;
  }
  .calendar .month {
    position: -webkit-sticky;
    position: sticky;
    top: 118px;
    padding: 24px 0 8px;
    background-color: #fff;
    margin-bottom: 40px;
  }
  .calendar table {
    margin-top: -40px;
  }
  .calendar table thead {
    display: none;
  }
  .calendar table tbody tr td .date-btn button .stay-price {
    margin-top: 2px;
  }
  .btn-area {
    background-color: #fff;
    width: auto;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 64px;
    padding: 0 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.1);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.1);
  }
  .btn-area.unset {
    display: none;
  }
  .btn-area > a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .popup-peopleroom-foot {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
  }
  .popup-peopleroom-foot .peopleroom-sum {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: 12px;
  }
  .popup-peopleroom-foot .peopleroom-sum-ttl {
    margin-bottom: 0;
    font-size: 1.2rem;
  }
  .popup-peopleroom-foot .peopleroom-sum-detail {
    font-size: 1.2rem;
  }

  .index .searchBoxArea {
    width: 100%;
  }

  .index .anchor-bar {
    max-width: 100%;
    top: auto;
    bottom: -48px;
    padding-top: 8px;
    padding-bottom: 8px;
    background: #0F0A64;
  }

  .index .anchor-bar.fixed {
    position: fixed;
    top: 48px;
    bottom: auto;
    z-index: 30;
  }

  .index .anchor-bar a {
    background: rgba(255, 255, 255, 0.70);
    border-color: transparent;
  }

  .index .anchor-bar a.active {
    border-color: #FFFFFF;
  }


}

.sp-hub-modal {
  display: none;
}

@media (max-width: 767px) {
  .sp-hub-modal {
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    color: #333;
    overflow-y: auto;
  }
  .sp-hub-modal.show {
    display: block;
  }
  .sp-hub-modal .sp-hub-modal-inner {
    padding-top: 48px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 120px;
  }
  .sp-hub-modal .btn-hub-close {
    background: none;
    display: block !important;
    position: absolute;
    top: 10px;
    left: auto;
    right: 16px;
    width: 30px;
    height: 30px;
  }
  .sp-hub-modal .btn-hub-close img {
    width: 30px;
  }
  .sp-hub-modal .box.area, .sp-hub-modal .box.checkin-out {
    border: 1px solid #C6C6C6;
    border-radius: 4px;
    padding: 0 16px;
    height: 4.6rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    white-space: nowrap;
    overflow: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .sp-hub-modal .box.area::-webkit-scrollbar, .sp-hub-modal .box.checkin-out::-webkit-scrollbar {
    display: none;
  }
  .sp-hub-modal .box.area .main, .sp-hub-modal .box.checkin-out .main {
    font-size: 1.6rem;
  }
  .sp-hub-modal .box.area .sub, .sp-hub-modal .box.checkin-out .sub {
    display: none;
    font-size: 1.1rem;
    color: #757575;
  }
  .sp-hub-modal .box.area.unset .main, .sp-hub-modal .box.checkin-out.unset .main {
    color: #757575;
  }
  .sp-hub-modal .box.checkin-out .box-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
  }
  .sp-hub-modal .box.checkin-out .border {
    margin: 0 20px;
    color: #757575;
  }
  .sp-hub-modal .box.checkin-out .checkin-sp .sub,
  .sp-hub-modal .box.checkin-out .checkout-sp .sub {
    margin-left: 8px;
  }
  .sp-hub-modal .box.peopleroom {
    padding: 0;
    border: none;
    height: auto;
  }
  .sp-hub-modal .box.peopleroom .box-inner {
    width: 100%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .sp-hub-modal .box.peopleroom .box-inner .box-name {
    margin-bottom: 0;
  }
  .sp-hub-modal .box.peopleroom .main {
    font-size: 1.2rem;
    color: #333;
  }
  .sp-hub-modal .box.peopleroom .people-breakdown {
    color: #757575;
  }
  .sp-hub-modal .box.peopleroom .people-breakdown-child.unset {
    display: none;
  }
  .sp-hub-modal .input-name {
    margin-top: 24px;
  }
  .sp-hub-modal .searchBoxArea.modal-on {
    padding-top: 48px;
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    -webkit-transform: none;
            transform: none;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox {
    width: calc(100vw - 32px);
    height: auto;
    display: block;
    border: none;
    padding-bottom: 16px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .searchBtn {
    display: none;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box-inner {
    padding: 0 16px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box-inner .box-name {
    display: none !important;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .input-name {
    margin-top: 24px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.checkin-out .box-inner {
    padding: 0 16px;
    border: none;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"],
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"]::-webkit-input-placeholder,
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box .main {
    font-size: 1.6rem;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"],
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"]:-ms-input-placeholder,
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box .main {
    font-size: 1.6rem;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"],
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"]::-ms-input-placeholder,
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box .main {
    font-size: 1.6rem;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"],
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box input[type="text"]::placeholder,
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box .main {
    font-size: 1.6rem;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.area,
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.checkin-out,
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .peopleroom {
    display: block;
    width: 100%;
    border: 1px solid #C6C6C6;
    border-radius: 4px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.area {
    border-radius: 4px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.area input {
    height: 46px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.area.focus {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    border-bottom-color: #0f0a64;
    height: 48px;
  }
  .sp-hub-modal .searchBoxArea.modal-on .searchBox .box.area.focus .box-inner {
    padding: 0 32px 0 8px;
  }
  .sp-hub-modal .searchBox .box.checkin-out .box-inner {
    -webkit-box-pack: unset;
    -webkit-justify-content: unset;
        -ms-flex-pack: unset;
            justify-content: unset;
  }
  .sp-hub-modal .searchBox .box.checkin-out .box-inner .border {
    margin: 0 20px;
  }
  .sp-hub-modal .popup-position {
    display: block !important;
    height: auto;
    position: relative;
    top: inherit;
    left: inherit;
  }
  .sp-hub-modal .popup-suggest {
    top: inherit;
    position: relative !important;
    margin-bottom: 50px;
    padding: 0px 16px 72px;
  }
  .sp-hub-modal .popup-peopleroom {
    display: block !important;
    width: auto;
    height: auto;
    max-height: none !important;
    position: static;
    border: none;
    padding: 0;
    border-radius: 0;
    margin-top: 16px;
    margin-left: -16px;
    margin-right: -16px;
    padding: 0 16px;
    overflow-y: unset !important;
  }
  .sp-hub-modal .popup-peopleroom .spinner-area input:first-of-type {
    margin-right: 8px;
  }
  .sp-hub-modal .popup-peopleroom .spinner-area input:last-of-type {
    margin-left: 8px;
  }
  .sp-hub-modal .popup-peopleroom .spinner-area input.disabled {
    background-color: #c6c6c6;
  }
  .sp-hub-modal .input-box input[type='number'] {
    font-size: 2rem;
    width: 24px !important;
  }
  .sp-hub-modal .float-bar2 {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px 16px 16px;
    background-color: #fff;
  }
  .sp-hub-modal .float-bar2.shadow {
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
  }
  .sp-hub-modal .peopleroomArea.peopleroom-on {
    border-top: 4px solid #f5f5f5;
  }
  .sp-hub-modal .peopleroom .box-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: 8px;
  }
  .sp-hub-modal .modalbox-room {
    border-bottom: 2px solid #F5F5F5;
  }
  .sp-hub-modal .peopleroom .peopleroom-num{
    display: inline !important;
  }
  .sp-hub-modal .box.area,
  .sp-hub-modal .checkin-out-wrap {
    display: none !important;
  }
  .sp-hub-modal .popup-peopleroom {
    margin-top: 0 !important;
  }
  .sp-hub-modal .peopleroomArea.peopleroom-on {
    border: none;
  }
  .sp-hub-modal .sp-hub-modal .popup-peopleroom .modal-room-title {
    padding-top: 0;
  }

}

@media (max-width: 360px) {
  .sp-hub-modal .font-x-large {
    font-size: 1.6rem;
  }
}
@media (max-width: 330px) {
  .panel-head .date-box {
    padding-left: 14px;
    font-size: 1.3rem;
  }
}

.searchBox.detail {
  border-left: 1px solid #0F0A64;
  border-right: 1px solid #0F0A64;
}

.searchBox.detail .box.area {
  display: none !important;
}

.searchBox.detail .box.checkin-out,
.searchBox.detail .box.peopleroom {
  width: 50%;
}

.detail-page .searchBoxArea {
  position: relative;
  bottom: inherit;
}

.detail-page .popup-position {
  position: relative;
  top: 0;
}

.detail-page .popup-position .popup-peopleroom {
  width: calc(50% + 31px);
}

.detail-page .calendar table tr td {
  padding: 8px 0;
}

.detail-page .calendar table tr td .calendar-date.stay-date .date-btn button {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.detail-page .calendar table tr td .date-btn {
  height: 70px;
}

.detail-page .calendar table tr td .date-btn button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0;
}

@media (max-width: 767px) {
  .searchBox.detail .box.checkin-out,
  .searchBox.detail .box.peopleroom {
    display: table-cell;
  }
  .searchBox.detail .searchBtn {
    display: none !important;
  }
  .searchBox.detail .box-inner .box-name {
    display: block;
  }
  .detail-page .popup-position {
    background: #fff;
    z-index: 40;
  }
  .detail-page .popup-position .popup-peopleroom {
    top: 0;
    left: 0;
    right: 0;
    width: auto;
    padding-top: 32px;
  }
  .detail-page .month {
    margin-bottom: calc( (78 / 800) * 100vh);
  }
  .detail-page .calendar table {
    margin-top: calc(((78 / 800) * 100vh) * -1);
  }
}

.popup-position.detail {
  width: 796px;
  position: absolute;
  top: 100%;
  margin: 0 auto;
}
.popup-position.detail .popup-checkin {
  position: absolute;
  top: -1px;
  left: 0;
}
.popup-position.detail .popup-checkout {
  position: absolute;
  top: -1px;
  left: 126px;
}
.popup-position.detail .popup-peopleroom {
  position: absolute;
  top: -1px;
  left: 292px;
}
.popup-position.detail .popup-meal {
  position: absolute;
  top: -1px;
  right: 132px;
}

.popup-peopleroom {
  width: 264px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.popup-peopleroom .select-dropdown ul {
  position: static;
}

.popup-peopleroom .peopleroomArea .modalbox-room,
.popup-peopleroom .peopleroomArea .modal-room-title {
  display: none;
}

.popup-peopleroom .peopleroomArea.peopleroom-on .modal-room-title {
  display: block;
}

.popup-peopleroom .peopleroomArea.peopleroom-on .modalbox-room {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.peopleroom .peopleroom-num,
.peopleroom .room-num {
  display: none !important;
}

.peopleroom.peopleroom-on .peopleroom-num,
.peopleroom.peopleroom-on .room-num {
  display: inline !important;
}

.modalbox-title {
  padding: 16px 0 0;
}

.modalbox-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 12px 0 16px;
}

.modalbox-container + .modalbox-container {
  padding-top: 0;
}

.popup-position .spinner-area input.disabled {
  background-color: #c6c6c6;
}

.popup-position .spinner-area input:first-of-type {
  margin-right: 10px;
}

.popup-position .spinner-area input:last-of-type {
  margin-left: 10px;
}

.popup-position .control-area .spinner-area input:first-of-type {
  margin-right: 8px;
}

.popup-position .control-area .spinner-area input:last-of-type {
  margin-left: 8px;
}

.popup-position .control-area .spinner-area .min.disabled {
  background: #C6C6C6;
  pointer-events: none;
}

.popup-position .control-area .spinner-area .add.disabled {
  background: #C6C6C6;
  pointer-events: none;
}

.modalbox-room {
  border-bottom: 4px solid #F5F5F5;
}

.modalbox-itemname {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.modalbox_detail {
  margin-bottom: 30px;
}

@media (min-width: 1024px) {
  .searchBox .box input[type="text"] {
    font-size: 1.6rem;
  }
  .searchBox .box input[type="text"]::-webkit-input-placeholder {
    font-size: 1.6rem;
  }
  .searchBox .box input[type="text"]:-ms-input-placeholder {
    font-size: 1.6rem;
  }
  .searchBox .box input[type="text"]::-ms-input-placeholder {
    font-size: 1.6rem;
  }
  .searchBox .box input[type="text"]::placeholder {
    font-size: 1.6rem;
  }
  .searchBox .box .main {
    font-size: 1.6rem;
  }
  .searchBox .box.checkin-out .main .date.unset {
    font-size: 1.4rem;
  }
  .popup-peopleroom {
    width: 250px;
  }
}

@media (max-width: 767px) {
  .searchBox.selected {
    background: #fff;
  }
  .searchBox.selected .box.checkin-out,
  .searchBox.selected .box.peopleroom {
    display: table-cell;
  }
  .searchBox.selected .box-inner {
    padding: 0 8px !important;
  }
  .searchBox.selected .sub {
    display: none !important;
  }
  .searchBox.selected .box.area .box-name {
    display: none;
  }
  .searchBox.selected .box.checkin-out {
    background: #f5f5f5;
    width: 56px;
    text-align: center;
    letter-spacing: 0;
  }
  .searchBox.selected .box.checkin-out .box-inner {
    height: 100%;
    padding: 2px 0;
    border-left: none;
    border-right: none;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .searchBox.selected .box.checkin-out .box-inner .border {
    display: none;
  }
  .searchBox.selected .box.checkin-out .main {
    font-size: 1.2rem;
  }
  .searchBox.selected .box.checkin-out .js-checkin,
  .searchBox.selected .box.checkin-out .js-checkout {
    width: 100% !important;
  }
  .searchBox.selected .box.checkin-out .js-checkin .js-checkin-display.unset {
    font-size: 1rem;
  }
  .searchBox.selected .box.checkin-out .js-checkin .js-checkin-display.unset:before {
    background: url(/stcontents/img/common/icon-calendar.svg) no-repeat center 0;
    background-size: 14px;
    content: "";
    display: block;
    width: 100%;
    height: 14px;
    margin-top: 2px;
  }
  .searchBox.selected .box.checkin-out .js-checkout {
    display: none;
  }
  .searchBox.selected .box.checkin-out.selected {
    background: #fff;
    width: 76px;
    text-align: right;
  }
  .searchBox.selected .box.checkin-out.selected .box-inner {
    border-left: 1px solid #c6c6c6;
    padding-left: 4px !important;
  }
  .searchBox.selected .box.checkin-out.selected .box-inner > div {
    width: auto;
  }
  .searchBox.selected .box.checkin-out.selected .checkin-out-selected {
    font-size: 1.2rem;
    color: #333;
  }
  .searchBox.selected .box.checkin-out.selected .js-checkout {
    display: block;
  }
  .searchBox.selected .box.checkin-out.selected .js-checkout .js-checkout-display:before {
    content: "~";
  }
  .searchBox.selected .box.peopleroom {
    width: 56px;
    white-space: nowrap;
    border-right: 1px solid #0F0A64;
    border-radius: 0 4px 4px 0;
  }
  .searchBox.selected .box.peopleroom.unset {
    background: #f5f5f5;
  }
  .searchBox.selected .box.peopleroom.unset .box-inner {
    border-left: 1px solid #fff;
  }
  .searchBox.selected .box.peopleroom.unset .box-name {
    display: none;
  }
  .searchBox.selected .box.peopleroom.unset .people-num,
  .searchBox.selected .box.peopleroom.unset .room-num {
    display: inline;
    font-size: 1rem;
  }
  .searchBox.selected .box.peopleroom.unset .searchTotalNum {
    font-size: 1rem;
  }
  .searchBox.selected .box.peopleroom.unset .searchTotalNum::before {
    background: url(/stcontents/img/common/icon-people.svg) no-repeat center 0;
    background-size: 14px;
    content: "";
    display: block;
    width: 100%;
    height: 14px;
    margin-top: 4px;
    margin-bottom: 2px;
  }
  .searchBox.selected .box.peopleroom .box-inner {
    height: 100%;
    border-left: 1px solid #c6c6c6;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .searchBox.selected .box.peopleroom .main {
    font-size: 1rem;
    letter-spacing: 0;
  }
  .searchBox.selected .box.peopleroom .people-num {
    font-size: 1.2rem;
    display: block;
  }
  .searchBox.selected .box.peopleroom .room-num {
    display: block;
    color: #757575;
  }
  .searchBox.selected .box.peopleroom .searchTotalNum.unset {
    font-size: 1rem;
  }
  .searchBox.selected .box.peopleroom .searchTotalNum.unset:before {
    background: url(/stcontents/img/common/icon-people.svg) no-repeat center 0;
    background-size: 14px;
    content: "";
    display: block;
    width: 100%;
    height: 14px;
    margin-top: 4px;
    margin-bottom: 2px;
  }
  .searchBox.selected .box.peopleroom.selected {
    background: #fff;
  }
  .searchBox.selected .box.peopleroom.selected .box-inner {
    border-left: 1px solid #c6c6c6;
  }
  .searchBox.selected .box.peopleroom.selected .main {
    text-align: center;
  }
  .searchBox.selected .box.peopleroom.selected .main .searchTotalNum,
  .searchBox.selected .box.peopleroom.selected .main #searchTotalNumOfRoom {
    display: block;
  }
  .searchBox.selected .box.peopleroom.selected .main .searchTotalNum {
    font-size: 1.2rem;
  }
  .searchBox.selected .searchBtn {
    display: none;
  }
  .searchBoxArea.modal-on .searchBox.selected .peopleroom,
  .searchBoxArea.modal-on .searchBox.selected .checkin-out {
    display: none;
  }
  .searchBoxArea.modal-on .searchBox.selected .searchBtn {
    display: block;
  }
}

.area-search-box .searchBox {
  overflow: visible;
  z-index: 10;
}

.area-search-box .searchBox .box {
  overflow: visible;
}

.area-search-box .searchBox .box input[type="text"] {
  background: #fff url(/stcontents/img/common/icon-arrow-bottom-gray-2.svg) no-repeat right 18px center;
  border-left: 1px solid #C6C5C5;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

.area-search-box .searchBox .box input[type="text"]::-webkit-input-placeholder {
  color: #C6C6C6;
}

.area-search-box .searchBox .box input[type="text"]:-ms-input-placeholder {
  color: #C6C6C6;
}

.area-search-box .searchBox .box input[type="text"]::-ms-input-placeholder {
  color: #C6C6C6;
}

.area-search-box .searchBox .box input[type="text"]::placeholder {
  color: #C6C6C6;
}

.area-search-box .searchBox .box .box-inner,
.area-search-box .searchBox .box .main {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
}

.area-search-box .searchBox .box .main {
  border-right: 1px solid #c6c6c6;
}

.area-search-box .searchBox .box.select-area .main {
  border-right: none !important;
}

.area-search-box .searchBox .box.active .main {
  border-color: #0F0A64;
}

.area-search-box .searchBox .select-dropdown span.select-frame {
  padding: 0 32px 0 16px;
  height: 58px;
  line-height: 58px;
  border-bottom: none;
  color: #C6C6C6;
}

.area-search-box .searchBox .select-dropdown div {
  top: 50%;
  margin-top: -6px;
}

.area-search-box .searchBox .select-dropdown div:before, .area-search-box .searchBox .select-dropdown div:after {
  width: 10px;
  right: 16px;
}

.area-search-box .searchBox .select-dropdown div:before {
  margin-right: 6px;
}

.area-search-box .searchBox .select-dropdown ul {
  top: 54px;
  border-radius: 0 4px 4px 0;
}

.area-search-box .searchBox .select-dropdown ul li {
  padding-left: 14px;
  border: none;
  border-bottom: 1px solid #F5F5F5;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.area-search-box .searchBox .select-dropdown ul li:first-child {
  height: 46px;
  padding-top: 6px;
}

.area-search-box .searchBox .select-dropdown ul li:hover {
  background-color: #F5F5F5;
}

.area-search-box .searchBox .active input[type="text"] {
  background: #fff url(/stcontents/img/common/icon-arrow-bottom-2.svg) no-repeat right 18px center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-right: 40px;
  color: #333;
}

.area-search-box .searchBox .active input[type="text"]::-webkit-input-placeholder {
  color: #333;
}

.area-search-box .searchBox .active input[type="text"]:-ms-input-placeholder {
  color: #333;
}

.area-search-box .searchBox .active input[type="text"]::-ms-input-placeholder {
  color: #333;
}

.area-search-box .searchBox .active input[type="text"]::placeholder {
  color: #333;
}

.area-search-box .searchBox .active .select-dropdown span.select-frame {
  color: #333;
}

.area-search-box .searchBox .disabled {
  pointer-events: none;
}

.area-search-box .searchBox .disabled div:before, .area-search-box .searchBox .disabled div:after {
  background: #c6c6c6;
}

.sp-area-modal.modal-sort .modal-sort-area {
  display: block !important;
}

.sp-area-modal.modal-sort .inner {
  padding-top: 52px;
}

.sp-area-modal.modal-sort .scroll {
  height: 100%;
  padding-bottom: 160px;
}

.sp-area-modal.modal-sort .list-title {
  display: none;
  height: 48px;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 24px;
  margin: 0 16px 24px;
  padding: 3px 8px;
  border: 1px solid #0F0A64;
  border-radius: 4px;
  cursor: pointer;
  line-height: 40px;
  color: #c6c6c6;
}

.sp-area-modal.modal-sort .list-title:after {
  background: #fff url(/stcontents/img/common/icon-arrow-bottom-2.svg) no-repeat right center;
  background-size: 100%;
  content: "";
  width: 16px;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  right: 16px;
  -webkit-transform-origin: center;
          transform-origin: center;
}

.sp-area-modal.modal-sort .list-title.active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.sp-area-modal.modal-sort .list-title:first-of-type {
  display: block;
}

.sp-area-modal.modal-sort .list-title.selected {
  color: inherit;
}

.sp-area-modal.modal-sort .btn-list li,
.sp-area-modal.modal-sort .btn-list .sort-element {
  width: 100%;
  float: none;
  margin: 0;
}

.sp-area-modal.modal-sort .btn-list .sort-element {
  display: block;
  padding: 16px 16px;
  border: none;
  border-bottom: 1px solid #F5F5F5;
  border-radius: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.sp-area-modal.modal-sort .btn-list .sort-element.active {
  background-color: #F5F5F5;
  border-color: #fff;
  padding-top: 16px;
  color: #333;
}

.sp-area-modal.modal-sort .btn-list li:first-of-type .sort-element {
  padding-top: 0;
}

.sp-area-modal.modal-sort .btn-list li:first-of-type .sort-element.active {
  padding-top: 16px;
}

.sp-area-modal.modal-sort .prefecture {
  display: none;
}

.sp-area-modal.modal-sort .prefecture .middle-title {
  background: none;
  padding: 16px 0;
  margin-left: 8px;
  color: inherit;
  margin-bottom: 0;
}

.sp-area-modal.modal-sort .largearea_group-wrap {
  display: none;
}

.sp-area-modal.modal-sort .submit-box {
  background: #fff;
  width: 100%;
  position: fixed;
  left: 0;
  bottom: 0;
  padding: 8px 16px 24px;
  z-index: 1;
}

.sp-area-modal.modal-sort .submit-box > div {
  width: calc(50% - 8px);
  margin: 0 4px;
}

.sp-area-modal.modal-sort .submit-box > div button,
.sp-area-modal.modal-sort .submit-box > div span {
  width: 100%;
}

.sp-area-modal.modal-sort .submit-box > div:only-child {
  width: 100%;
  margin: 0;
}

.sp-area-modal.modal-sort .submit-box > div:only-child button {
  background: #0F0A64;
  color: #fff;
}

.sp-area-modal.modal-sort .submit-box.disabled > div {
  pointer-events: none;
}

.sp-area-modal.modal-sort .submit-box.disabled > div button,
.sp-area-modal.modal-sort .submit-box.disabled > div span {
  background: #C6C6C6;
  border: 1px solid #C6C6C6;
  color: #fff;
  pointer-events: none;
}

.sp-area-modal.modal-sort .submit-box.disabled > div:only-child button {
  background: #CFCEDF !important;
  border-color: #CFCEDF !important;
}

.sp-area-modal.modal-sort .submit-box.active .btn-area-select {
  display: none;
}

.sp-area-modal.modal-sort .submit-box.active .btn-submit {
  width: 100%;
  margin: 0;
}

.sp-area-modal.modal-sort .submit-box.active .btn-submit button {
  background-color: #0f0a64;
  border: 1px solid #0F0A64;
  color: #fff;
}

@media (min-width: 768px) {
  .area-search-box .searchBox select {
    padding: 0 10px 0 24px;
  }
  .area-search-box .searchBox .box {
    border-top: 1px solid #C6C6C6;
    border-bottom: 1px solid #C6C6C6;
  }
  .area-search-box .searchBox .box:first-child {
    border-top: 1px solid #0F0A64;
    border-bottom: 1px solid #0F0A64;
  }
  .area-search-box .searchBox .box:first-child .main {
    border-right: 1px solid #0F0A64;
  }
  .area-search-box .searchBox .box:first-child .main span.select-frame {
    color: #333;
  }
  .area-search-box .searchBox .searchBtn:not(.active):hover {
    border: none;
  }
  .area-search-box .searchBox .searchBtn:not(.active) button {
    background: #C6C6C6;
    border: none;
    pointer-events: none;
  }
  .area-search-box .searchBox .select-area {
    width: 300px;
    border-right: none;
  }
  .area-search-box .searchBox .active + .box {
    border-top: 1px solid #0F0A64;
    border-bottom: 1px solid #0F0A64;
  }
  .area-search-box .searchBox .active + .box .main {
    border-right: 1px solid #0F0A64;
  }
  .area-search-box .searchBox .active + .box input[type="text"],
  .area-search-box .searchBox .active + .box select {
    border-left: 1px solid #0F0A64;
  }
  .area-search-box .searchBox .active + .box span.select-frame {
    color: #333;
  }
  .area-search-box .searchBox .active + .active input[type="text"],
  .area-search-box .searchBox .active + .active select {
    border-left: 1px solid #C6C5C5;
  }
}

@media (max-width: 767px) {
  .area-search-box .searchBox {
    width: calc(100vw - 32px);
    display: block;
  }
  .area-search-box .searchBox .select-region {
    display: block;
  }
  .area-search-box .searchBox .box:first-child {
    display: block;
    border-radius: 4px 4px;
    overflow: hidden;
  }
  .area-search-box .searchBox .box input {
    padding: 0 8px;
    display: block;
    font-size: 1.6rem;
    line-height: 44px;
    border: none;
    cursor: pointer;
  }
  .area-search-box .searchBox .active input[type="text"] {
    border: none;
  }
}

.search-box-col2 {
  top: inherit;
  bottom: 40px;
  text-align: left;
}

.search-box-col2 .box {
  width: 50% !important;
  display: table-cell !important;
}

.search-box-col2 .box .box-name {
  display: block;
}

.search-box-col2 .box-inner {
  -webkit-box-pack: unset !important;
  -webkit-justify-content: unset !important;
      -ms-flex-pack: unset !important;
          justify-content: unset !important;
}

.search-box-col2 .checkin-out .border {
  margin: 0 10px !important;
}

.search-box-col2 .checkin,
.search-box-col2 .checkout {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.search-box-col2 .checkin .main + .sub,
.search-box-col2 .checkout .main + .sub {
  margin-left: 8px;
}

.search-box-col2 .searchBtn {
  width: 60px !important;
}

@media (max-width: 767px) {
  .search-box-col2 {
    bottom: 24px;
  }
  .search-box-col2 .searchBox {
    width: calc(100vw - 24px);
  }
  .search-box-col2 .searchBtn {
    width: 48px !important;
  }
  .search-box-col2 .box .box-inner {
    padding: 0 10px !important;
  }
  .search-box-col2 .box .main {
    font-size: 1.2rem;
  }
  .search-box-col2 .box .box-name {
    font-size: 1rem !important;
  }
}

@media (max-width: 360px) {
  .common-modal.calendar-modal .panel-head .date-box {
    padding: 6px 22px 0 16px !important;
    font-size: 1.2rem !important;
  }
  .search-box-col2 .box .main {
    font-size: 1rem;
  }
  .search-box-col2 .box.checkin-out .box-inner .unset .main {
    font-size: 1rem !important;
  }
  .search-box-col2 .box.checkin-out .box-name {
    display: none !important;
  }
  .btn-anker {
    padding: 0 8px;
  }
}

.ranking-area {
  padding: 24px 0 8px 0;
  overflow: hidden;
}

.year-ranking .entry-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.year-ranking .entry {
  background: #FFF;
  width: 32%;
  height: 280px;
  margin-right: 2%;
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 8px;
  overflow: hidden;
}

.year-ranking .entry > a {
  display: block;
  color: #333;
}

.year-ranking .entry .info {
  width: auto;
  padding: 8px 16px 16px;
}

.year-ranking .entry .info .entry-header .left .icon img {
  width: 40px;
  margin-left: 16px;
}

.year-ranking .entry .info .name {
  margin-bottom: 0px;
  padding-top: 0;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.year-ranking .entry .info .grade {
  height: 20px;
  margin-bottom: 8px;
  line-height: 1;
}

.year-ranking .entry .info .grade img {
  height: 20px;
  vertical-align: middle;
}

.year-ranking .entry .info .grade img.casual,
.year-ranking .entry .info .grade img.museum {
  height: 12px;
}

.year-ranking .entry .info .grade img.star {
  margin-right: 3px;
}

.year-ranking .entry .thumb {
  width: auto;
  height: 140px;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  position: relative;
  overflow: hidden;
  display: block;
  margin-bottom: 0;
}

.year-ranking .entry .thumb img {
  height: 100%;
  width: 100%;
  vertical-align: bottom;
  -o-object-fit: cover;
     object-fit: cover;
}

.year-ranking .entry .thumb a {
  vertical-align: text-bottom;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.year-ranking .entry:last-child {
  margin-right: 0;
}

.year-ranking .entry .price-box .tax {
  font-size: 1.2rem;
}

.year-ranking .entry .month {
  font-size: 1.6rem;
}

.year-ranking .entry a {
  text-decoration: none;
}

.year-ranking .entry .info .entry-header .left {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0;
}

.year-ranking .entry .info .area {
  overflow: hidden;
  white-space: nowrap;
  margin-bottom: 4px;
  text-overflow: ellipsis;
  text-align: left;
  font-size: 1.2rem;
  color: #757575;
}

.year-ranking .entry .info .area a:hover,
.year-ranking .entry .info .name a:hover {
  text-decoration: underline;
}

.year-ranking .entry .info .entry-header {
  border: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.year-ranking .entry .price-box {
  margin-top: 16px;
  text-align: right;
  line-height: 1.3;
}

.year-ranking .entry .price-box .room {
  margin-right: 8px;
  font-size: 1.2rem;
}

.year-ranking .entry .price-box .price {
  font-weight: bold;
  font-size: 1.6rem;
}

.year-ranking .entry .price-box .tax {
  white-space: nowrap;
  font-size: 1rem;
}

.year-ranking .entry.more-banner {
  border: none;
}

.year-ranking .entry.more-banner a {
  background: #0F0A64;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  padding: 0 2px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.year-ranking .entry.more-banner img {
  width: 200px;
}

.year-ranking .entry.more-banner .more {
  text-align: right;
  font-size: 1.2rem;
  margin-top: 16px;
  color: #fff;
}

.year-ranking .entry.more-banner .more::after {
  background: url("/stcontents/img/common/icon-navigate-right-white.svg") no-repeat 0 0;
  background-size: 100%;
  content: "";
  width: 26px;
  height: 26px;
  display: inline-block;
  vertical-align: middle;
  margin: -1px -4px 0 7px;
}

.year-ranking .bnr-more a {
  background-image: url(/stcontents/img/common/bg-ranking.png);
  width: 100%;
  height: 100%;
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 26px 26px;
  color: #fff;
}

.year-ranking .bnr-more a img {
  margin: 0 auto 16px;
}

.year-ranking .bnr-more a .text {
  line-height: 1.5;
  font-size: 1.6rem;
}

.year-ranking .bnr-more a .text:after {
  background: url(/stcontents/img/common/icon-arrow-right-white-2.svg) no-repeat 0 0;
  background-size: contain;
  content: "";
  display: inline-block;
  width: 8px;
  height: 12px;
  vertical-align: middle;
  margin-left: 8px;
}

.recommend-sec.year-ranking .js-scroll-box {
  padding: 0 0 24px;
}
.recommend-sec.year-ranking .entry {
  width: 352px;
  height: 200px;
}

.recommend-sec.year-ranking .entry a,
.recommend-sec.year-ranking .entry .thumb {
  width: 100%;
  height: 100%;
}

.recommend-sec.year-ranking .entry .info {
  background: linear-gradient(to bottom, transparent,rgba(0,0,0,0.6));
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  text-shadow: 0 0 1px #000;
}

.recommend-sec.year-ranking .entry .info .name,
.recommend-sec.year-ranking .entry .info .area,
.recommend-sec.year-ranking .entry .info .price-box {
  color: #fff;
}

.recommend-sec.year-ranking .bnr-more a {
  background: none;
  color: inherit;
}
.recommend-sec.year-ranking .bnr-more a .text:after {
  background: url(/stcontents/img/common/icon-arrow-right.svg) no-repeat 0 0;
  background-size: contain;
}

.recommend-sec.year-ranking .bnr-more a .text-link:after {
  background: url(/stcontents/img/common/icon-text-link.svg) no-repeat 0 center;
}
.recommend-sec.year-ranking .info .grade img {
  height: 16px;
  filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.6));
  margin: 0;
}
.recommend-sec.year-ranking .info .grade img[alt="CASUAL"],
.recommend-sec.year-ranking .info .grade img[alt="MUSEUM"] {
  background: rgba(0,0,0,0.1);
  border: 1px solid #fff;
  border-radius: 2px;
  padding: 0px 3px;
  filter: none;
}

.plan-sec {
  margin-top: 20px;
}
.plan-sec.year-ranking .entry-list {
  margin: 16px 0 64px;
}
.plan-sec.year-ranking .entry {
  width: 358px;
  height: 310px;
  box-shadow: none;
}
.plan-sec.year-ranking .entry .thumb {
    width: 90%;
    height: 100%;
}
.plan-sec.year-ranking .entry .thumb img {
    object-fit: contain;
    object-position: left;
}
.plan-sec.year-ranking .entry .info {
  background: rgba(0,0,0,0.7);
  width: 88%;
  padding-right: 40px;
  border-radius: 8px;
  color: #fff;
  position: absolute;
  bottom: 0;
  right: 0;
}
.plan-sec.year-ranking .entry .info:after {
  content: "";
  width: 12px;
  height: 12px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%) rotate(-45deg);
}
.plan-sec.year-ranking .entry .info .text {
  display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 4;
   overflow: hidden;
  margin-bottom: 16px;
}

.plan-sec.year-ranking .entry .info .name,
.plan-sec.year-ranking .entry .info .area {
  text-align: right;
}
.plan-sec.year-ranking .entry .info .name {
    font-size: 1.2rem;
    font-weight: 900;
}
.plan-sec.year-ranking .entry .info .area {
    margin-top: 8px;
    color: #fff;
}
.plan-sec.year-ranking .rigt-img .entry .thumb {
  float: right;
}
.plan-sec.year-ranking .rigt-img .entry .info {
  right: inherit;
  left: 0;
}

@media screen and (max-width: 1023px) {
  .year-ranking .bnr-more span > img {
    max-width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .recommend-sec.year-ranking .js-scroll-box {
    padding: 0 16px 0 0;
  }
  .recommend-sec.year-ranking .entry {
    width: 320px;
    flex-shrink: 0;
  }
  .recommend-sec.year-ranking .bnr-more {
    width: 200px;
    min-width: 0;
  }
  .recommend-sec.year-ranking .js-scroll-box,
  .plan-sec.year-ranking .js-scroll-box {
    margin: 0 -16px;
  }
  .recommend-sec.year-ranking .js-scroll-box {
    padding-left: 16px;
  }
}

@media (min-width: 768px) {
  .ranking-area {
    padding: 40px 0;
  }
  .year-ranking .entry {
    height: 300px;
    margin-right: 2%;
  }
  .year-ranking .entry .thumb {
    width: auto;
    height: 170px;
  }
  .year-ranking .entry > a:hover {
    opacity: .7;
  }
  .recommend-sec.year-ranking .entry {
    width: 352px;
  }
}

@media (min-width: 1024px) {
  .year-ranking .entry {
    height: 300px;
    margin-right: 2%;
  }
  .year-ranking .entry .thumb {
    width: auto;
    height: 170px;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .year-ranking .entry .price-box {
    margin-top: 8px;
  }
}

@media (min-width: 1280px) {
  .year-ranking .entry {
    width: 256px;
    margin-right: 32px;
  }
  .year-ranking .entry .info .entry-header .left .icon img {
    margin-left: 16px;
  }
  .year-ranking .text-link-gray {
    margin-top: 32px;
  }
}

@media (max-width: 767px) {
  .year-ranking .entry-list {
    width: calc(100% + 32px);
    margin: 0 -16px;
    padding: 0 16px 16px;
    overflow-x: scroll;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .year-ranking .entry-list::-webkit-scrollbar {
    display: none;
  }
  .year-ranking .entry {
    min-width: 256px;
    height: 266px;
  }
  .year-ranking .entry .info .entry-header .left .icon img {
    width: 30px;
  }
  .year-ranking .bnr-more a {
    background-image: url(/stcontents/img/common/bg-ranking-sp.png);
  }

  .plan-sec.year-ranking .entry-list {
    margin: 16px 0 24px;
  }
  .plan-sec.year-ranking .entry {
    min-width: 300px;
    height: 300px;
  }
  .plan-sec.year-ranking .entry .thumb img {
    width: 80%;
  }
  .plan-sec.year-ranking .rigt-img .entry .thumb {
    width: 100%;
    text-align: right;
  }
  .plan-sec.year-ranking .entry .info {
    right: 16px;
    padding-right: 30px;
  }
  .plan-sec.year-ranking .entry .info:after {
    width: 10px;
    height: 10px;
    right: 12px;
  }
  .plan-sec.year-ranking .rigt-img .entry .info {
    right: inherit;
    left: 0;
  }
  .plan-sec.year-ranking .entry .info .name {
    font-size: inherit;
  }
}

@media screen and (max-width: 360px) {
  .plan-sec.year-ranking .entry {
    min-width: 260px;
  }
}

.btn-slide-arrow .slick-arrow {
  width: 16px;
  height: 32px;
  z-index: 2;
}

.btn-slide-arrow .slick-arrow:before {
  content: none;
}

.btn-slide-arrow .slick-prev {
  background: url(/stcontents/img/common/icon-arrow-left-white.svg) no-repeat center center;
  background-size: contain;
  left: 8%;
}

.btn-slide-arrow .slick-prev:hover {
  background: url(/stcontents/img/common/left_Hover-3.svg) no-repeat center center;
  background-size: contain;
}

.btn-slide-arrow .slick-next {
  background: url(/stcontents/img/common/icon-arrow-right-white.svg) no-repeat center center;
  background-size: contain;
  right: 8%;
}

.btn-slide-arrow .slick-next:hover {
  background: url(/stcontents/img/common/right_Hover-3.svg) no-repeat center center;
  background-size: contain;
}

.btn-slide-arrow.btn-black .slick-prev {
  background: url(/stcontents/img/common/left_Hover.svg) no-repeat center center;
  background-size: contain;
}

.btn-slide-arrow.btn-black .slick-prev:hover {
  background: url(/stcontents/img/common/icon-arrow-left-white.svg) no-repeat center center;
  background-size: contain;
}

.btn-slide-arrow.btn-black .slick-next {
  background: url(/stcontents/img/common/right_Hover.svg) no-repeat center center;
  background-size: contain;
}

.btn-slide-arrow.btn-black .slick-next:hover {
  background: url(/stcontents/img/common/icon-arrow-right-white.svg) no-repeat center center;
  background-size: contain;
}

.js-slick-slider .slick-dots,
.js-kv-slider .slick-dots {
  height: 0;
  bottom: 26px;
}

.js-slick-slider .slick-dots li,
.js-kv-slider .slick-dots li {
  width: auto;
  height: auto;
  margin: 0 2px;
}

.js-slick-slider .slick-dots li:only-child,
.js-kv-slider .slick-dots li:only-child {
  display: none;
}

.js-slick-slider .slick-dots li button,
.js-kv-slider .slick-dots li button {
  background: #fff;
  width: 4px;
  height: 4px;
  opacity: 1;
  font-size: 10px;
  border-radius: 50%;
  padding: 0;
}

.js-slick-slider .slick-dots li button:before,
.js-kv-slider .slick-dots li button:before {
  content: none;
}

.js-slick-slider .slick-dots li.slick-active button,
.js-kv-slider .slick-dots li.slick-active button {
  width: 6px;
  height: 6px;
}

@media (max-width: 767px) {
  .js-slick-slider .slick-dots li button,
  .js-kv-slider .slick-dots li button {
    width: 2px;
    height: 2px;
  }
  .js-slick-slider .slick-dots li.slick-active button,
  .js-kv-slider .slick-dots li.slick-active button {
    width: 4px;
    height: 4px;
  }
}

.js-scroll-box {
  overflow-x: auto;
  scrollbar-width: none;
}

.js-scroll-box::-webkit-scrollbar {
  display: none;
}

.modal-sort {
  display: none;
  width: auto;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 52;
}

.modal-sort .inner {
  background: #fff;
  width: 100vw;
  height: auto;
  max-width: 848px;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
  margin: 0 auto;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  border-radius: 8px;
  overflow: hidden;
}

.modal-sort .js-modal-close {
  -webkit-transform: scale(0.75);
          transform: scale(0.75);
  right: 9px;
}

.modal-sort .modal-sort-area,
.modal-sort .modal-sort-conditions,
.modal-sort .modal-sort-price {
  display: none;
}

.modal-sort .modal-sort-area.active,
.modal-sort .modal-sort-conditions.active,
.modal-sort .modal-sort-price.active {
  display: block;
}

.modal-sort .modal-title {
  margin: 8px 0 0;
  font-size: 1.4rem;
}

.modal-sort .scroll {
  height: auto;
  padding: 16px 16px 24px;
  overflow-y: auto;
}

.modal-sort .scroll::-webkit-scrollbar {
  width: 4px;
}

.modal-sort .scroll::-webkit-scrollbar-track {
  background: #f5f5f5;
  border-radius: 4px;
  -webkit-box-shadow: 0;
          box-shadow: 0;
}

.modal-sort .scroll::-webkit-scrollbar-thumb {
  background: #C6C6C6;
  border-radius: 4px;
  -webkit-box-shadow: 0;
          box-shadow: 0;
}

.modal-sort .box {
  overflow: hidden;
  margin-bottom: 8px;
  clear: both;
}

.modal-sort .box:last-of-type {
  margin-bottom: 0;
}

.modal-sort .title {
  margin-bottom: 8px;
  font-weight: bold;
  font-size: 1.6rem;
}

.modal-sort .btn-list li {
  float: left;
  margin: 0 10px 14px 0;
}

.modal-sort .btn-list li:last-of-type {
  margin-right: 0;
}

.modal-sort .btn-list li img {
  width: 16px;
  margin-right: 4px;
}

.modal-sort .btn-list li img:last-of-type {
  margin-right: 0;
}

.modal-sort .btn-list li span {
  margin-left: 8px;
}

.modal-sort .price-slider {
  padding-top: 16px;
}

.modal-sort .price-slider .range-max {
  display: none;
  margin-top: 16px;
}

.modal-sort .price-slider .range-max input {
  width: 22px;
  height: 22px;
  border: none;
}

.modal-sort .price-slider .range-max label {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.modal-sort .price-title {
  color: #757575;
}

.modal-sort .slider-range {
  width: calc(100% - 50px);
  margin: 0 0 16px 14px;
}

.modal-sort .slider-guide {
  width: calc(100% - 38px);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 8px 10px;
  color: #757575;
}

.modal-sort .slider-guide .max {
  margin-right: -28px;
}

.modal-sort .slider-guide .middle {
  position: absolute;
  left: 60%;
}

.modal-sort .slider-guide .middle.long {
  left: 19%;
}

.modal-sort .slider-guide .middle:before {
  content: "";
  display: block;
  background: #c6c6c6;
  height: 12px;
  width: 2px;
  position: absolute;
  top: -26px;
  left: calc(50% - 1px);
  z-index: 1;
}

.modal-sort .range-note {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 1rem;
  color: #757575;
}

.ui-slider-horizontal.ui-widget-content {
  background: #efefef;
  height: 8px;
  border: none;
}

.ui-slider-horizontal .ui-slider-handle {
  background: #0F0A64 !important;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  top: -12px;
  -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
          box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

.ui-slider-horizontal .ui-slider-handle:hover {
  background: #554B98 !important;
}

.ui-slider-horizontal .ui-slider-range {
  background: #E1E9F8;
}

.submit-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  padding: 24px 16px 24px;
  -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
          box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
}

.submit-box .link-reset {
  margin-left: 0;
  margin-right: auto;
}

.submit-box .link-reset .js-btn-reset {
  text-decoration: underline;
  padding: 0;
  color: #757575;
  cursor: pointer;
}

.submit-box .link-reset .js-btn-reset:hover {
  text-decoration: none;
}

.submit-box .link-reset .js-btn-reset:active {
  opacity: 0.5;
}

.submit-box .link-reset .js-btn-reset.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.submit-box .link-reset .js-btn-reset.disabled:hover {
  color: #757575;
}

.submit-box .count {
  font-size: 1.0rem;
  color: #757575;
  letter-spacing: 0;
}

.submit-box .count span {
  margin-left: 4px;
  margin-right: 4px;
  font-weight: bold;
  font-size: 2rem;
  color: #333;
}

.submit-box .count .num {
  letter-spacing: 1px;
}

.submit-box .count .unit {
  margin-left: 0;
  margin-right: 0;
  font-size: 1.2rem;
  font-weight: normal;
}

.submit-box .btn-reset {
  margin: 0 8px;
}

.submit-box .js-btn-reset {
  padding: 6px 10px;
  font-weight: bold;
  font-size: 1.4rem;
}

.submit-box .btn-submit {
  margin-left: 8px;
}

.submit-box .js-btn-submit {
  padding: 6px 55px;
  font-size: 1.4rem;
}

.submit-box .count-title {
  margin-right: 4px;
  font-weight: bold;
  font-size: 1.4rem;
}

.modal-sort .price-range {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.modal-sort .price-range input {
  width: 100%;
  height: 56px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-align: center;
  letter-spacing: 1px;
  font-weight: 100;
  font-size: 1.6rem;
}

.modal-sort .price-range .border {
  padding: 48px 10px 0;
}

.modal-sort.price-modal .inner {
  max-width: 503px;
  height: auto;
}

.modal-sort.price-modal .scroll {
  height: auto;
  padding-bottom: 0;
}

.modal-sort .modal-sort-price .submit-box {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.modal-sort .modal-sort-price .submit-box .js-btn-submit {
  padding: 10px 78px;
}

.searchbox-bar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: left;
}

.searchbox-bar .sort-box {
  display: none;
}

.searchbox-bar.float {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.search-bar-section .searchBoxArea {
  position: relative;
  top: inherit !important;
  bottom: inherit !important;
  margin: 24px auto;
}

.sort-conditions-box {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-top: 4px;
}

.sort-conditions-box .js-sort-conditions {
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  margin-top: -4px;
  margin-bottom: 8px;
}

.sort-conditions-box .sort-conditions-list {
  display: none;
}

.sort-conditions-box.active .sort-conditions-list {
  display: block;
}

.sort-conditions-box .element-list {
  display: inline;
}

.sort-conditions-box .element-list .sort-element {
  height: 32px !important;
  margin-left: 8px;
  margin-bottom: 8px;
  vertical-align: bottom;
  line-height: 1;
}

.sort-conditions-box .element-list .sort-element span {
  margin-left: 4px;
}

.sort-conditions-box .element-list .sort-element span:after {
  content: "×";
  display: inline-block;
  margin-left: 2px;
  margin-right: -2px;
  font-size: 12px;
  color: #757575;
}

.sort-conditions-box .element-list .sort-element:hover {
  background: #fff;
  color: #0F0A64;
}

.sort-conditions-box .element-list .sort-element:hover span:after {
  color: #0F0A64;
}

.sort-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.sort-box .btn-relux {
  height: 40px;
  min-width: 100px;
  padding: 4px 16px;
  border-radius: 4px;
  font-size: 1.2rem;
}

.sort-box .search-wrap {
  margin: 0 auto;
}

.sort-box .number {
  background: #fff;
  display: inline-block;
  display: none;
  margin-left: 8px;
  margin-right: -15px;
  padding: 3.5px 5px;
  border-radius: 4px;
  letter-spacing: 0;
  font-size: 1.6rem;
  font-weight: bold;
  color: #0F0A64;
  min-width: 32px;
  text-align: center;
}

.sort-box .number:empty {
  display: none;
}

.sort-box .number .number-over {
  margin-left: 2px;
  position: relative;
  bottom: 1px;
  font-size: 1.4rem;
}

.sort-box .sort-price .count-box {
  display: none;
}

.sort-box .sort-price.active .label {
  display: none;
}

.sort-box .sort-price.active .count-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.sort-box .sort-price.active .count-box .count > div {
  display: inline-block;
  margin-left: 0;
  font-size: 1.6rem;
}

.sort-box .sort-price.active .count-box .count .number {
  margin-right: -15px;
  margin-left: 4px;
  text-align: left;
}

.sort-box .sort-price.active .count-box .count input {
  background: none;
}

.sort-box .btn-sort-conditions {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  min-width: 0 !important;
  width: 28px !important;
  height: 28px !important;
  margin-top: 2px;
  margin-left: 8px;
  padding: 0 !important;
  letter-spacing: 0;
  border-radius: 50%;
  vertical-align: top;
  font-size: 20px !important;
  font-weight: normal;
}

@media (max-width: 767px) {
  .sort-box {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    letter-spacing: 0;
  }
  .sort-box .btn-relux {
    height: 32px;
    min-width: 64px;
    padding: 2px 8px;
    font-size: 1.2rem;
    line-height: 1;
  }
  .sort-box .number {
    margin-left: 4px;
    margin-right: -7px;
    padding: 8px 4px;
    font-size: 1.2rem;
    min-width: 28px;
  }
  .sort-box .number .number-over {
    font-size: 1.0rem;
  }
  .sort-conditions-box .sort-conditions-list {
    display: none !important;
  }
}

.sort-element {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 3px 10px 4px;
  border: 2px solid #F5F5F5;
  border-radius: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #333;
  position: relative;
}

.sort-element .icon-grade {
  width: 2rem;
}

.sort-element .icon-grade:last-of-type {
  margin-right: .4rem;
}

.sort-element.active {
  background: #F3F8FD;
  padding: 4px 11px 5px;
  border: 1px solid #0F0A64;
  color: #000;
}

.sort-element:hover {
  background: #fff;
  padding: 4px 11px 5px;
  border: 1px solid #554B98;
  color: #554B98;
}

.sort-element.active:hover {
  background: #F3F8FD;
  border: 1px solid #0F0A64;
}

.sort-box > div {
  margin-right: 4px;
}

.sort-box > div:last-child {
  margin-right: 0;
}

.sort-element-disabled {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 3px 10px 4px;
  border: 2px solid #f5f5f5;
  border-radius: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #c6c6c6;
  background-color: #f5f5f5;
  position: relative;
  pointer-events: none;
}

.sort-element-disabled .icon-grade {
  width: 2rem;
}

.sort-element-disabled .icon-grade:last-of-type {
  margin-right: .4rem;
}

.result-header-sort {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px 0 8px;
}

.result-number {
  font-size: 2rem;
}

.result-number span {
  margin-left: 4px;
  font-weight: bold;
  font-size: 2.4rem;
}

.result-number label {
  margin-left: 16px;
  font-size: 1.6rem;
}

.result-number input {
  margin-top: -4px;
}

.float-search-box {
  background: #fff;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 10;
  padding: 8px 0;
}

.float-search-box .searchbox-bar {
  padding-bottom: 16px;
}

.float-search-box .searchBoxArea.float-box.fixed {
  position: relative;
  top: auto;
  left: auto;
  padding: 0;
}

.float-search-box.fixed {
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
}

.float-search-box.fixed .float-result-header {
  display: block;
}

.float-search-box.fixed .result-header-sort {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.float-search-box.fixed .result-header-sort .sort-change {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.float-search-box .flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.float-search-box .result-header-sort {
  display: none;
  padding: 0;
}

.float-search-box .result-header-sort .result-number {
  margin-left: 32px;
  font-size: 1.6rem;
}

.float-search-box .result-header-sort .result-number span {
  font-size: 2rem;
}

.float-search-box .result-header-sort .sort-change {
  position: absolute;
  bottom: 0;
  right: 0;
}

@media (min-width: 768px) {
  .float-search-box {
    z-index: 10;
  }
}

.sort-change {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.2rem;
  line-height: 1;
  padding-right: 1rem;
}

.sort-change a {
  display: inline-block;
  padding: 5px 18px;
  border-right: 1px solid #757575;
  font-weight: 100;
  color: #0f0a64;
}

.sort-change a:hover {
  color: #554B98;
}

.sort-change a:nth-of-type(3) {
  padding-right: 12px;
  border: none;
}

.sort-change a:last-child {
  margin-right: 0;
  padding-right: 0;
  border: none;
}

.sort-change a.active {
  font-weight: bold;
}

.sort-change.station a:nth-of-type(4) {
  padding-right: 12px;
  border-right: none;
}

.sort-change.station a:nth-of-type(3) {
  padding-right: 16px;
  border-right: 1px solid #757575;
}

.search-result .bread-crumbs.sp-only {
  background-color: #f5f5f5;
  padding-left: 16px;
}

.fixed-on .result-header-sort {
  opacity: 0;
}

@media (min-width: 768px) {
  .modal-sort .js-modal-close {
    -webkit-transform: none;
            transform: none;
  }
  .modal-sort .scroll {
    max-height: calc(78vh - 100px);
    margin: 24px 12px 0;
    padding-right: 10px;
  }
  .modal-sort .btn-list li img {
    width: 20px;
  }
  .modal-sort .sort-element {
    padding: 1px 10px 2px;
  }
  .modal-sort .sort-element.active {
    padding: 2px 11px 3px;
  }
  .modal-sort .sort-element:hover {
    padding: 2px 11px 3px;
  }
  .modal-sort .sort-element-disabled {
    padding: 1px 10px 2px;
  }
  .modal-sort .price-slider .border {
    padding: 48px 19px 0;
  }
  .modal-sort .price-slider .range-max {
    margin-top: 36px;
  }
  .modal-sort .price-range label {
    font-size: 1.6rem;
  }
  .modal-sort .price-range input {
    height: 56px;
    font-size: 2rem;
  }
  .modal-sort .middle-title {
    padding: 14px 16px;
  }
  .submit-box {
    padding: 24px 24px 24px;
  }
  .submit-box > div {
    margin-left: 8px;
  }
  .submit-box .count-title {
    margin-right: 0;
    font-size: 2.0rem;
  }
  .submit-box .count {
    font-size: inherit;
  }
  .submit-box .count span {
    margin-left: 8px;
    font-size: 2.4rem;
  }
  .submit-box .count .unit {
    font-size: 1.4rem;
  }
  .submit-box .btn-reset {
    margin: 0 0 0 16px;
  }
  .submit-box .js-btn-reset {
    padding: 10px 16px;
    font-size: 1.6rem;
  }
  .submit-box .btn-submit {
    margin-left: 16px;
  }
  .submit-box .js-btn-submit {
    padding: 10px 111px;
    font-size: 1.6rem;
  }
  .modal-sort.price-modal .inner {
    top: 250px;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
    margin-left: -98px;
  }
  .modal-sort.price-modal.fixed .inner {
    top: 130px;
  }
  .modal-sort.price-modal .js-modal-close {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1120px) {
  .modal-sort.price-modal .inner {
    -webkit-transform: none;
            transform: none;
    margin-left: 0;
    left: 234px;
  }
}

@media (max-width: 1200px) {
  .float-search-box .result-header-sort {
    width: 100%;
  }
  .float-search-box .result-header-sort .sort-change {
    position: relative;
    bottom: auto;
    right: auto;
  }
}

@media (max-width: 767px) {
  .float-search-box {
    padding-bottom: 16px;
    font-size: 1.4rem;
  }
  .float-search-box.modal-on {
    z-index: 40;
    padding: 0 0 8px;
  }
  .float-search-box .wrap {
    padding: 0;
  }
  .float-search-box .result-sort,
  .float-search-box .result-number {
    padding: 0 16px;
  }
  .float-search-box .result-sort {
    padding-bottom: 8px;
  }
  .float-search-box .js-accordion-open {
    display: none;
    position: absolute;
    top: 0;
    right: 20px;
  }
  .float-search-box .searchbox-bar {
    padding-bottom: 16px;
  }
  .float-search-box .float-result-header {
    width: 100%;
  }
  .float-search-box:not(.fixed) .float-result-header {
    display: block !important;
  }
  .float-search-box .result-header-sort {
    display: block;
  }
  .float-search-box .result-header-sort .sort-change {
    display: none;
    background: #F5F5F5;
    width: 100%;
    margin-top: 10px;
  }
  .float-search-box .result-header-sort .result-number {
    margin-left: 0;
    font-size: 1.4rem;
  }
  .float-search-box .result-header-sort .result-number label {
    font-size: 1.4rem;
  }
  .float-search-box .result-header-sort .result-number span {
    margin-left: 4px;
    font-size: 1.6rem;
  }
  .float-search-box.fixed {
    padding-bottom: 0;
  }
  .float-search-box.fixed .float-result-header {
    display: none;
  }
  .float-search-box.fixed .js-accordion-open {
    display: block;
  }
  .sub-target .result-header-sort {
    display: block;
    padding: 0;
  }
  .result-list.fixed-on {
    margin-top: 0;
  }
  .sub-target .result-header-sort .result-number {
    display: none;
  }
  .sort-change.station a:nth-child(3) {
    padding-right: 10px;
  }
  .sort-change a {
    padding: 1px 10px;
    margin: 4px 0;
  }
  .sort-change a:hover {
    color: #0f0a64;
  }
  .sort-change a:last-child {
    padding-left: 6px;
  }
  .modal-sort .inner {
    height: 100%;
    border-radius: 0;
  }
  .modal-sort .title {
    font-size: 1.4rem;
  }
  .modal-sort .btn-list li {
    margin: 0 4px 12px 0;
  }
  .modal-sort .modal-sort-body {
    height: 100%;
  }
  .modal-sort .scroll {
    height: 100%;
    overflow: auto;
    padding: 16px 0 50px;
    margin-bottom: 0;
  }
  .modal-sort .js-btn-submit {
    padding: 6px 45px !important;
    width: 166px;
    height: 40px;
  }
  .modal-sort .submit-box {
    position: fixed;
    bottom: 0;
    left: 0;
  }
  .modal-sort-conditions {
    overflow-y: auto;
    padding-bottom: 80px;
  }
  .modal-sort-conditions .scroll {
    height: auto;
    overflow: hidden;
    padding: 64px 16px 60px;
  }
  .modal-sort-conditions .submit-box {
    padding: 8px 16px 16px 16px;
    background: #fff;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
  }
  .modal-sort-conditions .js-btn-submit {
    width: 130px;
  }
  .modal-sort-conditions .btn-list .sort-element,
  .modal-sort-conditions .btn-list .sort-element-disabled {
    height: 33px;
  }
  .modal-sort.price-modal > .js-modal-close {
    display: none;
  }
  .modal-sort.price-modal .js-modal-close {
    position: absolute;
    top: 16px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  .modal-sort.price-modal .inner {
    max-width: 100%;
    top: auto;
    bottom: 0;
    left: 0;
    -webkit-transform: none;
            transform: none;
    border-radius: 24px 24px 0 0;
    padding-top: 30px;
  }
  .modal-sort.price-modal .modal-title {
    width: 100%;
    position: absolute;
    top: 22px;
    left: 0;
    margin: 0;
    text-align: center;
  }
  .modal-sort.price-modal .scroll {
    margin-bottom: 0;
    padding: 16px 16px 0;
  }
  .modal-sort.price-modal .submit-box {
    width: 100%;
    padding: 0 16px 16px 16px;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .modal-sort.price-modal .submit-box .count span {
    font-size: 2rem;
  }
  .modal-sort.price-modal .submit-box .count span.unit {
    font-size: 1.2rem;
  }
  .modal-sort.price-modal .submit-box .js-btn-submit {
    max-width: 130px;
    width: 35vw;
  }
  .modal-sort.price-modal .submit-box .link-reset {
    position: absolute;
    left: 16px;
    top: 5px;
  }
  .modal-sort.price-modal .price-slider {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  .modal-sort.price-modal .price-range input {
    font-size: 2rem;
  }
  .sort-element:hover {
    border-color: #F5F5F5;
    color: #757575;
  }
  .sort-element.active:hover {
    color: #000;
  }
  .sort-box .sort-price.active .count-box {
    font-size: 1.2rem;
  }
  .sort-box .sort-price.active .count-box .count {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .sort-box .sort-price.active .count-box .count .mark {
    margin-right: 2px;
  }
  .sort-box .sort-price.active .count-box .count > div {
    font-size: 12px;
    margin-left: 2px;
  }
  .sort-box .sort-price.active .count-box .count > div span {
    font-size: 1.0rem;
  }
  .sort-box .sort-price.active .count-box .count .number {
    margin-right: -7px;
    line-height: 1.2;
    padding: 0.5px 8px;
  }
  .sort-box .sort-price.active .count-box .count span:first-child {
    display: block;
  }
}

@media (max-width: 360px) {
  .sort-box {
    white-space: nowrap;
  }
  .sort-box .number {
    padding: 3px 3px;
    margin-right: 0;
  }
  .sort-box .sort-price.active .count-box .count .number {
    margin-right: 0;
  }
  .sort-box .btn-relux,
  .sort-box .sort-price.active .count-box {
    font-size: 10px;
  }
  .submit-box .js-btn-reset {
    padding: 6px 6px;
    font-size: 1.4rem;
  }
  .modal-sort .slider-guide {
    font-size: 10px;
  }
  .modal-sort .js-btn-submit {
    padding: 6px 32px !important;
    font-size: 1.4rem;
    width: 100px;
    height: 32px;
  }
  .modal-sort.price-modal .submit-box .js-btn-submit {
    width: 32vw;
  }
  .modal-sort.price-modal .submit-box .count span {
    font-size: 1.7rem;
  }
}

@media screen and (max-width: 1023px) {
  .result-number {
    font-size: 1.4rem;
  }
}

@media (max-width: 767px) {
  .detail-page .modal-sort .btn-submit {
    margin-left: 4px;
  }
  .detail-page .modal-sort .js-btn-submit {
    padding: 6px !important;
    width: 100px;
  }
  .detail-page .modal-sort .submit-box .link-reset {
    letter-spacing: 0;
  }
  .detail-page .modal-sort .submit-box .count-title {
    margin-right: 4px;
    font-size: 1.4rem;
  }
  .detail-page .modal-sort .submit-box .count .num {
    font-size: 1.6rem;
  }
}

@media (max-width: 360px) {
  .detail-page .modal-sort .btn-submit {
    margin-left: 4px;
  }
  .detail-page .modal-sort .js-btn-submit {
    padding: 6px !important;
    width: 80px;
  }
  .detail-page .modal-sort .submit-box .link-reset {
    letter-spacing: 0;
  }
  .detail-page .modal-sort .submit-box .count-title {
    margin-right: 2px;
    font-size: 1.2rem;
    letter-spacing: 0;
  }
  .detail-page .modal-sort .submit-box .count span {
    margin-left: 1px;
    margin-right: 1px;
  }
  .detail-page .modal-sort .submit-box .js-btn-reset {
    font-size: 1.3rem;
    letter-spacing: 0;
  }
}

.modal-sort-area {
  height: 700px;
  position: relative;
}

.modal-sort-area .scroll {
  max-height: calc(90vh - 116px);
  height: calc(100% - 116px);
  overflow-y: auto;
}

.modal-sort-area .scroll.on {
  height: calc(100% - 140px);
}

.modal-sort-area .region-element {
  display: none;
}

.modal-sort-area .bottom-box {
  background: #fff;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 8px 12px 0 16px;
  z-index: 21;
}

.modal-sort-area .bottom-box .select-list {
  display: none;
}

.modal-sort-area .bottom-box .select-list dl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.modal-sort-area .bottom-box .select-list dt {
  width: 130px;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  margin-left: 24px;
  padding-top: 3px;
}

.modal-sort-area .bottom-box .select-list dd {
  width: 100%;
}

.modal-sort-area .bottom-box .select-list dd .sort-element {
  margin: 0 8px 8px 0;
}

.modal-sort-area .bottom-box .select-list dd .sort-element.active:after {
  display: inline-block;
  content: "×";
  vertical-align: middle;
  margin-left: 4px;
  margin-right: -2px;
  color: #757575;
}

.modal-sort-area .bottom-box .select-list .num {
  background: #C6C6C6;
  min-width: 28px;
  padding: 2px 8px 4px;
  border-radius: 100px;
  display: inline-block;
  text-align: center;
  color: #fff;
}

.modal-sort-area .bottom-box .select-list .area-list {
  height: 36px;
  overflow: hidden;
  padding-right: 42px;
  padding-bottom: 8px;
  position: relative;
}

.modal-sort-area .bottom-box .select-list .area-list.open {
  height: auto;
  max-height: 172px;
  overflow-y: auto;
}

.modal-sort-area .bottom-box .select-list .area-list::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.modal-sort-area .bottom-box .select-list .area-list::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.modal-sort-area .bottom-box .select-list .area-list::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.modal-sort-area .bottom-box .select-list .area-list .sort-element:last-of-type {
  margin-right: 0 !important;
}

.modal-sort-area .bottom-box .btn-open {
  display: none;
  top: 24px;
  right: 28px;
}

.modal-sort-area .bottom-box .submit-box {
  -webkit-box-shadow: none;
          box-shadow: none;
}

.modal-sort-area .bottom-box .sort-element.active:hover {
  background: #fff;
  color: #0F0A64;
}

.modal-sort-area .bottom-box .sort-element.active:hover:after {
  color: #0F0A64 !important;
}

.modal-sort-area .bottom-box {
  -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
          box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
  border-top: 1px solid #F5F5F5;
}

@-webkit-keyframes slideUp {
  100% {
    height: 250px;
  }
}

@keyframes slideUp {
  100% {
    height: 250px;
  }
}

.modal-sort-area .region {
  padding: 10px 10px 0;
  border-top: 3px solid #F5F5F5;
  overflow: hidden;
  position: relative;
}

.modal-sort-area .region dt {
  width: 90px;
  float: left;
  clear: both;
  padding: 3px 0;
  font-weight: bold;
  margin-right: 16px;
}

.modal-sort-area .region dd {
  width: calc(100% - 130px);
  float: left;
  padding-right: 24px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.modal-sort-area .region dd .sort-element {
  margin-bottom: 10px;
}

.modal-sort-area .region dd .sort-element-disabled {
  margin-bottom: 10px;
}

.modal-sort-area .btn-open {
  position: absolute;
  top: 30px;
  right: 6px;
  padding: 10px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  z-index: 10;
}

.modal-sort-area .btn-open:before {
  content: "";
  display: block;
  margin-top: 7px;
  border: 8px solid transparent;
  border-top: 7px solid #0F0A64;
}

.modal-sort-area .btn-open.open:before {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
  margin-top: -9px;
}

.modal-sort-area .btn-open:hover::before {
  border-top-color: #c6c6c6;
}

.modal-sort-area .btn-open.no-element {
  pointer-events: none;
}

.modal-sort-area .checkbox {
  background: #fff;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  display: inline-block;
  width: 22px;
  height: 22px;
  border: 2px solid #757575;
  border-radius: 2px;
  vertical-align: top;
  margin-top: 4px;
}

.modal-sort-area .checkbox:checked {
  background: #0F0A64 url(/stcontents/img/common/icon-checked-white.svg) no-repeat center center;
  background-size: 14px;
  border-color: #0F0A64;
}

.modal-sort-area a.no-element {
  background: #f5f5f5 !important;
  border: 2px solid #f5f5f5 !important;
  padding: 2px 11px 3px;
  color: #c6c6c6 !important;
  cursor: default !important;
  pointer-events: none;
}

.modal-sort-area .no-element.checkbox:checked,
.modal-sort-area .no-element label .checkbox:checked {
  background: #f5f5f5 !important;
  border-color: #f5f5f5 !important;
}

.modal-sort-area .no-element label,
.modal-sort-area .no-element span {
  color: #c6c6c6 !important;
  pointer-events: none;
}

.modal-sort-area .no-element label input {
  background: #f5f5f5 !important;
  border: 2px solid #f5f5f5 !important;
}

.modal-sort-area label.no-element {
  color: #c6c6c6 !important;
  pointer-events: none;
}

.modal-sort-area label.no-element input {
  background: #f5f5f5 !important;
  border: 2px solid #f5f5f5 !important;
  pointer-events: none;
}

.modal-sort-area .prefecture-box {
  display: none;
}

.modal-sort-area .prefecture {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-left: 24px;
}

.modal-sort-area .prefecture dt,
.modal-sort-area .prefecture dd {
  padding: 10px 10px 2px 0;
}

.modal-sort-area .prefecture dt {
  padding-top: 12px;
  padding-right: 0;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
}

.modal-sort-area .prefecture dt span {
  padding: 0 8px;
  display: inline-block;
  width: 132px;
}

.modal-sort-area .prefecture dd {
  width: 100%;
  padding-right: 30px;
  position: relative;
}

.modal-sort-area .prefecture .btn-open {
  top: 30px;
}

.modal-sort-area .prefecture .btn-open:before {
  width: 8px;
  height: 8px;
  margin: -8px 3px 0 0;
  border: none;
  border-top: 2px solid #0F0A64;
  border-right: 2px solid #0F0A64;
  -webkit-transform: rotate(135deg);
          transform: rotate(135deg);
}

.modal-sort-area .prefecture .btn-open:hover::before {
  border-top-color: #c6c6c6;
  border-right-color: #c6c6c6;
}

.modal-sort-area .prefecture .btn-open.open {
  top: 35px;
}

.modal-sort-area .prefecture .btn-open.open:before {
  -webkit-transform: rotate(315deg);
          transform: rotate(315deg);
}

.modal-sort-area .prefecture + .prefecture {
  border-top: 1px solid #F5F5F5;
}

.modal-sort-area .largearea_group {
  height: 40px;
  overflow: hidden;
}

.modal-sort-area .largearea_group li {
  float: left;
  margin-right: 8px;
  margin-bottom: 8px;
}

.modal-sort-area .largearea_group.open {
  height: 100%;
}

.modal-sort-area .largearea_group.open-fix {
  height: 100%;
}

@media (max-height: 750px) {
  .modal-sort-area {
    height: auto;
  }
  .modal-sort-area .scroll {
    padding-bottom: 116px;
  }
  .modal-sort-area .scroll.on {
    padding-bottom: 156px;
  }
}

@media (max-width: 767px) {
  .modal-sort .slider-range {
    margin-top: 24px;
  }
  .modal-sort-area {
    height: 100% !important;
    overflow-y: auto;
    padding: 35px 16px 80px 16px;
    border-radius: 0;
  }
  .modal-sort-area .scroll {
    max-height: none;
    height: auto;
    overflow-y: auto;
    padding-bottom: 30px !important;
  }
  .modal-sort-area .scroll.on {
    height: auto;
    padding-bottom: 60px !important;
  }
  .modal-sort-area .js-modal-close, .modal-sort-conditions .js-modal-close {
    z-index: 20;
  }
  .modal-sort-area .js-modal-close.float, .modal-sort-conditions .js-modal-close.float {
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    position: fixed;
    top: 10px;
    width: 30px;
    height: 30px;
  }
  .modal-sort-area .modal-title, .modal-sort-conditions .modal-title {
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: block;
    z-index: 12;
    margin: 0;
    padding: 10px;
    -webkit-box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.08);
  }
  .modal-sort-area .region {
    padding: 0;
    border-top: 2px solid #f5f5f5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .modal-sort-area .region > .region-list {
    flex-grow: 1;
  }
  .modal-sort-area .region dt {
    width: 74px;
    padding: 10px 0;
    word-break: keep-all;
    letter-spacing: 0;
  }
  .modal-sort-area .region label {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    pointer-events: none;
  }
  .modal-sort-area .region dd {
    width: auto;
    padding: 8px 16px 8px 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .modal-sort-area .region dd .sort-element {
    background: none !important;
    margin-bottom: 0;
    padding: 4px 0;
    border: none !important;
    display: block;
    margin-right: 8px;
  }
  .modal-sort-area .region dd .sort-element:after {
    content: '';
    margin-left: 4px;
  }
  .modal-sort-area .region dd .sort-element span {
    text-decoration: underline;
  }
  .modal-sort-area .region dd .sort-element span:nth-child(2) {
    display: none;
  }
  .modal-sort-area .region dd .sort-element.active {
    background: none;
    color: #0F0A64;
  }
  .modal-sort-area .checkbox {
    background-size: 13px;
    width: 18px;
    height: 18px;
    margin-top: 3px;
    margin-right: 6px;
  }
  .modal-sort-area .btn-open {
    top: 24px;
    right: -10px;
  }
  .modal-sort-area .prefecture {
    display: block;
    position: relative;
    padding-left: 0;
  }
  .modal-sort-area .prefecture dt.no-element + dd .btn-open {
    display: none !important;
  }
  .modal-sort-area .prefecture dt span {
    padding: 0;
  }
  .modal-sort-area .prefecture dd {
    position: unset;
  }
  .modal-sort-area .prefecture .btn-open {
    top: 26px;
  }
  .modal-sort-area .prefecture .btn-open.open {
    top: 32px;
  }
  .modal-sort-area .prefecture .sort-element span {
    white-space: nowrap;
  }
  .modal-sort-area .largearea_group {
    height: 0;
  }
  .modal-sort-area .bottom-box {
    position: fixed;
    background: none;
    bottom: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
    border: none;
    padding: 0;
  }
  .modal-sort-area .bottom-box .select-list {
    background: #fff;
    -webkit-box-shadow: 0px -4px 15px rgba(0, 0, 0, 0.1);
            box-shadow: 0px -4px 15px rgba(0, 0, 0, 0.1);
    border-radius: 30px 30px 0 0;
    padding: 15px 0 0;
  }
  .modal-sort-area .bottom-box .select-list dl {
    display: block;
  }
  .modal-sort-area .bottom-box .select-list dt {
    width: auto;
    float: right;
    margin-right: 45px;
    margin-bottom: 16px;
    padding: 0;
  }
  .modal-sort-area .bottom-box .select-list dd {
    clear: both;
  }
  .modal-sort-area .bottom-box .select-list dd .sort-element {
    margin: 0 4px 16px 0;
  }
  .modal-sort-area .bottom-box .select-list .num {
    min-width: 22px;
    padding: 0px 4px 2px;
  }
  .modal-sort-area .bottom-box .select-list .area-list {
    width: 100%;
    height: 0;
    clear: both;
    padding: 0 16px 0;
  }
  .modal-sort-area .bottom-box .select-list .area-list.open {
    max-height: 326px;
  }
  .modal-sort-area .bottom-box .btn-open {
    top: 22px;
    right: 12px;
    margin: 0;
  }
  .modal-sort-area .bottom-box .btn-open:before {
    width: 8px;
    height: 8px;
    border: none;
    border-top: 2px solid #0F0A64;
    border-right: 2px solid #0F0A64;
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
  }
  .modal-sort-area .bottom-box .btn-open.open {
    top: 35px;
  }
  .modal-sort-area .bottom-box .btn-open.open:before {
    -webkit-transform: rotate(315deg);
            transform: rotate(315deg);
  }
  .modal-sort-area .bottom-box .submit-box {
    width: 100%;
    background: #fff;
    position: unset;
    bottom: auto;
    left: auto;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
    border-top: 1px solid #f5f5f5;
    padding: 8px 16px 16px 16px;
    clear: both;
  }
  .modal-sort-area .bottom-box .submit-box .link-reset {
    position: absolute;
    top: 16px;
    left: 16px;
  }
  .modal-sort-area .bottom-box .submit-box .js-btn-submit {
    width: 34vw;
  }
  .modal-sort-area .scroll.on .modal-sort-area-overlay {
    display: none;
    background: rgba(198, 198, 198, 0.7);
    content: "";
    width: 100%;
    height: 100%;
    position: fixed;
    top: -30px;
    left: 0;
    z-index: 20;
  }
  .modal-sort-area .scroll.on.open .modal-sort-area-overlay {
    display: block;
  }
  .modal-sort-area .scroll.on + .bottom-box .link-reset {
    display: block;
  }
  .modal-sort-price {
    padding-bottom: 120px;
  }
}

@media screen and (max-width: 360px) {
  .modal-sort .submit-box .count .unit {
    font-size: 1.0rem;
  }
  .modal-sort-conditions .submit-box {
    padding-bottom: 10px;
  }
  .submit-box .btn-submit {
    margin-left: 4px;
  }
  .submit-box .count {
    font-size: 1.0rem;
  }
  .submit-box .count span {
    margin-left: 2px;
    margin-right: 2px;
    font-size: 1.6rem;
  }
}

.feature-line {
  width: 100%;
  overflow-x: auto;
  position: relative;
  text-align: center;
  padding-top: 16px;
  padding-bottom: 8px;
}

.feature-line .js-scroll-box {
  margin-left: -16px;
  margin-right: -16px;
}

.feature-line .inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-align-content: space-between;
      -ms-flex-line-pack: justify;
          align-content: space-between;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

.feature-line .inner:after {
  content: "";
  display: block;
  padding: 0 20px;
}

.feature-line .btn-relux-offer {
  width: 100%;
}

.feature-line a {
  float: left;
  margin: 0 8px 8px 0;
  padding: 5px 16px;
  font-weight: bold;
}

.feature-line a:last-child {
  margin-right: 0px;
}

.feature-line .btn-default.active,
.feature-line .btn-default:active,
.feature-line .btn-default:focus,
.feature-line .open .dropdown-toggle.btn-default {
  background: #fff;
  color: #0F0A64;
  text-decoration: none;
  border-color: #c6c6c6;
}

.feature-line .btn-scroll {
  display: none;
}

@media (min-width: 768px) {
  .feature-line {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .feature-line::-webkit-scrollbar {
    display: none;
  }
  .feature-line .js-scroll-box {
    margin-left: 0;
    margin-right: 0;
  }
  .feature-line .inner {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin: 0 auto;
  }
  .feature-line .btn-relux-offer {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-right: 24px;
  }
  .feature-line a {
    -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
    margin: 0 8px 16px 0;
    margin-right: 20px;
  }
  .feature-line .btn-scroll, .feature-line .btn-scroll-prev {
    width: 12px;
    height: 22px;
  }
  .feature-line .btn-scroll {
    display: block;
  }
  .feature-line .js-scroll-box:after,
  .feature-line .js-scroll-box:before {
    background: #fff;
    content: "";
    display: block;
    width: 60px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
  }
  .feature-line .js-scroll-box:before {
    width: 50px;
    right: inherit;
    left: 0;
  }
  .feature-line .js-scroll-box .inner {
    margin-left: 40px;
  }
}

.feature-area-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-bottom: 16px;
}

.feature-area-list li {
  width: calc(50% - 4px);
  height: 120px;
  margin-bottom: 8px;
  overflow: hidden;
  position: relative;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-shadow: 1px 1px 1px #000;
}

.feature-area-list li a {
  display: block;
  width: 100%;
  height: 100%;
}

.feature-area-list li span {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  padding: 0 10px;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
  font-size: 1.6rem;
  color: #fff;
}

.feature-area-list li img {
  height: 100%;
  width: 100%;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
}

.feature-area.pb-0 {
  padding-bottom: 0;
}

@media (min-width: 768px) {
  .feature-area-list {
    margin-bottom: 16px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .feature-area-list::after {
    content:"";
    display: block;
    width: 32%;
  }
  .feature-area-list a:hover {
    opacity: 0.7;
  }
  .feature-area-list li {
    height: 160px;
    width: 32%;
    max-width: 352px;
    margin-right: 0;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    margin-bottom: 20px;
  }
  .feature-area-list li:last-child, .feature-area-list li:nth-child(3n) {
    margin-right: 0;
  }
  .feature-area-list li .text {
    font-size: 2.4rem;
  }
}

@media (min-width: 1280px) {
  .feature-line {
    max-width: 1120px;
  }
  .feature-line .btn-scroll, .feature-line .btn-scroll-prev {
    display: none;
  }
  .feature-area-list li span {
    font-size: 2.4rem;
  }
}

.feature-area-list2 {
  display: flex;
  flex-wrap: wrap;
}

.feature-area-list2 > li {
  width: calc(25% - 24px);
  height: 80px;
  margin-right: 32px;
  margin-bottom: 8px;
}

.feature-area-list2 > li:last-child {
  margin-right: 0;
}

.card-arrow-link {
  display: block;
  width: 100%;
  height: 100%;
  background-color: #fff;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  overflow: hidden;
  position: relative;
}

.card-arrow-link-inner {
  width: 100%;
  height: 100%;
}

.card-arrow-link:before {
  background: rgba(0,0,0,0.15);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.card-arrow-link .image {
  width: 100%;
  height: 100%;
}

.card-arrow-link .image img {
  object-fit:cover;
  width: 100%;
  height: 100%;
}

.card-arrow-link:nth-child(1) .image img {
  object-position: center 70%;
}

.card-arrow-link .text {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0 10px;
  text-align: center;
  line-height: 1.5;
  font-size: 1.4rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 1px 1px 1px #000;
}
.card-arrow-link:hover {
  opacity: .7;
}

@media (min-width: 768px) {
  /* 3カラム表示の場合、.column-3をつける */
  .feature-area-list2.column-3 > li {
    width: calc((100% - 64px) / 3);
    height: 120px;
    margin-right: 32px;
    margin-bottom: 32px;
  }
  .feature-area-list2.column-3 > li:nth-child(3n) {
    margin-right: 0;
  }
  .feature-area-list2.column-3 .card-arrow-link .text {
    font-size: 2rem;
  }
}

@media (max-width: 1023px) {
  .feature-area-list2 > li {
    width: calc(25% - 12px);
    margin-right: 16px;
  }
}

@media (max-width: 767px) {
  .feature-area-list2 > li {
    width: calc(50% - 4px);
    height: 64px;
    margin-right: 8px;
    margin-bottom: 8px;
  }
  .feature-area-list2 > li:last-child {
    margin-right: 8px;
  }
  .feature-area-list2 > li:nth-child(2n) {
    margin-right: 0;
  }
}

.access-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.access-list dt,
.access-list dd {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid #C6C6C6;
}

.access-list dt:first-of-type,
.access-list dd:first-of-type {
  border-top: 1px solid #C6C6C6;
}

.access-list dt {
  width: 74px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.access-list dd {
  width: calc(100% - 74px);
}

.access-list.large-style dd {
  font-size: 1.6rem;
}

@media (max-width: 767px) {
  .feature-area-list li {
    height: 90px;
  }

  .access-list dt,
  .access-list dd {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 8px 0;
  }
  .access-list dt img,
  .access-list dd img {
    width: 13px;
  }
  .access-list dt {
    width: 40px;
    padding-top: 14px;
  }
  .access-list dd {
    width: calc(100% - 40px);
  }
}

.col3-article {
  width: auto;
  overflow-x: auto;
  margin-top: 40px;
  margin-left: -16px;
  margin-right: -16px;
  -ms-overflow-style: none;
  scrollbar-width: none;
  -webkit-filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
          filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
}

.col3-article::-webkit-scrollbar {
  display: none;
}

.col3-article ul {
  width: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-left: 16px;
  padding-right: 16px;
  float: left;
}

.col3-article li {
  width: 226px;
  height: 120px;
  position: relative;
  margin-right: 8px;
  float: left;
  line-height: 1.5;
}

.col3-article li:last-child {
  margin-right: 0;
}

.col3-article li .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 8px;
}

.col3-article li .inner {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 8px;
  z-index: 2;
  font-size: 1.2rem;
  text-shadow: 0 0 5px #000;
  color: #fff;
}

.col3-article .slick-arrow {
  width: 15px;
  height: 28px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
}

.col3-article .slick-arrow::before {
  display: none;
}

.col3-article .slick-arrow.slick-disabled {
  display: none !important;
}

.col3-article .slick-next {
  background-image: url(/stcontents/img/common/icon-arrow-right-white.svg);
  right: 24px;
}

.col3-article .slick-next:hover {
  background-image: url(/stcontents/img/common/right_Hover.svg);
  background-size: contain;
}

.col3-article .slick-prev {
  background-image: url(/stcontents/img/common/icon-arrow-left-white.svg);
  left: 24px;
}

.col3-article .slick-prev:hover {
  background-image: url(/stcontents/img/common/left_Hover.svg);
  background-size: contain;
}

.col3-article .hotel-1 {
  background: url("/stcontents/img/index/bg-grade-hotel-1.jpg") no-repeat center center;
  background-size: cover;
}

.col3-article .hotel-2 {
  background: url("/stcontents/img/index/bg-grade-hotel-2.jpg") no-repeat center center;
  background-size: cover;
}

.col3-article .hotel-3 {
  background: url("/stcontents/img/index/bg-grade-hotel-3.jpg") no-repeat center center;
  background-size: cover;
}

.col3-article .hotel-4 {
  background: url("/stcontents/img/index/bg-grade-hotel-4.jpg") no-repeat center center;
  background-size: cover;
}

.col3-article .hotel-5 {
  background: url("/stcontents/img/index/bg-grade-hotel-5.jpg") no-repeat center center;
  background-size: cover;
}

.col3-article .grade {
  margin-bottom: 0;
  line-height: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.col3-article .grade img {
  height: 16px;
  margin-right: 4px;
  vertical-align: top;
}

.col3-article .grade .museum,
.col3-article .grade .casual {
  height: 16px;
}

.col3-article .text {
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

@media (min-width: 768px) {
  .col3-article {
    height: auto;
    margin-top: 32px;
    padding-bottom: 16px;
    margin-left: 0;
    margin-right: 0;
  }
  .col3-article ul {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  .col3-article li {
    width: 384px;
    height: 200px;
    margin-right: 16px;
  }
  .col3-article li a:hover {
    opacity: .7;
  }
  .col3-article li .inner {
    bottom: 0;
    padding: 10px 24px 16px;
    font-size: 1.6rem;
  }
  .col3-article .text {
    height: 48px;
    margin: 0;
    -webkit-line-clamp: 2;
  }
  .col3-article .grade {
    line-height: 1;
  }
  .col3-article .grade img {
    height: 20px;
    vertical-align: top;
  }
  .col3-article .grade .museum,
  .col3-article .grade .casual {
    height: 20px;
  }
}

.col4-article ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.col4-article ul li {
  width: calc(50% - 4px);
  height: 21vw;
  position: relative;
  margin-bottom: 8px;
  margin-right: 8px;
  border-radius: 6px;
}

.col4-article ul li:nth-child(2n) {
  margin-right: 0;
}

.col4-article ul li:hover {
  opacity: 0.7;
}

.col4-article ul li:before {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, rgba(0, 0, 0, 0.18)), to(rgba(0, 0, 0, 0)));
  background: -webkit-linear-gradient(rgba(0, 0, 0, 0.18) 60%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(rgba(0, 0, 0, 0.18) 60%, rgba(0, 0, 0, 0) 100%);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.col4-article ul .area-1 {
  background: url(/stcontents/img/index/hot-area-photo-1.png) no-repeat center center;
  background-size: cover;
}

.col4-article ul .area-2 {
  background: url(/stcontents/img/index/hot-area-photo-1.png) no-repeat center center;
  background-size: cover;
}

.col4-article ul .area-3 {
  background: url(/stcontents/img/index/hot-area-photo-1.png) no-repeat center center;
  background-size: cover;
}

.col4-article ul .area-4 {
  background: url(/stcontents/img/index/hot-area-photo-1.png) no-repeat center center;
  background-size: cover;
}

.col4-article ul a {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding: 0 16px;
  font-size: 1.6rem;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  color: #fff;
  z-index: 1;
}

.col4-article.flex-wrap .flex {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.col4-article.flex-wrap ul {
  margin-top: 20px;
}

.col4-article.flex-wrap ul a {
  padding: 0;
}

.col4-article.flex-wrap ul li {
  width: calc(50% - 4px);
  height: 152px;
  margin-bottom: 8px;
  overflow: hidden;
}

.col4-article.flex-wrap ul li:before {
  content: none;
}

.col4-article.flex-wrap ul li:nth-child(4n) {
  margin-right: 0;
}

.col4-article.flex-wrap ul li img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.hot-area-line {
  position: relative;
}

.hot-area-line .inner {
  width: 100%;
  overflow: hidden;
}

.hot-area-tag {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-top: 16px;
}

.hot-area-tag li {
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
}

.hot-area-tag a {
  height: 40px;
  margin-bottom: 10px;
  margin-right: 8px;
}

.hot-area-tag .btn-default.active,
.hot-area-tag .btn-default:active,
.hot-area-tag .btn-default:focus,
.hot-area-tag .open .dropdown-toggle.btn-default {
  background: #fff;
  color: #0F0A64;
  text-decoration: none;
  border-color: #c6c6c6;
}

@media (min-width: 1024px) {
  .col4-article ul a {
    font-size: 2rem;
  }
  .col4-article.flex-wrap ul li {
    width: calc(25% - 24px);
    height: 152px;
    margin-bottom: 32px;
    overflow: hidden;
  }
}

@media (min-width: 768px) {
  .col4-article ul {
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
  }
  .col4-article ul li {
    width: 260px;
    height: 104px;
    margin-bottom: 0;
    margin-right: 32px;
    border-radius: 6px;
  }
  .col4-article ul li:nth-child(2n) {
    margin-right: 32px;
  }
  .col4-article ul li:last-child {
    margin-right: 0;
  }
  .hot-area-tag {
    width: 100%;
  }
  .hot-area-tag a {
    margin: 0 14px 10px 0;
  }
  .hot-area-line {
    overflow: hidden;
    padding-right: 0;
  }
  .hot-area-line .inner {
    position: relative;
  }
  .hot-area-line .inner:after {
    content: none;
  }
}

@media (max-width: 1023px) {
  .col4-article.flex-wrap ul li {
    margin-right: 8px;
  }
  .col4-article.flex-wrap ul li:nth-child(2n) {
    margin-right: 0;
  }
}

@media (max-width: 360px) {
  .col4-article ul a {
    font-size: 1.3rem;
  }
}

.col5-article {
  position: relative;
  margin-left: -16px;
  margin-right: -16px;
}

.col5-article ul {
  padding-left: 16px;
  padding-right: 16px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  float: left;
}

.col5-article ul .photo {
  width: 106px;
  height: 80px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  overflow: hidden;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.col5-article ul .photo img {
  max-width: none;
  height: 100%;
  width: auto;
}

.col5-article ul li {
  text-align: center;
  margin-right: 8px;
}

.col5-article ul li:last-child {
  margin-right: 0;
}

.col5-article ul li .text {
  font-weight: bold;
}

.col5-article ul a {
  display: block;
  text-decoration: none;
  text-align: left;
  font-size: 1.2rem;
  color: #333;
}

.col5-article .btn-scroll,
.col5-article .btn-scroll-prev {
  top: 50px;
}

.col5-article .btn-scroll-prev {
  left: 36px;
}

@media (width: 768px) {
  .js-scroll-box .btn-scroll.pc-only,
  .js-scroll-box .btn-scroll-prev.pc-only {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .col5-article {
    margin-left: 0;
    margin-right: 0;
  }
  .col5-article .wrap:after {
    content: none;
  }
  .col5-article ul {
    width: 1250px;
    padding-left: 0;
    padding-right: 0;
  }
  .col5-article ul .photo {
    width: 198px;
    height: 100px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    overflow: hidden;
    border-radius: 8px;
  }
  .col5-article ul .photo img {
    width: 100%;
  }
  .col5-article ul li {
    text-align: center;
    margin-right: 32px;
  }
  .col5-article ul a {
    font-size: 1.6rem;
  }
  .col5-article ul a:hover {
    opacity: .7;
  }
}

@media (min-width: 1280px) {
  .col5-article .btn-scroll,
  .col5-article .btn-scroll-prev {
    display: none;
  }
  .col5-article ul {
    width: auto;
  }
}

.selections-area {
  padding: 20px 0;
}

.col6-article,
.col6-article-2 {
  position: relative;
}

.col6-article .js-scroll-box,
.col6-article-2 .js-scroll-box {
  margin-left: -16px;
  margin-right: -16px;
}

.col6-article .js-scroll-box ul,
.col6-article-2 .js-scroll-box ul {
  padding-left: 16px;
  padding-right: 16px;
}

.col6-article ul,
.col6-article-2 ul {
  float: left;
  margin: 0 auto;
  padding-right: 32px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
}

.col6-article li,
.col6-article-2 li {
  min-width: 230px;
  margin-bottom: 16px;
  margin-right: 8px;
}

.col6-article li:last-child,
.col6-article-2 li:last-child {
  margin-right: 0;
}

.col6-article li a,
.col6-article-2 li a {
  display: block;
  font-weight: 100;
  font-size: 1.4rem;
  color: #000;
}

.col6-article li .thumb,
.col6-article-2 li .thumb {
  width: 230px;
  height: 160px;
  overflow: hidden;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

.col6-article li .thumb img,
.col6-article-2 li .thumb img {
  width: 230px;
  height: 160px;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transform: scale(1.3);
          transform: scale(1.3);
  -webkit-transform-origin: center;
          transform-origin: center;
}

.col6-article li .date,
.col6-article-2 li .date {
  font-size: 1.2rem;
}

.col6-article li .date,
.col6-article-2 li .date {
  font-weight: normal;
  color: #757575;
}

.col6-article li:last-child,
.col6-article-2 li:last-child {
  margin-right: 0;
}

.col6-article .more-box,
.col6-article-2 .more-box {
  min-width: 168px;
  height: 160px;
}

.col6-article .more-box a,
.col6-article-2 .more-box a {
  background: #fff;
  width: calc(100% - 8px);
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-right: 8px;
  padding: 10px;
  border-radius: 6px;
  overflow: hidden;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
}

.col6-article .more-box p,
.col6-article-2 .more-box p {
  width: 100%;
  text-align: center;
  margin: 0;
}

.col6-article .more-box p:first-child,
.col6-article-2 .more-box p:first-child {
  margin-bottom: 10px;
}

.col6-article .more-box .text-link,
.col6-article-2 .more-box .text-link {
  font-weight: bold;
}

.col6-article .btn-scroll,
.col6-article .btn-scroll-prev,
.col6-article-2 .btn-scroll,
.col6-article-2 .btn-scroll-prev {
  top: 150px;
}

.journal .col6-article ul li .thumb {
  position: relative;
}

.journal .col6-article ul .more-box .thumb:after {
  content: none;
}

.journal .col6-article ul .more-box a {
  background-color: #f5f5f5;
}

.journal .col6-article ul .btn-scroll,
.journal .col6-article ul .btn-scroll-prev {
  top: 146px;
}

.col6-article-2 ul li {
  width: 17%;
  min-width: 109px;
  margin-right: 8px;
}

.col6-article-2 ul li .thumb {
  width: 109px;
  height: 109px;
}

.col6-article-2 ul li .thumb img {
  width: 109px;
  height: 109px;
}

.col6-article-2 ul li .text {
  font-weight: bold;
  color: #333;
}

.col6-article-2 ul .more-box {
  min-width: 109px;
  height: 109px;
}

.col6-article-2 ul .more-box a {
  background: rgba(0, 0, 0, 0.1);
  height: 109px;
  padding: 0;
}

.col6-article-2 ul .more-box .text-link {
  font-size: 1.2rem;
}

.col6-article-2 ul .more-box .text-link:after {
  margin-left: 4px;
  margin-bottom: -2px;
}

@media (min-width: 768px) {
  .selections-area {
    padding: 40px 0;
  }
  .col6-article .js-scroll-box,
  .col6-article-2 .js-scroll-box {
    margin-left: 0;
    margin-right: 0;
  }
  .col6-article .js-scroll-box ul,
  .col6-article-2 .js-scroll-box ul {
    padding-left: 0;
    padding-right: 0;
  }
  .col6-article li {
    min-width: 290px;
  }
  .col6-article li .thumb {
    width: 290px;
    height: 164px;
  }
  .col6-article li .thumb img {
    width: 290px;
    height: 164px;
  }
  .col6-article li a:hover {
    opacity: .7;
  }
  .col6-article-2 ul li,
  .col6-article-2 ul .more-box {
    min-width: 160px;
    margin-right: 24px;
  }
  .col6-article-2 ul li .thumb,
  .col6-article-2 ul .more-box .thumb {
    width: 160px;
    height: 160px;
  }
  .col6-article-2 ul li .thumb img,
  .col6-article-2 ul .more-box .thumb img {
    width: 160px;
    height: 160px;
  }
  .col6-article-2 ul .more-box a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 160px;
  }
  .col6-article-2 ul .more-box .text-link {
    font-size: 1.6rem;
  }
  .col6-article-2 ul .more-box .text-link:after {
    margin-left: 10px;
    margin-bottom: -1px;
  }
}

@media (min-width: 1024px) {
  .col6-article ul {
    max-width: none;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
  }
  .col6-article li {
    margin-right: 32px;
  }
  .col6-article li a {
    font-size: 1.6rem;
  }
}

.banner-list figure {
  width: 100%;
  height: 100%;
}

.banner-list figure:before {
  background-color: rgba(0, 0, 0, 0.35);
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
}

.banner-list figcaption {
  width: calc(100% - 24px);
  font-weight: bold;
  color: #fff;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  white-space: normal;
}

.banner-list figcaption span {
  display: block;
}

.banner-list figcaption .area-name {
  font-size: 2.0rem;
}

.banner-list figcaption .area-subname {
  font-size: 1.6rem;
}

.banner-list.large figcaption .area-name,
.banner-list.large figcaption .area-subname {
  font-size: 1.6rem;
}

@media (max-width: 767px) {
  .banner-list figcaption .area-name {
    font-size: 1.4rem;
  }
  .banner-list figcaption .area-subname {
    font-size: 1.2rem;
  }
  .banner-list.large figcaption .area-subname {
    font-size: 1.2rem;
  }
}

@media (max-width: 767px) {
  .room-tab-frame {
    width: 100%;
    overflow: hidden;
  }
  .banner-list.large figcaption .area-name,
  .banner-list.large figcaption .area-subname {
    font-size: 1.6rem;
  }
}

/*
  その他パーツ
*/
/* スクロールボタン */
.btn-scroll,
.btn-scroll-prev,
.btn-scroll-2,
.btn-scroll-prev-2 {
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 10;
}

.btn-scroll:hover,
.btn-scroll-prev:hover,
.btn-scroll-2:hover,
.btn-scroll-prev-2:hover {
  opacity: 0.7;
  cursor: pointer;
}

.btn-scroll-prev,
.btn-scroll-prev-2 {
  display: none;
  right: inherit;
  left: 16px;
  margin-top: 4px;
}

.btn-scroll-prev .rotate,
.btn-scroll-prev-2 .rotate {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.btn-inactive {
  pointer-events: none;
}

/* KV */
.key-visual {
  width: 100%;
  height: calc(80vh - 116px);
  position: relative;
  color: #fff;
}

.key-visual h1 {
  text-shadow: 0 0 5px #000;
}

.key-visual .inner {
  position: absolute;
  width: 94%;
  top: 50%;
  left: 3%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  text-align: center;
  z-index: 2;
}

.key-visual .sns {
  width: 100%;
  position: absolute;
  bottom: 16px;
  left: 0;
  text-align: right;
  line-height: 1;
}

.featureRecommendRank__piechart {
  width: 88px;
  height: 88px;
  text-align: center;
}

.featureRecommendRank__circleValuation {
  -webkit-animation: circleValuation 3s;
  animation: circleValuation 3s;
  stroke: #0f0a64;
}

@-webkit-keyframes circleValuation {
  0% {
    stroke-dasharray: 0 427;
  }
}

@keyframes circleValuation {
  0% {
    stroke-dasharray: 0 427;
  }
}

.icon-off-eye, .icon-on-eye {
  background: url(/stcontents/img/common/icon-off-eye.svg) no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.icon-on-eye {
  background: url(/stcontents/img/common/icon-on-eye.svg) no-repeat;
  background-size: contain;
}

@media (min-width: 768px) {
  .icon-off-eye:hover, .icon-on-eye:hover {
    background-image: url(/stcontents/img/common/hover-icon-off-eye.svg);
  }
  .icon-on-eye:hover {
    background-image: url(/stcontents/img/common/hover-icon-on-eye.svg);
  }
}

.icon-frame {
  width: 18px;
  margin: 0 6px;
}

.icon-frame-2 {
  width: 32px;
  margin: 0 6px;
}

.icon-help {
  width: 20px;
}

@media (max-width: 767px) {
  .icon-frame,
  .icon-frame-2 {
    margin: 0 10px;
  }
}

.icon-map {
  background: #0F0A64 url(/stcontents/img/common/icon-map-white.svg) no-repeat center center;
  width: 32px;
  height: 32px;
  background-size: 22px;
  display: inline-block;
  border-radius: 4px;
  overflow: hidden;
  text-indent: -300px;
}

.icon-big {
  background: url(/stcontents/img/common/icon-big.svg) no-repeat;
  background-size: contain;
  width: 2.5rem;
  height: 2.5rem;
  cursor: pointer;
}

.icon-big:hover {
  background: url(/stcontents/img/common/hover-icon-big.svg) no-repeat;
  background-size: contain;
}

.slick-counter {
  bottom: 8px;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.3);
  height: auto !important;
  width: 4rem !important;
  border-radius: 2rem;
  padding: 0 .5rem;
  font-size: 1rem;
  text-align: center;
  color: #fff;
}

.kv-slider .slick-counter {
  display: block;
}

@media (min-width: 1024px) {
  .slick-counter {
    right: 0;
    font-size: 1.4rem;
  }
}

.icon-favorite a,
.icon-favorite-on a {
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

.icon-favorite a {
  background: url(/stcontents/img/common/icon-favorite.svg) no-repeat center center;
  background-size: 100%;
}

.icon-favorite-on a {
  background: url(/stcontents/img/common/icon-favorite-on.svg) no-repeat center center;
  background-size: 100%;
}

/* PC */
@media screen and (min-width: 768px) {
  .icon-favorite a:hover {
    background-image: url(/stcontents/img/common/icon-favorite-hover.svg);
    background-size: 100%;
  }
  .icon-favorite-on a:hover {
    background-image: url(/stcontents/img/common/icon-favorite-on-hover.svg);
    background-size: 100%;
  }
  .icon-map {
    width: 40px;
    height: 40px;
    background-size: auto;
  }
}

.btn-previous, .btn-next {
  background: url(/stcontents/img/common/icon-arrow-left-white.svg) no-repeat center center;
  background-size: contain;
  display: block;
  margin-top: 0;
  width: 50px;
  height: 26px;
  padding: 0;
  border: none;
  color: transparent;
  -webkit-filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
          filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
  cursor: pointer;
}

.btn-previous:hover, .btn-next:hover {
  background: url(/stcontents/img/common/left_Hover.svg) no-repeat center center;
}

.btn-next {
  background: url(/stcontents/img/common/icon-arrow-right-white.svg) no-repeat center center;
}

.btn-next:hover {
  background: url(/stcontents/img/common/right_Hover.svg) no-repeat center center;
}

.btn-scroll,
.btn-scroll-prev,
.btn-scroll-2,
.btn-scroll-prev-2 {
  width: 15px;
  height: 28px;
  margin: 0;
  font-size: 0;
  -webkit-filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
          filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
}

.btn-scroll,
.btn-scroll-2 {
  background: url(/stcontents/img/common/icon-arrow-right-white.svg) no-repeat center center;
  background-size: contain;
}

.btn-scroll:hover,
.btn-scroll-2:hover {
  background: url(/stcontents/img/common/right_Hover.svg) no-repeat center center;
}

.btn-scroll.btn-black,
.btn-scroll-2.btn-black {
  background: url(/stcontents/img/common/right_Hover.svg) no-repeat center center;
  background-size: contain;
}

.btn-scroll.btn-black:hover,
.btn-scroll-2.btn-black:hover {
  background: url(/stcontents/img/common/icon-arrow-right-white.svg) no-repeat center center;
}

.btn-scroll-prev,
.btn-scroll-prev-2 {
  background: url(/stcontents/img/common/icon-arrow-left-white.svg) no-repeat center center;
}

.btn-scroll-prev:hover,
.btn-scroll-prev-2:hover {
  background: url(/stcontents/img/common/left_Hover.svg) no-repeat center center;
}

.btn-scroll-prev.btn-black,
.btn-scroll-prev-2.btn-black {
  background: url(/stcontents/img/common/left_Hover.svg) no-repeat center center;
  background-size: contain;
}

.btn-scroll-prev.btn-black:hover,
.btn-scroll-prev-2.btn-black:hover {
  background: url(/stcontents/img/common/icon-arrow-left-white.svg) no-repeat center center;
}

.photo-article a {
  display: block;
  color: inherit;
}

.photo-article a:hover {
  opacity: 0.7;
}

.photo-article .flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.photo-article .flex .photo {
  width: 256px;
  overflow: hidden;
}

.photo-article .flex .photo img {
  width: 100%;
}

.photo-article .flex .text {
  width: calc(100% - 256px);
  padding-left: 24px;
}

.photo-article .flex .text .heading {
  margin-bottom: 8px;
}

.photo-article.half-box {
  border: 1px solid #EFEFEF;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 8px 8px;
  overflow: hidden;
}

.photo-article.half-box .photo {
  width: 43%;
}

.photo-article.half-box .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.photo-article.half-box .text {
  width: 57%;
  padding: 32px 32px;
}

.col2-article {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.col2-article > a {
  color: #333;
}

.col2-article > a:hover {
  opacity: 0.7;
}

.col2-article > * {
  background: #fff;
  width: calc(50% - 8px);
  display: block;
  margin-bottom: 16px;
  border: 1px solid #E5E5E5;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  border-radius: 8px;
  position: relative;
}

.col2-article > * .photo {
  width: 222px;
  height: 170px;
  line-height: 0;
}

.col2-article > * .photo img {
  width: 100%;
}

.col2-article > * .text {
  width: calc(100% - 222px);
  padding: 12px 40px 12px 16px;
}

.col2-article > *:after {
  content: url(/stcontents/img/common/icon-arrow-right-4.svg);
  position: absolute;
  top: 50%;
  right: 16px;
  margin-top: -8px;
}

@media (max-width: 1023px) {
  .col2-article {
    display: block;
  }
  .col2-article > * {
    width: 100%;
    margin-bottom: 8px;
  }
  .col2-article > *:last-child {
    margin-bottom: 0;
  }
  .col2-article > * .flex .photo {
    width: 116px;
    height: 116px;
    overflow: hidden;
  }
  .col2-article > * .flex .photo img {
    height: 100%;
  }
  .col2-article > * .flex .text {
    width: calc(100% - 116px);
    padding: 4px 32px 0 8px;
  }
  .col2-article > * .flex .text .heading {
    margin-bottom: 0;
  }
  .col2-article > * .flex .font-xx-large {
    font-size: 1.6rem;
  }
}

@media (max-width: 767px) {
  .photo-article.col-1.mt-40 {
    margin-top: 24px;
  }
  .photo-article.col-1 .flex {
    display: block;
  }
  .photo-article.col-1 .flex .photo {
    width: 100%;
    max-height: 280px;
    position: relative;
  }
  .photo-article.col-1 .flex .photo img {
    width: 100%;
  }
  .photo-article.col-1 .flex .text {
    width: 100%;
    padding-left: 0;
  }
  .photo-article.col-1 .flex .text p {
    margin-bottom: 0;
  }
  .photo-article.col-1 .flex .heading {
    position: absolute;
    bottom: 16px;
    left: 16px;
    color: #fff;
  }
  .photo-article.col-1.half-box .flex .photo {
    height: auto;
  }
  .photo-article.col-1.half-box .flex .photo img {
    height: auto;
  }
  .photo-article.col-1.half-box .flex .text {
    padding: 8px 16px;
  }
}

@media (min-width: 768px) {
  .key-visual {
    height: 80vh;
  }
  .index .key-visual {
    max-height: 540px;
    min-height: 520px;
    height : 540px;
  }
  .icon-off-eye, .icon-on-eye {
    width: 25px;
    height: 25px;
  }
  .icon-frame {
    width: 24px;
  }
  .icon-frame-2 {
    width: 32px;
  }
  .icon-help {
    width: 24px;
  }
  .icon-big {
    width: 3.5rem;
    height: 3.5rem;
  }
  .icon-favorite a,
  .icon-favorite-on a {
    width: 40px;
    height: 40px;
  }
}

.frame-sub-list .btn-detail a {
  width: 100%;
  margin-top: 8px;
}

.frame-sub-list .page-number {
  display: none;
  background: rgba(255, 255, 255, 0.3);
  position: absolute;
  top: 8px;
  right: 20px;
  padding: 0 4px;
  border-radius: 15px;
  z-index: 1;
  font-size: 10px;
  color: #fff;
}

.frame-sub-list .sub-box > a {
  display: block;
  color: #333;
}

.frame-sub-list .sub-box > a:hover {
  opacity: 0.7;
}

.frame-sub-list .sub-box .sub-box-name {
  padding: 8px 16px 0;
}

.frame-sub-list .sub-box .sub-box-name .font-large {
  font-size: 1.6rem;
}

.frame-sub-list .sub-box .sub-box-name a {
  color: #333;
}
.frame-sub-list .sub-box .sub-box-name a::after {
  content: ' >';
}

@media (max-width: 767px) {
  .frame-sub-list.carousel-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    margin-bottom: 24px;
    padding: 0;
  }
  .frame-sub-list.carousel-box::-webkit-scrollbar {
    height: 4px;
  }

  /* スクロールバーの削除 */
  .frame-sub-list.carousel-box {
    /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
    -ms-overflow-style: none;
    /*Firefoxへの対応*/
    scrollbar-width: none;
  }
  .frame-sub-list.carousel-box::-webkit-scrollbar {
    /*Google Chrome、Safariへの対応*/
    display: none;
  }

  .frame-sub-list.carousel-box::-webkit-scrollbar-thumb {
    background-color: transparent;
    background-color: #C6C6C6;
  }
  .frame-sub-list.carousel-box::-webkit-scrollbar-track {
    background-color: #F5F5F5;
  }
  .frame-sub-list.carousel-box .sub-box {
    width: 280px;
    margin-right: 8px;
    margin-left: 0;
    min-width: 280px;
  }
  .frame-sub-list.carousel-box .sub-box:first-child {
    margin-left: 16px;
  }
  .frame-sub-list.carousel-box .sub-box:last-child {
    margin-right: 16px;
  }
  .frame-sub-list .page-number {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
}

@media (min-width: 1024px) {
  .root-sub-list.responsive-2col .sub-box, .responsive-2col.root-main-foot .sub-box {
    -webkit-flex-basis: calc(100% / 2 - 1rem);
        -ms-flex-preferred-size: calc(100% / 2 - 1rem);
            flex-basis: calc(100% / 2 - 1rem);
  }
}

@media (min-width: 1120px) {
  .root-sub-list.responsive-2col .sub-box, .responsive-2col.root-main-foot .sub-box {
    -webkit-flex-basis: 26.8rem;
        -ms-flex-preferred-size: 26.8rem;
            flex-basis: 26.8rem;
  }
}

@media (max-width: 767px) {
  .index .key-visual .common-overlay,
  .search-bar-wrap .common-overlay,
  .search-wrap .common-overlay {
    display: none !important;
  }
}

.ro-box .sub-box {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.ro-box .sub-box figure .link-coupon:after {
  content: none;
}

.ro-box .frame-card-float {
  padding-right: 1.4rem;
}

.ro-box .ro-line {
  background: #F5F5F5;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 4px 16px;
  font-weight: bold;
  letter-spacing: 0;
  color: #0F0A64;
}

.ro-box .ro-line img {
  margin-right: 8px;
  height: auto;
}

.ro-box figure p {
  margin-bottom: 2px;
}

.ro-box .tag-label-white {
  background: #fff;
  color: #FF503E;
  border: 1px solid #FF503E;
  position: absolute;
  top: 16px;
  left: 16px;
}

.ro-box .tag-label,
.ro-box .tag-label-white {
  padding: 0 10px;
  line-height: 22px;
  font-size: 1.2rem;
  -webkit-transform: none;
          transform: none;
}

.ro-box .tag-multi-box {
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  top: 16px;
  left: 16px;
}

.ro-box .tag-multi-box > div {
  position: relative;
  top: auto;
  left: auto;
  margin-right: 8px;
}

.ro-box .tag-multi-box .tag-label-ro {
  line-height: 0 !important;
}

.ro-box .tag-multi-box .tag-label-ro img {
  height: 24px;
}

.ro-box .bg-red {
  background-color: #FF503E;
  color: #fff;
  border: 1px solid #FFF;
}

.ro-box .sub-box-detail {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.ro-box .sub-box-detail .note {
  font-size: 1.4rem;
}

.sub-box-detail .boost-box {
  height: 18px;
  margin-top: 8px;
}
.sub-box-detail .boost-box + .price-tax {
  height: 25px;
}

.hotel-info-list .feature-hotel-name {
   border-left: 2px solid #FF503E;
   padding-left: 8px;
}

@media screen and (max-width: 1200px) and (min-width: 1120px){
  .sub-box-detail .boost-box {
    font-size: 1rem;
  }
}

.ro-box .no-room .ro-line,
.ro-box .no-date .ro-line {
  display: none;
}

.ro-box .no-room .sub-box-detail,
.ro-box .no-date .sub-box-detail {
  padding-top: 10px;
}

.ro-box .no-date .sub-box-detail {
  min-height: 0;
  padding: 22px 0 35px !important;
}

.ro-box .intro-text {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 14px;
}

.ro-box .intro-text.color-gray-2 {
  margin-top: 0;
}

.ro-box .button-action {
  margin-top: 10px;
}

.ro-box .button-action a {
  width: 100%;
}

.ro-box .button-action .btn-disabled {
  background: #f5f5f5;
  margin-top: 8px;
  border: none;
  opacity: 1;
  color: #C6C6C6;
}

.ro-box .price-tax {
  font-size: 14px;
}

.ro-box .price-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  line-height: 1.5;
}

.ro-box .price-box .people {
  display: inline-block;
  padding-bottom: 3px;
  letter-spacing: 0;
  color: #757575;
}

.ro-box .price-box .price {
  margin-left: 4px;
  font-weight: bold;
  font-size: 20px;
}

.ro-box .no-login .sub-box-detail {
  min-height: 0;
  padding: 16px 16px;
}

@media (max-width: 767px) {
  .ro-box .intro-text {
    padding: 0;
  }
  .ro-box .tag-label-white {
    height: 18px;
    font-size: 1rem;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    align-items: center;
  }
  .ro-box .tag-multi-box .tag-label-ro img {
    height: 18px;
  }
  .ro-box .sub-box-detail {
    min-height: 0;
  }
}

.no-room-text {
  width: 100%;
}

.root-sub-list.large-style .sub-box-detail .color-gray-2, .large-style.root-main-foot .sub-box-detail .color-gray-2 {
  font-size: 1.4rem;
}

.root-sub-list.large-style .sub-box-detail .price-box .people, .large-style.root-main-foot .sub-box-detail .price-box .people {
  font-size: 1.4rem;
}

.root-sub-list.large-style .sub-box-detail .price-box .price, .large-style.root-main-foot .sub-box-detail .price-box .price {
  font-size: 2.4rem;
}

@media (max-width: 767px) {
  .root-sub-list.large-style .sub-box-detail .font-large, .large-style.root-main-foot .sub-box-detail .font-large {
    font-size: 1.6rem;
  }
}

.float-bar {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  background: #fff;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  padding: 16px 16px;
  text-align: center;
  -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
          box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
  z-index: 20;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.float-bar.active {
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.campaign-package .float-bar .btn-block {
  display: flex;
  justify-content: center;
  margin-bottom: 8px;
}

.float-bar .btn-block a {
  max-width: calc(50% - 4px);
  width: 224px;
  margin-right: 6px;
}

.campaign-package .float-bar a {
  max-width: calc(50% - 8px);
  width: 224px;
  margin-right: 8px;
}

.campaign-package .float-bar a:last-child {
  margin-right: 0;
  margin-left: 8px;
}

.float-bar .btn-block a:last-child {
  margin-right: 0;
  margin-left: 6px;
}

.modal-on .float-bar:last-of-type {
  display: none;
}

.float-bar.default {
  transform: translateY(0) !important;
}
@media screen and (max-width: 1023px){
  .float-bar.default {
    padding: 0 16px 8px;
  }

  .float-bar .btn-block a {
    margin-right: 8px;
  }

  .float-bar .btn-block a:last-child {
    margin-left: 0;
  }
}

.low-contents {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.text-low {
  display: inline-block;
  margin: 0 16px 8px;
}

@media (max-width: 1023px) {
  .low-contents .pc-only {
    display: none !important;
  }
  .sp-low-contents .sp-only {
    display: flex !important;
    justify-content: center;
    margin-bottom: 0;
    margin-top: 8px;
    font-size: 1.2rem;
  }
  .campaign-package .float-bar .btn-block {
    margin-bottom: 5px;
  }
}

@media (max-width: 767px) {
  .float-bar {
    z-index: 20;
  }
  .float-bar .text {
    margin-top: 8px;
    margin-bottom: 0;
    font-size: 1.2rem;
  }
  .campaign-package .float-bar {
    padding: 8px 16px !important;
  }
  .campaign-package .float-bar a {
    font-size: 1.4rem;
    width: 166px;
    height: 40px;
    max-width: initial;
    margin-right: 8px;
  }
  .campaign-package .float-bar a:last-child {
    margin-left: 0;
    margin-right: 0;
  }
  .float-bar .float-bar-message {
    letter-spacing: 0;
    margin-bottom: 16px;
  }
}

.select-dropdown {
  width: 99px;
  display: inline-block;
  position: relative;
}

.select-dropdown .dropdown {
  display: none;
}

.select-dropdown ul, .select-dropdown li, .select-dropdown span {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
}

.select-dropdown ul {
  margin: 0px;
  padding: 0px;
  top: 37px;
  left: 0;
  width: 100%;
  max-height: 350px;
  border-radius: 4px;
  display: none;
  position: absolute;
  list-style: none;
  z-index: 2;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  overflow: auto;
}

.select-dropdown ul li {
  height: 48px;
  border: 1px solid #F5F5F5;
  border-top: none;
  background-color: #FFFFFF;
  line-height: 48px;
  text-align: center;
  cursor: pointer;
}

.select-dropdown ul li span {
  color: #757575;
  font-size: 0.875rem;
}

.select-dropdown ul li.active {
  background-color: #F5F5F5;
}

.select-dropdown ul.active {
  display: block;
}

.select-dropdown span.select-frame {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0 0 8px 11px;
  width: 100%;
  border-bottom: 1px solid #C6C6C6;
  display: block;
  color: #757575;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.select-dropdown .dropdown-select-button {
  width: 17px;
  height: 9px;
  position: absolute;
  top: 9px;
  right: 0;
  cursor: pointer;
}

.select-dropdown .dropdown-select-button::before, .select-dropdown .dropdown-select-button::after {
  content: '';
  background-color: #333333;
  display: block;
  position: absolute;
  width: 14px;
  height: 2px;
  top: 50%;
  right: 21px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.select-dropdown .dropdown-select-button::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.select-dropdown .dropdown-select-button::after {
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.select-dropdown .dropdown-select-button.active::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.select-dropdown .dropdown-select-button.active::after {
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.child-type.options div.active::before,
.child-type.options div.active::after {
  display: none;
}

@media (min-width: 768px) {
  .select-dropdown span.select-frame {
    border-width: 2px;
  }
}

.js-half-modal-overlay {
  width: 100%;
  height: 100%;
  background-color: rgba(198, 198, 198, 0.7);
  cursor: pointer;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 51;
  display: none;
}

.js-half-modal-container {
  width: 100%;
  height: 80%;
  bottom: -81%;
  left: 0;
  border-radius: 16px 16px 0 0;
  background: #FFF;
  position: fixed;
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
  overflow: auto;
  z-index: 52;
  opacity: 0;
}

.js-half-modal-trigger {
  cursor: pointer;
}

.js-half-modal-close {
  margin: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  position: absolute;
  top: 7px;
  right: 0;
  z-index: 53;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.js-half-modal-close::before {
  content: "";
  width: 20px;
  height: 20px;
  border-right: 2px solid #000;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  position: absolute;
  top: 12px;
  left: -3px;
}

.js-half-modal-close::after {
  content: "";
  width: 20px;
  height: 20px;
  border-right: 2px solid #000;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  position: absolute;
  top: -2px;
  left: -3px;
}

@-webkit-keyframes SlideUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1%);
            transform: translateY(-1%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(-80%);
            transform: translateY(-80%);
  }
}

@keyframes SlideUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1%);
            transform: translateY(-1%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(-80%);
            transform: translateY(-80%);
  }
}

@-webkit-keyframes SlideDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-80%);
            transform: translateY(-80%);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-1%);
            transform: translateY(-1%);
  }
}

@keyframes SlideDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(-80%);
            transform: translateY(-80%);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-1%);
            transform: translateY(-1%);
  }
}

.js-half-modal-container._slideUp {
  -webkit-animation: SlideUp .3s ease-in-out forwards;
          animation: SlideUp .3s ease-in-out forwards;
}

.js-half-modal-container._slideDown {
  opacity: 0;
  -webkit-transform: translateY(-1%);
          transform: translateY(-1%);
}

.half-modal-head {
  background: #FFF;
  z-index: 1;
  border-radius: 16px 16px 0 0;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

.half-modal-head-inner {
  position: relative;
}

.half-modal-content {
  overflow-y: scroll;
}

.half-modal-content::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.half-modal-content::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.half-modal-content::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.half-modal-content dt {
  font-weight: bold;
}

/* ハーフモーダル サイズ（＝height）別class */
.half-modal-container-280 {
  height: 280px !important;
  bottom: -281px;
}

.half-modal-container-320 {
  height: 320px !important;
  bottom: -321px;
}

.half-modal-container-360 {
  height: 360px !important;
  bottom: -361px;
}

.half-modal-container-400 {
  height: 400px !important;
  bottom: -401px;
}

.half-modal-container-440 {
  height: 440px !important;
  bottom: -441px;
}

.half-modal-container-480 {
  height: 480px !important;
  bottom: -481px;
}

.half-modal-container-520 {
  height: 520px !important;
  bottom: -521px;
}

.half-modal-container-560 {
  height: 560px !important;
  bottom: -561px;
}

.half-modal-container-600 {
  height: 600px !important;
  bottom: -601px;
}

.js-spinner-btn {
  -ms-user-select: none;
  -moz-user-select: -moz-none;
  -webkit-user-select: none;
  user-select: none;
}

.spinner-area input {
  border: none;
  width: auto;
  vertical-align: middle;
}

.spinner-area input[type="button"] {
  cursor: pointer;
  color: #FFF;
  background: #0F0A64;
  border-radius: 4px;
  padding: 3px 7px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.spinner-area input[type="button"].disabled {
  background: #C6C6C6;
}

.spinner-area input[type="number"] {
  width: 20px !important;
  text-align: center;
  padding: 3px 0;
  border: none !important;
}

.spinner-area span {
  position: relative;
  top: 2px;
}

.spinner-area input[type="number"]::-webkit-outer-spin-button,
.spinner-area input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.spinner-area input[type="number"] {
  -moz-appearance: textfield;
}

.font-century {
  font-family: 'Century Gothic', sans-serif;
}
.no-login-kv {
  background-image: url(/stcontents/img/sub-page/lp/secret/bg-kv-1.png), url(/stcontents/img/sub-page/lp/secret/bg-kv-2.png), linear-gradient(180deg, #1E1E1E, #2B2A2A);
  background-position: left top, right bottom 88px;
  background-repeat: no-repeat, no-repeat;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  text-shadow: 1px 1px 1px #000;
}

@media screen and (max-width: 1024px){
  .no-login-kv .inner {
    padding: 0 16px;
  }
}

@media screen and (max-width: 767px){
  .no-login-kv {
    background-image: url(/stcontents/img/sub-page/lp/secret/bg-kv-1-sp.png), url(/stcontents/img/sub-page/lp/secret/bg-kv-2-sp.png), linear-gradient(180deg, #1E1E1E, #2B2A2A);
    background-size: 100%, 100%;
    background-position: left top, right bottom 56px;
    background-repeat: no-repeat, no-repeat;
  }
  .no-login-kv .h1-title {
    font-size: 24px;
    line-height: 1.5;
  }
}
@media screen and (max-width: 360px){

  .no-login-kv .inner * {
    font-size: 11px !important;
  }
  .no-login-kv .h1-title {
    font-size: 18px !important;
  }
}

.coupon-list .coupon-ticket {
  max-width: 928px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #C6C6C6;
}

.coupon-list .coupon-ticket .js-half-modal-trigger {
  text-decoration: none;
}

.coupon-list .coupon-ticket-expired {
  border: none;
}

.coupon-list .coupon-data-sub {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.coupon-list .coupon-data-wrap {
  padding: 16px;
}

.coupon-list .coupon-data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: bold;
}

.coupon-list .coupon-data dt {
  min-width: 86px;
}

.coupon-list .coupon-data-hidden {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: column-reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}

.coupon-list .coupon-unusable {
  color: #757575;
}

.coupon-list .coupon-unusable .coupon-data-sub {
  color: #333;
}

.coupon-list .coupon-ticket-reserve {
  position: relative;
}

.coupon-list .coupon-ticket-reserve .coupon-control {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 1;
}

.coupon-list .coupon-ticket-reserve input[type="radio"] {
  display: none;
}

.coupon-list .coupon-ticket-reserve input[type="radio"]:checked ~ .coupon-data-wrap {
  border: 2px solid #A6BCE9;
  padding: 15px !important;
}

.coupon-list .coupon-ticket-reserve .coupon-data-wrap:has(> .coupon-data-sub input[type="checkbox"]:checked) {
  border: 2px solid #A6BCE9;
  padding: 15px !important;
}

.coupon-list .coupon-ticket-reserve .coupon-data-wrap {
  display: block;
  cursor: pointer;
}

.coupon-list .coupon-ticket-reserve .accordion-content {
  width: 100%;
}

.coupon-list .coupon-ticket-reserve .js-coupon-terms-open {
  width: 100% !important;
}

.coupon-list .coupon-ticket-reserve .js-coupon-terms-open::before {
  content: "利用条件をみる";
}

.coupon-list .coupon-ticket-reserve .js-coupon-terms-close::before {
  content: "とじる";
}

.coupon-list .coupon-data-pc {
  display: none;
}

.coupon-target-hotel {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.coupon-target-hotel .default-link-black {
  text-decoration: none;
}

.coupon-target-hotel .default-link-black:hover {
  text-decoration: underline;
}

.reservation .coupon-list .coupon-ticket .input-checkbox {
  vertical-align: text-top;
  margin-right: 0;
}
.reservation .coupon-list .coupon-ticket.disabled {
  pointer-events: none;
  color: #c6c6c6;
}
.reservation .coupon-list .coupon-ticket.disabled .coupon-data-sub .tag-coupon {
  border: 1px solid #c6c6c6;
  color: #c6c6c6;
}
.reservation .coupon-list .coupon-ticket.disabled .coupon-data-sub .tag-fcfs {
  border: 1px solid #c6c6c6;
  color: #c6c6c6;
}
.reservation .coupon-list .coupon-ticket.disabled .coupon-terms {
  color: #c6c6c6;
}
.reservation .coupon-list .coupon-ticket.disabled .coupon-data-sub small:last-child::before {
  background-color: #c6c6c6;
}
.reservation .coupon-list .coupon-ticket.checked .coupon-data-wrap {
  border: 4px solid #A6BCE9;
  padding: 13px !important;
}
.reservation .coupon-list .coupon-notice {
  padding: 8px;
  border: 1px solid #333;
  font-size: 12px;
}

@media (min-width: 768px) {
  .coupon-list .coupon-data-sub span {
    margin-right: 8px;
  }
  .coupon-list .coupon-data-sub small {
    font-size: 1.4rem;
  }
  .coupon-list .coupon-data-main-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .coupon-list .coupon-data {
    margin: 0 32px 8px 0;
  }
  .coupon-list .coupon-data dt {
    min-width: auto !important;
    margin-right: 16px;
    font-size: 1.2rem;
  }
  .coupon-list .coupon-data dd {
    font-size: 1.4rem;
  }
  .coupon-list .coupon-data-wrap {
    padding: 24px 64px;
    border: none;
  }
  .coupon-list .coupon-data-hidden {
    width: 100%;
    -webkit-box-flex: 0;
    -webkit-flex: none;
        -ms-flex: none;
            flex: none;
    display: block !important;
    border-top: 1px solid #C6C6C6;
    padding-top: 16px;
    margin: 8px 0 0 0 !important;
  }
  .coupon-list .coupon-terms {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
  }
  .coupon-list .coupon-terms dt {
    margin-bottom: 0;
    width: 100px !important;
    float: left;
    font-size: 1.2rem;
  }
  .coupon-list .coupon-terms dd {
    float: right;
    width: calc(100% - 100px);
  }
  .coupon-list .coupon-ticket-expired {
    color: #757575 !important;
  }
  .coupon-list .coupon-ticket-reserve .js-accordion-open {
    display: none;
  }
  .coupon-list .coupon-ticket-reserve .accordion-content {
    display: block;
  }
  .coupon-list .coupon-ticket-mypage .coupon-data-pc {
    display: block;
    width: 100%;
  }
  .coupon-list .coupon-ticket-mypage .coupon-data-pc dt {
    font-weight: bold;
  }
  .coupon-list .coupon-ticket-mypage .js-half-modal-trigger {
    display: none;
  }
}

@media screen and (max-width: 767px){
  .reservation .coupon-list .coupon-ticket.checked .coupon-data-wrap {
    border: 2px solid #A6BCE9;
    padding: 15px !important;
  }
}

.coupon-hotel-modal {
  height: auto !important;
  max-width: 768px !important;
}

.coupon-hotel-modal .coupon-target-hotel {
  max-height: 240px;
  overflow-y: scroll;
}

.coupon-hotel-modal .coupon-target-hotel::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.coupon-hotel-modal .coupon-target-hotel::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.coupon-hotel-modal .coupon-target-hotel::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.half-modal-scroll {
  overflow-y: scroll;
  max-height: 104px;
}

.half-modal-scroll::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.half-modal-scroll::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.half-modal-scroll::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.half-modal-scroll .coupon-target-hotel li {
  font-size: 1.0rem;
  margin: 0 8px 8px 0;
  letter-spacing: 0;
}

.reserve-input-point {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reserve-input-point input {
  width: 65%;
  border-radius: 4px 0 0 4px !important;
}

.reserve-input-point .text-box {
  height: 48px;
}

.reserve-input-point .btn-submit {
  min-width: 88px;
  height: 48px;
  margin-left: 0;
  padding: 8px 28px;
  border-radius: 0 4px 4px 0;
}

@media screen and (max-width: 767px) {
  .reserve-input-point .btn-submit {
    padding: 8px 16px;
  }
}

.common-modal-min .modal-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

@media screen and (min-width: 768px) {
  .common-modal-min {
    border-radius: 4px;
  }
  .common-modal-min .common-modal-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
  }
  .common-modal-min .modal-container {
    display: block;
    margin: auto;
    height: auto;
    border-radius: 4px;
  }
  .common-modal-min .modal-container-inner {
    display: block;
  }
  .min-modal-width {
    max-width: 520px;
  }
}

@media screen and (max-width: 767px) {
  .modal-container-inner {
    width: 100%;
  }
}

.timeout-modal .timeout-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (min-width: 768px) {
  .timeout-modal {
    height: 268px;
    max-width: 560px !important;
  }
  .timeout-modal .modal-container {
    max-width: 560px;
  }
  .timeout-modal .timeout-modal-btn a {
    width: 224px;
  }
}

.hotel-info-list {
  padding-top: 16px;
}

.hotel-info-list .result-hotel {
  display: block;
  height: auto;
  margin-bottom: 16px;
  color: #333;
  border-radius: 8px;
}

.hotel-info-list .result-hotel:last-child {
  margin-bottom: 0;
}

.hotel-info-list .result-hotel .upper {
  position: relative;
  overflow: hidden;
}

.hotel-info-list .result-hotel .photo {
  width: 560px;
  height: 300px;
  overflow: hidden;
}

.hotel-info-list .result-hotel .photo > a {
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.hotel-info-list .result-hotel .photo > a:hover {
  opacity: .7;
}

.hotel-info-list .result-hotel .photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.hotel-info-list .result-hotel .ranking-card {
  border-radius: 8px;
}

.hotel-info-list .result-hotel .photo-ranking {
  width: 560px;
  height: 300px;
  overflow: hidden;
}

.hotel-info-list .result-hotel .photo-ranking img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.hotel-info-list .result-hotel .hotel-info {
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  top: auto;
  left: 0px;
  bottom: 0px;
  padding: 24px;
  width: 560px;
}

.hotel-info-list .result-hotel .hotel-info .name {
  color: #ffffff;
  margin-bottom: 0;
  letter-spacing: 1px;
}

.hotel-info-list .result-hotel .hotel-info .address {
  font-size: 1.4rem;
  color: #ffffff;
}

.hotel-info-list .result-hotel .sale-icon {
  top: 0;
}

.hotel-info-list .result-hotel .icon-grade {
  height: 20px;
  margin: 0 2px;
}

.hotel-info-list .result-hotel .text-link {
  color: #0F0A64 !important;
}

.hotel-info-list .result-hotel .text-link:hover {
  color: #554B98 !important;
}

.hotel-info-list .result-hotel .text-link:hover::after {
  opacity: .7;
}

.hotel-info-list .result-hotel .price-box {
  color: #ffffff;
  position: relative;
  right: 0;
  bottom: 0;
  font-size: 1.4rem;
  float: right;
}

.hotel-info-list .result-hotel .intro {
  font-size: 1.6rem;
}

.hotel-info-list .result-hotel .info-text {
  left: 585px;
  top: 24px;
  padding-right: 24px;
  position: absolute;
}

.hotel-info-list .result-hotel .info-text-ranking {
  left: 585px;
  top: 32px;
  bottom: 32px;
  padding-right: 24px;
  position: absolute;
}

.hotel-info-list .result-hotel .ranking-intro {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  margin-top: 4px;
  font-size: 1.6rem;
}

.hotel-info-list .result-hotel .intro-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  margin-bottom: 8px;
}

.hotel-info-list .result-hotel .ranking-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  margin-top: 16px;
  font-size: 1.6rem;
}

.hotel-info-list .result-hotel .point-price-box .price {
  margin-bottom: 0;
  font-weight: normal;
}

.hotel-info-list a.result-hotel:hover {
  opacity: 0.7;
}

.hotel-info-list .text-link-gray {
  color: #757575 !important;
}

.hotel-info-list .text-link-gray:hover {
  color: #000 !important;
}

.hotel-info-list.large-style .intro .font-bold {
  font-size: 1.4rem;
}

.hotel-info-list.hotel-info-plan .result-hotel .info-text {
  height: 100%;
}
.hotel-info-list.hotel-info-plan .result-hotel .intro-text,
.hotel-info-list.hotel-info-plan .result-hotel .text-link {
  font-size: 1.4rem;
}
.hotel-info-list.hotel-info-plan .result-hotel .price-box {
  position: absolute;
  bottom: 40px;
  right: 24px;
  color: inherit;
}
.hotel-info-list.hotel-info-plan .result-hotel .people {
  font-weight: normal;
}

.hotel-info-list .feature-hotel-name {
   border-left: 2px solid #FF503E;
   padding-left: 8px;
}


@media screen and (max-width: 1023px) {
  .hotel-info-list.hotel-info-plan .result-hotel .price-box {
    position: relative;
    bottom: inherit;
    right: auto;
    float: right;
    margin: 8px 0 16px;
    clear: both;
    text-shadow: none;
  }
  .hotel-info-list.hotel-info-plan .result-hotel .price-box .price {
    font-size: 2rem;
  }
  .hotel-info-list.hotel-info-plan .result-hotel .people {
    font-size: 1.3rem;
  }
  .hotel-info-list.hotel-info-plan .result-hotel .photo:before {
    content: none;
  }
  .hotel-info-list.hotel-info-plan .result-hotel .photo a:before {
    content: "";
    background: linear-gradient(transparent 50%, rgba(0, 0, 0, 0.7));
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }
}

@media (max-width: 767px) {
  .hotel-info-list .result-hotel .hotel-info .address {
    max-width: 50%;
  }
  .hotel-info-list.large-style .intro .font-bold {
    font-size: 1.6rem;
  }
}

@media (min-width: 768px) {
  .hotel-info-list .result-hotel .name {
    font-size: 2rem;
  }
  .hotel-info-list .result-hotel .price-box .price {
    line-height: 1;
    font-size: 2.6rem;
  }
  .hotel-info-list .result-hotel .text-link-gray {
    font-size: 1.6rem;
  }
  .hotel-info-list .result-hotel .card-border {
    border: solid 1px #f5f5f5;
    border-radius: 8px;
  }
}

@media (max-width: 1023px) {
  .hotel-info-list .result-hotel .photo {
    width: 100%;
    height: 240px;
  }
  .hotel-info-list .result-hotel .photo:before {
    content: "";
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), to(rgba(0, 0, 0, 0.7)));
    background: -webkit-linear-gradient(transparent 50%, rgba(0, 0, 0, 0.7));
    background: linear-gradient(transparent 50%, rgba(0, 0, 0, 0.7));
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }
  .hotel-info-list .result-hotel .photo-ranking {
    width: 100%;
    height: 184px;
  }
  .hotel-info-list .result-hotel .photo-ranking:before {
    content: "";
    background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), to(rgba(0, 0, 0, 0.7)));
    background: -webkit-linear-gradient(transparent 50%, rgba(0, 0, 0, 0.7));
    background: linear-gradient(transparent 50%, rgba(0, 0, 0, 0.7));
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }
  .hotel-info-list .result-hotel .icon-ranking {
    width: 30px;
  }
  .hotel-info-list .result-hotel .hotel-info {
    width: 100%;
    padding: 16px;
  }
  .hotel-info-list .result-hotel .hotel-info .name {
    margin-bottom: 8px;
  }
  .hotel-info-list .result-hotel .hotel-info .address {
    font-size: 1rem;
  }
  .hotel-info-list .result-hotel .people {
    font-size: 1rem;
  }
  .hotel-info-list .result-hotel .price {
    font-weight: bold;
  }
  .hotel-info-list .result-hotel .price-box {
    margin-top: -22px;
  }
  .hotel-info-list .result-hotel .pc-only {
    display: none !important;
  }
  .hotel-info-list .result-hotel .sp-only {
    display: block !important;
  }
  .hotel-info-list .result-hotel .intro {
    padding: 8px 16px 0;
  }
  .hotel-info-list .result-hotel .text-link-gray {
    margin-top: 0;
  }
}

@media (max-width: 360px) {
  .hotel-info-list .result-hotel .hotel-info .address {
    max-width: 40%;
  }
}

.list-asterisk li {
  margin-left: 1em;
  list-style-type: none;
  text-indent: -1em;
}

.list-asterisk li::before {
  display: inline;
  content: "※";
}

.text-asterisk {
  display: inline-block;
  margin-left: 1em;
  list-style-type: none;
  text-indent: -1em;
}

.text-asterisk::before {
  display: inline;
  content: "※";
}

.list-indent li {
  margin-left: 1em;
  list-style-type: none;
  text-indent: -1em;
}

.list-indent li::before {
  display: inline;
  content: "・";
}

.list-indent.no-type li {
  list-style-type: none;
}

.icn-modal-gray:after {
  background: url(/stcontents/img/common/icon-modal-link-gray.svg) no-repeat 0 center;
  content: "";
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-left: 4px;
  margin-bottom: -3px;
}

.icn-modal-black:after {
  background: url(/stcontents/img/common/icon-modal-link-black.svg) no-repeat 0 center;
  content: "";
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-left: 4px;
  margin-bottom: -3px;
}

.stepnavi-small {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 520px;
  position: relative;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.stepnavi-small li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  list-style: none;
  position: relative;
  width: 33.333%;
  color: #333;
  font-weight: bold;
  line-height: 1;
}

.stepnavi-small li:after {
  background: #C6C6C6;
  content: "";
  width: calc(100% - 68px);
  height: 2px;
  position: absolute;
  left: calc(-50% + 34px);
  top: 12px;
}

.stepnavi-small li:first-child::after {
  display: none;
}

.stepnavi-small .stepnavi-circle {
  background: #FFF;
  display: inline-block;
  height: 24px;
  line-height: 24px;
  width: 24px;
  border-radius: 50%;
  border: 2px solid #C6C6C6;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-right: 6px;
}

.stepnavi-small .stepnavi-circle img {
  width: 16px;
  height: 16px;
  position: relative;
  top: 1px;
}

.stepnavi-circle img {
  display: none;
}

.step-completed .stepnavi-circle {
  background: #0F0A64 !important;
  border: 2px solid #0F0A64 !important;
}

.step-completed img {
  display: inline-block;
}

.step-currently .stepnavi-circle {
  background: #0F0A64 !important;
  border: 2px solid #0F0A64 !important;
}

.stepnavi-header .stepnavi-small {
  bottom: 30px;
}

@media screen and (min-width: 768px) {
  .stepnavi-header .before-menu {
    margin-top: 20px;
  }
}

@media screen and (max-width: 768px) {
  .stepnavi-header .stepnavi-small {
    display: none;
  }
}

@media screen and (max-width: 920px) {
  .stepnavi-header .stepnavi-small {
    max-width: 320px;
  }
}

.js-auth-code .input-error-word {
  display: none;
}

.js-auth-code .js-auth-code-btn[disabled] {
  opacity: .2;
}

.js-auth-code .auth-code-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 400px;
}

.js-auth-code .auth-code-input input[type="text"] {
  font-size: 2.4rem;
  font-weight: bold;
  text-align: center;
  width: 60px;
  height: 68px;
}

.auth-code-error input[type="text"] {
  border: 1px solid #CE0000;
}

.auth-code-error .input-error-word {
  display: block;
}


@media screen and (max-width: 430px) {
  .js-auth-code .auth-code-input input[type="text"] {
    font-size: 2.0rem;
    width: 100%;
    height: 56px;
    margin-right: 8px;
  }
  .js-auth-code .auth-code-input input[type="text"]:last-of-type {
    margin-right: 0;
  }
}

.social-buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.social-buttons .social-button {
  margin-right: 24px;
}

.social-buttons .social-button:last-child {
  margin-right: 0;
}

.social-buttons .social-button > a {
  width: 48px;
  height: 48px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  border: 1px solid #ccc;
  border-radius: 2px;
  background-color: #fff;
}

.social-buttons .social-button > a img {
  width: 24px;
  height: 24px;
}

.score {
  display: inline-block;
  vertical-align: top;
}

.score div {
  margin-left: 2px;
  width: 20px;
  height: 20px;
  border: 2px solid #0F0A64;
  border-radius: 50%;
  display: inline-block;
  vertical-align: top;
}

.score div.active {
  background-color: #0F0A64;
}


@media screen and (max-width: 767px) {
  .score {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .score div {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin-right: 4px;
    padding: 0;
    width: 14px;
    height: 14px;
    border: 2px solid #0F0A64;
    border-radius: 50%;
    display: inline-block;
    vertical-align: top;
  }
  .score div.active {
    background-color: #0F0A64;
  }
}

.hotel-gmap iframe {
  width: 100%;
  height: 560px;
  margin-bottom: 10px;
}

.number-text-list {
  counter-reset: number 0;
}

.btn-number-text {
  max-width: 100%;
  background: #FFFFFF;
  display: inline-block;
  position: relative;
  border: 1px solid #C6C6C6;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
  margin: 0 16px 2px 0;
  padding: 8px 8px 8px 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #0F0A64;
}

.btn-number-text:before {
  counter-increment: number 1;
  content: counter(number) " ";
  padding-left: 4px;
  font-size: 10px;
  margin-right: 12px;
  color: #fff;
  z-index: 10;
  position: relative;
  margin-top: -5px;
  display: inline-block;
  vertical-align: middle;
  letter-spacing: 0;
}

.btn-number-text:after {
  display: block;
  content: "";
  position: absolute;
  top: 10px;
  left: 8px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #0f0a64;
}

.btn-number-text:nth-of-type(n+10):after {
  left: 11px;
}

@media screen and (max-width: 767px) {
  .hotel-gmap iframe {
    height: 400px;
  }
  .btn-number-text {
    margin-bottom: 8px;
    font-size: 1.4rem;
  }
  .btn-number-text:before {
    margin-top: -2px;
  }
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
  border: 1px solid #0F0A64;
}

/*
input-type:numberからスピンボタンを削除するclass
*/
.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
  -moz-appearance: textfield;
}

.mypage-btn-double {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.mypage-btn-double a, .mypage-btn-double button {
  width: 176px;
}

.alert-modal-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.alert-modal-btn a {
  width: 82px;
}

.withdrawal-done .main-page-white .wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: calc(100vh - 60px);
}

.alert-modal {
  border-radius: 4px;
}

.alert-modal .common-modal-inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
}

.alert-modal .modal-container {
  max-width: 432px;
  width: calc(100% - 32px);
  display: block;
  margin: auto;
  height: auto;
  border-radius: 4px;
}

@media (max-width: 500px) {
  .alert-modal .modal-container {
    padding: 16px;
  }
}

@media (max-width: 767px) {
  .alert-modal .modal-container {
    padding: 16px;
  }
  .alert-modal .alert-modal-btn .btn-small {
    width: 50%;
  }
}

.region_tab {
  background: #FFF;
  overflow: hidden;
}

.region_tab .col6-article-2-wrap {
  border-bottom: 2px solid #0F0A64;
  position: relative;
}

.region_tab .col6-article-2 {
  overflow-y: hidden;
  padding-bottom: 0;
  position: static;
}

.region_tab .col6-article-2 .btn-scroll-prev,
.region_tab .col6-article-2 .btn-scroll-prev-2,
.region_tab .col6-article-2 .btn-scroll,
.region_tab .col6-article-2 .btn-scroll-2 {
  top: 50%;
  -webkit-filter: none;
          filter: none;
  background: none;
  width: 1.3rem;
  margin: 0 1rem;
}

.region_tab .col6-article-2 .btn-scroll-prev img,
.region_tab .col6-article-2 .btn-scroll-prev-2 img,
.region_tab .col6-article-2 .btn-scroll img,
.region_tab .col6-article-2 .btn-scroll-2 img {
  width: 1.3rem;
}

.region_tab .col6-article-2 .btn-scroll-prev,
.region_tab .col6-article-2 .btn-scroll-prev-2 {
  left: .6rem;
}

.region_tab .col6-article-2 .btn-scroll,
.region_tab .col6-article-2 .btn-scroll-2 {
  right: -.6rem;
}

.region_tab .col6-article-2 ul {
  padding-right: 0;
}

.region_tab .col6-article-2 ul li {
  margin: 0;
  padding: 0;
  float: none;
  min-width: auto;
  white-space: nowrap;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.region_tab .col6-article-2 ul li:hover {
  background-color: #554B98;
  color: #FFF;
}

.region_tab .col6-article-2 .btn-scroll-2 .icon-inactive {
  display: none;
}

.region_tab .col6-article-2 .btn-scroll-prev-2 .icon-inactive {
  display: none;
}

.region_tab .col6-article-2 .btn-inactive .icon-active {
  display: none;
}

.region_tab .col6-article-2 .btn-inactive .icon-inactive {
  display: block;
}

.region_tab .region_tab-data > *.active {
  background-color: #0F0A64;
  color: #FFF;
}

.region_tab .region_tab-data > *.active a {
  color: #fff;
}

.region_tab .region_tab-data a {
  font-size: 1.6rem;
  font-weight: bold;
  color: #0F0A64;
}

.region_tab .region_tab-data > *:hover a {
  color: #fff;
}

.region_tab .js-region_tab {
  text-align: center;
  font-weight: bold;
  color: #0F0A64;
  font-weight: bold;
  display: block;
  padding: 0 12px 0 20px !important;
  height: 4rem;
  line-height: 4rem;
  font-size: 1.6rem;
  cursor: pointer;
}

.region_tab .js-region_tab.none {
  pointer-events: none;
  color: #C6C6C6;
}

.region_tab .js-region_tab .area-nuber {
  font-size: 1.4rem;
}

.region_tab .btn-scroll-prev.pc-only,
.region_tab .btn-scroll-prev-2.pc-only {
  display: none;
}

.region_tab .region_tab-content .tab-content-inner {
  display: none;
}

.region_tab .region_tab-content .tab-content-inner.show {
  display: block !important;
}

/*
地域選択Tab >
（※幅1120px以上:左右のナビゲーション非表示 → 1120px以下:表示 → 768px以下:再度非表示)
*/
.region_tab-fits .region_tab .col6-article-2 ul li a {
  text-align: center;
  font-weight: bold;
  color: #0F0A64;
  font-weight: bold;
  display: block;
  font-size: 1.6rem;
  height: 4rem;
  line-height: 4rem;
  cursor: pointer;
}

.region_tab-fits .region_tab .col6-article-2 ul li a:hover {
  color: #FFF;
  opacity: 1;
}

.region_tab-fits .region_tab .col6-article-2 ul li.active a {
  background-color: #0F0A64;
  color: #FFF;
}

.region_tab-fits .region_tab .region_tab-content .prefecture_list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.region_tab-fits .region_tab .region_tab-content .prefecture_list .prefecture_btn {
  margin: 0 8px 8px 0;
}

.region_tab-fits .region_tab .linkPrefectureAll {
  display: none;
}

.region_tab-fits .region_tab .region_tab-content .prefecture_list .prefecture_btn a,
.region_tab-fits .region_tab .linkPrefectureAll a {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 16px;
  width: 100%;
  height: 32px;
  white-space: nowrap;
  background-color: #FFF;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  font-size: 1.4rem;
  font-weight: bold;
  color: #0F0A64;
}

.region_tab-fits .region_tab .region_tab-content .prefecture_list .prefecture_btn a:hover,
.region_tab-fits .region_tab .linkPrefectureAll a:hover {
  border-color: #554B98;
  color: #554B98;
}

.region_tab-fits .region_tab .region_tab-content .prefecture_list .prefecture_btn.active a,
.region_tab-fits .region_tab .linkPrefectureAll.active a {
  background: #0F0A64;
  color: #FFF;
  border: 1px solid #0F0A64;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area {
  display: none;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area.large_area-show,
.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area.spa_area-show {
  display: block;
  border-bottom: 2px solid #EBEBEB;
  border-top: 2px solid #EBEBEB;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area.spa_area-show {
  border: none;
}

/* 
地域選択Tab > 温泉選択Tab設定
 */
.region_tab-fits-2 .region_tab-2 {
  background: #FFF;
  overflow: hidden;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content p {
  font-size: 2rem;
  font-weight: 700;
  margin-top: 8px;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags {
  display: flex;
  flex-wrap: wrap;
  margin-top: 0;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li {
  padding: 0 16px 0 0;
  margin: 0 16px 8px 0;
  position: relative;
  min-width: 100px;
}

 .region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 24px;
  background-color: #757575;
  position: absolute;
  top: 4px;
  right: 0;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li a {
  border: none;
  color: #333;
  font-size: 1.6rem;
  font-weight: 400;
  margin: 0;
  padding: 0;
  background: none!important;
  text-decoration: none;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li a:hover {
  color: #0F0A64;
  cursor: pointer;
  font-weight: 700;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li.active a {
  color: #0F0A64;
  font-weight: 700;
  pointer-events: none;
}

.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area-hide {
  display: none;
}

 /* 
地域選択Tab > 温泉選択Tab設定 END
 */

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_inner,
.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area_inner {
  overflow: hidden;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_tags {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-top: 0;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_tags a {
  margin-bottom: 8px;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_more,
.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area_more {
  text-align: center;
  color: #757575;
  cursor: pointer;
  background: #FFF;
  font-size: 1.4rem;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_more span,
.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area_more span {
  position: relative;
  display: inline-block;
  padding-right: 3rem;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_more span:after,
.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area_more span:after {
  content: "";
  background: url(/stcontents/img/common/icon-accordion-gray.svg) no-repeat 0 0;
  background-size: contain;
  position: absolute;
  display: block;
  width: 1.5rem;
  height: 0.8rem;
  display: inline-block;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

.region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_more.is-active span:after,
.region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_list .spa_area_more.is-active span:after
 {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.region_tab-fits .region_tab-2 .col6-article-2 ul li {
  min-width: 90px;
}

.region_tab-fits .region_tab-2 .col6-article-2 ul li.name-mid {
  min-width: 93px;
}

.region_tab-fits .region_tab-2 .col6-article-2 ul li.name-long {
  min-width: 118px;
}

.region_tab-fits .region_tab-3 .col6-article-2 ul li {
  min-width: 80px;
}

.region_tab-fits .region_tab-3 .col6-article-2 ul li.name-mid {
  min-width: 90px;
}

.region_tab-fits .region_tab-3 .col6-article-2 ul li.name-long {
  min-width: 120px;
}

@media (min-width: 768px) {
  .type-page .region_tab .col6-article-2-wrap,
  .search-from-area .region_tab .col6-article-2-wrap {
    padding: 0 3.3rem;
  }
  .feature-page .region_tab .col6-article-2-wrap {
    padding: 0;
  }
  .region_tab .left-show,
  .feature-page .region_tab .left-show {
    padding-left: 3.3rem;
  }
  .region_tab .right-show,
  .feature-page .region_tab .right-show {
    padding-right: 3.3rem;
  }
  .region_tab .col6-article-2 {
    width: auto;
  }
  .region_tab .btn-scroll-prev.pc-only,
  .region_tab .btn-scroll-prev-2.pc-only {
    display: block;
  }
  .region_tab .large_area_list .large_area_tags li {
    padding: 0 16px 0 0;
    margin: 0 16px 8px 0;
    position: relative;
  }
  .region_tab .large_area_list .large_area_tags li:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 24px;
    background-color: #757575;
    position: absolute;
    top: 4px;
    right: 0;
  }
  .region_tab .large_area_list .large_area_tags li a {
    border: none;
    color: #333;
    font-weight: normal;
    margin: 0;
    padding: 0;
    background: none !important;
    text-decoration: none;
  }
  .region_tab .large_area_list .large_area_tags li a:hover {
    color: #0F0A64;
    font-weight: bold;
  }
  .region_tab .large_area_list .large_area_tags li.active a {
    color: #0F0A64;
    font-weight: bold;
    pointer-events: none;
  }
  .root-sub-list, .root-main-foot {
    padding-top: 1.6rem;
  }
  .region_tab-fits .region_tab .col6-article-2 ul {
    width: 108rem;
  }
  .region_tab-content {
    margin: 0 auto;
    width: 100%;
  }
  .large_area,
  .spa_area {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .large_area_inner,
  .spa_area_inner {
    height: auto !important;
  }
  .large_area_more,
  .spa_area_more {
    display: none !important;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list .large_area.large_area-show:has(> .no_onsen) {
    border-bottom: none;
  }
}

@media (max-width: 767px) {
  .region_tab-fits .region_tab .col6-article-2-wrap {
    padding: 0;
  }
  .region_tab-fits .region_tab .col6-article-2 ul li {
    font-size: 1.4rem;
    min-width: 64px;
  }
  .region_tab-fits .region_tab .col6-article-2 ul li.name-mid {
    min-width: 64px;
  }
  .region_tab-fits .region_tab .col6-article-2 ul li .name-long {
    min-width: 94px;
  }
  .region_tab-fits .region_tab .col6-article-2 ul li a {
    font-size: 1.4rem;
  }
  .region_tab-fits .region_tab .region_tab-content .prefecture_list .prefecture_btn {
    margin-right: 4px;
  }
  .region_tab-fits .region_tab .region_tab-content .prefecture_list .prefecture_btn a,
  .region_tab-fits .region_tab .linkPrefectureAll a {
    padding: 0 10px;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list {
    width: calc(100% + 32px);
    margin: 0 -16px;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list .large_area.large_area-show {
    padding: 16px 16px 8px 16px;
    border-top: 2px solid #EBEBEB;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_tags {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_tags li {
    margin-bottom: 8px;
    margin-right: 24px;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_tags li a {
    margin-right: 0;
    color: #0F0A64;
    text-decoration: underline;
  }
  .region_tab-fits .region_tab .region_tab-content .large_area_list .large_area_tags li.active a {
    color: #757575;
    text-decoration: none;
    pointer-events: none;
  }
  .region_tab-fits-2 .region_tab-2 .region_tab-content p {
    font-size: 1.6rem;
  }
  .region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li {
    margin: 0 8px 8px 0;
    padding: 0;
    min-width: auto;
  }
  .region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li::after {
    display: none;
  }
  .region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li a {
    color: #0F0A64;
    font-size: 1.4rem;
    font-weight: 400;
    text-decoration: underline;
  }
  .region_tab-fits-2 .region_tab-2 .region_tab-content .spa_area_tags li.active a {
    font-weight: 400;
    pointer-events: auto;
  }
  .region_tab-fits-2 .region_tab-2 .region_tab-content .tab-content-inner .spa_area_more {
    margin: 0 -16px;
    padding: 0 16px 8px 16px;
    border-bottom: 2px solid #EBEBEB;
  }

  /* 
地域選択Tab > 温泉選択Tab設定-SP END
 */
}

@media (min-width: 1120px) {
  .region_tab-fits .region_tab .col6-article-2-wrap {
    padding: 0;
  }
  .region_tab-fits .region_tab .col6-article-2 ul {
    width: 100% !important;
  }
  .region_tab-fits .region_tab .col6-article-2 .btn-scroll-2,
  .region_tab-fits .region_tab .col6-article-2 .btn-scroll-prev-2 {
    display: none;
  }
}

.carousel-area .col3-article,
.carousel-area .slick-slider {
  margin-bottom: 0 !important;
}

.carousel-area .col3-article {
  padding-bottom: 24px;
}

.carousel-area .slick-slider {
  overflow: visible;
}

@media (max-width: 767px) {
  .carousel-area .col3-article {
    margin-top: 16px;
    padding-bottom: 0;
  }
  .carousel-area .slick-slider {
    overflow: hidden;
  }
}

.carousel-area .col3-article .js-carousel-slider {
  display: -webkit-box;
}

.carousel-area .col3-article .js-carousel-slider.slick-slider {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.carousel-wrap {
  overflow: hidden;
}

.carousel-wrap li {
  width: 352px;
  max-height: 12vw;
  height: 120px;
  margin-right: 32px;
  border-radius: 8px;
  overflow: hidden;
}

.carousel-wrap li a {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}

.carousel-wrap li a .text {
  width: 100%;
  height: auto;
  -webkit-line-clamp: unset;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  padding: 0 10px;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
  font-size: 2.4rem;
  color: #fff;
}

.carousel-wrap img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

@media (max-width: 1280px) {
  .carousel-wrap li {
    width: 341px;
  }
}

@media (max-width: 1150px) {
  .carousel-wrap li {
    width: calc(31vw - 6px);
    margin-right: 2vw;
  }
}

@media (max-width: 900px) {
  .carousel-wrap li {
    width: calc(31vw - 8px);
  }
}

@media (max-width: 767px) {
  .carousel-wrap {
    height: 120px;
    overflow: hidden;
  }
  .carousel-wrap .slick-list {
    overflow-x: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .carousel-wrap li {
    width: 256px;
    max-height: none;
    margin-right: 8px;
  }
  .carousel-wrap li a .text {
    font-size: 1.6rem;
  }
  .carousel-wrap .slick-arrow {
    display: none !important;
  }
}

.carousel-wrap .slick-next,
.carousel-wrap .slick-prev {
  background-image: none;
  right: 0;
}

.carousel-wrap .slick-next::before,
.carousel-wrap .slick-prev::before {
  background-image: url(/stcontents/img/common/SwipeArrow_right.png);
  background-size: contain;
  width: 48px;
  height: 48px;
  right: 4px;
  display: inline-block;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  color: transparent;
}

.carousel-wrap .slick-next:hover,
.carousel-wrap .slick-prev:hover {
  background-image: none;
  background-size: contain;
}

.carousel-wrap .slick-next:hover::before,
.carousel-wrap .slick-prev:hover::before {
  background-image: url(/stcontents/img/common/SwipeArrow_right_hover.png);
  background-size: contain;
}

.carousel-wrap .slick-prev {
  left: 0;
}

.carousel-wrap .slick-prev::before {
  background-image: url(/stcontents/img/common/SwipeArrow_left.png);
  left: 4px;
}

.carousel-wrap .slick-prev:hover::before {
  background-image: url(/stcontents/img/common/SwipeArrow_left_hover.png);
  left: 4px;
}

.carousel-wrap .slick-dots {
  width: auto;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: -18px;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  pointer-events: none;
}

.carousel-wrap .slick-dots li {
  width: auto;
  height: auto;
  margin: 0 2px;
}

.carousel-wrap .slick-dots li button {
  background: #fff;
  width: 8px;
  height: 8px;
  opacity: 1;
  font-size: 10px;
  border: 1px solid #ccc;
  border-radius: 50%;
  padding: 0;
}

.carousel-wrap .slick-dots li button:before {
  content: none;
}

.carousel-wrap .slick-dots li.slick-active button {
  background: #c6c6c6;
  width: 10px;
  height: 10px;
}

@media (max-width: 767px) {
  .carousel-wrap .slick-dots {
    display: none;
  }
}

.relux-grade {
  padding: 16px 24px;
  background-image: url(/stcontents/img/common/reluxgrade-bg-sp.png);
  background-size: cover;
  background-repeat: no-repeat;
  color: #FFF;
}

.relux-grade .relux-grade-title {
  margin-bottom: 24px;
}

.relux-grade .relux-grade-title h2 {
  font-size: 2.4rem;
  margin-bottom: 12px;
}

.relux-grade .relux-grade-title p {
  margin-bottom: 0;
  padding-left: 24px;
  border-left: 1px solid #FF503E;
  padding-left: 8px;
  font-weight: 100;
}

.relux-grade figure {
  margin-bottom: 24px;
  text-align: center;
}

.relux-grade figure img {
  width: 100%;
  max-width: 327px;
  height: auto;
}

.relux-grade .col3-article {
  margin-left: -24px;
  margin-right: -24px;
}

.relux-grade .col3-article li {
  -webkit-box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.relux-grade .col3-article li .bg {
  border: 1px solid #A6BCE9;
}

.relux-grade .col3-article li .bg::before {
  content: '';
  background: rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.relux-grade .col3-article .grade {
  margin-bottom: 2px;
}

.relux-grade .col3-article .grade img {
  height: 12px;
  margin-right: 2px;
  -webkit-filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.6));
          filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.6));
}

.relux-grade .col3-article .grade img.museum {
  height: 16px;
  margin-right: 0;
}

@media (min-width: 768px) {
  .relux-grade {
    padding: 32px 38px 40px 38px;
    background-image: url(/stcontents/img/common/reluxgrade-bg.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .relux-grade .relux-grade-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 32px;
  }
  .relux-grade .relux-grade-title h2 {
    margin-bottom: 0;
    font-weight: normal;
    line-height: 1.2;
    white-space: nowrap;
  }
  .relux-grade .relux-grade-title p {
    margin-left: 24px;
  }
  .relux-grade figure {
    margin-bottom: 0;
  }
  .relux-grade figure img {
    max-width: 837px;
  }
  .relux-grade .col3-article {
    margin: 0;
    padding-bottom: 0;
  }
  .relux-grade .col3-article .text {
    display: none;
  }
  .relux-grade .col3-article li {
    width: 196px;
    height: 100px;
  }
  .relux-grade .col3-article li .inner {
    top: 0;
    padding: 8px;
  }
  .relux-grade .col3-article li .bg::before {
    background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(rgba(0, 0, 0, 0)));
    background: -webkit-linear-gradient(top, #000000 0%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
    height: 45px;
    opacity: .6;
  }
  .relux-grade .col3-article .slick-next {
    width: 48px;
    height: 48px;
    background: url(/stcontents/img/common/SwipeArrow_right.png) no-repeat center center;
    background-size: contain;
    right: 12px;
    top: 55%;
  }
  .relux-grade .col3-article .slick-next:hover {
    background: url(/stcontents/img/common/SwipeArrow_right_hover.png) no-repeat center center;
    width: 48px;
    height: 48px;
    background-size: contain;
  }
  .relux-grade .col3-article .slick-prev {
    background: url(/stcontents/img/common/SwipeArrow_left.png) no-repeat center center;
    width: 48px;
    height: 48px;
    background-size: contain;
    left: 12px;
    top: 55%;
  }
  .relux-grade .col3-article .slick-prev:hover {
    background: url(/stcontents/img/common/SwipeArrow_left_hover.png) no-repeat center center;
    width: 48px;
    height: 48px;
    background-size: contain;
  }
}

@media (min-width: 1280px) {
  .relux-grade .col3-article .slick-arrow {
    display: none !important;
  }
  .relux-grade .col3-article .slick-track {
    width: 100% !important;
    -webkit-transform: none !important;
            transform: none !important;
  }
}

.app-banner {
  max-width: 1120px;
  height: auto;
  margin: 0 auto;
  background-color: #EBEBEB;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 24px 16px;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.app-banner .device {
  margin-right: 54px;
}

.app-banner .device img {
  width: 222px;
}

.app-banner .title h3 {
  padding: 0;
  margin-bottom: 8px;
}

.app-banner .title p.font-large {
  margin-bottom: 16px;
}

.app-banner .title .qrList {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 24px;
}

.app-banner .title .qrList .qr01 {
  margin-right: 40px;
}

.app-banner .title .qrList img.btn-app {
  height: 45px;
  margin-right: 8px;
}

.app-banner .title .qrList img.qr {
  height: 45px;
}

@media screen and (min-width: 768px) and (max-width: 1120px) {
  .app-banner .device {
    margin-right: 32px;
  }
  .app-banner .device img {
    width: 158px;
    height: 191px;
  }
}

@media (max-width: 767px) {
  .app-banner {
    width: 100%;
    display: block;
    text-align: center;
    padding: 24px 16px;
  }
  .app-banner .device {
    margin-right: 0;
  }
  .app-banner .description {
    margin-bottom: 24px;
    text-align: center;
  }
  .app-banner .description .font-large {
    font-size: 1.2rem;
  }
  .app-banner .description .font-small {
    font-size: 1rem;
    letter-spacing: 0;
  }
  .app-banner .title .qrList {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 16px;
  }
  .app-banner .title .qrList .qr01 {
    margin-right: 8px;
  }
  .app-banner .title .qrList .qr02 {
    margin: 0;
  }
  .app-banner .title .qrList img.qr {
    display: none;
  }
  .app-banner .title .qrList img.btn-app {
    margin: 0;
  }
}

/***** 開発環境対応 ******/
/* stripe部品用のcss設定 */
.StripeElement {
  height: 45px;
  line-height: 45px;
  vertical-align: middle;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 12px;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  -webkit-appearance: none;
}

.__PrivateStripeElement {
  width: 100%;
}

.on .StripeElement--empty {
  border: 1px solid #CE0000;
}

.on .StripeElement--focus {
  border: 1px solid #0F0A64;
}

.on .StripeElement--invalid {
  border: 1px solid #CE0000;
}

.index h1 {
  text-align: center;
}

.index h1 img {
  width: 290px;
  max-width: 100%;
}

.index h2 {
  margin-bottom: 16px;
}

.index .key-visual a {
  color: #fff;
}

.index .key-visual .js-slick-slider .slick-arrow {
  display: none !important;
}

.index .btn-slide-arrow .slick-prev:focus {
  background: url(/stcontents/img/common/left_Hover-3.svg) no-repeat center center;
  background-size: contain;
}
.index .btn-slide-arrow .slick-next:focus {
  background: url(/stcontents/img/common/right_Hover-3.svg) no-repeat center center;
  background-size: contain;
}

.index .history .btn-scroll-prev,
.index .history .btn-scroll {
  display: none !important;
}

@media screen and (max-width: 767px) {
  .index .relux-grade .col3-article {
      margin-left: -16px;
      margin-right: -16px;
  }
}
.btn-calendar-close {
  text-align: right;
}

.btn-calendar-close .btn-popup-close {
  background: none;
  width: auto;
  height: 40px;
  display: -webkit-inline-box !important;
  display: -webkit-inline-flex !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  z-index: auto;
}

.btn-calendar-close .color-relux {
  color: #0F0A64 !important;
}

.index .btn-area .color-relux {
  color: #0F0A64 !important;
}

.index .js-slick-slider {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.index .js-slick-slider .slick-track,
.index .js-slick-slider .slick-list,
.index .js-slick-slider .slick-slide {
  height: 100%;
  position: relative;
}

.index .js-slick-slider .hotel-1 {
  background: url(/stcontents/img/index/kv-1.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-2 {
  background: url(/stcontents/img/index/kv-2.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-3 {
  background: url(/stcontents/img/index/kv-3.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-4 {
  background: url(/stcontents/img/index/kv-4.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-5 {
  background: url(/stcontents/img/index/kv-5.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-6 {
  background: url(/stcontents/img/index/kv-6.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-7 {
  background: url(/stcontents/img/index/kv-7.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-8 {
  background: url(/stcontents/img/index/kv-8.jpg) no-repeat center center;
}

.index .js-slick-slider .hotel-9 {
  background: url(/stcontents/img/index/kv-9.jpg) no-repeat center center;
}

.index .js-slick-slider .slick-counter {
  position: absolute;
  bottom: 16px;
}

.index .js-slick-slider .slick-current .hotel-info, .index .js-slick-slider .slick-current .hotel-info2 {
  opacity: 1;
}

.index .js-slick-slider .hotel-info {
  opacity: 0;
  width: 100%;
  height: auto;
  position: absolute;
  bottom: 48px;
  font-size: 14px;
}

.index .js-slick-slider .hotel-info .hotel-info-inner {
  max-width: 1128px;
  margin: 0 auto;
  height: auto;
  margin: 0 auto;
  padding: 0 42px 0 16px;
  text-align: left;
}

.index .js-slick-slider .hotel-info .text {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  max-width: 1088px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 8px 6px;
  background: rgba(0, 0, 0, 0.2);
}

.index .js-slick-slider .hotel-info .text:hover {
  opacity: .7;
}

.index .js-slick-slider .hotel-info .text .grade {
  width: 66px;
  height: 20px;
  margin-right: 8px;
}

.index .js-slick-slider .hotel-info .text .name {
  display: inline;
}

.index .js-slick-slider .hotel-info .text p {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 0;
}

.index .js-slick-slider .hotel-info .text .arrow {
  display: inline;
  margin-left: 8px;
}

.index .js-slick-slider .hotel-info2 {
  opacity: 0;
  width: 100%;
  height: auto;
  position: absolute;
  bottom: 48px;
}

.index .js-slick-slider .hotel-info2 .hotel-info-inner2 {
  max-width: 1128px;
  margin: 0 auto;
  height: auto;
  margin: 0 auto;
  padding: 0 42px 0 16px;
  text-align: right;
}

.index .js-slick-slider .hotel-info2 .hotel-info-inner2 a {
  font-size: 14px;
  text-decoration: underline;
  text-shadow: 1px 1px 1px #000;
}

.index .js-slick-slider .hotel-info2 .hotel-info-inner2 a:hover {
  text-decoration: none;
}

.key-visual .js-slick-slider .slick-track,
.key-visual .js-slick-slider .slick-list,
.js-kv-slider .slick-track,
.js-kv-slider .slick-list {
  height: 100%;
}

@media screen and (max-width: 767px) {
  .key-visual .js-slick-slider .slick-slide,
  .js-kv-slider .slick-slide {
    background-size: cover !important;
  }

  .index .js-slick-slider .hotel-info2 {
    bottom: 24px;
  }
}

.key-visual .js-slick-slider .slick-slide {
  background-size: cover !important;
  width: 100vw !important;
  position: absolute !important;
  left: 0 !important;
}

.index .key-hotels {
  opacity: 0;
  position: absolute;
  right: 16px;
  margin-left: 16px;
  bottom: 45px;
  text-align: right;
  text-shadow: 0 0 5px #000;
}

.index .key-hotels a {
  background: rgba(0, 0, 0, 0.3);
  display: block;
  padding: 16px 32px 16px 16px;
  border-radius: 8px;
  text-decoration: none;
}

.index .key-hotels a:after {
  background: url(/stcontents/img/common/icon-arrow-right-white-2.svg) no-repeat 0 0;
  background-size: contain;
  content: "";
  display: block;
  width: 6px;
  height: 9px;
  position: absolute;
  top: 50%;
  right: 10px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.slick-current .key-hotels {
  opacity: 1;
}

.index .key-hotels .grade {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.index .key-hotels .grade img {
  height: 14px;
}

.index .key-hotels .name {
  line-height: 1.5;
  font-weight: 500;
  font-size: 1.6rem;
}

.index .key-hotels .price {
  margin-bottom: 0;
  font-size: 1rem;
}

.index .key-hotels .price span {
  font-weight: 500;
  font-size: 1.8rem;
}

.index .popup-position {
  bottom: 40px;
}

@media (min-width: 768px) {
  .index h1 img {
    width: auto;
  }
  .index .key-visual .js-slick-slider .slick-arrow {
    display: inline-block !important;
  }
  .index .key-visual .js-slick-slider .slick-prev:hover,
  .index .key-visual .js-slick-slider .slick-next:hover {
    opacity: 0.7;
  }
  .index .key-visual .js-slick-slider .slick-prev {
    left: calc(8% - 20px);
    right: auto;
  }
  .index .key-visual .js-slick-slider .slick-next {
    left: auto;
    right: calc(8% - 20px);
  }
  .index .key-visual .js-slick-slider .slick-counter {
    bottom: 24px;
  }
  .index .key-hotels {
    bottom: 24px;
    right: calc(8% - 20px);
  }
  .index .key-hotels a {
    background: none;
    padding: 16px;
  }
  .index .key-hotels a:hover {
    background: rgba(0, 0, 0, 0.3);
  }
  .index .key-hotels a:after {
    content: none;
  }
  .index .key-hotels .grade img {
    height: auto;
  }
  .index .key-hotels .name {
    max-width: 515px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 2.4rem;
  }
  .index .key-hotels .price {
    font-size: 1.2rem;
  }
  .index .key-hotels .price span {
    font-size: 2.4rem;
  }
}

@media (max-width: 767px) {
  .index .searchBoxArea.fixed {
    background: #fff;
    padding: 0;
    left: 0;
    right: 0;
    -webkit-transform: none;
            transform: none;
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
  }
  .index .searchBoxArea.fixed .searchBox {
    width: calc(100vw - 32px);
    height: 48px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    border-radius: 0;
    border: none;
  }
  .index .searchBoxArea.fixed .searchBox .box.area {
    width: 100%;
    height: auto;
    border: none;
    border-radius: 0;
  }
  .index .searchBoxArea.fixed .searchBox .box.area #text::-webkit-input-placeholder {
    color: #c6c6c6;
  }
  .index .searchBoxArea.fixed .searchBox .box.area #text:-ms-input-placeholder {
    color: #c6c6c6;
  }
  .index .searchBoxArea.fixed .searchBox .box.area #text::-ms-input-placeholder {
    color: #c6c6c6;
  }
  .index .searchBoxArea.fixed .searchBox .box.area #text::placeholder {
    color: #c6c6c6;
  }
  .index .searchBoxArea.fixed .searchBox .searchBtn {
    width: 20px;
  }
  .index .searchBoxArea.fixed .searchBox .searchBtn button {
    background: transparent url(/stcontents/img/common/icon-search.svg) no-repeat 4px center;
    width: 100%;
    border: none;
  }
  .index .searchBoxArea.fixed .searchBox .searchBtn button img {
    display: none;
  }
  .index .searchBoxArea.modal-on.fixed {
    background: #fff;
    position: fixed;
    top: 0;
    padding: 32px 0 0;
    -webkit-transform: none;
            transform: none;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .index .searchBoxArea.modal-on.fixed .searchBox {
    border-bottom: 1px solid #C6C6C6;
  }
  .index .hotel-info .text {
    display: block !important;
  }
  .index .key-visual .inner {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
  .index .js-slick-slider .hotel-info2 .hotel-info-inner2 {
    padding-right: 16px;
  }
  .index .js-slick-slider .slick-counter {
    bottom: 8px;
  }
}

.index .selections-area {
  overflow: hidden;
  padding: 24px 0 140px;
  margin-bottom: 0;
}

.index .selections-area .text-link-gray {
  float: right;
}

.index .selections-area .col6-article li {
  margin-bottom: 0;
}

.index .selections-area .col6-article li .title {
  margin-bottom: 0;
}

.index .selections-area .btn-scroll,
.index .selections-area .btn-scroll-2 {
  width: 48px;
  height: 48px;
  background: url(/stcontents/img/common/SwipeArrow_right.png) no-repeat center center;
  background-size: contain;
}

.index .selections-area .btn-scroll:hover,
.index .selections-area .btn-scroll-2:hover {
  background: url(/stcontents/img/common/SwipeArrow_right_hover.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .selections-area .btn-scroll-prev,
.index .selections-area .btn-scroll-prev-2 {
  background: url(/stcontents/img/common/SwipeArrow_left.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .selections-area .btn-scroll-prev:hover,
.index .selections-area .btn-scroll-prev-2:hover {
  background: url(/stcontents/img/common/SwipeArrow_left_hover.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

@media (min-width: 768px) {
  .index .selections-area {
    padding: 24px 0 200px;
    margin-bottom: 0;
  }
}

.index .campaign {
  padding: 40px 0;
}

.index .campaign .wrap {
  padding: 0;
}

.index .campaign .campaign-list {
  position: relative;
  margin-bottom: 0;
}

.index .campaign .campaign-list .slick-dots {
  position: absolute;
  bottom: 8px;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
}

.index .campaign .campaign-list .slick-dots li {
  position: relative;
  display: inline-block;
  cursor: pointer;
  width: auto;
  height: auto;
  margin: 0 2px;
}

.index .campaign .campaign-list .slick-dots li button {
  background-color: #fff;
  width: 2px;
  height: 2px;
  opacity: 1;
  border-radius: 50%;
  line-height: 0;
  color: transparent;
  padding: 0;
}

.index .campaign .campaign-list .slick-dots li button::before {
  display: none;
}

.index .campaign .campaign-list .slick-dots li.slick-active button {
  width: 4px;
  height: 4px;
}

.index .campaign .campaign-list .slick-dots li:only-child {
  display: none;
}

.index .campaign .campaign-list .slick-arrow {
  width: 15px;
  height: 28px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
}

.index .campaign .campaign-list .slick-arrow::before {
  display: none;
}

.index .campaign .campaign-list .slick-next {
  background-image: url(/stcontents/img/common/icon-arrow-right-white.svg);
  right: 24px;
}

.index .campaign .campaign-list .slick-next:hover {
  background-image: url(/stcontents/img/common/right_Hover.svg);
}

.index .campaign .campaign-list .slick-prev {
  background-image: url(/stcontents/img/common/icon-arrow-left-white.svg);
  left: 24px;
}

.index .campaign .campaign-list .slick-prev:hover {
  background-image: url(/stcontents/img/common/left_Hover.svg);
}

.index .campaign .campaign-list-item {
  padding-left: 4px;
  padding-right: 4px;
}

.index .campaign .campaign-list-item a {
  pointer-events: none;
}

.index .campaign .campaign-list-item.item1 a {
  background-image: url(/stcontents/img/index/bnr-campaign01.png);
}

.index .campaign .campaign-list-item.item2 a {
  background-image: url(/stcontents/img/index/bnr-campaign02.png);
}

.index .campaign .campaign-list-item.item3 a {
  background-image: url(/stcontents/img/index/bnr-campaign03.png);
}

.index .campaign .campaign-list-item.slick-current a {
  pointer-events: visible;
}

.index .campaign .campaign-list-item.slick-current a::before {
  display: none;
}

.index .campaign .campaign-list-item a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 300px;
  height: 180px;
  padding-left: 16px;
  padding-right: 16px;
  text-decoration: none;
  text-shadow: 0 0 5px #000;
  font-size: 1.6rem;
  color: #fff;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.index .campaign .campaign-list-item a::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
}

.index .campaign h2 {
  font-size: 2rem;
  letter-spacing: 2px;
}

.index .campaign .campaign-text {
  font-weight: 500;
  font-size: 1.4rem;
  text-align: center;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .index .campaign .wrap {
    padding: 0 16px;
  }
  .index .campaign .campaign-list .slick-dots li button {
    width: 4px;
    height: 4px;
  }
  .index .campaign .campaign-list .slick-dots li.slick-active button {
    width: 6px;
    height: 6px;
  }
  .index .campaign .campaign-list-item {
    padding-left: 19px;
    padding-right: 19px;
    position: relative;
  }
  .index .campaign .campaign-list-item a {
    width: 730px;
    height: 250px;
  }
  .index .campaign .campaign-list-item a:hover {
    opacity: 0.7;
  }
  .index .campaign h2 {
    font-size: 2.6rem;
    margin-bottom: 30px;
  }
  .index .campaign .campaign-text {
    font-size: 1.6rem;
  }
}

@media (min-width: 1280px) {
  .index .campaign .wrap {
    padding: 0;
  }
}

.index .bg-gray {
  background-color: #ebebeb !important;
}

.index .feature-area {
  padding: 20px 0 20px;
}
.index .feature-area#feature-sec {
  padding: 24px 0 !important;
}
.index .feature-area .feature-area-list li {
  background: #fff;
  height: auto;
  width: calc(25% - 24px);
  margin-bottom: 24px;
}
.index .feature-area .feature-area-list li a {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding: 16px 16px 6px;
}
.index .feature-area .feature-area-list li img {
  height: 145px;
}
.index .feature-area .feature-area-list li .text {
  position: relative;
  top: inherit;
  left: inherit;
  transform: none;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: pre-wrap;
  line-height: 1.3;
  padding: 10px 10px 10px;
  font-weight: bold;
  font-size: 1.6rem;
  color: #333;
  text-shadow: none;
}

@media (min-width: 1024px) {
  .index .feature-area .feature-area-list {
    justify-content: flex-start;
  }
  .index .feature-area .feature-area-list li {
    margin: 0 30px 24px 0;
  }
  .index .feature-area .feature-area-list li:nth-child(4n) {
    margin-right: 0;
  }
}
@media (max-width: 1023px) {
  .index .feature-area .feature-area-list li {
      width: calc(35% - 24px);
  }
}
@media (max-width: 767px) {
  .index .feature-area .feature-area-list li {
    width: calc(50% - 4px);
    margin-bottom: 8px;
  }
  .index .feature-area .feature-area-list li a {
    padding: 8px 8px 2px;
  }
  .index .feature-area .feature-area-list li img {
    height: 82px;
  }
  .index .feature-area .feature-area-list li .text {
    min-height: 52px;
    padding: 10px 0 10px;
    font-size: 1.2rem;
  }
}
@media (max-width: 360px) {
  .index .feature-area .feature-area-list li .text {
    font-size: 1rem;
  }
}
@media (min-width: 768px) {
  .index .feature-area {
    padding: 40px 0 56px;
  }
  .index .feature-area#feature-sec {
    padding: 40px 0 !important;
  }
}

.index .stations {
  padding: 24px 0;
}

.index .stations-more {
  padding-top: 16px;
  margin-top: 8px;
  border-top: 3px solid #ebebeb;
  display: none;
}

.index .stations-area {
  display: flex;
}

.index .stations-area > dt {
  width: 67px;
  margin-top: 6px;
  font-size: 1.6rem;
}

.index .stations-area > dd {
  flex: 1;
}

.index .stations-list {
  display: flex;
  flex-wrap: wrap;
}

.index .stations-list > li {
  margin-bottom: 8px;
}

.index .stations-list > li:not(:last-child) {
  margin-right: 8px;
}

.index .stations-btn span {
  position: relative;
}

.index .stations-btn span::after {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-top: 2px solid #FFFFFF;
  border-right: 2px solid #FFFFFF;
  transform: rotate(135deg);
  position: absolute;
  top: 5px;
  right: -20px;
}

.index .stations-btn.is-open span::after {
  top: 9px;
  transform: rotate(-45deg);
}

@media (max-width: 767px) {
  .index .stations-list > li {
    margin-bottom: 16px;
  }
  .index .stations-list > li:not(:last-child) {
    margin-right: 16px;
  }
}

@media (min-width: 768px) {
  .index .stations {
    padding: 40px 0;
  }
  .index .stations-more {
    display: block !important;
  }
}

.index .history {
  overflow: hidden;
  padding: 40px 0;
}
.index .last-section {
  padding-bottom: 56px !important;
}

.index .history .js-scroll-box {
  margin-left: -16px;
  margin-right: -16px;
}

.index .history .js-scroll-box::-webkit-scrollbar {
  width: 4px;
  display: block;
}

.index .history .js-scroll-box ul {
  padding-left: 16px;
  padding-right: 16px;
  float: left;
}

.index .history .js-scroll-box ul > li {
  margin-bottom: 0;
}

.index .history .js-scroll-box ul > li.more-box a {
  width: 100%;
  margin-right: 0;
  background-color: #fff;
}

.index .history .js-scroll-box ul > li .text {
  margin-bottom: 0;
}

@media (min-width: 1280px) {
  .index .history .js-scroll-box ul > li {
    margin-right: 31px;
  }
}

@media (min-width: 768px) {
  .index .last-section {
    padding-bottom: 180px !important;
  }
  .index .history .js-scroll-box {
    margin-left: 0;
    margin-right: 0;
  }
  .index .history .js-scroll-box ul {
    padding-left: 0;
    padding-right: 0;
    float: none;
  }
  .index .history .js-scroll-box ul > li {
    width: 160px;
  }
  .index .history .js-scroll-box ul > li a {
    width: 100%;
  }
  .index .history .js-scroll-box ul > li a:hover {
    opacity: .7;
  }
  .index .history .js-scroll-box ul > li.more-box a {
    width: 100%;
    margin-right: 0;
  }
}

.point-sec {
  background-image: url(/stcontents/img/index/bg-point-sec-1.png), url(/stcontents/img/index/bg-point-sec-2.png);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: right top 0, left bottom;
  background-size: auto, auto, 100%;
  font-weight: 200;
  font-size: 2rem;
}
.point-sec .relux-grade {
  background: none !important;
  padding: 32px 0 20px;
  color: #333;
}
.point-sec h2 {
  margin: 24px auto 40px;
  text-align: center;
  font-weight: normal;
  font-size: 3.6rem;
  color: #0F0A64;
}
.point-sec h2:after {
  width: 60px;
  content: "";
  display: block;
  border-bottom: 1px solid #FF503E;
  margin: 16px auto 0;
}
.point-sec h3 {
  display: flex;
  margin-bottom: 16px;
  line-height: 2;
  font-weight: normal;
  font-size: 2.4rem;
}
.point-sec img {
  max-width: 100%;
}
.point-sec .col3-article img {
  max-width: none;
}
.point-sec .d-flex {
  margin-bottom: 72px;
}
.point-sec .mincho {
  margin-right: 3rem;
  font-size: 4.8rem;
  letter-spacing: 4px;
  line-height: 1;
  color: #A6BCE9;
}
.point-sec .text-link-gray {
  color: inherit;
}
.point-sec .text-link-gray:after {
  content: none;
}
.point-sec .text-link {
  font-weight: normal;
}
.point-sec .icon-ponta {
  width: 190px;
  margin-left: 24px;
}
.point-sec .border-red {
  display: flex;
  align-items: center;
  white-space: nowrap;
  padding-right: 16px;
  margin-right: 16px;
  border-right: 2px solid #FF503E;
}
.point-sec .text-link-white.text-deco-underline:after {
  content: none;
}
.point-sec .text-link-white {
  color: inherit;
}
.point-sec .grade-wrap {
  width: calc(100% - 80px);
}
.point-sec .col3-article {
  padding: 0 16px 10px 0;
}
.point-sec .col3-article ul {
  width: auto;
}
.point-sec .col3-article li {
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}
.point-sec .relux-grade .col3-article li .bg {
  border: none;
}

@media screen and (min-width: 1200px) {
  .point-sec .grade-wrap {
      width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .point-sec .col3-article li {
    margin-right: 12px;
  }
  .point-sec .col3-article::-webkit-scrollbar {
    display: block;
    height: 6px;
  }
  .point-sec .col3-article::-webkit-scrollbar-track {
    background: #f5f5f5;
    border-radius: 4px;
  }
  .point-sec .col3-article::-webkit-scrollbar-thumb {
    background: #C6C6C6;
    border-radius: 4px;
  }
  .point-sec h3 .font-x-large {
    font-size: 2.4rem;
  }
}

@media screen and (max-width: 1024px) {
  .point-sec {
    padding-top: 20vw;
    font-size: 1.6rem;
  }
  .point-sec .mincho {
    font-size: 3.6rem;
    margin-right: 1rem;
  }
  .point-sec h3,
  .point-sec h3 .font-x-large {
    font-size: 2rem;
  }
  .point-sec .grade-wrap {
    width: calc(100% - 40px);
  }
}


@media screen and (max-width: 767px) {
  .point-sec {
    background-image: url(/stcontents/img/index/bg-point-sec-1.png), url(/stcontents/img/index/bg-point-sec-2.png);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: right -160px top 78vw, left bottom 150px;
    background-size: 330px, 90%, 100%;
    padding-top: 0;
    font-size: 1.4rem;
  }
  .point-sec h2 {
    font-size: 2.6rem;
  }
  .point-sec .pl-40 {
    padding-left: 0 !important;
  }
  .point-sec .border-red {
    border: none !important;
  }
  .point-sec .d-flex .pc-only {
    display: none;
  }
  .point-sec .d-flex .sp-only {
    display: block !important;
  }
  .point-sec .relux-grade {
    padding: 16px 0;
  }
  .point-sec h3 {
    margin-bottom: 16px;
    padding-top: 4px;
    font-size: 2rem;
    line-height: 1.5;
  }
  .point-sec h3 .font-x-large {
    font-size: 1.6rem;
  }
  .point-sec .d-flex {
    display: block;
    margin-bottom: 40px;
  }
  .point-sec .grade-wrap {
    width: auto;
  }
  .point-sec .title-num {
    float: left;
  }
  .point-sec .icon-ponta {
    width: 108px;
    margin: 24px 0 0;
  }
}

@media screen and (max-width: 380px) {
  .point-sec h3.line-2 {
    margin-top: -14px;
  }
}

.hotel-grade {
  padding-top: 40px;
}
.hotel-grade .upper {
  background: #fff;
  padding: 24px 14px 8px 14px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}

.hotel-grade .upper .lead {
  width: 100%;
  font-size: 1.2rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  line-height: 1.8;
  text-align: center;
  font-weight: 100;
}

.hotel-grade .upper .lead .contents {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}

.hotel-grade .upper .lead .text-link, .hotel-grade .upper .lead .text-link-gray {
  font-size: 1.4rem;
}

.hotel-grade .upper .lead .w-100 {
  width: 100%;
  margin-top: auto;
  font: initial;
}

.hotel-grade .upper .lead .star {
  position: relative;
}

.hotel-grade .upper .lead .star:after {
  background: -webkit-radial-gradient(circle, rgba(0, 0, 0, 0.1) 0, rgba(255, 255, 255, 0) 60%);
  background: radial-gradient(circle, rgba(0, 0, 0, 0.1) 0, rgba(255, 255, 255, 0) 60%);
  width: 80px;
  height: 80px;
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-45%, -10px);
          transform: translate(-45%, -10px);
}

.hotel-grade .upper .lead h3 {
  font-weight: bold;
  font-size: 2rem;
  letter-spacing: 2px;
  margin-bottom: 10px;
  margin-top: 0;
}

.hotel-grade .upper .lead p {
  margin: 0;
}

.hotel-grade .upper .figure img {
  max-width: 273px;
  width: 100%;
  display: block;
  margin: 22px auto 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.hotel-grade .under {
  position: relative;
}

@media (max-width: 767px) {
  .hotel-grade {
    margin-top: 8px;
    padding-top: 0;
  }
  .hotel-grade .wrap {
    padding: 0;
  }
  .hotel-grade .contents {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .hotel-grade .upper .lead {
    letter-spacing: 0;
  }
  .hotel-grade .text-link-gray {
    font-size: 1.2rem;
  }
}

@media (min-width: 768px) {
  .hotel-grade .upper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 24px 30px 24px 20px;
  }
  .hotel-grade .upper .lead {
    width: 73.6%;
    line-height: 2;
    font-size: 1.6rem;
  }
  .hotel-grade .upper .lead .inner {
    margin-top: 40px;
    margin-bottom: 20px;
  }
  .hotel-grade .upper .lead h3 {
    font-size: 3.2rem;
    margin-bottom: 30px;
  }
  .hotel-grade .upper .figure img {
    max-width: 100%;
    margin: 0;
    padding-right: 48px;
  }
  .hotel-grade .under {
    position: relative;
    margin-bottom: 32px;
  }
  .hotel-grade .under:after {
    content: none;
  }
  .hotel-grade .col3-article .btn-scroll-next {
    right: 12px;
  }
}

@media (max-width: 1024px) {
  .hotel-grade .upper .lead .inner {
    margin-top: 0;
  }
}

.index .hotel-type {
  margin-bottom: 40px;
}

.index .hotel-type .col5-article ul li .text {
  margin-bottom: 0;
}

.index .hotel-type .col5-article .btn-scroll,
.index .hotel-type .col5-article .btn-scroll-prev {
  top: 50px;
}

.index .hotel-type .col5-article .btn-scroll,
.index .hotel-type .col5-article .btn-scroll-2 {
  width: 48px;
  height: 48px;
  background: url(/stcontents/img/common/SwipeArrow_right.png) no-repeat center center;
  background-size: contain;
}

.index .hotel-type .col5-article .btn-scroll:hover,
.index .hotel-type .col5-article .btn-scroll-2:hover {
  background: url(/stcontents/img/common/SwipeArrow_right_hover.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .hotel-type .col5-article .btn-scroll-prev,
.index .hotel-type .col5-article .btn-scroll-prev-2 {
  background: url(/stcontents/img/common/SwipeArrow_left.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .hotel-type .col5-article .btn-scroll-prev:hover,
.index .hotel-type .col5-article .btn-scroll-prev-2:hover {
  background: url(/stcontents/img/common/SwipeArrow_left_hover.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .hot-area {
  padding: 24px 0;
}

.index .hot-area-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.index .hot-area-list li {
  width: calc(50% - 4px);
  height: 80px;
  margin-bottom: 8px;
  margin-right: 8px;
  overflow: hidden;
  border-radius: 8px;
  position: relative;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.index .hot-area-list li:nth-child(2n) {
  margin-right: 0;
}

.index .hot-area-list li:last-child {
  margin-right: 0;
}

.index .hot-area-list li img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
  width: 100%;
}

.index .hot-area-list li .caption {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  padding: 0 10px;
  text-align: center;
  font-size: 1.6rem;
}

.index .hot-area-list a {
  display: block;
  text-decoration: none;
  color: #fff;
  height: 100%;
}

@media (min-width: 768px) {
  .index .hot-area {
    padding: 40px 0;
  }
  .index .hot-area .wrap:nth-child(2) {
    padding: 0;
  }
  .index .hot-area-list {
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
  }
  .index .hot-area-list li {
    width: 280px;
    height: 100px;
    margin-bottom: 0;
    margin-right: 32px;
  }
  .index .hot-area-list li:nth-child(2n) {
    margin-right: 32px;
  }
  .index .hot-area-list li:last-child {
    margin-right: 0;
  }
  .index .hot-area-list li .caption {
    font-size: 2rem;
  }
  .index .hot-area-list a:hover {
    opacity: 0.7;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .index .hot-area-list li {
    width: 280px;
    margin-right: 16px;
  }
  .index .hot-area-list li:nth-child(2) {
    margin-right: 16px;
  }
}

@media (min-width: 1280px) {
  .index .hot-area-list li .caption {
    font-size: 2rem;
  }
}

.index .area-map {
  background: url("/stcontents/img/common/area-map.svg") no-repeat center top;
  background-size: contain;
  width: 1000px;
  height: 650px;
  position: relative;
  margin: 64px auto 0;
}

.index .area-map > div {
  width: 130px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
}

.index .area-map a {
  background: #f5f5f5;
  border-radius: 4px;
  display: block;
  position: relative;
  text-decoration: none;
  padding: 3px 16px 4px;
  border-bottom: 1px solid #c6c6c6;
  font-size: 1.4rem;
  color: #333;
}

.index .area-map a:after {
  background: url("/stcontents/img/common/icon-map-arrow-gray.svg") no-repeat 0 0;
  background-size: contain;
  content: "";
  width: 14px;
  height: 14px;
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 5px;
  margin-top: -7px;
}

.index .area-map .area-title {
  overflow: hidden;
  margin-bottom: 0;
}

.index .area-map .area-title a {
  background: #0F0A64;
  border-bottom: none;
  color: #fff;
}

.index .area-map .area-title a:after {
  background: url("/stcontents/img/common/icon-map-arrow.svg") no-repeat 0 0;
  background-size: contain;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  right: 8px;
  margin-top: -5px;
}

.index .area-map > div:hover .area-title a:after {
  -webkit-transform: rotate(0);
          transform: rotate(0);
  right: 5px;
  margin-top: -7px;
}

.index .area-map .hokkaido .area-title a:after,
.index .area-map .okinawa .area-title a:after {
  -webkit-transform: rotate(0);
          transform: rotate(0);
  right: 5px;
  margin-top: -7px;
}

.index .area-map .hokkaido {
  top: 5px;
  left: 525px;
}

.index .area-map .tohoku {
  top: 177px;
  left: 850px;
}

.index .area-map .kitakanto {
  top: 300px;
  left: 850px;
}

.index .area-map .syutoken {
  top: 456px;
  left: 782px;
}

.index .area-map .koushinetsu {
  top: 222px;
  left: 488px;
}

.index .area-map .hokuriku {
  top: 322px;
  left: 330px;
}

.index .area-map .tokai {
  top: 524px;
  left: 670px;
}

.index .area-map .kinki {
  top: 560px;
  left: 500px;
}

.index .area-map .saninsanyou {
  top: 358px;
  left: 136px;
}

.index .area-map .shikoku {
  top: 620px;
  left: 325px;
}

.index .area-map .kyushu {
  top: 570px;
  left: 22px;
}

.index .area-map .okinawa {
  top: 65px;
  left: 262px;
}

.index .area-map .okinawa a,
.index .area-map .hokkaido a {
  border-radius: 4px !important;
}

.index .area-map .area-child {
  height: 0;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.index .area-map > div:hover .area-title {
  border-radius: 4px 4px 0 0;
}

.index .area-map > div:hover .area-child {
  height: auto;
}

.index .area-map > div:hover a {
  border-radius: 0;
}

.index .area-map > div:hover a:hover {
  background: #554B98;
  color: #fff;
  opacity: 1;
}

.index .area-map > div:hover a:hover:after {
  background: url("/stcontents/img/common/icon-map-arrow.svg") no-repeat 0 0;
  background-size: contain;
}

.index .area-map .area-child li:last-child a {
  border-bottom: none;
  border-radius: 0 0 4px 4px;
  padding-bottom: 5px;
}

.index .area-list {
  max-width: 600px;
  margin: 20px auto 0;
  border-radius: 4px;
  font-weight: bold;
  font-size: 1.4rem;
  cursor: pointer;
}

.index .area-list li,
.campaigns.template .area-list li {
  background: #fff;
  position: relative;
}

.index .area-list li:after {
  content: url(/stcontents/img/common/icon-arrow-bottom-gray.svg);
  width: 18px;
  height: 9px;
  position: absolute;
  right: 20px;
  top: 14px;
}

.index .area-list > li {
  background: #0F0A64;
  margin-bottom: 0;
  padding: 6px 0 2px;
  border: none;
  border-radius: 4px;
  color: #fff;
}

.index .area-list > li:after {
  content: url(/stcontents/img/common/icon-arrow-bottom-white.svg);
  width: 18px;
  height: 9px;
  position: absolute;
  right: 20px;
  top: 14px;
}

.index .area-list > li.active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
  top: 30px;
}

.index .area-list > li.active,
.campaigns.template .area-list > li.active {
  padding-bottom: 0;
}

.index .area-list > li > ul {
  border: 1px solid #0F0A64;
  border-radius: 0 0 4px 4px;
}

.index .area-list > li span {
  display: block;
  padding: 8px 16px 12px;
}

.index .area-list ul {
  display: none;
}

.index .area-list ul > li.active {
  background: #E1E9F8;
}

.index .area-list ul > li.active:after {
  content: url(/stcontents/img/common/icon-arrow-bottom-gray.svg);
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
  top: 30px;
}

.index .area-list ul li {
  font-weight: bold;
}

.index .area-list ul li a {
  display: block;
  padding: 13px 16px;
  border-top: 1px solid #ccc;
  color: #000;
}

.index .area-list ul ul {
  overflow: hidden;
}

.index .area-list ul ul li {
  background: #f5f5f5;
  font-weight: normal;
}

.index .area-list ul ul li:after {
  top: 20px !important;
  right: 28px !important;
  -webkit-transform: rotate(-90deg) !important;
          transform: rotate(-90deg) !important;
}

.index .area-list ul ul li a {
  padding-left: 24px;
  border-top: 1px solid #C6C6C6;
}

.index .area-list ul .okinawa {
  border-radius: 0 0 4px 4px;
}

.index .area-list ul .okinawa a {
  padding-bottom: 10px;
}

.index .area-list ul .hokkaido::after,
.index .area-list ul .okinawa::after {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  top: 22px;
  right: 28px;
}

.index .area-list ul .hokkaido.active,
.index .area-list ul .okinawa.active {
  background: #fff;
}

.index .area-list ul .hokkaido.active::after,
.index .area-list ul .okinawa.active::after {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  top: 22px;
  right: 28px;
}

@media (min-width: 768px) {
  .index .area-list {
    margin: 40px auto;
  }
  .index .area-map.pc-only {
    display: none;
  }
  .index .area-list.sp-only {
    display: block;
  }
}

@media (min-width: 1024px) {
  .index .area-map.pc-only {
    display: block;
  }
  .index .area-list.sp-only {
    display: none;
  }
}

.index .journal {
  overflow: hidden;
  padding: 24px 0 24px;
}

.index .journal .col6-article li {
  margin-bottom: 0;
}

.index .journal .col6-article li p:last-child {
  margin-bottom: 0;
}

.index .journal .text-link-gray {
  margin-top: 30px;
  float: right;
}

.index .journal .text-link-gray a {
  color: #757575;
}

.index .journal .text-link-gray:after {
  margin-bottom: -1px;
}

.index .journal .btn-scroll,
.index .journal .btn-scroll-2 {
  width: 48px;
  height: 48px;
  background: url(/stcontents/img/common/SwipeArrow_right.png) no-repeat center center;
  background-size: contain;
}

.index .journal .btn-scroll:hover,
.index .journal .btn-scroll-2:hover {
  background: url(/stcontents/img/common/SwipeArrow_right_hover.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .journal .btn-scroll-prev,
.index .journal .btn-scroll-prev-2 {
  background: url(/stcontents/img/common/SwipeArrow_left.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

.index .journal .btn-scroll-prev:hover,
.index .journal .btn-scroll-prev-2:hover {
  background: url(/stcontents/img/common/SwipeArrow_left_hover.png) no-repeat center center;
  width: 48px;
  height: 48px;
  background-size: contain;
}

@media (min-width: 768px) {
  .index .journal {
    padding: 40px 0 40px;
  }
}

@media (min-width: 1024px) {
  .index .journal .text-link-gray {
    margin-top: 40px;
  }
}

.index .selections-area .col6-article ul .more-box a,
.index .journal .col6-article ul .more-box a {
  background-color: #0F0A64;
}
.index .journal .col6-article .more-box p {
  text-align: left;
}
.index .selections-area .col6-article .more-box p{
  text-align: center;
}
.index .selections-area .col6-article li .text-link-white,
.index .journal .col6-article li .text-link-white {
  font-size: 1.6rem;
}
.index .selections-area .col6-article li .text-link-white::after,
.index .journal .col6-article li .text-link-white::after {
  margin-left: 8px;
}

.headeralert {
  display: none;
  z-index: 60;
  top: 0;
  right: 0;
  left: 0;
  padding: 16px 0;
  text-align: center;
  background: #333;
  color: #FFF;
}

.headeralert .wrap {
  position: relative;
}

.headeralert .js-headeralert-close {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
}

.headeralert .headeralert-title {
  font-size: 1.6rem;
  font-weight: bold;
}

.headeralert .headeralert-text {
  margin-bottom: 0;
}

.headeralert .headeralert-text a {
  color: #FFF;
  text-decoration: underline;
}

.headeralert .headeralert-text a:hover {
  text-decoration: none;
}

.headeralert .headeralert-btns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 12px;
}

.headeralert .headeralert-btns a {
  padding: 0;
  width: 167px;
}

@media (max-width: 767px) {
  .headeralert {
    text-align: left;
  }
  .headeralert .headeralert-btns a {
    height: 32px;
  }
}

@media (max-width: 1120px) {
  .headeralert .js-headeralert-close {
    right: 12px;
  }
}

.title-box {
  margin-bottom: 5px;
}

.title-box h1 {
  line-height: 1.5;
}

.result-list {
  padding-bottom: 0;
  background-color: #EBEBEB;
}

.result-list .wrap {
  max-width: 1152px;
  padding: 0;
}

.result-list.bg-on:before {
  background: rgba(198, 198, 198, 0.7);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.result-header-sort.disabled {
  cursor: default;
  pointer-events: none;
}

.result-header-sort.disabled .result-number label {
  color: #C6C6C6;
}

.result-header-sort.disabled .result-number .input-checkbox {
  background-color: #f5f5f5;
}

@media (max-width: 768px) {
  .result-header-sort.disabled .result-number .input-checkbox {
    background: none;
    background-color: #f5f5f5;
    border-radius: 2px;
  }
}

.result-header-sort.disabled .sort-change a {
  color: #C6C6C6;
  border-color: #C6C6C6;
}

.result-header-sort.disabled .icon-map-2 {
  background-color: #C6C6C6;
}

.float-target.fixed .result-header-sort.disabled .input-checkbox {
  background: none;
  background-color: #f5f5f5;
  border-radius: 2px;
}

.result-hotel {
  height: 240px;
  overflow: hidden;
  position: relative;
  margin-bottom: 8px;
  border-radius: 0;
  color: #fff;
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1);
  background-color: #ffffff;
}

.result-hotel a {
  color: #fff;
}

.result-hotel a:hover {
  opacity: 1;
}

.result-hotel .js-slick-slider,
.result-hotel .result-hotel-inner {
  width: 100%;
  height: 100%;
}

.result-hotel .js-slick-slider > div,
.result-hotel .result-hotel-inner > div {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.result-hotel .js-slick-slider > div a,
.result-hotel .result-hotel-inner > div a {
  width: 100%;
  height: 100%;
  display: block;
}

.result-hotel .js-slick-slider > div img,
.result-hotel .result-hotel-inner > div img {
  width: 100% !important;
  height: 100% !important;
  -o-object-fit: cover !important;
     object-fit: cover !important;
}

.result-hotel .js-slick-slider .slick-track {
  height: 100%;
}

.result-hotel .sale-icon {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  position: absolute;
  top: 16px;
  left: 16px;
  margin-right: 60px;
  font-size: 1.4rem;
}

.result-hotel .sale-icon > * {
  margin-right: 4px;
}

.result-hotel .sale-icon > *:last-child {
  margin-right: 0;
}

.result-hotel .sale-icon > *.active {
  font-size: 1.6rem;
}

.result-hotel .hotel-info {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 24px;
}

.result-hotel .hotel-info > a {
  display: block;
}

.result-hotel .hotel-info .name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  line-height: 1.5;
  font-weight: normal;
  text-shadow: 1px 1px 1px #000;
}

.result-hotel .hotel-info .address {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  font-size: 1.1rem;
}

.result-hotel .hotel-info .review {
  font-size: 1rem;
}

.result-hotel .hotel-info .review .count {
  font-size: 1.2rem;
  font-weight: 700;
}

.result-hotel .hotel-info .review .review-link {
  color: #333;
}

.result-hotel .hotel-info .hotel-info-head a:hover {
  opacity: 0.7;
}

.result-hotel .hotel-info-body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.result-hotel .hotel-info-body .price-link {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  flex-wrap: wrap;
  cursor: pointer;
}

.result-hotel .hotel-info-body .price-link:hover {
  opacity: 0.7;
}

.result-hotel .point-price-box {
  width: 100%;
  margin-top: 8px;
  text-align: right;
  line-height: 1;
}

.result-hotel .address-box {
  padding-right: 8px;
  text-shadow: 1px 1px 1px #000;
}

.result-hotel .price-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: 100;
  font-size: 1.2rem;
  text-shadow: 1px 1px 1px #000;
  white-space: nowrap;
  position: relative;
}

.result-hotel .price-box .food {
  margin-right: 8px;
  font-size: 1rem;
}

.result-hotel .price-box .food-option {
  position: absolute;
  top: -12px;
  left: 0;
}

.result-hotel .price-box .per {
  display: none;
}

.result-hotel .price-box .price {
  font-weight: normal;
  font-size: 1.4rem;
}

.result-hotel .icon-favorite,
.result-hotel .icon-favorite-on {
  position: absolute;
  top: 16px;
  right: 16px;
}

.result-hotel .icon-favorite a,
.result-hotel .icon-favorite-on a {
  width: 24px;
  height: 22px;
}

.result-hotel .hotel-grade {
  background: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 8px;
  padding: 0;
}

.result-hotel .icon-grade[src*="grade-star"] {
  height: 20px;
}

.result-hotel .sale-icon .icon-grade {
  height: 18px;
}

.result-hotel .tag-hoteltype,
.result-hotel .tag-hoteltype-white {
  margin: 0 0 -2px 4px;
}

.result-hotel .address {
  margin-top: 4px;
}

.result-hotel .review .count {
  font-size: 1.4rem;
}

.btn-slide-arrow .slick-prev {
  display: none !important;
  width: 50px;
  left: 10px;
  margin-top: -20px;
}

.btn-slide-arrow .slick-next {
  display: none !important;
  width: 50px;
  right: 10px;
  margin-top: -20px;
}

@media (min-width: 768px) {
  .h2-small {
    font-size: 2.4rem;
  }
  h1 {
    font-size: 3.6rem;
  }
  .searchbox-bar {
    padding-top: 0;
  }
  .js-slick-slider > div a:hover {
    opacity: .7;
  }
  .result-sort {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .sort-change {
    font-size: 1.4rem;
    padding-right: 0;
  }
  .sort-change a {
    padding: 4px 16px;
  }
  .sort-change a.active {
    font-size: 1.6rem;
  }
  .sort-box {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .sort-box > div {
    margin-right: 8px;
  }
  .sort-box .btn-relux {
    padding: 12px 16px;
    font-size: 1.6rem;
  }
  .result-list {
    padding-bottom: 160px;
  }
  .result-list .wrap {
    padding: 0 16px;
  }
  .result-hotel {
    height: 350px;
    border-radius: 8px;
  }
  .result-hotel .sale-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 2rem;
    left: 2rem;
    padding-right: 0;
    font-size: 1.4rem;
  }
  .result-hotel .sale-icon > * {
    margin-right: 8px;
  }
  .result-hotel .sale-icon > *:last-child {
    margin-right: 0;
  }
  .result-hotel .sale-icon > *.active {
    font-size: 1.6rem;
  }
  .result-hotel .icon-favorite,
  .result-hotel .icon-favorite-on {
    position: absolute;
    top: 16px;
    right: 16px;
  }
  .result-hotel .icon-favorite a,
  .result-hotel .icon-favorite-on a {
    width: 32px;
    height: 30px;
  }
  .result-hotel .icon-grade,
  .result-hotel .sale-icon .icon-grade {
    height: auto;
  }
  .result-hotel .tag-hoteltype,
  .result-hotel .tag-hoteltype-white {
    margin: 0 0 0 8px;
  }
  .result-hotel .hotel-info .review {
    font-size: inherit;
  }
  .result-hotel .hotel-info .review .count {
    margin-left: 4px;
    font-size: 2rem;
  }
  .result-hotel .hotel-info .review .review-link {
    display: inline-block;
    text-decoration: underline;
  }
  .result-hotel .hotel-info .review .review-link:hover {
    text-decoration: none;
  }
  .result-hotel .hotel-info .review.color-white,
  .result-hotel .hotel-info .review.color-white a {
    color: #fff !important;
  }
  .result-hotel .hotel-info .address {
    font-size: 1.6rem;
  }
  .result-hotel .price-box {
    font-size: 1.4rem;
  }
  .result-hotel .price-box .food {
    margin: 8px 14px 0 0;
    font-size: 1.4rem;
  }
  .result-hotel .price-box .price {
    font-size: 2.6rem;
  }
}

@media (min-width: 1024px) {
  .searchbox-bar {
    padding-top: 0;
  }
  .result-hotel {
    margin-bottom: 16px;
  }
  .result-hotel .js-slick-slider > div {
    max-width: 736px;
  }
  .result-hotel .js-slick-slider > div a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .result-hotel .js-slick-slider .slick-dots {
    width: 300px;
    height: 0;
    left: 228px;
    bottom: 30px;
    margin-left: 0;
  }
  .result-hotel .hotel-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
    left: 760px;
    right: 0;
    top: 3rem;
    padding-right: 2rem;
  }
  .result-hotel .hotel-info .name {
    text-shadow: none;
  }
  .result-hotel .hotel-info .review {
    color: #333;
  }
  .result-hotel .hotel-info-body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: normal;
    -webkit-align-items: normal;
        -ms-flex-align: normal;
            align-items: normal;
    height: 100%;
  }
  .result-hotel a {
    color: #333333;
  }
  .result-hotel .address-box {
    text-shadow: none;
  }
  .result-hotel .price-box {
    color: #333333;
    text-shadow: none;
    margin-left: auto;
  }
  .result-hotel .point-price-box {
    margin-bottom: 4px;
  }
  .result-hotel .price-box .food-option {
    position: static;
    top: auto;
    left: auto;
  }
  .result-hotel .price-box .per {
    display: inline;
  }
  .result-hotel .icon-favorite,
  .result-hotel .icon-favorite-on {
    top: 3rem;
    left: 68.6rem;
    right: auto;
  }
  .result-hotel .sale-icon {
    top: 3rem;
  }
  .result-hotel .address,
  .result-hotel .review-link {
    color: #757575;
  }
  .result-hotel.full .hotel-grade {
    opacity: 0.5;
  }
  .result-hotel.full .hotel-info,
  .result-hotel.full .price-box {
    color: #999;
  }
  .result-hotel.full .hotel-info h2,
  .result-hotel.full .price-box h2 {
    color: #999;
  }
  .result-hotel.full .hotel-info .review,
  .result-hotel.full .price-box .review {
    color: #999;
  }
  .result-hotel.full .hotel-info .review .review-link,
  .result-hotel.full .price-box .review .review-link {
    color: #999;
  }
  .btn-slide-arrow .slick-prev {
    display: block !important;
    margin-top: 0;
    -webkit-filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
            filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
  }
  .btn-slide-arrow .slick-next {
    display: block !important;
    margin-top: 0;
    -webkit-filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
            filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.6));
    left: 676px;
    right: auto;
  }
  .result-hotel .hotel-info .review .no-count {
    color: #757575;
  }
}

@media (max-width: 767px) {
  .result-hotel.full .hotel-info h2, .result-hotel.full .hotel-info .address, .result-hotel.full .hotel-info .review a, .result-hotel.full .hotel-info .review-link, .result-hotel.full .hotel-info .price-box {
    color: #BFBFBF !important;
  }
  .result-hotel .hotel-info {
    pointer-events: none;
  }
  .result-hotel .hotel-info .review .review-link {
    pointer-events: none !important;
    text-decoration: none;
    letter-spacing: 0;
  }
  .result-hotel.btn-slide-arrow .icon-grade[src*="grade-star"] {
    height: 12px;
  }
}

@media (max-width: 360px) {
  .sort-box .btn-relux {
    padding: 6px 2px;
    font-size: 1.1rem;
  }
}

.slick-counter {
  bottom: .5rem;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.3);
  height: auto !important;
  width: 4rem !important;
  border-radius: 2rem;
  padding: 0 .5rem;
  font-size: 1rem;
  text-align: center;
}

@media (max-width: 1023px) {
  .result-hotel .tag-hoteltype-white {
    background: rgba(0, 0, 0, 0.1);
  }
  .result-hotel.full .tag-hoteltype-white {
    color: #BFBFBF;
  }
}

.result-hotel-none {
  padding: 112px 24px;
  text-align: center;
  background: #FFF;
}

@media (max-width: 767px) {
  .result-hotel-none {
    padding: 80px 24px;
  }
  .result-hotel .hotel-info .name {
    font-weight: bolder;
  }
}

@media (max-width: 1023px) {
  .result-hotel .js-slick-slider > div a,
  .result-hotel .result-hotel-inner > div a {
    position: relative;
  }
  .result-hotel .js-slick-slider > div a ::before,
  .result-hotel .result-hotel-inner > div a ::before {
    width: 100%;
    height: 60%;
    background-color: #333;
    opacity: 0.45;
    position: absolute;
    bottom: 0;
    left: 0;
    content: "";
    -webkit-filter: blur(16px);
            filter: blur(16px);
  }
  .result-hotel .hotel-info .review .review-link {
    color: #FFF;
    pointer-events: auto !important;
    text-decoration: underline;
  }
  .result-hotel .hotel-info .review .review-link:hover {
    text-decoration: none;
  }
  .result-hotel .icon-grade-sp-full {
    display: none;
  }
  .result-hotel .hotel-grade img {
    -webkit-filter: drop-shadow(0 0 3px #000);
            filter: drop-shadow(0 0 3px #000);
  }
  .result-hotel .tag-hoteltype {
    color: #fff;
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid #fff;
  }
  .result-hotel.full .hotel-info .name {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
    font-weight: bolder;
  }
  .result-hotel.full a {
    color: #BFBFBF !important;
  }
  .result-hotel.full .hotel-info,
  .result-hotel.full .price-box {
    opacity: 1;
    color: #BFBFBF !important;
  }
  .result-hotel.full .price-box,
  .result-hotel.full .address-box {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
  }
  .result-hotel.full .tag-hoteltype {
    color: #BFBFBF;
    border: 1px solid #BFBFBF;
  }
  .result-hotel.full .icon-grade-sp {
    display: none;
  }
  .result-hotel.full .icon-grade-sp-full {
    display: block;
  }
  .icon-grade-pc {
    display: none;
  }
  .result-list .result-hotel .js-slick-slider > div::after,
  .result-list .result-hotel .result-hotel-inner > div::after {
    width: 100%;
    height: 116px;
    background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.85)), to(transparent));
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.85), transparent);
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
    position: absolute;
    left: 0;
    bottom: 0;
    content: "";
    display: block;
    pointer-events: none;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .result-hotel .tag-hoteltype.pc-only {
    display: none !important;
  }
  .result-hotel .tag-hoteltype-white.sp-only {
    display: block !important;
  }
  .result-hotel.full .tag-hoteltype-white {
    color: #BFBFBF;
  }
}

@media (min-width: 1024px) {
  .icon-grade-sp,
  .icon-grade-sp-full {
    display: none;
  }
}

/*
  絞り込みUI > Scorll → 固定追従後のStyle
*/
.search-result .float-search-box .searchBoxArea.fixed {
  -webkit-box-shadow: none;
          box-shadow: none;
}

@media (max-width: 767px) {
  .search-result .float-search-box {
    z-index: 40;
  }
  .search-result .float-search-box.fixed {
    padding-top: 0;
    padding-bottom: 0;
  }
  .search-result .float-search-box.fixed .searchBoxArea {
    padding: 0;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .search-result .float-search-box.fixed .searchBoxArea.modal-on {
    padding-top: 40px;
  }
  .search-result .float-search-box.fixed .searchbox-bar {
    padding-top: 0;
    width: calc(100vw - 32px);
    margin: 0 auto;
  }
  .search-result .float-search-box.fixed .searchbox-bar .search-wrap {
    padding-top: 4px;
    padding-bottom: 4px;
    border-bottom: 1px solid #C6C6C6;
  }
  .search-result .float-search-box.fixed .searchBox.selected .box:first-child {
    border: none;
  }
  .search-result .float-search-box.fixed .searchBox.selected .box.checkin-out, .search-result .float-search-box.fixed .searchBox.selected .box.peopleroom {
    border: none;
    border-radius: 4px;
  }
  .search-result .float-search-box .searchbox-bar {
    display: block;
  }
}

/*
  おすすめ順 > MAP Viewへの切り替えボタン
*/
.icon-map-2 {
  background: #0F0A64 url(/stcontents/img/common/icon-map-white2-sp.svg) no-repeat center center;
  width: 32px;
  height: 32px;
  display: inline-block;
  border-radius: 4px;
  overflow: hidden;
  text-indent: -300px;
}

@media (min-width: 768px) {
  .icon-map-2 {
    background: #0F0A64 url(/stcontents/img/common/icon-map-white2.svg) no-repeat center center;
    width: 40px;
    height: 40px;
    background-size: auto;
  }
  .icon-map-2:hover {
    background-color: #554B98;
  }
}

.detail-page main {
  padding-bottom: 8px;
}

.detail-page h2 {
  margin-bottom: 16px;
}

.detail-page .kv-slider {
  position: relative;
  min-height: 380px;
  max-height: 538px;
  height: calc(100vh - 300px);
  overflow: hidden;
}

.detail-page .kv-slider .icon-favorite,
.detail-page .kv-slider .icon-favorite-on {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 1;
}

.detail-page .kv-slider .icon-favorite a,
.detail-page .kv-slider .icon-favorite-on a {
  background-size: 24px;
  width: 40px;
  height: 40px;
  position: relative;
  z-index: 2;
  -webkit-transform: translate(8px, -8px);
          transform: translate(8px, -8px);
}

@media screen and (max-width: 767px) {
  .detail-page .kv-slider .icon-favorite a:hover,
  .detail-page .kv-slider .icon-favorite-on a:hover {
    opacity: 1;
    cursor: default;
  }
}

.detail-page .kv-slider .js-kv-slider {
  height: 100%;
}

.detail-page .kv-slider .slide {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
}

.detail-page .kv-slider .slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.detail-page .hotel-movie {
  overflow: hidden;
  position: relative;
}
.detail-page .hotel-movie video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.detail-page .hotel-movie.resize video {
  transform: scale(1.01);
}

.detail-page .kv-slider .slick-slider {
  height: 100%;
  display: none;
  z-index: 0;
}

.detail-page .kv-slider .slick-slider.slick-initialized {
  display: block;
}

.detail-page .kv-slider .slick-counter {
  top: auto;
  bottom: 10px;
}

.detail-page .kv-slider .visit-number {
  position: absolute;
  bottom: 28px;
  z-index: 10;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-animation: fadeout 1s 7s forwards;
          animation: fadeout 1s 7s forwards;
}

.detail-page .kv-slider .visit-number p {
  margin: 0;
  background: rgba(0, 0, 0, 0.7);
  padding: 8px 12px;
  color: #fff;
  display: inline-block;
  font-size: 1rem;
}

.detail-page .cxl-insurance {
  border: 1px solid #0F0a64;
  padding: 16px;
  text-align: center;
}

.detail-page .cxl-insurance p {
  text-align: center;
}

.detail-page .cxl-insurance .title {
  color: #0F0A64;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}

.detail-page .cxl-insurance .description {
  width: 92%;
  margin: 0 auto 8px;
  font-size: 1.6rem;
}

.detail-page .cxl-insurance .description .color-gray-2 {
  margin-top: 8px;
  font-size: 1.2rem;
}

.detail-page .cxl-insurance .cxl-insurance-detail {
  text-align: right;
}

.detail-page .plan-fee-area {
  border-top: 5px solid #f5f5f5;
  margin-top: 16px;
  padding-top: 16px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.detail-page .plan-fee-area .right {
  text-align: right;
}

.detail-page .plan-fee-area .right p.color-gray-3 {
  text-decoration: line-through;
  font-size: 1.4rem;
  margin-bottom: 4px;
}

.detail-page .plan-fee-area .right p.color-maroon {
  font-size: 2.4rem;
  margin-bottom: 0;
}

.detail-page .plan-fee-area .right p:last-child {
  font-size: 1,6rem;
}

@media (max-width: 767px) {
  .detail-page .plan-fee-area {
    border-top: none;
    padding: 0 16px;
  }
  .detail-page .plan-fee-area .right p.color-gray-3 {
    margin-bottom: 0;
  }
}

.detail-page .searchBoxArea.modal-on,
.detail-page .popup-position {
  z-index: 40;
}

.detail-page .gtt-banner {
  display: none;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 8px 16px;
  background: #4F68C2;
  border-radius: 4px;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: fixed;
  bottom: 40px;
  right: 60px;
  z-index: 10;
  cursor: pointer;
}

.detail-page .gtt-banner:hover {
  opacity: 0.8;
}

.detail-page .gtt-banner a {
  color: #fff;
}

.detail-page .gtt-banner .d-flex {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.detail-page .gtt-banner .arrow {
  width: 8px;
}

.detail-page .gtt-banner .close-btn {
  width: 32px;
  position: absolute;
  right: -13px;
  top: -13px;
}

@-webkit-keyframes fadeout {
  0% {
    opacity: 1;
  }
  99% {
    height: auto;
  }
  100% {
    opacity: 0;
    height: 0;
  }
}

@keyframes fadeout {
  0% {
    opacity: 1;
  }
  99% {
    height: auto;
  }
  100% {
    opacity: 0;
    height: 0;
  }
}

.detail-page .kv-small {
  max-width: 880px;
}

.detail-page .kv-small .js-slick-slider .slick-dots,
.detail-page .kv-small .js-kv-slider .slick-dots {
  height: 0;
  bottom: 26px;
}

.detail-page .kv-small .slide img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.detail-page .kv-small .slick-prev {
  left: 5px !important;
}

.detail-page .kv-small .slick-next {
  right: 5px !important;
}

.detail-page .kv-small .btn-coupon {
  left: 16px;
}

.detail-page .galleryBtn {
  position: absolute;
  bottom: 16px;
  right: 16px;
  margin: auto;
  z-index: 1;
}

.detail-page .galleryBtn a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 56px;
  height: 56px;
  margin-left: auto;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.detail-page .galleryBtn a::before {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-image: url("../img/common/icon-picture.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}

.detail-page .galleryBtn a:hover {
  color: #757575;
}

.detail-page .galleryBtn a:hover::before {
  background-image: url("../img/common/icon-picture-gray.svg");
}

.detail-page .galleryBtn a img {
  width: 20px;
  height: 20px;
}

.detail-page .galleryBtn a p {
  font-size: 1.6rem;
  line-height: 1.4;
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .detail-page .kv-slider {
    min-height: 0;
    height: 52vw;
  }
  .detail-page .kv-slider .slide img {
    min-width: 0;
  }
  .detail-page .galleryBtn a {
    width: 40px;
    height: 40px;
    padding-top: 6px;
  }
  .detail-page .galleryBtn a::before {
    width: 16px;
    height: 16px;
  }
  .detail-page .galleryBtn a p {
    font-size: 1rem;
  }
  .detail-page .gtt-banner {
    padding: 8px;
    right: 16px;
    bottom: calc(env(safe-area-inset-bottom) + 16px);
  }
  .detail-page .gtt-banner .font-bold {
    margin-bottom: 4px;
  }
  .detail-page .gtt-banner .arrow {
    width: 12px;
  }
}

.detail-page .gallery-line {
  margin: 8px -16px 24px;
}

.detail-page .gallery-line .wrap {
  padding: 0 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.detail-page .gallery-line .js-kv-slider-nav {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 264px;
  height: 80px;
  overflow: hidden;
}

.detail-page .gallery-line .js-kv-slider-nav .slick-track {
  width: auto !important;
  -webkit-transform: none !important;
          transform: none !important;
}

.detail-page .gallery-line .js-kv-slider-nav .slick-cloned {
  display: none !important;
}

.detail-page .gallery-line .thumb, .detail-page .gallery-line .btn-gallery {
  width: 80px !important;
  height: 80px !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-content: center;
      -ms-flex-line-pack: center;
          align-content: center;
  position: relative;
  margin-right: 8px;
  overflow: hidden;
  border-radius: 8px;
}

.detail-page .gallery-line .thumb img, .detail-page .gallery-line .btn-gallery img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transform: scale(1.3);
          transform: scale(1.3);
  z-index: 0;
}

.detail-page .gallery-line .thumb {
  margin-bottom: 50px;
}

.detail-page .gallery-line .btn-gallery {
  display: block;
  margin-right: 0 !important;
}

.detail-page .gallery-line .btn-gallery a {
  width: 100%;
  height: 100%;
  text-align: center;
  display: block;
  color: #fff;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  z-index: 1;
}

.detail-page .gallery-line .btn-gallery a:before {
  background: rgba(0, 0, 0, 0.6);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.detail-page .gallery-line .btn-gallery a:hover {
  color: #757575;
}

.detail-page .gallery-line .btn-gallery a:hover div {
  color: #757575;
}

.detail-page .gallery-line .btn-gallery a:hover div::before {
  background-image: url("../img/common/icon-picture-gray.svg");
}

.detail-page .gallery-line .btn-gallery div {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  z-index: 2;
}

.detail-page .gallery-line .btn-gallery div::before {
  content: '';
  display: inline-block;
  width: 30px;
  height: 30px;
  background-image: url("../img/common/icon-picture.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  margin-bottom: 0;
}

.detail-page .gallery-line .btn-gallery div img {
  width: auto;
  height: auto;
}

.detail-page .common-modal.calendar-modal {
  width: calc( (960 / 800) * 100vh);
  max-width: none;
  height: 84.75vh;
  font-size: calc( (14 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .modal-container {
  padding: calc( (32 / 800) * 100vh) calc( (32 / 800) * 100vh) calc( (24 / 800) * 100vh);
  margin: 0;
  height: 100%;
  max-height: none;
}

.detail-page .common-modal.calendar-modal .dateSelector .arrow-left,
.detail-page .common-modal.calendar-modal .dateSelector .arrow-right {
  width: calc( (20 / 800) * 100vh);
  height: calc( (20 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .calendar {
  padding: 0 calc( (25 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .calendar .month {
  font-size: calc( (16 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .calendar table tr th {
  height: calc( (34 / 800) * 100vh);
  font-size: calc( (12 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .calendar table tr td {
  padding: calc( (4 / 800) * 100vh) 0;
}

.detail-page .common-modal.calendar-modal .calendar table tr td .date-btn {
  height: calc( (70 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .calendar table tr td .date-btn button {
  font-size: calc( (16 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .calendar table tr td .date-btn button .stay-price {
  font-size: calc( (12 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .date-panel-foot {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.detail-page .common-modal.calendar-modal .stay-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: calc( (400 / 800) * 100vh);
  height: calc( (60 / 800) * 100vh);
  padding-right: calc( (32 / 800) * 100vh);
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-bottom: 2px solid #c6c6c6;
  position: relative;
}

.detail-page .common-modal.calendar-modal .stay-box.unset {
  padding-right: 0;
}

.detail-page .common-modal.calendar-modal .stay-box.unset .reset-btn {
  display: none;
}

.detail-page .common-modal.calendar-modal .stay-box .checkin,
.detail-page .common-modal.calendar-modal .stay-box .checkout {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.detail-page .common-modal.calendar-modal .stay-box .checkin.unset,
.detail-page .common-modal.calendar-modal .stay-box .checkout.unset {
  color: #757575;
}

.detail-page .common-modal.calendar-modal .stay-box .checkin.unset .main,
.detail-page .common-modal.calendar-modal .stay-box .checkout.unset .main {
  font-size: calc( (16 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .stay-box .checkin.unset .sub,
.detail-page .common-modal.calendar-modal .stay-box .checkout.unset .sub {
  display: none;
}

.detail-page .common-modal.calendar-modal .stay-box .main {
  font-size: calc( (20 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .stay-box .sub {
  color: #757575;
  font-size: calc( (14 / 800) * 100vh);
  margin-left: calc( (16 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .stay-box .border {
  margin: 0 calc( (8 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .stay-box .reset-btn {
  position: absolute;
  right: calc( (10 / 800) * 100vh);
}

.detail-page .common-modal.calendar-modal .stay-box .reset-btn a {
  display: block;
}

.detail-page .common-modal.calendar-modal .stay-box .reset-btn a::before {
  content: '';
  display: block;
  width: calc( (24 / 800) * 100vh);
  height: calc( (24 / 800) * 100vh);
  background-image: url("../img/common/icon-reset.svg");
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.detail-page .common-modal.calendar-modal .info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.detail-page .common-modal.calendar-modal .price-area {
  margin-right: calc( (16 / 800) * 100vh);
  text-align: right;
}

.detail-page .common-modal.calendar-modal .price {
  font-size: calc( (24 / 800) * 100vh);
  font-weight: bold;
}

.detail-page .common-modal.calendar-modal .stay-people {
  text-align: right;
}

.detail-page .common-modal.calendar-modal .stay-people-child.unset {
  display: none;
}

.detail-page .common-modal.calendar-modal .decide-btn a {
  width: calc( (230 / 800) * 100vh);
  height: calc( (56 / 800) * 100vh);
  max-width: calc( (230 / 800) * 100vh);
  font-size: calc( (16 / 800) * 100vh);
}

@media (max-width: 767px) {
  .detail-page .cxl-insurance {
    padding: 8px;
  }
  .detail-page .cxl-insurance p {
    text-align: left;
    font-size: 14px;
  }
  .detail-page .cxl-insurance .title {
    font-size: 1.6rem;
    margin-bottom: 4px;
  }
  .detail-page .cxl-insurance .description {
    width: 100%;
    margin: 0;
  }
  .detail-page .cxl-insurance .description .color-gray-2 {
    margin-top: 0;
    font-size: 1rem;
  }
  .detail-page .cxl-insurance .note {
    font-size: 10px;
  }
  .detail-page .searchBtn {
    display: none;
  }
  .detail-page .popup-peopleroom-foot .searchBtn {
    display: block;
  }
  .detail-page .searchBoxArea {
    background: none;
  }
  .detail-page .searchBoxArea .searchBox .box {
    width: auto !important;
  }
  .detail-page .searchBoxArea .searchBox .box.peopleroom {
    border-right: 1px solid #0F0A64;
    border-radius: 0 4px 4px 0;
    width: 40% !important;
  }
  .detail-page .searchBoxArea .checkin-out.unset .box-inner {
    -webkit-box-pack: unset !important;
    -webkit-justify-content: unset !important;
        -ms-flex-pack: unset !important;
            justify-content: unset !important;
  }
  .detail-page .searchBoxArea .checkin-out.unset .border {
    margin: 0 4px !important;
  }
  .detail-page .searchBoxArea .checkin-out .box-inner {
    -webkit-box-pack: center !important;
    -webkit-justify-content: center !important;
        -ms-flex-pack: center !important;
            justify-content: center !important;
  }
  .detail-page .searchBoxArea .checkin,
  .detail-page .searchBoxArea .checkout {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .detail-page .searchBoxArea .checkin .sub,
  .detail-page .searchBoxArea .checkout .sub {
    margin-left: 0;
  }
  .detail-page .reservation-box {
    padding-top: 10px;
    padding-bottom: 8px;
  }
  .detail-page .reservation-box .stay-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    border: 1px solid #c6c6c6;
    border-radius: 4px;
    margin-bottom: 8px;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: relative;
  }
  .detail-page .reservation-box .stay-box.unset {
    display: none;
    padding-right: 0;
    color: #757575;
  }
  .detail-page .reservation-box .stay-box.unset .reset-btn {
    display: none;
  }
  .detail-page .reservation-box .stay-box.unset .sub {
    display: none;
  }
  .detail-page .reservation-box .stay-box .checkin,
  .detail-page .reservation-box .stay-box .checkout {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .detail-page .reservation-box .stay-box .main {
    font-size: 1.6rem;
  }
  .detail-page .reservation-box .stay-box .sub {
    color: #757575;
    font-size: 1.2rem;
    margin-left: 4px;
  }
  .detail-page .reservation-box .stay-box .border {
    margin: 0 8px;
  }
  .detail-page .reservation-box .stay-box .reset-btn {
    position: absolute;
    right: 10px;
  }
  .detail-page .reservation-box .stay-box .reset-btn a {
    display: block;
  }
  .detail-page .reservation-box .stay-box .reset-btn a::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("../img/common/icon-reset.svg");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
  }
  .detail-page .reservation-box .info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .detail-page .reservation-box .price-area {
    text-align: right;
    line-height: 1.2;
  }
  .detail-page .reservation-box .price {
    font-size: 2rem;
    font-weight: bold;
    margin-left: 8px;
  }
  .detail-page .reservation-box .stay-people-child.unset {
    display: none;
  }
  .detail-page .reservation-box .info-btn-area {
    margin-left: 16px;
  }
  .detail-page .reservation-box .info-btn-area .decide-btn a {
    min-width: 166px;
    height: 48px;
    padding: 0 24px;
  }
  .detail-page .reservation-box .info-btn-area .date-select-btn a {
    width: 166px;
    height: 40px;
  }
  .detail-page .reservation-box .info-btn-area .decide-btn a:hover, .detail-page .reservation-box .info-btn-area .decide-btn a:active,
  .detail-page .reservation-box .info-btn-area .date-select-btn a:hover,
  .detail-page .reservation-box .info-btn-area .date-select-btn a:active {
    background-color: #0f0a64;
    border-color: #0f0a64;
  }
  .detail-page .reservation-box .info-btn-area .decide-btn {
    display: none;
  }
}

@media screen and (max-width: 360px) {
  .detail-page .searchBoxArea .searchBox .box.peopleroom {
    width: 33% !important;
  }
  .detail-page .common-modal.calendar-modal .date-panel-foot {
    padding: 8px;
  }
}

@media (max-width: 767px) {
  .detail-page .kv-slider .visit-number {
    position: fixed;
    bottom: 96px;
    left: 0;
    right: 0;
    -webkit-transform: none;
            transform: none;
    text-align: center;
    padding: 0 16px;
    overflow: hidden;
  }
  .detail-page .kv-slider .visit-number p {
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
  }
  .detail-page .kv-slider .visit-number.bottom {
    bottom: 24px;
  }
}

@media (min-width: 768px) {
  .detail-page main {
    padding-bottom: 160px;
  }
  .detail-page .kv-slider .icon-favorite,
  .detail-page .kv-slider .icon-favorite-on {
    top: 24px;
    right: 24px;
  }
  .detail-page .kv-slider .icon-favorite a,
  .detail-page .kv-slider .icon-favorite-on a {
    background-size: 100%;
    width: 32px;
    height: 30px;
    -webkit-transform: none;
            transform: none;
  }
  .detail-page .kv-slider .visit-number {
    bottom: 40px;
  }
  .detail-page .kv-slider .visit-number p {
    padding: 8px 16px;
    font-size: inherit;
  }
  .detail-page .gallery-line {
    margin: 24px auto 24px;
  }
  .detail-page .gallery-line .wrap {
    padding: 0;
  }
  .detail-page .gallery-line .js-kv-slider-nav {
    width: auto;
    height: auto;
  }
  .detail-page .gallery-line .thumb, .detail-page .gallery-line .btn-gallery {
    width: 12vw !important;
    height: 12vw !important;
    margin-right: 20px;
  }
  .detail-page .gallery-line .thumb {
    margin-bottom: 0;
  }
  .detail-page .gallery-line .btn-gallery div::before {
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    background-image: url("../img/common/icon-picture.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    margin-bottom: 0;
  }
  .detail-page .gallery-line .btn-gallery div img {
    width: auto;
    height: auto;
  }
  .detail-page .gallery-line .btn-gallery div .number {
    font-size: 2rem;
  }
  .detail-page .btn-slide-arrow .slick-next,
  .detail-page .btn-slide-arrow .slick-prev {
    display: block !important;
  }
}

@media (min-width: 800px) {
  .detail-page .kv-small {
    margin: 0 auto;
  }
  .detail-page .kv-small .galleryBtn {
    padding: 0 24px;
    bottom: 32px;
  }
  .detail-page .kv-small .btn-coupon {
    left: 22px;
  }
}

@media (min-width: 1024px) {
  .detail-page .kv-small .js-slick-slider .slick-dots,
  .detail-page .kv-small .js-kv-slider .slick-dots {
    height: 0;
    bottom: 33px;
  }
}

@media (min-width: 1280px) {
  .detail-page .gallery-line .thumb, .detail-page .gallery-line .btn-gallery {
    width: 160px !important;
    height: 160px !important;
  }
}

.detail-page .hotel-summary {
  padding-bottom: 0;
}

.detail-page .hotel-summary .address span {
  margin-right: 1em;
}

.detail-page .hotel-summary .address a {
  text-decoration: underline;
  display: inline-block;
}

.detail-page .hotel-summary .address a:hover {
  opacity: 1;
  color: #0066CC;
  text-decoration: none;
}

.detail-page .hotel-summary .intro-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.detail-page .hotel-summary .intro-wrap > div:first-of-type {
  width: 864px;
  margin-right: 16px;
}

.detail-page .hotel-summary .intro-wrap > div:only-child {
  width: auto;
  margin-right: 0;
}

.detail-page .hotel-summary .bnr-xrdoor img {
  max-width: 100%;
  width: 192px;
}

.detail-page .hotel-summary .intro-text {
  margin-bottom: 20px;
  padding-top: 8px;
  font-size: 1.6rem;
}

.detail-page .hotel-summary .intro-text u {
  color: #757575;
  cursor: pointer;
}

.detail-page .hotel-summary .intro-text u:hover {
  text-decoration: none;
}

.detail-page .hotel-summary .more-link {
  color: #757575;
}

.detail-page .hotel-summary .title-box {
  position: relative;
}

.detail-page .hotel-summary .title-box h1 {
  line-height: 1;
  margin-left: -2px;
}

.detail-page .hotel-summary .title-box .icon-question {
  margin: 0 4px;
}

.detail-page .hotel-summary .title-box .title-grade {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 4px;
}

.detail-page .hotel-summary .title-box .title-grade span {
  margin-right: 8px;
}

.detail-page .hotel-summary .title-box .hotels-name {
  width: 100%;
  font-size: 1.2rem;
}

.hotel-grade.js-tips-content {
  background: none;
  position: absolute;
  top: 32px;
  left: 0;
  z-index: 2;
  padding: 0;
}

.hotel-grade.js-tips-content .relux-grade {
  padding: 24px 16px 16px 16px;
  position: relative;
  border-radius: 8px;
}

.hotel-grade.js-tips-content .relux-grade .relux-grade-text p:first-child {
  font-weight: bold;
  font-size: 1.6rem;
  text-align: center;
}

.hotel-grade.js-tips-content .relux-grade .relux-grade-text p:nth-child(2) {
  margin-bottom: 24px;
  padding-left: 8px;
  border-left: 1px solid #FF503E;
}

.hotel-grade.js-tips-content .relux-grade .relux-grade-text p:nth-child(2) br {
  display: none;
}

.hotel-grade.js-tips-content .relux-grade figure {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.hotel-grade.js-tips-content .relux-grade .relux-grade-close {
  background: url(/stcontents/img/common/icon-close-white.svg) no-repeat 0 0;
  background-size: contain;
  width: 40px;
  height: 40px;
  position: absolute;
  top: 8px;
  right: 8px;
  display: block;
}

.js-tips-content {
  display: none;
}

@media (min-width: 768px) {
  .detail-page .hotel-summary.small .title-box,
  .detail-page .hotel-summary.small .address,
  .detail-page .hotel-summary.small .intro-wrap,
  .detail-page .hotel-summary.small .gallery-line {
    width: 880px;
    margin-left: auto;
    margin-right: auto;
  }
  .detail-page .hotel-summary.small .gallery-line {
    max-width: 100%;
  }
  .detail-page .hotel-summary.small .intro-wrap > div:first-of-type {
    width: auto;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }
  .detail-page .hotel-summary.small .gallery-line .thumb {
    margin-right: 20px;
  }
}

@media screen and (min-width: 768px) {
  .hotel-grade.js-tips-content {
    max-width: 700px;
  }
  .hotel-grade.js-tips-content .relux-grade {
    max-width: 700px;
    padding: 20px 20px 20px 40px;
    -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  }
  .hotel-grade.js-tips-content .relux-grade .relux-grade-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-flow: row-reverse;
        -ms-flex-flow: row-reverse;
            flex-flow: row-reverse;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .hotel-grade.js-tips-content .relux-grade .relux-grade-text {
    text-align: center;
  }
  .hotel-grade.js-tips-content .relux-grade .relux-grade-text p:first-child {
    display: inline-block;
    margin-bottom: 28px;
    position: relative;
  }
  .hotel-grade.js-tips-content .relux-grade .relux-grade-text p:first-child::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -12px;
    display: inline-block;
    width: 16px;
    height: 1px;
    -webkit-transform: translate(-50%);
            transform: translate(-50%);
    background-color: #FF503E;
  }
  .hotel-grade.js-tips-content .relux-grade .relux-grade-text p:nth-child(2) {
    margin-bottom: 0;
    padding-left: 0;
    border-left: none;
  }
  .hotel-grade.js-tips-content .relux-grade .relux-grade-text p:nth-child(2) br {
    display: block;
  }
  .hotel-grade.js-tips-content .relux-grade figure img {
    width: 274px;
  }
}

@media screen and (max-width: 767px) {
  .detail-page .hotel-summary .title-box .title-grade span {
    margin-right: 0;
  }
  .detail-page .hotel-summary .title-box .title-grade span + span {
    margin-left: -4px;
  }
  .hotel-grade.js-tips-content {
    width: 100%;
    top: 26px;
  }
  .detail-page .hotel-summary .hotels-name {
    margin-bottom: 4px;
  }
  .detail-page .hotel-summary .intro-wrap {
    display: block;
  }
  .detail-page .hotel-summary .intro-wrap > div:first-of-type {
    width: 100%;
    margin-right: 0;
  }
  .detail-page .hotel-summary .bnr-xrdoor img {
    display: block;
    width: auto;
    margin: 0 auto 10px;
  }
}

.detail-page .hotel-summary h3 {
  margin-top: 40px;
  font-size: 1.6rem;
}

.detail-page .hotel-summary .links {
  margin-top: 24px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.detail-page .hotel-summary .links > * {
  margin-right: 24px;
}

.detail-page .hotel-summary .links > *:last-child {
  margin-right: 0;
}

.detail-page .hotel-summary .note {
  margin-bottom: 0;
}

.detail-page .hotel-summary .modal-btn {
  background-color: #F5F5F5;
  padding: 14px 48px 14px 16px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 4px;
}

.detail-page .hotel-summary .modal-btn:hover {
  opacity: .7;
}

.detail-page .hotel-summary .modal-btn::after {
  right: 16px;
}

@media screen and (max-width: 767px) {
  .detail-page .hotel-summary .links {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .detail-page .hotel-summary .links > * {
    margin-right: 0;
    margin-bottom: 24px;
  }
  .detail-page .hotel-summary .links > *:last-child {
    margin-bottom: 0;
  }
  .detail-page .hotel-summary .note {
    margin-bottom: 24px;
  }
  .detail-page .hotel-summary .modal-btn {
    padding: 8px;
    font-size: 1.4rem;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .detail-page .hotel-summary .modal-btn::after {
    position: static;
    display: inline-block;
    margin: 0 0 0 4px;
  }
}

@media screen and (min-width: 768px) {
  .detail-page .hotel-summary .note a:hover {
    text-decoration: none;
  }
}

.detail-page .facility,
.detail-page .access,
.detail-page .history {
  padding: 40px 0;
}

.detail-page .room-plan,
.detail-page .facility,
.detail-page .access {
  padding-top: 40px;
  border-bottom: 4px solid #F5F5F5;
  word-break: break-all;
}

.detail-page .hotel-summary {
  padding-top: 40px;
}

.detail-page .facility h2,
.detail-page .access h2 {
  margin-bottom: 24px;
}

.detail-page .facility h3,
.detail-page .access h3 {
  margin-top: 40px;
  margin-bottom: 8px;
}

.detail-page .facility table,
.detail-page .access table {
  border-top: 1px solid #C6C6C6;
  border-bottom: none;
  margin-bottom: 24px;
  font-size: 1.6rem;
}

.detail-page .facility table th,
.detail-page .access table th,
.detail-page .facility table td,
.detail-page .access table td {
  border-bottom: 1px solid #C6C6C6;
  padding: 10px;
}

.detail-page .facility a,
.detail-page .access a {
  text-decoration: underline;
}

.detail-page .facility a:hover,
.detail-page .access a:hover {
  opacity: 1;
  color: #0066CC;
  text-decoration: none;
}

.detail-page .facility .note,
.detail-page .access .note {
  display: block;
  padding-top: 8px;
}

.detail-page .access h3 {
  margin-bottom: 16px;
  padding-top: 12px;
}

.detail-page .access .text {
  padding-bottom: 8px;
  font-size: 1.6rem;
}

.detail-page .access .text p {
  margin-bottom: 16px;
}

.detail-page .access .g-map iframe {
  width: 100%;
  height: 400px;
}

.detail-page .col6-article-2 {
  padding-bottom: 0;
}

.detail-page .journal .text-link-gray {
  margin-top: 8px;
}

.detail-page .anchor-link.float-on .btn-arrow {
  background: #0F0A64 url(/stcontents/img/common/icon-search-white.svg) no-repeat center center;
  background-size: 24px;
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  position: fixed;
  top: 16px;
  left: calc(50% + 350px);
  border-radius: 4px;
  cursor: pointer;
}

@media (min-width: 768px) {
  .detail-page .anchor-link.float-on .btn-arrow.active {
    display: none;
  }
}

.detail-page .float-wrap {
  min-height: 110px;
}

.detail-page .float-box {
  background: #fff;
}

.detail-page .float-box.float {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 20;
  padding-top: 56px;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
}

.detail-page .float-box.float .sort-box {
  margin: -4px 0 0;
}

.detail-page .float-box.float > div {
  display: none;
}

@media (min-width: 768px) {
  .detail-page .float-box.float > .wrap {
    display: block;
  }
  .detail-page .float-box.float:not(.on) .sort-conditions-list {
    display: none !important;
  }
  .detail-page .float-box.float.on {
    padding-top: 70px;
  }
  .detail-page .float-box.float.on .sort-box .btn-relux {
    margin-top: 0;
  }
  .detail-page .float-box.float.on .search-wrap {
    margin-bottom: 16px;
  }
  .detail-page .float-box.float .sort-box .btn-relux {
    margin-top: 16px;
  }
}

@media (min-width: 900px) {
  .detail-page .float-box.float .sort-box .btn-relux {
    margin-top: -32px;
  }
}

.detail-page .float-box.on > div {
  display: block;
}

.detail-page .float-box .tab-box {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.detail-page .search-wrap {
  margin-bottom: 24px;
}

.detail-page .searchBoxArea.fixed {
  position: relative;
  top: inherit;
  left: inherit;
  padding: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  z-index: 10;
}

@media screen and (max-width: 767px) {
  .detail-page .anchor-link.position-measure {
    top: 0;
    padding-top: 8px;
  }
  .detail-page .anchor-link.position-measure.hide {
    display: none;
  }
  .detail-page .anchor-link.position-measure.float-on > ul {
    min-width: fit-content;
    padding-right: 86px;
  }
  .detail-page .anchor-link.float-on .btn-arrow {
    background: #fff url(/stcontents/img/common/icon-arrow-bottom-gray.svg) no-repeat center center;
    background-size: 14px;
    width: 30px;
    height: 30px;
    top: 10px;
    left: inherit;
    right: 12px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
    border: 1px solid #f5f5f5;
    border-radius: 50%;
  }
  .detail-page .anchor-link.float-on .btn-arrow.active {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
    -webkit-box-shadow: 0 -3px 6px rgba(0, 0, 0, 0.15);
            box-shadow: 0 -3px 6px rgba(0, 0, 0, 0.15);
  }
  .detail-page .float-box .wrap {
    padding: 0 12px;
  }
}

.detail-page .room-plan .sort-box {
  margin-bottom: 8px;
}

.detail-page .room-tab-frame {
  background-color: #EBEBEB;
}

.detail-page .tab-content {
  padding-top: 0;
}

.detail-page .tab-content > * {
  display: block;
  visibility: hidden;
  position: absolute;
}

.detail-page .tab-content > *:first-child {
  visibility: visible;
  position: static;
}

.detail-page .tab-target .tab-content > * {
  visibility: visible;
  position: static;
  padding-top: 0;
}

.detail-page .display-more-button p {
  margin-bottom: 0;
}

.detail-page .display-more-button a {
  background-color: #FFFFFF;
  border: 1px solid #b6b6b6;
  border-radius: 4px;
  width: 300px;
  margin-top: 16px;
  margin-left: auto;
  margin-right: auto;
  height: 48px;
  display: flex;
  align-items: center;
  padding: 0;
  justify-content: center
}

.detail-page .roomPlan-more {
  position: relative;
  display: inline-block;
  padding-right: 3rem;
}

.detail-page .btn.btn-relux:focus {
  color: #FFF;
  outline: none;
}

.detail-page .btn.btn-default:focus {
  color: #0F0A64;
  outline: none;
}

.detail-page .btn.btn-relux .roomPlan-more::after,
.detail-page .btn.btn-default .roomPlan-more::after {
  content: '';
  width: 8px;
  height: 8px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  transform: translateY(-2px) rotate(135deg);
}

.detail-page .btn.btn-relux .roomPlan-more::after {
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;  
}

.detail-page .btn.btn-default .roomPlan-more::after {
  border-top: 2px solid #0F0A64;
  border-right: 2px solid #0F0A64;  
}

.detail-page .btn.btn-relux .roomPlan-more.open::after,
.detail-page .btn.btn-default .roomPlan-more.open::after {
  transform: translateY(4px) rotate(-45deg);
}

.au-tag,
.ro-tag {
  background: #FFF5EF;
  display: inline-block;
  padding: 4px 8px;
  font-size: 1.2rem;
  color: #EB5505;
}
.ro-tag {
  background: #E1E9F8;
  color: #0F0A64;
}
.ro-au-tag {
  display: flex;
  justify-content: space-between;
  letter-spacing: 0;
  white-space: nowrap;
}
.ro-au-tag > span:first-child,
.ro-au-tag span span {
  position: relative;
  display: inline-block;
  z-index: 2;
}
.ro-au-tag .au-tag {
  width: calc(100% - 60px);
  position: relative;
  margin: -4px -10px -4px 0;
  padding-right: 30px;
}
.ro-au-tag .au-tag:before {
  content: "";
  background: linear-gradient(to right, #E1E9F8 50%, #FFF5EF 50%);
  transform: rotate(20deg);
  position: absolute;
  top: -10px;
  left: -15px;
  width: 28px;
  height: 45px;
}
.ro-au-tag > span {
  position: relative;
  z-index: 1;
}
.au-tag.wide {
  display: block;
  padding: 7px 8px;
  text-align: center;
}

.result-hotel .ro-tag,
.result-hotel .au-tag:not(.ro-tag .au-tag) {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(100% - 736px);
  overflow: hidden;
}

.result-hotel.tag-line-add .hotel-info {
  padding-top: 16px;
}

@media (min-width: 1024px) and (max-width: 1168px){
  .result-hotel .js-slick-slider > div {
    max-width: 596px;
  }
  .btn-slide-arrow .slick-next {
    left: 536px;
  }
  .result-hotel .icon-favorite,
  .result-hotel .icon-favorite-on {
    left: 546px;
  }
  .result-hotel .ro-tag,
  .result-hotel .au-tag:not(.ro-tag .au-tag) {
    width: calc(100% - 596px);
  }
  .result-hotel .hotel-info {
    left: 620px;
  }
}

@media (max-width: 1023px) {
  .result-hotel .ro-tag,
  .result-hotel .au-tag:not(.ro-tag .au-tag) {
    width: 100%;
    padding-left: 8px !important;
  }
  .ro-au-tag > span:first-child {
    width: 70px;
    text-align: center;
  }
  .ro-au-tag .au-tag {
    width: calc(100% - 70px);
    padding-left: 12px;
  }
}

@media (max-width: 767px) {
  .result-list .result-hotel .tag-label,
  .result-list .result-hotel .tag-label-white {
    transform: scale(0.8) translateX(4px);
    margin-right: -1rem;
  }
  .result-hotel.tag-line-add {
    height: 270px;
  }
  .ro-au-tag .au-tag {
    width: calc(100% - 60px);
    padding-left: 16px;
  }
  .ro-au-tag .au-tag:before {
    left: -8px;
  }
  .result-hotel.new-style {
    height: auto;
  }
  .result-hotel.new-style .result-hotel-inner {
    height: 200px;
    margin-bottom: 0;
  }
  .result-hotel.new-style .hotel-info {
    bottom: 76px;
  }
  .result-hotel.tag-line-add.new-style .hotel-info {
    bottom: 110px;
  }
  .result-hotel.new-style .hotel-info.no-usage {
    bottom: 50px;
  }
  .result-hotel.tag-line-add.new-style .hotel-info.no-usage {
    bottom: 86px;
  }
  .result-hotel.new-style .point-price-box {
    margin: 8px 0 -6px;
    padding: 0 16px;
    letter-spacing: 0px;
    color: #333;
  }
  .result-hotel.new-style .price-box {
    margin: 0;
    padding: 0 16px 8px;
    text-shadow: none;
    justify-content: flex-end;
  }
  .result-hotel.new-style .price-box .food {
    margin-top: 2px;
    letter-spacing: 0;
    color: #333;
  }
  .result-hotel.new-style .au-tag:not(.ro-tag .au-tag),
  .result-hotel.new-style .ro-tag {
    position: relative;
  }
  .result-hotel .price-box .food-option {
    position: relative;
    top: 0;
  }
  .result-hotel .price-box .per {
    display: inline-block;
  }
  .result-hotel.new-style .slick-dotted.slick-slider {
    margin-bottom: 0;
  }

}

@media (min-width: 768px) and (max-width: 1023px) {
  .result-ro .icon-favorite,
  .result-ro .icon-favorite-on,
  .result-au .icon-favorite,
  .result-au .icon-favorite-on {
    top: 36px;
  }
  .result-ro .sale-icon,
  .result-au .sale-icon {
    top: 40px;
  }
}

@media (max-width: 360px) {
  .result-list .result-hotel .au-tag,
  .result-list .result-hotel .ro-tag {
    font-size: 1rem;
  }
}

.detail-page .au-tag-label-on > div,
.detail-page .ro-tag-label-on > div {
  min-height: calc(11rem + 32px) !important;
  position: relative;
  padding-top: 32px;
}

.detail-page .au-tag-label-on > .plan-list-sec03,
.detail-page .ro-tag-label-on > .plan-list-sec03 {
  padding-top: 0;
}

@media (min-width: 768px) {
  .detail-page .plan-list-sec03 {
    min-width: 218px; /* pc表示 ボタン上「\ Pontaパス /」 の文字崩れ対策 */
  }
}

.detail-page .au-tag-label-on .button-action.align-center,
.detail-page .ro-tag-label-on .button-action.align-center,
.detail-page .au-tag-plan-on .button-action.align-center,
.detail-page .ro-tag-plan-on .button-action.align-center {
  align-items: center !important;
}

.detail-page .au-tag-label,
.detail-page .ro-tag-label {
  background: #FFF5EF;
  width: 100%;
  display: flex;
  align-items: center;
  position: absolute;
  top: -1px;
  left: 0;
  border-right: none;
  margin-bottom: 8px;
  padding: 7px 16px !important;
  font-size: 12px;
  color: #EB5505;
}
.detail-page .ro-tag-label {
  background: #E1E9F8;
  color: #0F0A64;
}

.detail-page .landing .au-tag-label,
.detail-page .landing .ro-tag-label {
  top: 0;
}

.au-btn-label,
.ro-btn-label {
  display: block;
  width: 100%;
  position: absolute;
  top: -24px;
  left: 0;
  text-align: center;
  font-weight: 900;
  font-size: 12px;
  color: #0F0A64;
}

.au-btn-label.font-x-small,
.ro-btn-label.font-x-small {
  letter-spacing: 0;
  font-size: 10px;
}

.au-tag-label-on .frame-flex-base .btn-relux,
.ro-tag-label-on .frame-flex-base .btn-relux,
.au-tag-plan-on .frame-flex-base .btn-relux,
.ro-tag-plan-on .frame-flex-base .btn-relux {
  padding: 0 10px;
}

.au-tag-plan-on,
.ro-tag-plan-on {
  position: relative;
  padding-top: 36px !important;
}
.au-tag-plan-on .room-tag-label .icon-label,
.ro-tag-plan-on .room-tag-label .icon-label,
.au-tag-plan-on .room-tag-label .icon-orange,
.ro-tag-plan-on .room-tag-label .icon-orange  {
  margin-top: 8px;
}

.au-tag-plan-on > .au-tag-label,
.ro-tag-plan-on > .ro-tag-label {
  display: block;
  text-align: center;
}

.room-detail-article .au-tag,
.room-detail-article .ro-tag {
  width: calc(100% + 32px);
  margin-left: -16px;
  margin-bottom: 8px;
  text-align: center;
}

@media (max-width: 767px) {
  .detail-page .au-tag-label-on > div,
  .detail-page .ro-tag-label-on > div {
    min-height: 0 !important;
    padding-top: 40px;
  }
  .detail-page .au-tag-label-on .plan-list-sec02,
  .detail-page .ro-tag-label-on .plan-list-sec02 {
    padding-top: 0;
  }
  .detail-page .au-tag-label-on .plan-list-sec02 .au-tag-label,
  .detail-page .ro-tag-label-on .plan-list-sec02 .ro-tag-label {
    display: none;
  }
  .detail-page .au-tag-label,
  .detail-page .ro-tag-label {
    justify-content: center;
    padding: 2px 8px !important;
  }
  .au-tag-plan-on,
  .ro-tag-plan-on {
    padding-top: 24px !important;
  }
}

@media (max-width: 341px) {
  .detail-page .plan-list-sec01 .au-tag-label.sp-small {
    font-size: 1rem;
    height: 26px;
  }
}

@media (min-width: 768px) {
  .detail-page .hotel-summary h3 {
    margin-top: 0;
  }
  .detail-page .hotel-summary .title-box h1 {
    margin-left: -2px;
  }
  .detail-page .hotel-summary .title-box .icon-question {
    -webkit-align-self: center;
        -ms-flex-item-align: center;
                -ms-grid-row-align: center;
            align-self: center;
    margin: 0 8px;
  }
  .detail-page .hotel-summary {
    padding-top: 0;
  }
  .detail-page .hotel-summary .title-box,
  .detail-page .hotel-summary .address,
  .detail-page .hotel-summary .intro-wrap {
    max-width: 880px;
    margin-right: auto;
    margin-left: auto;
  }
  .detail-page .hotel-summary .intro-text {
    margin-bottom: 0px;
  }
  .detail-page .float-wrap {
    min-height: 140px;
  }
  .detail-page .access {
    border: none;
    padding-top: 40px;
  }
  .detail-page .access .g-map iframe {
    height: 600px;
  }
  .detail-page .facility table th,
  .detail-page .access table th {
    padding: 16px;
    width: 30.625%;
  }
  .detail-page .facility table td,
  .detail-page .access table td {
    padding: 16px;
  }
  .detail-page .facility .note,
  .detail-page .access .note {
    display: inline;
    padding-top: 0;
  }
}

@media (max-width: 360px) {
  .detail-page .gallery-line .thumb, .detail-page .gallery-line .btn-gallery {
    width: 20vw !important;
    height: 20vw !important;
    margin-right: 4vw;
  }
}

@media (max-width: 1100px) {
  .detail-page .common-modal.calendar-modal {
    margin: 0;
    height: auto;
    width: auto;
  }
  .detail-page .common-modal.calendar-modal .pc-only {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .sp-only {
    display: block !important;
  }
  .detail-page .common-modal.calendar-modal .modal-container {
    padding: 0;
    overflow-y: auto;
  }
  .detail-page .common-modal.calendar-modal .modal-container.scrolling .panel-head {
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  }
  .detail-page .common-modal.calendar-modal .dateSelector {
    padding: 0 16px;
  }
  .detail-page .common-modal.calendar-modal .panel-head {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    padding: 45px 16px 0;
    margin-left: 0;
    margin-right: 0;
    background-color: #fff;
    -webkit-transition: -webkit-box-shadow .25s;
    transition: -webkit-box-shadow .25s;
    transition: box-shadow .25s;
    transition: box-shadow .25s, -webkit-box-shadow .25s;
  }
  .detail-page .common-modal.calendar-modal .panel-head .btn-back {
    background: url(/stcontents/img/common/icon-arrow-left-black-2.svg) no-repeat center center;
    background-size: auto;
    width: 30px;
    height: 30px;
    position: fixed;
    top: 10px;
    left: 8px;
    z-index: 1;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box {
    height: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 16px;
    border-bottom: 1px solid #c6c6c6;
    padding: 6px 22px 0 28px;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .checkin,
  .detail-page .common-modal.calendar-modal .panel-head .date-box .checkout {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .unset {
    color: #757575;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .unset .sub {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .sub {
    color: #757575;
    font-size: 1.2rem;
    margin-left: 4px;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .stay {
    margin-left: auto;
    margin-right: 48px;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .border {
    margin: 0 16px;
    color: #757575;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .reset-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    right: 12px;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .reset-btn.unset {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .reset-btn a {
    font-size: 1.6rem;
    color: #757575 !important;
    background-color: transparent;
    padding: 0;
    padding-left: 28px;
    position: relative;
  }
  .detail-page .common-modal.calendar-modal .panel-head .date-box .reset-btn a::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("../img/common/icon-reset.svg");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  .detail-page .common-modal.calendar-modal .calendar-area {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
    margin-left: 0;
    margin-right: 0;
  }
  .detail-page .common-modal.calendar-modal .calendar-head {
    width: 100%;
    height: 34px;
  }
  .detail-page .common-modal.calendar-modal .calendar-head tr > th {
    text-align: center;
    font-size: 1.2rem;
  }
  .detail-page .common-modal.calendar-modal .calendar-head tr > th:last-child {
    color: #ce0000;
  }
  .detail-page .common-modal.calendar-modal .calendar-head tr > th:nth-last-child(2) {
    color: #06c;
  }
  .detail-page .common-modal.calendar-modal .calendar {
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .detail-page .common-modal.calendar-modal .calendar:last-child {
    margin-bottom: 24px;
  }
  .detail-page .common-modal.calendar-modal .calendar table thead {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .calendar table tr td .date-btn button {
    font-size: 1.6rem;
  }
  .detail-page .common-modal.calendar-modal .calendar table tr td .date-btn button .stay-price,
  .detail-page .common-modal.calendar-modal .calendar table tr td .date-btn button .stay-price-none {
    font-size: 1.4rem;
  }
  .detail-page .common-modal.calendar-modal .calendar .month {
    font-size: 1.6rem;
  }
  .detail-page .common-modal.calendar-modal .btn-area {
    background-color: #fff;
    width: auto;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 64px;
    padding: 0 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.1);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.1);
  }
  .detail-page .common-modal.calendar-modal .btn-area.unset {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .btn-area > a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .detail-page .common-modal.calendar-modal .date-panel-foot {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 70px;
    background-color: #fff;
    padding: 16px;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
    position: -webkit-sticky;
    position: sticky;
    margin-left: -16px;
    margin-right: -16px;
  }
  .detail-page .common-modal.calendar-modal .stay-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 400px;
    height: 60px;
    padding-right: 32px;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-bottom: 2px solid #c6c6c6;
    position: relative;
  }
  .detail-page .common-modal.calendar-modal .stay-box.unset {
    padding-right: 0;
    color: #757575;
  }
  .detail-page .common-modal.calendar-modal .stay-box.unset .reset-btn {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .stay-box.unset .main {
    font-size: 1.6rem;
  }
  .detail-page .common-modal.calendar-modal .stay-box.unset .sub {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .stay-box .checkin,
  .detail-page .common-modal.calendar-modal .stay-box .checkout {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .detail-page .common-modal.calendar-modal .stay-box .main {
    font-size: 2rem;
  }
  .detail-page .common-modal.calendar-modal .stay-box .sub {
    color: #757575;
    font-size: 1.4rem;
    margin-left: 16px;
  }
  .detail-page .common-modal.calendar-modal .stay-box .border {
    margin: 0 8px;
  }
  .detail-page .common-modal.calendar-modal .stay-box .reset-btn {
    position: absolute;
    right: 10px;
  }
  .detail-page .common-modal.calendar-modal .stay-box .reset-btn a {
    display: block;
  }
  .detail-page .common-modal.calendar-modal .stay-box .reset-btn a::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("../img/common/icon-reset.svg");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
  }
  .detail-page .common-modal.calendar-modal .info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .detail-page .common-modal.calendar-modal .price-area {
    margin-right: 16px;
    text-align: right;
    font-size: 1.2rem;
    line-height: 1.2;
  }
  .detail-page .common-modal.calendar-modal .price {
    font-size: 2rem;
    font-weight: bold;
  }
  .detail-page .common-modal.calendar-modal .stay-people {
    text-align: right;
  }
  .detail-page .common-modal.calendar-modal .stay-people-child.unset {
    display: none;
  }
  .detail-page .common-modal.calendar-modal .decide-btn a {
    height: 40px;
    width: 166px;
    font-size: 1.4rem;
  }
}

@media (max-width: 767px) {
  .detail-page h2 {
    margin-bottom: 8px;
    font-size: 2.4rem;
  }
  .detail-page h3 {
    font-size: 2.0rem;
  }
  .detail-page .room-plan h2 {
    margin-bottom: 0;
    padding-bottom: 16px;
    font-size: 2.4rem;
  }
  .detail-page .frame-flex-base.button-action {
    margin: 0 0 8px 0;
    margin-bottom: 8px;
  }
  .detail-page .frame-flex-separat {
    margin: 8px 0;
  }
  .detail-page .room-tab-frame .tab-stage.plan-stage {
    padding: 12px 0 0;
  }
  .detail-page .search-wrap {
    margin-bottom: 16px;
  }
  .detail-page .search-wrap .btn-popup-close {
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    background-size: contain;
    position: fixed;
    top: 10px;
    width: 30px;
    height: 30px;
    left: auto;
    right: 9px;
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
  }
  .detail-page .room-plan {
    padding-top: 34px;
    padding-bottom: 16px;
  }
  .detail-page .room-plan .sort-box {
    margin-bottom: 8px;
  }
  .detail-page .room-tag-label + p {
    margin-top: 4px;
    line-height: 1.8;
  }
  .detail-page .frame-flex-base.button-action > div a {
    height: 40px;
    font-size: 1.4rem;
  }
  .detail-page .hotel-box .room-tag-label {
    margin-bottom: 8px;
  }
  .detail-page .hotel-box.landing .plan-list-box .icon-label {
    margin-bottom: 8px;
  }
  .detail-page .room-top {
    margin-bottom: 16px;
  }
  .detail-page .hotel-summary {
    padding: 24px 0;
  }
  .detail-page .hotel-summary .title-box h1 {
    margin-bottom: 4px;
  }
  .detail-page .hotel-summary .title-box .title-grade {
    margin-bottom: 4px;
  }
  .detail-page .hotel-summary .intro-text {
    font-size: 1.4rem;
  }
  .detail-page .hotel-summary h3 {
    margin-top: 24px;
  }
  .detail-page .hotel-summary .links {
    margin-bottom: 0;
  }
  .detail-page .root-room-sp-modal .frame-item {
    padding: 8px;
  }
  .detail-page .frame-item .room-item-list {
    margin-right: 8px;
  }
  .detail-page .facility h2,
  .detail-page .access h2 {
    margin-bottom: 16px;
  }
  .detail-page .facility h3,
  .detail-page .access h3 {
    margin-top: 24px;
  }
  .detail-page .history {
    padding-bottom: 0;
  }
  .detail-page .text p {
    font-size: 1.4rem;
  }
}

.mtb-0 {
  margin: 0;
}

.mtb-10 {
  margin: 1rem 0;
}

.mt-16 {
  margin-top: 1.6rem;
}

.mt-8 {
  margin-top: .8rem;
}

.mt-10 {
  margin-top: 10px;
}

.area-right {
  text-align: right;
}

.deco-bt-line {
  text-decoration: underline;
}

.clickable {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.room-top {
  margin: .8rem 1.6rem 0;
}

.room-top .h3-sp-small {
  font-size: 1.8rem;
}

.room-top .icon-label {
  border: 1px solid #333;
  margin-bottom: 8px;
}

.room-plan {
  border-bottom: none;
}

.room-plan h2 {
  padding: 0 0 2rem;
  font-size: 2.4rem;
}

.room-plan .result-hotel {
  height: 17rem;
  -webkit-box-shadow: none;
          box-shadow: none;
  margin: 0;
}

.room-tab-frame {
  position: relative;
  overflow: hidden;
}

.room-tab-frame .tab-stage {
  background-color: #ffffff;
  padding: 8px 0 0;
  overflow: hidden;
}

.room-tab-frame .tab-stage.pb-reservation {
  padding-bottom: 20rem;
}

.room-tab-frame .tab-stage .frame-root {
  padding: 0 1.6rem;
}

.room-tab-frame .room-detail-article {
  padding: 0;
}

.room-tab-frame .room-detail-article h3 {
  margin-bottom: 1rem;
}

.room-tab-frame .smartpass-link .keyword-box {
  width: 100%;
  padding: 8px 16px;
  background-color: #FFF5EF;
  position: relative;
  border-radius: 8px;
  margin-top: 8px;
  margin-bottom: 16px;
}

.room-tab-frame .smartpass-link .keyword-box p {
  color: #333;
  margin-bottom: 0;
  font-size: 1.4rem;
}

.room-tab-frame .smartpass-link .keyword-box .arrow {
  position: absolute;
  right: 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.room-tag-label {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.room-tag-label .tag-label {
  -webkit-transform: none;
          transform: none;
}

.room-tag-label + p {
  margin-top: 5px;
  line-height: 1.4;
}

.room-tag-label .icon-orange,
.room-tag-label .icon-label,
.room-tag-label .icon-grade {
  margin-right: 8px;
}

.frame-flex-base {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.frame-flex-base.align-center {
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.frame-flex-base.button-action {
  margin: 1.6rem 0;
}

.frame-flex-base.button-action > div {
  -webkit-flex-basis: calc(100% / 2 - .4rem);
      -ms-flex-preferred-size: calc(100% / 2 - .4rem);
          flex-basis: calc(100% / 2 - .4rem);
}

.frame-flex-base.button-action > div a {
  width: 100%;
}

.frame-flex-base.justify-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.frame-flex-base.justify-end {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.frame-flex-base.justify-start {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.frame-flex-base.flex-wrap {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.frame-flex-base.room-reservation-data {
  border: 1px solid #c6c6c6;
  border-radius: .4rem;
  margin-bottom: 1rem;
}

.frame-flex-base.room-reservation-data dl:first-of-type {
  border-radius: .4rem 0 0 .4rem;
}

.frame-flex-base.room-reservation-data dl:first-of-type + dl {
  border-radius: 0 .4rem .4rem 0;
}

.frame-flex-base dl {
  background-color: #f5f5f5;
  padding: .2rem 1.6rem;
  -webkit-flex-basis: calc(100% / 2 - .2rem);
      -ms-flex-preferred-size: calc(100% / 2 - .2rem);
          flex-basis: calc(100% / 2 - .2rem);
}

.img-thumbnail {
  -webkit-flex-basis: 7rem;
      -ms-flex-preferred-size: 7rem;
          flex-basis: 7rem;
  position: relative;
  height: 7rem;
}

.img-thumbnail img {
  width: 100%;
  height: 7rem;
  -o-object-fit: cover;
     object-fit: cover;
}

.img-thumbnail .icon-label {
  position: absolute;
  top: .5rem;
  left: .5rem;
  font-size: .8rem;
  letter-spacing: 0;
}

.img-thumbnail + div {
  -webkit-flex-basis: calc(100% - 8rem);
      -ms-flex-preferred-size: calc(100% - 8rem);
          flex-basis: calc(100% - 8rem);
}

.img-thumbnail + div p {
  margin-bottom: 0;
}

.sale-icon .icon-label {
  border: 1px solid #333;
}

.frame-flex-separat {
  letter-spacing: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.frame-flex-separat.add-column {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin: .8rem 0;
}

.frame-flex-separat.add-x-position {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.frame-flex-separat.plan-detail-data {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  background-color: #f5f5f5;
  padding: .8rem .1rem;
  margin-top: 1.6rem;
}

.frame-flex-separat.plan-detail-data dl {
  -webkit-flex-basis: calc(100% / 2);
      -ms-flex-preferred-size: calc(100% / 2);
          flex-basis: calc(100% / 2);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-size: 1rem;
  letter-spacing: 0;
}

.frame-flex-separat.plan-detail-data dl dt {
  font-weight: bold;
}

.frame-flex-separat li {
  padding-right: .5rem;
}

.frame-flex-separat li::after {
  content: "";
  border-right: solid 1px #c6c6c6;
  padding-right: .5rem;
}

.frame-flex-separat li:last-child {
  padding-right: 0;
}

.frame-flex-separat li:last-child::after {
  border: none;
  padding-right: 0;
}

@media (min-width: 768px) {
  .reservation-login-modal .modal-loginsignin {
    height: auto;
  }
  .reservation-login-modal .wrap-loginsignin {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .reservation-login-modal .modal-loginInput {
    margin-bottom: 8px;
  }
  .reservation-login-modal .loginBtn-fix {
    margin-bottom: 8px;
  }
  .reservation-login-modal .modal-logInWithMailArea {
    margin: 0 auto;
    width: 320px;
  }
  .reservation-login-modal .modal-logInWithElseArea {
    padding: 0;
    width: 320px;
    border-left: none;
  }
  .reservation-login-modal .area-partition {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .reservation-login-modal .area-partition:before,
  .reservation-login-modal .area-partition:after {
    border-top: 1px solid #C6C6C6;
    content: "";
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    color: #757575;
  }
  .reservation-login-modal .area-partition:before {
    margin-right: 8px;
  }
  .reservation-login-modal .area-partition:after {
    margin-left: 8px;
  }
  .reservation-login-modal .sns-login > div a {
    border: 1px solid #757575;
  }
  .reservation-login-modal .reservation-link {
    text-align: center;
    margin-top: 32px;
    margin-bottom: 0;
  }
}

.reservation-login-modal .modal-logInWithElseArea {
  margin: 0 auto;
}

.reservation-login-modal .reservation-link {
  text-align: center;
  margin-top: 24px;
  margin-bottom: 0;
}

.list-star li {
  padding-left: 1em;
  text-indent: -1em;
}

.list-star li::before {
  content: "※";
}

.frame-table-line dl {
  border-top: 1px solid #C6C6C6;
  padding: .8rem 0;
}

.frame-table-line dl:last-child {
  border-bottom: 1px solid #C6C6C6;
}

.title-member-fee {
  background-color: #f5f5f5;
  padding: .4rem;
  margin: .8rem 0;
  text-align: right;
  min-height: 2.4rem;
  line-height: 1;
}

.title-member-fee .member-fee-mark {
  margin-right: .5rem;
  vertical-align: sub;
  display: inline-block;
}

.title-member-fee .member-fee-name {
  color: #0F0A64;
  font-weight: bold;
  font-size: 1rem;
}

.plan-fee {
  text-align: right;
  line-height: 1.6;
}

.plan-fee .frame-fee-member {
  height: 1.4rem;
  margin-bottom: .4rem;
}

.plan-fee .fee-member-rate {
  text-decoration: line-through;
}

.plan-fee .plan-fee-point {
  margin-top: .4rem;
  -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
          flex-basis: 100%;
}

.plan-fee.sp-plam-fee-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.fee-payment {
  font-size: 1.6rem;
  font-weight: bold;
}

.hotel-box {
  border-bottom: 4px solid #f5f5f5;
  padding: 0 1.6rem 1.6rem;
  margin-bottom: 1.6rem;
}

.hotel-box.root-continue {
  padding: 0 0 1.6rem;
}

.hotel-box:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
}

.hotel-box.landing {
  border: 2px solid #A6BCE9;
}

.hotel-box.landing .plan-list-box .icon-label {
  margin-bottom: 4px;
}

.hotel-box .empty-text {
  padding: 80px 16px 80px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .hotel-box.root-continue {
    padding: 0;
  }
  .hotel-box.landing {
    padding-top: 16px;
  }
  .hotel-box.landing .room-top .icon-label {
    margin-bottom: 4px;
  }
  .hotel-box .empty-text {
    padding: 56px 16px;
  }
  .hotel-box .room-tag-label {
    padding: 0 16px;
  }
  .hotel-box .plan-list-sec01 .room-tag-label {
    margin-top: -8px !important;
    margin-bottom: 0;
    padding: 0;
  }
  .plan-stage .hotel-box .empty-text {
    padding: 52px 16px 56px;
  }
}

.plan-list-box {
  margin: 0 1.6rem 2rem;
  padding: 1.6rem 2.3em 1.6rem 1.6rem;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  position: relative;
}

.plan-list-box .room-list-clickable {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.plan-list-box .room-list-clickable::after {
  content: "";
  background: url("../img/common/icon-text-link-black.svg") no-repeat 0 0;
  background-size: contain;
  position: absolute;
  display: block;
  width: 1.3rem;
  height: 18px;
  right: 10px;
  top: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: scaleY(1.3);
          transform: scaleY(1.3);
}

.plan-list-box.landing {
  border: 1px solid #A6BCE9;
}

.plan-list-box.text-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2.4rem 1.6rem;
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.plan-list-box.text-center p {
  margin-bottom: 0;
}

.room-detail-article {
  padding: 2rem 1.6em 1.6rem;
}

.room-detail-article .result-hotel {
  -webkit-box-shadow: none;
          box-shadow: none;
  height: 19rem;
}

.frame-item {
  color: #000000;
  padding: 16px;
}

.frame-item dt {
  margin-bottom: 1rem;
  font-weight: bold;
}

.frame-item dd {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 2rem;
}

.frame-item dd:last-of-type {
  margin: 0;
}

.frame-item .room-item-list {
  margin-right: 24px;
  margin-bottom: 8px;
}

.frame-item .room-item-list li {
  display: inline-block;
  margin-left: 1em;
  text-indent: -1em;
}

.frame-item .room-item-list li::before {
  content: "・";
}

@media (max-width: 767px) {
  .frame-item .room-item-list {
    margin-right: 8px;
  }
}

.frame-plan-add {
  margin-top: 1.6rem;
}

.reservation-box {
  -webkit-box-shadow: 0 -0.2rem 1rem 0 rgba(0, 0, 0, 0.07);
          box-shadow: 0 -0.2rem 1rem 0 rgba(0, 0, 0, 0.07);
  padding: .8rem 1.6rem;
  background-color: #ffffff;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

.reservation-box .fee-payment {
  font-size: 2rem;
}

.reservation-box .plan-fee {
  margin-right: .5rem;
}

.reservation-box .btn-submit {
  -webkit-flex-basis: 40%;
      -ms-flex-preferred-size: 40%;
          flex-basis: 40%;
  text-align: center;
}

.reservation-box .btn-submit button,
.reservation-box .btn-submit a {
  width: 100%;
}

.remarks p u {
  color: #757575;
  cursor: pointer;
}

.area-continue {
  padding-top: .8rem;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
}

@media screen and (max-width: 767px) {
  .area-continue {
    background-color: #f5f5f5;
    overflow: hidden;
    padding-top: 16px;
  }
}

.display-more-button {
  text-align: center;
}

.display-more-button a {
  display: block;
  padding-top: 2rem;
  cursor: pointer;
  color: #0F0A64;
}

.display-more-button a span {
  position: relative;
  display: inline-block;
  padding-right: 3rem;
}

.display-more-button a span::after {
  content: "";
  background: url("../img/common/icon-accordion.svg") no-repeat 0 0;
  background-size: contain;
  position: absolute;
  display: block;
  width: 1.5rem;
  height: 0.8rem;
  display: inline-block;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

.display-more-button.open a span::after {
  -webkit-transform: rotate(-180deg);
          transform: rotate(-180deg);
}

@media screen and (max-width: 767px) {
  .display-more-button {
    background-color: #f5f5f5;
  }
  .display-more-button p {
    margin-bottom: 0;
  }
  .display-more-button a {
    padding-top: 8px;
    padding-bottom: 24px;
    font-size: 1.4rem;
  }

  .detail-page .btn-small {
    height: 40px;
    font-size: 1.4rem;
  }

  .detail-page .display-more-button {
    padding: 0 16px 12px;
  }

  .detail-page .display-more-button a {
    margin-top: 0;
    width: 100%;
    height: 40px;
  }
}

.plan-tab-modal {
  height: calc(100% - 15rem);
  overflow: auto;
}

.root-room-pc-modal .plan-fee {
  margin-right: 1rem;
  line-height: 1.4;
}

.root-room-pc-modal .plan-fee .frame-fee-member {
  margin-bottom: 0;
}

.root-room-pc-modal .plan-fee .plan-fee-point {
  margin-top: 0;
}

.root-room-pc-modal .hotel-box {
  padding: 0;
}

.root-room-pc-modal .result-hotel {
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  margin-bottom: 0;
}

.root-room-pc-modal .modal-container {
  padding: 0 0 1.6rem;
}

.root-room-pc-modal .modal-container .content-body {
  margin: 1.6rem;
}

.root-room-pc-modal .modal-container.scroll-on {
  padding-right: 0;
}

.root-room-pc-modal .modal-container.wrap-plan-modal .content-body {
  margin: 0;
  height: calc(100% - 11.6rem);
}

.root-room-pc-modal .modal-container.wrap-plan-modal .content-body.scroll-all {
  height: 100%;
}

.root-room-pc-modal .modal-container.wrap-plan-modal .content-body.scroll-all .room-detail-article {
  padding: .8rem 1.6rem;
}

.root-room-pc-modal .modal-container.wrap-plan-modal .tab-content {
  padding: 1.6rem;
}

.root-room-pc-modal .room-detail-article {
  padding: 0;
}

.root-room-pc-modal .room-detail-article u {
  color: #757575;
}

.root-room-pc-modal .room-detail-article u:hover {
  text-decoration: none;
  cursor: pointer;
}

.root-room-pc-modal .slick-dotted.slick-slider {
  margin-bottom: 0;
}

.root-room-pc-modal .slick-dots {
  left: 0 !important;
  right: 0 !important;
  margin: auto !important;
}

.root-room-pc-modal .room-top {
  margin: 0 0 2rem;
}

.root-room-sp-modal .common-modal .modal-container .content-body {
  height: auto;
}

.root-room-sp-modal .room-detail-article {
  position: relative;
  padding-bottom: 8rem;
  padding: 0;
}

.root-room-sp-modal .btn-modal-close {
  background: none;
  width: auto;
  height: auto;
  left: 2rem !important;
  right: 2rem !important;
  bottom: 2rem;
  text-align: center;
  top: auto;
}

.root-room-sp-modal .btn-modal-close .btn-default {
  display: block;
  border: solid 1px #c6c6c6;
}

.root-room-sp-modal .slick-dotted.slick-dotted.slick-slider {
  margin-bottom: 0;
}

.root-room-sp-modal .result-hotel {
  -webkit-box-shadow: none;
          box-shadow: none;
  margin-bottom: 0;
}

.root-room-sp-modal .result-hotel .sale-icon {
  top: 8px;
  left: 8px;
}

.root-room-sp-modal .room-top {
  margin: 0;
}

.root-room-sp-modal .frame-item {
  padding: 16px;
}

.room-plan-info .anchor-link,
.wrap-plan-modal .anchor-link {
  background-color: #ffffff;
  max-width: 100%;
  padding-top: 1.6rem;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1;
}

.room-plan-info .result-hotel {
  margin-bottom: 0;
}

.room-plan-info .room-tab-frame {
  padding: 0;
}

.room-plan-info .hotel-box {
  padding: 0 1.6rem;
}

.frame-fee-member {
  display: none;
}

.screen-member .frame-fee-member {
  display: block;
}

@media (max-width: 767px) {
  .title-member-fee {
    padding-right: 8px;
  }
  .title-member-fee .member-fee-mark {
    margin-right: 4px;
    height: 1.6rem;
  }
  .root-room-pc-modal .modal-container.scroll-on .content-body {
    padding: 0;
  }
  .room-detail-article .font-large,
  .room-plan-info .font-large {
    font-size: 1.4rem;
  }
  .room-detail-article .font-large.sp-foint-size14,
  .room-plan-info .font-large.sp-foint-size14 {
    font-size: 1.4rem;
  }
  .sp-foint-size14 {
    font-size: 1.4rem;
  }
  .cancel-rate {
    display: block;
  }
}

@media (min-width: 768px) {
  .kv-slider .slick-next {
    left: auto;
    right: calc(8% - 20px);
  }
  .kv-slider .slick-prev {
    left: calc(8% - 20px);
    right: auto;
  }
  .room-top {
    margin-left: 0;
    margin-right: 0;
  }
  .room-top .frame-flex-base.button-action {
    margin: 2.4rem 0 0;
  }
  .room-top.frame-flex-base-pc .pc-only {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .room-top.frame-flex-base-pc .plan-list-sec01 {
    -webkit-flex-basis: auto;
        -ms-flex-preferred-size: auto;
            flex-basis: auto;
  }
  .plan-list-box {
    margin: 0;
    padding: 1.6rem 0;
    -webkit-box-shadow: none;
            box-shadow: none;
    border-radius: 0;
    position: relative;
    border-top: 1px solid #C6C6C6;
  }
  .plan-list-box:only-child {
    border-bottom: 1px solid #C6C6C6;
  }
  .plan-list-box .room-list-clickable {
    display: none;
  }
  .plan-list-box > div {
    border-right: 1px solid #C6C6C6;
  }
  .plan-list-box > div:last-of-type {
    border-right: none;
  }
  .plan-list-box.landing {
    border-left: none;
    border-right: none;
    border-width: 2px;
  }
  .plan-list-box.landing + div {
    border-top: none;
  }
  .plan-list-box.landing:only-child {
    border-bottom: 2px solid #A6BCE9;
  }
  .frame-flex-base-pc {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .frame-flex-base-pc .img-thumbnail {
    display: block;
    height: 18rem;
  }
  .frame-flex-base-pc .img-thumbnail a:hover {
    opacity: .7;
  }
  .frame-flex-base-pc .img-thumbnail + .room-top {
    -webkit-flex-basis: calc(100% - 29.2rem);
        -ms-flex-preferred-size: calc(100% - 29.2rem);
            flex-basis: calc(100% - 29.2rem);
    margin: 0;
  }
  .frame-flex-base-pc.direction-col {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .frame-flex-base-pc.align-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .frame-flex-base-pc.align-base {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
  .frame-flex-base-pc.fee-pc {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .frame-flex-base-pc.align-center {
    align-items: center;
  }
  .frame-flex-base-pc.fee-pc .pc-only {
    font-size: 1.2rem;
    margin-right: .5rem;
  }
  .frame-flex-base-pc.relux-offer-none {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .frame-flex-base-pc.relux-offer-none .title-member-fee {
    display: none;
  }
  .frame-flex-base-pc.box-wrap {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .frame-flex-base-pc.justify-start {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .frame-flex-base-pc .plan-list-sec01,
  .frame-flex-base-pc .plan-list-sec02,
  .frame-flex-base-pc .plan-list-sec03 {
    min-height: 9.2rem;
  }
  .frame-flex-base-pc .plan-list-sec01 {
    padding-right: 1.6rem;
    -webkit-flex-basis: calc(100% - 55rem);
        -ms-flex-preferred-size: calc(100% - 55rem);
            flex-basis: calc(100% - 55rem);
  }
  .frame-flex-base-pc .plan-list-sec01 > .frame-flex-base {
    height: 100%;
  }
  .frame-flex-base-pc .plan-list-sec01 .frame-flex-base-pc {
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .frame-flex-base-pc .plan-list-sec01 .frame-flex-base-pc .room-tag-label {
    margin: 0;
  }
  .frame-flex-base-pc .plan-list-sec02 {
    -webkit-flex-basis: 31rem;
        -ms-flex-preferred-size: 31rem;
            flex-basis: 31rem;
  }
  .frame-flex-base-pc .plan-list-sec02 > .frame-flex-base-pc {
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .frame-flex-base-pc .plan-list-sec02 .plan-fee {
    padding-right: 1.6rem;
    line-height: 1.4;
  }
  .frame-flex-base-pc .plan-list-sec03 {
    -webkit-flex-basis: 24rem;
        -ms-flex-preferred-size: 24rem;
            flex-basis: 24rem;
    padding-left: 1.6rem;
  }
  .frame-flex-base-pc .plan-list-sec03 .button-action {
    height: 100%;
    align-items: center;
  }
  .frame-flex-base-pc .plan-list-sec03 .button-action.day-none div:nth-child(-n+2) {
    display: none;
  }
  .frame-flex-base-pc .plan-list-sec03 .button-action.day-none .btn-day-none {
    -webkit-flex-basis: 21.4rem;
        -ms-flex-preferred-size: 21.4rem;
            flex-basis: 21.4rem;
  }
  .frame-flex-base-pc.reservation-box {
    position: absolute;
    border-radius: 0 0 1.4rem 1.4rem;
    padding: 1.4rem 4rem;
  }
  .frame-flex-base-pc.reservation-box .stay-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 400px;
    height: 60px;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: 1px solid #c6c6c6;
    border-radius: 4px;
    position: relative;
    cursor: pointer;
    visibility: visible;
    pointer-events: visible;
  }
  .frame-flex-base-pc.reservation-box .stay-box.unset {
    visibility: hidden;
    pointer-events: none;
    padding-right: 0;
    color: #757575;
  }
  .frame-flex-base-pc.reservation-box .stay-box.unset .reset-btn {
    display: none;
  }
  .frame-flex-base-pc.reservation-box .stay-box.unset .main {
    font-size: 1.6rem;
  }
  .frame-flex-base-pc.reservation-box .stay-box.unset .sub {
    display: none;
  }
  .frame-flex-base-pc.reservation-box .stay-box .checkin,
  .frame-flex-base-pc.reservation-box .stay-box .checkout {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .frame-flex-base-pc.reservation-box .stay-box .main {
    font-size: 2rem;
  }
  .frame-flex-base-pc.reservation-box .stay-box .sub {
    color: #757575;
    font-size: 1.4rem;
    margin-left: 16px;
  }
  .frame-flex-base-pc.reservation-box .stay-box .border {
    margin: 0 8px;
  }
  .frame-flex-base-pc.reservation-box .stay-box .reset-btn {
    position: absolute;
    right: 10px;
  }
  .frame-flex-base-pc.reservation-box .stay-box .reset-btn a {
    display: block;
  }
  .frame-flex-base-pc.reservation-box .stay-box .reset-btn a::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url("../img/common/icon-reset.svg");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
  }
  .frame-flex-base-pc.reservation-box .info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .frame-flex-base-pc.reservation-box .price-area {
    margin-right: 16px;
  }
  .frame-flex-base-pc.reservation-box .price {
    font-size: 2.4rem;
    font-weight: bold;
    margin-left: 8px;
  }
  .frame-flex-base-pc.reservation-box .stay-people {
    text-align: right;
  }
  .frame-flex-base-pc.reservation-box .stay-people-child.unset {
    display: none;
  }
  .frame-flex-base-pc.reservation-box .info-btn-area .decide-btn {
    display: none;
  }
  .frame-flex-base-pc.reservation-box .decide-btn a,
  .frame-flex-base-pc.reservation-box .date-select-btn a {
    width: 230px;
    max-width: 230px;
    height: 48px;
  }
  .frame-flex-base.button-action {
    margin: 0;
  }
  .frame-flex-base.button-action div {
    -webkit-flex-basis: auto;
        -ms-flex-preferred-size: auto;
            flex-basis: auto;
  }
  .frame-flex-base.button-action div.to-form {
    -webkit-flex-basis: 65%;
        -ms-flex-preferred-size: 65%;
            flex-basis: 65%;
    position: relative;
  }
  .frame-flex-base.button-action div.to-detail {
    -webkit-flex-basis: 32%;
        -ms-flex-preferred-size: 32%;
            flex-basis: 32%;
  }
  .frame-flex-base.room-reservation-data {
    margin-bottom: 0;
  }
  .frame-flex-separat.font-x-small {
    font-size: 1.2rem;
  }
  .frame-flex-separat.plan-detail-data {
    padding: 1.6rem;
    margin-top: 2.6rem;
  }
  .frame-flex-separat.plan-detail-data dl {
    font-size: 1.4rem;
  }
  .frame-flex-separat.plan-detail-data dl:first-child {
    margin-bottom: 8px;
  }
  .frame-flex-separat li {
    padding-right: .8rem;
  }
  .frame-flex-separat li::after {
    padding-right: .8rem;
  }
  .title-member-fee {
    margin: 0 0 1rem;
    text-align: right;
  }
  .title-member-fee .member-fee-mark {
    vertical-align: middle;
  }
  .img-thumbnail {
    -webkit-flex-basis: 26rem;
        -ms-flex-preferred-size: 26rem;
            flex-basis: 26rem;
  }
  .img-thumbnail.pc-plan-thumbnail {
    -webkit-flex-basis: 15rem;
        -ms-flex-preferred-size: 15rem;
            flex-basis: 15rem;
    position: relative;
    height: 9.2rem;
  }
  .img-thumbnail.pc-plan-thumbnail img {
    height: 9.2rem;
  }
  .img-thumbnail img {
    height: 18rem;
  }
  .img-thumbnail + div {
    -webkit-flex-basis: calc(100% - 17rem);
        -ms-flex-preferred-size: calc(100% - 17rem);
            flex-basis: calc(100% - 17rem);
  }
  .room-plan .tab-box {
    margin: 0 auto;
    max-width: 1120px;
  }
  .room-plan .tab-box > div {
    font-size: 1.6rem;
  }
  .room-plan .tab-box > div .number {
    font-size: 1.4rem;
  }
  .room-tab-frame {
    background-color: #f5f5f5;
    padding-top: 8px;
    padding-bottom: 24px;
  }
  .room-tab-frame .tab-stage {
    max-width: 1120px;
    margin: 0 auto;
    background: none;
  }
  .hotel-box {
    background-color: #ffffff;
    margin: 0 0 16px;
    border-bottom: none;
  }
  .hotel-box.root-continue {
    padding: 2.4rem 3.2rem;
  }
  .hotel-box .room-tag-label {
    margin-bottom: 0;
  }
  .display-more-button {
    font-size: 1.6rem;
    border-top: 1px solid #C6C6C6;
  }
  .display-more-button a {
    padding-top: 1.6rem;
  }
  .area-continue {
    padding-top: 1.6rem;
    background-color: #fff;
  }
  .area-continue.open {
    padding-bottom: 1.6rem;
  }
  .continue-wrap {
    font-size: 1.6rem;
  }
  .continue-open {
    bottom: -.6rem;
  }
  .fee-payment {
    font-size: 2.4rem;
  }
  .frame-flex-base-pc.fee-pc .fee-payment {
    flex-shrink: 0;
  }
  .btn-default {
    font-weight: bold;
  }
  .root-room-pc-modal {
    max-width: 96rem;
  }
  .root-room-pc-modal .modal-container {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    max-height: 100%;
    height: 90%;
  }
  .root-room-pc-modal .modal-container.tab-content {
    height: calc(100% - 5%) !important;
  }
  .root-room-pc-modal .modal-container .content-body {
    margin: 1.6rem 2rem 0 4rem;
    height: calc(100% - 35.5vw);
  }
  .root-room-pc-modal .modal-container.wrap-plan-modal {
    padding: 0;
  }
  .root-room-pc-modal .modal-container.wrap-plan-modal .tab-content {
    padding: 1.6rem 4rem;
  }
  .root-room-pc-modal .modal-container.wrap-plan-modal .content-body {
    padding-right: 0;
    margin: 0;
    height: calc(100% - 8.8rem);
  }
  .root-room-pc-modal .modal-container.wrap-plan-modal .content-body::-webkit-scrollbar {
    display: none;
  }
  .root-room-pc-modal .modal-container.wrap-plan-modal .content-body.scroll-all .room-detail-article {
    padding: 1.6rem 4rem;
  }
  .root-room-pc-modal .modal-container.wrap-plan-modal .anchor-link {
    padding: 1.6rem 2.4rem 0;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
  }
  .root-room-pc-modal .room-detail-article .result-hotel {
    height: 35rem;
    position: relative;
  }
  .root-room-pc-modal .room-detail-article .result-hotel .icon-red {
    position: absolute;
    top: 1rem;
    left: 1rem;
  }
  .root-room-pc-modal .plan-fee {
    line-height: 1.4;
  }
  .root-room-pc-modal .plan-fee .fee-member-rate {
    font-size: 1.2rem;
  }
  .tab-screen-modal {
    position: fixed;
    top: 3.2rem;
    right: 3.2rem;
  }
  .plan-tab-modal {
    height: calc(100% - 6.9rem);
  }
  .plan-tab-modal h3 {
    font-size: 2.4rem;
    margin: 0 0 1.6rem;
  }
  .plan-tab-modal .hotel-box {
    padding: 0;
    border-bottom: 5px solid #f5f5f5;
  }
  .room-tag-label {
    margin: 0 0 0.8rem;
  }
  .screen-member .plan-list-sec01,
  .screen-member .plan-list-sec02,
  .screen-member .plan-list-sec03 {
    min-height: 11rem;
  }
  .on-zoom01 {
    display: block;
    height: 18rem;
  }
  .on-zoom01:after {
    content: "";
    background: url("/stcontents/img/common/icon-big.svg");
    background-size: contain;
    width: 3rem;
    height: 3rem;
    position: absolute;
    bottom: 0;
    right: 0;
    pointer-events: none;
  }
  .on-zoom01:hover:after {
    background: url("/stcontents/img/common/hover-icon-big.svg");
    background-size: contain;
  }
  .cancel-rate {
    display: inline-block;
    margin-left: 1rem;
  }
}

@media (max-width: 1023px) {
  .result-hotel .js-slick-slider > div a::before {
    display: none;
  }
}

@media (min-width: 1024px) {
  .root-room-pc-modal .btn-slide-arrow .slick-next {
    left: auto;
    right: 1rem;
  }
  .root-room-pc-modal .result-hotel {
    height: 40rem;
  }
  .root-room-pc-modal .result-hotel .js-slick-slider > div {
    max-width: 100%;
  }
  .root-room-pc-modal .modal-container .content-body {
    height: calc(100% - 41.5rem);
  }
}

@media screen and (min-width: 768px) and (max-width: 1120px) {
  .frame-flex-base-pc .plan-list-sec01 {
    -webkit-flex-basis: 50vw;
        -ms-flex-preferred-size: 50vw;
            flex-basis: 50vw;
    padding-right: 0;
  }
  .frame-flex-base-pc .plan-list-sec01 .frame-flex-base {
    display: block;
  }
  .frame-flex-base-pc .plan-list-sec02 {
    -webkit-flex-basis: 33vw;
        -ms-flex-preferred-size: 33vw;
            flex-basis: 33vw;
  }
  .frame-flex-base-pc .plan-list-sec02 .plan-fee {
    padding-right: 1rem;
  }
  .frame-flex-base-pc .plan-list-sec03 {
    -webkit-flex-basis: 22vw;
        -ms-flex-preferred-size: 22vw;
            flex-basis: 22vw;
    padding-left: 1rem;
  }
  .frame-flex-base-pc .plan-list-sec03 .btn-small {
    font-size: 1.3vw;
    padding: 0 0.2rem;
  }
  .plan-list-box .frame-flex-base-pc.fee-pc {
    flex-wrap: wrap;
  }
  .room-tag-label .tag-label {
    font-size: 1vw;
    padding: 3px 1.1vw 4px;
  }
  .room-top.frame-flex-base-pc {
    display: block;
  }
  .plan-stage .plan-list-sec01 .pc-plan-thumbnail {
    width: 15rem;
  }
  .plan-stage .plan-list-sec01 .pc-plan-thumbnail + div {
    margin-right: 1rem;
  }
}

/*
  コンシェルジュ専用プラン
*/
.concierge-box {
  width: 100%;
  padding-bottom: 24px !important;
}
.concierge-box .info .price-area {
  flex-shrink: 0;
}
.concierge-box .announce {
  width: 100%;
  height: 100%;
  padding-right: 10px;
  font-size: 14px;
  color: #757575;
}
.concierge-box .announce .text {
  margin-bottom: 0;
  display: flex;
  align-items: center;
}
.concierge-box .announce strong {
  margin-right: 8px;
  vertical-align: middle;
  font-weight: bold;
  font-size: 16px;
  color: #333;
}
.concierge-box .announce strong:first-child:after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 1em;
  padding-right: 8px;
  border-right: 1.5px solid #FF503E;
  vertical-align: middle;
}
.concierge-box .announce strong:nth-child(2) {
  font-size: 20px;
}
.concierge-box .announce .note {
  font-size: 12px;
}
.concierge-box .announce .note a:hover {
  opacity: 1;
  color: #0066CC;
  text-decoration: none;
}
@media screen and (max-width: 900px){
  .concierge-box .announce .text {
    display: block;
  }
  .concierge-box .announce .text span {
    display: block;
    margin-bottom: 8px;
  }
}
@media screen and (max-width: 767px){
  .concierge-box .announce {
    padding-right: 0;
  }
  .concierge-box .announce .text {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-left: 2px solid #FF503E;
    padding-left: 8px;
    line-height: 1.3;
    margin-bottom: 4px;
  }
  .concierge-box .announce strong {
    margin: 0 !important;
    font-size: 14px;
  }
  .concierge-box .announce strong:first-child:after {
    content: none;
  }
  .concierge-box .announce .text span {
    margin-bottom: 0;
    font-size: 12px;
    letter-spacing: 0;
  }
  .concierge-box .announce .note {
    font-size: 10px;
    line-height: 1.5;
    letter-spacing: 0;
  }
  .concierge-box .announce .text > div:last-child {
    flex-shrink: 0;
    margin-left: 8px;
  }
  .concierge-box .announce .text .btn {
    width: 134px;
    height: 32px;
    font-size: 14px;
  }
}

/*
  衛生管理モーダル
*/
.health-modal .health-list .title {
  background: url(/stcontents/img/common/icon-health-1.svg) no-repeat 0 center;
  padding-left: 40px;
}

.health-modal .health-list ul {
  margin-bottom: 24px;
}

.health-modal .health-list ul li {
  background: url(/stcontents/img/common/icon-checked.svg) no-repeat 0 0;
  margin-bottom: 8px;
  padding-left: 40px;
}

.health-modal .health-list ul li:last-child {
  margin-bottom: 0;
}

.health-modal .health-list-2 .title {
  background-image: url(/stcontents/img/common/icon-health-2.svg);
}

.health-modal .health-list-3 .title {
  background-image: url(/stcontents/img/common/icon-health-3.svg);
}

.health-modal .health-list-4 .title {
  background-image: url(/stcontents/img/common/icon-health-4.svg);
}

.health-modal .health-list-5 .title {
  background-image: url(/stcontents/img/common/icon-health-5.svg);
}

.health-modal .health-list-6 .title {
  background-image: url(/stcontents/img/common/icon-health-6.svg);
}

/*
  クーポンの登録
*/
.detail-page .btn-coupon {
  position: absolute;
  top: 24px;
  left: calc(50% - 560px);
  z-index: 1;
}

.detail-page .btn-coupon a {
  background: #4F68C2;
  border: 1px solid #fff;
}

.detail-page .btn-coupon a:hover {
  background: #554B98;
  border: 1px solid #fff;
}

.detail-page .btn-coupon a:after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 4px;
  margin-bottom: -2px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.detail-page .coupon-modal .modal-container,
.detail-page .coupon-get-modal .modal-container,
.detail-page .coupon-multi-modal .modal-container {
  height: 560px;
  padding: 100px 40px 150px;
  border-radius: 8px;
}

.detail-page .coupon-modal .flex,
.detail-page .coupon-get-modal .flex,
.detail-page .coupon-multi-modal .flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.detail-page .coupon-modal .flex > div,
.detail-page .coupon-get-modal .flex > div,
.detail-page .coupon-multi-modal .flex > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.detail-page .coupon-modal .flex .border,
.detail-page .coupon-get-modal .flex .border,
.detail-page .coupon-multi-modal .flex .border {
  width: 1px;
  height: 24px;
  margin: 0 16px;
  border-right: 1px solid #C6C6C6;
}

.detail-page .coupon-modal .flex span,
.detail-page .coupon-get-modal .flex span,
.detail-page .coupon-multi-modal .flex span {
  margin-left: 8px;
}

.detail-page .coupon-modal .coupon-get-error,
.detail-page .coupon-get-modal .coupon-get-error,
.detail-page .coupon-multi-modal .coupon-get-error {
  width: 100%;
  height: 100%;
  text-align: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  background: rgba(0, 0, 0, 0.05);
}

.detail-page .coupon-modal .coupon-get-error .inner,
.detail-page .coupon-get-modal .coupon-get-error .inner,
.detail-page .coupon-multi-modal .coupon-get-error .inner {
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: inline-block;
  padding: 24px 32px;
  border-radius: 8px;
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
}

.detail-page .coupon-modal .coupon-get-error .btn-relux,
.detail-page .coupon-get-modal .coupon-get-error .btn-relux,
.detail-page .coupon-multi-modal .coupon-get-error .btn-relux {
  padding: 0 24px;
}

.detail-page .coupon-modal .coupon-get-error .js-modal-close,
.detail-page .coupon-get-modal .coupon-get-error .js-modal-close,
.detail-page .coupon-multi-modal .coupon-get-error .js-modal-close {
  background-image: none;
  position: relative;
  width: auto;
  top: inherit;
  left: inherit;
  right: inherit;
}

@media screen and (max-width: 767px) {
  .detail-page .coupon-modal .coupon-get-error .inner,
  .detail-page .coupon-get-modal .coupon-get-error .inner,
  .detail-page .coupon-multi-modal .coupon-get-error .inner {
    max-width: 100%;
    width: 300px;
    padding: 16px 16px;
  }
  .detail-page .coupon-modal .coupon-get-error .btn-relux,
  .detail-page .coupon-get-modal .coupon-get-error .btn-relux,
  .detail-page .coupon-multi-modal .coupon-get-error .btn-relux {
    height: 40px;
    padding: 0 40px;
  }
}

.detail-page .coupon-modal .content-body p {
  color: #0F0A64;
}

.detail-page .coupon-modal .content-body p:first-child {
  font-size: 2.4rem;
  margin-bottom: 0 !important;
}

@media screen and (max-width: 767px) {
  .detail-page .coupon-modal .content-body p:first-child {
    font-size: 1.4rem;
  }
}

.detail-page .coupon-get-modal .modal-container {
  padding: 32px 40px 24px;
}

.detail-page .coupon-get-modal .content-body p:nth-child(2) {
  color: #0F0A64;
}

.detail-page .coupon-get-modal .code-box {
  display: inline-block;
  padding: 8px 24px 12px;
}

.detail-page .coupon-get-modal .code-box .clip-btn {
  text-decoration: underline;
  color: inherit;
}

.detail-page .coupon-get-modal .code-box .clip-btn.clicked {
  text-decoration: none;
  color: #757575;
}

.detail-page .coupon-get-modal .code-box .clip-btn:hover {
  text-decoration: none;
}

.detail-page .coupon-get-modal .code-box .clip-btn img {
  width: 24px;
  height: 24px;
  vertical-align: top;
}

.detail-page .coupon-get-modal .notice-box {
  height: 192px;
  overflow-y: auto;
}

.detail-page .coupon-get-modal .notice-box ul {
  padding-left: 1.2em;
}

.detail-page .coupon-get-modal .notice-box ul li {
  margin-bottom: 8px;
  list-style: disc;
}

.detail-page .coupon-get-modal .btn-wide {
  min-width: 187px;
  height: 40px;
  font-size: 1.4rem;
}

.detail-page .coupon-multi-modal .modal-container {
  padding: 40px 20px 50px 65px;
}

.detail-page .coupon-multi-modal .coupon-list {
  height: 380px;
  padding-right: 20px;
  overflow-y: auto;
}

.detail-page .coupon-multi-modal .coupon-list::-webkit-scrollbar {
  width: 4px;
}

.detail-page .coupon-multi-modal .coupon-list::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.detail-page .coupon-multi-modal .coupon-list::-webkit-scrollbar-thumb {
  background-color: #C6C6C6;
}

.detail-page .coupon-multi-modal .coupon-list .font-xxxx-large {
  line-height: 1;
}

.detail-page .coupon-multi-modal .coupon-list .disabled {
  pointer-events: none;
  color: #C6C6C6;
}

.detail-page .coupon-multi-modal .coupon-list .disabled .coupon-item {
  color: #C6C6C6;
}

.detail-page .coupon-multi-modal .coupon-list .disabled .icon-disabled {
  display: inline-block;
  padding: 0px 10px;
  height: 24px;
  border: 1px solid #333333;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 2px;
  color: #333;
}

.detail-page .coupon-multi-modal .coupon-list .disabled .btn-coupon-get a {
  background: #C6C6C6;
  border-color: #C6C6C6;
  color: #fff;
}

.detail-page .coupon-multi-modal .flex {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.detail-page .coupon-multi-modal .coupon-item {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  color: #0F0A64;
}

.detail-page .coupon-multi-modal .coupon-item > div {
  display: block;
}

.detail-page .coupon-multi-modal .btn-coupon-get a {
  min-width: 172px;
  height: 48px;
}

@media screen and (max-width: 1120px) {
  .detail-page .btn-coupon {
    left: 16px;
  }
}

@media screen and (max-width: 1024px) {
  .detail-page .coupon-modal .flex span,
  .detail-page .coupon-get-modal .flex span,
  .detail-page .coupon-multi-modal .flex span {
    display: block;
  }
  .detail-page .coupon-modal .flex .border,
  .detail-page .coupon-get-modal .flex .border,
  .detail-page .coupon-multi-modal .flex .border {
    height: 16px;
  }
}

@media screen and (max-width: 767px) {
  .detail-page .btn-coupon {
    top: 16px;
  }
  .detail-page .btn-coupon a {
    height: 32px;
  }
  .detail-page .coupon-modal .modal-container,
  .detail-page .coupon-get-modal .modal-container,
  .detail-page .coupon-multi-modal .modal-container {
    height: 100%;
    padding: 20px 16px 20px;
    border-radius: 0;
  }
  .detail-page .coupon-modal .js-modal-close.float,
  .detail-page .coupon-get-modal .js-modal-close.float,
  .detail-page .coupon-multi-modal .js-modal-close.float {
    background-image: url(/stcontents/img/common/icon-close-btn.png);
    width: 32px;
    height: 32px;
  }
  .detail-page .coupon-modal .flex,
  .detail-page .coupon-get-modal .flex,
  .detail-page .coupon-multi-modal .flex {
    display: block;
    color: #757575;
    margin-bottom: 24px;
  }
  .detail-page .coupon-modal .flex > div,
  .detail-page .coupon-get-modal .flex > div,
  .detail-page .coupon-multi-modal .flex > div {
    display: block;
  }
  .detail-page .coupon-modal .flex span,
  .detail-page .coupon-get-modal .flex span,
  .detail-page .coupon-multi-modal .flex span {
    font-size: 1.6rem;
    color: #333;
  }
  .detail-page .coupon-modal .border,
  .detail-page .coupon-get-modal .border,
  .detail-page .coupon-multi-modal .border {
    border-right: unset !important;
  }
  .detail-page .coupon-modal .btn-coupon-get,
  .detail-page .coupon-get-modal .btn-coupon-get,
  .detail-page .coupon-multi-modal .btn-coupon-get {
    position: absolute;
    left: 16px;
    bottom: 40px;
    width: calc(100vw - 32px);
  }
  .detail-page .coupon-get-modal .modal-container .content-body {
    margin-top: 90px;
    padding-bottom: 90px;
  }
  .detail-page .coupon-get-modal .modal-container-inner {
    height: 100%;
  }
  .detail-page .coupon-get-modal .btn-double {
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 16px 16px;
    z-index: 1;
    -webkit-box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0px -2px 8px rgba(0, 0, 0, 0.08);
  }
  .detail-page .coupon-get-modal .btn-double .btn-wide {
    min-width: 0;
  }
  .detail-page .coupon-get-modal .notice-box {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
  .detail-page .coupon-multi-modal {
    text-align: center;
  }
  .detail-page .coupon-multi-modal .modal-container {
    display: block;
    padding: 50px 0 0;
  }
  .detail-page .coupon-multi-modal .coupon-list {
    height: auto;
    padding: 0 0 30px;
    overflow-y: hidden;
  }
  .detail-page .coupon-multi-modal .coupon-list .disabled .icon-disabled {
    height: 20px;
    padding: 0 4px;
    font-size: 1rem;
  }
  .detail-page .coupon-multi-modal .coupon-list .disabled .flex, .detail-page .coupon-multi-modal .coupon-list .disabled span {
    color: #c6c6c6;
  }
  .detail-page .coupon-multi-modal .btn-coupon-get {
    position: relative;
    left: inherit;
    bottom: inherit;
    margin: 24px auto;
  }
  .detail-page .coupon-multi-modal .btn-coupon-get a {
    max-width: 400px;
    width: 100%;
    height: 40px;
    margin: 0 auto;
    font-size: 1.4rem;
  }
}

.detail-page .kv-slider-inner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .detail-page .room-plan .result-hotel .slick-counter {
    display: none !important;
  }
}

.benefits-modal-top .font-xxx-large {
  font-size: 2rem;
}

.sub-diamond .key-visual {
  height: 43rem;
  background: url(/stcontents/img/sub-page/diamond/bg-top-sp.png) no-repeat left top, url(/stcontents/img/sub-page/diamond/bg-bottom-sp.png) no-repeat right bottom;
  background-size: contain;
  background-color: #0F0A64;
}

.sub-diamond .key-visual .inner {
  left: 0;
  top: auto;
  bottom: 0;
  text-align: left;
  -webkit-transform: none;
          transform: none;
  width: 100%;
  padding: 0 16px;
}

.sub-diamond .key-visual h1 {
  margin-bottom: 8px;
  font-size: 2.4rem;
}

.sub-diamond .key-visual h1 img {
  width: 300px;
  height: auto;
}

.sub-diamond .key-visual .h1-bottom-text {
  font-size: 1.6rem;
  text-shadow: none;
  margin-bottom: 16px;
}

.sub-diamond .key-visual .h1-bottom-sns {
  text-align: right;
}

@media (min-width: 768px) {
  .sub-diamond .key-visual {
    background: url(/stcontents/img/sub-page/diamond/bg-top.png) no-repeat left top, url(/stcontents/img/sub-page/diamond/bg-bottom.png) no-repeat right bottom;
    background-size: contain;
    background-color: #0F0A64;
  }
  .sub-diamond .key-visual h1 {
    font-size: 3.6rem;
    line-height: 1.56;
    text-align: center;
    position: relative;
    bottom: 10px;
  }
  .sub-diamond .key-visual h1 img {
    width: 560px;
  }
  .sub-diamond .key-visual .h1-bottom-text {
    margin-bottom: 8px;
    text-align: center;
  }
  .sub-diamond .key-visual .h1-bottom-sns {
    position: relative;
    top: 15px;
  }
}

@media (max-width: 536px) {
  .sub-diamond .key-visual {
    background: url(/stcontents/img/sub-page/diamond/bg-top-sp.png) no-repeat left top, url(/stcontents/img/sub-page/diamond/bg-bottom-sp-min.png) no-repeat right bottom;
    background-size: cover;
    background-color: #0F0A64;
  }
}

.mode-au .key-visual {
  background: url(/stcontents/img/sub-page/keyvisual-smps.jpg) center center no-repeat;
  background-size: cover;
}

.mode-au .benefits-modal-top {
  background-color: #D86036;
}

.mode-au .benefits-modal-box li::before {
  color: #D86036;
}

.mode-hotel .key-visual {
  background: url(/stcontents/img/sub-page/mainvisual-06.jpg) center center no-repeat;
  background-size: cover;
}

.mode-hotel .key-visual:before {
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  content: "";
  width: 100%;
  height: 60%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}

.mode-hotel .key-visual .inner {
  width: 100%;
  text-align: center;
  top: inherit;
  bottom: 107px !important;
  -webkit-transform: none;
          transform: none;
}

.mode-hotel .key-visual .inner .title {
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 8px;
}

.mode-hotel .key-visual .inner .title span {
  height: 64px;
  font-size: 3.4rem;
  text-shadow: 1px 1px 1px #000;
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 100px;
  padding: 0px 20px;
  margin-right: 8px;
}

.mode-hotel .key-visual .inner .title h1 {
  font-size: 5.2rem;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-bottom: 0px;
  line-height: 1.3;
}

.mode-hotel .key-visual .inner h2 {
  text-shadow: 1px 1px 1px #000;
}

@media (max-width: 767px) {
  .mode-hotel .key-visual {
    height: 430px;
  }
  .mode-hotel .key-visual .inner {
    bottom: 72px !important;
    text-align: left;
  }
  .mode-hotel .key-visual .inner .title {
    display: block;
    margin: 0;
  }
  .mode-hotel .key-visual .inner .title span {
    display: block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: 36px;
    margin: 0;
    font-size: 2rem;
    padding: 0 10px;
  }
  .mode-hotel .key-visual .inner .title h1 {
    width: 100%;
    font-size: 2.6rem;
    line-height: 48px;
  }
  .mode-hotel .key-visual .inner h2 {
    font-size: 16px;
    line-height: 2.8rem;
  }
}

.selections-detail .key-visual {
  height: 390px;
  overflow: hidden;
}

.selections-detail .key-visual .kv-bg {
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  max-width: inherit;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.selections-detail .key-visual .inner {
  position: absolute;
  top: 75%;
}

.selections-detail .theme-pagination-wrap {
  position: relative;
}

.selections-detail .theme-pagination-wrap .default-link-black {
  position: absolute;
  left: 16px;
  top: 4px;
}

.selections-detail .theme-pagination {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 300px;
  margin-right: auto;
  margin-left: auto;
}

@media (max-width: 767px) {
  .selections-detail .key-visual {
    height: 375px;
  }
  .selections-detail .key-visual .inner {
    position: absolute;
    top: 62%;
    text-align: left !important;
  }
  .selections-detail .key-visual h1, .selections-detail .key-visual p {
    text-shadow: 1px 1px 1px #000;
  }
  .selections-detail .theme-pagination {
    max-width: 100%;
  }
}

.back-blur-black {
  -webkit-filter: blur(100px);
          filter: blur(100px);
  background-color: #000000;
  height: 147px;
  width: 100%;
  bottom: 0;
  position: absolute;
}

.result-list.mode-select-detail {
  padding-top: 1.6rem;
  padding-left: 1.6rem;
  padding-right: 1.6rem;
}

.result-list.mode-select-detail .hotel-info {
  color: #333333;
  position: static;
  width: 100%;
  padding: 1.6rem;
}

.result-list.mode-select-detail .result-hotel {
  height: auto;
  border-radius: 8px;
}

.result-list.mode-select-detail .result-hotel .hotel-info .name {
  text-shadow: none;
}

.result-list.mode-select-detail .result-hotel .hotel-info .name,
.result-list.mode-select-detail .result-hotel .hotel-info .address {
  flex-shrink: 0;
}
.result-list.mode-select-detail .result-hotel .hotel-info .hotel-grade img {
  filter: none;
}

.select-detail-photo {
  height: 18.4rem;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  position: relative;
}

.select-detail-photo > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.select-detail-photo .float-p {
  margin-bottom: 0;
}

.select-detail-photo .float-p img {
  width: 2rem;
  height: 2rem;
}

.tag-pontapass {
  margin: 0;
  padding: 8px 16px;
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 100px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 16px;
  font-size: 20px;
  font-weight: bold;
  text-shadow: 1px 1px 1px #000000;
}

@media (max-width: 767px) {
  .tag-pontapass {
    padding: 4px 8px;
    font-size: 16px;
    display: block;
    margin: 0 auto;
  }
}

.benefits-h1 {
  background-color: #32315F;
  padding: 1.6rem;
  display: inline-block;
}

.benefits-h1 h1 {
  text-shadow: none;
}

.benefits-h1-bottom {
  padding: .5rem 0 0 1.6rem;
  text-align: right;
}

.benefits-h1-bottom p:last-child {
  text-align: right;
}

@media screen and (max-width: 767px) {
  .benefits-h1-bottom {
    margin-bottom: 16px;
  }
}

.h1-bottom-text {
  text-shadow: 0 0 5px #000;
  margin: 0 auto 13px;
  max-width: 1120px;
}

.h1-bottom-text.long {
  max-width: 980px;
}

.select-detail-head h1 {
  margin: 2.4rem 0 .8rem;
}

.area-number {
  font-size: 1.4rem;
}

.root-sub-list, .root-main-foot {
  background-color: #f5f5f5;
  padding-top: .8rem;
  padding-bottom: 10rem;
}

.frame-sub-list {
  margin: 0 auto;
  padding: 0 1.6rem;
}

.frame-sub-list .sub-box-detail .price-box {
  line-height: 1;
  margin-bottom: 8px;
}

.root-main-foot {
  padding-bottom: 1rem !important;
}

.root-main-foot .bread-crumbs {
  padding: 0;
}

.sub-box {
  background-color: #ffffff;
  -webkit-filter: drop-shadow(0px 3px 4px rgba(0, 0, 0, 0.15));
          filter: drop-shadow(0px 3px 4px rgba(0, 0, 0, 0.15));
  border-radius: .8rem;
  margin-bottom: .8rem;
}

.sub-box figure {
  position: relative;
  height: 18.4rem;
}

.sub-box figure::before {
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  content: "";
  width: 100%;
  height: 50%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}

.sub-box figure .sub-img-photo {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: .8rem .8rem 0 0;
}

@media screen and (min-width: 768px) {
  .sub-box figure {
    height: 160px;
  }
}

.sub-box figure .frame-flex-base {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.sub-box figure .link-coupon:after {
  content: "";
  background: url("../img/common/icon-arrow-right-white-2.svg") no-repeat 0 0;
  background-size: contain;
  position: absolute;
  display: block;
  width: 1.3rem;
  height: 1.8rem;
  right: 1rem;
  top: 0;
  bottom: 0;
  margin: auto;
  -webkit-filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.1));
          filter: drop-shadow(0px 2px 10px rgba(0, 0, 0, 0.1));
}

.frame-card-float {
  position: absolute;
  bottom: .8rem;
  left: 1.6rem;
  padding-right: 3rem;
  margin-bottom: 0;
}

.frame-card-float .icon-grade {
  height: 2rem;
}

.frame-card-float .line-clamp,
.frame-card-float .line-clamp-one {
  color: #ffffff;
  text-shadow: 1px 1px 1px #000000;
}

.frame-card-float > p:last-of-type {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .frame-card-float .icon-grade {
    height: 16px;
    width: auto;
  }
}

.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.float-p {
  position: absolute;
  bottom: .8rem;
  left: 1.6rem;
  color: #ffffff;
  text-shadow: 1px 1px 1px #000000;
  margin-bottom: 0;
}

.sub-box-detail {
  padding: .5rem 1.6rem 1.6rem;
}

.sub-box-detail p {
  margin-top: .5rem;
  margin-bottom: 0;
}

.sub-box-detail .frame-flex-base.button-action {
  margin: 1rem 0 0;
}

.sub-box-detail .frame-flex-base.button-action > div {
  -webkit-flex-basis: calc(100% / 2 - .4rem);
      -ms-flex-preferred-size: calc(100% / 2 - .4rem);
          flex-basis: calc(100% / 2 - .4rem);
}

.coupon-acquired .frame-flex-base {
  color: #bfbfbf;
}

.coupon-acquired .btn-coupon {
  height: 40px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.coupon-acquired .btn-coupon div {
  width: 100%;
  text-align: center;
  font-size: 1.6rem;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  .coupon-acquired .sub-box-detail {
    position: relative;
  }
}

.rooot-benefits-modal .modal-container .contents {
  padding: 0;
}

.rooot-benefits-modal.common-modal .modal-container {
  padding: 0;
}

.rooot-benefits-modal.common-modal .modal-container .content-body {
  margin-top: 0;
}

.benefits-modal-top {
  background-color: #32315F;
  padding: 4rem 1.6rem 1.6rem;
  color: #ffffff;
}

.benefits-modal-main {
  padding: 0;
}

.benefits-modal-main .benefits-modal-box {
  padding-bottom: 1.6rem;
  margin-bottom: 1.6rem;
  border-bottom: solid 1px #c4c4c4;
}

.benefits-modal-main .text-link-gray {
  font-size: 1.4rem;
}

.benefits-modal-box li::before {
  color: #32315F;
}

.modal-container .contents ul.font-x-large > li {
  font-size: 1.6rem;
  margin-bottom: 1rem;
}

.modal-container .contents ul.font-large > li {
  font-size: 1.4rem;
}

.list-check li, .list-attention li {
  padding-left: 1em;
  text-indent: -1em;
}

.list-check li::before, .list-attention li::before {
  content: "■";
}

.list-attention li::before {
  content: "・";
}

.btn-modal-close {
  background: none;
  width: auto;
  height: auto;
  position: absolute;
  left: 2rem !important;
  right: 2rem !important;
  bottom: 2rem;
  text-align: center;
  top: auto;
}

.btn-modal-close a {
  display: block;
}

.frame-coupon-detail:first-of-type {
  margin-bottom: .5rem;
}

.frame-coupon-detail:first-of-type dd {
  -webkit-flex-basis: auto !important;
      -ms-flex-preferred-size: auto !important;
          flex-basis: auto !important;
}

.frame-coupon-detail dt,
.frame-coupon-detail dd {
  -webkit-flex-basis: calc(100% / 2);
      -ms-flex-preferred-size: calc(100% / 2);
          flex-basis: calc(100% / 2);
}

.frame-coupon-detail dt.font-small {
  letter-spacing: 0;
}

.frame-coupon-detail dd {
  text-align: right;
}

.frame-coupon-detail.flex-basic-none dt,
.frame-coupon-detail.flex-basic-none dd {
  -webkit-flex-basis: auto;
      -ms-flex-preferred-size: auto;
          flex-basis: auto;
}

.frame-coupon-detail.flex-basic-none dd:nth-child(n + 2) {
  -webkit-flex-basis: 117px;
      -ms-flex-preferred-size: 117px;
          flex-basis: 117px;
  text-align: left;
}

.button-action.btn-coupon {
  margin: .8rem 0 0;
}

.button-action.btn-coupon a {
  width: 100%;
}

.flex-align {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}

.flex-align .align-place {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.period-limited {
  margin-top: 1.6rem;
}

.period-limited dt.font-large {
  font-size: 1.6rem;
}

.period-limited dd.font-large {
  font-size: 1.4rem;
}

@media (max-width: 767px) {
  .mode-select-detail .h2-small {
    font-size: 2rem;
  }
  .mode-select-detail .address.font-large {
    font-size: 1.2rem;
  }
  .mode-select-detail .result-hotel {
    margin-bottom: .8rem;
  }
  .frame-coupon-detail:first-of-type {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .frame-coupon-detail:first-of-type dt {
    margin-right: 1.6rem;
    font-size: 1.6rem;
  }
  .frame-coupon-detail:first-of-type dd.font-x-large {
    font-size: 2rem;
  }
  .frame-coupon-detail:nth-of-type(n+2) {
    font-size: 1.4rem;
  }
  .frame-coupon-detail:nth-of-type(n+2) .font-small {
    font-size: 1.4rem;
  }
  .select-detail-head .font-large {
    font-size: 1.6rem;
  }
  .mode-au .benefits-h1 h1 {
    font-size: 2rem;
  }
  .mode-au .register {
    display: block !important;
  }
  .rooot-benefits-modal.common-modal .modal-container .content-body {
    padding: 1.6rem;
  }
  .rooot-benefits-modal .js-modal-close {
    background-image: url(/stcontents/img/common/icon-close-2-white.svg);
  }
  .rooot-benefits-modal .js-modal-close.float {
    background-image: url(/stcontents/img/common/icon-close-3.svg);
  }
}

@media (min-width: 768px) {
  .frame-wrap {
    margin: 0 auto;
    max-width: 1120px;
  }
  .rooot-benefits-modal p.font-x-large {
    font-size: 1.4rem;
  }
  .sub-diamond .key-visual,
  .type-page .key-visual {
    height: 40rem;
  }
  .sub-diamond .key-visual .inner,
  .type-page .key-visual .inner {
    bottom: 16px;
    max-width: 1120px;
    margin: auto;
    right: 0;
  }
  .benefits-h1 {
    padding: 1rem 13rem 1rem 0;
    position: relative;
  }
  .benefits-h1::before, .benefits-h1::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
  }
  .benefits-h1::before {
    right: 100%;
    background-color: #32315F;
  }
  .mode-hotel .benefits-h1::before {
    background-color: #0F0A64;
  }
  .mode-au .benefits-h1::before {
    background-color: #D86036;
  }
  .benefits-h1-bottom {
    padding-top: .5rem;
  }
  .benefits-h1-bottom p:last-of-type {
    margin-bottom: 0;
    line-height: 1;
  }
  .frame-sub-list {
    margin: 0 auto;
    max-width: 1120px;
    padding: 0;
  }
  .root-sub-list, .root-main-foot {
    padding: 16px;
    padding-top: 1.6rem;
  }
  .sub-box {
    -webkit-flex-basis: calc(100% / 2 - 1rem);
        -ms-flex-preferred-size: calc(100% / 2 - 1rem);
            flex-basis: calc(100% / 2 - 1rem);
    margin-bottom: 1.6rem;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: 1.6rem;
    -webkit-filter: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.15));
            filter: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.15));
  }
  .frame-card-float {
    bottom: 1rem;
  }
  .benefits-modal-top {
    padding: 4rem 4rem 2rem;
  }
  .rooot-benefits-modal.common-modal .modal-container {
    max-height: 700px;
    position: absolute;
    top: 50%;
    bottom: auto;
    margin: 0;
    height: auto;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
  .rooot-benefits-modal.common-modal .modal-container .content-body {
    max-height: 58vh;
    height: auto;
    margin: 1.6rem 3rem 32px 4rem;
  }
  .sub-box-detail {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: .5rem 1.6rem 1.6rem;
  }
  .sub-box-detail .color-gray-2 {
    margin-top: 0;
  }
  .button-action.btn-coupon {
    margin: 1.6rem 0 0;
  }
  .benefits-h1 {
    padding: 1rem 5rem 1rem 1.6rem;
    position: relative;
    width: 55rem;
  }
  .benefits-h1 h1,
  .benefits-h1 h2 {
    font-size: 3.6rem;
  }
  .benefits-h1::before, .benefits-h1::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
  }
  .benefits-h1::before {
    right: 100%;
    background-color: #32315F;
  }
  .result-list.mode-select-detail {
    padding-top: 1.6rem;
    padding-left: 0;
    padding-right: 0;
  }
  .result-list.mode-select-detail .result-hotel {
    height: 31rem;
  }
  .result-list.mode-select-detail .hotel-info {
    padding: 2.4rem 2.4rem 0;
    height: calc(100% - 2.4rem);
    overflow: hidden;
  }
  .select-detail-photo {
    width: 64rem;
    height: 31rem;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .select-detail-head {
    padding: 0 0 2.4rem;
  }
  .select-detail-head .h1-sp-small {
    font-size: 3.6rem;
  }
  .select-detail-head .select-head-left {
    width: 65%;
    padding-right: 1.6rem;
  }
  .select-detail-head .select-head-img {
    width: 35.2rem;
    height: 26.4rem;
    -webkit-filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.1));
            filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.1));
  }
  .select-detail-head .select-head-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .period-limited dd.font-large {
    font-size: 1.6rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .result-list.mode-select-detail .result-hotel .hotel-info .address + p {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 5;
      overflow: hidden;
  }

  .result-list.mode-select-detail .result-hotel .hotel-info .period-limited + p {
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
  }
}

@media (min-width: 1024px) {
  .root-sub-list .frame-sub-list::after, .root-main-foot .frame-sub-list::after, .root-sub-list .frame-sub-list::before, .root-main-foot .frame-sub-list::before {
    display: block;
    content: "";
    width: 47vw;
  }
  .root-sub-list .frame-sub-list::before, .root-main-foot .frame-sub-list::before {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
  }
  .sub-box {
    -webkit-flex-basis: calc(100% / 3 - 1.6rem);
        -ms-flex-preferred-size: calc(100% / 3 - 1.6rem);
            flex-basis: calc(100% / 3 - 1.6rem);
  }
  .root-sub-list .frame-sub-list::after, .root-main-foot .frame-sub-list::after, .root-sub-list .frame-sub-list::before, .root-main-foot .frame-sub-list::before {
    display: block;
    content: "";
    width: 31.3vw;
  }
  .root-sub-list .frame-sub-list::before, .root-main-foot .frame-sub-list::before {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
  }
}

@media screen and (min-width: 768px) and (max-width: 1120px) {
  .result-list.mode-select-detail .h2-small {
    font-size: 2.4vw;
  }
  .result-list.mode-select-detail .select-detail-photo {
    width: calc(100% - 41.5vw);
  }
  .result-list.mode-select-detail .hotel-info {
    width: 41.5vw;
    height: calc(100% - 2rem);
  }
  .result-list.mode-select-detail .hotel-info .period-limited dd.font-large {
    font-size: 100%;
  }
}

@media (min-width: 1146px) {
  .benefits-h1-bottom {
    padding: .5rem 0 0;
  }
  .benefits-h1 {
    padding: 1rem 5rem 1rem 0;
  }
}

@media (min-width: 1120px) {
  .sub-box {
    -webkit-flex-basis: calc(100% / 4 - 1.6rem);
        -ms-flex-preferred-size: calc(100% / 4 - 1.6rem);
            flex-basis: calc(100% / 4 - 1.6rem);
  }
  .root-sub-list .frame-sub-list::after, .root-main-foot .frame-sub-list::after, .root-sub-list .frame-sub-list::before, .root-main-foot .frame-sub-list::before {
    display: block;
    content: "";
    width: 26.4rem;
  }
  .root-sub-list .frame-sub-list::before, .root-main-foot .frame-sub-list::before {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
  }
  .result-list.mode-select-detail .hotel-info {
    width: 42.5%;
  }
  .result-list.mode-select-detail .h2-small {
    font-size: 2.4rem;
  }
}

.input-name-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.input-name-wrap li {
  width: 47.5%;
}

.input-name-wrap input {
  width: 100%;
}

.au-message-area {
  background: #FFF5EF;
  padding: 16px 0;
}

.au-message-area .wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.au-message-area .text-link {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
}

.cms .sub-box-detail .line-clamp {
  -webkit-line-clamp: 3;
}

.cms .key-visual {
  background: url(/stcontents/img/sub-page/kv-cms.jpg) center center no-repeat;
  background-size: cover !important;
  height: auto !important;
  padding: 80px 0;
}

.cms .key-visual .kv-inner {
  max-height: 90%;
  max-width: 700px;
  width: fit-content;
  height: auto;
  position: relative;
  padding: 24px;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0 auto;
  z-index: 2;
}

.cms .key-visual .kv-inner h2 {
  white-space: pre-wrap;
  line-height: 1.3;
  padding: 0.25em 0;
  text-align: center;
}

.cms .key-visual .kv-inner h2, .cms .key-visual .kv-inner p {
  color: #333;
}

.cms .key-visual .type-ciry-h1-bottom > p {
  white-space: pre-wrap;
}

.cms .key-visual .kv-inner .text-link-bottom {
  margin-top: 8px;
}

/*
  KV改修
*/
.cms .new-kv .sns {
  display: none !important;
}
.cms .new-kv .kv-inner {
  background: none;
  padding: 0;
}
.cms .new-kv .type-ciry-h1 {
  padding: 24px 24px 0;
}
.cms .new-kv .type-ciry-h1 h2 {
  text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
  color: #fff;
}
.cms .new-kv .type-ciry-h1-bottom {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 24px 24px;
}
.cms .kv-note {
  margin-bottom: 0;
  padding-top: 4px;
  font-size: 12px;
  color: #757575 !important;
}

@media (max-width: 767px) {

  .cms .key-visual .kv-inner {
    text-align: left;
    margin: 0 16px;
    padding: 16px;
    -webkit-transform: none;
            transform: none;
  }
  .cms .key-visual .kv-inner h2 {
    font-size: 24px;
  }
  .cms .key-visual .kv-inner .text-link-bottom {
    text-align: right;
  }
  .cms .frame-card-float .line-clamp-one {
    display: none;
  }
  .cms .new-kv {
    height: 240px !important;
    padding-bottom: 0;
  }
  .cms .new-kv .kv-inner {
    position: absolute;
    max-width: none;
    width: 100%;
    bottom: 0;
    left: 0;
    margin: 0;
    padding-bottom: 8px;
    text-align: center;
  }
  .cms .new-kv .type-ciry-h1 {
    padding: 0;
  }
  .cms .new-kv .type-ciry-h1 h2 {
    margin-bottom: 0 !important;
  }
  .cms .new-kv + .type-ciry-h1-bottom {
    background: #f5f5f5;
    margin: 16px 16px;
    padding: 16px 16px;
  }
  .cms .new-kv + .type-ciry-h1-bottom p {
    white-space: pre-wrap;
  }
}

.campaign-package {
  /* エントリー完了画面 */
}

.campaign-package h2 {
  margin-bottom: 24px;
}

.campaign-package .key-visual {
  background: url(/stcontents/img/sub-page/campaign-package/pc-key-photo.jpg) bottom !important;
  background-size: cover !important;
  /*background-attachment: fixed !important;*/
  height: 500px !important;
}

.campaign-package .key-visual h1 {
  text-shadow: 1px 1px 1px #000;
}

.campaign-package .key-visual-2 {
  background: url(/stcontents/img/sub-page/campaign-package/pc-key-photo-2.jpg) bottom !important;
  background-size: cover !important;
}

.campaign-package .campaign-logo img {
  width: 250px;
  margin: 0 auto;
}

.campaign-package .type-ciry-h1 p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  border: 2px solid #fff;
  padding: 0 8px;
  margin: 0 auto 8px;
  border-radius: 4px;
  -webkit-filter: drop-shadow(1px 1px 1px #000);
          filter: drop-shadow(1px 1px 1px #000);
}

.campaign-package .type-ciry-h1-blue p {
  -webkit-filter: none;
          filter: none;
  margin: 0 auto 8px !important;
  color: #0F0A64;
  border-color: #0F0A64;
}

.campaign-package .type-ciry-h1-bottom p {
  font-size: 2.4rem;
  text-shadow: 1px 1px 1px #000;
}

.campaign-package .type-ciry-h1-bottom .entry {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.campaign-package .type-ciry-h1-bottom .entry span {
  margin-right: 16px;
  line-height: 16px;
  -webkit-filter: drop-shadow(1px 1px 1px #000);
          filter: drop-shadow(1px 1px 1px #000);
}

.campaign-package .type-ciry-h1-bottom .entry p {
  margin-bottom: 0;
}

.campaign-package .entry-flow {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.campaign-package .entry-flow img {
  margin: 0 32px;
}

.campaign-package .flow-contents img {
  margin: 0 0 16px 0 !important;
  height: 57px;
}

.bnr-easy-flow-img-wrap img {
  vertical-align: top;
}

.campaign-package .bnr-easy-flow .note {
  text-align: left;
  font-size: 1.4rem;
  color: #757575;
  margin-top: 8px;
  margin-bottom: 24px;
}

.campaign-package .bnr-easy-flow .note li {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 400;
  font-size: 1.2rem;
  line-height: 18px;
  color: #757575;
  padding-left: 1em;
  text-indent: -1em;
}

.campaign-package .bnr-easy-flow .note li::before {
  content: "※";
}

.campaign-package .coupon {
  width: 100%;
  background: url(/stcontents/img/sub-page/campaign-package/pc-coupon-bg.jpg) 50% 50% no-repeat;
  background-size: cover;
  padding: 40px 0;
  /*background-attachment: fixed;*/
  position: relative;
}

.campaign-package .coupon::before {
  content: "";
  background-color: rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.campaign-package .coupon p {
  font-size: 1.6rem;
}

.campaign-package .coupon .coupon-contents {
  width: calc(100% - 32px);
  max-width: 600px;
  background-color: rgba(255, 255, 255, 0.9);
  padding: 24px 40px;
  color: #000;
  position: inherit;
  z-index: 2;
}

.campaign-package .coupon .coupon-contents .coupon-text {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  align-items: center;
  justify-content: center;
  width: auto;
}

.campaign-package .coupon .coupon-contents .coupon-text div {
  line-height: 64px;
}

.campaign-package .coupon .coupon-contents .coupon-text .title {
  margin-bottom: 8px;
  font-size: 22px;
  width: 25%;
  width: auto;
  min-width: 25%;
  text-align: right;
  margin-right: 16px;
}

.campaign-package .coupon .coupon-contents .coupon-text .detail {
  margin-bottom: 8px;
  font-size: 30px;
  text-align: left;
  font-weight: bold;
  width: auto;
  min-width: 50%;
}

.campaign-package .coupon .coupon-contents .coupon-text :only-child {
  margin-bottom: 24px;
  font-size: 36px;
  text-align: center;
  width: 100%;
  font-weight: bold;
}

.campaign-package .coupon .date {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.campaign-package .coupon .date div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 3rem;
}

.campaign-package .coupon .date div p {
  font-size: 2rem;
  font-weight: bold;
  margin-bottom: 0;
}

.campaign-package .coupon .date div span {
  font-size: 1.6rem;
  font-weight: normal;
  padding-right: 8px;
  margin-right: 0;
  line-height: 24px;
}

.campaign-package .coupon .date .reservation {
  border-right: 1px solid #333;
}

.campaign-package .coupon .date .reservation p {
  margin-right: 16px;
}

.campaign-package .coupon .date .checkout span {
  margin-left: 16px;
}

.campaign-package .coupon .list-attention li {
  margin-left: 1em;
  list-style-type: none;
  text-indent: -1em;
}

.campaign-package .coupon .list-attention li::before {
  display: inline;
  content: "・";
}

.campaign-package .col2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.campaign-package .hotel-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  border: 1px solid #f5f5f5;
  width: calc(50% - 16px);
  height: 152px;
  margin-bottom: 16px;
}
.campaign-package .hotel-list a {
  width: 100%;
  display: flex;
  color: inherit;
}
.campaign-package .hotel-list a:hover {
  opacity: 0.7;
}
.campaign-package .hotel-list a.disabled {
  pointer-events: none;
}
.campaign-package .hotel-list .photo img {
  width: 192px;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.campaign-package .hotel-list .text {
  text-align: left;
  padding: 16px;
}

.campaign-package .hotel-list .text p {
  margin-bottom: 0 !important;
}

.campaign-package .hotel-list .text .grade {
  line-height: 0;
}

.campaign-package .hotel-list .text .grade img {
  height: 20px;
  margin-right: 4px;
}

.campaign-package .hotel-list .text .area {
  font-size: 1.2rem;
  color: #757575;
}

@media screen and (max-width: 1120px) {
  .campaign-package .hotel-list a {
    height: 100%;
    display: block;
  }
}

.campaign-package .text-low {
  width: 436px;
  margin-right: 16px;
  vertical-align: middle;
}

.campaign-package .low-contents {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.campaign-package .entry-btn .btn-block a {
  width: 300px;
  max-width: unset;
}

.campaign-package .key-visual-complete {
  background: url(/stcontents/img/sub-page/campaign-package/pc-key-photo.jpg) bottom !important;
  background-size: cover !important;
  /*background-attachment: fixed !important;*/
  overflow: visible;
  height: 500px !important;
  position: relative;
}

.campaign-package .inner-box {
  width: 100%;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.campaign-package .result-coupon {
  display: inline-block;
  min-width: 600px;
  max-width: 100%;
  padding: 24px 40px;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0 auto;
  color: #000;
}

.campaign-package .result-coupon .offcoupon-text-1 {
  line-height: 64px;
}

.campaign-package .result-coupon .offcoupon-text-2 {
  line-height: 44px;
}

.campaign-package .result-coupon .date {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 20px;
  font-size: 0;
  color: #333333;
}

.campaign-package .result-coupon .date div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.campaign-package .result-coupon .date div p {
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 0;
}

.campaign-package .result-coupon .date div span {
  font-size: 1.6rem;
  font-weight: normal;
  margin-right: 8px;
  flex-shrink: 0;
}

.campaign-package .result-coupon .date .checkout {
  font-size: 0;
}

.campaign-package .result-coupon .date .checkout span {
  margin-left: 16px;
}

.campaign-package .result-coupon .coupon-code {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 8px auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #f5f5f5;
  padding: 8px;
}

.campaign-package .result-coupon .coupon-code .clip-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  color: inherit;
}

.campaign-package .result-coupon .coupon-code .clip-btn > span {
  text-decoration: underline;
}

.campaign-package .result-coupon .coupon-code .clip-btn > img {
  display: block;
  width: 24px;
  height: 24px;
}

.campaign-package .result-coupon .coupon-code .clip-btn:hover span {
  text-decoration: none;
}

.campaign-package .result-coupon .coupon-code .clip-btn.clicked {
  color: #757575;
}

.campaign-package .result-coupon .coupon-code .clip-btn.clicked span {
  text-decoration: none;
}

.campaigns .anime-box {
  width: 560px !important;
  height: 300px;
  position: relative;
  margin: 0 auto;
  transform: translateY(-22%) !important;
  z-index: 1;
}
.campaigns .anime-box .result-coupon {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-1.png) no-repeat center center;
  background-size: contain;
  width: 550px;
  height: 278px;
  padding: 64px 12px 0;
}
.campaigns .anime-box .anime-parts-1 {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-4.png) no-repeat center center;
  background-size: contain;
  width: 560px;
  height: 189px;
  position: absolute;
  top: 19px;
  left: 0;
  z-index: 2;
  animation: 0.3s 1.5s fadeout-anime forwards;
}
.campaigns .anime-box .anime-parts-2 {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-3.png) no-repeat center center;
  background-size: contain;
  width: 560px;
  height: 270px;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  animation: 0.3s 3s fadeout-anime forwards;
}
.campaigns .anime-box .anime-parts-3 {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-2.png) no-repeat center center;
  background-size: contain;
  width: 560px;
  height: 414px;
  position: absolute;
  top: -138px;
  left: 0;
  z-index: -1;
  opacity: 0;
  animation: 2s 1.5s fadein-out-anime forwards;
}
.campaigns .anime-box .anime-parts-4 {
  animation: 1.5s 1.5s letter-anime ease-in-out forwards;
  position: relative;
  margin-left: -10px;
}
.campaigns .anime-box .anime-parts-4.kv-sf {
  animation: none;
}
.campaigns .anime-box .anime-parts-4.kv-sf .letter-box.kv-special-feature {
  position: absolute;
  top: 50% !important;
  bottom: inherit !important;
  left: 50%;
  transform: translate(-50%, -35%) scale(1) !important;
}
.campaigns .anime-box .icon-anime-ponta {
  background: url(/stcontents/img/sub-page/campaigns/icon-ponta-anime.png) no-repeat center center;
  background-size: contain;
  width: 150px;
  height: 150px;
  position: absolute;
  bottom: -30px;
  right: -110px;
  z-index: 3;
  opacity: 0;
  animation: 0.4s 3.2s fadein-anime forwards;
}

.particles-js-canvas-el {
  position: absolute;
  top: 0;
  left: 0;
}

@keyframes fadein-anime {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadein-out-anime {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeout-anime {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes letter-anime {
    0% {
    }
    50% {
      transform:translateY(-220px);
    }
    70% {
      z-index: 2;
    }
    100% {
      transform:translateY(-20px) scale(1.35);
      z-index: 2;
    }
}

@media (min-width: 768px) {
  .campaign-package .result-coupon .date .border {
    border-right: 2px solid #C6C6C6;
    height: 24px;
    margin-left: 18px;
  }
}

@media screen and (max-width: 1023px){
  .campaigns .anime-box .icon-anime-ponta {
    width: 120px;
    height: 120px;
    bottom: -30px;
    right: -20px;
  }
}

@media screen and (max-width: 767px){
  .campaign-package .result-coupon .offcoupon-text-1 {
    font-size: 2.6rem;
    line-height: 36px;
  }
  .campaign-package .result-coupon .offcoupon-text-2 {
    font-size: 2rem;
    line-height: 36px;
  }
  .campaigns .anime-box {
    max-width: 358px;
    width: 100% !important;
    height: auto;
    top: 34% !important;
  }
  .campaigns .anime-box .result-coupon {
      background: url(/stcontents/img/sub-page/campaigns/anime-parts-1-sp.png) no-repeat center center;
      background-size: contain;
      width: 262px;
      height: 214px;
      padding: 35px 16px 0;
      line-height: 1.6;
      letter-spacing: 0;
  }
  .campaigns .anime-box .icon-anime-ponta {
    width: 160px;
    height: 140px;
    bottom: -118px;
    right: 20%;
  }
  .campaigns .anime-box .anime-parts-1 {
    width: 358px;
    height: 110px;
    top: -2px;
    left: 2px;
  }
  .campaigns .anime-box .anime-parts-2 {
    width: 358px;
    height: 159px;
    bottom: 32px;
    left: 2px;
    transform: scale(1, 1.27);
  }
  .campaigns .anime-box .anime-parts-3 {
    width: 336px;
    height: 270px;
    top: -112px;
    left: 13px;
  }
  .campaigns .anime-box .anime-parts-4 {
    margin-left: 0;
  }
  .campaigns .anime-box .anime-parts-4.kv-sf {
    left: 50%;
    transform: translate(-50%, -17%) scale(1) !important;
  }
}
@media screen and (max-width: 360px) {
  .campaigns.template .key-visual-complete .inner-box {
    transform: scale(0.8) !important;
  }
  .campaigns .anime-box .anime-parts-1 {
    top: -2px;
    left: -21px;
  }
  .campaigns .anime-box .anime-parts-2 {
    bottom: 31px;
    left: -21px;
  }
  .campaigns .anime-box .anime-parts-3 {
    top: -110px;
    left: -10px;
  }
}

.campaigns .roulette-wrap .roulette-box {
  text-align: center;
  position: relative;
  z-index: 2;
}
.campaigns .roulette-wrap .roulette-box .roulette-img {
  width: 411px;
  height: auto;
  margin: 30px auto;
}
.campaigns .roulette-wrap .roulette-box .figure {
  position: relative;
  padding-top: 60px;
  z-index: 2;
}
.campaigns .roulette-wrap .roulette-box .roulette-pin {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%,100%);
  width: 44px;
}
.campaigns .roulette-wrap .kv-shadow {
  position: relative;
}
.campaigns .roulette-wrap .letter-box {
  position: absolute;
  top: inherit !important;
  bottom: 130px !important;
  left: 50%;
  opacity: 0;
  transition: all 0.5s;
  transform: translate(-50%, 40px) scale(1.33) !important;
  padding: 0 !important;
  margin-bottom: -100px;
}
.campaigns .roulette-wrap .letter-box.kv-special-feature {
  top: 50% !important;
  bottom: inherit !important;
  left: 50%;
  transform: translate(-50%, -50%) scale(1) !important;
}
.campaigns .roulette-wrap .letter-box.active {
  margin-bottom: 0 !important;
}
.campaigns .roulette-wrap .per3 .roulette-img{
  animation: roulette3 3s 0.5s ease-in-out forwards;
}
.campaigns .roulette-wrap .per5 .roulette-img{
  animation: roulette5 3s 0.5s ease-in-out forwards;
}
.campaigns .roulette-wrap .per10 .roulette-img{
  animation: roulette10 3s 0.5s ease-in-out forwards;
}
.campaigns .roulette-wrap .per15 .roulette-img{
  animation: roulette15 3s 0.5s ease-in-out forwards;
}
.campaigns .roulette-wrap .per20 .roulette-img{
  animation: roulette20 3s 0.5s ease-in-out forwards;
}
.campaigns .roulette-wrap .per30 .roulette-img{
  animation: roulette30 3s 0.5s ease-in-out forwards;
}
@keyframes roulette3 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(5790deg);
  }
}
@keyframes roulette5 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(5850deg);
  }
}
@keyframes roulette10 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(5910deg);
  }
}
@keyframes roulette15 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(5970deg);
  }
}
@keyframes roulette20 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(6030deg);
  }
}
@keyframes roulette30 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(6090deg);
  }
}

.campaign-package .app-banner {
  background: url(/stcontents/img/common/app_bg_image.jpg) no-repeat center center;
  color: #fff;
  background-size: cover;
}

.campaign-package .app-banner .title {
  text-shadow: 1px 1px 1px #000;
}

@media screen and (min-width: 768px) and (max-width: 1120px) {
  .campaign-package .carousel {
    overflow-x: scroll;
  }
  .campaign-package .sub-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-left: 16px;
  }
  .campaign-package .hotel-list {
    height: 308px;
    width: 280px;
    display: block;
    margin-right: 16px;
    background-color: #fff;
  }
  .campaign-package .hotel-list .photo {
    height: 140px;
    width: 100%;
  }
  .campaign-package .hotel-list .photo img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .campaign-package .hotel-list .text {
    padding: 8px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .campaign-package .float-bar {
    height: 87px;
    padding: 8px 16px;
  }
  .campaign-package .float-bar .sp-only {
    margin: 0 auto 8px;
  }
  .campaign-package .entry-btn {
    height: auto;
  }
}

@media (max-width: 767px) {
  .campaign-package {
    /* エントリー完了画面 */
  }
  .campaign-package h2 {
    margin-bottom: 16px;
  }
  .campaign-package .root-sub-list h2, .campaign-package .root-main-foot h2 {
    text-align: left;
  }
  .campaign-package .key-visual {
    height: 400px !important;
  }
  .campaign-package .key-visual::before {
    height: 232px !important;
  }
  .campaign-package .key-visual-complete {
    height: auto !important;
  }
  .campaign-package .result-coupon {
    max-width: initial;
    min-width: 0;
    padding: 16px 24px;
  }
  .campaign-package .result-coupon {
    max-width: initial;
    min-width: 0;
    width: 100%;
    padding: 16px 24px;
  }
  .campaign-package .type-ciry-h1 p {
    margin: 0 0 8px;
  }
  .campaign-package .type-ciry-h1-bottom p {
    font-size: 1.6rem;
  }
  .campaign-package .type-ciry-h1-bottom .entry span {
    margin-right: 8px;
    padding-right: 8px;
  }
  .campaign-package .entry-flow {
    display: block;
  }
  .campaign-package .entry-flow span {
    margin-bottom: 0;
  }
  .campaign-package .entry-flow p {
    margin-bottom: 0;
  }
  .campaign-package .entry-flow img {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    margin: 16px;
  }
  .campaign-package .entry-flow .flow-contents img {
    -webkit-transform: unset;
            transform: unset;
    margin-bottom: 8px !important;
    height: 48px;
  }
  .campaign-package .coupon {
    padding: 24px 16px;
  }
  .campaign-package .coupon p {
    font-size: 1.4rem;
  }
  .campaign-package .coupon .coupon-contents {
    width: auto;
    padding: 16px;
  }
  .campaign-package .coupon .coupon-contents p {
    font-size: 2.4rem;
    margin-bottom: 24px;
  }
  .campaign-package .coupon .coupon-contents p:first-child {
    font-size: 2.6rem;
  }
  .campaign-package .coupon .coupon-contents span {
    font-size: 1.6rem;
    margin-right: 24px;
  }
  .campaign-package .coupon .coupon-contents .coupon-text {
    justify-content: flex-start;
    width: auto;
  }
  .campaign-package .coupon .coupon-contents .coupon-text div {
    line-height: 44px;
  }
  .campaign-package .coupon .coupon-contents .coupon-text .title {
    margin-bottom: 4px;
    font-size: 16px;
    width: auto;
    min-width: 36%;
    text-align: right;
    margin-right: 24px;
  }
  .campaign-package .coupon .coupon-contents .coupon-text .detail {
    margin-bottom: 4px;
    font-size: 24px;
    width: auto;
  }
  .campaign-package .coupon .coupon-contents .coupon-text :only-child {
    margin: 0 auto 24px;
    font-size: 24px;
  }
  .campaign-package .coupon .date {
    display: block;
    margin-bottom: 0;
  }
  .campaign-package .coupon .date div {
    display: block;
  }
  .campaign-package .coupon .date div p {
    font-size: 1.6rem;
    margin: 0;
  }
  .campaign-package .coupon .date div span {
    font-size: 1.2rem;
    margin: 0;
    border-right: none;
    padding-right: 0;
  }
  .campaign-package .coupon .date .reservation {
    padding-right: 0;
    border-right: none;
    height: auto;
  }
  .campaign-package .coupon .date .reservation p {
    margin: 0;
  }
  .campaign-package .coupon .date .checkout {
    padding-left: 0;
    height: auto;
  }
  .campaign-package .coupon .date .checkout span {
    margin: 0;
  }
  .campaign-package .coupon .date .border {
    border-bottom: 1px solid #333;
    width: 60px;
    margin: 8px auto;
    height: 1px;
  }
  .campaign-package .entry-btn .btn-block a {
    width: 100%;
    margin: 0;
  }
  .campaign-package .inner-box {
    padding: 60px 16px 24px;
    -webkit-transform: translateY(0);
            transform: translateY(0);
    top: unset;
  }
  .campaign-package .key-visual-complete .inner-box {
    padding: 73px 16px 20px;
  }
  .campaign-package .result-coupon .date {
    height: auto;
    display: block;
  }
  .campaign-package .result-coupon .date .reservation {
    padding-right: 0;
    border-right: none;
  }
  .campaign-package .result-coupon .date .checkout {
    padding-left: 0px;
  }
  .campaign-package .result-coupon .date .checkout span {
    margin: 0;
  }
  .campaign-package .result-coupon .date .border {
    border-bottom: 1px solid #333;
    width: 60px;
    margin: 8px auto;
  }
  .campaign-package .result-coupon .date div {
    display: block;
  }
  .campaign-package .result-coupon .date div span {
    font-size: 1.4rem;
    margin: 0;
  }
  .campaign-package .carousel {
    overflow-x: scroll;
  }
  .campaign-package .sub-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-left: 16px;
  }
  .campaign-package .hotel-list {
    height: 300px;
    width: 280px;
    display: block;
    margin-right: 16px;
    background-color: #fff;
  }
  .campaign-package .hotel-list .photo {
    height: 140px;
    width: 100%;
  }
  .campaign-package .hotel-list .photo img {
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .campaign-package .hotel-list .text {
    padding: 8px;
  }
  .campaign-package .app-banner {
    background-size: cover;
  }
}

.campaign-finish .key-visual {
  height: 100vh !important;
}

.campaign-finish .key-visual .blur {
  background-color: rgba(0, 0, 0, 0.1) !important;
  -webkit-filter: blur(200px);
          filter: blur(200px);
}

.campaign-finish .key-visual .shadow {
  background-color: black;
  position: absolute;
  width: 100%;
  height: 175px;
  left: 0;
  top: 325px;
  -webkit-filter: blur(200px);
          filter: blur(200px);
}

.campaign-finish .comment {
  text-shadow: 0 0 5px #000;
  margin-bottom: 40px;
}

.campaign-finish .back-to-top {
  width: 300px;
}

@media (max-width: 767px) {
  .campaign-finish .back-to-top {
    width: 100%;
  }
}

.coupon-complete .btn-col-2 {
  margin-top: 40px;
}

.coupon-complete .btn-col-2 a {
  width: 176px;
}

@media (max-width: 767px) {
  .coupon-complete .btn-col-2 {
    margin-top: 24px;
  }
  .coupon-complete .btn-col-2 a {
    width: calc(50% - 4px);
  }
  .coupon-complete .btn-col-2 a:first-child {
    margin-right: 8px;
  }
}

.gray-modal {
  background: rgba(0, 0, 0, 0.60);
  width: 100%;
  height: 100%;
}
.gray-modal .modal-container {
  background: none;
}
.gray-modal .contents-center {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.float-login-box {
  position: relative;
  padding: 32px 16px;
  border-radius: 8px;
}
.float-login-box .btn-block {
  display: flex;
  justify-content: center;
}
.float-login-box .btn-block a {
  flex-wrap: wrap;
  font-size: 14px;
}
.float-login-box .btn-block a span {
  display: block;
  width: 100%;
  font-size: 10px;
  transform: scale(0.85);
  transform-origin: bottom;
  margin-bottom: -6px;
  font-weight: normal;
  line-height: 1.5;
}
.float-login-box .btn-block a strong {
  font-weight: bold;
}
@media screen and (min-width: 768px){
  .float-login-box .btn-block a {
    height: auto;
    font-size: 16px;
  }
  .float-login-box .btn-block a span {
    margin-top: 5px;
    margin-bottom: -10px;
  }
}
@media acreen and (max-width: 360px){
  .float-login-box .btn-block a {
    font-size: 13px;
  }
}

.sns-share {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 12px 0;
}

.sns-share > a {
  width: 32px;
  height: 32px;
}

.sns-share > a + a {
  margin-left: 12px;
}

.sns-share > a > img {
  width: 100%;
  height: 100%;
}

.sns-share > a + a {
  margin-left: 12px;
}

.sub-page .relux-induction {
  display: block;
  position: absolute;
  bottom: 24px;
  left: 16px;
  width: 100%;
  width: calc(100% - 32px);
}

.sub-page .relux-induction a {
  width: 100%;
}

.sub-page .relux-induction:hover {
  color: #554B98 !important;
}

.sub-page .relux-induction:hover::after {
  opacity: .7;
}

.sub-page .feature .feature-img {
  background-image: url("/stcontents/img/sub-page/t/bg-feature.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.sub-page .feature .feature-content {
  padding-left: 56px;
  position: relative;
}

.sub-page .feature .feature-content::before {
  position: absolute;
  top: -2px;
  left: 0;
  content: url("/stcontents/img/sub-page/t/headline-01.svg");
}

.sub-page .feature .feature-content:nth-of-type(2)::before {
  content: url("/stcontents/img/sub-page/t/headline-02.svg");
}

.sub-page .feature .feature-content:nth-of-type(3)::before {
  content: url("/stcontents/img/sub-page/t/headline-03.svg");
}

.sub-page .feature .feature-content p {
  text-align: left;
  font-size: 1.4rem;
}

.sub-page .heading {
  font-size: 2.4rem;
  padding-bottom: 8px;
  position: relative;
  text-align: center;
  margin-bottom: 24px;
}

.sub-page .heading::before {
  content: '';
  display: block;
  height: 1px;
  width: 40px;
  background-color: #FF503E;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}



@media (min-width: 768px) {
  .sub-page .feature .feature-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 0 auto;
    max-width: 926px;
  }
  .sub-page .feature .feature-img {
    width: 40%;
  }
  .sub-page .feature .feature-content-wrap {
    padding-left: 56px;
    width: 60%;
  }
  .sub-page .feature .feature-content {
    padding-left: 56px;
  }
}

@media (max-width: 767px) {
  .sub-page .feature .bg-parallax {
    background-image: url("/stcontents/img/sub-page/t/bg-feature.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: calc(100% + 32px);
    margin: 0 -16px;
    min-height: 200px;
  }
  .sub-page .feature .feature-content-wrap {
    margin-top: 32px;
  }
  .sub-page .feature .feature-content h3 {
    font-weight: 900;
  }
}


.key-visual .sns a:hover {
  opacity: 0.7;
}

.type-page main > section {
  padding: 24px 0;
}

.type-page main h3 {
  margin-bottom: 16px;
  padding-top: 8px;
}

.type-page .bread-crumbs {
  padding-top: 60px;
}

.type-page .key-visual {
  height: 460px;
  background: url(/stcontents/img/sub-page/mv-type.jpg) center center no-repeat;
  background-size: cover;
  overflow: visible;
}

.type-page .key-visual h1 {
  margin-bottom: 8px;
}

.type-page .key-visual::before {
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  content: "";
  width: 100%;
  height: 60%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}

.type-page .campaign-package .key-visual-complete::before {
  background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
  opacity: 0.8;
  transform: rotate(-180deg);
  height: 50%;
}

.type-page .key-visual .sns {
  width: 100%;
  position: absolute;
  bottom: 16px;
  left: 0;
  text-align: right;
  line-height: 1;
  z-index: 2;
}

.type-page .key-visual + section {
  padding-top: 24px;
}

.type-page .searchBoxArea {
  top: inherit;
  bottom: 48px;
}

.type-page .area-section h2 {
  margin-bottom: 16px;
}

.type-page .recommend {
  background: #F5F5F5;
  padding-bottom: 8px;
}

.type-page .frame-sub-list {
  margin-bottom: 8px;
}

.type-page .root-sub-list, .type-page .root-main-foot {
  padding: 0;
}

.type-page .other-type {
  padding-bottom: 0;
}

.type-page .other-type h2 {
  margin-bottom: 14px;
}

.type-page .year-ranking h2 {
  margin-bottom: 14px;
}

@media (min-width: 768px) {
  .type-page main > section {
    padding: 40px 0;
  }
  .type-page .bread-crumbs {
    padding-top: 160px;
  }
}

@media (max-width: 1023px) {
  .type-page .searchBoxArea {
    bottom: 64px;
  }
}

@media (max-width: 767px) {
  .type-page main h3 {
    margin-bottom: 8px;
  }
  .type-page .key-visual {
    height: 525px;
  }
  .type-page .key-visual .inner {
    top: inherit;
    bottom: 0;
    -webkit-transform: none;
            transform: none;
    padding-bottom: 144px;
    text-align: left;
  }
  .type-page .campaign-package .key-visual .inner.sp-text-left {
    text-align: left !important;
  }
  .type-page .searchBoxArea {
    bottom: 74px;
  }
}

/*
  シティエリア
*/
.type-city .key-visual {
  background: url(/stcontents/img/sub-page/kv-city.jpg) center center no-repeat;
  background-size: cover;
}

.col4-article ul .area-1 {
  background-image: url(/stcontents/img/sub-page/city-area-1.png);
  background-size: cover;
}

.col4-article ul .area-2 {
  background-image: url(/stcontents/img/sub-page/city-area-2.png);
  background-size: cover;
}

.col4-article ul .area-3 {
  background-image: url(/stcontents/img/sub-page/city-area-3.png);
  background-size: cover;
}

.col4-article ul .area-4 {
  background-image: url(/stcontents/img/sub-page/city-area-4.png);
  background-size: cover;
}

.col4-article ul .area-5 {
  background-image: url(/stcontents/img/sub-page/city-area-5.png);
  background-size: cover;
}

/*
  お子さま歓迎
*/
.type-kids main h2 {
  margin-bottom: -4px;
}

.type-kids main h3 {
  line-height: 1.5;
}

.type-kids .key-visual {
  background: url(/stcontents/img/sub-page/kv-kids.jpg) center center no-repeat;
  background-size: cover;
  height: 400px;
}

.type-kids .key-visual .inner {
  top: 65%;
}

.type-kids .spot {
  padding-top: 24px;
}

.type-kids .spot h3 {
  margin-bottom: 8px;
  padding-top: 16px;
}

.type-kids .spot h3 span {
  margin-left: 6px;
  font-weight: normal;
  font-size: 1.6rem;
  color: #757575;
}

.type-kids .recommend {
  padding-bottom: 28px;
}

.type-kids .recommend h3 {
  margin-bottom: 28px;
  padding-top: 12px;
}

.type-kids .recommend .sub-box {
  margin-bottom: 6px;
}

.type-kids .goods h2 {
  margin-bottom: 6px;
}

@media (max-width: 767px) {
  .type-kids .spot h3 {
    font-size: 2rem;
  }
  .type-kids .recommend h3 {
    margin-bottom: 12px;
  }
  .type-kids .key-visual {
    height: 375px;
  }
  .type-kids .key-visual .inner {
    top: 46%;
  }
}

@media (min-width: 768px) {
  .type-kids .spot .root-sub-list, .type-kids .spot .root-main-foot {
    padding-bottom: 32px;
    margin: 0 auto 24px;
    border-bottom: 4px solid #F5F5F5;
    max-width: 1120px;
  }
  .type-kids .spot .root-sub-list:last-child, .type-kids .spot .root-main-foot:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
  }
}

/*
  温泉
*/
.feature-onsen .key-visual {
  background: url(/stcontents/img/feature/kv-onsen.jpg) center center no-repeat;
  background-size: cover;
  height: 400px;
}

.feature-onsen .key-visual .inner {
  top: 67%;
}

@media (max-width: 767px) {
  .feature-onsen .key-visual {
    height: 375px;
  }
  .feature-onsen .key-visual .inner {
    top: 46%;
  }
}

/*
  露天風呂特集
*/
.feature-roten .key-visual {
  background: url(/stcontents/img/feature/kv-roten.jpg) center center no-repeat;
  background-size: cover;
}

.feature-roten .key-visual .inner {
  top: inherit;
  bottom: 26px;
  -webkit-transform: none;
          transform: none;
  padding-bottom: 0;
}

@media (max-width: 1023px) {
  .feature-roten .key-visual .inner {
    bottom: 48px;
  }
}

@media (max-width: 767px) {
  .feature-roten .key-visual {
    height: 460px;
  }
  .feature-roten .key-visual .inner {
    bottom: 56px;
  }
}

/*
  USJ、TDL、ハウステンボス特集
*/
.feature-page .key-visual {
  height: 400px;
}

.feature-page .hotel-info-list {
  padding-top: 0;
}

.feature-tdr .flex-align .align-place,
.feature-usj .flex-align .align-place,
.feature-huistenbosch .flex-align .align-place {
  white-space: normal;
}
.feature-tdr .feature-hotel-list .sub-box-detail .line-clamp-one,
.feature-usj .feature-hotel-list .sub-box-detail .line-clamp-one,
.feature-huistenbosch .feature-hotel-list .sub-box-detail .line-clamp-one {
  display: -webkit-box;
}
.feature-usj .key-visual {
  background: url(/stcontents/img/feature/kv-usj.jpg) center center no-repeat;
  background-size: cover;
}

.feature-tdr .key-visual {
  background: url(/stcontents/img/feature/kv-tdr.jpg) center center no-repeat;
  background-size: cover;
}

.feature-huistenbosch .key-visual {
  background: url(/stcontents/img/feature/kv-huistenbosch.jpg) center center no-repeat;
  background-size: cover;
}

.mb-h2 {
  margin-bottom: 16px;
}

.pb-section {
  padding-bottom: 40px;
}

.type-page .search-section .bg-gray {
  padding-bottom: 40px;
}

.type-page .access-list {
  margin-bottom: 40px;
}

@media (min-width: 768px) {
  .type-page .key-visual .inner.bottom {
    top: inherit;
    bottom: 44px;
    max-width: 1120px;
    margin: auto;
    -webkit-transform: none;
            transform: none;
    left: 0;
    right: 0;
  }
  .type-page .campaign-package .key-visual .inner.bottom {
    bottom: 40px;
  }
  .type-page .key-visual .inner.bottom h1 {
    margin-bottom: 20px;
  }
  .type-page .campaign-package .key-visual .inner.bottom h1 {
    margin-bottom: 8px;
  }
}

@media (max-width: 767px) {
  .result-hotel.new-style {
    border-bottom: 1px solid #c6c6c6;
  }
  .hotel-info-list .result-hotel .point-price-box .price {
    margin-bottom: 4px
  }
  .feature-page .key-visual {
    height: 525px;
  }
  .feature-page .result-hotel {
    border-radius: 8px;
  }
  .type-page .key-visual .inner.bottom {
    padding-bottom: 62px;
  }
  .type-page .campaign-package .key-visual .inner.bottom {
    padding-bottom: 40px;
  }
  .feature-hotel-list .intro-text {
    padding: 4px 0;
  }
  .feature-hotel-list .sub-box-detail .line-clamp,
  .feature-hotel-list .sub-box-detail .line-clamp-one {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mb-h2 {
    margin-bottom: 8px;
  }
  .pb-section {
    padding-bottom: 16px;
  }
  .type-page .search-section .wrap {
    padding: 0;
  }
  .type-page .search-section .bg-gray {
    padding-bottom: 24px;
  }
  .type-page .search-section .page-number {
    display: none !important;
  }
}

@media (max-width: 360px) {
  .feature-page .tab-box > * {
    font-size: 12px;
  }
}

.feature-onsen .key-visual::before,
.feature-usj .key-visual::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(#0F0A64), to(rgba(15, 10, 100, 0.29)));
  background: -webkit-linear-gradient(top, #0F0A64 0%, rgba(15, 10, 100, 0.29) 100%);
  background: linear-gradient(180deg, #0F0A64 0%, rgba(15, 10, 100, 0.29) 100%);
  opacity: 0.5;
}

/* トップページ */
.notfound h2 {
  margin-bottom: 16px;
}

.notfound p {
  font-size: 1.6rem;
  margin-bottom: 24px;
}

.notfound .wrap {
  padding-top: 120px;
  padding-bottom: 160px;
}

/* トップページ */
.error h2 {
  margin-bottom: 16px;
}

.error p {
  font-size: 1.6rem;
  margin-bottom: 24px;
}

.error .wrap {
  padding-top: 120px;
  padding-bottom: 160px;
}

.error .wrap .btn-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 16px;
}

.error .wrap .btn-group > a {
  min-width: 176px;
  margin-right: 16px;
}

.error .wrap .btn-group > a:last-child {
  margin-right: 0;
}

.error .wrap .error-code {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 16px auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #fff;
  padding: 8px 24px;
  font-size: 1.6rem;
}

.error .wrap .error-code .clip-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  color: inherit;
}

.error .wrap .error-code .clip-btn > span {
  text-decoration: underline;
}

.error .wrap .error-code .clip-btn > img {
  display: block;
  width: 24px;
  height: 24px;
}

.error .wrap .error-code .clip-btn:hover span {
  text-decoration: none;
}

.error .wrap .error-code .clip-btn.clicked {
  color: #757575;
}

.error .wrap .error-code .clip-btn.clicked span {
  text-decoration: none;
}

.error .aupay .wrap .error-code .code-box {
  display: flex;
  cursor: pointer;
}
.error .aupay .wrap .error-code .code-box:hover {
  opacity: 0.7;
  cursor: pointer;
}
.error .aupay .wrap .error-code .code-box .code-value {
  font-weight: 700;
  text-decoration: underline;
  width: 90px;
  white-space: nowrap;
}
.error .aupay .wrap .common-toast {
  height: 56px;
}
.error .aupay .wrap .common-toast > p {
  font-size: 2rem;
  padding: 10px;
}
.error .aupay .wrap .support-desk {
  background-color: #EBEBEB;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 40px auto;
  max-width: 500px;
  padding: 16px 100px;
}
.error .aupay .wrap .support-desk li:first-child {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 8px;
}
.error .aupay .wrap .support-desk li:nth-child(2) {
  font-size: 1.6rem;
  text-align: left;
}
.error .aupay .wrap .btn-wrap {
  display: flex;
  justify-content: center;
}
.error .aupay .wrap .btn-wide {
  height: 48px;
  padding: 12px 16px;
}

@media screen and (max-width: 767px) {
  .error .wrap {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .error .wrap p {
    font-size: 1.4rem;
  }
  .error .wrap .error-code {
    width: 100%;
    font-size: 1.4rem;
  }
  .error .aupay .wrap .error-code {
    width: fit-content; 
    font-size: 1.6rem;
    padding: 8px 16px;
  }
  .error .wrap .btn-small {
    height: 40px;
    font-size: 1.4rem;
  }
  .error .wrap .btn-group {
    margin-top: 24px;
    width: 100%;
  }
  .error .wrap .btn-group > a {
    width: 100%;
    min-width: 163px;
  }
  .error .aupay .wrap .common-toast {
    height: 40px;
  }
  .error .aupay .wrap .common-toast > p {
    font-size: 1.6rem;
    padding: 5px;
  }
  .error .aupay .wrap p {
    font-size: 1.6rem;
  }
  .error .aupay .wrap .support-desk {
    margin: 24px auto;
    padding: 16px 24px;
  }
  .error .aupay .wrap .support-desk li:first-child {
    font-size: 1.6rem;
  }
  .error .aupay .wrap .support-desk .tel {
    display: block;
    margin: auto;
    font-size: 1.6rem;
    text-align: left;
  }
  .error .aupay .wrap .support-desk .tel span {
    color: #06C;
    text-decoration: underline;
  }
  .error .aupay .wrap .btn-wide {
    font-size: 1.6rem;
    padding: 12px 10px;
  }
}

.busy .wrap {
  padding-top: 120px;
  height: 100vh;
}

.busy .logo {
  width: 220px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 48px;
}

@media screen and (max-width: 767px) {
  .busy .wrap {
    padding-top: 48px;
    padding-left: 32px;
    padding-right: 32px;
  }
}

/* aupay起動画面-PC */
.aupayboot .wrap {
  padding-top: 135px;
  padding-bottom: 0;
}
.aupayboot .aupay-logo,
.aupayboot h2,
.aupayboot .info {
  margin-bottom: 24px;
}
.aupayboot .aupay-logo img {
  max-width: 298px;
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.aupayboot p {
  font-size: 1.6rem;
  margin-bottom: 24px;
  margin-top: 64px;
}
.aupayboot ul.info {
  font-size: 1.6rem;
  max-width: 527px;
  margin: auto;
  text-align: left;
  white-space: nowrap;
}
.aupayboot ul.info span {
  margin-right: 4px;
}
.aupayboot ul.info li {
  text-indent: -1em;
  margin-left: 1em;
}
.aupayboot ul.info li:first-child {
  margin-bottom: 8px;
}
.aupayboot .inner {
  max-width: 300px;
  margin: auto;
}
.aupayboot p.notes {
  color: #757575;
  font-size: 1.2rem;
  margin-bottom: 16px;
}
.aupayboot p.notes::before {
  content: '※';
  margin-left: -1em;
}
.aupayboot .btn-wrap {
  margin-bottom: 16px;
}
.aupayboot .btn-aupay {
  background-color: #0F0A64;
  border: 1px solid #0F0A64;
}
.aupayboot .btn-aupay:hover {
  opacity: .7;
}
.aupayboot .link-return a {
  color: #06C;
  font-size: 1.6rem;
  font-weight: 700;
  text-decoration: underline;
}
.aupayboot .link-return a:hover {
  text-decoration: none;
}

@media screen and (max-width: 767px) {
  .aupayboot .wrap {
    padding-top: 97px;
  }
  .aupayboot ul.info {
    white-space: inherit;
  }
}
/* aupay起動画面-PC END */

/* aupay起動画面-SP */
.aupayboot .sp-wrap {
  max-width: 560px;
  padding-top: 16px;
  padding-bottom: 80px;
}
.aupayboot .sp-wrap .sp-aupay-logo {
  margin-bottom: 16px;
}
.aupayboot .sp-aupay-logo img {
  max-width: 224px;
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.aupayboot .sp-wrap h2 {
  font-size: 2rem;
  line-height: 1.5;
  margin-bottom: 16px;
}
.aupayboot .sp-wrap ul.info,
.aupayboot .sp-wrap .inner {
  max-width: 343px;
}
.aupayboot .sp-wrap ul.info li {
  font-size: 1.4rem;
  margin-bottom: 8px;
}
.aupayboot .sp-wrap ul.info li:last-child {
  margin-bottom: 0;
}
.aupayboot .sp-wrap ul.info li a {
  text-decoration: underline;
}
.aupayboot .sp-wrap ul.info li a::before {
  text-decoration: none;
}
.aupayboot .sp-wrap p {
  margin-top: 16px;
}
.aupayboot .sp-wrap p.notes {
  margin-bottom: 8px;
}
.aupayboot .sp-wrap p.notes::before {
  content: '※';
  margin-left: 0;
}
.aupayboot .sp-wrap .btn-wrap {
  margin-bottom: 16px;
}
/* aupay起動画面-SP END */


.text-area-common-style textarea {
  border-style: solid;
  border-width: 1px;
  border-color: #C6C6C6;
  border-radius: 4px;
  outline: none;
  resize: none;
}

.text-area-common-style textarea::-webkit-input-placeholder {
  color: #c6c6c6;
  font-family: "NotoSansJP";
}

.text-area-common-style textarea::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #c6c6c6;
  font-family: "NotoSansJP";
}

.text-area-common-style textarea:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #c6c6c6;
  font-family: "NotoSansJP";
}

.text-area-common-style textarea:focus {
  border: 1px solid #0F0A64;
}

.text-area-common-style p {
  margin: 0;
  color: #757575;
  text-align: right;
}

.main-page {
  padding: 16px 0 150px 0;
  background-color: #F5F5F5;
}

.main-page-white {
  padding: 16px 0 150px 0;
}

/* PC */
@media screen and (min-width: 768px) {
  .sp-only {
    display: none !important;
  }
  .breadcrumb-nav.nonmember {
    margin-top: -24px !important;
  }
  .breadcrumb-nav.pc-page {
    margin: 0 auto;
    padding-bottom: 8px;
  }
  .message {
    width: 100%;
    height: 60px;
    background-color: #0F0A64;
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
    z-index: 60;
  }
  .message p {
    margin: 8.5px 0;
    color: #FFFFFF;
  }
  .text-area-common-style {
    width: 100%;
    max-width: 906px;
  }
  .text-area-common-style textarea {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 16px;
    width: 100%;
    height: 200px;
    font-size: 1.6rem;
    line-height: 1.5;
  }
  .text-area-common-style textarea::-webkit-input-placeholder {
    font-size: 1.6rem;
  }
  .text-area-common-style textarea::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    font-size: 1.6rem;
  }
  .text-area-common-style textarea:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    font-size: 1.6rem;
  }
  .text-area-common-style p {
    line-height: 1.5;
  }
}


@media screen and (max-width: 767px) {
  .sp-title {
    margin: 24px 18px 16px;
  }
  .pc-only {
    display: none !important;
  }
  .message {
    width: 100%;
    height: 50px;
    background-color: #0F0A64;
    position: fixed;
    top: 0;
    left: 0;
    text-align: center;
    z-index: 60;
  }
  .message p {
    margin: 11px 0;
    color: #FFFFFF;
    font-size: 1.6rem;
  }
  .main-page {
    padding: 8px 0 20px 0;
    background-color: #F5F5F5;
  }
  .main-page-white {
    padding: 8px 0 20px 0;
  }
  .text-area-common-style textarea {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 8px;
    width: 100%;
    height: 120px;
    font-size: 1.4rem;
    font-size: 1.4rem;
    line-height: 2;
    -webkit-appearance: none;
  }
  .text-area-common-style textarea::-webkit-input-placeholder {
    font-size: 1.4rem;
    font-size: 1.4rem;
  }
  .text-area-common-style textarea::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    font-size: 1.4rem;
    font-size: 1.4rem;
  }
  .text-area-common-style textarea:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    font-size: 1.4rem;
    font-size: 1.4rem;
  }
  .text-area-common-style p {
    font-size: 1rem;
    line-height: 1.6;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.hotel-item {
  margin-bottom: 15px;
  position: relative;
}

.hotel-item p {
  margin: 0;
}

.hotel-item .bg-img {
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
}

.hotel-item .bg-img::after {
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff0), to(#000000));
  background-image: -webkit-linear-gradient(#fff0, #000000);
  background-image: linear-gradient(#fff0, #000000);
  opacity: 0.7;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}

.hotel-item .hotel-item-content {
  padding: 24px 32px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  color: #FFFFFF;
  text-shadow: 1px 1px 1px #000000;
}

.hotel-item .hotel-item-content .top-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.hotel-item .hotel-item-content .top-area span {
  margin-right: 10px;
}

.hotel-item .hotel-item-content .top-area .name {
  margin: 0 0 0 10px;
}

.hotel-item .hotel-item-content .top-area .name a {
  color: #fff;
}

.hotel-item .hotel-item-content .address span {
  position: relative;
}

.hotel-item .hotel-item-content .address span:first-child {
  margin-right: 15px;
}

.hotel-item .hotel-item-content .address span:not(:first-child) {
  padding-left: 15px;
}

.hotel-item .hotel-item-content .address span:not(:first-child)::before {
  width: 1px;
  height: 80%;
  background-color: #FFFFFF;
  -webkit-box-shadow: 1px 1px 1px #000000;
          box-shadow: 1px 1px 1px #000000;
  position: absolute;
  top: 15%;
  left: 0;
  content: "";
}

.hotel-item .hotel-item-content .detail-area {
  padding: 0 32px 24px 32px;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: absolute;
  top: 143px;
  left: 0;
}

.hotel-item .hotel-item-content .detail-area .detail-info .info-item {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.hotel-item .hotel-item-content .detail-area .detail-info .info-item .detail-title {
  width: 126px;
  position: relative;
}

.hotel-item .hotel-item-content .detail-area .detail-info .info-item .detail-title::after {
  width: 2px;
  height: 80%;
  background-color: #FFFFFF;
  -webkit-box-shadow: 1px 1px 1px #000000;
          box-shadow: 1px 1px 1px #000000;
  position: absolute;
  top: 15%;
  right: 0;
  content: "";
}

.hotel-item .hotel-item-content .detail-area .detail-info .info-item .date {
  margin-left: 24px;
  margin-right: 14px;
}

.hotel-item .hotel-item-content .detail-area .detail-info .info-item .time span:first-child {
  margin-right: 10px;
}

.hotel-item .hotel-item-content .detail-area .right-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.hotel-item .hotel-item-content .detail-area .right-area .amount-area {
  margin-bottom: -10px;
}

.hotel-item .hotel-item-content .detail-area .right-area a {
  margin-left: 16px;
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  color: #333333;
  text-shadow: none;
}

.hotel-item .icon-favorite, .hotel-item .icon-favorite-on {
  position: absolute;
  top: 26px;
  right: 28px;
}

.hotel-item .write-review-area {
  padding: 12px 20px;
  background-color: #FFFFFF;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.hotel-item .write-review-area p {
  margin-left: 23px;
}

/* PCより小さい SPより大きい */
@media screen and (max-width: 1050px) and (min-width: 768px) {
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item:not(:last-child) {
    margin-bottom: 22px !important;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .detail-title {
    width: 100px !important;
    font-size: 1.2rem;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .date, .hotel-item .hotel-item-content .detail-area .detail-info .info-item .time {
    font-size: 1.2rem;
  }
}


@media screen and (max-width: 767px) {
  .hotel-item {
    margin-bottom: 8px;
    margin-right: -1px;
    margin-left: -1px;
    height: 318px;
    background-color: #FFFFFF;
    border: 1px solid #F5F5F5;
  }
  .hotel-item .bg-img {
    height: 168px;
  }
  .hotel-item .hotel-item-content {
    padding: 12px 16px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 0 16px 8px;
    height: 168px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-align-content: flex-end;
        -ms-flex-line-pack: end;
            align-content: flex-end;
  }
  .hotel-item .hotel-item-content .top-area {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .hotel-item .hotel-item-content .top-area .name {
    margin: 0;
    width: 100%;
    font-size: 2rem;
  }
  .hotel-item .hotel-item-content .address {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    font-size: 1.2rem;
  }
  .hotel-item .hotel-item-content .address span {
    padding-left: 0 !important;
    width: 100%;
    display: block;
  }
  .hotel-item .hotel-item-content .address span::before {
    display: none;
  }
  .hotel-item .hotel-item-content .detail-area {
    padding: 0 16px 12px 16px;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    top: 175px;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info {
    width: 100%;
    color: #333333;
    font-size: 1.2rem;
    text-shadow: none;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-number {
    position: absolute;
    top: -160px;
    left: 16px;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-number .detail-title {
    width: auto !important;
    color: #FFFFFF !important;
    text-shadow: 1px 1px 1px #000000 !important;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-number .date {
    color: #FFFFFF !important;
    text-shadow: 1px 1px 1px #000000 !important;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-number p:nth-child(2) {
    margin-left: 6px;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-number p:nth-child(3) {
    margin-left: 6px;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .detail-title {
    width: 100%;
    color: #757575;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .detail-title::after {
    display: none;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .date {
    margin: 0;
    width: 134px;
    color: #333333;
    font-size: 1.2rem;
    font-weight: 700;
    text-shadow: none;
    white-space: nowrap;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .time {
    font-size: 1.2rem;
  }
  .hotel-item .hotel-item-content .detail-area .detail-info .info-item .time span:not(:last-child) {
    margin-right: 8px;
  }
  .hotel-item .hotel-item-content .detail-area .right-area {
    width: 100%;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .hotel-item .hotel-item-content .detail-area .right-area .amount-area {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    text-shadow: none;
  }
  .hotel-item .hotel-item-content .detail-area .right-area .amount-area .amount-title {
    margin-right: 8px;
    color: #757575;
  }
  .hotel-item .hotel-item-content .detail-area .right-area .amount-area .amount {
    font-size: 2rem;
    color: #333333;
  }
  .hotel-item .hotel-item-content .detail-area .right-area a {
    margin: 0;
    color: #757575;
    font-size: 1.6rem;
    font-weight: 400;
    text-decoration: underline;
  }
  .hotel-item .right-arrow {
    position: absolute;
    top: 100px;
    right: 17px;
  }
  .hotel-item .right-arrow::before {
    width: 2px;
    height: 10px;
    background-color: #FFFFFF;
    -webkit-box-shadow: 0 3px 6px #000000;
            box-shadow: 0 3px 6px #000000;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
    content: "";
  }
  .hotel-item .right-arrow::after {
    width: 2px;
    height: 10px;
    background-color: #FFFFFF;
    -webkit-box-shadow: 0 1px 3px #000000;
            box-shadow: 0 1px 3px #000000;
    position: absolute;
    top: 6px;
    right: 0;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    content: "";
  }
  .hotel-item .write-review-area {
    width: 100%;
    padding: 0 16px;
    position: absolute;
    left: 0;
    bottom: 16px;
  }
  .hotel-item .write-review-area a {
    width: 100%;
  }
  .hotel-item .icon-favorite, .hotel-item .icon-favorite-on {
    top: 16px;
    right: 16px;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.options {
  position: relative;
  width: auto;
  display: block;
}

.options .dropdown {
  display: none;
}

.options ul {
  display: none;
  position: relative;
  top: auto;
  left: auto;
  margin: 0px;
  padding: 0px;
  list-style: none;
  border-radius: 0 0 4px 4px;
  border: 1px solid #C6C6C6;
  border-top: none;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}

.options ul li {
  border: 1px solid #F5F5F5;
  border-top: none;
  background-color: #FFFFFF;
  font-size: 1.6rem;
  line-height: 48px;
  text-align: left;
  cursor: pointer;
}

.options ul li:last-child {
  border-radius: 0 0 4px 4px;
}

.options ul li span {
  color: #757575;
  font-size: 1.4rem;
}

.options ul li.active {
  background-color: #F5F5F5;
}

.options ul.active {
  display: block;
}

.options span.select-frame {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: 100%;
  height: 48px;
  padding: 9px 16px;
  background-color: #FFFFFF;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  color: #333;
  font-size: 1.6rem;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  cursor: pointer;
}

.options span.select-frame.empty {
  color: #C6C6C6;
}

.options span.select-frame-active {
  border-radius: 4px 4px 0 0 !important;
}

.options div {
  width: 48px !important;
  height: 48px !important;
  border-radius: 0 4px 4px 0 !important;
  position: absolute;
  top: 0 !important;
  right: 0 !important;
  cursor: pointer;
}

.options div::before, .options div::after {
  content: '';
  background-color: #ffffff;
  display: block;
  position: absolute;
  width: 14px;
  height: 2px;
  top: 50%;
  right: 13px !important;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.options div::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.options div::after {
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.options div.active {
  border-radius: 0 4px 0 0;
}

.options div.active::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.options div.active::after {
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.options.left-justified ul li {
  padding-left: 16px;
  text-align: left;
}

.modalbox-container .child-type .dropdown-select-button {
  pointer-events: none;
}

.options ul li {
  border-bottom: 1px solid #f5f5f5;
  padding-left: 16px;
}

.options ul li:last-child {
  border-bottom: none;
}

@media (max-width: 767px) {
  .text-box,
  .js-dropdown {
    max-width: 100% !important;
    width: 100% !important;
  }
}

@media (max-width: 360px) {
  .options span.select-frame {
    padding: 8px 24px 8px 8px;
    font-size: 1.4rem;
    letter-spacing: 0;
  }
  .options ul li {
    padding-left: 8px;
    font-size: 1.4rem;
  }
  .options.left-justified ul li {
    padding-left: 8px;
  }
}

/* PC */
@media screen and (min-width: 768px) {
  .options {
    max-width: 592px;
  }
  .options ul {
    width: 100%;
    position: absolute;
    top: 48px;
    left: 0;
    z-index: 9;
  }
  .options ul li:hover {
    background-color: #F5F5F5;
  }
  .options span.select-frame {
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }
}


@media screen and (max-width: 767px) {
  .dropdown-sp {
    width: 100%;
    height: 48px;
    position: relative;
  }
  .dropdown-sp::before {
    width: 48px;
    height: 48px;
    background-color: #0F0A64;
    border-radius: 0 4px 4px 0;
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    z-index: 9;
  }
  .dropdown-sp::after {
    width: 19px;
    height: 10px;
    background-image: url(/stcontents/img/common/icon-arrow-bottom-white.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    position: absolute;
    top: 20px;
    right: 14px;
    content: "";
    z-index: 10;
  }
  .dropdown-sp select {
    padding: 9px 10px;
    width: 100%;
    height: 48px;
    background-color: #FFFFFF;
    border: 1px solid #C6C6C6;
    border-radius: 6px;
    color: #757575;
    font-family: "Noto Sans JP";
    font-size: 1.6rem;
    position: absolute;
    top: 0;
    left: 0;
  }
}

/* 右端の色違いver. */
.options-2 div {
  background-color: transparent;
}

.options-2 div::before, .options-2 div::after {
  background-color: #333;
}

.options-2 ul {
  overflow: auto;
  max-height: 350px;
}

/* 生年月日pulldown専用Style */
.dropdown-date {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.options#birth-year {
  width: 104px;
}

.options#birth-month,
.options#birth-day {
  width: 84px;
}

.options#birth-month {
  margin-left: 4px;
  margin-right: 4px;
}

/* Color */
/* Font Size */
/* Font Weight */
.login .hidden-form {
  opacity: 0;
  height: 0;
  overflow: hidden;
  padding: 0;
}

/* PC */
@media screen and (min-width: 768px) {
  .login .wrap {
    padding: 0;
    max-width: 688px;
  }
  .login .login-item {
    position: relative;
    background: #FFFFFF;
  }
  .login .login-item .login-title {
    margin-top: 1px;
    margin-bottom: 40px;
  }
  .login .login-item .login-btn a {
    width: 100%;
    text-align: center;
  }
  .login .login-item .login-wrap-loginsignin {
    margin: 0 auto;
    padding: 24px 21px 29px 24px;
    width: 640px;
    background-color: #F5F5F5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea {
    width: 400px;
    margin-bottom: 24px;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .mail-text {
    color: #000;
    margin: 0 1px 16px 1px;
    height: 31px;
    text-align: center;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .login-input {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin-bottom: 16px;
    padding: 0 12px 0 41px;
    width: 400px;
    height: 48px;
    border: 1px solid #C6C6C6;
    border-radius: 4px;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .login-input::-webkit-input-placeholder {
    /* WebKit browsers */
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .login-input::-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .login-input::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .login-input:focus {
    outline: none;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .btn-block {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea .btn {
    margin: 0 auto;
  }
  .login .login-item .login-wrap-loginsignin .forget-password {
    margin-top: 20px;
    display: block;
    text-align: center;
    text-decoration: underline;
  }
  .login .login-item .login-wrap-loginsignin .forget-password:hover {
    color: #000;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .sns-text {
    margin-top: 0;
    margin-bottom: 19px;
    color: #000000;
    line-height: 28px;
    text-align: center;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .sns-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .sns-icon .btnWithIcon {
    width: 50px;
    height: 50px;
    margin-left: 24px;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .sns-icon .btnWithIcon:first-child {
    margin-left: 0;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .sns-icon a:hover {
    opacity: 0.7;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .btn-block {
    padding-right: 0;
    padding-left: 0;
    width: 100%;
    position: relative;
    display: block;
  }
  .login .login-item .login-wrap-loginsignin .wrap-sns .btn-icon {
    width: 50px;
    height: 50px;
    border: 1px solid #ccc;
    border-radius: 2px;
    background-color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .login .login-item .wrap-account-create {
    margin: 0 auto;
    padding-top: 34px;
    width: 640px;
    text-align: right;
  }
  .login .login-item .wrap-account-create .smapreBoost-banner {
    padding-top: 24px;
    padding-bottom: 150px;
  }
  .login .login-item .wrap-account-create .smapreBoost-banner a:hover {
    opacity: 0.7;
  }
  .login .input-box {
    margin-bottom: 16px;
  }
  .login .input-box .input-content2 > input {
    width: 100%;
  }
  .login-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-left: auto;
    margin-right: auto;
  }
  .login-wrap .btn-modal {
    height: 48px;
  }
  .login-wrap .banner-pontapass {
    display: block;
    margin: auto;
    margin-top: 32px;
  }
  .login-wrap-inner {
    width: 100%;
  }
  .btn-modal {
    height: 48px;
  }
}


@media screen and (max-width: 767px) {
  .login.wrap {
    margin-top: 24px;
  }
  .login .login-item {
    position: relative;
  }
  .login .login-item .login-title {
    margin-top: 24px;
    margin-bottom: 16px;
  }
  .login .login-item .login-btn a {
    height: 48px;
    width: 100%;
    text-align: center;
  }
  .login .login-item .login-wrap-loginsignin {
    margin: 0 auto;
    position: relative;
  }
  .login .login-item .login-wrap-loginsignin .mail-text {
    text-align: center;
    font-size: 1.6rem;
    margin-bottom: 16px;
  }
  .login .login-item .login-wrap-loginsignin .login-mailarea {
    margin-bottom: 40px;
  }
  .login .login-item .login-wrap-loginsignin .mail-icon-position {
    position: relative;
  }
  .login .login-item .login-wrap-loginsignin .mail-icon-position img {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 16px;
    left: 8px;
  }
  .login .login-item .login-wrap-loginsignin .password-icon-position {
    position: relative;
  }
  .login .login-item .login-wrap-loginsignin .password-icon-position img {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 16px;
    left: 8px;
  }
  .login .login-item .login-wrap-loginsignin .password-icon-position img.password-eye {
    left: auto;
    right: 8px;
  }
  .login .login-item .login-wrap-loginsignin .mail-icon-position.error .login-input,
  .login .login-item .login-wrap-loginsignin .password-icon-position.error .login-input {
    border-color: #ce0000;
    margin-bottom: 4px;
  }
  .login .login-item .login-wrap-loginsignin .mail-icon-position.error + .error-text,
  .login .login-item .login-wrap-loginsignin .password-icon-position.error + .error-text {
    display: block;
    color: #ce0000;
    margin-bottom: 16px;
  }
  .login .login-item .login-wrap-loginsignin .login-input {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin-bottom: 16px;
    padding: 0 12px 0 32px;
    width: 100%;
    height: 48px;
    border: 1px solid #C6C6C6;
    border-radius: 4px;
  }
  .login .login-item .login-wrap-loginsignin .login-input:focus {
    outline: none;
  }
  .login .login-item .login-wrap-loginsignin .login-input::-webkit-input-placeholder {
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .login-input:-ms-input-placeholder {
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .login-input::-ms-input-placeholder {
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .login-input::placeholder {
    color: #C6C6C6;
  }
  .login .login-item .login-wrap-loginsignin .btn-block {
    width: 100%;
  }
  .login .login-item .login-wrap-loginsignin .forget-password {
    margin: 16px 0;
    display: block;
    text-align: center;
    text-decoration: underline;
  }
  .login .login-item .login-wrap-loginsignin .snsSP .sns-text {
    text-align: center;
    font-size: 1.6rem;
    margin-bottom: 16px;
  }
  .login .login-item .login-wrap-loginsignin .snsSP .sns-icon {
    margin: 0 auto;
    height: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .login .login-item .login-wrap-loginsignin .snsSP .btn-icon {
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    border: 1px solid #ccc;
    border-radius: 2px;
  }
  .login .login-item .login-wrap-loginsignin .snsSP .btn-block {
    padding: 0;
  }
  .login .login-item .wrap-account-create {
    padding-bottom: 20px;
    padding-top: 40px;
    text-align: right;
  }
  .login .login-item .wrap-account-create .account-create {
    height: 32px;
  }
  .login .login-item .wrap-account-create .smapreBoost-banner {
    padding: 24px 8px 0 8px;
    max-width: 640px;
  }
  .login .login-item .wrap-account-create .smapreBoost-banner img {
    width: 100%;
    height: auto;
  }
  .login .attention {
    text-align: left;
  }
  .login .attention br {
    display: none;
  }
  .login-wrap .banner-pontapass {
    width: 100%;
    margin-top: 24px;
  }
  .auth-code-lead {
    font-size: 1.6rem;
  }
}

/* 移行UX画面 */
.login-02 main,
.login-08 main {
  height: 100vh;
  background: url(/stcontents/img/login/login-bg.jpg) center center no-repeat;
  background-size: cover;
  color: #FFF;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}

.login-02 main .wrap,
.login-08 main .wrap {
  width: 100%;
}

.login-02 .login-head p:first-child br,
.login-08 .login-head p:first-child br {
  display: none;
}

.login-02 .login-btns,
.login-08 .login-btns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.login-02 .login-btns .btn-relux,
.login-02 .login-btns .btn-default,
.login-08 .login-btns .btn-relux,
.login-08 .login-btns .btn-default {
  width: 100%;
}

.login-02 .login-btns .btn-default,
.login-08 .login-btns .btn-default {
  margin-right: 16px;
}

.login-02 .login-btns-inner,
.login-08 .login-btns-inner {
  width: 100%;
  max-width: 416px;
}


@media screen and (max-width: 767px) {
  .btn-small {
    height: 48px;
    font-size: 1.6rem;
  }
}


@media screen and (max-width: 599px) {
  .login-02,
  .login-08 {
    text-align: left;
  }
  .login-02 main .wrap,
  .login-08 main .wrap {
    width: 100%;
    height: 100vh;
    position: relative;
    padding: 24px;
  }
  .login-02 .login-head,
  .login-08 .login-head {
    margin-bottom: 0 !important;
  }
  .login-02 .login-head p:first-child,
  .login-08 .login-head p:first-child {
    font-size: 2.6rem;
  }
  .login-02 .login-head p:first-child br,
  .login-08 .login-head p:first-child br {
    display: block;
  }
  .login-02 .login-btns,
  .login-08 .login-btns {
    position: absolute;
    left: 0;
    bottom: 48px;
    width: 100%;
    padding: 0 24px;
  }
  .login-02 .login-btns .btn-default,
  .login-08 .login-btns .btn-default {
    margin-right: 0;
    margin-top: 16px;
  }
  .login-02 .login-btns-inner,
  .login-08 .login-btns-inner {
    max-width: 100%;
    text-align: center;
  }
  .login-02 .login-head {
    padding: 16px 8px;
    white-space: nowrap;
    text-align: left;
  }
}

.login-03,
.login-04 {
  text-align: center;
}

.login-03 main,
.login-04 main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 100vh;
}

.login-03 main .wrap,
.login-04 main .wrap {
  width: 100%;
  max-width: 768px;
}

.login-03 .input-box-wrap,
.login-04 .input-box-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.login-03 .input-box,
.login-04 .input-box {
  width: 100%;
  max-width: 400px;
}

.login-03 .input-box .btn-relux,
.login-04 .input-box .btn-relux {
  width: 100%;
}


@media screen and (max-width: 599px) {
  .login-03,
  .login-04 {
    text-align: left;
  }
  .login-03 main,
  .login-04 main {
    display: block;
    height: auto;
  }
  .login-03 .bg-gray,
  .login-04 .bg-gray {
    background: #FFF;
    padding: 0 !important;
  }
  .login-03 .login-message,
  .login-04 .login-message {
    margin-bottom: 24px !important;
  }
  .login-03 .login-message br,
  .login-04 .login-message br {
    display: none;
  }
  .login-03 .input-box-wrap,
  .login-04 .input-box-wrap {
    display: block;
  }
  .login-03 .input-box,
  .login-04 .input-box {
    max-width: 100%;
  }
}

.login-05 .login-05-message {
  color: #757575;
}

.login-05 .login-05-message .data-none {
  color: #CE0000;
}

@media screen and (min-width: 768px) {
  .login-05 .login-05-message {
    padding: 0 16px;
  }
}


@media screen and (max-width: 599px) {
  .login-05 .content-edit {
    padding-bottom: 134px;
  }
}

@media (min-height: 900px) {
  .login-05 .float-bar {
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}

.login-07 .content {
  padding: 0 16px;
}

.login-07 .input-error-word {
  text-align: left;
}

.login-07 .save-btn a {
  width: 176px;
}

.address-registered {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  background: #F5F5F5;
  padding: 8px 16px;
}


@media screen and (max-width: 599px) {
  .login-07 .content {
    padding-bottom: 40px !important;
  }
}

@media screen and (max-width: 414px) {
  .address-registered {
    display: block;
  }
}

@media (min-height: 735px) {
  .login-07 .float-bar {
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}

.login-08 main {
  height: calc(100vh - 84px);
  background: url(/stcontents/img/login/login-bg-02.jpg) center center no-repeat;
}

.login-08 main .wrap {
  width: 100%;
}


@media screen and (max-width: 599px) {
  .login-08 main {
    height: calc(100vh - 84px);
  }
  .login-08 main .wrap {
    height: calc(100vh - 84px);
    padding: 16px;
  }
  .login-08 .login-head {
    text-align: center;
    margin-top: 45%;
  }
  .login-08 .login-btns {
    padding: 0 16px;
    bottom: 16px;
  }
}

@media screen and (min-width: 767px) {
  .d-pc-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
}

@media screen and (min-width: 599px) {
  .d-tb-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
}

@media screen and (max-width: 599px) {
  .d-sp-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
/* PC */
@media screen and (min-width: 768px) {
  .logout .logout-item .wrap-logout p {
    text-align: center;
    color: #333;
  }
  .logout .logout-item .wrap-logout .logout-title {
    margin: 0 auto;
    padding-bottom: 24px;
  }
  .logout .logout-item .wrap-logout .logout-text {
    margin: 0 auto;
  }
  .logout .logout-item .wrap-logout .logout-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .logout .logout-item .wrap-logout .logout-btn .btn-relux {
    min-width: 300px;
  }
  .logout .logout-item .wrap-logout .btn-block {
    min-width: 169px;
    height: 56px;
    display: block;
  }
}


@media screen and (max-width: 767px) {
  .logout .logout-item {
    text-align: center;
  }
  .logout .logout-item .wrap-logout p {
    text-align: center;
    color: #333;
  }
  .logout .logout-item .wrap-logout .logout-title {
    margin: 0 auto;
  }
  .logout .logout-item .wrap-logout .logout-text {
    margin-bottom: 36px;
  }
  .logout .logout-item .wrap-logout .btn {
    margin: 0 auto;
    width: 100%;
    text-align: center;
  }
  .logout .logout-item .wrap-logout .btn-block {
    width: 100%;
    min-height: 40px;
  }
}

@keyframes btn-display {
  0% {
    -webkit-transform: scale(0.25);
            transform: scale(0.25);
  }
  30% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  60% {
    -webkit-transform: scale(0.75);
            transform: scale(0.75);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@-webkit-keyframes btn-display {
  0% {
    -webkit-transform: scale(0.25);
  }
  30% {
    -webkit-transform: scale(0.5);
  }
  60% {
    -webkit-transform: scale(0.75);
  }
  100% {
    -webkit-transform: scale(1);
  }
}

.edit-mode .browsing-area .hotel-card-item a {
  pointer-events: none;
}

/* Color */
/* Font Size */
/* Font Weight */
.cancel-input .page-white {
  padding: 0 0 40px;
  background-color: #FFFFFF;
}

.cancel-input .title-area {
  margin-top: -16px;
  padding: 16px 0;
  background-color: #FFFFFF;
}

.cancel-input .title-area .comment {
  margin-bottom: 0;
}

.cancel-input .cancel-input-content {
  margin-left: 32px;
}

.cancel-input .cancel-input-content .hotel-item {
  margin-left: -32px;
}

.cancel-input .cancel-input-content .cancel-content {
  width: 73%;
}

.cancel-input .cancel-input-content .cancel-content .cancel-info-title {
  margin: 40px 0 8px 0;
}

.cancel-input .cancel-input-content .cancel-content .cancel-info-title.mt-16 {
  margin-top: 16px;
}

.cancel-input .cancel-input-content .cancel-content .cancellation-fee {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.cancel-input .cancel-input-content .cancel-content .cancellation-fee img {
  margin-right: 5px;
}

.cancel-input .cancel-input-content .cancel-content .cancellation-policy {
  padding: 16px;
  border-bottom: 1px solid #C6C6C6;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.cancel-input .cancel-input-content .cancel-content .cancellation-policy p {
  margin: 0;
}

.cancel-input .cancel-input-content .cancel-content .cancellation-policy .amount {
  margin-right: 10px;
}

.cancel-input .cancel-input-content .cancel-content .cancellation-policy.mark {
  border-top: 1px solid #C6C6C6;
}

.cancel-input .cancel-input-content .cancel-content .supplement {
  margin-top: 8px;
}

.cancel-input .cancel-input-content .cancel-content .supplement-info {
  line-height: 1.7;
}

.cancel-input .cancel-input-content .cancel-content .text-area-common-style {
  margin-top: 16px;
}

.cancel-input .cancel-input-content .table-basic th {
  min-width: 288px;
}

.cancel-input .btn-group {
  margin-top: 44px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.cancel-input .btn-group a, .cancel-input .btn-group button {
  width: 176px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.cancel-input .btn-group a:not(:last-child), .cancel-input .btn-group button:not(:last-child) {
  margin-right: 16px;
}

.cancel-input .options span.select-frame {
  padding: 9px 48px 9px 16px;
  display: block;
}

.policy-model {
  max-width: 512px;
}

.policy-model .modal-container {
  padding: 48px 24px 16px;
}

.policy-model .modal-container p img {
  margin-right: 12px;
  margin-bottom: -3px;
}

.policy-model .modal-container .time span::after {
  content: "：";
}


@media screen and (max-width: 767px) {
  .cancel-input {
    padding: 0;
  }
  .cancel-input .btn-small {
    height: 48px;
  }
  .cancel-input .page-white {
    padding: 16px 16px 40px;
  }
  .cancel-input .title-area {
    padding-bottom: 0;
  }
  .cancel-input .title-area .title {
    font-size: 1.6rem;
  }
  .cancel-input .title-area .comment {
    font-size: 1.2rem;
  }
  .cancel-input .cancel-input-content {
    margin-left: 0;
  }
  .cancel-input .cancel-input-content .hotel-item {
    margin-left: -1px;
  }
  .cancel-input .cancel-input-content .cancel-content {
    width: 100%;
  }
  .cancel-input .cancel-input-content .cancel-content .cancel-info-title {
    margin: 32px 0 8px;
    font-size: 2rem;
  }
  .cancel-input .cancel-input-content .cancel-content .table-basic p {
    margin-bottom: 0;
  }
  .cancel-input .cancel-input-content .cancel-content .cancellation-policy-word {
    font-size: 1.6rem;
  }
  .cancel-input .cancel-input-content .cancel-content .cancellation-policy {
    padding: 8px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .cancel-input .cancel-input-content .cancel-content .cancellation-policy p:last-child {
    text-align: right;
  }
  .cancel-input .cancel-input-content .cancel-content .cancellation-policy .amount {
    display: block;
    font-size: 1.6rem;
  }
  .cancel-input .cancel-input-content .cancel-content .cancellation-policy .amount-rule {
    display: block;
    color: #757575;
    font-size: 1rem;
  }
  .cancel-input .cancel-input-content .cancel-content .supplement-info {
    margin-top: 12px;
  }
  .cancel-input .btn-group a:not(:last-child) {
    margin-right: 8px;
  }
  .policy-model {
    max-width: 343px;
    max-height: 230px;
  }
  .policy-model .modal-container {
    padding: 24px 14px 16px;
    max-width: 343px;
    max-height: 230px;
    border-radius: 8px;
    -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  }
  .policy-model .modal-container .modal-container-inner {
    text-align: center;
  }
  .policy-model .modal-container p {
    text-align: left;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .policy-model .modal-container .note {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 400;
  }
  .policy-model .modal-container .time {
    margin-top: 14px;
    margin-bottom: 15px;
    font-size: 1.4rem;
    font-weight: 700;
  }
  .policy-model .modal-container .time span {
    margin-right: 15px;
    font-size: 1.2rem;
    font-weight: 700;
  }
  .policy-model .modal-container a {
    margin: 0 2px;
    width: calc(100% - 4px);
  }
  .policy-model.policy-impossible-model {
    max-height: 152px;
  }
  .policy-model.policy-impossible-model .modal-container {
    padding: 16px;
    max-height: 152px;
    width: 100%;
  }
  .policy-model.policy-impossible-model .modal-container .modal-container-inner {
    width: 100%;
  }
  .policy-model.policy-impossible-model .modal-container .modal-container-inner p {
    text-align: center;
  }
  .policy-model.policy-impossible-model .modal-container .modal-container-inner a {
    margin: 0;
    width: 100%;
  }
}

.mp-change-mail {
  /*pc*/
  /*sp*/
}

.mp-change-mail .resist-mail {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  width: 100%;
  height: auto;
  padding: 8px 16px;
  margin: 0 auto 16px;
}

.mp-change-mail .resist-mail > p {
  margin-bottom: 0;
}

.mp-change-mail .resist-mail > p:first-child {
  margin-right: 16px;
  display: block;
}

.mp-change-mail .content {
  padding-bottom: 160px;
}

.mp-change-mail .content .btn-smaller {
  height: 48px;
}

.mp-change-mail .content .input-box {
  margin-right: auto;
  margin-left: auto;
  max-width: 400px;
}

.mp-change-mail .content .input-box .input-content {
  position: relative;
}

.mp-change-mail .content .input-box .icon-eye {
  left: auto;
}

.mp-change-mail .content .input-box .btn-relux {
  width: 100%;
}

.mp-change-mail .content .input-error-word {
  display: none;
}

.mp-change-mail .content .input-error-word.active {
  display: block;
}

.mp-change-mail .note {
  padding: 24px 150px;
  text-align: center;
  font-size: 16px;
  margin-top: 40px;
}

.mp-change-mail .note li {
  padding-left: 1em;
  text-indent: -1em;
}

.mp-change-mail .note-text {
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.mp-change-mail .note-text li {
  font-size: 14px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-align: left;
}

.mp-change-mail .btn-group {
  margin: 40px auto 160px;
}

.mp-change-mail .btn-group a {
  width: 176px;
}

@media screen and (min-width: 768px) {
  .mp-change-mail .code-submit-btn a, .mp-change-mail .code-submit-btn button {
    width: 192px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .mp-change-mail .note {
    padding: 24px;
  }
}

@media screen and (max-width: 767px) {
  .mp-change-mail .content {
    padding-bottom: 80px;
    /*h2 {
        font-size: 2.4rem;
      }*/
  }
  .mp-change-mail .note {
    padding: 16px;
    text-align: left;
    margin-top: 24px;
  }
  .mp-change-mail .btn-group {
    margin-top: 24px;
  }
  .mp-change-mail .btn-group a {
    width: calc(50% - 6px);
  }
  .mp-change-mail .code-submit-btn a, .mp-change-mail .code-submit-btn button {
    width: 50% !important;
  }
}

@media screen and (max-width: 432px) {
  .mp-change-mail .content {
    margin-left: auto;
    margin-right: auto;
    max-width: 400px;
  }
  .mp-change-mail .content .code-message {
    text-align: left;
  }
  .mp-change-mail .content .color-gray-2 {
    text-align: left;
  }
}

/* メールアドレスの確認画面 */
@media screen and (max-width: 767px) {
  .confirm-mail .policy-impossible-model .modal-container {
    padding: 16px;
    max-height: 200px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  .confirm-mail .policy-impossible-model .modal-container .btn-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0;
  }
  .confirm-mail .policy-impossible-model .modal-container .btn-group a {
    width: 142px;
    height: 40px;
    font-size: 1.4rem;
  }
}

@media screen and (min-width: 768px) {
  .confirm-mail .modal-container {
    padding: 40px;
  }
  .confirm-mail .modal-container .btn-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0;
  }
  .confirm-mail .modal-container .btn-group a {
    width: 176px;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.my-page-coupon body {
  background: #F5F5F5;
}

.my-page-coupon .bg-white img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: auto;
}

.my-page-coupon h1 {
  padding-bottom: 0 !important;
}

.my-page-coupon .coupon-head,
.my-page-coupon .coupon-head-sp {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.my-page-coupon .coupon-head {
  display: none;
}

.my-page-coupon .coupon-data-wrap {
  cursor: auto;
}

.my-page-coupon .coupon-back a {
  width: 300px;
}

.my-page-coupon .half-modal-content li {
  font-size: 1rem;
}

.my-page-coupon .coupon-target-hotel li {
  font-size: 1.2rem;
}

.my-page-coupon .tab-content-coupon .btn-to-top {
  margin-top: 77px;
}

.my-page-coupon .tab-content-sum,
.my-page-coupon .tab-content-coupon,
.my-page-coupon .tab-content-ponta,
.my-page-coupon .tab-content-relux {
  max-width: 928px;
  margin-left: auto;
  margin-right: auto;
}

.my-page-coupon .tag-coupon,
.my-page-coupon .tag-fcfs,
.my-page-coupon .tag-done {
  height: 16px;
  -webkit-transform: none;
          transform: none;
  margin-right: 4px;
}

.my-page-coupon .point-modal {
  padding-bottom: 40px;
}

.my-page-coupon .point-modal .content-item-sum {
  border: 2px solid #c6c6c6;
  margin-bottom: 8px;
  padding: 16px;
  background: #FFF;
}

.my-page-coupon .point-modal .content-item-sum .point-available dd {
  font-size: 1.6rem;
}

.my-page-coupon .point-modal .content-item-sum .point-available dt {
  font-size: 2.4rem;
}

.my-page-coupon .point-modal .content-item-ponta {
  margin-bottom: 8px;
  padding: 16px;
  background: #FFF;
}

.my-page-coupon .point-modal .content-item-ponta .title-ponta {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-coupon .point-modal .content-item-ponta .title-ponta .text-right {
  margin-left: 8px;
}

.my-page-coupon .point-modal .content-item-ponta .point-box {
  display: block;
  margin-bottom: 4px;
}

.my-page-coupon .point-modal .content-item-ponta .btn-xx-small {
  width: 100%;
}

.my-page-coupon .point-modal .point-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.my-page-coupon .point-modal .point-title .title {
  margin: 0;
}

.my-page-coupon .point-modal .point-title img {
  margin-left: 8px;
}

.my-page-coupon .content-item-list .content-item:first-child {
  border-top: 1px solid #C6C6C6;
}

.my-page-coupon .point-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.my-page-coupon .point-available {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.my-page-coupon .point-available dd {
  margin-right: 8px;
  font-size: 1.2rem;
  letter-spacing: 0;
}

.my-page-coupon .point-available dt, .my-page-coupon .point-available p {
  font-size: 2rem;
  font-weight: bold;
}

.my-page-coupon .point-expiration {
  color: #757575;
  letter-spacing: 0;
}

.my-page-coupon .content-item-relux {
  margin-bottom: 24px;
  padding: 16px;
  background: #FFF;
}

.my-page-coupon .content-item-relux .title-relux {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-coupon .content-item-relux .title-relux .text-right {
  margin-left: 8px;
}

.my-page-coupon .content-item-relux .point-box {
  display: block;
  margin-bottom: 4px;
}

.my-page-coupon .content-item-coupon.empty {
  margin-bottom: 16px;
  padding: 16px;
  background: #FFF;
  border: 1px solid #fff;
}

.my-page-coupon .tab-box {
  padding: 0;
}

.my-page-coupon .point-modal .content-item-sum {
  position: relative;
}

.my-page-coupon .point-modal .hotel-grade {
  width: 560px;
  background: #fff;
  padding: 24px 40px 32px;
  position: absolute;
  height: auto;
  left: 35%;
  top: inherit;
  bottom: -94px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  border: 1px solid #F5F5F5;
  -webkit-box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  z-index: 2;
}

@media screen and (max-width: 767px) {
  .my-page-coupon .point-modal .hotel-grade {
    width: 100%;
    padding: 40px 24px 24px;
    left: 50%;
  }
  .my-page-coupon .point-modal .hotel-grade div p:first-of-type {
    font-size: 1.4rem;
  }
  .my-page-coupon .point-modal .hotel-grade div p:last-of-type {
    font-size: 1rem;
  }
  .my-page-coupon .point-modal .hotel-grade:after {
    content: "×";
    position: absolute;
    top: 6px;
    right: 14px;
    font-size: 18px;
  }
}

@media screen and (min-width: 768px) {
  .my-page-coupon .coupon-head {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .my-page-coupon .coupon-head-sp {
    display: none;
  }
  .my-page-coupon .common-modal-min {
    max-width: 600px;
    max-width: 540px;
    height: 336px;
  }
  .my-page-coupon .common-modal-min .modal-container {
    border-radius: 8px;
  }
  .my-page-coupon .tab-content-coupon .btn-to-top {
    margin-top: 0;
  }
  .my-page-coupon .tag-coupon,
  .my-page-coupon .tag-fcfs,
  .my-page-coupon .tag-done {
    height: 20px;
    -webkit-transform: none;
            transform: none;
  }
  .my-page-coupon .reserve-input-point input {
    width: 65%;
    width: calc(100% - 120px);
  }
  .my-page-coupon .point-modal .content-item-sum {
    padding: 24px 64px;
    margin-bottom: 16px;
  }
  .my-page-coupon .point-modal .content-item-sum .point-info {
    position: relative;
  }
  .my-page-coupon .point-modal .point-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .my-page-coupon .point-modal .content-item-ponta {
    margin-bottom: 16px;
    padding: 24px 64px;
  }
  .my-page-coupon .point-modal .content-item-ponta .btn-xx-small {
    width: auto;
  }
  .my-page-coupon .point-modal .content-item-ponta .point-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .my-page-coupon .point-modal .content-item-ponta .title-ponta {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .my-page-coupon .point-modal .content-item-ponta .title-ponta .text-right {
    margin-left: 16px;
  }
  .my-page-coupon .point-info {
    display: block;
  }
  .my-page-coupon .point-available {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .my-page-coupon .point-available dd {
    margin-right: 16px;
    font-size: 1.6rem;
    letter-spacing: 1px;
  }
  .my-page-coupon .point-available dt {
    font-size: 2rem;
  }
  .my-page-coupon .point-expiration {
    letter-spacing: 1px;
  }
  .my-page-coupon .content-item-relux {
    margin-bottom: 40px;
    padding: 24px 64px;
  }
  .my-page-coupon .content-item-relux.empty {
    margin-bottom: 16px;
  }
  .my-page-coupon .content-item-relux .title-relux .text-right {
    margin-left: 16px;
  }
  .my-page-coupon .content-item-coupon.empty {
    padding: 24px 64px;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.registration-information .information > div:nth-child(1) > div {
  width: 100%;
  display: table-row;
}

.registration-information .information > div:nth-child(1) > div span:nth-child(1) {
  display: table-cell;
}

.registration-information .information > div:nth-child(1) > div span:nth-child(2) {
  display: table-cell;
}

.registration-information .update-information > div:nth-child(1) > div .update-information-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.change-password .new-password input.warn {
  border-color: #CE0000;
}

.change-password .new-password .password > div:nth-child(2) {
  position: relative;
}

.change-password .new-password .password > div:nth-child(2) .icon-eye {
  position: absolute;
}

.change-password .new-password .password > div:nth-child(2) .warn-word {
  margin-top: 16px;
  display: none;
}

.change-password .new-password .password > div:nth-child(2) .warn-word.active {
  display: block;
}

.social-account-integration .integration {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.social-account-integration .integration > dl {
  width: 100%;
}

.social-account-integration .integration > dl dt {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  float: left;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.social-account-integration .integration > dl dd a:hover {
  color: #554B98;
}

.email-reception-settings .settings .setting-item .setting-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.withdrawal-procedure .withdrawal-content .description > ul {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1.75;
}

.withdrawal-procedure .withdrawal-content .content .withdrawal-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.withdrawal-procedure .withdrawal-content .btn-warn {
  margin-top: 8px;
  margin-bottom: 30px;
  text-align: center;
}

.update-btn {
  margin-top: 40px;
  margin-bottom: 40px;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.member-options {
  display: inline-block;
  position: relative;
}

.member-options .dropdown {
  display: none;
}

.member-options ul, .member-options li, .member-options span {
  -webkit-user-select: none;
  -moz-user-select: none;
  /*firefox*/
  -ms-user-select: none;
      user-select: none;
}

.member-options ul {
  margin: 0px;
  padding: 0px;
  top: 37px;
  left: 0;
  width: 100%;
  max-height: 350px;
  border-radius: 4px;
  display: none;
  position: absolute;
  list-style: none;
  z-index: 1;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  overflow: auto;
}

.member-options ul li {
  height: 40px;
  border: 1px solid #F5F5F5;
  border-top: none;
  background-color: #FFFFFF;
  line-height: 40px;
  text-align: center;
  cursor: pointer;
}

.member-options ul li span {
  color: #757575;
  font-size: 0.875rem;
}

.member-options ul li.active {
  background-color: #F5F5F5;
}

.member-options ul.active {
  display: block;
}

.member-options span.select-frame {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0 0 8px 11px;
  width: 100%;
  border-bottom: 2px solid #C6C6C6;
  display: block;
  color: #757575;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.member-options div {
  width: 17px;
  height: 9px;
  position: absolute;
  top: 9px;
  right: 0;
  cursor: pointer;
}

.member-options div::before, .member-options div::after {
  content: '';
  background-color: #333333;
  display: block;
  position: absolute;
  width: 14px;
  height: 2px;
  top: 50%;
  right: 21px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.member-options div::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.member-options div::after {
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.member-options div.active::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.member-options div.active::after {
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

/* pc */
@media screen and (min-width: 768px) {
  .main-content {
    padding: 24px;
    background-color: #FFFFFF;
  }
  .main-content .registration-information .information > div:nth-child(1) span:nth-child(1) {
    padding-left: 16px;
    padding-top: 24px;
    width: 279px;
  }
  .main-content .registration-information .information > div:nth-child(1) span:nth-child(2) {
    padding-top: 24px;
  }
  .main-content .registration-information .update-information {
    margin-left: 16px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) {
    margin-top: 24px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div {
    margin-bottom: 40px;
    width: 100%;
    max-width: 720px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div .update-information-title {
    margin-bottom: 8px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(1) > p:nth-child(2) input {
    width: 47.7%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(1) > p:nth-child(2) input:nth-child(1) {
    margin-right: 3.7%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(2) > p:nth-child(2) input {
    width: 47.7%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(2) > p:nth-child(2) input:nth-child(1) {
    margin-right: 3.7%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(3) > p:nth-child(2) input {
    width: 100%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) div {
    margin-right: 24px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) div label {
    margin-right: 7px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(5) div .member-options {
    width: 99px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(6) p input {
    width: 69px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(7) p input {
    width: 217px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(8) p input {
    width: 108px;
  }
  .main-content .change-password .new-password > div:nth-child(1) {
    margin-top: 24px;
  }
  .main-content .change-password .new-password > div:nth-child(2) {
    margin-top: 40px;
  }
  .main-content .change-password .new-password .password > div:nth-child(2) {
    margin-top: 12px;
  }
  .main-content .change-password .new-password .password > div:nth-child(2) .icon-eye {
    left: 321px;
  }
  .main-content .change-password .new-password .password > div:nth-child(2) input {
    padding-bottom: 8px;
    width: 344px;
  }
  .main-content .social-account-integration .integration dl:nth-child(1) {
    margin-top: 24px;
  }
  .main-content .social-account-integration .integration dl:nth-last-child(1) {
    margin-bottom: 13px;
  }
  .main-content .social-account-integration .integration > dl {
    margin-left: 16px;
    margin-bottom: 28px;
  }
  .main-content .social-account-integration .integration > dl dt {
    width: 168px;
  }
  .main-content .social-account-integration .integration > dl dt img {
    width: 24px;
    height: 24px;
  }
  .main-content .social-account-integration .integration > dl dt span {
    margin-left: 8px;
  }
  .main-content .social-account-integration .integration > dl dd a {
    text-decoration: underline;
  }
  .main-content .social-account-integration .integration > dl dd a.active {
    text-decoration: none;
  }
  .main-content .social-account-integration .integration > dl dd a.color-link:hover {
    color: #757575;
  }
  .main-content .email-reception-settings .settings .setting-item {
    margin-left: 16px;
  }
  .main-content .email-reception-settings .settings .setting-item:nth-child(1) {
    margin-top: 24px;
  }
  .main-content .email-reception-settings .settings .setting-item .setting-title {
    margin-bottom: 16px;
  }
  .main-content .email-reception-settings .settings .setting-item .setting-title span:nth-child(2) {
    margin-left: 8px;
  }
  .main-content .email-reception-settings .settings .setting-item .setting-radio {
    margin-bottom: 36px;
  }
  .main-content .email-reception-settings .settings .setting-item .update-btn {
    margin-bottom: 40px;
  }
  .main-content .withdrawal-procedure .withdrawal-content {
    padding-bottom: 40px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .description {
    margin: 24px 0 40px 16px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .description > div:nth-child(1) {
    margin-bottom: 8px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .content .withdrawal-title {
    margin-bottom: 16px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .content .withdrawal-title span:nth-child(1) {
    margin-right: 8px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .update-btn {
    margin-bottom: 0 !important;
  }
}

/* sp */
@media screen and (max-width: 767px) {
  .main-content {
    background-color: #FFFFFF;
  }
  .main-content .btn {
    width: 100%;
  }
  .main-content .member-options div::before, .main-content .member-options div::after {
    right: 13px;
  }
  .main-content .registration-information .information {
    margin-bottom: 36px;
  }
  .main-content .registration-information .information > div:nth-child(1) {
    margin-top: 13px;
  }
  .main-content .registration-information .information > div:nth-child(1) div span:nth-child(1) {
    margin-left: 8px;
    padding-right: 16px;
    padding-bottom: 24px;
    width: 153px;
  }
  .main-content .registration-information .information > div:nth-child(1) div span:nth-child(2) {
    padding-bottom: 24px;
  }
  .main-content .registration-information .update-information {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 0 8px;
    margin-bottom: 36px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) {
    margin-top: 13px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div {
    margin-bottom: 40px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div .update-information-title {
    margin-bottom: 2px;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(1) > p:nth-child(2) input {
    width: 48%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(1) > p:nth-child(2) input:nth-child(1) {
    margin-right: 2%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(2) > p:nth-child(2) input {
    width: 48%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(2) > p:nth-child(2) input:nth-child(1) {
    margin-right: 2%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(3) > p:nth-child(2) input {
    width: 100%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) label {
    margin-right: 5%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) label:nth-last-child(1) {
    margin-right: 0;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(5) div .member-options:nth-child(1) {
    width: 35.5%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(5) div .member-options:nth-child(2), .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(5) div .member-options:nth-child(3) {
    width: 25.7%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(5) div .member-options {
    margin-right: 4.7%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(5) div .member-options:nth-last-child(1) {
    margin-right: 0;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(6) p input {
    width: 100%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(7) p input {
    width: 100%;
  }
  .main-content .registration-information .update-information > div:nth-child(1) > div:nth-child(8) p input {
    width: 100%;
  }
  .main-content .change-password .new-password {
    margin-bottom: 36px;
  }
  .main-content .change-password .new-password > div:nth-child(1) {
    margin-top: 13px;
  }
  .main-content .change-password .new-password > div:nth-child(2) {
    margin-top: 24px;
  }
  .main-content .change-password .new-password .password > div:nth-child(2) {
    margin-top: 4px;
  }
  .main-content .change-password .new-password .password > div:nth-child(2) .icon-eye {
    right: 0;
  }
  .main-content .change-password .new-password .password > div:nth-child(2) input {
    padding-bottom: 8px;
    width: 98.8%;
  }
  .main-content .social-account-integration .integration > dl {
    margin-top: 24px;
    margin-left: 16px;
  }
  .main-content .social-account-integration .integration > dl dt {
    width: 152px;
  }
  .main-content .social-account-integration .integration > dl dt img {
    width: 24px;
    height: 24px;
  }
  .main-content .social-account-integration .integration > dl dt span {
    margin-left: 8px;
  }
  .main-content .social-account-integration .integration > dl dd a {
    text-decoration: underline;
  }
  .main-content .social-account-integration .integration > dl dd a.active {
    text-decoration: none;
  }
  .main-content .social-account-integration .integration .member-img {
    margin: 24px 0 40px 0;
  }
  .main-content .social-account-integration .integration .member-img img {
    width: 100%;
    height: auto;
  }
  .main-content .email-reception-settings .settings {
    margin-bottom: 40px;
  }
  .main-content .email-reception-settings .settings .setting-item {
    margin-left: 16px;
  }
  .main-content .email-reception-settings .settings .setting-item:nth-child(1) {
    margin-top: 14px;
  }
  .main-content .email-reception-settings .settings .setting-item .setting-title {
    margin-bottom: 22px;
  }
  .main-content .email-reception-settings .settings .setting-item .setting-title span:nth-child(1) {
    margin-left: 8px;
  }
  .main-content .email-reception-settings .settings .setting-item .setting-radio {
    margin-bottom: 36px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .description {
    margin: 24px 0 40px 16px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .description > div:nth-child(1) {
    margin-bottom: 8px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .description ul li {
    padding: 0 5px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .content .withdrawal-title {
    margin-bottom: 16px;
  }
  .main-content .withdrawal-procedure .withdrawal-content .update-btn {
    margin-bottom: 0;
  }
}

/* Color */
/* Font Size */
/* Font Weight */

.menu-model {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 24px 16px;
  width: 100%;
  background-color: #FFFFFF;
  border-radius: 0 0 8px 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 30;
}

.menu-model ul {
  margin: 47px 0 0 0;
  padding: 0;
  list-style: none;
}

.menu-model ul li {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-bottom: 1px solid #C6C6C6;
}

.menu-model ul li:first-child {
  border-top: 1px solid #C6C6C6;
}

.menu-model ul li a {
  padding: 16px;
  display: block;
  position: relative;
}

.menu-model ul li a::before {
  width: 2px;
  height: 11px;
  background-color: #000000;
  position: absolute;
  top: 22px;
  right: 15px;
  content: "";
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.menu-model ul li a::after {
  width: 2px;
  height: 11px;
  background-color: #000000;
  position: absolute;
  top: 29px;
  right: 15px;
  content: "";
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

/* Color */
/* Font Size */
/* Font Weight */
/* PC */
@media screen and (min-width: 768px) {
  .my-favorite-body .main-page-white {
    padding-top: 0;
    padding-bottom: 160px;
  }
  .my-favorite::after {
    content: '';
    display: block;
    clear: both;
  }
  .my-favorite .favorite-item {
    margin-bottom: 16px;
    width: calc(50% - 16px);
    height: 200px;
    border-radius: 8px;
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    position: relative;
    text-align: left;
    cursor: pointer;
    float: left;
  }
  .my-favorite .favorite-item:nth-child(odd) {
    margin-right: 16px;
  }
  .my-favorite .favorite-item:nth-child(even) {
    margin-left: 16px;
  }
  .my-favorite .favorite-item .bg-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .my-favorite .favorite-item .favorite-content {
    position: absolute;
    bottom: 24px;
    left: 24px;
    pointer-events: none;
  }
  .my-favorite .favorite-item .favorite-content .quality-mark {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .my-favorite .favorite-item .favorite-content .quality-mark .icon-grade {
    display: block;
    width: 20px;
    height: 20px;
    -webkit-filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.6));
            filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.6));
  }
  .my-favorite .favorite-item .favorite-content .icon-museum,
  .my-favorite .favorite-item .favorite-content .icon-casual {
    vertical-align: bottom;
  }
  .my-favorite .favorite-item .favorite-content .inn-mark {
    margin-left: 12px;
    display: inline-block;
    vertical-align: top;
  }
  .my-favorite .favorite-item .favorite-content .name {
    margin: 0;
    color: #FFFFFF;
    text-shadow: 1px 1px 1px #000;
  }
  .my-favorite .favorite-item .favorite-content .address {
    color: #FFFFFF;
    text-shadow: 1px 1px 1px #000;
  }
  .my-favorite .favorite-item .icon-favorite,
  .my-favorite .favorite-item .icon-favorite-on {
    position: absolute;
    top: 29px;
    right: 28px;
  }
  .my-favorite .favorite-item:hover {
    opacity: 0.7;
  }
  .my-favorite .btn {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    margin-top: 0;
    padding: 16px;
    background-color: #fff;
    -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    text-align: center;
    z-index: 100;
  }
  .my-favorite .favorite-none {
    text-align: center;
    margin-top: 80px;
  }
}


@media screen and (max-width: 767px) {
  .my-favorite-head {
    margin-top: 16px;
  }
  .my-favorite-head .title {
    padding-bottom: 16px;
    font-size: 2.6rem;
  }
  .my-favorite-body .main-page-white {
    padding-bottom: 88px;
  }
  .my-favorite .favorite-item {
    margin-bottom: 8px;
    width: 100%;
    height: 140px;
    border-radius: 8px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    position: relative;
    cursor: pointer;
  }
  .my-favorite .favorite-item .bg-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .my-favorite .favorite-item .favorite-content {
    position: absolute;
    bottom: 12px;
    left: 16px;
    pointer-events: none;
  }
  .my-favorite .favorite-item .favorite-content .quality-mark {
    display: inline-block;
  }
  .my-favorite .favorite-item .favorite-content .quality-mark .icon-grade {
    height: 12px;
    -webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.6));
            filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.6));
  }
  .my-favorite .favorite-item .favorite-content .inn-mark {
    margin-left: 3px;
    display: inline-block;
    vertical-align: top;
  }
  .my-favorite .favorite-item .favorite-content .name {
    margin: 0;
    color: #FFFFFF;
    text-shadow: 1px 1px 1px #000;
  }
  .my-favorite .favorite-item .favorite-content .address {
    margin-top: -5px;
    color: #FFFFFF;
    text-shadow: 1px 1px 1px #000;
  }
  .my-favorite .favorite-item .icon-favorite,
  .my-favorite .favorite-item .icon-favorite-on {
    position: absolute;
    top: 18px;
    right: 17px;
  }
  .my-favorite .btn {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    margin-top: 0;
    padding: 8px 16px 16px;
    background-color: #fff;
    -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
    text-align: center;
    z-index: 100;
  }
  .my-favorite .btn a {
    width: 100%;
  }
  .my-favorite .favorite-none {
    text-align: center;
    margin-top: 56px;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.slider-title {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-top: 2px solid #F5F5F5;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  color: #0F0A64;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}

.slider-title.last-mark {
  border-bottom: 2px solid #F5F5F5;
}

.slider-title::before, .slider-title::after {
  content: '';
  background-color: #0F0A64;
  display: block;
  position: absolute;
  width: 14px;
  height: 2px;
  top: 50%;
  right: 19px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.slider-title::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.slider-title::after {
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.slider-title.active {
  background-color: #0F0A64;
  border-color: #0F0A64;
  color: #FFFFFF;
}

.slider-title.active::before, .slider-title.active::after {
  background-color: #FFFFFF;
}

.slider-title.active::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.slider-title.active::after {
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

/* PC */
@media screen and (min-width: 768px) {
  .sub-header .tab-box {
    margin-top: 8px;
  }
  .slider-title {
    padding: 16px;
  }
  .slider-title::before, .slider-title::after {
    right: 19px;
  }
  .slider-title:hover {
    background-color: #554B98;
    border-color: #554B98;
    color: #FFFFFF;
  }
  .slider-title:hover::before, .slider-title:hover::after {
    background-color: #FFFFFF;
  }
}


@media screen and (max-width: 767px) {
  .sub-header {
    margin-top: 16px;
  }
  .sub-header .tab-box {
    margin-top: 8px;
    margin-left: -16px;
    margin-right: -16px;
  }
  .sub-header .tab-box.column-3 > div {
    height: 40px;
  }
  .sub-header .tab-box.column-3 > div:first-child {
    width: calc(100% / 3 - 9px);
  }
  .sub-header .tab-box.column-3 > div:last-child {
    width: calc(100% / 3 + 9px);
  }
  .slider-title {
    padding: 16px 12px 16px 8px;
  }
  .slider-title::before, .slider-title::after {
    right: 12px;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.reservation.nonmember-reservation {
  padding-top: 40px;
}

.reservation.nonmember-reservation .reservation-title {
  font-size: 2.6rem;
}

.reservation.nonmember-reservation .reservation-item-body {
  background-color: #fff;
  padding: 16px 144px 0px;
}

.reservation.nonmember-reservation .reservation-item-body p {
  margin-bottom: 8px;
}

.reservation.nonmember-reservation .reservation-item-body .btn-group-area {
  -webkit-box-shadow: none;
          box-shadow: none;
  padding: 40px 0;
  height: auto;
  position: static;
}

.reservation p {
  margin: 0;
}
.reservation .modal-title {
  margin-bottom: 24px;
}
.reservation header .js-modal-trigger {
  display: none !important;
}
.reservation .mp-member-info .js-modal-trigger {
  width: 100%;
  height: 40px;
}
.reservation .modal-forgetPassword {
  margin-top: 16px;
}
@media (min-width: 768px){
  .reservation .loginsignin-modal {
      height: 640px;
  }
}


.reservation .reservation-date {
  margin-bottom: 8px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.reservation .reservation-date p:first-child {
  padding-right: 20px;
}

.reservation .reservation-item {
  margin-bottom: 16px;
  position: relative;
}

.reservation .reservation-item .bg-img {
  width: 100%;
  height: 300px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.reservation .reservation-item .bg-img::before {
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff0), to(#000000));
  background-image: -webkit-linear-gradient(#fff0, #000000);
  background-image: linear-gradient(#fff0, #000000);
  opacity: 0.7;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}

.reservation .reservation-item .reservation-item-content {
  position: relative;
  padding: 24px 32px 0;
  width: 100%;
  height: 100%;
  min-height: 300px;
  color: #FFFFFF;
  text-shadow: 1px 1px 1px #000000;
}

.reservation .reservation-item .reservation-item-content .gtt {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  background: rgba(255, 255, 255, 0.7);
  color: #4F68C2;
  text-shadow: none;
  height: 24px;
  border-radius: 2px 0 0 2px;
}

.reservation .reservation-item .reservation-item-content .gtt .tag-gtt {
  margin-right: 8px;
}

.reservation .reservation-item .reservation-item-content .tag-gtt.coupon {
  text-shadow: none;
}

.reservation .reservation-item .reservation-item-content .gtt-coupon {
  width: 126px;
}

.reservation .reservation-item .reservation-item-content .top-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.reservation .reservation-item .reservation-item-content .top-area .icon-label {
  margin-right: 10px;
  text-shadow: none;
}

.reservation .reservation-item .reservation-item-content .top-area .name {
  margin-left: 10px;
}

.reservation .reservation-item .reservation-item-content .top-area .name a {
  color: #fff;
  padding-bottom: 1px;
  text-decoration: underline;
  display: inline-block;
}

.reservation .reservation-item .reservation-item-content .top-area .name a:hover {
  text-decoration: none;
}

.reservation .reservation-item .reservation-item-content .address,
.reservation .reservation-item .reservation-item-content .dp-label{
  width: 100%;
}

.reservation .reservation-item .reservation-item-content .address span {
  position: relative;
}

.reservation .reservation-item .reservation-item-content .address span:first-child {
  margin-right: 15px;
}

.reservation .reservation-item .reservation-item-content .address span:not(:first-child) {
  padding-left: 15px;
}

.reservation .reservation-item .reservation-item-content .address span:not(:first-child)::before {
  width: 1px;
  height: 80%;
  background-color: #FFFFFF;
  -webkit-box-shadow: 1px 1px 1px #000000;
          box-shadow: 1px 1px 1px #000000;
  position: absolute;
  top: 15%;
  left: 0;
  content: "";
}

.reservation .reservation-item .reservation-item-content .detail-area {
  margin-top: 54px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  position: absolute;
  left: 32px;
  right: 32px;
  bottom: 32px;
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info {
  -webkit-align-self: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start;
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item:not(:last-child) {
  margin-bottom: 2px;
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .detail-title {
  width: 126px;
  position: relative;
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .detail-title::after {
  width: 2px;
  height: 80%;
  background-color: #FFFFFF;
  -webkit-box-shadow: 1px 1px 1px #000000;
          box-shadow: 1px 1px 1px #000000;
  position: absolute;
  top: 15%;
  right: 0;
  content: "";
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .date {
  margin-left: 24px;
  margin-right: 14px;
}

.reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .time span:first-child {
  margin-right: 10px;
}

.reservation .reservation-item .reservation-item-content .detail-area .right-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.reservation .reservation-item .reservation-item-content .detail-area .right-area .amount-area {
  margin-bottom: -10px;
}

.reservation .reservation-item .reservation-item-content .detail-area .right-area a {
  margin-left: 16px;
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  color: #0F0A64;
  text-shadow: none;
}

.reservation .reservation-item .reservation-item-content .detail-area .right-area a:hover {
  color: #554B98;
}

.reservation .reservation-item .icon-favorite, .reservation .reservation-item .icon-favorite-on {
  position: absolute;
  top: 26px;
  right: 28px;
}

.reservation .reservation-item .write-review-area {
  padding: 12px 20px;
  background-color: #FFFFFF;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation .reservation-item .write-review-area p {
  margin-left: 23px;
}

.reservation .reservation-none {
  padding: 40px 0;
  background-color: #FFFFFF;
  text-align: center;
}

.reservation .reservation-none a {
  margin-top: 16px;
  min-width: 300px;
}

.reservation .see-more-link {
  margin-top: 44px;
  text-align: center;
}

.accommodation-history .right-area .review {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: end;
      -ms-flex-align: end;
          align-items: end;
}

@media (min-width: 768px) {
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info {
    flex-shrink: 0;
  }
}

/* Scroll時のTab固定用Style */
.tab-box-wrap.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 20;
  background: #FFF;
}

.tab-box-wrap.fixed .tab-box {
  margin: 0 auto;
  max-width: 1120px;
}

.heightFixed {
  margin-top: 48px;
}

.reservation-info-modal .scroll-on, .mail-share-modal .scroll-on {
  padding-right: 16px !important;
  overflow-y: auto !important;
}

.reservation-info-modal .scroll-on::-webkit-scrollbar, .mail-share-modal .scroll-on::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.reservation-info-modal .scroll-on::-webkit-scrollbar-thumb, .mail-share-modal .scroll-on::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.reservation-info-modal .scroll-on::-webkit-scrollbar-track, .mail-share-modal .scroll-on::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.reservation-info-modal {
  max-width: 800px;
}

.reservation-info-modal .modal-container {
  padding-bottom: 0;
  padding-right: 16px;
  position: relative;
}

.reservation-info-modal .gtt-coupon-info {
  padding: 16px 24px;
}

.reservation-info-modal .gtt-coupon-info .d-flex {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation-info-modal .gtt-coupon-info img {
  width: 196px;
  height: 196px;
  margin-right: 16px;
}

.reservation-info-modal .reservation-only .icon-label {
  border: 1px solid #FFF;
}

.reservation-info-modal .canceled-only .icon-label {
  border: 1px solid #FFF;
}

.reservation-info-modal .accommodation-history-only .icon-label {
  border: 1px solid #333;
}

.reservation-info-modal .smartpass {
  margin-bottom: 40px;
}

.reservation-info-modal .smartpass ul li {
  padding-left: 1em;
  text-indent: -1em;
}

.reservation-info-modal .smartpass ul li::before {
  content: "・";
}

.reservation-info-modal .smartpass .accordion-content {
  font-size: 1.4rem;
}

.reservation-info-modal .smartpass .text-link {
  width: 100%;
  text-align: right;
}

@media screen and (min-width: 768px) {
  .reservation-info-modal .cancel-area .cancel-item span:last-child {
    min-width: 148px;
    display: inline-block;
    text-align: right;
  }
}

@media screen and (max-width: 767px) {
  .reservation-info-modal .smartpass .accordion-content {
    font-size: 1.2rem;
  }
}

.reservation-item-body .reservation-title {
  margin-bottom: 16px;
}

.reservation-item-body .info-area-title {
  margin-top: 40px;
}

.reservation-item-body .hotel-name {
  margin-bottom: 38px;
}

.reservation-item-body .hotel-name > a {
  color: #333;
  text-decoration: underline;
  font-size: 2rem;
}

.reservation-item-body .hotel-name > a:hover {
  text-decoration: none;
}

.reservation-info-modal .title,
.reservation-item-body .title {
  margin: 0 auto 16px;
  max-width: 720px;
}

.reservation-info-modal .content-body,
.reservation-item-body .content-body {
  margin: 0 auto;
  /*max-width: 720px;*/
  height: calc(100% - 100px) !important;
}
.reservation-info-modal .content-body.canceled-modal ,
.reservation-item-body .content-body.canceled-modal {
  height: calc(100% - 53px) !important;
}

.reservation-info-modal .content-body.no-btn-group-area,
.reservation-item-body .content-body.no-btn-group-area {
  height: calc(100% - 50px) !important;
}

.reservation-info-modal .content-body .sub-title,
.reservation-item-body .content-body .sub-title {
  text-decoration: underline;
  cursor: pointer;
}

.reservation-info-modal .content-body .sub-title:hover,
.reservation-item-body .content-body .sub-title:hover {
  text-decoration: none;
}

.reservation-info-modal .content-body .info-area-title,
.reservation-item-body .content-body .info-area-title {
  margin-top: 40px;
}

.reservation-info-modal .info-area,
.reservation-item-body .info-area {
  padding-bottom: 8px;
  border-bottom: 4px solid #F5F5F5;
}

.reservation-info-modal .info-sub-area {
  padding-bottom: 8px;
  border-bottom: 2px solid #F5F5F5;
}
.reservation-item-body .info-sub-area + .info-sub-area,
.reservation-item-body .info-sub-area + .info-item  {
  border-top: 2px solid #F5F5F5;
}
.reservation-item-body .info-sub-area + .info-item  {
  padding-top: 16px;
}

.reservation-info-modal .info-item,
.reservation-item-body .info-item {
  margin: 16px 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation-info-modal .info-item.slider-item,
.reservation-item-body .info-item.slider-item {
  margin: 0;
}

.reservation-info-modal .info-item .info-item-left,
.reservation-item-body .info-item .info-item-left {
  min-width: 180px;
  -webkit-align-self: flex-start;
      -ms-flex-item-align: start;
          align-self: flex-start;
}

.reservation-info-modal .info-item .info-item-right,
.reservation-item-body .info-item .info-item-right {
  width: calc(100% - 180px);
  overflow: hidden;
}

.reservation-info-modal .info-item .info-item-right .important-note::before,
.reservation-item-body .info-item .info-item-right .important-note::before {
  content: "※";
}

.reservation-info-modal .info-item .info-item-right .charge-details,
.reservation-item-body .info-item .info-item-right .charge-details {
  padding: 24px 24px;
  background-color: #F5F5F5;
  display: block;
}

.reservation-info-modal .info-item .info-item-right .charge-details p,
.reservation-item-body .info-item .info-item-right .charge-details p {
  margin: 0 0 8px;
}

.reservation-info-modal .info-item .info-item-right .charge-details p:last-child,
.reservation-item-body .info-item .info-item-right .charge-details p:last-child {
  width: 40%;
}

@media screen and (max-width: 900px) {
  .reservation-info-modal .info-item .info-item-right .charge-details p:last-child,
  .reservation-item-body .info-item .info-item-right .charge-details p:last-child {
    width: auto;
  }
}

.reservation-info-modal .info-item .info-item-right .charge-details #paymentAmount,
.reservation-item-body .info-item .info-item-right .charge-details #paymentAmount {
  line-height: 1.2;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item,
.reservation-item-body .info-item .info-item-right .charge-details .charge-left .charge-left-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item:not(:last-child),
.reservation-item-body .info-item .info-item-right .charge-details .charge-left .charge-left-item:not(:last-child) {
  margin-bottom: 8px;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item:only-child,
.reservation-item-body .info-item .info-item-right .charge-details .charge-left .charge-left-item:only-child {
  height: 100%;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item .name,
.reservation-item-body .info-item .info-item-right .charge-details .charge-left .charge-left-item .name {
  width: 100px;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item .name {
  width: auto;
  flex: 1;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item .content,
.reservation-item-body .info-item .info-item-right .charge-details .charge-left .charge-left-item .content {
  width: 40%;
  text-align: right;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-left .charge-left-item .content {
  width: 100px;
  margin-left: 24px;
  white-space: nowrap;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-right,
.reservation-item-body .info-item .info-item-right .charge-details .charge-right {
  -webkit-align-self: flex-end;
      -ms-flex-item-align: end;
          align-self: flex-end;
  margin-top: 8px;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-right .charge-right-item,
.reservation-item-body .info-item .info-item-right .charge-details .charge-right .charge-right-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-right .charge-right-item .name,
.reservation-item-body .info-item .info-item-right .charge-details .charge-right .charge-right-item .name {
  margin-right: 0;
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-right .charge-right-item .content,
.reservation-item-body .info-item .info-item-right .charge-details .charge-right .charge-right-item .content {
  width: 40%;
  text-align: right;
}

@media screen and (max-width: 900px) {
  .reservation-info-modal .info-item .info-item-right .charge-details .charge-right .charge-right-item .content,
  .reservation-item-body .info-item .info-item-right .charge-details .charge-right .charge-right-item .content {
    width: auto;
  }
}

.reservation-info-modal .info-item .info-item-right .charge-details .charge-right .charge-right-item .list-asterisk,
.reservation-item-body .info-item .info-item-right .charge-details .charge-right .charge-right-item .list-asterisk {
  width: 291px;
}

.reservation-info-modal .info-item .info-item-right .default-link:hover,
.reservation-item-body .info-item .info-item-right .default-link:hover {
  color: #0066cc;
}

.reservation-item-body .info-item .charge-details.d-flex {
  display: flex !important;
}
.reservation-item-body .info-item .charge-details.d-flex > div {
  width: 50% !important;
}
.reservation-item-body .info-item .charge-details.d-flex .charge-left-item {
  justify-content: flex-start !important;
}
.reservation-item-body .info-item .charge-details.d-flex p:last-child {
  width: auto;
  text-align: right;
}

@media screen and (max-width: 1200px) {
  .reservation-item-body .info-item .charge-details.d-flex {
    display: block !important;
  }
  .reservation-item-body .info-item .charge-details.d-flex > div {
    width: 100% !important;
  }
  .reservation-item-body .info-item .charge-details.d-flex .charge-left-item .content {
    width: calc(100% - 100px) !important;
  }
}

@media screen and (max-width: 900px) {
  .reservation-info-modal .info-item .info-item-right.charge-details,
  .reservation-item-body .info-item .info-item-right.charge-details {
    padding: 8px 16px !important;
  }
  .reservation-item-body .info-item .charge-details.d-flex {
    padding: 16px;
  }
}

.reservation-info-modal .info-item .point-column > span,
.reservation-item-body .info-item .point-column > span {
  display: inline-block;
  margin-bottom: 8px;
}

.reservation-info-modal .info-item .point-column > span:last-child,
.reservation-item-body .info-item .point-column > span:last-child {
  width: 40%;
}

@media screen and (max-width: 900px) {
  .reservation-info-modal .info-item .point-column,
  .reservation-item-body .info-item .point-column {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation-info-modal .info-item .point-column > span:last-child,
  .reservation-item-body .info-item .point-column > span:last-child {
    width: auto;
  }
}

.reservation-info-modal .accordion-open-link::after,
.reservation-item-body .accordion-open-link::after,
.reservation-info-modal .js-accordion-open-rd::after {
  margin-top: -4px;
  margin-bottom: 0;
  width: 19px;
  height: 10px;
  background: url(/stcontents/img/common/icon-accordion.svg) no-repeat 0 center;
  background-size: contain;
}

.reservation-info-modal .js-accordion-open-rd.active::after {
  margin-top: -4px;
  margin-bottom: 0;
  width: 19px;
  height: 10px;
  background: url(/stcontents/img/common/icon-accordion.svg) no-repeat 0 center;
  background-size: contain;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.reservation-info-modal .accordion-open-link:hover::after,
.reservation-item-body .accordion-open-link:hover::after {
  background: url(/stcontents/img/common/icon-accordion.svg) no-repeat 0 center;
  background-size: contain;
}

.reservation-info-modal .accordion-close-link::after,
.reservation-item-body .accordion-close-link::after {
  margin-top: -4px;
  margin-bottom: 0;
  width: 19px;
  height: 10px;
  background: url(/stcontents/img/common/icon-accordion.svg) no-repeat 0 center;
  background-size: contain;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.reservation-info-modal .accordion-close-link:hover::after,
.reservation-item-body .accordion-close-link:hover::after {
  background: url(/stcontents/img/common/icon-accordion.svg) no-repeat 0 center;
  background-size: contain;
}

.reservation-info-modal .cancel-area p,
.reservation-item-body .cancel-area p {
  margin: 0;
}

.reservation-info-modal .cancel-area .cancel-item,
.reservation-item-body .cancel-area .cancel-item {
  padding: 16px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 1px solid #C6C6C6;
}

.reservation-info-modal .cancel-area .cancel-item:last-child,
.reservation-item-body .cancel-area .cancel-item:last-child {
  border-bottom: 1px solid #C6C6C6;
}

.reservation-info-modal .cancel-area .cancel-item span,
.reservation-item-body .cancel-area .cancel-item span {
  margin-right: 20px;
}

.reservation-info-modal .delete-btn,
.reservation-item-body .delete-btn {
  display: none;
  text-align: center;
}

.reservation-info-modal .delete-btn a,
.reservation-item-body .delete-btn a {
  margin-bottom: 16px;
  min-width: 300px;
}

.reservation-info-modal .btn-group-area,
.reservation-item-body .btn-group-area {
  width: 100%;
  height: 80px;
  background-color: #FFFFFF;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  bottom: 0;
  left: 0;
  -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
          box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
}

.reservation-info-modal .btn-group-area a,
.reservation-item-body .btn-group-area a {
  width: 187px;
}

.reservation-info-modal .btn-group-area a:not(:last-child),
.reservation-item-body .btn-group-area a:not(:last-child) {
  margin-right: 16px;
}

.reservation-info-modal .btn-group-area.local-settlement a,
.reservation-item-body .btn-group-area.local-settlement a {
  min-width: 300px;
}

.reservation-info-modal .btn-group-area.prepaid a,
.reservation-item-body .btn-group-area.prepaid a {
  min-width: 300px;
}

.reservation-info-modal .cxl-insurance,
.reservation-item-body .cxl-insurance {
  border: 1px solid #0F0a64;
  padding: 16px;
  margin-top: 16px;
  text-align: center;
}

.reservation-info-modal .cxl-insurance p,
.reservation-item-body .cxl-insurance p {
  text-align: center;
}

.reservation-info-modal .cxl-insurance .title,
.reservation-item-body .cxl-insurance .title {
  color: #0F0A64;
  font-size: 2rem;
  font-weight: 900;
  text-align: center;
  margin-bottom: 8px;
}

.reservation-info-modal .cxl-insurance .description,
.reservation-item-body .cxl-insurance .description {
  font-size: 1.6rem;
}

.reservation-info-modal .cxl-insurance .note,
.reservation-item-body .cxl-insurance .note {
  font-size: 12px;
  text-align: left;
  margin: 0 auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reservation-info-modal .cxl-insurance .btn-relux,
.reservation-item-body .cxl-insurance .btn-relux {
  margin-top: 8px;
  width: 300px;
  font-size: 1.6rem;
}

@media (max-width: 767px) {
  .reservation-info-modal .modal-container .btn-group-area.prepaid a,
  .reservation-item-body .modal-container .btn-group-area.prepaid a {
    width: 100%;
  }
  .reservation-info-modal .cxl-insurance,
  .reservation-item-body .cxl-insurance {
    padding: 16px;
  }
  .reservation-info-modal .cxl-insurance p,
  .reservation-item-body .cxl-insurance p {
    text-align: left;
  }
  .reservation-info-modal .cxl-insurance .title,
  .reservation-item-body .cxl-insurance .title {
    margin-bottom: 8px;
    font-size: 1.6rem;
  }
  .reservation-info-modal .cxl-insurance .description,
  .reservation-item-body .cxl-insurance .description {
    font-size: 1.4rem;
  }
  .reservation-info-modal .cxl-insurance .note,
  .reservation-item-body .cxl-insurance .note {
    font-size: 10px;
    margin: 0;
  }
  .reservation-info-modal .cxl-insurance .btn-relux,
  .reservation-item-body .cxl-insurance .btn-relux {
    width: 100%;
    font-size: 1.4rem;
    height: 40px;
  }
}

.mail-share-modal {
  width: 100%;
  max-width: none;
  height: 100%;
  background-color: rgba(198, 198, 198, 0.7);
}

.mail-share-modal .mail-share-modal-close {
  background: url(/stcontents/img/common/icon-close-2.svg) no-repeat 0 0;
  background-size: contain;
  width: 56px;
  height: 56px;
  position: fixed;
  top: 32px;
  right: 32px;
  display: block;
  cursor: pointer;
}

.mail-share-modal .modal-container {
  margin-top: 96px;
  margin-bottom: 141px;
  padding: 0;
  max-width: 762px;
  height: 80%;
  max-height: 563px;
}

.mail-share-modal .content-body {
  margin-top: 0 !important;
  width: 100%;
  text-align: center;
  position: relative;
}

@media screen and (min-width: 768px) {
  .mail-share-modal .content-body {
    height: 100% !important;
  }
}

.mail-share-modal .content-body .title {
  margin-top: 43px;
}

.mail-share-modal .content-body .input-box-area {
  margin: 0 auto;
  max-width: 400px;
  max-height: 300px;
  height: calc(100% - 184px);
  overflow: auto;
}

.mail-share-modal .content-body .input-box {
  margin-bottom: 16px;
}

.mail-share-modal .content-body .input-box input {
  width: 100%;
}

.mail-share-modal .content-body .input-box input:not(:first-child) {
  margin-top: 16px;
}

.mail-share-modal .content-body .input-box div {
  margin-top: 8px;
  text-align: left;
}

.mail-share-modal .add-mail {
  margin-bottom: 24px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #333333;
}

.mail-share-modal .add-mail .plus-mark {
  margin-right: 10px;
  width: 20px;
  height: 20px;
  background-color: #757575;
  border-radius: 50%;
  display: inline-block;
  position: relative;
}

.mail-share-modal .add-mail .plus-mark::before {
  width: 2px;
  height: 14px;
  background-color: #FFFFFF;
  position: absolute;
  top: 3px;
  left: calc(50% - 1px);
  content: "";
}

.mail-share-modal .add-mail .plus-mark::after {
  width: 14px;
  height: 2px;
  background-color: #FFFFFF;
  position: absolute;
  top: calc(50% - 1px);
  left: 3px;
  content: "";
}

.mail-share-modal .btn-group-area {
  padding: 16px 0 40px;
  width: 100%;
  background-color: #FFFFFF;
}

@media screen and (min-width: 768px) {
  .mail-share-modal .btn-group-area {
    bottom: 0;
  }
}

.mail-share-modal .btn-group-area.shadow-on {
  -webkit-box-shadow: 0 -2px 8px 0 rgba(0, 0, 0, 0.08);
          box-shadow: 0 -2px 8px 0 rgba(0, 0, 0, 0.08);
}

.deletion-confirmation-modal {
  width: 100%;
  max-width: none;
  background-color: rgba(198, 198, 198, 0.7);
}

.deletion-confirmation-modal .modal-container {
  margin: 0;
  padding: 20px;
  width: 332px;
  height: 180px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.deletion-confirmation-modal .modal-container .content-body > p {
  margin-bottom: 24px;
  text-align: center;
}

.deletion-confirmation-modal .modal-container .content-body .btn-group-area {
  text-align: center;
}

.deletion-confirmation-modal .modal-container .content-body .btn-group-area .browsing-btn-yes, .deletion-confirmation-modal .modal-container .content-body .btn-group-area .btn-yes {
  width: 85px;
}

.deletion-confirmation-modal .modal-container .content-body .btn-group-area .browsing-btn-no, .deletion-confirmation-modal .modal-container .content-body .btn-group-area .btn-no {
  width: 85px;
}

.reservation-canceled {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 60px;
  background-color: #0F0A64;
  z-index: 60;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation-canceled .reservation-canceled-text {
  color: #fff;
  font-size: 2.4rem;
  font-weight: bold;
}

/* PCより小さい SPより大きい */
@media screen and (max-width: 1280px) and (min-width: 901px) {
  .reservation .reservation-item-content .detail-area {
    margin-top: 70px !important;
  }
  .reservation .reservation-item-content .detail-area .detail-info .info-item:not(:last-child) {
    margin-bottom: 22px !important;
  }
  .reservation .reservation-item-content .detail-area .detail-info .info-item .detail-title {
    width: 100px !important;
    font-size: 1.2rem;
  }
  .reservation .reservation-item-content .detail-area .detail-info .info-item .date, .reservation .reservation-item-content .detail-area .detail-info .info-item .time {
    font-size: 1.2rem;
  }
  .reservation .reservation-item-content .detail-area .right-area {
    min-width: 200px;
  }
  .reservation .reservation-item-content .detail-area .right-area .amount-area .amount {
    font-size: 1.6rem;
  }
}


@media screen and (max-width: 900px) {
  .reservation.nonmember-reservation {
    padding-top: 0;
    padding-bottom: 0;
  }
  .reservation.nonmember-reservation .reservation-title {
    font-size: 2.0rem;
    border-top: 4px solid #f5f5f5;
    padding-top: 16px;
  }
  .reservation.nonmember-reservation .wrap {
    padding: 0;
  }
  .reservation.nonmember-reservation .reservation-item .bg-img {
    border-radius: 0;
  }
  .reservation.nonmember-reservation .reservation-item .reservation-item-content .detail-area .right-area {
    display: block;
  }
  .reservation.nonmember-reservation .reservation-item .reservation-item-content .detail-area .right-area .amount-area {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .reservation.nonmember-reservation .reservation-item .cancellation-policy-word {
    font-size: 16px;
  }
  .reservation.nonmember-reservation .reservation-item .supplement-info {
    font-size: 14px;
  }
  .reservation.nonmember-reservation .reservation-item-body {
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 40px;
  }
  .reservation.nonmember-reservation .reservation-item-body .hotel-name {
    margin-bottom: 16px;
    margin-top: -16px;
    padding-top: 16px;
  }
  .reservation.nonmember-reservation .reservation-item-body .hotel-name > a {
    font-size: 1.6rem;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-left {
    margin-bottom: 8px;
    width: 100%;
    font-size: 1.2rem;
    font-weight: 900;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-right {
    width: 100%;
    font-size: 1.6rem;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-right .important-note {
    margin: 0;
    display: block;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-right .charge-details .charge-left {
    width: 100%;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-right .charge-details .charge-left .charge-left-item {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-right .charge-details .charge-right {
    margin-top: 16px;
    width: 100%;
  }
  .reservation.nonmember-reservation .reservation-item-body .info-item .info-item-right .charge-details .charge-right .charge-right-item {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation.nonmember-reservation .reservation-item-body .btn-group-area {
    padding: 16px 16px 40px;
    position: static;
    margin: 0 calc(50% - 50vw);
    width: 100vw;
    /*&.sp-absolute {
            position: absolute;
          }*/
  }
  .reservation .reservation-item {
    margin-bottom: 0;
    background-image: none !important;
    background-color: #FFFFFF;
    border-radius: 8px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    /*
      .right-arrow {
        position: absolute;
        top: 100px;
        right: 17px;
        &::before {
          width: 2px;
          height: 10px;
          background-color: $footerFontSPColor;
          box-shadow: 0 3px 6px $colorBlack;
          position: absolute;
          top: 0;
          right: 0;
          transform: rotate(-45deg);
          content: "";
        }
        &::after {
          width: 2px;
          height: 10px;
          background-color: $footerFontSPColor;
          box-shadow: 0 1px 3px $colorBlack;
          position: absolute;
          top: 6px;
          right: 0;
          transform: rotate(45deg);
          content: "";
        }
      }
      */
  }
  .reservation .reservation-item::before {
    display: none;
  }
  .reservation .reservation-item .bg-img {
    width: 100%;
    height: 168px;
    border-radius: 8px 8px 0 0;
  }
  .reservation .reservation-item .bg-img::before {
    height: 168px;
  }
  .reservation .reservation-item .js-modal-trigger.pc-only {
    display: none !important;
  }
  .reservation .reservation-item .js-modal-trigger.sp-only {
    display: block !important;
  }
  .reservation .reservation-item .reservation-item-content {
    padding: 12px 16px;
    min-height: 318px;
    /* margin-bottom: 16px; */
    position: relative;
  }
  .reservation .reservation-item .reservation-item-content .info-number-sp {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    position: absolute;
    top: 12px;
    left: 16px;
  }
  .reservation .reservation-item .reservation-item-content .info-number-sp .icon-label {
    text-shadow: none;
  }
  .reservation .reservation-item .reservation-item-content .info-number-sp .detail-title {
    color: #FFFFFF;
    font-size: 1.2rem;
    font-weight: 700;
    text-shadow: 1px 1px 1px #000000;
  }
  .reservation .reservation-item .reservation-item-content .info-number-sp .date {
    color: #FFFFFF;
    font-size: 1.2rem;
    font-weight: 700;
    text-shadow: 1px 1px 1px #000000;
  }
  .reservation .reservation-item .reservation-item-content .info-number-sp p:nth-child(2) {
    margin-left: 6px;
  }
  .reservation .reservation-item .reservation-item-content .info-number-sp p:nth-child(3) {
    margin-left: 6px;
  }
  .reservation .reservation-item .reservation-item-content .gtt {
    display: block;
    width: 100%;
    height: 60px;
    color: #757575;
    margin-bottom: 16px;
  }
  .reservation .reservation-item .reservation-item-content .gtt .tag-gtt {
    margin-bottom: 4px;
  }
  .reservation .reservation-item .reservation-item-content .gtt.coupon {
    color: #4F68C2;
    height: 40px;
    margin-top: 8px;
  }
  .reservation .reservation-item .reservation-item-content .top-area {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    padding: 0 16px 8px;
    height: 168px;
    -webkit-align-content: flex-end;
        -ms-flex-line-pack: end;
            align-content: flex-end;
  }
  .reservation .reservation-item .reservation-item-content .top-area .name {
    margin: 0;
    width: 100%;
    font-size: 2rem;
    line-height: 1.7;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .reservation .reservation-item .reservation-item-content .top-area .name a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .reservation .reservation-item .reservation-item-content .address {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    position: relative;
    font-size: 1.2rem;
    line-height: 1.5;
  }
  .reservation .reservation-item .reservation-item-content .address span {
    padding-left: 0 !important;
    width: 100%;
    display: block;
  }
  .reservation .reservation-item .reservation-item-content .address span::before {
    display: none;
  }
  .reservation .reservation-item .reservation-item-content .detail-area {
    margin-top: 168px;
    padding: 0;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info {
    width: 100%;
    color: #333333;
    font-size: 1.2rem;
    text-shadow: none;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item:not(:last-child) {
    margin-bottom: 8px;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .detail-title {
    width: 100%;
    color: #757575;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .detail-title::after {
    display: none;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .date {
    margin: 0;
    width: 146px;
    color: #333333;
    font-size: 1.2rem;
    font-weight: 700;
    text-shadow: none;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .time {
    font-size: 1.2rem;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .detail-info .info-item .time span:not(:last-child) {
    margin-right: 8px;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area {
    width: 100%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .amount-area {
    margin: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    text-shadow: none;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .amount-area .amount-title {
    margin-right: 8px;
    color: #757575;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .amount-area .amount {
    font-size: 2rem;
    color: #333333;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area a {
    margin: 0 0 8px;
    color: #0F0A64;
    font-size: 1.4rem;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .detail-link {
    display: inline-block;
    margin: 0;
    padding: 8px 14px;
    border: 1px solid #0F0A64;
    border-radius: 4px;
    line-height: 1;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .btn-review {
    max-width: 360px;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area #buttonReceipt {
    border-color: #0F0A64;
    height: 40px;
  }
  .accommodation-history .right-area .review .gtt-coupon.pc-only {
    display: none;
  }
  .reservation .reservation-item .icon-favorite, .reservation .reservation-item .icon-favorite-on {
    top: 16px;
    right: 16px;
  }
  .reservation .reservation-item .write-review-area {
    width: 100%;
    padding: 0 16px 16px;
    border-radius: 0 0 8px 8px;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    position: relative;
  }
  .reservation .reservation-item .write-review-area a {
    width: 100%;
  }
  .reservation .reservation-item .write-review-area p {
    margin-left: 0;
    font-size: 1.2rem;
    font-weight: 400;
  }
  .reservation .cancel-area .cancel-item {
    padding: 8px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation .cancel-area .cancel-item p:last-child {
    color: #757575;
    font-size: 1rem;
    text-align: right;
  }
  .reservation .cancel-area .cancel-item p:last-child span {
    margin: 0;
    display: block;
    color: #333333;
    font-size: 1.6rem;
  }
  .reservation .reservation-none {
    padding: 16px 0 12px 0;
    background-color: transparent;
    text-align: center;
  }
  .reservation .reservation-none a {
    margin-top: 24px;
    width: 100%;
  }
  .reservation .see-more-link {
    margin-top: 24px;
  }
  .reservation .app-banner {
    margin-top: 80px;
  }
  .accommodation-history .reservation-item {
    margin-bottom: 16px;
  }
  .accommodation-history .reservation-item.review-long-item .write-review-area {
    border-top: 4px solid #F5F5F5;
    padding-top: 8px;
  }
  .accommodation-history .reservation-item.review-long-item .write-review-area a {
    margin-top: 8px;
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2;
  }
  .accommodation-history .reservation-item.review-long-item .write-review-area p {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1;
  }
  .accommodation-history .review {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .accommodation-history .right-area .btn-review {
    width: 100%;
    border: none;
  }
  .reservation-info-modal {
    overflow: hidden;
  }
  .reservation-info-modal .modal-container {
    padding-bottom: 0;
  }
  .reservation-info-modal .modal-container .content-body {
    margin-top: 0;
    height: calc(100% - 60px) !important;
  }
  .reservation-info-modal .modal-container .content-body.canceled-modal {
    height: 100% !important;
  }
  .reservation-info-modal .modal-container .content-body.no-btn-group-area {
    height: calc(100% - 16px) !important;
  }
  .reservation-info-modal .modal-container .content-body.scroll-on {
    margin-right: -16px;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-left {
    width: 100%;
    font-size: 1.2rem;
    font-weight: 900;
    margin-bottom: 8px;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right {
    width: 100%;
    font-size: 1.6rem;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .important-note {
    margin: 0;
    display: block;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details {
    padding: 8px 16px;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-left {
    width: 100%;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-left .charge-left-item {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-left .charge-left-item .name {
    text-align: left;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-left .charge-left-item .content {
    margin-left: 16px;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-right {
    margin-top: 16px;
    width: 100%;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-right .charge-right-item {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation-info-modal .modal-container .content-body .info-item .info-item-right .charge-details .charge-right .charge-right-item .list-asterisk {
    width: 100%;
  }
  .reservation-info-modal .modal-container .content-body .phone-num {
    color: #757575;
    text-decoration: underline;
  }
  .reservation-info-modal .modal-container .content-body .cancel-area .cancel-item {
    padding: 8px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation-info-modal .modal-container .content-body .cancel-area .cancel-item p:last-child {
    color: #757575;
    font-size: 1rem;
    text-align: right;
  }
  .reservation-info-modal .modal-container .content-body .cancel-area .cancel-item p:last-child span {
    margin: 0;
    display: block;
    color: #333333;
    font-size: 1.6rem;
    white-space: nowrap;
  }
  .reservation-info-modal .modal-container .delete-btn {
    padding: 0;
  }
  .reservation-info-modal .modal-container .delete-btn a {
    width: 100%;
  }
  .reservation-info-modal .modal-container .btn-group-area {
    height: 60px;
    padding: 0 16px;
    -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
            box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
  }
  .reservation-info-modal .modal-container .btn-group-area a {
    width: 50%;
  }
  .reservation-info-modal .modal-container .btn-group-area a:not(:last-child) {
    margin-right: 8px;
  }
  .reservation-info-modal .modal-container .btn-group-area.local-settlement a {
    width: 100%;
  }
  .reservation-info-modal .gtt-coupon-info {
    padding: 16px 8px;
  }
  .reservation-info-modal .gtt-coupon-info img {
    width: 108px;
    height: 108px;
  }
  .mail-share-modal .modal-container {
    margin: 0;
    height: 100%;
    max-height: none;
  }
  .mail-share-modal .modal-container .content-body {
    margin: 0 auto !important;
    height: 100%;
  }
  .mail-share-modal .modal-container .content-body > p {
    margin: 11px 0 36px;
    font-size: 1.4rem;
  }
  .mail-share-modal .modal-container .content-body .input-box-area {
    margin: 0 16px;
    max-height: none;
    height: calc(100% - 263px);
  }
  .mail-share-modal .modal-container .content-body .input-box-area .input-box {
    overflow: auto;
  }
  .mail-share-modal .scroll-on {
    margin-right: 0 !important;
  }
  .mail-share-modal .btn-group-area {
    padding: 16px;
    width: 100%;
  }
  .mail-share-modal .add-mail {
    margin-bottom: 24px;
    font-size: 1.6rem;
  }
  .mail-share-modal .mail-share-modal-close {
    width: 30px;
    height: 30px;
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    top: 9px;
    right: 16px;
    z-index: 53;
  }
  .deletion-confirmation-modal .modal-container {
    padding: 16px;
    width: 300px;
    height: auto;
    border-radius: 8px;
  }
  .deletion-confirmation-modal .modal-container .content-body > p {
    margin-bottom: 16px;
  }
  .reservation-canceled {
    height: 50px;
  }
  .reservation-canceled .reservation-canceled-text {
    font-size: 1.6rem;
  }
  .btn-group-area.local-settlement a {
    width: 100%;
    min-width: auto !important;
  }
}

@media (max-width: 500px) {
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .btn-box {
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .btn-box a {
    width: calc(50% - 5px) !important;
    margin-right: 10px;
    margin-left: 0 !important;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .btn-box a:last-child {
    margin-right: 0;
  }
  .reservation .reservation-item .reservation-item-content .detail-area .right-area .btn-review {
    margin: 0 auto 8px;
  }
}

@media (max-width: 360px) {
  .reservation-info-modal .gtt-coupon-info .d-flex.title {
    display: block;
    text-align: center;
  }
  .reservation-info-modal .gtt-coupon-info .d-flex.title .mr-16 {
    margin: 0;
  }
}

.mp-reservation .accommodation-history .right-area {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.mp-reservation .accommodation-history .btn-review {
  background-color: #0F0A64 !important;
  color: #fff !important;
  border-color: #c6c6c6 !important;
  width: 300px;
  padding: 0;
}

.mp-reservation .js-modal-trigger.sp-only {
  text-decoration: none;
}

@media screen and (max-width: 900px) {
  .mp-reservation .right-area .btn-review {
    width: 100%;
    height: 40px;
    font-size: 1.4rem !important;
  }
}

/*
@media (min-width: 1050px) {
  .mp-reservation {
    .reservation {
      &.accommodation-history {
        .reservation-item {
          .detail-info {
            height: 130px;
            position: relative;
            bottom: 3px;
          }
          .detail-area {
            margin-top: 43px;
          }
        }
      }
    }
  }
}
//Tab切り替え時のガタ付き防止用（Card自体のガタつき）
@media screen and (min-width: 768px) {
  .mp-reservation {
    .reservation {
      .reservation-item {
        height: 300px;
      }
    }
  }
}
*/

.alert-modal-guest .modal-container {
  background: none;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.alert-modal-guest .modal-container-inner {
  background: #fff;
  padding: 24px;
  border-radius: 8px;
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.2);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.2);
}

@media screen and (max-width: 767px) {
  .alert-modal-guest .modal-container {
    background: rgba(198, 198, 198, 0.7);
    padding: 0;
  }
  .alert-modal-guest .mypage-btn-double button {
    height: 40px;
  }
}

/*
  全国旅行支援
*/
.mp-reservation-body .reservation-info-modal .info-area {
  border-bottom: none;
}

.mp-reservation-body .reservation-info-modal .gtt-coupon-info .text-link {
  color: inherit;
}

.mp-reservation-body .reservation-info-modal .gtt-coupon-info a:after {
  background: url(/stcontents/img/common/icon-text-link-gray.svg) no-repeat 0 center;
}

.mp-reservation-body .bg-paleblue {
  background: #EDF7FF;
  padding: 8px 0;
}

.mp-reservation-body .bg-paleblue .text {
  padding: 0 8px;
  line-height: 1.5;
  color: #333;
}

.mp-reservation-body .detail-info .bg-paleblue {
  position: relative;
}

@media screen and (min-width: 768px) {
  .mp-reservation-body .zenkoku-date {
    min-height: 30px;
    background: #EDF7FF;
    padding-right: 10px;
    margin-bottom: 0 !important;
    line-height: 1.5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: unset !important;
    -webkit-align-items: unset !important;
        -ms-flex-align: unset !important;
            align-items: unset !important;
    border: 1px solid #999;
    border-bottom: none;
  }
  .mp-reservation-body .zenkoku-date > div,
  .mp-reservation-body .zenkoku-date > p {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .mp-reservation-body .zenkoku-date + .reservation-item {
    border: 1px solid #999;
    border-top: none;
  }
  .mp-reservation-body .zenkoku-label {
    min-height: 30px;
    background: #1973B7;
    padding: 0 10px;
    line-height: 1.8;
    font-size: 12px;
    color: #fff;
    white-space: nowrap;
  }
  .mp-reservation-body .zenkoku-text {
    margin-right: auto;
    padding: 0 10px;
  }
  .mp-reservation-body .zenkoku-date > p {
    white-space: nowrap;
  }
  .mp-reservation-body .icon_baloon {
    background: #1973B7;
    width: 133px;
    height: 44px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
    text-shadow: none;
    text-align: center;
    line-height: 1.4;
    font-weight: bold;
    font-size: 13px;
    margin-bottom: 16px;
    border-radius: 2px;
    letter-spacing: 0;
  }
  .mp-reservation-body .icon_baloon:after {
    content: "";
    display: inline-block;
    border: 4px solid transparent;
    border-top: 9px solid #1973B7;
    position: absolute;
    bottom: -12px;
    left: calc(50% - 2px);
  }
}

@media screen and (max-width: 900px) and (min-width: 768px) {
  .mp-reservation-body .zenkoku-date + .reservation-item {
    margin-bottom: 16px !important;
  }
  .mp-reservation-body .zenkoku-date + .reservation-item,
  .mp-reservation-body .reservation .reservation-item .bg-img {
    border-radius: 0 !important;
  }
}

@media screen and (max-width: 767px) {
  .mp-reservation-body .zenkoku-label,
  .mp-reservation-body .zenkoku-text {
    display: none !important;
  }
  .mp-reservation-body .reservation-item-content .tag-gtt {
    background: #1973B7;
    position: absolute;
    top: -2px;
    left: 0;
  }
  .mp-reservation-body .reservation-item-content .tag-gtt + .text {
    padding-top: 12px;
  }
  .mp-reservation-body .reservation-item-content .gtt {
    height: auto !important;
  }
}

.mp-reservation-body .modal-zenkoku {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

.mp-reservation-body .modal-zenkoku > div {
  display: block;
  max-width: 800px;
}

.mp-reservation-body .modal-zenkoku .modal-container {
  padding: 0 !important;
  overflow-y: auto;
}

.mp-reservation-body .modal-zenkoku .modal-container .wrap {
  max-width: 100%;
}

.mp-reservation-body .modal-zenkoku .btn-zenkoku-close {
  display: none;
}

.mp-reservation-body .modal-zenkoku h2 {
  margin: 30px 0 24px;
  text-align: center;
  font-size: 20px;
  letter-spacing: 0;
}

.mp-reservation-body .zenkoku-after-apply h3 {
  margin-bottom: 10px;
  font-size: 24px;
  color: #1973B7;
}

.mp-reservation-body .reservation-info-modal .gtt-coupon-info {
  padding: 16px 16px;
}

.mp-reservation-body .zenkoku-after-apply .charge-details {
  margin: 16px 0;
  padding: 24px 40px;
}

.mp-reservation-body .zenkoku-after-apply .charge-left-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.mp-reservation-body .zenkoku-after-apply .charge-left-item p {
  width: 30%;
  white-space: nowrap;
}

.mp-reservation-body .zenkoku-after-apply .charge-left-item p:first-child {
  width: 40%;
  text-align: left;
}

.mp-reservation-body .zenkoku-after-apply ul {
  padding-left: 1.5em;
}

.mp-reservation-body .zenkoku-after-apply ul li {
  list-style: disc;
  margin-bottom: 10px;
  font-size: 12px;
}

.mp-reservation-body .zenkoku-after-apply .gotoAgreeBtn {
  padding: 0 0 10px;
  font-weight: bold;
  letter-spacing: 0;
}

.mp-reservation-body .zenkoku-after-apply .gotoAgreeBtn > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.mp-reservation-body .zenkoku-after-apply .gotoAgreeBtn.disabled {
  pointer-events: none;
  opacity: 0.2;
}

.mp-reservation-body .zenkoku-after-apply .gotoAgreeBtn label {
  width: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  float: none;
  font-size: 14px;
}

.mp-reservation-body .zenkoku-after-apply .gotoAgreeBtn input[type="checkbox"] {
  margin: -8px 5px 0 0;
  vertical-align: text-top;
  float: left;
  width: 20px;
  height: 20px;
}

.mp-reservation-body .zenkoku-after-apply .js-btn-modal-zenkoku,
.mp-reservation-body .zenkoku-after-apply .submitBtn {
  width: 300px;
  margin: 0 auto;
  color: #fff;
}

.mp-reservation-body .zenkoku-after-apply .submitBtn[disabled] {
  opacity: 0.2;
}

@media screen and (max-width: 767px) {
  .mp-reservation-body .zenkoku-after-apply {
    padding: 16px 16px !important;
  }
  .mp-reservation-body .zenkoku-after-apply .charge-details {
    padding: 0;
  }
  .mp-reservation-body .zenkoku-after-apply h3 {
    font-size: 16px;
    line-height: 1.5;
  }
  .mp-reservation-body .zenkoku-after-apply .charge-left-item p,
  .mp-reservation-body .zenkoku-after-apply .charge-left-item p:first-child {
    width: 50%;
  }
  .mp-reservation-body .zenkoku-after-apply .js-btn-modal-zenkoku,
  .mp-reservation-body .zenkoku-after-apply .submitBtn {
    width: 100%;
    font-size: 14px;
  }
  .mp-reservation-body .zenkoku-after-apply .js-btn-modal-zenkoku {
    height: 40px;
  }
  .mp-reservation-body .modal-zenkoku {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
  }
  .mp-reservation-body .modal-zenkoku .btn-zenkoku-close {
    display: block;
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    position: fixed;
    top: 10px;
    width: 30px;
    height: 30px;
    left: auto;
    right: 14px;
    text-shadow: none;
    font-weight: bold;
    font-size: 22px;
    color: #333;
    z-index: 100;
    line-height: 0;
    text-indent: -200px;
    overflow: hidden;
  }
  .mp-reservation-body .modal-zenkoku > div > h2:first-child {
    font-size: 16px;
    margin-bottom: 0;
  }
}

.reservation-notLoggedIn.wrap {
  padding-top: 24px;
  padding-bottom: 64px;
}

.reservation-notLoggedIn .title {
  margin-bottom: 24px;
}

.reservation-notLoggedIn .signup {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.reservation-notLoggedIn .signup .box {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background-color: #f5f5f5;
  margin-right: 24px;
  padding: 32px;
}

.reservation-notLoggedIn .signup .box:last-child {
  margin-right: 0;
}

.reservation-notLoggedIn .signup .input-icon-position {
  position: relative;
}

.reservation-notLoggedIn .signup .input-icon-position.error .login-input {
  border-color: #ce0000;
  margin-bottom: 4px;
}

.reservation-notLoggedIn .signup .input-icon-position.error + .error-text {
  display: block;
  color: #ce0000;
  margin-bottom: 16px;
}

.reservation-notLoggedIn .signup .input-icon-position img {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 12px;
  left: 9px;
}

.reservation-notLoggedIn .signup .input-icon-position img.password-eye {
  left: auto;
  right: 9px;
}

.reservation-notLoggedIn .signup .login-input {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-bottom: 16px;
  padding: 0 12px 0 41px;
  width: 100%;
  height: 48px;
  border: 1px solid #C6C6C6;
  border-radius: 4px;
}

.reservation-notLoggedIn .signup .login-input::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #C6C6C6;
}

.reservation-notLoggedIn .signup .login-input::-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #C6C6C6;
}

.reservation-notLoggedIn .signup .login-input::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #C6C6C6;
}

.reservation-notLoggedIn .signup .login-input:focus {
  outline: none;
}

.reservation-notLoggedIn .signup-title {
  color: #000000;
  font-size: 2rem;
  text-align: center;
  margin-bottom: 16px;
}

.reservation-notLoggedIn .login {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 400px;
  margin: 0 auto;
}

.reservation-notLoggedIn .signup-mail {
  width: 100%;
  margin-bottom: 24px;
}

.reservation-notLoggedIn .sns-title {
  color: #000000;
  text-align: center;
  margin-bottom: 16px;
}

.reservation-notLoggedIn .login-btn > a {
  width: 100%;
  height: 48px;
}

.reservation-notLoggedIn .forget-password {
  margin-top: 20px;
  display: block;
  text-align: center;
  text-decoration: underline;
}

.reservation-notLoggedIn .forget-password:hover {
  color: #000000;
}

.reservation-notLoggedIn .sns-btns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reservation-notLoggedIn .sns-btns .sns-btn {
  width: 50px;
  height: 50px;
  margin-right: 24px;
}

.reservation-notLoggedIn .sns-btns .sns-btn:last-child {
  margin-right: 0;
}

.reservation-notLoggedIn .sns-btns .sns-btn > a {
  width: 100%;
  height: 100%;
  border: 1px solid #ccc;
  border-radius: 2px;
  background-color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation-notLoggedIn .sns-btns .sns-btn > a:hover {
  opacity: .7;
}

@media screen and (max-width: 767px) {
  .reservation-notLoggedIn.wrap {
    padding-top: 16px;
    padding-bottom: 110px;
  }
  .reservation-notLoggedIn .title {
    font-size: 2.6rem;
    margin-bottom: 16px;
  }
  .reservation-notLoggedIn .signup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .reservation-notLoggedIn .signup .box {
    padding: 24px 16px;
    margin-right: 0;
    margin-bottom: 24px;
  }
  .reservation-notLoggedIn .signup .box:last-child {
    margin-bottom: 0;
  }
  .reservation-notLoggedIn .signup .input-icon-position {
    position: relative;
  }
  .reservation-notLoggedIn .signup .input-icon-position.error + .error-text {
    margin-bottom: 8px;
  }
  .reservation-notLoggedIn .signup .input-icon-position img {
    width: 16px;
    height: 16px;
    top: 16px;
    left: 8px;
  }
  .reservation-notLoggedIn .signup .input-icon-position img.password-eye {
    left: auto;
    right: 9px;
  }
  .reservation-notLoggedIn .signup .login-input {
    width: 100%;
    margin-bottom: 8px;
    padding-left: 32px;
  }
  .reservation-notLoggedIn .signup-title {
    font-size: 1.6rem;
  }
  .reservation-notLoggedIn .login {
    width: auto;
  }
  .reservation-notLoggedIn .sns-title {
    font-size: 1.6rem;
  }
  .reservation-notLoggedIn .forget-password {
    font-size: 1.4rem;
    margin-top: 16px;
  }
}

.reservation-resend.wrap {
  padding-top: 24px;
  padding-bottom: 160px;
}

.reservation-resend .title {
  margin-bottom: 24px;
}

.reservation-resend .lead {
  font-size: 1.6rem;
  margin-bottom: 24px;
}

.reservation-resend .input-box input {
  width: 100%;
  max-width: 480px;
}

.reservation-resend .submit-btn {
  margin-top: 40px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .reservation-resend.wrap {
    padding-top: 16px;
    padding-bottom: 80px;
  }
  .reservation-resend .title {
    font-size: 2.6rem;
    margin-bottom: 8px;
  }
}
.mb8 {
  margin-bottom: .8rem;
}

.mtb40 {
  margin: 4rem 0;
}

.mr16 {
  margin-right: 1.6rem;
}

.mt25 {
  margin-top: 2.5rem;
}

.mt40 {
  margin-top: 4rem;
}

.title-box {
  margin-bottom: .8rem;
}

@media screen and (max-width: 767px) {
  .box-banner img {
    width: 100%;
  }
}

.receipt.lb-disable-scrolling {
  overflow: hidden !important;
}

.receipt .receipt-name {
  width: 84% !important;
}

.receipt .receipt-price {
  width: 176px;
}

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

.receipt .receipt-counter span {
  display: inline-block;
}

.receipt .message {
  height: auto;
}

.receipt .input-checkbox {
  border-bottom: none;
}

.receipt .modal-on {
  -webkit-filter: blur(4px) !important;
          filter: blur(4px) !important;
}

.receipt .lb-caption {
  color: #333;
  font-weight: bold;
  letter-spacing: 0;
  background-color: rgba(255, 255, 255, 0.6);
}

.receipt .lb-image {
  border: none;
}

.receipt .lb-close {
  background-image: url(/stcontents/img/common/icon-close-2.svg);
  top: 24px;
  right: 16px;
}

.receipt .lb-dataContainer {
  display: none !important;
}

.receipt .common-modal img {
  max-width: 100%;
  height: auto;
}

@media (min-width: 768px) {
  .receipt .font-xx-large {
    font-size: 2.6rem;
  }
  .receipt .receipt-box {
    padding: 40px;
  }
  .receipt .receipt-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .receipt .receipt-content-left {
    width: calc(100% - 288px);
  }
  .receipt .receipt-content-left .input-box .color-gray-3 label {
    cursor: auto;
  }
  .receipt .receipt-sample {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .receipt .receipt-sample img {
    max-width: 224px;
    height: auto;
  }
  .receipt .receipt-sample-inner {
    position: relative;
    line-height: 1;
  }
  .receipt .receipt-sample-inner:hover {
    opacity: 0.7;
  }
  .receipt .receipt-sample-icon {
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .receipt .receipt-sample-sp {
    display: none;
  }
}

@media (max-width: 767px) {
  .receipt .receipt-content-left ul.font-large {
    font-size: 1.6rem;
  }
  .receipt .receipt-price {
    width: 160px !important;
  }
  .receipt .receipt-sample {
    display: none;
  }
  .receipt .lightboxOverlay {
    background-color: rgba(160, 160, 160, 0.8);
  }
  .receipt .lb-close {
    top: 8px;
    right: 8px;
    width: 40px;
    height: 40px;
  }
  .receipt .common-modal .modal-container.scroll-on .content-body {
    margin-right: 0;
    height: calc(100% - 37px);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .receipt-sample-modal .content-body {
    padding: 0 !important;
    margin: 0 !important;
  }
  .receipt-sample-modal .common-modal-title {
    height: auto !important;
  }
  .receipt-sample-modal img {
    width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 500px) {
  .receipt .common-modal .modal-container {
    padding-bottom: 0;
  }
  .receipt .common-modal .modal-container.scroll-on {
    padding-left: 0;
  }
  .receipt .common-modal .modal-container.scroll-on .content-body {
    padding-right: 16px;
    background: #F5F5F5;
  }
}

.receipt .submit-double-sp {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.receipt .submit-double-sp a {
  max-width: 172px;
}

.mp-member-info {
  /*pc*/
  /*sp*/
}

.form-validation .input-error-word,
.member-form-validation .input-error-word {
  display: none;
}

.form-validation .input-error-word.active,
.member-form-validation .input-error-word.active {
  display: block;
}

.form-validation .error-border,
.member-form-validation .error-border {
  border-color: #CE0000 !important;
}

.form-validation .postal-code-any, .form-validation .postal-code-require,
.member-form-validation .postal-code-any,
.member-form-validation .postal-code-require {
  display: none;
}

.form-validation .postal-code-any.active, .form-validation .postal-code-require.active,
.member-form-validation .postal-code-any.active,
.member-form-validation .postal-code-require.active {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.mp-member-info .content-edit .input-box .select-dropdown-search ul {
  position: relative;
  top: 8px;
  border: 1px solid #F5F5F5;
}

.mp-member-info input[type=text],
.mp-member-info input[type=number],
.mp-member-info input[type=tel],
.mp-member-info input[type=email] {
  width: 100%;
}

.mp-member-info input[type="radio"],
.mp-member-info input[type="checkbox"] {
  border: none;
}

.mp-member-info u {
  text-decoration: none;
  color: #CACACA;
}

.mp-member-info .options ul {
  width: 100%;
  position: absolute;
  top: 48px;
  left: 0;
  z-index: 1;
}

.mp-member-info .input-name-wrap {
  max-width: 528px;
}

.mp-member-info .input-name-wrap li {
  width: calc(50% - 8px);
}

.mp-member-info #postal-code {
  max-width: 126px !important;
}

.mp-member-info .content-edit .input-box .font-reward,
.mp-member-info .content-edit .input-box .font-attention,
.mp-member-info .content-edit .input-box .font-aupay-attention {
  color: #757575;
  font-size: 1.2rem;
  line-height: 1.5;
}
.mp-member-info .content-edit .input-box .js-show-point-later .font-reward {
  color: #333;
  font-size: 1.4rem;
}
.mp-member-info .content-edit .input-box .js-show-point-later .font-reward .reward,
.mp-member-info .content-edit .input-box .js-show-point-later .font-reward .js-show-cash-schedule-point {
  font-size: 1.6rem;
}

@media (max-width: 360px) {
  .mp-member-info #postal-code {
    max-width: 100px !important;
  }
}

.mp-member-info #home-address {
  max-width: 544px;
}

.mp-member-info #mail {
  max-width: 348px;
}

.mp-member-info #phone-number {
  max-width: 150px;
}

.mp-member-info #anniversary {
  max-width: 126px;
}

.mp-member-info #birth {
  max-width: 192px;
}

.mp-member-info .prefectures .options {
  max-width: 126px;
}

@media screen and (min-width: 768px) {
  .mp-member-info .main-title {
    margin-bottom: 16px;
  }
  .mp-member-info .btn-smaller {
    height: 48px;
  }
  .mp-member-info .content-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding-bottom: 160px;
    padding-top: 16px;
  }
  .mp-member-info .content-info dl.info-list {
    padding-bottom: 40px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    max-width: 534px;
  }
  .mp-member-info .content-info dl.info-list dt, .mp-member-info .content-info dl.info-list dd {
    margin-bottom: 16px;
  }
  .mp-member-info .content-info dl.info-list dt {
    width: 184px;
  }
  .mp-member-info .content-info dl.info-list dd {
    width: calc(100% - 184px);
  }
  .mp-member-info .content-info .edit-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 100%;
  }
  .mp-member-info .content-edit {
    max-width: 560px;
    padding-bottom: 160px;
  }
  .mp-member-info .content-edit .input-box {
    /*padding-bottom: 24px;*/
    max-width: 915px;
  }
  .mp-member-info .content-edit .input-box.prefectures {
    display: none;
  }
  .mp-member-info .content-edit .input-box.prefectures.active {
    display: block;
  }
  .mp-member-info .content-edit .input-box.phone-box.abs {
    padding-bottom: 91px;
  }
  .mp-member-info .content-edit .input-box .des {
    margin-top: -10px;
    margin-bottom: 18px;
  }
  .mp-member-info .content-edit .input-box input[type=text] {
    width: 100%;
  }
  .mp-member-info .content-edit .input-box input[type=text].birth {
    max-width: 159px;
  }
  .mp-member-info .content-edit .input-box input[type=text].postal-code {
    max-width: 96px;
  }
  .mp-member-info .content-edit .input-box input[type=text].home-address {
    max-width: 544px;
  }
  .mp-member-info .content-edit .input-box input[type=text].phone-number {
    max-width: 160px;
  }
  .mp-member-info .content-edit .input-box input[type=text].mail {
    max-width: 351px;
  }
  .mp-member-info .content-edit .input-box input[type=text].anniversary {
    max-width: 109px;
  }
  .mp-member-info .content-edit .input-box .check-box label {
    font-size: 1.6rem;
  }
  .mp-member-info .content-edit .input-box label {
    margin-right: 30px;
  }
  .mp-member-info .content-edit .input-box p:last-of-type.check-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mp-member-info .content-edit .input-box p:last-of-type.check-box label {
    margin-right: 0;
    margin-bottom: 8px;
    width: 33.3333%;
  }
  .mp-member-info .content-edit .input-box .input-area {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .mp-member-info .content-edit .input-box .input-area .double-input {
    width: 256px;
  }
  .mp-member-info .content-edit .input-box .input-area .double-input.first {
    margin-right: 32px;
  }
  .mp-member-info .content-edit .input-box .input-area .double-input input.text-double {
    width: 256px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown.prefectures {
    width: 106px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown .dropdown-select-button::before, .mp-member-info .content-edit .input-box .select-dropdown .dropdown-select-button::after {
    right: 5px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown .select-frame {
    color: #333;
  }
  .mp-member-info .content-edit .input-box .phone-number-before {
    position: relative;
  }
  .mp-member-info .content-edit .input-box .phone-number-before.abs {
    padding-bottom: 53px;
  }
  .mp-member-info .content-edit .input-box .phone-number-before .phone {
    display: none;
  }
  .mp-member-info .content-edit .input-box .phone-number-before .phone.active {
    display: block;
    padding-bottom: 20px;
  }
  .mp-member-info .content-edit .input-box .phone-number-before > .input-block.abs {
    position: absolute;
    top: 0;
    left: 136px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search {
    width: 288px;
    display: inline-block;
    position: relative;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .dropdown {
    display: none;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul, .mp-member-info .content-edit .input-box .select-dropdown-search li, .mp-member-info .content-edit .input-box .select-dropdown-search span {
    -webkit-user-select: none;
    -moz-user-select: none;
    /*firefox*/
    -ms-user-select: none;
        user-select: none;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul {
    margin: 0px;
    padding: 0px;
    width: 100%;
    max-height: 400px;
    border: 1px solid #C6C6C6;
    -webkit-box-shadow: none;
            box-shadow: none;
    display: none;
    list-style: none;
    z-index: 2;
    overflow: auto;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul li {
    padding-left: 36px;
    height: 40px;
    border: 1px solid #F5F5F5;
    border-top: none;
    background-color: #FFFFFF;
    font-size: 1.6rem;
    line-height: 40px;
    cursor: pointer;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul li span {
    color: #757575;
    font-size: 0.875rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul li:hover {
    background-color: #f5f5f5;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul li.active {
    background-color: #F3F8FD;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul li.title {
    padding-left: 11px;
    color: #757575;
    background-color: #FFFFFF;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: left;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search ul.active {
    display: block;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search span.select-frame {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding: 9px 16px;
    width: 100%;
    display: block;
    color: #333;
    cursor: pointer;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search span.select-frame.phone-txt {
    width: 126px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area {
    display: none;
    position: relative;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area.active {
    display: block;
    width: 100%;
    height: 40px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area.on {
    border-top-color: #0f0a64;
    border-left-color: #0f0a64;
    border-right-color: #0f0a64;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area img {
    top: 12px;
    left: 11px;
    position: absolute;
    cursor: pointer;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area input {
    padding: 12px 11px 11px 36px;
    font-size: 1.2rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area input ::-webkit-input-placeholder {
    font-size: 1.6rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area input :-ms-input-placeholder {
    font-size: 1.6rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area input ::-ms-input-placeholder {
    font-size: 1.6rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .search-area input ::placeholder {
    font-size: 1.6rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button::before, .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button::after {
    content: '';
    background-color: #333333;
    display: block;
    position: absolute;
    width: 14px;
    height: 2px;
    top: 50%;
    right: 5px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button.home::before, .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button.home::after {
    right: 12px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button.phone-btn::before, .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button.phone-btn::after {
    right: 14px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button::after {
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button.active::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search div.dropdown-select-button.active::after {
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .phone-btn {
    right: 162px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .dropdown-hidden {
    padding: 16px;
    -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
            box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
    display: none;
    width: 288px;
    height: 482px;
    left: 0;
    top: 56px;
    background: #FFF;
    z-index: 1;
    border-radius: 8px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search .dropdown-hidden.active {
    display: block;
  }
  .mp-member-info .content-edit .save-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

@media screen and (max-width: 767px) {
  .mp-member-info-sp {
    background-color: #fff;
  }
  .mp-member-info h2 {
    font-size: 2.6rem;
    font-weight: 100;
    text-align: left;
  }
  .mp-member-info .btn-small {
    /*height: 48px;*/
  }
  .mp-member-info .js-half-modal-container {
    height: 101%;
    border-radius: 0;
  }
  .mp-member-info .js-half-modal-container.hide {
    display: none;
  }
  .mp-member-info .js-half-modal-container .half-modal-head {
    padding: 11px 0;
  }
  .mp-member-info .js-half-modal-container .js-half-modal-close {
    top: -1px;
    right: 16px;
  }
  .mp-member-info .main-title {
    margin-top: 16px;
    margin-bottom: 8px;
  }
  .mp-member-info .content-info {
    /*padding-bottom: 80px;*/
  }
  .mp-member-info .content-info dl.info-list {
    padding-bottom: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    font-size: 1.2rem;
  }
  .mp-member-info .content-info dl.info-list dt, .mp-member-info .content-info dl.info-list dd {
    margin-bottom: 16px;
  }
  .mp-member-info .content-info dl.info-list dt {
    padding-top: 5px;
    margin-right: 16px;
    width: 20%;
  }
  .mp-member-info .content-info dl.info-list dd {
    width: calc(80% - 16px);
    font-size: 1.6rem;
  }
  .mp-member-info .content-info dl.info-list dd span {
    display: block;
  }
  .mp-member-info .content-info dl.info-list dd u {
    color: #C6C6C6;
    text-decoration: none;
  }
  .mp-member-info .content-edit {
    max-width: 400px;
  }
  .mp-member-info .content-edit .input-box input[type=text] {
    width: 100%;
  }
  .mp-member-info .content-edit .input-box input[type=text].birth {
    max-width: 169px;
  }
  .mp-member-info .content-edit .input-box input[type=text].postal-code {
    max-width: 109px;
  }
  .mp-member-info .content-edit .input-box input[type=text].phone-number {
    max-width: 160px;
  }
  .mp-member-info .content-edit .input-box input[type=text].anniversary {
    max-width: 109px;
  }
  .mp-member-info .content-edit .input-box input.text-double.first {
    margin-bottom: 23px;
  }
  .mp-member-info .content-edit .input-box .input-area .double-input.first {
    margin-bottom: 21px;
  }
  .mp-member-info .content-edit .input-box .radios {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mp-member-info .content-edit .input-box .radios label {
    margin-bottom: 14px;
    width: 100%;
  }
  .mp-member-info .content-edit .input-box .radios label:last-of-type {
    margin-bottom: 0;
  }
  .mp-member-info .content-edit .input-box p:last-of-type.check-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mp-member-info .content-edit .input-box p:last-of-type.check-box label {
    margin-right: 0;
    margin-bottom: 22px;
    width: 50%;
    font-size: 1.4rem;
  }
  .mp-member-info .content-edit .input-box p:last-of-type input.text-double {
    width: 100%;
  }
  .mp-member-info .content-edit .input-box .select-dropdown {
    min-width: 99px;
    width: auto;
  }
  .mp-member-info .content-edit .input-box .select-dropdown::before, .mp-member-info .content-edit .input-box .select-dropdown::after {
    content: '';
    background-color: #333333;
    display: block;
    position: absolute;
    width: 14px;
    height: 2px;
    top: 30%;
    right: 5px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }
  .mp-member-info .content-edit .input-box .select-dropdown::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown::after {
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown.active::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown.active::after {
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown .dropdown {
    padding-bottom: 8px;
    width: 106px;
    border-top: none;
    border-right: none;
    border-left: none;
    display: block;
    border-bottom: 1px solid #C6C6C6;
    color: #333;
    background-color: #ffffff;
    font-family: "Noto Sans JP","ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 1.4rem;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }
  .mp-member-info .content-edit .input-box .phone-number-before.sp-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .mp-member-info .content-edit .input-box .phone-number-before .select-dropdown-search {
    margin-right: 10px;
  }
  .mp-member-info .content-edit .input-box .phone-number-before .phone {
    display: none;
  }
  .mp-member-info .content-edit .input-box .phone-number-before .phone.active {
    display: block;
  }
  .mp-member-info .content-edit .input-box .phone-number-before > .input-block.abs {
    max-width: 160px;
    display: inline-block;
    vertical-align: top;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp {
    display: inline-block;
    position: relative;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp.phone {
    margin-right: 8px;
    width: 126px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown {
    display: none;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp ul, .mp-member-info .content-edit .input-box .select-dropdown-search-sp li, .mp-member-info .content-edit .input-box .select-dropdown-search-sp span {
    -webkit-user-select: none;
    -moz-user-select: none;
    /*firefox*/
    -ms-user-select: none;
        user-select: none;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp ul {
    margin: 0px;
    padding: 0px;
    width: 100%;
    border-radius: 0 0 4px 4px;
    border: 1px solid #C6C6C6;
    list-style: none;
    z-index: 2;
    overflow: auto;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp ul li {
    padding-left: 36px;
    height: 40px;
    border: 1px solid #F5F5F5;
    border-top: none;
    background-color: #FFFFFF;
    font-size: 1.6rem;
    line-height: 40px;
    cursor: pointer;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp ul li span {
    color: #757575;
    font-size: 0.875rem;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp ul li.active {
    background-color: #F3F8FD;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp ul li.title {
    padding-left: 11px;
    color: #757575;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: left;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .half-modal-content {
    height: calc(100% - 38px);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .search-wrap {
    padding: 0 16px 8px 16px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area {
    margin-top: 8px;
    position: relative;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area.on {
    border-top-color: #0f0a64;
    border-left-color: #0f0a64;
    border-right-color: #0f0a64;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area img {
    top: 15px;
    left: 11px;
    position: absolute;
    cursor: pointer;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area input {
    padding: 13px 12px 13px 36px;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button {
    width: 100%;
    cursor: pointer;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::before, .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::after {
    content: '';
    background-color: #333333;
    display: block;
    position: absolute;
    width: 14px;
    height: 2px;
    top: 50%;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::after {
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button.active::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .mp-member-info .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button.active::after {
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .mp-member-info .content-edit .input-box .font-reward,
  .mp-member-info .content-edit .input-box .font-attention,
  .mp-member-info .content-edit .input-box .font-aupay-attention {
    font-size: 1.2rem;
    line-height: 1.5;
  }
  .mp-member-info .content-edit .input-box .js-show-point-later .font-reward {
    font-size: 1.2rem;
  }
  .mp-member-info .content-edit .input-box .js-show-point-later .font-reward .reward,
  .mp-member-info .content-edit .input-box .js-show-point-later .font-reward .js-show-cash-schedule-point {
    font-size: 1.4rem;
  }
  .mp-member-info .content-edit .save-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .mp-member-info .half-modal-content {
    padding-top: 112px !important;
  }
  .mp-member-info .half-modal-head {
    position: static;
  }
  .mp-member-info .reserve-data-box-sp .half-modal-content {
    height: calc(100% - 220px);
  }
  .mp-member-info .half-modal-head-wrap {
    position: fixed;
    top: 0;
    width: 100%;
    background: #FFF;
  }
  .mp-member-info .js-fixed {
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
            box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid red;
  }
  .mp-member-info .home .js-half-modal-trigger {
    width: 242px !important;
  }
  .mp-member-info .input-name-wrap {
    display: block;
  }
  .mp-member-info .input-name-wrap li {
    width: 100%;
    max-width: 342px;
  }
}

.mp-member-info .hidden-form {
  opacity: 0;
  height: 0;
  overflow: hidden;
  padding: 0;
}

.mp-member-info .content-edit .input-box label {
  display: flex;
  align-items: center;
}

.mp-member-info .content-edit .input-box .input-label-default,
.mp-member-info .content-edit .aupay-box .aupay-label-default {
  cursor: default;
  pointer-events: none;
  display: flex;
  align-items: center;
}
.mp-member-info .content-edit .aupay-box .aupay-radio-disabled,
.mp-member-info .content-edit .aupay-box .aupay-label-disabled {
  color: #C6C6C6;
}

.mp-member-info .content-edit .aupay-box .aupay-radio-disabled {
  background: url("/stcontents/img/common/icon-radio-disabled.svg") no-repeat 0 center;
  background-size: contain;
  width: 24px;
  height: 24px;
}

.mp-change-password {
  /*pc*/
  /*sp*/
  /*sp*/
}

.mp-change-password .content {
  padding-bottom: 160px;
}

.mp-change-password .content .btn-smaller {
  height: 48px;
}

.mp-change-password .content .input-box {
  margin-right: auto;
  margin-left: auto;
  max-width: 368px;
}

.mp-change-password .content .input-box:nth-of-type(1) {
  margin-top: 16px;
}

.mp-change-password .content .input-box .input-content {
  position: relative;
}

.mp-change-password .content .input-box .icon-eye {
  left: auto;
}

.mp-change-password .content .input-box input {
  width: 100%;
}

.mp-change-password .content .input-box .password {
  max-width: 368px;
}

.mp-change-password .content .save-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 40px;
}

.mp-change-password .content .address-registered-wrap {
  text-align: center;
}

.mp-change-password .content .address-registered {
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

.mp-change-password .content .btn-wide {
  max-width: 368px;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .mp-change-password .content {
    padding-top: 16px;
  }
  .mp-change-password .content h2 {
    /*font-weight: 100;
        font-size: 2.6rem;
        text-align: left;*/
  }
  .mp-change-password .content .input-box {
    margin-top: 25px;
  }
  .mp-change-password .content .input-box:nth-of-type(1) {
    margin-top: 8px;
  }
  .mp-change-password .content .forgot-password {
    text-align: center;
  }
  .mp-change-password .content .save-btn {
    margin-top: 86px;
  }
  .mp-change-password .content .text-left-sp {
    text-align: left;
  }
  .mp-change-password .content .text-left-sp p {
    margin-bottom: 0;
  }
}

@media screen and (max-width: 599px) {
  .mp-change-password .content .input-box {
    margin-top: 25px;
  }
  .mp-change-password .content .address-registered-wrap {
    text-align: left;
  }
}

@media screen and (max-width: 414px) {
  .mp-change-password .address-registered {
    min-width: auto;
  }
}

@media screen and (min-width: 768px) {
  .mp-change-password .address-registered {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    min-width: 368px;
  }
}

.mp-reset-password .content {
  padding-bottom: 160px;
}

.mp-reset-password .content .btn-smaller {
  height: 48px;
}

.mp-reset-password .content .input-box {
  margin-right: auto;
  margin-left: auto;
  max-width: 400px;
  /*input {
        width: 100%;
      }*/
}

.mp-reset-password .content .input-box .input-content {
  position: relative;
}

.mp-reset-password .content .input-box .icon-eye {
  left: auto;
}

.mp-reset-password .content .input-box .btn-relux {
  width: 100%;
}

.mp-reset-password .content-inner form {
  /*max-width: 400px;*/
  max-width: 528px;
  margin-right: auto;
  margin-left: auto;
}

.mp-reset-password .content-inner form .input-box {
  /*max-width: 400px;*/
  max-width: 368px;
  margin-left: 0;
}

.mp-reset-password .content-inner form .input-box-name {
  max-width: 528px;
}

.mp-reset-password .content-inner form .js-btn-submit {
  width: 100%;
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.mp-reset-password .input-name-wrap li {
  width: 48.5%;
  /* 他の画面も上書きする */
}

.mp-reset-password .note {
  padding: 24px 150px;
  text-align: center;
  font-size: 16px;
  margin-top: 40px;
}

.mp-reset-password .note li {
  padding-left: 1em;
  text-indent: -1em;
}

.mp-reset-password .note-text {
  text-align: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.mp-reset-password .note-text li {
  font-size: 14px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-align: left;
}

@media screen and (min-width: 768px) {
  .mp-reset-password .content-inner .js-input-form .js-btn-submit {
    max-width: 300px !important;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .mp-reset-password .note {
    padding: 24px;
  }
}

@media screen and (max-width: 767px) {
  .mp-reset-password .input-name-wrap {
    display: block;
  }
  .mp-reset-password .input-name-wrap li {
    width: 100%;
  }
  .mp-reset-password .note {
    padding: 16px;
    text-align: left;
    margin-top: 24px;
  }
  .mp-reset-password .lead {
    max-width: 420px;
    margin-right: auto;
    margin-left: auto;
    text-align: left;
  }
}

.mp-setting {
  /*pc*/
  /*sp*/
}

.mp-setting .btn-list .bg-white a {
  color: #333333;
}

.mp-setting .content ul.btn-list li.disabled {
  border-radius: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  pointer-events: none;
}

.mp-setting .content ul.btn-list li.disabled .icon {
  opacity: 0.28;
}

.mp-setting .content ul.btn-list li.disabled p.font-x-large {
  color: #C6C6C6;
}

@media screen and (min-width: 768px) {
  .mp-setting .main-title {
    margin-bottom: 8px;
  }
  .mp-setting .content ul.btn-list {
    padding-top: 25px;
    height: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mp-setting .content ul.btn-list li {
    margin-right: 25px;
    margin-bottom: 25px;
    padding: 32px 24px 32px 60px;
    width: calc((100% - 50px) / 3);
    border: 1px solid #f5f5f5;
    border-radius: 8px;
    position: relative;
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    cursor: pointer;
  }
  .mp-setting .content ul.btn-list li:nth-of-type(3n) {
    margin-right: 0;
  }
  .mp-setting .content ul.btn-list li:hover {
    opacity: 0.7;
  }
  .mp-setting .content ul.btn-list li .icon {
    position: absolute;
    top: 39px;
    left: 24px;
  }
  .mp-setting .content ul.btn-list li.disabled p:first-child {
    margin-left: 36px;
  }
  .mp-setting .top-btn {
    margin-top: 40px;
    padding-bottom: 160px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

@media screen and (max-width: 767px) {
  .mp-setting .main-title {
    margin-top: 16px;
    margin-bottom: 8px;
  }
  .mp-setting .content ul.btn-list {
    padding-top: 15px;
    padding-bottom: 16px;
  }
  .mp-setting .content ul.btn-list li {
    margin-bottom: 8px;
    width: 100%;
    border: 1px solid #f5f5f5;
    border-radius: 8px;
    background-size: contain;
    position: relative;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
    cursor: pointer;
  }
  .mp-setting .content ul.btn-list li:nth-of-type(3n) {
    margin-right: 0;
  }
  .mp-setting .content ul.btn-list li a {
    display: block;
    padding: 16px 12.2% 16px 16.3%;
  }
  .mp-setting .content ul.btn-list li .icon {
    position: absolute;
    top: 24px;
    left: 8%;
  }
  .mp-setting .content ul.btn-list li.disabled p:first-child {
    margin-left: 9%;
  }
  .mp-setting .top-btn {
    margin-top: 40px;
  }
}

.mp-social-account-integration {
  /*pc*/
  /*sp*/
}

@media screen and (min-width: 768px) {
  .mp-social-account-integration .main-title {
    margin-bottom: 16px;
  }
  .mp-social-account-integration main {
    margin-bottom: 160px;
  }
  .mp-social-account-integration main .alignment-info-wrap {
    margin: 0 auto;
    max-width: 500px;
  }
  .mp-social-account-integration main .alignment-info {
    margin-bottom: 32px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    max-width: 330px;
  }
  .mp-social-account-integration main .alignment-info .img-area {
    width: 160px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .mp-social-account-integration main .alignment-info .img-area img {
    margin-right: 8px;
    width: 24px;
    height: 24px;
  }
  .mp-social-account-integration main .alignment-info .alignment {
    text-decoration: underline;
    cursor: pointer;
  }
  .mp-social-account-integration main .alignment-info .alignment.not {
    color: #333333;
    text-decoration: none;
    cursor: text;
  }
  .mp-social-account-integration .alert-modal .modal-container {
    max-width: 512px;
    border-radius: 8px;
  }
  .mp-social-account-integration .alert-modal .alert-modal-btn .btn-small {
    width: 176px;
  }
}

.mp-social-account-integration main .text-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.mp-social-account-integration main .text-area .label {
  width: 60px;
  padding-right: 10px;
  font-size: 1.4rem;
}

.mp-social-account-integration main .text-area .btn-connect {
  width: 124px;
  height: 40px;
  font-size: 1.4rem;
}

.mp-social-account-integration main .text-area .btn-disabled {
  background: #C6C6C6;
  border-color: #C6C6C6;
  color: #fff;
  opacity: 1;
}

.mp-social-account-integration .alignment-info-wrap form > div {
  /* max-width: 330px; */
  margin-right: auto;
  margin-left: auto;
}

.mp-social-account-integration .alignment-info-wrap form > .align-ponta-box,
.mp-social-account-integration .alignment-info-wrap form > .align-applepay-box {
  max-width: 100%;
  padding: 16px;
  border-radius: 8px;
  background: #FFFDDF;
  margin-bottom: 32px;
}

.mp-social-account-integration .alignment-info-wrap form > .align-applepay-box {
  border-radius: 2px;
  background: transparent;
  padding: 16px 16px 0;
}

.mp-social-account-integration .alignment-info-wrap form > .align-ponta-box > div,
.mp-social-account-integration .alignment-info-wrap form > .align-applepay-box > div {
  /* max-width: 330px; */
  margin: 0 auto;
}

.mp-social-account-integration .alignment-info-wrap form > .align-applepay-box .notice {
  max-width: 330px;
  text-align: right;
  margin: 8px auto 0;
  font-size: 1.2rem;
  color: #757575;
}

.mp-social-account-integration .alignment-info-wrap form > .align-ponta-box {
  margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
  .mp-social-account-integration .main-title {
    margin-top: 16px;
    margin-bottom: 25px;
    font-weight: 100;
    font-size: 2.6rem;
    text-align: left;
  }
  .mp-social-account-integration main .alignment-info-wrap {
    max-width: 500px;
    margin: 0 auto;
  }
  .mp-social-account-integration main .alignment-info {
    margin-bottom: 32px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.6rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .mp-social-account-integration main .alignment-info .img-area {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    width: 116px;
    margin-right: 16px;
  }
  .mp-social-account-integration main .alignment-info .img-area img {
    margin-right: 8px;
    width: 24px;
    height: 24px;
  }
  .mp-social-account-integration main .alignment-info .img-area span {
    white-space: nowrap;
  }
  .mp-social-account-integration main .alignment-info .alignment {
    text-decoration: underline;
    cursor: pointer;
  }
  .mp-social-account-integration main .alignment-info .alignment.not {
    color: #333333;
    text-decoration: none;
  }
  .mp-social-account-integration .alignment-info-wrap form > .align-ponta-box,
  .mp-social-account-integration .alignment-info-wrap form > .align-applepay-box {
    max-width: calc(100vw + 32px);
    margin: 0 -16px 32px -16px;
    border-radius: 0;
  }
  .mp-social-account-integration .alignment-info-wrap form > .align-applepay-box .notice {
    max-width: 100%;
  }
  .mp-social-account-integration .alignment-info-wrap form > .align-ponta-box {
    margin-bottom: 8px;
  }
  .mp-social-account-integration .alignment-info-wrap form > .align-ponta-box > div:first-child img {
    max-width: 100%;
  }
  .mp-social-account-integration .alignment-info-wrap form > div,
  .mp-social-account-integration .alignment-info-wrap form > .align-ponta-box > div {
    max-width: 100%;
  }
  .mp-social-account-integration main .text-area .btn-connect {
    width: 110px;
  }
  .mp-social-account-integration .alert-modal .modal-container {
    padding: 24px 16px;
    padding: 24px;
  }
  .mp-social-account-integration .alert-modal .modal-container .btn-small {
    height: 40px;
    font-size: 1.4rem;
    width: 130px;
  }
}

@media (max-width: 359px) {
  .mp-social-account-integration main .text-area .label {
    font-size: 1.3rem;
  }
  .mp-social-account-integration main .text-area .btn-connect {
    width: 96px;
    font-size: 1.3rem;
  }
}

.mp-withdrawal-procedure {
  /*pc*/
  /*sp*/
}

.mp-withdrawal-procedure .mp-content-wrap li {
  padding-left: 1em;
  text-indent: -1em;
}

.mp-withdrawal-procedure .mp-content-wrap li::before {
  content: "・";
}

.mp-withdrawal-procedure .input-error-word {
  display: none;
}

.mp-withdrawal-procedure .input-error-word.active {
  display: block;
}

@media screen and (min-width: 768px) {
  .mp-withdrawal-procedure main {
    margin-bottom: 160px;
  }
  .mp-withdrawal-procedure main .mp-content-wrap {
    max-width: 720px;
    margin-right: auto;
    margin-left: auto;
  }
  .mp-withdrawal-procedure main .stop-mail {
    text-decoration: underline;
  }
  .mp-withdrawal-procedure main .input-place .title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .mp-withdrawal-procedure main .input-place .title span {
    margin-right: 10px;
    position: relative;
    top: 6px;
  }
  .mp-withdrawal-procedure main .input-place .radio-area {
    width: 100%;
    margin-bottom: 16px;
  }
  .mp-withdrawal-procedure main .input-place .update-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mp-withdrawal-procedure main .input-place .update-btn p {
    margin-top: 8px;
    width: 100%;
    display: block;
    text-align: center;
  }
}

@media screen and (max-width: 767px) {
  .mp-withdrawal-procedure main .main-title {
    font-size: 2.4rem;
  }
  .mp-withdrawal-procedure main ul {
    margin-bottom: 24px;
  }
  .mp-withdrawal-procedure main .input-place .title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
    font-size: 1.6rem;
  }
  .mp-withdrawal-procedure main .input-place .title span {
    position: relative;
    top: 8px;
  }
  .mp-withdrawal-procedure main .input-place .radio-area {
    width: 100%;
    margin-bottom: 20px;
  }
  .mp-withdrawal-procedure main .input-place .update-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mp-withdrawal-procedure main .input-place .update-btn p {
    margin-top: 8px;
    width: 100%;
    display: block;
    text-align: center;
  }
}

.mp-mail-setting {
  /*pc*/
  /*sp*/
}

@media screen and (min-width: 768px) {
  .mp-mail-setting .main-title {
    margin-bottom: 16px;
  }
  .mp-mail-setting .content {
    margin-bottom: 160px;
  }
  .mp-mail-setting .content .items-wrap {
    margin: 0 auto;
    max-width: 520px;
  }
  .mp-mail-setting .content .item {
    margin-bottom: 24px;
  }
  .mp-mail-setting .content .item .title {
    margin-bottom: 8px;
  }
  .mp-mail-setting .content .item .option p {
    margin-top: 8px;
  }
  .mp-mail-setting .content .update-btn {
    margin-top: 72px;
  }
  .mp-mail-setting .content .warn-word {
    margin-top: 24px;
    margin-bottom: 54px;
  }
}

@media screen and (max-width: 767px) {
  .mp-mail-setting .main-title {
    margin-top: 16px;
    margin-bottom: 8px;
    font-weight: 100;
    font-size: 2.6rem;
    text-align: left;
  }
  .mp-mail-setting .content .item {
    margin-bottom: 24px;
  }
  .mp-mail-setting .content .item .title {
    margin-bottom: 8px;
  }
  .mp-mail-setting .content .item .option p {
    margin-top: 8px;
  }
  .mp-mail-setting .content .warn-word {
    margin-top: 24px;
    margin-bottom: 40px;
  }
}

.mp-future-reservation {
  /*pc*/
}

@media screen and (min-width: 768px) {
  .mp-future-reservation main .mp-content-wrap {
    max-width: 600px;
    text-align: center;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.my-page-top {
  padding-top: 0;
}

.my-page-top .member-info .member-info-item:not(:last-child) {
  border-right: 2px solid #F5F5F5;
}

.my-page-top .member-info .member-info-item.left-item {
  padding-right: 32px;
  width: 31%;
}

.my-page-top .member-info .member-info-item.center-item {
  padding: 0 32px;
  width: 28%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: flex-start;
      -ms-flex-line-pack: start;
          align-content: flex-start;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.my-page-top .member-info .member-info-item.right-item {
  padding-left: 32px;
  width: 41%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: flex-start;
      -ms-flex-line-pack: start;
          align-content: flex-start;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.my-page-top .member-info .member-info-item div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.my-page-top .member-info .member-info-item .help-area {
  position: relative;
}

.my-page-top .member-info .member-info-item .help-area .help-icon-btn {
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  position: relative;
  cursor: pointer;
}

.my-page-top .member-info .member-info-item .help-model {
  display: none;
}

.my-page-top .member-info .member-info-item .help-info-model {
  padding: 16px 16px 24px 16px;
  background-color: #FFFFFF;
  border-radius: 8px;
  -webkit-box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
  position: absolute;
  left: 0;
  text-align: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  z-index: 1;
}

.my-page-top .member-info .member-info-item .help-info-model .member-status-img {
  width: 352px;
  height: auto;
}

.my-page-top .member-info .member-info-item .help-info-model .right-link-btn {
  width: 100%;
  display: block;
  text-align: right;
}

.my-page-top .member-info .member-info-item .help-info-model .member-status-content {
  margin-bottom: 16px;
  width: 100%;
  position: relative;
}

.my-page-top .member-info .member-info-item .help-info-model .member-status-content a {
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 1.4rem;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount {
  padding-top: 16px;
  width: 100%;
  height: 136px;
  border-top: 2px solid #F5F5F5;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .info-item {
  width: 154px;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .info-item p {
  width: 100%;
  text-align: left;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .info-item p:nth-child(2) {
  border-bottom: 2px solid #C6C6C6;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .info-item p:not(:first-child) {
  text-align: right;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .status-up {
  width: 265px;
  height: 100%;
  background-color: #F5F5F5;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-content: center;
      -ms-flex-line-pack: center;
          align-content: center;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .status-up p {
  width: 100%;
}

.my-page-top .member-info .member-info-item .help-info-model .info-model-amount .status-up p span {
  margin: 0 4px;
}

.my-page-top .member-info .member-info-item .au-pass span {
  color: #EB5505;
}

.my-page-top .member-info .member-info-item .au-pass .help-info-model {
  width: 332px;
}

.my-page-top .member-info .member-info-item .member-status {
  margin-bottom: 16px;
}

.my-page-top .member-info .member-info-item .member-status .help-area .help-info-model {
  padding: 24px;
  width: 974px;
}

.my-page-top .member-info .member-info-item .list-asterisk {
  display: block;
  text-align: left;
  width: 100%;
}

.my-page-top .member-info .member-info-item .list-asterisk p {
  margin-bottom: 0;
}

.my-page-top .member-info .member-info-item .status {
  padding: 4px 0;
  background-color: #F5F5F5;
  border-radius: 4px;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.my-page-top .member-info .member-info-item .status .amount {
  margin: 0 4px;
}

.my-page-top .member-info .member-info-item .status .member-status {
  margin: 0 4px;
}

.my-page-top .member-info .member-info-item .au-pass-benefits a {
  /*color: $smartPassFontColor;*/
  color: #CD4C11;
}

.my-page-top .member-info .member-info-item .au-pass-benefits a::after {
  margin-left: 10px;
  margin-bottom: -1px;
  width: 8px;
  height: 12px;
  background: url(/stcontents/img/common/icon-text-link-orange.svg) no-repeat 0 center;
  content: "";
  display: inline-block;
}

.my-page-top .member-info .member-info-item .au-pass-benefits a:hover {
  text-decoration: underline;
}

.my-page-top .member-info .member-info-item .coupon {
  width: 100%;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-top .member-info .member-info-item .coupon-note {
  margin: 16px 0;
  /*margin: 22px 0; これは情報量が多い場合*/
  width: 100%;
}

.my-page-top .member-info .member-info-item .coupon-link {
  /*margin-top: 60px;  ※「あと00日で期限切れになります」文言がない場合はこの数値を当てはめる*/
  width: 100%;
  text-align: right;
}

.my-page-top .member-info .member-info-item .point {
  width: 100%;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-top .member-info .member-info-item .point-area {
  padding-right: 78px;
  width: 100%;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.my-page-top .member-info .member-info-item .point-area .word {
  min-width: 61px;
}

.my-page-top .member-info .member-info-item .relux-point {
  margin: 10px 0;
  width: 100%;
  min-height: 36px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-top .member-info .member-info-item .ponta-point {
  width: 100%;
  min-height: 36px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.my-page-top .member-info .member-info-item .usage-history {
  margin-left: 8px;
}

.my-page-top .member-info .member-info-item .usage-history.modal-link-gray {
  pointer-events: none;
}

.my-page-top .member-info .member-info-item .usage-history-sp {
  width: 100%;
  text-align: right;
}

.my-page-top .member-info .coupon-block {
  position: relative;
}

.my-page-top .member-info .coupon-block .coupon-inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 24px 40px;
  border: 2px solid #F5F5F5;
}

.my-page-top .member-info .coupon-block .coupon-inner .border {
  font-weight: normal;
  color: #C6C6C6;
}

.my-page-top .member-info .coupon-block .coupon-inner > div {
  width: 33%;
}

.my-page-top .member-info .coupon-block .coupon-inner .icon-question {
  margin: 0;
  vertical-align: text-bottom;
}

.my-page-top .member-info .coupon-block .hotel-grade {
  background: #fff;
  padding: 24px 40px 32px;
  position: absolute;
  height: auto;
  left: 50%;
  top: inherit;
  bottom: -24px;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  border: 1px solid #F5F5F5;
  -webkit-box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  z-index: 2;
}

.my-page-top .member-info .coupon-block .hotel-grade > div p:last-of-type {
  margin-bottom: 0;
}

.my-page-top .member-info .coupon-block.no-ponta .hotel-grade {
  bottom: -46px;
}

.my-page-top .member-info .coupon-block .point-count + .point-count {
  margin-top: 8px;
}

.my-page-top .member-info .bnr-concierge {
  margin-left: auto;
  line-height: 0;
}
.my-page-top .member-info .bnr-concierge a:hover {
  opacity: 0.7;
}

@media (max-width: 1023px) {
  .my-page-top .member-info .coupon-block .coupon-inner > div:nth-child(2) .border:before {
    content: "";
    display: block;
  }
}

@media (max-width: 767px) {
  .my-page-top .member-info .coupon-block .coupon-inner {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    border: none;
    padding: 0;
  }
  .my-page-top .member-info .coupon-block .coupon-inner > div {
    width: 60%;
  }
  .my-page-top .member-info .coupon-block .coupon-inner > div:first-child {
    width: 40%;
    margin-bottom: 8px;
    padding-right: 24px;
  }
  .my-page-top .member-info .coupon-block .coupon-inner > div:first-child .timelimit {
    width: 40%;
    padding-right: 16px;
    position: absolute;
    bottom: 4px;
    left: 0;
    font-size: 1rem;
  }
  .my-page-top .member-info .coupon-block .coupon-inner > div:nth-child(2) {
    padding-left: 24px;
    border-left: 1px solid #F5F5F5;
  }
  .my-page-top .member-info .coupon-block .coupon-inner > div:last-child {
    margin-left: auto;
    padding-left: 24px;
    border-left: 1px solid #F5F5F5;
  }
  .my-page-top .member-info .coupon-block .coupon-inner .border {
    display: none;
  }
  .my-page-top .member-info .coupon-block .coupon-inner .color-gray-2 {
    font-weight: normal;
    color: inherit;
  }
  .my-page-top .member-info .coupon-block .coupon-inner .count {
    float: right;
    text-align: right;
  }
  .my-page-top .member-info .coupon-block .text-link-gray {
    padding-right: 12px;
    font-size: 1.2rem;
  }
  .my-page-top .member-info .coupon-block .text-link-gray:after {
    width: 7px;
    background-size: contain;
    top: 5px;
  }
  .my-page-top .member-info .coupon-block .hotel-grade {
    padding: 40px 24px 24px;
    bottom: -32px;
  }
  .my-page-top .member-info .coupon-block .hotel-grade:after {
    content: "×";
    position: absolute;
    top: 6px;
    right: 14px;
    font-size: 18px;
  }
  .my-page-top .member-info .coupon-block .hotel-grade div p:first-of-type {
    font-size: 1.4rem;
  }
  .my-page-top .member-info .coupon-block .hotel-grade div p:last-of-type {
    font-size: 1rem;
  }
  .my-page-top .member-info {
    margin-top: 16px;
  }
  .my-page-top .member-info .bnr-concierge {
    line-height: 1;
  }
  .my-page-top .member-info .bnr-concierge img {
    width: 100%;
    display: block;
    margin-top: 16px;
  }
}

@media (max-width: 360px) {
  .my-page-top .member-info .coupon-block .hotel-grade {
    bottom: -78px;
  }
}

.my-page-top .member-info-au .member-info-item .coupon-note {
  margin: 22px 0;
}

.my-page-top .member-info-au .member-info-item .relux-point {
  margin: 16px 0;
}

.my-page-top .sub-title {
  margin-top: 70px;
  margin-bottom: 16px;
}

.my-page-top .sub-title.mt-40 {
  margin-top: 40px;
}

.my-page-top .hotel-card-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.my-page-top .hotel-card-area .hotel-card-item {
  margin-right: 30px;
  width: calc(100% / 3);
  height: 200px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  position: relative;
}

.my-page-top .hotel-card-area .hotel-card-item:nth-child(3n) {
  margin-right: 0;
}

.my-page-top .hotel-card-area .hotel-card-item .card-item {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-radius: 8px;
  cursor: pointer;
}

.my-page-top .hotel-card-area .hotel-card-item .card-item::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  position: absolute;
  top: 0;
  left: 0;
}

.my-page-top .hotel-card-area .hotel-card-item .card-item:hover {
  opacity: 0.7;
}

.my-page-top .hotel-card-area .hotel-card-item .card-item-content {
  position: absolute;
  bottom: 18px;
  left: 16px;
}

.my-page-top .hotel-card-area .hotel-card-item .card-item-content .icon-grade {
  margin-left: 0;
  width: 20px;
  height: 20px;
  letter-spacing: 0;
  -webkit-filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.6));
          filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.6));
}

.my-page-top .hotel-card-area .hotel-card-item .card-item-content p {
  margin: 0;
  color: #FFFFFF;
  text-shadow: 1px 1px 1px #000000;
}

.my-page-top .hotel-card-area .hotel-card-item .icon-favorite, .my-page-top .hotel-card-area .hotel-card-item .icon-favorite-on {
  position: absolute;
  top: 21px;
  right: 21px;
  z-index: 1;
}

.my-page-top .date-none {
  padding: 23px 0 26px;
  background-color: #F5F5F5;
  text-align: center;
}

.my-page-top .to-top-btn {
  margin-top: 84px;
  margin-bottom: 80px;
  text-align: center;
}

.my-page-top .banner-pontapass {
  margin: auto;
}

.my-page-top .point-use-note li {
  margin-left: 1.5rem;
  text-indent: -1.5rem;
}

.point-modal .content-body.scroll-on,
.relux-point-modal .content-body.scroll-on {
  padding-right: 16px;
  overflow-y: auto;
}

.point-modal .content-body.scroll-on::-webkit-scrollbar,
.relux-point-modal .content-body.scroll-on::-webkit-scrollbar {
  width: 4px;
  height: 100%;
}

.point-modal .content-body.scroll-on::-webkit-scrollbar-thumb,
.relux-point-modal .content-body.scroll-on::-webkit-scrollbar-thumb {
  background-color: transparent;
  background-color: #C6C6C6;
}

.point-modal .content-body.scroll-on::-webkit-scrollbar-track,
.relux-point-modal .content-body.scroll-on::-webkit-scrollbar-track {
  background-color: #F5F5F5;
}

.point-modal .content-item,
.relux-point-modal .content-item {
  padding: 16px 0;
  border-bottom: 1px solid #C6C6C6;
  position: relative;
}

.point-modal .content-item .date,
.relux-point-modal .content-item .date {
  margin-bottom: 4px;
}

.point-modal .content-item .title,
.relux-point-modal .content-item .title {
  margin-bottom: 4px;
}

.point-modal .content-item .info,
.relux-point-modal .content-item .info {
  margin-bottom: 0;
}

.point-modal .content-item .amount,
.relux-point-modal .content-item .amount {
  font-weight: bold;
  position: absolute;
  top: 41px;
  right: 0;
}

.point-modal .content-item .amount-minus,
.relux-point-modal .content-item .amount-minus {
  color: #FF503E;
}

.point-modal .content-item.point-get,
.relux-point-modal .content-item.point-get {
  padding-bottom: 24px;
}

.point-modal .content-item-ponta,
.relux-point-modal .content-item-ponta {
  padding: 24px;
  position: relative;
  margin-bottom: 8px;
  background-color: #f5f5f5;
}

.point-modal .content-item-ponta .amount,
.relux-point-modal .content-item-ponta .amount {
  font-weight: bold;
  position: absolute;
  top: 24px;
  right: 24px;
}

.point-modal .point-expected .amount,
.relux-point-modal .point-expected .amount {
  color: #757575;
}

.point-modal .point-use .amount,
.relux-point-modal .point-use .amount {
  color: #FF503E;
}

.point-modal .point-get .amount,
.relux-point-modal .point-get .amount {
  color: #333;
}

.point-modal .title-area,
.relux-point-modal .title-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}

.point-modal .title-area .common-modal-title,
.relux-point-modal .title-area .common-modal-title {
  margin-bottom: 0;
}

.point-modal .help-area,
.relux-point-modal .help-area {
  position: relative;
}

.point-modal .help-area .help-icon-btn,
.relux-point-modal .help-area .help-icon-btn {
  margin-left: 8px;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  position: relative;
  cursor: pointer;
}

.point-modal .help-model,
.relux-point-modal .help-model {
  display: none;
}

.point-modal .help-info-model,
.relux-point-modal .help-info-model {
  padding: 16px 16px 24px 16px;
  width: 452px;
  background-color: #FFFFFF;
  border-radius: 8px;
  -webkit-box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 34px;
  left: 0;
  text-align: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  z-index: 1;
}

.point-modal .help-info-model .right-link-btn,
.relux-point-modal .help-info-model .right-link-btn {
  width: 100%;
  display: block;
  text-align: right;
}

.point-modal .content-item-details,
.relux-point-modal .content-item-details {
  padding: 16px 0;
}

.point-modal .content-item-details .point-detail,
.relux-point-modal .content-item-details .point-detail {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.point-modal .content-item-details .point-detail .amount,
.relux-point-modal .content-item-details .point-detail .amount {
  font-size: 1.6rem;
  color: #333;
  position: static;
}

.point-modal .content-item-details .point-detail table,
.relux-point-modal .content-item-details .point-detail table {
  color: #757575;
}

.point-modal .content-item-details .point-detail table th, .point-modal .content-item-details .point-detail table td,
.relux-point-modal .content-item-details .point-detail table th,
.relux-point-modal .content-item-details .point-detail table td {
  font-size: 1.4rem;
}

.point-modal .content-item-details .point-detail table td,
.relux-point-modal .content-item-details .point-detail table td {
  padding-left: 8px;
  text-align: right;
}

.point-modal .content-item-details .point-detail table th,
.relux-point-modal .content-item-details .point-detail table th {
  padding: 0 8px;
  font-size: 1.2rem;
}

.point-modal .common-modal .modal-container,
.relux-point-modal .common-modal .modal-container {
  padding-right: 16px;
}

.point-modal .common-modal .modal-container .content-body,
.relux-point-modal .common-modal .modal-container .content-body {
  margin-top: 0;
  height: 95%;
}

.point-modal .modal-container {
  padding: 24px;
}

.point-modal .modal-container .content-body {
  height: 89%;
}

.point-modal .content-body.scroll-on {
  padding: 0 40px;
  overflow-y: auto;
}

@media screen and (min-width: 768px) {
  .my-page-top .member-info .member-info-item .help-info-model {
    top: 34px;
  }
  .relux-point-modal .modal-container,
  .point-modal .modal-container {
    padding-right: 16px;
  }
  .relux-point-modal .modal-container .content-body,
  .point-modal .modal-container .content-body {
    height: 95%;
  }
  .relux-point-modal .content-item-details,
  .point-modal .content-item-details {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .relux-point-modal .content-item-details .point-detail,
  .point-modal .content-item-details .point-detail {
    display: block;
    padding-top: 30px;
  }
  .relux-point-modal .content-item-details .point-detail table th,
  .point-modal .content-item-details .point-detail table th {
    font-size: 1.4rem;
  }
  .relux-point-modal .content-item-details .point-detail table td,
  .point-modal .content-item-details .point-detail table td {
    font-size: 1.6rem;
  }
  .relux-point-modal .content-item-details .point-detail .amount,
  .point-modal .content-item-details .point-detail .amount {
    font-size: 2.0rem;
  }
}


@media screen and (max-width: 767px) {
  .my-page-top .modal-on {
    -webkit-filter: blur(4px);
            filter: blur(4px);
  }
  .my-page-top .user-name {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .my-page-top .member-info {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .my-page-top .member-info .member-info-item {
    padding: 0 !important;
    width: 100% !important;
    border-right: none !important;
    border-bottom: 4px solid #F5F5F5;
  }
  .my-page-top .member-info .member-info-item div.point-area {
    padding-right: 0;
    margin-bottom: 8px;
  }
  .my-page-top .member-info .member-info-item div.point-area.click-disable {
    display: block;
  }
  .my-page-top .member-info .au-pass {
    margin-bottom: 16px;
  }
  .my-page-top .member-info .au-pass span {
    /*font-size: $fontSize_12;*/
    font-size: 1.4rem;
  }
  .my-page-top .member-info .user-status {
    font-size: 1.4rem;
  }
  .my-page-top .member-info .list-asterisk {
    font-size: 1rem;
  }
  .my-page-top .member-info .status {
    margin-bottom: 8px;
    padding-left: 8px !important;
    -webkit-box-pack: center !important;
    -webkit-justify-content: center !important;
        -ms-flex-pack: center !important;
            justify-content: center !important;
  }
  .my-page-top .member-info .status .amount {
    font-size: 1.6rem;
  }
  .my-page-top .member-info .status .help-info-model {
    min-height: 340px;
  }
  .my-page-top .member-info .au-pass-benefits {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    margin-bottom: 16px;
  }
  .my-page-top .member-info .coupon {
    margin-top: 12px;
    margin-bottom: 8px;
  }
  .my-page-top .member-info .coupon .word {
    font-size: 1.6rem;
  }
  .my-page-top .member-info .coupon .num {
    font-size: 2rem;
  }
  .my-page-top .member-info .coupon-note {
    margin-top: 0 !important;
    margin-bottom: 8px;
    text-align: left;
  }
  .my-page-top .member-info .coupon-link {
    margin-top: 8px !important;
    margin-bottom: 16px;
  }
  .my-page-top .member-info .point {
    margin: 8px 0;
  }
  .my-page-top .member-info .point > span {
    font-size: 1.6rem;
  }
  .my-page-top .member-info .point .point-amount > span:nth-child(1) {
    font-size: 1.2rem;
  }
  .my-page-top .member-info .point .point-amount > span:nth-child(2) {
    font-size: 2rem;
  }
  .my-page-top .member-info .point .available-points {
    font-size: 2rem;
  }
  .my-page-top .member-info .point .point-amount.modal-on, .my-page-top .member-info .point .relux-point-amount.modal-on {
    -webkit-filter: unset;
            filter: unset;
  }
  .my-page-top .member-info .point .point-amount.modal-on::after, .my-page-top .member-info .point .relux-point-amount.modal-on::after {
    -webkit-filter: blur(4px);
            filter: blur(4px);
  }
  .my-page-top .member-info .point.active .point-amount::after, .my-page-top .member-info .point.active .relux-point-amount::after {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  .my-page-top .member-info .point.click-disable {
    pointer-events: none;
  }
  .my-page-top .member-info .point.click-disable .point-amount::after {
    display: none;
  }
  .my-page-top .member-info .point-area .relux-point {
    margin-top: 12px;
  }
  .my-page-top .member-info .point-area .relux-point, .my-page-top .member-info .point-area .ponta-point {
    min-height: 24px;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .my-page-top .member-info .point-area .relux-point > div > span, .my-page-top .member-info .point-area .ponta-point > div > span {
    min-width: 54px;
  }
  .my-page-top .member-info .point-area .point-right {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    text-align: right;
  }
  .my-page-top .member-info .point-area .point-right a {
    width: 100%;
    display: block;
  }
  .my-page-top .member-info .point-area .point-num {
    margin-right: 8px;
  }
  .my-page-top .member-info .point-area .point-date {
    font-size: 1.4rem;
  }
  .my-page-top .member-info .point-area.click-disable {
    border-top: none;
  }
  .my-page-top .member-info .help-area .help-icon-btn {
    width: 17px !important;
    height: 17px !important;
    pointer-events: auto;
  }
  .my-page-top .member-info .help-model {
    background-color: rgba(198, 198, 198, 0.7);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;
  }
  .my-page-top .member-info .help-info-model {
    margin: 0 auto;
    padding: 46px 16px 16px 16px !important;
    width: 100% !important;
    height: 100%;
    border-radius: 0  !important;
    overflow-y: auto;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
  }
  .my-page-top .member-info .help-info-model .help-info-model-close {
    width: 30px;
    height: 30px;
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    position: absolute;
    top: 16px;
    right: 16px;
  }
  .my-page-top .member-info .help-info-model .member-status-img {
    width: 274px !important;
  }
  .my-page-top .member-info .help-info-model .member-status-content {
    font-size: 1.4rem;
  }
  .my-page-top .member-info .help-info-model .member-status-content a {
    margin-top: 8px;
    width: 100%;
    position: relative !important;
    text-align: right;
  }
  .my-page-top .member-info .help-info-model .info-model-amount {
    min-height: 300px;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-align-content: flex-start;
        -ms-flex-line-pack: start;
            align-content: flex-start;
    -webkit-box-pack: center !important;
    -webkit-justify-content: center !important;
        -ms-flex-pack: center !important;
            justify-content: center !important;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .info-item {
    width: 100% !important;
    height: auto !important;
    -webkit-align-content: flex-start;
        -ms-flex-line-pack: start;
            align-content: flex-start;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .info-item p:nth-child(1) {
    margin-bottom: 0;
    width: 50%;
    color: #000000;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .info-item p:nth-child(2) {
    margin-bottom: 0;
    width: 50%;
    border-bottom: none !important;
    color: #000000;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .info-item p:nth-child(3) {
    margin-bottom: 0;
    font-size: 1.2rem;
    text-align: left !important;
  }
  .my-page-top .member-info .help-info-model .info-model-amount img {
    width: 24px;
    height: 24px;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .mark {
    margin: 15px 0 5px;
    width: 100%;
    height: 2px;
    background-color: #C6C6C6;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .status-up {
    margin-top: 16px;
    padding: 10px 0;
    width: 100% !important;
    height: auto !important;
    -webkit-flex-wrap: nowrap !important;
        -ms-flex-wrap: nowrap !important;
            flex-wrap: nowrap !important;
    letter-spacing: 0;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .status-up p {
    margin-bottom: 0;
    width: auto !important;
    color: #000000;
    font-size: 1.2rem;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .status-up p > span {
    font-size: 1.6rem;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .status-up img {
    width: 70px;
    height: 24px;
  }
  .my-page-top .member-info .help-info-model .info-model-amount .status-up > span {
    font-size: 1.2rem;
  }
  .my-page-top .hotel-card-area {
    margin: -16px;
    padding: 16px;
    overflow-x: auto;
  }
  .my-page-top .hotel-card-area .hotel-card-item {
    margin-right: 0;
    width: 290px;
    min-width: 290px;
    height: 140px;
  }
  .my-page-top .hotel-card-area .hotel-card-item:not(:last-child) {
    margin-right: 8px;
  }
  .my-page-top .hotel-card-area .hotel-card-item:last-child {
    width: 140px;
    min-width: 140px;
    background-color: #F5F5F5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .my-page-top .hotel-card-area .hotel-card-item:last-child::before {
    content: none;
  }
  .my-page-top .hotel-card-area .hotel-card-item .card-item-content {
    bottom: 11px;
    left: 8px;
  }
  .my-page-top .hotel-card-area .hotel-card-item .card-item-content p:last-child {
    width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .my-page-top .hotel-card-area .hotel-card-item .card-item-content .icon-grade {
    width: 12px;
    height: 12px;
    -webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.6));
            filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.6));
  }
  .my-page-top .hotel-card-area .hotel-card-item .icon-favorite, .my-page-top .hotel-card-area .hotel-card-item .icon-favorite-on {
    top: 11px;
    right: 11px;
  }
  .my-page-top .date-none {
    font-size: 1.6rem;
  }
  .my-page-top .hotel-item {
    margin-left: 0;
    margin-right: 0;
    border-left: none;
    border-top: none;
    border-right: none;
    border-bottom: 2px solid #F5F5F5;
  }
  .my-page-top .banner-pontapass {
    width: 100%;
  }
  .relux-point-modal .help-area .help-icon-btn {
    margin-left: 4px;
    width: 17px !important;
    height: 17px !important;
    pointer-events: auto;
  }
  .relux-point-modal .help-model {
    background-color: rgba(198, 198, 198, 0.7);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;
  }
  .relux-point-modal .help-info-model {
    margin: 0 auto;
    padding: 46px 16px 16px 16px !important;
    width: 344px !important;
    position: fixed !important;
    top: 30% !important;
    left: 0 !important;
    right: 0 !important;
  }
  .relux-point-modal .help-info-model .help-info-model-close {
    width: 30px;
    height: 30px;
    background-image: url(/stcontents/img/common/icon-close-4.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    position: absolute;
    top: 16px;
    right: 16px;
  }
  .relux-point-modal .modal-container {
    padding: 12px 8px 0 24px;
  }
  .relux-point-modal .title-area {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    line-height: 1.8;
  }
  .point-modal .modal-container {
    padding: 48px 0 16px 0;
  }
  .point-modal .content-body.scroll-on {
    padding: 0 16px;
  }
  .point-modal .content-item-ponta {
    padding: 8px;
  }
  .point-modal .content-item-ponta .title {
    margin-bottom: 4px;
  }
  .point-modal .content-item-ponta .amount {
    top: 8px;
    right: 8px;
  }
}

@media (max-width: 500px) {
  .relux-point-modal .common-modal .modal-container {
    padding: 12px 4px 24px 12px;
  }
}

@media (max-width: 340px) {
  .my-page-top .member-info .member-info-item .status {
    letter-spacing: 0;
    /*SE対策*/
  }
}

.my-page-top .name-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.my-page-top .user-name {
  margin-right: 16px;
  padding-right: 16px;
  border-right: 1px solid #F5F5F5;
  line-height: 1.5;
}

.my-page-top .member-status-top img {
  vertical-align: bottom;
}

.my-page-top .member-status-top .text-link {
  display: inline-block;
  margin: 0px 0 -2px 10px;
}

.my-page-top .member-status-top .smartpass-wrap .smartpass {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.my-page-top .member-status-top .smartpass-wrap .smartpass p {
  color: #CD4C11;
  margin-bottom: 0;
  font-weight: bold;
}

.my-page-top .member-status-top .smartpass-wrap .smartpass .icon-question {
  margin: 0 4px;
}

.my-page-top .member-status-top .smartpass-wrap .detail-smartpass.js-tips-content {
  background-color: #fff;
  position: relative;
  max-width: 700px;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
  padding: 16px;
  z-index: 3;
  text-align: center;
  width: 420px;
  position: absolute;
  top: inherit;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  border: 1px solid #f5f5f5;
}

.my-page-top .member-status-top .smartpass-wrap .detail-smartpass.js-tips-content .text-link {
  margin-bottom: 0;
}

.my-page-top .status-block {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin: 16px 0;
  padding: 24px 40px;
  border: 1px solid #F5F5F5;
}

.my-page-top .status-block .apply-date {
  background: #f3f8fd;
  text-align: center;
  margin-top: 10px;
  padding: 3px;
}

.my-page-top .status-bar {
  background: #F5F5F5;
  width: 448px;
  height: 40px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  line-height: 1.2;
  font-size: 1.2rem;
  color: #757575;
}

.my-page-top .status-bar > div {
  width: 25%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  position: relative;
}

.my-page-top .status-bar > div + div {
  border-left: 2px dashed #C6C6C6;
}

.my-page-top .status-bar > div p:first-child {
  width: 100%;
  margin-bottom: -4px;
  font-weight: bold;
}

.my-page-top .status-bar .target-num {
  margin-bottom: 0;
}

.my-page-top .status-bar.next-green .green {
  background: -webkit-linear-gradient(275deg, #81A754 50%, #688C3B 51%);
  background: linear-gradient(175deg, #81A754 50%, #688C3B 51%);
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 2px 0px 0px 2px;
  border-left: none;
  color: #fff;
}

.my-page-top .status-bar.next-green .green .target-num {
  display: none;
}

.my-page-top .status-bar.next-green .green p:first-child {
  margin-bottom: 0;
}

.my-page-top .status-bar.next-gold .green {
  display: none;
}

.my-page-top .status-bar.next-gold .gold {
  background: -webkit-linear-gradient(273deg, #D9B255 50%, #BA992E 51%);
  background: linear-gradient(177deg, #D9B255 50%, #BA992E 51%);
  width: 50%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 2px 0px 0px 2px;
  border-left: none;
  color: #fff;
}

.my-page-top .status-bar.next-gold .gold .target-num {
  display: none;
}

.my-page-top .status-bar.next-gold .gold p:first-child {
  margin-bottom: 0;
}

.my-page-top .status-bar.next-platinum .green,
.my-page-top .status-bar.next-platinum .gold {
  display: none;
}

.my-page-top .status-bar.next-platinum .platinum {
  background: -webkit-linear-gradient(272deg, #A6A9AA 50%, #757575 51%);
  background: linear-gradient(178deg, #A6A9AA 50%, #757575 51%);
  width: 75%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 2px 0px 0px 2px;
  border-left: none;
  color: #fff;
}

.my-page-top .status-bar.next-platinum .platinum .target-num {
  display: none;
}

.my-page-top .status-bar.next-platinum .platinum p:first-child {
  margin-bottom: 0;
}

.my-page-top .status-bar.next-diamond .green,
.my-page-top .status-bar.next-diamond .gold,
.my-page-top .status-bar.next-diamond .platinum {
  display: none;
}

.my-page-top .status-bar.next-diamond .diamond {
  background: -webkit-linear-gradient(272deg, #150F74 50%, #05023F 51%);
  background: linear-gradient(178deg, #150F74 50%, #05023F 51%);
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 2px 2px;
  border-left: none;
  color: #fff;
}

.my-page-top .status-bar.next-diamond .diamond .target-num {
  display: none;
}

.my-page-top .status-bar.next-diamond .diamond p:first-child {
  margin-bottom: 0;
}

.my-page-top .status-bar.next-diamond .diamond:after {
  display: none;
}

.my-page-top .status-bar .active:after {
  content: "";
  display: block;
  height: 0;
  width: 4px;
  position: absolute;
  top: 0;
  right: -14px;
  border: 10px solid transparent;
  border-top: 20px solid #F5F5F5;
  border-bottom: 20px solid #F5F5F5;
  z-index: 2;
}

.my-page-top .status-up {
  width: 270px;
  float: right;
  margin-top: 12px;
  padding: 4px 8px;
  border: 1px solid #ccc;
  border-radius: 20px;
  text-align: center;
  font-weight: 400;
  color: #757575;
}

.my-page-top .status-up.gold {
  border: 1px solid #D9B255;
  color: #BA992E;
}

.my-page-top .status-up.diamond {
  border: 1px solid #150F74;
  color: #150F74;
}

.my-page-top .status-end {
  margin-top: 12px;
  padding: 4px 8px;
  text-align: right;
}

.my-page-top .count-box {
  width: 360px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.my-page-top .count-box > div {
  position: relative;
  margin-right: 40px;
  letter-spacing: 0;
}

.my-page-top .count-box > div:first-child:after {
  content: "＋";
  position: absolute;
  top: 50%;
  right: -37px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 20px;
  font-weight: 900;
  color: #BFBFBF;
}

.my-page-top .count-box > div:nth-child(2):after {
  content: "＝";
  position: absolute;
  top: 50%;
  right: -37px;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 20px;
  font-weight: 900;
  color: #BFBFBF;
}

.my-page-top .count-box > div:last-child {
  margin-right: 0;
}

.my-page-top .count-box > div .count {
  margin-bottom: 0;
}

.my-page-top .count-box > div p:first-of-type {
  margin-bottom: 0;
}

.my-page-top .count-box > div sup {
  line-height: 0;
}

.my-page-top .link-detail {
  margin-top: 8px;
  text-align: right;
}

.my-page-top .link-detail a {
  text-decoration: underline;
  font-size: 1.4rem;
}

.my-page-top .link-detail a:hover {
  text-decoration: none;
}

.my-page-top .link-detail a:after {
  content: none;
}

.my-page-top .notice {
  width: 100% !important;
  margin-top: 10px;
  color: #757575;
  font-size: 1rem;
}

.my-page-top .notice sup {
  line-height: 0;
  font-size: 10px;
}

@media screen and (max-width: 1200px) {
  .my-page-top .status-block {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .my-page-top .status-block > div {
    width: 160px;
  }
  .my-page-top .status-block > div:nth-child(2) {
    width: 448px;
    margin-left: 30px;
  }
  .my-page-top .status-block > div:nth-child(3) {
    width: 100%;
  }
  .my-page-top .status-block .status-bar {
    width: 100%;
  }
  .my-page-top .count-box {
    margin-top: 20px;
  }
}

@media screen and (max-width: 767px) {
  .my-page-top .name-block {
    display: block;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 4px solid #F5F5F5;
  }
  .my-page-top .name-block .user-name {
    font-weight: bold;
    margin-right: 0;
    padding-right: 0;
    border-right: none;
  }
  .my-page-top .name-block .member-id {
    margin-bottom: 10px;
  }
  .my-page-top .member-status-top .smartpass-wrap .smartpass {
    margin-top: 8px;
    font-size: 14px;
  }
  .my-page-top .member-status-top .smartpass-wrap .detail-smartpass.js-tips-content {
    width: calc(100% - 32px);
    margin: 0 16px;
    left: 0;
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  .my-page-top .member-status-top .smartpass-wrap .detail-smartpass.js-tips-content:after {
    content: "×";
    position: absolute;
    top: 6px;
    right: 14px;
    font-size: 18px;
  }
  .my-page-top .member-status-top .text-link {
    display: block;
    margin: 16px 0;
    text-align: right;
  }
  .my-page-top .status-block {
    border: none;
    margin-bottom: 8px;
    padding: 0;
  }
  .my-page-top .status-block > div {
    width: 100%;
  }
  .my-page-top .status-block > div:first-child {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
  .my-page-top .status-block > div:first-child p {
    padding: 2px 4px;
    margin-bottom: 10px;
  }
  .my-page-top .status-block > div:first-child .font-small {
    font-size: 1rem;
  }
  .my-page-top .status-block > div:nth-child(2) {
    width: 100%;
    margin-left: 0;
  }
  .my-page-top .status-block .apply-date {
    margin: 0;
    padding: 2px 4px;
  }
  .my-page-top .status-up {
    width: auto;
    float: left;
  }
  .my-page-top .status-bar > div {
    width: 27%;
    font-size: 1rem;
  }
  .my-page-top .status-bar.next-gold .gold {
    width: 46%;
  }
  .my-page-top .count-box {
    width: 100%;
    margin: 16px 0;
    padding-bottom: 16px;
    border-bottom: 2px solid #F5F5F5;
  }
  .my-page-top .count-box > div {
    margin-right: 35px;
  }
  .my-page-top .count-box > div:first-child:after {
    right: -32px;
  }
  .my-page-top .count-box p:first-of-type {
    margin-bottom: 0;
  }
  .my-page-top .count-box .count {
    margin-bottom: 0;
  }
  .my-page-top .notice {
    margin-top: 0;
    padding-bottom: 24px;
    border-bottom: 4px solid #F5F5F5;
  }
  .my-page-top .notice .font-large {
    margin-bottom: 0;
    font-size: 1.2rem;
    color: #757575;
  }
  .my-page-top .notice .no-type {
    font-size: 1rem;
  }
}

@media screen and (max-width: 360px) {
  .my-page-top .count-box > div {
    margin-right: 25px;
  }
  .my-page-top .count-box > div:first-child:after {
    right: -22px;
  }
  .my-page-top .count-box > div:nth-child(2):after {
    right: -27px;
  }
  .my-page-top .count-box p {
    font-size: 1.1rem;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.review-complete-content .title {
  width: 100%;
}

.review-complete-content .title h1 {
  margin: 0;
  text-align: center;
}

.review-complete-content .content {
  text-align: center;
}

.review-complete-content .input-submit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/*pc*/
@media screen and (min-width: 768px) {
  .review-complete-content .title {
    margin-bottom: 16px;
  }
  .review-complete-content .content {
    margin-bottom: 40px;
  }
  .review-complete-content .input-submit {
    margin-bottom: 80px;
  }
  .review-complete-content .input-submit a {
    width: 300px;
  }
  .review-complete-content .hotel-image {
    margin-bottom: 160px;
    width: 100%;
    height: 521px;
    border-radius: 4px;
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  }
}


@media screen and (max-width: 767px) {
  .review-complete-content .title {
    margin-top: 24px;
  }
  .review-complete-content .content {
    margin-top: 24px;
  }
  .review-complete-content .input-submit {
    margin-top: 24px;
    margin-bottom: 80px;
  }
  .review-complete-content .input-submit a {
    width: 100%;
    text-align: center;
  }
  .review-complete-content .hotel-image {
    width: 100%;
    height: auto;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.review-confirm-content .title-grade {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.review-confirm-content .data-body {
  width: 100%;
  max-width: 904px;
}

.review-confirm-content .title-box {
  margin: 24px 0;
}

.review-confirm-content .title h1 {
  margin: 0;
}

.review-confirm-content ul {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

.review-confirm-content .inputs-submit {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.review-confirm-content .warning a {
  text-decoration: underline;
}

.review-confirm-content .warning a:hover {
  text-decoration: none;
}

.review-confirm-content .review-initial dt {
  position: relative;
}

.review-confirm-content .review-initial dt:after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 16px;
  background-color: #C6C6C6;
  position: absolute;
  top: 7px;
  right: -12px;
}

/*pc*/
@media screen and (min-width: 768px) {
  .review-confirm-content .satisfaction {
    margin-top: 8px;
  }
  .review-confirm-content .satisfaction p.title-satisfaction {
    margin-bottom: 17px;
  }
  .review-comment {
    margin-top: 40px;
  }
  .review-comment .title-comment {
    margin-bottom: 14px;
  }
  .review-comment .content-comment {
    margin-bottom: 14px;
  }
  .satisfaction-content {
    margin-top: 40px;
  }
  .satisfaction-content .title-satisfaction {
    margin-bottom: 16px;
  }
  .satisfaction-content .body-satisfaction {
    margin-bottom: 40px;
  }
  .message-content .title-message {
    margin-bottom: 16px;
  }
  .message-content .body-message {
    margin-bottom: 80px;
  }
  .inputs-submit {
    margin-bottom: 16px;
  }
  .inputs-submit > a:nth-child(2) {
    margin-left: 16px;
  }
  .inputs-submit a {
    width: 176px;
    text-align: center;
  }
  .warning {
    margin-bottom: 160px;
    text-align: center;
    /*a {
      text-decoration:underline;
    }*/
  }
}


@media screen and (max-width: 767px) {
  .review-confirm-content {
    margin-top: 24px;
  }
  .review-confirm-content .title {
    margin-bottom: 16px;
  }
  .review-confirm-content .review-comment {
    margin-top: 40px;
  }
  .review-confirm-content .review-comment .title-comment {
    margin-bottom: 14px;
  }
  .review-confirm-content .review-comment .content-comment {
    margin-bottom: 14px;
  }
  .review-confirm-content .title-satisfaction {
    margin-bottom: 16px;
  }
  .review-confirm-content .satisfaction-content {
    margin-top: 40px;
  }
  .review-confirm-content .satisfaction-content .body-satisfaction {
    margin-bottom: 40px;
  }
  .review-confirm-content .message-content .title-message {
    margin-bottom: 16px;
  }
  .review-confirm-content .message-content .body-message {
    margin-bottom: 40px;
  }
  .review-confirm-content .inputs-submit {
    margin-bottom: 16px;
  }
  .review-confirm-content .inputs-submit > a:nth-child(2) {
    margin-left: 2.2%;
  }
  .review-confirm-content .inputs-submit a {
    width: 48.9%;
    text-align: center;
  }
  .review-confirm-content .warning {
    margin-bottom: 84px;
    text-align: left;
  }
  .review-confirm-content .table-basic {
    border-top: 1px solid #C6C6C6;
    border-bottom: 1px solid #C6C6C6;
  }
  .review-confirm-content .table-basic td,
  .review-confirm-content .table-basic th {
    width: auto;
    display: table-cell;
    padding: 16px;
    border-bottom: 1px solid #C6C6C6;
  }
  .review-confirm-content .table-basic th {
    width: 25.6%;
    min-width: 140px;
    background: #FFF;
  }
  .review-confirm-content .review-initial dt:after {
    top: 4px;
  }
}

/* Color */
/* Font Size */
/* Font Weight */
.review-input-top-content .title-grade {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.review-input-top-content .title-box {
  margin-bottom: 8px;
}

.review-input-top-content .title-box h1 {
  line-height: 1.5;
}

.review-input-body-content {
  max-width: 1028px;
}

.review-input-body-content .title p {
  margin: 0;
  display: inline-block;
  vertical-align: middle;
}

.review-input-body-content .title p:nth-child(1) {
  background-color: #CE0000;
  border-radius: 2px;
}

.review-input-body-content .title p:nth-child(2) {
  text-align: center;
}

.review-input-comment-content {
  max-width: 1028px;
}

.review-input-comment-content .title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.review-input-comment-content .check-mark {
  padding-bottom: 17px;
}

.review-input-comment-content .check-mark span {
  display: inline;
}

.review-input-comment-content .text-box {
  width: 128px !important;
}

.review-input-comment-content .js-dropdown {
  width: 148px !important;
}

.review-input-comment-content .options ul li {
  border-bottom: 1px solid #f5f5f5;
}

.review-input-comment-content .options ul li:last-child {
  border-bottom: none;
}

.review-input-comment-content .options .select-frame {
  color: #C6C6C6;
}

.review-input-comment-content .options .select-frame.on {
  color: #333;
}

@media (max-width: 767px) {
  .review-input-comment-content .text-box,
  .review-input-comment-content .js-dropdown {
    width: 100% !important;
  }
}

.review-input-fullness-content {
  max-width: 1028px;
}

.review-input-fullness-content .title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.review-input-message-content {
  max-width: 1028px;
}

.review-input-message-content .confirm {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.data-items .data-item .item-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.data-items .data-item .item-title p:nth-child(1) {
  margin: 0;
  display: inline-block;
  vertical-align: middle;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.data-items .data-item .item-title p.warning {
  margin: 0;
  display: none;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: left;
  width: 100%;
}

.data-items .data-item .item-title p.warning.active {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.data-items .data-item.errored div.option {
  border: 1px solid #CE0000;
}

.data-items .data-item.errored div.option span {
  color: #CE0000;
}

.data-items .data-item.errored p.warning {
  display: block;
}

.item-options div.interval {
  width: 16.3%;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.item-options div.interval p {
  margin-top: 8px;
  width: 100%;
  font-weight: normal;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  color: #757575;
}

.item-options div.option {
  border: 1px solid #0F0A64;
  border-radius: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  cursor: pointer;
}

.item-options div.option span {
  color: #0F0A64;
  font-weight: bold;
  text-align: center;
}

.item-options div.active {
  background-color: #0F0A64;
}

.item-options div.active span {
  color: #FFFFFF;
}

.item-options div.disabled {
  border-color: #C6C6C6;
}

.item-options div.disabled span {
  color: #C6C6C6;
}

.item-checkmark {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.top-area .icon-label {
  text-shadow: none;
}

/* PC */
@media screen and (min-width: 768px) {
  .review-input-top-content .title {
    padding-bottom: 16px;
  }
  .review-input-top-content .icon-question {
    height: 24px;
  }
  .review-input-top-content .content {
    margin-bottom: 24px;
  }
  .review-input-top-content .title-box {
    margin-bottom: 16px;
  }
  .review-input-body-content {
    margin-top: 40px;
  }
  .review-input-body-content .title p:nth-child(1) {
    padding: 0 4px;
    width: 26px;
    height: 12px;
  }
  .review-input-body-content .data-items {
    width: 100%;
    max-width: 1080px;
    font-size: 0;
  }
  .review-input-body-content .data-items .data-item {
    padding-bottom: 32px;
    width: 43.9%;
    display: inline-block;
  }
  .review-input-body-content .data-items .data-item:nth-child(2n+1) {
    margin-right: 12%;
  }
  .review-input-body-content .data-items .data-item .item-title {
    margin-left: 11px;
    padding-bottom: 8px;
  }
  .review-input-body-content .data-items .data-item .item-title p:nth-child(1) {
    padding-right: 16px;
  }
  .review-input-body-content .data-items .data-item .item-title div:nth-child(2) img {
    padding-right: 9px;
    width: 22px;
    height: 22px;
  }
  .review-input-comment-content {
    margin-top: 54px;
    margin-bottom: 68px;
  }
  .review-input-comment-content .title {
    padding-bottom: 12px;
  }
  .review-input-comment-content .title span:nth-child(2) {
    margin-left: 8px;
  }
  .review-input-comment-content .title span:nth-child(2) u {
    display: inline;
    text-decoration: none;
  }
  .review-input-fullness-content {
    margin-bottom: 86px;
  }
  .review-input-fullness-content .title {
    margin-bottom: 12px;
  }
  .review-input-fullness-content .title span:nth-child(1) {
    margin-right: 8px;
  }
  .review-input-fullness-content .content {
    padding-bottom: 12px;
  }
  .review-input-message-content .title {
    padding-bottom: 16px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .review-input-message-content .title span:nth-child(1) {
    margin-right: 8px;
  }
  .review-input-message-content .warn {
    padding-bottom: 8px;
  }
  .review-input-message-content .check-mark {
    padding-bottom: 17px;
  }
  .review-input-message-content .confirm {
    margin-top: 106px;
    padding-bottom: 160px;
  }
  .review-input-message-content .confirm .btn-relux {
    width: 300px;
  }
  .item-options {
    width: 100%;
  }
  .item-options div.option {
    width: 56px;
    height: 56px;
  }
  .item-options div.option:hover {
    border: 1px solid #554B98;
  }
  .item-options div.option:hover span {
    color: #554B98;
  }
  .item-options div.option.active:hover {
    background-color: #554B98;
    border: 1px solid #554B98;
  }
  .item-options div.option.active:hover span {
    color: #FFFFFF;
  }
  .item-options div.option.disabled:hover {
    background-color: #FFFFFF;
    border-color: #C6C6C6;
  }
  .item-options div.option.disabled:hover span {
    color: #C6C6C6;
  }
  .options-long {
    max-width: 1002px;
    font-size: 0;
  }
  .options-long .interval {
    width: 8.4% !important;
  }
  .options-long .interval br {
    display: none;
  }
  .review-note {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
}


@media screen and (max-width: 768px) {
  .review-input-top-content {
    margin-top: 24px;
  }
  .review-input-top-content .title {
    padding-bottom: 8px;
    font-size: 2.6rem;
  }
  .review-input-top-content .icon-question {
    height: 20px;
  }
  .review-input-top-content .hotel-item {
    border: 1px solid #f5f5f5;
  }
  .review-input-top-content .content {
    margin-bottom: 16px;
    font-size: 1.6rem;
  }
  .review-input-top-content .title-box h1 {
    font-size: 2.6rem;
  }
  .review-input-body-content {
    margin-top: 32px;
  }
  .review-input-body-content .title p:nth-child(1) {
    padding: 2px 3px;
    width: 26px;
    height: 12px;
  }
  .review-input-comment-content {
    padding-bottom: 40px;
  }
  .review-input-comment-content .title {
    padding-bottom: 9px;
  }
  .review-input-comment-content .check-mark {
    padding-bottom: 18px;
  }
  .review-input-comment-content .check-mark span {
    margin-left: 4px;
  }
  .review-input-fullness-content .title {
    padding-bottom: 8px;
  }
  .review-input-fullness-content .item-options div.interval {
    width: 16.3%;
  }
  .review-input-message-content {
    margin-top: 40px;
  }
  .review-input-message-content .title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 8px;
  }
  .review-input-message-content .title .tag-any {
    margin-top: 11px;
    min-width: 34px;
  }
  .review-input-message-content .warn {
    margin-top: 8px;
    padding-bottom: 8px;
  }
  .review-input-message-content .warn span {
    padding-bottom: 4px;
  }
  .review-input-message-content .confirm {
    margin-top: 16px;
  }
  .review-input-message-content .confirm .btn-relux {
    width: 100%;
  }
  .review-initial input[type="text"] {
    width: 100%;
  }
  .review-initial .tag-require, .review-initial .tag-any {
    margin-right: 0 !important;
  }
  .data-items .data-item {
    width: 100%;
    font-size: 0;
    text-align: center;
  }
  .data-items .data-item .item-title {
    padding-bottom: 14px;
  }
  .data-items .data-item .item-title p:nth-child(1) {
    padding-right: 8px;
  }
  .data-items .data-item .item-title div:nth-child(2) img {
    padding-right: 4px;
    width: 22px;
    height: 22px;
  }
  .data-items .data-item .item-title div:nth-child(2) span {
    margin-left: 4px;
  }
  .item-options div.option {
    width: 48px;
    height: 48px;
  }
  .item-options div.last-option {
    padding: 0;
  }
  .item-options div.interval {
    width: 19.7%;
  }
  .interval .font-small {
    font-size: 1.0rem;
  }
}

.input-box input[type="checkbox"] {
  border-bottom: none;
}

/*pc*/
@media screen and (min-width: 768px) {
  .sp-only {
    display: none;
  }
}


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

.reservation {
  /* アコーディオンパーツ */
  /* キャンセルポリシー */
  /* キャンセル補償 */
  /* -----予約入力画面----- */
  /*textboxの仕様を更新次第、common.scssに移行させる*/
  /* -----予約確認画面----- */
  /* -----予約完了画面----- */
}

.reservation .message p {
  margin: 8.5px 0;
}

.reservation .global-footer {
  background: none;
  padding-bottom: 0 !important;
}

.footer-on .global-footer {
  background: #303233;
}

.reservation .mp-member-info .content-edit {
  padding-bottom: 0 !important;
}

.reservation .reserve-data-left {
  max-width: none;
  width: calc(100% - 384px);
}

.reservation .reserve-data-box .mb-6 {
  margin-bottom: 6px;
}

.reserve-data-box .point-now {
  font-weight: normal;
  font-size: 1.2rem;
}

.reserve-data-box .point-now-box {
  display: flex;
  width: 100%;
}

.reservation .reserve-data-box .accordion-content .d-flex,
.reservation .reserve-data-box .js-special-discount-content .d-flex {
  width: 270px;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.reservation .reserve-data-box .accordion-content .d-flex .font-heavy,
.reservation .reserve-data-box .js-special-discount-content .d-flex .font-heavy {
  width: 165px;
}

.reservation .reserve-data-box .js-special-discount-content .text-link {
  font-size: 1.4rem;
}

.reservation .reserve-data-box .input-box .check-disabled {
  color: #C6C6C6;
}

.reservation .gtt-alert {
  width: calc(100% - 384px);
  text-align: center;
  font-size: 2rem;
  font-weight: bold;
  color: #0F0a64;
  background: #fff;
  padding: 16px 24px;
  border: 1px solid #0F0a64;
  margin-bottom: 24px;
}

.reservation .reserve-data-right {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  width: 352px;
}

.reservation .reserve-data-right .right-info-hotel {
  background: url(https://rlx.jp/journal/wp-content/uploads/2016/08/RP22771_1100.jpg) no-repeat center center;
  background-size: cover;
  height: 194px;
  position: relative;
}

.reservation .reserve-data-right .right-info-hotel p {
  margin-bottom: 0;
  position: absolute;
  bottom: 16px;
  text-shadow: 1px 1px 1px #000;
}

.reservation .reserve-data-right .right-info-detail {
  max-height: 100vh;
  overflow-y: scroll;
  -ms-overflow-style: none;
  /* IE, Edge 対応 */
  scrollbar-width: none;
  /* Firefox 対応 */
}

.reservation .reserve-data-right .right-info-detail .text-link {
  color: #333;
}

.reservation .reserve-data-right .right-info-detail .js-accordion-open:after {
  background: url(/stcontents/img/common/icon-arrow-bottom-black-2.svg);
}

.reservation .reserve-data-right .right-info-detail .amount {
  display: inline-block;
  text-align: right;
  width: 207px;
  margin-left: 16px;
}

.reservation .reserve-data-right .right-info-detail .link-cancel-policy {
  width: 100%;
  text-align: center;
  padding: 8px 8px;
}

.reservation .reserve-data-right .right-info-detail .link-cancel-policy img {
  margin-left: 4px;
}

.reservation .reserve-data-right .right-info-detail .js-tips-content {
  background: #fff;
  width: 700px;
  position: absolute;
  bottom: 30px;
  right: 30px;
  padding: 24px 16px;
  border-radius: 8px 8px;
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
}

.reservation .reserve-data-right .right-info-detail .frame-flex-base dt {
  width: 62%;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
}

.reservation .reserve-data-right .right-info-detail .modal-link {
  font-size: 1.4rem;
  padding-right: 23px;
}

.reservation .reserve-data-right .right-info-detail .modal-link::after {
  width: 18px;
  height: 18px;
}

.reservation .reserve-data-right .right-info-detail::-webkit-scrollbar {
  display: none;
  /* Chrome, Safari 対応 */
}

.reservation .reserve-data-right .right-info-price {
  border-bottom: 1px solid #f5f5f5;
  position: relative;
  padding: 24px 24px 60px 24px;
}

.reservation .reserve-data-right .right-info-price .mb-8 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-right: 24px;
}

.reservation .reserve-data-right .right-info-price .mb-8:last-child {
  margin-bottom: 0;
}

.reservation .reserve-data-right .right-info-price .js-accordion-open {
  border-bottom: 0;
  margin-bottom: 8px;
}

.reservation .reserve-data-right .right-info-price .js-accordion-open:hover {
  opacity: .7;
  cursor: pointer;
}

.reservation .reserve-data-right .right-info-price .js-accordion-open:after {
  top: 12px;
  right: 0;
}

.reservation .reserve-data-right .right-info-price .bg-gray {
  padding: 8px 24px 16px 8px;
}

.reservation .reserve-data-right .right-info-price .bg-gray .detail {
  font-size: 1.2rem;
  margin-bottom: 16px;
}

.reservation .reserve-data-right .right-info-price .bg-gray .subtotal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 1px solid #c6c6c6;
  padding-top: 8px;
}

.reservation .reserve-data-right .right-info-price .amount {
  width: 205px;
  font-size: 1.4rem;
}

.reservation .reserve-data-right .right-info-price .total-price {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 1.6rem;
  font-weight: 700;
  padding: 16px;
}

.reservation .reserve-data-right .right-info-price .total-price span {
  font-size: 1.4rem;
  font-weight: 400;
}

.reservation .reserve-data-right .js-accordion-open {
  display: block;
  margin-bottom: 0;
  position: relative;
  border-bottom: 1px solid #F5F5F5;
}

.reservation .reserve-data-right .js-accordion-open:after {
  position: absolute;
  right: 24px;
  top: 30px;
}

.reservation .reserve-data-right .accordion-content {
  border-bottom: 1px solid #F5F5F5;
}

.reservation .cancel-policy .table-basic {
  border-top: 1px solid #C6C6C6;
  border-bottom: none;
}

.reservation .cancel-policy tr {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reservation .cancel-policy th {
  background: #FFF;
  border-bottom: 1px solid #C6C6C6;
  font-weight: normal;
  width: 55%;
}

.reservation .cancel-policy td {
  width: 45%;
  border-bottom: 1px solid #C6C6C6;
}

.reservation .input-box .label {
  margin-bottom: 8px;
}

.reservation .validate-dropdown .nice-select {
  float: none;
}

.reservation .cxl-insurance {
  border: 1px solid #0F0a64;
  padding: 16px;
  text-align: center;
}

.reservation .cxl-insurance p {
  text-align: center;
}

.reservation .cxl-insurance .title {
  color: #0F0A64;
  font-size: 1.6rem;
  font-weight: 900;
  text-align: center;
  margin-bottom: 8px;
}

.reservation .cxl-insurance .description {
  font-size: 1.4rem;
}

.reservation .cxl-insurance .description .color-gray-2 {
  margin-top: 8px;
  font-size: 1.2rem;
}

.reservation .cxl-insurance .note {
  text-align: left;
  margin: 0 auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reservation .cxl-insurance .btn-relux {
  width: 300px;
}

.reservation .cxl-insurance .cxl-insurance-detail {
  text-align: right;
}

.reservation .cxl-insurance.comp .title {
  font-size: 2rem;
}

.reservation .cxl-insurance.comp .description {
  font-size: 1.6rem;
}

.reservation .cxl-insurance.comp .btn-relux {
  font-size: 1.6rem;
}

.reservation .reserve-induction {
  background: #FFF;
  text-align: center;
  border: 1px solid #C6C6C6;
}

.reservation .reserve-induction div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation .reserve-induction div a {
  width: 160px;
}

.reservation .reserve-input-double {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.reservation .reserve-input-double li {
  width: 47.5%;
}

.reservation .reserve-input-double input {
  width: 100%;
}

.reservation .reserve-input-wide input {
  width: 100%;
  max-width: 470px;
}

.reservation .reserve-input-gender {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reservation .input-checkbox,
.reservation .input-radio {
  border-bottom: none !important;
}

.reservation .select-dropdown-country {
  width: 170px;
}

.reservation .select-dropdown-prefectures {
  width: 120px;
}

.reservation .js-check-acd-content {
  display: none;
}

.reservation .reserve-submit a {
  width: 343px;
}

.reservation .reserve-submit-double {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation .reserve-submit-double a, .reservation .reserve-submit-double button {
  width: 172px;
}

.reservation .reserve-complete {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
}

.reservation .reserve-complete .btn-relux,
.reservation .reserve-complete .btn-default {
  width: 343px;
  margin: 0 auto 16px;
}

.reservation .btn-complete-box {
  background: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 16px 16px 0;
  z-index: 2;
}

.reservation .btn-complete-box.no-zenkoku {
  display: none;
}

@media screen and (max-width: 767px) {
  .reservation .btn-complete-box {
    padding: 8px 16px;
    box-shadow: 0 0 8px rgba(0,0,0,0.15);
  }
  .reservation .btn-complete-box a {
    margin-bottom: 0 !important;
  }
}

.reservation .reserve-check-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.reservation .reserve-check-list li {
  width: 33.3%;
}

.reservation .reserve-child {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation .reserve-child-number {
  display: inline-block;
  width: 20px;
}

.reservation .submit-box {
  -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
          box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
}

.reservation .content-scroll {
  border-bottom: 1px solid #F5F5F5;
}

.reservation .common-modal {
  max-width: 920px;
}

.reservation .stay-table {
  margin-top: 16px;
  font-size: 1.4rem;
}

.reservation .stay-table th {
  font-weight: bold;
}

.reservation .stay-table th, .reservation .stay-table td {
  padding-bottom: 16px;
}

.reservation .stay-table th:last-of-type, .reservation .stay-table td:last-of-type {
  font-size: 1.6rem;
  text-align: left;
}

.reservation .stay-table th:first-child {
  width: 63px;
}

.reservation .stay-table th:nth-child(2) {
  width: 60px;
}

.reservation .stay-table th:last-child {
  width: calc(100% - 123px);
  text-align: left;
}

.reservation .stay-table td .js-spinner-btn {
  margin-right: 14px;
}

.reservation .stay-table td .js-spinner-btn:last-of-type {
  margin-right: 0;
  margin-left: 14px;
}

.reservation .stay-table .spinner-area input {
  font-size: 1.6rem;
}

.reservation .stay-table .stay-num,
.reservation .stay-table .reserve-child-number {
  margin-left: 49px;
  display: inline-block;
  width: 20px;
  text-align: center;
}

.reservation .stay-table .reserve-child-type {
  display: inline-block;
  padding-left: 49px;
}

.reservation .select-dropdown.options {
  width: 104px;
}

.reservation .select-dropdown.options .dropdown-select-button {
  width: 48px;
  height: 48px;
  background: none;
  border-radius: 0 4px 4px 0;
  position: absolute;
  top: 0;
  right: 4px;
}

.reservation .user-data-edit,
.reservation .reserve-data-edit,
.reservation .coupon-data-edit {
  display: none;
}

.reservation .link-cancel-policy {
  width: 40%;
  letter-spacing: 0;
}

.reservation .link-cancel-policy a {
  font-weight: bold;
  color: #757575 !important;
}

.reservation .link-cancel-policy img {
  vertical-align: middle;
  margin: -1px 0 0;
}

.reservation .total-price-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  border-top: 4px solid #F5F5F5;
}

.reservation .total-price-box > div {
  width: 60%;
}

.reservation .total-price-box.float-bar {
  position: fixed;
  border-radius: 16px 16px 0 0;
  border: none;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.reservation .total-price-box .total-price-wrap {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reservation .total-price-box .total-price-wrap .text-link {
  width: auto !important;
  position: relative;
  top: 0 !important;
  color: #333 !important;
  font-size: 2rem;
}

.reservation .total-price-box .total-price-wrap .text-link.active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.reservation .total-price-box .js-half-modal-trigger {
  text-align: left;
  display: block;
}

.reservation .total-price-box .js-half-modal-trigger .color-gray-2 {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reservation .total-price-box .js-half-modal-trigger .color-gray-2 span {
  font-size: 1rem;
  font-weight: 400;
}

.reservation .total-price-box .right-info-price {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-top: 16px;
  font-size: 1.4rem;
}

.reservation .total-price-box .right-info-price dt, .reservation .total-price-box .right-info-price dd {
  width: 50%;
  margin-bottom: 8px;
}

.reservation .total-price-box .right-info-price dd {
  text-align: right;
}

.reservation .total-price-box .js-half-modal-container._slideUp {
  display: block;
  opacity: 1;
  bottom: -121px;
  -webkit-animation: none;
          animation: none;
}

.reservation .total-price-box .js-half-modal-container._slideUp .js-half-modal-close {
  width: 60px;
}

.reservation .total-price-box .js-half-modal-container._slideUp .js-half-modal-close:after {
  position: relative;
  border: none;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  top: -2px;
  right: 0;
  left: inherit;
}

.reservation .total-price-box .js-half-modal-container._slideUp .js-half-modal-close:before {
  content: none;
}

.reservation .reserve-float-bar.static {
  position: relative;
  -webkit-transform: none;
          transform: none;
}

.reservation .cancel-policy-modal {
  background: #fff;
  position: fixed;
  top: 50%;
  left: 50%;
  bottom: inherit;
  right: inherit;
  width: calc(100vw - 32px);
  height: 83%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 8px;
  overflow: auto;
  font-size: 1.2rem;
}

.reservation .cancel-policy-modal .modal-container {
  position: relative;
}

.reservation .cancel-policy-modal .js-modal-close.float {
  background-image: url(/stcontents/img/common/icon-close-4.svg);
  top: 10px;
  width: 30px;
  height: 30px;
  right: 14px;
}

.reservation .cancel-policy-modal .modal-container .js-half-modal-close {
  right: 7px;
}

.reservation .link-cancel-policy {
  text-align: left;
}

.reservation .half-modal-content .total-price-box {
  border-top: none;
}

.reservation .half-modal-content .color-gray-2 {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reservation .half-modal-content .color-gray-2 span {
  font-size: 1rem;
  font-weight: 400;
}

.reservation .half-modal-content .right-info-price dt {
  padding-left: 8px;
  text-align: left;
}

.reservation .total-price-wrap .js-half-modal-overlay {
  height: 100vh;
  -webkit-transform: translateY(-100vh);
          transform: translateY(-100vh);
}
.or-box {
  position: relative;
}
.or-box:before {
  content:"";
  display: block;
  width: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  border-bottom: 1px solid #C6C6C6;
}
.or-box span {
  display: inline-block;
  background: #f5f5f5;
  padding: 0 8px;
  position: relative;
  z-index: 1;
}

.gtt-alert .border-box {
  padding: 8px 16px;
  border: 1px solid #0F0A64;
}
.gtt-alert .border-box .js-modal-trigger {
  height: auto;
}

@media (max-width: 1023px) {
  .reservation .gtt-alert {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .reservation {
    /* auMovesバナー */
  }
  .reservation .message p {
    margin: 11px 0;
  }
  .reservation .mp-member-info h2 {
    font-size: 2rem;
    font-weight: bold;
  }
  .reservation .input-box .label span {
    margin-right: 0;
  }
  .reservation .reserve-data-box:not(.user-data-box) {
    border-top: 4px solid #F5F5F5;
  }
  .reservation .user-data-box-add.bd-top-none {
    border-top: none;
  }
  .reservation .input-name-wrap {
    display: block;
  }
  .reservation .input-name-wrap li {
    max-width: 100%;
    width: 100%;
  }
  .reservation .js-dropdown.js-half-modal-trigger {
    width: 168px;
  }
  .reservation .reserve-submit a {
    max-width: 100%;
  }
  .reservation .content-edit .input-box .select-dropdown .dropdown {
    display: none;
  }
  .reservation .content-edit .input-box .select-dropdown .dropdown, .reservation .content-edit .input-box .select-dropdown:before, .reservation .content-edit .input-box .select-dropdown:after {
    display: none;
  }
  .reservation .content-edit .input-box .select-dropdown .dropdown-select-button:before, .reservation .content-edit .input-box .select-dropdown .dropdown-select-button:after {
    right: 4px;
  }
  .reservation .gtt-alert {
    font-size: 1.6rem;
    font-weight: 700;
    padding: 16px;
    margin-bottom: 0;
  }
  .reservation .reserve-data-box .accordion-content .d-flex,
  .reservation .reserve-data-box .js-special-discount-content .d-flex {
    width: 100%;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation .reserve-data-box .accordion-content .d-flex .font-heavy,
  .reservation .reserve-data-box .js-special-discount-content .d-flex .font-heavy {
    width: auto;
  }
  .reservation .common-modal .user-data-edit,
  .reservation .common-modal .reserve-data-edit,
  .reservation .common-modal .coupon-data-edit {
    display: block;
    border-top: none !important;
  }
  .reservation .common-modal .user-data-edit .reserve-submit a,
  .reservation .common-modal .reserve-data-edit .reserve-submit a,
  .reservation .common-modal .coupon-data-edit .reserve-submit a {
    background: #0f0a64;
    height: 48px;
    position: relative;
    top: 0;
    right: 0;
  }
  .reservation .total-price-box .total-price-wrap {
    -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
  }
}
@media screen and (max-width: 500px) {
  .reservation .common-btn-modal .reserve-submit-double .wd-100per {
    max-width: 354px;
  }
}
@media screen and (max-width: 360px) {
  .reservation .link-cancel-policy {
    font-size: 1rem;
  }
  .reservation .total-price-box .total-price-wrap .text-link {
    font-size: 1.5rem;
  }
  .reservation .total-price-box .right-info-price {
    font-size: 1.2rem;
  }
  .reservation .reserve-p-c .reserve-input-point input {
    width: 100% !important;
  }
  .reservation .reserve-submit-double a, .reservation .reserve-submit-double button {
    max-width: calc(50% - 4px);
  }
}

.reservation .reserve-alert {
  border: 1px solid #0F0A64;
}

.reservation .reserve-data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.reservation .reserve-data dt {
  -webkit-flex-basis: 30%;
      -ms-flex-preferred-size: 30%;
          flex-basis: 30%;
}

.reservation .reserve-data dd {
  -webkit-flex-basis: 68%;
      -ms-flex-preferred-size: 68%;
          flex-basis: 68%;
}

@media (max-width: 767px) {
  .reservation .reserve-data {
    -webkit-box-pack: inherit;
    -webkit-justify-content: inherit;
        -ms-flex-pack: inherit;
            justify-content: inherit;
  }
  .reservation .reserve-data dt {
    font-size: 12px;
    -webkit-flex-basis: 20%;
        -ms-flex-preferred-size: 20%;
            flex-basis: 20%;
    margin-right: 16px;
  }
  .reservation .reserve-data dd {
    -webkit-flex-basis: calc(80% - 16px);
        -ms-flex-preferred-size: calc(80% - 16px);
            flex-basis: calc(80% - 16px);
  }
}

.reservation .reserve-data-box .js-show-zenkoku-notice:after,
.reservation .reserve-data-box .js-show-prefecture-notice:after,
.reservation .reserve-data-box-sp .js-show-zenkoku-notice:after,
.reservation .reserve-data-box-sp .js-show-prefecture-notice:after {
  content: "";
  background: url(/stcontents/img/common/icon-modal-link-white.svg) no-repeat 0 0;
  background-size: contain;
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: 4px;
}
.reservation .reserve-data-box .js-show-zenkoku-notice.clicked,
.reservation .reserve-data-box .js-show-prefecture-notice.clicked,
.reservation .reserve-data-box-sp .js-show-zenkoku-notice.clicked,
.reservation .reserve-data-box-sp .js-show-prefecture-notice.clicked {
  background: #fff;
  color: #0f0a64;
}
.reservation .reserve-data-box .js-show-zenkoku-notice.clicked:hover,
.reservation .reserve-data-box .js-show-prefecture-notice.clicked:hover {
  opacity: 0.7;
}
.reservation .reserve-data-box .js-show-zenkoku-notice.clicked:after,
.reservation .reserve-data-box .js-show-prefecture-notice.clicked:after,
.reservation .reserve-data-box-sp .js-show-zenkoku-notice.clicked:after,
.reservation .reserve-data-box-sp .js-show-prefecture-notice.clicked:after {
  content: "";
  background: url(/stcontents/img/common/icon-modal-link-relux.svg) no-repeat 0 0;
  background-size: contain;
}

.reservation .reserve-data-box .reserve-totalfee {
  border: none;
}
.reservation .fee-wrap {
  display: flex;
}
.reservation .fee-wrap > div {
  width: 100%;
}
.reservation .fee-wrap .subtotal {
  display: flex;
  justify-content: space-between;
  padding-top: 10px !important;
  margin-top: 16px !important;
  border-top: 1px solid #c6c6c6;
}
.reservation .fee-wrap .price-box dl > div {
  display: flex;
  justify-content: space-between;
}
.reservation-confirm-page .js-show-coupon-discount-area dd {
  white-space: nowrap;
  margin-left: 24px;
}
.reservation .fee-wrap h2 {
  width: 100%;
}
.reservation .reserve-data-box .fee-note {
    margin-top: 16px;
    padding: 16px 16px;
    border-top: 2px solid #F5F5F5;
    color: #757575;
}
.reservation .reserve-totalfee {
  width: 100%;
  border-bottom: 1px solid #C6C6C6;
}
.reservation-confirm-page .btn-pagetop {
  display: none !important;
}
.reservation .fee-wrap .total-price-box {
  border: none;
}

@media screen and (max-width: 1023px) {
  .reservation .fee-wrap {
    flex-wrap: wrap;
    flex-direction: column-reverse;
  }
  .reservation .fee-wrap > div {
    width: 100%;
  }
  .reservation .fee-wrap > .price-box {
    padding: 16px 0;
  }
  .reservation .reserve-data-box .fee-note {
    margin-top: 0;
    border-top: none;
  }
}

@media screen and (max-width: 1023px) {
  .reservation .fee-wrap .price-box dl > .total-price-box {
     display: block;
  }
  .reservation .fee-wrap .price-box dl > .total-price-box .reserve-totalfee {
    width: auto;
    border: none;
    float: right;
  }
}

@media screen and (max-width: 767px) {
  .reservation .reserve-data-box .js-show-zenkoku-notice:after,
  .reservation .reserve-data-box .js-show-prefecture-notice:after {
    width: 16px;
    height: 16px;
    margin-left: 4px;
    margin-top: 2px;
  }
}

.reservation .comp-main {
  height: 420px;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2))), url(https://rlx.jp/journal/wp-content/uploads/2016/08/RP22771_1100.jpg) no-repeat center center;
  background: -webkit-linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(https://rlx.jp/journal/wp-content/uploads/2016/08/RP22771_1100.jpg) no-repeat center center;
  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url(https://rlx.jp/journal/wp-content/uploads/2016/08/RP22771_1100.jpg) no-repeat center center;
  /* ※画像はサンプル（予約した宿泊施設のものが適用される想定） */
  background-size: cover;
}

.reservation .comp-main .wrap {
  padding: 0;
}

.reservation .comp-main p {
  text-shadow: rgba(0, 0, 0, 0.4) 0 0 5px;
}

.reservation .comp-main-inner {
  position: relative;
  height: 100%;
}

.reservation .comp-main-inner-2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
}

.reservation .comp-map-btn {
  position: absolute;
  bottom: 24px;
  right: 0px;
}

.reservation .comp-table {
  border-bottom: 1px solid #C6C6C6;
}

.reservation .comp-table th {
  width: 25.6%;
  background: #FFF;
}

.reservation .comp-table td, .reservation .comp-table th {
  display: table-cell;
  border-bottom: 1px solid #C6C6C6;
}

.reservation .resist-info-mail {
  background-color: #f5f5f5;
  margin-top: 40px;
  padding: 16px;
  text-align: center;
  color: #000;
}

.reservation .resist-info-pass {
  background-color: #f5f5f5;
  margin: 16px auto;
  padding: 16px;
  text-align: center;
  color: #000;
}

.reservation .resist-info-pass > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation .clip-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  color: inherit;
}

.reservation .clip-btn > span {
  text-decoration: underline;
}

.reservation .clip-btn > img {
  display: block;
  width: 24px;
  height: 24px;
}

.reservation .clip-btn:hover span {
  text-decoration: none;
}

.reservation .clip-btn.clicked {
  color: #757575;
}

.reservation .clip-btn.clicked span {
  text-decoration: none;
}

.reservation .comp-buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation .mp-member-info .js-half-modal-container {
  border-radius: 16px 16px 0 0;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content {
  padding-top: 20px !important;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .js-accordion-open {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-left: 16px;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 8px;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .js-accordion-open p {
  width: 50%;
  text-align: left;
  font-size: 1.4rem;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .js-accordion-open .amount {
  width: 50%;
  text-align: right;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .detail-wrap {
  margin-bottom: 138px;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .detail-wrap .bg-gray {
  padding: 8px 16px;
  margin-bottom: 16px;
  text-align: left;
  margin-left: 8px;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .detail-wrap .bg-gray:last-child {
  margin-bottom: 0;
}

.reservation .mp-member-info .js-half-modal-container .half-modal-content .detail-wrap .bg-gray .subtotal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 1px solid #c6c6c6;
  margin-top: 16px;
  padding-top: 8px;
}

.reservation .mp-member-info .js-half-modal-container .js-half-modal-close {
  top: 7px;
  right: 0;
}

@media screen and (max-width: 767px) {
  .reservation .reserve-stepnavi {
    margin-top: 24px;
    margin-bottom: 16px;
  }
  .reservation .reserve-stepnavi li::after {
    width: calc(100% - 24px);
    height: 2px;
    left: calc(-50% + 12px);
    top: 10px;
  }
  .reservation .reserve-stepnavi li span {
    height: 24px;
    line-height: 24px;
    width: 24px;
    border: 2px solid #C6C6C6;
  }
  .reservation .reserve-stepnavi li span img {
    width: 16px;
    height: 16px;
    position: relative;
    top: 1px;
  }
  .reservation .reserve-stepnavi .completed span,
  .reservation .reserve-stepnavi .currently span {
    border: 2px solid #0F0A64;
  }
  .reservation .cancel-policy-per {
    display: block;
    font-size: 1.0rem;
    color: #757575;
  }
  .reservation .reserve-check-list li {
    width: 50%;
  }
  .reservation .comp-main {
    height: 300px;
  }
  .reservation .comp-message {
    margin-bottom: 16px;
    font-size: 2.0rem;
  }
  .reservation .comp-map-btn {
    bottom: 24px;
    right: 0;
    text-align: center;
    width: 100%;
  }
  .reservation .comp-table {
    margin: 24px 0 24px 0;
    border-top: 1px solid #C6C6C6;
  }
  .reservation .comp-table td, .reservation .comp-table th {
    padding: 12px 8px;
  }
  .reservation .comp-table th {
    width: 25.6%;
    min-width: 140px;
  }
  .reservation .resist-info-mail {
    background-color: #f5f5f5;
    margin-top: 24px;
    padding: 8px;
    font-size: 1.4rem;
  }
  .reservation .resist-info-pass {
    margin: 24px 0;
    padding: 8px;
    text-align: center;
    font-size: 1.4rem;
  }
  .reservation .cxl-insurance {
    border: 1px solid #0F0a64;
    padding: 16px;
    text-align: left;
    margin-bottom: 24px;
  }
  .reservation .cxl-insurance p {
    text-align: left;
  }
  .reservation .cxl-insurance .title {
    display: block;
    text-align: center;
  }
  .reservation .cxl-insurance .title span {
    display: inline-block;
    padding: 4px;
    border: 1.5px solid #0F0A64;
    width: auto;
    border-radius: 50px;
    margin-right: 4px;
    margin-bottom: 8px;
  }
  .reservation .cxl-insurance .note {
    font-size: 1rem;
    margin: 0;
  }
  .reservation .cxl-insurance .btn-relux {
    width: 100%;
  }
  .reservation .cxl-insurance.comp .title {
    font-size: 1.6rem;
  }
  .reservation .cxl-insurance.comp .description {
    font-size: 1.4rem;
  }
  .reservation .cxl-insurance.comp .description .color-gray-2 {
    font-size: 1rem;
  }
  .reservation .cxl-insurance.comp .btn-relux {
    font-size: 1.4rem;
    height: 40px;
  }
}

/*SP版画面onlyのStyle ※レスポンシブにはあらず*/
.reserve-induction-sp {
  border: 1px solid #F5F5F5;
}

.reserve-data-box-sp {
  border-top: 4px solid #F5F5F5;
}

.reserve-data-box-sp.bd-top-none {
  border-top: none;
}

.reserve-data-sp {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
}

.reserve-data-sp div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reserve-data-sp div dt {
  width: 116px;
  line-height: 2.5;
}

.reserve-data-sp div dd {
  width: calc(100% - 116px);
}

.reserve-data-sp_2 {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
}

.reserve-data-sp_2 div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reserve-data-sp_2 dt {
  width: 140px;
  line-height: 2.5;
}

.reserve-data-sp_2 dd {
  width: calc(100% - 140px);
}

.reserve-float-bar {
  padding: 8px 16px;
  position: -webkit-sticky;
  position: sticky;
  -webkit-box-shadow: none;
          box-shadow: none;
}

.reserve-float-bar div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.reserve-float-bar dl {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.reserve-float-bar dl dt {
  position: relative;
  top: 1px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 1.2rem;
  font-weight: 700;
}

.reserve-float-bar dl dt span {
  font-weight: 400;
}

.reserve-float-bar dl dd {
  width: auto;
  margin-right: 0;
}

.reserve-float-bar a {
  width: 150px;
}

.reserve-birthday-sp .select-dropdown {
  max-width: 92px;
}

.coupon-expiration-sp {
  display: block;
}

.reserve-totalfee-sp .js-half-modal-trigger {
  width: 100%;
}

.reserve-totalfee-inner-sp {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reserve-message-sp {
  border-bottom: 1px solid #C6C6C6;
}

.submit-double-sp {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.submit-double-sp a {
  width: 48.9%;
}

.submit-single-sp a {
  width: 100%;
}

.reserve-hotel-sp {
  background: url(https://rlx.jp/journal/wp-content/uploads/2016/08/RP22771_1100.jpg) no-repeat center center;
  background-size: cover;
  height: 194px;
  position: relative;
}

.reserve-hotel-sp p {
  margin-bottom: 0;
  position: absolute;
  bottom: 16px;
  text-shadow: 1px 1px 1px #000;
}

.reserve-location-sp {
  border-bottom: 4px solid #F5F5F5;
}

.reserve-amount-sp div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.reserve-amount-sp .detail-wrap {
  display: block;
  margin-bottom: 0 !important;
  padding-bottom: 121px;
}

.reserve-amount-sp .detail-wrap div {
  display: block;
}

.reservation-result-sp .js-half-modal-container {
  display: block !important;
  position: relative;
  bottom: inherit;
  left: inherit;
  height: auto !important;
  opacity: 1;
  box-shadow: none !important;
  z-index: 0;
}
.mp-member-info .reservation-result-sp .js-half-modal-container .half-modal-content {
    padding: 8px 0 0 !important;
    overflow: hidden;
}
.reservation-result-sp .js-half-modal-container .half-modal-content > dl {
  padding: 0 !important;
}
.reservation-result-sp .half-modal-head {
  display: none;
}
.reservation-result-sp .reserve-amount-sp .detail-wrap {
  padding-bottom: 16px !important;
}

@media (max-width: 767px) {
  .reservation .reserve-data-left {
    width: 100%;
  }
  .reservation .reserve-data-right {
    display: none;
  }
  .reservation .reserve-p-c .coupon-field .p-c-ticket-minus {
    display: block;
  }
  .reservation .member-form-validation .reserve-float-bar {
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
  }
}

/*
  以下、クーポン・ポイント部分専用Style
*/
.reservation {
  /* 保有しているクーポン一覧モーダル */
  /* クーポンリスト */
}

.reservation .reserve-p-c button.js-modal-trigger,
.reservation .reserve-p-c button.js-half-modal-trigger {
  width: 176px;
}

.reservation .reserve-p-c .p-c-remaining {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  white-space: nowrap;
}

.reservation .reserve-p-c .p-c-remaining p, .reservation .reserve-p-c .p-c-remaining dd {
  position: relative;
  display: inline-block;
}

.reservation .reserve-p-c .p-c-ticket,
.reservation .reserve-p-c .coupon-ticket {
  border-radius: 8px;
  background: #FFF;
  -webkit-filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.15));
          filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.15));
  position: relative;
}

.reservation .reserve-p-c .p-c-ticket {
  border: 1px solid #A6BCE9;
  padding: 16px 56px 16px 16px;
}

.reservation .reserve-p-c .p-c-ticket:hover {
  opacity: 0.7;
}

.reservation .reserve-p-c .p-c-ticket-minus {
  margin-left: 16px;
  color: #FF503E;
}

.reservation .reserve-p-c .input-clear-btn {
  display: inline-block;
  position: absolute;
  cursor: pointer;
  outline: none;
  content: '';
  width: 19px;
  height: 18px;
  background-image: url(/stcontents/img/common/icon-input-delete.svg);
  background-color: transparent;
  background-repeat: no-repeat;
  background-size: contain;
  right: 18px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.reservation .reserve-p-c .reserve-input-point {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.reservation .reserve-p-c .reserve-input-point input {
  width: 241px;
  vertical-align: middle;
  float: left;
}

.reservation .reserve-p-c .reserve-input-point .js-btn-submit {
  height: 48px;
  border-radius: 0 4px 4px 0;
  vertical-align: middle;
}

.reservation .reserve-p-c .reserve-input-point .input-error-word {
  width: 100%;
  margin-top: 10px;
}

.reservation .p-c-box .half-modal-container-280 .half-modal-content {
  padding-top: 0 !important;
}

.reservation .common-btn-modal {
  max-width: 800px;
}

.reservation .common-btn-modal .modal-container {
  padding: 0 0 48px;
  position: relative;
}

.reservation .common-btn-modal .modal-container .content-body {
  height: calc(100% - 30px);
  margin-top: 0;
}

.reservation .common-btn-modal .modal-container .input-box {
  position: relative;
  margin-bottom: 0;
  padding: 40px 40px 8px;
  -webkit-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.08);
          box-shadow: 0 3px 4px rgba(0, 0, 0, 0.08);
  z-index: 1;
}

.reservation .common-btn-modal .modal-container .input-box:before {
  background: #fff;
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0;
  bottom: -20px;
}

.reservation .common-btn-modal .modal-container .input-box:after {
  background: #fff;
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  position: absolute;
  right: 0;
  bottom: -20px;
}

.reservation .common-btn-modal .content-scroll {
  background: #F5F5F5;
  padding: 0 16px 60px !important;
  height: 68%;
  height: calc(100% - 140px);
  margin: 0 40px;
  border-bottom: none;
}

.reservation .common-btn-modal .reserve-submit-double {
  position: absolute;
  width: 100%;
  border: 0;
  bottom: 0;
  left: 0;
  padding: 24px 0;
  background: #FFF;
  -webkit-box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
          box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
  z-index: 1;
}

.reservation .common-btn-modal .reserve-submit-double:before {
  background: #fff;
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0;
  top: -20px;
}

.reservation .common-btn-modal .reserve-submit-double:after {
  background: #fff;
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  position: absolute;
  right: 0;
  top: -20px;
}

.reservation .coupon-list .coupon-ticket-reserve .coupon-data-wrap {
  border-radius: 8px;
  border: 1px solid #C6C6C6;
}

.reservation .coupon-list .coupon-ticket-reserve .coupon-data-sub small:last-child {
  margin-left: 16px;
  position: relative;
  display: inline-block;
}

.reservation .coupon-list .coupon-ticket-reserve .coupon-data-sub small:last-child::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 16px;
  background-color: #333;
  position: absolute;
  top: 5px;
  left: -10px;
}

.reservation .coupon-list .coupon-ticket {
  border: none;
}

.reservation .content-scroll .no-plan {
  padding: 140px 0;
}

.reservation .coupon-code-modal {
  max-width: 520px !important;
}

.reservation .coupon-code-modal .input-box {
  min-height: 82px;
}

.reservation .coupon-code-modal .input-box .input-content2 > input {
  font-size: 1.6rem;
  padding: 0 12px;
  padding: 15px 16px;
  height: 48px;
  height: 56px;
}

.reservation .point-radios li {
  min-height: 48px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation .point-radios .input-content2 {
  margin-bottom: 0;
}

.reservation .point-radios .input-content2.error + .error-text {
  margin-bottom: 0;
}

.reservation .point-radios label {
  min-width: 120px;
  height: 36px;
  white-space: nowrap;
}

.reservation .js-radio-acd-b {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start !important;
  -webkit-align-items: flex-start !important;
      -ms-flex-align: start !important;
          align-items: flex-start !important;
  margin: 4px 0;
}

.reservation .js-radio-acd-b label {
  position: relative;
  top: 6px;
}

.reservation .js-radio-acd-content-b {
  margin-bottom: -10px;
  padding-left: 24px;
}

.reservation .js-radio-acd-content-b .input-content2 > input {
  padding-right: 41px;
}

@media (max-width: 767px) {
  .reservation .js-radio-acd-content-b {
    padding-left: 16px;
  }
  .reservation .js-radio-acd-content-b .font-small {
    font-size: 11px;
  }
}

@media (max-width: 360px) {
  .reservation .js-radio-acd-content-b .font-small {
    font-size: 10px;
  }
}

.reservation .ponta-point-modal .js-btn-submit,
.reservation .relux-point-modal .js-btn-submit {
  display: block;
  min-width: 300px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  .reservation .reserve-p-c button.js-modal-trigger,
  .reservation .reserve-p-c button.js-half-modal-trigger {
    width: 100%;
    height: 40px;
    font-size: 1.4rem;
  }
  .reservation .reserve-p-c .reserve-input-point {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .reservation .reserve-p-c .reserve-input-point input {
    width: calc(100% - 90px) !important;
    height: 48px;
  }
  .reservation .reserve-p-c .reserve-input-point .js-btn-submit {
    height: 48px;
  }
  .reservation .reserve-p-c .reserve-input-point > p,
  .reservation .reserve-p-c .reserve-input-point > h3 {
    width: 100%;
  }
  .reservation .p-c-remaining p::before,
  .reservation .p-c-remaining dd::before {
    top: 5px !important;
  }
  .reservation .common-btn-modal .content-scroll {
    height: calc(100% - 178px);
    margin: 0;
    padding: 0 4px 0 16px !important;
  }
  .reservation .common-btn-modal .modal-container {
    padding: 0 0 64px;
  }
  .reservation .common-btn-modal .modal-container .content-body {
    height: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-flow: column;
        -ms-flex-flow: column;
            flex-flow: column;
  }
  .reservation .common-btn-modal .modal-container .input-box {
    padding: 40px 16px 8px;
  }
  .reservation .common-btn-modal .modal-container .input-box:before, .reservation .common-btn-modal .modal-container .input-box:after {
    content: none;
  }
  .reservation .common-btn-modal .reserve-submit-double {
    padding: 8px 8px;
  }
  .reservation .common-btn-modal .reserve-submit-double:before, .reservation .common-btn-modal .reserve-submit-double:after {
    content: none;
  }
  .reservation .coupon-list {
    padding-bottom: 16px;
    padding-right: 12px;
    overflow: hidden;
  }
  .reservation .content-scroll .no-plan {
    padding: 200px 0;
  }
  .reservation .point-radios label {
    height: 24px;
  }
  .reservation .js-radio-acd-b {
    margin: 0;
  }
  .reservation .js-radio-acd-b label {
    min-width: 90px;
    top: 12px;
  }
  .reservation .point-btn-submit {
    padding: 0 16px;
    position: absolute;
    bottom: 120px;
    width: 100%;
  }
  .reservation .point-btn-submit .btn-relux {
    width: 100%;
  }
  .reservation .js-half-modal-container {
    display: none;
  }
  .reservation .js-half-modal-container._slideUp {
    display: block;
  }
  .reservation .js-half-modal-container._slideUp .half-modal-head {
    position: -webkit-sticky;
    position: sticky;
  }
  .reservation .js-half-modal-container._slideUp .half-modal-head-inner .fixed-contents {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .reservation .js-half-modal-container._slideUp .half-modal-content {
    padding-top: 0 !important;
  }
  .reservation .mp-member-info .half-modal-total-reserve .half-modal-content {
    padding-top: 8px !important;
  }
  .reservation .js-half-modal-container .reserve-submit-double {
    padding: 0 16px;
    position: relative;
    bottom: 0;
    width: 100%;
  }
  .reservation .js-half-modal-container .reserve-submit-double button {
    width: 100%;
  }
  .reservation .phone-box .js-half-modal-container,
  .reservation .home .js-half-modal-container {
    border-radius: 0;
  }
  .reservation .phone-box .js-half-modal-container .half-modal-head-wrap,
  .reservation .home .js-half-modal-container .half-modal-head-wrap {
    -webkit-box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.15);
            box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.15);
    z-index: 1;
  }
  .reservation .phone-box .js-half-modal-container .half-modal-head,
  .reservation .home .js-half-modal-container .half-modal-head {
    padding: 16px 0 6px;
    border-radius: 0;
  }
  .reservation .phone-box .js-half-modal-container .js-half-modal-close,
  .reservation .home .js-half-modal-container .js-half-modal-close {
    top: -4px;
    right: 10px;
  }
  .reservation .phone-box .js-half-modal-container .half-modal-content,
  .reservation .home .js-half-modal-container .half-modal-content {
    height: calc(100% - 132px) !important;
    position: relative;
    margin: 102px 0 0;
    padding: 0 16px 0 16px !important;
    overflow: auto;
    border: none;
    border-bottom: 1px solid #F5F5F5 !important;
  }
  .reservation .phone-box .js-half-modal-container .half-modal-content ul,
  .reservation .home .js-half-modal-container .half-modal-content ul {
    border: none;
    width: 100%;
    overflow: hidden;
    padding-top: 10px;
  }
  .reservation .phone-box .js-half-modal-container .half-modal-content ul li,
  .reservation .home .js-half-modal-container .half-modal-content ul li {
    border: 1px solid #F5F5F5;
    border-top: none;
  }
  .reservation .phone-box .js-half-modal-container:before,
  .reservation .home .js-half-modal-container:before {
    background: #fff;
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    bottom: 20px;
    left: 0;
    z-index: 1;
  }
  .reservation .phone-box .js-half-modal-container:after,
  .reservation .home .js-half-modal-container:after {
    background: #fff;
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    bottom: 20px;
    right: 0;
    z-index: 1;
  }
  .reservation .coupon-code-modal .modal-container,
  .reservation .relux-point-modal .modal-container,
  .reservation .ponta-point-modal .modal-container {
    width: calc(100% - 32px);
    display: block;
    margin: auto;
    height: auto;
    border-radius: 4px;
  }
  .reservation .coupon-code-modal .common-modal-inner,
  .reservation .relux-point-modal .common-modal-inner,
  .reservation .ponta-point-modal .common-modal-inner {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
  }
  .reservation .coupon-list .coupon-data-sub span + span {
    margin-left: -16px;
  }
  .coupon-code-modal .modal-container {
    padding: 32px !important;
    max-width: 520px !important;
  }
  .relux-point-modal .modal-container,
  .ponta-point-modal .modal-container {
    max-width: 420px !important;
  }
}

@media screen and (min-width: 768px) {
  .reservation .p-c-ttl {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .reservation .coupon-list .coupon-terms {
    display: block;
  }
  .reservation .coupon-list .coupon-terms dt {
    width: auto !important;
    float: none;
  }
  .reservation .coupon-list .coupon-terms dd {
    float: none;
    width: auto;
  }
  .reservation .reserve-input-point {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .reservation .reserve-input-point input {
    width: 200px;
  }
  .reservation .reserve-input-point .input-error-word {
    padding-left: 150px;
  }
  .reservation .relux-point-modal,
  .reservation .ponta-point-modal {
    max-width: 480px !important;
  }
}

/*
  以下、「支払い方法」エリア専用Style
*/
.reservation .hotel-grade.js-tips-content {
  border: 1px solid #F5F5F5;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  top: 32px;
  left: 94px;
  overflow: hidden;
  top: 32px;
  left: 94px;
}

.reservation .js-tips-content .upper {
  padding: 10px 10px 8px 10px;
}

.reservation .js-tips-content .upper .contents {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.reservation .js-tips-content .upper .lead .inner ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  line-height: 1;
}

.reservation .label-with-cards {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin-right: 0;
}

.reservation .card-icons {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.reservation .js-radio-acd-content-c .label-with-cards {
  margin-bottom: 10px;
}

.reservation .select-payment .radio-disabled .label-with-cards .card-icons {
  display: none;
}

.reservation .select-payment .radio-disabled small {
  color: #757575;
}

/* @media (max-width: 767px) {
  .reservation .select-payment .input-box label + .ml-32 {
    margin-left: 27px !important;
  }
} */

@media screen and (max-width: 400px){
  .reservation .coupon-list .coupon-data-sub .font-large {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 360px){
  .reservation .coupon-list .coupon-data-sub .font-large {
    font-size: 1rem;
  }
}

.reservation .form-validation .input-box-birth > div,
.reservation .form-validation .input-box-checkin > div,
.reservation .member-form-validation .input-box-birth > div,
.reservation .member-form-validation .input-box-checkin > div {
  margin-right: 4px;
  width: 50px;
}

.reservation .form-validation .input-box-birth > div:last-of-type,
.reservation .form-validation .input-box-checkin > div:last-of-type,
.reservation .member-form-validation .input-box-birth > div:last-of-type,
.reservation .member-form-validation .input-box-checkin > div:last-of-type {
  margin-left: 12px;
}

@media screen and (max-width: 767px) {
  .reservation .hotel-grade.js-tips-content {
    width: auto;
    left: 78px;
    top: -102px;
  }
  .reservation .hotel-grade.js-tips-content .upper .lead .inner {
    margin-top: 0;
  }
  .reservation .hotel-grade.js-tips-content .upper:before {
    content: none;
  }
}

/*
  クレジット決済ページ
*/
.payment-form .right-info-price .mt-32.mb-32 {
  border-top: 1px solid #F5F5F5;
  border-bottom: 1px solid #F5F5F5;
  margin: 16px 0 !important;
  padding: 16px 0;
}

.payment-form .reserve-data-box .notice {
  border-top: 2px solid #F5F5F5;
}

.payment-form .reserve-total-box .note {
  border-top: 2px solid #F5F5F5;
}

@media (max-width: 767px) {
  .payment-form {
    background: none;
  }
  .payment-form .wrap {
    padding: 0;
  }
  .payment-form .wrap > h2 {
    padding: 16px 16px 24px;
  }
  .payment-form .mp-member-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  .payment-form .validation-wrap > div {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .payment-form .reserve-total-box > .d-flex {
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .payment-form .reserve-data-right {
    width: 100%;
    position: static;
    display: block;
    margin-bottom: 0;
    padding: 0 16px;
  }
  .payment-form .right-info-price .mt-32.mb-32 {
    border-top: 1px solid #C6C6C6;
    border-bottom: 1px solid #C6C6C6;
    margin: 8px 0 !important;
    padding: 8px 0;
  }
  .payment-form .right-info-detail {
    background: #F5F5F5;
    margin-bottom: 10px;
  }
  .payment-form .right-info-detail .font-x-large {
    font-size: 2rem;
  }
  .payment-form .reserve-data-box {
    padding-bottom: 0 !important;
  }
  .payment-form .reserve-data-box h3 {
    font-size: 2rem;
  }
  .payment-form .reserve-data-box .input-name-wrap > li:nth-child(2) .label {
    display: none;
  }
  .payment-form .reserve-data-box .notice {
    width: 100vw;
    margin: 24px 0;
    margin-left: -16px;
    padding: 24px 16px !important;
    border-top: 4px solid #F5F5F5;
    border-bottom: 4px solid #F5F5F5;
  }
  .payment-form .reserve-total-box .note {
    margin-top: 24px !important;
    border-top: 2px solid #F5F5F5;
  }
}

.payment-form .small-wrap {
  max-width: 600px;
}

.payment-form .detail-box {
  margin-bottom: 24px;
}

.payment-form .detail-box > div {
  padding: 20px;
  border-top: 1px solid #C6C6C6;
}

.payment-form .detail-box > div:last-child {
  border-bottom: 1px solid #C6C6C6;
}

.payment-form .detail-box .d-flex > div:first-child {
  width: 150px;
  font-weight: bold;
}

.payment-form .detail-box .d-flex:last-child {
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

@media (max-width: 767px) {
  .payment-form .small-wrap {
    padding: 0 16px;
  }
  .payment-form .small-wrap h2 {
    padding: 24px 0 !important;
  }
  .payment-form .detail-box {
    margin-bottom: 16px;
    padding: 0 16px;
  }
  .payment-form .detail-box > div {
    padding: 8px 0;
  }
  .payment-form .detail-box .d-flex:first-of-type:first-child {
    display: block;
    border: none;
  }
  .payment-form .detail-box .d-flex:first-of-type > div {
    padding: 8px 0;
  }
  .payment-form .detail-box .d-flex:first-of-type > div:first-child {
    width: auto;
    font-size: 2rem;
  }
  .payment-form .detail-box .d-flex:first-of-type > div:last-child {
    text-align: left;
  }
  .payment-form .detail-box .d-flex > div {
    padding: 8px 0;
  }
  .payment-form .detail-box .d-flex > div:first-child {
    width: 80px;
  }
  .payment-form .detail-box .d-flex > div:last-child {
    width: calc(100% - 80px);
    text-align: right;
  }
  .payment-form .detail-box .d-flex .font-large {
    font-size: 2rem !important;
  }
  .payment-form .notice {
    padding: 0 16px;
  }
}

.payment-form .expired-content > div {
  min-height: 400px;
}

.payment-form .expired-content .reserve-data-box {
  min-height: 400px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

@media (max-width: 767px) {
  .payment-form .expired-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .payment-form .expired-content > div {
    min-height: 0;
  }
  .payment-form .expired-content .right-info-detail {
    background: none;
  }
  .payment-form .expired-content .reserve-data-right {
    padding: 0;
  }
  .payment-form .expired-content .reserve-data-box {
    background: #F5F5F5;
    margin: 0 16px 0 !important;
    padding: 24px 16px !important;
    min-height: 0 !important;
  }
  .payment-form .expired-content .reserve-data-box h2 {
    text-align: center;
    font-size: 1.6rem;
  }
  .payment-form .expired-content .reserve-data-box .p-40 {
    padding: 0 !important;
  }
}

.payment-form .closed-content .reserve-data-box {
  height: 148px;
  margin-bottom: 24px !important;
  border: none;
}

.register-input input[type=text],
.register-input input[type=number],
.register-input input[type=tel],
.register-input input[type=email] {
  width: 100%;
}

.register-input input[type="radio"],
.register-input input[type="checkbox"] {
  border: none;
}

.register-input .color-gray-2 a {
  color: inherit;
  text-decoration: underline;
}

.register-input .color-gray-2 a:hover {
  text-decoration: none;
}

.register-input .content-edit .input-box .select-dropdown-search ul {
  position: relative;
  top: 8px;
  border: 1px solid #F5F5F5;
}

.register-input .sns-lead {
  font-size: 1.6rem;
  font-weight: 900;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 16px;
}

.register-input .sns-login-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.register-input .sns-login-flex > div {
  margin-right: 20px;
}

.register-input .sns-login-flex > div:last-of-type {
  margin-right: 0;
}

.register-input .sns-annotation {
  color: #757575;
  font-size: 1.2rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.register-input .sns-annotation > li {
  padding-left: 12px;
  position: relative;
}

.register-input .sns-annotation > li::before {
  content: '※';
  position: absolute;
  top: 0;
  left: 0;
}

.register-input .btnWithIcon {
  width: 311px;
}

.register-input .lead {
  font-size: 1.6rem;
  margin-bottom: 40px;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-flow: column;
      -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.register-input .lead.text-left {
  text-align: left;
}

.register-input .lead > span {
  margin-top: 8px;
}

.register-input .input-name-wrap {
  max-width: 528px;
}

.register-input .input-name-wrap li {
  width: calc(50% - 8px);
}

.register-input #postal-code {
  max-width: 126px !important;
}

.register-input #home-address {
  max-width: 544px;
}

.register-input #mail {
  max-width: 348px;
}

.register-input #phone-number {
  max-width: 150px;
}

.register-input #anniversary {
  max-width: 126px;
}

.register-input #birth {
  max-width: 192px;
}

.register-input .prefectures .options {
  max-width: 126px;
}

.register-input .content-edit.wrap {
  max-width: 528px;
  padding-bottom: 90px;
}

.register-input .content-edit.wrap .input-box {
  max-width: 915px;
}

.register-input .content-edit.wrap .input-box.prefectures {
  display: none;
}

.register-input .content-edit.wrap .input-box.prefectures.active {
  display: block;
}

.register-input .content-edit.wrap .input-box.phone-box.abs {
  padding-bottom: 91px;
}

.register-input .content-edit.wrap .input-box .des {
  margin-top: -10px;
  margin-bottom: 18px;
}

.register-input .content-edit.wrap .input-box input[type=text] {
  width: 100%;
}

.register-input .content-edit.wrap .input-box input[type=text].birth {
  max-width: 159px;
}

.register-input .content-edit.wrap .input-box input[type=text].postal-code {
  max-width: 96px;
}

.register-input .content-edit.wrap .input-box input[type=text].home-address {
  max-width: 544px;
}

.register-input .content-edit.wrap .input-box input[type=text].phone-number {
  max-width: 160px;
}

.register-input .content-edit.wrap .input-box input[type=text].mail {
  max-width: 351px;
}

.register-input .content-edit.wrap .input-box input[type=text].anniversary {
  max-width: 109px;
}

.register-input .content-edit.wrap .input-box .check-box label {
  font-size: 1.6rem;
}

.register-input .content-edit.wrap .input-box label {
  margin-right: 32px;
}

.register-input .content-edit.wrap .input-box p:last-of-type.check-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.register-input .content-edit.wrap .input-box p:last-of-type.check-box label {
  margin-right: 0;
  margin-bottom: 8px;
  width: 33.3333%;
}

.register-input .content-edit.wrap .input-box .input-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.register-input .content-edit.wrap .input-box .input-area .double-input {
  width: 256px;
}

.register-input .content-edit.wrap .input-box .input-area .double-input.first {
  margin-right: 32px;
}

.register-input .content-edit.wrap .input-box .input-area .double-input input.text-double {
  width: 256px;
}

.register-input .content-edit.wrap .input-box .select-dropdown.prefectures {
  width: 106px;
}

.register-input .content-edit.wrap .input-box .select-dropdown .dropdown-select-button::before, .register-input .content-edit.wrap .input-box .select-dropdown .dropdown-select-button::after {
  right: 5px;
}

.register-input .content-edit.wrap .input-box .select-dropdown .select-frame {
  color: #333;
}

.register-input .content-edit.wrap .input-box .phone-number-before {
  position: relative;
}

.register-input .content-edit.wrap .input-box .phone-number-before.abs {
  padding-bottom: 53px;
}

.register-input .content-edit.wrap .input-box .phone-number-before .phone {
  display: none;
}

.register-input .content-edit.wrap .input-box .phone-number-before .phone.active {
  display: block;
  padding-bottom: 20px;
}

.register-input .content-edit.wrap .input-box .phone-number-before > .input-block.abs {
  position: absolute;
  top: 0;
  left: 136px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search {
  width: 288px;
  display: inline-block;
  position: relative;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .dropdown {
  display: none;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul, .register-input .content-edit.wrap .input-box .select-dropdown-search li, .register-input .content-edit.wrap .input-box .select-dropdown-search span {
  -webkit-user-select: none;
  -moz-user-select: none;
  /*firefox*/
  -ms-user-select: none;
      user-select: none;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul {
  margin: 0px;
  padding: 0px;
  width: 100%;
  max-height: 400px;
  border: 1px solid #C6C6C6;
  -webkit-box-shadow: none;
          box-shadow: none;
  display: none;
  list-style: none;
  z-index: 2;
  overflow: auto;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul li {
  padding-left: 36px;
  height: 40px;
  border: 1px solid #F5F5F5;
  border-top: none;
  background-color: #FFFFFF;
  font-size: 1.6rem;
  line-height: 40px;
  cursor: pointer;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul li span {
  color: #757575;
  font-size: 0.875rem;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul li:hover {
  background-color: #f5f5f5;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul li.active {
  background-color: #F3F8FD;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul li.title {
  padding-left: 11px;
  color: #757575;
  background-color: #FFFFFF;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: left;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search ul.active {
  display: block;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search span.select-frame {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 9px 16px;
  width: 100%;
  display: block;
  color: #333;
  cursor: pointer;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search span.select-frame.phone-txt {
  width: 126px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area {
  display: none;
  position: relative;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area.active {
  display: block;
  width: 100%;
  height: 40px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area.on {
  border-top-color: #0f0a64;
  border-left-color: #0f0a64;
  border-right-color: #0f0a64;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area img {
  top: 12px;
  left: 11px;
  position: absolute;
  cursor: pointer;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area input {
  padding: 12px 11px 11px 36px;
  font-size: 1.2rem;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area input ::-webkit-input-placeholder {
  font-size: 1.6rem;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area input :-ms-input-placeholder {
  font-size: 1.6rem;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area input ::-ms-input-placeholder {
  font-size: 1.6rem;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .search-area input ::placeholder {
  font-size: 1.6rem;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button::before, .register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button::after {
  content: '';
  background-color: #333333;
  display: block;
  position: absolute;
  width: 14px;
  height: 2px;
  top: 50%;
  right: 5px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button.home::before, .register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button.home::after {
  right: 12px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button.phone-btn::before, .register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button.phone-btn::after {
  right: 14px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button::after {
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button.active::before {
  margin-right: 8px;
  -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
  transform: scale(0.96, 0.8) rotate(-50deg);
}

.register-input .content-edit.wrap .input-box .select-dropdown-search div.dropdown-select-button.active::after {
  -webkit-transform: scale(0.96, 0.8) rotate(50deg);
  transform: scale(0.96, 0.8) rotate(50deg);
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .phone-btn {
  right: 162px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .dropdown-hidden {
  padding: 16px;
  -webkit-box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
          box-shadow: 4px 8px 16px rgba(0, 0, 0, 0.1);
  display: none;
  width: 288px;
  height: 482px;
  left: 0;
  top: 56px;
  background: #FFF;
  z-index: 1;
  border-radius: 8px;
}

.register-input .content-edit.wrap .input-box .select-dropdown-search .dropdown-hidden.active {
  display: block;
}

.register-input .content-edit.wrap .save-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media screen and (max-width: 767px) {
  .register-input .sns-login-flex {
    display: block;
  }
  .register-input .sns-login-flex > div {
    margin-right: 0;
  }
  .register-input .sns-annotation {
    margin-top: 16px;
  }
  .register-input .btnWithIcon {
    width: 100%;
  }
  .register-input .lead {
    text-align: left;
    margin-bottom: 20px;
  }
  .register-input .content-edit.wrap {
    padding-left: 0;
    padding-right: 0;
  }
  .register-input .js-half-modal-container {
    height: 101%;
    border-radius: 0;
  }
  .register-input .js-half-modal-container.hide {
    display: none;
  }
  .register-input .js-half-modal-container .half-modal-head {
    padding: 11px 0;
  }
  .register-input .js-half-modal-container .js-half-modal-close {
    top: -1px;
    right: 16px;
  }
  .register-input .content-edit .input-box.prefectures {
    display: none;
  }
  .register-input .content-edit .input-box.prefectures.active {
    display: block;
  }
  .register-input .content-edit .input-box input[type=text] {
    width: 100%;
  }
  .register-input .content-edit .input-box input[type=text].birth {
    max-width: 169px;
  }
  .register-input .content-edit .input-box input[type=text].postal-code {
    max-width: 109px;
  }
  .register-input .content-edit .input-box input[type=text].phone-number {
    max-width: 160px;
  }
  .register-input .content-edit .input-box input[type=text].anniversary {
    max-width: 109px;
  }
  .register-input .content-edit .input-box input.text-double.first {
    margin-bottom: 23px;
  }
  .register-input .content-edit .input-box .input-area .double-input.first {
    margin-bottom: 21px;
  }
  .register-input .content-edit .input-box .radios {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .register-input .content-edit .input-box .radios label {
    margin-bottom: 14px;
    width: 100%;
  }
  .register-input .content-edit .input-box .radios label:last-of-type {
    margin-bottom: 0;
  }
  .register-input .content-edit .input-box p:last-of-type.check-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .register-input .content-edit .input-box p:last-of-type.check-box label {
    margin-right: 0;
    margin-bottom: 22px;
    width: 50%;
    font-size: 1.4rem;
  }
  .register-input .content-edit .input-box p:last-of-type input.text-double {
    width: 100%;
  }
  .register-input .content-edit .input-box .select-dropdown {
    min-width: 99px;
    width: auto;
  }
  .register-input .content-edit .input-box .select-dropdown::before, .register-input .content-edit .input-box .select-dropdown::after {
    content: '';
    background-color: #333333;
    display: block;
    position: absolute;
    width: 14px;
    height: 2px;
    top: 30%;
    right: 5px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }
  .register-input .content-edit .input-box .select-dropdown::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .register-input .content-edit .input-box .select-dropdown::after {
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .register-input .content-edit .input-box .select-dropdown.active::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .register-input .content-edit .input-box .select-dropdown.active::after {
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .register-input .content-edit .input-box .select-dropdown .dropdown {
    padding-bottom: 8px;
    width: 106px;
    border-top: none;
    border-right: none;
    border-left: none;
    display: block;
    border-bottom: 1px solid #C6C6C6;
    color: #333;
    background-color: #ffffff;
    font-family: "Noto Sans JP","ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic","MS Gothic","ＭＳ ゴシック","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 1.4rem;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
  }
  .register-input .content-edit .input-box .phone-number-before.sp-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .register-input .content-edit .input-box .phone-number-before .select-dropdown-search {
    margin-right: 10px;
  }
  .register-input .content-edit .input-box .phone-number-before .phone {
    display: none;
  }
  .register-input .content-edit .input-box .phone-number-before .phone.active {
    display: block;
  }
  .register-input .content-edit .input-box .phone-number-before > .input-block.abs {
    max-width: 160px;
    display: inline-block;
    vertical-align: top;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp {
    display: inline-block;
    position: relative;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp.phone {
    margin-right: 8px;
    width: 126px;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown {
    display: none;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp ul, .register-input .content-edit .input-box .select-dropdown-search-sp li, .register-input .content-edit .input-box .select-dropdown-search-sp span {
    -webkit-user-select: none;
    -moz-user-select: none;
    /*firefox*/
    -ms-user-select: none;
        user-select: none;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp ul {
    margin: 0px;
    padding: 0px;
    width: 100%;
    border-radius: 0 0 4px 4px;
    border: 1px solid #C6C6C6;
    list-style: none;
    z-index: 2;
    overflow: auto;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp ul li {
    padding-left: 36px;
    height: 40px;
    border: 1px solid #F5F5F5;
    border-top: none;
    background-color: #FFFFFF;
    font-size: 1.6rem;
    line-height: 40px;
    cursor: pointer;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp ul li span {
    color: #757575;
    font-size: 0.875rem;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp ul li.active {
    background-color: #F3F8FD;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp ul li.title {
    padding-left: 11px;
    color: #757575;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: left;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .half-modal-content {
    height: calc(100% - 38px);
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .search-wrap {
    padding: 0 16px 8px 16px;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area {
    margin-top: 8px;
    position: relative;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area.on {
    border-top-color: #0f0a64;
    border-left-color: #0f0a64;
    border-right-color: #0f0a64;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area img {
    top: 15px;
    left: 11px;
    position: absolute;
    cursor: pointer;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .search-wrap .search-area input {
    padding: 13px 12px 13px 36px;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button {
    width: 100%;
    cursor: pointer;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::before, .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::after {
    content: '';
    background-color: #333333;
    display: block;
    position: absolute;
    width: 14px;
    height: 2px;
    top: 50%;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button::after {
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button.active::before {
    margin-right: 8px;
    -webkit-transform: scale(0.96, 0.8) rotate(-50deg);
    transform: scale(0.96, 0.8) rotate(-50deg);
  }
  .register-input .content-edit .input-box .select-dropdown-search-sp .dropdown-select-button.active::after {
    -webkit-transform: scale(0.96, 0.8) rotate(50deg);
    transform: scale(0.96, 0.8) rotate(50deg);
  }
  .register-input .content-edit .save-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .register-input .half-modal-content {
    padding-top: 112px !important;
  }
  .register-input .half-modal-head {
    position: static;
  }
  .register-input .half-modal-head-wrap {
    position: fixed;
    top: 0;
    width: 100%;
    background: #FFF;
  }
  .register-input .js-fixed {
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
            box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid red;
  }
  .register-input .home .js-half-modal-trigger {
    width: 242px !important;
  }
  .register-input .input-name-wrap {
    display: block;
  }
  .register-input .input-name-wrap > li {
    width: 100%;
    max-width: 342px;
  }
}

.mailform-modal,
.mailform-authcode-modal {
  max-width: 700px;
}

.mailform-caution-modal {
  background: rgba(198, 198, 198, 0.7);
  max-width: none;
  width: 100%;
}

.mailform-caution-modal .modal-container {
  max-width: 440px;
  margin: 0 auto;
}

.mailform-caution-modal .btn-double {
  margin-top: 24px;
}

.mailform-caution-modal .btn-double > a {
  width: calc(50% - 24px);
}

.content-edit .authenticated-text {
  display: none;
  margin: 40px auto;
  padding: 4px 16px;
}

.content-edit .authenticated-text strong {
  margin-right: 4px;
  font-weight: bold;
}

@media screen and (min-width: 768px) {
  .mailform-modal .modal-container {
    padding: 94px 40px;
    border-radius: 8px;
  }
  .mailform-authcode-modal .modal-container {
    padding: 31px 40px;
    -webkit-box-shadow: none;
            box-shadow: none;
    border-radius: 8px;
  }
}

@media screen and (max-width: 767px) {
  .mailform-caution-modal .js-modal-close {
    display: none;
  }
  .mailform-caution-modal .modal-container {
    max-width: none;
    height: auto;
    width: 94%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    border-radius: 8px;
  }
  .content-edit .authenticated-text {
    margin: 30px auto;
  }
}

.register-confirm.wrap {
  padding-top: 24px;
  padding-bottom: 160px;
}

.register-confirm .title {
  margin-bottom: 16px;
  text-align: center;
}

.register-confirm .lead {
  font-size: 1.6rem;
  margin-bottom: 24px;
  text-align: center;
}

.register-confirm .table-basic {
  margin-bottom: 40px;
}

.register-confirm .table-basic th, .register-confirm .table-basic td {
  font-size: 1.6rem;
}

.register-confirm .register-data-wrap {
  width: 670px;
  margin: 0 auto;
}

.register-confirm .register-data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 670px;
}

.register-confirm .register-data dt {
  width: 170px;
}

.register-confirm .register-data dd {
  width: 500px;
}

.register-confirm .register-data p {
  margin-bottom: 0;
}

.register-confirm .form-notice {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 1.2rem;
}

.register-confirm .form-notice > p {
  margin-bottom: 0;
}

.register-confirm .form-notice a {
  color: inherit;
  text-decoration: underline;
}

.register-confirm .form-btns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 16px;
}

.register-confirm .form-btns > a {
  min-width: 176px;
  margin-right: 16px;
}

.register-confirm .form-btns > a:last-child {
  margin-right: 0;
}

@media screen and (max-width: 767px) {
  .register-confirm.wrap {
    padding-top: 16px;
    padding-bottom: 80px;
  }
  .register-confirm .title {
    font-size: 2.4rem;
    margin-bottom: 8px;
    text-align: left;
  }
  .register-confirm .lead {
    margin-bottom: 1.6rem;
    text-align: left;
  }
  .register-confirm .table-basic {
    margin-bottom: 16px;
  }
  .register-confirm .register-data-wrap {
    width: 100%;
  }
  .register-confirm .register-data {
    width: 100%;
  }
  .register-confirm .register-data dt {
    -webkit-flex-basis: 30%;
        -ms-flex-preferred-size: 30%;
            flex-basis: 30%;
    line-height: 2.5;
    font-size: 1.2rem;
    font-weight: 900;
  }
  .register-confirm .register-data dd {
    -webkit-flex-basis: 68%;
        -ms-flex-preferred-size: 68%;
            flex-basis: 68%;
    font-size: 1.6rem;
  }
  .register-confirm .register-data .font-default {
    font-size: 1.2rem;
  }
  .register-confirm .form-notice {
    font-size: 1.4rem;
  }
  .register-confirm .form-btns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 16px;
  }
  .register-confirm .form-btns > a {
    width: 100%;
    min-width: 134px;
    margin-right: 8px;
  }
}

@media screen and (min-width: 768px) {
  .register-confirm .table-basic th {
    background-color: unset;
  }
}

.social-confirm .content {
  text-align: center;
}

.social-confirm .gmail-address {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  padding: 8px 16px;
}

@media screen and (max-width: 767px) {
  .social-confirm .form-notice {
    font-size: 1.0rem;
    letter-spacing: 0;
  }
  .social-confirm .form-notice br {
    display: none;
  }
}

@media screen and (max-width: 400px) {
  .social-confirm .content {
    text-align: left;
  }
  .social-confirm .gmail-address {
    width: 100%;
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.contact {
  /*pc*/
  /*sp*/
}

.contact .wrap {
  max-width: 930px;
}

.contact main {
  /*padding-bottom: 40px;*/
  padding-bottom: 0;
  background-color: #f2f2f0;
}

.contact main .description {
  color: #ff0000;
}

.contact .notice {
  background-color: #fff;
  padding: 24px 40px;
  margin-bottom: 24px;
}

.contact .member-info {
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid #757575;
}

.contact .member-info > dt {
  font-size: 2.4rem;
  font-weight: bold;
}

.contact .member-info > dd {
  font-size: 1.6rem;
}

.contact .member-info > dd span {
  margin-left: 16px;
}

.contact .input-error-word {
  display: none;
}

.contact .input-error-word.active {
  display: block;
}

.contact .input-box input[type="radio"] {
  border-bottom: none;
}

.contact .input-wide input {
  width: 100%;
  max-width: 470px;
}

.contact .input-double input {
  width: 100%;
}

.contact .input-name-wrap {
  max-width: 528px;
}

@media screen and (min-width: 768px) {
  .contact .col-780 {
    margin: 0 auto;
  }
  .contact .col-780 .main-title {
    padding-top: 30px;
    margin-bottom: 20px;
  }
  .contact .tag-require, .contact .tag-any, .contact .tag-any {
    margin-right: 5px;
  }
  .contact table th {
    padding: 15px 0;
    width: 33%;
    vertical-align: top;
  }
  .contact table td {
    width: 67%;
    padding: 10px 0 10px 20px;
  }
  .contact table td ul li {
    margin-bottom: 10px;
    width: 100%;
  }
  .contact table td ul li span {
    display: block;
  }
  .contact table td .text-box {
    width: 100%;
  }
  .contact table td a {
    color: #555555;
    text-decoration: underline;
  }
  .contact table td a:hover {
    text-decoration: none;
  }
  .contact table td .btn-relux {
    width: 300px;
  }
  .contact .description {
    margin-top: 20px;
    margin-bottom: 100px;
  }
  .contact .input-double {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    max-width: 544px;
  }
  .contact .input-double li {
    width: 47.5%;
  }
}

.contact .submit-btn-area button.disabled {
  opacity: .2;
  pointer-events: none;
}

.contact .contact-form-validation .btn-target.disabled {
  opacity: .2;
  pointer-events: none;
}

.contact .contact-form-validation .on .input-error-word {
  display: block;
  white-space: nowrap;
}

.contact .contact-form-validation .on input,
.contact .contact-form-validation .on textarea {
  border: 1px solid #CE0000;
}

.contact .contact-form-validation .on .input-radio {
  background: url(/stcontents/img/common/icon-radio-error.svg) no-repeat 0 center;
  background-size: contain;
  width: 20px;
  height: 20px;
  margin-left: 1px;
}

.contact .contact-form-validation .on .input-radio:checked {
  background: url(/stcontents/img/common/icon-radio-on-checked.svg) no-repeat 0 center;
  background-size: contain;
}

.contact .contact-form-validation .no-validate input {
  border-color: #C6C6C6 !important;
}

.contact .contact-form-validation input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 300px #fff inset;
}

.contact .contact-form-validation a.btn-target.no-disabled {
  background: #0f0a64;
  border: 1px solid #0f0a64;
  pointer-events: auto;
}

@media screen and (max-width: 767px) {
  .contact main {
    /*padding: 10px;*/
    padding: 0;
    background-color: #fff;
  }
  .contact .wrap {
    background-color: #ffffff;
  }
  .contact .main-title {
    font-size: 2.4rem;
    font-weight: bold;
    text-align: center;
    margin-top: 24px;
  }
  .contact .notice {
    background-color: #fff;
    padding: 0 16px;
    margin-bottom: 8px;
  }
  .contact .notice p {
    padding: 24px 16px;
    border: 1px solid #CE0000;
  }
  .contact .member-info > dt {
    font-size: 2rem;
  }
  .contact .col-780 {
    margin: 0 auto;
  }
  .contact .col-780 .main-title {
    margin-bottom: 30px;
    padding-top: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #000;
    line-height: 1;
  }
  .contact .input-name-wrap {
    display: block;
  }
  .contact .input-name-wrap > li {
    width: 100%;
    max-width: 342px;
  }
  .contact .input-box-reservation .input {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    font-size: 1.6rem;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .contact .input-box-reservation .input input {
    width: 170px !important;
    margin-left: 8px;
  }
  .contact .input-box-reservation .input .input-error-word {
    width: 100%;
  }
  .contact .tag-require, .contact .tag-any, .contact .tag-any {
    margin-right: 5px;
  }
  .contact table th {
    margin: 15px 0;
    width: 100%;
    display: block;
  }
  .contact table td {
    margin-bottom: 30px;
    width: 100%;
    display: block;
  }
  .contact table td ul li {
    margin-bottom: 10px;
    width: 100%;
  }
  .contact table td ul li span {
    display: block;
  }
  .contact table td .text-box {
    width: 100%;
  }
  .contact table td a {
    color: #555555;
    text-decoration: underline;
  }
  .contact table td a:hover {
    text-decoration: none;
  }
  .contact table td .btn-relux {
    width: 100%;
  }
  .contact table td .aggree-txt {
    margin-bottom: 20px;
    width: 100%;
    text-align: center;
  }
  .contact .description {
    margin-top: 20px;
    padding-bottom: 40px;
  }
}

.basic-table {
  margin: 5px 0;
}

.basic-table td {
  vertical-align: top;
  padding: 8px;
  border: 1px solid #888;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.content-slider li {
  height: 140px;
  width: 256px;
  display: block;
}

.lSAction > a {
  background-image: url(/stcontents/img/ranks/common/controls.png) !important;
}

.lSAction > .lSNext {
  background-position: -40px 0 !important;
  right: 10px;
}

.lslide img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.lSPager {
  display: none !important;
}

@media (max-width: 767px) {
  .slider_area .item {
    width: calc(100% + 32px);
  }
  .slider_area .lSAction > .lSPrev,
  .slider_area .lSAction > .lSNext {
    display: none;
  }
}

.search-from-area .key-visual {
  height: 400px;
}

.search-from-area .search-box-col2 {
  bottom: 48px;
}

.search-from-area .fixed-on .result-header-sort {
  opacity: 1;
}

.search-from-area .root-main-foot {
  background: #FFF;
}

.search-from-area .popup-position {
  top: auto;
  bottom: 48px;
}

.search-from-area .popup-peopleroom {
  width: 430px;
}

.search-from-area .area-section {
  display: none;
}

.search-from-area .station-section .large_area_tag {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.search-from-area .station-section .large_area_tag li {
  margin: 0 14px 10px 0;
}

@media screen and (max-width: 767px) {
  .search-from-area .key-visual {
    height: 382px;
  }
  .search-from-area .search-box-col2 {
    bottom: 72px;
  }
  .search-from-area .result-list {
    background: #FFF;
    padding-top: 0;
  }
  .search-from-area .result-list .wrap {
    margin: 0 16px;
    padding-top: 24px;
  }
  .search-from-area .sub-target .result-header-sort .result-sort {
    margin-bottom: 8px;
  }
  .search-from-area .sub-target .result-header-sort .result-number {
    display: block;
    font-size: 1.4rem;
    margin-bottom: 8px;
  }
  .search-from-area .sub-target .result-header-sort .result-number span {
    margin-left: 4px;
    font-size: 1.6rem;
  }
  .search-from-area .sub-target .result-header-sort .result-number label {
    margin-left: 8px;
    font-size: 1.4rem;
  }
  .search-from-area .sub-target .result-header-sort .sort-change {
    width: calc(100% + 32px);
    margin: 0 -16px;
    padding: 8px 16px;
    background: #F5F5F5;
  }
  .search-from-area .sub-target .result-header-sort .sort-change a.active {
    font-size: 1.2rem;
  }
  .search-from-area .result-hotel-list {
    width: calc(100% + 32px);
    margin: 0 -16px;
    background: #F5F5F5;
    padding-bottom: 24px;
  }
  .search-from-area .result-hotel-list .result-hotel:last-child {
    margin-bottom: 0;
  }
  .search-from-area .area-section .hot-area-line .inner {
    background: #F5F5F5;
    padding: 16px;
    max-height: 276px;
  }
  .search-from-area .popup-peopleroom {
    padding: 26px 24px 120px;
  }
  .search-from-area .station-section .large_area_tag li {
    margin: 0 8px 16px 0;
  }
}

@media screen and (min-width: 824px) {
  .search-from-area .result-sort-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }
  .search-from-area .modal-sort.price-modal .inner {
    top: 475px;
    margin-left: -308px;
  }
  .search-from-area .modal-sort.price-modal.fixed .inner {
    top: 475px;
  }
}

@media screen and (min-width: 768px) {
  .search-from-area .modal-sort.price-modal .inner {
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}

@media (min-width: 768px) and (max-width: 1120px) {
  .search-from-area .modal-sort.price-modal .inner {
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    margin-left: 0;
    left: 16px;
  }
}

.search-from-area-2 .search-box-col2 {
  position: static;
  top: inherit;
  left: inherit;
  -webkit-transform: none;
          transform: none;
}

.search-from-area-2 .search-form-wrap {
  margin-top: 16px;
  height: 48px;
  position: relative;
}

@media screen and (min-width: 768px) {
  .search-from-area-2 .popup-dateSelector {
    top: 48px;
  }
  .search-from-area-2 .popup-peopleroom {
    top: 48px;
  }
  .search-from-area-2 .search-form-wrap {
    height: 60px;
  }
}

.campaigns .global-footer {
  display: none !important;
}

.campaigns .key-visual {
  background: url(/stcontents/img/sub-page/campaigns/kv-campaigns.jpg) center center no-repeat;
  background-size: cover;
  height: 520px;
  margin-bottom: 24px;
  position: relative;
}

/* 必要に応じてコメントアウト */
.campaigns .key-visual::before {
  content: "";
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  width: 100%;
  height: 60%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}
.campaigns .key-visual.linear-gradient-h-80p::before {
  height: 80%;
}

.campaigns h2 {
  text-align: center;
}

.campaigns .bd-gray {
  border: 1px solid #ddd;
}

.campaigns .bd-gray-2 {
  border: 2px solid #ddd;
}

.campaigns .bd-gray-3 {
  border: 3px solid #ddd;
}

.campaigns .bd-gray-4 {
  border: 4px solid #ddd;
}

.campaigns .inner {
  width: 94%;
  max-width: 1120px;
  position: absolute;
  -webkit-transform: none;
          transform: none;
  left: 0;
  right: 0;
  bottom: 48px;
  margin: auto;
  text-align: center;
  text-shadow: 0 0 5px #000;
}

.campaigns .key-visual .table-basic {
  max-width: 680px;
  margin: 0 auto;
  border: none;
  white-space: nowrap;
}

.campaigns .key-visual .table-basic th,
.campaigns .key-visual .table-basic td {
  border: none;
  padding: 4px 8px;
}

.campaigns .key-visual .inner.bottom-adjust .table-basic th,
.campaigns .key-visual .inner.bottom-adjust .table-basic td {
  padding: 4px 0;
}

.campaigns .key-visual .table-basic th {
  background: none;
}

.campaigns .key-visual .inner.bottom-adjust .table-basic th {
  width: 153px;
}

.campaigns h1 {
  margin-bottom: 8px;
}
@media screen and (min-width: 768px) {
  .campaigns h1 .line-48 {
    line-height: 48px;
  }
  .campaigns h1 .line-64 {
    line-height: 64px;
  }
}
@media screen and (max-width: 767px) {
  .campaigns h1 .sp-line-28 {
    line-height: 28px;
  }
  .campaigns h1 .sp-line-48 {
    line-height: 48px;
  }
}

.campaigns .float-bar {
  -webkit-transform: none !important;
          transform: none !important;
}

@media screen and (max-width: 1023px) {
  .campaigns .float-bar {
    padding: 0 16px;
  }
}

.campaigns .float-bar .btn-block a {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  vertical-align: middle;
}

@media screen and (max-width: 1023px) {
  .campaigns .float-bar .btn-block a:only-child {
    width: auto;
    max-width: none;
    margin-top: 8px;
  }
  .campaigns .float-bar.entry-btn .btn-block a.btn-wide:only-child {
    width: 100%;
  }
}

.campaigns .float-bar .btn-block a span {
  width: 100%;
  display: block;
  margin-bottom: -6px;
  font-size: 10px;
}

@media screen and (max-width: 1023px) {
  .campaigns .float-bar .btn-block a span {
    margin-bottom: -14px;
    line-height: 1.8;
  }
}

@media screen and (max-width: 1023px) {
  .campaigns .float-bar .btn-block a strong {
    width: 100%;
    display: block;
  }
}

.campaigns .sp-low-contents .sp-only {
  margin-bottom: 8px;
}

.campaigns .summary {
  padding: 32px;
  margin-bottom: 40px;
}

.campaigns .summary .logo {
  width: 330px;
}

.campaigns .campaign-detail {
  text-align: center;
  margin-bottom: 80px;
}

.campaigns .campaign-detail a {
  text-decoration: underline;
  color: #0066cc;
}

.campaigns .campaign-detail a:hover {
  text-decoration: none;
}

.campaigns .campaign-detail .ticket-info-tag
 {
  border: 1px solid #0F0A64;
  line-height: 1.0;
  padding: 8px 10px;
  vertical-align: middle;
  display: inline-block;
  font-size: 12px;
  border-radius: 100px;
  margin-top: -8px;
  margin-right: 8px;
  color: #0F0A64;
}

@media screen and (min-width: 768px) {
  .campaigns .campaign-detail .ticket-info-tag
   {
    font-size: 16px;
  }
}

.campaigns .campaign-detail .campaign-detail-coupons {
  margin: 32px 0;
}

.campaigns .campaign-detail .campaign-detail-coupons > li + li {
  border-top: 1px solid #c6c6c6;
  padding-top: 16px;
  margin-top: 16px;
}

.campaigns .campaign-detail .campaign-detail-coupons > li p {
  font-size: 32px;
  margin-bottom: 0;
  color: #0F0A64;
  font-weight: bold;
}

.campaigns .campaign-detail .photo-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 24px 0;
}

.campaigns .campaign-detail .photo-group img {
  width: 32%;
  height: 200px;
}

.campaigns .campaign-detail .table-basic {
  text-align: left;
}

.campaigns .campaign-detail .note,
.campaigns .campaign-period .note {
  text-align: left;
  font-size: 1.4rem;
  color: #757575;
  margin-top: 8px;
  margin-bottom: 24px;
}

.campaigns .campaign-detail .note.pc-text-center,
.campaigns .campaign-period .note.pc-text-center {
  text-align: center;
}

.campaigns .campaign-detail .note li,
.campaigns .campaign-period .note li {
  padding-left: 1em;
  text-indent: -1em;
}

.campaigns .campaign-detail .note li::before,
.campaigns .campaign-period .note li::before {
  content: "※";
}

.campaigns .campaign-detail a,
.campaigns .list-attention a,
.campaigns .list-asterisk a {
  text-decoration: underline;
  color: #0066cc;
}

.campaigns .campaign-detail a:hover,
.campaigns .list-attention a:hover,
.campaigns .list-asterisk a:hover {
  text-decoration: none;
}

.campaigns .recommend a {
  pointer-events: none;
}

.campaigns .recommend.complete a {
  pointer-events: auto;
}

.campaigns .introduction {
  margin-bottom: 80px;
}

.campaigns .introduction .border-red {
  border: 1px solid #FF503E;
  width: 80px;
  margin: 16px auto 24px;
}

.campaigns .introduction .color-gray-2 {
  margin-bottom: 16px;
}

.campaigns .list-attention {
  text-align: left;
  margin-bottom: 40px;
  font-size: 1.6rem;
}

.campaigns .list-attention li {
  padding-left: 1em;
  text-indent: -1em;
}

.campaigns .list-attention li::before {
  content: "・";
}

.campaigns .key-visual-complete {
  background: url(/stcontents/img/sub-page/campaigns/kv-campaigns.jpg) center center no-repeat;
  background-size: cover;
  overflow: visible;
  height: 565px;
  margin-bottom: 24px;
  position: relative;
}

.campaigns .key-visual-complete::before {
  content: "";
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  width: 100%;
  height: 60%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}

.campaigns .inner-box {
  width: 100%;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.campaigns .result-coupon {
  max-width: 600px;
  padding: 24px 12px;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0 auto;
  color: #000;
}

.campaigns .result-coupon .date {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 20px;
  font-size: 0;
}

.campaigns .result-coupon .date div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.campaigns .result-coupon .date div p {
  font-size: 1.6rem;
  font-weight: 900;
  margin-bottom: 0;
}

.campaigns .result-coupon .date div span {
  font-size: 1.4rem;
  font-weight: normal;
  margin-right: 8px;
}

.campaigns .result-coupon .date .reservation {
  border-right: 1px solid #757575;
  padding-right: 16px;
}

.campaigns .result-coupon .date .checkout {
  font-size: 0;
}

.campaigns .result-coupon .date .checkout span {
  margin-left: 16px;
}

.campaigns .result-coupon .coupon-code {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 8px auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #f5f5f5;
  padding: 8px;
}

.campaigns .result-coupon .coupon-code .clip-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  color: inherit;
}

.campaigns .result-coupon .coupon-code .clip-btn > span {
  text-decoration: underline;
}

.campaigns .result-coupon .coupon-code .clip-btn > img {
  display: block;
  width: 24px;
  height: 24px;
}

.campaigns .result-coupon .coupon-code .clip-btn:hover span {
  text-decoration: none;
}

.campaigns .result-coupon .coupon-code .clip-btn.clicked {
  color: #757575;
}

.campaigns .result-coupon .coupon-code .clip-btn.clicked span {
  text-decoration: none;
}

.campaigns.template .key-visual h1,
.campaigns.template .key-visual .inner {
  text-shadow: 1px 1px 1px #000;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

.campaigns.template .key-visual h1 strong {
  font-weight: bold;
  color: #FEE661;
}

.campaigns.template .key-visual-complete {
  height: 560px;
}

.campaigns.template .key-visual-complete .inner-box {
  padding: 0 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.campaigns.template .default-link:hover {
  color: #0066cc;
  text-decoration: none;
}

.campaigns.template .summary {
  padding: 24px;
  margin-bottom: 16px;
}

.campaigns.template .coupon {
  width: 100%;
  border: 1px solid #C6C6C6;
  padding: 40px;
  margin-top: 80px;
}

.campaigns.template .coupon .coupon-contents {
  width: 80%;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 auto;
}

.campaigns.template .coupon .coupon-contents .content {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 16px;
}

.campaigns.template .coupon .coupon-contents .content span {
  font-size: 1.6rem;
  font-weight: 500;
  padding: 8px 16px;
  border: 1px solid #0F0A64;
  border-radius: 50px;
  margin-right: 8px;
}

.campaigns.template .coupon .coupon-contents .coupon-text {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 16px 0;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid #C6C6C6;
  margin: auto;
  font-weight: 700;
}

.campaigns.template .coupon .coupon-contents .coupon-text .title {
  margin-right: 208px;
  font-size: 2.4rem;
  margin-bottom: 0;
}

.campaigns.template .coupon .coupon-contents .coupon-text .detail {
  margin-bottom: 0;
}

.campaigns.template .coupon .coupon-contents .coupon-text.font-normal {
  font-weight: 400;
}

.campaigns.template .coupon .coupon-contents .coupon-text:last-of-type {
  border-bottom: 0;
  margin-bottom: 16px;
}

.campaigns.template .coupon .coupon-contents .list-asterisk {
  font-size: 1.2rem;
  text-align: left;
}

.campaigns.template .recommend {
  width: 100%;
  /*margin: 0 calc(50% - 50vw);*/
  padding: 40px;
  margin-top: 80px;
  margin-bottom: 80px;
}

.campaigns.template .recommend .border-red,
.campaigns .border-red-line {
  border: 1px solid #FF503E;
  width: 80px;
  margin: 16px auto 24px;
}
.campaigns .border-red-line.short {
  border-width: 0.5px;
  width: 40px;
}

.campaigns.template .recommend .smartpass {
  max-width: 1120px;
  width: 100%;
  height: 300px;
  background: url(/stcontents/img/sub-page/campaigns/bg-smartpass.jpg) no-repeat center center;
  border-radius: 8px;
  background-size: cover;
  position: relative;
  overflow: hidden;
  margin-bottom: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.campaigns.template .recommend .smartpass .text {
  color: #fff;
  font-size: 2.8rem;
  font-weight: 700;
  text-shadow: 1px 1px 1px #000;
  z-index: 1;
  margin-bottom: 0;
}
.campaigns.template .recommend .smartpass .img-text {
  z-index: 1;
}

.campaigns.template .recommend .smartpass::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 220px;
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
}

.campaigns.template .recommend .photo-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 8px;
  height: 200px;
}

.campaigns.template .recommend .photo-group img {
  width: calc(100% / 3);
  margin-right: 1px;
  height: 200px;
  -o-object-fit: cover;
     object-fit: cover;
}

.campaigns.template .recommend.complete a:hover {
  color: inherit;
}

.campaigns.template .recommend.complete .btn-relux:hover {
  color: #fff;
}

.campaigns.template .recommend.complete .feature-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-bottom: 16px;
}

.campaigns.template .recommend.complete .feature-list li {
  width: 32%;
  margin-right: 2%;
  height: 160px;
  margin-bottom: 32px;
  overflow: hidden;
  position: relative;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-shadow: 1px 1px 1px #000;
  color: #fff;
}

.campaigns.template .recommend.complete .feature-list li img {
  height: 100%;
  width: 100%;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
}

.campaigns.template .recommend.complete .feature-list li a::before {
  position: absolute;
  content: "";
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  width: 100%;
  height: 117px;
  bottom: 0;
  left: 0;
}

.campaigns.template .recommend.complete .feature-list li .text {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  padding: 0 10px;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
  font-size: 2.4rem;
  color: #fff;
}

.campaigns.template .recommend.complete .feature-list li.bnr-one {
  width: 100%;
  margin: 0;
}

.campaigns.template .recommend.complete .feature-list li.bnr-one a {
  height:300px !important;
}

/* キャンペーンLP 特集バナー用 */
.campaigns.template .recommend.complete .feature-list .feature-gradient .text {
  top: 57%;
}
.campaigns.template .recommend.complete .feature-list .feature-gradient a::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 84%;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  bottom: 0;
  left: 0;
}
.campaigns.template .recommend.complete .feature-list .none-gradient a::before {
  display: none;
}

.campaigns.template .full-bg-color {
  background-color: #f5f5f5;
  max-width: 100%;
}

.campaigns.template .list-attention a {
  color: #333;
  text-decoration: underline;
}
.campaigns.template .list-attention a:hover {
  color: #333;
  text-decoration: none;
}
/* キャンペーンLP 特集バナー用 END */

/* キャンペーンLP用 3steps  */
.campaigns.template .recommend-steps > .wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0;
}

.campaigns.template .recommend-steps {
  width: 100%;
  margin-top: 80px;
  margin-bottom: 80px;
}

.campaigns.template .recommend-steps .border-red,
.campaigns .border-red-line {
  border: 1px solid #FF503E;
  width: 80px;
  margin: 16px auto 24px;
}

.campaigns.template .recommend-steps .photo-group-steps {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 8px;
  height: auto;
}

.campaigns.template .recommend-steps .photo-group-steps a img {
  width: calc(100% / 3);
  width: 100%;
  margin-right: 1px;
  -o-object-fit: cover;
     object-fit: cover;
}

.campaigns.template .recommend-steps .photo-group-steps .step-arrow {
  display: flex;
  justify-content: center;
  align-items: center;
}

.campaigns.template .recommend-steps .photo-group-steps .step-arrow img {
  width: 16px;
  margin-right: 16px;
  margin-left: 16px;
  height: 28px;
  -o-object-fit: cover;
     object-fit: cover;
}
/* キャンペーンLP用 3steps END */

/* キャンペーンLP用 sns追加  */
.campaigns.template .key-visual .sns,
.campaigns.template .key-visual-complete .sns
 {
  width: 100%;
  position: absolute;
  bottom: 16px;
  left: 0;
  text-align: right;
  line-height: 1;
  z-index: 2;
}
/* キャンペーンLP用 sns追加 END */

/* キャンペーンLP用 施設紹介箇所のコード化  */
.campaigns.template .recommend .intro-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  max-width: 1120px;
}
.campaigns.template .recommend .intro-contents {
  border: 1px solid #C6C6C6;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 16px 16px 16px;
  flex: 1;
  width: calc(100% / 3);
  width: 100%;
  margin-right: 16px;
  -o-object-fit: cover;
     object-fit: cover;
}
.campaigns.template .recommend .intro-contents:last-child {
  margin-right: 0;
}
.campaigns.template .recommend .intro-contents .intro-logo1,
.campaigns.template .recommend .intro-contents .intro-logo2,
.campaigns.template .recommend .intro-contents .intro-logo3
 {
  max-width: 220px;
  width: 300px;
  height: auto;
  object-fit: contain;
  margin-bottom: 16px;
}
.campaigns.template .recommend .intro-contents .intro-logo1 {
  margin-bottom: 26px;
}
.campaigns.template .recommend .intro-contents .intro-hotel {
  margin-bottom: 16px;
}
.campaigns.template .recommend .intro-contents .intro-text {
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 0;
}

@media screen and (max-width: 767px){
  .campaigns.template .recommend .intro-wrap {
    max-width: inherit;
  }
  .campaigns.template .recommend .intro-group {
    width: calc(100% + 32px);
    margin: 0 -16px 8px;
    padding: 0 16px;
    overflow: scroll;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    height: auto;
  }
  .campaigns.template .recommend .intro-group::-webkit-scrollbar {
    display: none;
  }
  .campaigns.template .recommend .intro-contents {
    width: 280px;
  }
  .campaigns.template .recommend .intro-contents .intro-hotel {
    margin-bottom: 8px;
  }
  .campaigns.template .recommend .intro-contents .intro-text {
    font-size: 1.4rem;
  }
}
/* キャンペーンLP用 施設紹介箇所のコード化 END */


@media screen and (max-width: 767px){
  .campaigns.template .recommend.complete .feature-list li.bnr-one a {
    height:160px !important;
  }
  .campaigns.template .recommend.complete .feature-list li.bnr-one .text {
    font-size: 20px;
  }
}

.campaigns.template .recommend.complete .feature-list-scroll {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 80px;
}

.campaigns.template .recommend.complete .feature-list-scroll div {
  width: 32%;
  margin-right: 2%;
  height: 160px;
  overflow: hidden;
  position: relative;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  text-shadow: 1px 1px 1px #000;
  color: #fff;
  list-style: none;
}

.campaigns.template .recommend.complete .feature-list-scroll div img {
  height: 100%;
  width: 100%;
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
}

.campaigns.template .recommend.complete .feature-list-scroll div a::before {
  position: absolute;
  content: "";
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, rgba(0, 0, 0, 0.5)));
  background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.5) 80%);
  width: 100%;
  height: 117px;
  bottom: 0;
  left: 0;
}

.campaigns.template .recommend.complete .feature-list-scroll div .text {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  padding: 0 10px;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
  font-size: 2.4rem;
  color: #fff;
}

.campaigns.template .recommend.complete .photo-group {
  border-radius: 8px;
  overflow: hidden;
}

.campaigns.template .recommend.complete .photo-group a {
  width: calc(100% / 3);
  margin-right: 1px;
}

.campaigns.template .recommend.complete .photo-group a:last-child {
  margin-right: 0;
}

.campaigns.template .attention-wrap {
  background-color: #f5f5f5;
}

.campaigns.template .banner {
  height: 120px;
  width: auto;
  margin-bottom: 160px;
}

.campaigns.template .banner:hover {
  opacity: 0.7;
}

.campaigns.template .app-banner {
  background-size: cover;
  margin-bottom: 40px;
}

.campaigns.template .app-banner .title {
  text-align: left;
}

@media (max-width: 1023px) {
  .campaigns .campaign-detail img {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .campaigns .key-visual {
    height: 560px;
    width: 100%;
    margin-bottom: 40px;
  }
  .campaigns .summary {
    padding: 32px 16px;
    margin-bottom: 40px;
  }
  .campaigns .summary .logo {
    width: 260px;
  }
  .campaigns .campaign-detail {
    margin-bottom: 40px;
  }
  .campaigns .campaign-detail .photo-group {
    display: block;
    margin: 16px 0 0;
  }
  .campaigns .campaign-detail .photo-group img {
    width: 100%;
    margin-bottom: 16px;
  }
  .campaigns .campaign-detail .note,
  .campaigns .campaign-period .note {
    text-align: left;
    font-size: 1rem;
  }
  .campaigns .campaign-detail .note.pc-text-center,
  .campaigns .campaign-period .note.pc-text-center {
    text-align: left;
  }
  .campaigns .introduction {
    margin-bottom: 40px;
  }
  .campaigns .introduction .border-red,
  .campaigns.template .recommend .border-red {
    width: 40px;
    margin: 8px auto 16px;
  }
  .campaigns .list-attention {
    margin-bottom: 24px;
    font-size: 1.4rem;
  }
  .campaigns .list-attention:last-child {
    margin-bottom: 0;
  }
  .campaigns .key-visual-complete {
    height: auto;
    margin-bottom: 40px;
  }
  .campaigns .inner-box {
    padding: 110px 16px 24px;
    -webkit-transform: translateY(0);
            transform: translateY(0);
    top: unset;
  }
  .campaigns .result-coupon .date {
    height: auto;
    display: block;
  }
  .campaigns .result-coupon .date .reservation {
    padding-right: 0;
    border-right: none;
  }
  .campaigns .result-coupon .date .checkout {
    padding-left: 0px;
  }
  .campaigns .result-coupon .date .checkout span {
    margin: 0;
  }
  .campaigns .result-coupon .date .border {
    border-bottom: 1px solid #333;
    width: 60px;
    margin: 8px auto;
  }
  .campaigns .result-coupon .date div {
    display: block;
  }
  .campaigns .result-coupon .date div span {
    font-size: 1.2rem;
    margin: 0;
  }
  .campaigns.template .inner {
    bottom: 40px;
    margin-bottom: 0;
    width: 100%;
    padding: 0 16px;
  }
  .campaigns.template .inner h1 {
    margin-bottom: 24px;
    font-size: 2.2rem;
  }
  .campaigns.template .inner.sns-on {
    bottom: 40px !important;
  }
  .campaigns.template .summary {
    padding: 16px;
  }
  .campaigns.template .coupon {
    padding: 16px;
  }
  .campaigns.template .coupon .coupon-contents {
    width: 100%;
  }
  .campaigns.template .coupon .coupon-contents .content {
    font-size: 1.6rem;
  }
  .campaigns.template .coupon .coupon-contents .content span {
    font-size: 1.2rem;
    display: block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto 8px;
    padding: 4px 8px;
  }
  .campaigns.template .coupon .coupon-contents .coupon-text {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 8px 0;
  }
  .campaigns.template .coupon .coupon-contents .coupon-text .title {
    margin-right: 32px;
    width: 50px;
    text-align: right;
    font-size: 2rem;
  }
  .campaigns.template .coupon .coupon-contents .coupon-text .title.font-xxx-large {
    font-size: 2.4rem;
  }
  .campaigns.template .coupon .coupon-contents .coupon-text .detail {
    font-size: 2.6rem;
  }
  .campaigns.template .recommend {
    margin: 40px 0;
    padding: 24px 16px;
    width: 100%;
  }
  .campaigns.template .recommend .border-red,
  .campaigns .border-red-line {
    width: 40px;
  }
  .campaigns.template .recommend .wrap {
    /* padding-left: 8px !important; */
    /* padding-right: 8px !important; */
    padding-left: 0 !important;
    padding-right: 0 !important;
    border: none;
  }
  .campaigns.template .recommend .wrap.p-0 {
    padding: 0 !important;
  }
  .campaigns.template .recommend .wrap.plr-sp-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .campaigns.template .recommend .wrap.plr-sp-16 {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .campaigns.template .recommend a {
    pointer-events: auto;
  }
  .campaigns.template .recommend a:hover {
    opacity: 1;
  }
  .campaigns.template .recommend .photo-group {
    width: calc(100% + 32px);
    margin: 0 -16px 8px;
    padding: 0 16px;
    overflow: scroll;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .campaigns.template .recommend .photo-group img {
    min-width: 316px;
    margin-right: 1px;
  }
  .campaigns.template .recommend .photo-group::-webkit-scrollbar {
    display: none;
  }


/* キャンペーンLP用 3steps(sp) */
.campaigns.template .recommend-steps {
  margin: 40px 0;
  width: 100%;
}
.campaigns.template .recommend-steps .border-red,
.campaigns .border-red-line {
  width: 40px;
}
.campaigns.template .recommend-steps .wrap.p-0 {
  padding: 0 !important;
}
.campaigns.template .recommend-steps .wrap.plr-sp-0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.campaigns.template .recommend-steps a {
  pointer-events: auto;
}
.campaigns.template .recommend-steps a:hover {
  opacity: 1;
}
.campaigns.template .recommend-steps .photo-group-steps {
  margin: 0 -16px 8px;
  padding: 24px 16px;
  overflow: scroll;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}
.campaigns.template .recommend-steps .photo-group-steps a img {
  width: 289px;
  height: 252px;
  margin-right: 0;
  -o-object-fit: unset;
  object-fit: unset;
}
.campaigns.template .recommend-steps .photo-group-steps::-webkit-scrollbar {
  display: none;
}
.campaigns.template .recommend-steps .photo-group-steps .step-arrow img {
  margin-right: 8px;
  margin-left: 8px;
}
/* /キャンペーンLP用 3steps(sp) END */

  .campaigns.template .recommend .smartpass {
    height: 160px;
    margin-bottom: 40px;
  }
  .campaigns.template .recommend .smartpass .text {
    width: 100%;
    font-size: 2rem;
  }
  .campaigns.template .recommend .smartpass .img-text {
    width: 272px;
  }
  .campaigns.template .recommend.complete .feature-list {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .campaigns.template .recommend.complete .feature-list li {
    width: calc(50% - 4px);
    height: 120px;
    margin-bottom: 8px;
    margin-right: 0;
  }
  .campaigns.template .recommend.complete .feature-list li .text {
    font-size: 1.6rem;
    line-height: 1.5;
    padding: 0 10px;
  }
  .campaigns.template .recommend.complete .feature-list-scroll {
    position: relative;
    height: 160px;
    margin: 0 -16px 40px;
    padding: 0 16px;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    white-space: nowrap;
    overflow: scroll;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .campaigns.template .recommend.complete .feature-list-scroll div {
    min-width: 310px;
    height: 160px;
    margin-right: 16px;
    margin-bottom: 0;
    white-space: nowrap;
  }
  .campaigns.template .recommend.complete .feature-list-scroll div .text {
    font-size: 2rem;
  }
  .campaigns.template .recommend.complete .feature-list-scroll::-webkit-scrollbar {
    display: none;
  }
  .campaigns.template .recommend.complete .photo-group {
    border-radius: 0;
    overflow: scroll;
  }
  .campaigns.template .recommend.complete .photo-group img {
    margin-right: 1px;
  }
  .campaigns.template .recommend.complete .photo-group img:first-child {
    border-radius: 8px 0 0 8px;
  }
  .campaigns.template .recommend.complete .photo-group img:last-child {
    margin-right: 0;
    border-radius: 0 8px 8px 0;
  }
  .campaigns.template .banner {
    width: 100%;
    height: auto;
    margin-bottom: 80px;
  }
  .campaigns.template .app-banner,
  .campaigns.template .attention-wrap {
    width: 100%;
    position: relative;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .campaigns .roulette-wrap .roulette-box {
    padding-top: 50px;
  }
  .campaigns .roulette-wrap .letter-box h1,
  .campaigns .anime-box .letter-box h1 {
    line-height: 1.5;
    margin-bottom: 4px;
  }
  .campaigns .letter-box .result-coupon .coupon-band {
    padding: 2px;
  }
  .campaigns .roulette-wrap .roulette-box .roulette-img {
    max-width: 83%;
  }
  .campaigns .roulette-wrap .roulette-box .roulette-pin {
    transform: translate(-50%,160%);
    width: 30px;
  }
  .campaigns .roulette-wrap .letter-box {
    width: auto !important;
    top: 80px !important;
    bottom: inherit !important;
    margin-top: 100px !important;
    margin-bottom: 0 !important;
  }
  .campaigns .roulette-wrap .letter-box.active {
    margin-top: 0 !important;
  }
  .campaigns .anime-box .letter-box {
    top: 38px !important;
  }

  .campaigns .campaign-detail .campaign-detail-coupons {
    margin: 16px 0;
  }

  .campaigns .campaign-detail .campaign-detail-coupons > li + li {
    padding-top: 8px;
    margin-top: 8px;
  }

  .campaigns .campaign-detail .campaign-detail-coupons > li p {
    font-size: 2.6rem;
  }
}

@media screen and (max-width: 360px){
  .campaigns .key-visual.kv-adjust {
    height: 460px;
  }
}

.campaigns .letter-box {
  width: 560px !important;
  height: 300px;
  position: relative;
  margin: 0 auto;
  transform: translateY(-22%) !important;
  z-index: 1;
}
.campaigns .letter-box .result-coupon {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-1.png) no-repeat center center;
  background-size: contain;
  width: 550px;
  height: 278px;
  padding: 64px 12px 0;
}
.campaigns .letter-box.kv-special-feature .result-coupon {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-1-special-feature.png) no-repeat center center;
  background-size: contain;
  max-width: 648px;
  width: 648px;
  height: 448px;
  padding: 24px;
}
.campaigns .anime-parts-4.kv-anchor .result-coupon {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-1.png) no-repeat center center;
  background-size: contain;
  width: 550px;
  height: 278px;
  padding: 64px 12px 0;
}
.campaigns .letter-box .result-coupon.wide {
  padding: 54px 56px 0;
}
.campaigns .letter-box .result-coupon .coupon-title {
  display: inline-block;
}
.campaigns .letter-box .result-coupon .coupon-band {
  background-color: #F3F8FD;
}
.campaigns .letter-box.kv-special-feature .result-coupon a {
  width: 342px;
}
.campaigns .letter-box.kv-special-feature .result-coupon .kv-smartpass {
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  position: relative;
}
.campaigns .letter-box.kv-special-feature .result-coupon .kv-smartpass::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
  opacity: 0.6;
  transform: rotate(-180deg);
  border-radius: 8px;
}
.campaigns .letter-box.kv-special-feature .result-coupon .kv-smartpass.no-linear-gradient::before {
  display: none;
}
.campaigns .letter-box.kv-special-feature .result-coupon .btn-relux {
  width: 100%;
  height: 40px;
  font-size: 1.4rem;
  margin-top: 8px;
}
.campaigns .letter-box.kv-special-feature .result-coupon .btn-relux:hover {
  background-color: #0f0a64;
  border-color: #0f0a64;
}
.campaigns .letter-box.kv-special-feature .result-coupon .kv-smartpass .text {
  color: #fff;
  font-size: 2rem;
  font-weight: 700;
  text-shadow: 1px 1px 1px #000;
  z-index: 1;
  margin-bottom: 0;
}
.campaigns .letter-box .icon-anime-ponta {
  background: url(/stcontents/img/sub-page/campaigns/icon-ponta-anime.png) no-repeat center center;
  background-size: contain;
  width: 150px;
  height: 150px;
  position: absolute;
  bottom: -8px;
  right: -90px;
  z-index: 3;
  opacity: 0;
  animation: 0.4s 3.2s fadein-anime forwards;
}
@media screen and (min-width: 768px) {
  .campaigns .anime-box .letter-box {
    transform: translateY(0%) !important;
  }
  .campaigns .letter-box.kv-special-feature {
    width: 648px !important;
    height: 448px;
  }
}
@media screen and (max-width: 1023px){
  .campaigns .letter-box .icon-anime-ponta {
    width: 120px;
    height: 120px;
    bottom: -8px;
    right: -8px;
  }
}
@media screen and (max-width: 767px){
  .campaigns .letter-box {
    max-width: 358px;
    width: 100% !important;
    height: auto;
    top: 34% !important;
  }
  .campaigns .letter-box.kv-special-feature {
    max-width: 375px;
    width: 375px;
    height: 440px;
  }
  .campaigns .anime-box .anime-parts-4.kv-sf .letter-box.kv-special-feature {
    width: 375px !important;
    transform: translate(-50%, -30%) scale(1) !important;
  }
  .campaigns .letter-box .result-coupon {
      background: url(/stcontents/img/sub-page/campaigns/anime-parts-1-sp.png) no-repeat center center;
      background-size: contain;
      width: 262px;
      height: 214px;
      padding: 35px 16px 0;
      line-height: 1.6;
      letter-spacing: 0;
  }
  .campaigns .letter-box .result-coupon.wide {
    width: 274px;
    height: 224px;
    padding: 30px 26px 0;
  }
  .campaigns .letter-box.kv-special-feature .result-coupon {
    background: url(/stcontents/img/sub-page/campaigns/anime-parts-1-special-feature-sp.png) no-repeat center center;
    background-size: contain;
    width: 375px;
    height: 440px;
    padding: 20px 16px;
  }
  .campaigns .letter-box.kv-special-feature .result-coupon a {
    width: 310px;
  }
  .campaigns .letter-box .icon-anime-ponta {
    width: 160px;
    height: 140px;
    bottom: -118px;
    right: 20%;
  }
}
@media screen and (max-width: 360px) {
  .campaigns.template .letter-box.inner-box {
    transform: translate(-50%, 12px) scale(1) !important;
  }
  .campaigns.template .letter-box.inner-box.kv-special-feature {
    transform: translate(-50%, -50%) scale(0.75) !important;
  }
}

.campaigns .present-list-box {
  margin: 20px auto 30px;
}

.campaigns .present-list-box dl {
  max-width: 280px;
  margin: 0 auto;
  font-size: 2.4rem;
  border-bottom: 1px #DDDDDD solid;
  clear: both;
  line-height: 1.5;
  overflow: hidden;
}

.campaigns .present-list-box dl dt {
  line-height: 2.1;
}

.campaigns .present-list-box dl:last-child {
  border-bottom: none;
}

.campaigns .present-list-box dl dt,
.campaigns .present-list-box dl dd {
  padding: 4px 16px;
  overflow: hidden;
}

.campaigns .present-list-box dl dt {
  display: inline-block;
}

.campaigns .present-list-box dl dd {
  display: inline-block;
}

.campaigns .present-list-box.noprize dl dd {
  float: none;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .campaigns .present-list-box dl {
    font-size: 2rem;
  }
}

/* 1/23全国2,000円OFF CP(取得前) */
.kv-shadow {
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.6)));
  background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6));
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6));
}

li.font757575 {
  color: #757575;
}

.uservoice {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-bottom: 40px;
}

.uservoice .uservoice-item {
  border: 1px solid #C6C6C6;
  width: calc((100% - 64px) / 3);
  padding: 24px;
}

.uservoice .font-large {
  text-align: left !important;
}
.uservoice .color-gray-2 {
  text-align: right !important;
  margin-bottom: 0 !important;
}
@media screen and (max-width: 767px) {
  .uservoice {
    width: auto;
    padding-bottom: 0;
  }
  .uservoice .uservoice-item {
    border: none;
    width: auto;
    padding: 0;
  }
  .uservoice .uservoice-item .font-large {
    text-align: left !important;
  }
  .uservoice .uservoice-item .color-gray-2 {
    text-align: right !important;
    margin-bottom: 0;
  }
}
.campaigns .campaign-detail {
  margin-bottom: 0;
}

.campaigns .campaign-detail .note li,
.campaigns .campaign-period .note li {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 400;
  font-size: 1.2rem;
  line-height: 18px;
  color: #757575;
}

.campaigns .campaign-detail .note li a,
.campaigns .campaign-period .note li a {
  text-decoration: underline;
  color: #0066cc;
}

@media screen and (max-width: 375px) {
  .font-sp-20 {
    font-size: 2.0rem;
  }
  .sp-block {
    display: block;
  }
  .campaigns .key-visual {
    margin-bottom: 16px;
  }
  .campaigns .campaign-detail .note li {
    font-size: 1.0rem;
  }
  .campaigns .campaign-detail .ticket-info-tag
   {
    margin: 0 auto;
    display: block;
    padding: 8px;
  }
  .campaigns .campaign-detail p.mt-24 {
    margin-top: 8px !important;
  }
  .campaigns .campaign-detail p.mt-16 {
    margin-top: 8px !important;
  }
  .campaigns .campaign-detail p.mb-16 {
    margin-bottom: 8px !important;
  }
  .campaigns .campaign-detail p.mt-sp-40 {
    margin-top: 40px !important;
  }
  .font757575 {
    color: #757575;
  }
}

/* 1/23全国2,000円OFF CP(取得後) */
h2.b20 {
  font-style: normal;
  font-weight: 700;
  font-size: 2.0rem;
  line-height: 36px;
  text-align: center;
  letter-spacing: 1px;
  color: #333;
}

p.b-36 {
  font-style: normal;
  font-weight: 700;
  font-size: 3.6rem;
  line-height: 64px;
  text-align: center;
  letter-spacing: 1px;
  color: #0F0A64;
}

.campaigns .result-coupon {
  max-width: 600px;
  padding: 40px 12px;
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0 auto;
  color: #000;
}

.campaigns.template .app-banner {
  margin-bottom: 80px !important;
}
.campaigns.template .summary {
  padding: 0;
  height: 52px;
}
.campaigns.template .summary-2 .logo {
  width: 288px;
  margin-top: 15px;
}
.campaigns.template .recommend {
  margin-top: 40px;
}
.mt-80-40 {
  margin-top: 80px !important;
}
@media screen and (max-width: 375px) {
  .campaigns .result-coupon p.b-36 {
    font-size: 2.6rem;
  }
  .campaigns.template .summary {
    padding: 0;
  }
  .campaigns.template .summary-2 {
    height: 40px;
  }
  .campaigns.template .summary .logo {
    width: 200px;
    margin-top: 8px;
  }
  .campaigns.template .summary-2 .logo {
    width: 230px;
    margin-top: 12px;
  }
  .campaigns .key-visual-complete {
    margin-bottom: 16px;
  }
  .campaigns.template .app-banner {
    width: 100vw;
    margin-bottom: 40px !important;
  }
  .campaigns.template .app-banner .title .description {
    text-align: center !important;
  }
  .campaigns.template .recommend {
    margin-top: 26px;
  }
  .mt-80-40 {
    margin-top: 40px !important;
  }
}

.campaigns .campaign-detail .present-list-box-100 {
  margin-bottom: 8px
}

.campaigns .present-list-box-100 .present-list-inner100:last-child {
  width: 100%;
  border-bottom: none;
}

.campaigns .present-list-box-100 .present-list-inner100 {
  width: 100%;
  padding: 0 24px;
  border-bottom: 1px solid #c6c6c6;
}
.campaigns .present-list-box-100 .present-list-inner100 dl {
  max-width: 410px;
  margin: auto;
  position: relative;
  overflow: hidden;
}

.campaigns .present-list-box-100 .present-list-inner100 dl dt {
  display: block;
  text-align: left;
  float: left;
  line-height: 64px !important;
}

.campaigns .present-list-box-100 .present-list-inner100 dl dd {
  display: block;
  text-align: left;
  float: right;
  line-height: 64px !important;
}

.campaigns .present-list-box-100 .present-list-inner100 dl .dt00 {
  padding: 4px 0 0 0 !important;
  font-size: 2.6rem !important;
  font-weight: 700 !important;
}

.campaigns .present-list-box-100 .present-list-inner100 dl .dt01 {
  padding: 4px 0 0 15px !important;
  font-size: 2.4rem !important;
  font-weight: 700 !important;
}
.campaigns .present-list-box-100 .present-list-inner100 dl .dt02 {
  padding: 4px 0 0 15px !important;
  font-size: 2.4rem !important;
  font-weight: 700 !important;
}
.campaigns .present-list-box-100 .present-list-inner100 dl .dt03 {
  padding: 4px 0 0 15px !important;
  font-size: 2.4rem !important;
  font-weight: 700 !important;
}
.campaigns .present-list-box-100 .present-list-inner100 dl .dt04 {
  padding: 4px 0 0 15px !important;
  font-size: 2.4rem !important;
  font-weight: 400 !important;
}
.campaigns .present-list-box-100 .present-list-inner100 dl .dt05 {
  padding: 4px 0 0 15px !important;
  font-size: 2.4rem !important;
  font-weight: 400 !important;
}
.campaigns .present-list-box-100 .present-list-inner100 dl .dd01, .campaigns .present-list-box-100 .present-list-inner100 dl .dd02, .campaigns .present-list-box-100 .present-list-inner100 dl .dd03 {
  padding: 4px 0 0 19px !important;
}

.campaigns .present-list-box-100 .present-list-inner100 dl .dd04, .campaigns .present-list-box-100 .present-list-inner100 dl .dd05 {
  padding: 4px 0 0 39px !important;
}
.campaign-detail .detail ul.text-center {
  text-align: center;
  font-size: 1.2rem;
  line-height: 18px;
  margin-top: 16px;
}
.text-pc-center-sp-left {
  text-align: center;
}
.comparisonarea h2.text-pc-20 {
  font-size: 2.0rem !important;
}

@media screen and (max-width: 767px) {
  .campaigns .key-visual .table-basic th,
  .campaigns .key-visual .table-basic td {
      display: table-cell;
      font-size: 1.2rem;
  }
  .campaigns .key-visual .inner.bottom-adjust .table-basic th,
  .campaigns .key-visual .inner.bottom-adjust .table-basic td {
      font-size: 1.4rem;
  }

  .campaigns .campaign-detail .ticket-info-tag {
    width: 75px;
    margin: 0 auto;
  }

  .campaigns .campaign-detail .ticket-info-tag.sp-long {
    width: 120px;
  }

  .campaigns .campaign-detail .ticket-info-tag.sp-middle {
    width: 90px;
  }

  .campaigns .campaign-detail ul li {
    font-size: 1.0rem;
  }
  .text-sp-10 {
    font-size: 1.0rem;
  }
  .mb-sp-12 {
    margin-bottom: 12px !important;
  }
  .font-small-sp {
    font-size: 1.0rem !important;
  }
  .text-sp-16 {
    font-size: 1.6rem !important;
  }
  .text-pc-center-sp-left {
    text-align: left;
  }
}

.mini-app {
  background: #fff;
  padding-bottom: 120px;
}

@media (max-width: 767px) {
  .mini-app {
    padding-bottom: 105px;
  }
}

.mini-app {
  /*
  コンテンツ
*/
  /*--------------------------------notice----------------------------*/
  /*/////  memberStatusIntroduce__status  /////////////////////////////////*/
  /* --------

 #pankuzu

-------- */
  /* ----------------------------------------------------------------------
  footer 固定ボタン
----------------------------------------------------------------------- */
  /* ログイン */
  /*
  ログインフローページ
*/
  /*
  LP
*/
  /*
.kv .text ul {
  width: auto;
  margin: 0 auto;
  font-size: 14px;
}
.kv .text ul li {
  background: none;
  margin-bottom: 12px;
  padding: 0;
  font-weight: bold;
}
*/
}

.mini-app section {
  padding: 40px 0;
}

.mini-app section .wrap {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px;
  font-size: 12px;
}

.mini-app section img {
  max-width: 100%;
}

.mini-app section h2 {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 1px;
  text-align: center;
  color: #000;
}

.mini-app section h3 {
  font-weight: bold;
}

.mini-app .pc {
  display: none;
}

.mini-app .sp {
  display: block;
}

.mini-app .bg-gray {
  background: #F5F5F5;
}

.mini-app .text-center {
  text-align: center;
}

.mini-app .tect-right {
  text-align: right;
}

.mini-app .font-bold {
  font-weight: bold;
}

.mini-app .font-small {
  font-size: 16px;
}

.mini-app .kv {
  width: 100%;
  height: 512px;
  background-image: url("/stcontents/img/mini-app/keyvisual-pc.jpg");
  background-position: 70% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .mini-app section h2 {
    font-size: 28px;
  }
  .mini-app section .wrap {
    font-size: 18px;
  }
  .mini-app .kv {
    background-position: 50% 70%;
    width: 100%;
    height: 600px;
    background-image: url("/stcontents/img/mini-app/keyvisual-sp.jpg");
    background-position: 70% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  }
}

.mini-app .kv .text {
  position: absolute;
  padding: 0 14px 16px;
  bottom: 0;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.mini-app .kv-logo {
  text-align: center;
}

.mini-app .headerTitle {
  font-weight: bold;
  color: #fff;
  letter-spacing: 1px;
  text-align: center;
}

.mini-app .kv .text ul {
  width: 640px;
  height: 147px;
  margin: 32px auto 0;
  font-weight: bold;
  font-size: 24px;
  color: #fff;
}

.mini-app .kv .text ul li {
  background: url(/stcontents/img/mini-app/icon-check.svg) no-repeat left center;
  padding-left: 45px;
  margin-bottom: 8px;
  font-weight: normal;
}

.mini-app .kv .text ul li span {
  font-weight: bold;
  color: #ffdd63;
}

.mini-app .kv .text .note {
  vertical-align: text-top;
  font-size: 10px;
}

.mini-app .kv .text ul li.no-mark {
  background: none;
  font-size: 10px;
}

.mini-app .headerSubTitle {
  font-size: 14px;
  color: #fff;
  margin-top: 12px;
  letter-spacing: 0;
}

.mini-app .headerSubTitle + .headerSubTitle {
  margin-top: 8px;
}

.mini-app .shareBtn {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-top: 18px;
}

.mini-app .shareBtnItem img {
  height: 32px;
  width: 32px;
}

.mini-app .shareBtnItem + .shareBtnItem {
  margin-left: 16px;
}

.mini-app .shareBtnLink {
  background-size: cover;
  display: block;
  height: 100%;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .mini-app .pc {
    display: block;
  }
  .mini-app .sp {
    display: none;
  }
  .mini-app .kv .text {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    max-width: 1040px;
    padding: 0 16px 24px;
    top: 144px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .mini-app .headerTitle {
    margin-top: 32px;
    font-size: 54px;
  }
  .mini-app .headerTitle span {
    font-size: 38px;
  }
  .mini-app .shareBtnItem-line {
    display: none;
  }
  .mini-app .shareBtn {
    margin-top: 24px;
  }
  .mini-app .headerSubTitle {
    line-height: 2;
    letter-spacing: 1px;
  }
}

.mini-app section.point_notice {
  margin: 0;
}

.mini-app .notice_Cushion {
  background-color: #ffe63e;
  padding: 8px;
}

.mini-app .notice {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 30px 16px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  background-color: #fff;
}

.mini-app section.point_notice h2.notice_title {
  font-size: 20px;
  font-size: 1.25rem;
  padding-right: 0px;
}

.mini-app .notice_title {
  font-size: 16px;
  font-size: 1rem;
  font-weight: bold;
  padding: 10px 0px 24px;
  text-align: center;
}

.mini-app .notice_text span {
  color: #f67a00;
}

.mini-app .notice_comment {
  margin: 0 8px;
  padding-top: 8px;
}

.mini-app .notice_explain {
  font-size: 14px;
  font-size: 0.875rem;
  text-align: center;
  margin-bottom: 8px;
}

@media screen and (min-width: 768px) {
  .mini-app section.point_notice h2.notice_title {
    font-size: 20px;
    font-size: 1.25rem;
    padding-top: 30px;
    padding-right: 54px;
    border-right: 2px solid #d8d8d8;
  }
  .mini-app .notice {
    padding: 16px 8px;
  }
  .mini-app .notice_title {
    font-size: 16px;
    font-size: 1rem;
    padding: 10px 0px;
  }
  .mini-app .notice_text {
    margin-left: 80px;
  }
  .mini-app .notice {
    max-width: 960px;
    margin: auto;
    padding: 40px 64px;
    -webkit-box-orient: inherit;
    -webkit-box-direction: inherit;
    -webkit-flex-direction: inherit;
        -ms-flex-direction: inherit;
            flex-direction: inherit;
  }
  .mini-app .notice_Cushion {
    background-color: #ffe63e;
    padding: 10px 0;
  }
  .mini-app .notice_comment {
    max-width: 1080px;
    margin: auto;
  }
  .mini-app .notice_explain {
    font-size: 14px;
    font-size: 0.875rem;
    text-align: left;
    margin: 0;
  }
}

.mini-app .message {
  text-align: center;
}

.mini-app .message h2 {
  font-size: 20px;
}

.mini-app .message h2 .large {
  font-size: 24px;
}

.mini-app .message h2 .orange {
  color: #f67a00;
}

.mini-app .message .text {
  text-align: left;
  line-height: 2;
  font-size: 16px;
  color: #000;
}

.mini-app .message img {
  display: inline-block;
  max-width: 200px;
  margin: 32px auto 40px;
}

.mini-app .reluxPoint {
  text-align: center;
}

.mini-app .reluxPoint .bg {
  background: url(/stcontents/img/mini-app/reluxpoint-bg-sp.jpg) no-repeat 0 0;
  background-size: cover;
  height: 432px;
  text-align: center;
}

.mini-app .reluxPoint img {
  width: 100%;
  max-width: 400px;
  margin-top: -190px;
  border-radius: 6px;
}

.mini-app .howto {
  background: url(/stcontents/img/mini-app/bg-sky.jpg) no-repeat 0 0;
  background-size: cover;
  padding: 32px 0;
}

.mini-app .howto .wrap {
  background: #fff;
  margin: 0 8px;
  padding: 32px 16px;
  border-radius: 6px;
  color: #000;
}

.mini-app .howto h2 {
  font-size: 18px;
  margin-bottom: 24px;
}

.mini-app .howto dl {
  border-top: 1px solid #d8d8d8;
  padding: 32px 0 32px;
  text-align: center;
}

.mini-app .howto dl dt span {
  background: #0a0f64;
  display: inline-block;
  width: 110px;
  margin-bottom: 24px;
  padding: 4px 6px 3px;
  border-radius: 20px;
  text-align: center;
  font-weight: bold;
  font-size: 14px;
  color: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app .howto dl p {
  padding-top: 16px;
  font-size: 12px;
}

.mini-app .howto dl h3 {
  font-size: 14px;
}

.mini-app .howto dl img {
  max-width: 260px;
  width: 100%;
  display: inline-block;
  margin-top: 16px;
}

.mini-app .noteText {
  padding-top: 24px;
  border-top: 2px solid #d8d8d8;
  font-size: 12px;
  color: #757575;
}

.mini-app .noteText h3 {
  margin-bottom: 4px;
}

.mini-app .noteText ul {
  padding-left: 1em;
  text-indent: -1em;
}

.mini-app .benefits .noteText {
  padding-left: 24px;
  border-top: none;
}

.mini-app .benefits h2 span {
  color: #FF9123;
}

.mini-app .benefits .figure {
  margin: 0 auto;
  text-align: center;
  margin-bottom: 16px;
}

.mini-app .benefits .figure img {
  width: 230px;
}

.mini-app .benefits .figure p {
  font-size: 12px;
}

.mini-app .discount .figure {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.mini-app .statusDetail {
  padding-top: 0;
}

.mini-app .statusDetail .noteText {
  border: none;
}

@media screen and (min-width: 768px) {
  .mini-app .message h2 .large {
    font-size: 32px;
  }
  .mini-app .message .text {
    text-align: center;
  }
  .mini-app .message img {
    max-width: 260px;
  }
  .mini-app .reluxPoint .bg {
    background: url(/stcontents/img/mini-app/reluxpoint-bg.jpg) no-repeat 0 0;
    background-size: cover;
  }
  .mini-app .reluxPoint img {
    margin-top: -200px;
    max-width: 100%;
  }
  .mini-app .howto {
    padding: 60px 0;
  }
  .mini-app .howto h2 {
    font-size: 28px;
    margin-bottom: 52px;
  }
  .mini-app .howto .wrap {
    margin: 0 auto;
    padding: 80px 80px;
  }
  .mini-app .howto dl {
    border-top: 2px solid #d8d8d8;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    padding: 48px 0 48px;
    text-align: left;
  }
  .mini-app .howto dl dt {
    width: 25%;
  }
  .mini-app .howto dl dd {
    width: 75%;
  }
  .mini-app .howto dl h3 {
    font-size: inherit;
  }
  .mini-app .howto dl dt span {
    margin-bottom: 0;
  }
  .mini-app .howto dl img {
    max-width: 400px;
  }
  .mini-app .noteText {
    padding-top: 40px;
  }
}

.mini-app .addPoint {
  background: #0f0a64;
  padding: 32px 0;
  color: #fff;
}

.mini-app .addPoint h2 {
  margin: 0 0 10px;
  text-align: left;
  color: #fff;
}

.mini-app .addPoint .flex {
  padding: 0 16px;
}

.mini-app .addPoint .flex .right {
  margin-top: 32px;
}

.mini-app .addPoint .flex .right .box {
  max-width: 312px;
  width: 100%;
  margin: 0 auto;
  padding: 12px 10px;
  background: #fff;
  border-radius: 4px;
  border-bottom: 4px solid #d8d8d8;
  text-align: center;
  font-size: 12px;
  color: #000;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app .addPoint .flex .right .box span {
  display: inline-block;
  margin-bottom: 4px;
  font-weight: bold;
  font-size: 20px;
}

.mini-app .addPoint .flex .right .box:last-of-type {
  padding: 20px 10px;
}

.mini-app .addPoint .flex .arrow {
  width: 24px;
  margin: 12px auto 10px;
  line-height: 1;
}

.mini-app .addPoint .note {
  margin-top: 16px;
  font-size: 12px;
  letter-spacing: 0;
}

.mini-app .faq dl {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-top: 24px;
  font-size: 12px;
}

.mini-app .faq dl dt,
.mini-app .faq dl dd {
  margin-top: 24px;
}

.mini-app .faq dl dt {
  width: 50px;
}

.mini-app .faq dl dd {
  width: calc(100% - 50px);
  -webkit-align-self: center;
      -ms-flex-item-align: center;
              -ms-grid-row-align: center;
          align-self: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app .faq dl dt span {
  background-color: #0a0f64;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 32px;
  height: 32px;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 50% 50%;
  font-weight: bold;
  font-size: 16px;
  color: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  letter-spacing: 0;
}

.mini-app .faq dl dt:nth-of-type(2) span {
  background-color: #fff;
  border: 2px solid #0a0f64;
  color: #0a0f64;
}

.mini-app .faq dl dd h3 {
  color: #0a0f64;
}

.mini-app .bnrGtt {
  padding-top: 40px;
  border-top: 2px solid #d8d8d8;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .mini-app .addPoint {
    padding: 56px 0;
  }
  .mini-app .addPoint h2 {
    margin: 30px 0 10px;
  }
  .mini-app .addPoint .flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
  }
  .mini-app .addPoint .flex .left {
    width: 64.5%;
  }
  .mini-app .addPoint .flex .right {
    width: 35.5%;
    margin-top: 0;
    text-align: center;
  }
  .mini-app .addPoint .flex .right .box:first-of-type {
    width: 234px;
  }
  .mini-app .addPoint .note {
    margin-top: 60px;
  }
  .mini-app .faq {
    padding-bottom: 30px;
  }
  .mini-app .faq dl {
    margin-top: 56px;
    font-size: 16px;
  }
  .mini-app .faq dl dt span {
    width: 48px;
    height: 48px;
    font-size: 20px;
  }
  .mini-app .faq dl dt,
  .mini-app .faq dl dd {
    margin-top: 10px;
  }
  .mini-app .faq dl dd {
    padding-left: 38px;
  }
  .mini-app .bnrGtt {
    padding-top: 70px;
  }
}

.mini-app .statusDetail h2 {
  margin-bottom: 40px;
}

.mini-app .memberStatusIntroduce__statusListSP {
  margin-top: 16px;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemTitle {
  cursor: pointer;
  height: 44px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  line-height: 44px;
  text-align: center;
  border-radius: 4px;
  position: relative;
  margin-top: 16px;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemTitle::before {
  border-top: 1.5px solid #333;
  border-right: 1.5px solid #333;
  bottom: 0;
  content: "";
  height: 7px;
  margin: auto;
  position: absolute;
  top: 0;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  width: 7px;
  border-top: 1.5px solid #fff;
  border-right: 1.5px solid #fff;
  right: 20px;
  bottom: 4px;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemTitle.is-actived::before {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 8px;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemDetailBox {
  margin: 8px 0 24px;
  display: none;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemDetailBox.is-open {
  display: block;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemDetail {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 16px 0;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #ccc;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemTxta {
  line-height: 2;
  font-size: 11px;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemTxtb {
  line-height: 2;
  font-size: 12px;
  font-weight: bold;
}

.mini-app .memberStatusIntroduce__statusListSP .memberStatusIntroduce__statusListItemTxtc {
  padding-top: 22px;
  font-size: 16px;
  font-weight: bold;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  text-align: right;
}

@media screen and (min-width: 768px) {
  .mini-app .memberStatusIntroduce__wrapperS.sp {
    display: none;
  }
}

.mini-app .statusNotice .wrap {
  margin: 0 auto 0;
  padding: 0 16px;
}

.mini-app .statusNotice p {
  font-size: 14px;
  line-height: 21px;
}

@media screen and (min-width: 768px) {
  .mini-app .statusNotice .wrap {
    max-width: 960px;
  }
  .mini-app .statusNotice p {
    font-size: 14px;
    line-height: 30px;
  }
}

.mini-app ul#pankuzu {
  color: #333;
  letter-spacing: -.4em;
}

.mini-app ul#pankuzu li {
  display: inline-block;
  letter-spacing: normal;
  font-size: 11px;
  color: #333;
}

.mini-app li.li_pankuzu {
  background-image: url("/stcontents/img/mini-app/pankuzu_listmark.png");
  background-position: right center;
  background-repeat: no-repeat;
  padding: 0 15px 0 0;
  margin-right: 8px;
}

.mini-app li.li_pankuzu a,
.mini-app li.li_pankuzulast a {
  color: #333;
  text-decoration: none;
}

@media screen and (min-width: 768px) {
  .mini-app ul#pankuzu {
    margin: 32px 0 24px;
  }
}

.mini-app .footerPb {
  clear: both;
  padding-bottom: 90px;
}

.mini-app div.footerFixed {
  background-color: #FFFFFF;
  width: 100%;
  position: fixed;
  bottom: 0px;
  padding: 16px 0;
  border-top: 1px solid #DDDDDD;
}

.mini-app div.footerFixed > div.inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 15px;
}

.mini-app div.footerFixed p.text {
  text-align: center;
  font-size: 11px;
  padding-bottom: 10px;
  color: #0f0a64;
}

.mini-app div.footerFixed div.btnWrap {
  display: table;
  width: 100%;
}

.mini-app div.footerFixed p.regist,
.mini-app div.footerFixed p.login {
  display: table-cell;
  width: 50%;
}

.mini-app div.footerFixed a {
  text-decoration: none;
}

.mini-app div.footerFixed p.regist,
.mini-app div.footerFixed p.login {
  padding: 0 10px;
}

.mini-app div.footerFixed input {
  -webkit-appearance: none;
}

.mini-app div#modal-container div.contents {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app div#modal-small .auIDBox .auID_btn {
  margin-left: 5px;
}

@media screen and (min-width: 768px) {
  .mini-app #global-footer div.footer-inner {
    padding: 40px 30px 0;
  }
}

.mini-app .white-box {
  background: #FFFFFF;
  position: relative;
  margin-bottom: 16px;
  padding: 16px 16px;
  border: 1px solid #0F0A64;
  border-radius: 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 12px;
}

.mini-app .white-box h2 {
  font-size: 24px;
}

.mini-app .feature .white-box h2 {
  color: #0F0A64;
}

.mini-app .white-box h3 {
  margin-bottom: 4px;
  font-size: 14px;
}

.mini-app .col1-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 12px;
}

.mini-app .col2-box {
  margin-bottom: 16px;
}

.mini-app .col1-box h2:before,
.mini-app .col2-box h2:before {
  content: url(/stcontents/img/mini-app/icon-check-relux.svg);
  vertical-align: top;
  margin-right: 8px;
  color: #0F0A64;
}

.mini-app .col1-box > div:last-of-type {
  padding-left: 64px;
}

.mini-app .text-link a:hover {
  opacity: 0.7;
}

.mini-app .col2-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.mini-app .col2-box .white-box {
  width: calc(50% - 10px);
  padding-bottom: 56px;
}

.mini-app .col2-box h2 {
  margin-bottom: 8px;
}

.mini-app .col2-box h3 {
  margin: 8px 0 12px;
}

.mini-app .col2-box p {
  margin-bottom: 8px;
}

.mini-app .col2-box p a {
  color: #0066CC;
}

.mini-app .col2-box .text-link {
  width: 100%;
  position: absolute;
  bottom: 16px;
  left: 0;
  text-align: center;
}

.mini-app .col2-box .text-link a {
  margin-top: 16px;
  text-decoration: none;
  font-size: 14px;
  font-weight: bold;
  color: #0F0A64;
}

.mini-app .col2-box .text-link a:after {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  border-right: 3px solid #0F0A64;
  border-bottom: 3px solid #0F0A64;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  margin-left: 10px;
}

.mini-app .col2-box dl {
  max-width: 330px;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  text-align: left;
  font-size: 12px;
  margin: 0 auto 16px;
  letter-spacing: 0;
}

.mini-app .col2-box dl dt.font-bold,
.mini-app .col2-box dl dd.font-bold {
  padding-bottom: 16px;
}

.mini-app .col2-box dl dt {
  width: calc(100% - 90px);
}

.mini-app .col2-box dl dd {
  width: 90px;
  text-align: right;
}

.mini-app .col2-box dl dd span {
  font-size: 10px;
}

.mini-app .feature .col2-box .white-box:last-of-type .icon {
  padding: 8px 0;
}

.mini-app .feature .col2-box .note {
  font-size: 10px;
  color: #666666;
}

.mini-app .bottom-box {
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: bold;
  font-size: 20px;
}

.mini-app .bottom-box a {
  text-decoration: none;
}

.mini-app .bottom-box .btn {
  width: 300px;
  margin: 0 12px;
  padding: 16px 0;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
}

.mini-app .bottom-box .btn:after {
  content: none;
}

.mini-app .year_ranking .titleHeader {
  margin-bottom: 24px;
}

.mini-app .year_ranking .entry-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.mini-app .year_ranking .entry {
  width: 222px;
  height: 232px;
  margin-right: 24px;
  position: relative;
  border: 1px solid #ccc;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app .year_ranking .entry.more-banner {
  border: none;
}

.mini-app .year_ranking .entry.more-banner a {
  background: #0F0A64;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  padding: 0 2px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app .year_ranking .entry.more-banner img {
  width: 200px;
}

.mini-app .year_ranking .entry.more-banner .more {
  text-align: right;
  font-size: 12px;
  margin-top: 16px;
  color: #fff;
}

.mini-app .year_ranking .entry.more-banner .more:after {
  background: url(/stcontents/img/mini-app/relux-icon_icon-navigate-right-white.svg) no-repeat 0 0;
  background-size: 100%;
  content: "";
  width: 26px;
  height: 26px;
  display: inline-block;
  vertical-align: middle;
  margin: -1px -4px 0 7px;
}

.mini-app .year_ranking .entry-list div.entry:last-child {
  margin-right: 0 !important;
}

.mini-app .year_ranking .entry p.month {
  font-size: 16px;
}

.mini-app .year_ranking .entry > a {
  display: block;
  text-decoration: none;
}

.mini-app .year_ranking .entry > a:hover {
  opacity: 0.7;
}

.mini-app .year_ranking .entry a {
  text-decoration: none;
}

.mini-app .year_ranking .entry div.thum img {
  width: 100%;
  vertical-align: bottom;
}

.mini-app .year_ranking .entry div.info {
  padding: 0 10px 10px 10px;
}

.mini-app .year_ranking .entry div.info div.entryHeader div.left {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0;
  z-index: 1;
}

.mini-app .year_ranking .entry div.info div.entryHeader div.left div.icon img {
  width: 28px;
  padding-left: 8px;
  border: none;
}

.mini-app .year_ranking .entry div.info p.name {
  font-size: 16px;
  line-height: 1.2;
  font-weight: bold;
  margin-bottom: 12px;
}

.mini-app .year_ranking .entry div.info p.area {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 11px;
}

.mini-app .year_ranking .entry div.info p.name a:hover, .mini-app .year_ranking .entry div.info p.area a:hover {
  text-decoration: underline;
}

.mini-app .year_ranking .entry div.info p.copy {
  font-size: 13px;
  color: #000000;
  margin-bottom: 10px;
}

.mini-app .year_ranking h3.name,
.mini-app .year_ranking h2.name {
  font-size: 16px;
  line-height: 1.2;
  font-weight: bold;
  margin: 0 0 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}

.mini-app .year_ranking h3.entry, .mini-app .year_ranking h2.entry {
  background-color: #fff;
  -webkit-box-shadow: 0 0 1px #fff, 0 0 1px #ddd, 0 0 1px #ddd;
          box-shadow: 0 0 1px #fff, 0 0 1px #ddd, 0 0 1px #ddd;
}

.mini-app .year_ranking h3.entry a, .mini-app .year_ranking h2.entry a {
  text-decoration: none;
  color: #000;
}

.mini-app .year_ranking .entry div.thum {
  height: 132px;
  position: relative;
  overflow: hidden;
  z-index: 0;
  display: block;
  margin-bottom: 0;
}

.mini-app .year_ranking .entry div.thum a {
  vertical-align: text-bottom;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.mini-app .year_ranking .entry div.info {
  padding: 16px;
}

.mini-app .year_ranking .entry div.info p.name {
  font-size: 20px;
}

.mini-app .year_ranking .entry div.info p.area {
  text-align: left;
}

.mini-app .year_ranking div.entry div.info div.entryHeader {
  border: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.mini-app .year_ranking .entry div.info p.grade {
  height: 15px;
}

.mini-app .year_ranking .entry div.info p.grade img {
  height: 15px;
  display: inline-block;
}

.mini-app .year_ranking .entry div.info p.grade img.museum,
.mini-app .year_ranking .entry div.info p.grade img.casual {
  height: 12px;
}

.mini-app .year_ranking .entry div.info p.grade img.star {
  margin-right: 3px;
}

.mini-app .year_ranking .entry div.info p.grade {
  margin-bottom: 8px;
  line-height: 0;
}

.mini-app .slick-dots li {
  width: 10px;
  height: 10px;
  margin: 0 8px;
}

.mini-app .slick-dots li button:before,
.mini-app .slick-dots li.slick-active button:before {
  color: #C4C4C4;
}

@media screen and (max-width: 767px) {
  .mini-app button.slick-prev.slick-arrow {
    display: none !important;
  }
}

.mini-app .benefits h2 {
  margin-bottom: 16px;
}

.mini-app .benefits .lead {
  margin-bottom: 32px;
  text-align: center;
  line-height: 2;
}

.mini-app .letter-0 {
  letter-spacing: 0;
}

.mini-app .howto-use h2 {
  margin-bottom: 32px;
}

.mini-app .howto-use .text h3 {
  font-size: 18px;
  color: #000;
}

.mini-app .howto-use .text {
  margin-bottom: 16px;
}

.mini-app .howto-use .text p {
  font-size: 16px;
}

.mini-app .howto-use .white-box {
  margin-bottom: 32px;
  padding: 24px 24px;
  border: none;
  border-radius: 8px;
}

.mini-app .howto-use .discount .noteText {
  border-top: none;
  padding: 0;
}

.mini-app .howto-use .bnr-box {
  padding: 24px;
}

.mini-app .howto-use .bnr-box .lead {
  margin-bottom: 24px;
  font-size: 18px;
}

.mini-app .howto-use .bnr-box .col1-box {
  border: 2px solid #FFF153;
}

.mini-app .howto-use .bnr-box .photo {
  line-height: 0;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
}

.mini-app .howto-use .bnr-box .text {
  padding: 0 16px;
}

.mini-app .howto-use .bnr-box h3 {
  margin: 4px;
}

.mini-app .howto-use .bnr-box .btn {
  max-width: 260px;
  margin: 4px auto;
  font-weight: bold;
}

.mini-app .howto-use .bnr-box ul {
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
  letter-spacing: 0;
  font-size: 10px;
}

.mini-app .howto-use .red {
  color: #990000;
}

.mini-app .howto-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.mini-app .howto-box > div {
  max-width: 260px;
}

.mini-app .howto-box .title span {
  background: #0A0F64;
  width: 94px;
  height: 24px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-weight: bold;
  margin: 0 auto 16px;
  border-radius: 20px;
  color: #fff;
}

.mini-app .howto-box h3 {
  margin-bottom: 16px;
  font-weight: normal;
  font-size: 14px;
}

@media screen and (max-width: 1023px) {
  .mini-app .howto-box h3 {
    font-size: 13px;
  }
}

.mini-app .howto-box .arrow {
  -webkit-align-self: center;
      -ms-flex-item-align: center;
              -ms-grid-row-align: center;
          align-self: center;
  padding-top: 100px;
}

.mini-app .howto-box .arrow span {
  display: block;
  margin-top: 8px;
  color: #0F0A64;
}

.mini-app .howto-use .noteText {
  margin-top: 24px;
  margin-bottom: 40px;
  padding-top: 24px;
}

.mini-app .howto-use .noteText:last-of-type {
  margin-bottom: 0;
}

.mini-app .howto-box.under {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 0;
}

.mini-app .howto-box.under .arrow {
  padding: 100px 36px 0;
}

.mini-app .float-box {
  display: none;
  background-color: #FFFFFF;
  width: 100%;
  position: fixed;
  bottom: 0px;
  padding: 16px 0;
  border-top: 1px solid #DDDDDD;
  z-index: 10;
}

.mini-app .float-box-title {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  margin-right: 12px;
}

.mini-app .float-box-title.col2-title {
  width: 100% !important;
  margin-bottom: 16px !important;
  margin-right: 0;
}

.mini-app .float-box .bottom-box p {
  margin: 0 12px;
}

.mini-app .float-box .bottom-box .btn {
  width: 300px;
  margin: 0 12px;
}

@media screen and (max-width: 1024px) {
  .mini-app .headerTitle {
    font-size: 36px;
  }
  .mini-app .headerTitle span {
    font-size: 26px;
  }
  .mini-app .white-box {
    max-width: 420px;
    display: block;
    margin: 0 auto 16px !important;
  }
  .mini-app .col1-box {
    display: block;
  }
  .mini-app .col1-box h2 {
    margin-bottom: 8px;
  }
  .mini-app .col1-box h3 {
    margin: 8px 0 12px;
  }
  .mini-app .col1-box > div:last-of-type {
    padding: 0;
  }
  .mini-app .col2-box {
    display: block;
  }
  .mini-app .col2-box .white-box {
    width: auto;
  }
  .mini-app .feature .white-box {
    width: calc(100% - 32px) !important;
  }
  .mini-app .lead {
    font-size: 12px !important;
  }
  .mini-app .howto-use .bnr-box .photo img {
    width: 100%;
  }
  .mini-app .howto-use .bnr-box .text {
    padding: 16px 8px;
  }
  .mini-app .howto-use .white-box {
    max-width: 600px;
  }
  .mini-app .howto-box > div {
    max-width: none;
  }
  .mini-app .slick-slide {
    margin: 0 12px;
  }
  .mini-app .howto-box .slick-slide {
    max-width: 260px;
  }
  .mini-app .slick-dotted.slick-slider {
    display: block;
    margin-bottom: 0;
    padding-bottom: 40px;
    overflow: hidden;
  }
  .mini-app .slick-dotted.slick-slider .slick-dots {
    bottom: 10px;
  }
}

@media screen and (max-width: 767px) {
  .mini-app section {
    padding: 24px 0;
  }
  .mini-app .kv {
    height: 600px;
  }
  .mini-app .kv-logo img {
    max-width: 285px;
    margin-bottom: 24px;
  }
  .mini-app .kv .text {
    top: 130px;
    bottom: auto;
    width: 100%;
    padding: 0 4px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
  .mini-app .kv .text ul {
    max-width: 356px;
    height: 102px;
    font-size: 14px;
  }
  .mini-app .kv .text ul li {
    background-size: 13px;
    padding-left: 22px;
  }
  .mini-app .feature .wrap {
    padding: 0;
  }
  .mini-app .col1-box h2 {
    font-size: 24px !important;
  }
  .mini-app .col1-box h2:before,
  .mini-app .col2-box h2:before {
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
  .mini-app .white-box h2 {
    font-size: 18px !important;
  }
  .mini-app .feature .col2-box .white-box:last-of-type .icon {
    padding: 0;
  }
  .mini-app .bottom-box {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    padding: 0 16px;
    font-size: 14px;
    text-align: center;
  }
  .mini-app .bottom-box > div {
    width: 100%;
  }
  .mini-app .bottom-box .btn {
    max-width: 420px;
    width: 100%;
    margin: 0 auto !important;
    padding: 10px 0;
    font-size: 12px;
    white-space: nowrap;
  }
  .mini-app .float-box .bottom-box .btn {
    width: 100%;
  }
  .mini-app .bottom-box.bottom-col-2 {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .mini-app .bottom-box.bottom-col-2 > div {
    width: calc(50% - 4px);
    margin: 0;
  }
  .mini-app .float-box-title {
    margin-bottom: 8px !important;
    font-size: 14px;
  }
  .mini-app .benefits {
    padding: 40px 0;
  }
  .mini-app .benefits .figure img {
    width: 150px;
    margin: 0 auto;
  }
  .mini-app .benefits .noteText {
    padding-left: 0;
  }
  .mini-app .howto-use .bnr-box {
    padding: 24px 16px;
  }
  .mini-app .howto-use .text h3 {
    font-size: 14px;
  }
  .mini-app .howto-use .text p {
    font-size: 12px;
  }
  .mini-app .btn-pagetop {
    right: 30px;
    bottom: 130px;
  }
  .mini-app .btn-pagetop.static {
    bottom: auto;
    right: auto;
    margin-right: 30px;
  }
  .mini-app .btn-pagetop img {
    width: 40px;
  }
  .mini-app .bottom-box .btn {
    letter-spacing: 0;
    font-size: 10px;
  }
}

@media screen and (max-width: 360px) {
  .mini-app .kv {
    height: 500px;
  }
  .mini-app .headerTitle {
    font-size: 24px;
  }
  .mini-app .headerTitle span {
    font-size: 18px;
  }
  .mini-app .kv .text ul {
    max-width: 290px;
    font-size: 11px;
  }
  .mini-app .float-box-title {
    font-size: 12px;
  }
  .mini-app .howto-box .slick-slide {
    max-width: 240px;
  }
}

.mini-app .share-box {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-top: 16px;
  height: auto !important;
}

.mini-app .kv .text .share-box li {
  background: none;
  padding-left: 0;
  margin-bottom: 0;
  border: none;
}

.mini-app .share-box .share-btn {
  height: 32px;
  width: 32px;
}

.mini-app .share-box .share-btn + .share-btn {
  margin-left: 16px;
}

.mini-app .share-box .btn-facebook a {
  background: url("/stcontents/img/mini-app/icon_facebook.png") no-repeat 0 0;
}

.mini-app .share-box .btn-twitter a {
  background: url("/stcontents/img/mini-app/icon_twitter.png") no-repeat 0 0;
}

.mini-app .share-box .btn-line a {
  background: url("/stcontents/img/mini-app/icon_line.png") no-repeat 0 0;
}

.mini-app .share-box .share-btn a {
  background-size: cover;
  display: block;
  height: 100%;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .mini-app .share-box .btn-line {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .mini-app .share-box {
    margin-top: 80px !important;
  }
}

@media screen and (max-width: 360px) {
  .mini-app .share-box {
    margin-top: 30px !important;
  }
}

.mini-app .sp-v {
  display: none !important;
}

.mini-app .text-center {
  text-align: center;
}

.mini-app .text-right {
  text-align: right;
}

.mini-app div.header {
  border-bottom: none;
}

.mini-app div.contents {
  padding-top: 16px;
}

.mini-app #modal-container {
  -webkit-box-shadow: none;
          box-shadow: none;
  overflow: auto !important;
}

.mini-app div.header {
  background: none;
}

.mini-app .loading-box {
  background: #fff;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 1000;
}

.mini-app .modal-forgetPassword a {
  display: block;
  margin: 24px 0 0;
  text-align: center;
  text-decoration: underline !important;
  font-size: 14px;
  color: #333 !important;
}

.mini-app .wrap-loginsignin {
  display: block;
}

.mini-app .modal-logInWithMailArea {
  width: 100%;
}

.mini-app .modal-split-signin-pc {
  background: #fff;
  width: 88px;
  display: block;
  border: none;
  position: relative;
  margin: 24px auto 16px;
  text-align: center;
  padding: 0 0 10px;
  z-index: 10;
}

.mini-app .sns-box {
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-top: -35px !important;
  margin-bottom: 24px;
  padding: 24px 16px 18px;
}

.mini-app .modal-logInWithElseArea.here-box {
  width: 100% !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 auto 24px !important;
}

.mini-app .modal-logInWithElseArea.here-box > div {
  margin: 0;
  padding: 0 18px;
}

.mini-app .modal-logInWithElseArea.here-box .btn-modal {
  background: none;
  width: auto;
  height: auto;
  line-height: 1;
  display: inline-block;
  border: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  pointer-events: none;
}

.mini-app .modal-logInWithElseArea.here-box .btn-google img {
  height: auto;
}

.mini-app .btn-here .btn-modal {
  width: 100%;
  height: 44px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.mini-app .btn-first .btn-block {
  width: 100%;
  height: 44px;
}

.mini-app .note {
  margin: 8px 0 0;
  padding-left: 1em;
  text-indent: -1em;
  font-size: 11px;
  color: #757575;
}

.mini-app .login_error-top {
  display: block;
  margin-bottom: 16px;
  font-size: 14px;
}

.mini-app .flow-box ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  margin: 24px 24px 0;
  font-size: 12px;
  text-align: center;
}

.mini-app .flow-box ul.flow-icon:after {
  content: "";
  display: block;
  width: calc(100% - 50px);
  position: absolute;
  top: 15px;
  left: 25px;
  border-bottom: 2px solid #C6C6C6;
}

.mini-app .flow-box .flow-icon li span {
  background: #fff;
  display: block;
  width: 28px;
  height: 28px;
  position: relative;
  margin: 0 auto 4px;
  border: 2px solid #C6C6C6;
  border-radius: 50%;
  z-index: 10;
}

.mini-app .flow-box .flow-icon .active span {
  background: #0F0A64;
  border: 2px solid #0F0A64;
}

.mini-app .flow-box .flow-icon .active.checked span {
  background: #0F0A64 url(/stcontents/img/mini-app/icon-check.png) no-repeat center center;
  background-size: 19px;
}

.mini-app .figure-box {
  margin: 88px  0  40px;
  text-align: center;
}

.mini-app .mini-app-flow .figure-box.small-figure {
  margin: 100px 0 53px;
}

.mini-app .mini-app-flow .login-text {
  margin-bottom: 80px;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
}

.mini-app .mini-app-flow .btnWithIcon {
  margin-bottom: 16px !important;
}

.mini-app .mini-app-flow .btnWithIcon:last-of-type {
  margin-bottom: 0 !important;
}

.mini-app .mini-app-flow .modal-loginsignin .modal-logInWithElseArea {
  margin: 0 auto !important;
}

.mini-app .mini-app-flow .modal-logInWithElseArea .btn-modal {
  width: 100%;
  height: 44px;
}

.mini-app .mini-app-flow .btn-here .btn-modal {
  width: 100%;
  height: 44px;
}

.mini-app .mini-app-flow .IconPosition {
  height: 24px;
}

.mini-app .mini-app-flow .btn-google img {
  height: 20px;
}

.mini-app .mini-app-flow .float-box {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  padding: 16px 16px 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media screen and (max-width: 767px) {
  .mini-app .pc-v {
    display: none !important;
  }
  .mini-app .sp-v {
    display: inline-block !important;
  }
}

@media screen and (max-width: 360px) {
  .mini-app .modal-logInWithMailArea,
  .mini-app .modal-split-pc,
  .mini-app .modal-logInWithElseArea .btn-modal,
  .mini-app .modal-logInWithElseArea {
    width: 100%;
  }
  .mini-app .btn-here .btn-modal {
    font-size: 13px;
  }
}

.mini-app .kv {
  height: 350px;
}

.mini-app .headerTitle {
  font-size: 26px;
  line-height: 1.1;
}

.mini-app .headerTitle span {
  font-size: 22px;
}

.mini-app .headerTitle span span {
  font-size: 18px;
}

.mini-app .lead-box {
  max-width: 318px;
  margin: 30px auto 0;
  position: relative;
  border: 1px solid #fff;
  border-top: none;
  border-radius: 3px;
  text-align: center;
  text-shadow: 1px 1px 1px #000;
  font-weight: bold;
  padding: 30px 10px 15px;
}

.mini-app .lead-box .heading {
  width: calc(100% + 1px);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: -9px;
  left: 0px;
  color: #fff;
  font-weight: normal;
  white-space: nowrap;
}

.mini-app .lead-box .heading span {
  width: calc(50% - 80px);
  display: inline-block;
  border-bottom: 1px solid #fff;
}

.mini-app .kv .text {
  top: 66px;
}

.mini-app .kv .headerTitle {
  font-size: 24px;
  line-height: 1.5;
}

.mini-app .kv .text .note {
  margin: 0;
  padding: 0;
}

.mini-app .white-box {
  padding: 16px 8px 52px;
}

.mini-app .white-box.col1-box {
  padding-bottom: 20px;
}

.mini-app .white-box p {
  font-size: 12px;
}

.mini-app .login-box-wrap {
  min-height: 150px;
}

.mini-app .login-box {
  padding: 16px 0 0;
}

.mini-app .login-box .none {
  display: none;
}

.mini-app .login-box .bottom-box {
  font-weight: normal;
}

.mini-app .login-box .bottom-box .btn-block {
  width: 100%;
  overflow: hidden;
  height: 50px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-bottom: 16px;
  font-size: 14px;
  border-radius: 2px;
}

.mini-app .login-box .visible {
  color: #0F0A64;
}

.mini-app .login-box.float {
  background: #fff;
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
}

.mini-app .login-box.float .bottom-box {
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  font-weight: bold;
}

.mini-app .login-box.float .bottom-box > div {
  margin-right: 12px;
}

.mini-app .login-box.float .bottom-box > div:last-child {
  margin-left: 12px;
  margin-right: 0;
}

.mini-app .login-box.float .none {
  width: 100%;
  display: block;
  line-height: 6px;
  margin-top: 8px;
  font-weight: normal;
  font-size: 10px;
  color: #0F0A64;
}

.mini-app .login-box.float .btn-relux-app {
  font-weight: bold;
  line-height: 2.5;
}

.mini-app .login-box.float .visible {
  display: none;
}

.mini-app .login-box.float .btn-block {
  font-weight: bold;
}

.mini-app .point {
  padding-top: 40px;
}

.mini-app .point h2 {
  margin: 16px auto 24px;
  color: #0F0A64;
}

.mini-app .point table .heading {
  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "ＭＳ Ｐ明朝", serif;
  margin-right: 18px;
  padding-left: 2px;
  padding-bottom: 6px;
  letter-spacing: 2px;
  border-bottom: 2px solid #554B98;
  font-size: 20px;
  color: #554B98;
  white-space: nowrap;
}

.mini-app .point table th {
  vertical-align: top;
  padding-top: 16px;
}

.mini-app .point table td {
  padding-bottom: 16px;
  line-height: 1.8;
}

.mini-app .feature h2 {
  margin-bottom: 16px;
}

.mini-app .statusDetail {
  padding-top: 24px;
}

.mini-app .text-link a {
  margin-top: 16px;
  text-decoration: none;
  font-weight: normal !important;
  font-size: 12px;
  color: #0F0A64;
}

.mini-app .text-link a:after {
  content: "";
  display: inline-block;
  width: 5px !important;
  height: 5px !important;
  border-right: 2px solid #0F0A64 !important;
  border-bottom: 2px solid #0F0A64 !important;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  margin-bottom: 1px;
  margin-left: 6px !important;
}

.mini-app .noteText p {
  font-size: 12px;
}

.mini-app .benefits .text-link {
  margin-top: 16px;
  text-align: right;
}

.mini-app .annoucement {
  padding-top: 0;
}

.mini-app .red {
  color: #990000;
}

.mini-app #modal.au-connect {
  line-height: 1.5;
}

@media screen and (min-width: 768px) {
  .mini-app .login-box .visible {
    font-size: 12px;
  }
  .mini-app .login-box .bottom-box {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .mini-app .login-box .bottom-box > div {
    margin: 0 12px;
  }
  .mini-app .login-box .bottom-box .btn-block {
    padding: 0 20px;
  }
}

@media screen and (min-width: 360px) {
  .mini-app .kv .text ul {
    max-width: 100%;
  }
  .mini-app .kv .text ul {
    padding-left: 10px;
  }
}

.mini-app .sp-v {
  display: none !important;
}

.mini-app .text-center {
  text-align: center;
}

.mini-app .text-right {
  text-align: right;
}

.mini-app #leave-form textarea {
  width: 100%;
}

.mini-app #leave-form [type="submit"] {
  width: 100%;
  height: 40px;
  border-radius: 2px;
}

.mini-app #leave-form .note {
  margin-top: 8px;
  font-size: 10px;
  color: #990000;
}

.mini-app .leave-modal {
  background: #EFEFEF;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

.mini-app .leave-modal .leave-box {
  width: calc(100% - 36px);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: #fff;
  padding: 36px 16px 24px;
  -webkit-box-shadow: 0px 1px 4px 0px #00000040;
          box-shadow: 0px 1px 4px 0px #00000040;
  text-align: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.mini-app .leave-modal .leave-box p {
  font-weight: bold;
}

.mini-app .leave-modal .btn-modal {
  width: 100%;
  margin-top: 40px;
  border-radius: 2px;
}

.mini-app #recover table {
  border-spacing: 0;
}

.mini-app #recover th,
.mini-app #recover td {
  display: block;
}

.mini-app #recover th {
  border-left: 4px solid #222;
  margin-top: 16px;
  margin-bottom: 16px;
  padding-left: 10px !important;
  text-align: left;
  font-weight: normal;
}

.mini-app #recover input {
  width: 100% !important;
  height: 40px;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 14px;
  color: #333333;
  margin-bottom: 10px;
  padding: 0 12px;
}

.mini-app #recover input + p {
  font-size: 11px;
}

.mini-app .submit-btn-area .btn-block {
  height: 44px !important;
  border: none !important;
  margin-top: 24px;
}

@media screen and (max-width: 767px) {
  .mini-app .pc-v {
    display: none !important;
  }
  .mini-app .sp-v {
    display: inline-block !important;
  }
}

.mini-app-sub .modal-container {
  -webkit-box-shadow: none;
          box-shadow: none;
}

/* マップモーダル */
.map-modal {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 50;
  display: none;
}

.map-modal .map-modal-content {
  height: 100%;
}

.map-modal .js-modal-close {
  top: 30px;
  right: 30px;
  z-index: 51;
}

.map-modal .gmnoprint {
  display: none;
}

.map-modal .gm-style-cc {
  display: none;
}

.hotel-map-area {
  width: 100%;
  height: 100%;
  background-color: #F5F5F5;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /*-- Scrollbar --*/
}

.hotel-map-area p {
  margin-bottom: 0;
}

.hotel-map-area .hotel-list-area {
  width: 412px;
  height: 100%;
  overflow-y: hidden;
}

.hotel-map-area .hotel-list-area .hotel-list-content {
  padding-top: 16px;
  padding-left: 24px;
  height: 100%;
  overflow-y: auto;
}

.hotel-map-area .hotel-list-area .hotel-list-item {
  width: 360px;
  height: 210px;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  position: relative;
  font-size: 12px;
  font-weight: 400;
  color: #ffffff;
  text-shadow: 1px 1px 1px #000000;
  line-height: 1.5;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden;
}

.hotel-map-area .hotel-list-area .hotel-list-item::before {
  height: 100%;
  width: 100%;
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}

.hotel-map-area .hotel-list-area .hotel-list-item.active {
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  margin-top: 16px;
  margin-bottom: 16px !important;
  -webkit-transform: scale(1.055, 1);
          transform: scale(1.055, 1);
  border: 2px solid #4F68C2;
}

.hotel-map-area .hotel-list-area .hotel-list-item:hover {
  margin-top: 16px;
  margin-bottom: 16px !important;
  -webkit-transform: scale(1.055, 1);
          transform: scale(1.055, 1);
  border: 2px solid #4F68C2;
}

.hotel-map-area .hotel-list-area .hotel-list-item:hover .hotel-list-item-content {
  opacity: 0.7;
}

.hotel-map-area .hotel-list-area .hotel-list-item a {
  display: block;
  color: inherit;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bg-img {
  width: 400px;
  height: 210px;
  -o-object-fit: cover;
     object-fit: cover;
}

.hotel-map-area .hotel-list-area .hotel-list-item .icon-grade,
.hotel-map-area .hotel-list-area .hotel-list-item .icon-label {
  position: absolute;
  top: 16px;
  left: 16px;
  text-shadow: none;
}

.hotel-map-area .hotel-list-area .hotel-list-item .icon-favorite,
.hotel-map-area .hotel-list-area .hotel-list-item .icon-favorite-on {
  position: absolute;
  top: 16px;
  right: 16px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .icon-favorite a,
.hotel-map-area .hotel-list-area .hotel-list-item .icon-favorite-on a {
  width: 32px;
  height: 30px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area {
  padding: 0 16px;
  width: 100%;
  position: absolute;
  bottom: 46px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand img {
  position: relative;
  top: 0;
  left: 0;
  height: 16px;
  -webkit-filter: drop-shadow(0 0 3px #000);
          filter: drop-shadow(0 0 3px #000);
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand img[src*="grade-star"] {
  margin-left: 2px;
  height: 12px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand p {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 4.8px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand span {
  background: rgba(0, 0, 0, 0.1);
  text-shadow: none;
  margin-left: 8px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .name {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.75;
}

.hotel-map-area .hotel-list-area .hotel-list-item .center-area .area {
  max-width: 184px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  padding: 0 16px;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 16px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  letter-spacing: 0;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade .grade-num {
  margin-left: 4px;
  font-size: 1.6rem;
  line-height: 1.8;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade .grade-count {
  line-height: 2;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade .grade-count a {
  position: relative;
  display: inline-block;
  text-decoration: underline;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-price {
  padding-left: 16px;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-price div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-price .price-terms {
  margin-right: 4px;
  position: relative;
  top: 1px;
  letter-spacing: 0;
}

.hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-price .price-num {
  font-size: 2.0rem;
}

.hotel-map-area .hotel-list-area .hotel-list-item:not(:last-child) {
  margin-bottom: 8px;
}

.hotel-map-area .map-area {
  width: calc(100% - 412px);
  height: 100%;
}

.hotel-map-area .map-area .map {
  width: 100%;
  height: 100%;
}

.hotel-map-area .map-area .map .zoom-control {
  margin: 0 32px 32px 0;
}

.hotel-map-area .map-area .map .zoom-control-in {
  margin-bottom: 4px;
  width: 24px;
  height: 24px;
  background-color: #0f0a64;
  border-radius: 4px;
  position: relative;
  cursor: pointer;
}

.hotel-map-area .map-area .map .zoom-control-in::before {
  width: 10px;
  height: 2px;
  background-color: #ffffff;
  position: absolute;
  top: 11px;
  left: 7px;
  content: "";
}

.hotel-map-area .map-area .map .zoom-control-in::after {
  width: 2px;
  height: 10px;
  background-color: #ffffff;
  position: absolute;
  top: 7px;
  left: 11px;
  content: "";
}

.hotel-map-area .map-area .map .zoom-control-out {
  width: 24px;
  height: 24px;
  background-color: #0f0a64;
  border-radius: 4px;
  position: relative;
  cursor: pointer;
}

.hotel-map-area .map-area .map .zoom-control-out::before {
  width: 10px;
  height: 2px;
  background-color: #ffffff;
  position: absolute;
  top: 11px;
  left: 7px;
  content: "";
}

.hotel-map-area .map-area .map .popup-container {
  width: 200px;
  height: 0;
  position: absolute;
  cursor: auto;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.hotel-map-area .map-area .map .popup-bubble-anchor {
  width: 100%;
  bottom: 8px;
  position: absolute;
  left: 0;
}

.hotel-map-area .map-area .map .popup-bubble-anchor.active::after {
  background-color: #4F68C2;
  z-index: 1;
}

.hotel-map-area .map-area .map .popup-bubble-anchor.hover-style::after {
  background-color: #554B98;
  z-index: 8;
}

.hotel-map-area .map-area .map .popup-bubble-anchor::after {
  width: 16px;
  height: 16px;
  background-color: #0f0a64;
  -webkit-transform: rotateZ(45deg) skew(24deg, 24deg);
          transform: rotateZ(45deg) skew(24deg, 24deg);
  border-radius: 0 0 3px 0;
  position: absolute;
  top: -8px;
  left: -8px;
  content: "";
  z-index: 1;
}

.hotel-map-area .map-area .map .popup-bubble {
  -webkit-box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.2);
          box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.2);
  padding: 8px;
  min-width: 80px;
  max-width: 150px;
  min-height: 50px;
  background-color: #ffffff;
  border: 2px solid #0f0a64;
  border-radius: 5px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 16px;
  font-weight: 400;
  font-family: "Noto Sans JP";
  line-height: 1;
  letter-spacing: 1px;
  -webkit-transform: translate(-50%, -100%);
          transform: translate(-50%, -100%);
  z-index: 2;
}

.hotel-map-area .map-area .map .popup-bubble.mark-num {
  padding: 8px;
  min-width: auto;
  min-height: auto;
}

.hotel-map-area .map-area .map .popup-bubble.mark-num .mark-num-content {
  color: #333333;
  font-weight: 700;
  line-height: 1;
}

.hotel-map-area .map-area .map .popup-bubble.mark-num .mark-num-content span {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.14;
}

.hotel-map-area .map-area .map .popup-bubble .popup-bubble-content {
  margin-bottom: 2px;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.hotel-map-area .map-area .map .popup-bubble .popup-bubble-detail {
  margin-top: 2px;
  margin-bottom: 4px;
  text-align: center;
  color: #757575;
  font-size: 12px;
  line-height: 1.33;
  display: none;
}

.hotel-map-area .map-area .map .popup-bubble.active {
  border-color: #4F68C2;
  z-index: 3;
}

.hotel-map-area .map-area .map .popup-bubble.active .popup-bubble-detail {
  display: block;
}

.hotel-map-area .map-area .map .popup-bubble.hover-style {
  border-color: #554B98;
  z-index: 9;
}

.hotel-map-area .map-area .map .research-btn {
  width: 130px;
  height: 40px;
  background-color: #0f0a64;
  border-radius: 4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 24px;
  left: calc(50% - 65px);
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  z-index: 1;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.hotel-map-area ::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.hotel-map-area ::-webkit-scrollbar-thumb {
  background-color: #c6c6c6;
}

.hotel-map-area ::-webkit-scrollbar-track {
  background-color: transparent;
}

@media screen and (max-width: 767px) {
  .map-modal {
    margin: 0;
    width: 100%;
    height: 100%;
  }
  .map-modal .js-modal-close {
    width: 40px;
    height: 40px;
    background-image: url(/stcontents/img/common/icon-close-3.svg);
    top: 13px;
    right: 16px;
  }
  .hotel-map-area {
    position: relative;
  }
  .hotel-map-area ::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  .hotel-map-area .hotel-list-area {
    padding: 0 16px;
    width: 100%;
    height: 140px;
    position: absolute;
    bottom: 16px;
    display: none;
    z-index: 1;
  }
  .hotel-map-area .hotel-list-area .hotel-list-content {
    padding: 0;
    width: 100%;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin-bottom: 0 !important;
    width: 100%;
    height: 140px;
    font-size: 10px;
    overflow: hidden;
    -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
            flex-shrink: 0;
    display: none;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item:hover {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    -webkit-transform: scale(1);
            transform: scale(1);
    border: none;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item:hover .hotel-list-item-content {
    opacity: 1;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item.active {
    -webkit-box-shadow: none;
            box-shadow: none;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    -webkit-transform: scale(1);
            transform: scale(1);
    display: block;
    border: none;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item.card-move {
    animation: cardMove .5s 1;
    -webkit-animation: cardMove .5s 1;
    /*Safari and Chrome*/
  }
  @-webkit-keyframes cardMove {
    0% {
      bottom: -140px;
    }
    100% {
      bottom: 0;
    }
  }
  @keyframes cardMove {
    0% {
      bottom: -140px;
    }
    100% {
      bottom: 0;
    }
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .bg-img {
    width: 100%;
    height: 140px;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .icon-grade {
    top: 8px;
    left: 8px;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .icon-favorite,
  .hotel-map-area .hotel-list-area .hotel-list-item .icon-favorite-on {
    top: 12px;
    right: 11px;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .center-area {
    padding: 0 16px 0 8px;
    width: 100%;
    position: absolute;
    bottom: 29px;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand p {
    margin-right: 4px;
    font-size: 12px;
    letter-spacing: 3px;
    text-shadow: none;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .center-area .name {
    font-size: 12px;
    line-height: 1.5;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .center-area .area {
    max-width: 153px;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .bottom-area {
    padding: 0 16px 0 8px;
    bottom: 5px;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade .grade-num {
    font-size: 12px;
    line-height: 1.8;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade .grade-count {
    line-height: 2;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-grade .grade-count a {
    text-decoration: none;
  }
  .hotel-map-area .hotel-list-area .hotel-list-item .bottom-area .bottom-area-price .price-num {
    font-size: 1.4rem;
    line-height: 1.8;
  }
  .hotel-map-area .map-area {
    padding-left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
  }
  .hotel-map-area .map-area .map .popup-bubble {
    -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
            box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
    padding: 4px;
    max-width: 111px;
    min-width: 58px;
    min-height: 36px;
    border-width: 1px;
    border-radius: 6px;
    font-size: 12px;
    line-height: 1.33;
  }
  .hotel-map-area .map-area .map .popup-bubble.mark-num {
    padding: 4px;
  }
  .hotel-map-area .map-area .map .popup-bubble.mark-num .mark-num-content {
    line-height: 1.33;
  }
  .hotel-map-area .map-area .map .popup-bubble.mark-num .mark-num-content span {
    font-size: 10px;
    line-height: 1.6;
  }
  .hotel-map-area .map-area .map .popup-bubble .popup-bubble-content {
    margin-bottom: 0;
  }
  .hotel-map-area .map-area .map .popup-bubble .popup-bubble-content .icon-grade {
    height: 12px;
  }
  .hotel-map-area .map-area .map .popup-bubble .popup-bubble-detail {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 10px;
    line-height: 1.6;
  }
  .hotel-map-area .map-area .map .popup-bubble-anchor::after {
    width: 10px;
    height: 10px;
    top: -5px;
    left: -5px;
  }
  .hotel-map-area .map-area .map .research-btn {
    width: 124px;
    height: 32px;
  }
}

@media screen and (min-width: 768px) {
  .hotel-map-area .hotel-list-area .hotel-list-item .center-area .brand span.tag-hoteltype-white {
    height: 20px;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
    -webkit-transform-origin: 0 center;
            transform-origin: 0 center;
    padding: 0 5px;
    border-radius: 2px;
    font-size: 1rem;
    line-height: 1;
    border-radius: 2px;
    border: 1px solid;
    color: #fff;
  }
}
.root-sub-list.responsive-2col .sub-box {
  cursor: pointer;
}
@media (min-width: 1120px) {
  .root-sub-list.responsive-2col .sub-box {
    -webkit-flex-basis: calc(100% / 2 - 1rem);
        -ms-flex-preferred-size: calc(100% / 2 - 1rem);
            flex-basis: calc(100% / 2 - 1rem);
  }
}
@media (min-width: 768px) {
  .global-header .before-menu {
    margin-top: 8px;
  }
}
@media (max-width: 1023px){
  .anchor-link.position-measure > ul {
    justify-content: normal;
  }
}
@media (max-width: 767px) {
  .sp-text-left {
    text-align: left;
  }
  .sp-text-center {
    text-align: center !important;
  }
}

@media (min-width: 1024px){
  .result-hotel-list.recommend-list .result-hotel {
      height: 35rem;
  }
}

.result-hotel-list.recommend-list a:hover {
    opacity: 0.7;
}
.result-hotel-list.recommend-list .photo {
  width: 576px;
  height: 100%;
  overflow: hidden;
}
.result-hotel-list.recommend-list .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.result-hotel-list.recommend-list .hotel-info {
  top: 24px;
  left: 600px;
  padding-right: 24px;
  color: #333;
}
.result-hotel-list.recommend-list .hotel-grade {
  align-items: flex-start;
}
.result-hotel-list.recommend-list .hotel-grade span {
  margin-top: -6px;
}
.result-hotel-list.recommend-list .hotel-info a:hover {
  color: inherit;
}
.result-hotel-list.recommend-list .hotel-info .address {
  margin: 0 0 8px;
}
.result-hotel-list.recommend-list .hotel-info .price-box {
  justify-content: flex-end;
  margin-top: 16px;
}
.result-hotel-list.recommend-list .hotel-info .price {
  font-weight: bold;
  font-size: inherit;
  line-height: 2.4rem;
}

@media (max-width: 1280px) {
  .result-hotel-list.recommend-list .photo {
    width: 53%;
  }
  .result-hotel-list.recommend-list .hotel-info {
    left: calc(53% + 24px);
  }
}
@media (max-width: 1023px) {
  .result-hotel-list.recommend-list .result-hotel {
    height: auto;
    margin-bottom: 16px;
    border-radius: 8px;
  }
  .result-hotel-list.recommend-list .result-hotel a {
    color: #333;
  }
  .result-hotel-list.recommend-list .photo {
    width: 100%;
    height: 198px;
  }
  .result-hotel-list.recommend-list .hotel-info {
    position: relative;
    top: inherit;
    bottom: inherit;
    left: inherit;
    right: inherit;
    padding: 16px;
  }
  .result-hotel-list.recommend-list .hotel-grade img {
    filter: none;
  }
  .result-hotel-list.recommend-list .hotel-info div > div {
    text-shadow: none;
  }
  .result-hotel-list.recommend-list .hotel-info-body {
    display: block;
  }
}

@media (max-width: 767px) {
  .result-hotel-list.recommend-list .result-hotel {
    margin-bottom: 8px;
  }
  .result-hotel-list.recommend-list .result-hotel:last-child {
    margin-bottom: 16px;
  }
  .result-hotel-list.recommend-list .hotel-grade {
    margin-left: 0 !important;
  }
  .result-hotel-list.recommend-list .hotel-grade img {
    height: 15px;
    width: auto !important;
  }
  .result-hotel-list.recommend-list .hotel-grade span {
    font-size: 1.4rem;
  }
  .result-hotel-list.recommend-list .hotel-info .address {
    font-size: 1.2rem;
  }
  .result-hotel-list.recommend-list .hotel-info .plan-name {
    font-size: 1.6rem;
    padding: 0 !important;
  }
}

.campaigns.template .recommend.complete .feature-list.text-add li {
  height: auto;
  border-radius: 0;
  box-shadow: none;
}
.campaigns.template .recommend.complete .feature-list.text-add li a {
  height: 160px;
  width: 100%;
  display: block;
  overflow: hidden;
  position: relative;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.campaigns.template .recommend.complete .feature-list.text-add li p {
  color: #333;
  text-shadow: none;
  padding-top: 8px;
  font-size: 16px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .campaigns.template .recommend.complete .feature-list.text-add li {
    width: 100%;
    margin-bottom: 10px;
  }
}

.common-toast {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 60px;
  opacity: 1;
  background-color: #4F68C2;
  animation: toastHide .5s 3s forwards;
  box-sizing: border-box;
  text-align: center;
  z-index: 1000;
  overflow: hidden;
}
.common-toast > div {
  padding: 10px 10px;
  color: #fff;
}
@keyframes toastHide{
  0% {
    opacity: 1;
  }
  99% {
    opacity: 0;
    height: 60px;
  }
  100% {
    height: 0;
  }
}

/*
  三井G CP
*/
/* --- 取得後KV クーポン部分 anchorタイプ --- */
.campaigns.template .anime-box.anime-box-kv-anchor {
  width: 668px !important;
  height: 334px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) !important;
  padding: 0;
}
.campaigns .anime-box .anime-parts-4.kv-anchor {
  margin-left: 0;
  animation: none;
}
.campaigns .anime-parts-4.kv-anchor .letter-box {
  width: 668px !important;
  height: 334px;
}
.campaigns .anime-parts-4.kv-anchor .letter-box .result-coupon {
  background: url(/stcontents/img/sub-page/campaigns/anime-parts-1-anchor.png) no-repeat center center;
  background-size: contain;
  width: 668px !important;
  height: 334px;
  padding: 44px 30px 43px;
}
.campaigns .anime-parts-4.kv-anchor .letter-box .result-coupon .btn-relux {
  min-width: initial;
  width: 264px;
  height: 32px;
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  .campaigns.template .anime-box.anime-box-kv-anchor {
    max-width: initial;
    width: 375px !important;
    height: 330px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
  }
  .campaigns .anime-box .anime-parts-4.kv-anchor {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -17%) scale(1) !important;
  }
  .campaigns .anime-parts-4.kv-anchor .letter-box {
    width: 375px !important;
    height: 330px;
    margin: initial;
  }
  .campaigns .anime-parts-4.kv-anchor .letter-box .result-coupon {
    background: url(/stcontents/img/sub-page/campaigns/anime-parts-1-anchor-sp.png) no-repeat center center;
    background-size: contain;
    width: 375px !important;
    height: 330px;
    padding: 24px 15px 16px;
  }
    /* spクーポン内部 */
  .campaigns .anime-parts-4.kv-anchor .letter-box .result-coupon .btn-relux {
    min-width: 312px;
    width: 100%;
  }
}
@media screen and (max-width: 320px) {
  .campaigns.template .anime-box.anime-box-kv-anchor {
    transform: translate(-50%, -50%) scale(0.8) !important;
  }
}
/* --- おすすめ施設 --- */
.coupon-off__block {
  display: flex;
  align-items: center;
}
.coupon-off__bg {
  display: flex;
  align-items: center;
  height: 32px;
  padding: 2px 8px;
  border-radius: 2px;
}
.coupon-off__price {
  display: flex;
  align-items: center;
}
.coupon-off__price > span {
  display: block;
  text-align: right;
}
.coupon-off__price__num {
  display: flex;
  align-items: center;
}
.campaigns.template .chain-name {
  font-size: 2rem;
  font-weight: bold;
}
.campaigns.template .au-tag-label {
  background: #FFF5EF;
  font-size: 1.2rem;
  color: #EB5505;
  padding: 7px 16px;
}
@media screen and (min-width: 768px) {
  .coupon-off__bg {
    margin-right: 8px;
  }
}
@media screen and (max-width: 767px) {
  .coupon-off__block {
    display: block;
  }
  .coupon-off__block .coupon-off__price {
    display: block;
  }
  .coupon-off__block .coupon-off__price__num {
    justify-content: flex-end;
  }
  .coupon-off__bg {
    font-size: 1.2rem;
    margin-right: 0;
  }
  .campaigns.template .chain-name {
    font-size: 1.6rem;
    line-height: 28px;
  }
  .campaigns.template .au-tag-label {
    font-size: 12px;
    padding: 4px 8px;
  }
}
/* --- クーポン対象施設 --- */
.campaigns.template .area {
  width: 100%;
  padding: 40px;
}
.campaigns .area .border-red {
  border: 1px solid #FF503E;
  width: 80px;
  margin: 16px auto 24px;
}
/* 親要素（エリア名） */
.campaigns.template .area-list {
  max-width: 1120px;
  margin: 20px auto 12px;
  border-radius: 4px;
  font-size: 1.4rem;
  cursor: pointer;
}
.campaigns.template .area-list > li {
  background: #fff;
  border-bottom: 2px solid #F5F5F5;
  border-radius: 0;
  margin-bottom: 0;
  position: relative;
}
.campaigns.template .area-list > li:first-child {
  border-top: 2px solid #F5F5F5;
}
.campaigns.template .area-list > li > span {
  display: block;
  color: #0F0A64;
  font-weight: 700;
  padding: 16px 16px 14px;
}
.campaigns.template .area-list > li > span.active {
  background: #0F0A64;
  color: #fff;
}
.campaigns.template .area-list > li > span.active:after {
  content: url(/stcontents/img/common/icon-arrow-bottom-white.svg);
}
.campaigns.template .area-list > li > span.active:after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
  top: 30px;
}
.campaigns.template .area-list > li > span:after {
  content: url(/stcontents/img/common/icon-arrow-bottom-relux.svg);
  width: 18px;
  height: 9px;
  position: absolute;
  top: 15px;
  right: 20px;
}
/* 子要素（施設名） */
.campaigns.template .area-list ul {
  display: none;
}
.campaigns.template .area-list ul li {
  background: #F3F8FD;
  color: #333333;
}
.campaigns.template .area-list ul li:after {
  top: 50% !important;
  right: 28px !important;
  -webkit-transform: translateY(-50%) rotate(-90deg) !important;
          transform: translateY(-50%) rotate(-90deg) !important;
}
.campaigns.template .area-list ul li a {
  display: block;
  padding: 8px 28px 8px 8px;
  border-top: 1px solid #ccc;
  color: #333333;
  position: relative;
}
.campaigns.template .area-list ul li a:hover {
  background: #F5F5F5;
}
.campaigns.template .area-list:not(.no-link) ul li a::after {
  content: url(/stcontents/img/common/icon-arrow-bottom-relux.svg);
  width: 18px;
  height: 9px;
  position: absolute;
  top: 50%;
  right: 21px;
  -webkit-transform: translateY(-50%) rotate(-90deg);
  transform: translateY(-50%) rotate(-90deg);
}
.campaigns.template .area-list.no-link ul li a:hover {
  background: initial;
  cursor: auto;
}
.campaigns.template .area-list ul li a span {
  display: block;
  padding: 0;
}
.campaigns.template .area-list ul li a .tag-label {
  padding: 4px 12px;
  margin-bottom: 6px;
}
.campaigns.template .area-list ul li a .hotel-name {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}
.campaigns.template .area-list ul li a .hotel-name span {
  display: inline;
}
.campaigns.template .area-list ul li a .hotel-name .tag-hoteltype {
  padding: 4px 10px;
  margin-right: 8px;
}
@media (min-width: 768px) {
  .campaigns.template .area-list > li > span:hover {
    background-color: #554B98;
    color: #fff;
  }
  .campaigns.template .area-list > li > span.active:after,
  .campaigns.template .area-list > li > span:hover:after {
    content: url(/stcontents/img/common/icon-arrow-bottom-white.svg);
  }
}
@media screen and (max-width: 767px) {
  /* sp取得前画面で施設名タップした時に色が変わらないようにする */
  .campaigns.template .area-list.no-link ul li a {
    pointer-events: none;
  }

  .campaigns.template .area {
    padding: 40px 0;
  }
  .campaigns.template .area-list > li span {
    padding: 12px 8px 10px;
  }
  .campaigns.template .area-list > li > span:after {
    top: 12px;
    right: 12px;
  }
  .campaigns.template .area-list > li > span.active:after {
    top: 27px
  }
  .campaigns.template .area-list ul li a::after {
    right: 21px;
  }
  .campaigns.template .area-list ul li a .tag-label {
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0;
  }
  .campaigns.template .area-list ul li a .hotel-name {
    display: block;
  }
  .campaigns.template .area-list ul li a .hotel-name span {
    display: inline;
  }
}
/* 三井G CP end */

.justify-center {
  justify-content: center !important;
}
.justify-between {
  justify-content: space-between !important;
}
.justify-end {
  justify-content: flex-end !important;
}

/* 9/4 3チェーン合同15%OFFCP */
.campaigns.template .area-list .location {
  color: #757575;
}
@media (max-width: 767px) {
  .campaigns.template .area-list .location {
    font-size: 1.2rem;
  }
}

/* 9/18ドーミーイン10%OFFCP */
.campaigns.template .key-visual.kv-coupon .inner {
  bottom: 126px;
}
.campaigns.template .key-visual.kv-coupon .inner h1 {
  max-width: 660px;
  display: flex;
  margin: 0 auto 24px;
}
.campaigns.template .key-visual.kv-coupon .inner h1 .kv_coupon_img {
  width: 100%;
}
.campaigns.template .key-visual .table-basic {
  max-width: 640px;
  margin-bottom: 40px;
}
@media (max-width: 767px) {
  .campaigns .key-visual.kv-coupon {
    height: 420px;
  }
  .campaigns.template .key-visual.kv-coupon .inner {
    /* 23/12/6 snsアイコン追加のため */
    bottom: 62px;
    /* bottom: initial; */
    /* position: initial; */
  }
  .campaigns.template .key-visual.kv-coupon .inner h1 {
    max-width: 343px;
    margin-bottom: 16px;
  }

  .campaigns.template .key-visual .table-basic {
    max-width: 343px;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 384px) {
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic th,
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic td {
    font-size: 1.3rem;
    min-width: auto;
  }
}
@media screen and (max-width: 372px) {
  .campaigns.template .inner {
    padding: 0 8px;
  }
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic th,
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic td {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 326px) {
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic th,
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic td {
    font-size: 1.1rem;
  }
}
/* 10/2関西エリア15%OFF */
@media screen and (max-width: 767px) {
  .campaigns .key-visual .inner.bottom-adjust .table-basic .sp-font-adjust {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 340px) {
  .campaigns.template .key-visual .inner.bottom-adjust .table-basic .sp-font-adjust {
    font-size: 1.1rem;
  }
}

.facilityCardList {
  display: flex;
  margin: 0 -16px;
  flex-wrap: wrap;
}

.facilityCardList > li {
  width: calc(100% / 4);
  margin-bottom: 32px;
  padding: 0 16px;
}

.facilityCard {
  display: block;
  overflow: hidden;
  border-radius: 8px;
  color: #333;
  text-decoration: none;
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10);
  height: 100%;
}

.facilityCard:hover {
  color: #333;
  opacity: .7;
}

.facilityCard-head {
  height: 170px;
  position: relative;
}

.facilityCard-body {
  padding: 8px 16px 16px;
  height: calc(100% - 170px);
  display: flex;
  flex-flow: column;
  justify-content: space-between;
}

.facilityCard-img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.facilityCard-img::before {
  content: '';
  display: block;
  background: linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 1));
  opacity: .8;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.facilityCard-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.facilityCard-grade {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

.facilityCard-grade img {
  height: 20px;
}

.facilityCard-ttl {
  font-size: 1.6rem;
  font-weight: 900;
  margin-bottom: 0;
  line-height: 1.6;
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.facilityCard-area {
  color: #757575;
  font-size: 1.2rem;
  margin-bottom: 0;
}

.facilityCard-priceBox {
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  line-height: 1.6;
}

.facilityCard-priceBox > dt,
.facilityCard-priceBox > dd {
  text-align: right;
}

.facilityCard-priceBox > dt {
  font-size: 1.2rem;
}

.facilityCard-priceBox > dd {
  font-size: 2rem;
  margin-left: 8px;
  display: flex;
  flex-flow: column;
}

.facilityCard-priceBox > dd .price-before,
.facilityCard-priceBox > dd .price-after {
  line-height: 1.4;
}

.facilityCard-priceBox > dd .price {
  font-weight: bold;
}

.facilityCard-priceBox > dd .price-before {
  color: #C6C6C6;
  font-size: 1.6rem;
  text-decoration: line-through;
}

.facilityCard-priceBox > dd .price-after {
  color: #FF503E;
  font-weight: 900;
}

@media (max-width: 1023px) {
  /* PC横幅小さい場合.facilityCardListを3カラム表示 */
  .facilityCardList {
    margin: 0 -8px;
  }

  .facilityCardList > li {
    width: calc(100% / 3);
    padding: 0 8px;
    margin-bottom: 16px;
  }
}


@media (max-width: 767px) {
  .facilityCardList {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin: 0 -16px;
  }

  .facilityCardList::-webkit-scrollbar {
    display: none;
  }

  .facilityCardList > li {
    width: auto;
    padding: 0 4px;
    margin-bottom: 16px;
    scroll-snap-align: center;
  }

  .facilityCardList > li:first-child {
    padding-left: 16px;
  }

  .facilityCardList > li:last-child {
    padding-right: 16px;
  }

  .facilityCard {
    width: 256px;
  }

  .facilityCard:hover {
    color: #333;
    opacity: .7;
  }

  .facilityCard-head {
    height: 170px;
    position: relative;
  }

  .facilityCard-body {
    padding: 8px 16px 16px;
  }

  .facilityCard-img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .facilityCard-img::before {
    content: '';
    display: block;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    opacity: .8;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .facilityCard-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .facilityCard-grade {
    position: absolute;
    bottom: 8px;
    left: 16px;
  }

  .facilityCard-grade img {
    height: 20px;
  }

  .facilityCard-ttl {
    font-size: 1.6rem;
    font-weight: 900;
    margin-bottom: 0;
    line-height: 1.6;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .facilityCard-area {
    color: #757575;
    font-size: 1.2rem;
    margin-bottom: 0;
  }

  .facilityCard-priceBox {
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    line-height: 1.6;
  }

  .facilityCard-priceBox > dt,
  .facilityCard-priceBox > dd {
    text-align: right;
  }

  .facilityCard-priceBox > dt {
    font-size: 1.2rem;
  }

  .facilityCard-priceBox > dd {
    font-size: 2rem;
    margin-left: 8px;
    display: flex;
    flex-flow: column;
  }

  .facilityCard-priceBox > dd .price-before,
  .facilityCard-priceBox > dd .price-after {
    line-height: 1.4;
  }

  .facilityCard-priceBox > dd .price-before {
    color: #C6C6C6;
    font-size: 1.6rem;
    text-decoration: line-through;
  }

  .facilityCard-priceBox > dd .price-after {
    color: #FF503E;
    font-weight: 900;
  }
}

.campaigns .omikuji-anime-box {
    width: 600px !important;
    height: 276px;
    position: relative;
    margin: 0 auto;
    transform: translateY(-35%) !important;
}
.campaigns .omikuji-anime-box .result-coupon {
    background: url(/stcontents/img/sub-page/campaigns/omikuji-coupon-bg.png) no-repeat center center;
    background-size: contain;
    width: 600px;
    height: 276px;
    padding: 24px 12px 0;
    position: relative;
}
.campaigns .omikuji-anime-box .omikuji-anime-1 {
  display: none;
  background: none;
  width: auto;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.campaigns .omikuji-anime-box .omikuji-anime-1 img {
  width: 280px;
}
.campaigns .omikuji-anime-box:before {
  background: url(/stcontents/img/sub-page/campaigns/omikuji-bg-icon-1.png) no-repeat 0 0;
  background-size: contain;
  content: "";
  display: block;
  width: 322px;
  height: 257px;
  position: absolute;
  top: 0;
  left: -25%;
}
.campaigns .omikuji-anime-box:after {
  background: url(/stcontents/img/sub-page/campaigns/omikuji-bg-icon-2.png) no-repeat 0 0;
  background-size: contain;
  content: "";
  display: block;
  width: 322px;
  height: 257px;
  position: absolute;
  bottom: 0;
  right: -23%;
}
.campaigns .omikuji-anime-box .omikuji-anime-2 {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -46%);
  z-index: 2;
  transition: opacity 0.1s;
}

@media (max-width: 767px) {
  .campaigns.template .key-visual-complete .omikuji-anime-box {
    max-width: 100% !important;
    width: 100% !important;
    height: 100% !important;
    transform: none !important;
    top: 0 !important;
    left: 0 !important;
    padding: 0 !important;
  }
  .campaigns .omikuji-anime-box .result-coupon {
      background: url(/stcontents/img/sub-page/campaigns/omikuji-coupon-bg-sp.png) no-repeat center center;
      background-size: contain;
      max-width: 100%;
      width: 380px !important;
      height: 310px;
      padding: 34px 32px 0;
  }
  .campaigns .omikuji-anime-box .omikuji-anime-1 img {
    width: 220px;
  }
  .campaigns .omikuji-anime-box:before {
    background: url(/stcontents/img/sub-page/campaigns/omikuji-bg-icon-1-sp.png) no-repeat 0 0;
    background-size: contain;
    width: 220px;
    height: 226px;
    top: 0;
    left: 0;
  }
  .campaigns .omikuji-anime-box:after {
    background: url(/stcontents/img/sub-page/campaigns/omikuji-bg-icon-2-sp.png) no-repeat 0 0;
    background-size: contain;
    width: 190px;
    height: 210px;
    bottom: 0;
    right: 0;
  }
  .omikuji-block .coupon-text,
  .omikuji-block-2 .coupon-text {
    max-width: 295px;
  }
}
@media (max-width: 360px){
  .campaigns .omikuji-anime-box .result-coupon {
    max-width: 86%;
  }
  .campaigns .omikuji-anime-box h1 {
    font-size: 26px;
  }
  .campaigns .omikuji-anime-box .result-coupon {
      padding: 34px 24px 0;
  }
  .float-bar .float-note {
    font-size: 10px;
  }
}

.omikuji-block-2.coupon-block-new {
  display: block;
  height: auto;
}
.omikuji-block-2 .btn-disabled {
  background: #F5F5F5;
  border: none;
  color: #C6C6C6;
}
.omikuji-block-2 .coupon-text {
  max-width: 246px;
  width: auto !important;
  height: auto;
  cursor: default !important;
}
.omikuji-block-2 .bg-coupon {
  background: url(../img/sub-page/campaigns/bg-coupon.png) no-repeat center center;
  background-size: contain;
  margin: 0 auto;
}
.omikuji-block-2 .btn-entry {
  display: flex;
  margin: 0 auto;
  padding: 0;
}
.omikuji-block-2 .btn-relux:hover {
  background-color: #554B98;
}
.omikuji-block-2 + .anime img {
  width: 330px;
  position: absolute;
  bottom: 45px;
  left: 50%;
  transform: translateX(-50%);
  }
.campaigns .present-list-box-100.text-right .present-list-inner100 dl dt {
    width: 100px;
    text-align: right;
}
.campaigns .present-list-box-100 .present-list-inner100 dl .font-bold {
  font-weight: bold !important;
}
.key-visual.shadow-add .inner:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0,0,0,0.2);
}
@media screen and (max-width: 767px){
  .pc-only-inline {
    display: none;
  }
  .omikuji-block-2 .bg-coupon {
    background: url(../img/sub-page/campaigns/bg-coupon-sp.png) no-repeat center center;
    background-size: contain;
    width: 343px;
    padding: 25px 65px 10px;
  }
  .omikuji-block-2 .btn-entry {
    max-width: 100%;
  }
  .omikuji-block-2 + .anime img {
    bottom: 0;
  }
  .campaigns .campaign-detail .d-flex .ticket-info-tag {
    width: 85px;
    margin: 0 8px 0 0;
    white-space: nowrap;
  }
}
@media screen and (max-width: 360px){
  .campaigns .campaign-detail .d-flex .ticket-info-tag + .font-x-large {
    font-size: 1.5rem;
  }
}

/* フッター下に無駄な余白をなくす(topページ) */
body.index {
  background-color: #303233; /* フッターと同じ色 */
}
.index main {
  background-color: #fff;
}
/* フッター下に無駄な余白をなくす(topページ) end */

/* 割引・ポイントについての注意事項 */
.modal-trigger-icon {
  margin-left: 2px;
  position: relative;
  top: 3px;
}
.modal-trigger-icon > img {
  height: auto;
  vertical-align: bottom;
  width: 22px;
}
.common-modal.notes-modal {
  color: #333;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75;
}
.common-modal.notes-modal .modal-container .content-body {
  margin-top: 0;
}
.common-modal.notes-modal .modal-container .content-body > *:last-child {
  margin-bottom: 0;
}
.common-modal.notes-modal .notes-modal-hdg {
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.84615;
  margin-bottom: 0;
}
.common-modal.notes-modal .notes-modal-hdg:not(:first-child) {
  margin-top: 24px;
}
.notes-modal .modal-notes {
  list-style: none;
}
.notes-modal .modal-note {
  padding-left: 1em;
  position: relative;
}
.notes-modal .modal-note::before {
  background-color: black;
  border-radius: 50%;
  content: "";
  display: block;
  height: .2em;
  left: .36em;
  position: absolute;
  top: .8em;
  width: .2em;
}
@media screen and (max-width: 767px) {
  .modal-trigger-icon {
    padding: 5px;
    top: 1px;
    z-index: 1;
  }
  .modal-trigger-icon > img {
    width: 19px;
  }
  .common-modal.notes-modal {
    font-size: 1.4rem;
    height: 312px;
    line-height: 1.71429;
    top: auto;
  }
  .common-modal.notes-modal .notes-modal-hdg {
    font-size: 1.6rem;
    font-weight: 800;
    line-height: 1.75;
  }
  .common-modal.notes-modal .notes-modal-hdg:not(:first-child) {
    margin-top: 16px;
  }
  .common-modal.notes-modal .js-modal-close {
    background-image: url(/stcontents/img/common/icon-close-3.svg);
    bottom: 8px;
    height: 52px;
    left: 50%;
    right: auto;
    top: auto;
    transform: translateX(-50%);
    width: 52px;
  }
  .common-modal.notes-modal .modal-container {
    border-radius: 16px 16px 0 0;
    bottom: 0;
    max-height: 312px;
    padding: 16px 16px 80px;
    top: auto;
  }
  .common-modal.notes-modal .modal-container .content-body {
    height: 100%;
    margin-right: 0;
    padding: 0;
  }
}
/* 割引・ポイントについての注意事項 end */