main.main-wrapper {
    box-shadow: 0 0 4vw rgba(0, 0, 0, 0.2);
}

.primary-background {
    background: #0cb4d3 !important;
    color: #FFF !important;
}

.primary-border {
    border: 1px solid #0cb4d3 !important;
}

.primary-color {
    color: #0cb4d3 !important;
}

.primary-checkbox::after {
    border-right: 3px solid #0cb4d3 !important;
    border-bottom: 3px solid #0cb4d3 !important;
}

.primary-radio:after {
    background: #0cb4d3 !important;
}

.primary-radio:checked ~ dl {
    background: #0cb4d3 !important;
    color: #FFF !important;
}

.primary-tab-switch:checked + .tab-label {
    background: #0cb4d3;
    color: #FFF;
}

.primary80-border {
  border: solid 1px #30b8d2 !important;
}

.primary80-background {
    background: #30b8d2 !important;
    color: #fff;
}

.primary80-fill {
    fill: #30b8d2 !important;
}

.primary80-color {
    color: #30b8d2 !important;
}

.form form input:focus,
.form form select:focus,
.form form textarea:focus,
.searchForm form input:focus,
.searchForm form select:focus {
    border: 1px solid #30b8d2 !important;
}

.form form input:hover,
.form form select:hover,
.searchForm form input:hover,
.searchForm form select:hover {
    border: 1px solid #54c0d5 !important;
}

.form form input[type=checkbox]:focus + .checkbox::before,
.form form input[type=radio]:focus + .radio::before,
.searchForm form input[type=checkbox]:focus + .checkbox::before,
.searchForm form input[type=radio]:focus + .radio::before {
    border: 1px solid #54c0d5 !important;
}

.primary60-background {
    background: #6ec7e1 !important;
}

.primary60-border {
    border: 1px solid #6ec7e1 !important;
}

label:hover + dl.primary20-background-label-hover {
    background: #e5f8fc !important;
}

.gradationWrap {
    background: linear-gradient(180deg, #0cb4d3 0%, #54c0d5 100%) !important;
}

.primary20-border {
    border: 1px solid #e5f8fc !important;
}

.primary20-background {
    background: #e5f8fc !important;
}

dl.primary20-clicker.clicked,
dl.primary20-clicker:hover {
    background: #e5f8fc !important;
}

.primary20-radio:after {
    background: #e5f8fc !important;
}

.primary20-radio:checked ~ dl {
    background: #e5f8fc !important;
}

.ticket-background {
    background: #eee;
}

.primary-background.topStatus::before {
    border-color: transparent #30b8d2 transparent transparent;
}

.primary20-background.topStatus::before {
    border-color: transparent #54c0d5 transparent transparent;
}

.secondary-background {
    background: #232323 !important;
    color: #FFF !important;
}

.secondary-border {
    border: 1px solid #232323 !important;
}

.secondary-color {
    color: #232323 !important;
}

.secondary60-border {
    border: 1px solid #aaa !important;
}

.secondary40-background {
    background: #A7A7A7 !important;
    color: #FFF !important;
}

#header-logo {
    height: 50px !important;
    width: 170px;
}

header a {
    padding: 0.4em 1em;
    border-radius: 5px;
    cursor: pointer;
    transition:
      transform 0.2s ease,
      opacity 0.2s ease;
}

header a:hover {
    transform: scale(1.03);
    opacity: 0.9;
    transition:
      transform 0.2s ease,
      opacity 0.2s ease;
}

header a.purchased {
    display: flex !important;
    max-width: 136px;
    height: 46px;
    font-size: 14px;
    text-align: center;
    align-items: center;
}

body.base-bg {
    background: url(/static/scheme/exticket/ticket/common-img/bg.png) repeat center top #fafafa;
    background-size: 8px;
}

.main-content {
    margin: 80px auto;
    padding: 60px;
    background-color: #fff;
    box-shadow: 0 0 4vw rgba(0, 0, 0, 0.2);
    max-width: 800px;
}

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

.purchase .subject.margin-adjustment,
.purchase .subject__detail.margin-adjustment,
.purchase .centerTxt.margin-adjustment,
.purchase .payment-section.margin-adjustment {
    margin: 0;
}

.purchase .subject .text.margin-adjustment {
    margin-top: 12px;
}

.purchase .detail.margin-adjustment {
    margin: 30px 0;
}

.purchase .detail .price-info {
    margin-top: 20px;
    text-align: left;
}

.purchase .subject__detail h1.page-title {
    margin-bottom: 24px;
    padding: 0 16px;
    display: inline-block;
    border-bottom: 3px solid #b2d5de;
    font-size: 24px;
    font-weight: bold;
}

.purchase .purchase-info {
    margin-top: 20px;
    text-align: left;
}

.purchase .purchase-info a {
    text-decoration: underline;
}

.order-notice-box {
    margin: 30px 0 24px;
    padding: 20px;
    border: 2px solid #b70000;
    border-radius: 5px;
}

