/* -----------------　Header　----------------- */
.navbar {
    padding: 0;
    display: block;
}

header .navbar {
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #fff;
}

header .navbar.pure,
[class*=" bg-pfx"] header .navbar {
    background: transparent;
}

header .navbar.side-nav-pl {
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
}

header .navbar .header-container {
    width: 100%;
    height: 80px;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

header .navbar.side-nav-pl .header-container {
    height: 80px;
}

.navbar .header-top {
    font-size: 1.2rem;
    color: #f3f3f3;
    background: #0091EA !important;
    justify-content: left;
}

.navbar .header-top .container {
    height: 40px;
}

.navbar .header-main,
.navbar .header-menu {
    position: relative;
    font-size: 1.6rem;
    background: #fff !important;
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
}

/**
.navbar.pure .header-main,
[class*=" bg-pfx"] .navbar .header-main {
	background: #ffffff63 !important;
}

[class*=" bg-blue-pfx"] .navbar.pure .header-main{
	background: #fffffff5 !important;
}**/

.navbar .header-main {
    z-index: 1033;
}

.navbar .header-menu {
    border-top: 1px solid #f0f0f0;
}

.navbar.side-nav-pl .banner-inner>.navbar-brand-name {
	font-size: 1.8rem;
	font-weight: 500;
}

.navbar.side-nav-pl .banner-inner>.navbar-brand,
.navbar.side-nav-pl .banner-inner>.navbar-brand-text,
.navbar .button-collapse-wrap {
    display: none !important;
}

.navbar-brand {
    padding: 0;
}

.navbar-brand img {
    width: 50px;
    border-radius: .25rem;
}

.navbar-brand-text .sub-text {
    font-size: 1.2rem;
    font-weight: 400;
}

.navbar .header-menu .container {
    height: 48px;
}

.navbar li {
    position: relative;
}

.navbar .header-menu ul {
    width: 90%;
    height: 100%;
}

.navbar .navbar-toggler-inner .navbar-nav {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.navbar .navbar-nav ul:not(.dropdown-menu) {
    position: relative;
    display: flex;
    height: 100%;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.navbar .navbar-nav li.nav-item {
    position: relative;
    display: inline-flex;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.navbar .navbar-nav li.nav-item a {
    overflow: initial;
}

.navbar .header-menu li.nav-item {
    width: 100%;
    height: 100%;
    padding: 0;
    text-align: center;
    line-height: 1;
    cursor: pointer;
    background:#fff;
}

.navbar .header-menu li.nav-item a {
    width: 100%;
    padding: 1rem 0;
}

.navbar .header-menu li.border-hover {
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
}

.navbar .header-menu li.border-hover.current,
.navbar .header-menu li.border-hover:hover {
    border-bottom: 3px solid #0091ea;
    background: #f3fbff;
    font-weight: 600;
}

.navbar .header-menu li.nav-item:hover a {
    color: #0091EA;
}

.navbar .header-main li.nav-item.current a,
.navbar .header-menu li.nav-item.current a {
    color: #0091EA;
}

.navbar .header-main li.list-inline-item.divider::before,
.navbar .header-menu li.nav-item:not(:first-child)::before {
    content: "";
    display: block;
    position: absolute;
    top: calc(50% - 15px);
    left: 0;
    width: 1px;
    height: 30px;
    background: #c4c4c454;
}

.navbar .header-menu li.item a,
.navbar .header-menu li.item button {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    padding: .5rem 0;
    font-weight: 500;
    text-decoration: none;
}

.navbar .header-menu li.item a::before,
.navbar .header-menu li.item button::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: background-color .3s ease-out;
    background: rgba(255, 255, 255, 0);
    z-index: 1;
}

.navbar-toggler-inner {
    display: none;
}

.navbar.scrolling-navbar {
    padding: 0 !important;
}

.sp-nav {
    display: none;
}

.menu-list ul.main>li>.inner {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    padding: 1.4rem;
    cursor: pointer;
    height: auto;
    border-bottom: 1px solid #eaeaea;
}

.menu-list .menu-sub-list {
    border: 0;
}

.nav-list a {
    color: #212529;
}

.menu-list .menu-icons.qbc-icons {
    font-size: 2.4rem;
    margin-right: .55rem;
}

.menu-list ul>li a {
    color: #212529;
}

.menu-list .menu-sub-list ul {
    background: #fff;
    overflow: hidden;
}

.menu-list .menu-sub-list ul>li {
    padding: 1.4rem 1.6rem;
    cursor: pointer;
    border-bottom: 1px solid #eaeaea;
}

.menu-list .menu-sub-list ul>li:last-child {
    border-bottom: 0;
}

.menu-list ul>li:hover,
.menu-list ul>li.current {
    background: #e3e5e7;
}

.menu-list .menu-sub-list ul>li img {
    width: 30px;
    vertical-align: middle;
    border-radius: 3px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px #c5c5c5;
    -moz-box-shadow: 1px 1px 3px #c5c5c5;
    box-shadow: 1px 1px 3px #c5c5c5;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.navbar .dropdown-menu.navbar-nav{
	display:none;
}
	
@media (max-width: 767px) {

    .navbar .header-main,
    .navbar .header-menu {
        font-size: 1.4rem;
    }

    .navbar .header-top .container {
        height: 30px;
    }

    .navbar .header-main .container {
        height: 60px;
    }

    .navbar .header-menu .container {
        height: 45px;
    }

    header .navbar.has-scrolled {
        border-bottom: 1px solid #1919190a;
    }

    header .navbar.side-nav-pl .header-container {
        height: 70px;
        /*padding-left: 0.8rem !important;
		padding-right: 0.8rem !important;*/
    }
    
    .navbar .header-menu #spMenuList li.nav-item {
		height:auto;
	}
	
	.navbar .dropdown-menu.navbar-nav.show{
		display: block;
	}
	
	.navbar .dropdown-menu#spMenuList{
		margin-top:-48px;
	}
}

@media (max-width: 992px) {

    .navbar-brand img {
        width: 50px;
    }

    .qbc-side-nav li.header .navbar-brand img {
        width: 60px;
    }

    .navbar .header-menu {
        padding-left: 0;
        padding-right: 0;
    }

    .navbar .header-menu .container {
        padding: 0;
    }

    .navbar .header-menu ul {
        width: 100%;
    }

    .navbar .header-menu li.item {
        padding: 0 1.5rem
    }

    .navbar-toggler {
        font-size: 2.8rem;
        padding: 0;
        padding-left: 6px;
        vertical-align: middle;
    }

    .navbar-toggler-icon {
        width: auto;
        height: auto;
    }

    .navbar-toggler-inner {
        display: flex;
    }

    .md-nav {
        display: none;
    }

    .sp-nav {
        display: flex
    }
}

@media (max-width: 1024px) {
    .navbar li.toggler-item {
        display: none !important;
    }
}

/* ----------------- /　Header　----------------- */

/** -------------- Footer -------------- **/
footer.page-footer {
    color: #212121;
}

footer.page-footer.pure-footer {
    color: #fff;
        background-color: #00000033;
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0px -3px 5px 0 rgb(0 0 0 / 5%), 0px -1px 3px 0px rgb(0 0 0 / 5%);
}

footer.page-footer.pure-footer .footer-wrap{
    background-color: transparent;
}

footer.page-footer .footer-wrap {
    color: #fff;
    background-color: #65BCF2;
}

footer.page-footer .waves-wrap svg.waves {
    height: 40px;
}

footer.page-footer .waves-wrap {
    margin-bottom: -1px;
}

footer.page-footer img.pfx-logo {
    width: 50px;
    border-radius: .25rem;
}

footer.page-footer .footer-sitemap ul>li>a {
    font-size: 1.4rem;
    color: #212529;
    font-weight: 400;
}

footer.page-footer .footer-sitemap ul>li>a:hover {
    text-decoration: underline;
}

footer.page-footer .footer-contact {
    color: #fff;
    background-color: #65BCF2;
    padding-top: 4.8rem;
}

footer.page-footer .footer-contact a {
    color: #fff;
    vertical-align: middle;
}

footer.page-footer .footer-contact hr {
    border-top: 1px solid #cecece54;
    margin: 4.8rem 0;
}

footer.page-footer .footer-contact h5 {
    font-size: 1.8rem;
}

footer.page-footer .footer-contact .contact-wrap.main {
    margin-bottom: 4.8rem;
}

footer.page-footer .footer-contact .contact-wrap .inner {
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    -ms-flex-direction: column;
    flex-direction: column;
}

footer.page-footer .footer-contact .contact-wrap ul {
    display: -ms-flexbox;
    display: flex;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    -ms-flex-direction: row;
    flex-direction: row;
    align-items: center;
}

footer.page-footer .footer-contact .contact-wrap ul li {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    align-self: stretch;
    width: 100%;
    margin: 0;
}

footer.page-footer .footer-contact .contact-wrap.others ul li {
    width: 25%;
    height: 100%;
}

.contact-tel {
    font-size: 2.4rem;
    margin-bottom: .8rem;
}

.contact-tel a {
    font-weight: 600;
}

footer.page-footer .footer-contact .contact-wrap.others ul li .contact-tel:last-child {
    margin-bottom: 0;
}

footer.page-footer .footer-contact .contact-wrap.main ul li:not(:first-child)::before {
    content: "";
    display: block;
    position: absolute;
    left: -4.8rem;
    width: 1px;
    height: 100%;
    background: #cecece54;
}

@media (max-width: 767px) {

    footer.page-footer .footer-contact .contact-wrap.main ul li:not(:first-child)::before {
        content: unset;
    }

    footer.page-footer .footer-contact .contact-wrap.others ul li {
        width: 100%;
    }
}

@media (min-width: 767px) and (max-width: 992px) {

    footer.page-footer .footer-contact .contact-wrap.main ul li:not(:first-child)::before {
        content: unset;
    }

    footer.page-footer .footer-contact .contact-wrap.others ul li {
        width: 50%;
    }
}

footer.page-footer .footer-copyright {
    font-size: 1rem;
    height: 30px;
    color: #fff;
    background-color: #65BCF2;
}

/** -------------- / Footer -------------- **/

/** -------------- Border --------------  **/
.blue-border {
    border: 1px solid #0091ea;
}

.blue-border.rounded table td {
    border-radius: .4rem !important;
}

.title-border {
    position: relative;
    text-align: center;
    padding-bottom: 1rem;
}

.title-border:before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 15%;
    border: 0;
    height: 1.5px;
    background-image: linear-gradient(to right, rgb(0 0 0 / 0%), #000000, rgb(0 0 0 / 0%));
    transform: translateX(-50%);
    animation: border_anim 3.5s linear forwards;
}

@media (max-width: 767px) {
    .title-border:before {
        width: 30%;
    }
}

.border-dashed {
    border-style: dashed !important;
}

@keyframes border_anim {
    0% {
        width: 3%;
    }

    15% {
        width: 15%;
    }
}

/** -------------- / Border --------------  **/

/** -------------- Images --------------  **/
img.flag-thumbnail {
    display: inline-block;
    width: 4rem;
    padding: 0.1rem;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.4rem;
    max-width: 100%;
    height: auto;
}

.avatar {
    height: 7rem;
    width: 7rem;
    min-width:7rem;
    border-radius: 50%;
    padding: 0.2rem;
    margin: 0 auto;
    -webkit-box-shadow: 0px 0px 8px 0 rgb(0 0 0 / 16%), 0px 1px 8px 0 rgb(0 0 0 / 12%);
    box-shadow: 0px 0px 8px 0 rgb(0 0 0 / 16%), 0px 1px 8px 0 rgb(0 0 0 / 12%);
}

.avatar.sm {
    height: 6rem;
    width: 6rem;
    min-width:6rem;
}

.avatar.xsm {
    height: 5rem;
    width: 5rem;
    min-width:5rem;
}

.avatar.w5x {
    height: 5rem;
    width: 5rem;
    min-width:5rem;
    padding: 0.1rem;
}

.avatar.xs {
    height: 4rem;
    width: 4rem;
    min-width:4rem;
    -webkit-box-shadow: 0 1px 5px 1px rgb(0 0 0 / 5%), 0 1px 5px 1px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 5px 1px rgb(0 0 0 / 5%), 0 1px 5px 1px rgb(0 0 0 / 5%);
}

.avatar.w4x {
	position:relative;
    height: 4rem;
    width: 4rem;
    min-width:4rem;
}

.avatar img {
    width: 100%;
    height: 100%;
}

.avatar img.flag {
    width: 4.5rem;
    min-width:4.5rem;
    height: auto;
    margin: 1.5rem auto;
    border-radius: 0.3rem !important;
}

.avatar img.rounded-circle {
    margin: 0 auto;
    object-fit: cover;
}

.avatar img.rounded-circle.object-fill {
    object-fit: fill;
}

.avatar.w4x .avatar-ctry {
    position: absolute;
    bottom: -0.3rem;
    right: -0.8rem;
    font-size: 1.6rem;
    text-shadow: none;
    border-radius: 1.2rem;
    margin: auto;
    padding: 0rem 0.35rem;
    width: 30px;
    height: 30px;
    min-width:30px;
}

.bank-image {
    height: 40px
}


.imageBox-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2040;
    width: 100vw;
    height: 100vh;
    background-color: #000;
    opacity: .9;
}

.imageBox {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2041;
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
}

.share-modal .modal-dialog .modal-content,
.image-modal .modal-dialog .modal-content{
	background-color: transparent;
	box-shadow: none;
	-webkit-box-shadow:none;
}

.view.preview{
	cursor:pointer;
}

.share-modal .modal-body button.close,
.image-modal .modal-body button.close{
	opacity: 1;
    float: none;
    display: inline !important;
    background: #4c4c4c;
    border-radius: 10rem;
    padding: 1.5rem;
    color: #fff;
}

img.invert70 {
    -webkit-filter: invert(100%);
    filter: invert(70%);
}

.view .mask-footer {
    position: absolute;
    color: #fff;
    top: auto;
    right: 0;
    bottom: 0;
    left: auto;
    width: 100%;
    height: auto;
    overflow: hidden;
    background-attachment: fixed;
}

.view .mask-footer.lighten-darken {
    background-color: #808185ad !important;
}

.view.rounded-lg .mask-footer {
    border-bottom-left-radius: 0.48rem;
    border-bottom-right-radius: 0.48rem;
}

@media (max-width: 767px) {
    .avatar {
        height: 6rem;
        width: 6rem;
        min-width:6rem;
    }
}

/** -------------- / Images --------------  **/

/** --------------  Form --------------  **/
.required-mark {
    position: relative;
    padding-left: 20px;
}

.required-mark::before {
    content: "※";
    display: block;
    position: absolute;
    top: 0;
    color: red;
    left: 0px;
    z-index: 1;
}

.qbc-form {
    position: relative;
    margin-top: 2.8rem;
}

.qbc-form input,
.qbc-form .input-group-append>.btn,
.qbc-form .qbc-select .btn.dropdown-toggle {
    min-height: 55px;
    height: 55px !important;
}

.qbc-form.lg input,
.qbc-form.lg .input-group-append>.btn,
.qbc-form.lg .qbc-select .btn.dropdown-toggle {
    min-height: 55px;
    height: 55px !important;
}

.qbc-form.sm input,
.qbc-form.sm .qbc-select .btn.dropdown-toggle,
.form-control.qbc-select.sm .btn.dropdown-toggle {
    min-height: 45px;
    height: 45px !important;
}

.qbc-form input.select-none.es-input {
    background: none;
}

.form-control.qbc-select.sm .btn.dropdown-toggle img.flag-thumbnail {
    width: 2.5rem;
}

.form-control .dropdown-menu {
    width: 100%;
}

.form-control span.text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qbc-form input {
    background-color: #fff !important;
}

.qbc-form input.form-control:disabled{
	background-color: #e9ecef!important;
}

.qbc-form input.bg-gray {
    background: #f2f2f2 !important;
}

.qbc-form.input-with-post-icon .form-control {
    padding-right: 4.32rem !important;
}

.qbc-form.input-with-post-icon .input-prefix {
    right: 16px;
    left: initial;
}

.qbc-form .input-prefix.active,
.qbc-form .qbc-moneyInput {
    color: #0091ea;
}

.qbc-form .input-prefix {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    color: rgba(0, 0, 0, 0.87);
    pointer-events: none;
}

.qbc-form.form-row.mutil-input>.col,
.qbc-form.form-row.mutil-input>.col-6 {
    padding: 0;
}

.qbc-form.form-row.mutil-input>.col:first-of-type,
.qbc-form.form-row.mutil-input>.col-6:first-of-type {
    padding-left: 5px;
}

.qbc-form.form-row.mutil-input>.col:first-of-type input,
.qbc-form.form-row.mutil-input>.col-6:first-of-type input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 1px dashed #ced4da;
}

.qbc-form.form-row.mutil-input>.col:last-of-type,
.qbc-form.form-row.mutil-input>.col-6:last-of-type {
    padding-right: 5px;
}

.qbc-form.form-row.mutil-input>.col:last-of-type input,
.qbc-form.form-row.mutil-input>.col-6:last-of-type input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0;
}

input.qbc-code {
    font-size: 1.8rem;
    color: #0091ea;
}

input.qbc-moneyInput {
    font-size: 2.4rem;
    color: #0091ea;
}

input.qbc-moneyInput:placeholder-shown {
    font-size: 1.6rem;
}

.label-required:before {
    content: "※";
    color: red;
    font-size: 1.2rem;
}

/* --- 日付選択 ---　*/
div.datepicker input~i.input-prefix {
    cursor: pointer;
    pointer-events: all;
}

.picker .picker__frame {
    width: 35rem;
    max-width: 35rem;
}

.qbc-daterangepicker input~i.input-prefix {
    position: absolute;
    right: 1.5rem;
    cursor: pointer;
    pointer-events: all;
}

.daterangepicker .ranges li.active,
.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: #0091ea !important;
}

.daterangepicker td.in-range:not(.active) {
    background-color: #e1f3ff !important;
}

.daterangepicker.show-calendar {
    box-shadow: 0 0.46875rem 2.1875rem rgb(4 9 20 / 3%), 0 0.9375rem 1.40625rem rgb(4 9 20 / 3%), 0 0.25rem 0.53125rem rgb(4 9 20 / 5%), 0 0.125rem 0.1875rem rgb(4 9 20 / 3%);
}

.datepicker table tr td span.active.active{
	background-color: #0091ea;
    border-color: #0091ea;
}

@media (max-width: 767px) {
    .qbc-daterangepicker input~i.input-prefix {
        right: 1.2rem;
        bottom: 9px;
    }
}

@media screen and (max-width: 320px) {
    .picker .picker__frame {
        width: 30rem;
        max-width: 30rem;
    }
}

div.picker.datepicker .picker__box .picker__table {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
}

.picker__box .picker__table .picker__day--infocus {
    width: 36px;
    height: 36px;
    line-height: 1;
}

.picker__box .picker__table .picker__day--selected,
.picker__box .picker__table .picker__day--selected:hover,
.picker__box .picker__table .picker--focused {
    transform: none;
    -webkit-transform: none;
}

div.picker.datepicker .picker__box .picker__header.datepicker__box .picker__nav .picker__nav--prev {
    margin-right: 1rem;
}

div.picker.datepicker .picker__box .picker__header.datepicker__box .picker__select-year {
    border-radius: .4rem;
}

div.picker.datepicker .picker__box .picker__table .picker__year.picker__year--infocus {
    width: 90%;
    margin: auto;
}

div.picker.datepicker .picker__box div.picker__footer button {
    border-radius: 0.4rem;
    color: #2979ff;
    font-weight: 500;
    text-transform: uppercase;
    margin-top: 0;
}

/** --- phone-input-group --- **/
.input-group.phone-input-group .qbc-select {
    width: 250px !important;
}

.input-group.input-button-group .btn {
    margin: 0;
    min-width: 200px !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    /**background:linear-gradient(to bottom, #5197ff 0%,#0076c0 100%)!important;**/
}

.input-group.input-button-group button.btn-search {
    min-width: 100px !important;
}

.input-group.input-button-group .input-group-append button {
    border-top-right-radius: 0.4rem;
    border-bottom-right-radius: 0.4rem;
}

/** --- input-money-group --- **/
.input-group.input-money-group>input.form-control {
    height: 55px;
}

.input-group.input-money-group button.dropdown-toggle {
    min-width: 200px !important;
}

.input-group.button-group>.btn {
    border: 1px solid #ced4da;
    border-radius: .4rem;
    box-shadow: none;
}

.input-group.button-group>.btn:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group.select-button-group>.input-group-append>.btn,
.input-group.select-button-group>.input-group-prepend>.btn {
    color: #212121;
    font-size: 1.4rem;
    margin: 0;
    min-width: 200px;
    height: 55px;
    border: 1px solid #ced4da;
    box-shadow: none;
}

.input-group.select-button-group>.input-group-append>.btn {
    border-top-right-radius: 0.4rem;
    border-bottom-right-radius: 0.4rem;
}

.input-group.select-button-group>.input-group-prepend>.btn {
    border-top-left-radius: 0.4rem;
    border-bottom-left-radius: 0.4rem;
}

.input-group.select-button-group>.input-group-append>.btn:hover,
.input-group.select-button-group>.input-group-prepend>.btn:hover {
    background: #eaeaea;
}

.input-group.select-button-group>.input-group-append>.btn.btn-primary {
    border: 0;
}

.input-group.select-button-group .qbc-icons {
    font-size: 1.6rem;
}

/** --- continue input-group --- **/
.continue-input-group input[type='number'],
.continue-input-group input[type='password'] {
    min-height: 50px!important;
	height:50px!important;
    max-width: 65px;
    text-align: center !important;
    border-radius: 0.4rem !important;
    margin-right: 2rem;
    font-weight: 600;
    font-size: 1.8rem;
}

.continue-input-group>.form-control:last-child {
    margin-right: 0 !important;
}

.continue-input-group input[type='number']:focus,
.continue-input-group input[type='password']:focus {
    -webkit-box-shadow: 0 0 3px 0.1rem rgb(0 145 234 / 25%) !important;
    box-shadow: 0 0 3px 0.1rem rgb(0 158 255 / 25%) !important;
}

.continue-input-group .invalid-message{
	display:none!important;
}

@media (max-width: 767px) {
	.continue-input-group input[type='number'],
	.continue-input-group input[type='password'] {
		margin-right: 1rem;
	}
}


/** --- input-group --- **/

input.form-control.qbc-moneyInput {
    padding-top: .8rem;
}

.qbc-form.required.invalid {
    background: #ffeaec;
    border: 1px solid #dc3545;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
}

.form-control.valid {
    border-color: #28a745;
    padding-right: calc(1.5em + 1.2rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.3rem) center;
    background-size: calc(0.75em + 0.6rem) calc(0.75em + 0.6rem);
}

.form-control.invalid {
    border: 1px solid #dc3545 !important;
    padding-right: calc(1.5em + 1.2rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.3rem) center;
    background-size: calc(0.75em + 0.6rem) calc(0.75em + 0.6rem);
    z-index: 3;
}

