/* ------------- 2021-12-17 sp-Plugins Web Design ------------- */
/* --------- social info --------- */
#social-info{
    position: fixed;
    max-width: 60px;
    top: 50%;
    right: 0;
    padding-right: 10px;
    transform: translateY(-50%);

    z-index: 999;
}
#social-info img{
    width: 100%;
}
#social-info .info-top,
#social-info .info-middle,
#social-info .info-bottom{
    position: relative;
    display: block;
}
#social-info .info-bottom{
    width: 90%;
    margin: auto;
}
#social-info .info-top .link ul.social-icons{
    margin: auto;
    margin-bottom: 10px;
}
#social-info .info-top .link ul.social-icons .social-icon{
    width: 40px;
    height: 40px;
    font-size: 24px;
    border: 0;
}
#social-info .info-middle .browsing-history p{
    position: relative;
    font-size: 12px;
    line-height: 1.2;
    color: #222;
    text-align: center;
    background-color: transparent;
    padding: 2px;
}
#social-info .info-middle .browsing-history p::before,
#social-info .info-middle .browsing-history p::after{
    content: '';
    position: absolute;
    top: 8px;
    display: inline-block;
    width: 5px;
    height: 1px;
    background-color: #999;
}
#social-info .info-middle .browsing-history p::before{
    left: -3px;
}
#social-info .info-middle .browsing-history p::after{
    right: -3px;
}
#social-info .info-middle .browsing-history ul{
    margin-bottom: 10px;
    background: #fff;
    padding: 3px;
}
#social-info .info-middle .browsing-history ul li{
    width: 44px;
    height: 44px;
    overflow: hidden;
}
#social-info .info-middle .browsing-history ul li:not(:last-child){
    margin-bottom: 3px;
}
#social-info a img{
    transition: all .3s ease;
}
#social-info a:hover img{
    transform: scale(1.2);
}



/* --------- table --------- */
/* RWD Tables */
  .pd-rtable,
  .member-voucher .pd-rtable{
    display: flex;
    flex-wrap: wrap;
    padding: 0;
  }
  .detail .pd-rtable {
    /* border-bottom: solid 1px #999; */
    padding: 20px 20px 0;
  }
  .detail .pd-rtable .title {
      display: none;
  }
  .pd-rtable-cell.th.name,
  .pd-rtable-cell.td.name,
  .member-voucher .pd-rtable-cell th.name
  .member-voucher .pd-rtable-cell td.name{
      width: 120px;
  }
  .pd-rtable-cell.th.num,
  .pd-rtable-cell.td.num{
      width: 150px;
  }
  .pd-rtable-cell.th:not(.name,.num),
  .pd-rtable-cell.td:not(.name,.num),
  .member-voucher .pd-rtable-cell.th:not(.name,.num),
  .member-voucher .pd-rtable-cell.td:not(.name,.num){
    box-sizing: border-box;
    width: calc( (100% - 270px) / 5 );
    overflow: hidden;
    list-style: none;
  }
  .member-voucher .pd-rtable-cell.th:not(.name,.num),
  .member-voucher .pd-rtable-cell.td:not(.name,.num){
    width: calc( 100%/ 4 );
  }
  .register .pd-rtable-cell.th:not(.name,.num),
  .register .pd-rtable-cell.td:not(.name,.num){
    width: calc( 100%/ 7 );
  }

  /* Table column sizing */
  .pd-rtable--2cols > .pd-rtable-cell {
    width: 50%;
  }
  .pd-rtable--3cols > .pd-rtable-cell {
    width: 33.33%;
  }
  .pd-rtable--4cols > .pd-rtable-cell {
    width: 25%;
  }
  .pd-rtable--5cols > .pd-rtable-cell {
    width: 20%;
  }
  .pd-rtable--6cols > .pd-rtable-cell {
    width: 16.6%;
  }

  /* Cell style */
  .pd-rtable ul,
  .member-voucher .pd-rtable ul{
    width: 100%;
    /* padding: 10px 0; */
    margin: 0;
  }
  .detail .pd-rtable ul{
      margin: 0;
  }
  .pd-rtable ul li.tr,
  .member-voucher .pd-rtable ul li.tr{
    display: flex;
    align-items: center;
    width: 100%;
  }
  .pd-rtable ul li.tr:first-child,
  .member-voucher .pd-rtable ul li.tr:first-child{
    background-color: transparent;
    border-bottom: solid 1px #ddd;
    border-radius: 0;
  }
  .detail .pd-rtable ul li.tr .list,
  .cart-detail .pd-rtable ul li.tr .list{
      display: contents;
  }
  .pd-rtable-cell{
    font-size: 15px;
    padding: 10px;
    text-align: center;
  }
  .pd-rtable-cell.th,
  .pd-rtable-cell.td a{
    color: #222;
    font-weight: bold;
    padding-top: 3px;
    padding-bottom: 3px;
  }
  .pd-rtable-cell.td a{
    cursor: pointer;
  }
  .pd-rtable-cell.th{
    color: #777;
    font-size: 14px;
  }
  .pd-rtable-cell.td,
  .member-voucher .pd-rtable-cell.td{
    padding: 20px 10px;
  }
  .member-voucher .pd-rtable-cell.td{
    padding-top: 10px;
  }
  .pd-rtable-cell.td p{
      display: inline-block;
      margin-bottom: 0;
  }
  .pd-rtable-cell.td button,
  .member-voucher .voucher-total li button{
      background-color: #999;
      color: #fff;
      border: 0;
      border-radius: 4px;
      padding: 0 10px;
      transition: all .3s ease;
  }
  .pd-rtable-cell.td button:hover{
      /* background-color: #fff; */
      color: #333;
  }
  .pd-rtable-cell.td button.return:hover{
    background-color: #333;
    color: #ddd;
  }
  .pd-rtable-cell.td.num a,
  .pd-rtable-cell.td.track a{
      position: relative;
  }
  .pd-rtable-cell.td.num a::after,
  .pd-rtable-cell.td.track a::after{
      font-family: "molla";
      content: '\f2ed';
      position: absolute;
      right: -15px;
  }
  .pd-rtable-cell.td.num a:hover{
      color: rgb(201, 187, 187);
  }
  .pd-rtable-cell.name span, 
  .pd-rtable-cell.td span{
    display: none;
  }
  .pd-rtable-cell.td i{
    position: relative;
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 5px;
  }
  .detail .pd-rtable ul li.tr:first-child{}
  .detail .pd-rtable ul li.tr:not(:first-child),
  .cart-detail .pd-rtable ul li.tr:not(.mainTitle){}
  .detail .pd-rtable-cell.name{
      width: 20%;
  }
  .detail .pd-rtable-cell:not(.name){
      width: calc( 80% / 7 );
  }
  .detail .pd-rtable-cell.td{
      padding: 10px;
  }
  .detail .pd-rtable-cell.td.name{
    text-align: left;
    line-height: 1.5;
  }



