/***********************************************************
 * input
 ***********************************************************/
 :root {
    --shadow-shape:3px 3px 5px #888888;

    --input-pading: 5px 5px 5px 5px;
    --input-background: #ffffff;
    --input-underline-none:2px solid #d6d6d6;
    --input-underline-focus:2px solid #000000;
}
.igInputShadow {
    border:0;
    padding: var(--input-pading);
    background: var(--input-background);
}
.igInputShadow:focus {
     border:0; outline: none;
     box-shadow: var(--shadow-shape);
}

.igInputLine {
    outline: none;
    padding: var(--input-pading);
    background: var(--input-background);
    border:0; border-bottom: var(--input-underline-none);
}.igInputLine:focus {
    border:0; border-bottom: var(--input-underline-focus);
 }

/***********************************************************
 * select
 ***********************************************************/

:root {
    --select-underline-none: 2px solid #d6d6d6;
    --select-underline-focus: 2px solid #055783;
}

.igSelect{
    outline: none;
    border:0; border-bottom: var(--select-underline-none);
    padding: 4px 10px 4px 10px;
    background: var(--input-background);
}
.igSelect:focus {
    border:0;  border-bottom: var(--select-underline-focus);
}

.igSelectNoDeco{
    outline: none;
    border:0;
    padding: 4px 10px 4px 10px;
    background: var(--input-background);
}

/***********************************************************
 * textArea
 ***********************************************************/
.igTextArea {
	outline: none; border:var(--input-underline-none); resize: none;
}

.igTextArea:focus {
     border: var(--input-underline-focus);
}

/***********************************************************
 * checkBox
 ***********************************************************/
:root {
    --check-size:15px;
	--checkNormalColor : #d1d3d1;
	--checkSelectColor : #ffa500;
}

/* 
:root {
    --check-color:#0d65ff;
}
.checkBox{
    width:var(--check-size); height:var(--check-size);
    margin-right: 5px; accent-color: var(--check-color);
    vertical-align: bottom; cursor: pointer;
}
*/

/* 커스텀 체크박스 */
/* appearance: none; 기본(네이티브) 모양을 제거  */
.igCheckBox{
    /*outline: none; */
	appearance: none; cursor: pointer;
    background-color: var(--checkNormalColor);
    width: var(--check-size); height: var(--check-size);
	vertical-align:bottom;
}
.igCheckBox:checked {
     background-color: var(--checkSelectColor);
 } 

.igCheckLabel{cursor: pointer;}

/***********************************************************
 * radio
 ***********************************************************/

:root{
	--radioSize : 15px;
	--radioRadius : 15px;
	--radioNormalColor : #d1d3d1;
	--radioSelectColor : #ffa500;
}

.igRadio {
	/*outline: none; */
	appearance: none; cursor: pointer;
	width: var(--radioSize); height: var(--radioSize); border-radius: var(--radioRadius);
	background-color: var(--radioNormalColor);
}

.igRadio:checked  {
	background-color: var(--radioSelectColor);
}

.igRadioLabel{cursor: pointer;}

/***********************************************************
 * button
 ***********************************************************/
 :root {
    --button-padding: 2pt 20pt 3pt 20pt;
    --button-font-size: 11pt;
    --button-radius: 20pt;
    --button-confirm-shadow:2px 2px 4px #616161;
    --button-confirm-color: #073b70;
    --button-cancel-shadow:2px 2px 4px #616161;
    --button-cancel-color:#d5d5d5;
    --button-del-color: #9a0505;
}
.igBtnConfirm {
    border: 0; padding: var(--button-padding);
    font-size: var(--button-font-size);
    background:var(--button-confirm-color); color:white;
    cursor: pointer;
    border-radius: var(--button-radius);
    box-shadow: var(--button-confirm-shadow);
}

.igBtnConfirmNoShadow {
    border: 0; padding: var(--button-padding);
    font-size: var(--button-font-size);
    background:var(--button-confirm-color); color:white;
    cursor: pointer;
    border-radius: var(--button-radius);
}

.igBtnConfirmNoShadowEx {
    border: 0; padding: var(--button-padding);
    background:var(--button-confirm-color); color:white;
    cursor: pointer;
    border-radius: var(--button-radius);
}

.igBtnCancel{
    border: 0; padding: var(--button-padding);
    font-size: var(--button-font-size);
    background:var(--button-cancel-color); color:rgb(0, 0, 0) ;
    cursor: pointer;
    border-radius: var(--button-radius);
    box-shadow: var(--button-cancel-shadow);
}

.igBtnDel{
    border: 0; padding: var(--button-padding);
    font-size: var(--button-font-size);
    background:var(--button-del-color); color: rgb(255, 255, 255);
    cursor: pointer;
    border-radius: var(--button-radius);
    box-shadow: var(--button-cancel-shadow);
}

.igBtnCancelNoShadow{
    border: 0; padding: var(--button-padding);
    font-size: var(--button-font-size);
    background:var(--button-cancel-color); color:rgb(0, 0, 0) ;
    cursor: pointer;
    border-radius: var(--button-radius);
}

.shadow {
    border:0; outline: none;
    box-shadow: var(--shadow-shape);
}

.shadowText { text-shadow:  3px 3px 5px rgba(145, 145, 145, 0.65);}
/***********************************************************
 * etc
 ***********************************************************/
input::placeholder {
    color: #7e7e7e;
    /*font-size: 0.8em;*/
    font-size: 15px;
}

.hand{cursor:pointer;}