/* =============================================================================
   Primitive Common Style
   ========================================================================== */

.bsize_cont { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

.showbox_block { display: block; }
.showbox_inline { display: inline; }
.hidebox { display: none; }

.box_fadeOut {
animation: fadeOut 0.8s ease-in 0.2s 1 normal forwards;
-webkit-animation: fadeOut 0.8s ease-in 0.2s 1 normal forwards;
}

.box_fadeOut3s {
animation: fadeOut 2.5s ease-in 0.2s 1 normal forwards;
-webkit-animation: fadeOut 2.5s ease-in 0.2s 1 normal forwards;
}

@keyframes fadeOut {
  0% {opacity: 1}
  100% {opacity: 0}
}

@-moz-keyframes fadeOut {
  0% {opacity: 1}
  100% {opacity: 0}
}

@-webkit-keyframes fadeOut {
  0% {opacity: 1}
  100% {opacity: 0}
}

@-o-keyframes fadeOut {
  0% {opacity: 1}
  100% {opacity: 0}
}

@-ms-keyframes fadeOut {
  0% {opacity: 1}
  100% {opacity: 0}
}


/* =============================================================================
   Input(Text) and Textarea
   ========================================================================== */

input[type="text"] { -webkit-appearance: none; border-radius: 0px; border: 1px solid #c0c0c0; color: #444444; }
textarea { -webkit-appearance: none; border-radius: 0px; border: 1px solid #c0c0c0; }

.cmn_input_text { padding-left: 5px; }

/* =============================================================================
   Select
   ========================================================================== */

select { -moz-appearance: none;
         -webkit-appearance: none;
         appearance: none; outline: 0;
         border-radius: 0; border: 0; margin: 0; padding: 0; background: none transparent;
         font-size: 12px; color: #444444; height: 19px; width: 100%; cursor: pointer; }

.cmn_select_div { position: relative; background-color: #ffffff; border: 1px #c0c0c0 solid; overflow: hidden;
                  cursor: pointer; }
.cmn_select_arrowbox { position: absolute; top: 0px; right: 0px; background-color: #ffffff;
                       width: 20px; height: 19px; pointer-events: none; }
.cmn_select_arrow { position: absolute; top: 5px; right: 2px; width: 0px; height: 0px;
                    border-top: 10px #3a7ccb solid; pointer-events: none;
                    border-left: 6px solid  transparent; border-right: 6px solid  transparent; }

/* =============================================================================
   Radio Button AND Check Box
   ========================================================================== */

.cmn_radio { display: none; }
.cmn_radio_label { margin-left: 22px; display: inline-block; position: relative; }
.cmn_radio_label::before{
	position: absolute; content: ""; top: -1px; left: -18px;
	width: 16px; height: 16px; background: #d3d3d3; border-radius: 50%; }
.cmn_radio[type="radio"]:checked + .cmn_radio_label::after {
	position: absolute; content: ""; top: 3px; left: -14px;
	width: 8px; height: 8px;border-radius: 50%; background: #3a7ccb; }

.cmn_checkbox { display: none; }
.cmn_checkbox_label { margin-left: 23px; margin-top: 4px; padding-top: 1px; position: relative; 
                      display: inline-block; height: 19px; white-space: nowrap; }
.cmn_checkbox_label::before{
	position: absolute; content: ""; top: 0px; left: -18px;
	width: 12px; height: 12px; background: #ffffff; border: 2px #d3d3d3 solid; border-radius: 4px; }
.cmn_checkbox[type="checkbox"]:checked + .cmn_checkbox_label::after {
	position: absolute; content: ""; top: 3px; left: -16px;
	width: 10px; height: 6px; border-bottom: 2px #3a7ccb solid; border-left: 2px #3a7ccb solid;
	transform: rotate(-55deg);
	-webkit-transform: rotate(-55deg);
    -ms-transform: rotate(-55deg); }

.cmn_radio_text { margin-bottom: 10px; margin-top: 3px; }

/* =============================================================================
   Original Popup DIV
   ========================================================================== */

.pop_div_outbox { font-size: 12px; background: #ffffff; border: solid 3px #696969; z-index: 99999;
                  color: #444444; border-radius: 5px; position: absolute; }

.pop_div_title { font-size: 14px; font-weight: bold; text-align: center; line-height: 1.75em;
                 color: #433d3c; border-radius: 3px 3px 0px 0px; border-bottom: solid 1px #999; cursor: move;
                 background-color: #89c3eb; }

.pop_div_cont { background-color: #ffffff; width: 100%; position: relative; }
.pop_cont_img { width: 50px; height: 50px; background: 16px 16px no-repeat url(images/mailto.png);
                position: absolute; top: 0px; left: 0px; }
.pop_cont_msg { min-height: 60px; width: 100%; padding: 20px 10px 10px 60px; }
.pop_cont_formbox { width: 100%; padding: 0px 10px 10px 60px; }

.pop_div_btn { background-color: #ffffff; padding: 20px; text-align: center; width: 100%; }

.pop_btn { padding: 3px 10px; background-color: #3a7ccb; color: #ffffff; font-size: 12px;
           display: inline; margin-left: 20px; cursor: pointer; border-radius: 3px; }

/* =============================================================================
   Setting DIV (For future)
   ========================================================================== */

.setdiv_outbox { background-color: #dcdcdc; padding: 10px; border-radius: 9px; border: 2px #ffffff solid;
                 position: absolute; }

.setdiv_title_box { cursor: move; position: relative; width: 100%; background-color: #ffffff;
                    border-radius: 5px; overflow: hidden; border: 5px #ffffff solid; }
.setdiv_title_text { height: 23px; font-size: 16px; color: #3a7ccb; padding: 2px 5px 0px; text-align: center; }
.setdiv_close_btn { position: absolute; right: 0px; top: 0px; width: 23px; height: 23px; cursor: pointer;
                    background: url(../img/close_btn3.png) left top no-repeat; background-color: #3a7ccb; }
.setdiv_title_task { font-size: 12px; color: #444444; padding: 3px 10px; margin-top: 5px; width: 100%;
                     border-top: 1px #dcdcdc solid; text-align: center;
                     overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.setdiv_title_task .span_task { font-size: 14px; }
.setdiv_title_task .span_stask { font-size: 11px; }

.setdiv_cont_box { background-color: #ffffff; width: 100%; border-radius: 5px; position: relative;
                   margin-top: 10px; overflow: hidden; padding: 0px 10px; font-size: 12px; color: #444444; }
.setdiv_cont_toppadding { height: 5px; }
.setdiv_cont_toptitle { width: 100%; color: #3a7ccb; padding: 5px 0px 0px 15px; border-bottom: 1px #dcdcdc solid;
                        position: relative; }
.setdiv_cont_titlemark { position: absolute; width: 0px; height: 0px; top: 6px; left: 2px;
                         border-left: 10px #3a7ccb solid;
                         border-top: 6px solid  transparent;
                         border-bottom: 6px solid  transparent; }

.setdiv_cont_table { width: 100%; }
.setdiv_cmn_td { padding: 5px 3px; vertical-align: middle; }
.setdiv_msg_td { padding: 10px 0px; }
.setdiv_lc_td { text-align: right; }
.setdiv_dp_td { font-size: 16px; }
.setdiv_space_td { height: 10px; }
.setdiv_add_msg { font-size: 11px; }

.setdiv_mask_table { width: 100%; }
.setdiv_mask_td { height: 100px; text-align: center; vertical-align: middle; }
.setdiv_mask_img { margin-right: 10px; }

.setdiv_btn_box { width: 100%; padding: 15px 0px 20px; margin-top: 15px; border-top: 1px #dcdcdc solid; }
.setdiv_cmn_btn { background-color: #3a7ccb; color: #ffffff; padding: 3px 10px; display: inline;
                  border-radius: 3px; margin: 0px 10px; cursor: pointer; }
.setdiv_cmn_btn_s { background-color: #3a7ccb; color: #ffffff; padding: 3px 5px; display: inline;
                    border-radius: 3px; margin: 0px 5px; cursor: pointer; }

.setdiv_cmn_btn_bl { background-color: #3a7ccb; color: #ffffff; padding: 3px 10px; /*display: inline;*/
                     border-radius: 3px; margin: 0px 10px; cursor: pointer; }
.setdiv_cmn_btn_r { background-color: #ff6347; color: #ffffff; padding: 3px 10px; /*display: inline;*/
                    border-radius: 3px; margin: 0px 10px; cursor: pointer; }

.setdiv_cmn_btn_cb { background-color: #00a3a7; color: #ffffff; padding: 3px 10px; /*display: inline;*/
                    border-radius: 3px; margin: 0px 10px; cursor: pointer; }

.setdiv_cmn_btn_gr { background-color: #808080; color: #ffffff; padding: 3px 10px; /*display: inline;*/
                    border-radius: 3px; margin: 0px 10px; cursor: pointer; }

/* =============================================================================
   Search Box
   ========================================================================== */

.srh_tobtn_box { width: 970px; color: #444444; font-size: 14px; margin: 0 auto 0 auto; }
#srh_box_btn { margin-left: 5px; background-color: #3a7ccb; cursor: pointer; color: #ffffff; padding-top: 3px;
               width: 180px; height: 21px; text-align: center; border-radius: 3px;  }

.srh_box { width: 970px; border: 1px #c0c0c0 solid; background-color: #ffffff;
           color: #444444; font-size: 14px; margin: 0 auto 0 auto; }

.srh_table { width: 950px; margin: 10px auto 10px auto; }
.srh_title { margin-bottom: 5px; border-bottom: 1px #c0c0c0 solid; color: #3a7ccb;
             padding-left: 15px; position: relative; }
.srh_title_mark { position: absolute; width: 0px; height: 0px; top: 3px; left: 2px;
                  border-left: 10px #3a7ccb solid;
                  border-top: 6px solid  transparent;
                  border-bottom: 6px solid  transparent;}

.srh_td { padding-left: 15px; vertical-align: middle; height: 30px; font-size: 12px; }
.srh_td_1 { width: 500px; }
.srh_td_2 { width: 300px; }

.shr_order_select_div { width: 200px; }

#srh_btn { font-size: 14px; color: #ffffff; background-color: #3a7ccb; 
           border-radius: 3px; text-align: center; cursor: pointer; padding: 3px 10px 3px 10px;
           margin-top: 20px; width: 150px; margin-left: 750px; }

/* =============================================================================
   New Mission/Template Box
   ========================================================================== */

.mng_type_select_div { width: 150px; }