/********** nomalize **********/
html, body, h1, h2, h3, h4, h5, h6, 
p, div, input, nav, textarea, select, header, section, article, aside, footer, form, button, 
table, thead, tbody, tr, td, th,
ul, li, ol, dl, dt, dd {
	margin: 0; padding: 0;
	box-sizing: border-box;
}

figure{
  margin: 0;
  padding: 0;
}

img {vertical-align: bottom;}

table {border-collapse: collapse;}

ul, ol {list-style: none;}

a {text-decoration: none; color: inherit; display: block;}
a, input, button {outline: 0; color: inherit;}
img {vertical-align: middle; max-width: 100%;}
:focus {outline: none;}
.video_wrap {width: 100%; height: 0; padding-bottom: 56.25%; overflow: hidden; position: relative; margin-bottom: -1px;}
.video_wrap iframe {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
.video_wrap video {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}

table {border: 0; border-spacing: 0; width: 100%;}

select {
  -moz-appearance:none; /* Firefox */
  -webkit-appearance:none; /* Safari and Chrome */
  appearance:none;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url(/img/arrow_down.png) no-repeat center right 15px; /* background-size: 13px; */}
select::-ms-expand {display:none}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
textarea {width: 100%; /* font-family: 'Noto Sans KR', sans-serif; */ font-family: inherit; font-size: inherit; resize: none;}
textarea::placeholder {/* font-family: 'Noto Sans KR', sans-serif; */ font-family: inherit; font-size: inherit; resize: none;}
input {/* font-family: 'Noto Sans KR', sans-serif; */ font-family: inherit; font-size: inherit;}
select {/* font-family: 'Noto Sans KR', sans-serif; */ font-family: inherit; font-size: inherit;}
button {border: 0;}
input, select {color: #111;}

/* �뚯븘媛��� �④낵 */
.circle_ani {position: fixed; top: 50%; right: 15%; transition: all 0.3s; max-width: 20%;}
.circle_ani img {width: auto; animation: rotate 10s linear infinite; transform-origin: 50% 50%; transition: all 0.3s;}

@keyframes rotate {
  100% {transform: rotate(360deg);}
}

/* �꾩븘�� ��吏곸씠�� �④낵 */
#about .about_key .key_img {
	-webkit-animation-name: keyBounce; 
	animation-name: keyBounce; 
	animation-duration: 2.5s; 
	animation-iteration-count: infinite; 
	animation-fill-mode: forwards;}

@keyframes keyBounce {
  0% {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  
  50% {
     -webkit-transform: translate(0, -40px);
    -ms-transform: translate(0, -40px);
    transform: translate(0, -40px);
  }
}

@keyframes keyBounce2 {
  0% {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  
  50% {
     -webkit-transform: translate(0, 40px);
    -ms-transform: translate(0, 40px);
    transform: translate(0, 40px);
  }
}

.dot_p {display: list-item; list-style: none; display: flex;}
.dot_p span {display: contents;}
.dot_p div {display: contents;}
.dot_p::before {content: "쨌"; display: inline; margin-right: 5px;}
.dot_dash {display: list-item; list-style: none; display: flex;}
.dot_dash span {display: contents;}
.dot_dash div {display: contents;}
.dot_dash::before {content: "-"; display: inline; margin-right: 5px;}
.dot_star {display: list-item; list-style: none; display: flex;}
.dot_star span {display: contents;}
.dot_star div {display: contents;}
.dot_star::before {content: "��"; display: inline; margin-right: 5px;}

.slider_btn_wrap {position: relative;}
.slider_btn_wrap .swiper-container {position: static;}

.ellipsis {
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;  
}
.ellipsis.row_2 {
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* �띿뒪�몃� �먮� �� �먰븯�� �⑥쐞 ex) 3以� */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ellipsis.row_3 {
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 3; /* �띿뒪�몃� �먮� �� �먰븯�� �⑥쐞 ex) 3以� */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.img_hover {overflow: hidden;}
.img_hover:hover img {transform: scale(1.03); transition: all 0.5s;}
.overflow_hidden {overflow: hidden;}


/********** 怨듯넻�ы빆 **********/
.clear:after {content: ""; display: block; clear: both;}
/* .img {width: 100%;}
.imgx {max-width: 100%;} */
.pointer {cursor: pointer;}
.upper {text-transform: uppercase;}
.text_center {text-align: center;}
.text_left {text-align: left;}
.text_right {text-align: right;}
/* .br_pc {display: none;}
.br_mo {display: block;} */

.scroll_btn {
  animation-duration: 1s;
  animation-name: scroll;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  text-align: center;
}
@keyframes scroll {
  from {transform: translateY(-20px);}
  to {transform: translateY(0);}
}

.css_flash {
  -webkit-animation-name: flash;
  animation-name: flash;
  animation-duration: 1.8s;
  animation-iteration-count: infinite;
  visibility: visible;    animation-fill-mode: both;
}
@keyframes flash {
  0%, 50%, to {opacity: 1}
  25%,75% {opacity: 0}
}

.css_heartBeat {
  -webkit-animation-name: heartBeat;
  animation-name: heartBeat;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  visibility: visible;animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}
@keyframes heartBeat {
  0%{-webkit-transform:scale(1);transform:scale(1)}
  14%{-webkit-transform:scale(1.1);transform:scale(1.1)}
  28%{-webkit-transform:scale(1);transform:scale(1)}
  42%{-webkit-transform:scale(1.1);transform:scale(1.1)}
  70%{-webkit-transform:scale(1);transform:scale(1)}
}

/*********** 媛쒖씤�뺣낫 �숈쓽 ************/
.clause_wrap .clause_chk.clause_all {padding: 20px 30px;}
.clause_wrap .clause_chk {font-size: 1em; padding-bottom: 15px; transform: rotate(-0.03deg); color: #aaa;}
.clause_wrap .clause_chk label {cursor: pointer;}
.clause_wrap .clause_all {background: #f6f6f6; margin-bottom: 30px;}
.clause_wrap .clause_chk input:checked ~ label {color: #111;}
.clause_wrap .flex_wrap {display: flex; justify-content: space-between; flex-wrap: wrap; padding: 0 30px;}
.clause_wrap .flex_wrap > div {width: 100%;}
.clause_wrap .flex_wrap > div:not(:last-child) {margin-bottom: 20px;}
.clause_wrap .flex_wrap > div pre {resize: none;}
.clause_wrap .flex_wrap .clause_chk {text-align: left;}
.clause_wrap .flex_wrap .clause_chk i {font-size: 18px;}
.clause_wrap .title {font-size: 20px; margin-bottom: 20px;}
.clause_wrap .scroll_wrap {height: 150px; overflow-y: scroll; padding: 20px 35px; width: 100%; background-color: #fff; border: 1px solid #ddd; font-family: 'Noto Sans KR', sans-serif;font-size: 0.9375em; line-height: 150%; color: #111; transform: rotate(-0.03deg); -ms-overflow-style: none; }
.clause_wrap .scroll_wrap::-webkit-scrollbar{ display:none; }

input[type="checkbox"] + label:before, input[type="checkbox"] + label:after, input[type="radio"] + label:before, input[type="radio"] + label:after {
  box-sizing: content-box;
  position: absolute;
  content: '';
  display: block;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

input[type="checkbox"] + label:after {
  background-color: transparent;
  top: 50%;
  left: 6px;
  width: 9px;
  height: 5px;
  margin-top: -5px;
  border-style: solid;
  border-color: #ccc;
  border-width: 0 0 2px 2px;
  transform-origin: 50%;
  -moz-transform: rotate(-45deg) scale(1);
  -ms-transform: rotate(-45deg) scale(1);
  -webkit-transform: rotate(-45deg) scale(1);
  transform: rotate(-45deg) scale(1);
  -moz-transition: none;
  -o-transition: none;
  -webkit-transition: none;
  transition: none;
}

input[type="radio"]:checked + label:before {-moz-animation: borderscale 300ms ease-in;-webkit-animation: borderscale 300ms ease-in; animation: borderscale 300ms ease-in; background-color: #fff;}
input[type="radio"]:checked + label:after {transform: scale(1);}
input[type="radio"] + label:before, input[type="radio"] + label:after {border-radius: 50%;}

input[type="checkbox"]:checked + label:before,
input[type="radio"]:checked + label:before {
  -moz-animation: borderscale 200ms ease-in;
  -webkit-animation: borderscale 200ms ease-in;
  animation: borderscale 200ms ease-in;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  select::-ms-expand {display: none;}
  select:focus::-ms-value {background: transparent; color: grey;}
}

.clause_chk input[type="checkbox"],
.clause_chk input[type="radio"] {
  width: 23px;
  height: 23px;
  opacity: 0;
  z-index: 1;
  clip: initial;
  margin: -1px;
  overflow: hidden;
  padding: 0; 
  position: absolute;
}

.clause_chk  input[type="checkbox"] + label,
.clause_chk  input[type="radio"] + label {
  position: relative;
  padding-left: 30px;
  font-weight: normal;
  display: inline-block;
}
.clause_chk input[type="checkbox"] + label:before,
.clause_chk input[type="radio"] + label:before {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid #ccc;
  text-align: center;
}

.clause_chk input[type="checkbox"]:checked + label::before,
.clause_chk input[type="radio"]:checked + label::before {
  -moz-animation: borderscale 200ms ease-in;
  -webkit-animation: borderscale 200ms ease-in;
  animation: borderscale 200ms ease-in;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid #ccc;
  text-align: center;
}

.clause_chk input[type="checkbox"]:checked + label::before,
.clause_chk input[type="radio"]:checked + label::before {
  border: 1px solid #111;
  background: #111;
}

.clause_chk input[type="checkbox"]:checked + label::after,
.clause_chk input[type="radio"]:checked + label::after {
  content: '';
  border-color: #fff;
  border-width: 0 0 2px 2px;
  -moz-transition: none;
  -o-transition: none;
  -webkit-transition: none;
  transition: none;
  box-sizing: content-box;
  position: absolute;
  display: block;
}

@media screen and (max-width: 540px) {
  .clause_chk input[type="checkbox"],
  .clause_chk input[type="radio"] {
    width: 20px;
    height: 20px;
  }

  .clause_chk  input[type="checkbox"] + label,
  .clause_chk  input[type="radio"] + label {
    padding-left: 27px;
  }

  .clause_chk input[type="checkbox"] + label:before,
  .clause_chk input[type="radio"] + label:before {
    width: 18px;
    height: 18px;
  }

  .clause_chk input[type="checkbox"]:checked + label::before,
  .clause_chk input[type="radio"]:checked + label::before {
    -moz-animation: borderscale 200ms ease-in;
    -webkit-animation: borderscale 200ms ease-in;
    animation: borderscale 200ms ease-in;
    width: 18px;
    height: 18px;
  }

  input[type="checkbox"] + label:after {
    left: 5px;
    width: 8px;
    height: 4px;
    margin-top: -4px;
  }
}

/*********** �ъ슜�� 吏��� ************/
.w10 {width: 10px;}
.w20 {width: 20px;}
.w30 {width: 30px;}
.w40 {width: 40px;}
.w50 {width: 50px;}
.w60 {width: 60px;}
.w70 {width: 70px;}
.w80 {width: 80px;}
.w90 {width: 90px;}
.w100 {width: 100px;}
.w110 {width: 110px;}
.w120 {width: 120px;}
.w130 {width: 130px;}
.w140 {width: 140px;}
.w150 {width: 150px;}
.w160 {width: 160px;}
.w170 {width: 170px;}
.w180 {width: 180px;}
.w190 {width: 190px;}
.w200 {width: 200px;}
.w250 {width: 250px;}
.w300 {width: 300px;}
.w350 {width: 350px;}
.w400 {width: 400px;}
.w450 {width: 450px;}
.w500 {width: 500px;}

.wp10 {width: 10%;}
.wp20 {width: 20%;}
.wp30 {width: 30%;}
.wp40 {width: 40%;}
.wp50 {width: 50%;}
.wp60 {width: 60%;}
.wp70 {width: 70%;}
.wp80 {width: 80%;}
.wp90 {width: 90%;}
.wp100 {width: 100%;}