textarea.form-control.invalid {
    padding-right: calc(1.5em + 1.2rem);
    background-position: top calc(0.375em + 0.3rem) right calc(0.375em + 0.3rem);
}

li.list-checkbox .form-check-input[type="checkbox"]+label {
    min-height: 2.5rem;
    height: unset;
}

.custom-control-input.invalid~.custom-control-label,
.form-check-input.invalid~.form-check-label,
.form-check-input.invalid~.form-check-label a {
    color: #dc3545 !important;
}

.custom-control-input.invalid+label:before,
.form-check-input[type="checkbox"].invalid+label:before,
.form-check-input[type="checkbox"].invalid+label:after {
    border-color: #dc3545 !important;
}

.custom-control-input.invalid~.custom-control-label,
.form-check-input.invalid~.form-check-label {
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
}

.form-control.qbc-select.invalid+.dropdown-toggle {
    border-color: #dc3545;
}

.form-check-input:invalid,
.form-control.qbc-select.invalid,
.form-control.password-input-with-eyes.invalid,
.form-control.picker__input.invalid {
    background-image: none;
    padding-right: 0;
}

.form-control.invalid~.invalid-message,
.form-control.valid~.valid-message {
    display: block;
}


.valid-message {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 5;
    display: none;
    max-width: 100%;
    padding: 0.2rem 0.6rem;
    margin-top: 0.1rem;
    font-size: 1.2rem;
    font-size: 80%;
    line-height: 1.5;
    color: #fff;
    background-color: #28a745;
    border-radius: 0.4rem;
}

.invalid-message {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 5;
    display: none;
    max-width: 100%;
    padding: 0.2rem 0.6rem;
    margin-top: 0.1rem;
    font-size: 1.2rem;
    font-size: 80%;
    line-height: 1.5;
    color: #fff;
    background-color: #dc3545;
    border-radius: 0.4rem;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
}

@media (max-width: 767px) {

    .input-group.phone-input-group .qbc-select {
        width: 150px !important;
    }

    .input-group.input-button-group .btn,
    .input-group.select-button-group>.input-group-append>.btn,
    .input-group.select-button-group>.input-group-prepend>.btn,
    .input-group.input-money-group button.dropdown-toggle {
        min-width: 150px !important;
    }

    .form-check {
        padding-left: 0;
    }
}

/* ---　Input　--- */

input.password-input-with-eyes {
    padding-right: 4.32rem;
}

input.password-input-with-eyes~.qbc-icons {
    position: absolute;
    right: 2rem;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
    font-size: 2rem;
    text-align: center;
    cursor: pointer;
}

input.password-input-with-eyes~.qbc-icons.qbc-visible {
    color: #0091ea;
}

input::-ms-reveal,
input::-ms-clear {
    display: none;
}

.strength-container {
    display: none;
}

.pwd-indicator {
    height: 7px;
    margin: 10px 0;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pwd-indicator span {
    position: relative;
    height: 100%;
    width: 100%;
    background: lightgrey;
    border-radius: 5px;
    margin-right: 3px;
}

.pwd-indicator span:last-child {
    margin: 0;
}

.pwd-indicator span.weak:before,
.pwd-indicator span.medium:before,
.pwd-indicator span.strong:before,
.pwd-indicator span.excellent:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    border-radius: 5px;
}

.pwd-indicator span.weak:before {
    background-color: #ff4757;
}

.pwd-indicator span.medium:before {
    background-color: orange;
}

.pwd-indicator span.strong:before {
    background-color: #23ad5c;
}

.pwd-indicator span.excellent:before {
    background-color: #23ad5c;
}

.strength-container .strength-text {
    font-size: 14px;
    font-weight: 500;
    text-align: right;
}

.strength-container .strength-text .strength {
    padding-left: .3em;
}

.strength-container .strength-text .strength.weak {
    color: #ff4757;
}

.strength-container .strength-text .strength.medium {
    color: orange;
}

.strength-container .strength-text .strength.strong {
    color: #23ad5c;
}

.strength-container .strength-text .strength.excellent {
    color: #23ad5c;
}

/* ---　Input　--- */

/* ---　Select　--- */
.qbc-select .btn.dropdown-toggle {
    font-size: 1.4rem;
    min-height: 55px;
    padding: 1rem;
    padding-top: 1.1rem;
    margin: 0;
    border-radius: .4rem;
    border: 1px solid #ced4da;
    outline: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.qbc-select.invalid~.btn.dropdown-toggle {
    border: 1px solid #dc3545;
}

.md-form .qbc-select .btn.dropdown-toggle {
    border: 0;
    border-bottom: 1px solid #ced4da;
    border-radius: 0;
    background: #fff !important;
    padding-left: 0;
}

.qbc-form .qbc-select img.flag-thumbnail {
    width: 3.2rem;
}

.qbc-select.pure+.btn.dropdown-toggle {
    border: 0;
    background: #fff !important;
    border-bottom: 1px solid #ced4da !important;
    border-radius: 0 !important;
}

.qbc-select.small+.btn.dropdown-toggle {
    min-height: 40px !important;
}

/* ---　Select　--- */

/* ---　Button　--- */
#floatButtonSection .fixed-action-btn {
    right: 150px;
    overflow:unset;
}

#floatButtonSection .fixed-action-btn.qbc-float-comment{
	width:180px;
	-webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

#floatButtonSection .qbc-float-comment .btn-floating.btn-lg {
    width:80px;
    height:80px;
}

.fixed-action-btn.qbc-float-comment.active{
	height:110px;
}

.qbc-float-comment .btn-floating.btn-lg i{
	font-size: 3.4rem;
	line-height:80px;
}

.qbc-float-comment .btn-floating.btn-lg ~.tooltip.bs-tooltip-top{
	top:-30px!important;
	left:auto!important;
}

.fixed-action-btn.qbc-float-btn ul {
    bottom: 0;
    margin-bottom: 0;
}

.fixed-action-btn.qbc-float-btn ul li {
    margin-bottom: 0;
}

.btn-outline-blue.light{
	border-width: 1px!important;
}

.btn-outline-blue.border-light{
  border:2px solid #2196f3b0!important;
}

.btn-outline-blue:not([disabled]):not(.disabled):hover,
.btn-outline-blue:not([disabled]):not(.disabled):focus,
.btn-outline-blue:not([disabled]):not(.disabled):active,
.btn-outline-blue:not([disabled]):not(.disabled).active{
	background-color: #0091ea !important;
	color: #fff!important;
	opacity:100%!important;
}

.btn-outline-blue:not([disabled]):not(.disabled):hover i,
.btn-outline-blue:not([disabled]):not(.disabled):focus i,
.btn-outline-blue:not([disabled]):not(.disabled):active i,
.btn-outline-blue:not([disabled]):not(.disabled).active i ,
.btn-outline-blue:not([disabled]):not(.disabled):hover i.i-light,
.btn-outline-blue:not([disabled]):not(.disabled):focus i.i-light,
.btn-outline-blue:not([disabled]):not(.disabled):active i.i-light,
.btn-outline-blue:not([disabled]):not(.disabled).active i.i-light{
    color: #fff!important;
}

.btn-outline-blue:not([disabled]):not(.disabled) i.i-light{
    color: #0091ea21!important;
}

.btn-outline-black.white,
.btn-outline-blue.white {
    background: #fff;
}

.btn-outline-white.dark {
    background: #00000080 !important;
}

.btn-outline-white.blue {
    background-color: #0091ea !important;
}

.btn-outline-white.blue:hover,
.btn-outline-white.blue:focus,
.btn-outline-white.blue:active,
.btn-outline-white.blue:active:focus,
.btn-outline-white.blue.active {
    background-color: #1565c0 !important;
}

.btn-link.blue-lighten-5 {
	background-color: #e3f2fd !important;
}

.btn-link.blue-lighten-5:hover, .btn-link.blue-lighten-5:focus, .btn-link.blue-lighten-5:active {
	background-color: #bce3ff !important;
	text-decoration:none;
}

@media (max-width: 992px) {
    #floatButtonSection .fixed-action-btn {
        right: 0;
        bottom: 35px;
    }
    
    #floatButtonSection .fixed-action-btn.qbc-float-comment{
		width:120px;
	}

    #floatButtonSection .qbc-float-comment .btn-floating.btn-lg {
	    width:60px;
	    height:60px;
	}
	
	.fixed-action-btn.qbc-float-comment.active{
		height:110px;
	}
	
	.qbc-float-comment .btn-floating.btn-lg ~.tooltip.bs-tooltip-top {
		font-size:1.4rem;
		top: -15px!important;
	}

	.qbc-float-comment .btn-floating.btn-lg i{
		font-size: 3rem;
		line-height:60px;
	}
	
}

/* ---　Button　--- */

/** -------------- / Form --------------  **/

/** --------------  Table --------------  **/

.table-rounded {
	border:1px solid #efefef;
	border-radius: .5rem;
}

.table-rounded table tr td{
	border-radius: .5rem;
}

.table.align-middle tr td,
.table.align-middle tr th {
    vertical-align: middle;
}

.table-bordered th,
.table-bordered td {
    border: 1px solid #dee2e6 !important;
}

table .th-sm{
	min-width: 6rem;
}

.table-borderless th,
.table-borderless td,
.table-borderless thead th,
.table-borderless tbody+tbody {
    border: 0 !important;
}

.table-bordered thead.bold th {
    font-weight: 600;
}

table.table-transaction {
    vertical-align: middle !important;
    margin-bottom: 0;
}

table.table-transaction th,
table.table-transaction td {
    vertical-align: middle;
    padding-top: 1rem;
    padding-bottom: 1rem;
    border: 1px solid #efefef;
}

table.table-transaction th:first-of-type,
table.table-transaction td:first-of-type {
    border-left: 0;
    width: 33%;
    background: #00000008;
}

table.table-transaction.bg-white th:first-of-type,
table.table-transaction.bg-white td:first-of-type {
    background: #fff;
}

table.table-transaction th:last-of-type,
table.table-transaction td:last-of-type {
    border-right: 0
}

table.table-transaction tr:first-of-type th,
table.table-transaction tr:first-of-type td {
    border-top: 0;
}

table.table-transaction tr:last-of-type th,
table.table-transaction tr:last-of-type td {
    border-bottom: 0;
}

table.table-transaction tr.coupon .badge {
    font-size: 1.2rem;
}

table.table-transaction tr.total td {
    font-weight: 600;
}

table.table-transaction tr.total td:first-of-type {
    border-bottom-left-radius: .4rem;
}

table.table-transaction tr.total td:last-of-type {
    font-size: 1.8rem;
    border-bottom-right-radius: .4rem;
}

table.table-transaction.fz14 tr.total td:last-of-type {
    font-size: 1.6rem;
    border-bottom-right-radius: .4rem;
}

.total-amount {
    font-weight: 600;
    font-size: 1.8rem;
    color: red;
}

table.table-transaction.custom tr {
    height: 55px;
}

table.table-history tbody tr {
    cursor: pointer;
}

table.table-history.pointer-disabled tbody tr {
    cursor: default;
}

table.table-history td {
    padding: 1.5rem 0;
}

table.table-history td.select-icon {
    width: 6%;
}

table.table-history td>img {
    margin: auto;
}

table.table-history td>img.icon {
    margin: auto;
}

table.table-history td>img.portrait {
    margin: auto;
}

table.table-history td>.qbc-icons {
    font-size: 1.6rem;
}

table.table-history td>.status {
    color: #fb3;
}

table.table-history td>.amount {
    font-size: .9em;
}

.table.fee-table tr th {
    font-weight: 700 !important;
}

.table.fee-table tr th,
.table.fee-table tr td {
    vertical-align: middle;
    white-space: normal;
    min-width: 12rem;
}

.table-card>.table-row {
    border-bottom: 1px solid white;
}

img.transType-icon {
    width: 2.8rem;
}

.table.table-remittance tr td:first-child {
    background-color: #fafafa;
    border-right: 1px solid #dee2e6;
}

.table.table-remittance thead th {
    border-top: 1px solid #eaeef3 !important;
    border-bottom: 1px solid #eaeef3 !important;
}

.table.table-bordered.bordered-bold th,
.table.table-bordered.bordered-bold td {
    border: 1px solid #cfd2d6 !important;
}

.th-w10 {
    width: 10rem;
}

.th-w15 {
    width: 15rem;
}

.th-w20 {
    width: 20rem;
}

table tbody td.select-cbx{
	position: relative;
}

table tbody td.select-cbx:before, 
table tbody td.select-cbx:after{
	display: block;
    position: absolute;
    left: 50%;
    margin-top: 0;
    width: 16px;
    height: 16px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    box-sizing: border-box;
}

table tbody td.select-cbx:before {
	content: " ";
    margin-left: -6px;
    border: 1px solid black;
    border-radius: 3px;
}

table tr.selected td.select-cbx:before,
table tr.selected th.select-cbx:before{
	border: 1px solid white;
}

table.dataTable tr.selected td.select-cbx:after,
table.dataTable tr.selected th.select-cbx:after{
	content: "✓";
    font-size: 20px;
    margin-top: -8px;
    margin-left: -6px;
    text-align: center;
    text-shadow: 1px 1px #b0bed9, -1px -1px #b0bed9, 1px -1px #b0bed9, -1px 1px #b0bed9;
}

table th.country{
	width:10rem!important;
}

table th.beneficary{
	width:15rem!important;
}

table th.state{
	width:8rem!important;
}

table th.fee{
	width:10rem!important;
}

/** table size**/
table.table-xs th,
table.table-xs td {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

table.dataTable {
    width: 100% !important;
    margin: 1rem auto!important;
    clear: both;
    border-collapse: separate;
    border-spacing: 0
}

.table.bt-0 tr:first-of-type td {
    border-top:0;
}

table.data-table tr td{
    vertical-align: middle;
    padding:.5rem;
}

table.checkbox-table{
	margin-bottom:0;
}

table.table-fixed{
	table-layout: fixed;
}

.checkbox-table tr{
	cursor:pointer;
}

table.data-table tbody>tr{
	height:50px;
}

.checkbox-table.data-table tbody>tr{
	height:40px;
}

.data-table tbody>tr:hover{
	background:#e8edff!important;
}

table.checkbox-table>tbody>tr.selected>*{
	box-shadow: inset 0 0 0 9999px #8e98be !important;
	color: white;
}

table.checkbox-table>tbody>tr.selected .btn{
	color:#fff!important;
	border-color:#fff!important;
}

table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting_asc_disabled, table.dataTable thead>tr>th.sorting_desc_disabled, table.dataTable thead>tr>td.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting_asc_disabled, table.dataTable thead>tr>td.sorting_desc_disabled{
	padding: 10px;
}
table.dataTable thead>tr>th.sorting:before, table.dataTable thead>tr>th.sorting:after, table.dataTable thead>tr>th.sorting_asc:before, table.dataTable thead>tr>th.sorting_asc:after, table.dataTable thead>tr>th.sorting_desc:before, table.dataTable thead>tr>th.sorting_desc:after, table.dataTable thead>tr>th.sorting_asc_disabled:before, table.dataTable thead>tr>th.sorting_asc_disabled:after, table.dataTable thead>tr>th.sorting_desc_disabled:before, table.dataTable thead>tr>th.sorting_desc_disabled:after, table.dataTable thead>tr>td.sorting:before, table.dataTable thead>tr>td.sorting:after, table.dataTable thead>tr>td.sorting_asc:before, table.dataTable thead>tr>td.sorting_asc:after, table.dataTable thead>tr>td.sorting_desc:before, table.dataTable thead>tr>td.sorting_desc:after, table.dataTable thead>tr>td.sorting_asc_disabled:before, table.dataTable thead>tr>td.sorting_asc_disabled:after, table.dataTable thead>tr>td.sorting_desc_disabled:before, table.dataTable thead>tr>td.sorting_desc_disabled:after{
	right: 0;
}

table.dataTable thead>tr>th.select-checkbox.sorting_asc:before,
table.dataTable thead>tr>th.select-checkbox.sorting_asc:after {
	content:none;
}

div.dataTables_wrapper div.dataTables_paginate{
	margin-top:.8rem;
}

div.dataTables_wrapper div.dataTables_filter{
	text-align: right!important;
}

div.table-responsive>div.dataTables_wrapper>div.row{
	overflow-x: hidden;
}

table.dataTable tbody td.select-checkbox:before, table.dataTable tbody td.select-checkbox:after, table.dataTable tbody th.select-checkbox:before, table.dataTable tbody th.select-checkbox:after{
	margin-top:0;
	width: 16px;
    height: 16px;
	top: 50%;
	transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selected th.select-checkbox:after{
	margin-top: -8px;
}

.calendar-table{
  table-layout:fixed;
}

.calendar-table tbody tr td:not(.null):hover,
.calendar-table tbody tr td.selected:not(.null){
  background-color:#0091ea;
  cursor:pointer;
  color:#fff;
}

.calendar-table tbody tr td.null{
  cursor:default;
}

table.calendar-table th,
table.calendar-table td {
  padding: .4rem .2rem;
  }
  
.calendar-table tr td,
.calendar-table tr th{
  width:14.285714%!important;
  height:56px
}

.calendar-table .text-value{
  font-size:14px;
  font-weight:500;
}

.table.table-history #rewardContainer td:first-of-type{
    width:6rem;  
}

.ctrl-btn:hover,
.ctrl-btn:focus,
.ctrl-btn:active{
   border: 1px solid #dee2e6 !important;
   background-color:#f0f8ff;
}

.ctrl-btn.disabled {
  color: #c8cdd2!important;
}

@media (max-width: 767px) {
    table.table-transaction.custom tr {
        height: 80px;
    }


    table.table-history td:first-of-type {
        padding-left: .5rem;
        padding-right: .5rem;
    }

    img.transType-icon {
        width: 2.5rem;
    }

    .th-sm-w9 {
        width: 9rem !important;
    }
    
    .calendar-table .text-value{
      font-size:10px;
      letter-spacing:-0.2px;
    }
    
}

@media (max-width: 1024px) {

    table.table-transaction th:first-of-type,
    table.table-transaction td:first-of-type {
        width: 45%;
    }
}

/** -------------- / Table --------------  **/

/** -------------- Text --------------  **/
.text-divider {
    position: relative;
}

.text-divider .divider {
    flex: 1;
    border-bottom: 1px solid #dadada;
}

.text-divider .text {
    font-size: 1.4rem;
    color: #4f4f4f !important;
    text-align: center;
    margin-left: 2rem;
    margin-right: 2rem;
}

.qbc-divider-50 {
    margin: .5rem 0;
    width: 50%;
    border-top: 1px solid;
}

hr.blue,
.qbc-divider-50.blue {
    border-top: 2px solid #0091ea;
}

hr.warning,
.qbc-divider-50.warning {
    border-top: 2px solid #ffeeba;
}

hr.bg-black-linear {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}

hr.bg-brown-linear {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #795548, rgba(0, 0, 0, 0));
}

.text-off {
    color: red;
    font-size: 1.25rem;
    margin-right: .3rem;
}

.text-history {
    display: inline;
    color: #808080;
    margin-right: .3rem;
    text-decoration: line-through;
}

.text-error {
    color: red;
    font-weight: 400;
}

.pure-title {
    position: relative;
    padding-left: 1.2rem;
}

.pure-title:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 1px;
    width: 4px;
    height: 100%;
    background: #0091ea;
    border-radius: 3px;
}

/** -------------- / Text --------------  **/

