@charset "utf-8";
@import url(font.css);

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, p,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	font:inherit;
	vertical-align:baseline;
	font-family:'Pretendard', 'Noto Sans KR','Apple SD Gothic Neo','맑은 고딕','Malgun Gothic','돋움','Dotum','굴림','Gulim','AppleGothic','Sans-serif';
	font-weight:400;
}

/* HTML5 display-role reset for older browsers */
article,aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
html {font-size:10px; overflow-y:auto; -webkit-box-sizing:border-box; box-sizing:border-box;}
body {line-height:1; font-size:1.6rem; color:#222222;}
address, em, i {font-style:normal;}
p, span, a, h1, h2, h3, h4, h5, h6, ul, li, tr, td, input, select, textarea, button, figure, blockquote {transform:skew(-0.1deg);}
ul, ol, li, dl, dt, dd {margin:0; padding:0; list-style:none;}
blockquote, q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:""; content:none;}
table {border-collapse:collapse; border-spacing:0;}
caption {overflow:hidden; width:1px; height:1px; padding:0; margin-top:-1px; font-size:0; line-height:0; text-indent:-9999px; overflow:hidden; position:static;}
input, select, button, textarea, optgroup {font-family:'Noto Sans KR','Apple SD Gothic Neo','맑은 고딕','Malgun Gothic','돋움','Dotum','굴림','Gulim','AppleGothic','Sans-serif'; margin:0; font-size:inherit; color:inherit;  height:3.8rem; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
input::placeholder, select::placeholder, textarea::placeholder, input::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder, input::-webkit-input-placeholder, select::-webkit-input-placeholder, textarea::-webkit-input-placeholder {font-family:'Noto Sans KR','Apple SD Gothic Neo','맑은 고딕','Malgun Gothic','돋움','Dotum','굴림','Gulim','AppleGothic','Sans-serif'; color:#aaaaaa;}
input {border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; border:1px solid #dedede;}
input[type=submit], input[type=button], input[type=text], input[type=password], input[type=email], input[type=number], textarea, select {box-sizing:content-box;-ms-box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box; box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box; vertical-align:middle; border:1px solid #DBDBDB; border-radius:4px; font-size:1.5rem;}
input:focus, textarea:focus {outline:none;}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=number]:focus, textarea:focus {box-shadow:0 0 0 1px #343434; background-color:#ffffff;}
input[type=submit], input[type=button] {cursor:pointer;}
input[type="checkbox"], input[type="radio"] {vertical-align:middle; width:2.0rem; height:2.0rem; margin:0; opacity:.3; -webkit-appearance:auto;}
input[type="checkbox"]:checked, input[type="radio"]:checked {opacity:1; accent-color:#242424;}
select {text-transform:none; display:block; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; background:url('../images/common/select_arrow.svg') no-repeat calc(100% - 1.2rem) 52%/12px auto; border:1px solid #dedede;}
select:focus {outline:none; box-shadow:0 0 0 1px #343434;}
select::-ms-expand {display:none;}
button {background:none; cursor:pointer; line-height:inherit; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px;}
:before, :after {content:''; display:none;}
p, span {word-wrap:break-word; word-break:keep-all;}
a {color:inherit; text-decoration:none; cursor:pointer;}
strong {font-weight:700;}

/* 스크롤바 설정*/
.scroll::-webkit-scrollbar{width:10px; height:10px;}
/* 스크롤바 막대 설정*/
.scroll::-webkit-scrollbar-thumb{height:20%; background-color: #d0d0d0; border-radius: 10px;}
/* 스크롤바 뒷 배경 설정*/
.scroll::-webkit-scrollbar-track{background-color:#f0f0f0;}

/* button */
.btn {min-width:80px; border: none !important; font-weight: 500; text-align: center;  display: inline-block; box-sizing: border-box; font-size:1.4rem; margin-right:0.6rem;}
.btn:hover {transition: all ease 0.2s 0s;}
.btn-blue {background: #223b8f; color: #ffffff; border: 1px solid #223b8f !important;}
.btn-blue:hover {background: #263565; border: 1px solid #263565 !important;}
.btn-line-blue {color: #223b8f; display: inline-block; border: 1px solid #223b8f !important; background: #ffffff;}
.btn-line-blue:hover {background: #F8FAFD; color: #263565; border: 1px solid #263565 !important; }

.noti-wrap {padding:0 2.0rem; display: flex;  flex-wrap: wrap;  align-items: center; height: 100vh;}
.noti-inner {width:1024px;margin:0 auto;padding: 8rem 0; position: relative;}
.noti-inner .noti-title {margin-bottom:3.0rem; border-bottom:3px solid #111111; padding-bottom:2.6rem;}
.noti-inner .noti-title > span {line-height: 1.2; position:relative; font-size:3.6rem; font-weight: 700;}
.noti-inner .noti-title > span:after {display:block; position:absolute; width:1.0rem; height:1.0rem; border-radius: 150px; background: #fb8218; bottom:3.4rem; right:-1.4rem;}
.noti-inner .noti-cont > p {font-size:1.7rem; line-height: 1.7; margin-bottom:1.3rem;}
.noti-link {margin-top: 2.2rem;}
.noti-link > li {display: flex; align-items: center; margin-bottom:0.8rem;}
.noti-link > li:last-child {margin-bottom:0;}
.noti-link > li a {margin-right:0; text-align: left; line-height: 1.4;font-weight: bold;font-size: 1.6rem;padding: 1.0rem 2.4rem;border-radius: 150px;}
.noti-link > li a:hover {text-decoration: underline;}
.point {font-weight: bold; color:#223b8f;}

/* Kona 서비스종료 안내페이지 스타일 추가 */
.noti-wrap {background: #F1F1F2;}
.noti-inner {width:1024px;margin:0 auto;padding: 6.8rem 7.6rem; position: relative; background: #fff; border-radius: 20px; box-shadow: 0 0 14px rgba(0, 0, 0, 0.05);}
.noti-inner > img {margin-bottom: 2rem;}
.noti-cont > p > a {color: #155CD6; text-decoration: underline; cursor: pointer;}
.ci_kona {position: absolute; top: 6rem; left: 6rem;}
.ci_kona img {height: 32px;}
.noti-cont h4 {font-size: 2rem; line-height: 1.4; font-weight: 700; margin-bottom: 1rem; word-break: keep-all;}

@media (max-width: 1024px){
	.noti-inner {width:calc(100% - 2.0rem);}
}

@media (max-width: 760px){
	html {font-size:9px;}
	.noti-link > li a {width:100%; text-align: center;}
}


/* 신규 안내페이지 추가 250407 */
.ci_kobic {position: absolute; top: 4rem; left: 4rem;}
.ci_kobic img {height: 3.6rem;}
.inform-wrap {display: flex; flex-wrap: wrap; align-items: center; height: 100vh; background: #f2f4f6; padding: 0 2rem;}
.inform-wrap h2 {font-size: 3.6rem; line-height: 1.4; padding: 0 1.8rem 1.8rem; border-bottom: 1px solid #E9E9E9; width: 100%; margin: 1.6rem 0 2.4rem; font-weight: 700; text-align: center;}
.inform-inner {margin: 0 auto; display: flex; flex-direction: column; align-items: center; background: #fff; padding: 4rem 7.6rem 4rem; border-radius: 2rem; box-shadow: 0 0 14px rgba(0, 0, 0, 0.05); margin-bottom: 8rem; max-width: 80rem;}
.inform-inner > img {width: 4.5rem; height: 4.5rem;}
.inform-txt {display: flex; flex-direction: column; align-items: center; color: #222;}
.inform-txt > h4 {font-size: 2.2rem; line-height: 1.4; font-weight: 700; margin-bottom: 1rem; text-align: center; color: #103282; word-break: keep-all;}
.inform-txt > p {font-size: 1.7rem; color: #666; font-weight: 400; text-align: center; line-height: 1.5; margin-bottom: 2rem;}
.inform-txt > p > strong {color: #222; font-weight: 600;}
.link_btn {position: relative; display: flex; align-items: center; padding: 1.8rem 4rem 1.8rem 4rem; background: #fff; color: #222; border: 1px solid #666; font-size: 1.6rem; font-weight: 700; border-radius: 5rem; margin-top: 2rem; width: fit-content; transition: all .2s;}
.link_btn:after {position: absolute; display: none; content: ''; right: 3.2rem; top: calc(50% - 1.6rem); width: 2.8rem; height: 2.8rem; background: url(../images/common/ic_link_btn.svg) no-repeat; background-size: contain; transition: all .2s;}
.link_btn:hover {position: relative; padding: 1.8rem 7.4rem 1.8rem 4rem; background: #284994; border: 1px solid #284994; color: #fff;}
.link_btn:hover:after {display: block;}

@media (max-width: 640px){
    .inform-wrap {background: #fff;}
    .inform-inner {box-shadow: none; padding: 0;}
}
@media (max-height: 760px){
    .inform-inner {margin-bottom: 0;}
}