@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: 20px; height: 20px; margin: 0 5px 0 0; border: 2px 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: 10px; height: 10px; background-color: #0277c5;}
.radio_area label .text  {display: inline-block; font-weight: 500; font-size: 16px; line-height: 28px; color: #333333; vertical-align: middle;}
.radio_area label .radio_inp:checked + .text {}

.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: 20px; height: 20px; margin: 0 5px 0 0; border: 2px solid #949494; padding: 0; background-color: #ffffff; cursor: pointer; vertical-align: middle; transition: 0.3s ease-in-out;}
.chk_area label .inp_chk:checked {border: 2px 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: 9px; background-image: url('/images/home/kor/user/board/chk.png'); background-size: 12px 9px; 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: 12px;}
.chk_area label .text {display: inline-block; font-weight: 400; font-size: 16px; line-height: 28px; color: #333333; vertical-align: middle;}