/** -------------- Button --------------  **/
.btn-flex-wrap {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.btn-flex-wrap.hidden {
    display: none;
}

.btn-flex-wrap .btn {
    position: relative;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 350px;
    min-width: 140px;
    max-width: 100%;
    font-weight: 500;
    border-radius: .6rem;
}

.btn-flex-wrap .btn.rounded-10em {
	border-radius: 10em;
}

.btn-flex-wrap .btn.rounded-1 {
    border-radius: 1rem;
}

.btn-flex-wrap .btn.disabled,
.btn:disabled {
    background: #919191 !important;
}

.btn-flex-wrap .btn[class*="btn-outline-"].disabled,
.btn[class*="btn-outline-"]:disabled {
    background: #919191 !important;
    color: #fff !important;
    border-color: #fff !important;
}

.btn.btn-sub {
    color: #fff;
    background-color: #6C63FF !important;
}

.btn.btn-outline-sub {
    color: #6C63FF;
    border: 2px solid #6C63FF;
    background-color: #fff !important;
}

.btn.btn-outline-sub:hover,
.btn.btn-outline-sub:active,
.btn.btn-outline-sub:focus {
    background-color: transparent !important;
}

.btn-flex-wrap .btn.btn-login,
.btn-flex-wrap .btn.btn-register {
    color: #fff;
    max-width: 100%;
    margin-left: 2rem;
    margin-right: 2rem;
}

.btn-flex-wrap .btn.btn-login>.qbc-icons,
.btn-flex-wrap .btn.btn-register>.qbc-icons {
    font-size: 2.4rem;
}

.btn.btn-top {
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    font-size: 2rem;
    font-weight: 600;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    margin-left: 0;
    margin-right: 0;
    height: 70px;
    width: 415px;
    border-radius: 10px !important;
    max-width: 100%;
}

.btn.btn-top.blue-outline {
    background: #fff;
    color: #0091ea !important;
    border: 3px solid #0091ea !important;
}

.btn.btn-top,
.btn.btn-top>span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn.btn-outline-gray.light {
    border: 1px solid #e1e1e1 !important;
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
}

.btn {
    line-height: normal !important;
    text-transform: none;
}

.btn.btn-block {
    border-radius: .4rem;
}

.btn.btn-qbc {
    position: relative;
}

.btn.btn-qbc.head {
    padding: .8rem 2.8rem;
    font-size: 1.6rem;
}

.btn.btn-qbc.main {
    min-width: 350px;
}

.btn.btn-qbc.action {
    height: 55px;
}

.btn.btn-outline-qbc {
    padding: .5rem 1.5rem;
    border-width: 1px !important;
}

.btn.btn-outline-qbc:hover {
    color: #fff !important;
    background: #0091ea;
    background: -webkit-linear-gradient(right, #00b9ff 0, #0079c3 100%) !important;
    background: -moz-linear-gradient(top, #00b9ff 0, #0079c3 100%) !important;
    background: linear-gradient(to right, #00b9ff 0, #0079c3 100%) !important;
    background: linear-gradient(40deg, #00b9ff, #0079c3) !important;
    border-color: transparent !important;
}

.btn.btn-sm.btn-outline-qbc {
    padding: 0.5rem 1.5rem;
    font-size: 1.2rem;
    line-height: 1.2;
}

.btn.btn-outline-qbc.btn-coupon:hover {
    background: #fff !important;
    color: #ffc107 !important;
    border-color: transparent !important;
}

.selected .btn.btn-outline-qbc.btn-coupon:hover {
    color: #0091ea !important;
}

.btn-outline-gray {
    color: #858585 !important;
    background-color: transparent !important;
    border: 1px solid #bfbfbf !important;
}

.btn.btn-coupon-select {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    width: 100%;
    min-height: 40px;
    font-size: 1.4rem;
    padding: .8rem 1rem;
    margin: 0;
    border: 0;
    border-radius: 0.5rem;
    background: #ffe1a4;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.btn.btn-coupon-select.selected {
    color: #fff;
    background: #0091ea !important;
}

.btn.btn-coupon-select .qbc-arrow-down {
    text-shadow: 0 0 #000000;
}

.btn.btn-total {
    display: block;
    width: 100%;
    font-size: 1.6rem;
    margin: 3rem 0;
    margin-bottom: 1rem;
}

button.btn-link.a-button,
a.btn-link {
    color: #0091ea !important;
    padding: 0.8rem 1rem
}

button.btn-link.a-button:hover,
a.btn-link:hover {
    text-decoration: underline !important;
    background-color: rgba(18, 102, 241, .05) !important;
    outline: none;
}

button.btn-link.a-button:disabled, button.btn-link.disabled.a-button {
    color: #6c757d !important;
    pointer-events: none !important;
    background: #e7e7e7 !important;
}

a.btn-link.bg-none:hover {
    background-color: none !important;
}

.position-icon {
    position: absolute;
    font-size: 2rem;
    margin: 0;
    right: 2rem;
    top: 50%;
    transform: translateY(-50%);
}

.position-icon.fz-init {
	font-size: initial;
}

.position-icon.top {
    top: 1rem;
    transform: none;
}

.position-icon.right {
    right: 2rem;
    left: auto;
}

.position-icon.left {
    left: 2rem;
    right: auto;
}

input.invalid~.position-icon {
    display: none;
}

input:not(:disabled):hover~.position-icon.right.animated,
.btn:not(:disabled):hover .position-icon.right.animated {
    right: calc(2rem - 5px);
}

input:not(:disabled):hover~.position-icon.left.animated,
.btn:not(:disabled):hover .position-icon.left.animated {
    left: calc(2rem - 5px);
}

@media (max-width: 767px) {
    .btn.btn-qbc.head {
        font-size: 1.4rem;
        padding: .5rem 1.5rem;
        margin-top: .2rem;
        margin-bottom: .2rem;
    }

    .btn.btn-qbc.main {
        min-width: 333px;
    }

    .btn.btn-coupon-select>div.coupon-icon-wrap {
        padding: 1rem .5rem;
    }

    .btn.btn-coupon-select .qbc-arrow-down {
        padding-right: .8rem;
    }
}

/** -------------- / Button --------------  **/

/** -------------- Badge --------------  **/
.badge-notification {
    position: absolute;
    font-size: .96rem;
    margin-top: -.5rem;
    margin-left: -.8rem;
    padding: .52em .72em;
}

.badge-dotto {
    position: absolute;
    right: 1rem;
    top: 1rem;
    padding: 5px;
}

.badge-dotto:empty {
    display: block;
}

.qbc-cart+.badge-notification {
    margin-left: -1.5rem;
}

.badge.badge-qbc {
	padding: 0.4em 0.8em;
	font-weight: 400;
}

.badge-lighten-dark {
	color: #fff !important;
    background-color: #5b5b5b !important;
}

.badge-outline-primary {
    color: #0091ea !important;
    background-color: #fff !important;
    border: 1px solid #0091ea;
    box-shadow: none;
    -webkit-box-shadow: none;
    border-radius: 0.5rem;
    font-weight: 500;
}

.badge-outline-gray {
    color: #4b4b4b !important;
    background-color: #fff !important;
    border: 1px solid #8c8c8c;
    box-shadow: none;
    -webkit-box-shadow: none;
    border-radius: 0.5rem;
    font-weight: 500;
}

.badge.badge-pure {
    padding: .5rem;
    border-radius: .4rem;
    box-shadow: none;
}

.badge.badge-light {
    color: #464646 !important;
    font-weight: 500 !important;
}

.badge.badge-status {
    font-weight: 400;
    min-width: 62px;
    line-height: 1;
    padding: 0.5em 0.7em;
    border-radius: 0.4rem;
}

/** -------------- / Badge --------------  **/

/** -------------- Menu --------------  **/
.navgar .navbar-nav {
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.navbar-menu .navbar-item {
    position: relative;
    margin: 5px 0;
}

.navbar-menu .navbar-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    vertical-align: bottom;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    font-size: .89rem;
    padding: 1rem 1.5rem;
    height: 3rem;
    color: unset;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-radius: 5px;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
}

.navbar-menu .navbar-link.right-arrow::after {
    font-family: "qbc-icons";
    content: "\e959";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    -webkit-transition: -webkit-transform .2s ease-in-out;
    transition: -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.navbar-menu .navbar-link.right-arrow:not(.collapsed):after {
    font-family: "qbc-icons";
    content: "\e957";
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.navbar-menu a {
    color: #4B5563;
}

.navbar-link:active,
.navbar-link:focus,
.navbar-link:hover {
    color: #1266f1;
    background-color: rgba(18, 102, 241, .05);
    outline: none;
}

.navbar-link .qbc-icons {
    color: #9FA6B2;
}

.dropdown-menu {
    border: 0;
    box-shadow: 0 3px 8px rgb(0 0 0 / 25%);
    -webkit-box-shadow: 0 3px 8px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0 3px 8px rgb(0 0 0 / 25%);
}

.dropdown-toggle.lang-switch-menu {
    cursor: pointer;
}

.dropdown-toggle::after {
    content: none;
}

.dropdown-toggle.lang-switch-menu+.dropdown-menu,
.dropdown-toggle.top-bar-menu+.dropdown-menu {
    top: 60px;
    right: 0;
    left: auto;
}

.dropdown-toggle.lang-switch-menu .lang-text,
.dropdown-toggle.lang-switch-menu+.dropdown-menu .lang-text {
    vertical-align: middle;
    padding: 0 .5rem;
}

.dropdown-toggle.lang-switch-menu .lang-icon,
.dropdown-toggle.lang-switch-menu+.dropdown-menu .lang-icon {
    width: 28px;
    vertical-align: middle;
    border-radius: .2rem;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px #c5c5c5;
    -moz-box-shadow: 1px 1px 3px #c5c5c5;
    box-shadow: 1px 1px 3px #c5c5c5;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.side-nav-pl {
    padding-left: 320px;
}

.side-nav2.qbc-side-nav {
    width: 320px;
    background-color: #fff;
    color: #212529 !important;
    /*box-shadow:none!important;
    -webkit-box-shadow:none!important;
    border-right: 1px solid #eaeaea;*/
    -webkit-box-shadow: 1px 0px 3px 0 rgb(0 0 0 / 5%), 1px 0px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 1px 0px 3px 0 rgb(0 0 0 / 5%), 1px 0px 3px 0px rgb(0 0 0 / 5%);
}

.qbc-side-nav .fix-brand {
    padding: 0.4rem 1.4rem;
}

.qbc-side-nav li.header {
    width: 100%;
    padding: 1.4rem 1.6rem;
    min-height: 80px;
    background-image: url('/img/common/payforex-mv-bg-6203887449b0e1ecd4045ce952e4c098.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.qbc-side-nav li.header.corp {
	background-position: center;
    background-image: url('/img/common/pfx-top-bg02-d55f27e3a64da0b9fc5c99df89a524ff.jpg');
}

.qbc-side-nav li.header.corp2 {
    background-image: url('/img/common/pfx-top-bg03-56594c875f107739b57532a4489cfe39.jpg');
}

.qbc-side-nav li.header.corp3 {
    background-image: url('/img/common/pfx-top-bg05-e84992c351c50f702c3d661b10211243.jpg');
}

.qbc-side-nav li.header.corp4 {
    background-image: url('/img/common/pfx-top-bg06-b21c007c0ff682dbcea732d3ca4f6ed8.jpg');
}

.qbc-side-nav.side li.header {
    min-height: 90px;
}

.qbc-side-nav .close {
    width: 3rem;
    height: 3rem;
}

.nav-list,
.side-nav2 .nav-list {
    list-style: none;
    padding: 1.5rem;
    font-size: 1.6rem;
}

.side-nav2 .collapsible>li.active div.collapsible-body {
    opacity: 0.85;
    box-shadow: rgba(0, 0, 0, 0.12) 5px 1px 8px 0px inset !important;
}

.side-nav2 .collapsible a {
    font-size: 1.6rem;
}

.side-nav2 .collapsible>li a.collapsible-header.active {
    background-color: rgba(18, 102, 241, .05) !important;
    font-weight: 500;
}

.side-nav2 .collapsible ul.inner-list>li a.collapsible-header.active {
    color: #0091ea;
    font-weight: 400;
    background-color: rgb(94 140 216 / 5%) !important;
}

.side-nav2 .collapsible>li a.collapsible-header.active .menu-icons.qbc-icons,
.side-nav2 .collapsible ul.inner-list>li a.collapsible-header.active .menu-icons.qbc-icons {
    font-weight: 500;
}

.nav-list li>a.nav-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    padding: 1.4rem;
    height: auto;
    color: unset;
    border-radius: 5px;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
}

.nav-list .qbc-icons {
    font-size: 1.6rem;
}

.nav-list .menu-icons.qbc-icons {
    font-size: 2.4rem;
    margin-right: 1rem;
}

.nav-list.collapsible>li,
.nav-list .collapsible-body li {
    border-radius: 0 !important;
    border-bottom: 1px solid #cadae866 !important;
}

.nav-list .collapsible-body li>.nav-link {
    font-size: 1.4rem;
    padding: 1.2rem 1.4rem;
    padding-left: 2.2rem;
}

.nav-list .collapsible-body li>.nav-link .menu-icons.qbc-icons {
    font-size: 2rem;
}

.nav-list ul>li:last-child {
    border-bottom: 0 !important;
}

.nav-list ul>li img {
    width: 30px;
    vertical-align: middle;
    border-radius: 3px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px #c5c5c5;
    -moz-box-shadow: 1px 1px 3px #c5c5c5;
    box-shadow: 1px 1px 3px #c5c5c5;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.nav-link:active,
.nav-link:focus,
.nav-link:hover {
    background-color: rgba(18, 102, 241, .05) !important;
    outline: none;
}

@media (max-width: 1366px) {

    .side-nav-pl {
        padding-left: 0;
    }

    .navbar.side-nav-pl .banner-inner>.navbar-brand,
    .navbar.side-nav-pl .banner-inner>.navbar-brand-text,
    .navbar .button-collapse-wrap {
        display: block !important;
    }
    
    .navbar.side-nav-pl .banner-inner>.navbar-brand-name {
		display: none;
	}
}

@media (max-width: 767px) {
    .qbc-side-nav li.header {
        min-height: 70px;
    }

    .qbc-side-nav.side li.header {
        min-height: 80px;
    }

    .navbar .banner-inner>.navbar-brand-text,
    .navbar.side-nav-pl .banner-inner>.navbar-brand-text {
        display: none !important;
    }

    .dropdown-toggle.lang-switch-menu+.dropdown-menu,
    .dropdown-toggle.top-bar-menu+.dropdown-menu {
        left: auto;
        right: 0;
    }
}

/** -------------- / Menu --------------  **/

/** -------------- Modal --------------  **/
.modal .modal-header {
    position: relative;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.modal .modal-pure .modal-header {
    border-bottom: 0;
    padding-bottom: 0;
}

.modal .close.abs-close,
.modal .modal-header .close {
    float: none;
    position: absolute;
    right: 1.5rem;
    top: 1.5rem;
    z-index: 1051;
}

.modal .close.abs-close.t2p5 {
	top: 2.5rem;
}

.modal .modal-header.p-0 .close {
    top: .8rem;
}

.modal .modal-body .close {
    display: block !important;
}

.modal .modal-content.sp-content {
    overflow: hidden;
    max-height: 80vh;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
}

.modal .modal-content,
.modal-dialog-scrollable .modal-content {
    max-height: 92vh;
    overflow: hidden;
}

.modal .modal-content .modal-body,
.modal .modal-content.sp-content .modal-body {
    overflow-y: auto;
}

.modal-fullscreen {
    width: 100vw;
    max-width: none;
    height: 100%;
    margin: 0;
}

.modal-fullscreen .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
}

.modal-fullscreen .modal-header {
    border-radius: 0;
}

.modal-fullscreen .modal-body {
    overflow-y: auto;
}

.modal-fullscreen .modal-footer {
    border-radius: 0;
}

.modal .modal-full-height {
    position: absolute;
    top: 0;
    right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 400px;
    height: auto;
    min-height: 100%;
    margin: 0;
}

.modal .modal-full-height .modal-content{
	max-height:100vh;
}

.modal .modal-dialog.modal-bottom {
    bottom: 0;
}

.modal .modal-full-height.modal-top,
.modal .modal-full-height.modal-bottom {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

.modal .modal-full-height.modal-bottom {
    top: auto;
    min-height: 0;
}

.modal-backdrop {
    width: 100%;
}

.modal-dialog-scrollable {
    max-height: calc(100% - 20rem);
}

@media (max-width: 767px) {
    .modal .modal-full-height.modal-bottom .pure-title {
        margin-left: 1.6rem;
        margin-right: 1.6rem;
    }

    .modal-dialog-scrollable {
        max-height: calc(100% - 10rem);
    }
}

/** -------------- / Modal --------------  **/

/** -------------- List --------------  **/

ul.list-group-light li {
    background: transparent;
    border: 0;
}

ul.list-style-disc {
    list-style: disc !important;
}

ul.list-style-inside {
    list-style: inside !important;
}

/** ul caption-calculator **/
.caption-calculator {
    position: relative;
}

.caption-calculator .calc-tree {
    width: 100%;
    position: relative;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.3rem;
    border-color: #c5c5c5;
}

.calc-tree>li {
    display: block;
    position: relative;
    border-color: #c5c5c5;
    padding-top: 10px;
}

.calc-tree>li:first-child {
    padding-top: 10px;
    margin-top: 0;
}

.calc-tree>li:before {
    content: "";
    display: block;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    z-index: 2;
    border: 5px solid;
    border-color: inherit;
    outline: 0;
    margin-left: -27px;
    margin-top: 3px;
}

.calc-tree>li:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 100%;
    left: -23px;
    top: 0;
    border: 0 solid;
    border-color: inherit;
    outline: 0;
    background-color: #c5c5c5;
    background-size: 200% 200%;
    background-position: 0 0;
}

.calc-tree li:last-child {
    padding-bottom: 5px !important;
    margin-bottom: 0;
}

.calc-tree>li:first-child:after {
    height: calc(100% - 8px);
    top: auto;
    bottom: 0;
}

.calc-tree>li:last-child:after {
    height: calc(100% - 7px);
}

.calc-tree li>.calc-item {
    display: inline-block;
}

.calc-tree li>.calc-item.item-left,
.calc-tree li>.calc-item.item-left.ja-jp,
.calc-tree li>.calc-item.item-left.bn-bd {
    width: 20%;
    color: #919191;
}

.calc-tree li>.calc-item.item-left.en-us,
.calc-tree li>.calc-item.item-left.fil-ph {
    width: 22%;
}

.calc-tree li>.calc-item.item-left.th-th,
.calc-tree li>.calc-item.item-left.vi-vn {
    width: 25%;
}

.calc-tree li>.calc-item.item-right {
    display: inline;
    position: absolute;
}

.calc-item.item-right .label-status {
    vertical-align: text-bottom;
    margin-left: 1em;
}

.caption-calculator-2 .caption-ul {
	padding-left: 1.6rem;
	margin-top:1rem;
	margin-bottom:1rem;
}

.caption-ul>li {
	position: relative;
	display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
	border-left:2px solid #c5c5c5;
	padding-top:.6rem;
	padding-bottom:.6rem;
}

.caption-ul>li:before {
	content: "";
    display: block;
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    z-index: 2;
    border: 5px solid;
    border-color: #c5c5c5;
    outline: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    margin-left: -6px;
}

.caption-ul>li .caption-content {
	display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    min-width:380px;
	margin:0;
	margin-left:2.4rem;
	font-size: 1.3rem;
	padding-left:0;
	padding-right: 1rem;
}

.caption-ul>li .caption-content.btn.btn-toggle {
	-webkit-box-pack: justify !important;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	padding-left:1rem;
	padding-top:.6rem;
	padding-bottom: .6rem;
	cursor: pointer;
	color: #FF5722;
	border: 1px solid #FF5722;
	border-radius: 0.5rem;
}

.caption-ul>li .caption-content.btn.btn-toggle.selected {
	background:#0091ea;
	border:1px solid #0091ea;
	color:#fff;
}

.caption-ul>li .caption-content.btn.btn-toggle.selected .item-left {
	color:#fff;
}

.caption-ul>li .caption-content .item-left {
	display: -webkit-box !important;
	display: -ms-flexbox !important;
	display: flex !important;
	-webkit-box-align: center !important;
	-ms-flex-align: center !important;
	align-items: center !important;
	text-align: left;
	min-width:100px;
	padding-right:10px;
	color: #919191;
}

.caption-ul>li .caption-content.btn.btn-toggle .item-left {
	color: #FF5722;
}

.caption-ul>li .caption-content.btn.btn-toggle .item-left {
	width:auto;
}

@media (max-width: 767px) {

    .caption-calculator .calc-tree {
        padding-left: 2rem;
    }

    .calc-tree>li:before {
        border: 6px solid;
        margin-left: -20px;
        color: #c5c5c5;
    }

    .calc-tree>li:after {
        left: -15px;
    }

    .calc-tree>li:last-child {
        padding-bottom: 10px !important;
    }

    .calc-tree>li:last-child:after {
        height: calc(100% - 8px);
    }

    .calc-tree li>.calc-item.item-left,
    .calc-tree li>.calc-item.item-left.ja-jp,
    .calc-tree li>.calc-item.item-left.bn-bd {
        width: 28%;
    }

    .calc-tree li>.calc-item.item-left.en-us,
    .calc-tree li>.calc-item.item-left.mn-mn,
    .calc-tree li>.calc-item.item-left.fil-ph {
        width: 22%;
    }

    .calc-tree li>.calc-item.item-left.th-th,
    .calc-tree li>.calc-item.item-left.vi-vn {
        width: 25%;
    }

    .calc-tree li>.calc-item.item-right {
        display: inline;
    }
    
    .caption-ul>li .caption-content { 
		margin-left: 1.6rem;
		width:320px;
		min-width:320px;
	}
}

/** ul caption-calculator **/

/* -----------------　/ List ----------------- */


/** -------------- Card --------------  **/
.card {
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
}

.card.shadow {
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%) !important;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%) !important;
}

.card.block-card {
    border: 1px solid #dee2e6;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.card.login-card {
	position:relative;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.card.tab-card {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.card.tab-card:before {
	content:'';
	position: absolute;
    top: -6px;
    width: 100%;
    height: 8px;
    background-color: #fff;
    z-index: 1;
}

.card.block-card>.pure-title {
    margin: 1.6rem;
}

.rd-biz-bg .card.login-card,
.rd-bg-pfx .card.login-card {
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.card.normal,
.card.rounded-3,
.top-view .card,
.service-section .card {
    -webkit-box-shadow: 0 2px 5px 0 rgb(4 4 4 / 10%), 0 2px 5px 0 rgb(4 4 4 / 10%);
    box-shadow: 0 2px 5px 0 rgb(4 4 4 / 10%), 0 2px 5px 0 rgb(4 4 4 / 10%);
}

.card.rounded-3 .card-img,
.card.rounded-3 .card-img-top {
    border-top-left-radius: 3rem;
    border-top-right-radius: 3rem;
}

.card-step-shape {
    position: absolute;
    top: -1px;
    left: 0;
    height: 5rem;
    width: 5rem;
    border-radius: 2.5rem 0 3rem 0;
    background-color: #65BCF2;
    color: #fff;
    font-weight: 700;
    font-size: 2.5rem;
    text-align: center;
}

.card-step-shape>span {
    border-bottom: 1px solid #fff;
    line-height: initial;
    font-size: 1.6rem;
}

.card.select-card {
    position: relative;
    border: 1px solid #dee2e6;
    cursor:pointer;
}

.card.select-card:before {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    color: #919191;
    font-size: 2.2rem;
    text-shadow: none;
}

.card.select-card.top-right:before {
    bottom: auto;
    right: 1rem;
    top: 1rem;
}

.card.select-card.selected {
    border: 2px solid #0091ea;
    color: #0091ea;
}

.card.select-card.lt-select {
	border:2px solid #dee2e6;
}

.card.select-card.lt-select.selected {
    border: 2px solid #0091ea;
    color:initial;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12) !important;
}

.card.select-card.lt-select:before {
	content: "";
	font-size: 3rem;
	top: 1.5rem;
	left: 1.5rem;
}

.card.select-card.lt-select.selected:before {
	content: "\e93a";
}

.card.select-card.selected:before {
    color: #0091ea;
}

.notice-card {
    padding: 1rem .5rem;
}

.notice-card .notice-title {
    margin-bottom: 1.2rem;
}

.alert-warning .notice-card .alert-title,
.alert-warning .notice-card .alert-title:before {
    color: #f55a00;
}

.notice-card .notice-content {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    min-height: 50px;
}

.notice-card .notice-content li>a{
	text-decoration: underline;
}

.notice-card .action-wrap {
    min-width: 150px;
    margin-top: .8rem;
}

.notice-card .notice-content .action-wrap {
    text-align: right;
    margin-left: 1.6rem;
    margin-top: 0;
}

.notice-card .action-wrap .btn {
    margin: 0;
}

.notice-card .notice-content .action-wrap .btn {
    width: 100%;
}

.notice-card .action-btn {
    width: 1
}

.card.message-card {
    border: 1px solid #dee2e6 !important;
}

.message-truncate {
    width: 100%;
    max-height: 6rem;
    -webkit-box-orient: vertical;
    display: block;
    display: -webkit-box;
    overflow: hidden !important;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}

.login-card .card-up {
    color: #fff;
    height: 120px;
    overflow: hidden;
    border-top-left-radius: 0.4rem;
}

.sns-wrap .btn-sns,
.card .btn-sns {
    min-width: 90px;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0.8rem 2rem;
}

.sns-wrap .btn-sns img,
.card .btn-sns img {
    height: 24px;
    display: inline-block;
}

.sns-wrap img.app,
.card img.app {
    width: 145px;
    border-radius: 0.8rem;
}

.mask.logout-mask {
    cursor: pointer;
}

.mask.logout-mask:hover {
    background-color: rgb(177 126 126 / 73%);
}

.mask.logout-mask:after {
    position: abosulte;
    font-family: "qbc-icons";
    content: "\e959";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    -webkit-transition: -webkit-transform .2s ease-in-out;
    transition: -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.card.card-cascade .view.view-cascade.gradient-card-header {
    position: relative;
    padding: 2rem 0.5rem;
    -webkit-box-shadow: 0px 1px 10px 0 rgb(0 0 0 / 18%), 0 2px 10px 0 rgb(0 0 0 / 15%);
    box-shadow: 0px 1px 10px 0 rgb(0 0 0 / 18%), 0 2px 10px 0 rgb(0 0 0 / 15%);
}

.card.card-cascade .view.view-cascade.cascade-header {
    position: relative;
    padding: 2rem 0.5rem;
    color: #212121;
    text-align: center;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.card.card-cascade .view.view-cascade.cascade-header.bg-primary {
    color: #fff;
}

.card.card-cascade.narrower .view.view-cascade {
    margin-top: -3rem;
}

.card.card-cascade.qbc-title-card .view.view-cascade.gradient-card-header {
    padding: 1.5rem;
}

.card .view.view-cascade.gradient-card-header.flat-header {
    color: #212529;
    border: 1px solid #dee2e6;
    border-bottom: 0;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.card.narrower .view.view-cascade.gradient-card-header.flat-header,
.card.wider .view.view-cascade.gradient-card-header.flat-header {
    border-radius: .4rem !important;
}

.card .view.view-cascade.gradient-card-header .left-top-title {
    position: absolute;
    left: 3%;
    top: 10%;
}

.card.total-card .card-body,
.card.transaction-card .card-body {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.card .card-body.qbc-card-body {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.card.flat-card,
.card.pure-card {
    width: 100%;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.card.flat-card>pure-title,
.card.pure-card>pure-title {
    margin-left: 1.6rem !important;
    margin-top: 1.6rem !important;
    margin-bottom: 1.6rem !important;
}

.card.flat-card .flat-header~.card-body {
    border: 1px solid #dee2e6;
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.card.flat-card .card-body {
    border: 1px solid #dee2e6;
    border-radius: .4rem;
}

.card.result-card.bee-card .card-icon {
    position: absolute;
    top: -3rem;
    left: 3rem;
}

.card.result-card.bee-card .card-icon.modal-icon {
    top: 1.2rem;
    left: 3rem;
}

.card.bee-card .card-header,
.card.result-card.bee-card .view.view-cascade.gradient-card-header {
    background: url('/img/common/bee-bg-0dbbe606f4ac1d92b383f23c2ae180d8.png');
    background-repeat: no-repeat;
    background-position: right bottom 100%;
    overflow: initial;
}

.card.bee-card.primary .view.view-cascade.card-header,
.card.result-card.primary .view.view-cascade.gradient-card-header {
    background-color: #0091ea !important;
    color: #fff;
}

.card.result-card .view.view-cascade.gradient-card-header .text-fail {
    /*  background-color: #848484!important;	
    background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)) !important;*/
    color: #795548;
}

.card.bee-card .card-header-result-title{
	font-size: 1.8rem;
	font-weight: 500;
	margin-top:1.8rem;
	margin-bottom:1.8rem;
}

.card.bee-card .card-header-result-title.done,
.card.bee-card .card-body.content-section,
.card.bee-card.done .card-header-result-title.loading,
.card.bee-card.done .card-body.content-section .error-wrap,
.card.bee-card.done .card-header .loading-section,
.card.bee-card.error .card-header .loading-section {
	display:none;
}

.card.bee-card .card-header-result-title.loading,
.card.bee-card.done .card-header-result-title.done,
.card.bee-card.done .card-body.content-section,
.card.bee-card.error .card-body.content-section,
.card.bee-card.done .card-body.content-section .done-wrap,
.card.bee-card.error .card-body.content-section .done-wrap,
.card.bee-card.error .card-body.content-section .error-wrap {
	display:block;
}

.card.result-card .view.view-cascade.gradient-card-header #errorStatus p.text-content,
.card.result-card .view.view-cascade.gradient-card-header #manualStatus p.text-content {
    background: #ffeaea;
    color: #795548;
}

.card.bee-card.success .view.view-cascade.card-header {
    color: #fff;
    background-color: #28a745 !important;
}

.card.bee-card .view.view-cascade.card-header.bg-white {
    color: #212529;
    background-color: #fff !important;
}

.card.block-card .view.view-cascade.gradient-card-header.flat-header {
    border: 0;
}

.card.result-card.success .view.view-cascade.gradient-card-header {
    background-color: #28a745 !important;
    color: #fff;
    background: url('/img/common/bee-bg-0dbbe606f4ac1d92b383f23c2ae180d8.png');
    background-repeat: no-repeat;
    background-position: right bottom 100%;
    overflow: initial;
}

.card.bee-card .qbc-error,
.card.bee-card .qbc-success,
.card.bee-card .qbc-info,
.card.result-card .qbc-error,
.card.result-card .qbc-success,
.card.result-card .qbc-info {
    text-shadow: none;
}

.card.bee-card .qbc-error,
.card.bee-card .qbc-success,
.card.result-card .qbc-error,
.card.result-card .qbc-success {
    display: none;
}

.card.bee-card.fail .qbc-info,
.card.bee-card.fail .qbc-success,
.card.result-card.fail .qbc-info,
.card.result-card.fail .qbc-success {
    display: none;
}

.card.bee-card.fail .qbc-error,
.card.result-card.fail .qbc-error {
    display: block;
}

.card.bee-card.success .qbc-info,
.card.bee-card.success .qbc-error,
.card.result-card.success .qbc-info,
.card.result-card.success .qbc-error {
    display: none;
}

.card.bee-card.success .qbc-success,
.card.result-card.success .qbc-success {
    display: block;
}

.card.result-card .loading-section {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    height: 100%;
}

.card.result-card .loading-section .loading-icon {
    position: relative;
    padding: .3rem;
    cursor: default;
    pointer-events: none;
}

.card.result-card .loading-section .loading-icon img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}



.card.result-card .loading-section .qbc-icons .spinner.spinner2,
.card.result-card .loading-section .loading-icon .spinner.spinner2 {
    top: -1rem;
    left: -1rem;
    width: 10rem;
    height: 10rem;
    border-top-color: #0091ea;
    border-bottom-color: #0091ea;
}

.card.result-card .loading-section .qbc-icons .spinner.spinner3,
.card.result-card .loading-section .loading-icon .spinner.spinner3 {
    top: -1rem;
    left: -1rem;
    width: 10rem;
    height: 10rem;
    border-color: #0091ea;
}

.card.result-card.fail .loading-section .loading-icon img {
    -webkit-filter: grayscale(100%) opacity(0.7);
    -moz-filter: grayscale(100%) opacity(0.7);
    -o-filter: grayscale(100%) opacity(0.7);
    filter: grayscale(100%) opacity(0.7);
    filter: gray;
}

.card.result-card.fail .loading-section .qbc-icons,
.card.result-card.fail .loading-section .loading-icon {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.card.result-card.fail .loading-section .qbc-icons .spinner.spinner2,
.card.result-card.fail .loading-section .qbc-icons .spinner.spinner3,
.card.result-card.fail .loading-section .loading-icon .spinner.spinner2,
.card.result-card.fail .loading-section .loading-icon .spinner.spinner3 {
    animation: auto;
    border-color: #848484;
}

.card .card-footer {
    border-top: 1px solid #dee2e6;
}

.card.operate-card .view.view-cascade {
    position: relative;
    padding-top: 1.6rem !important;
    padding-bottom: 1.6rem !important;
    margin-bottom: 2.6rem !important;
}

.card.operate-card .operate-switch {
    position: absolute;
    font-size: 1.4rem;
    margin: 0;
    left: auto;
    right: 2rem;
    top: 50%;
    transform: translateY(-50%);
}

.card.operate-card .operate {
    display: none;
    cursor: pointer;
    z-index: 2;
}

.card.operate-card.on tr {
    cursor: default;
}

.card.operate-card.on .operate-content .operate {
    display: block;
}

.card.operate-card.on .operate-content .qbc-icons.qbc-arrow-right {
    display: none !important;
}

.qbc-card {
    width: 100%;
    padding: 1rem 1.6rem;
    border-radius: 0.4rem;
    border: 1px solid #dee2e6;
}

.coupon-card {
    height: 100%;
    border-radius: 1rem;
    --main-color: #EC407A;
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%) !important;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%) !important;
}

.coupon-card.shadow-none {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.coupon-card.theme1 {
    border-radius: 1rem;
    --main-color: #EC407A;
}
/*
.coupon-card .view {
    height: 90px;
}

.coupon-card .view::after {
    position: absolute;
    content: '';
    display: block;
    bottom: -6px;
    width: 100%;
    border-bottom: 10px dotted #ffffff;
}*/

.coupon-card.used .view::after {
    border-bottom: 10px dotted #e5e5e5;
}

.coupon-card .view img.card-img-top {
    height: 100%;
}

.coupon-card.used .view .mask {
    background-color: rgba(62, 69, 81, 0.7);
}

.coupon-card.used .card-body {
    background-color: rgba(0, 0, 0, 0.1);
}

.coupon-card .coupon-value {
    font-size: 3.4rem;
    font-weight: 600;
    color: #262525;
    text-shadow: 0 1px 2px rgb(0 0 0 / 60%);
}

.coupon-card .coupon-unit {
    margin-left: .4rem;
    font-size: 1.2rem;
    font-weight: 600;
    color: #454545;
    text-shadow: 0 1px 2px rgb(0 0 0 / 60%);
}

.coupon-card .card-title .text {
    color: #262525;
    font-weight: 600;
    -ms-flex: 1;
    flex: 1;
    padding-bottom:0.2rem;
}

.coupon-card .activator {
    position: inherit;
    cursor: pointer;
}

.coupon-card.coupon-expired {
    filter: grayscale(90%);
    opacity:0.85;
}

.coupon-card .coupon-limit {
    color: #454545 !important;
    line-height: 1.5;
    box-shadow: none;
    -webkit-box-shadow: none;
    font-size: 11px;
    font-weight: 500;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.coupon-card .coupon-limit.app-coupon {
    color: #fff !important;
    border: 1px solid red;
    background-color: red;
}

.coupon-card .card-body {
    padding-bottom: 1.2rem;
}

.coupon-card .coupon-limit.app-coupon {
  color: #fff !important;
  border: 1px solid #fff;
  background-color: #f44336;
}

.coupon-limit.badge {
    padding: 0 0.4em 0.1em !important;
}

.coupon-card.selected::after {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    color: #388e3c;
    font-size: 2.2rem;
    text-shadow: none;
    background-color: #fff;
    border-radius: 5rem;
    padding: 0rem 0.5rem 0;
    background: radial-gradient(circle at 49%, #fff, #fcfcfc 50%, #ffffff00 75%, #ffffff00 75%);
}

.coupon-reveal .container.detail p,
.coupon-reveal .container.detail div {
    margin-bottom: .3rem;
}

.coupon-reveal .container.detail hr {
    margin-bottom: .8rem;
    margin-top: .8rem;
}

.coupon-reveal .container.detail p.title,
.coupon-reveal .container.detail p.title i,
#detailBody.expired .coupon-reveal .container.detail p.title,
#detailBody.expired .coupon-reveal .container.detail p.title i {
     font-weight: 400;
}

.coupon-reveal .container.detail p.text {
    padding-left: 1.4rem;
    font-size: 1.4rem;
}

.coupon-card .left-container {
    width: 65%;
    padding-right: 10px;
}

.coupon-card .right-container {
    width: 32%;
}

.card-title .line-2 {
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 16px;
    line-height: 1.4;
}

.coupon-card .view-height {
    height: 160px !important;
}

#fragCouponList .coupon-card .view-height {
    height: 140px !important;
}

#detailBody.expired .expired-stamp {
    bottom: 80%;
    padding: 0.6rem 2.5rem;
    font-size: 2rem;
}

#detailBody.expired .badge-primary {
    background-color: #e0e0e0 !important;
    color: #000 !important;
}

#fragCouponList .col-12.col-md-6.p-lr:nth-child(even) {
    padding-left: 0.8rem;
}

#fragCouponList .col-12.col-md-6.p-lr:nth-child(odd) {
    padding-right: 0.8rem;
}

#fragCouponList .coupon-card .coupon-value {
    font-size: 2.2rem !important;
}
.rgba-light-hover:hover {
    background-color: rgba(0, 0, 0, 0.3) !important;
}

#couponDetailModal .badge-pill {
	line-height: 1.5;
}

.img-card {
	max-width: 40rem !important;
	min-width: 32rem !important;
	min-height: 24rem;
}

.card-img-border {
	border-radius: 15px 15px 15px 15px !important;
}

.card-img-body {
	background-color: #383c69;
	border-radius: 0 0 15px 15px;
}

.SMBC .card-img-body {
	background-color: #004830;
}

@media (max-width: 767px) {
    .card-step-shape {
        height: 4.5rem;
        width: 4.5rem;
        border-radius: 2.5rem 0 2rem 0;
    }

    .card-step-shape>span {
        line-height: 2.2;
    }

	.card.login-card,
    .card.block-card {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
        border-top: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .card.block-card.qbc-ribbon {
        overflow: hidden;
    }

    .card.block-card>.pure-title {
        margin-left: 0;
        margin-right: 0;
    }

    .card.block-card .card-title,
    .card.block-card .card-body,
    .card.block-card .card-footer {
        padding-left: 0;
        padding-right: 0;
    }

    .card.block-card .card-footer {
        border-bottom: 0;
    }

    .card.card-cascade.narrower .view.view-cascade {
        margin: 0;
        margin-top: -2.5rem;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .card.block-card.card-cascade.narrower .view.view-cascade {
        border-radius: .4rem;
    }

    .card .card-body ul.card-text {
        padding-left: 2rem;
    }

    .card .btn-sns {
        min-width: 80px;
        padding: 0.5rem 2rem;
    }

    .card .btn-sns img {
        height: 30px;
    }
    
    body.rd-biz-bg .card.login-card,
	body.rd-bg-pfx .card.login-card {
		-webkit-box-shadow: none;
		box-shadow: none;
	}

    .notice-card .action-wrap {
        width: 100%;
        text-align: center;
        margin-top: 1rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .notice-card .notice-content .action-wrap {
        margin-top: 1rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .notice-card .action-wrap.single{
        min-width:200px;
    }

    .notice-card .action-wrap .btn {
        width: 100%;
    }

    .card.operate-card .operate-switch {
        position: relative;
        float: right;
        margin: 0;
        margin-right: 3rem;
        padding: 0 !important;
        top: auto;
        right: auto;
        transform: none;
    }
    .coupon-card .coupon-value {
        font-size: 2.0rem;
    }

  .coupon-card .view-height {
        height: 130px !important;
    }

  .card-title .line-2 {
        font-size: 12px;
    }
   #fragCouponList .col-12.p-lr {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

   #detailBody.expired .expired-stamp {
        padding: 0.25rem 2rem;
        font-size: 1.6rem;
    }
    
    .coupon-card .coupon-limit {
		font-size: 10px;	
	}
}

@media ( min-width :768px) {
  .coupon-card .view-height.height-none {
    height: auto !important;
  }
}
/** -------------- / Card --------------  **/

/** -------------- Carousel --------------  **/
.carousel-multi-item .controls-top.controls-leftRight {
    position: absolute;
    width: 100%;
    top: 50%;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.carousel.account-promot-carousel {
    border-radius: .4rem;
}

.carousel.account-promot-carousel .carousel-indicators {
    margin: auto;
    width: fit-content;
}

.carousel.account-promot-carousel .carousel-indicators li {
    background-color: #8b8b8b;
}

.carousel.account-promot-carousel .carousel-item {
    width: 100%;
    background: #fff;
    background-image: url('/img/scoupon/banner2-726d032fce72ef8413a46e02c443a236.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    border-radius: 0.5rem;
    overflow: auto;
}

.carousel.account-promot-carousel .carousel-item>div,
.carousel.account-promot-carousel .carousel-item .view img {
    height: 90px;
    border-radius: .2rem;
}

.banner-intro-img {
    height: 90px;
    padding: 1.2rem;
}

.carousel-fade .carousel-inner .carousel-item {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition-property: opacity;
}

.carousel-fade .carousel-inner .carousel-item,
.carousel-fade .carousel-inner .active.carousel-item-left,
.carousel-fade .carousel-inner .active.carousel-item-right {
    opacity: 0;
}

.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-inner .carousel-item-prev.carousel-item-right {
    opacity: 1;
}

.carousel-vertical .carousel-inner .carousel-item-next.carousel-item-left,
.carousel-vertical .carousel-inner .carousel-item-prev.carousel-item-right {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.carousel-vertical .carousel-inner .active.carousel-item-left,
.carousel-vertical .carousel-inner .carousel-item-prev {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
}

.carousel-vertical .carousel-inner .active.carousel-item-right,
.carousel-vertical .carousel-inner .carousel-item-next {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
}

.carousel-multi-item .carousel-inner {
    padding: 0;
}

.carousel-multi-item .carousel-indicators li {
    width: 1.5rem;
    height: 1.5rem;
}

.carousel-multi-item .carousel-indicators .active {
    width: 1.8rem;
    height: 1.8rem;
}

.carousel-multi-item .carousel-inner.v-3 .carousel-item.active,
.carousel-multi-item .carousel-inner.v-3 .carousel-item-next,
.carousel-multi-item .carousel-inner.v-3 .carousel-item-prev {
    display: -webkit-box;
    display: -ms-flexbox;
    display: inline-flex;
}

.carousel-thumbnails.top-carousel .carousel-indicators > li{
    margin-right: 4px;
    margin-left: 4px;
    border-radius: .4rem;
}

.carousel-thumbnails.top-carousel .carousel-indicators > li img{
    width: 15rem;
    height: 10rem;
}

@media (min-width: 1200px) {
    .carousel-multi-item .controls-top.controls-leftRight {
        width: 110%;
        left: -5%;
    }
}

/*ipad pro*/
@media (max-width: 1024px) {

    .carousel.account-promot-carousel .carousel-item>div,
    .carousel.account-promot-carousel .carousel-item .view img,
    .banner-intro-img {
        height: 72px;
    }
}

/*ipad*/
@media (max-width: 992px) {

    .carousel.account-promot-carousel .carousel-item>div,
    .carousel.account-promot-carousel .carousel-item .view img,
    .banner-intro-img {
        height: 105px;
    }
}

/*mobile*/
@media (max-width: 767px) {

    .carousel.account-promot-carousel .carousel-item>div,
    .carousel.account-promot-carousel .carousel-item .view img,
    .banner-intro-img {
        height: 65px;
    }

    .banner-intro-img {
        padding: .8rem;
    }
    
	.carousel-thumbnails.top-carousel .carousel-indicators {
		display: -webkit-box;
		margin-right: 15px;
    	margin-left: 15px;
	}
	
	.carousel-thumbnails.top-carousel .carousel-indicators.top-remittance {
        display:flex!important;
        
    }
    .carousel-indicators.top-remittance{
        justify-content: start!important;
    }
    
	.carousel-thumbnails.top-carousel .carousel-indicators > li img{
	    width: 12rem;
	    height: 8rem;
	}
}

/** -------------- / Carousel --------------  **/

/** -------------- Container --------------  **/
.main-container {
    padding-top: 170px;
    min-height: calc(100vh - 180px);
}

.main-container.pure,
.main-container.login {
    min-height: calc(100vh - 153px);
}

.sim .main-container {
    padding-top: 120px;
}

.main-container.app {
    padding-top: 0 !important;
    min-height: 100vh;
}

.main-container.top {
    background: #fcfcfc;
}

.side-nav-pl .main-container {
    padding-top: 80px;
}

.main-container .main-inner {
    padding-top: 3rem;
    padding-bottom: 4rem;
}

.main-container .main-inner.narrow {
    padding-left: 10rem;
    padding-right: 10rem;
}

.main-container .main-inner.narrower {
    padding-left: 15rem;
    padding-right: 15rem;
}

.main-container.false,
.main-container.outer,
.main-container.sim {
    padding-top: 120px;
}

.main-container .top-height {
    height: 90px;
}

.main-container .scroll-container {
    position: relative;
    max-height: 100vh;
    padding: 2rem 1.6rem;
    border-radius: .3rem;
    overflow-y: auto;
    flex-wrap: nowrap;
    background: #fff;
    -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
}

.top-container {
    position: relative;
    height: 100%;
}

.top-container .top-view {
    min-height: 60vh;
    padding-top: 8rem;
}

.top-container-margin {
    margin: 25rem 0;
}

.top-container .inner-container {
    margin: auto 15px;
}

.card-container {
    background: #fff;
    border-radius: 0.4rem;
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%) !important;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%) !important;
}

.card-container .rt-container {
    position: relative;
    width: 90%;
    margin: 1.6rem auto 5rem;
}

.card-container .rt-container .card.block-card {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.fixed-container {
    position: fixed;
    z-index: 2;
}

.position-center {
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.position-center-t40 {
    left: 50%;
    top: 40%;
    transform: translateX(-50%) translateY(-40%);
}

.position-x-center {
    left: 50%;
    transform: translateX(-50%);
}

.position-y-center {
    top: 50%;
    transform: translateY(-50%);
}

.scroll-vertical-container {
    position: relative;
    max-height: 43.5vh;
    overflow-y: auto;
    border-radius: 0.4rem !important;
    border-bottom: 1px solid #dee2e6 !important;
}

.scroll-x-wrap {
    position: relative;
    overflow-x: auto;
}

.list-header {
    position: relative;
    border-bottom: 1px solid #f3f3f3;
}

.list-header .label {
    position: absolute;
    padding: 0.5rem 1rem;
    font-size: 1.4rem;
}

.list-header .left-top {
    top: 0;
    border-bottom-right-radius: 0.4rem;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
}

.list-header .right-bottom {
    bottom: 0;
    right: 0;
    border-top-left-radius: 0.4rem;
    border-top: 1px solid #dee2e6;
    border-left: 1px solid #dee2e6;
}

.list-display-container {
    position: relative;
    width: 100%;
    color: #212529;
    font-size: 1.6rem;
}

.list-display-container .list-sub-header {
    font-weight: 600;
    text-align: center;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.list-display-container .list-row {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.list-display-container .list-row.d-none {
	display: none !important;
}

.list-display-container .list-row .row-item.text-primary.text-code,
.list-display-container .list-row .row-item .text-info {
    font-size: 2.2rem;
    font-weight: 600;
    letter-spacing: 2px;
    color: #0091ea !important;
}

.list-display-container .list-row:not(:last-of-type) {
    border-bottom: 1px solid #f3f3f3;
}

.list-display-container .list-row>.row-item {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: flex-end;
    flex: 1 auto;
    padding: 1.2rem 1rem;
    min-height: 45px;
    word-break: break-word !important;
    word-wrap: break-word !important;
}

.list-display-container.sm .list-row>.row-item {
    padding: 0.8rem 1rem;
    min-height: 37px;
}

.list-display-container.form-height .list-row>.row-item {
    min-height: 55px;
}

.list-display-container .list-row>.row-item:first-of-type {
    flex: 0 auto;
    width: 40%;
    min-width: 40%;
    justify-content: flex-start;
    white-space: normal !important;
    color: #636363;
    font-size: 1.4rem;
    /*background: #f9f9f9;
        border-right: 1px solid #f3f3f3;*/
}

.list-display-container .list-row>.row-item:last-of-type {
    text-align: right;
}

.list-display-container .list-row.divided {
    border-top: 1px dashed #838383;
}

.list-display-container .list-row.divided-bt-light {
    border-bottom: 1px dashed #c3c3c3;
}

.list-display-container .list-row.total>.row-item,
.list-display-container .list-row.important>.row-item {
    font-weight: 600;
    font-size: 1.15em;
    color: #212121;
}

.list-display-container .list-row.important>.row-item:last-of-type {
    font-size: 2.2rem;
}

.list-display-container .list-row.total>.row-item:last-of-type {
    font-size: 1.8rem;
    color: red;
}

.list-display-container .list-row>.row-item .item-total {
    font-size: 2.2rem;
    font-weight: 600;
}

.currency-amount {
    position: relative;
}

.currency-amount::after {
    position: absolute;
    content: "JPY";
    top: 0.3rem;
    bottom: 0;
    margin-left: 0.3rem;
    color: #6e6e6e;
    font-size: .85em;
    font-weight: 500;
}

/*pad /pad pro*/
@media (max-width: 1024px) {
    .main-container .inner-container {
        width: 90%;
    }

    .main-container .main-inner {
        padding-top: 3rem;
    }

    .main-container .main-inner.narrower,
    .main-container .main-inner.narrow {
        padding-left: 0;
        padding-right: 0;
    }
}

/*mobile*/
@media (max-width: 767px) {
    .main-container {
        padding-top: 100px;
    }

    .sim .main-container {
        padding-top: 90px;
    }

    .main-container.false,
    .main-container.outer,
    .main-container.sim {
        padding-top: 60px;
    }

    .side-nav-pl .main-container {
        padding-top: 70px;
    }

    .main-container .main-inner {
        padding-top: 2rem;
    }

    .card-container {
        -webkit-box-shadow: none !important;
        box-shadow: none !important
    }

    .card-container .rt-container {
        width: 100%;
    }

    .top-container-margin {
        margin: 15rem 0;
    }

    .list-display-container .list-row.sp-row {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }

    .list-display-container .list-row>.row-item {
        min-height: 33px;
        padding: 1.4rem 1rem;
        width: 100% !important;
    }

    .list-display-container.form-height .list-row>.row-item {
        padding: 1.2rem;
        min-height: 50px;
    }

    .list-display-container .list-row>.row-item:first-of-type {
        min-height: auto;
        border-bottom: 0;
        border-right: 0;
    }

    .list-display-container.form-height .list-row>.row-item {
        padding: .6rem 1.2rem;
        min-height: 40px;
    }
}


.payforex-bg {
    background-image: url('/img/common/payforex-mv-bg-6203887449b0e1ecd4045ce952e4c098.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    opacity: .95;
}

.payforex-bg2 {
    background-image: url('/img/common/payforex-mv-bg2-15336f6f8cfb5150f7452f581c140498.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    opacity: .95;
}

.wave-bg {
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 24 150 48" preserveAspectRatio="none" shape-rendering="auto"><defs><path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" /></defs><g class=""><use xlink:href="#gentle-wave" x="60" y="2" fill="rgba(255,255,255)" /></g></svg>');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    opacity: .95;
}

.rotate-180 {
    transform: rotate(180deg)
}

.top-view>.container,
.top-view>.campaign-container {
    min-height: 600px;
    padding-bottom: 12rem !important;
}

.top-view>.container.customize,
.top-view>.campaign-container.customize {
    min-height: 668px;
}

section#service-intro1 {
    margin-top: -22rem;
}

section img.intro-image {
    height: 160px;
    margin: auto;
}

section img.intro-image.sm {
    height: 160px !important;
}

section img.app-image {
    height: 380px;
    margin: auto;
}

section .card-deck img.intro-image {
    height: 200px;
    padding: 1rem;
    padding-top: 0;
    margin: auto;
}

.view.payforex-bg.top-title-bg {
    height: 300px;
}

.waves-wrap {
    position: relative;
    width: 100%;
}

.waves-wrap svg.waves {
    position: relative;
    width: 100%;
    height: 150px;
}

.bg-waves .waves {
    position: relative;
    width: 100%;
    height: 10vh;
    min-height: 100px;
    max-height: 150px;
}

.bg-waves svg {
    -ms-touch-action: auto;
    touch-action: auto;
}

.bg-wave-light {
    background-color: rgba(250, 250, 250, 0.5);
}

.parallax>use {
    animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}

.parallax>use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}

.parallax>use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}

.parallax>use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}

.parallax>use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}

@keyframes move-forever {
    0% {
        transform: translate3d(-90px, 0, 0);
    }

    100% {
        transform: translate3d(85px, 0, 0);
    }
}

.bg-wave-light {
    background-color: rgba(250, 250, 250, 0.5);
}

/*pad /pad pro*/
@media (max-width: 1024px) {

    section img.intro-image,
    section .card-deck img.intro-image {
        height: 150px;
    }

    section img.app-image {
        height: 350px;
    }
}

/*mobile*/
@media (max-width: 767px) {
    .view.payforex-bg.top-title-bg {
        height: 280px;
    }

    section#service-intro1 {
        margin-top: -18rem;
    }

    section img.intro-image {
        height: 165px;
    }

    section img.app-image {
        height: 250px;
    }
}

/** -------------- / Container --------------  **/

/** -------------- Item --------------  **/
/** --- data-item --- **/
.data-item-scroll {
    position: relative;
    overflow-x: auto;
    flex-wrap: nowrap;
}

.data-item {
    display: block;
    position: relative;
    text-align: center;
    padding: 1.5rem 0;
}

.data-item.block-item {
    border-radius: .4rem;
    margin: auto 1rem;
}

.data-item.block-item .badge-dotto,
.data-item.block-item .badge-notification {
    top: 2rem;
}

.data-item.block-item:hover {
    background: #e9f0f7;
}

.data-item.block-item:hover .qbc-icons {
    color: #0091ea;
}

.data-item.white-item {
    background: #fff;
    padding: 1.5rem 1rem;
    margin: 0 1rem;
}

.data-item.white-item.flex-item {
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    flex: 0 1 12%;
}

.data-item.white-item .qbc-icons {
    font-size: 4rem;
    margin-bottom: .5rem;
}

.data-item .item-img {
    margin: auto;
    display: inline-block;
}

.data-item .item-img img {
    width: 6rem;
    border-radius: .3rem;
    margin-bottom: .5rem;
    -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
}

.data-item .item-text {
    font-size: 1.4rem;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .data-item.block-item {
        padding: 1.2rem 0;
        margin: 0;
    }

    .data-item .item-text {
        font-size: 1.2rem;
    }

    .data-item.block-item .badge-dotto,
    .data-item.block-item .badge-notification {
        top: 1rem;
        right: 0;
    }
}

/** --- / data-item --- **/

/** --- amount-select-item --- **/
.amount-select-item {
    position: relative;
    color: #0091ea;
    text-align: center;
    border: 1px solid #0091ea;
    border-radius: 0.4rem;
    padding: 1rem;
    transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0.2s ease;
}

.amount-select-item.selected,
.amount-select-item:hover {
    color: #fff !important;
    background: #0091ea;
    -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%) !important;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%) !important;
    transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0s ease;
}

.amount-select-item:hover {
    transform: scale(1.05);
}

.amount-select-item.selected .sub-text,
.amount-select-item:hover .sub-text {
    color: #fff
}

.amount-select-item .sub-text {
    color: #6c757d;
}

@media (max-width: 767px) {
    .amount-select-item {
        padding: .8rem 1rem;
        font-size: 1.4rem;
    }
}

/** --- / amount-select-item --- **/

/** --- image-select-item --- **/
.select-item {
    position: relative;
    text-align: center;
    padding: 1rem;
    box-shadow: 1px 1px 1px 0px #dee2e6;
    cursor: pointer;
    transition: transform 0.1s ease;
}

.select-item.selected,
.select-item:hover {
    color: #fff !important;
    background: #0091ea;
    -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%) !important;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%) !important;
    transition: transform 0.1s ease;
}

.select-item.bank:hover {
    background: #fff;
}

.select-item:hover {
    z-index: 2;
    transform: scale(1.1);
}

.col.select-item,
.col.select-item.conbini {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(25%);
    flex: 0 0 calc(25%);
    max-width: calc(25%);
}

.col.select-item.bank {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(33.33333%);
    flex: 0 0 calc(33.33333%);
    max-width: calc(33.33333%);
}

.select-item img {
    width: 50%;
    height: auto;
    margin: 0 auto;
    border-radius: 0.4rem;
}

.select-item.conbini img {
    width: 50%;
}

.select-item.bank img {
    width: 80%;
}

.check-item::after {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    bottom: .5rem;
    right: 1rem;
    color: #f1f1f1;
    font-size: 2rem;
}

.bankList td.check-item:not(.selected)::after {
    color: #a9a9a9;
}

.bankList.selected {
   background-color: aliceblue !important;
}

.coupon-card.check-item:not(.selected)::after {
    color: #dfdfdf!important;
}

.check-item.dark:not(.selected)::after {
    color: #dfdfdf!important;
}


.check-item.top::after {
    top: .5rem;
    bottom: 0;
}

.check-item.top.lg::after {
    top: 2.0rem;
    bottom: 0;
    right: 1.5rem;
    font-size: 2.5rem;
}

.check-item:not(.select-item).selected {
    background-color: aliceblue !important;
}

.check-item.before-disabled.selected {
    background-color: #f1fcff !important;
}

.check-item.selected::after {
    color: #0091ea;
}

.select-item.check-item.selected::after,
.select-item.check-item:hover::after {
    color: #fff;
}

/* select button*/
.btn-select-items .btn-select-item{
  background-color:#fff!important;
  min-width:200px!important;
}
@media (max-width: 767px) {
    .select-item {
        padding: .8rem;
        font-size: 1.4rem;
    }

    .col.select-item,
    .col.select-item.conbini {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(33.33333%);
        flex: 0 0 calc(33.33333%);
        max-width: calc(33.33333%);
    }

    .col.select-item.bank {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(50%);
        flex: 0 0 calc(50%);
        max-width: calc(50%);
    }

    .col.select-item.check-item::after {
        right: .5rem;
        bottom: 0;
    }
}

/** --- / image-select-item --- **/

/** --- list-item --- **/
.md-accordion .card.border .card-header {
    padding: 1.4rem 2rem;
    margin-bottom: 0;
    border-bottom: 0;
}

.md-accordion .card.border .card-header a:hover {
    color: initial;
}

.md-accordion .card.border .card-header .qbc-icons {
    margin-top: 0.5rem;
}

.search-input-group input {
    height: 55px;
}

.search-input-group {
    width: 100%
}

.search-input-group .input-group-text {
    width: 8rem;
    cursor: pointer;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.list-group-item.disabled>*,
.list-group-item:disabled>* {
    color: #9b9b9b;
}

.list-group-item>a.active {
    background-color: #f0f9ff;
    border-color: #afe1ff;
}

.search-list-group {
    width: 100%;
    border-radius: .4rem;
    border: 1px solid #dee2e6;
}

.search-list-group .input-group {
    border-bottom: 1px solid #dee2e6;
}

.search-list-group .input-group .input-group-text {
    background-color: #fff;
    border-color: transparent;
    padding: 0.6rem 2rem;
}

.search-list-group .input-group>input {
    border: 0 !important;
    height: 55px;
}

.search-list-group .list-container {
    position: relative;
    max-height: 43.5vh;
    overflow-y: auto;
}

.search-list-group .list-group-item {
    padding: 0;
    border-radius: 0;
}

.search-list-group .list-group-item.optgroup {
    font-size: 1.4rem;
    background: #f9f9f9;
    padding: .6rem 1.5rem;
    color: #919191;
    white-space: nowrap;
    cursor: default;
}

.search-list-group .list-group-item .inner-item {
    padding: 1.2rem 2rem;
    color: #6c757d !important;
}

.list-group-item.cert-display-item a,
.certWrap table a {
    display: inline;
    color: #0091ea;
}

.list-group-item a,
.list-group-item .inner-item {
    display: block;
    width: 100%;
    font-weight: 400;
    text-align: inherit;
    clear: both;
}

.list-group-item .inner-item:hover,
.list-group-item .inner-item:active {
    background-color: #f9f9f9;
    color: #6c757d !important
        /*-webkit-box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%);
        box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%);
        -webkit-transition: all 0.1s linear;
        transition: all 0.1s linear;*/
}

.list-group-item .inner-item img {
    display: inline-block;
    width: 3.5rem;
    vertical-align: middle;
    border-radius: 2px;
    overflow: hidden;
    -webkit-box-shadow: 1px 1px 3px #c5c5c5;
    -moz-box-shadow: 1px 1px 3px #c5c5c5;
    box-shadow: 1px 1px 3px #c5c5c5;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.list-group-item .inner-item img.provider {
    width: 5rem;
}

.list-group.list-accordion .list-group-item {
    padding: 0;
}

.content-wrap .collapse-item,
.list-group.list-accordion .list-group-item>.content-wrap .collapse-item {
    position: relative;
    cursor: pointer;
    padding: 1.5rem;
    min-height: 75px;
}

.list-group.list-accordion .list-group-item.list-checkbox> .content-wrap .collapse-item {
	min-height: auto;
}

.list-group.list-accordion .list-group-item>.content-wrap .collapse-item.disabled {
	background:#ccc;
}

content-wrap .collapse-item.partBalancePay {
    padding: 1rem;
}

.content-wrap .collapse-item.partBalancePay.selected {
    color: #0091ea;
    background: #e9f7ff;
}

.list-group.list-accordion .list-group-item>.content-wrap .inner-item-wrap {
    padding: 1.2rem;
    padding-top: 2rem;
    flex-wrap: wrap;
}

.list-group.list-accordion .list-group-item>.content-wrap .collapse-item.selected {
    background-color: #f1fcff;
}

.content-wrap .collapse-item.partBalancePay::after,
.content-wrap .collapse-item.selected:not(.before-disabled)::before,
.list-group.list-accordion .list-group-item>.content-wrap .collapse-item.selected:not(.before-disabled)::before {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 1rem;
    color: #0091ea;
    font-size: 2rem;
}

.content-wrap .collapse-item.mutilple-item.selected::after,
.list-group.list-accordion .list-group-item>.content-wrap .collapse-item.mutilple-item.selected::after {
    font-family: "Font Awesome 6 Pro";
    content: "\f14a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 1.5rem;
    color: #0091ea;
    font-size: 2rem;
}

.content-wrap .collapse-item.partBalancePay::after {
    color: #9c9c9c;
}

.content-wrap .collapse-item.selected.partBalancePay::after {
    color: #0091ea;
}

.d-flex .f-block-item.selected::before {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    top: .5rem;
    right: 1rem;
    color: #0091ea;
    font-size: 2rem;
}
.content-wrap .collapse-item.selected.bottom-0p5::before,
.list-group.list-accordion .list-group-item>.content-wrap .collapse-item.selected.bottom-0p5::before,
.d-flex .f-block-item.selected.bottom-0p5::before {
    top: auto;
    bottom:.5rem;
}

.content-wrap .collapse-item.selected.bottom-0::before,
.list-group.list-accordion .list-group-item>.content-wrap .collapse-item.selected.bottom-0::before{
	top: auto;
	bottom:0;
}
.list-group.list-accordion .list-group-item>.content-wrap:not(.false) .collapse-item[aria-expanded='true']:not(.collapsed) {
    background-color: #ecfbff;
    -webkit-box-shadow: 0 2px 3px 0 rgb(0 0 0 / 5%), 0 2px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0 2px 3px 0 rgb(0 0 0 / 5%), 0 2px 3px 0px rgb(0 0 0 / 5%);
}

.list-group.list-accordion .inner-item-wrap .f-block-item:not(.false):hover {
    background-color: #ecfbff;
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
    filter: drop-shadow(3px 3px 5px #c5c5c5);
}

.list-group.list-accordion .collapse-item.hover:hover,
.list-group.list-accordion .content-wrap:not(.false) .collapse-item:hover {
    background-color: #ecfbff;
}

.list-group.list-accordion .inner-item-wrap .f-block-item.selected {
    border: 1px solid #00a8d4;
    background-color: #ecfbff;
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
    filter: drop-shadow(3px 3px 5px #c5c5c5);
}

.content-wrap .collapse-item .item-icon.left-icon,
.list-accordion .item-icon.left-icon {
    border-right: 1px solid #eee;
    margin-right: 1.2rem;
    padding-right: 1.2rem;
}

.content-wrap .collapse-item .item-icon.left-icon img,
.list-accordion .item-icon.left-icon img {
    width: 4rem;
}


.content-wrap .collapse-item.partBalancePay .item-icon.left-icon img {
    width: 3rem;
}

.d-flex.f-icon-wrap {
    display: none !important;
}

.d-flex.f-icon-wrap.true {
    display: inherit !important;
}

.d-flex .f-block-item {
    position: relative;
    flex: 0;
    flex-basis: calc(calc(100% / 3) - 1.2rem);
    align-self: stretch;
    text-align: center;
    padding: 1rem;
    margin: 0.6rem;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius: .3rem;
    box-shadow: 0px 2px 3px rgb(0 0 0 / 5%), 0px 3px 10px rgb(0 0 0 / 5%);
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.d-flex .f-block-item.disabled {
	background: #cccccc;
}

.d-flex .f-block-item.disabled .badge{
	opacity:.8;
}

.d-flex .f-block-item .item-icon img {
    height: 4rem;
    width: auto;
    margin: auto;
}

.d-flex .f-block-item .item-icon.sm img {
    height: 3.5rem;
}

.d-flex .f-block-item .select-icon {
    position: absolute;
    display: none;
    cursor: pointer;
    top: 5%;
    right: 5%;
}

.d-flex .flex-item {
    white-space: normal;
}

.list-group-coupon>.list-group-item {
    border: 0;
    padding: .5rem 2rem;
}

.list-group-item .coupon-wrap {
    min-height: 120px;
    background-image: url('/img/scoupon/couponm0-d6c9294ff37bb48ec37ae5b05afcd9fa.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.list-group.link-list {
    width: 100%;
    padding: 0;
}

.list-group.link-list li.list-group-item {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    min-height: 55px;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.4rem !important;
}

.list-group.link-list .list-group-item:hover,
.list-group.link-list .list-group-item:active {
    background-color: #ecfbff;
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
    filter: drop-shadow(3px 3px 5px #c5c5c5);
    outline: none;
}

.list-group.link-list.narrow-list {
    border: 1px solid #dee2e6 !important;
    border-radius: 0.4rem !important;
}

.list-group.link-list.narrow-list li.list-group-item {
    border: 0 !important;
    border-radius: 0 !important;
}

.list-group.link-list.narrow-list li.list-group-item:not(:last-of-type) {
    border-bottom: 1px solid #dee2e6 !important;
}

.list-group.link-list.narrow-list li.list-group-item:first-of-type {
    border-top-left-radius: .4rem !important;
    border-top-right-radius: .4rem !important;
}

.list-group.link-list.narrow-list li.list-group-item:last-of-type {
    border-bottom-left-radius: .4rem !important;
    border-bottom-right-radius: .4rem !important;
}


.list-group.list-group-select .list-group-item {
    position: relative;
    cursor: pointer;
}

.list-group.list-group-select .list-group-item.selected {
    background-color: #ecfbff;
}

.list-group.list-group-select .list-group-item:after {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    bottom: .5rem;
    right: 1rem;
    color: #c7c7c7;
    font-size: 2.3rem;
}

.list-group.list-group-select .list-group-item.selected:after {
    color: #0091ea;
}

.list-group-flush>.list-group-item:last-child {
    border-bottom-width: 1px;
}

.list-group-flush.list-group-lg>.list-group-item:last-child,
.list-accordion.list-group-flush>.list-group-item:last-child {
    border-bottom-width: 0;
}

.list-group-item .flex-title {
  width: 20%;
  font-weight: 600;
}

.list-group-item .flex-detail {
  width: 80%;
  font-weight: 300;
}

.white-pill {
    border-radius: 80rem;
    background-color: #fff;
    padding: .1rem 1.6rem;
    -webkit-box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 8%);
    box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 8%);
}

.white-pill img.flag-thumbnail {
    width: 3.5rem !important;
}

.white-pill .bootstrap-select>.dropdown-toggle,
.white-pill .bootstrap-select>.dropdown-toggle:hover {
    background-color: #fff !important;
    background: #fff !important;
}

.white-pill button.dropdown-toggle {
    border: none !important;
}

.white-pill .bootstrap-select>.dropdown-toggle:after {
    content: "";
}

.white-pill-action-btn {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
}

.white-pill-action-btn {
    padding: 0.3rem !important;
    margin: auto;
}

@media (max-width: 992px) {

    .list-group-flush.list-group-lg>.list-group-item {
        border-bottom: 0;
    }
    
  .list-group-item .flex-title, 
  .list-group-item .flex-detail {
    width: 100%;
  }
}

@media (max-width: 767px) {
    .search-list-group {
        border-left: 0;
        border-right: 0;
        border-radius: 0;
    }

    .search-list-group .list-group-item .inner-item {
        padding: 1.2rem;
    }

    .d-flex .f-block-item {
        flex: 0;
        -ms-flex-preferred-size: calc(50% - 1.2rem);
        flex-basis: calc(50% - 1.2rem);
    }

    .list-group.list-accordion .list-group-item>.content-wrap .inner-item-wrap {
        padding: 1.2rem 0;
    }

    .list-group.list-accordion .list-group-item>.content-wrap .inner-item-wrap .f-block-item {
        padding: 1rem 0.5rem;
    }

    .list-group.list-accordion .list-group-item>.content-wrap .inner-item-wrap .badge {
        white-space: normal;
        margin-bottom: .4rem;
    }
    
    .d-flex .f-block-item .item-icon img {
		height:3.5rem;
	}
	
    .d-flex .f-block-item .item-icon.sm img {
      height: 3.0rem;
    }
}

/** --- list-item --- **/

/** -------------- / Item --------------  **/

/** -------------- Float labe --------------  **/
.has-float-label {
    position: relative;
    width: 100%;
}

.has-float-label.focus .form-control.required+label {
    font-size: 1.4rem !important;
    opacity: 1 !important;
    top: -.65em !important;
    left: 1.5rem !important;
}

.has-float-label label,
.has-float-label>span,
.has-float-label>span.active,
.has-float-label.phone-input-group div.input-group-prepend~.form-control+span,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus)+span,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus)+label,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus)+input+label {
    position: absolute;
    cursor: text;
    font-size: 75%;
    opacity: 1;
    max-width: 95%;
    top: -.65em;
    left: 1rem;
    padding: 0 1px;
    z-index: 3;
    -webkit-transition: all .3s;
    transition: all .3s;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.has-float-label.phone-input-group div.input-group-prepend~.form-control+span {
    position: absolute;
    cursor: text;
    font-size: 75% !important;
    opacity: 1 !important;
    max-width: 80%;
    top: -.65em !important;
    left: 1rem !important;
    padding: 0 1px;
    z-index: 3 !important;
    -webkit-transition: all .3s;
    transition: all .3s;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.has-float-label.md-form label,
.has-float-label.md-form>span {
    color: #757575;
    left: 0;
}

.has-float-label .required~label,
.has-float-label .required+input+label,
.has-float-label .required~span,
.has-float-label .required~span.active {
    left: 1rem;
    padding: 1px 1px 1px 1.5rem !important;
}


.has-float-label .form-control::-webkit-input-placeholder,
.has-float-label div.input-group-prepend~.form-control:not(:focus)::-webkit-input-placeholder,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus)::-webkit-input-placeholder {
	font-size: .85em;
    opacity: 1;
    -webkit-transition: all .3s;
    transition: all .3s;
}

.has-float-label .form-control::-moz-placeholder,
.has-float-label div.input-group-prepend~.form-control:not(:focus)::-moz-placeholder,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus)::-moz-placeholder {
	font-size: .85em;
    opacity: 1;
    transition: all .3s;
}

.has-float-label .form-control:-ms-input-placeholder,
.has-float-label div.input-group-prepend~.form-control:not(:focus):-ms-input-placeholder,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus):-ms-input-placeholder {
	font-size: .85em;
    opacity: 1;
    transition: all .3s;
}

.has-float-label .form-control::placeholder,
.has-float-label div.input-group-prepend~.form-control:not(:focus)::placeholder,
.has-float-label div.input-group-prepend~.form-control:placeholder-shown:not(:focus)::placeholder {
	font-size: .85em;
    opacity: 1;
    -webkit-transition: all .3s;
    transition: all .3s;
}

.has-float-label:not(.focus) .form-control:not(:focus)::-webkit-input-placeholder,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)::-webkit-input-placeholder {
    opacity: 0;
}

.has-float-label:not(.focus) .form-control:not(:focus)::-moz-placeholder,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)::-moz-placeholder {
    opacity: 0;
}

.has-float-label:not(.focus) .form-control:not(:focus)::-ms-input-placeholder,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)::-ms-input-placeholder {
    opacity: 0;
}

.has-float-label:not(.focus) .form-control:not(:focus)::placeholder,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)::placeholder {
    opacity: 0;
}

.has-float-label:not(.focus) .form-control:invalid+span,
.has-float-label:not(.focus) .form-control:invalid+label,
.has-float-label:not(.focus) .form-control:invalid+input+label,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)+span,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)+label,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)+input+label {
    font-size: 1.4rem;
    opacity: .5;
    top: 30%;
}