/* --------- coupon --------- */
.cart-info .coupon-info{
    display: block;
    height: 50px;
    text-align: right;
    margin-top: 20px;
}
.cart-info .coupon-info.new{
    text-align: unset;
    margin-top: 0;
}
.cart-info .coupon-info span{
    min-width: 100px;
    text-align: right;
}
.cart-info .coupon-info:not(.new) .coupon-btn{
    font-size: 15px;
    color: #777;
    display: inline-block;
    float: right;
    border-bottom: dashed 1px #777;
    clear: both;
}
.cart-info .coupon-btn:hover{
    cursor: pointer;
}
.cart-info .coupon-info .coupon{
    position: relative;
    float: right;
    display: none;
    clear: both;
}
.cart-info .coupon-info.new .coupon{
    position: relative;
    display: block;
    float: none;
    clear: none;
}
.cart-info .coupon form{
    display: flex;
    /* width: fit-content;
    width:-moz-fit-content;
    width:-webkit-fit-content; */
    /* width: 100%; */
    border: dashed 1px #999;
    padding: 10px;
    /* padding-left: 25px; */
    /* margin-left: 75px; */
    margin-right: 100px;
}
.cart-info .coupon.coupon.new form{
    border: none;
}
.cart-info .coupon form label{
    /* width: 72px; */
    margin: 0 0 0;
}

/* .cart-info .coupon form input, */
.cart-info .coupon form button.enter,
.cart-total .ct-discount .voucher-info button.enter{
    width: 40px;
    color: #fff;

    border: solid 1px #777;
    border-radius: 4px;
    background-color: #777;

    outline: none;
    transition: all .35s ease;
}
.cart-info .coupon form input,
.cart-total .ct-discount .voucher-info input{
    /* width: calc( 100% - 100px ); */
    width: 100%;
    min-width: 120px;
    border: solid 1px;
    border-color: transparent transparent #777 transparent;
    padding: 0 5px;
    margin-right: 7px;
    outline: none;
}
.cart-info .coupon form button.enter:hover,
.cart-total .ct-discount .voucher-info button.enter:hover{
  background-color: #222;
  border-color: #222;
}
.cart-total .ct-discount .voucher-info span:first-child{
    min-width: 100px;
    text-align: right;
}


