/* 메인 페이지 */
.order_header_main{width:100%; height:80px;background:var(--main-color);border-bottom:1px solid #fff;}
.order_header_main .order_logo{width: 70%;height:100%; display:inline-block;float:left;line-height:80px;}

.order_header_main .logo{display:inline-block;width:160px;}
.order_header_main .logo img{display:inline-block;padding-left:30px;width:160px;}
.order_header_main .order_company{display:inline-block;font-size:1rem;color:#fff;}
.order_header_main .order_company p{display:inline-block;padding-right:20px;padding-left:10px;color:#fff;}
.order_header_main .order_company p:nth-child(1){font-weight:bold;padding-left:20px;font-style: italic;}
.order_header_main .order_company p:nth-child(2){font-size:0.8rem;font-weight:400;}
.order_main{position:fixed;width:100%; height:100vh;background:var(--main-color);}
.order_check_bg{background-color: #fff;}

.order_main p{color:var(--main-color);}
.order_main .intro{width:500px; height:100%;margin:0 auto;padding-top:80px;text-align:center;}
.order_main .intro .intro_sub_tt{font-size:1.2rem;font-weight:bold;color:#fff;font-weight:noamal;}
.order_main .intro .logo img{width:200px; margin-top:25px;}
.order_main .intro .logo p{font-size:1rem;font-weight:bold;color:#fff;font-style: italic;opacity: 0.5; margin-top:20px;}

.order_main .intro .logo .order_start{display:inline-block;float:left;width:48%;height:60px;background:#fff;line-height:60px;margin-right:4%;margin-top:40px;color:var(--main-color);font-size:1.5rem;font-weight:bold;border-radius:50px;}
.order_main .intro .logo .order_check{display:inline-block;width:48%;height:60px;background:#fff;border:1px soild #fff;line-height:60px;color:var(--main-color);margin-top:40px;font-size:1.5rem;font-weight:bold;border-radius:50px;}


.order_header_main .order_admin{float:right;color:#fff;line-height:40px;margin-right:20px;}
.order_header_main .order_admin a{display:inline-block;font-size:0.9rem;color:#fff;width:110px;text-align:center;height:40px;background:var(--adminbtn-color);margin-top:20px;}
.order_header_main .order_admin i{margin-right:10px;}
.order_admin_login{position:fixed;right:30px;bottom:20px;}
.order_admin_login a{color:var(--adminbtn-color);}
.order_admin_login i{margin-right:5px;}
/* 메인 페이지 끝 */

/* 주문- 상품 선택 페이지 */

/*헤더*/
.order_header{position:fixed;top:0;width:100%; height:60px;background:var(--main-color);z-index:1;}
.order_header .order_logo{width:65%;height:100%; display:inline-block;float:left;line-height:60px;}

.order_header .logo{display:inline-block;width:160px;}
.order_header .logo img{display:inline-block;padding-left:30px;width:160px;}
.order_header .order_company{display:inline-block;font-size:1rem;color:#fff;}
.order_header .order_company p{display:inline-block;padding-right:20px;color:#fff;}
.order_header .order_company p:nth-child(1){font-weight:bold;padding-left:20px;}
.order_header .order_company p:nth-child(2){font-size:0.8rem;font-weight:400;}
.order_final{width:35%; height:100%;background:#fff;float:right;border-bottom:solid 2px var(--main-color);text-align:center;}
.order_final p{font-size:1.4rem;font-weight:bold;line-height:60px;color:var(--main-color);}
.order_cate {position:fixed;top:60px;width: 65%;height:60px; background:#fff;display:block;box-shadow:0 0 5px rgba(0,0,0,0.2);}


#order_swiper{width:530px;height:60px;overflow:hidden;position:fixed;left:60px;}

.order_cate ul{}
.order_cate ul li{float:left;}
.order_cate .cate_btn i{font-size:20px;color:#fff;line-height:40px;}
.order_cate .cate_btn .pre{width:40px;height:40px;border-radius:50%;background:#ddd;float:left;margin:10px;text-align:center;line-height:40px;}
.order_cate .cate_btn .next{width:40px;height:40px;border-radius:50%;background:#ddd;float:right;margin:10px;text-align:center;line-height:40px;}
.order_cate ul .active{width:100px;height:40px;display:inline-block;background:var(--main-color);border-radius:50px;margin:10px;color:#fff;font-weight:bold;line-height:40px;}
.order_cate ul li{width:auto;margin:0 27px; height:40px;color:#000;font-size:0.9rem;font-weight:bold;text-align:center;line-height:60px;}


  /*컨텐츠*/
  .smart_order_item_wrap {
   overflow:scroll;
   flex-wrap: wrap;
    -ms-box-orient: horizontal;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content:flex-start;
    justify-content:flex-start;
    flex-wrap: wrap;
    
    width: 65%;
    max-height:1120px;
    float:left;
    padding:120px 10px 30px;
    border-right:1px solid #ddd;
  }

  .smart_order_item {
    width: 24%;
    border: 1px solid #efefef;
    padding: 10px;
    margin:10px 3px;
  }

  .smart_order_item h4{
    text-align:center;
    font-size:1rem;margin-top:10px;
  }
  .smart_order_item p{text-align:center; font-size:1.1rem;font-weight:bold;margin:20px auto 10px;color:var(--main-color);}
  .smart_order_item_img {
    width: 100%;
    border-radius:5px;
  }


input::placeholder{
  color:#454545;
}
.order_check_wrap{position:fixed;top:60px;right:0;width:35%;height:61%;float:right;background:#eeeeee;overflow:scroll;}

.order_check_wrap  .order_btn{width:30%;height:720px;float:right;background:#eeeeee;}

#btn_order_span{display:inline-block;width:220px;border:none;font-size:1.5rem;background-Color:transparent;text-align:center;font-weight:bold;color:#fff;line-height:100px;}
.user_info_bg{position:fixed; left:0; top:0; display:block; width:100%;height:100%; background:rgba(0,0,0,0.5);z-index:10; display:none}
#order_option_wrap{width:100%;padding:10px;}
#order_option_wrap p{padding-left:10px;}
#order_user_info_wrap {position:absolute;z-index:100; left:240px; top:50px; display:block; width:500px;height:425px; text-align:left; background:#fff; display:none}
#order_user_info_wrap .user_info_title{width:100%;height:60px;text-align:center;background:var(--main-color);line-height:60px;font-size: 1.4rem;color: #fff;}
#order_user_info_wrap .info_close{position:absolute;top:0; right:20px;}
#order_user_info_wrap .info_logo {text-align:center;font-size: 0.9rem;color:#333;margin-top:30px;}
#order_user_info_wrap .info_logo a{width:80px;margin:0 auto;}
#order_user_info_wrap .info_logo a img{width:80px;margin:0 auto;display:none;}
#order_user_info{width:70%;margin:15px auto 0;}
#order_user_info tr{height:60px;}
#order_user_info tr th{font-size: 1rem;font-weight:bold; width: 100px;}
#order_user_info tr input{border-style:none;border-bottom:1px solid #ddd;appearance: none;}
.submit_btn {width:200px;background-Color:var(--main-color);border-radius:50px;margin:30px auto;}
.submit_btn .submit{width:200px;border:none;background-Color:var(--main-color);font-size:1.5rem;text-align:center;font-weight:bold;color:#fff;line-height:50px;border-radius:50px;}
.submit_btn tr{width:200px;margin:0 auto;}
/* 여기부터 order_style.css 에 있음  */
.smart_order_item_list {}
.item{}
.smart_order_item_img {}
.smart_order_item_name {}
.btn_item_cnt {background: transparent;}
.btn_item_cnt {}
.order_cnt {}
/* 여기까지 order_style.css 에 있음  */

@media (max-width:660px) {
  #order_option_wrap{width:100%;}
  #order_user_info_wrap {width:98%;}
}

/* 주문조회 정보입력 페이지 */
#order_check_info{width:70%;margin:30px auto 0;}
#order_check_info tr{display:block;width:300px;height:60px;margin:0 auto;}
#order_check_info tr th{font-size: 1rem;fint-weight:bold;}
#order_uorder_check_infoser_info tr input{border-style:none;border-bottom:1px solid #ddd;appearance: none;}
.check_btn {width:200px;background-Color:var(--main-color);border-radius:50px;margin:30px auto;}
.check_btn .submit{width:200px;height:50px;border:none;background-Color:var(--main-color);font-size:1.5rem;text-align:center;font-weight:bold;color:#fff;line-height:50px;border-radius:50px;}
/* 주문조회 정보입력 페이지 */

  /* 주문 내역 */

.smart_order_item_list .item img{display:none;}
.order_btn_wrap {width:100%;height:100px;position:fixed;bottom:0;}
.order_btn_wrap div:nth-child(1){width:100px;height:100px;background:#333;display:inline-block;float:left;text-align:center;color:#fff;}
.order_btn_wrap div:nth-child(1) i{width:100%; display:block; font-size:30px;margin-top:25px;margin-bottom:10px;}
.order_btn_wrap div:nth-child(1) a{color:#fff;font-weight:bold; font-size:0.8rem;}
.order_btn_wrap div:nth-child(2){width:70%;height:100px;background:var(--main-color);border: none; font-size:1.1rem;}
.item_name span{color:var(--main-color);  font-size: 1rem;}
  @media all and (max-width:1024px) {}

  @media all and (max-width:830px) {
    .smart_order_item {
      width: 100%
    }
  }

  @media all and (max-width:460px) {}

/* .smart_order_item_chk {display:none}*/
.smart_order_item {
  position: relative;
}
.checked {
  border: solid 2px var(--main-color);
  opacity: 0.8;
}

.check_mark {
  font-size: 10rem;
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  z-index: 100;
  color: #fff;
  opacity: 0.7;
  display: none;
}

.item_chk {
  display: none;
}

/* 주문 -> 수량, 주문자 정보 입력 페이지 */
.order_container {
  width: 700px;
  margin: 0 auto;
  padding: 20px;
  border: 1px solid #ccc;
}
.smart_order_item_list{
  width: 100%;
  height: 80px;
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
  
}
.smart_order_item_list .item_name{
  width:60%;
  height: auto;
  padding: 50px auto;
  float: left;
  text-align: left;
  font-size: 1rem;
}

.smart_order_item_list .order_qty{
  width: 40%;
  margin-top:10px;
  float: right;
}

.smart_order_item_list .order_qty .frm_input{width: 30px;text-align:center;height:35px;background: transparent;appearance: none;}
.smart_order_item_list .order_qty input{float:left;border-style: none;}
.smart_order_item_list .order_qty .number_1{float: left;width:35px;height:35px;border-radius: 50%;text-align:center;background-color:#fff ;border: 1px #bbbbbb solid;vertical-align: middle;color: #bbbbbb;font-weight: bold;}
.smart_order_item_list .order_qty .number_2{float: left;width:35px;height:35px;border-radius: 50%;text-align:center;background-color:var(--main-color) ;line-height: 35px;color: #fff;font-weight: bold;}
.smart_order_item_list .order_qty .remove_item {float: right;width: 20px;height:35px;color: #bbb;}
.item {
  padding: 0 10px ;
  text-align: center;
}
/*
.smart_order_item_img {
  width: 150px;
  padding: 0;
  margin-bottom: 5px;
}
*/
.smart_order_item_name {
  display: block;
  font-size: 1.6em;
  font-weight: bold;
}



.btn_item_cnt {
  border-radius: 0;
  border: 1px solid #ccc;
  cursor: pointer;
}

.order_cnt {width:70%}

/* 금액 합계 s*/

.order_total_wrap {width:100%;height:60px;position:fixed;bottom:100px;background: #fff;border-top: 1px #ddd solid;}


.order_total_wrap .total_title{width:30%;line-height: 60px;padding-left:20px;font-size: 1.2rem;font-weight: bold;}
.order_total_wrap .total_price{ font-weight: bold;padding-left:15px;font-size: 1.5rem;color: var(--main-color);}
.order_total_wrap .total_tt{display: inline-block; width:300px;font-size: 0.8rem;font-weight: bold;padding-right:50px;text-align: right;}
/* 주문조회결과 s */

.order_title {
  font-size: 30px;
  text-align: center;
  margin: 60px auto 40px;
}

.order_box {
  width: 900px;
  margin: 0 auto;
  padding: 20px;
  text-align: center;
  border-radius: 5px;
}
.order_box .order_subtitle {
  font-size: 20px;
}

.order_list {
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
  border-bottom: solid 1px #ddd;
}

.order_list_tb {
  width: 100%;
  border-collapse: collapse;
}
.order_list_tb th {
  padding: 10px 0;
  border: 1px solid #ccc;
}
.order_list_tb td {
  padding: 10px 0;
  border: 1px solid #ccc;
}

.order_img {
  width: 35%;
}

.order_tt {
  font-weight: bold;
}
.order_tt1 {
  text-align: left;
}
.order_title_list {
  width: 100%;
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
  color: #ccc;
}
.order_title_list tr td:nth-child(1) {
  width: 5%;
}
.order_title_list tr td:nth-child(2) {
  width: 75%;
}
.order_title_list tr td:nth-child(3) {
  width: 20%;
}

/*확인버튼 - 블루*/
.order_box .order_n_blue {
  color: var(--main-color);
}
.order_btn_blue {
  display: block;
  width: 200px;
  height: 60px;
  margin: 30px auto;
  font-size: 1.2rem;
  line-height: 60px;
  border-radius: 50px;
  font-weight: bold;
  background: var(--main-color);
  color: #fff;
}
.order_btn_blue:hover {
  background: #dcecff;
  transition: ease-out 0.3s;
  color: #0075ff;
  font-weight: bold;
}

/*확인버튼 - 레드*/
.order_box .order_n_red {
  color: #cb0000;
}
.order_btn_red {
  display: block;
  width: 100px;
  height: 40px;
  margin: 0 auto;
  line-height: 40px;
  border-radius: 5px;
  background: #cb0000;
  color: #fff;
}
.order_btn_red:hover {
  background: #f8e8e8;
  transition: ease-out 0.3s;
  color: #cb0000;
  font-weight: bold;
}

/*확인버튼 - 그린*/
.order_box .order_n_green {
  color: #1c860b;
}
.order_btn_green {
  display: block;
  width: 100px;
  height: 40px;
  margin: 0 auto;
  line-height: 40px;
  border-radius: 5px;
  background: #1c860b;
  color: #fff;
}
.order_btn_green:hover {
  background: #d8eed4;
  transition: ease-out 0.3s;
  color: #1c860b;
  font-weight: bold;
}

/*확인버튼 - 브라운*/
.order_box .order_n_brown {
  color: #5a4126;
}
.order_btn_brown {
  display: block;
  width: 100px;
  height: 40px;
  margin: 0 auto;
  line-height: 40px;
  border-radius: 5px;
  background: #5a4126;
  color: #fff;
}
.order_btn_brown:hover {
  background: #c9bcae;
  transition: ease-out 0.3s;
  color: #5a4126;
  font-weight: bold;
}
/* 주문조회결과 e*/

/* order list page  */
.pg_wrap {
  clear: both;
  float: right;
  display: inline-block;
  margin: 15px 0 30px 0;
}
.pg_start {
  background: url("./img/btn_first.gif") no-repeat 50% 50% #eee;
}
.pg_prev {
  background: url("./img/btn_prev.gif") no-repeat 50% 50% #eee;
}
.pg_end {
  background: url("./img/btn_end.gif") no-repeat 50% 50% #eee;
}
.pg_next {
  background: url("./img/btn_next.gif") no-repeat 50% 50% #eee;
}
