@charset "UTF-8";

.radio_list_area {}
.radio_list_area .list {}
.radio_list_area .list li {display: inline-block; margin: 0 25px 0 0; vertical-align: middle;}
.radio_list_area .list li:last-child {margin-right: 0;}
.radio_list_area .label_tit {display:inline-block;margin-right:40px;font-weight:700;vertical-align:bottom}
.radio_list_area.s2 {max-height:300px;overflow-y:auto}
.radio_list_area.s2 .list li {display:block;margin:0 0 4px 0}
.radio_list_area.s2 .list li:last-child {margin-bottom:0}

.radio_area {}
.radio_area label {display: block; margin-right: 10px; }
.radio_area label .radio_inp {display: inline-block; position: relative; width: 18px; height: 18px; margin: 0 7px 0 0; border: 1px solid #b4b4b4; padding: 0; background-color: #005399; border-radius: 50%; vertical-align: middle; cursor: pointer;}
.radio_area label .radio_inp:checked {border: 1px solid #005399;}
.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: 8px; height: 8px;}
.radio_area label .text  {display: inline-block; font-weight: 500; vertical-align: middle;}
.radio_area label .radio_inp:checked + .text {color: #005399;}

.chk_list_area {}
.chk_list_area .list {}
.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_area {}
.chk_area label {display: block;}
.chk_area label .inp_chk {display: inline-block; position: relative; width: 18px; height: 18px; margin: 0 3px 0 0; border: 2px solid #c4c4c4; 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 #005399; background-color: #005399;}
.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-position:center;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:1rem; line-height: 28px; color: #2f2f2f; vertical-align: middle;}
.chk_area label.dis_inb {margin-right:15px}
.chk_area label.dis_inb:last-child {margin-right:0}

.chk_area2 {}
.chk_area2 label {display: block;}
.chk_area2 label .inp_chk {display: inline-block; position: relative; width: 18px; height: 18px; margin: 0 3px 0 0; border: 2px solid #c4c4c4; padding: 0; background-color: #ffffff; cursor: pointer; vertical-align: middle; transition: 0.3s ease-in-out;}
.chk_area2 label .inp_chk:checked {border: 2px solid #ffffff;}
.chk_area2 label .inp_chk:before {content: ''; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; background-image: url('/images/home/kor/user/board/chk2.png'); background-size: 12px 9px; background-position: center; background-repeat: no-repeat; -webkit-transform: translate(-50%, -50%) scale(0); -moz-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); -o-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); transition: 0.3s ease-in-out;}
.chk_area2 label .inp_chk:checked:before {transform: translate(-50%, -50%) scale(1);}
.chk_area2 label .text {display: inline-block; font-weight: 400; font-size:1rem; line-height: 28px; color: #2f2f2f; vertical-align: middle;}

.chk_area3 {}
.chk_area3 label {display: block;}
.chk_area3 label .inp_chk {display: inline-block; position: relative; width: 18px; height: 18px; margin: 0 3px 0 0; border: 2px solid #c4c4c4; border-top: none; border-bottom: none; padding: 0; background-color: #ffffff; cursor: pointer; vertical-align: middle;}
.chk_area3 label .inp_chk:checked {border: none;}
.chk_area3 label .inp_chk:before {content: ''; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 2px; background-color: #c4c4c4; transition: 0.3s ease-in-out;}
.chk_area3 label .inp_chk:checked:before {animation: chk_inp 0.3s forwards;}
.chk_area3 label .inp_chk:after {content: ''; position: absolute; bottom: 0; left: 0; right: 0; width: 100%; height: 2px; background-color: #c4c4c4; transition: 0.3s ease-in-out;}
.chk_area3 label .inp_chk:checked:after {animation: chk_inp2 0.3s forwards;}
.chk_area3 label .text {display: inline-block; font-weight: 400; font-size:1rem; line-height: 28px; color: #2f2f2f; vertical-align: middle;}


@keyframes chk_inp {
  0 {
	top: 0; height: 2px;
  }

  10% {
	top: 50%;
  }

  75% {
	top: 50%; width: 40%; background-color: #005399; transform: rotate(45deg);
  }

  100% {
	top: 50%; width: 40%; background-color: #005399; transform: rotate(45deg);
  }

}

@keyframes chk_inp2 {
  0 {
	bottom: 0; height: 2px;
  }

  10% {
	bottom: 50%;
  }

  75% {
	bottom: 50%; width: 70%; background-color: #005399; transform: rotate(-45deg);
  }

  100% {
	bottom: 50%; left: 4px; width: 70%; background-color: #005399; transform: rotate(-45deg);
  }

}