﻿
.w-80per {
   width: 80%;
}

.w-half {
   width: 292px;
}
.form-row2 {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-between;
}

.form-row2 .c-form_text01 {
   width: calc( ( 100% - 10px ) / 2 );
}

.form-column {
   display: flex;
   flex-direction: column;
}

.form-column .c-form_text01 {
   margin-bottom: 15px;
}

.form-column .c-form_text01:last-child {
}

.form-postalcode {
   width: 100%;
}

.post-icon {
   display: inline-block;
   font-size: 16px;
   margin-right: 10px;
   padding-top: 8px;
}

.postalcode-wrapper {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
}

.pref-select-wrapper {
   position: relative;
   width: 100%;
   height: 44px;
   cursor: pointer;
   margin-bottom: 15px;
}
.pref-select-wrapper::before {
   position: absolute;
   content: "";
   width: 0;
   height: 0;
   border-style: solid;
   border-width: 8px 6px 0 6px;
   border-color: #c3c3c3 transparent transparent transparent;
   margin: auto;
   top: 0;
   bottom: 0;
   right: 11px;
}
.pref-select-wrapper select {
   width: 100%;
   height: 100%;
   border: none;
   font-size: 16px;
}


.checkbox-label {
   display: inline-flex;
   flex-direction: row;
   justify-content: flex-start;
   align-items: center;
   margin-right: 35px;
   cursor: pointer;
}
.checkbox-label:last-child {
   margin-right: 0px;
}

.checkbox-label input[type="radio"] {
   -webkit-appearance: none;
   appearance: none;
   vertical-align: middle;
   color: inherit;
   font: inherit;
   border: 0;
   background: transparent;
   padding: 0;
   margin: 0;
   outline: 0;
   border-radius: 0;
   text-align: inherit;
   position: relative;
   cursor: pointer;
}

.checkbox-label input[type="radio"] + span {
   margin-left: 34px;
}

.checkbox-label input[type="radio"]::before,
.checkbox-label input[type="radio"]::after {
   position: absolute;
   content: "";
   width: 24px;
   height: 24px;
   border-radius: 50%;
   background-color: #fff;
   border: 1.2px solid #c3c3c3;
   margin: auto;
   top: 0;
   bottom: 0;
   left:0px;
   transform-origin: center;
   box-sizing: border-box;
}
.checkbox-label input[type="radio"]::after {
   border-color: #fff;
   background-color: #c3c3c3;
   transform: scale(.74);
}

.checkbox-label input[type="radio"]:checked::before {
   border-color: #F02864;

}
.checkbox-label input[type="radio"]:checked::after {
   background-color: #F02864;
}

label.varidation-message {
   display: none;
}

.is-error label.varidation-message {
   display: block;
}

.form-company-wrapper,.form-department-wrapper {
   display: none;
}
.form-company-wrapper.is-active,.form-department-wrapper.is-active {
   display: table-row;
}

.p-magazine_backnumber_new_option_comment_wrapper {
   background-color: #fff;
   padding: 10px;
   margin: 20px 0px;
}

.p-magazine_backnumber_new_option_comment_heading {
   font-size: 14px;
   font-weight: bold;
   padding-bottom: 5px;
   border-bottom: 1px solid #C3C3C3;
}
.p-magazine_backnumber_new_option_comment {
   font-size: 14px;
   padding-top: 5px;
}

.magazine-new-buy-btn-list {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   width: 100%;
   justify-content: space-between;
   align-items: flex-end;
}

.magazine-new-buy-btn-item {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   width: calc( ( 100% - 15px ) / 2 );
}

.magazine-new-buy-btn-item .p-magazine_backnumber_new_buy {
   width: 100%;
}

.magazine-new-buy-btn-item .p-magazine_backnumber_new_buy a {
   width: 100%;
   /*
   background-color: #E8334A;
   border-color: #7A1825;
   */
}
.magazine-new-buy-btn-item .p-magazine_backnumber_new_buy a.before {
   background-color: #E8334A;
   border-color: #7A1825;
}


.magazine-new-buy-btn-heading {
   font-size: 13px;
   font-weight: bold;
   margin-bottom: 15px;
   text-align: center;
   line-height: 1.2;
}

.magazine-new-buy-btn-heading-small {
   font-size: 8px;
   font-weight: normal;
}

.modaal-confirm .modaal-container {
   max-width: 450px;
}

.reserve-banner-container {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   max-width: 640px;
   margin: 40px auto -10px auto;
   box-sizing: border-box;
   border: 5px solid #90CCFE;
   background-color: #fff;
   padding: 10px 10px 10px 25px;
}

.reserve-banner-logo-img-wrapper {
}

