@charset "utf-8";
@import url("https://use.fontawesome.com/releases/v7.3.1/css/all.css");
html,
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-size: 100%;
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
hr,
div,
object,
ul,
ol,
li,
dl,
dt,
dd,
tr,
td,
fieldset,
form,
legend,
figure {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
}
ul,
ol {
	list-style: none;
}
fieldset {
	margin: 0;
	padding: 0;
	border: 0 none;
}
legend {
	display: none;
}
table,
th,
td {
	border: 0;
	border-spacing: 0;
}
caption,
th {
	text-align: left;
}
em,
strong,
cite,
abbr,
caption,
th,
address {
	font-style: normal;
	font-weight: normal;
}
img {
	max-width: 100%;
	border: 0 none;
	vertical-align: bottom;
}
input,
select,
textarea {
	margin: 0;
	padding: 0;
	vertical-align: middle;
	-webkit-appearance: none;
	appearance: none;
}
input[type="submit"] {
	border: none;
	border-radius: 0;
}
input[type="radio"] {
	-webkit-appearance: radio;
	appearance: radio;
}
input[type="checkbox"] {
	-webkit-appearance: checkbox;
	appearance: checkbox;
}
option {
	padding-right: 5px;
}
article,
aside,
dialog,
details,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}
mark {
	font-weight: normal;
	font-style: normal;
}
blockquote,
q {
	quotes: none;
}
a {
	vertical-align: baseline;
	text-decoration: none;
}
* {
	box-sizing: border-box;
}
html {
	font-size: 62.5%;
}
body {
	margin: 0 auto;
	color: var(--text-color);
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	font-family: var(--ui-font-family);
	line-height: 1.6;
	height: 100%;
	-webkit-touch-callout: none;
}
a {
	color: var(--link-color);
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
a:hover,
a:active {
	color: var(--link-hover-color);
}
img,
input[type="image"] {
	max-width: 100%;
}
input,
select,
textarea {
	width: 100%;
	font-size: 16px;
	font-family: var(--ui-font-family);
}
input[type="submit"],
input[type="button"],
input[type="file"] {
	line-height: 1;
}
input[type="text"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="range"],
input[type="color"],
input[type="datetime"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime-local"],
select,
textarea {
	padding: 0.5em;
	background: var(--form-color);
	border: solid 1px #eee;
	border-radius: 3px;
}
input[type="radio"],
input[type="checkbox"] {
	vertical-align: text-bottom;
}
input::placeholder,
input::-webkit-input-placeholder {
	font-size: 16px;
}
input[type="file"] {
	display: none;
}
input[type="submit"].skip,
input[type="button"].skip {
	background: none;
	color: #8c8c8c;
	font-size: 1.3rem;
	text-decoration: underline;
	border: none;
}
.container {
	height: 100%;
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
	display: flex;
	flex-flow: column;
	min-height: 100vh;
}
header {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	background: #fff;
	z-index: 100;
}
header .site-name {
	color: #fff;
	font-size: 1.2rem;
	font-weight: bold;
	text-align: center;
	line-height: 1;
	padding: 0.8rem;
	background: var(--site-color);
}
header ul.global-navigation {
	display: flex;
	border-bottom: 0.5px solid rgba(0, 0, 0, 0.3);
}
header ul.global-navigation > li {
	flex: 1 1 0%;
	text-align: center;
}
header ul.global-navigation > li > a {
	display: block;
	color: #8c8c8c;
	padding: 0.6em 0.1em 0.3em;
	position: relative;
}
header ul.global-navigation > li > a > i {
	display: block;
	width: 100%;
	font-size: 2rem;
	line-height: 2.5rem;
}
header ul.global-navigation > li > a > p {
	display: block;
	font-size: 1rem;
}
header ul.global-navigation > li.select > a {
	color: var(--site-color);
}
header .page-heading {
	position: relative;
	border-bottom: 1px solid #eee;
}
header .page-heading > h1 {
	width: 100%;
	color: var(--text-color);
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	padding: 0.5em 3em;
}
header .page-heading > .prev {
	position: absolute;
	left: 0;
	top: 0.1em;
	font-size: 2.1rem;
}
header .page-heading > .ope {
	position: absolute;
	right: 0;
	top: 0.1em;
	font-size: 2.1rem;
}
header .page-heading a {
	color: #8c8c8c;
	padding: 0 0.5em;
}
main {
	position: relative;
	flex: 1;
}
main.contents {
	padding-bottom: 3em;
}
footer {
	border-top: 1px solid #eee;
}
footer .footer-copyright {
	text-align: center;
	padding: 1em;
}
.section-heading {
	color: var(--text-color);
	font-size: 1.6rem;
	font-weight: bold;
	margin: 0.5em 0;
}
.section-heading > span {
	display: inline-block;
	vertical-align: middle;
}
.section-heading > span.circle {
	position: relative;
	width: 2rem;
	height: 2rem;
	color: #fff;
	text-align: center;
	margin-right: 0.5em;
	background: var(--site-color);
	border-radius: 50%;
}
.section-heading > span.circle > i {
	position: absolute;
	left: 50%;
	top: 50%;
	font-size: 0.6em;
	transform: translate(-50%, -50%);
}
.heading-primary {
	color: #fff;
	font-size: 1.4rem;
	text-align: left;
	padding: 0.5em 1em;
	background: var(--site-color);
}
.heading-primary + * {
	margin-top: 1em;
}
.button-primary {
	--button-color: var(--site-color);
}
.button-highlight {
	--button-color: var(--red-color);
}
.button-secondary {
	--button-color: #bbb;
}
.button-primary a,
.button-primary button,
.button-primary input[type="submit"],
.button-primary input[type="file"] + label,
.button-primary.button-scripted > span,
.button-highlight a,
.button-highlight button,
.button-highlight input[type="submit"],
.button-highlight input[type="file"] + label,
.button-highlight.button-scripted > span,
.button-secondary a,
.button-secondary button,
.button-secondary input[type="submit"],
.button-secondary input[type="reset"],
.button-secondary.button-scripted > span {
	display: block;
	width: 80%;
	max-width: 300px;
	color: #fff;
	font-size: 1.3rem;
	font-weight: bold;
	text-align: center;
	line-height: 1;
	margin: 1em auto;
	padding: 1em;
	background: var(--button-color);
	border: 2px solid var(--button-color);
	border-radius: 30px;
	cursor: pointer;
}
.button-primary i {
	margin-right: 0.5em;
}
.button-primary a:hover,
.button-primary button:hover,
.button-primary input[type="submit"]:hover,
.button-primary input[type="file"] + label:hover,
.button-highlight a:hover,
.button-highlight button:hover,
.button-highlight input[type="submit"]:hover,
.button-highlight input[type="file"] + label:hover,
.button-secondary a:hover,
.button-secondary button:hover,
.button-secondary input[type="submit"]:hover,
.button-secondary input[type="reset"]:hover {
	color: var(--button-color);
	background: #fff;
}
.button-primary button[disabled="disabled"] {
	border-color: #ccc !important;
	background: #ccc !important;
}
.button-primary button[disabled="disabled"]:hover {
	color: #fff !important;
}
.button-highlight i,
.button-secondary i {
	margin-right: 0.5em;
}
.button-line input[type="submit"] {
	display: block;
	width: 80%;
	max-width: 300px;
	color: #fff !important;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	line-height: 1;
	margin: 15px auto;
	padding: 1em;
	border-radius: 5px;
	background: #00b900;
}
ul.link-list li a {
	display: block;
	color: var(--text-color);
	font-size: 1.4rem;
	padding: 1em 1.5em;
	border-bottom: 1px solid #eee;
	position: relative;
}
ul.link-list li a:after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 6px;
	height: 6px;
	margin: -4px 0 0 0;
	border-top: solid 2px #8c8c8c;
	border-right: solid 2px #8c8c8c;
	transform: rotate(45deg);
}
ul.list_btn > li {
	margin-bottom: 0.5em;
}
ul.list_btn.clm2 {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	align-items: center;
}
ul.list_btn.clm2 > li {
	width: 50%;
}
ul.list_btn.clm2 > li a,
ul.list_btn.clm2 > li button,
ul.list_btn.clm2 > li input[type="submit"],
ul.list_btn.clm2 > li input[type="reset"] {
	width: 95%;
	margin: 1em auto;
	border-radius: 10px;
}
ul.list_notes {
	list-style: disc;
	font-size: 1.4rem;
	padding-left: 1.5em;
	margin-bottom: 1em;
}
ul.list_notes li {
	color: var(--text-color);
	line-height: 1.6;
	margin-bottom: 0.8em;
	overflow-wrap: break-word;
}
ul.list_notes li:last-child {
	margin-bottom: 0;
}
dl.description-list {
	font-size: 1.3rem;
	text-align: left;
	margin-bottom: 3em;
}
dl.description-list > dt {
	font-size: 1.1em;
	font-weight: bold;
	margin: 1.5em 0 1em;
	border-bottom: 2px solid var(--site-color);
}
dl.description-list > dt:first-child {
	margin-top: 0;
}
dl.description-list > dd {
	margin-bottom: 0.5em;
	text-align: justify;
}
dl.terms-list {
	font-size: 1.3rem;
	text-align: left;
	margin-bottom: 3em;
}
dl.terms-list dt {
	font-size: 1.1em;
	font-weight: bold;
	margin: 1.5em 0 0.5em;
}
dl.terms-list dt:first-child {
	margin-top: 0;
}
dl.terms-list dd {
	margin-bottom: 0.5em;
	text-align: justify;
}
dl.form-fields {
	font-size: 1.3rem;
	text-align: left;
	margin-bottom: 3em;
}
dl.form-fields > dt {
	font-weight: bold;
	margin: 1.5em 0 0.5em;
}
dl.form-fields > dt:first-child {
	margin-top: 0;
}
dl.form-fields > dd {
	margin-bottom: 0.5em;
}
ul.teller-list {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	font-size: 1.3rem;
	margin: 1em 0 5em;
}
ul.teller-list > li {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	width: 50%;
	padding: 0 0.4em;
	margin-bottom: 1em;
	position: relative;
}
ul.teller-list > li a {
	display: block;
}
ul.teller-list > li .image {
	width: 100%;
	text-align: center;
	margin-bottom: 0.3em;
	position: relative;
}
ul.teller-list > li .image > img {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 4px;
	-o-object-fit: contain;
	object-fit: contain;
}
ul.teller-list > li .image > .status {
	position: absolute;
	top: 0;
	left: 0;
	width: 45px;
	height: 22px;
	opacity: 0.95;
	z-index: 5;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #46ba5b;
	border-radius: 4px 0;
}
ul.teller-list > li .image > .status.off {
	background: #8c8c8c;
}
ul.teller-list > li .image > .status > p {
	color: #fff;
	font-size: 0.8em;
	font-weight: bold;
	line-height: 1.2em;
}
ul.teller-list > li .image > .comment {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	text-align: left;
	border-radius: 0 0 4px 4px;
	background: rgb(109 109 109 / 80%);
}
ul.teller-list > li .image > .comment > p {
	color: #fff;
	font-size: 0.8em;
	line-height: 1.2;
	padding: 0.5em;
}
ul.teller-list > li .image > .comment.off {
	display: none;
}
ul.teller-list > li .tellerdata {
	width: 100%;
}
ul.teller-list > li .tellerdata > p.name {
	font-weight: bold;
	text-align: center;
	margin-bottom: 0.5em;
}
ul.teller-list > li .tellerdata > p.type {
	font-size: 0.8em;
	margin-bottom: 0.5em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
ul.teller-list > li .tellerdata > p.profile {
	display: block;
	color: #8c8c8c;
	font-size: 0.8em;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
ul.genre-tag-list {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0.2em;
}
ul.genre-tag-list > li {
	color: #333;
	font-size: 0.8em;
	font-weight: bold;
	line-height: 1.5;
	padding: 0 0.5em;
	margin-right: 0.3em;
	margin-bottom: 0.5em;
	border-radius: 5px;
	border: 1px solid #333;
}
ul.genre-tag-list > li.genre1 {
	color: var(--genre1-color);
	border-color: var(--genre1-color);
}
ul.genre-tag-list > li.genre2 {
	color: var(--genre2-color);
	border-color: var(--genre2-color);
}
ul.genre-tag-list > li.genre3 {
	color: var(--genre3-color);
	border-color: var(--genre3-color);
}
ul.genre-tag-list > li.genre4 {
	color: var(--genre4-color);
	border-color: var(--genre4-color);
}
ul.genre-tag-list > li.genre5 {
	color: var(--genre5-color);
	border-color: var(--genre5-color);
}
ul.genre-tag-list > li.genre6 {
	color: var(--genre6-color);
	border-color: var(--genre6-color);
}
ul.conversation-list {
	font-size: 1.3rem;
}
ul.conversation-list > li {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	width: 100%;
	padding: 1em;
	border-bottom: 1px solid #eee;
	position: relative;
}
ul.conversation-list > li > .image {
	width: 23%;
	max-width: 100px;
	text-align: center;
}
ul.conversation-list > li > .image img {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: #fff;
	-o-object-fit: contain;
	object-fit: contain;
}
ul.conversation-list > li > .userdata {
	width: 72%;
	padding-left: 1em;
}
ul.conversation-list > li > .userdata > p.name {
	font-size: 1.1em;
	font-weight: bold;
}
ul.conversation-list > li > .userdata > p.text {
	color: var(--muted-text-color);
	margin-bottom: 0.5em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
ul.conversation-list > li > .userdata > p.time {
	color: var(--muted-text-color);
	font-size: 0.8em;
}
ul.conversation-list > li.new:after {
	content: "\f111";
	font-family: "Font Awesome 5 Free";
	color: var(--new-color);
	font-size: 1.5rem;
	font-weight: 900;
	position: absolute;
	top: 38%;
	right: 1em;
	z-index: 1;
}
ul.chat-messages {
	font-size: 1.2rem;
	padding: 1em;
}
ul.chat-messages > li {
	margin-bottom: 1.5em;
}
ul.chat-messages > li .text {
	position: relative;
}
ul.chat-messages > li .text > p {
	word-wrap: break-word;
}
ul.chat-messages > li .text > p.date {
	font-size: 0.8em;
	margin-bottom: 0.2em;
}
ul.chat-messages > li .text > .message {
	display: inline-block;
	color: var(--text-color);
	font-size: 1.4rem;
	text-align: left;
	padding: 0.5em;
	border: 1px solid var(--text-color);
	border-radius: 0.8em;
	background: #fff;
	word-break: break-word;
}
ul.chat-messages > li .text > p.image {
	display: block;
	padding: 0.5em;
	border: 1px solid var(--text-color);
	border-radius: 0.8em;
	max-width: 130px;
	background: #fff;
}
ul.chat-messages > li.opp .icon {
	margin-bottom: 0.5em;
}
ul.chat-messages > li.opp .icon img {
	width: 50px;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: #fff;
	-o-object-fit: contain;
	object-fit: contain;
}
ul.chat-messages > li.opp .text .message {
	position: relative;
}
ul.chat-messages > li.opp .text .message .more {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	color: var(--site-color);
	font-weight: bold;
	text-align: center;
	padding: 2.5em 1em 1em;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #ffffff 50%, #ffffff);
	background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), #ffffff 50%, #ffffff);
}
ul.chat-messages > li.opp .text .message .close {
	display: block;
	color: var(--site-color);
	font-weight: bold;
	text-align: center;
	padding: 1em;
}

ul.chat-messages > li.my {
	text-align: right;
	margin-left: 20%;
}
ul.chat-messages > li.my .text > .message,
ul.chat-messages > li.my .text > p.image {
	background: var(--form-color);
}
ul.chat-messages > li.my .text > p.image {
	margin-left: auto;
}
ul.member-menu {
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
	border: 1px solid #eee;
	border-width: 1px 1px 0 0;
}
ul.member-menu > li {
	width: 50%;
	text-align: center;
	border: 1px solid #eee;
	border-width: 0 0 1px 1px;
}
ul.member-menu > li > a {
	display: block;
	color: var(--text-color);
	padding: 2em 0.5em 1em;
	position: relative;
}
ul.member-menu > li > a > i {
	display: block;
	width: 100%;
	color: #8c8c8c;
	font-size: 3.5rem;
	margin-bottom: 0.3em;
}
ul.profile-details {
	font-size: 1.6rem;
	width: 100%;
	margin: 0 auto 1.5em;
}
ul.profile-details > li {
	display: flex;
	margin-bottom: 0.8em;
	border-bottom: 2px solid var(--form-color);
}
ul.profile-details > li > * {
	padding-bottom: 0.3em;
}
ul.profile-details > li > h2 {
	width: 30%;
	font-weight: bold;
}
ul.profile-details > li > p {
	width: 70%;
}
ul.profile-details > li > p:before {
	content: "/";
	color: #ccc;
	padding-right: 1em;
}
ul.list_mail > li {
	display: block;
	color: var(--text-color);
	font-size: 1.4rem;
	padding: 1em 2em 1em 1em;
	border-bottom: 1px solid #eee;
	position: relative;
}
ul.list_mail > li:after {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 15px;
	width: 6px;
	height: 6px;
	margin: -4px 0 0 0;
	border-top: solid 2px #8c8c8c;
	border-right: solid 2px #8c8c8c;
	transform: rotate(45deg);
}
ul.list_mail > li p.date {
	color: #8c8c8c;
}
ul.list_mail > li p.detail {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
ul.list_mail.news > li {
	padding: 1em 2em 1em 4.5em;
}
ul.list_mail.news > li:before {
	content: "\f0e0";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #fff;
	font-size: 1.6em;
	text-align: center;
	line-height: 1.8em;
	position: absolute;
	top: 50%;
	left: 0.5em;
	width: 1.8em;
	height: 1.8em;
	background: var(--site-color);
	border-radius: 5px;
	transform: translateY(-50%);
}
ul.point-package-list {
	font-size: 1.8rem;
	margin: 1.5em auto;
}
ul.point-package-list li a {
	display: block;
	color: var(--text-color);
	margin-bottom: 1em;
	border-radius: 15px;
}
ul.point-package-list li a dl {
	display: table;
	width: 100%;
}
ul.point-package-list li a dl dt {
	display: table-cell;
	vertical-align: middle;
	width: 40%;
	color: #fff;
	background: var(--site-color);
	border-radius: 10px 0 0 10px;
	position: relative;
}
ul.point-package-list li a dl dt > p {
	font-weight: bold;
	text-align: center;
}
ul.point-package-list li a dl dd {
	display: table-cell;
	width: 60%;
	text-align: right;
	padding: 5%;
	background: #fff;
	border: 3px solid var(--site-color);
	border-radius: 0 10px 10px 0;
}
ul.point-package-list li a dl dd > p {
	font-weight: bold;
	line-height: 1.2;
}
ul.payment-method-list > li {
	margin: 1.5em 1em;
	background: #fff;
	border-radius: 5%;
	box-shadow: 0px 5px 3px #ccc;
	position: relative;
}
ul.payment-method-list > li > a {
	display: block;
}
.modal-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.6);
	display: none;
	z-index: 1000;
}
.modal-overlay .inner {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	width: 90%;
	max-width: 360px;
	margin: auto;
	padding: 1.5em 1em;
	text-align: center;
	background: #fff;
	border-radius: 1em;
	transform: translateY(-50%);
}
.modal-overlay .inner > h3 {
	font-size: 1.4rem;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.modal-overlay .inner > p {
	font-size: 1.2rem;
	margin-bottom: 0.5em;
}
.modal-overlay .inner .modal-menu {
	font-size: 1.2rem;
	margin: 1em 0 0;
	border-top: 1px solid #eee;
}
.modal-overlay .inner .modal-menu .menu {
	border-bottom: 1px solid #eee;
}
.modal-overlay .inner .modal-menu .menu > a {
	display: block;
	padding: 1em 0;
	color: var(--site-color);
	font-size: 1.1em;
	font-weight: bold;
}
.modal-overlay .inner .modal-menu .close > a {
	display: block;
	padding: 1em 0 0;
	color: #8c8c8c;
	text-decoration: underline;
}
.modal-overlay .inner .modal-actions {
	font-size: 1.2rem;
	margin: 2em 0 0;
}
.modal-overlay .inner .modal-actions p[class^="button-"] > a,
.modal-overlay .inner .modal-actions p[class^="button-"] > input[type="submit"] {
	margin-bottom: 0;
}
.modal-overlay .inner .modal-actions .close > a,
.modal-overlay .inner .modal-actions .skip > input[type="submit"] {
	display: block;
	padding: 1em 0 0;
	color: #8c8c8c;
	text-decoration: underline;
}
.modal-overlay .inner ul.list_btn a {
	margin-bottom: 0;
}
.modal-overlay .inner > .textarea {
	max-height: 40vh;
	min-height: 15vh;
	overflow-y: scroll;
	font-size: 1.2rem;
	text-align: left;
	padding: 0.5em;
	border-top: 1px solid #eee;
}
.modal-overlay .inner > .textarea > img {
	display: block;
}
.modal-overlay .inner .infocheck label {
	position: relative;
	padding-left: 2em;
}
.modal-overlay .inner .infocheck label input[type="checkbox"] {
	display: none;
}
.modal-overlay .inner .infocheck label input[type="checkbox"] + span::before {
	content: "";
	display: block;
	width: 11px;
	height: 11px;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	border: 2px solid #ccc;
	border-radius: 3px;
	cursor: pointer;
}
.modal-overlay .inner .infocheck label input[type="checkbox"]:checked + span::before {
	border-color: var(--site-color);
	background: var(--site-color);
}
.modal-overlay .inner .infocheck label input[type="checkbox"]:checked + span::after {
	content: "";
	display: block;
	width: 10px;
	height: 5px;
	border-bottom: 2px solid #fff;
	border-left: 2px solid #fff;
	box-sizing: border-box;
	position: absolute;
	top: 40%;
	left: 4px;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg) translateY(-50%);
}
.overlay_02 {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.6);
	display: none;
	z-index: 1000;
}
.overlay_02 .inner {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	width: 80%;
	max-width: 360px;
	margin: auto;
	padding: 4em 1em 1.5em;
	text-align: center;
	background: #fff;
	border-radius: 1em;
	transform: translateY(-50%);
}
.overlay_02 .inner > h3 {
	color: var(--site-color);
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.overlay_02 .inner > p.icon {
	position: absolute;
	top: -1em;
	left: 0;
	right: 0;
	width: 2em;
	height: 2em;
	margin: auto;
	color: #fff;
	font-size: 3rem;
	text-align: center;
	background: var(--site-color);
	border-radius: 50%;
}
.overlay_02 .inner > p.icon i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.overlay_02 .inner > p.close > a {
	display: block;
	padding: 1em 0 0;
	color: #8c8c8c;
	font-size: 1.2em;
	text-decoration: underline;
}
table.table-bordered {
	width: 100%;
	font-size: 1.3rem;
	background: #fff;
}
table.table-bordered thead th {
	color: #fff;
	background: var(--site-color);
}
table.table-bordered,
table.table-bordered th,
table.table-bordered td {
	border: 1px solid #ccc;
	border-collapse: collapse;
}
table.table-bordered th,
table.table-bordered td {
	padding: 10px;
}
table.table-bordered th {
	width: 25%;
	font-weight: bold;
	background: var(--form-color);
}
.tellerprofile {
	position: relative;
	font-size: 1.4rem;
	padding: 1em 1em 3em;
}
.tellerprofile .main_image figure {
	width: 50%;
	text-align: center;
	margin: 0 auto 1em;
}
.tellerprofile .main_image figure > img {
	border-radius: 5px;
}
.tellerprofile section {
	margin-bottom: 2em;
}
.chat-history {
	min-height: 100%;
	background: #f9f9f9;
}
.chat-composer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #fff;
	padding: 0.5em;
}
.chat-composer > form {
	display: flex;
	justify-content: center;
	align-items: flex-end;
}
.chat-composer > form .message {
	width: 85%;
	margin-right: 2%;
}
.chat-composer > form .message > textarea {
	height: 35px;
	max-height: 200px;
	font-size: 1.6rem;
	line-height: 1.5;
}
.chat-composer > form p.btn {
	width: 13%;
}
.chat-composer > form p.btn > input[type="submit"] {
	color: #fff;
	font-size: 1.2rem;
	font-weight: bold;
	text-align: center;
	padding: 0.8em;
	border-radius: 0.5em;
	background: var(--site-color);
}
.member-summary {
	max-width: 250px;
	margin: 0 auto 2rem;
	font-size: 1.4rem;
	text-align: left;
}
.member-summary p.member-login-id {
	display: inline-block;
	color: #8c8c8c;
	font-size: 0.8em;
	font-weight: bold;
	padding: 0 1em;
	margin-bottom: 0.3em;
	border: 1px solid #8c8c8c;
	border-radius: 5px;
}
.member-summary dl.point {
	display: flex;
	align-items: baseline;
}
.member-summary dl.point dt {
	width: 45%;
	text-align: left;
}
.member-summary dl.point dd {
	width: 55%;
	text-align: center;
}
.member-summary dl.point dd > span {
	color: var(--red-color);
	font-size: 2em;
	font-weight: bold;
	line-height: 1;
	margin: 0 0.3em;
}
.member-summary p.button-primary > a {
	width: 100%;
}
.member-promotions {
	margin-bottom: 2rem;
	font-size: 1.6rem;
}
.member-promotions > form {
	display: block;
	margin-top: 2rem;
}
.member-promotions img {
	max-width: 100%;
	height: auto;
}
.content-section.ad-banner-section {
	padding-top: 2em;
	padding-bottom: 0;
}
.member-profile-panel {
	position: fixed;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 999;
	overflow: auto;
	visibility: hidden;
	pointer-events: none;
	transition:
		left 0.3s ease-out,
		visibility 0s linear 0.3s;
}
.member-profile-panel.is-active {
	left: 0;
	visibility: visible;
	pointer-events: auto;
	transition-delay: 0s;
}
.member-profile-panel > .ttl {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 50px;
	background: #fff;
	border-bottom: 3px solid var(--site-color);
	z-index: 10;
}
.member-profile-panel > .ttl > p {
	font-size: 1.4rem;
}
.member-profile-panel > .ttl > p.ope {
	position: absolute;
	left: 0;
	font-size: 2em;
	padding: 0.4em 1em;
}
.member-profile-panel > .inner {
	margin-top: 50px;
	padding: 2em;
}
.maildetail {
	font-size: 1.4rem;
	padding: 1em;
}
.maildetail .date {
	color: #8c8c8c;
	font-size: 0.9em;
	text-align: right;
	margin-bottom: 0.5em;
}
.maildetail .detail {
	text-align: justify;
}
.maildetail .detail img {
	display: block;
}
.point-balance {
	font-size: 1.6rem;
	text-align: center;
	padding: 0.5em;
	background: var(--form-color);
	border-radius: 0.5em;
}
.point-balance .point > span {
	color: var(--red-color);
	font-size: 2em;
	font-weight: bold;
	line-height: 1;
	margin: 0 0.2em;
}
.area_mailbonus {
	font-size: 1.3rem;
	text-align: center;
	margin-bottom: 1.5em;
}
.area_mailbonus > p {
	font-weight: bold;
}
.area_mailbonus > p.bonuspoint {
	color: #ff0000;
	font-size: 1.2em;
}
.area_mailbonus > p.bonuspoint > span {
	display: block;
	color: #ff0000;
	font-weight: bold;
	width: 70%;
	margin: 0.2em auto;
	padding: 0.1em;
	text-shadow:
		-2px 0 0 #fff,
		0 -2px 0 #fff,
		2px 0 0 #fff,
		0 2px 0 #fff;
	background: repeating-linear-gradient(-45deg, #ffffc5, #ffffc5 5px, #fff 0, #fff 10px);
}
.area_mailbonus > p.bonuspoint > span > em {
	font-size: 2em;
	font-weight: bold;
	margin-right: 0.1em;
	vertical-align: sub;
}
.area_mailbonus > p.process {
	margin-top: 1em;
}
.area_empty {
	padding: 5em 1em 1em;
	margin: auto;
}
.area_empty > p {
	font-size: 1.4rem;
	text-align: center;
	margin-bottom: 1em;
}
.animated_fadeInUp {
	opacity: 1;
	animation: fadeInUp 0.5s ease 1;
}
@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(30px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
.text-large {
	font-size: 1.2em !important;
}
.text-danger {
	color: var(--red-color) !important;
}
.text-center {
	text-align: center !important;
}
.text-bold {
	font-weight: bold !important;
}
.text-underlined {
	text-decoration: underline;
}
.margin-bottom-small {
	margin-bottom: 0.5em !important;
}
.margin-bottom-medium {
	margin-bottom: 1em !important;
}
.margin-bottom-large {
	margin-bottom: 1.5em !important;
}
.margin-bottom-extra-large {
	margin-bottom: 2em !important;
}

.content-section {
	padding: 1em;
}
.link-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid #eee;
}
.link-list > li {
	border-bottom: 1px solid #eee;
}
.link-list > li > a {
	display: block;
	padding: 0.9em 1em;
	color: inherit;
	text-decoration: none;
}
.link-list > li > a:hover {
	background: var(--form-color);
}
.badge {
	position: absolute;
	display: inline-block;
	top: 10%;
	right: 15%;
	width: 18px;
	height: 18px;
	color: #fff;
	font-size: 1rem;
	font-weight: bold;
	line-height: 1.8;
	text-align: center;
	border-radius: 50%;
	background: var(--new-color);
}
.fixed-bottom {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	z-index: 99;
}
.content-text > p {
	font-size: 1.4rem;
}
.payment-about {
	margin: 0;
	padding: 6px 0;
	text-align: center;
	background-color: #fff;
}
.payment-about > a {
	color: #1a73e8;
	font-size: 1em;
}

dl.price-list-primary {
	overflow: hidden;
}
dl.price-list-primary dt {
	width: 60%;
	margin: 0 0;
	padding: 5px 0;
	border: 1px solid var(--price-border-color);
	border-right: none;
	border-top: none;
	background: var(--form-color);
	color: var(--price-heading-color);
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	line-height: 4rem;
	float: left;
}
dl.price-list-primary dt:first-child {
	width: 100%;
	border: 1px solid var(--price-border-color);
	color: var(--site-color);
}
dl.price-list-primary dd {
	width: 40%;
	margin: 0 0;
	padding: 5px 0;
	border: 1px solid var(--price-border-color);
	border-top: none;
	font-size: 1.5rem;
	text-align: center;
	line-height: 4rem;
	float: left;
}

dl.price-list-secondary {
	overflow: hidden;
}
dl.price-list-secondary dt {
	width: 60%;
	margin: 0 0;
	padding: 5px 0;
	border: 1px solid #dedede;
	border-right: none;
	border-top: none;
	background: #efefef;
	color: #666;
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	line-height: 4rem;
	float: left;
}
dl.price-list-secondary dt:first-child {
	width: 100%;
	border: 1px solid #dedede;
	color: #484848;
}
dl.price-list-secondary dd {
	width: 40%;
	margin: 0 0;
	padding: 5px 0;
	border: 1px solid #dedede;
	border-top: none;
	font-size: 1.5rem;
	text-align: center;
	line-height: 4rem;
	float: left;
}

.member-summary dl.point {
	justify-content: center;
	flex-wrap: nowrap;
}
.member-summary dl.point dt {
	width: auto;
	white-space: nowrap;
	flex: 0 0 auto;
}
.member-summary dl.point dd {
	width: auto;
	white-space: nowrap;
	flex: 0 1 auto;
	min-width: 0;
}
.member-summary dl.point dd > span {
	margin: 0 0.15em;
}
@media screen and (max-width: 360px) {
	.member-summary dl.point dt {
		font-size: 0.9em;
	}
	.member-summary dl.point dd > span {
		font-size: 1.7em;
	}
}
.line-guide-button {
	border: none;
	background: none;
	padding: 0;
}
.line-banner-section {
	padding: 2em 1em;
}
.line-banner-section + .conversation-list,
.line-banner-section + .list_mail {
	border-top: 1px solid #eee;
}
.deferred-payment-section {
	max-width: 480px;
	margin: 0 auto;
}
.deferred-payment-summary {
	padding: 1em;
	background: var(--form-color);
	border-radius: 0.5em;
}
.deferred-payment-summary .deferred-payment-alert {
	color: var(--red-color);
	font-weight: bold;
	font-size: 1.3rem;
	text-align: center;
	margin-bottom: 0.8em;
}
.deferred-payment-summary .deferred-payment-details {
	display: flex;
	flex-wrap: wrap;
	font-size: 1.3rem;
	margin-bottom: 1em;
}
.deferred-payment-summary .deferred-payment-details > dt {
	width: 45%;
	padding: 0.6em 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.deferred-payment-summary .deferred-payment-details > dd {
	width: 55%;
	padding: 0.6em 0;
	text-align: right;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.deferred-payment-summary .deferred-payment-note {
	font-size: 1.1rem;
	text-align: center;
	margin-bottom: 1em;
}
.deferred-payment-summary .button-primary > a {
	margin-bottom: 0;
}
.blue {
	color: #1a73e8;
}
.center {
	text-align: center;
}
.mb1 {
	margin-bottom: 1em;
}
.v-body {
	font-family: "Arial", sans-serif;
	color: #333;
	margin: 0;
}
.v-header {
	background-color: var(--payment-accent-color);
	color: white;
	padding: 1rem 0;
	text-align: center;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.v-header h1 {
	font-size: 2rem;
	font-weight: bold;
	margin: 0;
	text-transform: uppercase;
}
.v-card {
	font-size: 1.4rem;
	border: none;
	border-radius: 15px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	margin: 1rem 0;
	background-color: white;
	padding: 0.5rem;
}
.v-card-title {
	font-size: 1.6rem;
	font-weight: bold;
	color: var(--payment-accent-color);
	margin-bottom: 1rem;
	text-align: center;
	border: 2px solid var(--payment-accent-color);
	padding: 0.5rem;
	border-radius: 10px;
}
.v-card-text {
	font-size: inherit;
	color: #555;
	margin-bottom: 1rem;
	text-align: left;
}
.v-img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
	margin: 1rem auto;
}
.v-app-icons {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 1.5rem;
	flex-wrap: wrap;
}
.v-app-icons a {
	margin: 0 10px;
}
.v-btn-custom {
	background-color: var(--payment-accent-color);
	color: #fff !important;
	border: none;
	padding: 0.5rem 1.25rem;
	font-size: 1.4rem;
	border-radius: 5px;
	transition:
		background-color 0.3s,
		transform 0.3s;
	display: inline-block;
	margin: 0.5rem 0;
}
.v-btn-custom:hover {
	background-color: var(--payment-hover-color);
	color: #fff;
}
main.is-fade {
	opacity: 0;
}
main.is-fade.is-ready {
	opacity: 1;
	transition: opacity 0.6s ease;
}
.modal-overlay.is-open {
	display: block;
	animation: ovFade 0.3s ease;
}
@keyframes ovFade {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
