/* 움직이는 화살표 */
.s1_arrow-down{display:inline-block; position:relative; top:35px; margin-left:-10px; text-align:center; animation:arrow_down 3s infinite;}
.scroll-arrow-down{ width:50px; height:50px; border-right: 3px solid gray; border-bottom: 3px solid gray;  margin:auto;
transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg);  -ms-transform: rotate(45deg);
/* 깜빡임 제거 */
/*animation: arrow-wave 2s infinite;*/
animation-direction: alternate;}
.scroll-arrow-down:nth-child(1) {animation-delay: 2s; color:#808080;}

.s1_arrow-up{display:inline-block; position:relative; top:35px; margin-left:-10px; text-align:center; animation:arrow_down 3s infinite; }
.scroll-arrow-up { width:50px; height:50px; border-right: 3px solid gray; border-bottom: 3px solid gray; 
transform: rotate(-135deg); -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg);  -ms-transform: rotate(-135deg);
/* 깜빡임 제거 */
/*animation: arrow-wave 2s infinite;*/
 animation-direction: alternate;}
.scroll-arrow-up:nth-child(1) {animation-delay: 2s; color:#808080;}
.area-main-ment-down, .area-main-ment-up{
    text-align:center;
}
@keyframes arrow-wave {
0% {opacity: 0;}
50% {opacity: .5;}
100% {opacity: 1;}
}
@keyframes arrow_down{
0%{top:28px;}
50%{top:40px;}
100%{top:28px;}
}


/* 주문서 */
.master-container {
    display: grid;
    gap: 5px;
    margin:0 auto;
  }
  
  .card {
    /*width: 1600px;*/
    width:95%;
    background: #FFFFFF;
    box-shadow: 0px 187px 75px rgba(0, 0, 0, 0.01), 0px 105px 63px rgba(0, 0, 0, 0.05), 0px 47px 47px rgba(0, 0, 0, 0.09), 0px 12px 26px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
  }
  
  .orderTitle {
    width: 120px;
    height: 40px;
    position: relative;
    display: flex;
    align-items: center;
    padding-left: 20px;
    border-bottom: 1px solid #efeff3;
    font-size:22px;
    font-weight: 900;
    color: #2B2B2F;
  }
  
  
  
  /* cart */
  .cart {
    border-radius: 19px 19px 7px 7px;
    margin:0 auto;
  }
  
  .cart .products {
    display: grid;
    
    padding: 10px;
  }
  .checkout .details {
    display: grid;
    grid-template-columns: 3fr 1fr;
    padding: 10px;
    gap: 5px;
  }
  .cart .products .product {
    display: grid;
    grid-template-columns: 60px 1fr 80px;
    gap: 10px;
    border-bottom: 3px solid #efeff3;
  }
  
  .cart .products .product span {
      font-weight:bold;
    color: #47484b;
    margin-bottom: 8px;
    display: block;
  }
  .form-control select{
      font-weight:bold;
    color: #47484b;
  }
  
  .cart .products .product p {
      font-weight:bold;
    color: #7a7c81;
  }
  
  .cart .quantity {
    height: 30px;
    display: column;
    grid-template-columns: 1fr 1fr;
    
    margin: auto 0 auto auto;
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 7px;
    filter: drop-shadow(0px 1px 0px #efefef)
      drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
  }
  
  .cart .quantity label {
    width: 50px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 2px;
    color: #47484b;
  }
  
  .cart .quantity button {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    outline: none;
    background-color: transparent;
    padding-bottom: 2px;
  }
  
  .card .small {
    font-size: 15px;
    margin: 0 0 auto auto;
  }
  
  .card .small sup {
    font-size: px;
  }
  
  .input_field {
    width: auto;
    height: 36px;
    padding: 0 0 0 12px;
    border-radius: 5px;
    outline: none;
    border: 1px solid #e5e5e5;
    filter: drop-shadow(0px 1px 0px #efefef)
      drop-shadow(0px 1px 0.5px rgba(239, 239, 239, 0.5));
    transition: all 0.3s cubic-bezier(0.15, 0.83, 0.66, 1);
  }
  
  .input_field:focus {
    border: 1px solid transparent;
    box-shadow: 0px 0px 0px 2px #242424;
    background-color: transparent;
  }
  
  /* Checkout */
  .checkout {
    border-radius: 9px 9px 19px 19px;
    margin:0 auto;
  }
  
  .checkout .details {
    display: grid;
    grid-template-columns: 3fr 1fr;
    padding: 10px;
    gap: 5px;
  }
  
  .checkout .details span {
    font-size: 13px;
    font-weight: 600;
  }
  
  .checkout .details span:nth-child(odd) {
    font-size: 11px;
    font-weight: 700;
    color: #707175;
    margin: auto auto auto 0;
  }
  
  .checkout .details span:nth-child(even) {
    font-size: 13px;
    font-weight: 600;
    color: #47484b;
    margin: auto 0 auto auto;
  }
  
  .checkout .checkout--footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 10px 10px 20px;
    background-color: #efeff3;
  }
  
  .totalPrice {
    position: relative;
    font-size: 22px;
    color: #2B2B2F;
    font-weight: 900;
  }
  
  .price sup {
    font-size: 13px;
  }
  
  .price sub {
    width: fit-content;
    position: absolute;
    font-size: 11px;
    color: #5F5D6B;
    bottom: 5px;
    display: inline-block;
  }
  
  .checkout .checkout-btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 36px;
    background: linear-gradient(180deg, #4480FF 0%, #115DFC 50%, #0550ED 100%);
    box-shadow: 0px 0.5px 0.5px #EFEFEF, 0px 1px 0.5px rgba(239, 239, 239, 0.5);
    border-radius: 7px;
    border: 0;
    outline: none;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.3s cubic-bezier(0.15, 0.83, 0.66, 1);
  }


  .customInput {
    height: 44px;
    background-color: #05060f0a;
    border-radius: .5rem;
    padding: 0 1rem;
    border: 2px solid transparent;
    font-size: 1rem;
    transition: border-color .3s cubic-bezier(.25,.01,.25,1) 0s, color .3s cubic-bezier(.25,.01,.25,1) 0s,background .2s cubic-bezier(.25,.01,.25,1) 0s;
  }
  
  .customLabel {
    display: block;
    margin-bottom: .3rem;
    
    font-weight: bold;
    font-size:18px;
    font-weight: 900;
    color: #05060f99;
    transition: color .3s cubic-bezier(.25,.01,.25,1) 0s;
  }
  
  .customInput:hover, .customInput:focus, .input-group:hover .customInput {
    outline: none;
    border-color: #05060f;
  }
  
  .input-group:hover .customLabel, .customInput:focus {
    color: #05060fc2;
  }