@charset "utf-8";

/*-------------------------------------------------------------------------------------------

form_parts.css

-------------------------------------------------------------------------------------------*/

/*---------------------------------------------
reset
---------------------------------------------*/
input, button, textarea, select {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
margin-right:0;
padding: 0;
background-color:var(--white);
border: none;
border-radius: 0;
font-size:1em;
letter-spacing: normal;
line-height:1;
outline: none;
position:relative;
max-width:100%;
vertical-align:middle;
}

select::-ms-expand {
display: none;
}

.input-sm {
height: 30px;
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}

.input-lg {
height: 54px;
padding: 14px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 6px;
}

input[type="text"],
input[type="checkbox"],
textarea,
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="submit"] {
-webkit-appearance: none;
}

input[type="checkbox"] {
border:1px solid var(--gray_cc);
border-radius:3px;
background-color:var(--white);
width:13px;
height:13px;
}
input[type="checkbox"]:checked:after {
content:"\f00c";
font-size:100%;
font-family: var(--icon)
position:absolute;
left:1px;
top:-1px;
color:#8BC34A;
font-style:solid;
}

/*---------------------------------------------
label
---------------------------------------------*/
.label {
display: inline;
padding: .2em .6em .3em;
font-size: 100%;
font-weight: bold;
line-height: 1;
color: var(--white);
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
}

a.label:hover,
a.label:focus { color: var(--white); text-decoration: none; cursor: pointer; }

