@charset "utf-8";
/* @import url('nanumgothic.css'); */

body {
  box-sizing: border-box;
  font-family: 'Nanum Gothic', sans-serif;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
body * {
  box-sizing: inherit ;letter-spacing:-0.075em;
}

.wrapper {
  width: 100%;
  margin: auto;
  background: #fff;
  padding: 1em;
  border-radius: 9px;
  border: 1px solid #f5f5f5;
}
.wrapper > :first-child {
  margin-top: 0;
}
.wrapper > :last-child {
  margin-bottom: 0;
}

.desc {
  margin: 1em auto;
  font-size: 1.2em;
}

.todo {
  background: #f9f9f9;
  padding: 1em;
  border-radius: 4px;
  color: #ccc;
  font-weight: lighter;
  font-size: .8em;
  font-family: 'Nanum Gothic';
}
.todo ul {
  margin: .4em 0;
  padding: 0 1em;
}
.todo ul li {
  list-style-position: inside;
}

h1 {
  margin: 0;
}

.emoticon-face {
  background: #FFEB3B;
  border-radius: 100%;
  width: 1.7em;
  height: 1.7em;
  transform: rotate(90deg);
  display: inline-block;
  vertical-align: middle;
  line-heigh: 1;
  margin: -.4em .2em 0;
  text-align: center;
  border: 1px solid #FDD835;
  padding-left: .1em;
  -webkit-font-smoothing: antialiased;
}
.emoticon-face--no-rotation {
  transform: rotate(0deg);
}

code {
  padding: .2em .3em;
  background: #f5f5f5;
  margin: 0 .2em;
  border-radius: 4px;
  font-size: .95em;
  font-family: 'Nanum Gothic';
}

.tac {
  text-align: center;
}

.box {
  margin: 1em auto;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 2em;
  overflow: hidden;
  position: relative;
  color: #333;
  line-height: 1.6;
  font-size: .95em;
  z-index: 2;
  font-family: 'Nanum Gothic';
}
.box *:first-child {
  margin-top: 0;
}
.box *:last-child {
  margin-bottom: 0;
}

.bubble-aprox {
  width: 3em;
  height: 3em;
  top: 0;
  left: 0;
  position: absolute;
  border-radius: 0 0% 100% 0;
}
.bubble-aprox:hover + .bubble, .bubble-aprox:hover + .bubble:before {
  padding: .2em;
  border-radius: 0 0 90% 0;
}

.bubble {
  position: absolute;
  color: #fff;
  height: 2.5em;
  width: 2.5em;
  transform-style: preserve-3d;
  border-radius: 0 0% 100% 0;
  top: 0;
  left: 0;
  z-index: 2;
  transition: 0.4s ease;
}
.bubble:before {
  content: '';
  height: 2.5em;
  width: 2.5em;
  transition: 0.8s ease;
  border-radius: 0 0% 100% 0;
  background: #7CB342;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}
.bubble:hover {
  width: 100%;
  height: 100%;
}
.bubble:hover:before {
  border-radius: 0;
  width: 150%;
  height: 150%;
  transition: 0.8s ease;
}
.bubble:hover .bubble__icon {
  top: -50%;
  left: -50%;
  transition: 0.8s ease;
}
.bubble:hover .bubble__content {
  transition: 0.8s ease;
  top: 50%;
  left: 0;
  z-index: 4;
}

.bubble__icon {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  transition: 0.8s ease;
  padding: .6em .9em;
  line-height: 1;
  font-size: 1em;
}

.bubble__content {
  position: absolute;
  top: -200%;
  transform: translateY(-50%);
  transition: 0.4s ease;
  text-align: center;
  width: 100%;
  color: #fff;
  left: -200%;
  padding: 1.2em;

}
 .question_wrap{
 padding:8px;
 padding-top:2px;
 padding-bottom:2px;
 }

.question{width:100%;border-top:1px solid #bdbdbd;border-bottom:2px solid #bdbdbd;font-family:"NanumGothic",sans-serif;}
.question .qtit{text-align:left; margin:0}
.question tr{border-top:1px solid #cdcdcd;}
.question tr:first-child{border-top:0;}
.question th{background:#f6f6f6; width:30%;text-align:left; padding-left:3%;font-family:"NanumGothic",sans-serif;}
.question td{text-align:left;background:#fff;padding-top:1%!important;padding-bottom:1%!important;color:#5c5c5c;font-size:14px;line-height:26px;padding-left:3%}
.question input[type="text"],
.question select{margin-right:1%;color:#5c5c5c;font-size:14px;font-family:"NanumGothic",sans-serif;background:#f6f6f6;vertical-align:middle;border:1px solid #cdcdcd;padding:1%;}
.question select{padding:0.9%; #bdbdbd ;font-family:"NanumGothic",sans-serif;}
.question textarea{vertical-align:middle;border:1px solid #cdcdcd; width:100%; height:100px;background:#f6f6f6;padding:1%}
.question label{margin-right:1%;}
.question .button{margin-right:1%;line-height:12px;font-size:14px;font-family:"NanumGothic",sans-serif;background:#5e5e5e;;border:1px solid #5e5e5e;padding:1%; cursor:pointer;}
.question .button a{color:#fff;}
.question .add{margin-top:1%;}
.question .wid10{width:10%;}
.question .wid20{width:20%;}
.question .wid30{width:30%;}
.question .wid100{width:100%;}
.btngreen{margin-top:10px; #bdbdbd ;font-family:"NanumGothic",sans-serif;}
.btngreen a{width:100%;margin:0 auto; display:block; padding: 0.2em; font-size:13px ;color:#fff; border:4px solid #ff8a00; border-radius:2em; background:#ff8a00; text-align:center; letter-spacing:0.5px;font-family:"NanumGothic",sans-serif;font-weight:bold;}

.agr-area{text-align:center;}
.agr-area *{font-size:12px;}
.agr-area h3{}
.input-field{margin-right:1%;color:#5c5c5c;line-height:12px;font-size:14px;font-family:"NanumGothic",sans-serif;background:#f6f6f6;vertical-align:middle;border:1px solid #cdcdcd;padding:1%;}
.agr-area .btn_policy2{background:#555;color:#fff;padding:5px 6px;border-radius:3px;}
