@charset "utf-8";
/*포인트내역 css*/
#footer{display: none;}
html, body {height: 100%;background: #F8F8FA;}

.point_wrap{width: 720px; margin: 0 auto; font-family: 'Pretendard'; padding: 20px;}

.top_box{background: #fff; border-radius:20px; padding: 40px 20px; box-shadow: 0 7px 7px -7px rgba(117, 117, 117, 0.5);} 

.top_box > div{display:flex; justify-content:space-between; margin-bottom: 20px;}
.top_box p{font-size: 30px; line-height: 42px; float: left;}
.top_box span{font-size: 33px; line-height: 46px; float: right; font-weight: 600;}

.btn_box{margin-top: 40px; margin-bottom: 0; display:flex; justify-content:space-between; gap:10px;}
.btn_box a{display:inline-block; background: #F8F8FA; width: 100%; text-align:center; padding: 20px 0;font-size: 30px; line-height: 42px; border-radius:4px;}

.btm_box{background: #fff; border-radius:20px; padding: 40px 20px; box-shadow: 0 7px 7px -7px rgba(117, 117, 117, 0.5); margin-top: 20px;} 
.btm_box h5{font-size: 33px; line-height: 46px; font-weight: 500; border-bottom: 1px solid #CCCCCC; padding-bottom: 5px; margin-bottom: 30px;}
.btm_box ul{display:flex; justify-content:space-between; align-items:center; margin:30px 0;}
.btm_box ul li{width: 50%; font-size: 30px; line-height: 42px; padding: 20px 0; background: #F8F8FA;display: flex;
    justify-content: center; align-items: center; text-align: center;color:#767676;	cursor:pointer;}
.btm_box ul li.on{background: #fff; box-shadow: 0 2px 4px 2px rgba(204, 204, 204, 0.2); color:#222222; font-weight: 500; border:1px solid rgba(204,204,204,0.5); } 


input[type="checkbox"]{display: none;}
label { display: inline-flex; align-items: center; cursor: pointer;font-size: 30px; line-height: 42px; font-weight: 400;}
label::before { content: '';display: inline-block;width: 43px;height: 43px; margin-right: 10px;border: 2px solid #cccccc;
border-radius: 4px; background-color: white;}

input[type="checkbox"]:checked + label::before { background-color: #fff;border-color: #3DA4E4; content: '';
        color:#3DA4E4;display: flex;align-items: center; justify-content: center;font-size:30px; background:url('/images/check.png')no-repeat center center;background-size:29px 23px;}

input[type="checkbox"]:checked + label{font-weight: 500;}

/* 스피너 화살표 숨기기 */
.flatpickr-input::-webkit-inner-spin-button,
.flatpickr-input::-webkit-calendar-picker-indicator {
    display: none; /* 크롬 및 사파리에서 화살표 숨기기 */
    -webkit-appearance: none; /* 화살표 기본 스타일 제거 */
}

.flatpickr-input {
    appearance: none; /* Firefox 및 Edge에서 화살표 숨기기 */
}





.odckbox_wrap{display: flex;align-items: center; gap:20px;}
.oddate_wrap{margin-top: 60px;display: flex;  justify-content: space-between; font-size: 30px; line-height: 43px;}

.oddate_wrap .flatpickr-input{border:none;font-size:30px; line-height: 43px;width: 100%; background: none;}
.oddate_wrap .oddateinput{width: 46%; position: relative; }
.oddate_wrap .oddateinput:after{content:''; width: 100%; height: 1px; background: #cccccc; position: absolute; bottom:-20px; left:0;}
.oddate_wrap .calendar-icon{display: inline-block; background: url('/images/calendar.png')no-repeat center center;width: 43px;height: 43px; background-size:contain;
position: absolute; top:50%; right:20px; transform:translateY(-50%); cursor:pointer;}
.od_inquiry{width: 100%; padding: 20px 0; font-size: 30px; line-height: 42px; background: #3DA4E4; color:#ffffff; border:none; margin-top: 30px;border-radius:4px; text-align:center; margin-top: 60px; cursor:pointer;}



.prckbox_wrap{display: flex;align-items: center; gap:20px;}
.prdate_wrap{margin-top: 40px;display: flex;  justify-content: space-between;font-size: 30px; line-height: 43px;}
.prdate_wrap .flatpickr-input{border:none;font-size:30px; line-height: 43px;width: 100%;background: none; }
.prdate_wrap .prdateinput{width: 46%; position: relative; }
.prdate_wrap .prdateinput:after{content:''; width: 100%; height: 1px; background: #cccccc; position: absolute; bottom:-20px; left:0;}
.prdate_wrap .calendar-icon{display: inline-block; background: url('/images/calendar.png')no-repeat center center;width: 43px;height: 43px; background-size:contain;
position: absolute; top:50%; right:20px; transform:translateY(-50%); cursor:pointer;}
.pr_inquiry{width: 100%; padding: 20px 0; font-size: 30px; line-height: 42px; background: #3DA4E4; color:#ffffff; border:none; margin-top: 30px;border-radius:4px; text-align:center; margin-top: 60px; cursor:pointer;}

.profit_inquiry{background: #fff; border-radius:20px; padding:20px 20px 40px 20px; box-shadow: 0 7px 7px -7px rgba(117, 117, 117, 0.5);  display: none; border-top: 2px dashed rgba(204,204,204,0.3);} 
.profit_inquiry div{padding: 40px 20px; border-bottom: 1px solid #CCCCCC; position: relative;}
.profit_inquiry div p{font-size: 33px; line-height: 42px; font-weight: 500; margin-bottom: 20px;}
.profit_inquiry div .bd_date{font-size: 25px; line-height: 35px; color:#767676; font-weight: 300;}
.profit_inquiry div .sum{position: absolute; top:50%; transform:translateY(-50%); right:0; font-size: 43px; line-height: 60px; font-weight: 600;}
.profit_inquiry div .minus{color:#D61E1E;}

.empty_wrap{background: #fff; border-radius:20px; padding:80px 20px; box-shadow: 0 7px 7px -7px rgba(117, 117, 117, 0.5);  display: none; border-top: 1px solid #cccccc;}
.empty{ display:flex; flex-direction:column; align-items:center; gap:20px;} 
.empty p{font-size: 33px; line-height: 46px;}

.profit_inquiry .hapsan{width: 100%;font-size: 33px;line-height: 42px;font-weight: 500; text-align:right;}
.profit_inquiry .minus{color:#D61E1E;}

@media screen and (max-width: 720px) {

.point_wrap{width: 100%; margin: 0 auto;  padding: 2.7778vw;background: #F8F8FA;  }

.top_box{background: #fff; border-radius:2.7778vw; padding: 5.5556vw 2.7778vw; box-shadow: 0 0.9722vw 0.9722vw -0.9722vw rgba(117, 117, 117, 0.5);} 

.top_box > div{ margin-bottom: 2.7778vw;}
.top_box p{font-size: 4.1667vw; line-height: 5.8333vw; }
.top_box span{font-size: 4.5833vw; line-height: 6.3889vw;  }

.btn_box{margin-top: 5.5556vw; margin-bottom: 0;  gap:1.3889vw;}
.btn_box a{ background: #F8F8FA; padding: 2.7778vw 0;font-size: 4.1667vw; line-height: 5.8333vw; border-radius:0.5556vw;}

.btm_box{background: #fff; border-radius:2.7778vw; padding: 5.5556vw 2.7778vw; box-shadow: 0 0.9722vw 0.9722vw -0.9722vw rgba(117, 117, 117, 0.5); margin-top: 2.7778vw;} 
.btm_box h5{font-size: 4.5833vw; line-height: 6.3889vw;  border-bottom: 0.1389vw solid #CCCCCC; padding-bottom: 0.6944vw; margin-bottom: 4.1667vw;}
.btm_box ul{align-items:center; margin-bottom:4.1667vw;}
.btm_box ul li{font-size: 4.1667vw; line-height: 5.8333vw; padding: 2.7778vw 0; background: #F8F8FA;
   align-items: center; 	cursor:pointer;}
.btm_box ul li.on{background: #fff; box-shadow: 0 0.2778vw 0.5556vw 0.2778vw rgba(204, 204, 204, 0.2); } 


input[type="checkbox"]{}
label {  align-items: center; cursor: pointer;font-size: 4.1667vw; line-height: 5.8333vw; }
label::before { width: 5.9722vw;height: 5.9722vw; margin-right: 1.3889vw;border: 0.2778vw solid #cccccc;
border-radius: 0.5556vw; }

input[type="checkbox"]:checked + label::before { content: '';
        align-items: center;font-size:4.1667vw;  background:url('/images/check.png')no-repeat center center;background-size:4.0278vw 3.1944vw;}

input[type="checkbox"]:checked + label{}


.odckbox_wrap{align-items: center; gap:2.7778vw;}
.oddate_wrap{margin-top: 8.3333vw; font-size: 4.1667vw; line-height: 5.9722vw;}

.oddate_wrap .flatpickr-input{border:none;font-size:4.1667vw; line-height: 5.9722vw;width: 100%; }
.oddate_wrap .oddateinput{width: 46%;  }
.oddate_wrap .oddateinput:after{ width: 100%; height: 0.1389vw; background: #cccccc;  bottom:-2.7778vw; left:0;}
.oddate_wrap .calendar-icon{ background: url('/images/calendar.png')no-repeat center center;width: 5.9722vw;height: 5.9722vw; background-size:contain;
 top:50%; right:2.7778vw; transform:translateY(-50%); cursor:pointer;}
.od_inquiry{width: 100%; padding: 2.7778vw 0; font-size: 4.1667vw; line-height: 5.8333vw; background: #3DA4E4;  border:none; margin-top: 4.1667vw;border-radius:0.5556vw;  margin-top: 8.3333vw; cursor:pointer;}


.prckbox_wrap{align-items: center; gap:2.7778vw;}
.prdate_wrap{margin-top: 5.5556vw;  font-size: 4.1667vw; line-height: 5.9722vw;}
.prdate_wrap .flatpickr-input{border:none;font-size:4.1667vw; line-height: 5.9722vw;width: 100%; }
.prdate_wrap .prdateinput{width: 46%;  }
.prdate_wrap .prdateinput:after{ width: 100%; height: 0.1389vw; background: #cccccc;  bottom:-2.7778vw; left:0;}
.prdate_wrap .calendar-icon{ background: url('/images/calendar.png')no-repeat center center;width: 5.9722vw;height: 5.9722vw; background-size:contain;
 top:50%; right:2.7778vw; transform:translateY(-50%); cursor:pointer;}
.pr_inquiry{width: 100%; padding: 2.7778vw 0; font-size: 4.1667vw; line-height: 5.8333vw; background: #3DA4E4;  border:none; margin-top: 4.1667vw;border-radius:0.5556vw;  margin-top: 8.3333vw; cursor:pointer;}

.profit_inquiry{background: #fff; border-radius:2.7778vw; padding:2.7778vw 2.7778vw 5.5556vw 2.7778vw; box-shadow: 0 0.9722vw 0.9722vw -0.9722vw rgba(117, 117, 117, 0.5); } 
.profit_inquiry div{padding: 5.5556vw 2.7778vw; border-bottom: 0.1389vw solid #CCCCCC; }
.profit_inquiry div p{font-size: 4.5833vw; line-height: 5.8333vw;  margin-bottom: 2.7778vw;}
.profit_inquiry div .bd_date{font-size: 3.8889vw; line-height: 5.0000vw;  }
.profit_inquiry div .sum{ top:50%; transform:translateY(-50%); right:0; font-size: 5.9722vw; line-height: 8.3333vw; }

.empty_wrap{background: #fff; border-radius:2.7778vw; padding:11.1111vw 2.7778vw; box-shadow: 0 0.9722vw 0.9722vw -0.9722vw rgba(117, 117, 117, 0.5);  }
.empty{  flex-direction:column; align-items:center; gap:2.7778vw;} 
.empty img{width: 27.7778vw;}
.empty p{font-size: 4.5833vw; line-height: 6.3889vw;}

.profit_inquiry .hapsan{width: 100%;font-size: 4.5833vw;line-height: 5.8333vw; }
}