.label:empty { display: none; }
.label-default { background-color: var(--gray_99); }
.label-default[href]:hover,
.label-default[href]:focus { background-color: #808080; }
.label-primary { background-color: #2fa4e7; }
.label-primary[href]:hover,
.label-primary[href]:focus { background-color: #178acc; }
.label-success { background-color: #73a839; }
.label-success[href]:hover,
.label-success[href]:focus { background-color: #59822c; }
.label-info { background-color: #033c73; }
.label-info[href]:hover,
.label-info[href]:focus { background-color: #022241; }
.label-warning { background-color: #dd5600; }
.label-warning[href]:hover,
.label-warning[href]:focus { background-color: #aa4200; }
.label-danger { background-color: #c71c22; }
.label-danger[href]:hover,
.label-danger[href]:focus { background-color: #9a161a; }

.form-horizontal .control-label {
display: inline-block;
font-size: 100%;
text-align: left;
margin-bottom: 5px;
max-width: 100%;
}

.control-label {
display: inline-block;
max-width: 100%;
margin-bottom: 5px;
font-weight: bold;
}

/*---------------------------------------------
legend
---------------------------------------------*/
legend {
display: block;
width: 100%;
padding: 0;
margin-bottom: 20px;
font-size:161.5%;
line-height: inherit;
color: #555555;
border: 0;
border-bottom: 1px solid #e5e5e5;
text-align:left;
}

/*---------------------------------------------
fieldset
---------------------------------------------*/
fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }

/*---------------------------------------------
form-control
---------------------------------------------*/
.form-control {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
width: 100%;
padding: 8px 12px;
font-size:1em;
line-height: 1.42857143;
color:#555555;
background-color: var(--white);
border: 1px solid var(--gray_cc);
border-radius: 2px;
position:relative;
box-shadow: none;
-webkit-box-shadow: none;
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow:none;
box-shadow:none;
/*-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075),0 0 8px rgba(102, 175, 233, 0.6);*/
/*box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);*/
}

textarea.form-control { height: auto; }
.form-control::-moz-placeholder { color: var(--gray_99); opacity: 1; }
.form-control:-ms-input-placeholder { color: var(--gray_99); }
.form-control::-webkit-input-placeholder { color: var(--gray_99); }
.form-control::-ms-expand { border: 0; background-color: transparent; }
.form-control[disabled],
fieldset[disabled] .form-control { background-color: var(--gray_ee); opacity: 1; }
.form-control[disabled],
fieldset[disabled] .form-control { cursor: not-allowed; }
textarea.form-control { height: auto; }

.form-control.sm { padding:4px 12px; }

/*---------------------------------------------
form-group
---------------------------------------------*/
.form-group {
margin-bottom: 15px;
text-align:left;
position: relative;
min-height: 1px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

.form-horizontal .form-group:after { content:" "; clear: both; display:block; }
.form-group-sm .form-control { height: 30px; padding: 5px 10px; font-size: 93%; line-height: 1.5; border-radius: 3px; }
.form-group-sm select.form-control { height: 30px; line-height: 30px; }
.form-group-sm textarea.form-control,
.form-group-sm select[multiple].form-control { height: auto; }
.form-group-sm .form-control-static { height: 30px; min-height: 32px; padding: 6px 10px; font-size: 93%; line-height: 1.5; }

.form-group-lg .form-control { height: 54px; padding: 14px 16px; font-size: 138.5%; line-height: 1.3333333; border-radius: 6px; }
.form-group-lg select.form-control { height: 54px; line-height: 54px; }
.form-group-lg textarea.form-control,
.form-group-lg select[multiple].form-control { height: auto; }
.form-group-lg .form-control-static { height: 54px; min-height: 38px; padding: 15px 16px; font-size:138.5%; line-height: 1.3333333; }

.form-group .checkbox label { display:inline-block; margin-right:10px; margin-bottom:5px; }

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label { color: #e6742b; }
.has-warning .form-control { border-color: #e6742b; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.has-warning .form-control:focus { border-color: #e6742b; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ebb696; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ebb696; }

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label { color: #b94a48; }
.has-error .form-control { border-color: #b94a48; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.has-error .form-control:focus { border-color: #b94a48; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #eb9896; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #eb9896; }

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label { color: #468847; }
.has-success .form-control { border-color: #468847; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
.has-success .form-control:focus { border-color: #356635; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #7aba7b; }

/*---------------------------------------------
input-group
---------------------------------------------*/
.input-group { text-align:left; overflow:hidden; letter-spacing:-.40em; }
.input-group div { display:inline-block; letter-spacing:normal; vertical-align:top;  }
.input-group input { border-radius:4px 0 0 4px; }
.input-group span { border-radius:0 4px 4px 0; display:inline-block; letter-spacing:normal; vertical-align:top; width:50px; }
.input-group span button { border-radius:0 4px 4px 0; padding:11px 12px 10px; line-height:1; text-align:center; width:100%; }
.input-group span i { text-align:center; margin:0 auto; display:inline-block; line-height:1; }

/*---------------------------------------------
select
---------------------------------------------*/
select {
position:relative;
max-width:100%;
outline:none;
text-overflow: '';
background: none transparent;
vertical-align: middle;
font-size: inherit;
color: inherit;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin:0 !important;
padding:0;
}

select:hover { cursor:pointer; background-color:var(--white) !important; }

.select { position:relative; }
.select:after {
position: absolute;
top: 50%;
right: 10px;
margin-top: -7px;
content: '\f107';
color: var(--gray_99);
font-size:85%;
font-family: var(--icon)
}

.select_box {
font-size: 100%;
padding: 3px 25px 3px 5px;
border: 1px solid var(--gray_dd);
border-radius: 4px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-overflow: "";
background-color:var(--white);
margin: 0;
overflow-x: hidden;
position:relative;
}

/*---------------------------------------------
checkbox
---------------------------------------------*/
.checkbox01-input {
display: none;
}
.checkbox01-parts {
padding-left: 18px;
position:relative;
font-size:93%;
display:inline-block;
text-align:left;
}
.checkbox01-parts::before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-top:-6px;
width: 10px;
height: 10px;
border: 1px solid var(--gray_99);
border-radius: 1px;
}
.checkbox01-parts.left::before { left: 0; }

.checkbox01-input:checked + .checkbox01-parts { color:#333; }
.checkbox01-input:checked + .checkbox01-parts::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-top:-9px;
margin-left:3px;
width: 6px;
height: 10px;
transform: rotate(40deg);
-webkit-transform: rotate(40deg);
-moz-transform: rotate(40deg);
border-bottom: 3px solid #3498db;
border-right: 3px solid #3498db;
}

.checkbox01-input:checked + .checkbox01-parts.left::after { left: 0; }

/*---------------------------------------------
textarea
---------------------------------------------*/
textarea { background-color:var(--white); border:1px solid var(--gray_cc); padding:5px; max-width:100%; }
textarea:disabled { background-color:#f0f0f0; border:1px solid var(--gray_99); }

/*---------------------------------------------
text
---------------------------------------------*/
input[type="text"][disabled] { background-color:#f0f0f0; border:1px solid var(--gray_99); }

/*---------------------------------------------
radio
---------------------------------------------*/
.radio-input {
 display: none;
}

.radio-parts {
 padding-left: 24px;
 position:relative;
 margin-right:0;
 vertical-align:middle;
 line-height:1.6;
 display:inline-block;
}

.radio-parts::before{
 background-color:var(--white);
 content: " ";
 display: block;
 position: absolute;
 top: 50%;
 left: 12px; 
 width:18px;
 height:18px;
 border: 1px solid var(--gray_cc);
 border-radius: 50%;
 margin-top:-9px;
}

.radio-input:checked + .radio-parts {
 background-color:var(--light-yellow);
 font-weight:600;
}

.radio-input:checked + .radio-parts::after {
 content: " ";
 display: block;
 position: absolute;
 top: 50%;
 left: 15px;
 width: 12px;
 height: 12px;
 background-color: var(--blue);
 border-radius: 50%;
 margin-top:-6px;
}