.has-float-label:not(.focus) .form-control.required:invalid+span,
.has-float-label:not(.focus) .form-control.required:invalid+label,
.has-float-label:not(.focus) .form-control.required:invalid+input+label,
.has-float-label:not(.focus) .form-control.required:placeholder-shown:not(:focus)+span,
.has-float-label:not(.focus) .form-control.required:placeholder-shown:not(:focus)+label,
.has-float-label:not(.focus) .form-control.required:placeholder-shown:not(:focus)+input+label {
    font-size: 1.4rem;
    opacity: .5;
    top: 30%;
    left: 1.5rem;
    z-index: 0;
}

.has-float-label textarea.form-control.required:invalid+span,
.has-float-label textarea.form-control.required:invalid+label,
.has-float-label textarea.form-control.required:placeholder-shown:not(:focus)+span,
.has-float-label textarea.form-control.required:placeholder-shown:not(:focus)+label {
    top: 10% !important;
}

.has-float-label label::after,
.has-float-label>span::after {
    content: " ";
    display: block;
    position: absolute;
    background: #fff;
    height: 5px;
    top: 30%;
    left: -.2em;
    right: -.2em;
    z-index: -1;
}

.has-float-label.phone-input-group div.input-group-prepend~.form-control+span::after {
    background: #fff !important;
}

