body {
  font-size: 12px; }

.wrap {
  max-width: 480px;
  margin: 0 auto; 
  .status_warp {
    padding: 10px 10px;
    background: linear-gradient(0deg, #F6F6F6 0%, #F6F6F6 100%), linear-gradient(180deg, #FFF 0%, #FCFCFC 100%);

    h2 {
        font-size: 14px;
        font-weight: 600;
        line-height: 150%; /* 27px */
        letter-spacing: -0.54px;
    }
 
    .status_area {
      .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      
      .nav-link {
        margin: 0 20px;
      }
      
      .title {
        margin: 0;
        flex-grow: 1;
        text-align: center;
      }
        .status_list {
            display: flex;
            max-height: 600px;
            overflow: auto;
            flex-direction: column;
            row-gap: 16px;
            margin-top: 16px;

            .status_block {
                display: flex;
                padding: 10px 20px;
                flex-direction: column;
                align-items: flex-start;
                align-self: stretch;
                border-radius: 16px;
                background: #FFF;
                box-shadow: 0px 0px 4px 0px rgba(225, 226, 228, 0.20);

                .none {
                    width: 100%;
                    color: #858B91;
                    text-align: center;
                    font-size: 14px;
                    font-weight: 500;
                    line-height: 140%; /* 19.6px */
                    letter-spacing: -0.42px;
                }
                .status_tit {
                    display:flex;
                    justify-content: space-between;
                    align-items: center;
                    width: 100%;
                    min-height: 40px;

                    .status_txt {
                        color: #52585E;
                        font-size: 18px;
                        font-weight: 600;
                        line-height: 150%; /* 27px */
                        letter-spacing: -0.54px;

                        &.strong {
                            color: #0B8F43;
                        }
                    }

                    .cancel_btn {
                        display: flex;
                        padding: 10px 15px;
                        justify-content: center;
                        align-items: center;
                        gap: 10px;
                        border-radius: 100px;
                        background: #FCF4F4;

                        span {
                            color: #F34141;
                            font-size: 14px;
                            font-weight: 600;
                            line-height: 140%; /* 19.6px */
                            letter-spacing: -0.42px;
                        }
                    }

                    .point_plus {
                        display: flex;
                        padding: 8px 30px 8px 10px;
                        justify-content: center;
                        align-items: center;
                        gap: 10px;
                        border-radius: 100px;

                        span {
                            color: #0B8F43;
                            font-size: 14px;
                            font-weight: 600;
                            line-height: 140%; /* 19.6px */
                            letter-spacing: -0.42px;
                        }
                    }

                    .point_minus {
                        display: flex;
                        padding: 8px 30px 8px 10px;
                        justify-content: center;
                        align-items: center;
                        gap: 10px;
                        border-radius: 100px;

                        span {
                            color: #F34141;
                            font-size: 14px;
                            font-weight: 600;
                            line-height: 140%; /* 19.6px */
                            letter-spacing: -0.42px;
                        }
                    }
                }
                .status_desc {
                    display: flex;
                    padding: 8px 12px;
                    align-items: flex-start;
                    gap: 16px;
                    align-self: stretch;
                    border-radius: 8px;
                    margin: 8px 0;

                    p {
                        display: flex;
                        align-items: center;
                        font-size: 12px;
                        font-weight: 500;
                        line-height: 140%; /* 19.6px */
                        letter-spacing: -0.7px;
                        padding-left: 0px;
                    }
                    .line {
                        display: inline-block;
                        width: 1px;
                        height: 14px;
                        background: #CEE9D9;
                        margin: 0 8px;
                    }
                    &.status_pending {
                        border: 1px solid #E1E2E4;
                        background: #F8F8F8;

                        p {
                            color: #52585E;
                        }
                    }
                    &.status_success {
                        border: 1px solid #CEE9D9;
                        background: #F4FCF8;

                        dl {
                          display: flex;
                          align-items: center;
                          gap: 12px;
                          width: 100%;
                          padding: 6px 0;
      
                          dt {
                            flex-shrink: 0; /* 줄어들지 않도록 설정 */
                              width: 80px;
                              text-align: right;
                              color: #0B8F43;
                              font-size: 12px;
                              font-weight: 500;
                              line-height: 150%; /* 21px */
                              letter-spacing: -0.42px;
                          }
                          dd {
                            flex-grow: 1; /* 남은 공간을 차지하도록 설정 */
                            color: #0B8F43;
                            text-align: center;
                              font-size: 12px;
                              font-weight: 500;
                              line-height: 150%; /* 24px */
                              letter-spacing: -0.48px;
                          }
                      }                        
                    }
                    &.status_failure {
                        border: 1px solid #FCCBCA;
                        background: #FCF4F4;
                        dl {
                          display: flex;
                          align-items: center;
                          gap: 12px;
                          width: 100%;
                          padding: 6px 0;
      
                          dt {
                            flex-shrink: 0; /* 줄어들지 않도록 설정 */
                              width: 80px;
                              text-align: right;
                            color: #0B8F43;
                              font-size: 12px;
                              font-weight: 500;
                              line-height: 150%; /* 21px */
                              letter-spacing: -0.42px;
                          }
                          dd {
                            flex-grow: 1; /* 남은 공간을 차지하도록 설정 */
                            color: #0B8F43;
                            text-align: center;
                              font-size: 12px;
                              font-weight: 500;
                              line-height: 150%; /* 24px */
                              letter-spacing: -0.48px;
                          }
                      }                        

                        p {
                            color: #F34141;
                        }
                    }
                  &.status_progress {
                        border: 1px solid #F3E8D7;
                        background: #FFFCF4;

                        p {
                            color: #C58723;
                        }

                    }
                }
                
                dl {
                    display: flex;
                    align-items: center;
                    gap: 12px;
                    padding: 6px 0;

                    dt {
                        width: 48px;
                        color: #858B91;
                        font-size: 12px;
                        font-weight: 500;
                        line-height: 150%; /* 21px */
                        letter-spacing: -0.42px;
                    }
                    dd {
                        text-align: center;
                        font-size: 12px;
                        font-weight: 500;
                        line-height: 150%; /* 24px */
                        letter-spacing: -0.48px;
                    }
                }
            }
        }
  }
}


}
  .wrap .container {
    padding-left: 32px;
    padding-right: 32px; }

h2 {
  font-size: 16px;
  letter-spacing: -1px;
  color: #000c24;
  font-weight: 700; }

.dropdown-menu {
    max-height: 146px;
    overflow: scroll;
    overflow-x: hidden;
    margin-top: 0px;
}

.caret {
	  float: right;
    margin-top: 5%;
}

.shadowbox {
  border: 0px solid #333;
  text-align: center;
  box-shadow: 8px 8px 5px #444;
  padding: 8px 12px;
  margin-top: 0px;
  background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
}

#menu1 {
    width: 160px;
    text-align: left;
}