/* --------- mix ---------*/
/* product-mix */
.product-details .accordion .card{
    border: 0.1rem solid rgb(235, 235, 235);
}
.product-details .accordion .card-title a.collapsed:before{
    content: '\f2c2';
}
.product-details .accordion .card-title a:before{
    content: '\f28e';
}
.product-details .accordion{
    margin-bottom: 0;
}
.product-details .accordion .card.card-sm .card-title a{
    padding: 20px 10px;
}
.product-details .accordion .card.card-sm .card-body{
    padding: 0 20px;
}
.product-details .accordion ul{
    position: relative;
}
.product-details .accordion ul,
.product-details .accordion ul li:not(:last-child){
    margin-bottom: 20px;
}
.product-details .accordion ul li,
.product-details .accordion ul li .mixInfo .mixDetail{
    display: flex;
}
.product-details .accordion ul li .mixImg{
    display: block;
    width: 150px;
    margin-right: 20px;
}
.product-details .accordion ul li .mixInfo{
    display: block;
    width: 100%;
}
.product-details .accordion ul li .mixInfo .mixTitle{
    line-height: 1.5;
    padding-bottom: 20px;
}
.product-details .accordion ul li .mixInfo .mixDetail select{
    margin-right: 5px;
    width: 100%;
}
.pd-rtable ul li.tr.mixProducts{
    position: relative;
    display: block;
    padding-left: 60px;
}
.cart-detail.register.payment .pd-rtable ul li.tr.mixProducts{
    padding-left: 0;
}
.pd-rtable ul li.tr.mixProducts .mixContent{
    display: flex;
    align-items: center;
}
.pd-rtable ul li.tr.mixProducts .mixContent .pd-rtable-cell.td.name.colspan{
    text-align: center;
    width: 61%;
}
.cart-detail.register.payment .pd-rtable ul li.tr.mixProducts .mixContent .pd-rtable-cell.td.name.colspan{
    width: 60%;
}
.pd-rtable ul li.tr.mixProducts .mixContent .pd-rtable-cell:not(.name,.remove) {
    width: calc( 100% / 7 );
}
.pd-rtable ul li.tr.mixProducts .mixContent .pd-rtable-cell:not(.name,.remove).colspan {
    width: 31%;
}
.pd-rtable ul li.tr.mixProducts .mixContent .pd-rtable-cell:not(.name,.remove).colspan select{
    width: 100%;
}
.mixContent img{
    width: 80px;
    margin: auto;
    margin-right: 0;
}
.mixContent .form-control[disabled]{
    background-color: transparent;
    border: 0;
}
.mixContent .form-control[disabled]+.input-spinner .input-group-prepend,
.mixContent .form-control[disabled]+.input-spinner .input-group-append{
    display: none;
}
.detail .pd-rtable ul li.tr.mixProducts,
.cart-detail .pd-rtable ul li.tr.mixProducts{
      /* background-color: #f9f9f9; */
}
.mixTitle::before{
    content: '－';
    padding-right: 5px;
}

/* REG */
.cart-detail .pd-rtable .register-list h4{
    color: #fff;
    font-size: 15px;
    background-color: #555;
    padding: 10px;
    margin-bottom: 0;
    border-radius: 4px;
}
.cart-detail .pd-rtable ul li.tr.mainTitle{
    border: solid 1px #ccc;
    background-color: #ccc;
    padding: 0px 0;
    border-radius: 4px;
}
.cart-detail .pd-rtable ul li.tr .pd-rtable-cell.checkbox,
.cart-detail .pd-rtable ul li.tr.mixCart .pd-rtable-cell.checkbox{
    position: relative;
    display: flex;
    width: 100%;
    max-width: 65px;
    padding: 0;
    align-items: center;
    justify-content: center;
}
.cart-detail .pd-rtable ul li.tr .pd-rtable-cell.th input[type=checkbox],
.cart-detail .pd-rtable ul li.tr .pd-rtable-cell.td input[type=checkbox],
.cart-detail .pd-rtable ul li.tr.checkbox label input[type=checkbox]{
    width: 18px;
    height: 18px;
    line-height: 2;
    border-radius: 0;
}
.cart-detail .pd-rtable ul li.tr .pd-rtable-cell.th input[type=checkbox]{
    position: relative;
    top: 0px;
    margin-left: 5px;
}
.cart-detail .pd-rtable ul li.tr .pd-rtable-cell.th input[type=checkbox] + input:checked{
    background-color: #b52727;
}
.cart-detail .pd-rtable ul li.tr.checkbox{
    display: none;
}

  .checkbox input {
    position: relative;
    left: 0;
    top: 0;
    display: inline-block;
    height: 18px;
    width: 18px;
    margin-left: 0!important;
  }
  .checkbox svg{
    position: absolute;
    left: 40%;
    top: 0px;
    display: inline-block;
    height: 18px;
    width: 18px;
  }
  .pd-rtable-cell.th .checkbox svg{
    left: unset;
    right: 21%;
    top: 5px;
  }



