@charset "utf-8";

/*Font*/
/* @font-face {font-family: 'NotoKR'; font-style: normal; font-weight: 300; src:local(※),  */
/* 	url(../fonts/NotoSansKR-Light.woff2) format('woff2'), url(../fonts/NotoSansKR-Light.woff) format('woff'), url(../fonts/NotoSansKR-Light.otf) format('opentype');} */
/* @font-face {font-family: 'NotoKR'; font-style: normal; font-weight: 400; src:local(※),  */
/* 	url(../fonts/NotoSansKR-Regular.woff2) format('woff2'), url(../fonts/NotoSansKR-Regular.woff) format('woff'), url(../fonts/NotoSansKR-Regular.otf) format('opentype'); }    */
/* @font-face {font-family: 'NotoKR'; font-style: normal; font-weight: 700; src:local(※),  */
/* 	url(../fonts/NotoSansKR-Bold.woff2) format('woff2'), url(../fonts/NotoSansKR-Bold.woff) format('woff'), url(../fonts/NotoSansKR-Bold.otf) format('opentype');}  */
/* @font-face {font-family: 'NotoKR'; font-style: normal; font-weight: 400; src:local(※),  */
/* 	url(../fonts/Roboto-Regular.woff2) format('woff2'), url(../fonts/Roboto-Regular.woff) format('woff'), url(../fonts/Roboto-Regular.otf) format('opentype'); unicode-range: U+0020-007E;}  */
/* @font-face {font-family: 'NotoKR'; font-style: normal; font-weight: 700; src:local(※),  */
/* 	url(../fonts/Roboto-Bold.woff2) format('woff2'), url(../fonts/Roboto-Bold.woff.woff) format('woff'),  url(../fonts/Roboto-Bold.otf.otf) format('opentype'); unicode-range: U+0020-007E;} */

/* *, ::after, ::before{box-sizing: border-box;} */
/* html, body, div, span, applet, object, iframe, */
/* h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, big, cite, code, del,  em, img, small, strong, sub, b, u, i, center, */
/* 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,  */
/* menu, section, summary, time, mark, audio, video */
/*  { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } */
/* /* HTML5 display-role reset for older browsers */ */
/* article, aside, details, figcaption, figure,footer, header, main, nav, section, samp, cite {display: block;} */
/* ul, ol {list-style: none;} */
/* table {width:100%; border-collapse: collapse; border-spacing: 0; table-layout:fixed;} */
/* a{color: inherit; text-decoration: none;} */
/* em{font-style:normal;} */
/* samp{font-family:inherit; font-weight:500;} */
/* button, input[type="button"]{cursor: pointer; border: 0; overflow: hidden; white-space: nowrap; font:inherit;} */
/* button:hover, input[type="button"]:hover{box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.5);} */
/* button:disabled{border:none; box-shadow:none;} */
/* input, select, textarea{-webkit-border-radius: 0; padding:3px 5px; font:inherit; vertical-align:middle; border: 1px solid #c2c2c2;} */
/* input:read-only{cursor:default; background:#eaeaea; outline:none;} */
/* input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-box-shadow: 0 0 0px 1000px white inset !important;} */
/* input[type="search"]{-webkit-appearance: none; border: 1px solid #c2c2c2;} */
/* input[type="radio"]{margin:0;} */
/* hr {clear: both; border: 0; height:1px; border-top: 1px dotted rgba(0, 0, 0, 0.4); margin:9px 0 0;} */

/*Common*/
/* .fl{float:left !important} */
/* .fr{float:right !important} */
/* .al{text-align:left !important;} */
/* .ac{text-align: center !important;} */
/* .clr{clear:both !important;} */
/* .mt20{margin-top:20px !important;} */
/* legend, caption, .hidden{position: absolute; width: 1px; height: 1px; overflow: hidden; margin: -1px; clip: rect(0,0,0,0);} */

/* html{width:100%; height:100%; font-size: 10px;} */
/* body{width:100%; height:100%; background: #FFF; font-family: 'Roboto','NotoKR', sans-serif; font-size: 1.4rem; color: #222; line-height: 1.15;  letter-spacing: -0.02em;} */

/*login */

/*Header */
/* header{display:flex; height:60px; background:#222425;} */

/*Frame*/
/* main{width:100%; display:flex; flex-direction:row; align-items:center;} */

/*ERROR*/	
.error{width:100%; height:auto; background:rgba(0,0,0,0.8); }
.erBox{position:relative; width:400px; height:400px; margin:5% auto; background:#e64e4e; color:#FFF; padding:2.1em 1.8em 3.5rem; border-radius:12%; text-align:center; box-shadow:0px 0px 15px 0px rgba(0,0,0,0.4);}
.erBox::after{content:""; position:absolute; top:170px; left:160px; width:78px; height:78px; background:url('../image/icon_error.png')no-repeat 0 0;  animation:blink 0.9s infinite both;}
.erBox h1{font-size:12rem; margin-bottom:100px; letter-spacing:0.1em; line-height:1.2;}
.erBox h2{margin-bottom:12px; font-weight:400;}
.erBox button{border:1px solid rgba(255,255,255,0.9); color:#FFF; background:transparent; padding:6px 50px; border-radius:30px;}
.erBox button:hover{background:rgba(255,255,255,0.1); box-shadow:inset 0px 0px 3px 2px rgba(255,255,255,0.2);}

/*animation blink*/
@keyframes blink {
  0% {opacity: 1;}
  50% {opacity: 0.2;}
  100% {opacity: 1;}
}