.input--type input[type="text"],
.input--type input[type="email"],
.input--type input[type="tel"],
.input--type input[type="password"] {
  width: 100%;
  height: 39px;
  background-color: white;
  color: #0055B8;
  font-size: 16px;
  letter-spacing: 0;
  font-weight: 400;
  border-bottom: 1px solid #0055B8;
  border-radius: 0px;
  box-sizing: border-box;
  transition-duration: 0.4s; }
  .input--type input[type="text"]::-webkit-input-placeholder, .input--type input[type="email"]::-webkit-input-placeholder, .input--type input[type="tel"]::-webkit-input-placeholder, .input--type input[type="password"]::-webkit-input-placeholder {
    color: #808080;
    letter-spacing: -1px; }
  .input--type input[type="text"]:-moz-placeholder, .input--type input[type="email"]:-moz-placeholder, .input--type input[type="tel"]:-moz-placeholder, .input--type input[type="password"]:-moz-placeholder {
    color: #808080;
    letter-spacing: -1px; }
  .input--type input[type="text"]::-moz-placeholder, .input--type input[type="email"]::-moz-placeholder, .input--type input[type="tel"]::-moz-placeholder, .input--type input[type="password"]::-moz-placeholder {
    color: #808080;
    letter-spacing: -1px; }
  .input--type input[type="text"]:-ms-input-placeholder, .input--type input[type="email"]:-ms-input-placeholder, .input--type input[type="tel"]:-ms-input-placeholder, .input--type input[type="password"]:-ms-input-placeholder {
    color: #808080;
    letter-spacing: -1px; }
  .input--type input[type="text"]:focus,
  .input--type input[type="email"]:focus,
  .input--type input[type="tel"]:focus,
  .input--type input[type="password"]:focus {
    padding-left: 8px;
    padding-right: 8px;
    border-bottom: 1px solid #001031;
    outline: none;
    box-shadow: 0px 4px 8px rgba(0, 12, 36, 0.15); }