.order-notice-box p {
    margin: 0;
}

.order-notice-box p.order-number-line {
    margin: 14px 0 0;
}

.order-number {
    color: #e00000;
    font-size: 16px;
    font-weight: bold;
}

.purchase .payment-section h3 {
    margin-bottom: 20px;
    padding-bottom: 8px;
    font-size: 18px;
    font-weight: bold;
    border-bottom: solid 2px #0cb4d3;
}

.purchase .payment-section .result {
    margin: 30px 0;
    padding: 15px 0;
    text-align: center;
    font-weight: bold;
    border: solid 2px #0cb4d3;
}

.payment-info table {
    font-size: 0.8rem;
    line-height: 0.8rem;
    border-spacing: 0.8rem 0;
    border-top: solid 1px #bbb;
    border-bottom: solid 1px #bbb;
    margin-bottom: 8px;
}

.ticketCard.box-shadow.payment-info-wrapper,
.ticketCard .ticketList.box-shadow {
    box-shadow: none;
}

.ticketCard .inner.margin-adjustment {
    margin-top: 26px;
}

.ticketCard .inner.padding-adjustment {
    padding: 0;
}

main.history-ticket h2 {
    margin: 20px 0 40px;
    text-align: center;
    font-size: 24px;
}

.history-ticket .tab-box .btn-list {
    display: flex;
    margin-bottom: 42px;
    font-weight: bold;
    border-bottom: solid 4px #0cb4d3;
}

.history-ticket .tab-box .btn-list li {
    min-width: 150px;
    margin-right: 5px;
}

.history-ticket .tab-box .btn-list li:last-child {
    margin-right: 0;
}

.history-ticket .tab-box .btn-list li a {
    display: inline-block;
    height: 100%;
    width: 100%;
    background: #555;
    text-align: center;
    color: #fff;
    text-decoration: none;
    border-radius: 5px 5px 0 0;
    padding: 12px 20px;
}

.history-ticket .mode-btn-box .btn-list {
    display: flex;
    margin-bottom: 42px;
    font-weight: 500;
}

.history-ticket .mode-btn-box .btn-list li {
    margin-right: 10px;
}

.history-ticket .mode-btn-box .btn-list li:last-child {
    margin-right: 0;
}

.history-ticket .mode-btn-box .btn-list li a {
    display: inline-block;
    background: #555;
    text-align: center;
    color: #fff;
    text-decoration: none;
    border-radius: 200px;
    padding: 10px 24px;
}

.history-ticket .tab-box .btn-list li a:hover,
.history-ticket .mode-btn-box .btn-list li a:hover {
    background: #333;
}

.history-ticket .tab-content-block .list-none {
    text-align: center;
}

.history-ticket .ticketCard {
    box-shadow: 5px 5px 20px 10px rgba(0, 0, 0, 0.2);
    margin-bottom: 40px;
    padding-top: 20px;
}

.history-ticket .ticketCard:before {
    content: "";
    display: block;
    position: absolute;
    top: -10px;
    width: 100%;
    height: 10px;
    margin-bottom: 100px;
}

.history-ticket .ticketCard:after {
    content: "";
    display: block;
    position: absolute;
    bottom: -10px;
    width: 100%;
    height: 10px;
}

.history-ticket .ticketCard .payment-title {
    display: flex;
    align-items: baseline;
}

.history-ticket .ticketCard .payment-title .status {
    position: static;
    margin-left: 10px;
    white-space: nowrap;
    transform: translateY(-2px);
}

.history-ticket .ticketCard .payment-title .title {
    display: inline-block;
    margin-left: 10px;
    font-size: 18px;
    font-weight: bold;
    word-break: break-word;
}

.history-ticket .ticketCard .inner {
    margin-top: 14px;
}

.history-ticket .ticketCard .payment-sub-title span.label {
    margin-right: 10px;
    font-size: 15px;
}

.history-ticket .ticketCard .payment-sub-title span.name {
    font-weight: 500;
}

.history-ticket .ticketCard .event-info p {
    margin: 8px 0;
}

.history-ticket .ticketCard .end-text {
    margin: 12px auto;
    text-align: center;
}

.history-ticket .ticketCard .btn-group {
    display: flex;
    flex-direction: row;
}

.history-ticket .ticketCard .btn-group div{
    padding: 5px;
}

.ticketList.box-shadow {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);
}

.purchase .form .btn-wrap a.use-ticket-book-btn {
    margin-top: 10px;
}

main.transfer h2.title,
main.resale h2.title {
    margin: 20px 0;
    text-align: center;
    font-size: 20px;
}

.sp {
    display: none;
}

.next-none {
    display: none;
}

.exticket-only {
    display: none !important;
}

.guideNav .pageTitle {
    padding: 36px 0 10px;
}

.policy{
    padding-top: 16px;
}