/* --------- voucher --------- */
.cart-total{
    display: flex;
    align-items: flex-start;
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #999;
    padding: 30px 0;
}
.cart-total .ct-discount,
.cart-total .sd-total{
    width: 50%;
}
.cart-total .ct-discount{
    /* text-align: center; */
}
.cart-total .ct-discount li h4{
    font-size: 15px;
    border: solid 1px #ccc;
    padding: 8px 0;
    text-align: center;
    background: #ccc;
    color: #555;
    border-radius: 4px;
}
.voucher-info input{
    width: 195px;
    border-bottom: solid 1px;
    border-color: transparent transparent #777 transparent;
}
.voucher-info .voucher form{
    display: flex;
    /* width: fit-content; */
    /* width: -moz-fit-content; */
    /* width: -webkit-fit-content; */
    /* width: 100%; */
    padding: 10px;
    /* margin-left: 75px; */
}
.voucher-info .voucher form .group{
    display: flex;
    width: 100%;
}

.voucher-info .voucher form .input-spinner .input-group-prepend, 
.voucher-info .voucher form .input-spinner .input-group-append{
    top: 0!important;
}
.voucher-info .voucher form .input-spinner .btn.btn-spinner{
    padding: 7px 0;
}
.voucher-info .voucher form .balance{
    font-size: 14px;
    color: #777;
    min-width: 100px;
    padding-left: 10px;
}
.member-voucher .voucher-total,
.member-voucher .voucher-total li.v-send,
.member-voucher .voucher-total li .v-top,
.member-voucher .voucher-total li .v-bank ul li:first-child{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    border-top: solid 1px #ddd;
    padding: 20px 0;
    margin-bottom: 0;
}
.member-voucher .voucher-total a,
.member-voucher .voucher-total li.total p{
    display:inline-block; 
}
.member-voucher .voucher-total a i,
.return .voucher-checkbox a i{
    font-size: 21px;
}
.member-voucher .voucher-total li.total p{
    width: 100px;
    text-align: left;
    font-weight: bold;
    padding-left: 10px;
    margin-bottom: 0;
}
.member-voucher .voucher-total li,
.member-voucher .voucher-total li .v-top,
.member-voucher .voucher-total li .v-bank li.v-send,
.member-voucher .voucher-total li .v-bank ul li:first-child{
    border-top: 0;
    padding: 0;
}
.member-voucher .voucher-total li .v-top,
.member-voucher .voucher-total li .v-bank li.v-send,
.member-voucher .voucher-total li .v-bank ul li:first-child{
    justify-content: flex-start;
}
.member-voucher .voucher-total li .v-top a,
.return .voucher-checkbox a{
    position: relative;
}
.member-voucher .voucher-total li .v-top a .tooltiptext,
.return .voucher-checkbox a .tooltiptext{
    visibility: hidden;
    width: 100px;
    background-color: #333;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    padding: 10px;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
}
.member-voucher .voucher-total li .v-top a .tooltiptext::after,
.return .voucher-checkbox a .tooltiptext::after{
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
}
.member-voucher .voucher-total li .v-top a:hover .tooltiptext,
.return .voucher-checkbox a:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
  }
.member-voucher .voucher-total li .v-bottom label{
    min-width: 40px;
    padding-right: 10px;
    margin-bottom: 0;
}
.member-voucher .voucher-total li .v-bank li,
.member-voucher .voucher-total li .v-bank ul li:first-child{
    padding-bottom: 10px;
}
.member-voucher .voucher-total li:not(.total) span{
    padding-right: 10px;
}
/* og:192 */
.member-voucher .voucher-total li .v-bank{
    display: none;
}
.member-voucher .voucher-total li .v-bank ul li{
    display: flex;
    max-width: 350px;
}
.member-voucher .voucher-total li .v-bank ul li:first-child input:not(#bank-name){
    width: 70px;
    margin-right: 5px;
}
.member-voucher .voucher-total li .v-bank input{
    border: 0;
    width: 100%;
}
.member-voucher .voucher-total li .v-bank input[type='text']{
    border-bottom: solid 1px #999;
    outline: none;
}
.member-voucher .voucher-total li .v-bank input[type='submit']{
    width: 70px;
    background-color: transparent;
}
.member-voucher .voucher-total li .v-bank ul li:first-child a{
    min-width: 30px;
    text-align: center;
}
.member-voucher .voucher-total li .v-bank ul li:first-child a:hover{
    color: #333;
}
.member-voucher .voucher-total li button:hover{
    background-color: #333;
    color: #ddd;
}