.input--type--submit {
  display: flex;
  flex-wrap: wrap; }
  .input--type--submit input[type="text"],
  .input--type--submit input[type="email"],
  .input--type--submit input[type="tel"],
  .input--type--submit input[type="password"] {
    width: calc(100% - 106px); }

.input--type--btn {
  width: 98px;
  background-color: #0055B8;
  color: #ffffff;
  font-size: 14px;
  margin-left: 8px;
  letter-spacing: -1px;
  font-weight: 400;
  border-radius: 4px;
  cursor: pointer; }

.input--wrap h3 {
  font-size: 14px;
  font-weight: 700;
  color: #000c24;
  display: block; }

.textarea {
  border: 1px solid #808080;
  border-radius: 8px;
  margin-bottom: 10px;
  background-color: #F3F3F3; }
  .textarea textarea {
    width: 100%;
    height: 80px;
    background-color: transparent;
    display: block;
    box-sizing: border-box;
    font-size: 12px;
    letter-spacing: 0;
    padding: 16px; }
    .textarea textarea::-webkit-input-placeholder {
      color: #808080;
      letter-spacing: -1px; }
    .textarea textarea:-moz-placeholder {
      color: #808080;
      letter-spacing: -1px; }
    .textarea textarea::-moz-placeholder {
      color: #808080;
      letter-spacing: -1px; }
    .textarea textarea:-ms-input-placeholder {
      color: #808080;
      letter-spacing: -1px; }
    .textarea textarea:focus {
      outline: none;
      box-shadow: 0px 4px 8px rgba(0, 12, 36, 0.15); }

label {
  font-size: 12px;
  letter-spacing: -1px;
  color: #0055B8;
  display: block;
  position: relative;
  padding-top: 2px;
  padding-left: 25px;
  color: #0055B8;
  font-size: 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer; }
  label input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0; }
  label .check-mark {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 16px;
    height: 16px;
    border-radius: 2px;
    border: 1px solid #0055B8; }
  label input:checked ~ .check-mark {
    background-color: #0055B8;
    background-image: url(../src/img/check-w.svg);
    background-repeat: no-repeat;
    background-position: center 4px;
    background-size: 14px 9.69px; }

.btn {
  width: 100%;
  height: 56px;
  border-radius: 8px;
  background-color: #000c24;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  color: #ffffff;
  box-sizing: border-box;
  padding-top: 16px;
  display: block;
  cursor: pointer;
  text-align: center; }
  .btn--blue {
    background-color: #0055B8; }
  .btn--submit{
    background-color: #0055B8;
    font-weight: 500;
    padding-top: 0px;
  }

.header {
  height: 32px;
  display: block;
  position: relative;
  margin-bottom: 32px; }
  .header a {
    width: 64px;
    height: 32px;
    display: block;
    background-image: url(../src/img/arrow-left.svg);
    background-repeat: no-repeat;
    background-position: 16px center;
    position: absolute;
    left: 0;
    top: 0; }
  .header h1 {
    font-size: 24px;
    color: #0055B8;
    font-weight: 700;
    display: flex;
    padding-left: 64px;
    padding-right: 64px;
    justify-content: center;
    align-items: center;
    height: 32px;
    box-sizing: border-box;
    padding-top: 8px; }
  .header--book {
    height: 64px;
    align-items: center;
    justify-content: space-between;
    display: flex;
    position: relative;
    margin-bottom: 0px; }
    .header--book h1 {
      display: block;
      padding: 0 0 0 16px; }
      .header--book h1 a {
        display: block; }
  .header--link {
    padding-right: 16px; }
    .header--link a {
      padding: 11px 11px 0 30px;
      display: inline-block;
      font-size: 11px;
      font-weight: 700;
      color: #000c24;
      height: 32px;
      box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.2);
      border-radius: 16px;
      margin-left: 12px;
      box-sizing: border-box; }
  .header--btn {
    background-repeat: no-repeat;
    background-size: auto 16px;
    background-position: 11px center; }
    .header--btn--cal {
      background-image: url(../src/img/ico-calendar.svg); }
      .header--btn--cal.active {
        background-image: url(../src/img/ico-calendar-r.svg); }
    .header--btn--my {
      background-image: url(../src/img/ico-user.svg); }
      .header--btn--my.active {
        background-image: url(../src/img/ico-user-r.svg); }
    .header--btn.active {
      background-color: #0055B8;
      color: #ffffff; }

.message--result {
  width: 100%;
  padding-top: 32px;
  padding-bottom: 64px;
  font-size: 16px;
  font-weight: 700;
  text-align: center; }
  .message--result strong {
    font-weight: 700;
    color: #0055B8; }

.pt-0 {
  padding-top: 0 !important; }

.pt-1 {
  padding-top: 16px !important; }

.pt-2 {
  padding-top: 32px !important; }

.pt-3 {
  padding-top: 64px !important; }

.pt-4 {
  padding-top: 128px !important; }

.pt-5 {
  padding-top: 256px !important; }

.pb-0 {
  padding-bottom: 0 !important; }

.pb-1 {
  padding-bottom: 16px !important; }

.pb-2 {
  padding-bottom: 32px !important; }

.pb-3 {
  padding-bottom: 64px !important; }

.pb-4 {
  padding-bottom: 128px !important; }

.pb-5 {
  padding-bottom: 256px !important; }

.mt-0 {
  margin-top: 0 !important; }

.mt-1 {
  margin-top: 16px !important; }

.mt-2 {
  margin-top: 32px !important; }

.mt-3 {
  margin-top: 64px !important; }

.mt-4 {
  margin-top: 128px !important; }

.mt-5 {
  margin-top: 256px !important; }

.mb-0 {
  margin-bottom: 0 !important; }

.mb-1 {
  margin-bottom: 16px !important; }

.mb-2 {
  margin-bottom: 32px !important; }

.mb-3 {
  margin-bottom: 64px !important; }

.mb-4 {
  margin-bottom: 128px !important; }

.mb-5 {
  margin-bottom: 256px !important; }

.custom-select {
  position: relative;
  width: calc(50% - 8px); }
  .custom-select.w-100 {
    width: 100%; }
  .custom-select select {
    display: none; }
  .custom-select .select-selected {
    background-color: #ffffff;
    color: #000c24;
    border-radius: 4px;
    border: 1px solid #000c24;
    padding: 14px 24px 8px 16px;
    height: 48px;
    box-sizing: border-box;
    font-size: 16px; }
    .custom-select .select-selected:after {
      position: absolute;
      content: "";
      top: calc(50% - 4px);
      right: 10px;
      width: 0;
      height: 0;
      border: 6px solid transparent;
      border-color: #000c24 transparent transparent transparent; }
    .custom-select .select-selected.select-arrow-active:after {
      border-color: transparent transparent #000c24 transparent;
      top: calc(50% - 9px); }
  .custom-select .select-items {
    position: absolute;
    background-color: #ffffff;
    border: 1px solid #808080;
    border-radius: 4px;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.2); }
  .custom-select .select-items div {
    font-size: 16px;
    color: #000c24;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-color: transparent transparent #808080 transparent;
    cursor: pointer;
    user-select: none; }
    .custom-select .select-items div:last-child {
      border-color: transparent; }
    .custom-select .select-items div.same-as-selected {
      color: #ffffff;
      background-color: #1C7EF0;
      border-color: transparent transparent #0055B8 transparent; }
  .custom-select .select-items div:hover,
  .custom-select .select .same-as-selected {
    background-color: rgba(0, 0, 0, 0.1); }
  .custom-select .select-hide {
    display: none; }

.table {
  padding-top: 8px; }
  .table table {
    width: 100%;
    border-top: 1px solid #000c24; }
    .table table label {
      color: #000c24; }
    .table table thead th {
      background-color: #F5F5F5;
      padding: 12px 8px 11px; }
    .table table tr th,
    .table table tr td {
      font-size: 12px;
      color: #000c24;
      border-bottom: 1px solid #D9D9D9; }
    .table table tr th {
      font-weight: 700;
      text-align: center; }
    .table table tr td {
      text-align: center; }
      .table table tr td label {
        min-height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-size: 13px;
        font-family: Verdana;
        padding: 0; }

* {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 14px;
  letter-spacing: -1px;
  font: inherit;
  vertical-align: baseline;
  margin-block-start: 0em;
  margin-block-end: 0em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-family: "Ubuntu", sans-serif;
  font-weight: 400; }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

body {
  overflow-x: hidden; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

li {
  list-style: none; }

a,
a:hover {
  text-decoration: none; }

.clearfix::after {
  content: "";
  clear: both;
  display: table; }

p {
  margin: 0; }

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  padding: 0;
  margin: 0; }

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

.clearfix {
  display: inline-block; }

/* start commented backslash hack \*/
* html .clearfix {
  height: 1%; }

.clearfix {
  display: block; }

/* Font */
* {
  font-family: 'Gothic A1', sans-serif; }

.login--header {
  padding-left: 32px;
  padding-right: 32px;
  padding-top: 0px; }
  .login--header h1 {
    display: block;
    text-align: center; }
  .login--header h2 {
    padding-top: 16px;
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: #000c24;
    text-align: center; }

.login--wrap {
  padding-left: 32px;
  padding-right: 32px; }
  .login--wrap .input--type {
    margin-bottom: 32px; }
    .login--wrap .input--type:nth-child(2) {
      margin-bottom: 16px; }

.login--save {
  font-size: 12px;
  color: #0055B8;
  margin-bottom: 32px;
  margin-top: 10px; }

.login--links {
  padding-top: 16px;
  text-align: center;
  display: flex;
  justify-content: center; }
  .login--links a {
    margin: 0 8px;
    font-size: 14px;
    letter-spacing: -1px;
    color: #0055B8;
    display: block; }
  .login--links span {
    font-size: 14px;
    color: #0055B8; }

.login--contact {
  background-color: #EBEBEB;
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 32px;
  padding-right: 32px;
  margin-top: 50px; }
  .login--contact--inner {
    max-width: 416px;
    margin: 0 auto; }
  .login--contact h3 {
    font-size: 16px;
    color: #000c24;
    font-weight: 700;
    display: block;
    padding-bottom: 8px; }
  .login--contact ul li {
    font-size: 16px;
    color: #000c24;
    padding-bottom: 3px; }
    .login--contact ul li:last-child {
      padding-bottom: 0; }
    .login--contact ul li a {
      color: #0055B8;
      text-decoration: underline; }
.login--footer {
  height: 28px;
  padding-top: 6px;
  box-sizing: border-box;
  font-size: 10px;
  color: #ffffff;
  text-align: center;
  background-color: #000c24; }

.member--container h2 {
  padding-bottom: 8px;
  font-size: 16px;
  font-weight: 700;
  color: #0055B8;
  display: block; }

.member--container .input--wrap {
  padding-bottom: 16px; }

.member--guide-line {
  margin: 8px 0 32px;
  height: 8px;
  background-color: #E6E6E6; }

.member--info {
  padding-top: 16px;
  font-size: 14px;
  letter-spacing: -1px;
  max-width: 174px;
  margin: 0 auto;
  text-align: center;
  line-height: 1.7; }

.member--find-password--info {
  max-width: 212px; }

.member--btn {
  padding-top: 32px;
  padding-bottom: 64px; }

.member--apply {
  height: 20px;
  padding-top: 5px;
  padding-bottom: 5px; 
}
.member--complete {
  height: calc(100vh - 96px);
  display: flex;
  text-align: center;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #000c24;
  flex-direction: column; }
  .member--complete p {
    padding-bottom: 32px; }
  .member--complete strong {
    font-weight: 700; }

.book--calendar {
  padding-top: 32px; }

.book--header {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 10px; }
  .book--header h2 {
    font-size: 24px;
    color: #000c24;
    font-weight: 700;
    display: block;
    text-align: center;
    padding-top: 4px; }

.book--btn {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.2);
  display: block;
  position: absolute;
  top: 0;
  background-repeat: no-repeat;
  background-position: center; }
  .book--btn--prev {
    left: 0;
    background-image: url(../src/img/btn-prev.svg); }
  .book--btn--next {
    right: 0;
    background-image: url(../src/img/btn-next.svg); }

.book--table table {
  width: 100%; 
}
.book--table table th, .book--table table td {
  width: 14.285714%;
  height: 42px;
  vertical-align: middle;
  text-align: center; 
}
.book--table table thead th {
  font-size: 16px;
  color: #808080; 
}
.book--table table tbody td {
  font-size: 16px;
  color: #000c24; 
}
.book--table table tbody td * {
  font-weight: 700; 
}
.book--table table tbody td a {
  color: #000c24; 
}

.book--table table tbody td .book--date {
  width: 100%;
  max-width: 42px;
  height: 42px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 0 auto;
  border-radius: 4px;
  box-sizing: border-box;
  padding-top: 2px;
  font-size: 16px; 
}
.book--table table tbody td .book--date.out {
      color: #E6E6E6; 
}
.book--table table tbody td .book--date.today {
  background-color: #1C7EF0;
  color: #ffffff; 
}
.book--table table tbody td .book--date.today.booked:before {
  background-color: #ffffff; 
}

.book--table table tbody td .book--date.disable {
  color: #E6E6E6; 
}

.book--table table tbody td .book--date.booked:before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 3px;
  background-color: #E20000;
  position: absolute;
  left: calc(50%-3px);
  bottom: 3px; 
}

.book--point h2 {
  font-size: 16px;
  color: #000c24;
  font-weight: 700; }

.book--point--list {
  padding-top: 16px; }
  .book--point--list li {
    padding: 16px;
    border-radius: 4px;
    box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.2);
    background-color: #ffffff;
    position: relative;
    margin-bottom: 8px; }
    .book--point--list li strong,
    .book--point--list li span,
    .book--point--list li p {
      padding-right: 96px; }
    .book--point--list li strong {
      font-size: 16px;
      font-weight: 700;
      color: #0055B8;
      display: block;
      letter-spacing: 0;
      padding-bottom: 8px; }
    .book--point--list li span {
      font-size: 12px;
      font-weight: 700;
      color: #000c24;
      display: block; }
    .book--point--list li p {
      padding-top: 12px;
      font-size: 16px;
      font-weight: 700;
      color: #000c24;
      display: block; }
    .book--point--list li a {
      font-size: 14px;
      font-weight: 700;
      color: #ffffff;
      height: 32px;
      width: 80px;
      background-color: #808080;
      display: block;
      text-align: center;
      padding-top: 8px;
      box-sizing: border-box;
      border-radius: 4px;
      position: absolute;
      right: 16px;
      top: calc(50% - 16px); }

.book--search ul li {
  min-height: 48px;
  padding: 8px 0;
  display: flex; }

.book--search--title {
  width: 74px;
  font-size: 14px;
  font-weight: 700;
  color: #000c24;
  display: flex;
  align-items: center; }

.book--search--date {
  color: #0055B8;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center; }

.book--search--content {
  width: calc(100% - 74px);
  display: flex; }

.book--search--wave {
  width: 16px;
  text-align: center;
  min-height: 48px;
  font-size: 16px;
  color: #000c24;
  box-sizing: border-box;
  padding-top: 14px; }

.book--complete--box {
  padding: 32px 16px 24px;
  box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.2);
  border-radius: 4px; }
  .book--complete--box p {
    text-align: center;
    color: #000c24;
    font-size: 16px;
    letter-spacing: -1px;
    padding-bottom: 6px; }
    .book--complete--box p strong {
      font-weight: 700; }
      .book--complete--box p strong.name {
        color: #000c24; }
      .book--complete--box p strong.place {
        color: #0055B8; }

.book--complete--message {
  padding-top: 24px;
  font-size: 16px;
  color: #000c24;
  font-weight: 700;
  text-align: center; }

.mypage--info h2 {
  padding-top: 24px;
  color: #0055B8; }

.mypage--info ul {
  border-top: 1px solid #000c24; }
  .mypage--info ul li {
    border-bottom: 1px solid #D9D9D9;
    display: flex;
    min-height: 32px;
    padding-top: 16px;
    padding-bottom: 16px;
    align-items: center;
    position: relative; }
    .mypage--info ul li:last-child {
      border-bottom: none; }
    .mypage--info ul li strong {
      width: 72px;
      padding-right: 16px;
      font-weight: 700;
      font-size: 16px;
      color: #000c24; }
    .mypage--info ul li p {
      width: calc(100% - 72px);
      font-size: 16px;
      color: #000c24; }

.mypage--list--btn {
  width: 80px;
  height: 40px;
  padding-top: 2px;
  background-color: #000c24;
  font-size: 14px;
  color: #ffffff;
  font-weight: 400;
  position: absolute;
  right: 0;
  top: calc(50% - 20px);
  border-radius: 4px;
  box-sizing: border-box; }

.mypage--quick--blank a {
  background-image: none !important; }

.mypage--quick li a {
  height: 64px;
  border-bottom: 1px solid #E6E6E6;
  display: flex;
  align-items: center;
  font-size: 16px;
  color: #000c24;
  box-sizing: border-box;
  font-weight: 400;
  text-decoration: none;
  background-image: url(../src/img/arrow-right.svg);
  background-repeat: no-repeat;
  background-position: center right; }

.mypage--quick li:last-child a {
  border-bottom: none; }

.mypage--signout {
  padding: 16px 0;
  font-size: 12px;
  text-decoration: underline;
  color: #000c24;
  display: inline-block;
  background-color: transparent; }

.mypage--edit ul li {
  padding: 16px;
  background-color: #ffffff;
  box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.2);
  border-radius: 4px;
  position: relative;
  margin-bottom: 32px; }
  .mypage--edit ul li:last-child {
    margin-bottom: 0; }

.mypage--edit--top {
  display: block;
  position: relative;
  padding-right: 72px;
  padding-bottom: 12px; }
  .mypage--edit--top.w-100 {
    padding-right: 0; }
  .mypage--edit--top span {
    display: block;
    font-size: 12px;
    color: #000c24; }
  .mypage--edit--top strong {
    padding-top: 6px;
    display: block;
    font-size: 16px;
    font-weight: 700;
    color: #0055B8; }
  .mypage--edit--top a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 62px;
    height: 24px;
    padding-left: 26px;
    padding-right: 10px;
    box-sizing: border-box;
    border: 1px solid #C4C4C4;
    border-radius: 4px;
    background-color: #F5F5F5;
    font-size: 12px;
    color: #000c24;
    background-image: url(../src/img/ico-edit.svg);
    background-repeat: no-repeat;
    background-position: 8px center;
    position: absolute;
    right: 0;
    top: 0; }

.mypage--edit--row {
  display: flex;
  flex-wrap: wrap;
  padding-top: 0px;
  padding-bottom: 12px; }

.mypage--edit--col {
  width: calc(50% - 8px); }
  .mypage--edit--col.w-100 {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important; }
  .mypage--edit--col.c-black strong {
    color: #000c24 !important; }
  .mypage--edit--col:first-child {
    padding-right: 8px; }
  .mypage--edit--col:last-child {
    padding-left: 8px; }
  .mypage--edit--col span {
    display: block;
    font-size: 12px;
    color: #000c24; }
  .mypage--edit--col strong {
    padding-top: 6px;
    display: block;
    font-size: 16px;
    font-weight: 700;
    color: #0055B8; }
    .mypage--edit--col strong.fail {
      color: #808080 !important; }

.mypage--edit--del {
  width: 24px;
  height: 24px;
  border-radius: 12px;
  background-color: #808080;
  display: block;
  position: absolute;
  right: -12px;
  top: -12px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url(../src/img/ico-delete-white.svg);
  cursor: pointer; }

.mypage--add {
  width: 64px;
  height: 64px;
  border-radius: 32px;
  background-color: #0055B8;
  box-shadow: 0px 0px 8px rgba(0, 12, 36, 0.4);
  position: absolute;
  bottom: 16px;
  right: 16px;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  text-align: center;
  color: #ffffff;
  font-weight: 700; }

.mypage--popup {
  width: 100%;
  max-width: 330px;
  position: absolute;
  left: calc(50% - 165px);
  top: calc(50% - 105px);
  min-height: auto;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0px 2px 16px rgba(0, 12, 36, 0.4);
  z-index: -1;
  transform: translateY(-100%);
  transition-duration: 0.4s;
  opacity: 0; }
  .mypage--popup.active {
    z-index: 20;
    transform: translateY(0%);
    opacity: 1; }
  .mypage--popup--header {
    padding: 24px 16px 0;
    height: 36px;
    font-weight: 700;
    position: relative; }
    .mypage--popup--header h2 {
      font-size: 16px;
      font-weight: 700;
      color: #0055B8; }
  .mypage--popup--close {
    position: absolute;
    right: 16px;
    top: 20px;
    display: block; }
  .mypage--popup--inner {
    width: 100%;
    height: 165px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 16px;
    line-height: 24px;
    color: #000c24; }
  .mypage--popup--btn {
    width: 100%;
    height: 58px;
    font-size: 16px;
    color: #808080;
    border-top: 1px solid #C6C6C6;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center; }
  .mypage--popup--background {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: -2;
    opacity: 0;
    transition-duration: 0.4s; }
    .mypage--popup--background.active {
      opacity: 1;
      z-index: 19; }
  .mypage--popup--point {
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 22px; }
    .mypage--popup--point ul {
      border-top: 1px solid #000c24; }
      .mypage--popup--point ul li {
        font-size: 16px;
        font-weight: 400;
        color: #000c24;
        display: flex;
        min-height: 64px;
        border-bottom: 1px solid #D9D9D9; }
        .mypage--popup--point ul li:last-child {
          border-bottom: none; }
        .mypage--popup--point ul li strong {
          width: 96px;
          padding-top: 24px;
          padding-bottom: 20px;
          box-sizing: border-box;
          display: block;
          font-weight: 700;
          font-size: 16px; }
        .mypage--popup--point ul li span {
          width: calc(100% - 96px);
          padding-top: 24px;
          padding-bottom: 20px;
          font-size: 16px;
          font-weight: 400;
          color: #000c24; }