@charset "UTF-8";
@import url(/css/landing/pc/fonts.css);

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary { 
    margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	font-weight: 400;
	}

html { height:100% }
body { font-size: 12px; font-family: 'Pretendard','맑은 고딕','Malgun Gothic'; color: #242424; background-color: #ffffff;height:100%;} 

h1, h2, h3, h4, h5, h6 { margin: 0; }
b { font-weight: bold; }
p { margin: 0; }
a { display: inline-block; color: #242424; outline:0; text-decoration:none; }
a:hover, a:link, a:visited, a:focus { outline:0; text-decoration:none; }
ul {list-style: none;}
img,
object,
embed {max-width: 100%;}

/* wrap */
 #wrap{width:100%;background:#fff;}
.header {
  display: flex;                /* 플렉스 컨테이너로 설정 */
  justify-content: space-between; /* 좌우 공간 균등 분배 */
  align-items: center;          /* 세로 가운데 정렬 */
  width: 100%;                  /* 화면 전체폭 */
  padding: 16px;
  box-sizing: border-box;
  border-bottom:1px solid #e6e8e9
}

.header > div {
  flex: 1;                      /* 세 영역이 화면 크기에 맞춰 동일 비율로 늘어남 */
  display: flex;
  align-items: center;
  justify-content: center;      /* 내부 내용도 가운데 정렬 */
}

.header .center img {
  width: 120px;                 /* 로고 크기 */
  height: auto;
  max-width: 100%;
}
 .container{padding:0 24px;text-align:center}

.btn-wrap {
  display: flex;                 /* 가로 배치 */
  justify-content: center;       /* 가운데 정렬 */
  align-items: center;
  gap: 2%;                       /* 버튼 사이 간격 (비율 단위로 반응형) */
  max-width: 1000px;             /* 너무 커지지 않게 제한 */
  margin: 0 auto 20%;            /* 수평 가운데 정렬 */
}

.btn-wrap a {
  flex: 1;                       /* 두 버튼이 같은 비율로 영역 차지 */
}

.btn-wrap img {
  width: 100%;                   /* 부모 a의 너비에 맞춰 자동 확대/축소 */
  height: auto;                  /* 비율 유지하면서 줄어듦 */
  display: block;                /* 하단 여백 제거 */
  object-fit: contain;           /* 비율 유지, 영역 안에 딱 맞춤 */
  transition: transform .1s ease;
}

/*popLayer*/
.mask { display:block; position:fixed; top:0; left:0; width:100%; height:100%; background-color: rgba(0,0,0,0.6); z-index:101;}
#qr_layer {position:fixed; top:0; bottom:0; left:0; right:0; z-index: 10001;}
.qr-wrap {display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; top:0; left:0; width:100%; height:100%;overflow:hidden; box-sizing:border-box; z-index: 102;}
.qr-dialog {margin: 0 auto;color:#646873;width:100%;position: relative;}
.qr-dialog .inbox {margin:0 20px;}
.qr-content { border: none;background:#f1f2f4; overflow: hidden; -webkit-border-radius: 12px; border-radius: 12px;-webkit-box-shadow: 10px 10px 10px 0 rgba(0,0,0,0.3) !important; box-shadow: 10px 10px 10px 0 rgba(0,0,0,0.3) !important; }
.qr-content .pt_top{padding-top:40px;font-size:13px;text-align:center;}
.qr-content .pt_result{font-size:15px;padding-top:60px;text-align:center;color:#222}
.qr-content .pt_result span{color:#08862a}
.qr-content .breif{text-align:center;padding-top:60px;font-size:15px;font-weight:500;color:#222}
.qr-content .breif span{display:block;padding-top:10px;}

.pop-btnWrap{padding:10px 20px 20px}
.pop-btnWrap a{display:block;padding:12px 0;color:#fff;font-size:16px;text-align:center;background-color:#3d6fe7; border-radius: 7px;}

.qr-content .pop_notice span.subTit{color:#222;padding-top:7px;display:block;font-size:14px;}
.qr-content .pop_notice{font-size:16px;padding:40px 30px 0;text-align:center;color:#222}
.qr-content .pop_notice span.mainTit{color:#4348df;font-weight:600}
.qr-content .pop_notice ul.con_detail{color:#222;display:block;font-size:14px;padding:22px 0 32px 0}
.qr-content .pop_notice ul.con_detail li{text-align:left;padding:5px 0 0 0;}
.qr-content .pop_notice ul.con_detail li em{display:inline-block;position: relative;z-index:1;font-size:15px;font-style:normal;color:#4348df;font-weight:600}
.qr-content .pop_notice ul.con_detail li em:after{ content:""; width:calc(100% + 2px); height:7px; position: absolute; bottom:2px; left:-1px; background: #fff89d;z-index:-1000}
.qr-content .pop_notice ul.con_detail li span{position: relative;}
.qr-content .pop_notice ul.con_detail li span:after{content:"";position: absolute;top:9px;left:-5px;background: #222;width:3px;height:3px}
.qr-content .pop_notice span.subTit{color:#222;padding-top:7px;display:block;font-size:14px;}
.qr-content .pop_notice span.subTit em{display:inline-block;position: relative;z-index:1;font-size:15px;font-weight:600;font-style:normal}
.qr-content .pop_notice span.subTit em:after{ content:""; width:calc(100% + 2px); height:7px; position: absolute; bottom:2px; left:-1px; background: #fff89d;z-index:-1000}

.qr-dialog .botPopMnu {position: absolute;z-index: 111;left: 0;right: 0;top: -50px;color:#fff;}
.qr-dialog .botPopMnu li {width: 50%;}
.qr-dialog .botPopMnu li:first-child {float: left; text-align: left;}
.qr-dialog .botPopMnu li:first-child a {display: block;padding-left: 22px;height: 30px;line-height: 30px;font-size: 15px;color: #fff;}
.qr-dialog .botPopMnu li:last-child { float: right;text-align: right;}
.qr-dialog .botPopMnu li:last-child a {display: inline-block;padding: 4px 22px 4px 45px;vertical-align: top;}
.qr-dialog .botPopMnu li:last-child a .but_exit {display:inline-block;width:22px;height:22px;overflow:hidden;word-break:break-all;font-size:1px;line-height:1em;color:transparent;vertical-align:top;background-image:url('/img/mobile/mobile_landing/btn_close_new.png');background-size:22px auto;text-shadow:none !important;}

footer{background:#fafafa;border-top:1px solid #e5e5e5;padding:30px 0;text-align:center;color:#666;margin-top:90px;font-size:13px;line-height:20px;}
footer strong{color:#111}
footer strong:first-child{padding-right:5px;}