/* return */
.return .voucher-checkbox{
    display: flex;
    align-items: center;
    color: #333;
}
.return .voucher-checkbox input[type='checkbox']{
    margin-right: 5px;
}
.return .voucher-checkbox a .tooltiptext{
    width: 250px;
    left: -50px;
    text-align: justify;
}

/* --------- register --------- */

/* 通用 */
.register-body{
    padding-bottom: 10px;
    margin-bottom: 30px;
}
.register-bottom{
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
}
.register-bottom .location p,
.register-body .price span:first-child{
    color: #999;
}
.register-body .price{
    display: block;
    min-width: 100px;
    text-align: right;
}
.register-bottom .location p>i,
.register-body .price span:last-child{
    font-size: 18px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}
.register-title{
    position: relative;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 0;

    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}
.register-title a{
    color: #222333;
}
.register-title a:hover{
    color: #777;
}
.register-intro{
    color: #999;
    padding-top: 10px;

    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: normal;
}
.registration button{
    min-width: 100%;
    min-height: 40px;
    /* max-width: 100%; */
    border: solid 1px #777;
    background-color: #fff;
}


/* register2 */
.register2.ed-style{
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-bottom: 50px;
}
.register2.ed-style:last-child{
    padding-bottom: 20px;
}
.register2.ed-style .register-media{
    position: relative;
    display: block;
    width: 35%;

    background-color: #d7d7d7;
    margin-bottom: 0;
    overflow: hidden;
}
.register2.ed-style .register-body{
    width: calc( 100% - 35% );
}
.register2.ed-style  .register-body{
    margin-left: 50px;
}
.register2.ed-style .register-intro{
    -webkit-line-clamp: 5;
}
.register2.ed-style .register-bottom{
    padding-top: 20px;
    padding-bottom: 0;
}