.reserve-banner-logo-img {
   width: auto;
   height: 36px;
}

.reserve-banner-txt-wrapper {
   padding: 5px 3px;
   border: 2px dotted #C3C3C3;
   border-right: none;
   border-left: none;
}

.reserve-banner-txt {
   font-size: 20px;
   font-weight: bold;
   color: #5F5D5A;
   text-align: center;
}

.reserve-banner-btn-wrapper {

}

.reserve-banner-btn {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 160px;
   height: 48px;
   color: #fff;
   font-size: 14px;
   font-weight: bold;
   background-color: #2194F4;
   border-radius: 5px;
}

.p-magazine_backnumber_new {
   padding-bottom: 85px;
}

.p-magazine_backnumber_title-reserve {
   background-color: #2194F4;
}

.reserve-annotation {
   font-size: 14px;
   color: #6E6E6E;
   line-height: 1.64;
   padding: 20px 0px;
}

.magazine-new-subscriptions-btn-list {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   margin: 20px auto;
}

.magazine-new-subscriptions-btn-item {
   width: calc( ( 100% - 15px ) / 2 );
   overflow: hidden;
}

.magazine-new-subscriptions-btn-item-radio {
   -webkit-appearance: none;
   appearance: none;
   position: absolute;
   transform: translate(-10000px);
}

.magazine-new-subscriptions-btn {
   position: relative;
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   align-items: center;
   background-color: #fff;
   border: 1px solid #C3C3C3;
   border-radius: 5px;
   padding: 15px;
   padding-left: 50px;
   cursor: pointer;
   min-height: 80px;
}
.magazine-new-subscriptions-btn::before,
.magazine-new-subscriptions-btn::after {
   position: absolute;
   content: "";
   width: 24px;
   height: 24px;
   border-radius: 50%;
   background-color: #fff;
   border: 1.2px solid #c3c3c3;
   margin: auto;
   top: 0;
   bottom: 0;
   left:15px;
   transform-origin: center;
   box-sizing: border-box;
}
.magazine-new-subscriptions-btn::after {
   border-color: #fff;
   background-color: #c3c3c3;
   transform: scale(.74);
}

.magazine-new-subscriptions-btn-item-radio:checked + .magazine-new-subscriptions-btn,
.magazine-new-subscriptions-btn-item-radio:checked + .magazine-new-subscriptions-btn::before {
   border-color: #F02864;

}
.magazine-new-subscriptions-btn-item-radio:checked + .magazine-new-subscriptions-btn::after {
   background-color: #F02864;
}

.magazine-new-subscriptions-txt-wrapper {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
}
.magazine-new-subscriptions-txt-heading {
   font-size: 16px;
   font-weight: bold;
   margin-bottom: 2px;

}
.magazine-new-subscriptions-txt-title {
   font-size: 14px;
   color: #6E6E6E;
}

.p-magazine_backnumber_new_buy.center a {
   margin-left: auto;
   margin-right: auto;
}

.p-magazine_backnumber_title-subscriptions {
   background-color: #4ABB67;
}
.magazine-new-subscriptions-already-text {
   background-color: #fff;
   padding: 15px;
   text-align: center;
   width: 100%;
}
.magazine-new-subscriptions-already-text p {
   text-align: center;
   font-size: 16px;
   font-weight: bold;
}
.subscriptions-confirm-btn-list {
   display: flex;
   flex-direction: row;
   justify-content: center;
}
.btn-subscriptions-confirm {
   width: calc( ( 100% - 15px ) / 2 );
   background-color: #8FC31F;
   border-radius: 5px;
   color: #fff;
   font-size:14px;
   font-weight: bold;
   padding: 10px;
   text-align: center;
   margin-right: 15px;
}
.btn-subscriptions-confirm:last-child {
   margin-right: 0px;
}
.btn-subscriptions-confirm:first-child:last-child {
   width: 250px;
}

.no-detail .p-magazine_backnumber_new_image,
.p-magazine_backnumber_new_title {
   cursor: auto;
   pointer-events: none;
}
.no-detail .p-magazine_backnumber_new_image:hover {
   opacity: 1;
}

.magazine-new-subscriptions-btn-item-not-available {
   position: relative;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   background-color: #fff;
   border: 1px solid #fff;
   border-radius: 5px;
   padding: 15px;
   font-size: 14px;
   width: calc( ( 100% - 15px ) / 2 );
   min-height: 80px;
}

.subscription-txt-accepted span {
   font-size: 16px;
   padding: 40px 0px;
   text-align: center;
}

.l-nav_gmenu.is-mypage li {
   width: calc( ( 100% - ( 20px * 3 ) ) / 4 );
}

.side-banner-list {
}

