@charset "UTF-8";

.radio_list_area {}
.radio_list_area .list {font-size: 0;}
.radio_list_area .list li {display: inline-block; margin: 0 15px 0 0; vertical-align: middle;}
.radio_list_area .list li:last-child {margin: 0;}

/* radio style 1 */
.radio_area {font-size: 0;}
.radio_area label {display: block;}
.radio_area label .radio_inp {display: inline-block; position: relative; width: 18px; height: 18px; margin: 0 5px 0 0; border: 1px solid #949494; padding: 0; background-color: #ffffff; border-radius: 50%; vertical-align: middle; cursor: pointer;}
.radio_area label .radio_inp:checked { background-color: inherit;}
.radio_area label .radio_inp:before {display: block; content: ''; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; background-color: #ffffff; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 50%; transition: 0.3s ease-in-out;}
.radio_area label .radio_inp:checked:before {width: 12px; height: 12px; background-color: var(--com-main-color);}
.radio_area label .text {display: inline-block; font-weight: 400; font-size: 16px; line-height: 28px; color: #000000; vertical-align: middle;}
.radio_area label .radio_inp:checked + .text {}
.radio_area label .radio_inp:hover,
.radio_area label .radio_inp:focus {border: 1px solid var(--com-main-color); box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);}

.chk_list_area {}
.chk_list_area .list {font-size: 0;}
.chk_list_area .list li {display: inline-block; margin: 0 15px 0 0; vertical-align: middle;}
.chk_list_area .list li:last-child {margin: 0;}

/* chk style 1 */
.chk_area {font-size: 0;}
.chk_area label {display: block;}
.chk_area label .inp_chk {display: inline-block; position: relative; width: 18px; height: 18px; margin: 0 5px 0 0; border: 1px solid #949494; padding: 0; background-color: #ffffff; cursor: pointer; vertical-align: middle; border-radius: 0; transition: 0.3s ease-in-out;}
.chk_area label .inp_chk:checked {border: 1px solid var(--com-main-color); background-color: var(--com-main-color);}
.chk_area label .inp_chk:before {display: none; content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 8px; background-image: url('/images/home/kor/user/board/chk.png'); background-size: 11px 8px; background-repeat: no-repeat; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 0.3s ease-in-out;}
.chk_area label .inp_chk:checked:before {display: block; width: 11px;}
.chk_area label .text {display: inline-block; font-weight: 400; font-size: 16px; line-height: 28px; color: #000000; vertical-align: middle;}
.chk_area label .inp_chk:hover,
.chk_area label .inp_chk:focus {border: 1px solid var(--com-main-color); box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);}