@charset "utf-8";


/* 이용약관 */
.privacy_wrap p {font-size:1rem; line-height: 1.9rem;}
.privacy_wrap a {color:#007bff}
.p-small {font-size: .95rem;margin-top:1rem}
.border_frame {
  border: 1px solid #ddd;
  border-top: 4px solid var(--color-main);
  padding: 2.2em 1.6em;
}
.border_frame p {font-weight: 400;margin: .5rem 0 .3rem;}
.roundbox {
  padding: 2.7em;
  margin: 0.6em;
  background-color: #fafafa;
  border-radius: 25px;
  border: 1px solid #ddd;
}
.roundbox .s1 {
  /* margin-bottom: 1em; */
  font-size: var(--font-size20);
  text-align: center;
  font-weight: 400;
}
.roundbox .s2 {
  line-height: 1.5;
}

.roundbox p.texP.size20 {
  letter-spacing: -1.6px;
}

.rule_wrap {
  padding: 2.6em 1em;
  border-bottom: 1px solid #ddd;
}
.rule_wrap:last-of-type {
  border-bottom: 0;
}
.rule_wrap .rule_title {
  width: 100%;
  padding: 1em 0;
  line-height: 1.42;
  border-bottom: 1px dashed #ddd;
  line-height: 1.7;
}
.rule_wrap .rule_title h3 {font-size:1.3em;}
.rule_wrap .rule_body {
  width: 100%;
  margin-top: 1rem;
}
.rule_list li{
  position: relative;
  text-align: left;
  margin-bottom: 0.3em;
  font-size: 17px;
  font-weight: 400;
  list-style-type: disc;
  padding-inline-start: 1em;
  list-style-position: inside;
  text-indent: -1em;
  }
.rule_list li::marker {
    font-size: 0.9em;
}
.rule_list table {width:97%; margin-left:2em;}
.rule_list table th {width:50%;}
.number > li {list-style-type: decimal;}
.number > li::marker {color:unset;}

.no_marker li {
    list-style-type: none;
    margin-left: 0;
}
.alpha li {list-style-type: upper-alpha;}
.roman li {list-style-type: lower-roman;}
.gray li::marker {color:#ccc;}

/*.rule_list > li::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #ddd;
  border-radius: 100%;
}*/
.bg_c {background-color: #f8f7f7; padding:1em; margin-bottom:1em; margin-top: 0.5em;border-radius:0.6em;}
ul.bg_c {padding-left: 0;}
/*.rule_list.li_2 > li {
  float: left;
  width: 48%;
}*/
ul.bg_c li{
    margin-left: 1em;
}
.end {text-align: center;background-color: #888;color: #fff;width: 100%;padding: 3px;border-radius: 4px;}
.end p {font-size:1.2em; font-weight:500;}
.end p span {/* color: var(--color-main); */}

.m_color h3 {color: var(--color-main);}
.clear::after{content:""; display:block; clear:both;}
.bottom_05 {margin-bottom:0.5em;}
.ml1 li{margin-left:1em;}
.ml2 > li{margin-left:2em;}

.sub_bottom {margin-bottom:6em;}


/* 개인정보 처리방침 */
.privacy_wrap {max-width:780px;margin: 0 auto;padding-bottom: var(--sub_pd);}
.top {background-color: #f8f9fa}
.top-body {
  flex: 1 1 auto;
  padding: 1.25rem;
}
.labeling {margin-top:2rem}
.labeling .tit {background-color: #EAF1F8FF;border-top:2px solid var(--color-main);padding:1rem;text-align: center;margin-bottom: 2rem;}
.label-list {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0 10px;
  font-size: .85em;
  justify-content: space-between;
}
.label-item {width: 15%;text-align: center;padding: 10px;position: relative;}
.label-item img {
    width: 100%;
    padding: 5px;
    border: 1px solid #dee2e6;
}
.item-text {margin-top:10px}
.privacy_index {
    border-bottom: 1px solid #ddd;
    padding-bottom: 2rem;
    margin-top: 4rem;
}
.privacy_index .tit {background-color: #EAF1F8FF;border-top:2px solid var(--color-main);padding:1rem;text-align: center;margin-bottom: 2rem;}
.index-list {display:flex; flex-wrap:wrap; gap:10px}
.index-item {width:48%;font-size: .85em;}
.index-item img {width:30px; height:30px; object-fit:contain; object-position:center}
.index-item a {color:#007bff}
.chapter {
    padding-top: 160px;
    margin-top: -80px;
}
.chapter img {width:36px; height: 36px;}
.chapter h4 {
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: 30px;
}
.chapter h5 {
  margin-top: 30px;
  font-size: 1rem;
  font-weight: 500;
}
.chapter p {
  line-height: 1.9rem;
  letter-spacing: 0;
  margin-bottom: 1rem;
} 
.pri_table {border-bottom: 1px solid #dee2e6;width: 100%;text-align: center;margin-bottom: 1rem;}
.pri_table th, .pri_table td {
  vertical-align: top;
  border-top: 1px solid #dee2e6;
  padding: .3rem;
  font-size: .9rem;
}
.pri_table thead th {
  vertical-align: bottom;
  border-bottom: 2px solid #dee2e6;
  background-color: #f6f6f6;
  font-size:1rem
}

.label-item > div.em {
    text-align: left;
    padding: 10px;
    /* border: 1px solid #ccc; */
    background-color: #ffffff;
    color: var(--color-main);
    border: 1px solid var(--color-main);
    line-height: .8em;
    position: absolute;
    bottom: 50%;
    visibility:
    hidden;
    opacity:0;
    height:
    auto;
    /* display:
    none; */
    transition: all .5s .3s;
    /*
	animation: fadeInUp .3s;
	transition: background 1s ease-out; */
    /*
	transition-duration: 1s;
	transition-timing-function: ease-out;*/
    box-shadow: 1px 1px 10px -8px #ccc;
    z-index:-1;
    border-radius: 1em;
    width: calc(100% + 70%);
    left: 50%;
    word-break: keep-all;
    line-height: 1.2em;
    transform: translateX(-50%);
}
.label-item > div.em:after {
							   content:
							   "";
							   position:
							   absolute;
							   width: 20px;
							   height: 20px;
							   top:-5px;
							   left:50%;
							   margin-left:-5px;
							   background-color: var(--color-point4);
							   transform:
							   rotate(45deg);
							   z-index: -1;
							  }
							  	
.label-item.on > div.em {
	visibility:
	visible;
	opacity:1;
	height:
	auto;
	display:
	block;
	bottom: 100%;
	/*animation: fadeInUp .3s; */
	z-index:1;
	/*transition-duration: 1s;
	transition-timing-function: ease-out;*/
}

.label-item > div.em:before {content: "";width: 10px;height: 10px;display: block;background: #ffffff;bottom: -6px;left: 50%;position: absolute;transform: rotate(45deg);margin-left: -5px;z-index: -2;border: 1px solid var(--color-main);border-top: 0;border-left: 0;}
.label-item > div.em > em{
    font-size: .7em;
    font-style: normal;
    position: relative;
    padding-left: 1em;
    display: inline-block;
    margin-bottom: .5em;
    font-weight: 400;
    line-height: 1.4em;
}
.label-item > div.em > em:after {
	content:
	"";
	position: absolute;
	width: 10px;
	height: 5px;
	background-color: #fff;
	left: 0;
	top: 8px;
	border-radius: 1em;
	}
.label-item > div.em > em:nth-last-child(1){margin-bottom:0;}

@media screen and (max-width: 1000px) {
  .rule_wrap {
    padding: 2em 0;
}
  .border_frame {
    padding: 0.5em;
}  
  .border_frame .roundbox {
    padding: 1em;
}
  .roundbox .s1 {font-size: 1em;}
  .border_frame p, .border_frame li {font-size: 0.9em;}
  .rule_list li {
    /* padding-inline-start: 0; */
}
}