.side-banner-item {
   margin-bottom: 30px;
}

.sub-error-txt {
   color: #FF0000;
}

.myreserve-main .c-maglist02_item {
   padding-top: 10px;
   position: relative;
   margin-bottom: 0px;
}

.myreserve-main .reserved-list-annotation + .c-maglist02_item,
.myreserve-main .c-maglist02_item:first-child {
   border-top: 1px solid #dfdfdf;
}

.p-magazine_backnumber_new_buy a.is-disenable {
   background: #c3c3c3!important;
   pointer-events: none;
}

.reserve-cancel-btn {
   position: absolute;
   width: 102px;
   height: 48px;
   background: transparent;
   border: 1px solid #E1E1E1;
   border-radius: 3px;
   display: flex!important;
   justify-content: center;
   align-items: center;
   font-size: 14px;
   color: #000000;
   margin: auto;
   top: 0;
   bottom: 0;
   right: 20px;
   font-weight: bold;
}

.is-loading {
   pointer-events: none;
}

.zero-list-message {
   display: none;
}
.zero-list-message:first-child {
   display:block;
}

.zero-list-message.pay-after:nth-of-type(2) {
   display:block;
}

.reserved-list-annotation.pay-after:nth-last-of-type(2) {
   display: none;
}

.reserved-list-annotation {
   padding-bottom: 30px;
   text-align: center;
}
.reserved-list-annotation p {
   font-size: 14px;
   font-weight: bold;
   text-align: center;
}

.btn-subscription-update-annotation {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 420px;
   height: 50px;
   color: #F72A64;
   font-size: 14px;
   font-weight: bold;
   border: 1px solid #F72A64;
   margin: 0px auto;
}

.c-section_inner_special-option {
}

.special-option_catch-img {
   width: 100%;
}

.special-option_heaing {
   padding: 20px 0px;
   font-size: 20px;
   font-weight: bold;
   border-bottom: 5px solid #00B9EF;
   margin-bottom: 20px;
}

.c-section_inner_special-option p {
   font-size: 14px;
   line-height: 1.64;
}

.c-section_inner_special-option .strong {
   font-size: 18px;
   font-weight: bold;
}
.modal-text-small {
   font-size: 11px;
   font-weight: normal;
}

#c_more_history_reserve,
#c_more_history_reserve-pay-after {
   display: none;
}

.c-maglist02_item_category.is-option {
   border: 1px solid #FF9900;
   color: #FF9900;
   background-color: #fff;
   width: 168px;
}

.c-maglist02_item_category_list {
   display: flex;
   flex-direction:row;
   flex-wrap: wrap;
}

.myreserve-main .c-maglist02_item_category {
   float: none;
}

.sub-error-txt {
   margin-left: 1em;
}

#c_more_history_subscription {
   display:none;
}
.special-option_anottation {
   color: #6E6E6E;
   margin-top: 32px;
}

