/* checkbox */
.input-check { display: inline-block; margin-right: 10px; position: relative; }
.input-check.box-type { margin: 6px 0 0 0; }
.input-check.box-type input[type=checkbox] { display: none; }
.input-check.box-type input[type=checkbox] + label { display: flex; align-items: center; justify-content: center; min-width: 80px; padding: 5px 16px; font-size: 1.5rem; color: #666; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; transition: all 0.2s ease; box-sizing: border-box; background: #fff; }
.input-check.box-type input[type=checkbox] + label:before { display: none; }
.input-check.box-type input[type=checkbox]:checked + label { color: var(--blue); border: 1px solid var(--blue); background: #fff; font-weight: 700; }
.input-check.box-type input[type=checkbox]:disabled + label { color: #aaa; border-color: #ddd; background: #f9f9f9; cursor: not-allowed; }
.input-check input[type=checkbox] { display: none; }
.input-check input[type=checkbox] + label { letter-spacing: 0; font-size: 1.6rem; padding-left: 23px; position: relative; }
.input-check input[type=checkbox] + label:before { width: 17px; height: 17px; position: absolute; content: ''; display: block; background: url('../../img/common/check.png') no-repeat; background-size: 17px; top: 2px; left: 0; }
.input-check input[type=checkbox]:checked + label:before { background: url('../../img/common/check.png') no-repeat; background-size: 17px; height: 17px; background-position: 0 -17px; }
.input-check input[type=checkbox]:disabled + label { color: #999; cursor: no-drop; }

/* radio */
.input-radio { display: inline-block; margin-right: 10px; position: relative; }
.input-radio.box-type { margin: 6px 0 0 0; }
.input-radio.box-type input[type=radio] { display: none; }
.input-radio.box-type input[type=radio] + label { display: flex; align-items: center; justify-content: center; min-width: 80px; padding: 5px 16px; font-size: 1.5rem; color: #666; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; transition: all 0.2s ease; box-sizing: border-box; background: #fff; }
.input-radio.box-type input[type=radio] + label:before { display: none; }
.input-radio.box-type input[type=radio]:checked + label { color: var(--blue); border: 1px solid var(--blue); background: #fff; font-weight: 700; }
.input-radio.box-type input[type=radio]:disabled + label { color: #aaa; border-color: #ddd; background: #f9f9f9; cursor: not-allowed; }
.input-radio input[type=radio] { display: none; }
.input-radio input[type=radio] + label { letter-spacing: 0; font-size: 1.6rem; padding-left: 23px; position: relative; }
.input-radio input[type=radio] + label:before { width: 17px; height: 17px; position: absolute; content: ''; display: block; background: url('../../img/common/radio.png') no-repeat; background-size: 17px; top: 2px; left: 0; }
.input-radio input[type=radio]:checked + label:before { background: url('../../img/common/radio.png') no-repeat; background-size: 17px; height: 17px; background-position: 0 -17px; }
.input-radio input[type=radio]:disabled + label { color: #999; cursor: no-drop; }

@media (max-width: 680px) {
	.input-check,
	.input-radio { margin: 1px 10px 1px 1px; }
}
