@charset "utf-8";
@import url("/font/NanumSquareNeo.css");
@import url("/font/titillium_web.css");
@import url("/font/remixicon.css");


*{margin:0px; padding:0px; font-family:"NanumSquareNeo", "Malgun Gothic","맑은고딕",dotum,tahoma,verdana,sans-serif; color:#333;}

/* 기존 스타일 (404, 500 외 다른 error 페이지) */
.topLogo {margin:20px}
.errorWrap {background:url('/error/img/icon_error.gif') no-repeat center top; padding:130px 25px 35px; margin:150px auto 0; text-align:center; width:530px;  position:relative; overflow:hidden}
.topText {color:#333; font-size:25px; font-weight:normal; display:block; padding:0 0 30px; letter-spacing:-1px; line-height:1.3;}
.topText strong {display:block; font-size:60px}
.top_tt02 strong {display:block; font-size:35px !important; margin-bottom:10px}
.conText {border-top:1px solid #e0e0e0; padding:30px 0 40px; text-align:center; font-size:14px; color:#666; line-height:22px; letter-spacing:-1px}
.btnBox {text-align:center}
.bottom {width:650px; height:10px; margin:0 auto; background-position: 0 -350px;}


/* cosmo 스타일 (404, 500에 적용) */
.errorWrap.cosmo {display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100vh; margin:0; padding:0 20px; box-sizing:border-box; background:none; word-break:keep-all;}
.errorWrap.cosmo .character {margin-bottom:40px;}
.errorWrap.cosmo .character img {max-width:100%;}
.errorWrap.cosmo .big {margin-bottom:24px; font-size:30px; font-weight:700;}
.errorWrap.cosmo .txt {margin-bottom:40px; font-size:16px; word-break:keep-all; width:440px; color:#555; line-height:1.3; text-align:center;}
.errorWrap.cosmo .btn_box { display: flex; flex-direction: row; justify-content: center; align-items: center; gap:16px; }
.errorWrap.cosmo .btn_box .btn { display: flex; flex-direction: row; justify-content:center; align-items: center; width:200px; height:60px; padding:5px 10px; border: 1px solid #999; background: #fff; font-size:15px; font-weight: 600; border-radius:4px; transition: 0.3s; position: relative; box-sizing: border-box; text-decoration:none; transition:0.3s;}
.errorWrap.cosmo .btn_box .btn::after { content:"\ea6e";font-family: "remixicon"; margin-left: auto;}


@media screen and (min-width:1025px) {
	.errorWrap.cosmo .btn_box .btn:hover {background:#1B2539; color:#fff;}
}

@media screen and (max-width:1440px) {
}

@media screen and (max-width:1024px) {
	.errorWrap.cosmo .big {font-size:24px;}
	.errorWrap.cosmo .txt {font-size:14px;}
	.errorWrap.cosmo .btn_box .btn {width:130px; height:50px;}
}

@media screen and (max-width:480px) {
	.errorWrap.cosmo .big {font-size:22px;}
	.errorWrap.cosmo .txt {width:100%; padding:0 20px; box-sizing:border-box;}
	.errorWrap.cosmo .btn_box .btn {width:130px;}
}