.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)+span::after,
.has-float-label:not(.focus) .form-control:placeholder-shown:not(:focus)+label::after {
    background: transparent;
}

.has-float-label .required~label::before,
.has-float-label .required+input+label::before,
.has-float-label .required~span::before {
    content: "※";
    display: block;
    position: absolute;
    color: red;
    left: 0;
    z-index: 1;
}


/** -------------- / Float label --------------  **/

/** Display block **/
.display-block {
    width: 100%;
    padding: 1rem;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: .3rem;
}

/** Display block **/

/** -------------- Alert --------------  **/
.row #alertSection {
    width: 100%;
}

.alert {
    width: 100%;
    border-radius: .4rem;
    border: 1px solid transparent;
    -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 5%), 0 1px 3px 0px rgb(0 0 0 / 5%);
}

.alert.border {
    box-shadow: none;
    -webkit-box-shadow: none;
}

.alert.alert-pure-note {
	border:0;
    border-left: 6px solid;
}

.alert.alert-full-width {
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.alert .alert-title,
.alert .alert-content {
    position: relative;
    padding-left: 2.5rem;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.alert .alert-content:not(:first-child) {
    padding-left: 0;
}

.alert.pure .alert-title:before,
.alert.pure>.alert-content:first-child:before {
    content: "" !important;
}

.alert.alert-pure-note.pure>.alert-content {
    padding-left: 0;
}

.alert .alert-title:before,
.alert>.alert-content:first-child:before {
    font-family: "qbc-icons";
    content: "\e982";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    top: .1rem;
    line-height: 1;
    left: 0;
    font-size: 2rem;
    font-weight: 500;
}

.alert .notice-card .alert-title:before {
    bottom: .1rem;
    top: auto;
}

.alert.alert-default {
    background: #eee !important;
}

.alert.alert-default .alert-content {
    color: #6c757d !important
}

.alert.alert-primary .alert-title:before,
.alert.alert-primary>.alert-content:first-child:before {
    content: "\e982";
}

.alert.alert-success .alert-title:before,
.alert.alert-success>.alert-content:first-child:before {
    content: "\e93a";
}

.alert.alert-warning .alert-title:before,
.alert.alert-warning>.alert-content:first-child:before {
    content: "\e947";
}

.alert.alert-danger .alert-title:before,
.alert.alert-error .alert-title:before,
.alert.alert-danger>.alert-content:first-child:before,
.alert.alert-error>.alert-content:first-child:before {
    content: "\e974";
}

.alert .alert-title>.title-text {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    font-weight: 600;
    padding-top: 0.2rem;
}

.alert .alert-content>ul {
    width: 100%;
    padding-left: 0;
    list-style: none;
    margin: 0;
}

.alert .alert-content>ul a {
    color: #0091ea;
}

.alert.notice-alert .alert-content>ul li.todo,
.alert.notice-alert .alert-content>ul li.done,
.alert.notice-alert .alert-content>ul li.error {
    position: relative;
    text-indent: 2.5rem;
}

.alert.notice-alert .alert-content>ul li:before {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    line-height: 1;
    top: 50%;
    left: -2.5rem;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    color: #bfbfbf;
    font-size: 1.8rem;
}

.alert.notice-alert .alert-content>ul li.todo:before {
    color: #bfbfbf;
}

.alert.notice-alert .alert-content>ul li.done:before {
    color: green;
}

.alert hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.alert-primary {
    background-color: #deebff;
}

.alert-primary .alert-title:before,
.alert-primary .alert-content:first-child:before {
    color: #0052cc;
}

.alert-success {
    background-color: #c3e6d4;
}

.alert-success .alert-title:before,
.alert-success .alert-content:first-child:before {
    color: #00875a;
}

.alert-danger,
.alert-error {
    color: #721c24;
    background-color: #ffd2c7;
}

.alert-error.lighten {
	background-color: #ffe2db;
}

.alert-danger .alert-title:before,
.alert-error .alert-title:before,
.alert-danger .alert-content:first-child:before,
.alert-error .alert-content:first-child:before {
    color: #de350b;
}

.alert-warning {
    background-color: #fff3c4;
}

a.alert {
    display: block;
}

.alert-warning.light {
    background-color: #fff5d3;
}

.alert-warning.border {
    border-color: #ffdf84 !important
}

.alert-warning hr {
    border-top-color: #ffdf84;
}

.alert-warning .alert-title:before,
.alert-warning .alert-content:first-child:before {
    color: #f57c00;
}

.alert-modal .alert {
    padding: 1.2rem 1rem;
    margin-bottom: 0;
}

.modal.alert-modal .modal-side {
    width: 50rem;
}

.alert-block {
    width: 100%;
    padding: 1.8rem;
    font-size: 1.4rem;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.4rem !important;
}

.alert-block.info,
.alert-block.warning {
    background-color: #fff8e1 !important;
    border: 1px solid #ff9800 !important;
}

.alert-block.error {
    color: #721c24 !important;
    background-color: #ffd2c7 !important;
    border: 1px solid #ff8162 !important;
}

.alert-block.warning b {
    font-weight: 600;
    color: #ff2f00;
}

@media (max-width: 767px) {
    .alert {
        padding: 1.2rem 0.8rem;
        font-size: 1.4rem;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .modal.alert-modal .modal-side {
        width: auto;
    }
}

/** -------------- / Alert --------------  **/

/** -------------- Loading --------------  **/
.pageLoader-container {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 9999;
    opacity: 1;
    display: none;
}

.pageLoader-container.loading {
    display: block;
}

.pageLoader-container.loaded {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -webkit-animation-duration: 800ms;
    animation-duration: 800ms;
    animation-fill-mode: both;
    -webkit-animation-name: loaderFadeOut;
    animation-name: loaderFadeOut;
}

.pageLoader-container .inner-wrap {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    height: 100%;
}

.pageLoader-container .page-logo {
    position: relative;
    padding: .3rem;
    margin-top: -4.8rem !important;
    margin-bottom: 1.6rem !important;
    width: 120px;
    height: 120px;
    cursor: default;
    pointer-events: none;
}

.pageLoader-container .page-logo img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80px;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.pageLoader-container .page-logo .spinner.spinner2 {
    width: 100%;
    height: 100%;
    border-top-color: #0091ea;
    border-bottom-color: #0091ea;
}

.pageLoader-container .page-logo .spinner.spinner3 {
    width: 100%;
    height: 100%;
    border-color: #0091ea;
}

.pageLoader-container .logo-desc {
    font-size: 1.4rem;
    font-weight: 600;
}

.loaderFadeOut {
    -webkit-animation-name: loaderFadeOut;
    animation-name: loaderFadeOut;
}

@keyframes loaderFadeOut {
    from {
        opacity: 1;
    }

    to {
        display: none;
        opacity: 0;
        z-index: -1;
    }
}

.cp-spinner {
    width: 48px;
    height: 48px;
    display: inline-block;
    box-sizing: border-box;
    position: relative;
}

.cp-bubble {
    border-radius: 50%;
    width: 15px;
    height: 15px;
    display: inline-block;
    box-sizing: border-box;
    background: #0091ea;
    animation: cp-bubble-animate 1s linear infinite;
}

.cp-bubble:before {
    border-radius: 50%;
    content: " ";
    width: 15px;
    height: 15px;
    display: inline-block;
    box-sizing: border-box;
    background-color: #0091ea;
    position: absolute;
    left: -30px;
    animation: cp-bubble-animate-before 1s ease-in-out infinite;
}

.cp-bubble:after {
    border-radius: 50%;
    content: " ";
    width: 15px;
    height: 15px;
    display: inline-block;
    box-sizing: border-box;
    background-color: #0091ea;
    position: absolute;
    right: -30px;
    animation: cp-bubble-animate-after 1s ease-in-out infinite;
}

@keyframes cp-bubble-animate {
	0% {
	    opacity: .5;
	    transform: scale(1) translateX(0);
	}
	25% {
	    opacity: 1;
	    transform: scale(1.1) translateX(-15px);
	}
	50% {
	    opacity: 1;
	    transform: scale(1.2) translateX(15px);
	}
	
	100% {
	    opacity: .5;
	    transform: scale(1) translateX(0);
	}
}

.scanning img {
	position: relative;
}

.scanning::before {
	z-index: 999;
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 15%;
	width: 6px;
	background: #00b9ff;
	box-shadow: 16px 20px 70px 20px #00b9ff;
	clip-path: inset(0);
	animation:
		scannx 4s ease-in-out infinite alternate,
		scanny 8s ease-in-out infinite;
}

@keyframes scannx {
	to {
		transform: translateX(-100%);
		left: 85%;
	}
}

@keyframes scanny {
	20% {
		clip-path: inset(0 0 0 -100px);
	}

	50% {
		clip-path: inset(0 0 0 0);
	}

	80% {
		clip-path: inset(0 -100px 0 0);
	}
}

/** -------------- / Loading --------------  **/

/** -------------- Table Layout --------------  **/
.d-table {
    display: table;
    width: 100%;
}

.d-table>.d-table-cell {
    display: table-cell !important;
    vertical-align: middle;
}

.d-table>.d-table-cell.left-icon-cell {
    min-width: 7%;
    vertical-align: baseline;
}

.d-table>.d-table-cell.center-text-cell {
    text-align: left;
}

.d-table>.d-table-cell.right-icon-cell {
    width: 7%;
    text-align: right;
}

/** -------------- Table Layout --------------  **/

/** -------------- Stepper --------------  **/
.nav-stepper-container {
    position: relative;
    font-size: 1.2rem;
    width: 100%;
    margin: 1rem 0;
}

ul.qbc-nav-stepper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0;
    margin: auto;
    overflow-x: auto;
}

.qbc-nav-stepper>li {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex: 1 25%;
    margin: 0 !important;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    align-self: stretch !important;
    -ms-flex-item-align: stretch !important;
    -ms-grid-row-align: stretch !important;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.qbc-nav-stepper li.block {
    cursor: default;
    pointer-events: none;
}

.qbc-nav-stepper li:not(.block):hover {
    background-color: rgba(0, 0, 0, 0.06);
}

.qbc-nav-stepper:not(.arrow-style) li:not(:first-child):before,
.qbc-nav-stepper:not(.arrow-style) li:not(:last-child):after {
    position: absolute;
    height: 1px;
    top: 2.2rem;
    width: 42%;
    content: "";
    background-color: rgba(0, 0, 0, 0.1);
}

.qbc-nav-stepper:not(.arrow-style) li:not(:first-child):before {
    left: 0;
}

.qbc-nav-stepper:not(.arrow-style) li:not(:last-child):after {
    right: 0;
}

.qbc-nav-stepper:not(.arrow-style) li.completed:not(:first-child):before,
.qbc-nav-stepper:not(.arrow-style) li.completed:not(:last-child):after,
.qbc-nav-stepper:not(.arrow-style) li.active:not(:first-child):before,
.qbc-nav-stepper:not(.arrow-style) li.active:not(:last-child):after {
    background-color: #009aea;
}

.qbc-nav-stepper.arrow-style li:not(:last-child):after {
    font-family: "qbc-icons";
    content: "\e959";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: auto;
    font-size: 3rem;
    -webkit-transition: -webkit-transform .2s ease-in-out;
    transition: -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

ul.qbc-nav-stepper li a {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    padding: 0 .5rem;
    width: 100%;
}

ul.qbc-nav-stepper.arrow-style li a {
    flex: 1;
}

ul.qbc-nav-stepper li a .circle {
    width: 2.5rem;
    height: 2.5rem;
    margin: 0;
    line-height: 2.5rem;
}

ul.qbc-nav-stepper li a .label {
    margin-top: .8rem;
}

ul.qbc-nav-stepper li.completed {
    opacity: .85;
}

ul.qbc-nav-stepper li.completed a .label {
    font-weight: 500;
}

ul.qbc-nav-stepper li.completed a .circle {
    background-color: #36aef7 !important;
}

.stepper-tabs .nav {
    position: relative;
    overflow-x: hidden;
    white-space: nowrap;
}

.stepper-tabs .nav li {
    position: relative;
    width: 33.33%;
    flex: 1;
}

.stepper-tabs .nav li a {
    display: block;
    text-align: center;
    padding: 1rem;
    padding-top: 1.8rem;
    color: #0091ea;
    white-space: normal !important;
}

.stepper-tabs .nav li a,
.stepper-tabs .nav li a>.qbc-icons {
    color: #0086d8;
}

.stepper-tabs .nav li.active a,
.stepper-tabs .nav li.active a>.qbc-icons {
    color: #0da3ff;
}

.stepper-tabs .nav li.active~li a,
.stepper-tabs .nav li.active~li a>.qbc-icons {
    color: #9da2a7;
}

.stepper-tabs .nav li:first-child:before,
.stepper-tabs .nav li:last-child:after {
    content: none;
}

.stepper-tabs .nav li:before,
.stepper-tabs .nav li:after {
    content: "";
    position: absolute;
    width: 1.5rem;
    height: 1.5rem;
    border-top: solid 2px #697b91;
    border-right: solid 2px #697b91;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 50%;
    right: 0;
    margin-top: -4px;
}

.stepper-tabs .nav li:before {
    left: -9px;
}

.stepper-tabs .nav li a .qbc-icons {
    margin-bottom: .8rem;
}

.stepper-tabs .tab-content {
    padding: 1rem;
}

.nav-progress-stepper .md-progress.cert .progress-bar {
    background: #212121;
}

.nav-progress-stepper .md-progress .progress-bar {
    background: #212121;
    background: linear-gradient(90deg, #0091ea 40%, rgb(140 211 255) 75%);
}

.nav-progress-stepper .md-progress.step-1 .progress-bar {
    width: 50%;
    background: linear-gradient(90deg, #0091ea 50%, rgb(140 211 255) 100%);
}

.nav-progress-stepper .md-progress.step-1 .progress-desc {
    display: none;
}

.nav-progress-stepper .md-progress.step-2 .progress-bar {
    width: 100%;
    background: linear-gradient(90deg, #0091ea 50%, rgb(140 211 255) 100%);
}

.nav-progress-stepper .md-progress.step-2 .progress-desc {
    width: calc((100% / 3) * 2);
}

.nav-progress-stepper .md-progress.step-2.false .progress-bar,
.nav-progress-stepper .md-progress.step-3 .progress-bar {
    width: 100%;
    background: linear-gradient(90deg, #0091ea 50%, rgb(140 211 255) 100%);
}

.nav-progress-stepper .md-progress.step-3 .progress-desc {
    width: 100%;
}

.nav-progress-stepper.w4reupload .md-progress .progress-bar {
    background: #212121;
    background: linear-gradient(90deg, #0091ea 40%, #fa0 75%);
}

.nav-progress-stepper.w4reupload .md-progress .progress-bar {
    background: #212121;
    background: linear-gradient(90deg, #0091ea 40%, #fa0 75%);
}

.nav-progress-stepper .step-content {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
}

.nav-progress-stepper .step-content .action-wrap {
    min-width: 150px;
    text-align: right;
    margin-left: 1.6rem;
}

.nav-progress-stepper .step-content .action-wrap .btn {
    margin: 0;
    width: 100%;
}

ul.qbc-progress-stepper {
    position: relative;
    width: 100%;
    font-size: 1.2rem;
}

ul.qbc-progress-stepper li {
    flex: 1 1 auto;
}

.qbc-step.step {
    list-style: none;
    margin: 0;
}

.qbc-step .step-element {
    display: flex;
    padding: 1rem 0;
}

.qbc-step .step-number {
    position: relative;
    width: 7rem;
    flex-shrink: 0;
    text-align: center;
}

.qbc-step .step-number .number {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    background-color: #4facfe;
    font-size: 2rem;
    font-weight: 700;
    width: 4rem;
    height: 4rem;
    border-radius: 10rem;
}

.qbc-step .step-number::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 48px;
    bottom: -2rem;
    margin-left: -1px;
    border-left: 2px dashed #eaeff4;
}

.qbc-step.step .step-element:last-child .step-number::before {
    bottom: 1rem;
}

.stepper.dot-stepper li.active:not(:last-child):after {
   background-color: #4facfe;
   width:2px;
}

.stepper-vertical.dot-stepper li:after {
  top: 4.3rem;
  left: 3.4rem;
  height: calc(100% - 40px);
}

.stepper-vertical.dot-stepper li:last-child:after {
  position: absolute;
  width: 1px;
  content: "";
  background-color: rgba(0, 0, 0, 0.1);
}

@media (max-width: 767px) {

    .qbc-nav-stepper>li {
        min-width: 50%;
    }

    .nav-progress-stepper .step-content .action-wrap {
        width: 100%;
        text-align: center;
        margin-left: 0;
        margin-top: 1.6rem;
    }

    .nav-progress-stepper {
        font-size: 1.4rem;
    }

    .stepper-tabs .nav li {
        width: 100%;
        flex: auto;
    }

    .stepper-tabs .nav li a {
        font-size: 1.4rem;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
    }

    .stepper-tabs .nav li:before,
    .stepper-tabs .nav li:after {
        content: none;
    }

    .stepper-tabs .nav li a .qbc-icons {
        margin-bottom: 0;
        margin-right: .8rem;
    }
}

/**ul.qbc-stepper li {
        min-width: 33%;
    }

        ul.qbc-stepper li:before,
        ul.qbc-stepper li:after {
            position: relative;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            margin: 0.8rem 0 0 0;
            content: "";
            background-color: rgba(0, 0, 0, 0.1);
        }

        ul.qbc-stepper li:hover {
            background-color: initial;
        }

            ul.qbc-stepper li:hover a {
                background-color: rgba(0, 0, 0, 0.06);
                opacity: 1 !important;
            }

        ul.qbc-stepper li a {
            padding: 1rem 1.5rem;
            margin: 1rem 0;
            border-radius: 10em;
            border: 1px solid rgb(212, 212, 212);
        }

            ul.qbc-stepper li a .label {
                margin-top: .35rem;
            }

        ul.qbc-stepper li.completed a {
            opacity: .75;
        }**/

/** -------------- / Stepper --------------  **/

/** -------------- Tabs --------------  **/
.nav-tabs.qbc-tabs {
    position: relative;
    z-index: 1;
    background-color: transparent;
    padding: 0;
    margin: 0;
    border: 0;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.nav-tabs.qbc-tabs.tab-card {
	 z-index:auto;
}

.nav-tabs.qbc-tabs.rounded-top-3 {
    border-top-left-radius: 3rem;
    border-top-right-radius: 3rem;
}

.nav-tabs.qbc-tabs .nav-item {
    margin: 0 1rem;
    overflow: hidden;
    border: 1px solid #dee2e6;
    border-bottom: 0;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.nav-tabs.qbc-tabs.tab-card .nav-item {
	border:none;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.nav-tabs.qbc-tabs.rounded-top-3 .nav-item {
    border-top-left-radius: 3rem;
    border-top-right-radius: 3rem;
}

.nav-tabs.qbc-tabs .nav-item:first-of-type {
    margin-left: 0;
}

.nav-tabs.qbc-tabs .nav-item:last-of-type {
    margin-right: 0;
}

.nav-tabs.qbc-tabs .nav-link {
    margin: 0;
    padding: 1.6rem;
    padding-bottom: 1.7rem;
    color: #212121;
    border: 0;
    background-color: #f2f2f2 !important;
    height: 100%;
}

.nav-tabs.qbc-tabs.tab-card .nav-link {
	padding-bottom: 1.9rem;
	color: #8b8b8b;
}

.nav-tabs.qbc-tabs .nav-item.show .nav-link {
    border-radius: 0;
    border-color: transparent;
}

.nav-tabs.qbc-tabs .nav-link.active,
.nav-tabs.qbc-tabs .nav-link:hover,
.nav-tabs.qbc-tabs .nav-link:focus {
    color: #0091ea;
    background-color: #fff !important;
}

.nav-tabs.qbc-tabs .dropdown {
    position: initial;
}

.nav-tabs.qbc-tabs .dropdown-menu {
    margin-top: 0;
    box-shadow: inset 0px 1px 2px 1px rgb(0 0 0 / 15%), 0 2px 6px 0px rgb(0 0 0 / 18%);
    -webkit-box-shadow: inset 0px 1px 2px 1px rgb(0 0 0 / 15%), 0 2px 6px 0px rgb(0 0 0 / 18%);
    -moz-box-shadow: inset 0px 1px 2px 1px rgb(0 0 0 / 15%), 0 2px 6px 0px rgb(0 0 0 / 18%);
}

.filter-toggle.dropdown-toggle::after {
    content: none;
    border: 0;
}

.nav-tabs.qbc-tabs~.tab-content {
    margin-top: -1px;
    border: 1px solid #dee2e6;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

.nav-tabs.qbc-tabs.rounded-top-3~.tab-content,
.nav-tabs.qbc-tabs.rounded-top-3~.tab-content .tab-pane {
    border-bottom-left-radius: 3rem;
    border-bottom-right-radius: 3rem;
}

.nav-tabs.qbc-pure-tabs {
    position: relative;
    z-index: 1;
    background-color: #fff;
    padding: 0;
    border: 0;
}

.nav-tabs.qbc-pure-tabs .nav-link {
	color: #6c757d;
    border: 0;
    border-radius: 0;
    padding-top: 1.2rem;
    padding-bottom: 1.2rem;
}

.nav-tabs.qbc-pure-tabs .nav-link~div.bar {
    width: 60px;
    height: 3px;
    margin: auto;
    border-radius: .4rem;
}


.nav-tabs.qbc-pure-tabs .nav-link:active,
.nav-tabs.qbc-pure-tabs .nav-link.active,
.nav-tabs.qbc-pure-tabs .nav-link:focus,
.nav-tabs.qbc-pure-tabs .nav-link:hover {
    color: #0091ea;
    background-color: #fff !important;
    outline: none;
}

.nav-tabs.qbc-pure-tabs .nav-link.active~div.bar,
.nav-tabs.qbc-pure-tabs .nav-link:active~div.bar,
.nav-tabs.qbc-pure-tabs .nav-link:hover~div.bar,
.nav-tabs.qbc-pure-tabs .nav-link:focus~div.bar {
    background-color: #0091ea;
}

.modal-tab.nav-tabs .nav-link.active,
.modal-tab.nav-tabs .nav-link:active,
.modal-tab.nav-tabs .nav-link:focus,
.modal-tab.nav-tabs .nav-link:hover {
   background:#fff;
   font-weight:600;
   color:#0091ea;
   border-radius:5px;
   border:1px solid
}

@media (max-width: 767px) {

    .nav-tabs.qbc-tabs {
        margin-right: 0;
        margin-left: 0;
    }

    .nav-tabs.qbc-tabs .nav-item {
        margin: 0 .5rem;
    }

    .nav-tabs.qbc-tabs~.tab-content.border-sm-0 {
        border-left: 0;
        border-right: 0;
        border-top: 0;
    }

    .nav-progress-stepper .step-content {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }
}

/** -------------- / Tabs --------------  **/


/** -------------- Terms And Helps --------------  **/
.termsHelpsTitle {
    font-weight: 600;
    border-bottom: solid 4px #0091ea;
    padding-bottom: .5rem;
}

.stepBox {
    position: relative;
    padding: 2rem 1rem;
    margin-top: 1rem;
    margin-bottom: 3rem;
    border-radius: .4rem;
    border: 3px solid #dddddd;
}

.stepBox:not(:last-of-type):after {
    content: '';
    margin: 0 auto;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    border-top: solid 25px #dddddd;
    border-left: solid 35px transparent;
    border-right: solid 35px transparent;
}

.stepBox h6 {
    font-size: 1.4rem;
    font-weight: 600;
    padding-bottom: .5rem;
    margin-bottom: 1rem;
    border-bottom: 3px solid #dddddd;
}

.stepBox p.stepContent {
    margin-top: 1.6rem;
    margin-bottom: 0;
    text-align: center;
}

.stepBox .stepContent img {
    vertical-align: bottom;
    width: 85%;
}

.stepBox .stepContent img.apphelps{
	width: 45%;
}

.terms-section {
    font-size: 1.4rem;
}

.terms-section h2 {
    font-size: 2rem;
    font-weight: 600;
    margin: 2rem 0;
}

.terms-section h3 {
    font-size: 1.6rem;
    font-weight: 600;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 3px solid #0091ea;
}

.terms-section table {
    width: 100%;
    margin-bottom: 2rem;
}

/** -------------- / Terms And Helps --------------  **/

/** -------------- QR Code --------------  **/
.qrcode-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.qrcode-wrap.has-label {
    padding: 2rem 0;
}

.qrcode-wrap>canvas {
    width: 12rem;
    background-color: #fff;
    padding: 0.8rem;
    border: 1px solid #eaeaea;
    border-radius: 0.4rem;
    -webkit-box-shadow: 0 1px 5px 0 rgb(0 0 0 / 16%), 0 1px 5px 0 rgb(0 0 0 / 12%) !important;
    box-shadow: 0 1px 5px 0 rgb(0 0 0 / 16%), 0 1px 5px 0 rgb(0 0 0 / 12%) !important;
    transition: transform 0.35s ease;
}

.qrcode-wrap.large>canvas {
    width: 20rem;
}

.qrcode-wrap.small>canvas {
    width: 8rem;
    padding: 0.4rem;
}

.qrcode-wrap.rem9>canvas {
    width: 9rem;
}

.qrcode-wrap.rem10>canvas {
    width: 10rem;
}

#qrCodeContent {
    pointer-events: none;
}

#qrCodeContent.qrcode-wrap>canvas:hover {
    transform: none;
}

.qrcode-wrap>canvas:hover {
    transform: scale(1.1);
    cursor: zoom-in;
}

@media (max-width: 767px) {
    .qrcode-wrap.has-label {
        padding: 4.5rem 0;
    }
}

/** -------------- / QR Code --------------  **/

/** -------------- Navigation --------------  **/
.navigation {
    width: 100%;
    margin-top: 1.6rem;
    padding-top: 1.6rem;
    padding-bottom: 1.6rem;
    border-top: 1px solid #dee2e6;
}

.navigation .loading-wrap,
.navigation .finish-wrap,
.navigation .button-wrap {
    height: 5rem;
}

.navigation.loading,
.navigation.finish {
    border-top: 0;
}

.navigation.finish {
    margin-top: 0;
}

.navigation .loading-wrap,
.navigation .finish-wrap,
.navigation.loading .button-wrap,
.navigation.finish .button-wrap {
    display: none;
}

.navigation.loading .loading-wrap {
    display: block;
}

.navigation.finish .finish-wrap {
    display: block;
}

/** -------------- / Navigation --------------  **/

/** -------------- Upload Section --------------  **/
.upload-section .uploadzone {
    font-size: 16px;
    background: white;
    box-sizing: border-box;
}

.default-section,
.preview-section {
    position: relative;
    display: none;
    vertical-align: middle;
    text-align: center;
    margin: .5rem;
}

.uploadzone .preview-section.active {
    display: block;
}

.uploadzone .default-section {
    display: block;
    cursor: pointer;
}

.uploadzone.preview .default-section {
    display: none;
}

.default-section .default-image {
    padding: 1rem;
    max-height: 20rem;
    margin: auto;
}

.preview-section .upload-image {
    padding-top: 1rem;
    overflow: hidden;
    width: inherit;
    height: inherit;
    position: relative;
    display: inline-block;
    z-index: 10;
}

.preview-section .upload-image img {
    max-height: 20rem;
    max-width: 50rem;
    border-radius: .4rem;
}

.uploadzone.preview.mutiple {
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-flow: wrap;
    flex-flow: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    min-height: 230px;
}

.uploadzone.preview.mutiple .uploadzone.preview .preview-section {
    display: inherit;
    align-self: stretch;
    flex: 1 1 auto;
    justify-content: center;
    align-items: center;
}

.uploadzone.preview.mutiple .preview-section .upload-image {
    padding-bottom: 0;
}

.uploadzone.preview.mutiple .preview-section .upload-image img {
    height: 130px;
}

.uploadzone.preview .preview-section .remove-image {
    position: absolute;
    cursor: pointer;
    display: block;
    font-size: 1.2rem;
    width: 3rem;
    top: 1.5rem;
    right: 1rem;
    z-index: 9999;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 0.3rem;
    border-radius: 3px;
}

.uploadzone.preview .preview-section .remove-image .qbc-font {
    color: black;
    font-size: 1.4em;
}

.preview-section:hover .upload-image img {
    -webkit-transform: scale(1.01, 1.01);
    -moz-transform: scale(1.01, 1.01);
    -ms-transform: scale(1.01, 1.01);
    -o-transform: scale(1.01, 1.01);
    transform: scale(1.01, 1.01);
    -webkit-filter: blur(3px);
    filter: blur(3px);
}

.preview-section .upload-details {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    font-size: 1rem;
    padding: 2em 1em;
    margin: auto;
    opacity: 0;
    color: rgba(0, 0, 0, 0.9);
    -webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -ms-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    transition: opacity 0.2s linear;
}

.preview-section:hover .upload-details {
    opacity: 1;
    margin: auto;
    width: 80%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.preview-section:hover .upload-details .up-size,
.preview-section:hover .upload-details .up-filename {
    background-color: rgba(255, 255, 255, 0.4);
    padding: 0.3em;
    border-radius: 3px;
    margin-bottom: .3em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn-section {
    position: relative;
    text-align: center;
    border-top: 1px solid #f2f2f2;
    margin-top: .5rem;
    margin-bottom: .5rem;
    padding-top: .5rem;
}

.upload-btn-action a.btn {
    padding-top: .5rem;
}

.mini-upload .icon-wrap {
	width: 15rem;
	height: 15rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px dashed #a3a3a3;
	border-radius: 5px;
	transition: .3s ease-in-out;
}

.mini-upload .icon-wrap.invalid {
	border: 1px dashed #dc3545;
}

.mini-upload .icon-wrap.invalid~.invalid-message {
	display:block;
}

.mini-upload .icon-wrap:hover,
.mini-upload .icon-wrap:focus {
	background: #e9eef1a6;
	-webkit-box-shadow: 0px 0px 10px 0 rgb(0 0 0 / 16%), 0px 1px 8px 0 rgb(0 0 0 / 12%) !important;
	box-shadow: 0px 0px 10px 0 rgb(0 0 0 / 16%), 0px 1px 8px 0 rgb(0 0 0 / 12%) !important;
}

.mini-upload .preview-container {
	width: 15rem;
	height: 15rem;
	position: relative;
	align-items: center !important;
	display: flex !important;
}

.mini-upload .uploadzone.preview,
.mini-upload .uploadzone.preview.mutiple {
	min-height:auto!important;
	display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    justify-content: start!important;
}


.mini-upload .uploadzone.preview > div{
	margin-left:1rem;
	margin-right:1rem;
}

.mini-upload .uploadzone.preview div.default-section{
	display:block;
}

.mini-upload .preview-section .upload-image{
	width: 15rem;
    height: 15rem;
    padding:.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #a3a3a3;
    border-radius: 5px;
    transition: .3s ease-in-out;
}
.mini-upload .preview-section .upload-image img {
	max-width: 14rem!important;
	max-height: 14rem!important;
	height: auto!important;
    margin: auto!important;
}

.mini-upload .uploadzone.preview .preview-section .remove-image{
    font-size: 1.4rem;
    top: 0!important;
	right: 0!important;
    background-color: rgb(199 199 199 / 80%)!important;
}

@media (max-width: 767px) {
    .uploadzone .preview-section.mutiple:last-child {
        margin-bottom: 1rem;
    }

    .btn-section .btn-other-upload {
        width: 350px;
        font-size: 20px;
    }

    .default-section .default-image {
        max-height: 16rem;
    }

    .preview-section .upload-image img {
        max-height: 16rem;
    }
}

/** -------------- / Upload Section --------------  **/

/** -------------- Countdown --------------  **/
.tick {
    width: 50%;
    max-width: 280px;
    padding-top: 1rem;
    font-size: 1rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.tick>div {
    font-size: 3.2rem !important;
}

.tick-label {
    font-size: .435em;
    text-align: center;
    font-weight: 700;
}

.tick-group {
    margin: 0 .25em;
    text-align: center;
}

.tick .tick-credits {
    display: none;
}

.tick-flip-panel-back-text,
.tick-flip-panel-front-text {
    font-weight: 700;
}

@media (max-width: 767px) {
    .tick {
        width: 100%;
        max-width: 300px;
        padding-top: 2rem;
    }
}

.qbc-countdown {
    position: relative;
    font-size: 1.6rem;
    color: #212121;
}

.qbc-countdown.expired {
    color: #f55a00;
}

.qbc-countdown ul {
    margin: 0;
    display: inline-flex;
    padding: 0;
}

.qbc-countdown li {
    display: inline-block;
    list-style-type: none;
    padding: 0 .3rem;
    text-transform: uppercase;
}

.qbc-countdown li .unit {
    font-size: .65em;
    color: #626262;
    font-weight: 500;
    margin-left: .5rem;
}

/** -------------- / Countdown --------------  **/

/** -------------- Notice --------------  **/
.qbc-load-page>.container {
    padding: 0;
}

.btn.tag {
    min-width: 150px;
}

.btn.tag.all {
    color: #212121 !important;
    border: 2px solid #212121 !important;
}

.btn.tag.notice {
    color: #66BDF2 !important;
    border: 2px solid #66BDF2 !important;
}

.btn.tag.blog,
.btn.tag.release {
    color: #6C63FF !important;
    border: 2px solid #6C63FF !important;
}

.btn.tag.campaign {
    color: #F9619F !important;
    border: 2px solid #F9619F !important;
}

.btn.tag.all.active {
    color: #fff !important;
    background-color: #212121 !important;
}

.badge.tag {
    padding: .8em .4em;
    line-height: 1;
    min-width: 110px;
}

.badge.tag.notice,
.btn.tag.notice.active {
    color: #fff !important;
    background-color: #66BDF2 !important;
}

.badge.tag.blog,
.badge.tag.release,
.btn.tag.blog.active,
.btn.tag.release.active {
    color: #fff !important;
    background-color: #6C63FF !important;
}

.badge.tag.campaign,
.btn.tag.campaign.active {
    color: #fff !important;
    background-color: #F9619F !important;
}

/** -------------- / Notice --------------  **/

/** -------------- Breadcrum --------------  **/

.breadcrum-wrap {
    background: #fdfdfd;
}

.breadcrum-wrap .breadcrumb {
    background: transparent;
    margin-bottom: 0;
    padding: 1rem 1.6rem;
    padding-left: 0;
    padding-right: 0;
    font-size: 1.2rem;
}

.breadcrum-wrap .breadcrumb a:hover {
    text-decoration: underline !important;
}

.breadcrumb-item.active {
    color: #484848;
}

/** --------------/ Breadcrum --------------  **/

/** -------------- Banner --------------  **/
.bg-banner-0 {
    background-image: url('/img/scoupon/banner1-e6c7f5b084e08ad5d64a334ecc75b22f.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-banner-1 {
    background-image: url('/img/scoupon/banner2-726d032fce72ef8413a46e02c443a236.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-banner-2 {
    background-image: url('/img/scoupon/banner3-63136548d5cc1dea49aa618f9193c2d0.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-banner-3 {
    background-image: url('/img/scoupon/banner4-cf31d0a16bb813e8847ba68ce157fd7d.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-banner-4 {
    background-image: url('/img/scoupon/banner5-27cb729fc55665da9273606a34a9910c.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-banner-5 {
    background-image: url('/img/scoupon/banner6-1355f864e37249fd4307ee1da951d243.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-topslide-0 {
    background-image: url('/img/contest/topslider0-538dc9cd34ca76e9df757971c7d09f6f.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-topslide-1 {
    background-image: url('/img/contest/topslider1-93570b435f732b16b26825a9830b0703.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
/** -------------- / Banner --------------  **/

/** -------------- / Bank Card --------------  **/
.bankCardImg {
    width: 400px;
    position: relative;
    margin: 0 auto;
}

.bankCardImg .img-element {
    position: absolute;
    font-size: 1.8rem;
    letter-spacing: 2px;
    text-shadow: -1px 0 #bdbdbd, 0 -1px #858585, 1px 0 #404040, 0 1px #9b9b9b;
    background: -moz-linear-gradient(45deg, #BDC0C2, #E9EAEA 50%, #BDC0C2);
    background: -webkit-linear-gradient(45deg, #BDC0C2, #E9EAEA 50%, #BDC0C2);
    background: linear-gradient(45deg, #BDC0C2, #E9EAEA 50%, #BDC0C2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bankCardImg.yccard .accountNo {
    top: 140px;
    left: 110px;
}

.bankCardImg.yccard .seriesCode {
    top: 185px;
    left: 110px;
}

@media (max-width: 767px) {
    .bankCardImg {
        width: 300px;
    }

    .bankCardImg .img-element {
        font-size: 1.6rem;
    }

    .bankCardImg.yccard .accountNo {
        top: 105px;
        left: 60px;
    }

    .bankCardImg.yccard .seriesCode {
        top: 138px;
        left: 60px;
    }
}

/** -------------- / Bank Card --------------  **/

/** -------------- Riboon --------------  **/
.ribbon-wrap {
    text-align: center;
}

.qbc-ribbon {
    --d: 5px;
    /* folded part */
    --c: #ff1f1f;
    /* color */
    --f: 11px;
    /* ribbon font-size */
    position: relative;
}

.qbc-ribbon::after {
    content: attr(data-ribbon);
    position: absolute;
    font-size: var(--f);
    top: 0;
    right: 0;
    min-width: 100px;
    max-width: 140px;
    max-height: 60px;
    transform: translate(29.29%, -100%) rotate(45deg);
    color: #fff;
    text-align: center;
    border: 1px solid transparent;
    border-bottom: 0;
    transform-origin: bottom left;
    padding: 5px 28px calc(var(--d) + 5px);
    background: linear-gradient(rgba(0, 0, 0, 0.5) 0 0) bottom/100% var(--d) no-repeat var(--c);
    background: -webkit-linear-gradient(to right, #ff4928, #f51044);
    background: linear-gradient(to right, #ff4928, #f51044);
    background-clip: padding-box;
    clip-path: polygon(0 0, 100% 0, 100% 100%, calc(100% - var(--d)) calc(100% - var(--d)), var(--d) calc(100% - var(--d)), 0 100%);
    -webkit-mask: linear-gradient(135deg, transparent calc(50% - var(--d) * 0.707), #fff 0) bottom left, linear-gradient(-135deg, transparent calc(50% - var(--d) * 0.707), #fff 0) bottom right;
    -webkit-mask-size: 300vmax 300vmax;
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    z-index: 3;
}

.qbc-ribbon.ribbon-mw130::after {
  min-width: 130px;
}

.qbc-ribbon.left::after {
    left: 0;
    right: auto;
    transform: translate(0, 145%) rotate(-45deg);
}

.qbc-ribbon.mw180::after {
    max-width: 180px
}

.qbc-ribbon.mw140::after {
    max-width: 140px
}

.qbc-ribbon.left::before {
    left: 0;
    right: auto;
    transform: translate(-29.29%, -100%) rotate(-45deg);
    transform-origin: bottom right;
}

.qbc-ribbon2 {
    display: inline-block;
    position: relative;
    height: 45px;
    text-align: center;
    box-sizing: border-box;

    -webkit-animation: main 250ms;
    -moz-animation: main 250ms;
    -ms-animation: main 250ms;
    animation: main 250ms;
}


.qbc-ribbon2:before {
    /*左側のリボン端*/
    content: '';
    position: absolute;
    width: 10px;
    bottom: -25px;
    left: -35px;
    z-index: -2;
    border: 25px solid #3ca8ff;
    border-left-color: transparent;
    /*山形に切り抜き*/

    -webkit-animation: back 600ms;
    -moz-animation: back 600ms;
    -ms-animation: back 600ms;
    animation: back 600ms;
    -webkit-transform-origin: 100% 0;
    -moz-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.qbc-ribbon2:after {
    /*右側のリボン端*/
    content: '';
    position: absolute;
    width: 10px;
    bottom: -25px;
    right: -35px;
    z-index: -2;
    border: 25px solid #3ca8ff;
    border-right-color: transparent;
    /*山形に切り抜き*/

    -webkit-animation: back 600ms;
    -moz-animation: back 600ms;
    -ms-animation: back 600ms;
    animation: back 600ms;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
}

.qbc-ribbon2 .ribbon-text {
    display: inline-block;
    position: relative;
    margin: 0;
    padding: 1rem 2rem;
    line-height: 1.5;
    font-weight: 600;
    color: #FFF;
    background: #0091ea;
    min-width: 300px;
    /*真ん中の背景色*/
}

.qbc-ribbon2 .ribbon-text:before {
    position: absolute;
    content: '';
    top: 100%;
    left: 0;
    border: none;
    border-bottom: solid 10px transparent;
    border-right: solid 15px #397eb5;
    /*左の折り返し部分*/

    -webkit-animation: edge 500ms;
    -moz-animation: edge 500ms;
    -ms-animation: edge 500ms;
    animation: edge 500ms;
}

.qbc-ribbon2 .ribbon-text:after {
    position: absolute;
    content: '';
    top: 100%;
    right: 0;
    border: none;
    border-bottom: solid 10px transparent;
    border-left: solid 15px #397eb5;
    /*右の折り返し部分*/

    -webkit-animation: edge 500ms;
    -moz-animation: edge 500ms;
    -ms-animation: edge 500ms;
    animation: edge 500ms;
}

/* animations */
@-webkit-keyframes main {
    0% {
        -webkit-transform: scaleX(0);
    }

    100% {
        -webkit-transform: scaleX(1);
    }
}

@-webkit-keyframes edge {

    0%,
    50% {
        -webkit-transform: scaleY(0);
    }

    100% {
        -webkit-transform: scaleY(1);
    }
}

@-webkit-keyframes back {

    0%,
    75% {
        -webkit-transform: scaleX(0);
    }

    100% {
        -webkit-transform: scaleX(1);
    }
}


@-moz-keyframes main {
    0% {
        -moz-transform: scaleX(0);
    }

    100% {
        -moz-transform: scaleX(1);
    }
}

@-moz-keyframes edge {

    0%,
    50% {
        -moz-transform: scaleY(0);
    }

    100% {
        -moz-transform: scaleY(1);
    }
}

@-moz-keyframes back {

    0%,
    75% {
        -moz-transform: scaleX(0);
    }

    100% {
        -moz-transform: scaleX(1);
    }
}


@keyframes main {
    0% {
        transform: scaleX(0);
    }

    100% {
        transform: scaleX(1);
    }
}

@keyframes edge {

    0%,
    50% {
        transform: scaleY(0);
    }

    100% {
        transform: scaleY(1);
    }
}

@keyframes back {

    0%,
    75% {
        transform: scaleX(0);
    }

    100% {
        transform: scaleX(1);
    }
}

@media (max-width : 767px) {

    .qbc-ribbon2:before,
    .qbc-ribbon2:after {
        content: none;
    }
    
    .qbc-ribbon {
     --f: 10px;
	}
}

/** -------------- / Riboon --------------  **/

/** -------------- Article --------------  **/

.article h5.title {
    border-bottom: 1px solid #0091ea;
    border-top: 1px solid #0091ea;
    margin-bottom: 2rem;
}

.article h5>.pure-title {
    font-weight: 600;
    padding-left: 1.5rem;
    margin-bottom: 1.5rem;
    margin-top: 1.5rem;
    margin-left: 1.5rem;
}

.article h6.title {
	font-size:1.8rem;
    font-weight: 600;
    border-bottom: 1px solid #dee2e6 !important;
    padding: 1.5rem;
    background-color: #f1f2f3 !important;
}

.article h5>.pure-title {
    font-weight: 600;
    margin-bottom: 1.5rem;
}

.article ul.list-group-flush>li:last-child {
    border-bottom: none !important;
}

.article ul.list-unstyled {
	padding-left: 2.2rem;
    list-style: none;
}

.article p,
.article ol,
.article ul {
	font-size: 1.5rem;
    line-height: 3rem;
}

.article.policy div.sub-title {
	font-weight: 600;
	padding:1rem 1.6rem;
	margin-bottom: .6rem;
	border-bottom: 1px solid #eaeaea;
}

.article.policy p {
	padding-left:1.6rem;
}

/** -------------- / Article --------------  **/

/** -------------- Corprate --------------  **/
.cor-img {
    height: 35rem;
    width: 35rem;
    border-radius: 50%;
    padding: 0.2rem;
    margin: 0 auto;
}

.cor-img img {
    width: 100%;
    height: auto;
}

.bg-corp {
    background: url(/img/top/pfx-biz-bg-b8a3154e00a3560f632c56259153570b.jpg);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: space;
}

.bg-supportdial {
    background: url(/img/corporate/pfx-newweb-ba-supportdial-bg-df4a99fa26cf239b241b1c3fb34be844.jpg);
    background-repeat: space;
    background-size: cover;
}

.border-arrow {
    position: relative;
    display: inline-block;
    margin: 6.5rem 0;
    width: 100%;
    border-bottom: solid 4px #212121;
    box-sizing: border-box;
}

.border-arrow:before {
    content: "";
    position: absolute;
    border: 26px solid transparent;
    border-top: 26px solid #fff;
    z-index: 2;
    top: -2px;
    left: 50%;
    transform: translateX(-50%);
}

.border-arrow:after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    border: 30px solid transparent;
    border-top: 30px solid #212121;
    z-index: 1;
}

.text-title-underline {
    position: relative;
    display: inline-block;
}

.text-title-underline::before {
    position: absolute;
    height: 4px;
    left: 0;
    display: block;
    content: "";
    width: 100%;
    bottom: -12px;
    background: #0091ea;
    border-radius: 0 2px 2px 0;
}

.title-bar {
    border-bottom: 4px solid #dee2e6;
    position: relative;
}

.bg-supportdial {
    background-position-y: top;
}

.bg-primary-light {
    background-color: #65bcf2;
}

.text-highlight {
    background: linear-gradient(to bottom, #ffb01e59, #ffa500);
    height: 15px;
    line-height: 0;
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: 100% 45%;
}

.text-highlight.lighter {
    background: linear-gradient(to bottom, #ffb01e59, #ffd587) bottom right / 100% 45% no-repeat !important;
}

.bg-oblique-blue {
    background: #fff;
    background: linear-gradient(174deg, #fff 25%, #65bcf2 25.1% 50%, #65bcf2 50.1% 65%, #fff 65.1%);
}

@media only screen and (max-width : 992px) {
    .bg-supportdial {
        background-position: 60%;
    }
}

@media(max-width:575.98px) {
    .cor-img {
        height: 30rem;
        width: 30rem;
    }

    .bg-supportdial {
        background-position: 20%;
    }
    
    .text-title-underline {
		display:block;
	}
}

/** -------------- Corprate --------------  **/

/** -------------- list filter --------------  **/
.filter-wrap .filter-controls {
    width: 100%;
    overflow-x: auto;
    padding-bottom: .8rem;
    margin-bottom: 2.6rem;
}

.filter-controls.btn-group .btn.btn-filter {
    font-size: 1.6rem;
    min-width: 180px;
    margin: 0;
    padding: 1.6rem;
    font-weight: bold;
    border: 2px solid #0091ea;
    border-right: 0;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.filter-controls.btn-group .btn.btn-filter.sm.service-type {
    border-color:#dee2e6;
    padding: 0.8rem 1.6rem;
    font-weight: 500;
}

.btn-filter.sm.service-type.active,
.btn-filter.sm.service-type:active,
.btn-filter.sm.service-type:focus,
.btn-filter.sm.service-type:hover {
    color: #ffff;
    background-color: #23b4f5;
    font-weight: 600 !important;
    border-color: #23b4f5 !important;
}

.filter-controls.btn-group .btn.btn-filter:first-of-type {
    border-top-left-radius: .5rem;
    border-bottom-left-radius: .5rem;
}

.filter-controls.btn-group .btn.btn-filter:last-of-type {
    border-right: 2px solid #0091ea;
    border-top-right-radius: .5rem;
    border-bottom-right-radius: .5rem;
}

.btn-filter:focus,
.btn-filter:active,
.btn-filter.active {
    color: #fff;
    background-color: #0091ea;
}

.btn-filter:hover {
    color: #212121;
    background-color: #f2f2f2;
}

.filter-wrap .filter-item {
    display: none;
    margin-bottom: 2.8rem;
}

.filter-wrap .filter-item.show {
    display: block;
}

@media(max-width:768px) {
    .filter-controls.btn-group .btn.btn-filter {
        min-width: 180px;
    }
}

/** -------------- list filter --------------  **/

/** Common  **/
.note-label:before {
    content: "※";
    padding-right: 2px;
    font-size: 1rem;
}

.disc-label:before {
    content: "・";
    padding-right: 2px;
    font-size: 1rem;
    font-weight: 600;
}

.cursor-not-allowed {
    cursor: not-allowed !important;
}

.cursor-default {
    cursor: default !important;
}

.num-ls {
    letter-spacing: .25rem;
}

.text-3d {
    text-shadow: #000 2px 2px 6px;
}

.text-3d-light {
    text-shadow: #c9c9c9 2px 2px 6px;
}

.text-black {
	color:#000;
}

.add-info {
    color: #0091ea !important
}

.minus-info {
    color: #ff3547 !important;
}

.invalid-info {
    color: #c5c5c5 !important;
}

.sticky-footer,
.sticky-download {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1030;
    width: 100%;
    padding: 1.6rem 0;
    background-color: #eaf6fde8;
    min-height: 50px;
}

.sticky-footer.inner {
    padding-left: 320px;
}

.sticky-footer .btn-close {
    top: -1rem;
    color: #8b8b8b;
}

.sticky-footer .btn-top-right {
    top: -2.5rem;
    right: .8rem;
    color: #8b8b8b;
    transform: none;
}

.sticky-flex {
    display: flex;
}

.date-format {
    color: #0091ea;
}

#recaptcha2 {
    margin-bottom: 2.4rem;
}

#recaptcha2:empty {
    margin-bottom: 0;
}

.tooltip {
    z-index: 1029;
}

#pcoin-card .tooltip {
   z-index: 1020;
}

.tooltip.black-tooltip.show
.tooltip.red-tooltip.show {
    opacity: 1;
}

.tooltip.bs-tooltip-top.black-tooltip,
.tooltip.bs-tooltip-top.red-tooltip {
    top: -20px !important;
}

.red-tooltip .arrow::before {
    border-top-color: red !important;
}

.black-tooltip .arrow::before {
    border-top-color: black !important;
}

.red-tooltip .tooltip-inner {
    background: red;
}

.black-tooltip .tooltip-inner {
    background: black;
}

.accOpenNavCol.col-12 .card.block-card {
    background: #fff5d3 !important;
}

.corp-owner-required::before {
    content: "※";
    display: block;
    position: absolute;
    color: red;
    left: 5px;
    z-index: 1;
}

#language .row .checked {
    background: linear-gradient(to right, #c3b6b6 30%, #a0ecff);
}

#language .row .checked::after {
    position: absolute;
    content: ' ';
    width: 10px;
    height: 10px;
    right: 2.2rem;
    bottom: 0.8rem;
    border-radius: 50%;
    -webkit-box-shadow: 0px 2px 4px 0 rgb(0 0 0 / 18%), 0px 2px 3px 0 rgb(0 0 0 / 15%);
    box-shadow: 0px 2px 4px 0 rgb(0 0 0 / 18%), 0px 2px 3px 0 rgb(0 0 0 / 15%);
    background: -webkit-gradient(radial, center center, 0, center center, 100, from(#ffffff), to(#006c88));
    background: -webkit-radial-gradient(center, circle cover, #ffffff, #006c88);
    background: -moz-radial-gradient(center, circle cover, #ffffff, #006c88);
    background: -o-radial-gradient(center, circle cover, #ffffff, #006c88);
    background: radial-gradient(#ffffff, #006c88);
}

.hoverable:hover {
    -webkit-box-shadow: 0 8px 17px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%) !important;
    box-shadow: 0 8px 17px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%) !important;
    -webkit-transition: all 0.55s ease-in-out !important;
    transition: all 0.55s ease-in-out !important;
}

.copy-wrap {
    cursor: pointer;
}

.diagonal-container {
    --dcolor: #000;
    --dsize: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--dcolor);
}

.diagonal-container.text-orange {
    --dcolor: #ff3800;
}

.diagonal-container.sm {
    --dsize: 40px;
}

.diagonal-container.xsm {
    --dsize: 30px;
}

.diagonal-text {
    font-weight: 600;
    text-align: center;
}

.diagonal {
    width: var(--dsize);
    height: var(--dsize);
    margin: 0;
    position: relative;
    overflow: hidden;
}

.diagonal:before {
    border-top: 2px solid var(--dcolor);
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: -50%;
    transform: rotate(66deg);
    transform-origin: 0 0;
}

.diagonal.right:before {
    right: 0;
    left: -50%;
    transform: rotate(-66deg);
    transform-origin: 100% 0;
}

@media(max-width:768px) {
    .sticky-flex {
        display: flex;
        -webkit-box-pack: center !important;
        -ms-flex-pack: center !important;
        justify-content: center !important;
    }

    .accOpenNavCol.col-12 {
        background: #fff5d3 !important;
    }

    .accOpenNavCol.col-12 .card.block-card {
        border: 0;
    }
}

@media(max-width:1366.98px) {
    .sticky-footer.inner {
        padding-left: 0;
    }
}

/** / Common  **/

/** Animation  **/
.bubble {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.bubble li {
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    border-radius: 50% !important;
    background: #4facfe;
    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-linear-gradient(to top, rgba(79, 172, 254, 0.4), rgba(0, 242, 254, 0.4));
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background: linear-gradient(to top, rgba(79, 172, 254, 0.4), rgba(0, 242, 254, 0.4));
    animation: bubble 25s linear infinite;
    bottom: 0px;
    z-index: -99;
}

.bubble li:nth-child(1) {
    left: 15%;
    width: 80px;
    height: 80px;
    overflow: hidden;
    animation-delay: 0s;
}

.bubble li:nth-child(2) {
    left: 25%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.bubble li:nth-child(3) {
    left: 35%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.bubble li:nth-child(4) {
    left: 4%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 6s;
}

.bubble li:nth-child(5) {
    left: 50%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.bubble li:nth-child(6) {
    left: 75%;
    width: 85px;
    height: 85px;
    animation-delay: 6s;
}

.bubble li:nth-child(7) {
    left: 65%;
    width: 65px;
    height: 65px;
    animation-delay: 3s;
}

.bubble li:nth-child(8) {
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 5s;
    animation-duration: 45s;
}

.bubble li:nth-child(9) {
    left: 80%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.bubble li:nth-child(10) {
    left: 95%;
    width: 70px;
    height: 70px;
    animation-delay: 0s;
    animation-duration: 11s;
}

/** / Animation  **/

/** top view campaign  **/
.bg-campaign1 {
    background-color: #a2e6c9;
}

.bg-campaign2 {
    background-color: #fdf5e5;
}

#campaignCarousel .carousel-control-prev,
#campaignCarousel .carousel-control-next {
    top: 50%;
    color: #6e6c6c;
}

#campaignCarousel .carousel-item {
    transition-duration: 0.33s;
}

/**  /top view campaign  **/

.blockOverlay {
    border-radius: 1rem;
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    opacity: .6;
    z-index: 55;
    background-color: #cdcdcd;
    position: absolute;
}

.blockLoader-wrap {
    position: absolute;
    top: 0;
    display: flex;
    align-content: center;
    align-items: center;
    z-index: 66;
    height: 100%;
    width: 100%;
}

.blockLoader-wrap .loader {
    margin: 0 auto;
}

.line-scale-pulse-out>div {
    background-color: #3f6ad8;
    width: 4px;
    height: 35px;
    border-radius: 2px;
    margin: 2px;
    animation-fill-mode: both;
    display: inline-block;
    animation: line-scale-pulse-out .9s -.6s infinite cubic-bezier(.85, .25, .37, .85);
}

.line-scale-pulse-out>div:nth-child(1),
.line-scale-pulse-out>div:nth-child(5) {
    animation-delay: -.2s !important;
}

.line-scale-pulse-out>div:nth-child(2),
.line-scale-pulse-out>div:nth-child(4) {
    animation-delay: -.4s !important;
}

.line-scale-pulse-out>div:nth-child(3) {
    animation: line-scale-pulse-out .6s 0s infinite ease-in-out;
}

@keyframes line-scale-pulse-out {
    0% {
        transform: scaley(1);
    }

    50% {
        transform: scaley(.4);
    }

    100% {
        transform: scaley(1);
    }
}


/**  timeline  **/
ul.timeline.timeline-hstry {
    margin: 0;
}

.timeline-main .timeline.timeline-hstry li a,
.timeline-main .timeline.timeline-hstry li:not(:last-child):after {
    left: 40% !important;
}

.timeline-main .timeline.timeline-hstry li a .circle {
    width: 55px !important;
    height: 55px !important;
    background-color: #fff !important;
}

.timeline.timeline-hstry li .between-content {
    width: 100%;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.timeline.timeline-hstry li .between-content .date-content {
    width: 40%;
    text-align: right;
    padding-right: 50px;
    margin-top: 25px;
    margin-right: 50px;
}

.timeline.timeline-hstry li .between-content .date-content span {
    font-size: 1.8rem;
    font-weight: 500;
}

.timeline.timeline-hstry li .between-content .step-content {
    -webkit-box-flex: 1 !important;
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 1.6rem !important;
    width: auto;
    border-radius: 10px !important;
    padding: 2rem;
}

.timeline.timeline-hstry li.now .between-content .step-content {
    color: #fff;
    background: #00a6e5db;
    background: linear-gradient(40deg, #00a6e5db, #008adfde) !important;
}

.timeline-main .stepper.stepper-vertical.timeline li.now .step-content:after {
    border-right-color: #00a6e5db !important;
    border-left-color: #00a6e5db !important;
}

.timeline.timeline-hstry li .between-content .step-content .item-rslt {
    color: #6c757d;
    font-size: 2rem;
}

.timeline.timeline-hstry li.now .between-content .step-content .item-rslt {
    color: #fff;
    font-size: 2.4rem;
}

ul.timeline.timeline-hstry dl dd {
    margin-bottom: .4rem;
}

ul.timeline.timeline-hstry dl dd:last-of-type {
    margin-bottom: 0;
}

@media(max-width:768px) {
    ul.timeline.timeline-hstry {
        padding: 1.4rem;
    }

    .timeline-main .timeline.timeline-hstry li a,
    .timeline-main .timeline.timeline-hstry li:not(:last-child):after {
        left: 38% !important;
    }

    .timeline.timeline-hstry li .between-content .date-content {
        padding-right: 20px;
        margin-right: 20px;
        width: 35% !important;
    }

    .timeline.timeline-hstry li .between-content .date-content span {
        font-size: 1.6rem;
    }

    .timeline.timeline-hstry li .between-content .step-content {
        left: 0 !important;
        margin-left: 25px !important;
        width: 40% !important;
    }

    .timeline-main .timeline.timeline-hstry li a .circle {
        margin-left: -50px !important;
        width: 40px !important;
        height: 40px !important;
        line-height: 35px !important;
    }

    .timeline-main .timeline.timeline-hstry li a .circle img {
        width: 3.2rem !important;
    }
}

.bg-contest {
    background-image: url(/img/contest/winner_red_curtains-2dae6a97f2c905a439b03a381c43b28b.png);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: space;
}

.expired-stamp {
    transform: rotate(23deg);
    color: #555;
    font-size: 1.6rem;
    font-weight: 600;
    border: 0.25rem solid #555;
    display: inline-block;
    padding: 0.25rem 1rem;
    text-transform: uppercase;
    border-radius: 1rem;
    position: absolute;
    line-height: 1.8;
    bottom: 30%;
    right: 10%;
}

.pcoin-gradient {
  background-image: linear-gradient(25deg, #dcaf28 30%, #ebc21c 20%,
    #dcaf28 60%);
}

/** コメント **/
ul.ratings {
	padding-left: 0;
    list-style: none;
    margin-bottom:0;
}

ul.ratings li{
	display:inline;
}

ul.ratings li .fa-regular.fa-star{
	    color: #6c757d;
}

ul.ratings li .fa-regular.fa-star{
	    color: #6c757d;
}

ul.ratings li .fa-solid.fa-star,
ul.ratings li .fas.fa-star-half-stroke{
	color: #ffa500;
}

#channelCommentModal .modal-content.sp-content {
	max-height: 90vh;
}

.comment-body {
	height:55vh;
}

.comment-body .comment-content a {
	color:#0091ea;
}

.comment-footer {
	padding-top:2rem;
	padding-bottom:2rem;
	border:0;
	box-shadow: 0px 0px 13px #a6a6a680;
}

.comment-footer > *{
	margin:0;
}

.channel-icon {
	position: absolute;
    z-index: 9;
    top: 45%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.read-all {
	display:none;
	color: #0091ea;
    text-align: right;
    padding-right: 1rem;
    font-size: 1.4rem;
    font-weight: 400;
    cursor: pointer;
}

.read-all.active {
	display:block;
}

/** select view **/
.select-view {
	opacity:.6;
}
.select-view.selected{
	opacity:1;
}
.select-view.selected::after {
    font-family: "qbc-icons";
    content: "\e93a";
    -ms-flex-negative: 0;
    flex-shrink: 0;
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: #0091ea;
    font-size: 2.6rem;
    text-shadow: none;
    background-color: #fff;
    border-radius: 5rem;
    padding: 0rem 0.5rem 0;
    background: radial-gradient(circle at 49%, #fff, #fcfcfc 50%, #ffffff00 75%, #ffffff00 75%);
}

/** left-right Layout **/
.lr-layout {
     height: 100%;
}

.lr-layout .bg {
     position:relative;
}

.lr-layout .bg.gradient {
     background:linear-gradient(0deg, rgb(255, 252, 229) 0%, rgb(151, 213, 255) 65%);
}

.lr-layout .contents>.container {
	min-height: calc(100vh - 120px);
}

.lr-layout .bg>.container>.row {
	height: 100vh;
}
.lr-layout .bg {
     width: 40%;
     align-items:stretch;
}

.lr-layout .contents {
	width: 60%;
	min-height: 100vh;
}

 .lr-layout .bg {
     background-size: cover;
     background-position: center;
}

.lr-layout .bg .carousel {
	min-height:45vh;
}

.lr-layout .bg .carousel>.carousel-indicators{
	bottom:-30px;
}

 @media (max-width: 991.98px) {
    .lr-layout .contents>.container {
		min-height: calc(100vh - 140px);
	}
    
    .lr-layout .contents, .lr-layout .bg {
         width: 100%;
    }
    
    .lr-layout .bg {
         height:100vh;
    }
    
}

@media (max-width: 767px) {
    .lr-layout .contents, .lr-layout .bg img.img-fluid {
         max-width: 100%!important;
    }
}

/*avatar-group  */
.avatar-group {
  display: inline-flex;
  flex-direction: row-reverse;
}

.avatar-group .avatar-item {
  position: relative;
  border-radius: 50%;
  overflow: hidden;
  height: 4rem; 
  width : 4rem; 
  min-width : 4rem;
  box-shadow: 0 1px 5px 1px rgb(0 0 0/ 5%), 0 1px 5px 1px rgb(0 0 0/ 5%);
  padding: 0.2rem;
}

.avatar-group .avatar-item:not(:first-child) {
  margin-right: -60px;
}

.avatar-group .avatar-item img {
  width: 100%;
  height: 100%;
  display: block;
  margin: 0 auto;
}

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

/* Hide scrollbar for IE, Edge and Firefox */
.scrollbar-none {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/*arrow bot */
.arrow-dialog {
  margin: 20px auto;
  position: relative;
  width: 100%;
  height: auto;
  padding:0.5rem 0.8rem;
  background-color: #fb8058;
  color: #ffffff;
  font-weight: 500;
  border-radius: 50px;
  text-align: center;
  z-index: 2;
  line-height:1.2;
  -webkit-box-shadow: 0 1px 3px 0 rgb(0 0 0/ 5%), 0 1px 3px 0px
    rgb(0 0 0/ 5%);
  box-shadow: 0 1px 3px 0 rgb(0 0 0/ 5%), 0 1px 3px 0px rgb(0 0 0/ 5%);
}

.arrow-dialog.sm .top{
  bottom:15px;
}

.arrow-dialog .bot {
  position: absolute;
  width: 0;
  height: 0;
  border-width: 15px 13px;
  border-style: solid;
  right:46%;
}

.arrow-dialog .bot.sm {
  border-width: 10px 8px;
}
.arrow-dialog .bot.bottom{
  bottom:-28px;
  border-color:#fb8058 transparent transparent transparent;
}

.arrow-dialog .bot.top {
  bottom: 98%;
  border-color: transparent transparent  #fb8058 transparent;
}