@charset "UTF-8";
/* CSS Document */
/*-------------------------------------------------
	++ FORM INPUT STYLE
-------------------------------------------------*/

label,button {cursor:pointer;margin-top: 1px;margin-right: 5px;margin-left: 5px;}

input[type=text],
input[type=tel],
input[type=email],
input[type=password],
input[type=reset],
input[type=submit],
input[type=button],
textarea,
.selectWrap select,
button {-webkit-appearance: none;box-sizing: border-box;padding:5px;background: #FFF;border:1px solid #d0d0d0;border-radius:5px;outline:none;margin: 1px auto;max-width: 100%;}

@media screen and (max-width:640px) {
input[type=text],
input[type=tel],
input[type=email],
input[type=password],
input[type=reset],
input[type=submit],
input[type=button],
textarea,
.selectWrap select,
button {-webkit-appearance: none;box-sizing: border-box;padding:3vw;background: #FFF;border:1px solid #d0d0d0;border-radius:5px;outline:none;margin: 1px auto;max-width: 100%;}
}

input[type=text]:focus,
input[type=tel]:focus,
input[type=email]:focus,
input[type=password]:focus,
textarea:focus {
	border:1px solid #ffcd44;
	}

label.checkbox {
	display:inline-block;
	margin-right:10px;
}
button{
	border:0;
	background-color:#999;
	color:#FFF;
	padding:10px 20px;
	border-radius:0;
	cursor: pointer;
	height:auto;
	}
button a:link{color:#FFF;text-decoration: none;}
button a:visited{color:#FFF;text-decoration: none;}
input[type=reset],
input[type=submit],
input[type=button]{
	border:0;
	background-color:#999;
	color:#FFF;
	padding:10px 20px;
	border-radius:0;
	cursor: pointer;
	height:auto;
	}
input[type="checkbox"] {
    -webkit-appearance: none;
	outline:none;
    appearance: none;
    position: relative;
    width: 31px;
    height: 31px;
    vertical-align: middle;
    background: url(/images/form/checkbox.png) center center no-repeat;
    margin-right: 10px;
}
input[type="checkbox"]:checked::before {
	content: "";
	position: absolute;
	left: 0px;
	top: 0px;
	width: 31px;
	height: 31px;
	background: url(/images/form/checkbox_checked.png) center center no-repeat; 
}
input[type="checkbox"].colY:checked::before {
	background: url(/images/form/checkbox_checked_yellow.png) center center no-repeat; 
}

label input[type="radio"]{
	filter: alpha(opacity=0); -moz-opacity:0; opacity:0;
	position: absolute;
}
label.radio{
background:url(/images/form/radio_off.png) left center no-repeat;
min-height: 40px;
line-height: 1.3em;
display: inline-block;
padding: 12px 0 0px 45px;
cursor: pointer;
/*overflow: hidden;*/
margin-right: 20px;
}
label.radio.radio_on{
	background:url(/images/form/radio_on.png) left center no-repeat;
}
label.radio.radio[disabled]{
	background: #dedede;
	border-radius: 40px;
	width: 40px;
	height: 40px;
	opacity: 0.8;
	cursor: initial;
	padding-left: 0px;
	min-width: 40px;
}
label.radio.disabled:before{
	content:"";
	width: 30px;
	height: 30px;
	background:#d0d0d0;
	z-index: 1;
	display: block;
	opacity: 0.5;
	position: absolute;
	border-radius: 15px;
	cursor:auto;
}

.selectWrap {
    position: relative;
    display: inline-block;
    border: 1px solid #d0d0d0;
    border-radius: 5px;
    background: #fff;
	max-width: 100%;

}
.selectWrap:hover {
	border:1px solid #ffcd44;
	max-width: 100%;
}

.selectWrap:before {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
	margin-top:-8px;
    display: block;
	width: 12px;
	height: 12px;
	border-top: solid 2px #4d4d4d;
	border-right: solid 2px #4d4d4d;
	transform: rotate(135deg);
}

.selectWrap select {
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    padding: 0.5em 2em 0.5em 0.5em;
    /* width:134px; */
    color: #4d4d4d;
    border: none;
    border-radius: 5px;
    background: transparent;
    min-width: 6em;
}
select::-ms-expand {
  display: none;
}

label.uploadPhoto {
	border:1px solid #d0d0d0;
	padding: 8px 70px;
	border-radius: 20px;
	background:#FFF url(/images/icon/clip.png) left 20px center no-repeat;
	background-size:29px;
}
label.uploadPhoto input {
	display:none;
}


.full {width:100%;}
.fullHalf {width:80%;}
.half {width:50%;}
.quarter {width:25%;}
.quarterHalf {width:15%;}

.flselect {width:68%;}
.iText {height:140px;}

.datepicker {
	display:inline-block;
	width:20%;
	background:url(../../images/icon/calendar.png) left center no-repeat;
	padding-left:35px;
	min-height:30px;
}
.datepicker input {
	width:100%;
}

input.err {border:1px solid #ff0000;}

input:disabled {background:#d0d0d0;}

::-webkit-input-placeholder { color: #CCC; }
:-moz-placeholder { color: #CCC; }

@-moz-document url-prefix() {
	select {
	-moz-appearance: none;
	padding-top:10px;
	height:27px;
	}
}

@media screen and (max-width: 640px) {
	input[type=text],
	input[type=tel],
	input[type=email],
	input[type=password],
	input[type=reset],
	input[type=submit],
	input[type=button],
	textarea,
	select,
	button {
		font-size: 16px;
	}
	label {
		display:inline-block;
		min-width: 9em;
	}
	label.checkbox {
		margin-right:2vw;
	}
	select {
		padding-right:8vw;
	}
	.selectWrap:before {
		right: 3vw;
		margin-top:-2vw;
		width: 3vw;
		height: 3vw;
		border-top: solid 0.5vw #4d4d4d;
		border-right: solid 0.5vw #4d4d4d;
	}
	label.uploadPhoto {
		display:block;
		width:100%;
		background-size:5vw;
		text-align: center;
	}
	.datepicker {
		margin-bottom:3vw;
		width:80%;
		background:url(../../images/icon/calendar.png) left center no-repeat;
		background-size:9vw;
		padding-left:10vw;
		min-height:9vw;
	}
	.datepicker input {
		width:100%;
	}
}


a:hover img,
.link a:hover,
button:hover,
input[type="image"]:hover{
opacity:0.8;
}
.att {font-size:12px;margin:5px 0;display: inline-block;}
.att.err {color:#ff0000;display:block;}
.txt_r {color:#ff0000;}