/* register-content */
/* note */
.registration .note {
    position: relative;
    display: block;
    border-bottom: solid 1px #ddd;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

/* reset */
.registration .reset{
    position: relative;
    /* display: block; */
    text-align: center;
    padding: 10px 0 20px;
}
.registration .reset a{
    color: #222;
}
.registration .reset a:hover{
    color: #999;
}

/* --calendar */
.calendar-table{
    margin-right: 30px;
}
.calendar-table .table h4{
    font-size: 15px;
    margin-bottom: 5px;
}
.calendar-table .date{
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 100px;
    padding: 10px 0;
    background-color: #f2f2f2;
}
.calendar-table .date-info .top{
    display: block;
}
.calendar-table .date-info .top a,
.calendar-table .date a.date-prev,
.calendar-table .date a.date-next{
    font-size: 18px;
    color: #222;
    padding-left: 20px;
}
.calendar-table .date-info .top a{
    padding-left: 0;
}
.calendar-table .date a.date-next{
    padding-right: 20px;
}
.calendar-table .date-info{
    display: block;
    text-align: center;
}
.calendar-table .date-info select{
    min-width: 100px;
    text-align: center;
}
.calendar-table .table{
    position: relative;
    display: table;
    width: 100%;
    margin-bottom: 20px;
}
.calendar-table .table .thead,
.calendar-table .table .tbody{
    display: table;
    width: 100%;
}
.calendar-table .table .tr{
    display: table-row;
}
.calendar-table .table .thead .th,
.calendar-table .table .tbody .td{
    display: table-cell;
    width: calc( 100% / 7 );
    text-align: center;
}
.calendar-table .table .thead .th,
.calendar-table .table .tbody .td{
    position: relative;
    padding: 20px 0;
}
.calendar-table .table .thead .th{
    padding: 8px 0;
}
.calendar-table .table .thead .th{
    color: #fff;
    background-color: #222;
}
.calendar-table .table .tbody .tr:not(:last-child) .td{
    border-bottom: solid 1px #ddd;
}
.calendar-table .table .tbody .td.prev,
.calendar-table .table .tbody .td.next{
    color: #ccc;
}
.calendar-table .table .tbody .td button{
    position: absolute;
    display: block;
    bottom: 2px;
    width: 100%;
    height: calc( 100% - 10px );
    background-color: #fff;
    border: solid 1px #999;
    margin: 4px 0px;
    z-index: 0;

    transition: all .3s ease;
}
.calendar-table .table .tbody .td button:hover,
.calendar-table .table .tbody .td button:focus{
    color: #fff;
    background-color: #b52727;
    border-color: #b52727;
}
.calendar-table .table .tbody .td button.full{
    color: #222;
    background-color: #ddd;
    border-color: #ddd;
}
.calendar-table .tips{
    position: relative;
}
.calendar-table .tips ul,
.calendar-table .tips ul li{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.calendar-table .tips ul li:not(:last-child){
    padding-right: 10px;
}
.calendar-table .tips ul li span:nth-child(2){
    display: inline-block;
    width: 50px;
    height: 25px;
    background-color: #ddd;
    border: solid 1px #ddd;
    margin-left: 5px;
}
.calendar-table .tips ul li:first-child span:nth-child(2){
    background-color: #fff;
    border-color: #999;
}

/* --detail */
.register-detail,
.register-btn{
    position: relative;
}
.register-detail h4{
    font-size: 15px;
    margin-bottom: 5px;
}
.register-detail h4 > span:last-child,
.register-detail .price ul li:last-child span{
    font-size: 18px;
    font-weight: 500;
}
.register-btn{
    display: flex;
    justify-content: space-between;
}
.register-btn ul{
    display: block;
    align-items: baseline;
    max-width: 100%;
    overflow: hidden;
}
.register-detail .period ul{
    margin-left: -7px;
    margin-right: -7px;
}
.register-detail .period ul li,
.register-detail .age ul:not(.participator) li,
.register-detail .participator ul li{
    display: inline-block;
    width: calc( 100% / 5 - 4px );
    padding-bottom: 10px;
}
.register-detail .period ul li{
    padding: 0 5px;
}
.register-detail .period ul li,
.register-detail .age ul:not(.participator) li{
    width: calc( 100% / 3 - 3px);
}
.register-detail .age {
    margin: 30px 0 20px;
}
.register-detail .age ul.participator li{
    display: flex;
    align-items: center;
}
.register-detail .age ul.participator li:not(:last-child){
    padding-bottom: 30px;
}
.register-detail .age ul.participator li.applicant{
    display: block;
    padding-bottom: 10px;
    border-bottom: solid 1px #f2f2f2;
    margin: 0 0 30px;
}
.register-detail .age ul.participator li .accordion,
.register-detail .age ul.participator li input{
    width: 100%;
    margin-bottom: 0;
}
.register-detail .age ul.participator li .accordion .card{
    border-top: 0;
    background-color: #f2f2f2;
}
.register-detail .age ul.participator li .accordion>.card .card-header{
    margin-bottom: 0;
}
.register-detail .age ul.participator li .accordion .card .card-title{
    background-color: #777;
}
.register-detail .age ul.participator li .accordion .card.card-sm .card-title a:before {
    content: '\f110';
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant{
    display: block;
    border-top: solid 1px rgba(51,51,51,0.15);
    border-bottom: solid 1px rgba(51,51,51,0.15);
    margin: 0 0 30px;
}
.cart-detail:not(.payment) .pd-rtable ul li.tr.mixProducts .applicant{
    margin-right: 50px;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .accordion{
    margin-bottom: 0;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .accordion .card {
    border-top: 0;
    background-color: transparent;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .accordion .card.card-sm .card-title{
    background-color: transparent;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .accordion .card.card-sm .card-title a,
.register-detail .age ul.participator li .accordion .card.card-sm .card-title a{
    font-size: 15px;
    color: #fff;
    padding: 10px 20px;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .accordion .card.card-sm .card-title a{
    color: #333;
    padding: 10px 0;
}
.cart-detail.payment .pd-rtable ul li.tr.mixProducts .applicant .accordion .card.card-sm .card-title a{
    padding: 10px 20px;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .accordion .card.card-sm .card-title a::before{
    right: 3px;
}
.cart-detail.payment .pd-rtable ul li.tr.mixProducts .applicant .accordion .card.card-sm .card-title a::before{
    right: 20px;
}
.register-detail .age ul.participator li .accordion .card.card-sm .card-title a:hover{
    color: #ddd;
}
.register-detail .age ul.participator li span{
    min-width: auto;
}
.register-detail .age ul.participator li span:nth-child(2),
.register-detail .age ul.participator li span.op{
    color: #999;
}
.register-detail .age ul.participator li .main-alt{
    background-color: #f2f2f2;
    /* padding: 20px 0; */
}
.register-detail .age ul.participator li h4,
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant h4{
    min-width: 75px;
    text-align: center;
    margin-bottom: 0;
}
.register-detail .age ul.participator li.applicant h4,
.register-detail .age ul.participator li .main-alt h4,
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant h4{
    color: #212529;
    font-size: 15px;
    background-color: #f2f2f2;
    padding: 8px 10px;
    /* border-radius: 20px; */
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .main-alt h4{
    text-align: center;
    margin: 10px 0;
}
.register-detail .age ul.participator li.applicant .alt,
.register-detail .age ul.participator li .main-alt .alt,
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .alt{
    padding: 20px 30px;
    /* margin-top: 15px; */
    /* margin: 20px 0; */
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .main-alt .alt{
    background-color: #f2f2f2;
    margin: 0;
    padding: 20px 30px;
    border-bottom: solid 2px #fff;
}
.register-detail .age ul.participator li.applicant .card-body,
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .card-body,
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant .main-alt h4{
    /* padding: 10px 0px; */
    padding: 0;
}
.register-detail .age ul.participator li.applicant .alt-form,
.register-detail .age ul.participator li .main-alt .alt-form{
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}
.register-detail .age ul.participator li.applicant label,
.register-detail .age ul.participator li .main-alt label,
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant span{
    width: auto;
    min-width: 65px;
    margin-bottom: 0;
    text-align: center;
    padding-right: 5px;
}
/* .register-detail .age ul.participator li .main-alt label.phone{
    min-width: 65px;
} */
.register-detail .age ul.participator li .main-alt label.email{
    min-width: 65px;
}
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant span{
    color: #666;
    font-weight: 400;
    font-size: 14px;
    margin: 0 0 1.1rem;
}
/* .cart-detail .pd-rtable ul li.tr.mixProducts .applicant span:first-child{
    margin-right: 5px;
} */
.cart-detail .pd-rtable ul li.tr.mixProducts .applicant span:first-child::after{
    content: '-';
    display: inline-block;
    padding: 0 5px;
}
.register-detail .age ul.participator li.applicant input{
    text-align: left;
}
.register-detail .age ul.participator li.applicant input[type='date']{
    text-align: center;
}
.register-detail .age ul.participator li span:first-child{
    padding-right: 10px;
    width: 100px;
    min-width: fit-content;
}
.register-detail .age ul.participator li span.unit{
    padding-left: 10px;
}
.register-detail .age ul.participator li span.op{
    text-decoration: line-through;
}
.register-detail .age ul.participator li span.op,
.register-detail .age ul.participator li span:last-child{
    /* padding-left: 10px; */
    padding-right: 0;
    text-align: right;
}
.register-detail .age ul.participator li span:last-child{
    font: normal bold 18px/1.5 'arial';
    padding-left: 5px;
}
.register-detail .age ul.participator li input{
    text-align: center;
    transition: all .2s ease;
}
.register-detail .age ul.participator li input:focus{
    outline: #ddd solid 3px;
}
.register-detail .age ul.participator li .input-spinner .input-group-prepend,
.register-detail .age ul.participator li .input-spinner .input-group-append{
    top: 0!important;
}
.register-detail .age ul.participator li .input-spinner .input-group-prepend .btn.btn-spinner,
.register-detail .age ul.participator li .input-spinner .input-group-append .btn.btn-spinner{
    padding: 10px 20px;
}
.register-detail .period ul li button,
.register-detail .age ul li button,
.register-detail .participator ul li button{
    width: 100%;
    transition: all .3s ease;
}
/* .register-detail .participator ul li.active button{
    color: #ccc;
    border-color: #ccc;
} */
.register-detail .period ul button:hover,
.register-detail .period ul li.active button,
.register-detail .age ul button:hover,
.register-detail .age ul li.active button,
.register-detail .participator ul button:hover,
.register-detail .participator ul li.active button{
    color: #fff;
    background-color: #b52727;
    border-color: #b52727;
}
.register-detail .period ul button:hover,
.register-detail .age ul button:hover,
.register-detail .participator ul button:hover{
    background-color: #222;
    border-color: #222;
}
/* .register-detail ul li:not(:last-child), */
.register-btn ul li:not(:last-child){
    padding-right: 10px;
}
.register-detail .price,
.register-detail .price ul{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 0;
}
.register-detail .price ul li:last-child span{
    font-weight: bold;
}
.register-detail .price ul.total li:last-child span{ color: #b52727;}
.register-detail .price ul li:not(:first-child){/* padding-right: 5px; */}
.register-detail .price ul li:not(:first-child) span{
    font-family: arial;
}
.register-detail .price ul li:nth-child(2){color: #999;}
.register-detail .price h4{
    color: #999;
    padding-right: 5px;
    margin-bottom: 0;
}
.register-btn {
    padding-top: 10px;
    margin-top: 10px;
}
.register-btn ul{
    display: flex;
    justify-content: flex-end;
}
.register-btn button{
    min-width: 120px;
    border: transparent;
    color: #fff;
    background-color: #777;

    transition: all .3s ease;
}
.register-btn ul li:last-child button{
    background-color: #222;
}
.register-btn button:hover,
.register-btn ul li:last-child button:hover{
    color: #222;
    background-color: #fff;
    border: solid 1px #777;
}

/* register-custom:xiluo */
.register .album,
.register .age,
.register .blog,
.register .relate,
.register .activity{
    margin-top: 80px;
}
.register .basic{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction:row
}
.register .basic .title{
    display: block;
    font-size: 24px;
    min-width: 120px;
    writing-mode:horizontal-tb;
    margin: auto;
    text-align: center;
}
.register .basic .img,
.register .basic .img img{
    width: 100%;
}
.register .origin h4{
    font-size: 18px;
    font-weight: bold;
}
.register .origin .product.ed-style .product-body{
    margin-bottom: 0;
}
.register .activity .pd-pagination{
    display: block;
    margin: auto;
    margin-right: 0;
}

/* member register */
.member-order.register .pd-rtable-cell.th:not(.name,.date), 
.member-order.register .pd-rtable-cell.td:not(.name,.date){
    width: calc( 68% / 5 );
}
.member-order.register .pd-rtable-cell.th.date,
.member-order.register .pd-rtable-cell.td.date{
    width: 12%;
}
.member-order.register .pd-rtable-cell.th.name,
.member-order.register .pd-rtable-cell.td.name{
    width: 20%;
}
.member-order.register .pd-rtable-cell.td.name{
    text-align: left;
}
.member-order.register .pd-rtable-cell.td.name p{
    display: inline-block;
    text-align: center;
}
.member-order.register .item .detail-table{
    display: flex;
}
.member-order.register .item .detail-table table,
.member-order.register .item .detail-table table textarea{
    width: 100%;
}
.member-order.register .item .detail .pd-rtable{
    padding: 20px;
}
.member-order.register .item .detail .pd-rtable ul.info,
.member-order.register  .detail .pd-rtable ul li.tr:not(:first-child){
    /* background-color: #f9f9f9; */
    padding-left: 0;
}
.member-order.register .item .detail .pd-rtable-cell.name{
    width: 25%;
}
.member-order.register .item .detail .pd-rtable-cell.td.name.colspan{
    width: 60%;
}
.member-order.register .item .detail .pd-rtable-cell.time{
    width: 15%;
}
.member-order.register .item .detail .pd-rtable-cell:not(.name, .time) {
    width: calc( 65% / 5 );
}
.member-order.register .item .detail .pd-rtable ul li.tr:first-child{
    border: 0;
    border-bottom: solid 1px #999;
    border-radius: 0;
}
/* .dashboard.member .member-order.register .item .detail .detail-info{
    padding: 10px 30px 20px;
} */
.member-order.register .item .detail .pd-rtable ul{
    margin-top: 0;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .accordion{
    margin-bottom: 0;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .card{
    background-color: transparent;
    border-top-color: #999;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .card .card-body{
    background-color: #f9f9f9;
    padding: 0;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .card .card-title a{
    color: #333;
    font-size: 15px;
    padding: 10px;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .main-alt .alt{
    background-color: #f2f2f2;
    margin: 0;
    padding: 20px 30px;
    border-bottom: solid 2px #fff;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .alt{
    padding: 20px 30px;
    /* margin: 20px 0; */
}
.member-order.register .item .detail .pd-rtable ul.info .applicant h4 {
    color: #333;
    font-size: 15px;
    background: #f2f2f2;
    text-align: center;
    padding: 10px 0;
    margin-bottom: 0;
}
.member-order.register .item .detail .pd-rtable ul.info .applicant h4,
.member-order.register .item .detail .pd-rtable ul.info .applicant .alt .alt-form {
    /* padding-top: 10px;
    padding-bottom: 10px; */
}
.member-order.register .item .detail .pd-rtable ul.info .applicant .alt .alt-form span{
    color: #666;
    font-weight: 400;
    font-size: 14px;
    margin: 0 0 1.1rem;
}