@media screen and (max-width: 767px) {
   .w-80per {
      width: 100%;
   }

   .form-company-wrapper.is-active,.form-department-wrapper.is-active {
      display: block;
   }

   .w-half {
      width: 100%;
   }

   .form-postalcode {
      width: 160px;
   }

   .post-icon {
      font-size: 13px;
   }

   .postalcode-wrapper {
      justify-content: flex-start;
   }

   .checkbox-label input[type="radio"]::before,
   .checkbox-label input[type="radio"]::after {
      width: 20px;
      height:20px;
   }

   .checkbox-label input[type="radio"] + span {
      margin-left: 25px;
   }

   .checkbox-label {
      margin-right: 45px;
   }
   .checkbox-label:first-child {
      margin-left: 45px;
   }
   .destination-type-list {
      text-align: center;
   }

   .p-magazine_backnumber_new_option_comment_heading {
      font-size: 13px;
   }
   .p-magazine_backnumber_new_option_comment {
      font-size: 13px;
   }

   .magazine-new-buy-btn-list {
      flex-direction: column;
   }

   .magazine-new-buy-btn-item {
      width: 100%;
      margin-bottom: 20px;
   }

   .magazine-new-buy-btn-item:last-child {
      margin-bottom: 0px;
   }

   .magazine-new-buy-btn-heading {
      margin-bottom: 10px;
   }

   .magazine-new-buy-btn-item .p-magazine_backnumber_new_buy {
      padding-top: 0px;
   }

   .reserve-banner-container {
      flex-direction: column;
      max-width: 315px;
      margin: 30px auto 0px auto;
      padding: 15px 0px;
   }
   
   .reserve-banner-logo-img-wrapper {
   
   }
   
   .reserve-banner-logo-img {
      height: 36px;
   }
   
   .reserve-banner-txt-wrapper {
      max-width: 200px;
      padding: 5px 2px;
      margin: 15px auto;
   }
   
   .reserve-banner-txt {
      font-size: 16px;
      letter-spacing: -1px;
   }
   
   .reserve-banner-btn-wrapper {
   
   }
   
   .reserve-banner-btn {
      width: 200px;
      height: 40px;
   }

   .p-magazine_backnumber_new {
      padding-bottom: 65px;
   }

   .reserve-annotation {
      line-height: 1.46;
   }

   /*
   */
   .magazine-new-subscriptions-btn-list {
      margin-bottom: 0px;
   }
   
   .magazine-new-subscriptions-btn-item {
      width: calc( ( 100% - 10px ) / 2 );
   }
   
   .magazine-new-subscriptions-btn-item-radio {
   }
   
   .magazine-new-subscriptions-btn {
      padding: 12px 10px;
      padding-left: 35px;
   }
   .magazine-new-subscriptions-btn::before,
   .magazine-new-subscriptions-btn::after {
      width: 20px;
      height: 20px;
      left:10px;
   }
   .magazine-new-subscriptions-btn::after {
      transform: scale(.74);
   }
   
   .magazine-new-subscriptions-btn-item-radio:checked + .magazine-new-subscriptions-btn,
   .magazine-new-subscriptions-btn-item-radio:checked + .magazine-new-subscriptions-btn::before {
   }
   .magazine-new-subscriptions-btn-item-radio:checked + .magazine-new-subscriptions-btn::after {
   }
   
   .magazine-new-subscriptions-txt-wrapper {
   }
   .magazine-new-subscriptions-txt-heading {
      font-size: 14px;
      margin-bottom: 0px;
   }
   .magazine-new-subscriptions-txt-title {
      font-size: 13px;
   }
   
   .p-magazine_backnumber_new_buy.center a {
   }

   .magazine-new-subscriptions-already-text {
      padding: 10px;
      margin-bottom: 20px;
   }

   .magazine-new-subscriptions-already-text p {
      font-size: 14px;
   }

   .magazine-new-subscriptions-btn-item-not-available {
      padding: 12px 10px;
      font-size: 12px;
   }
   .subscription-txt-accepted span {
      font-size: 14px;
      padding: 30px 0px;
   }

   .subscriptions-confirm-btn-list {
      flex-direction: column;
   }

   .btn-subscriptions-confirm {
      width: 100%;
      margin-bottom: 10px;
      margin-right: 0px;
   }

   .btn-subscriptions-confirm:first-child:last-child {
      width:100%;
   }

   .l-nav_gmenu.is-mypage li {
      width: calc( ( 100% - ( 2px * 3 ) ) / 4 );
   }

   .side-banner-list {
   }
   
   .side-banner-item {
      text-align: center;
      background-size: auto auto;
      background-color: rgba(255, 255, 255, 1);
      background-image: repeating-linear-gradient(135deg, transparent, transparent 10px, rgba(247, 247, 247, 1) 10px, rgba(247, 247, 247, 1) 20px );
   }

   .side-banner-item img {
      width: 250px;
   }

   .reserve-cancel-btn {
      right: 0px;
      font-size: 10px;
      width: 64px;
      height: 40px;
   }

   .myreserve-main .c-maglist02_item_body {
      /*padding-right: 74px;*/
   }

   .reserved-list-annotation {
      padding-bottom: 20px;
   }
   .reserved-list-annotation p {
      font-size: 13px;
   }
   
   .btn-subscription-update-annotation {
      font-size: 13px;
      width: calc( 100% - ( 8px * 2 ) );
      height: auto;
      padding: 13px 10px;
   }

   .c-section_inner_special-option {
   }
   
   .special-option_catch-img {
   }
   
   .special-option_heaing {
      padding: 15px 0px 18px 0px;
      font-size: 16px;
      border-width: 3px;
      margin-bottom: 15px;
   }
   
   .c-section_inner_special-option p {
      font-size: 13px;
      line-height: 1.53;
   }
   
   .c-section_inner_special-option .strong {
      font-size: 15px;
   }

   .modal-text-small {
      font-size: 11px;
   }

   .magazine-new-buy-btn-heading-small {
      font-size: 12px;
      /*font-weight: bold;*/
   }

   tbody tr.form-company-wrapper,
   tbody tr.form-department-wrapper {
      display: none;
   }

   .c-maglist02_item_inner {
      width: 100%;
      padding-right: 74px;
   }

   .sub-error-txt {
      display: block;
      margin-left: 0;
      font-size: 12px;
   }

   .c-maglist02_item_category.is-option {
      width: 150px;
   }

   .special-option_anottation {
      margin-top: 20px;
   }
}