.ticket-list-num-btn ul.list {
    display: flex;
    justify-content: center;
    padding-top: 40px;
    align-items: center;
}

.ticket-list-num-btn ul.list li {
    margin-right: 50px;
}

.ticket-list-num-btn ul.list li:last-child {
    margin-right: 0;
}

 .ticket-list-num-btn ul.list li a {
    display: inline-block;
    text-decoration: none;
    border-radius: 200px;
    padding: 10px 30px;
    position: relative;
    text-align: center;
 }

 .ticket-list-num-btn ul.list li.before a {
    padding-left: 40px;
 }

 .ticket-list-num-btn ul.list li.next a {
    padding-right: 40px;
 }

.ticket-list-num-btn ul.list li.before a:before {
    content: '\f053';
    font-weight: 300;
    font-family: FontAwesome;
    position: absolute;
    left: 20px;
    top: 54%;
    font-size: 11px;
    transform: translate(0%, -50%);
}

.ticket-list-num-btn ul.list li.next a:before {
    content: '\f054';
    font-weight: 300;
    font-family: FontAwesome;
    position: absolute;
    right: 20px;
    top: 54%;
    font-size: 11px;
    transform: translate(0%, -50%);
}

.ticket-list-num-btn ul.list li.number {
    font-weight: bold;
}

.opac {
    transition: 0.3s;
}

.opac:hover {
    opacity: 0.7;
  }

footer {
    padding-top: 54px;
    background: linear-gradient(-3deg, #fff 0 46%, transparent 46% 100%), #e9ecef !important;
}

footer .container {
    padding-bottom: 50px;
    width: 90%;
}

footer .footerLinkWrapper {
    margin-bottom: 10px;
}

footer .footerLink {
    margin: 0 auto;
    max-width: 850px;
    justify-content: center;
}

footer .footerLink li {
    border-right: solid 1px #777;
    height: 15px;
    line-height: 6px;
}

footer .footerLink li:last-child {
    border-right: none;
}

footer .footerLink li a {
    font-size: 13px;
    padding: 4px 20px;
}

footer .footer-logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
}

@media screen and (max-width: 835px) {
    body.base-bg {
        background-size: 2vw;
    }
}

@media screen and (max-width: 800px) {
    footer {
        padding-top: 40px;
        background: linear-gradient(-15deg, #fff 0 40%, transparent 40% 100%), #e9ecef !important;
    }
    footer .footerLinkWrapper {
        display: flex;
        justify-content: center;
        margin-bottom: 26px;
    }
    footer .footerLink {
        display: block;
        width: 50%;
        padding-left: 14vw;
    }
    footer .footerLink li {
        margin-bottom: 16px;
        border-right: none;
        height: auto;
        line-height: normal;
    }
    footer .footerLink li a {
        padding: 4px 0;
        font-size: 14px;
    }
}

@media screen and (max-width: 770px) {
    .main-content {
        margin: 60px auto;
        padding: 40px;
    }
}

@media (max-width: 768px) {
    .purchase .subject__detail .title-sub {
         font-size: 16px;
    }
}

@media screen and (max-width: 700px) {
    header a.purchased {
        height: 44px;
        font-size: 13px;
    }
}

@media screen and (max-width: 576px) {
    header a.purchased {
        max-width: 150px;
        height: 40px;
        font-size: 12px;
    }
    .main-content {
        margin: 12vw auto;
        padding: 8vw 3vw;
    }
    .purchase .subject__detail h1.page-title {
        margin-bottom: 16px;
        padding: 0 12px;
        font-size: 20px;
    }
    .purchase .subject__detail .title-sub {
         font-size: 14px;
    }
    .order-notice-box {
        margin-top: 20px;
        padding: 16px;
    }
    main.history-ticket h2 {
        margin: 20px 0 30px;
        font-size: 20px;
    }
    .history-ticket .ticketCard .btn-group {
        display: block;
    }
    .history-ticket .ticketCard .btn-group div {
        padding: 0;
    }
    .ticket-list-num-btn ul.list {
        padding-top: 20px;
    }
    .ticket-list-num-btn ul.list li {
        margin-right: 5vw;
    }
    .ticket-list-num-btn ul.list li a {
       padding: 10px 5vw;
    }
    .ticket-list-num-btn ul.list li.before a {
       padding-left: 7vw;
    }
    .ticket-list-num-btn ul.list li.next a {
       padding-right: 7vw;
    }
    .ticket-list-num-btn ul.list li.before a:before {
        left: 12px;
    }
    .ticket-list-num-btn ul.list li.next a:before {
        right: 12px;
    }
    footer .footerLink {
        padding-left: 10vw;
    }
    .sp {
        display: block;
    }
}

@media screen and (max-width: 500px) {
    .history-ticket .tab-box .btn-list li {
        min-width: 49.5%;
        margin-right: 1%;
    }
    footer .footerLink {
        padding-left: 6vw;
    }
}

.language-select {
    right: 180px !important;
}