validation 영역, 미승인 사유, 비행날짜~시간 input 크기 변경

src/assets/css/custom.css

@@ -936,4 +936,9 @@ background-size: 75% auto;
 .laanc-modal .terms-box{max-height:180px;overflow-x: hidden;;overflow-y:scroll;border:1px solid #ddd;padding:0.857rem;border-radius: 0.357rem;}
 .laanc-modal .terms-box p{font-size:0.75em;line-height:1.4;word-break:keep-all;}
 .laanc-modal .terms-check {padding:0 0 0 28px;border-bottom:0;margin-top:10px}
-.laanc-modal .terms-check label{font-size:0.875rem;font-weight:400;margin-top: -2px;}
+.laanc-modal .terms-check label{font-size:0.875rem;font-weight:400;margin-top: -2px;}
+.laanc-modal .validation{visibility: hidden;opacity: 0;width:0px;height:0px;transition:all 0.3s ease-in;-webkit-transition:all 0.3s ease-in;margin-bottom:0;margin-top:0;}
+.laanc-modal .validation.on{visibility:visible;opacity: 1;width:auto;height:auto;transition:all 0.3s ease-in;-webkit-transition: 0.3s ease-in;margin-top:-5px;margin-bottom:0.5rem;}
+.laanc-modal .validation p{font-size:0.875rem;color:#ed1125;line-height:1.3}
+.laanc-modal .validation p svg{width:16px;margin-right:4px}
+.laanc-modal .alert .cancel-txt{display:block;color:#ed1125;font-size:0.875rem;line-height:1.3;font-weight:300;word-break: keep-all;margin-top:4px}

src/containers/basis/flight/plan/FlightPlanContainer.js

@@ -25,7 +25,7 @@ import {
   GROUP_LIST
 } from '../../../../modules/basis/group/actions/basisGroupAction';
 import FlightPlanGroupGrid from '../../../../components/basis/flight/plan/FlightPlanGroupGrid';
-import { AlertCircle, CheckCircle } from 'react-feather';
+import { AlertCircle, CheckCircle, XCircle, AlertTriangle } from 'react-feather';
 
 const initSearchData = {
   schFltStDt: moment()
@@ -236,19 +236,19 @@ const FlightPlanContainer = () => {
               <Col className='list-input' md='12'> 
                 <div className='ti'>비행 계획 정보</div>                          
                   <Row>
-                    <Col className='list-input' md='4'>                           
+                    <Col className='list-input' md='6'>                           
                       <FormGroup>
                         <Label for='test'><span className='necessary'>*</span>비행 시작 일자</Label>
                         <Input type='text' id='test' size='sm' placeholder='' />
                       </FormGroup>
                     </Col> 
-                    <Col className='list-input' md='4'>                           
+                    <Col className='list-input' md='6'>                           
                       <FormGroup>
                         <Label for='test'><span className='necessary'>*</span>비행 종료 일자</Label>
                         <Input type='text' id='test' size='sm' placeholder='' />
                       </FormGroup>
                     </Col> 
-                    <Col className='list-input' md='4'>                           
+                    <Col className='list-input' md='12'>                           
                       <FormGroup>
                         <Label for='test'><span className='necessary'>*</span>비행 목적</Label>
                         <Input type='text' id='test' size='sm' placeholder='' />
@@ -388,7 +388,7 @@ const FlightPlanContainer = () => {
                 지도영역
               </div>
               <div className='mt-1'>
-                <Alert color='danger'>
+                <Alert color='warning'>
                   <div className='alert-body'>
                     <AlertCircle size={15} />{' '}
                     <span className='ms-1'>
@@ -543,16 +543,23 @@ const FlightPlanContainer = () => {
                     </div>
                   </Alert>
                 </Col>
+                {/* validation은 on 클래스로 제어  */}
+                <Col className='validation on' md='12'>
+                  <p>
+                  <AlertTriangle />기체보험가입이 되어있지 않거나 유효기간이 만료되었습니다. 기체보험가입이 되어있지 않거나 유효기간이 만료되었습니다. 기체보험가입이 되어있지 않거나 유효기간이 만료되었습니다. 
+                  </p>
+                </Col>
               </Row>
             </div>
             <div className='mb-1'>
               <div className='ti'>비행승인 사전결과 확인</div>
               <div className='laanc-map-sm'>지도영역</div>
               <div className='mt-1'>
-                <Alert color='success'>
+                <Alert color='warning'>
                   <div className='alert-body'>
-                    <CheckCircle size={15} />{' '}
-                    <span className='ms-1'>사전 결과 승인 대상입니다.</span>
+                    <AlertCircle size={15} />{' '}
+                    <span className='ms-1'>사전 결과 미 승인 대상입니다.</span>
+                    <span className='cancel-txt'>관제권 및 비행금지 공역을 제외한 지역에서는 주간에 150m미만의 고도에서는 비행승인없이 비행가능합니다. </span>
                   </div>
                 </Alert>
               </div>